:root {
  --vo-green: #4d8f39;
  --vo-green-dark: #356828;
  --vo-bg: #f6fff2;
  --vo-card: rgba(255,255,255,0.9);
  --vo-shadow: 0 16px 36px rgba(38, 74, 25, 0.12);
  --vo-radius: 24px;
}
body { background: linear-gradient(180deg,#f7fff3 0%,#eef8e8 100%); }
.vo-container { max-width:1180px; margin:0 auto; padding:18px 16px 96px; }
.vo-topbar { position:sticky; top:12px; z-index:40; margin-bottom:18px; }
.vo-topbar-inner { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:14px 18px; border-radius:999px; background:rgba(255,255,255,0.78); border:1px solid rgba(215,235,207,.95); backdrop-filter:blur(12px); box-shadow:var(--vo-shadow); }
.vo-brand { display:flex; align-items:center; gap:12px; }
.vo-brand img { width:56px; height:56px; object-fit:contain; border-radius:16px; background:rgba(255,255,255,.8); padding:4px; }
.vo-brand-title { font-size:20px; font-weight:800; line-height:1.05; color:#224718; }
.vo-brand-sub { font-size:12px; color:#5e7a55; }
.vo-nav { display:flex; gap:10px; flex-wrap:wrap; }
.vo-nav-link, .vo-bottom-link { text-decoration:none; color:#305a24; font-weight:700; padding:10px 14px; border-radius:999px; }
.vo-nav-link:hover, .vo-bottom-link:hover { background:#e6f4de; }
.vo-hero { position:relative; border-radius:32px; overflow:hidden; min-height:320px; box-shadow:var(--vo-shadow); margin-bottom:22px; }
.vo-hero::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(255,255,255,.95), rgba(255,255,255,.62) 55%, rgba(255,255,255,.15)); }
.vo-hero-content { position:relative; z-index:1; display:grid; grid-template-columns:1.1fr .9fr; gap:24px; padding:32px; align-items:center; }
.vo-hero h1 { font-size:48px; line-height:1.05; margin:0 0 14px; color:#214517; }
.vo-lead { font-size:18px; max-width:720px; color:#36562c; }
.vo-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:20px; }
.vo-button { display:inline-flex; align-items:center; justify-content:center; background:var(--vo-green); color:#fff; padding:12px 18px; border-radius:999px; text-decoration:none; font-weight:700; border:none; cursor:pointer; }
.vo-button.alt { background:#fff; color:#315b25; border:1px solid #d8ebcf; }
.vo-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:18px; margin:18px 0; }
.vo-card,.vo-item,.vo-calendar-month,.vo-panel { background:var(--vo-card); border:1px solid #d8ebcf; border-radius:var(--vo-radius); padding:18px; box-shadow:var(--vo-shadow); }
.vo-section { margin:28px 0; }
.vo-section-head { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:10px; }
.vo-section h2 { margin:0; font-size:30px; color:#234619; }
.vo-chip { display:inline-block; padding:8px 12px; border-radius:999px; background:#ebf7e5; color:#39652c; font-size:13px; font-weight:700; }
.vo-calendar { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:16px; }
.vo-calendar-month ul,.vo-card ul { margin:0; padding-left:18px; }
.vo-bottom-nav { position:fixed; left:50%; transform:translateX(-50%); bottom:14px; z-index:60; width:min(720px, calc(100% - 20px)); background:rgba(255,255,255,.82); border:1px solid #d8ebcf; border-radius:999px; box-shadow:var(--vo-shadow); padding:10px; }
.vo-bottom-nav-inner { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; text-align:center; }
.vo-filterbar { display:flex; gap:12px; flex-wrap:wrap; margin:16px 0 22px; }
.vo-filterbar input,.vo-filterbar select,.vo-note-box textarea { width:100%; padding:12px 14px; border-radius:16px; border:1px solid #d8ebcf; background:rgba(255,255,255,.92); }
.vo-filterbar > div { flex:1 1 220px; }
.vo-favorite-btn { display:inline-flex; align-items:center; gap:8px; border:none; border-radius:999px; padding:10px 14px; cursor:pointer; background:#eef8e8; color:#315b25; font-weight:700; }
.vo-favorite-btn.is-active { background:#ffeaa7; color:#7a5d00; }
.vo-note-box textarea { min-height:120px; resize:vertical; }
.vo-mini-muted { color:#67825f; font-size:13px; }
.vo-meta { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:12px; margin:20px 0; }
.vo-meta div { background:#fff; border:1px solid #e3efdc; border-radius:14px; padding:12px; }
.vo-admin-wrap { max-width:980px; }
.vo-admin-panel { background:#fff; border:1px solid #dcdcde; border-radius:16px; padding:24px; margin-top:20px; box-shadow:0 8px 24px rgba(0,0,0,.04); }
.vo-admin-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.vo-admin-note { background:#f0f9eb; border-left:4px solid #4d8f39; padding:12px 14px; border-radius:10px; }
@media (max-width:760px) {
  .vo-nav { display:none; }
  .vo-grid,.vo-calendar,.vo-bottom-nav-inner,.vo-admin-grid { grid-template-columns:1fr; }
  .vo-hero-content { grid-template-columns:1fr; padding:20px; }
  .vo-hero h1 { font-size:34px; }
}