/* Light theme: neumorphic soft UI. */
/* ── Light theme: neumorphic soft UI. One shared ground; depth comes from paired light/dark shadows.
   Raised = can be pressed or read as a card; pressed (inset) = selected, current, or a well for input. ── */
html.neu {
  --paper: #E4E9F0; --surface: #E4E9F0; --sunk: #E4E9F0; --line: #CDD5E0;
  --rail: #E4E9F0; --rail-ink: #4B5870; --brass: #8E6512; --brass-soft: #EEE2C4;
  --nl: #FFFFFF; --nd: #B5C0CF;
  --raise: 8px 8px 18px var(--nd), -8px -8px 18px var(--nl);
  --raise-sm: 4px 4px 9px var(--nd), -4px -4px 9px var(--nl);
  --press: inset 5px 5px 10px var(--nd), inset -5px -5px 10px var(--nl);
  --press-sm: inset 2px 2px 5px var(--nd), inset -2px -2px 5px var(--nl);
  --r: 16px;
}
html.neu .rail { box-shadow: 6px 0 20px rgba(150, 165, 186, .45); }
html.neu .brand, html.neu .rail-foot { border-color: rgba(18, 33, 59, .08); }
html.neu .brand b, html.neu .rail-foot .who { color: var(--ink); }
html.neu .nav { padding: 14px; gap: 8px; }
html.neu .nav button { border-left: 0; border-radius: 12px; padding: 10px 14px; transition: box-shadow .15s, color .15s; }
html.neu .nav button:hover { background: none; color: var(--ink); box-shadow: var(--raise-sm); }
html.neu .nav button.on { background: none; color: var(--brass); font-weight: 700; box-shadow: var(--press); }
html.neu .topbar { color: var(--ink); box-shadow: 0 6px 16px rgba(150, 165, 186, .45); }
html.neu .tabs { box-shadow: 0 -6px 16px rgba(150, 165, 186, .45); gap: 6px; }
html.neu .tabs button.on { color: var(--brass); background: none; box-shadow: var(--press-sm); }
html.neu .theme-btn { background: var(--paper); color: var(--ink); border: 0; box-shadow: var(--raise-sm); }
html.neu .theme-btn:active { box-shadow: var(--press-sm); }

html.neu .panel, html.neu .phase, html.neu .sec, html.neu .q, html.neu .tbl-wrap, html.neu .result { border-color: transparent; box-shadow: var(--raise); }
html.neu .mod-card { border-color: transparent; border-radius: 14px; box-shadow: var(--raise-sm); }
html.neu .btn { border-color: transparent; border-radius: 10px; box-shadow: var(--raise-sm); transition: box-shadow .15s; }
html.neu .btn:hover { border-color: transparent; box-shadow: 6px 6px 12px var(--nd), -6px -6px 12px var(--nl); }
html.neu .btn:active, html.neu .btn.on { background: var(--paper); color: var(--brass); box-shadow: var(--press-sm); }
html.neu .btn.primary { background: var(--brass); color: #fff; }
html.neu .btn.primary:active { background: var(--brass); color: #fff; box-shadow: inset 3px 3px 6px rgba(0, 0, 0, .28); }
html.neu .btn[disabled] { box-shadow: none; }
html.neu .chip.dim { border-color: transparent; box-shadow: var(--press-sm); }
html.neu .stat { border-radius: 14px; box-shadow: var(--press); }
html.neu .field input, html.neu .field select { border-color: transparent; border-radius: 10px; box-shadow: var(--press-sm); }

html.neu .hero { color: var(--ink); border-radius: 20px; box-shadow: var(--raise); }
html.neu .hero .sub, html.neu .wk .ph, html.neu .wk .n small, html.neu .tide-legend, html.neu .week-pick label { color: var(--ink-2); }
html.neu .tide { height: 40px; padding: 7px; border-radius: 12px; box-shadow: var(--press-sm); }
html.neu .tide i { opacity: .45; }
html.neu .week-pick select { background: var(--paper); color: var(--ink); border-color: transparent; border-radius: 10px; box-shadow: var(--press-sm); }
html.neu .hero .btn.sm { background: var(--paper); color: var(--ink); border-color: transparent; }

html.neu .weeks, html.neu .week { border-color: rgba(18, 33, 59, .07); }
html.neu .week.cur { background: none; box-shadow: var(--press-sm); }

html.neu .lesson-head { color: var(--ink); box-shadow: 0 6px 16px rgba(150, 165, 186, .45); }
html.neu .lesson-head .x { background: var(--paper); color: var(--ink); box-shadow: var(--raise-sm); }
html.neu .ltabs { gap: 8px; padding-bottom: 12px; }
html.neu .ltabs button { border-bottom: 0; border-radius: 10px; }
html.neu .ltabs button.on { color: var(--brass); box-shadow: var(--press-sm); }
html.neu .secnav, html.neu .thumbs { padding: 8px 8px 12px; margin: -8px -8px -4px; gap: 10px; }
html.neu .secnav button, html.neu .thumbs button { border-color: transparent; box-shadow: var(--raise-sm); }
html.neu .secnav button.on, html.neu .thumbs button.on { background: var(--paper); color: var(--brass); box-shadow: var(--press-sm); }
html.neu .card, html.neu .acro div, html.neu .flow div { border-color: transparent; border-radius: 12px; box-shadow: var(--raise-sm); }
html.neu .note { border: 0; border-left: 4px solid var(--p2); border-radius: 12px; box-shadow: var(--press-sm); }
html.neu .note.warn { border-left-color: var(--bad); }
html.neu .opt { border-color: transparent; border-radius: 12px; box-shadow: var(--raise-sm); }
html.neu .opt.sel { box-shadow: var(--press-sm); }
html.neu .opt.right { border-color: var(--ok); box-shadow: var(--press-sm); }
html.neu .opt.wrong { border-color: var(--bad); box-shadow: var(--press-sm); }
html.neu .result.pass { border-color: var(--ok); }
html.neu .result.fail { border-color: var(--bad); }
html.neu .deck-bar .prog { border-color: transparent; height: 10px; box-shadow: var(--press-sm); }
html.neu .score { border-color: transparent; box-shadow: var(--raise-sm); }
html.neu .lesson:not(.pres) .stage { box-shadow: var(--raise); }
/* Full-screen presenting keeps the dark briefing screen, so drop the soft shadows there. */
html.neu .lesson.pres .deck-bar .btn, html.neu .lesson.pres .deck-bar .prog, html.neu .lesson.pres .score { box-shadow: none; }
html.neu .lesson.pres .deck-bar .btn.primary { background: var(--brass); }

.theme-btn { margin-top: 10px; width: 100%; background: rgba(255, 255, 255, .08); color: #fff; border: 1px solid rgba(255, 255, 255, .16); border-radius: 8px; padding: 7px 10px; font-size: .78rem; font-weight: 600; }
.topbar .theme-btn { margin: 0 0 0 auto; width: auto; }