/* ============================================================
   CORPORATE THEME — Treasure Academy
   Clash Display + General Sans, restrained professional components.
   Loaded last: everything here overrides main.css / extra.css.
   ============================================================ */
:root{
  --font-head:"Clash Display",sans-serif;--font-body:"General Sans",sans-serif;
  --green:#0E5A2E;--green-bright:#0B7A37;--green-deep:#0E3B21;--green-2:var(--green-deep);
  --gold:#C9A227;--gold-soft:#F8F4E4;--paper:#FFFFFF;--cream:#F6F1E3;
  --ink:#203040;--muted:#5C6B7A;--line:#E5DCC2;--danger:#B31E35;
  --white:var(--paper);--sh:var(--sh-2);--sh-sm:var(--sh-1);--sh-lg:var(--sh-3);
  --r-sm:8px;--r-md:12px;--r-lg:16px;--r-pill:999px;
}
body{font-family:var(--font-body);-webkit-font-smoothing:antialiased}
h1,h2{font-family:var(--font-head);letter-spacing:-.01em;line-height:1.15}
h1 em{color:var(--gold);font-style:italic}
h3,h4{font-family:var(--font-body)}
.logo>span{font-family:var(--font-head);font-size:var(--fs-base);line-height:1.25}
.stat b,.step .num,.yr{font-family:var(--font-head)}

/* ---------- Topbar + Navbar ---------- */
.topbar{background:var(--green-2);color:#E5DCC2;font-size:var(--fs-xs)}
.topbar a{color:var(--sun)}
.tb-contact{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tb-sep{opacity:.5}
.tb-right{display:flex;align-items:center;gap:14px}
.portal-link{font-weight:700;color:var(--sun)!important;text-decoration:underline;text-underline-offset:3px}
.navbar{position:sticky;top:0;z-index:var(--z-dropdown);background:rgba(255,255,255,.97);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav-links a{font-weight:600;font-size:var(--fs-sm);color:var(--ink);padding:9px 11px;border-radius:var(--r-sm)}
.nav-links a:hover{color:var(--green);background:var(--mint-soft)}
.theme-btn{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper)}
.explore-bar a{border-radius:var(--r-sm)}

/* ---------- Hero ---------- */
.hero{padding:60px 0 66px}
.cloud,.float-badge,.blob-frame::before,.blob-frame::after{display:none}
.blob-frame{border-radius:var(--r-md);box-shadow:var(--sh-1)}
.hero-badge{background:transparent;color:var(--green);border:1px solid var(--green);border-radius:var(--r-sm);font-size:var(--fs-xs);font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:7px 14px}
.hero-badge .dot{display:none}
.hero h1{font-size:var(--fs-2xl);margin:16px 0 12px}
.w-sun,.w-coral,.w-sky{color:inherit}
.lead{font-size:var(--fs-base);color:var(--muted)}
.hero-figure{margin:0}
.hero-figure img{width:100%;border-radius:var(--r-md);box-shadow:var(--sh-1);display:block}
.hero-figure figcaption{font-size:var(--fs-xs);color:var(--muted);margin-top:10px;font-weight:600}
.hero-mini{border-top:1px solid var(--line);padding-top:16px;margin-top:20px}
.hero-mini strong{font-family:var(--font-head);font-size:var(--fs-lg);color:var(--ink)}
.hero-mini span{font-size:var(--fs-xs);color:var(--muted);font-weight:600}

/* ---------- Buttons ---------- */
.btn{border-radius:var(--r-sm);font-weight:600;font-size:var(--fs-sm);letter-spacing:.01em;padding:12px 24px}
.btn-sm{padding:8px 15px;font-size:var(--fs-sm)}
.btn svg{vertical-align:-4px}
button[data-view]{border-radius:var(--r-sm);font-weight:600}

/* ---------- Eyebrow tags, chips, badges ---------- */
.sec-tag{background:none!important;border:0!important;color:var(--gold);font-size:var(--fs-xs);font-weight:800;letter-spacing:.15em;text-transform:uppercase;padding:0}
.sec-head{text-align:center}
.sec-head p{color:var(--muted)}
.chip{background:var(--white);border:1px solid var(--line);color:var(--green)}
.badge{font-size:var(--fs-xs);letter-spacing:.08em;font-weight:800}
.sticker{background:var(--green-2);color:#FFFFFF;font-size:var(--fs-xs);font-weight:800;letter-spacing:.12em;text-transform:uppercase;border-radius:var(--r-sm);padding:9px 15px;box-shadow:var(--sh-1)}

/* ---------- Page hero (inner pages) ---------- */
.page-hero{background:var(--green-deep);padding:60px 0;border:0}
.page-hero h1{color:#FFFFFF;font-size:var(--fs-2xl)}
.page-hero p{color:#E5DCC2}
.page-hero .sec-tag{color:var(--sun)}

/* ---------- Cards: white, hairline, sharp ---------- */
.prog.p1,.prog.p2,.prog.p3,.mv-card,.quiz-q{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--sh-1)}
.prog.p1,.prog.p2,.prog.p3,.feat,.step{border-top:3px solid var(--green)}
.prog .emoji,.feat .ic,.big-emoji{display:none}
.prog-grid{counter-reset:pn}
.prog h3::before{counter-increment:pn;content:"0" counter(pn);display:block;font-family:var(--font-head);font-size:var(--fs-sm);letter-spacing:.12em;color:var(--gold);margin-bottom:6px}
.step{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md)}
.step .num{background:var(--green)!important;color:#FFFFFF;font-size:var(--fs-md)}
.feat{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--sh-1)}
.gal .cap{background:rgba(12,51,32,.93);font-size:var(--fs-sm);font-weight:600}
.testi-card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md)}
.testi-card .stars{color:var(--gold);letter-spacing:.25em}
.quote-card{border-left:4px solid var(--gold);border-radius:var(--r-md)}
.tl-item{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md)}
.tl-item .yr{color:var(--green)}
.panel,.modal,.auth-card,.glass-card{border-radius:var(--r-md)}
.staff-card,.shop-card,.principal-card,.g-card,.bday-card,.founder-card,.req-list li,.video-shell,.map-frame{border-radius:var(--r-md)}
.shop-ico{font-family:var(--font-head);font-size:var(--fs-lg);color:var(--gold)}
.price-tag{background:var(--white);border:1px solid var(--line);color:var(--green)}
.quiz-opt{border-radius:var(--r-sm)}
/* m-dl shows the single SVG arrow only (double-arrow removed 2026-09-16) */

