
:root{
  --primary:#27475E;
  --primary-light:#346585;
  --accent:#e535b2;
  --topbar-bg:#c9e265;
  --topbar-bg-dark:#b6cf52;
  --bg:#FAF7F2;
  --card:#FFFFFF;
  --text:#22221F;
  --muted:#6B6B63;
  --border:#E7E1D6;
  --radius:14px;
  --shadow:0 2px 10px rgba(30,60,90,0.1);
  --font: 'Open Sans', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-spartan: 'League Spartan', 'Segoe UI', sans-serif;
  --font-montserrat: 'Montserrat', 'Segoe UI', sans-serif;
  --font-opensans: 'Open Sans', 'Segoe UI', sans-serif;
  --font-playfair: 'Playfair Display', Georgia, serif;
  --font-script: 'Dancing Script', cursive;
  --sidebar-w: 297px;
  --topbar-h: 92px;
}
*{box-sizing:border-box;}
body{margin:0;font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.55;}
a{color:inherit;text-decoration:none;}
.placeholder-banner{
  background:#FFF4E8;border-bottom:1px solid #F0D9BE;color:#7A4A1E;
  font-size:16px;text-align:center;padding:7px 16px;
}
.app-shell{display:flex;min-height:100vh;align-items:stretch;}

/* SIDEBAR */
.sidebar{
  width:var(--sidebar-w);flex-shrink:0;background:var(--primary);color:#fff;
  position:sticky;top:0;align-self:stretch;padding-bottom:30px;
}
.sidebar > nav{position:sticky;top:0;max-height:100vh;overflow-y:auto;padding-bottom:14px;}
.sidebar-brand{
  display:flex;align-items:center;gap:10px;padding:22px 22px 18px;
  font-weight:800;font-size:19.5px;letter-spacing:0.3px;
  border-bottom:1px solid rgba(255,255,255,0.12);
}
.sidebar-brand .logo-mark{
  width:32px;height:32px;border-radius:9px;background:var(--accent);
  display:flex;align-items:center;justify-content:center;font-size:17.5px;font-weight:800;
}
.sidebar nav{padding-top:10px;}
.sidebar a.nav-item{
  display:flex;align-items:center;gap:10px;padding:10px 22px;
  color:rgba(255,255,255,0.82);font-size:16.6px;font-weight:500;
}
.sidebar a.nav-item .ic{font-size:19px;width:18px;text-align:center;}
.sidebar a.nav-item:hover{background:rgba(255,255,255,0.08);}
.sidebar a.nav-item.active{background:rgba(255,255,255,0.14);color:#fff;font-weight:700;box-shadow:inset 3px 0 0 var(--accent);}
.sidebar .subnav{padding-left:0;margin-bottom:4px;}
.sidebar .subnav a{
  display:block;padding:6px 22px 6px 50px;font-size:15.5px;color:rgba(255,255,255,0.62);
}
.sidebar .subnav a:hover{color:#fff;}
.sidebar .subnav a.active{color:#fff;font-weight:700;}

/* CONTENT */
.content-area{flex:1;min-width:0;display:flex;flex-direction:column;}
.top-tabs{
  background:#fff;border-bottom:1px solid var(--border);padding:0 32px;
  display:flex;gap:4px;position:sticky;top:0;z-index:10;
}
.top-tabs a{
  padding:16px 16px;font-size:17.5px;font-weight:600;color:var(--muted);
  border-bottom:3px solid transparent;
}
.top-tabs a.active{color:var(--primary);border-bottom-color:var(--accent);}
.top-tabs a:hover{color:var(--primary);}
main{max-width:880px;margin:0 auto;padding:32px 28px 90px;width:100%;}

.page-title{font-family:var(--font-spartan);font-size:36.3px;font-weight:700;color:var(--primary);margin:0 0 6px;}
.page-subtitle{font-family:var(--font-montserrat);font-weight:600;color:var(--muted);font-size:19px;margin:0 0 28px;}

/* HOME / DASHBOARD */
.week-pills{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px;}
.week-pill{
  padding:8px 14px;border-radius:20px;font-size:16px;font-weight:600;
  background:#F0F1EA;color:var(--muted);border:1px solid var(--border);cursor:pointer;
}
.week-pill.active{background:var(--primary);color:#fff;border-color:var(--primary);}
.week-pill:hover:not(.active){background:#E4E6DB;}

.current-week-card{
  background:linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);
  color:#fff;border-radius:20px;padding:32px 32px;box-shadow:var(--shadow);margin-bottom:26px;
}
.current-week-card .tag{
  display:inline-flex;align-items:center;gap:7px;background:var(--accent);font-family:var(--font-montserrat);font-size:16px;font-weight:700;
  letter-spacing:1px;text-transform:uppercase;padding:6px 14px;border-radius:20px;margin-bottom:12px;
}
.current-week-card .tag .tag-ic{width:14px;height:14px;flex-shrink:0;}
.current-week-card h2{font-family:var(--font-spartan);margin:0 0 6px;font-size:37.4px;font-weight:700;line-height:1.05;}
@media (max-width:640px){.current-week-card h2{font-size:34.5px;}}
.current-week-card .date{font-family:var(--font-montserrat);font-weight:600;opacity:0.85;font-size:17.5px;margin-bottom:20px;}

.teaser-row{display:flex;align-items:center;gap:16px;margin:22px 0 24px;}
.teaser-icon{
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  width:48px;height:48px;border-radius:14px;background:var(--accent);color:#fff;
}
.teaser-icon svg{width:24px;height:24px;}
.teaser-text{flex:1;}
.teaser-focus{font-family:var(--font-montserrat);font-size:20px;font-weight:500;margin-bottom:4px;}
.teaser-meta{font-size:17px;opacity:0.8;}
.cwc-cta{
  display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--primary);
  font-size:18px;font-weight:700;padding:12px 20px;border-radius:12px;text-decoration:none;
  transition:background 0.15s ease, transform 0.1s ease;
}
.cwc-cta:hover{background:#F3F0E9;}
.cwc-cta .cta-chev{width:15px;height:15px;flex-shrink:0;}

.cwc-col{margin-bottom:26px;}
.cwc-col:last-child{margin-bottom:0;}
.cwc-panel-title{
  display:flex;align-items:center;gap:9px;margin:0 0 14px;font-family:var(--font-montserrat);font-size:19.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:0.8px;opacity:0.95;
}
.cwc-panel-title svg{width:19px;height:19px;flex-shrink:0;color:var(--accent);}
.cwc-panel-title svg.icon-lg{width:28px;height:28px;}
.cwc-panel-title svg.title-blue{color:#6FA8CC;}
.cwc-empty{font-size:17px;opacity:0.85;margin:0 0 10px;}

.cwc-locked{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  gap:14px;padding:36px 20px;background:rgba(255,255,255,0.06);border-radius:14px;
}
.cwc-locked-icon{
  display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,0.14);color:var(--accent);
}
.cwc-locked-icon svg{width:20px;height:20px;}
.cwc-locked-text{margin:0;font-size:18px;font-weight:600;opacity:0.9;max-width:340px;}

.resource-row{
  display:flex;align-items:center;gap:10px;font-size:17.5px;font-weight:600;color:#fff;
  background:rgba(255,255,255,0.1);padding:10px 12px;border-radius:10px;margin-bottom:10px;
  text-decoration:none;transition:background 0.15s ease;
}
a.resource-row:hover{background:rgba(255,255,255,0.2);}
.resource-row.disabled{opacity:0.7;cursor:default;}
.resource-row .unavailable-badge{
  font-size:15px;font-weight:700;letter-spacing:0.2px;flex-shrink:0;white-space:nowrap;
  background:rgba(255,255,255,0.12);color:rgba(255,255,255,0.75);padding:6px 12px;border-radius:20px;
}
.resource-row .hw-lock{width:14px;height:14px;opacity:0.45;flex-shrink:0;}
.resource-row .ic-square{
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  width:30px;height:30px;border-radius:8px;background:rgba(0,0,0,0.35);
}
.resource-row .ic-square svg{width:16px;height:16px;color:var(--accent);}
.resource-row .ic-square.ic-blue svg{color:#6FA8CC;}
.resource-row > span:nth-child(2){flex:1;}
.resource-row .chev{width:14px;height:14px;opacity:0.7;flex-shrink:0;transition:transform 0.2s ease;}
.resource-row.expandable{cursor:pointer;user-select:none;border:none;width:100%;text-align:left;font-family:inherit;}
.resource-row.expandable:hover{background:rgba(255,255,255,0.2);}
.resource-row.expandable.open{margin-bottom:0;border-radius:10px 10px 0 0;}
.resource-row.expandable .chev{transform:rotate(90deg);}
.resource-row.expandable.open .chev{transform:rotate(-90deg);}
.resource-expand-panel{
  background:linear-gradient(135deg, rgba(229,53,178,0.16) 0%, rgba(39,71,94,0.55) 55%);
  border-left:3px solid var(--accent);
  border-radius:0 0 10px 10px;padding:18px 18px 6px 15px;margin:0 0 10px;
}
.resource-expand-panel[hidden]{display:none;}
.rep-section{margin-bottom:16px;}
.rep-section:last-child{margin-bottom:2px;}
.rep-section-title{
  font-family:var(--font-montserrat);font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:0.7px;
  color:#ff7fd4;margin:0 0 8px;
}
.rep-section p{font-size:17px;line-height:1.6;font-weight:500;color:rgba(255,255,255,0.9);margin:0 0 12px;}
.rep-section ol{margin:0;padding:0 0 0 20px;list-style:decimal;}
.rep-section ol li{font-size:17px;line-height:1.6;font-weight:500;color:rgba(255,255,255,0.92);margin-bottom:9px;padding-left:4px;}
.rep-section ol li:last-child{margin-bottom:0;}
.rep-section ul{margin:0;padding:0 0 0 18px;list-style:disc;}
.rep-section li{font-size:17px;line-height:1.55;font-weight:500;color:rgba(255,255,255,0.92);margin-bottom:6px;}
.rep-section li:last-child{margin-bottom:0;}
.rep-section li ul{list-style:circle;margin:6px 0 6px;padding-left:18px;}
.rep-section li ul li{font-size:16px;margin-bottom:4px;font-weight:500;opacity:0.95;}
.rep-section li ul ul{list-style:square;margin:6px 0 6px;padding-left:16px;}
.rep-section li ul ul li{font-size:15.5px;opacity:0.9;}
.rep-section a{color:#ff9fdf;font-weight:700;text-decoration:none;border-bottom:1.5px solid rgba(255,159,223,0.45);padding-bottom:1px;}
.rep-section a:hover{border-bottom-color:#ff9fdf;}

.zone-chip{
  display:inline-flex;align-items:center;background:rgba(255,159,223,0.15);color:#ff9fdf;
  font-weight:700;font-size:0.97em;font-family:inherit;border:none;padding:1px 8px;border-radius:20px;
  cursor:pointer;vertical-align:baseline;line-height:1.6;
}
.zone-chip:hover{background:rgba(255,159,223,0.28);}
.zone-chip::after{content:'\25B8';font-size:1.1em;margin-left:6px;display:inline-block;transition:transform 0.2s ease;transform:rotate(90deg);}
.zone-chip.open::after{transform:rotate(-90deg);}
.zone-panel{
  display:block;margin:8px 0 6px;padding:10px 12px;background:rgba(0,0,0,0.2);
  border-radius:8px;border-left:2px solid #ff9fdf;
}
.wk-highlight{
  display:inline;background:rgba(255,159,223,0.22);color:#fff;font-weight:700;
  padding:2px 6px;border-radius:6px;box-decoration-break:clone;-webkit-box-decoration-break:clone;
}

/* ===== CARB CALCULATOR ===== */
.cc-hero{border:2px solid var(--accent);background:var(--card);color:var(--primary);box-shadow:var(--shadow);}
.cc-hero .date{color:var(--primary);opacity:0.75;}
.cc-hero .input-row,.cc-hero .cc-input-row{background:var(--bg);box-shadow:none;border:1px solid rgba(39,71,94,0.12);}
.cc-hero .cc-result-found{background:var(--bg);}
.cc-hero .cc-result-empty{background:var(--bg);color:var(--primary);}
.cc-hero .cc-result-carbs{color:var(--primary);}
.cc-hero .cc-result-detail{color:var(--primary);opacity:0.75;}
.cc-hero .cc-note{color:var(--primary);opacity:0.6;}
.cc-tool{background:rgba(255,255,255,0.08);border-radius:16px;padding:22px;margin-bottom:26px;}
.cc-tool-title{
  display:flex;align-items:center;gap:9px;margin:0 0 6px;font-family:var(--font-montserrat);
  font-size:19.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.8px;opacity:0.95;
}
.cc-tool-title svg{width:19px;height:19px;flex-shrink:0;color:var(--accent);}
.cc-tool-sub{font-size:16px;color:rgba(255,255,255,0.75);margin:0 0 16px;}
.cc-input-row{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,0.95);
  border-radius:14px;padding:12px 16px;box-shadow:0 1px 4px rgba(20,30,20,0.12);}
.cc-input-row svg{width:19px;height:19px;flex-shrink:0;color:var(--primary);opacity:0.6;}
#ccInput{flex:1;background:none;border:none;outline:none;color:var(--text);font-size:17.5px;font-family:var(--font);}
#ccInput::placeholder{color:#9a978d;}
.cc-result{margin-top:16px;min-height:0;}
.cc-result-found{
  display:flex;align-items:center;gap:18px;background:rgba(255,255,255,0.12);
  border-radius:14px;padding:16px 20px;animation:ccFadeIn 0.15s ease;
}
.cc-result-carbs{
  font-family:var(--font-spartan);font-size:34px;font-weight:700;color:#fff;line-height:1;white-space:nowrap;
}
.cc-result-carbs span{font-size:16px;font-weight:600;opacity:0.75;margin-left:2px;}
.cc-result-detail{font-size:16px;color:rgba(255,255,255,0.8);}
.cc-result-empty{
  background:rgba(255,255,255,0.08);border-radius:14px;padding:14px 20px;
  font-size:16px;color:rgba(255,255,255,0.75);animation:ccFadeIn 0.15s ease;
}
@keyframes ccFadeIn{from{opacity:0;transform:translateY(-4px);}to{opacity:1;transform:translateY(0);}}
.cc-note{font-size:14.5px;color:rgba(255,255,255,0.6);margin-top:14px;font-style:italic;}
.zone-panel.recipe-panel{margin:0 0 24px;padding:24px 26px;}
.zone-panel.recipe-panel:last-child{margin-bottom:0;}
.zone-panel[hidden]{display:none;}
.zone-panel-title{
  font-family:var(--font-spartan);font-size:22px;font-weight:800;text-transform:none;letter-spacing:0.2px;
  color:#ff9fdf;margin:0 0 16px;padding-bottom:10px;border-bottom:1px solid rgba(255,159,223,0.3);
}
.rep-recipe-img{width:100%;max-height:260px;object-fit:cover;border-radius:12px;margin:-4px 0 16px;display:block;}
.zone-row{margin-bottom:14px;}
.zone-row:last-child{margin-bottom:0;}
.zone-row-label{font-family:var(--font-montserrat);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:0.7px;color:#ff9fdf;margin-bottom:4px;}
.zone-row-value{font-size:16px;line-height:1.6;color:rgba(255,255,255,0.92);}
.zone-highlight{background:rgba(255,159,223,0.28);color:#fff;font-weight:700;padding:1px 5px;border-radius:4px;}

.cwc-subsection-title{
  font-family:var(--font-montserrat);font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:0.8px;
  opacity:0.8;margin:18px 0 10px;
}
.cwc-subsection-title:first-child{margin-top:0;}

.subhead-row{display:flex;align-items:center;justify-content:space-between;margin:30px 0 14px;}
.subhead-row h3{font-family:var(--font-spartan);margin:0;font-size:20px;font-weight:700;color:var(--primary);}
.card-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(230px,1fr));gap:16px;}
.card{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:20px;
  box-shadow:var(--shadow);transition:transform .15s ease, box-shadow .15s ease;
  display:flex;flex-direction:column;gap:8px;
}
.card:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(31,61,43,0.14);}
.card .icon{width:38px;height:38px;border-radius:10px;background:#EFF5F0;display:flex;align-items:center;justify-content:center;font-size:20.5px;}
.card h3{font-family:var(--font-spartan);margin:0;font-size:19.5px;font-weight:700;color:var(--primary);}
.card p{margin:0;font-size:16px;color:var(--muted);}

.hero{
  background:linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);color:#fff;
  border-radius:20px;padding:40px 32px;margin-bottom:32px;box-shadow:var(--shadow);
}
.hero h1{font-family:var(--font-spartan);margin:0 0 8px;font-size:30px;font-weight:700;}
.hero p{font-family:var(--font-montserrat);font-weight:600;margin:0;opacity:0.92;max-width:560px;font-size:18px;}
.hero .accent-tag{
  display:inline-block;background:var(--accent);color:#fff;font-family:var(--font-montserrat);font-size:16px;font-weight:700;
  letter-spacing:1px;text-transform:uppercase;padding:5px 12px;border-radius:20px;margin-bottom:12px;
}

.section-block{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  padding:24px 26px;margin-bottom:20px;box-shadow:var(--shadow);scroll-margin-top:90px;
}
.section-block h2{font-family:var(--font-spartan);margin:0 0 4px;font-size:22px;font-weight:700;color:var(--primary);}
.section-block .meta{font-size:16px;color:var(--accent);font-weight:600;margin-bottom:14px;}
.resource-list{list-style:none;margin:0;padding:0;}
.resource-list li{margin-bottom:8px;}
.resource-list a{
  display:inline-flex;align-items:center;gap:8px;font-size:18px;color:var(--primary-light);
  font-weight:600;padding:8px 12px;border-radius:9px;background:#F2F6F2;
}
.resource-list a:hover{background:#E4EEE4;}
.resource-list span.disabled{
  display:inline-block;font-size:18px;color:var(--muted);background:#F1F1EC;
  padding:8px 12px;border-radius:9px;
}
.homework{margin-top:16px;background:#FBF7EF;border:1px solid #EFE3C6;border-radius:10px;padding:16px 18px;}
.homework h4{margin:0 0 10px;font-family:var(--font-montserrat);font-weight:700;font-size:17.5px;color:#8A6A1E;text-transform:uppercase;letter-spacing:0.5px;}
.homework ul{margin:0;padding-left:18px;}
.homework li{margin-bottom:6px;font-size:17.5px;}
.homework a{color:var(--primary-light);font-weight:600;}
.note-text{font-size:18px;color:var(--text);margin:6px 0;}
.mini-card{background:#F2F6F2;border-radius:10px;padding:14px 16px;margin-bottom:10px;}
.mini-card .title{font-family:var(--font-montserrat);font-weight:500;color:var(--primary);font-size:18px;margin-bottom:4px;}
.mini-card .desc{font-size:17px;color:var(--muted);}

.events-list{display:flex;flex-direction:column;gap:14px;}
.event-row{
  display:flex;flex-direction:column;color:#fff;
  background:linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);border:none;
  border-radius:20px;padding:26px 28px;box-shadow:var(--shadow);
}
.event-row .tag{
  display:inline-flex;align-self:flex-start;align-items:center;gap:7px;background:var(--accent);
  font-family:var(--font-montserrat);font-size:15px;font-weight:700;letter-spacing:1px;text-transform:uppercase;
  padding:6px 14px;border-radius:20px;margin-bottom:12px;
}
.event-row .tag .tag-ic{width:14px;height:14px;flex-shrink:0;}
.event-row h3{font-family:var(--font-spartan);margin:0 0 14px;font-size:26px;font-weight:700;line-height:1.15;color:#fff;}
.event-row .resource-row:last-child{margin-bottom:0;}

footer{text-align:center;padding:30px 20px;color:var(--muted);font-size:16px;}

.mobile-toggle{display:none;}

/* ===== MOBILE TAB BAR (Home / Explore / Events) ===== */
.mobile-tabbar{display:none;}
@media (max-width:820px){
  .mobile-tabbar{
    display:flex;gap:6px;background:var(--primary);padding:10px 12px;
    position:sticky;top:var(--topbar-h);z-index:150;overflow-x:auto;
  }
  .mobile-tab-link{
    flex:1;text-align:center;padding:9px 10px;border-radius:20px;border:none;background:none;
    color:rgba(255,255,255,0.7);font-family:var(--font-montserrat);font-size:15.5px;font-weight:700;
    cursor:pointer;white-space:nowrap;
  }
  .mobile-tab-link.active{background:#fff;color:var(--primary);}
  .app-shell{flex-direction:column;}
  .sidebar{display:none;}
  body.mobile-explore-open .content-area{display:none;}
  body.mobile-explore-open .sidebar{
    display:block;position:static;width:100%;height:auto;overflow:visible;
    box-shadow:none;padding-bottom:10px;
  }
  body.mobile-explore-open .sidebar > nav{position:static;max-height:none;overflow:visible;}
}

/* ===== GLOBAL TOP BAR (unified brand + nav + search) ===== */
html{transition:background-color .15s ease;}
.topbar-global{
  position:sticky;top:0;z-index:200;height:var(--topbar-h);background:var(--topbar-bg);
  display:flex;align-items:center;padding:0 20px;gap:22px;
}
.topbar-global .brand-drop{
  position:relative;display:flex;align-items:center;gap:8px;cursor:pointer;
  color:#fff;font-weight:700;font-size:19px;padding:8px 10px;border-radius:8px;flex-shrink:0;
}
.topbar-global .brand-drop:hover{background:rgba(255,255,255,0.08);}
.brand-drop .logo-mark{
  width:28px;height:28px;border-radius:8px;background:var(--accent);
  display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:800;color:#fff;
}
.brand-drop .chevron{font-size:13.5px;opacity:0.6;margin-left:2px;}
.brand-menu{
  position:absolute;top:48px;left:0;background:#fff;color:#22221F;border-radius:10px;
  box-shadow:0 10px 28px rgba(0,0,0,0.28);min-width:190px;padding:6px;display:none;z-index:250;
}
.brand-menu.open{display:block;}
.brand-menu .menu-label{padding:8px 12px 4px;font-family:var(--font-montserrat);font-size:15px;text-transform:uppercase;letter-spacing:0.6px;color:var(--muted);font-weight:700;}
.brand-menu button{
  width:100%;text-align:left;padding:9px 12px;border:none;background:none;border-radius:6px;
  font-size:17.5px;cursor:pointer;display:flex;align-items:center;gap:9px;color:#22221F;font-family:var(--font);
}
.brand-menu button:hover{background:#F2F6F2;}
.brand-menu button.active{font-weight:700;color:var(--primary);}

nav.global-tabs{display:flex;gap:4px;flex-shrink:0;}
.global-tabs a{
  color:var(--primary);font-size:17.5px;font-weight:700;padding:9px 16px;border-radius:20px;
}
.global-tabs a.active{background:var(--primary);color:#fff;}
.global-tabs a:hover{background:rgba(57,93,114,0.14);}
.global-tabs a.active:hover{background:var(--primary);}

.topbar-right{margin-left:auto;display:flex;align-items:center;gap:12px;}
.search-box{
  display:flex;align-items:center;gap:8px;background:rgba(255,255,255,0.85);
  border:1px solid rgba(57,93,114,0.25);border-radius:20px;padding:8px 14px;
  color:var(--primary);font-size:16px;min-width:190px;box-shadow:0 1px 4px rgba(20,30,20,0.12);
  position:relative;
}
.search-box .search-icon{flex-shrink:0;}
.search-box input{background:none;border:none;outline:none;color:var(--primary);font-size:16px;width:100%;font-family:var(--font);}
.search-box input::placeholder{color:rgba(57,93,114,0.55);}

.search-results{
  display:none;position:absolute;top:calc(100% + 8px);right:0;width:340px;max-width:min(340px, 90vw);
  background:var(--card);border-radius:14px;box-shadow:0 10px 28px rgba(0,0,0,0.22);
  max-height:360px;overflow-y:auto;z-index:300;padding:6px;
}
.search-results.open{display:block;}
.search-result{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:10px 12px;border-radius:9px;color:var(--text);font-size:15.5px;font-weight:600;
}
.search-result:hover{background:#F2F6F2;}
.search-result .sr-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.search-result .sr-title mark{background:rgba(229,53,178,0.22);color:var(--accent);border-radius:3px;padding:0 1px;}
.search-result .sr-cat{
  flex-shrink:0;font-family:var(--font-montserrat);font-size:12px;font-weight:700;text-transform:uppercase;
  letter-spacing:0.4px;color:var(--muted);background:#F0F1EA;padding:3px 8px;border-radius:20px;
}
.search-empty{padding:12px;font-size:14.5px;color:var(--muted);}
html[data-theme="dark"] .search-result:hover{background:#22282A;}
html[data-theme="dark"] .search-result .sr-cat{background:#22252A;}
.topbar-global .mobile-toggle{color:var(--primary);order:-1;}

/* App shell now sits below the global bar */
.app-shell{min-height:calc(100vh - var(--topbar-h));align-items:stretch;}
.sidebar{top:var(--topbar-h);}
.sidebar > nav{top:var(--topbar-h);max-height:calc(100vh - var(--topbar-h));}
@media (max-width:820px){ .sidebar{top:var(--topbar-h);} }

/* Wider main content, like a feed column */
main{max-width:1320px;}

/* ===== DARK MODE ===== */
html[data-theme="dark"]{
  --bg:#15171B;
  --card:#1E2126;
  --text:#EDEDE8;
  --muted:#9A9A92;
  --border:#2B2E33;
  --primary-light:#3B6B48;
}
html[data-theme="dark"] .placeholder-banner{background:#2A2213;border-bottom-color:#4A3A1A;color:#E3B872;}
html[data-theme="dark"] .week-pill{background:#22252A;color:var(--muted);border-color:var(--border);}
html[data-theme="dark"] .week-pill.active{background:var(--primary-light);color:#fff;border-color:var(--primary-light);}
html[data-theme="dark"] .resource-list a{background:#22282A;color:#9FD9AE;}
html[data-theme="dark"] .resource-list a:hover{background:#28312F;}
html[data-theme="dark"] .resource-list span.disabled{background:#22252A;color:var(--muted);}
html[data-theme="dark"] .homework{background:#2A2517;border-color:#4A3E1F;}
html[data-theme="dark"] .homework h4{color:#E3B872;}
html[data-theme="dark"] .card{background:var(--card);}
html[data-theme="dark"] .card .icon{background:#22282A;}
html[data-theme="dark"] .mini-card{background:#20242A;}

/* ===== TOPBAR ZONE LAYOUT (v4: tabs centered over main column) ===== */
.topbar-global{padding:0;gap:0;}
.topbar-global .topbar-left{
  width:var(--sidebar-w);flex-shrink:0;display:flex;align-items:center;padding-left:20px;
}
.topbar-global .topbar-center{flex:1;display:flex;justify-content:center;min-width:0;}
.topbar-global .topbar-right{flex-shrink:0;padding-right:20px;margin-left:0;}
.topbar-global .mobile-toggle{margin-left:6px;}

/* ===== SIDEBAR v2: collapsible groups, icons, numbered badges ===== */
.sidebar nav{padding-top:14px;}
.sidebar a.nav-item{gap:11px;}
.nav-svg{width:16px;height:16px;flex-shrink:0;opacity:0.95;color:var(--accent);}
.nav-svg.icon-red{color:var(--accent);}
.nav-svg.icon-gold{color:var(--accent);}
.week-num{
  width:18px;height:18px;border-radius:50%;border:1.5px solid var(--accent);color:var(--accent);
  display:flex;align-items:center;justify-content:center;font-size:13.5px;font-weight:800;
  flex-shrink:0;opacity:0.85;
}

.nav-group{margin-top:6px;}
.nav-group-header{
  width:100%;background:none;border:none;color:rgba(255,255,255,0.48);
  font-size:14.7px;font-weight:700;letter-spacing:1px;text-transform:uppercase;
  padding:14px 22px 8px;display:flex;align-items:center;justify-content:space-between;
  cursor:pointer;font-family:var(--font-montserrat);
}
.nav-group-header:hover{color:rgba(255,255,255,0.85);}
.nav-group-header .chev{font-size:12px;flex-shrink:0;}
.nav-group-items{display:flex;flex-direction:column;overflow:hidden;}
.nav-group-items.collapsed{display:none;}

/* ===== TOPBAR BRAND v2: split logo-link (home) + caret (dark mode menu) ===== */
.brand-wrap{position:relative;display:flex;align-items:center;gap:0;flex-shrink:0;}
.brand-link{
  display:flex;align-items:center;gap:8px;color:#fff;font-weight:700;font-size:19px;
  padding:8px 8px 8px 10px;border-radius:8px;text-decoration:none;
}
.brand-link:hover{background:rgba(255,255,255,0.08);}
.brand-caret{
  background:none;border:none;color:var(--primary);cursor:pointer;opacity:0.75;
  padding:8px 10px;border-radius:8px;display:flex;align-items:center;
}
.brand-caret:hover{background:rgba(57,93,114,0.1);opacity:1;}
.brand-caret .chevron{font-size:13.5px;}

/* ===== MOBILITY: embedded video cards ===== */
.mini-hero{
  border-radius:20px;padding:32px 32px;margin:26px 0 18px;color:#fff;
  background:linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);
  box-shadow:var(--shadow);
}
.mini-hero:first-child{margin-top:0;}
.mini-hero .tag{
  display:inline-flex;align-items:center;gap:7px;background:var(--accent);color:#fff;font-family:var(--font-montserrat);font-size:16px;font-weight:700;
  letter-spacing:1px;text-transform:uppercase;padding:6px 14px;border-radius:20px;margin-bottom:12px;
}
.mini-hero h2{font-family:var(--font-spartan);margin:0 0 6px;font-size:37.4px;font-weight:700;line-height:1.05;}
@media (max-width:640px){.mini-hero h2{font-size:34.5px;}}
.mini-hero p{font-family:var(--font-montserrat);font-weight:600;margin:0;font-size:17.5px;opacity:0.85;}

.video-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(320px,1fr));gap:20px;margin-bottom:10px;}
.video-grid.video-grid-stacked{grid-template-columns:1fr;}
.video-card{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;
}
.video-card .video-embed{position:relative;width:100%;padding-bottom:56.25%;background:#000;}
.video-card .video-embed iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;}
.video-card .video-body{padding:16px 18px 18px;}
.video-card .duration-badge{
  display:inline-block;background:#EFF5F0;color:var(--primary-light);font-size:15.5px;font-weight:700;
  padding:3px 10px;border-radius:20px;margin-bottom:8px;
}
.video-card h3{font-family:var(--font-spartan);margin:0 0 6px;font-size:19.5px;font-weight:700;color:var(--primary);line-height:1.3;}
.video-card p{margin:0;font-size:16px;color:var(--muted);line-height:1.5;}
html[data-theme="dark"] .video-card .duration-badge{background:#22282A;}

/* ===== MOBILITY: click-to-play thumbnail facade ===== */
.video-embed{cursor:pointer;}
.video-thumb{
  position:absolute;top:0;left:0;width:100%;height:100%;
  background-size:cover;background-position:center;
  display:flex;align-items:center;justify-content:center;
}
.video-thumb::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,0.18);}
.video-thumb .play-btn{
  position:relative;z-index:1;width:56px;height:56px;border-radius:50%;
  background:rgba(20,21,26,0.75);display:flex;align-items:center;justify-content:center;
  transition:transform .15s ease, background .15s ease;
}
.video-embed:hover .play-btn{background:var(--accent);transform:scale(1.08);}
.video-thumb .play-btn svg{width:20px;height:20px;fill:#fff;margin-left:3px;}

/* ===== BRAND LOCKUP: "It's time to / LEVEL UP" wordmark ===== */
.brand-link{
  display:flex;align-items:center;padding:6px 10px;border-radius:10px;
}
.brand-lockup{display:flex;flex-direction:column;justify-content:center;align-items:center;line-height:1;}
.brand-line1{
  font-family:var(--font-script);font-size:20.5px;font-weight:600;color:#fff;
  line-height:1;margin-bottom:2px;text-align:center;
  text-shadow:1px 2px 4px rgba(10,20,10,0.55), 0 4px 14px rgba(10,20,10,0.35);
}
.brand-line2{
  font-family:var(--font-spartan);font-size:46px;font-weight:800;letter-spacing:0.5px;
  color:var(--primary);line-height:1;
}
.brand-line2 .brand-up{
  color:#fff;margin-left:5px;
  text-shadow:1px 2px 4px rgba(10,20,10,0.55), 0 4px 14px rgba(10,20,10,0.35);
}

/* ===== RECIPE LIBRARY ===== */
.rl-back{
  display:inline-flex;align-items:center;gap:6px;color:var(--primary);font-weight:700;
  font-family:var(--font-montserrat);font-size:16px;cursor:pointer;background:none;border:none;
  padding:0;margin-bottom:16px;
}
.rl-back svg{width:16px;height:16px;}
.rl-back:hover{color:var(--accent);}
.rl-heading{margin-bottom:18px;}
.rl-heading h2{font-family:var(--font-spartan);font-size:28px;font-weight:700;color:var(--primary);margin:0 0 4px;}
.rl-heading .rl-count{font-size:16px;color:var(--muted);}

.rl-cat-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(220px,1fr));gap:16px;margin-bottom:8px;}
.rl-cat-card{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  padding:22px;cursor:pointer;transition:transform 0.15s ease, box-shadow 0.15s ease;
  display:flex;flex-direction:column;gap:10px;
}
.rl-cat-card:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(31,61,43,0.14);}
.rl-cat-card .rl-cat-icon{
  width:44px;height:44px;border-radius:12px;background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:20px;
}
.rl-cat-card .rl-cat-icon svg{width:22px;height:22px;}
.rl-cat-card h3{font-family:var(--font-spartan);margin:0;font-size:19.5px;font-weight:700;color:var(--primary);}
.rl-cat-card p{margin:0;font-size:15.5px;color:var(--muted);}

.rl-subpills{margin-bottom:20px;}

.rl-recipe-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(230px,1fr));gap:18px;}
.rl-recipe-card{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;
  cursor:pointer;transition:transform 0.15s ease, box-shadow 0.15s ease;display:flex;flex-direction:column;
}
.rl-recipe-card:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(31,61,43,0.14);}
.rl-recipe-card .rl-recipe-img{width:100%;aspect-ratio:4/3;object-fit:cover;background:#EFF5F0;display:block;}
.rl-recipe-card .rl-recipe-body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:8px;flex:1;}
.rl-recipe-card h4{font-family:var(--font-spartan);margin:0;font-size:17px;font-weight:700;color:var(--primary);line-height:1.25;}
.rl-recipe-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;}
.rl-pill{
  display:inline-flex;align-items:center;font-family:var(--font-montserrat);font-size:13px;font-weight:700;
  padding:4px 10px;border-radius:20px;white-space:nowrap;
}
.rl-pill.rl-pill-serves{background:#EFF5F0;color:var(--primary);}
.rl-pill.rl-pill-carbs{background:rgba(229,53,178,0.14);color:var(--accent);}
html[data-theme="dark"] .rl-pill.rl-pill-serves{background:#22282A;color:#9FD9AE;}

/* modal */
.rl-modal-overlay{
  position:fixed;inset:0;background:rgba(20,21,26,0.55);display:none;align-items:flex-start;justify-content:center;
  z-index:200;padding:40px 16px;overflow-y:auto;
}
.rl-modal-overlay.open{display:flex;}
.rl-modal{
  background:var(--card);border-radius:20px;max-width:640px;width:100%;overflow:hidden;
  box-shadow:0 20px 60px rgba(0,0,0,0.35);position:relative;
}
.rl-modal-close{
  position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;
  background:rgba(20,21,26,0.55);color:#fff;border:none;cursor:pointer;font-size:18px;
  display:flex;align-items:center;justify-content:center;z-index:2;
}
.rl-modal-close:hover{background:var(--accent);}
.rl-modal-img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;background:#EFF5F0;}
.rl-modal-body{padding:24px 26px 30px;}
.rl-modal-eyebrow{font-family:var(--font-montserrat);font-size:14px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--accent);margin-bottom:6px;}
.rl-modal-body h2{font-family:var(--font-spartan);font-size:26px;font-weight:700;color:var(--primary);margin:0 0 12px;line-height:1.15;}
.rl-modal-pills{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px;}
.rl-modal-pills .rl-pill{font-size:14px;padding:6px 14px;}
.rl-modal-section-title{
  font-family:var(--font-montserrat);font-size:16px;font-weight:700;text-transform:uppercase;
  letter-spacing:0.8px;color:var(--primary);margin:0 0 10px;
}
.rl-ing-list, .rl-method-list{margin:0 0 24px;padding:0;list-style:none;}
.rl-ing-list li{
  padding:9px 0;border-bottom:1px dashed var(--border);font-size:16px;color:var(--text);
}
.rl-ing-list li:last-child{border-bottom:none;}
.rl-ing-list li.rl-ing-header{
  font-family:var(--font-montserrat);font-weight:700;color:var(--accent);text-transform:uppercase;
  font-size:14px;letter-spacing:0.5px;border-bottom:none;padding-top:16px;
}
.rl-ing-list li.rl-ing-header:first-child{padding-top:0;}
.rl-method-list{counter-reset:rl-step;}
.rl-method-list li{
  position:relative;padding:0 0 16px 38px;font-size:16px;color:var(--text);counter-increment:rl-step;
}
.rl-method-list li::before{
  content:counter(rl-step);position:absolute;left:0;top:-1px;width:26px;height:26px;border-radius:50%;
  background:var(--primary);color:#fff;font-family:var(--font-montserrat);font-weight:700;font-size:13px;
  display:flex;align-items:center;justify-content:center;
}
.rl-carbs-note{font-size:14px;color:var(--muted);font-style:italic;margin-top:-14px;margin-bottom:22px;}
@media (max-width:640px){
  .rl-modal-overlay{padding:0;}
  .rl-modal{border-radius:0;max-width:100%;min-height:100vh;}
}
html[data-theme="dark"] .rl-cat-card,
html[data-theme="dark"] .rl-recipe-card,
html[data-theme="dark"] .rl-modal{background:var(--card);}
html[data-theme="dark"] .rl-ing-list li{border-color:var(--border);}

/* ===== MOBILE ===== */
html,body{overflow-x:hidden;}
body.lu-lock{overflow:hidden;}
.sidebar-close{display:none;}
@media (max-width:820px){
  .sidebar-close{
    display:flex;align-items:center;gap:6px;width:100%;background:rgba(255,255,255,0.06);
    border:none;border-bottom:1px solid rgba(255,255,255,0.12);color:#fff;font-weight:700;
    font-size:16px;padding:16px 22px;cursor:pointer;font-family:var(--font-montserrat);
    position:sticky;top:0;z-index:5;
  }
  .topbar-global .topbar-left{width:auto;padding-left:6px;}
  .topbar-global{padding:0 4px;}
  .brand-line1{font-size:12px;}
  .brand-line2{font-size:26px;}
  .brand-link{padding:6px 4px;}
  .brand-caret{padding:6px 6px;}
  .topbar-center{flex:1 1 auto;min-width:0;}
  .global-tabs{gap:2px;}
  .global-tabs a{font-size:15px;padding:8px 10px;white-space:nowrap;}
  .topbar-global .topbar-right{padding-right:8px;margin-left:auto;}
  .topbar-global .topbar-center{display:none;}
  .search-box{min-width:0;padding:8px 10px;}
  .search-box input{width:70px;font-size:14px;}
  main{padding:24px 18px 70px;}
  .page-title{font-size:28px;}
  .page-subtitle{font-size:17px;}
  .hero h1{font-size:26px;}
  .hero p{font-size:16px;}
  .current-week-card h2,.mini-hero h2{font-size:30px;}
  .current-week-card .date,.mini-hero p{font-size:16px;}
  .tag,.current-week-card .tag,.mini-hero .tag,.event-row .tag{font-size:14px;padding:5px 12px;}
  .teaser-focus{font-size:18px;}
  .teaser-meta{font-size:16px;}
  .event-row h3{font-size:22px;}
  .rl-heading h2{font-size:23px;}
  .rl-modal-body h2{font-size:22px;}
  .zone-panel-title{font-size:19px;}
  .cwc-panel-title{font-size:17.5px;}
  .cwc-panel-title svg.icon-lg{width:22px;height:22px;}
  .section-block h2{font-size:19px;}
  .subhead-row h3{font-size:19px;}
  .week-pill{font-size:15px;padding:7px 13px;}
  .resource-row{font-size:16px;}
  .rep-section p,.rep-section ol li,.rep-section li{font-size:16px;}
  .cwc-empty,.cwc-locked-text{font-size:16px;}
  .cc-tool-title{font-size:17.5px;}
  .cc-result-carbs{font-size:29px;}
  .rl-cat-card h3{font-size:18px;}
  .rl-recipe-card h4{font-size:16px;}
  .video-card h3{font-size:18px;}
  .mobile-tab-link{font-size:14.5px;padding:8px 8px;}
  .nav-item{font-size:16px;}
}
@media (max-width:480px){
  .search-box{width:40px;height:40px;padding:0;justify-content:center;border-radius:50%;min-width:0;}
  .search-box input{display:none;}
  .search-box.expanded{
    position:fixed;top:8px;left:8px;right:8px;width:auto;height:auto;border-radius:20px;
    padding:8px 14px;justify-content:flex-start;z-index:400;box-shadow:0 6px 20px rgba(0,0,0,0.28);
  }
  .search-box.expanded input{display:block;}
  .search-results{left:0;right:0;width:auto;max-width:none;}
  main{padding:18px 14px 60px;}
  .page-title{font-size:24px;}
  .page-subtitle{font-size:16px;}
  .current-week-card,.hero,.mini-hero,.event-row{padding:22px 20px;}
  .current-week-card h2,.mini-hero h2{font-size:27px;}
  .hero h1{font-size:24px;}
  .hero p{font-size:15px;}
  .section-block{padding:18px 16px;}
  .rl-modal-body{padding:18px 16px 22px;}
  .rl-modal-eyebrow{margin-bottom:4px;}
  .subhead-row h3{font-size:18px;}
  .week-pill{font-size:14.5px;padding:7px 12px;}
  .video-grid,.card-grid,.rl-cat-grid,.rl-recipe-grid{grid-template-columns:1fr;}
  .cc-hero .cc-result-found{flex-wrap:wrap;gap:8px;}
  .teaser-row{flex-wrap:wrap;}
  .tag,.current-week-card .tag,.mini-hero .tag,.event-row .tag{font-size:13px;padding:5px 10px;letter-spacing:0.5px;}
  .event-row h3{font-size:20px;}
  .rl-heading h2{font-size:20px;}
  .rl-modal-body h2{font-size:20px;}
  .zone-panel-title{font-size:17px;}
  .cc-result-carbs{font-size:26px;}
  .brand-line2{font-size:22px;}
  .brand-line1{font-size:10.5px;}
  .page-title{font-size:22px;}
  .cwc-panel-title{font-size:16px;}
  .rl-cat-card h3,.card h3{font-size:17px;}
  .rl-recipe-card h4{font-size:15.5px;}
  .video-card h3{font-size:17px;}
  .rep-section p,.rep-section ol li,.rep-section li{font-size:15.5px;}
  .resource-row{font-size:15.5px;}
  .nav-item{font-size:15.5px;}
  .subnav a{font-size:14.5px;}
  .mobile-tab-link{font-size:13.5px;padding:8px 6px;}
}