/* ---------- Stats band ---------- */
.stats-band{background:var(--green-2);border-radius:0}
.stat b{font-size:var(--fs-xl);color:#FFFFFF}
.stat span{color:#E5DCC2;font-size:var(--fs-sm);font-weight:600}

/* ---------- CTA band ---------- */
.cta-band{background:var(--green-deep);border-radius:var(--r-md);color:#FFFFFF;padding:42px 46px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;box-shadow:var(--sh-1)}
.cta-band h2{color:#FFFFFF;font-size:var(--fs-xl)}
.cta-band p{color:#E5DCC2;margin-top:6px;max-width:560px}
.cta-btns{display:flex;gap:12px;flex-wrap:wrap}

/* ---------- Footer ---------- */
.site-footer{background:#101B28}
.foot-col h4{font-size:var(--fs-xs);letter-spacing:.14em;text-transform:uppercase;color:var(--sun);margin-bottom:12px}
.foot-col a,.foot-col p{color:#E5DCC2}
.foot-quick-row a:hover{color:#FFFFFF}
.social-3d a{width:37px;height:37px;border:1px solid #203040;border-radius:var(--r-pill);display:inline-flex;align-items:center;justify-content:center;color:#E5DCC2;margin-right:8px;transform:none!important;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.social-3d a:hover{background:var(--green);color:#FFFFFF}
.foot-bottom{border-top:1px solid #1C2A24;color:#9AA7B8;font-size:var(--fs-xs)}

/* ---------- Chatbot ---------- */
.chat-launch{background:var(--green);border-radius:var(--r-pill);width:56px;height:56px;box-shadow:var(--sh-1)}
.chat-panel,.chat-box{border-radius:var(--r-md)}
.chat-head{background:var(--green-2);color:#FFFFFF}
.chat-avatar{background:var(--sun);color:#0E3B21;font-weight:800}

/* ---------- Portal tables + forms ---------- */
.tbl th{background:#0E3B21;color:#FFFFFF;font-size:var(--fs-xs);letter-spacing:.07em;text-transform:uppercase;padding:12px}
.tbl{border-radius:var(--r-md);overflow:hidden}
.field input,.field select,.field textarea,.toolbar input,.toolbar select{border-radius:var(--r-sm)}
.duty-banner{border-radius:var(--r-md)}

/* ---------- Dark mode companions ---------- */
[data-theme="dark"]{--green:#0B7A37;--green-2:#0E3B21;--gold:#C9A227;--line:#2A3A4E}
[data-theme="dark"] .navbar{background:rgba(18,26,24,.97)}
[data-theme="dark"] .nav-links a{color:var(--ink)}
[data-theme="dark"] .nav-links a:hover{background:#1C2A24;color:var(--sun)}
[data-theme="dark"] .theme-btn{background:#1C2A24}
[data-theme="dark"] .lead,[data-theme="dark"] .sec-head p{color:#9AA7B8}
[data-theme="dark"] .hero-figure figcaption{color:#9AA7B8}
[data-theme="dark"] .step .num{background:var(--green)!important}
[data-theme="dark"] .sticker{background:var(--sun);color:#0E3B21}
[data-theme="dark"] .tbl th{background:#101B28}

/* Real school logo */
.mark-img{width:48px;height:48px;object-fit:contain;border-radius:var(--r-md);background:var(--paper);flex:none;box-shadow:var(--sh-1)}
.auth-logo .mark-img{width:74px;height:74px;border-radius:var(--r-md)}

/* restored homepage icons (professional SVG, no emoji) */
.feat .ic{display:flex;align-items:center;justify-content:center;color:var(--navy,#2A3A4E)}
.feat .ic svg{width:26px;height:26px}
.prog .emoji{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:var(--r-lg);background:rgba(255,255,255,.88);color:var(--navy,#2A3A4E);margin-bottom:12px}
.prog .emoji svg{width:34px;height:34px}

/* wired gallery links */
.gal a,.g-grid a{display:block;color:inherit;text-decoration:none}

/* footer contact icons */
.foot-contact p{display:flex;gap:9px;align-items:flex-start;margin:7px 0}
.foot-contact .fi{flex:0 0 auto;color:var(--gold,#C9A227);display:inline-flex;margin-top:2px}

/* ============ PRO DESIGN PASS (2026-09-15) ============ */
::selection{background:#0E3B21;color:#FFFFFF}
:focus-visible{outline:2px solid #C9A227;outline-offset:2px}
/* sticky blurred nav */
.navbar{position:sticky;top:0;z-index:var(--z-chat);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line);box-shadow:var(--sh-2)}
/* buttons: depth + lift */
.btn{border-radius:var(--r-md);font-weight:700;letter-spacing:.01em;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast);box-shadow:var(--sh-1)}
.btn:hover{transform:translateY(-1px);box-shadow:var(--sh-2)}
.btn:active{transform:none;box-shadow:var(--sh-1)}
/* section labels */
.sec-tag{letter-spacing:.14em;font-size:var(--fs-xs);font-weight:800}
/* marketing cards: uniform + hover */
.feat,.prog,.mv-card,.g-card,.gal,.wa-card,.yt-card,.m-item,.faq-item,.testi-card,.promo-card,.ne-card,.principal-card,.founder-card,.quote-card{border-radius:var(--r-lg)}
.g-card,.gal,.yt-card,.m-item{transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.g-card:hover,.gal:hover,.yt-card:hover,.m-item:hover{transform:translateY(-3px);box-shadow:var(--sh-3)}
.ne-row{transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.ne-row:hover{background:rgba(201,162,39,.07)}
.faq-item{border:1px solid var(--line)}
.sticker{transform:none;border-radius:var(--r-pill);font-weight:800}
/* hero polish */
.hero-figure img{border-radius:var(--r-lg);box-shadow:var(--sh-3)}
.hero-figure figcaption{font-size:var(--fs-xs);opacity:.85}
/* footer polish */
.foot-col h4{font-size:var(--fs-xs);letter-spacing:.14em;text-transform:uppercase}
.foot-quick-row a{transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.foot-quick-row a:hover{color:#C9A227}
/* clock widget: corporate theme */
.clock-widget{border-radius:var(--r-lg);box-shadow:var(--sh-3)}
.clock-status{background:var(--mint-soft);color:#0E3B21;font-weight:700}
.clock-status b{letter-spacing:.06em}
.clock-toggle{background:#0E3B21}
[data-theme="dark"] .clock-status{background:#101B28;color:#C9A227}
/* chat widget: refinements */
.chat-fab{box-shadow:var(--sh-3)}
.chat-input button{display:flex;align-items:center;justify-content:center}
.chat-chips button:hover{border-color:#0E3B21;color:#0E3B21}

/* ============ SUBPAGE CORPORATE PASS ============ */
.page-hero{background:var(--green-deep);color:#FFFFFF;border-bottom:none;padding:48px 0 38px}
.page-hero h1{color:#FFFFFF}
.page-hero p{color:#E5DCC2}
.page-hero .sec-tag{background:rgba(255,255,255,.12);color:#C9A227}
.float-field{position:relative}
.float-field .eye{font-size:var(--fs-xs);font-weight:800;color:var(--mint);background:none;border:none;cursor:pointer;padding:4px 6px;white-space:nowrap}
.float-field input{padding-right:70px}
.side-toggle::after{content:"\2630";font-size:var(--fs-sm);font-weight:800}
#waList{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:10px}
.wa-card{padding:11px 13px;margin-bottom:0;gap:11px}
.wa-logo{width:42px;height:42px;flex:0 0 42px}
.status-dot{width:13px;height:13px;border-width:2.5px}
.wa-card b{font-size:var(--fs-sm)}
.map-frame{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line)}
.map-frame iframe{width:100%;height:230px;border:0;display:block}

/* ============ BEAUTY PASS: nav + buttons + icons (2026-09-15) ============ */
/* ---- header: logo left, links + theme pinned right in one row ---- */
.navbar .container{flex-wrap:nowrap}
.nav-links{flex:1 1 auto;justify-content:flex-end;margin-left:auto}
.nav-cta-row{margin-left:4px;flex:none}
.logo{transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.logo:hover{transform:translateY(-1px)}
.mark-img{border:1.5px solid #E5DCC2;box-shadow:var(--sh-2)}
.topbar{border-bottom:2px solid #C9A227}
/* ---- nav links: pill + gold underline sweep ---- */
.nav-links a{position:relative;padding:10px 14px;border-radius:var(--r-md);font-weight:700;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast);white-space:nowrap}
.nav-links a:not(.btn):hover{background:var(--mint-soft);color:#0E5A2E}
.nav-links a:not(.btn)::after{content:"";position:absolute;left:14px;right:14px;bottom:5px;height:2px;border-radius:var(--r-sm);background:#C9A227;transform:scaleX(0);transform-origin:left;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.nav-links a:not(.btn):hover::after{transform:scaleX(1)}
.nav-links .btn{margin-left:10px}
/* ---- theme button: gold-ringed circle ---- */
.theme-btn{width:42px;height:42px;border-radius:var(--r-pill);border:1.5px solid #C9A227;background:var(--paper);color:#C9A227;box-shadow:var(--sh-2);transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.theme-btn:hover{transform:rotate(20deg) scale(1.06);box-shadow:var(--sh-2)}
[data-theme="dark"] .theme-btn{background:var(--d-surface);color:#C9A227;border-color:#C9A227}
/* ---- buttons: rich gradients ---- */
.btn-mint{background:var(--green-deep)}
.btn-sun{background:var(--gold);color:#203040}
.btn-coral{background:var(--danger)}
.btn-sky{background:var(--green)}
.btn-grape{background:var(--green)}
.btn-white{border:1.5px solid var(--line)}
/* ---- icons ---- */
.feat .ic{color:#0E3B21;border-radius:var(--r-md);box-shadow:var(--sh-1)}
.prog .emoji{color:#0E3B21;box-shadow:var(--sh-2)}
.step .num{box-shadow:var(--sh-1);font-weight:800}
.stars{color:#C9A227;letter-spacing:3px}
.badge{letter-spacing:.04em}
.chip{box-shadow:var(--sh-1)}
.icon-btn{transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.icon-btn:hover{transform:translateY(-1px)}
.yt-thumb .play{background:rgba(12,27,20,.72);border:1.5px solid rgba(255,255,255,.75);backdrop-filter:blur(2px)}
.slider-arrow{width:42px;height:42px;border-radius:var(--r-pill);background:var(--paper);border:1px solid var(--line);box-shadow:var(--sh-2);color:#0E3B21;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.slider-arrow:hover{transform:scale(1.1)}
.slider-dots button,.testi-dots button{width:9px;height:9px;border-radius:var(--r-pill);border:none;background:#E5DCC2;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast);padding:0;cursor:pointer}
.slider-dots button.on,.testi-dots button.on{width:26px;background:#C9A227}
.pager-btn .arrow{display:inline-block;animation:none}
.pager-btn.next .arrow{animation-name:nudgeR}


/* ---- inputs + tables ---- */
.field input:focus,.field select:focus,.field textarea:focus,.toolbar input:focus,.toolbar select:focus,.chat-input input:focus{border-color:#0B7A37;box-shadow:var(--sh-1)}
.tbl tbody tr{transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.tbl tbody tr:hover{background:#EAF0F6}
[data-theme="dark"] .tbl tbody tr:hover{background:#101B28}
/* ---- scrollbars ---- */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#E5DCC2;border-radius:var(--r-pill);border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:#0E5A2E;background-clip:content-box}
/* ---- small screens: one row, links glide sideways ---- */
@media(max-width:760px){
  .logo>span small{display:none}
  .nav-links{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .nav-links::-webkit-scrollbar{display:none}
  .nav-links a{padding:9px 10px;font-size:var(--fs-sm)}
  .theme-btn{width:38px;height:38px;flex-basis:38px}
}

/* ============ HEADER MENU PASS (2026-09-15) ============ */
.navbar{box-shadow:var(--sh-2)}
.nav-links{flex-wrap:nowrap}
.theme-btn svg{display:block;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.theme-btn:hover{transform:scale(1.08)}
.theme-btn:hover svg{transform:rotate(30deg)}
/* ============ MOBILE NAV: two rows, everything visible, no hamburger (2026-09-16) ============ */
@media(max-width:880px){
  .burger{display:none!important}
  .navbar .container{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
  .navbar .logo{flex:1 1 0;min-width:0}
  .nav-cta-row{flex:1 1 0;margin-left:0;justify-content:flex-end}
  .nav-links{order:5;flex:1 1 100%;display:flex!important;flex-wrap:wrap;gap:8px;position:static;background:none;border:0;box-shadow:none;padding:0;overflow:visible}
  .nav-links a{flex:1 1 28%;display:flex;align-items:center;justify-content:center;min-height:46px;background:var(--cream);border:1px solid var(--line);border-radius:var(--r-md);padding:10px 6px;font-size:var(--fs-sm);font-weight:700;text-align:center}
  .nav-links a:not(.btn)::after{display:none}
  .nav-links .btn{margin:0;flex:1 1 44%;min-height:46px}
  [data-theme="dark"] .nav-links a{background:#1C2A24;border-color:#2A3A4E;color:#EAF0F6}
  .brand-name>span{font-size:var(--fs-xs);letter-spacing:.08em}
  .brand-name small{font-size:var(--fs-xs);letter-spacing:.2em}
}

/* ---- easy-mode: big touch targets, tap-to-call ---- */
.tb-contact a{color:inherit;font-weight:800;text-decoration:underline;text-underline-offset:3px}
.tb-contact svg{vertical-align:-2px;margin-right:2px}
@media(max-width:880px){
  .btn{min-height:44px}
  .btn-sm{min-height:40px}
}
@media(max-width:560px){
  .topbar [data-school-email]{display:none}
  .topbar .tb-sep{display:none}
}

/* chat button icon */
.chat-fab svg{display:block;pointer-events:none}

/* ---- aurora blurred-lights background (login + register) ---- */
.auth-wrap{background:var(--green-deep);overflow:hidden}
.auth-wrap::before{content:"";position:absolute;inset:-60px;z-index:0;pointer-events:none;
  background:var(--paper);
  filter:blur(60px);animation:none}
.auth-wrap>*{position:relative;z-index:var(--z-nav)}

@media (prefers-reduced-motion:reduce){.auth-wrap::before{animation:none}}
/* ---- faint light-glow on public pages ---- */
body:not(.portal-body)::before{content:"";position:fixed;top:0;left:0;right:0;height:520px;z-index:0;pointer-events:none;
  background:var(--paper)}

/* ============ HEADER: logo | centered school name | theme, links row (2026-09-16) ============ */
.navbar .logo{flex:1 1 0;min-width:0}
.brand-name{flex:0 1 auto;text-align:center;line-height:1.25;min-width:0}
.brand-name>span{font-family:var(--font-head);font-weight:800;font-size:var(--fs-lg);letter-spacing:.08em;word-spacing:.1em;text-transform:uppercase;color:#0E3B21;white-space:nowrap}
.brand-name small{display:block;font-size:var(--fs-xs);font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:#5C6B7A;margin-top:2px;white-space:nowrap}
.nav-cta-row{flex:1 1 0;justify-content:flex-end;margin-left:0}
.nav-links{order:5;flex:1 1 100%;justify-content:center;margin-left:0}
[data-theme="dark"] .brand-name>span{color:var(--ink)}
[data-theme="dark"] .brand-name small{color:#9AA7B8}
@media(max-width:560px){
  .brand-name>span{font-size:var(--fs-xs);letter-spacing:.04em;white-space:normal}
  .brand-name small{display:none}
}

/* ============ DARK MODE CONTRAST PASS (2026-09-16): no faint text ============ */
[data-theme="dark"] .panel,[data-theme="dark"] .prod,[data-theme="dark"] .p-card,
[data-theme="dark"] a.class-card,[data-theme="dark"] .act-card,
[data-theme="dark"] .ne-row,[data-theme="dark"] .ne-card,
[data-theme="dark"] .masonry .m-item,[data-theme="dark"] .testi-card,
[data-theme="dark"] .step,[data-theme="dark"] .gal,[data-theme="dark"] .wa-card,
[data-theme="dark"] .prog-card
{background:#101B28;border-color:#2A3A4E;color:#EAF0F6}
[data-theme="dark"] input,[data-theme="dark"] select,[data-theme="dark"] textarea{background:#101B28;border-color:#2A3A4E;color:#EAF0F6}
[data-theme="dark"] .prod .price{color:#C9A227}
[data-theme="dark"] .prod .cls,[data-theme="dark"] .p-card-meta{color:#9AA7B8}
[data-theme="dark"] .prod-ico{background:#1C2A24;color:#C9A227}
[data-theme="dark"] .act-card svg{color:#0B7A37}
[data-theme="dark"] .ref-big{background:#101B28;border-color:#0B7A37;color:#EAF0F6}
[data-theme="dark"] .qty button{background:#2A3A4E;color:#EAF0F6}
[data-theme="dark"] .qty b{color:#EAF0F6}
[data-theme="dark"] .att-bar{background:#2A3A4E}
[data-theme="dark"] .hl,[data-theme="dark"] .hero h1 em{color:#0B7A37}
[data-theme="dark"] .hero h1 .w-sun{color:#C9A227}
[data-theme="dark"] .slider-arrow{background:#2A3A4E;color:#FFFFFF;border-color:#2A3A4E}
[data-theme="dark"] .pager-btn{background:#203040;color:#EAF0F6;border-color:#2A3A4E}
[data-theme="dark"] .pager-info{color:#9AA7B8}
[data-theme="dark"] .empty,[data-theme="dark"] .sub{color:#9AA7B8}
[data-theme="dark"] .yt-meta small,[data-theme="dark"] .ne-meta span{color:#9AA7B8}
[data-theme="dark"] .m-dl{background:rgba(231,185,75,.92);color:#203040}
[data-theme="dark"] .testi-card b{color:#C9A227}
[data-theme="dark"] .gal .cap,[data-theme="dark"] .cap{color:#EAF0F6}
[data-theme="dark"] .topbar{background:#0E3B21}
[data-theme="dark"] .portal-link{color:#FFFFFF}
[data-theme="dark"] .page-hero h1{color:#FFFFFF}
[data-theme="dark"] .chip.on{background:#C9A227;border-color:#C9A227;color:#203040}

/* ============ BATCH 2026-09-16: rails, likes/comments, dark sky ============ */
/* footer: compact height */
.site-footer{padding:26px 0 0}
.foot-main{gap:20px;margin-bottom:16px}
.foot-col h4{margin-bottom:8px}
.foot-brand p{margin:8px 0 0}
.foot-bottom{padding:10px 0}
.foot-contact .foot-map{display:inline;padding:0;color:#E5DCC2;text-decoration:underline dotted}
.foot-contact .foot-map:hover{color:#FFFFFF}
/* stories rail: 2 visible, swipe sideways */
.ne-list{flex-direction:row;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 4px 16px;scrollbar-width:thin;cursor:grab}
.ne-row{flex:0 0 clamp(290px,46%,440px);flex-direction:column;align-items:stretch;scroll-snap-align:start;gap:12px}
.ne-row:hover{transform:translateY(-3px)}
.ne-row img{width:100%;height:160px;flex:none;object-fit:cover}
.ne-row .txt{min-width:0}
.ne-row h3{font-size:var(--fs-base);margin-bottom:4px}
.ne-row p{white-space:normal;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ne-row>b:last-child{display:none}
/* gallery label tags (NEWS / EVENT on story covers) */
.m-item .m-tag{position:absolute;top:10px;left:10px;font-size:var(--fs-xs);font-weight:800;letter-spacing:.06em;padding:4px 10px;border-radius:var(--r-pill);color:#FFFFFF;box-shadow:var(--sh-1)}
.m-tag.b-sky{background:#5C6B7A}.m-tag.b-coral{background:#B31E35}
/* video cards: unmistakable */
.yt-card.is-video .play{transform:scale(1.3)}
.yt-card.is-video{outline:2px solid var(--coral);outline-offset:-2px}
/* video modal player */
#videoModal .modal{max-width:720px;background:#101B28;color:#FFFFFF}
#videoModal h3{margin-bottom:12px;font-size:var(--fs-base)}
#videoModal video{width:100%;border-radius:var(--r-md);background:#101B28;max-height:62vh}
#videoModal iframe{width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:var(--r-md);background:#101B28}
/* story page: photo thumbs, likes, comments */
.story-thumbs{display:flex;gap:10px;margin:-8px 0 24px;overflow-x:auto;padding-bottom:6px}
.story-thumbs img{width:96px;height:72px;object-fit:cover;border-radius:var(--r-md);cursor:pointer;border:2px solid transparent;flex:none}
.story-thumbs img.on{border-color:var(--mint)}
.like-row{display:flex;align-items:center;gap:18px;margin:20px 0 6px;flex-wrap:wrap}
.like-btn{display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:none;cursor:pointer;color:var(--muted);font-weight:800;padding:6px 10px}
.like-btn svg{width:30px;height:30px}
.like-btn .lc{font-size:var(--fs-sm)}
.like-btn.on{color:var(--mint)}
.like-btn:not(.on):hover{color:var(--ink)}
.cmt-box{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);padding:20px;margin-top:22px}
.cmt{border-top:1px solid var(--line);padding:12px 0}
.cmt:first-child{border-top:none}
.cmt p{margin:4px 0 0}
.cmt small{color:var(--muted)}
#cmtSort{font-family:inherit;font-size:var(--fs-sm);padding:6px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper)}
/* chatbot typing caret */
.tcaret{display:inline-block;width:2px;height:1em;background:var(--mint);vertical-align:-2px;animation:none;margin-left:1px}
/* popups: blurred background + stronger glass */
.modal-bg{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.glass{background:rgba(255,255,255,.88);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.7)}
[data-theme="dark"] .glass{background:rgba(24,36,52,.9)}
/* auth logo: always centered */
.auth-logo{display:flex;flex-direction:column;align-items:center;text-align:center}
/* dark mode: global readability */
[data-theme="dark"] body{background:var(--d-surface);color:#EAF0F6}
[data-theme="dark"] h1,[data-theme="dark"] h2,[data-theme="dark"] h3,[data-theme="dark"] h4{color:#EAF0F6}
[data-theme="dark"] p,[data-theme="dark"] li,[data-theme="dark"] td,[data-theme="dark"] th,[data-theme="dark"] label,[data-theme="dark"] .field,[data-theme="dark"] .ne-meta span,[data-theme="dark"] .txt h3,[data-theme="dark"] .body h3,[data-theme="dark"] .faq-q{color:#EAF0F6}
[data-theme="dark"] .body p,[data-theme="dark"] .txt p,[data-theme="dark"] .sec-head p,[data-theme="dark"] small,[data-theme="dark"] .faq-a,[data-theme="dark"] .story-body p,[data-theme="dark"] .cmt p{color:#9AA7B8}
[data-theme="dark"] .btn-white{background:#2A3A4E;color:var(--ink);border-color:#2A3A4E}
[data-theme="dark"] .story-body,[data-theme="dark"] .cmt-box{background:#101B28;border-color:#2A3A4E}
[data-theme="dark"] .cmt{border-color:#2A3A4E}
[data-theme="dark"] .like-btn:not(.on){color:#9AA7B8}
[data-theme="dark"] .pager-info,[data-theme="dark"] .swipe-hint{color:#9AA7B8}
[data-theme="dark"] .ne-row,[data-theme="dark"] .yt-card,[data-theme="dark"] .news-card{background:#101B28;border-color:#2A3A4E}
[data-theme="dark"] .rail-btns button{background:#2A3A4E;color:#EAF0F6;border-color:#2A3A4E}
[data-theme="dark"] #cmtSort{background:#101B28;color:var(--ink);border-color:#2A3A4E}
[data-theme="dark"] input,[data-theme="dark"] select,[data-theme="dark"] textarea{background:#101B28;color:var(--ink);border-color:#2A3A4E}
[data-theme="dark"] input::placeholder,[data-theme="dark"] textarea::placeholder{color:#9AA7B8}

/* ============ SHOP BATCH: stock, orders, printable slips ============ */
.stock{font-size:var(--fs-xs);font-weight:800;color:#0B7A37}
.stock.out{color:#B31E35}
.backorder{font-size:var(--fs-xs);color:#C9A227;font-weight:600}
.slip{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);padding:22px;color:#203040}
.slip-head{text-align:center;margin-bottom:6px}
.slip-head b{display:block;font-size:var(--fs-base)}
.slip h3{text-align:center;letter-spacing:.2em;font-size:var(--fs-sm);margin:8px 0}
.slip-tbl{width:100%;border-collapse:collapse;font-size:var(--fs-sm);margin-top:10px}
.slip-tbl td,.slip-tbl th{border-bottom:1px dashed #EAF0F6;padding:6px 4px;text-align:left}
.slip-tbl.items th{background:var(--cream)}
.slip-tbl.items td:nth-child(n+2),.slip-tbl.items th:nth-child(n+2){text-align:right}
.slip-total{text-align:right;font-weight:800;font-size:var(--fs-base);margin-top:10px}
.slip-note{font-size:var(--fs-xs);background:var(--cream);border-radius:var(--r-sm);padding:8px 10px;margin-top:10px}
#printSlip{display:none}
@media print{
  body.printing>*:not(#printSlip){display:none!important}
  body.printing #printSlip{display:block!important;position:static}
  #printSlip .slip{border:none;padding:0;background:var(--paper)!important;color:#203040!important}
  #printSlip .slip-tbl.items th{background:#EAF0F6!important}
  #printSlip .slip-note{background:var(--paper)!important;color:var(--ink)!important}
  #printSlip .slip-total,#printSlip .slip-head b,#printSlip h3{color:#203040!important}
  .modal-bg,.chat-fab,.chat-panel,.clock-widget,#toast,.topbar,.navbar,.page-hero,footer{display:none!important}
}
[data-theme="dark"] .slip{background:#101B28;color:#EAF0F6;border-color:#2A3A4E}
[data-theme="dark"] .slip-tbl.items th{background:#101B28}
[data-theme="dark"] .slip-note{background:#101B28}
[data-theme="dark"] .slip-tbl td,[data-theme="dark"] .slip-tbl th{border-color:#2A3A4E}

/* ============ APPROVED BATCH: tags, lightbox, banners, timetable ============ */
.tag-new{background:#B31E35;color:#FFFFFF;font-size:var(--fs-xs);font-weight:800;padding:2px 8px;border-radius:var(--r-pill);letter-spacing:.08em;margin-left:8px;animation:none;white-space:nowrap}
/* lightbox */
.lightbox{position:fixed;inset:0;z-index:var(--z-modal);background:rgba(8,14,22,.92);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:18px}
.lb-box{position:relative;max-width:min(920px,100%);width:100%;text-align:center}
.lb-img{max-width:100%;max-height:74vh;border-radius:var(--r-md);box-shadow:var(--sh-3)}
.lb-cap{color:#EAF0F6;font-weight:700;margin-top:10px}
.lb-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap}
.lb-count{color:#9AA7B8;font-weight:800}
.lb-btns{display:flex;gap:8px}
.lb-x{position:absolute;top:-8px;right:-4px;width:42px;height:42px;border-radius:var(--r-pill);border:none;background:#B31E35;color:#FFFFFF;font-size:var(--fs-lg);cursor:pointer;line-height:1}
.lb-arrow{position:absolute;top:38%;width:46px;height:46px;border-radius:var(--r-pill);border:none;background:rgba(255,255,255,.14);color:#FFFFFF;font-size:var(--fs-lg);cursor:pointer;line-height:1}
.lb-prev{left:-4px}.lb-next{right:-4px}
.lb-arrow:hover{background:rgba(255,255,255,.28)}
@media(max-width:560px){.lb-arrow{top:auto;bottom:52px}}
/* emergency banner */
.emg-banner{position:sticky;top:0;z-index:var(--z-modal);background:#B31E35;color:#FFFFFF;text-align:center;font-weight:800;padding:10px 14px;font-size:var(--fs-sm);display:flex;gap:10px;align-items:center;justify-content:center}
.emg-dot{width:10px;height:10px;border-radius:var(--r-pill);background:var(--paper);animation:none;flex:none}
/* birthday banner */
.bday-banner{background:var(--green-deep);color:#FFFFFF;border-radius:var(--r-lg);padding:16px 20px;margin:18px 0;box-shadow:var(--sh-3)}
.bday-banner b{font-size:var(--fs-base)}
.bday-soon{margin-top:8px;font-size:var(--fs-sm);color:#EAF0F6;font-weight:600}
/* timetable */
table.tbl.tt th{background:#0E3B21;color:#FFFFFF}
table.tbl.tt td:first-child{font-weight:800;background:var(--cream)}
[data-theme="dark"] table.tbl.tt td:first-child{background:#101B28}
.tt-input{width:100%;font:inherit;padding:6px 8px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);color:var(--ink);font-size:var(--fs-xs)}
[data-theme="dark"] .tt-input{background:#101B28;border-color:#2A3A4E;color:var(--ink)}
/* status tracker */
.track-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);padding:16px 18px;margin-top:12px;box-shadow:var(--sh-1)}
[data-theme="dark"] .track-card{background:#101B28;border-color:#2A3A4E}

/* ============ BEAUTIFICATION: brand butter+green, nav, buttons, cards ============ */
:root{--brand:#0B7A37;--brand-dark:#0E5A2E;--brand-deep:#0E3B21;--butter:#E5DCC2;--butter-deep:#C9A227;--butter-soft:#F8F4E4}
/* nav links: butter underline style, not pills */
.nav-links a:not(.btn){position:relative;border-radius:0;padding:9px 4px;margin:0 9px}
.nav-links a:not(.btn)::after{content:"";position:absolute;left:0;right:100%;bottom:2px;height:3px;border-radius:var(--r-sm);background:var(--green-deep);transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.nav-links a:not(.btn):hover{background:none;color:var(--brand)}
.nav-links a:not(.btn):hover::after{right:0}
.nav-links a:not(.btn).on{color:var(--brand)}
.nav-links a:not(.btn).on::after{right:0}
@media(max-width:860px){.nav-links a:not(.btn){margin:0 4px;padding:7px 4px}}
/* nav CTA button */
.nav-links .btn{border-radius:var(--r-md);border-color:transparent;background:var(--green-deep);color:#FFFFFF;box-shadow:var(--sh-2)}
.nav-links .btn:hover{transform:translateY(-2px);box-shadow:var(--sh-2);color:#FFFFFF}
/* buttons: gradients + lift */
.btn{border-radius:var(--r-md);font-weight:700;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.btn-mint{background:var(--green-deep);border-color:transparent;color:#FFFFFF;box-shadow:var(--sh-2)}
.btn-mint:hover{transform:translateY(-2px);filter:brightness(1.07);color:#FFFFFF}
.btn-sun{background:var(--gold);border-color:transparent;color:#203040;box-shadow:var(--sh-2)}
.btn-sun:hover{transform:translateY(-2px);color:#203040}
.btn-coral{background:var(--danger);border-color:transparent;box-shadow:var(--sh-2)}
.btn-coral:hover{transform:translateY(-2px);color:#FFFFFF}
.btn-sky{background:var(--green);border-color:transparent;box-shadow:var(--sh-2)}
.btn-sky:hover{transform:translateY(-2px);color:#FFFFFF}
.btn-grape{background:var(--green);border-color:transparent}
.btn-grape:hover{transform:translateY(-2px);color:#FFFFFF}
.btn-white{border:2px solid var(--line)}
.btn-white:hover{border-color:var(--brand);color:var(--brand);transform:translateY(-2px)}
.btn-sm{border-radius:var(--r-md)}
/* chips: rounded squares, green active */
.chip,.pill-btn{border-radius:var(--r-md);border:1.5px solid var(--line);font-weight:700}
.chip:hover,.pill-btn:hover{border-color:var(--brand);color:var(--brand)}
.chip.on,.pill-btn.on{background:var(--green-deep);border-color:transparent;color:#FFFFFF;box-shadow:var(--sh-2)}
.icon-btn{border-radius:var(--r-md);border:1.5px solid var(--line)}
.icon-btn:hover{border-color:var(--brand);color:var(--brand)}
/* program cards with art */
.prog{padding:0 0 28px}
.prog-art{width:100%;height:180px;object-fit:contain;background:var(--paper);display:block;border-bottom:1px solid var(--line)}
.prog:hover .prog-art{transform:scale(1.03)}
.prog-art{transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.prog h3{margin:16px 26px 4px}
.prog .ages{margin:0 26px}
.prog ul{margin:12px 26px 20px}
.prog .btn{margin:0 26px}
.prog.p1::before{background:var(--butter-deep)}
.prog.p2::before{background:var(--brand)}
.prog.p3::before{background:var(--green-deep)}
/* why icons */
.why-ic{width:84px;height:84px;object-fit:contain;display:block;margin:0 auto 10px;background:var(--paper);border-radius:var(--r-lg);padding:6px;box-shadow:var(--sh-2);transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.feat:hover .why-ic{transform:scale(1.1) rotate(2deg)}
.feat{border-top:4px solid transparent}
.feat:hover{border-top-color:var(--butter-deep)}
/* steps: butter medallions */
.step .num{background:var(--gold);color:var(--brand-deep)!important;box-shadow:var(--sh-2);font-weight:800}
/* section tags: brand green */
.sec-tag{background:var(--green-deep);color:#FFFFFF;border:none;box-shadow:var(--sh-2)}
/* shop banner */
.shop-banner{width:100%;border-radius:var(--r-lg);box-shadow:var(--sh-1);margin-bottom:20px;display:block}
/* login side art */
.auth-art{width:100%;border-radius:var(--r-lg);box-shadow:var(--sh-1);display:block;background:var(--paper)}

/* ============ BATCH: loader, shop photos, contact fabs, teachers, spotlight ============ */
#siteLoader{position:fixed;inset:0;z-index:var(--z-toast);background:var(--paper);display:flex;flex-direction:column;gap:14px;align-items:center;justify-content:center;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
#siteLoader.done{opacity:0;pointer-events:none}
#siteLoader img{width:84px;height:84px;object-fit:contain;animation:none}
#siteLoader .spin{width:38px;height:38px;border-radius:var(--r-pill);border:4px solid var(--butter-soft,#F8F4E4);border-top-color:var(--brand,#0B7A37);animation:lspin .8s linear infinite}
@keyframes lspin{to{transform:rotate(360deg)}}

/* shop real photos */
.prod-img{width:100%;height:132px;object-fit:cover;border-radius:var(--r-md);display:block}
.cart-thumb{width:44px;height:44px;object-fit:cover;border-radius:var(--r-md);flex:none}

/* teachers strip */
.team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px}
.team-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px 12px;text-align:center;box-shadow:var(--sh-1)}
[data-theme="dark"] .team-card{background:#101B28;border-color:#2A3A4E}
.team-card img{width:84px;height:84px;border-radius:var(--r-pill);object-fit:cover;border:3px solid var(--butter-deep,#C9A227);margin-bottom:8px}
/* spotlight */
.spot-card{display:grid;grid-template-columns:minmax(220px,380px) 1fr;gap:20px;align-items:center;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-1)}
[data-theme="dark"] .spot-card{background:#101B28;border-color:#2A3A4E}
.spot-card img{width:100%;height:100%;min-height:220px;object-fit:cover;display:block}
.spot-card .spot-txt{padding:24px}
@media(max-width:680px){.spot-card{grid-template-columns:1fr}}

/* ============ OFFICIAL FLAT STYLE (per headmistress) ============ */
.btn:hover{transform:none}
.btn-mint{background:#0B7A37;border:2px solid #C9A227;color:#FFFFFF;box-shadow:var(--sh-1)}
.btn-mint:hover{background:#0E5A2E;filter:none;color:#FFFFFF}
.btn-sun{background:#E5DCC2;border:2px solid #0E5A2E;color:#203040;box-shadow:none}
.btn-sun:hover{background:#C9A227;color:#203040}
.btn-coral{background:#B31E35;border-color:#B31E35;box-shadow:none}
.btn-coral:hover{background:#B31E35;color:#FFFFFF}
.btn-sky{background:#5C6B7A;border-color:#5C6B7A;box-shadow:none}
.btn-sky:hover{background:#5C6B7A;color:#FFFFFF}
.btn-grape{background:#5C6B7A;border-color:#5C6B7A}
.btn-grape:hover{background:#5C6B7A;color:#FFFFFF}
.btn-white{border:2px solid #0B7A37}
.btn-white:hover{border-color:#0E5A2E;color:#0E5A2E}
.chip.on,.pill-btn.on{background:#0B7A37;box-shadow:none}
.nav-links .btn{background:#0B7A37;border:2px solid #C9A227;box-shadow:none}
.nav-links .btn:hover{box-shadow:none}
/* motto ribbon under navbar */
.motto-ribbon{background:var(--green-deep);color:#E5DCC2;text-align:center;font-family:var(--font-head);font-weight:700;letter-spacing:.14em;font-size:var(--fs-xs);padding:7px 12px;text-transform:uppercase}
/* homepage countdown bar */
.count-bar{display:flex;gap:12px;align-items:center;background:#0B7A37;color:#FFFFFF;border:2px solid #C9A227;border-radius:var(--r-md);padding:10px 16px;margin:16px 0;font-weight:600}
.count-bar:hover{color:#FFFFFF}
.count-num{background:#E5DCC2;color:#0E3B21;font-weight:800;border-radius:var(--r-md);min-width:44px;text-align:center;padding:4px 8px;font-size:var(--fs-base)}
/* birthday wish bubbles */
.wish-bubble{background:#0B7A37;color:#FFFFFF;border-radius:var(--r-lg);padding:14px 16px;margin-bottom:12px;box-shadow:var(--sh-1)}
.wish-bubble b.who{font-size:var(--fs-base)}
.wish-bubble .when{font-size:var(--fs-xs);opacity:.85;font-weight:700}

/* ============ FIXES: loader logo, topbtn, steps row, gal 3-col, testi rail, anchors ============ */
#siteLoader img{width:84px;height:84px;object-fit:contain;background:var(--paper);border-radius:var(--r-lg);padding:10px;box-shadow:var(--sh-3);border:3px solid var(--butter-deep,#C9A227);animation:none}
/* back to top + hide widgets at footer */
body.at-bottom #chatFab,body.at-bottom #clockWidget{display:none!important}
#topBtn{position:fixed;right:16px;bottom:16px;z-index:var(--z-modal);width:52px;height:52px;border-radius:var(--r-pill);border:2px solid #C9A227;background:#0B7A37;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--sh-2);opacity:0;pointer-events:none;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
#topBtn.show{opacity:1;pointer-events:auto}
/* steps: side-by-side with arrows */
.steps{display:flex;gap:36px;overflow-x:auto;padding:12px 4px 20px;margin-bottom:30px;scroll-snap-type:x mandatory}
.step{flex:0 0 235px;scroll-snap-align:start;position:relative}
.step:not(:last-child)::after{content:"→";position:absolute;right:-31px;top:44px;font-size:var(--fs-lg);font-weight:800;color:#0B7A37}
/* homepage gallery: 3 side by side */
.gal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:680px){.gal-grid{grid-template-columns:repeat(3,1fr);gap:10px}}
/* testimonials: swipe rail */
.testi-rail{display:flex;gap:16px;overflow-x:auto;padding:6px 2px 16px;scroll-snap-type:x mandatory}
.testi-rail .testi-card{flex:0 0 min(340px,85vw);scroll-snap-align:start;margin:0}
.testi-rail .stars{color:#C9A227;font-size:var(--fs-sm);letter-spacing:2px;margin-bottom:8px}
/* stop content hiding under sticky navbar */
html{scroll-padding-top:150px}
section[id],div[id]{scroll-margin-top:130px}
/* batch7: ticker + birthday bell + stars of week + slots */
.ticker{background:#0E3B21;color:#E5DCC2;overflow:hidden;white-space:nowrap;border-top:1px solid rgba(247,233,103,.35)}
.ticker-inner{display:inline-flex;min-width:max-content;gap:0;animation:tick 28s linear infinite;padding:7px 0;font-weight:700;font-size:var(--fs-sm);letter-spacing:.02em;will-change:transform}
.ticker-inner span{padding:0 46px}
.ticker-inner>.tick-content{display:inline-flex;align-items:center;padding:0}
/* batch25: round logout button sitting right beside the day/night switch */
.nav-logout{width:42px;height:42px;border-radius:var(--r-pill);border:1.5px solid #E5DCC2;background:var(--paper);color:#B31E35;display:inline-flex;align-items:center;justify-content:center;padding:0;cursor:pointer;box-shadow:var(--sh-2);transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast);flex:none}
.nav-logout:hover{background:var(--danger);color:#FFFFFF;transform:scale(1.1) rotate(-6deg);box-shadow:var(--sh-2)}
[data-theme="dark"] .nav-logout{background:var(--paper);color:#B31E35;border-color:#B31E35}
@keyframes tick{from{transform:translateX(100vw)}to{transform:translateX(-100%)}}
.bday-bell{margin:18px auto 0;max-width:860px;background:var(--paper);border:2px solid #C9A227;border-radius:var(--r-lg);padding:14px 18px;text-align:center;color:#1C2A24;box-shadow:var(--sh-2)}
.bday-bell a{color:#0E5A2E;font-weight:800}
.stars-week{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:18px}
.star-card{background:var(--paper);border:3px solid #C9A227;border-radius:var(--r-lg);padding:22px;text-align:center;box-shadow:var(--sh-3);position:relative}
.star-card::before{content:"STAR OF THE WEEK";position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:#C9A227;color:#FFFFFF;font-size:var(--fs-xs);font-weight:800;letter-spacing:.12em;padding:3px 14px;border-radius:var(--r-lg);white-space:nowrap}
.star-card .avatar-big{width:74px;height:74px;border-radius:var(--r-pill);margin:6px auto 10px;display:flex;align-items:center;justify-content:center;font-size:var(--fs-lg);font-weight:800;color:#FFFFFF;background:var(--green-deep);border:3px solid #FFFFFF;box-shadow:var(--sh-2)}
.star-card h3{margin:4px 0 2px;color:#0E3B21}
.star-card .wk{display:inline-block;margin-top:8px;background:#0E5A2E;color:#E5DCC2;font-size:var(--fs-xs);font-weight:700;padding:4px 12px;border-radius:var(--r-lg)}
.slot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin:16px 0}
.slot{border:2px solid var(--line,#EAF0F6);border-radius:var(--r-md);padding:12px;text-align:center;background:var(--paper)}
.slot b{display:block;font-size:var(--fs-base)}
.slot small{color:var(--muted,#5C6B7A)}
.slot.taken{opacity:.55;background:var(--cream);border-style:dashed}
.slot.picked{border-color:#0E5A2E;background:#EAF0F6;box-shadow:var(--sh-1)}
.hw-row{display:flex;gap:12px;align-items:flex-start;background:var(--paper);border:1px solid var(--line,#EAF0F6);border-radius:var(--r-md);padding:14px 16px;margin-bottom:10px}
.hw-row .avatar{flex:none}
@media(max-width:640px){.ticker-inner{animation-duration:18s}}
.quick-strip{display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap;font-weight:700}
.quick-strip a{color:var(--green,#0E5A2E);text-decoration:underline;text-underline-offset:3px}
.quick-strip span{color:var(--muted,#9AA7B8)}

/* ============ CONTRAST FIX PASS (2026-09-16): every text readable, day + night ============ */
:root{color-scheme:light}
[data-theme="dark"]{color-scheme:dark}
/* avatars: white initials on deepened brand colors */
.avatar{color:#FFFFFF!important;text-shadow:0 1px 3px rgba(0,0,0,.5)}
/* badges in dark: light text on deep tints */
[data-theme="dark"] .b-green{background:#0E3B21;color:#0B7A37}
[data-theme="dark"] .b-sun{background:#1C2A24;color:#C9A227}
[data-theme="dark"] .b-sky{background:#203040;color:#9AA7B8}
[data-theme="dark"] .b-coral{background:#1C2A24;color:#B31E35}
[data-theme="dark"] .b-grape{background:#203040;color:#9AA7B8}
[data-theme="dark"] .b-grey{background:#2A3A4E;color:#E5DCC2}
/* light cards → dark cards */
[data-theme="dark"] .p-stat,[data-theme="dark"] .pill-date,
[data-theme="dark"] .quote-card,[data-theme="dark"] .tl-item,
[data-theme="dark"] .form-card,[data-theme="dark"] .mv-card,
[data-theme="dark"] .hw-row,[data-theme="dark"] .slot,
[data-theme="dark"] .login-card,[data-theme="dark"] .auth-card,
[data-theme="dark"] .chat-chips button
{background:#101B28;border-color:#2A3A4E;color:#EAF0F6}
[data-theme="dark"] .login-card>p,[data-theme="dark"] .form-card>p{color:#9AA7B8}
[data-theme="dark"] .slot.taken{background:#101B28}
[data-theme="dark"] .slot.picked{background:#0E3B21;border-color:#0B7A37}
[data-theme="dark"] .promo-sun{background:var(--d-surface)}
[data-theme="dark"] .promo-sky{background:var(--d-surface)}
[data-theme="dark"] .promo-mint{background:var(--d-surface)}
[data-theme="dark"] .promo-coral{background:var(--d-surface)}
[data-theme="dark"] .promo-grape{background:var(--d-surface)}
/* gold features keep warm identity in dark */
[data-theme="dark"] .star-card{background:var(--d-surface);border-color:#C9A227}
[data-theme="dark"] .star-card h3{color:#E5DCC2}
[data-theme="dark"] .star-card .sub{color:#E5DCC2}
[data-theme="dark"] .bday-bell{background:var(--paper);border-color:#C9A227;color:#E5DCC2}
[data-theme="dark"] .bday-bell a{color:#0B7A37}
/* small status texts in dark */
[data-theme="dark"] .icon-btn.ok{background:#0E3B21;border-color:#0E5A2E;color:#0B7A37}
[data-theme="dark"] .icon-btn.del{background:#1C2A24;border-color:#B31E35;color:#B31E35}
[data-theme="dark"] .stock{color:#0B7A37}
[data-theme="dark"] .stock.out{color:#B31E35}
[data-theme="dark"] .backorder{color:#C9A227}
[data-theme="dark"] .check-list li::before{background:#0E3B21;color:#0B7A37}
[data-theme="dark"] .like-btn.on{color:#0B7A37}
[data-theme="dark"] .step:not(:last-child)::after{color:#0B7A37}
[data-theme="dark"] .float-field .eye{color:#0B7A37}
/* day-mode nits */
.foot-bottom{color:#9AA7B8}
.backorder{color:#B31E35}

/* ============ DESIGNED BACKGROUNDS (2026-09-16): institutional, butter + green ============ */
body{background:var(--paper)}
body:not(.portal-body)::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:var(--paper)}
[data-theme="dark"] body{background:var(--d-surface);color:#EAF0F6}
.hero{position:relative}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:none;background-size:22px 22px;-webkit-mask-image:none;mask-image:none}
[data-theme="dark"] .hero::before{background-image:none}
.hero>*{position:relative}
.page-hero{position:relative;overflow:hidden;border-bottom:3px solid #C9A227}
.page-hero::after{content:"";position:absolute;inset:0;pointer-events:none;background:var(--paper)}
.page-hero .container{position:relative;z-index:var(--z-nav)}
.stats-band{position:relative;overflow:hidden;background:var(--green-deep)}
.stats-band::before{content:"";position:absolute;inset:0;pointer-events:none;background:var(--paper)}
.stats-band .container{position:relative}
.cta-band{position:relative;overflow:hidden}
.cta-band::before{content:"";position:absolute;right:-70px;top:-70px;width:260px;height:260px;border-radius:var(--r-pill);background:var(--paper);pointer-events:none}
.cta-band::after{content:"";position:absolute;right:30px;bottom:-90px;width:200px;height:200px;border-radius:var(--r-pill);border:26px solid rgba(247,233,103,.10);pointer-events:none}
.cta-band>*{position:relative}
.site-footer{border-top:3px solid #C9A227}
.side-logo,.side-user,.side-nav,.side-foot{position:relative}
.sidebar::after{content:"";position:absolute;inset:0;pointer-events:none;background:var(--paper)}

/* ============ PRINT: report cards + slips always print clean ============ */
@media print{
  body{background:var(--paper)!important;color:#203040!important}
  .panel,.modal,.track-card,.slip,.tl-item,.quote-card,.mv-card,.form-card,.login-card{background:var(--paper)!important;color:#203040!important;border-color:#E5DCC2!important;box-shadow:none!important}
  h1,h2,h3,h4,p,li,td,th,label,small,span,b,div{color:#203040!important}
  .tbl th{background:var(--paper)!important;color:#203040!important;border:1px solid #9AA7B8!important}
  .tbl td{border-color:#9AA7B8!important}
  .btn,.toolbar,.no-print,.sidebar,.p-topbar,.side-toggle,.menu-veil,#toast,.topbar,.navbar,.page-hero,footer,.site-footer,.chat-fab,.chat-panel,.clock-widget,#topBtn,#newsTicker,.ticker,.motto-ribbon,#emgBanner,.emg-banner{display:none!important}
  .main,.view-section{padding:0!important;margin:0!important}
}
/* page banners for new sections */
.page-banner{width:100%;height:230px;object-fit:cover;border-radius:var(--r-lg);box-shadow:var(--sh-1);margin-bottom:20px;display:block}
@media(max-width:640px){.page-banner{height:150px}}
/* portals: chatbot yes, clock no (would cover the sidebar footer) */
.portal-body #clockWidget{display:none!important}
/* ---------- Nav polish (batch 11): space, active state, mobile two-row ---------- */
.nav-links{gap:6px}
.nav-links a{position:relative;padding:10px 15px;letter-spacing:.01em;border-radius:var(--r-sm);transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.nav-links a:not(.btn):hover{color:var(--green);background:var(--mint-soft)}
.nav-links a:not(.btn)::after{content:"";position:absolute;left:15px;right:15px;bottom:5px;height:2px;border-radius:var(--r-sm);background:var(--green);transform:scaleX(0);transform-origin:left;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.nav-links a:not(.btn):hover::after{transform:scaleX(1)}
.nav-links a.on{color:var(--green);background:#EAF0F6;font-weight:800}
.nav-links a.on::after{transform:scaleX(1)}
.nav-links .nav-cta{margin-left:10px}
@media(max-width:680px){
  .nav-links{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;width:100%;order:3;margin-left:0;background:var(--cream);border-radius:var(--r-md);padding:8px}
  .nav-links a{font-size:var(--fs-sm);padding:10px 8px;text-align:center;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md)}
  .nav-links a:not(.btn)::after{display:none}
  .nav-links a.on{background:#0B7A37;color:#FFFFFF;border-color:#0B7A37}
  .nav-links .nav-cta{margin-left:0;grid-column:1/-1}
}
/* ---------- Footer visit col + slim footer ---------- */
.foot-visit p{display:flex;gap:8px;align-items:flex-start;margin:0 0 12px}
/* ---------- Birthday countdown bar ---------- */
#bdayCount .count-bar{background:var(--paper);color:#0E3B21;border-color:#C9A227}
#bdayCount .count-bar:hover{color:#0E3B21}
#bdayCount .count-num{background:#0B7A37;color:#FFFFFF}
/* ---------- Site search (batch 12) ---------- */
.search-veil{position:fixed;inset:0;z-index:var(--z-modal);background:rgba(8,20,14,.55);backdrop-filter:blur(3px);display:none;align-items:flex-start;justify-content:center;padding:12vh 16px 16px}
.search-veil.open{display:flex}
.search-box{background:var(--paper);border-radius:var(--r-lg);box-shadow:var(--sh-3);width:min(520px,100%);padding:16px;border-top:5px solid #0B7A37}
.search-row{display:flex;gap:8px}
.search-row input{flex:1;font:inherit;font-size:var(--fs-sm);padding:11px 14px;border:2px solid #0B7A37;border-radius:var(--r-md);background:var(--paper);color:#203040}
.search-row input:focus{outline:none;border-color:#C9A227}
#searchX{border:none;background:var(--cream);color:#203040;font-size:var(--fs-md);line-height:1;width:44px;border-radius:var(--r-md);cursor:pointer;font-weight:800}
.search-res{margin-top:10px;display:flex;flex-direction:column;gap:6px;max-height:46vh;overflow-y:auto}
.search-res a{display:block;padding:10px 14px;border:1px solid var(--line);border-radius:var(--r-md);font-weight:700;color:#0E3B21}
.search-res a:hover{background:#0B7A37;color:#FFFFFF;border-color:#0B7A37}
/* ---------- Idle logout warning (batch 13) ---------- */
.idle-veil{position:fixed;inset:0;z-index:var(--z-modal);background:rgba(8,20,14,.6);display:flex;align-items:center;justify-content:center;padding:18px}
.idle-box{background:var(--paper);border-radius:var(--r-lg);border-top:6px solid #C9A227;box-shadow:var(--sh-3);padding:26px 30px;text-align:center;max-width:380px}
.idle-box h2{margin-bottom:8px}
.idle-box p{color:var(--muted);margin-bottom:16px}
.idle-box #idleCount{color:#B31E35;font-size:var(--fs-md)}
/* ---------- Batch 14: brand, nav pills, footer, rails, lists ---------- */
.brand-name>span{font-size:var(--fs-xl);letter-spacing:.06em}
.nav-links a:not(.btn){border:2px solid transparent;border-radius:var(--r-pill)}
.nav-links a:not(.btn)::after{display:none}
.nav-links a.on{background:var(--green);color:#FFFFFF;border-color:var(--green);font-weight:800}
.nav-links a.on:hover{background:var(--green);color:#FFFFFF}
.foot-center{text-align:center}
.foot-contact-row{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin-bottom:10px}
.foot-contact-row .foot-line{display:inline-flex;gap:8px;align-items:center}
.foot-hours{margin:0}
/* swipe rails: programs, difference, stars */
.prog-grid,.feat-grid{display:flex;gap:16px;overflow-x:auto;padding:6px 2px 18px;scroll-snap-type:x mandatory;scrollbar-width:thin}
.prog-grid .prog,.feat-grid .feat{flex:0 0 min(300px,82vw);scroll-snap-align:start}
/* compact steps, same family size as star cards */
.steps{gap:14px}
.step{flex:0 0 196px;padding:16px 14px}
.step:not(:last-child)::after{right:-14px;top:38px;font-size:var(--fs-base)}
.step h3{font-size:var(--fs-sm)}
.step p{font-size:var(--fs-xs)}
/* stars side-by-side swipe */
#starsZone.stars-week,#totZone.stars-week{display:flex;gap:16px;overflow-x:auto;padding:6px 2px 16px;scroll-snap-type:x mandatory}
#starsZone .star-card,#totZone .star-card{flex:0 0 min(340px,88vw);scroll-snap-align:start;margin:0}
/* team rail (about, creche->p6 sorted) */
.team-grid{display:flex;gap:14px;overflow-x:auto;padding:6px 2px 16px;scroll-snap-type:x mandatory;scrollbar-width:thin}
.team-grid .team-card{flex:0 0 168px;scroll-snap-align:start}
/* news list: vertical compact rows */
.ne-list{flex-direction:column;overflow:visible;scroll-snap-type:none;cursor:default}
.ne-row{flex:none;flex-direction:row;align-items:center;gap:12px;padding:10px}
.ne-row:hover{transform:translateX(4px)}
.ne-row img{width:96px;height:74px;flex:0 0 96px;border-radius:var(--r-md)}
.ne-row h3{font-size:var(--fs-sm);margin:2px 0}
.ne-row p{font-size:var(--fs-xs);margin:0}
.ne-row .ne-meta{font-size:var(--fs-xs)}
.swipe-hint{text-align:center;color:var(--muted);font-weight:700;font-size:var(--fs-sm);margin:10px 0 0}
/* search autocomplete */
.search-sug{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.search-sug:empty{display:none}
.search-sug button{border:1px solid var(--line);background:var(--cream);border-radius:var(--r-pill);padding:6px 12px;font:inherit;font-size:var(--fs-xs);font-weight:700;color:#0E3B21;cursor:pointer}
.search-sug button:hover{background:#0B7A37;color:#FFFFFF;border-color:#0B7A37}
/* dark-mode: decorative layers never cover content; solid navbar */
body:not(.portal-body)::before{z-index:-1}
[data-theme="dark"] .navbar{background:#101B28}
[data-theme="dark"] .ne-row,[data-theme="dark"] .testi-card,[data-theme="dark"] .step,[data-theme="dark"] .feat,[data-theme="dark"] .prog{background:#101B28;border-color:#2A3A4E}
/* Batch 14: instant tap feedback everywhere */
.btn:active,.icon-btn:active,.pill-btn:active,.chip:active,a:active,button:active{transform:scale(.96);filter:brightness(.94)}
.nav-links a:not(.btn):active,.portal-card:active,.prog:active,.feat:active{transform:scale(.97)}

/* ---------- Batch 15: treasure-tag nav (not a pill) ---------- */
.nav-links a:not(.btn){border:1px solid #E5DCC2;border-bottom:3px solid #C9A227;border-radius:var(--r-md);
  background:var(--paper);color:#0E3B21;font-weight:800;padding:9px 15px 8px;white-space:nowrap;
  clip-path:polygon(0 0,calc(100% - 11px) 0,100% 11px,100% 100%,0 100%)}
.nav-links a:not(.btn):hover{background:var(--paper);color:#0E5A2E;transform:translateY(-1px)}
.nav-links a:not(.btn)::after{display:none!important}
.nav-links a.on{background:var(--gold);color:#0E3B21!important;border-color:#B31E35;border-bottom-color:#0E3B21}
.nav-links a.on::before{content:"◆";display:inline-block;margin-right:7px;color:#0E5A2E;font-size:var(--fs-xs);vertical-align:2px}
/* treasure button: gold ingot for the big calls-to-action */
.btn-treasure{background:var(--gold);color:#0E3B21;border:1px solid #B31E35;border-bottom-width:3px;
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);filter:drop-shadow(0 6px 14px rgba(154,107,18,.35))}
.btn-treasure:hover{filter:drop-shadow(0 10px 20px rgba(154,107,18,.45)) brightness(1.05);transform:translateY(-2px)}

/* ---------- Batch 15: chat UI ---------- */
.chat-panel{border:1px solid var(--line);box-shadow:var(--sh-1);overflow:hidden;background:var(--white)}
.chat-head{background:var(--green-deep);color:#FFFFFF;padding:12px 14px;display:flex;gap:10px;align-items:center}
.chat-head .bot{background:var(--gold);color:#0E3B21;font-weight:800;border-radius:var(--r-md);width:34px;height:34px;display:flex;align-items:center;justify-content:center;flex:none}
.chat-msg{max-width:88%;padding:9px 12px;margin:8px 10px;font-size:var(--fs-sm);line-height:1.55}
.chat-msg.bot{background:var(--gold-soft);border:1px solid #E5DCC2;border-left:3px solid #C9A227;border-radius:var(--r-sm);color:var(--ink)}
.chat-msg.me{background:var(--green-deep);color:#FFFFFF;border-radius:var(--r-md);margin-left:auto}
.chat-chips{display:flex;gap:6px;flex-wrap:wrap;padding:8px 10px}
.chat-chips button{border:1.5px solid #C9A227;color:#0E5A2E;background:var(--gold-soft);border-radius:var(--r-md);font-weight:700;font-size:var(--fs-xs);padding:6px 10px;cursor:pointer}
.chat-chips button:hover{background:#0E3B21;color:#C9A227;border-color:#0E3B21}
.chat-input{border-top:1px solid var(--line);background:var(--white)}
.chat-fab{background:var(--green-deep);border:2px solid #C9A227}

/* ---------- Batch 15: week strip + fee progress ---------- */
.week-strip{display:flex;gap:14px;align-items:center;background:var(--green-deep);color:#FFFFFF;border-radius:var(--r-md);padding:14px 18px;box-shadow:var(--sh-1);flex-wrap:wrap;border:1px solid #C9A227}
.week-strip .sec-tag{background:rgba(245,194,66,.16);color:#C9A227;white-space:nowrap}
.week-items{display:flex;gap:10px;flex-wrap:wrap;flex:1}
.week-item{background:rgba(255,255,255,.08);border:1px solid rgba(245,194,66,.4);border-radius:var(--r-md);padding:8px 12px;color:#FFFFFF;display:flex;gap:8px;align-items:center;font-size:var(--fs-sm)}
.week-item:hover{background:rgba(245,194,66,.18)}
.week-item b{color:#C9A227;white-space:nowrap}
.week-note{width:100%;margin:2px 0 0;font-size:var(--fs-sm);color:#E5DCC2}
.week-none{opacity:.85;font-size:var(--fs-sm)}
.fee-progress{background:#EAF0F6;border-radius:var(--r-pill);height:14px;overflow:hidden;margin-top:8px}
.fee-progress i{display:block;height:100%;background:var(--green-deep);border-radius:var(--r-pill);transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}

/* ---------- Batch 15: night-mode colour rules ---------- */
[data-theme="dark"]{--cream:#101B28;--white:#101B28;--ink:#EAF0F6;--muted:#9AA7B8;--line:#2A3A4E;
  --green:#0B7A37;--green-2:#0E3B21;--gold:#C9A227;--gold-soft:#1C2A24;--navy:#EAF0F6;
  --sun:#C9A227;--sun-soft:#1C2A24;--mint:#0B7A37;--mint-soft:#0E3B21;--sky:#9AA7B8;--sky-soft:#203040;
  --coral:#B31E35;--coral-soft:#1C2A24;--grape:#9AA7B8;--grape-soft:#203040}
[data-theme="dark"] body{background:var(--cream);color:var(--ink)}
[data-theme="dark"] body::before{background:var(--d-surface)}
[data-theme="dark"] .card,[data-theme="dark"] .hero-badge,[data-theme="dark"] .prog,[data-theme="dark"] .quote-card,
[data-theme="dark"] .gal,[data-theme="dark"] .news-card,[data-theme="dark"] .form-card,[data-theme="dark"] .contact-form,
[data-theme="dark"] .pill-date,[data-theme="dark"] .p-stat,[data-theme="dark"] .panel,[data-theme="dark"] .icon-btn,
[data-theme="dark"] .modal,[data-theme="dark"] .login-card,[data-theme="dark"] .p-card,[data-theme="dark"] .ne-card,
[data-theme="dark"] .pill-btn,[data-theme="dark"] .m-item,[data-theme="dark"] .pager-btn,[data-theme="dark"] .story-body,
[data-theme="dark"] .wa-card,[data-theme="dark"] .faq-item,[data-theme="dark"] .clock-widget,[data-theme="dark"] .hw-row,
[data-theme="dark"] .wish-bubble,[data-theme="dark"] .track-card,[data-theme="dark"] .principal-card,[data-theme="dark"] .spot-card,
[data-theme="dark"] .count-bar,[data-theme="dark"] .team-card,[data-theme="dark"] .mv-card,[data-theme="dark"] .star-card,
[data-theme="dark"] .yt-card,[data-theme="dark"] .demo-box,[data-theme="dark"] .side-card,[data-theme="dark"] .empty-state,
[data-theme="dark"] .filter-bar select,[data-theme="dark"] .filter-bar input,[data-theme="dark"] .chip,[data-theme="dark"] .badge,
[data-theme="dark"] .att-btns button,[data-theme="dark"] .float-field input,[data-theme="dark"] .treasure-box .box,
[data-theme="dark"] .staff-toggle button.on,[data-theme="dark"] .discount-banner.light .countdown div,
[data-theme="dark"] .search-box,[data-theme="dark"] .search-sug button,[data-theme="dark"] .slider-arrow
  {background:#101B28!important;border-color:#2A3A4E!important;color:#EAF0F6!important}
[data-theme="dark"] .field input,[data-theme="dark"] .field select,[data-theme="dark"] .field textarea,
[data-theme="dark"] .toolbar input,[data-theme="dark"] .toolbar select,[data-theme="dark"] .chat-input input
  {background:#101B28!important;border-color:#2A3A4E!important;color:#EAF0F6!important}
[data-theme="dark"] .field input::placeholder,[data-theme="dark"] .field textarea::placeholder,[data-theme="dark"] .chat-input input::placeholder{color:#5C6B7A}
[data-theme="dark"] .btn-white{background:#203040!important;color:#EAF0F6!important;border-color:#2A3A4E!important}
[data-theme="dark"] .tbl td{border-color:#2A3A4E!important}
[data-theme="dark"] .notice{background:#203040!important;border-color:#2A3A4E!important;color:#EAF0F6}
[data-theme="dark"] .chat-panel{background:#101B28!important}
[data-theme="dark"] .chat-msg.bot{background:#203040!important;border-color:#2A3A4E!important;color:#EAF0F6!important}
[data-theme="dark"] .chat-chips button{background:#203040!important;color:#C9A227!important}
[data-theme="dark"] .chat-input{background:#101B28!important}
[data-theme="dark"] .nav-links a:not(.btn){background:var(--paper);color:#EAF0F6!important;border-color:#2A3A4E;border-bottom-color:#C9A227}
[data-theme="dark"] .nav-links a.on{background:var(--gold);color:#0E3B21!important}
[data-theme="dark"] .week-item{background:rgba(255,255,255,.06)}
[data-theme="dark"] .fee-progress{background:#101B28}
[data-theme="dark"] .sec-tag{background:#0E3B21;color:#0B7A37}
[data-theme="dark"] .prog .emoji{background:#203040;color:#C9A227}
[data-theme="dark"] a{color:#9AA7B8}
[data-theme="dark"] .btn-treasure{color:#0E3B21}

/* ---------- Batch 16: tap reliability ---------- */
#sideNav button,.side-nav button{touch-action:manipulation;cursor:pointer;-webkit-tap-highlight-color:transparent}
#sideNav svg{pointer-events:none}
.btn,.icon-btn,.chip,.pill-btn{touch-action:manipulation}
.side-nav{-webkit-overflow-scrolling:touch;overscroll-behavior:contain}

/* ---------- Batch 17: today row ---------- */
.tt-today td{background:rgba(27,77,62,.09)!important;font-weight:600}
.tt-today td:first-child{border-left:4px solid var(--sun,#C9A227)}
/* ---------- Batch 16: search polish ---------- */
.search-res a small{display:block;font-size:var(--fs-xs);color:var(--muted,#5C6B7A);font-weight:400}
.search-res a.sel{background:rgba(27,77,62,.1);outline:2px solid var(--green,#0E5A2E);border-radius:var(--r-sm)}
.search-res mark{background:var(--butter,#E5DCC2);color:inherit;border-radius:var(--r-sm);padding:0 2px}
.link-btn{background:none;border:0;color:var(--green,#0E5A2E);cursor:pointer;text-decoration:underline;font:inherit;padding:0}

/* ---- batch19: footer titles centered, even spacing (bodies keep their places) ---- */
.foot-brand .logo{display:block;text-align:center;margin-bottom:10px}
.foot-col h4{text-align:center;margin-bottom:10px}
.foot-main{gap:32px;margin-bottom:20px;align-items:start}
.foot-brand p{margin:0;line-height:1.6}
.foot-col p{margin:6px 0;line-height:1.6}
.foot-contact-row{margin-bottom:8px}
.foot-visit p{margin:0 0 10px}
.foot-bottom{padding:12px 0}
@media(max-width:860px){.foot-main{gap:24px;margin-bottom:18px}}
@media(max-width:560px){.foot-main{gap:20px;margin-bottom:16px}}
/* ---- batch19: news redesign ---- */
#newsFeatured{margin:4px 0 6px}
.news-featured{display:grid;grid-template-columns:1.05fr 1fr;background:var(--white);border:2px solid var(--green);border-radius:var(--r-lg);overflow:hidden;cursor:pointer;box-shadow:var(--sh-3);transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.news-featured:hover{transform:translateY(-3px);box-shadow:var(--sh-3)}
.news-featured>img{width:100%;height:100%;min-height:260px;object-fit:cover;display:block}
.nf-noimg{background:var(--green-deep);min-height:260px}
.nf-txt{padding:26px;display:flex;flex-direction:column;gap:10px;justify-content:center}
.nf-txt h2{margin:2px 0;font-size:var(--fs-lg);line-height:1.25}
.nf-txt p{margin:0;color:var(--muted);line-height:1.6}
.nf-meta{display:flex;gap:14px;flex-wrap:wrap;font-size:var(--fs-xs);color:var(--muted);font-weight:600}
.news-sec-head{display:flex;align-items:center;gap:12px;margin:28px 0 14px}
.news-sec-head h2{margin:0;font-size:var(--fs-md);white-space:nowrap}
.news-sec-head .rule{flex:1;height:3px;border-radius:var(--r-sm);background:var(--green-deep)}
.news-sec-head .count{background:var(--sun);color:#203040;font-size:var(--fs-xs);font-weight:800;padding:3px 12px;border-radius:var(--r-lg)}
.news-sec-head .count:empty{display:none}
.rail-head h2{border-left:5px solid var(--green);padding-left:10px}
.yt-card.is-video{outline:none;border:2px solid var(--green);border-radius:var(--r-lg);background:var(--white);overflow:hidden}
.yt-card.is-video .yt-thumb{border-radius:0}
.yt-thumb .play span{background:var(--sun);color:var(--green);border:2px solid #FFFFFF;box-shadow:var(--sh-2)}
.yt-thumb .dur{background:var(--green)}
.yt-card.vid-soon{border:2px dashed var(--green);background:var(--gold-soft)}
.soon-thumb{background:var(--green-deep);aspect-ratio:16/9;display:block}
[data-theme="dark"] .news-featured{background:#101B28;border-color:#0B7A37}
[data-theme="dark"] .yt-card.vid-soon{background:#101B28}
@media(max-width:700px){.news-featured{grid-template-columns:1fr}.news-featured>img,.nf-noimg{min-height:200px}.nf-txt{padding:20px}}

/* ---- batch20: portal top nav, same look as landing ---- */
.portal-layout{display:block;min-height:100vh}
.nav-links button[data-view]{background:none;border:none;font:inherit;font-weight:700;font-size:var(--fs-sm);color:var(--ink);padding:10px 14px;border-radius:var(--r-md);cursor:pointer;white-space:nowrap;position:relative;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.nav-links button[data-view]:hover{background:var(--mint-soft);color:#0E5A2E}
.nav-links button[data-view]::after{content:"";position:absolute;left:14px;right:14px;bottom:5px;height:2px;border-radius:var(--r-sm);background:#C9A227;transform:scaleX(0);transform-origin:left;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.nav-links button[data-view]:hover::after{transform:scaleX(1)}
.nav-links button[data-view].on{background:var(--sun);color:#203040}
.nav-links button[data-view].on::after{transform:scaleX(1)}
.nav-links button[data-view] .badge{margin-left:6px}
.portal-user{display:inline-flex;gap:8px;align-items:center;font-weight:700}
.portal-user .avatar{width:26px;height:26px;font-size:var(--fs-xs)}
.portal-user small{font-weight:400;opacity:.8}
.topbar button.portal-link{border:none;cursor:pointer;font:inherit}
.tb-right{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
[data-theme="dark"] .nav-links button[data-view]{color:var(--ink)}
[data-theme="dark"] .nav-links button[data-view]:hover{background:#1C2A24;color:var(--sun)}
[data-theme="dark"] .nav-links button[data-view].on{background:var(--sun);color:#203040}

/* ---- batch22: paid admission form replica ---- */
.adm-replica{background:var(--paper);color:#101B28;border:3px double #0E5A2E;border-radius:var(--r-sm);padding:26px 26px 20px;max-width:820px;margin:0 auto;font-family:var(--font-body)}
.adm-head{display:flex;gap:16px;align-items:center;border-bottom:3px solid #0E5A2E;padding-bottom:12px;margin-bottom:12px}
.adm-crest{width:74px;height:74px;flex:0 0 74px;border:2px solid #0E5A2E;border-radius:var(--r-pill);display:flex;align-items:center;justify-content:center;font-weight:800;color:#0E5A2E;text-align:center;font-size:var(--fs-xs);line-height:1.25;padding:6px}
.adm-title{text-align:center;flex:1}
.adm-title h2{margin:0;letter-spacing:1px;font-size:var(--fs-md)}
.adm-title p{margin:2px 0;font-size:var(--fs-xs)}
.adm-formname{text-align:center;background:#0E5A2E;color:#FFFFFF;font-weight:800;letter-spacing:1px;padding:8px;border-radius:var(--r-sm);margin:12px 0}
.adm-pass{width:120px;height:140px;border:2px solid #203040;float:right;margin:0 0 10px 12px;display:flex;align-items:center;justify-content:center;color:#5C6B7A;font-size:var(--fs-xs);overflow:hidden}
.adm-pass img{width:100%;height:100%;object-fit:cover}
.adm-instr{font-size:var(--fs-xs);background:#EAF0F6;border:1px solid #E5DCC2;padding:8px 10px;border-radius:var(--r-sm);margin-bottom:12px}
.adm-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px 22px;font-size:var(--fs-sm)}
.adm-grid .full{grid-column:1/-1}
.adm-f{border-bottom:1px dotted #5C6B7A;padding:2px 0;min-height:1.3em}
.adm-f b{font-size:var(--fs-xs);color:#203040}
.adm-sec{font-weight:800;text-align:center;letter-spacing:1px;margin:16px 0 8px;text-decoration:underline}
.adm-sig{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:14px;font-size:var(--fs-sm)}
.adm-stamp{display:inline-block;border:3px solid #0B7A37;color:#0B7A37;font-weight:800;letter-spacing:2px;padding:4px 18px;transform:rotate(-6deg);border-radius:var(--r-sm);margin-top:10px}
.adm-stamp.unpaid{border-color:#B31E35;color:#B31E35}
/* ============ BATCH 25 (2026-09-20): glass login + portal nav tiles + logout by theme ============ */
/* ---- true glassmorphism: login & registration card + birthday side card ---- */
.auth-card,.side-card{background:rgba(255,255,255,.58)!important;-webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%);border:1px solid rgba(255,255,255,.65)!important;box-shadow:var(--sh-3)}
[data-theme="dark"] .auth-card,[data-theme="dark"] .side-card{background:rgba(8,17,12,.62)!important;border-color:rgba(255,255,255,.14)!important}
/* ---- portal nav: four buttons side by side, framed tiles (not pills) ---- */
.navbar .container{flex-wrap:wrap}
.nav-cta-row{margin-left:auto}
#sideNav{flex:1 1 100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:10px;overflow:visible}
#sideNav button[data-view]{display:flex;align-items:center;justify-content:center;gap:7px;padding:12px 6px;border-radius:var(--r-md);border:1.5px solid #E5DCC2;background:var(--paper);color:#0E3B21;font-weight:800;font-size:var(--fs-sm);box-shadow:var(--sh-1);transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#sideNav button[data-view]::after{left:0;right:0;bottom:0;height:3px;border-radius:var(--r-sm)}
#sideNav button[data-view]:hover{transform:translateY(-2px);border-color:#0B7A37;background:var(--paper);color:#0E5A2E;box-shadow:var(--sh-2)}
#sideNav button[data-view].on{background:var(--green-deep);border-color:#0E5A2E;color:#FFFFFF;box-shadow:var(--sh-2)}
#sideNav button[data-view].on::after{transform:scaleX(1)}
[data-theme="dark"] #sideNav button[data-view]{background:var(--paper);border-color:#203040;color:#EAF0F6}
[data-theme="dark"] #sideNav button[data-view]:hover{border-color:#0B7A37;background:#1C2A24;color:#FFFFFF}
[data-theme="dark"] #sideNav button[data-view].on{background:var(--paper);border-color:#0B7A37;color:#FFFFFF}
@media(max-width:760px){#sideNav{gap:6px}#sideNav button[data-view]{padding:10px 4px;font-size:var(--fs-xs);border-radius:var(--r-md)}}
/* ============ BATCH 27 (2026-09-20): STRICT COLOR SYSTEM — every surface from tokens ============
   THE RULE (day & night use the SAME tokens; night only remaps them):
   • Brand greens : --brand #0B7A37 • --brand-dark #0E5A2E • --brand-deep #0E3B21 • --green
   • Butter/gold  : --butter-soft #F8F4E4 • --butter #E5DCC2 • --butter-deep #C9A227 • --gold #C9A227
   • Accents      : --sun --sun-soft --coral --coral-soft --sky --sky-soft --mint --mint-soft --grape --grape-soft
   • Surfaces     : --white --cream --line --ink --muted  (auto-remapped at [data-theme="dark"])
   No component may hardcode a light background — use the tokens so night mode always follows. */
/* ---- day polish ---- */
::placeholder{color:var(--muted);opacity:1}
:focus-visible{outline:3px solid rgba(201,162,39,.5);outline-offset:2px}
::selection{background:#C9A227;color:#FFFFFF}
.mv-card,.team-card,.star-card{transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.mv-card:hover,.team-card:hover,.star-card:hover{transform:translateY(-3px);box-shadow:var(--sh-3)}
.empty{border:1.5px dashed var(--line);border-radius:var(--r-md);background:var(--white)}
/* ---- night completion (same tokens, remapped) ---- */
[data-theme="dark"] ::placeholder{color:#9AA7B8}
[data-theme="dark"] ::selection{background:#C9A227;color:#101B28}
[data-theme="dark"] ::-webkit-scrollbar-thumb{background:#2A3A4E;border:2px solid transparent;background-clip:content-box}
[data-theme="dark"] .empty{background:#101B28}
/* ---- receipt: clean print sheet (PAID stamp + details only) ---- */
@media print{
  body[data-page="receipt"]{background:var(--paper)!important}
  body[data-page="receipt"] #siteLoader,body[data-page="receipt"] .topbar,body[data-page="receipt"] .navbar,
  body[data-page="receipt"] .page-hero,body[data-page="receipt"] #siteFooter,body[data-page="receipt"] #toast,
  body[data-page="receipt"] .no-print{display:none!important}
  body[data-page="receipt"] .track-card,body[data-page="receipt"] .panel{box-shadow:none!important;border:1px solid #E5DCC2}
}
/* ============ BATCH 29 (2026-09-20): motion kindness + heading ornament ============ */
/* ---- reduced motion: everything goes still; ticker becomes swipeable ---- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:150ms;scroll-behavior:auto!important}
  .ticker-inner{animation:none}
  .ticker{overflow-x:auto;-webkit-overflow-scrolling:touch}
}
/* ---- section headings: butter-to-green ribbon accent (strict palette) ---- */
.sec-head h2{position:relative;padding-left:16px}
.sec-head h2::before{content:"";position:absolute;left:0;top:54%;transform:translateY(-50%);width:6px;height:.72em;border-radius:var(--r-sm);background:var(--green-deep)}
[data-theme="dark"] .sec-head h2::before{background:var(--gold)}
/* ============ BATCH 30 (2026-09-20): button system, login edge, topBtn ring, hc night, text size ============ */
/* ---- one button language: same radius family, same focus, same press ---- */
.btn{border-radius:var(--r-md)}
.btn:focus-visible{outline:3px solid rgba(201,162,39,.55);outline-offset:2px}
.btn:active{transform:translateY(1px) scale(.99)}
.btn-mint,.nav-links .btn{background:var(--green-deep);border:2px solid var(--butter-deep,#C9A227);color:#FFFFFF;box-shadow:var(--sh-2)}
.btn-mint:hover,.nav-links .btn:hover{background:var(--green-deep);box-shadow:var(--sh-2)}
.btn-white{background:var(--white);border:1.5px solid var(--gold,#C9A227);color:#0E3B21}
[data-theme="dark"] .btn-white,[data-theme="dark-hc"] .btn-white{background:#2A3A4E;color:var(--ink);border-color:#2A3A4E}
/* ---- landing Login/Register: same right edge as the nav links row ---- */
@media(min-width:761px){
  .navbar .container{align-items:center}
  .nav-links .btn{margin-left:14px;margin-right:2px}
  .nav-cta-row{margin-left:10px}
}
/* ---- mobile: login button spans the row edge-to-edge with the menu grid ---- */
@media(max-width:760px){
  .nav-links .btn{width:100%;margin:0;border-radius:var(--r-md)}
  .nav-links .btn::after{display:none}
}
/* ---- back-to-top: gold progress ring fills as you read ---- */
#topBtn{position:relative;background:var(--green-deep)}
#topBtn::before{display:none}
/* ---- high-contrast night: deeper blacks, brighter ink, bolder lines ---- */
[data-theme="dark-hc"]{--cream:#101B28;--white:#101B28;--ink:#FFFFFF;--muted:#9AA7B8;--line:#2A3A4E}
[data-theme="dark-hc"] body{background:#101B28}
[data-theme="dark-hc"] .navbar{background:rgba(8,13,20,.98)}
[data-theme="dark-hc"] .panel,[data-theme="dark-hc"] .track-card,[data-theme="dark-hc"] .notice{background:#101B28!important;border-color:#2A3A4E!important}
[data-theme="dark-hc"] ::placeholder{color:#9AA7B8!important}
[data-theme="dark-hc"] .theme-btn{background:#101B28;color:#E5DCC2;border-color:#E5DCC2}
/* ---- text size preset: S / A / L ---- */
#textSizeBtns{display:inline-flex;gap:6px;align-items:center}
#textSizeBtns button{background:var(--white);border:1.5px solid var(--line);color:var(--ink);border-radius:var(--r-sm);font-weight:800;cursor:pointer;padding:2px 9px;line-height:1.4}
#textSizeBtns button.on{background:var(--gold,#C9A227);border-color:var(--gold,#C9A227);color:#203040}
html[data-fontsize="s"]{font-size:var(--fs-sm)}
html[data-fontsize="l"]{font-size:var(--fs-base)}
/* ============ BATCH 31 (2026-09-20): greeting strip + new pages polish ============ */
.greet-strip{display:flex;gap:8px 22px;justify-content:center;align-items:baseline;flex-wrap:wrap;margin-top:24px;font-family:var(--font-head);text-align:center}
.greet-strip .greet{font-weight:800;font-size:var(--fs-base);color:var(--mint,#0B7A37);letter-spacing:.02em}
.greet-strip .greet-en{color:#0E3B21}
[data-theme="dark"] .greet-strip .greet{color:#0B7A37}
[data-theme="dark"] .greet-strip .greet-en{color:#EAF0F6}
.lyric-card{max-width:680px;margin:0 auto 16px;padding:22px 24px}
.lyric-card p{white-space:pre-line;line-height:1.9}
.fee-tbl td:first-child,.fee-tbl th:first-child{text-align:left;font-weight:800}
/* ============ BATCH 32 (2026-09-20): word of the week + absent notify ============ */
.wow-card{max-width:680px;margin:20px auto 0;padding:20px 22px;background:var(--sun-soft);border:1.5px solid var(--gold,#C9A227);border-radius:var(--r-lg);text-align:center;box-shadow:var(--sh-1)}
.wow-card .sec-tag{display:inline-block;margin-bottom:6px}
.wow-word{font-family:var(--font-head);font-weight:800;font-size:var(--fs-xl);color:#0E3B21;letter-spacing:.02em}
.wow-mean,.wow-ex{margin:6px 0 0;font-size:var(--fs-sm);color:var(--ink)}
[data-theme="dark"] .wow-word{color:#C9A227}
#regAbsent .notice{margin-bottom:8px}
#regAbsent h3{font-family:var(--font-head)}
/* ============ BATCH 33 (2026-09-20): resumption chip + testimonial spotlight ============ */
#resumeChip:empty{display:none}
.resume-chip{display:inline-flex;align-items:center;gap:8px;margin-top:16px;background:var(--white);border:1.5px solid var(--gold,#C9A227);border-radius:var(--r-pill);padding:9px 18px;font-weight:700;font-size:var(--fs-sm);color:var(--ink);box-shadow:var(--sh-1)}
.rc-dot{width:9px;height:9px;border-radius:var(--r-pill);background:var(--coral,#B31E35);flex:none}
[data-theme="dark"] .resume-chip{background:#101B28;border-color:#C9A227;color:#EAF0F6}
#tmSpot:empty{display:none}
.tm-spot{max-width:680px;margin:22px auto 0;padding:24px 26px;background:var(--mint-soft);border-radius:var(--r-lg);text-align:center;position:relative;box-shadow:var(--sh-1)}
.tms-quote{font-family:var(--font-head);font-size:var(--fs-2xl);line-height:.6;color:var(--gold,#C9A227);margin-bottom:6px}
.tm-spot p{font-size:var(--fs-base);line-height:1.7;color:var(--ink);margin:0 0 10px;font-style:italic}
.tms-stars{color:#C9A227;letter-spacing:3px;margin-bottom:6px}
[data-theme="dark"] .tms-stars{color:#C9A227}
.tms-who b{font-family:var(--font-head)}
.tms-who small{color:var(--muted)}
.tms-link{display:inline-block;margin-top:8px;font-weight:800;color:var(--green,#0E5A2E);text-decoration:underline;text-underline-offset:3px}
[data-theme="dark"] .tms-link{color:#0B7A37}
/* ============ BATCH 34 (2026-09-20): portal sidebar navigation (all items, never a hamburger) ============ */
@media(min-width:1100px){
  .portal-layout{display:grid;grid-template-columns:266px minmax(0,1fr);grid-template-areas:"side top" "side main";align-items:start}
  .portal-layout>.topbar{grid-area:top;position:sticky;top:0;z-index:var(--z-nav)}
  .portal-layout>main.main{grid-area:main;min-width:0}
  .portal-layout>.navbar{grid-area:side;position:sticky;top:0;height:100vh;overflow-y:auto;background:var(--green-deep);border-right:2px solid var(--gold,#C9A227)}
  .portal-layout>.navbar .container{display:flex;flex-direction:column;align-items:stretch;gap:12px;padding:18px 14px}
  .portal-layout>.navbar .logo{align-self:center}
  .portal-layout>.navbar .brand-name{text-align:center}
  .portal-layout>.navbar .brand-name>span{color:#FFFFFF}
  .portal-layout>.navbar .brand-name small{color:#E5DCC2}
  #sideNav{flex:1 1 auto;display:flex;flex-direction:column;gap:4px;margin:4px 0;overflow:visible}
  #sideNav button[data-view]{justify-content:flex-start;width:100%;padding:11px 12px;border:0;border-radius:var(--r-md);background:transparent;color:#EAF0F6;font-weight:700;font-size:var(--fs-sm);box-shadow:none;text-align:left}
  #sideNav button[data-view]::after{display:none}
  #sideNav button[data-view]:hover{background:rgba(255,255,255,.10);color:#FFFFFF;transform:none;box-shadow:none}
  #sideNav button[data-view].on{background:var(--paper);color:var(--green-deep);box-shadow:var(--sh-1)}
  .portal-layout .nav-cta-row{display:flex;gap:8px;justify-content:center;margin-left:0;padding-top:10px;border-top:1px solid rgba(255,255,255,.14)}
  .portal-layout .theme-btn{background:rgba(255,255,255,.08);border-color:rgba(247,233,103,.5);color:#E5DCC2}
  .portal-layout .nav-logout{background:rgba(229,72,93,.16);border-color:#B31E35;color:#B31E35}
  .portal-layout .nav-logout:hover{background:#B31E35;color:#FFFFFF;transform:none}
}
@media(max-width:1099px){
  .portal-layout{display:flex;flex-direction:column}
  #sideNav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px} /* links stay visible — no hamburger, ever */
}
/* Portal-only sidebar collapse. Public pages use the flat header below. */
@media(min-width:1100px){
  #sideCollapse{align-self:center;background:rgba(255,255,255,.08);border:1px solid rgba(247,233,103,.4);color:#E5DCC2;width:34px;height:34px;border-radius:var(--r-pill);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
  #sideCollapse:hover{background:rgba(247,233,103,.18)}
  #sideCollapse.flip{transform:rotate(180deg)}
  body.side-slim .portal-layout{grid-template-columns:76px minmax(0,1fr)}
  body.side-slim .portal-layout>.navbar .brand-name{display:none}
  body.side-slim .portal-layout>.navbar .logo .mark-img{width:44px;height:44px}
  body.side-slim #sideNav button[data-view]{justify-content:center;font-size:0;gap:0;padding:12px 0}
  body.side-slim #sideNav button[data-view] svg{margin:0}
  body.side-slim #sideNav button[data-view] .badge{display:none}
}
/* ============ BATCH 37 (2026-09-20): quick actions, reading mode, tour ============ */
/* ---- admin rail quick actions ---- */
.qa-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:2px 0 8px}
.qa-btn{border:1.5px solid rgba(247,233,103,.45);background:rgba(255,255,255,.08);color:#E5DCC2;font:inherit;font-weight:800;font-size:var(--fs-xs);padding:8px 2px;border-radius:var(--r-md);cursor:pointer;white-space:nowrap;text-align:center}
.qa-btn:hover{background:rgba(247,233,103,.16)}
.qa-mint{border-color:rgba(123,216,159,.5);color:#0B7A37}
.qa-sky{border-color:rgba(122,180,255,.45);color:#EAF0F6}
body.side-slim .qa-strip{grid-template-columns:1fr}
body.side-slim .qa-btn{font-size:0;padding:8px 0}
/* ---- reading mode (story page) ---- */
#readBtn{position:fixed;right:16px;bottom:18px;z-index:var(--z-dropdown);width:44px;height:44px;border-radius:var(--r-pill);border:1.5px solid var(--gold,#C9A227);background:var(--white);color:#0E3B21;font-size:var(--fs-base);cursor:pointer;box-shadow:var(--sh-2)}
#readBtn.on{background:#0B7A37;color:#FFFFFF;border-color:#C9A227}
[data-theme="dark"] #readBtn{background:#101B28;color:#C9A227}
body.reading{display:block}
body.reading .topbar,body.reading .navbar,body.reading #siteFooter,body.reading .page-hero,body.reading #resumeChip,body.reading #tmSpot,body.reading .motto-ribbon,body.reading #dvToast{display:none!important}
body.reading .container{max-width:720px}
body.reading section{padding:26px 0}
body.reading .story-body p{font-size:var(--fs-base);line-height:2}
/* ---- teacher first-login tour ---- */
#tourOv{position:fixed;inset:0;background:rgba(3,10,6,.55);z-index:var(--z-modal)}
#tourCard{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);width:min(430px,92vw);background:var(--white);border:1.5px solid var(--gold,#C9A227);border-radius:var(--r-lg);box-shadow:var(--sh-3);padding:18px 20px;z-index:var(--z-modal)}
#tourCard small{color:var(--muted);font-weight:800;letter-spacing:.06em;text-transform:uppercase;font-size:var(--fs-xs)}
#tourCard b{display:block;font-family:var(--font-head);font-size:var(--fs-base);margin:4px 0 6px;color:var(--ink)}
#tourCard p{margin:0 0 12px;font-size:var(--fs-sm);color:var(--ink);line-height:1.6}
#tourCard .tr-actions{display:flex;gap:8px;justify-content:flex-end}
.tour-hl{outline:3px solid #E5DCC2!important;outline-offset:2px;border-radius:var(--r-md)}
[data-theme="dark"] #tourCard{background:#101B28}
/* ============ BATCH 40 (2026-09-20): staff grid + teacher profiles + former staff ============ */
.staff-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.staff-grid3 .team-card{margin:0}
.staff-click{cursor:pointer;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.staff-click:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}
@media(max-width:900px){.staff-grid3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.staff-grid3{grid-template-columns:1fr}}
[data-theme="dark"] .staff-click:hover{box-shadow:var(--sh-2)}
/* ============ BATCH 41 (2026-09-21): accreditation strip, staff collage, coc ============ */
.foot-partners{border-top:1px solid var(--mint-border,#E5DCC2);padding:12px 0 10px}
.acc-cap{text-align:center;font-size:var(--fs-xs);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:0 0 8px}
.acc-logos{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center}
.acc-logos img{height:50px;width:auto;max-width:150px;object-fit:contain;background:var(--paper);border-radius:var(--r-md);padding:5px 9px;border:1px solid var(--mint-border,#E5DCC2)}
.acc-note{text-align:center;font-size:var(--fs-xs);color:var(--muted);margin:8px 0 0}
.staff-collage{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:4px 0 16px}
.sc-dot{display:inline-flex;width:46px;height:46px;border-radius:var(--r-pill);background:var(--green-deep);color:#FFFFFF;font-weight:800;font-size:var(--fs-xs);align-items:center;justify-content:center;border:2px solid var(--mint-border,#E5DCC2)}
[data-theme="dark"] .acc-logos img{border-color:rgba(255,255,255,.14)}
[data-theme="dark"] .sc-dot{border-color:rgba(255,255,255,.15)}
/* ============ BATCH 43 (2026-09-21): Treasure Typography + Treasure FX + brand motif ============ */
@font-face{font-family:"Clash Display";src:url("../fonts/clash-display-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Clash Display";src:url("../fonts/clash-display-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"General Sans";src:url("../fonts/general-sans-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"General Sans";src:url("../fonts/general-sans-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
:root{
  --font-head:"Clash Display",sans-serif;
  --font-body:"General Sans",sans-serif;
  --font-mono:var(--font-body);
  --font-hand:var(--font-body);
    --motif:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Cpath d='M14 2 L26 14 L14 26 L2 14 Z' fill='none' stroke='%23C9A227' stroke-width='1.6'/%3E%3Ccircle cx='14' cy='14' r='3.4' fill='%230E9A46'/%3E%3C/svg%3E");
}
.sec-tag{background-image:var(--motif);background-repeat:no-repeat;background-position:96% center;background-size:13px 13px;padding-right:30px}
.btn{position:relative;overflow:hidden}
.fx-ripple{position:absolute;border-radius:var(--r-pill);background:rgba(255,255,255,.5);transform:scale(0);animation:none;pointer-events:none}

.seg{position:relative;display:flex;gap:2px;border:1.5px solid var(--mint-border,#E5DCC2);border-radius:var(--r-md);padding:4px;background:var(--white);width:max-content;max-width:100%;overflow-x:auto;margin:8px auto 20px}
.seg-tab{border:0;background:transparent;padding:9px 16px;border-radius:var(--r-md);font-weight:700;color:var(--muted);cursor:pointer;white-space:nowrap;position:relative;z-index:var(--z-nav);transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.seg-tab.on{color:#0B7A37}
.seg-ink{position:absolute;top:4px;bottom:4px;left:4px;width:0;border-radius:var(--r-md);background:var(--mint-soft);transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast);z-index:0}
[data-seg-pane]{display:none}
[data-seg-pane].show{display:block;animation:none}

.tilt{transform-style:preserve-3d;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast);will-change:transform}
.stag-pre{opacity:0;transform:translateY(14px)}
.stag-in{opacity:1;transform:none;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.spy-bar{position:sticky;top:8px;z-index:var(--z-dropdown);display:flex;gap:4px;justify-content:center;background:var(--white);border:1.5px solid var(--mint-border,#E5DCC2);border-radius:var(--r-md);padding:6px;margin:16px 0 4px;overflow-x:auto;box-shadow:var(--sh-2)}
.spy-bar a{white-space:nowrap;padding:8px 14px;border-radius:var(--r-md);font-weight:700;font-size:var(--fs-sm);color:var(--muted);text-decoration:none;transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.spy-bar a:hover{color:#0B7A37}
.spy-bar a.on{color:#0B7A37;background:var(--mint-soft)}
.acc-logos a{transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast);display:inline-block}
.acc-logos a:hover{transform:translateY(-3px)}
[data-theme="dark"] .spy-bar{box-shadow:var(--sh-2)}
@media (prefers-reduced-motion: reduce){
  .tilt,.acc-logos a,.seg-ink{transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
  .grad-pane.show{animation:none}
  .stag-pre{opacity:1;transform:none}
}
/* ============ BATCH 44 (2026-09-21): launch polish + compare tables ============ */
.page-hero h1{font-size:var(--fs-2xl);letter-spacing:-.03em;line-height:1.06}
.page-hero p{max-width:660px}
h1,h2{letter-spacing:-.02em}
.cmp-wrap{overflow-x:auto;border:1.5px solid var(--mint-border,#E5DCC2);border-radius:var(--r-md);background:var(--white)}
.cmp-wrap .tbl td,.cmp-wrap .tbl th{white-space:nowrap}

/* ============ BATCH 46: faithful code-of-conduct paper ============ */
.coc-paper ol.coc-list{font-size:var(--fs-sm);line-height:1.5}
.coc-paper ol.coc-list li::marker{font-weight:800;color:#0B7A37}
/* ============ BATCH 47 (2026-09-22): trio type system — Gidole body, Sabon/Garamond headings, Northwell/Kristi signature accents ============ */
.sig{font-family:var(--font-mono);font-style:italic;font-size:var(--fs-base);color:#0B7A37;font-weight:400;letter-spacing:.02em}

/* ============ BATCH 48 (2026-09-22): ITF type system + studio-grade polish ============ */
.sec-tag{font-family:var(--font-mono);letter-spacing:.16em}
h1,h2,h3{text-wrap:balance}
.sec-head{max-width:70ch}
body{line-height:1.55}
#siteLoader img{image-rendering:auto}


/* ==========================================================================
   Landing + navigation polish — owner review, 24 September 2026.
   One uniform box for every navigation item (Menu included), a smaller
   search / night-switch, a bigger crest, the stats travelling with the
   hero image as one group, shorter program cards, taller Difference
   cards, and the news date filter dressed like its sibling filter.
   ========================================================================== */
.nav-links a.nl{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:106px;height:44px;padding:0 12px;border-radius:var(--r-md);box-sizing:border-box}
.nav-links a.nl svg{width:16px;height:16px;flex:none}
.nav-links a.nl span{font-size:var(--fs-sm);line-height:1}
.nav-links a.nl-cta{background:var(--mint-soft);color:#0E5A2E;font-weight:800}
.nav-links a.nl-cta::after{display:none}
.nav-links a.nl-cta:hover{background:#EAF0F6}
.nav-links .nav-burger{min-width:106px;height:44px;border-radius:var(--r-md)}
.theme-btn{width:34px;height:34px}
.theme-btn svg{width:15px;height:15px}
.mark-img{width:60px;height:60px}
.hero-art{display:flex;flex-direction:column;gap:16px}
.hero-art .stats-band{margin:0;border-radius:var(--r-lg);padding:24px 26px;display:grid;grid-template-columns:repeat(4,1fr);gap:12px 18px;box-shadow:var(--sh-3)}
/* This compact band has direct .stat children, not the older .container;
   suppress the legacy paper veil so its white/gold figures retain contrast. */
.hero-art .stats-band::before{display:none}
.hero-art .stat{position:relative;text-align:center}
.step .num.num-date{width:auto;min-width:44px;padding:0 12px;font-size:var(--fs-sm);border-radius:var(--r-pill)}
.prog-grid .prog{padding:0 0 16px}
.prog-grid .prog h3{margin:12px 16px 4px}
.prog-grid .prog .ages{margin:0 16px}
.prog-grid .prog ul{margin:10px 16px 12px}
.prog-grid .prog .btn{margin:0 16px}
.feat-grid .feat{padding:30px 26px;min-height:300px;display:flex;flex-direction:column}
.vid-grid .gal{display:flex;flex-direction:column}
.vid-grid .video-shell{flex:1;display:flex;flex-direction:column;justify-content:center}
.vid-grid .video-shell iframe{width:100%}
.filter-bar input[type="date"]{font-family:var(--font-body);padding:9px 14px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--paper);color:var(--ink)}
@media (max-width:640px){
  .hero-art .stats-band{grid-template-columns:repeat(2,1fr);padding:18px}
  .nav-links a.nl,.nav-links .nav-burger{min-width:0;height:40px;padding:0 10px}
}

/* ==========================================================================
   UI/UX SIMPLIFICATION — flat public system (28 September 2026)
   ========================================================================== */

/* Type roles: one repeatable scale, Clash Display + General Sans only. */
body{font-family:var(--font-body);font-size:var(--fs-base);background:var(--cream);color:var(--ink)}
h1{font-size:var(--fs-2xl)}
h2,.sec-head h2{font-size:var(--fs-xl)}
h3{font-size:var(--fs-lg)}
h4{font-size:var(--fs-md)}
p,li,input,select,textarea,button{font-size:var(--fs-base)}
small,.sub,figcaption,.ne-meta,.foot-bottom{font-size:var(--fs-sm)}
.sec-tag,.badge,.chip,.tag-new{font-size:var(--fs-xs)}
body:not(.portal-body)::before,body:not(.portal-body)::after{display:none}
body:not(.portal-body) section{padding:var(--s7) 0}

/* Flat header: a single layout plane, fixed 44px actions and explicit gaps. */
body:not(.portal-body) .navbar{
  position:sticky;top:0;z-index:var(--z-nav);background:rgba(255,255,255,.97);
  border-bottom:1px solid var(--line);box-shadow:var(--sh-1);backdrop-filter:blur(10px);
}
body:not(.portal-body) .navbar .nav-row{
  width:min(1180px,94%);min-height:72px;display:flex;align-items:center;
  justify-content:space-between;gap:var(--s2);padding:10px 0;
}
.flat-brand{display:flex;align-items:center;gap:10px;min-width:218px;color:var(--ink);text-decoration:none}
.flat-brand .logo-badge{width:44px;height:44px;border-radius:var(--r-md);border:1px solid var(--line);box-shadow:none;object-fit:cover}
.flat-brand span{display:flex;flex-direction:column;line-height:1.15}
.flat-brand strong{font-family:var(--font-head);font-size:var(--fs-sm);font-weight:600}
.flat-brand small{color:var(--muted);font-size:var(--fs-xs);margin-top:3px}
.site-nav{display:flex;align-items:center;justify-content:center;min-width:0;flex:1}
#mainNav{display:flex;align-items:center;justify-content:center;gap:clamp(10px,1.5vw,22px)}
.nav-link{position:relative;color:var(--ink);font-size:var(--fs-sm);font-weight:600;text-decoration:none;white-space:nowrap;padding:10px 0;border-radius:0}
.nav-link:hover,.nav-link.on{color:var(--green)}
.nav-link.on::after{content:"";position:absolute;left:0;right:0;bottom:3px;height:2px;background:var(--gold)}
.nav-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex:none;margin:0}
.icon-action,.theme-btn{
  width:44px;height:44px;display:grid;place-items:center;flex:0 0 44px;padding:0;
  border:1px solid var(--line);border-radius:var(--r-md);background:transparent;color:var(--ink);
  box-shadow:none;cursor:pointer;
}
.icon-action:hover,.theme-btn:hover{background:var(--cream);color:var(--green);transform:none;box-shadow:none}
.nav-actions .nav-apply{min-height:44px;padding:10px 18px}

/* Three button roles. Legacy class names resolve to these roles without
   changing form behaviour or portal event handlers. */
body:not(.portal-body) .btn{border-radius:var(--r-md);box-shadow:none;background-image:none!important;font-family:var(--font-body);font-weight:700;transform:none}
body:not(.portal-body) .btn:hover{transform:none;filter:none;box-shadow:none}
body:not(.portal-body) .btn-primary,
body:not(.portal-body) .btn-mint,
body:not(.portal-body) .btn-treasure,
body:not(.portal-body) .btn-sun,
body:not(.portal-body) .btn-coral{background:var(--green);border-color:var(--green);color:#FFFFFF}
body:not(.portal-body) .btn-primary:hover,
body:not(.portal-body) .btn-mint:hover,
body:not(.portal-body) .btn-treasure:hover,
body:not(.portal-body) .btn-sun:hover,
body:not(.portal-body) .btn-coral:hover{background:var(--green-bright);border-color:var(--green-bright)}
body:not(.portal-body) .btn-secondary,
body:not(.portal-body) .btn-white,
body:not(.portal-body) .btn-sky,
body:not(.portal-body) .btn-grape{background:transparent;border:1.5px solid var(--green);color:var(--green)}
body:not(.portal-body) .btn-secondary:hover,
body:not(.portal-body) .btn-white:hover,
body:not(.portal-body) .btn-sky:hover,
body:not(.portal-body) .btn-grape:hover{background:var(--gold-soft)}
body:not(.portal-body) .btn-ghost{background:transparent;border-color:transparent;color:var(--green);padding-inline:4px}

/* Two badge roles: neutral by default, gold for new/time-sensitive labels. */
body:not(.portal-body) .badge,body:not(.portal-body) .chip,
body:not(.portal-body) .b-sky,body:not(.portal-body) .b-mint,body:not(.portal-body) .b-grape{
  background:var(--cream)!important;color:var(--ink)!important;border:1px solid var(--line)!important;
}
body:not(.portal-body) .b-sun,body:not(.portal-body) .b-coral,
body:not(.portal-body) .tag-new,body:not(.portal-body) .badge-accent{
  background:var(--gold-soft)!important;color:var(--green-deep)!important;border:1px solid var(--gold)!important;
}
.sec-tag{background:none!important;color:var(--green);padding:0;border:0}

/* One card language: one border, four radii total, three shadow tokens. */
body:not(.portal-body) .prog,body:not(.portal-body) .feat,body:not(.portal-body) .step,
body:not(.portal-body) .mv-card,body:not(.portal-body) .panel,body:not(.portal-body) .ne-card,
body:not(.portal-body) .gal,body:not(.portal-body) .testi-card,body:not(.portal-body) .principal-card,
body:not(.portal-body) .promo-card,body:not(.portal-body) .star-card,body:not(.portal-body) .track-card{
  border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--sh-1);background:var(--paper);
}
body:not(.portal-body) .prog:hover,body:not(.portal-body) .feat:hover,
body:not(.portal-body) .ne-card:hover,body:not(.portal-body) .testi-card:hover{
  transform:none;box-shadow:var(--sh-2);
}
.page-hero,.cta-band{background:var(--green-deep);background-image:none;border-radius:0;box-shadow:none}
.page-hero h1,.cta-band h2{color:#FFFFFF}
.site-footer{background:var(--green-deep);background-image:none}

/* Calm homepage rhythm: eight content sections, alternating flat surfaces. */
body[data-page="home"] .hero,body[data-page="home"] #programs,
body[data-page="home"] #news,body[data-page="home"] #testimonials{background:var(--paper)}
body[data-page="home"] #aboutPrev,body[data-page="home"] #why,
body[data-page="home"] #gallery,body[data-page="home"] #finalCta{background:var(--cream)}
body[data-page="home"] .hero{padding:var(--s6) 0}
body[data-page="home"] .hero-badge{border:0;padding:0;color:var(--green);background:none;font-size:var(--fs-xs)}
.hero-admission-strip{margin-top:var(--s3);padding-top:var(--s2);border-top:1px solid var(--line);display:grid;gap:8px}
.hero-admission-strip>strong{font-size:var(--fs-sm);color:var(--green)}
.hero-admission-strip ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--muted);font-size:var(--fs-sm)}
.hero-admission-strip li{font-size:inherit}
.hero-admission-strip li b{color:var(--green)}
.bank-line{font-size:var(--fs-xs);color:var(--muted)}
.about-copy .principal-card{margin-top:var(--s3);padding:var(--s3);border-left:3px solid var(--gold)}
.about-copy .principal-card p{font-size:var(--fs-base)}
.feat-grid{grid-template-columns:repeat(3,1fr)}
.feat-grid .feat{min-height:0;padding:var(--s3)}
.feature-icon{width:42px;height:42px;padding:9px;margin-bottom:var(--s2);color:var(--green);background:var(--gold-soft);border-radius:var(--r-md)}
body[data-page="home"] .gal-grid{grid-template-columns:repeat(4,1fr)}
body[data-page="home"] .testi-rail{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s3);overflow:visible}
body[data-page="home"] .testi-card{min-width:0}
.final-cta{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);padding:var(--s5);background:var(--green-deep);color:#FFFFFF;border-radius:var(--r-md)}
.final-cta h2{color:#FFFFFF}.final-cta p{color:#E5DCC2;max-width:620px;margin-top:8px}
.final-cta .cta-btns{flex:none}.final-cta .btn-secondary{color:#FFFFFF!important;border-color:#FFFFFF!important}.final-cta .btn-secondary:hover{background:rgba(255,255,255,.1)!important}
.count-bar{border-radius:var(--r-md);box-shadow:none;border:1px solid var(--line);background:var(--gold-soft)}

/* Z-index scale and motion budget. */
.navbar{z-index:var(--z-nav)}
.search-veil,.menu-veil,.dropdown{z-index:var(--z-dropdown)}
.chat-fab,.chat-launch,.chat-panel,.clock-widget{z-index:var(--z-chat)}
.modal,.lightbox{z-index:var(--z-modal)}
#toast{z-index:var(--z-toast)}
.theme-btn:hover,.theme-btn:hover svg,.btn:hover,.btn:active{transform:none}
.ticker-inner{animation-duration:34s}
#newsGrid.ne-track .ne-card{transition-duration:150ms}
.fx-ripple{display:none!important}
#readBtn .ico{margin:0;vertical-align:middle}

/* Dark mode remaps tokens instead of leaving white islands behind. */
[data-theme="dark"],[data-theme="dark-hc"]{
  --paper:var(--d-surface);--white:var(--d-surface);--cream:var(--d-bg);
  --ink:var(--d-text);--muted:var(--d-muted);--line:var(--d-line);
  --gold-soft:#1C2A24;
}
[data-theme="dark"] body,[data-theme="dark-hc"] body{background:var(--d-bg);color:var(--d-text)}
[data-theme="dark"] body:not(.portal-body) .navbar,
[data-theme="dark-hc"] body:not(.portal-body) .navbar{background:rgba(16,27,40,.97);border-color:var(--d-line)}
[data-theme="dark"] .flat-brand,[data-theme="dark"] .nav-link,[data-theme="dark"] .icon-action,
[data-theme="dark-hc"] .flat-brand,[data-theme="dark-hc"] .nav-link,[data-theme="dark-hc"] .icon-action{color:var(--d-text)}
[data-theme="dark"] .flat-brand small,[data-theme="dark-hc"] .flat-brand small{color:var(--d-muted)}
[data-theme="dark"] .icon-action:hover,[data-theme="dark-hc"] .icon-action:hover{background:var(--d-surface)}
[data-theme="dark"] body:not(.portal-body) .btn-secondary,[data-theme="dark"] body:not(.portal-body) .btn-white,
[data-theme="dark"] body:not(.portal-body) .btn-sky,[data-theme="dark"] body:not(.portal-body) .btn-grape,
[data-theme="dark-hc"] body:not(.portal-body) .btn-secondary,[data-theme="dark-hc"] body:not(.portal-body) .btn-white,
[data-theme="dark-hc"] body:not(.portal-body) .btn-sky,[data-theme="dark-hc"] body:not(.portal-body) .btn-grape{color:#0B7A37;border-color:#0B7A37;background:transparent!important}

@media print{:root{--paper:#FFFFFF;--cream:#FFFFFF;--ink:#203040;--muted:#5C6B7A;--line:#EAF0F6}}

@media(max-width:1100px){
  body:not(.portal-body) .navbar .nav-row{flex-wrap:wrap}
  .flat-brand{min-width:0;flex:1}
  .site-nav{order:3;flex:1 0 100%;overflow-x:auto;justify-content:flex-start;border-top:1px solid var(--line);padding-top:8px}
  #mainNav{width:max-content;justify-content:flex-start;gap:20px;margin:auto}
}
@media(max-width:700px){
  body:not(.portal-body) section{padding:var(--s6) 0}
  .topbar .container{gap:8px;font-size:var(--fs-xs)}.tb-contact{gap:6px}.tb-contact [data-school-email]{display:none}
  .flat-brand strong{max-width:150px}.nav-actions{gap:8px}.nav-actions .nav-apply{padding-inline:12px}
  #mainNav{margin:0}.site-nav{scrollbar-width:none}.site-nav::-webkit-scrollbar{display:none}
  .hero-admission-strip ol{display:grid;grid-template-columns:1fr 1fr}
  .feat-grid,body[data-page="home"] .gal-grid,body[data-page="home"] .testi-rail{grid-template-columns:1fr}
  .final-cta{padding:var(--s4);align-items:flex-start;flex-direction:column}
}

/* ================================================================
   PHASE 2 — resilient navigation and information architecture
   ================================================================ */
.icon-action{text-decoration:none}
.foot-main{grid-template-columns:1.25fr repeat(4,minmax(0,1fr))}
.foot-brand .logo{color:#FFFFFF}
.foot-quick-grid{display:grid;gap:7px}
.foot-quick-grid a{color:#E5DCC2;text-decoration:none;font-size:var(--fs-sm)}
.foot-quick-grid a:hover{color:#FFFFFF}
.foot-bottom-row,.foot-legal{display:flex;gap:14px;align-items:center;justify-content:center;flex-wrap:wrap}
.static-site-footer{padding:var(--s6) 0 0}
.static-footer-grid{display:grid;grid-template-columns:1.25fr 1.4fr 1fr 1.2fr;gap:var(--s5);align-items:start}
.static-footer-grid h3{font-size:var(--fs-xs);letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:10px}
.static-footer-brand{display:inline-block;color:#FFFFFF;font-family:var(--font-head);font-size:var(--fs-md);font-weight:600;margin-bottom:10px}
.static-footer-about p,.static-footer-contact p,.static-footer-contact a{color:#E5DCC2;font-size:var(--fs-sm)}
.static-footer-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px}
.static-footer-links a{color:#E5DCC2;text-decoration:none;font-size:var(--fs-sm)}
.static-footer-links a:hover,.static-footer-contact a:hover{color:#FFFFFF}
.static-footer-bottom{border-top:1px solid #1C2A24;color:#9AA7B8;margin-top:var(--s5);padding:14px 0;display:flex;gap:16px;justify-content:space-between;flex-wrap:wrap;font-size:var(--fs-xs)}
.ia-section{margin-top:var(--s5)}
.ia-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s3)}
.ia-link{display:flex;align-items:flex-start;gap:12px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s3);color:var(--ink);text-decoration:none;box-shadow:var(--sh-1)}
.ia-link:hover{border-color:var(--green);box-shadow:var(--sh-2)}
.ia-link svg{width:22px;height:22px;flex:none;color:var(--green)}
.ia-link span{display:block}
.ia-link small{display:block;color:var(--muted);margin-top:3px}
.fee-static-contact{background:var(--gold-soft);border:1px solid var(--gold);border-radius:var(--r-md);padding:var(--s3);margin-bottom:var(--s4)}
.fee-static-contact p{margin:4px 0;color:var(--ink)}
.fee-static-contact a{font-weight:700}
.section-intro{margin-bottom:14px}
.class-level{margin-top:var(--s5)}
.class-level:first-of-type{margin-top:0}
.class-card p{color:var(--muted);font-size:var(--fs-sm)}
.class-card .class-link{color:var(--green);font-weight:800;font-size:var(--fs-sm)}
.svg-check{width:18px;height:18px;display:inline-block;vertical-align:middle}
@media(max-width:960px){.foot-main,.static-footer-grid{grid-template-columns:1fr 1fr}.ia-links{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.foot-main,.static-footer-grid,.ia-links{grid-template-columns:1fr}.static-footer-links{grid-template-columns:repeat(2,minmax(0,1fr))}.static-footer-bottom{justify-content:center;text-align:center}}
[data-theme="dark"] .ia-link{background:var(--paper);border-color:var(--line);color:var(--ink)}
[data-theme="dark"] .fee-static-contact{background:var(--paper);border-color:var(--gold)}

.card-sun{background:var(--gold-soft)}
.card-sky{background:var(--sky-soft)}
.card-mint{background:var(--mint-soft)}
.page-hero-link{margin-top:14px}
.text-link{color:var(--green);font-weight:700}

/* PHASE 2 INLINE-STYLE MIGRATION */
.u51-001{margin-top:34px}
.u51-002{margin:0 auto 22px}
.u51-003{font-size:var(--fs-md)}
.u51-004{color:var(--muted);font-weight:600}
.u51-005{margin-bottom:22px}
.u51-006{text-align:center;margin:12px 0 0}
.u51-007{max-width:420px;margin:10px auto 0}
.u51-008{width:100%;padding:12px 14px;border-radius:var(--r-md);border:1px solid var(--line);background:var(--white);color:var(--ink)}
.u51-009{display:none;position:fixed;inset:0;background:rgba(3,10,6,.55);z-index:var(--z-modal)}
.u51-010{display:none;position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(480px,92vw);max-height:86vh;overflow-y:auto;background:var(--white);border:1px solid var(--gold);border-radius:var(--r-lg);box-shadow:var(--sh-3);padding:22px;z-index:var(--z-alert)}
.u51-011{max-width:860px;margin:0 auto}
.u51-012{width:100%;border-radius:var(--r-md);display:block}
.u51-013{margin:10px 0 0;font-size:var(--fs-sm)}
.u51-014{margin-top:26px;text-align:center}
.u51-015{margin-top:0}
.u51-016{margin:0 0 14px}
.u51-017{margin-left:8px}
.u51-018{max-width:680px;margin:0 auto 14px;display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.u51-019{flex:1;min-width:180px;margin:0}
.u51-020{width:180px;margin:0}
.u51-021{max-width:640px;margin:26px auto 8px}
.u51-022{display:flex;gap:8px;align-items:center}
.u51-023{width:auto}
.u51-024{margin-top:10px}
.u51-025{margin-bottom:0}
.u51-026{text-align:center;margin:26px 0 8px}
.u51-027{text-align:center}
.u51-028{font-size:var(--fs-xl);font-weight:800;color:#0E5A2E}
.u51-029{margin:2px 0 0}
.u51-030{margin-top:22px}
.u51-031{display:inline-flex;width:84px;height:84px;border-radius:var(--r-pill);background:var(--green-deep);color:#FFFFFF;font-weight:800;font-size:var(--fs-xl);align-items:center;justify-content:center;margin-bottom:8px}
.u51-032{font-size:var(--fs-sm);margin:4px 0}
.u51-033{margin:0}
.u51-034{margin:3px 0 0;font-weight:800;color:#0B7A37}
.u51-035{margin:8px 0 0;font-size:var(--fs-sm)}
.u51-036{margin-top:6px}
.u51-038{aspect-ratio:16/9}
.u51-039{color:var(--muted)}
.u51-040{max-width:520px;margin:0 auto}
.u51-041{margin:0 0 6px;font-size:var(--fs-base)}
.u51-042{background:var(--mint-soft);color:#0B7A37}
.u51-043{display:inline-flex;width:84px;height:84px;border-radius:var(--r-pill);background:var(--gold);color:#FFFFFF;font-weight:800;font-size:var(--fs-xl);align-items:center;justify-content:center;margin-bottom:8px}
.u51-044{width:96px;height:96px;border-radius:var(--r-pill);object-fit:cover;display:block;margin:0 auto}
.u51-045{display:flex;width:96px;height:96px;border-radius:var(--r-pill);background:var(--green-deep);color:#FFFFFF;font-weight:800;font-size:var(--fs-xl);align-items:center;justify-content:center;margin:0 auto}
.u51-046{margin:6px 0;font-size:var(--fs-sm)}
.u51-047{background:var(--sun-soft);color:var(--green-deep)}
.u51-048{margin:10px 0 4px}
.u51-049{text-align:center;margin-top:12px}
.u51-050{width:100%;max-width:420px;border-radius:var(--r-lg);box-shadow:var(--sh-2)}
.u51-051{margin:12px 0 4px}
.u51-052{margin:14px 0 6px;font-weight:800}
.u51-053{margin:0;padding-left:22px}
.u51-054{margin:6px 0;font-size:var(--fs-sm)}
.u51-055{color:var(--muted);font-size:var(--fs-xs)}
.u51-056{margin:10px 0 0;font-size:var(--fs-sm);color:var(--muted)}
.u51-057{margin:12px 0 0;font-size:var(--fs-sm);border-left:3px solid var(--green);padding-left:10px}
.u51-058{text-align:center;margin-top:14px}
.u51-059{color:var(--muted);font-size:var(--fs-xs)}
.u51-060{display:flex;justify-content:flex-end;margin-top:10px}
.u51-061{display:none;margin-top:10px}
.u51-062{background:var(--sun)}
.u51-063{flex:1}
.u51-064{margin-top:8px}
.u51-065{text-align:center;margin-top:14px;font-size:var(--fs-sm);color:var(--muted)}
.u51-066{text-align:center;margin-top:8px;font-weight:600;font-size:var(--fs-sm)}
.u51-067{font-size:var(--fs-sm)}
.u51-068{display:none}
.u51-069{display:flex;gap:8px;align-items:stretch}
.u51-070{display:inline-flex;align-items:center;padding:0 10px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--white);font-weight:800}
.u51-071{flex:1;min-width:0}
.u51-072{font-size:var(--fs-sm)}
.u51-073{visibility:hidden}
.u51-074{max-width:480px}
.u51-075{background:var(--mint)}
.u51-076{color:var(--muted);font-size:var(--fs-sm)}
.u51-077{font-size:var(--fs-sm);margin:6px 0 4px;color:var(--muted)}
.u51-078{gap:14px;margin-bottom:10px}
.u51-079{display:flex;align-items:center;gap:6px}
.u51-080{text-align:center;font-weight:600;margin:14px 0 0}
.u51-081{color:var(--danger)}
.u51-082{display:flex;gap:8px;margin-bottom:12px}
.u51-083{font-size:var(--fs-xs);color:var(--muted)}
.u51-084{display:flex;gap:10px;margin-top:12px}
.u51-085{text-align:center;font-weight:600}
.u51-086{text-align:left}
.u51-087{margin-bottom:14px}
.u51-088{flex:1;min-width:200px}
.u51-089{font-weight:800}
.u51-090{text-align:center;margin-top:26px}
.u51-091{width:40px;height:40px;flex-basis:40px}
.u51-092{color:var(--green-deep)}
.u51-093{min-width:70px;text-align:right}
.u51-094{display:flex;justify-content:space-between;align-items:center;margin:14px 0}
.u51-095{font-size:var(--fs-xl);color:#0E3B21}
.u51-096{display:flex;gap:10px}
.u51-097{margin-top:12px}
.u51-098{display:flex;gap:10px;margin-top:14px}
.u51-099{text-align:center;color:var(--green)}
.u51-100{background:var(--sky)}
.u51-101{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.u51-102{margin:18px 0;border-left:6px solid var(--gold)}
.u51-103{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.u51-104{margin:18px 0}
.u51-105{display:flex;gap:8px;flex-wrap:wrap}
.u51-106{margin-top:26px}
.u51-107{margin-top:14px}
.u51-108{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.u51-109{background:var(--coral)}
.u51-110{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.u51-111{color:var(--muted);font-size:var(--fs-sm)}
.u51-112{margin-top:6px;font-size:var(--fs-sm)}
.u51-113{margin:0 0 18px}
.u51-114{text-align:right}
.u51-115{overflow-x:auto}
.u51-116{font-weight:600;color:var(--muted)}
.u51-117{margin-top:16px}
.u51-118{font-weight:700}
.u51-119{padding-top:26px;padding-bottom:0}
.u51-120{grid-template-columns:1fr;max-width:860px;margin:0 auto}
.u51-121{margin:0;max-width:none}
.u51-122{background:var(--mint-soft)}
.u51-123{margin-bottom:6px}
.u51-124{margin-bottom:8px}
.u51-125{margin:4px 0}
.u51-126{padding-top:0}
.u51-127{margin-top:14px;text-align:center}
.u51-128{padding-top:10px}
.u51-129{max-width:800px}
.u51-130{max-width:680px}
.u51-131{margin:10px 0}
.u51-132{margin:0 0 8px}
.u51-133{margin:0 0 8px;background:var(--mint-soft);border-radius:var(--r-sm);padding:8px}
.u51-134{width:100%}
.u51-135{width:100%;min-width:560px}
.u51-136{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}
.u51-137{text-align:center;margin:20px 0 8px}
.u51-138{text-align:right;font-weight:800;color:#0B7A37}
.u51-139{padding:12px 14px}
.u51-140{color:#0B7A37}
.u51-141{margin:4px 0 0;font-size:var(--fs-sm)}

/* ================================================================
   HEADER & IDENTITY REBUILD — flat topbar + navbar, no overlap layers
   ================================================================ */
body:not(.portal-body) .topbar{
  position:sticky;top:0;z-index:calc(var(--z-nav) + 1);height:44px;min-height:44px;max-height:44px;
  overflow:hidden;background:var(--green-deep);color:#E5DCC2;border-bottom:2px solid var(--gold);
  transform:translateY(0);opacity:1;transition:transform 180ms ease,opacity 120ms ease;will-change:transform;
}
body:not(.portal-body) .topbar-row{
  position:relative;width:min(1180px,94%);height:42px;display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:18px;
}
.topbar a{color:var(--gold);text-decoration:none}.topbar a:hover{color:#E5DCC2}
.tb-contact,.tb-right,.tb-admissions{display:flex;align-items:center}
.tb-contact{gap:9px;min-width:0;white-space:nowrap}.tb-admissions{gap:6px}.tb-admissions b{color:var(--gold)}
.tb-email{overflow:hidden;text-overflow:ellipsis}.tb-sep{color:var(--gold)}
.tb-motto{margin:0;color:var(--gold);font-family:var(--font-head);font-size:var(--fs-sm);font-style:italic;text-align:center;white-space:nowrap}
.tb-motto::before,.tb-motto::after{content:"";display:inline-block;width:8px;height:8px;margin:0 8px;background:var(--gold);clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%);font-style:normal}
.tb-right{justify-content:flex-end;gap:12px;white-space:nowrap}
.topbar .portal-link{
  height:28px;display:inline-flex;align-items:center;justify-content:center;padding:0 13px;
  color:var(--gold);background:transparent;border:1px solid var(--gold);border-radius:var(--r-pill);
  font-family:var(--font-body);font-size:var(--fs-xs);font-weight:700;
}
.topbar .portal-link:hover{background:transparent;color:#E5DCC2;border-color:#E5DCC2}

body:not(.portal-body) .navbar{
  position:sticky;top:44px;z-index:var(--z-nav);transform:translateY(0);
  background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);box-shadow:var(--sh-1);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:transform 180ms ease;
}
body:not(.portal-body) .navbar .nav-row{
  width:min(1180px,94%);min-height:76px;display:flex;align-items:center;justify-content:space-between;
  flex-wrap:nowrap;gap:12px;padding:10px 0;
}
.flat-brand{min-width:226px;display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none}
.brand-logo-shell{
  width:48px;height:48px;flex:0 0 48px;display:grid;place-items:center;padding:3px;
  border:2px solid var(--gold);border-radius:var(--r-pill);background:var(--green-deep);
}
.flat-brand .logo-badge{width:38px;height:38px;border:0;border-radius:var(--r-pill);object-fit:cover;box-shadow:none}
.brand-copy{display:flex;min-width:0;flex-direction:column;line-height:1.08}
.flat-brand .brand-copy strong{
  color:var(--green);font-family:var(--font-head);font-size:var(--fs-sm);font-weight:700;
  letter-spacing:.05em;white-space:nowrap;
}
.flat-brand .brand-copy small{margin-top:5px;color:var(--muted);font-size:var(--fs-xs);white-space:nowrap}
.flat-brand .brand-copy small i{color:var(--gold);font-style:normal;font-weight:800}.flat-brand .brand-copy small b{color:var(--muted)}
body:not(.portal-body) .site-nav{display:flex;align-items:center;justify-content:center;min-width:0;flex:1;order:initial;border:0;padding:0;overflow:visible}
body:not(.portal-body) #mainNav{width:auto;display:flex;align-items:center;justify-content:center;gap:4px;margin:0}
.nav-link{
  position:relative;min-height:40px;display:inline-flex;align-items:center;padding:7px 10px;
  border-radius:var(--r-pill);color:var(--ink);font-size:var(--fs-sm);font-weight:600;text-decoration:none;white-space:nowrap;
}
.nav-link:hover{color:var(--green);background:var(--gold-soft)}
.nav-link.on,.nav-link[aria-current="page"]{color:var(--green);background:transparent}
.nav-link.on::after,.nav-link[aria-current="page"]::after{
  content:"";position:absolute;left:50%;bottom:1px;width:22px;height:3px;
  border-radius:var(--r-pill);background:var(--gold);transform:translateX(-50%);
}
.nav-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex:none;margin:0}
.icon-action,.theme-btn,.menu-toggle{
  width:44px;height:44px;display:grid;place-items:center;flex:0 0 44px;padding:0;
  border:1px solid var(--line);border-radius:var(--r-md);background:transparent;color:var(--ink);
  box-shadow:none;cursor:pointer;text-decoration:none;
}
.icon-action:hover,.theme-btn:hover,.menu-toggle:hover{background:var(--gold-soft);color:var(--green);transform:none;box-shadow:none}
.nav-actions .nav-apply,.drawer-apply{
  min-height:44px;padding:10px 19px;border:0;border-radius:var(--r-pill);
  background:linear-gradient(135deg,#D9B44A,var(--gold));color:var(--green-deep);
  font-family:var(--font-body);font-weight:800;box-shadow:none;
}
.nav-actions .nav-apply:hover,.drawer-apply:hover{background:linear-gradient(135deg,#D9B44A,var(--gold));color:var(--green-deep);transform:translateY(-1px)}
.sticky-portal svg,.menu-toggle span{pointer-events:none}
.menu-toggle{display:none;position:relative}
.menu-toggle span{position:absolute;width:20px;height:2px;border-radius:var(--r-pill);background:currentColor;transition:transform 180ms ease,opacity 120ms ease}
.menu-toggle span:nth-child(1){transform:translateY(-6px)}.menu-toggle span:nth-child(3){transform:translateY(6px)}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:rotate(-45deg)}
.drawer-actions{display:none}.nav-veil{display:none}

/* The topbar's layout space stays reserved; only visual transforms move, so
   the sticky navbar reaches the viewport top without a content jump. */
body.topbar-collapsed:not(.portal-body) .topbar{max-height:0;transform:translateY(-100%);opacity:0}
body.topbar-collapsed:not(.portal-body) .navbar{transform:translateY(-44px)}

[data-theme="dark"] body:not(.portal-body) .topbar,[data-theme="dark-hc"] body:not(.portal-body) .topbar{background:var(--green-deep)}
[data-theme="dark"] body:not(.portal-body) .navbar,[data-theme="dark-hc"] body:not(.portal-body) .navbar{background:var(--d-surface);border-color:var(--d-line)}
[data-theme="dark"] .flat-brand .brand-copy strong,[data-theme="dark-hc"] .flat-brand .brand-copy strong{color:var(--d-text)}
[data-theme="dark"] .nav-link,[data-theme="dark"] .icon-action,[data-theme="dark"] .theme-btn,[data-theme="dark"] .menu-toggle,
[data-theme="dark-hc"] .nav-link,[data-theme="dark-hc"] .icon-action,[data-theme="dark-hc"] .theme-btn,[data-theme="dark-hc"] .menu-toggle{color:var(--d-text)}
[data-theme="dark"] .nav-link:hover,[data-theme="dark-hc"] .nav-link:hover{color:var(--gold);background:var(--gold-soft)}

.topbar a:focus-visible,.navbar a:focus-visible,.navbar button:focus-visible,.site-nav a:focus-visible{
  outline:2px solid var(--gold);outline-offset:3px;
}

@media(min-width:960px) and (max-width:1120px){
  body:not(.portal-body) .topbar-row{gap:8px}
  .tb-contact,.tb-right{gap:6px;font-size:var(--fs-xs)}.tb-motto{font-size:var(--fs-xs)}.topbar .portal-link{padding-inline:8px}
  body:not(.portal-body) .navbar .nav-row{gap:8px}
  .flat-brand{min-width:180px;gap:8px}.brand-logo-shell{width:44px;height:44px;flex-basis:44px}.flat-brand .logo-badge{width:34px;height:34px}
  .flat-brand .brand-copy strong{font-size:var(--fs-xs)}.flat-brand .brand-copy small{display:none}
  body:not(.portal-body) #mainNav{gap:2px}.nav-link{min-height:36px;padding:6px 5px;font-size:var(--fs-xs)}
  .nav-actions{gap:4px}.icon-action,.theme-btn{width:40px;height:40px;flex-basis:40px}.nav-actions .nav-apply{min-height:40px;padding:8px 11px;font-size:var(--fs-xs)}
}
@media(max-width:959px){
  html.js{overflow-x:clip}
  body:not(.portal-body) .topbar-row{grid-template-columns:1fr auto;gap:10px}
  .tb-motto,.tb-email,.tb-location,.tb-contact .tb-sep{display:none}
  .tb-contact{overflow:hidden}.tb-admissions{font-size:var(--fs-xs)}
  .topbar .portal-link{padding-inline:10px}
  body:not(.portal-body) .navbar .nav-row{min-height:70px;gap:8px}
  .flat-brand{min-width:0;flex:1}.brand-copy{overflow:hidden}.flat-brand .brand-copy small{display:none}
  .flat-brand .brand-copy strong{font-size:var(--fs-xs);overflow:hidden;text-overflow:ellipsis}
  .nav-actions{gap:6px}
  html.js .menu-toggle{display:grid}
  html.js .desktop-apply,html.js .sticky-portal{display:none}
  html.js body:not(.portal-body) .site-nav{
    position:fixed;inset:0 0 0 auto;z-index:calc(var(--z-dropdown) + 1);width:min(86vw,360px);height:100dvh;
    display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:84px 22px 22px;
    overflow-y:auto;background:var(--green-deep);border:0;transform:translateX(105%);
    visibility:hidden;pointer-events:none;transition:transform 180ms ease,visibility 0s linear 180ms;
  }
  html.js body.nav-open .site-nav{transform:translateX(0);visibility:visible;pointer-events:auto;transition:transform 180ms ease}
  html.js body:not(.portal-body) .site-nav #mainNav{width:100%;display:flex;flex-direction:column;align-items:stretch;gap:2px;margin:0}
  html.js .site-nav .nav-link{
    width:100%;min-height:44px;justify-content:flex-start;padding:10px 14px;border-radius:var(--r-sm);
    color:var(--cream);font-size:var(--fs-base);
  }
  html.js .site-nav .nav-link:hover{color:var(--gold);background:rgba(255,255,255,.06)}
  html.js .site-nav .nav-link.on,html.js .site-nav .nav-link[aria-current="page"]{color:var(--gold);background:rgba(255,255,255,.05)}
  html.js .site-nav .nav-link.on::after,html.js .site-nav .nav-link[aria-current="page"]::after{
    left:0;top:6px;bottom:6px;width:4px;height:auto;border-radius:0;transform:none;
  }
  html.js .drawer-actions{display:grid;gap:10px;margin-top:auto;padding-top:24px;border-top:1px solid rgba(229,220,194,.24)}
  .drawer-apply,.drawer-portal,.drawer-phone{width:100%;min-height:44px;display:flex;align-items:center;justify-content:center;text-align:center;text-decoration:none}
  .drawer-portal{border:1px solid var(--gold);border-radius:var(--r-pill);color:var(--gold);font-weight:700}
  .drawer-phone{color:var(--cream);font-size:var(--fs-sm)}
  html.js .nav-veil{position:fixed;inset:0;z-index:var(--z-dropdown);display:block;background:rgba(14,59,33,.58);border:0}
  html.js .nav-veil[hidden]{display:none}
  html.js body.nav-open{overflow:hidden}
  /* A transformed ancestor would capture a fixed descendant. Temporarily
     neutralise only the navbar transform while its viewport drawer is open. */
  html.js body.nav-open:not(.portal-body) .navbar{z-index:calc(var(--z-dropdown) + 1);transform:none;backdrop-filter:none;-webkit-backdrop-filter:none}
  html.js body.nav-open.topbar-collapsed:not(.portal-body) .navbar{top:0}
  html.js body.nav-open .menu-toggle{position:fixed;top:57px;right:3%;z-index:calc(var(--z-dropdown) + 2);color:var(--cream);border-color:var(--gold)}
  html.js body.nav-open.topbar-collapsed .menu-toggle{top:13px}

  /* No-JS fallback keeps every static nav destination reachable. */
  html:not(.js) body:not(.portal-body) .navbar .nav-row{flex-wrap:wrap}
  html:not(.js) body:not(.portal-body) .site-nav{order:3;flex:1 0 100%;overflow-x:auto;justify-content:flex-start;border-top:1px solid var(--line);padding-top:8px}
  html:not(.js) body:not(.portal-body) #mainNav{width:max-content;gap:12px}
}
@media(max-width:520px){
  body:not(.portal-body) .navbar .nav-row{width:min(96%,1180px)}
  .brand-logo-shell{width:44px;height:44px;flex-basis:44px}.flat-brand .logo-badge{width:34px;height:34px}
  .flat-brand .brand-copy strong{max-width:106px;font-size:var(--fs-xs);letter-spacing:.035em}
  .tb-admissions span{font-size:var(--fs-xs)}.topbar .portal-link{font-size:var(--fs-xs);padding-inline:8px}
}
@media(prefers-reduced-motion:reduce){
  body:not(.portal-body) .topbar,body:not(.portal-body) .navbar,.menu-toggle span,html.js body:not(.portal-body) .site-nav{transition:none!important}
}

/* Mobile Chromium treats overflow-x:hidden on body as a scroll container,
   which defeats sticky headers. Clip prevents horizontal paint overflow without
   capturing vertical scroll, so the flat header remains reachable. */
@supports(overflow:clip){body:not(.portal-body){overflow-x:clip}}

/* Batch 53 accessibility contrast and semantic-heading companion rules. */
.hero h1 em{color:var(--green)}
.hero-figure figcaption{color:var(--ink);opacity:1}
.gal .cap{color:var(--paper)}
.count-bar,.count-bar:hover{color:var(--green-deep)}
.foot-col h2{margin:0 0 12px;color:var(--sun);font-family:var(--font-body);font-size:var(--fs-xs);font-weight:800;letter-spacing:.14em;line-height:1.3;text-transform:uppercase}
[data-theme="dark"] .hero h1 em,[data-theme="dark-hc"] .hero h1 em{color:var(--gold)}
.site-footer .foot-brand p,.site-footer .acc-cap,.site-footer .acc-note{color:var(--cream)}
.site-footer a.btn.btn-white,.site-footer a.btn.btn-white:hover{color:var(--cream)!important;background:transparent;border-color:var(--cream)}