/* =========================================================================
   TTD UI — shared design system for the TheTradingDad portal
   (student area + admin). One stylesheet, one app shell, one component kit.
   The same tokens/components are intended for the public thetradingdad.com
   site so the brand carries through without a seam.

   Brand rules: warm cream background (never dark), Playfair Display for
   headings, Plus Jakarta Sans for body, gold accent, soft pastel tints.
   ========================================================================= */
:root{
  /* Surfaces & ink */
  --bg:#FAF8F3; --surface:#FFFFFF; --surface-2:#F5F1E8; --surface-3:#EFE9DD;
  --ink:#2E2A25; --ink-2:#4A443C; --muted:#6F675D; --faint:#9A9185;
  --line:#E9E3D6; --line-2:#F1ECE1;
  /* Brand gold */
  --gold:#C9A84C; --gold-ink:#3D2F0B; --gold-deep:#8A6D1F; --gold-soft:#FFF3DA; --gold-line:#EBD9A6;
  /* Pastel accents: base / soft tint / readable ink */
  --teal:#8FCBC4; --teal-soft:#E6F4F2; --teal-ink:#2E6B64;
  --peach:#F4B996; --peach-soft:#FDEEE5; --peach-ink:#8A4A24;
  --blue:#A9C7E8; --blue-soft:#E8F1FA; --blue-ink:#2F4F73;
  --sage:#A8C3A0; --sage-soft:#EAF3E6; --sage-ink:#3E5E37;
  --lav:#CDBFE6; --lav-soft:#F1ECF8; --lav-ink:#574780;
  /* Type */
  --font-head:'Playfair Display',Georgia,'Times New Roman',serif;
  --font-body:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  /* Shape & depth */
  --r-sm:10px; --r-md:14px; --r-lg:18px; --r-xl:22px;
  --shadow-sm:0 1px 2px rgba(46,42,37,.05);
  --shadow-md:0 6px 20px rgba(46,42,37,.08);
  --shadow-lg:0 18px 48px rgba(46,42,37,.14);
  /* Shell */
  --side-w:264px; --top-h:60px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body.app{background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:15px;line-height:1.55;padding:0;min-height:100vh;-webkit-font-smoothing:antialiased}
body.app a{color:inherit}
body.app :focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:6px}
.skip{position:absolute;left:-9999px;top:8px}
.skip:focus{left:12px;z-index:100;background:var(--surface);padding:8px 14px;border-radius:var(--r-sm);box-shadow:var(--shadow-md)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ic{display:inline-block;flex:none;vertical-align:middle}

/* ---------- App shell ---------------------------------------------------- */
.app-side{position:fixed;top:0;bottom:0;left:0;width:var(--side-w);background:var(--surface);border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:40}
.app-brand{position:relative;display:flex;align-items:center;justify-content:center;padding:22px 18px 6px}
.app-brand a{display:block;text-decoration:none}
.brand-logo{display:block;width:173px;max-width:100%;height:auto}
.brand-mark{display:none}
.app-area{display:inline-flex;align-self:center;margin:8px 0 4px;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-deep);background:var(--gold-soft);border:1px solid var(--gold-line);padding:3px 9px;border-radius:999px}
.app-nav{flex:1;overflow-y:auto;padding:4px 12px 18px;scrollbar-width:thin}
.nav-group{margin-top:16px}
.nav-label{font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--faint);padding:0 12px 6px}
.nav-item{position:relative;display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:var(--r-sm);color:var(--ink-2);text-decoration:none;font-size:14px;font-weight:500;line-height:1.3;transition:background .12s ease,color .12s ease}
body.app .nav-item{color:var(--ink-2)}
.nav-item .ic{color:var(--muted)}
.nav-item:hover{background:var(--surface-2);color:var(--ink)}
.nav-item.on{background:var(--gold-soft);color:var(--ink);font-weight:700}
.nav-item.on .ic{color:var(--gold-deep)}
.nav-item.on::before{content:"";position:absolute;left:-12px;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--gold)}
.nav-item.locked{color:var(--muted)}
.nav-badge{margin-left:auto;font-size:11px;font-weight:700;line-height:1;background:var(--peach);color:#6b3115;border-radius:999px;padding:4px 8px}
.nav-lock{margin-left:auto;color:var(--faint)}
.app-user{border-top:1px solid var(--line);padding:14px 14px 14px 16px;display:flex;align-items:center;gap:10px}
.avatar{flex:none;width:36px;height:36px;border-radius:50%;background:var(--gold);color:var(--gold-ink);display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:700;font-size:14px}
.avatar.sm{width:32px;height:32px;font-size:13px}
.u-body{flex:1;min-width:0}
.u-name{font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.u-meta{font-size:12px;color:var(--muted)}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--r-sm);color:var(--muted);text-decoration:none;background:transparent;border:0;cursor:pointer;flex:none}
body.app button.icon-btn{background:transparent;padding:0;border:0;min-height:0;color:var(--muted)}
.icon-btn:hover{background:var(--surface-2);color:var(--ink)}
.app-close{display:none}
.app-brand .app-close{position:absolute;right:10px;top:14px}

.app-body{margin-left:var(--side-w);min-height:100vh;display:flex;flex-direction:column}
.app-top{display:none}
.app-main{flex:1;padding:32px 40px 40px}
.app-main .wrap{max-width:1160px;margin:0 auto}
.app-foot{padding:0 40px 28px}
.app-foot .wrap{max-width:1160px;margin:0 auto;border-top:1px solid var(--line);padding-top:16px;font-size:12px;color:var(--faint);display:flex;gap:6px 18px;flex-wrap:wrap}
.app-foot a{color:var(--muted)}
.app-scrim{display:none}
.app-tabbar{display:none}

@media (max-width:1023px){
  .app-side{width:min(304px,86vw);transform:translateX(-102%);visibility:hidden;transition:transform .22s ease,visibility 0s linear .22s}
  body.drawer-open .app-side{transform:none;visibility:visible;box-shadow:var(--shadow-lg);transition:transform .22s ease}
  body.drawer-open .app-scrim{display:block;position:fixed;inset:0;background:rgba(46,42,37,.38);z-index:35}
  body.drawer-open{overflow:hidden}
  .app-close{display:inline-flex}
  .app-body{margin-left:0}
  .app-top{display:flex;position:sticky;top:0;z-index:30;height:var(--top-h);align-items:center;gap:6px;padding:0 10px;background:rgba(250,248,243,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
  :root{--top-h:70px}
  .app-top .brand-logo{width:124px}
  .app-top .top-logo{position:absolute;left:50%;transform:translateX(-50%)}
  .app-collapse{display:none!important}
  .nav-text{position:static!important;width:auto!important;height:auto!important;clip:auto!important;overflow:visible!important}
  .app-top .spacer{flex:1}
  .app-main{padding:22px 16px 36px}
  .app-foot{padding:0 16px 24px}
  .app .tabs{top:var(--top-h)}
}
@media (max-width:767px){
  .app-student .app-tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;background:rgba(255,255,255,.97);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
  .app-student .app-body{padding-bottom:76px}
  .tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 0;font-size:11px;font-weight:600;color:var(--muted);text-decoration:none;background:none;border:0;font-family:inherit;cursor:pointer;border-radius:var(--r-sm)}
  body.app button.tab{background:none;padding:6px 0;min-height:0;color:var(--muted);font-size:11px;font-weight:600}
  .tab.on{color:var(--gold-deep)}
  .tab.on .ic{color:var(--gold-deep)}
}

/* ---------- Page header --------------------------------------------------- */
.ph{display:flex;align-items:flex-end;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;margin-bottom:26px}
.ph-main{min-width:0;flex:1 1 420px}
.ph-eyebrow{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:8px}
.crumb{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--muted);text-decoration:none;margin-bottom:8px;min-height:28px}
body.app .crumb{color:var(--muted)}
.crumb:hover{color:var(--ink)}
.ph-title{font-family:var(--font-head);font-size:34px;line-height:1.15;font-weight:700;letter-spacing:-.01em;margin:0}
.ph-sub{color:var(--muted);font-size:15px;margin-top:8px;max-width:680px}
.ph-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.ph-actions{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:640px){
  .ph{margin-bottom:20px}
  .ph-title{font-size:27px}
  .ph-actions{width:100%}
  .ph-actions .btn{flex:1 1 auto}
}

/* ---------- Buttons ------------------------------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-body);font-size:14px;font-weight:700;line-height:1;padding:12px 18px;min-height:44px;border-radius:999px;border:1.5px solid transparent;background:var(--gold);color:var(--gold-ink);text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .12s ease,border-color .12s ease,box-shadow .12s ease}
body.app a.btn{color:var(--gold-ink)}
.btn:hover{background:#BF9C3F;box-shadow:var(--shadow-sm)}
.btn-secondary{background:var(--surface);border-color:var(--line);color:var(--ink)}
body.app a.btn-secondary{color:var(--ink)}
.btn-secondary:hover{background:var(--surface);border-color:var(--gold)}
.btn-ghost{background:transparent;color:var(--ink-2)}
.btn-ghost:hover{background:var(--surface-2);box-shadow:none}
.btn-sm{min-height:36px;padding:8px 14px;font-size:13px}
.btn-block{width:100%}

/* ---------- Surfaces ------------------------------------------------------ */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-sm)}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 20px 12px}
.panel-title{font-family:var(--font-head);font-size:19px;font-weight:700;display:flex;align-items:center;gap:10px}
.panel-link{font-size:13px;font-weight:700;color:var(--gold-deep);text-decoration:none;white-space:nowrap}
body.app .panel-link{color:var(--gold-deep)}
.panel-link:hover{text-decoration:underline}
.panel-body{padding:0 20px 20px}

.section{margin-top:34px}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:14px}
.section-title{font-family:var(--font-head);font-size:22px;font-weight:700}
.section-sub{font-size:13px;color:var(--muted)}

/* ---------- Icon tiles (tinted squares) ----------------------------------- */
.itile{flex:none;width:44px;height:44px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center}
.itile.sm{width:36px;height:36px;border-radius:var(--r-sm)}
.t-gold{background:var(--gold-soft);color:var(--gold-deep)}
.t-teal{background:var(--teal-soft);color:var(--teal-ink)}
.t-peach{background:var(--peach-soft);color:var(--peach-ink)}
.t-blue{background:var(--blue-soft);color:var(--blue-ink)}
.t-sage{background:var(--sage-soft);color:var(--sage-ink)}
.t-lav{background:var(--lav-soft);color:var(--lav-ink)}
.t-grey{background:var(--surface-2);color:var(--faint)}

/* ---------- Module cards (navigation cards on dashboards) ----------------- */
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.mcard{position:relative;display:flex;flex-direction:column;gap:14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px;text-decoration:none;color:var(--ink);box-shadow:var(--shadow-sm);transition:box-shadow .15s ease,transform .15s ease,border-color .15s ease;min-height:150px}
body.app a.mcard{color:var(--ink)}
.mcard:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);border-color:#DED6C5}
.mc-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.mc-title{font-weight:700;font-size:16px;line-height:1.3}
.mc-sub{font-size:13px;color:var(--muted);margin-top:4px;line-height:1.45}
.mc-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;color:var(--muted);font-weight:600}
.mc-arrow{color:var(--faint);transition:transform .15s ease,color .15s ease}
.mcard:hover .mc-arrow{transform:translateX(3px);color:var(--gold-deep)}
.mcard.locked{background:#FCFBF8}
.mcard.locked .mc-title{color:var(--ink-2)}
@media (max-width:640px){
  .mgrid{grid-template-columns:1fr;gap:10px}
  .mcard{flex-direction:row;align-items:center;min-height:0;padding:14px;gap:14px}
  .mc-top{display:contents}
  .mcard .mc-top .chip,.mcard .mc-top .badge{order:3}
  .mc-body{flex:1;min-width:0}
  .mc-foot{display:none}
  .mcard::after{content:"";order:4;flex:none;width:8px;height:8px;border-right:2px solid var(--faint);border-top:2px solid var(--faint);transform:rotate(45deg);margin-right:4px}
}

/* ---------- KPI tiles ------------------------------------------------------ */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px 18px;box-shadow:var(--shadow-sm);text-decoration:none;color:var(--ink);display:block}
body.app a.kpi{color:var(--ink)}
a.kpi:hover{border-color:var(--gold-line)}
.kpi-top{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.kpi-n{font-family:var(--font-head);font-size:32px;font-weight:700;line-height:1.1;margin-top:10px}
.kpi-s{font-size:13px;color:var(--muted);margin-top:2px}
@media (max-width:900px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.kpis{gap:10px}.kpi{padding:14px}.kpi-n{font-size:26px}}

/* ---------- Chips & badges ------------------------------------------------- */
.chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;line-height:1.2;padding:4px 10px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);color:var(--muted);white-space:nowrap}
.chip.gold,.chip.price{background:var(--gold-soft);border-color:var(--gold-line);color:#6b5417}
.chip.sage,.chip.own,.chip.free{background:var(--sage-soft);border-color:#C9DCC2;color:var(--sage-ink)}
.chip.blue,.chip.part{background:var(--blue-soft);border-color:#C6DAEE;color:var(--blue-ink)}
.chip.peach,.chip.warn{background:var(--peach-soft);border-color:#F4CDB5;color:var(--peach-ink)}
.chip.lav{background:var(--lav-soft);border-color:#DCD1EE;color:var(--lav-ink)}

/* ---------- Alerts ----------------------------------------------------------- */
.flash{display:flex;gap:10px;align-items:flex-start;border-radius:var(--r-md);padding:12px 16px;font-size:14px;margin-bottom:18px;font-weight:500}
.flash.ok{background:var(--sage-soft);border:1px solid var(--sage);color:var(--sage-ink)}
.flash.err{background:var(--peach-soft);border:1px solid var(--peach);color:#7a3a18}
.flash.info{background:var(--blue-soft);border:1px solid var(--blue);color:var(--blue-ink)}

/* ---------- List rows ------------------------------------------------------- */
.lrows{display:flex;flex-direction:column}
.lrow{display:flex;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line-2);text-decoration:none;color:var(--ink)}
body.app a.lrow{color:var(--ink)}
.lrow:first-child{border-top:0}
a.lrow:hover .lr-title{color:var(--gold-deep)}
.lr-body{flex:1;min-width:0}
.lr-title{font-size:14px;font-weight:700;line-height:1.35}
.lr-sub{font-size:12px;color:var(--muted);margin-top:1px}
.lr-end{flex:none;font-size:12px;color:var(--faint);white-space:nowrap}

.empty-state{text-align:center;padding:26px 16px;color:var(--muted);font-size:14px}
.empty-state .ic{color:var(--faint);margin-bottom:6px}
.empty-state b{display:block;color:var(--ink);font-size:15px;margin-bottom:2px}

.progress{height:6px;background:var(--surface-3);border-radius:999px;overflow:hidden}
.progress > span{display:block;height:100%;background:var(--sage);border-radius:999px}

.muted{color:var(--muted)}
.clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* ---------- Dashboard layouts ---------------------------------------------- */
.dash-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:18px;margin-top:18px}
@media (max-width:1100px){.dash-grid{grid-template-columns:1fr}}

/* Hero banner (pinned announcement / upgrade) */
.hero{position:relative;display:flex;gap:16px;align-items:flex-start;border-radius:var(--r-xl);padding:22px 24px;border:1px solid var(--gold-line);background:linear-gradient(135deg,#FFF6E0 0%,#FFFDF7 60%,#FFFFFF 100%);box-shadow:var(--shadow-sm);overflow:hidden}
.hero .itile{background:var(--gold);color:var(--gold-ink)}
.hero-kicker{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-deep)}
.hero-title{font-family:var(--font-head);font-size:22px;font-weight:700;line-height:1.25;margin:4px 0 6px}
.hero-text{font-size:14px;color:var(--ink-2);white-space:pre-line}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.hero.upgrade{border-color:#DCD1EE;background:linear-gradient(135deg,#F1ECF8 0%,#FBF9FE 55%,#FFFFFF 100%)}
.hero.upgrade .itile{background:var(--lav);color:var(--lav-ink)}
.hero.upgrade .hero-kicker{color:var(--lav-ink)}
.perks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 18px;margin-top:10px;font-size:14px;color:var(--ink-2)}
.perks li{list-style:none;display:flex;gap:8px;align-items:center}
.perks .ic{color:var(--sage-ink)}
@media (max-width:640px){
  .hero{flex-direction:column;padding:18px}
  .hero-title{font-size:19px}
  .perks{grid-template-columns:1fr}
  .hero-actions .btn{flex:1}
}

/* Attention list (admin) */
.attn{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--r-md);text-decoration:none;color:var(--ink);border:1px solid var(--line);background:var(--surface);margin-top:8px}
body.app a.attn{color:var(--ink)}
.attn:first-child{margin-top:0}
.attn:hover{border-color:var(--gold-line);box-shadow:var(--shadow-sm)}
.attn.warn{background:#FFFAF6;border-color:#F4CDB5}
.attn.info{background:#F8FBFE}
.attn .lr-title{font-size:14px}
.all-clear{display:flex;gap:14px;align-items:center;padding:6px 0 4px}
.all-clear .itile{background:var(--sage-soft);color:var(--sage-ink)}

/* Wide data tables scroll inside their card on small screens instead of
   stretching the whole page sideways. */
.app-admin .card{overflow-x:auto;-webkit-overflow-scrolling:touch}
@media (max-width:767px){.app-admin .card table{min-width:560px}}

/* Phone refinements */
@media (max-width:640px){
  .section{margin-top:28px}
  .section-head{flex-direction:column;align-items:flex-start;gap:2px}
  .section-title{font-size:20px}
  .kpi-top{font-size:11px;letter-spacing:.04em;gap:8px;align-items:flex-start;line-height:1.3}
  .kpi-top .itile{display:none}
  .kpi-n{margin-top:6px}
  .panel-head{padding:16px 16px 10px}
  .panel-body{padding:0 16px 16px}
}

/* ---------- Display preferences (set on <html> by the boot script) ------- */
html[data-text="sm"] .app-main, html[data-text="sm"] .app-foot{zoom:.9}
html[data-text="lg"] .app-main, html[data-text="lg"] .app-foot{zoom:1.12}
html[data-text="xl"] .app-main, html[data-text="xl"] .app-foot{zoom:1.25}
html[data-text="lg"] .app-nav, html[data-text="lg"] .app-tabbar{zoom:1.06}
html[data-text="xl"] .app-nav, html[data-text="xl"] .app-tabbar{zoom:1.12}
html[data-contrast="high"]{--muted:#4A443C;--faint:#665E53;--ink-2:#2E2A25;--line:#D4C9B3;--line-2:#E2D9C7}
html[data-contrast="high"] .ph-sub, html[data-contrast="high"] .mc-sub, html[data-contrast="high"] .lr-sub{color:#4A443C}
html[data-motion="reduce"] *, html[data-motion="reduce"] *::before, html[data-motion="reduce"] *::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
html[data-motion="reduce"] .mcard:hover, html[data-motion="reduce"] .ccard:hover{transform:none}
@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* ---------- Settings page ---------------------------------------------------- */
.set-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:18px;align-items:start}
@media (max-width:1000px){.set-grid{grid-template-columns:1fr}}
.set-group{border:0;padding:0;margin:0 0 6px}
.set-label{font-weight:700;font-size:15px;color:var(--ink);padding:0}
.set-help{font-size:13px;color:var(--muted);margin:2px 0 12px}
.seg{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.seg-opt{position:relative;cursor:pointer}
.seg-opt input{position:absolute;opacity:0;pointer-events:none}
.seg-box{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;height:92px;padding:12px 6px;border:1.5px solid var(--line);border-radius:var(--r-md);background:var(--surface);text-align:center}
.seg-aa{font-family:var(--font-head);font-weight:700;line-height:1;color:var(--ink)}
.seg-name{font-size:12px;font-weight:600;color:var(--muted)}
.seg-opt:hover .seg-box{border-color:var(--gold-line)}
.seg-opt input:checked + .seg-box{border-color:var(--gold);background:var(--gold-soft);box-shadow:0 0 0 3px rgba(201,168,76,.18)}
.seg-opt input:checked + .seg-box .seg-name{color:var(--gold-deep)}
.seg-opt input:focus-visible + .seg-box{outline:2px solid var(--gold);outline-offset:2px}
.set-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;border-top:1px solid var(--line-2)}
.set-row .set-help{margin-bottom:0}
.switch{position:relative;flex:none;cursor:pointer;display:inline-flex}
.switch input{position:absolute;opacity:0;width:1px;height:1px}
.sw{width:48px;height:28px;border-radius:999px;background:var(--surface-3);border:1px solid var(--line);position:relative;transition:background .15s ease}
.sw::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:var(--shadow-sm);transition:transform .15s ease}
.switch input:checked + .sw{background:var(--gold);border-color:var(--gold)}
.switch input:checked + .sw::after{transform:translateX(20px)}
.switch input:focus-visible + .sw{outline:2px solid var(--gold);outline-offset:2px}
.factions-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
@media (max-width:520px){.seg{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Small course cover used in "Continue learning" rows */
.mini-cover{position:relative;flex:none;width:64px;aspect-ratio:16/9;border-radius:8px;overflow:hidden;background:linear-gradient(135deg,#BFE3DF,#8FCBC4)}
.mini-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* ---------- Forms (shared) ---------------------------------------------------- */
.ui-form .fgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 14px}
.ui-form .fgrid .full{grid-column:1/-1}
.ui-form label{display:block;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.ui-form input[type=text],.ui-form input[type=url],.ui-form input[type=tel],.ui-form input[type=number],.ui-form input[type=datetime-local],.ui-form select,.ui-form textarea{display:block;width:100%;min-width:0;font:inherit;font-size:15px;color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:12px;padding:11px 12px;min-height:44px}
.ui-form textarea{resize:vertical;line-height:1.55}
.ui-form input:focus,.ui-form select:focus,.ui-form textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(201,168,76,.18);background:#fff}
.ui-form .hint{font-size:12px;color:var(--muted);margin-top:5px;text-transform:none;letter-spacing:0;font-weight:400}
.ui-form label.check{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border:1.5px solid var(--line);border-radius:12px;background:var(--bg);cursor:pointer;font-size:14px;text-transform:none;letter-spacing:0;color:var(--ink);font-weight:600;margin:0}
.ui-form label.check input{margin-top:3px;width:18px;height:18px;accent-color:var(--gold);flex:none}
.ui-form label.check small{display:block;font-weight:400;color:var(--muted);font-size:12px}
@media (max-width:640px){.ui-form .fgrid{grid-template-columns:1fr}.ui-form input,.ui-form select,.ui-form textarea{font-size:16px}}

/* ---------- Filter chips ------------------------------------------------------- */
.fchips{display:flex;gap:8px;flex-wrap:wrap}
.fchip{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:13px;font-weight:600;color:var(--ink-2);background:var(--surface);border:1.5px solid var(--line);border-radius:999px;padding:7px 14px;cursor:pointer;min-height:38px}
body.app button.fchip{background:var(--surface);color:var(--ink-2);padding:7px 14px;font-size:13px;font-weight:600;border:1.5px solid var(--line)}
.fchip span{font-size:11px;font-weight:700;color:var(--muted);background:var(--surface-2);border-radius:999px;padding:1px 7px}
.fchip:hover{border-color:var(--gold-line)}
.fchip.on,body.app button.fchip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.fchip.on span{background:rgba(255,255,255,.18);color:#fff}

/* ---------- Announcements -------------------------------------------------------- */
.ann-feed{display:flex;flex-direction:column;gap:14px}
.ann{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px 20px 18px 24px;box-shadow:var(--shadow-sm);overflow:hidden}
.ann::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--line)}
.ann-gold::before{background:var(--gold)}.ann-teal::before{background:var(--teal)}.ann-blue::before{background:var(--blue)}.ann-lav::before{background:var(--lav)}
.ann.is-pinned{background:linear-gradient(180deg,#FFFBF0,#FFFFFF 60%);border-color:var(--gold-line)}
.ann[hidden]{display:none}
.ann-head{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px}
.ann-date{margin-left:auto;font-size:12px;color:var(--faint);white-space:nowrap}
.new-dot{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#a3401b}
.new-dot::before{content:"";width:7px;height:7px;border-radius:50%;background:#E0703A}
.ann-title{font-family:var(--font-head);font-size:21px;line-height:1.3;font-weight:700;margin:10px 0 6px}
.ann-event{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:14px;font-weight:600;color:var(--ink-2);margin-bottom:8px}
.ann-event .ic{color:var(--gold-deep)}
.ann-event.ended{color:var(--faint)}
.ev-state{font-size:11px;font-weight:700;border-radius:999px;padding:2px 9px;background:var(--surface-2);color:var(--muted)}
.ev-live{background:#FDE5DA;color:#a3401b}.ev-soon{background:var(--gold-soft);color:#6b5417}.ev-upcoming{background:var(--blue-soft);color:var(--blue-ink)}
.ann-body{font-size:15px;color:var(--ink-2);white-space:pre-line;word-wrap:break-word;line-height:1.6}
.ann-body a{color:var(--gold-deep);font-weight:600;word-break:break-all}
.ann-body.is-long{max-height:8.2em;overflow:hidden;-webkit-mask-image:linear-gradient(#000 60%,transparent);mask-image:linear-gradient(#000 60%,transparent)}
.ann-body.is-long.open{max-height:none;-webkit-mask-image:none;mask-image:none}
.ann-more{background:none;border:0;padding:6px 0;margin-top:2px;font:inherit;font-size:13px;font-weight:700;color:var(--gold-deep);cursor:pointer}
body.app button.ann-more{background:none;color:var(--gold-deep);padding:6px 0;font-size:13px;min-height:0}
.ann-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.ann-link{font-size:13px;margin-top:8px;color:var(--ink-2);word-break:break-all}
.ann-tools{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;padding-top:12px;border-top:1px solid var(--line-2)}
.ann-tools form{margin:0}
body.app .ann-del{color:#a3401b}
.ann-edit{margin-top:14px;padding-top:14px;border-top:1px dashed var(--line)}
.ann-edit[hidden]{display:none}
.ann-toolbar{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:14px}
.ann-search{flex:0 1 260px;min-width:180px;font:inherit;font-size:14px;padding:9px 14px;border:1.5px solid var(--line);border-radius:999px;background:var(--surface);min-height:40px}
.ann-search:focus{outline:none;border-color:var(--gold)}
.ann-split{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:20px;align-items:start}
.ann-side{position:sticky;top:16px}
.ann-side .panel-body{padding-top:4px}
.empty-filter[hidden]{display:none}
@media (max-width:1100px){.ann-split{grid-template-columns:minmax(0,1fr)}.ann-side{position:static;order:-1}}
@media (max-width:640px){.ann{padding:16px 16px 16px 20px}.ann-title{font-size:19px}.ann-date{margin-left:0;width:100%}.ann-search{flex:1 1 100%}}

/* Next live session hero */
.session-hero{display:flex;gap:18px;align-items:stretch;border-radius:var(--r-xl);padding:20px;border:1px solid var(--gold-line);background:linear-gradient(135deg,#FFF6E0 0%,#FFFDF7 60%,#FFFFFF 100%);box-shadow:var(--shadow-sm);margin-bottom:20px}
.sh-date{flex:none;width:84px;border-radius:16px;background:var(--gold);color:var(--gold-ink);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:10px 6px;text-align:center}
.sh-mon{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.sh-day{font-family:var(--font-head);font-size:36px;font-weight:700;line-height:1}
.sh-wd{font-size:12px;font-weight:600;opacity:.8}
.sh-body{flex:1;min-width:0}
.sh-time{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600;color:var(--ink-2)}
.sh-time .ic{color:var(--gold-deep)}
.sh-when{color:var(--ink-2)}
.live-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#E0703A;box-shadow:0 0 0 0 rgba(224,112,58,.6);animation:ttdpulse 1.6s infinite;vertical-align:middle;margin-right:2px}
@keyframes ttdpulse{70%{box-shadow:0 0 0 8px rgba(224,112,58,0)}100%{box-shadow:0 0 0 0 rgba(224,112,58,0)}}
@media (max-width:640px){.session-hero{flex-direction:column;padding:16px}.sh-date{flex-direction:row;width:auto;gap:8px;padding:8px 12px;justify-content:flex-start}.sh-day{font-size:22px}.session-hero .hero-actions .btn{flex:1}}
.fchips + .ann-feed{margin-top:16px}
@media (max-width:640px){.fchips{flex-wrap:nowrap;overflow-x:auto;margin:0 -16px;padding:2px 16px 4px;scrollbar-width:none}.fchips::-webkit-scrollbar{display:none}.fchip{flex:none}}

/* ---------- Lesson notes ------------------------------------------------------------ */
.doc-tile{position:relative;flex:none;width:52px;height:64px;border-radius:8px;background:linear-gradient(160deg,#FFFFFF,#F3EEE3);border:1px solid var(--line);box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:center;color:var(--gold-deep)}
.doc-tile.big{width:64px;height:80px}
.doc-fold{position:absolute;top:-1px;right:-1px;width:16px;height:16px;background:linear-gradient(225deg,var(--bg) 50%,#E7DFCE 50%);border-bottom-left-radius:4px}
.doc-no{font-family:var(--font-head);font-weight:700;font-size:18px;color:var(--ink)}
.doc-tile.big .doc-no{font-size:22px}
.doc-pdf{position:absolute;left:6px;bottom:6px;font-size:8px;font-weight:800;letter-spacing:.06em;color:#fff;background:#C0553A;border-radius:3px;padding:1px 4px}
.notes-tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:6px 0 4px}
.notes-tools .ann-search{flex:1 1 320px;max-width:460px}
.notes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:12px}
.note-card{display:flex;align-items:center;gap:16px;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);text-decoration:none;color:var(--ink);box-shadow:var(--shadow-sm);transition:box-shadow .15s ease,transform .15s ease,border-color .15s ease}
body.app a.note-card{color:var(--ink)}
.note-card:hover{box-shadow:var(--shadow-md);transform:translateY(-1px);border-color:#DED6C5}
.note-card:hover .mc-arrow{transform:translateX(3px);color:var(--gold-deep)}
.note-card[hidden],.notes-group[hidden],.note-admin[hidden]{display:none}
.note-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.note-title{font-weight:700;font-size:15px;line-height:1.35}
.note-desc{font-size:13px;color:var(--muted);line-height:1.45}
.note-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:12px;color:var(--faint)}
.note-bar{height:4px;margin-top:4px;max-width:220px}
.note-prog{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:var(--ink-2);margin:2px 0 4px}
.note-admin{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px 18px;box-shadow:var(--shadow-sm)}
.na-main{display:flex;align-items:flex-start;gap:16px}
.na-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.na-stat{flex:none;text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:3px;font-size:12px;color:var(--muted)}
.na-stat b{font-family:var(--font-head);font-size:24px;line-height:1;color:var(--ink)}
.replace-form{margin-top:14px}
.inline-upload{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.inline-upload input[type=file]{font-size:13px;max-width:100%}
.dropzone{position:relative;display:flex!important;flex-direction:column;align-items:center;gap:4px;text-align:center;padding:22px 14px!important;margin:0 0 14px!important;border:2px dashed var(--line)!important;border-radius:var(--r-md)!important;background:var(--bg)!important;cursor:pointer;text-transform:none!important;letter-spacing:0!important;transition:border-color .15s ease,background .15s ease}
.dropzone:hover,.dropzone.drag{border-color:var(--gold)!important;background:var(--gold-soft)!important}
.dropzone.has-file{border-style:solid!important;border-color:var(--sage)!important;background:var(--sage-soft)!important}
.dropzone input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.dz-icon{color:var(--gold-deep)}
.dz-title{font-size:14px;font-weight:700;color:var(--ink)}
.dz-sub{font-size:12px;font-weight:400;color:var(--muted)}
.dz-file{font-size:13px;font-weight:700;color:var(--sage-ink);margin-top:4px;word-break:break-all}
@media (max-width:640px){
  .notes-grid{grid-template-columns:1fr}
  .note-card{padding:12px 14px;gap:12px}
  .na-main{flex-wrap:wrap}
  .na-stat{flex-direction:row;align-items:center;gap:8px;width:100%;justify-content:flex-start}
  .na-stat b{font-size:18px}
}

/* ===== Watchlist ===================================================================== */
.up{color:#3E6B35}.down{color:#A2452A}
.wl-ldot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px;vertical-align:middle;flex:none}
.fchip .wl-ldot{margin-right:0;width:8px;height:8px}
.wl-ldot.t-gold{background:var(--gold)}.wl-ldot.t-peach{background:var(--peach)}.wl-ldot.t-blue{background:var(--blue)}
.wl-ldot.t-lav{background:var(--lav)}.wl-ldot.t-teal{background:var(--teal)}.wl-ldot.t-sage{background:var(--sage)}
.wl-mono{flex:none;width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:700;font-size:16px;letter-spacing:.02em}
.wl-mono.big{width:64px;height:64px;border-radius:16px;font-size:18px}
.wl-mono.t-lav{background:var(--lav-soft);color:var(--lav-ink)}.wl-mono.t-teal{background:var(--teal-soft);color:var(--teal-ink)}
.wl-mono.t-peach{background:var(--peach-soft);color:var(--peach-ink)}.wl-mono.t-sage{background:var(--sage-soft);color:var(--sage-ink)}
.wl-kpis{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:18px}
button.kpi{font:inherit;text-align:left;cursor:pointer;width:100%}
button.kpi:hover{border-color:var(--gold-line)}
button.kpi.on{border-color:var(--gold);background:var(--gold-soft);box-shadow:0 0 0 3px rgba(201,168,76,.16)}
.wl-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:18px}
.wl-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.wl-tools .ann-search{flex:0 1 240px}
.wl-sortsel{font:inherit;font-size:14px;font-weight:600;color:var(--ink-2);padding:9px 12px;border:1.5px solid var(--line);border-radius:999px;background:var(--surface);min-height:40px;cursor:pointer}
.wl-sort{display:block;min-width:0}
.wl-sortsel:focus{outline:none;border-color:var(--gold)}
.wl-view{display:inline-flex;border:1.5px solid var(--line);border-radius:999px;background:var(--surface);padding:3px}
.wl-view button{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:13px;font-weight:700;color:var(--muted);background:transparent;border:0;border-radius:999px;padding:6px 12px;min-height:32px;cursor:pointer}
.wl-view button[aria-pressed="true"]{background:var(--ink);color:#fff}
.wl-group{margin-bottom:26px}
.wl-group .section-title{display:flex;align-items:center}
.wl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px}
.wl-flat{margin-bottom:26px}
.wl-card{display:flex;flex-direction:column;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px;text-decoration:none;color:var(--ink);box-shadow:var(--shadow-sm);transition:box-shadow .15s ease,transform .15s ease,border-color .15s ease}
.wl-card:hover{box-shadow:var(--shadow-md);transform:translateY(-1px);border-color:var(--gold-line)}
.wl-card[hidden],.wl-group[hidden],.wl-arow[hidden],tr[hidden]{display:none}
.wl-top{display:flex;align-items:center;gap:12px}
.wl-id{flex:1;min-width:0;display:flex;flex-direction:column}
.wl-tk{font-size:17px;font-weight:800;letter-spacing:.02em;line-height:1.2}
.wl-name{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wl-px{flex:none;text-align:right;display:flex;flex-direction:column;align-items:flex-end}
.wl-price{font-size:17px;font-weight:800;font-variant-numeric:tabular-nums}
.wl-chg{font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--muted)}
.wl-chg.up{color:#3E6B35}.wl-chg.down{color:#A2452A}
.wl-chips{display:flex;flex-wrap:wrap;gap:6px}
.wl-range{padding:2px 0}
.wl-track{position:relative;height:8px;border-radius:999px;background:var(--surface-2);margin:8px 0 6px}
.wl-52{position:absolute;top:0;bottom:0;border-radius:999px;background:var(--line)}
.wl-zone{position:absolute;top:-3px;bottom:-3px;border-radius:6px;background:rgba(201,168,76,.35);border:1.5px solid var(--gold)}
.wl-dot{position:absolute;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--ink);border:2.5px solid #fff;box-shadow:0 1px 4px rgba(46,42,37,.35)}
.wl-range.big .wl-track{height:10px;margin:12px 0 8px}
.wl-range.big .wl-dot{width:18px;height:18px;margin:-9px 0 0 -9px}
.wl-ends{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:var(--faint);font-variant-numeric:tabular-nums}
.wl-zl{color:var(--gold-deep);font-weight:700}
.wl-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:10px 0;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2)}
.wl-stat{display:flex;flex-direction:column;gap:1px;min-width:0}
.wl-stat span{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--faint);white-space:nowrap}
.wl-stat b{font-size:15px;font-variant-numeric:tabular-nums}
.wl-thesis{font-size:14px;color:var(--ink-2);line-height:1.5;margin:0}
.wl-foot{display:flex;align-items:center;justify-content:space-between;margin-top:auto}
.wl-layer{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.wl-foot .panel-link{display:inline-flex;align-items:center;gap:4px}
.wl-tablewrap{overflow:hidden;margin-bottom:18px}
.wl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.wl-table{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;min-width:980px}
.wl-table th,.wl-table td{padding:12px 12px;border-bottom:1px solid var(--line-2);text-align:left;white-space:nowrap;vertical-align:middle}
.wl-table thead th{position:sticky;top:0;background:var(--surface-2);font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.wl-table .num{text-align:right;font-variant-numeric:tabular-nums}
.wl-table tbody tr:hover td,.wl-table tbody tr:hover th{background:#FFFCF4}
.wl-table th[scope=row]{position:sticky;left:0;background:var(--surface);z-index:1;box-shadow:1px 0 0 var(--line-2)}
.wl-table th[scope=row] a{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.wl-table th[scope=row] .wl-mono{width:34px;height:34px;font-size:13px;border-radius:10px}
.wl-table th[scope=row] b{display:block;font-size:14px}
.wl-table th[scope=row] small{display:block;font-size:12px;color:var(--muted);font-weight:500;max-width:150px;overflow:hidden;text-overflow:ellipsis}
.wl-table thead th:first-child{left:0;z-index:2}
.wl-disc{display:flex;gap:8px;align-items:flex-start;font-size:12px;color:var(--muted);margin-top:18px;line-height:1.55}
.wl-disc .ic{flex:none;margin-top:2px}
/* detail */
.wl-hero{padding:18px 22px 22px;margin-bottom:20px;background:linear-gradient(135deg,#FFF6E0 0%,#FFFDF7 55%,#FFFFFF 100%);border-color:var(--gold-line)}
.wl-hero .crumb{display:inline-block;margin-bottom:12px}
.wl-hero-row{display:flex;align-items:center;gap:18px}
.wl-hero-id{flex:1;min-width:0}
.wl-hero-id .ph-eyebrow{display:flex;align-items:center}
.wl-hero-id .ph-title{margin:2px 0 10px}
.wl-hname{font-family:var(--font-body);font-size:.55em;font-weight:600;color:var(--muted);letter-spacing:0}
.wl-hero-px{flex:none;text-align:right}
.wl-bigprice{font-family:var(--font-head);font-size:34px;font-weight:700;line-height:1.1;font-variant-numeric:tabular-nums}
.wl-hero-px .wl-chg{font-size:14px}
.wl-asof{font-size:12px;color:var(--faint);margin-top:2px}
.wl-conv{display:inline-flex;gap:3px;margin:0 2px}
.wl-conv i{width:7px;height:7px;border-radius:50%;background:var(--line)}
.wl-conv i.on{background:var(--gold)}
.wl-detail{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:20px;align-items:start}
.wl-main,.wl-side{display:flex;flex-direction:column;gap:20px;min-width:0}
.wl-side{position:sticky;top:16px}
.wl-upd{font-size:12px}
.wl-prose p{font-size:15px;line-height:1.7;color:var(--ink-2);margin:0 0 12px}
.wl-prose p:last-child{margin-bottom:0}
.wl-cr{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.wl-list{list-style:none;display:flex;flex-direction:column;gap:10px;font-size:14px;line-height:1.5;color:var(--ink-2)}
.wl-list li{position:relative;padding-left:22px}
.wl-list li::before{content:"";position:absolute;left:2px;top:.5em;width:9px;height:9px;border-radius:50%}
.wl-list.up li::before{background:var(--sage)}
.wl-list.down li::before{background:var(--peach)}
.wl-list li.muted::before{display:none}
.wl-gh{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:18px 0 10px}
.wl-gh:first-child{margin-top:0}
.wl-mgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.wl-m{border:1px solid var(--line);border-radius:var(--r-md);padding:12px 14px;background:var(--bg);min-width:0}
.wl-m.key{background:var(--gold-soft);border-color:var(--gold-line)}
.wl-mk{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:12px;font-weight:700;color:var(--muted)}
.wl-mv{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums;margin-top:2px;color:var(--ink)}
.wl-src{display:inline-flex;align-items:center;gap:3px;font-size:10px;font-weight:800;letter-spacing:.04em;color:var(--gold-deep);background:#fff;border:1px solid var(--gold-line);border-radius:999px;padding:1px 6px}
.wl-help{margin-top:6px}
.wl-help summary{font-size:12px;font-weight:600;color:var(--gold-deep);cursor:pointer;list-style:none;display:inline-flex}
.wl-help summary::-webkit-details-marker{display:none}
.wl-help summary::before{content:"ⓘ";margin-right:4px}
.wl-help p{font-size:12.5px;line-height:1.5;color:var(--ink-2);margin-top:6px}
.wl-note{font-size:12.5px;color:var(--muted);margin-top:14px;line-height:1.55}
.wl-note code{font-size:12px;background:var(--surface-2);border-radius:6px;padding:1px 5px}
.wl-kvs{display:flex;flex-direction:column;margin-top:10px}
.wl-kv{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-top:1px solid var(--line-2);font-size:14px}
.wl-kv:first-child{border-top:0}
.wl-kv span{color:var(--muted)}
.wl-kv b{font-variant-numeric:tabular-nums;text-align:right}
.wl-kv b.gold{color:var(--gold-deep)}
.wl-strats{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.wl-callout{display:flex;gap:8px;align-items:flex-start;font-size:13px;line-height:1.5;background:var(--peach-soft);border:1px solid #F4CDB5;color:var(--peach-ink);border-radius:var(--r-md);padding:10px 12px;margin:12px 0}
.wl-callout .ic{flex:none;margin-top:2px}
.wl-side .btn-block{margin-top:12px}
/* admin */
.wl-alist{display:flex;flex-direction:column;gap:12px}
.wl-arow{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);padding:16px 18px;display:flex;flex-direction:column;gap:10px}
.wl-arow-main{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.wl-arow-main:hover .wl-tk{color:var(--gold-deep)}
.wl-arow-meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.wl-arow-meta .wl-layer{margin-right:4px}
.wl-arow-foot{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;padding-top:10px;border-top:1px solid var(--line-2)}
.wl-checks{display:flex;flex-wrap:wrap;gap:6px}
.wl-done{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:700;padding:3px 8px;border-radius:999px;border:1px dashed #E5B899;color:var(--peach-ink);background:var(--peach-soft)}
.wl-done.on{border:1px solid #C9DCC2;color:var(--sage-ink);background:var(--sage-soft)}
.wl-fresh{font-size:12px}
.wl-arow-act{display:flex;gap:8px}
.wl-fgrid3{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.wl-stratpick,.wl-convpick{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px}
.wl-convpick{grid-template-columns:repeat(4,minmax(0,1fr))}
.ui-form label small{text-transform:none;letter-spacing:0;font-weight:500}
.wl-edit form .panel{margin-bottom:18px}
.wl-savebar{position:sticky;bottom:0;z-index:3;display:flex;gap:10px;padding:12px 0;background:linear-gradient(to top,var(--bg) 70%,rgba(250,248,243,0))}
.wl-edit .ann-side{position:static}
.wl-sidebtns{display:flex;flex-direction:column;gap:10px}
.wl-sidebtns form{margin:0}
@media (max-width:1100px){
  .wl-detail{display:flex;flex-direction:column}
  .wl-main,.wl-side{display:contents}
  .wl-o1{order:1}.wl-o2{order:2}.wl-o3{order:3}.wl-o4{order:4}.wl-o5{order:5}.wl-o6{order:6}
  .wl-edit .ann-side{order:0}
}
@media (max-width:767px){
  .wl-kpis{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .wl-kpis .kpi{padding:12px}
  .wl-kpis .kpi-top{font-size:10px;gap:6px}
  .wl-kpis .kpi-top .itile{display:none}
  .wl-kpis .kpi-n{font-size:24px;margin-top:4px}
  .wl-kpis .kpi-s{display:none}
  .wl-toolbar{flex-direction:column;align-items:stretch}
  .wl-tools{display:grid;grid-template-columns:1fr auto}
  .wl-tools .ann-search{grid-column:1/-1;flex:none;width:100%}
  .wl-sortsel{width:100%}
  .wl-view button span{display:none}
  .wl-grid{grid-template-columns:1fr}
  .wl-hero{padding:16px}
  .wl-hero-row{flex-wrap:wrap;gap:12px}
  .wl-mono.big{width:52px;height:52px;font-size:15px}
  .wl-hero-px{width:100%;text-align:left;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
  .wl-bigprice{font-size:28px}
  .wl-cr{grid-template-columns:1fr}
  .wl-mgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wl-mv{font-size:19px}
  .wl-fgrid3{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .wl-convpick{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wl-arow-act{width:100%}.wl-arow-act .btn{flex:1}
}
@media (max-width:380px){.wl-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.wl-toolbar>*{min-width:0;max-width:100%}
.wl-stat span{white-space:normal;line-height:1.25}
@media (max-width:767px){.wl-card .wl-zl{display:none}.wl-toolbar .fchips{margin:0 -16px}}
.wl-toolbar{flex-direction:column;align-items:stretch}
.wl-tools{flex-wrap:nowrap}
.wl-tools .ann-search{flex:1 1 260px;max-width:none}
.wl-mgrid{align-items:start}
.wl-fgrid3{align-items:end}
.ui-form input[type=date]{display:block;width:100%;min-width:0;font:inherit;font-size:15px;color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:12px;padding:11px 12px;min-height:44px}
.ui-form input[type=date]:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(201,168,76,.18);background:#fff}
@media (max-width:767px){.wl-tools{display:grid}}
.wl-toolbar>.ann-search{flex:none;width:100%;max-width:420px}
#w-t::placeholder,#e-t::placeholder{text-transform:none}
@media (max-width:767px){.wl-stat span{font-size:10px;letter-spacing:.02em;white-space:nowrap}}

/* ===== Sign-in screens ============================================================== */
body.auth{background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:15px;line-height:1.55;min-height:100vh;-webkit-font-smoothing:antialiased}
body.auth :focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:6px}
.auth-wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);min-height:100vh}
.auth-brand{position:relative;overflow:hidden;display:flex;flex-direction:column;padding:40px 56px;background:linear-gradient(150deg,#FFF3D6 0%,#FFF9EC 45%,#F4EFE3 100%);border-right:1px solid var(--gold-line)}
.auth-admin .auth-brand{background:linear-gradient(150deg,#F1ECF8 0%,#F8F5EE 50%,#EFE9DD 100%);border-right-color:var(--line)}
.auth-logo img{display:block;width:230px;height:auto}
.auth-brand-body{margin:auto 0;max-width:460px;position:relative;z-index:1;padding:40px 0 140px}
.auth-kicker{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-deep);background:rgba(255,255,255,.7);border:1px solid var(--gold-line);border-radius:999px;padding:5px 12px}
.auth-admin .auth-kicker{color:var(--lav-ink);border-color:#DCD1EE}
.auth-headline{font-family:var(--font-head);font-size:46px;line-height:1.08;font-weight:700;margin:18px 0 14px;letter-spacing:-.01em}
.auth-lede{font-size:16px;color:var(--ink-2);line-height:1.65;max-width:420px}
.auth-feats{list-style:none;margin-top:26px;display:flex;flex-direction:column;gap:12px}
.auth-feats li{display:flex;align-items:center;gap:12px;font-size:14.5px;font-weight:600;color:var(--ink-2)}
.auth-fi{flex:none;width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.8);border:1px solid var(--gold-line);color:var(--gold-deep)}
.auth-admin .auth-fi{border-color:#DCD1EE;color:var(--lav-ink)}
.auth-candles{position:absolute;right:-10px;bottom:-6px;width:min(78%,440px);height:auto;opacity:.55;pointer-events:none}
.auth-candles line{stroke-width:2}
.auth-candles .cu{fill:#C9DCC2;stroke:#A8C3A0}
.auth-candles .cd{fill:#F9D9C6;stroke:#F4B996}
.auth-candles .ctrend{fill:none;stroke:var(--gold);stroke-width:2.5;stroke-dasharray:5 6;opacity:.8}
.auth-main{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 24px}
.auth-card{width:100%;max-width:420px}
.auth-logo-sm{display:none}
.auth-badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--lav-ink);background:var(--lav-soft);border:1px solid #DCD1EE;border-radius:999px;padding:4px 10px;margin-bottom:14px}
.auth-steps{list-style:none;display:flex;align-items:center;gap:8px;margin-bottom:22px;flex-wrap:wrap}
.auth-steps li{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;color:var(--faint)}
.auth-steps li+li::before{content:"";width:22px;height:1.5px;background:var(--line);margin-right:2px}
.auth-sn{flex:none;width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:11.5px;font-weight:800;background:var(--surface-2);border:1.5px solid var(--line);color:var(--muted)}
.auth-steps li.now{color:var(--ink)}
.auth-steps li.now .auth-sn{background:var(--gold);border-color:var(--gold);color:var(--gold-ink)}
.auth-steps li.done{color:var(--sage-ink)}
.auth-steps li.done .auth-sn{background:var(--sage-soft);border-color:#C9DCC2;color:var(--sage-ink)}
.auth-title{font-family:var(--font-head);font-size:34px;line-height:1.15;font-weight:700;margin-bottom:8px}
.auth-sub{font-size:15px;color:var(--muted);line-height:1.6;margin-bottom:24px}
.auth-sub b{color:var(--ink)}
.auth-alert{display:flex;gap:10px;align-items:flex-start;border-radius:var(--r-md);padding:12px 14px;font-size:14px;line-height:1.5;margin-bottom:18px}
.auth-alert .ic{flex:none;margin-top:1px}
.auth-alert.err{background:var(--peach-soft);border:1px solid var(--peach);color:#7a3a18}
.auth-alert.ok{background:var(--sage-soft);border:1px solid var(--sage);color:var(--sage-ink)}
.auth-alert.info{background:var(--blue-soft);border:1px solid var(--blue);color:var(--blue-ink)}
.auth-label{display:block;font-size:12px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.auth-field{position:relative;display:flex;align-items:center}
.auth-fi-in{position:absolute;left:16px;color:var(--faint);display:flex;pointer-events:none}
.auth-field input{width:100%;font:inherit;font-size:18px;font-weight:600;color:var(--ink);background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:15px 16px 15px 48px;min-height:56px;box-shadow:var(--shadow-sm);transition:border-color .12s ease,box-shadow .12s ease}
.auth-field input::placeholder{color:#B5AC9F;font-weight:500}
.auth-field input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 4px rgba(201,168,76,.18)}
.auth-field.invalid input{border-color:#E39A77;box-shadow:0 0 0 4px rgba(244,185,150,.22)}
.auth-field input[type=password],.auth-field input#password{padding-right:52px}
.auth-eye{position:absolute;right:8px;width:40px;height:40px;border:0;border-radius:10px;background:transparent;color:var(--muted);display:flex;align-items:center;justify-content:center;cursor:pointer}
.auth-eye:hover{background:var(--surface-2);color:var(--ink)}
.auth-eye[aria-pressed="true"]{color:var(--gold-deep)}
.auth-hint{font-size:12.5px;color:var(--muted);margin-top:8px;display:flex;align-items:center;gap:5px}
.auth-caps{color:var(--peach-ink);font-weight:700}
.auth-otp{display:block;width:100%;font-family:var(--font-body);font-size:30px;font-weight:800;letter-spacing:.5em;text-indent:.5em;text-align:center;font-variant-numeric:tabular-nums;color:var(--ink);background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:14px 10px;min-height:66px;box-shadow:var(--shadow-sm)}
.auth-otp::placeholder{color:#D6CDBF;letter-spacing:.5em}
.auth-otp:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 4px rgba(201,168,76,.18)}
.auth-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:18px;font:inherit;font-size:16px;font-weight:800;line-height:1;padding:16px 20px;min-height:54px;border-radius:999px;border:1.5px solid var(--gold);background:var(--gold);color:var(--gold-ink);text-decoration:none;cursor:pointer;box-shadow:0 6px 16px rgba(201,168,76,.28);transition:transform .12s ease,box-shadow .12s ease,background .12s ease}
.auth-btn:hover{background:#D3B55F;box-shadow:0 8px 20px rgba(201,168,76,.34)}
.auth-btn:active{transform:translateY(1px)}
.auth-btn:disabled{opacity:.6;cursor:default;box-shadow:none}
.auth-btn.busy{opacity:.85}
.auth-btn.ghost{background:var(--surface);border-color:var(--line);color:var(--ink);box-shadow:none;font-weight:700;font-size:14.5px;min-height:48px;padding:12px 16px}
.auth-btn.ghost:hover{border-color:var(--gold-line);background:var(--surface)}
.auth-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.auth-row form{margin:0}
.auth-row .auth-btn{margin-top:10px}
.auth-row>*:only-child{grid-column:1/-1}
.auth-note{display:flex;gap:10px;align-items:flex-start;margin-top:22px;padding:12px 14px;border-radius:var(--r-md);background:var(--surface-2);font-size:13px;color:var(--ink-2);line-height:1.5}
.auth-note .ic{flex:none;margin-top:1px;color:var(--sage-ink)}
.auth-alt{margin-top:22px;padding-top:18px;border-top:1px solid var(--line);font-size:14px;color:var(--muted);text-align:center}
.auth-alt a,.auth-foot a{color:var(--gold-deep);font-weight:700;text-decoration:none}
.auth-alt a:hover,.auth-foot a:hover{text-decoration:underline}
.auth-howto{list-style:none;display:flex;flex-direction:column;gap:12px;margin-bottom:6px}
.auth-howto li{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface)}
.auth-howto .auth-sn{width:26px;height:26px;background:var(--gold-soft);border-color:var(--gold-line);color:var(--gold-deep)}
.auth-howto b{display:block;font-size:14.5px}
.auth-howto small{display:block;font-size:13px;color:var(--muted);margin-top:1px}
.auth-wait{display:flex;align-items:center;gap:10px;justify-content:center;margin-top:14px;font-size:13.5px;font-weight:600;color:var(--ink-2)}
.auth-spin{width:16px;height:16px;border:2px solid var(--line);border-top-color:var(--gold);border-radius:50%;animation:authspin .8s linear infinite}
@keyframes authspin{to{transform:rotate(360deg)}}
.auth-foot{margin-top:28px;font-size:12px;color:var(--faint);text-align:center;max-width:420px}
html[data-text="lg"] .auth-main{zoom:1.1}html[data-text="xl"] .auth-main{zoom:1.22}html[data-text="sm"] .auth-main{zoom:.92}
html[data-contrast="high"] body.auth{--muted:#4A443C;--faint:#6F675D;--line:#CFC4AE}
html[data-motion="reduce"] .auth-spin{animation-duration:2s}
@media (max-width:960px){
  .auth-wrap{grid-template-columns:1fr;min-height:0}
  .auth-brand{display:none}
  .auth-main{min-height:100vh;justify-content:flex-start;padding:28px 20px 32px;background:linear-gradient(180deg,#FFF6E0 0,var(--bg) 220px)}
  .auth-admin .auth-main{background:linear-gradient(180deg,#F1ECF8 0,var(--bg) 220px)}
  .auth-logo-sm{display:block;margin:0 auto 26px;width:max-content}
  .auth-logo-sm img{display:block;width:190px;height:auto}
  .auth-card{max-width:440px}
  .auth-badge{display:flex;width:max-content;margin:-10px auto 16px}
  .auth-title{font-size:28px}
}
@media (max-width:400px){.auth-row{grid-template-columns:1fr}.auth-otp{font-size:26px;letter-spacing:.4em;text-indent:.4em}.auth-steps li span:last-child{font-size:11.5px}}
body.auth [hidden]{display:none!important}
body.auth input:focus-visible{outline:none}
.auth-steps{flex-wrap:nowrap}
.auth-steps li{white-space:nowrap}
.auth-steps li+li::before{width:16px}
@media (max-width:420px){.auth-steps li:not(.now)>span:last-child{display:none}}

/* ===== Options Visualizer ============================================================ */
body.vz-noscroll{overflow:hidden}
.vz-setup{padding:16px 18px;margin-bottom:18px}
.vz-setup-row{display:flex;gap:14px;align-items:stretch;flex-wrap:wrap}
.vz-strat{flex:1 1 280px;display:flex;align-items:center;gap:12px;text-align:left;font:inherit;color:var(--ink);background:linear-gradient(135deg,#FFF6E0,#FFFDF7);border:1.5px solid var(--gold-line);border-radius:var(--r-md);padding:10px 14px;cursor:pointer;min-height:60px}
.vz-strat:hover{border-color:var(--gold)}
.vz-strat .ic{flex:none;color:var(--gold-deep)}
.vz-strat-k{flex:none;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-deep)}
.vz-strat-v{flex:1;min-width:0;display:flex;flex-direction:column}
.vz-strat-v b{font-family:var(--font-head);font-size:19px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vz-strat-tag{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vz-fields{flex:2 1 520px;display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.vz-f{display:flex;flex-direction:column;gap:5px;flex:1 1 110px;min-width:0}
.vz-f>span{font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.vz-f input{width:100%;min-width:0;font:inherit;font-size:16px;font-weight:700;color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:12px;padding:9px 10px;min-height:44px;font-variant-numeric:tabular-nums}
.vz-f input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(201,168,76,.18);background:#fff}
.vz-f-tk input{text-transform:uppercase;letter-spacing:.04em}
.vz-f-tk input::placeholder{text-transform:none;letter-spacing:0;font-weight:500}
.vz-in{position:relative;display:flex;align-items:center}
.vz-in i{position:absolute;font-style:normal;font-size:14px;font-weight:700;color:var(--faint);pointer-events:none}
.vz-in i:first-child{left:11px}.vz-in i:last-child{right:11px}
.vz-in i:first-child~input,.vz-in i:first-child+input{padding-left:24px}
.vz-in input:not(:last-child){padding-right:30px}
.vz-more{flex:none;display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:13px;font-weight:700;color:var(--ink-2);background:var(--surface);border:1.5px solid var(--line);border-radius:12px;padding:0 12px;min-height:44px;cursor:pointer}
.vz-more[aria-expanded="true"]{border-color:var(--gold);color:var(--gold-deep)}
.vz-morebox{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-top:14px;padding-top:14px;border-top:1px solid var(--line-2)}
.vz-morebox .vz-f{flex:0 1 150px}
.vz-hint{flex:1 1 260px;font-size:12.5px;color:var(--muted);margin:0;align-self:center}
.vz-quote{margin:12px 0 0;font-size:13px;color:var(--ink-2);padding:8px 12px;border-radius:10px;background:var(--surface-2)}
.vz-quote.ok{background:var(--sage-soft);color:var(--sage-ink)}
.vz-quote.err{background:var(--peach-soft);color:var(--peach-ink)}
.vz-quote .up{color:#3E6B35}.vz-quote .down{color:#A2452A}
.vz-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:18px;align-items:start;margin-bottom:18px}
.vz-chartp{overflow:hidden}
.vz-chart-head{flex-wrap:wrap}
.vz-legend{display:flex;flex-wrap:wrap;gap:6px}
.vz-lg{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:12px;font-weight:700;color:var(--faint);background:var(--surface);border:1.5px solid var(--line);border-radius:999px;padding:4px 10px;cursor:pointer;min-height:30px}
.vz-lg.on{color:var(--ink-2);border-color:#DDD4C3}
.vz-lg.dim{opacity:.55}
.vz-lg i,.vz-tip i{display:inline-block;width:16px;height:3px;border-radius:2px;flex:none}
.vz-lg:not(.on) i{opacity:.35}
.k-exp{background:#4A443C}.k-today{background:#C9A84C;height:4px!important}.k-proj{background:repeating-linear-gradient(90deg,#8B78C9 0 5px,transparent 5px 8px)}.k-em{background:rgba(169,199,232,.8);height:10px!important;border-radius:3px!important}
.vz-canvas-wrap{position:relative;padding:0 8px}
#vz-canvas{display:block;touch-action:pan-y;cursor:crosshair;border-radius:8px}
#vz-canvas:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.vz-tip{position:absolute;top:0;left:0;z-index:2;min-width:170px;background:rgba(255,255,255,.97);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-md);padding:10px 12px;font-size:12.5px;pointer-events:none}
.vz-tip-h{font-weight:800;font-size:14px;margin-bottom:6px;font-variant-numeric:tabular-nums}
.vz-tip-h span{font-size:12px;color:var(--muted);font-weight:700}
.vz-tip-r{display:flex;align-items:center;gap:7px;padding:2px 0;color:var(--ink-2)}
.vz-tip-r b{margin-left:auto;font-variant-numeric:tabular-nums;padding-left:12px}
.up{color:#3E6B35}.down{color:#A2452A}.teal{color:var(--teal-ink)}
.vz-controls{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:14px 20px 20px;border-top:1px solid var(--line-2);margin-top:8px}
.vz-ctl-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}
.vz-ctl-k{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.vz-ctl-top b{font-size:13px;font-variant-numeric:tabular-nums;text-align:right}
.vz-ctl-row{display:flex;align-items:center;gap:10px}
.vz-ctl input[type=range]{flex:1;width:100%;accent-color:var(--gold);height:28px}
#vz-ivs{accent-color:#8B78C9}
.vz-play{flex:none;width:38px;height:38px;border-radius:50%;border:1.5px solid var(--gold);background:var(--gold-soft);color:var(--gold-deep);display:flex;align-items:center;justify-content:center;cursor:pointer}
.vz-play.on{background:var(--gold);color:var(--gold-ink)}
.vz-chips{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap}
.vz-chips button{font:inherit;font-size:12px;font-weight:700;color:var(--ink-2);background:var(--surface-2);border:1px solid var(--line);border-radius:999px;padding:4px 10px;cursor:pointer}
.vz-chips button:hover{border-color:var(--gold-line)}
.vz-side{position:sticky;top:16px}
.vz-story{font-size:14.5px;line-height:1.65;color:var(--ink-2);background:var(--gold-soft);border:1px solid var(--gold-line);border-radius:var(--r-md);padding:12px 14px;margin:0 0 14px}
.vz-story b{color:var(--ink)}
.vz-story:empty{display:none}
.vz-tiles{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.vz-tile{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--bg);min-width:0}
.vz-tile span{display:block;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.vz-tile b{display:block;font-size:19px;font-weight:800;font-variant-numeric:tabular-nums;margin-top:2px;overflow-wrap:anywhere;line-height:1.25}
.vz-tile small{display:block;font-size:11.5px;color:var(--faint);margin-top:2px;line-height:1.35}
.vz-h3{font-size:12px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin:18px 0 8px}
.vz-h3 small{text-transform:none;letter-spacing:0;font-weight:500;color:var(--faint)}
.vz-greeks{display:flex;flex-direction:column}
.vz-gk{display:grid;grid-template-columns:62px auto;column-gap:10px;align-items:baseline;padding:8px 0;border-top:1px solid var(--line-2)}
.vz-gk:first-child{border-top:0}
.vz-gk span{font-size:13px;font-weight:700;color:var(--muted)}
.vz-gk b{font-size:15px;font-variant-numeric:tabular-nums}
.vz-gk small{grid-column:2;font-size:12.5px;color:var(--muted)}
.vz-legsp{margin-bottom:18px}
.vz-addrow{display:flex;gap:6px;flex-wrap:wrap}
.vz-legs{display:flex;flex-direction:column;gap:10px}
.vz-leg{position:relative;display:grid;grid-template-columns:28px 118px 86px 118px minmax(140px,1.2fr) 74px 74px minmax(150px,1.1fr) 36px;gap:10px;align-items:end;border:1px solid var(--line);border-left:4px solid var(--sage);border-radius:var(--r-md);padding:12px 12px 10px;background:var(--surface)}
.vz-leg.sell{border-left-color:var(--peach)}
.vz-leg-n{align-self:center;width:26px;height:26px;border-radius:50%;background:var(--surface-2);color:var(--muted);font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center}
.vz-leg-f{display:flex;flex-direction:column;gap:4px;min-width:0}
.vz-leg-f>span{font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.vz-leg-f input{width:100%;min-width:0;font:inherit;font-size:15px;font-weight:700;color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:10px;padding:7px 8px;min-height:40px;font-variant-numeric:tabular-nums}
.vz-leg-f input:focus{outline:none;border-color:var(--gold);background:#fff;box-shadow:0 0 0 3px rgba(201,168,76,.16)}
.vz-na em{font-style:normal;color:var(--faint);min-height:40px;display:flex;align-items:center;padding-left:4px}
.vz-seg{display:flex;border:1.5px solid var(--line);border-radius:10px;overflow:hidden;background:var(--bg);min-height:40px}
.vz-seg button{flex:1;font:inherit;font-size:13px;font-weight:700;color:var(--muted);background:transparent;border:0;cursor:pointer;padding:0 6px}
.vz-seg button+button{border-left:1.5px solid var(--line)}
.vz-seg button.on{background:var(--ink);color:#fff}
.vz-seg button.on.buy{background:#3E6B35}.vz-seg button.on.sell{background:#A2452A}
.vz-stocktag{min-height:40px;display:flex;align-items:center;font-weight:800;color:var(--lav-ink);background:var(--lav-soft);border-radius:10px;padding:0 12px}
.vz-step{display:flex;align-items:stretch}
.vz-step button{flex:none;width:34px;font:inherit;font-size:18px;font-weight:700;color:var(--ink-2);background:var(--surface-2);border:1.5px solid var(--line);cursor:pointer}
.vz-step button:first-child{border-radius:10px 0 0 10px;border-right:0}
.vz-step button:last-child{border-radius:0 10px 10px 0;border-left:0}
.vz-step input{border-radius:0;text-align:center}
.vz-prem{position:relative;display:flex;align-items:center}
.vz-prem>i{position:absolute;left:9px;font-style:normal;color:var(--faint);font-weight:700;pointer-events:none}
.vz-prem input{padding-left:20px;padding-right:74px}
.vz-lock{position:absolute;right:5px;font:inherit;font-size:10.5px;font-weight:800;letter-spacing:.03em;border-radius:7px;border:1px solid var(--line);background:var(--surface-2);color:var(--faint);padding:3px 7px;cursor:default}
.vz-prem.locked .vz-lock{background:var(--gold-soft);border-color:var(--gold-line);color:var(--gold-deep);cursor:pointer}
.vz-rm{align-self:center;width:34px;height:34px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--muted);display:flex;align-items:center;justify-content:center;cursor:pointer}
.vz-rm:hover:not(:disabled){color:#A2452A;border-color:#F4CDB5;background:var(--peach-soft)}
.vz-rm:disabled{opacity:.35;cursor:default}
.vz-leg-meta{grid-column:2/-1;font-size:12.5px;color:var(--muted);line-height:1.45}
.vz-pricebar{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:14px;padding:10px 12px;border-radius:12px;background:var(--surface-2)}
.vz-pricebar p{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--ink-2);margin:0;flex:1 1 380px}
.vz-pricebar .ic{flex:none;margin-top:2px;color:var(--blue-ink)}
.vz-scenp{margin-bottom:6px;overflow:hidden}
.vz-scen-sub{font-size:12.5px}
.vz-scroll{overflow-x:auto}
.vz-table{width:100%;border-collapse:collapse;font-size:14px;min-width:520px}
.vz-table th,.vz-table td{padding:10px 16px;border-top:1px solid var(--line-2);text-align:left;white-space:nowrap}
.vz-table thead th{background:var(--surface-2);font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);border-top:0}
.vz-table .num{text-align:right;font-variant-numeric:tabular-nums;font-weight:700}
.vz-table tbody th{font-weight:700;font-variant-numeric:tabular-nums}
.vz-table tr.now{background:#FFFBF0}
.vz-tag{display:inline-block;margin-left:6px;font-size:10.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:2px 7px;border-radius:999px;background:var(--surface-2);color:var(--muted)}
.vz-tag.now{background:var(--ink);color:#fff}.vz-tag.be{background:var(--teal-soft);color:var(--teal-ink)}.vz-tag.k{background:var(--gold-soft);color:var(--gold-deep)}
/* picker */
.vz-modal{position:fixed;inset:0;z-index:60;background:rgba(46,42,37,.38);display:flex;align-items:flex-start;justify-content:center;padding:6vh 16px;overflow-y:auto}
.vz-modal[hidden]{display:none}
.vz-modal-card{width:100%;max-width:820px;background:var(--bg);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);overflow:hidden}
.vz-modal-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px 10px}
.vz-modal-head h2{font-family:var(--font-head);font-size:24px}
.vz-picker-tools{display:flex;flex-direction:column;gap:10px;padding:0 22px 14px;border-bottom:1px solid var(--line)}
.vz-picker-tools .ann-search{flex:none;width:100%;max-width:none}
.vz-picklist{padding:6px 22px 22px;max-height:62vh;overflow-y:auto}
.vz-pg h3{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin:16px 0 8px}
.vz-pg h3 small{text-transform:none;letter-spacing:0;font-weight:500;color:var(--faint)}
.vz-od{width:9px;height:9px;border-radius:50%}
.vz-od.sage{background:var(--sage)}.vz-od.peach{background:var(--peach)}.vz-od.blue{background:var(--blue)}
.vz-pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.vz-pi{display:flex;flex-direction:column;gap:3px;text-align:left;font:inherit;color:var(--ink);background:var(--surface);border:1.5px solid var(--line);border-radius:12px;padding:10px 12px;cursor:pointer}
.vz-pi:hover,.vz-pi:focus-visible{border-color:var(--gold)}
.vz-pi b{font-size:14.5px}
.vz-pi span{font-size:12.5px;font-weight:700;color:var(--gold-deep)}
.vz-pi small{font-size:12.5px;color:var(--muted);line-height:1.4}
.vz-pi.ttd{background:linear-gradient(135deg,#FFF6E0,#FFFFFF);border-color:var(--gold-line)}
.vz-toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));transform:translate(-50%,20px);opacity:0;z-index:70;background:var(--ink);color:#fff;font-size:14px;font-weight:600;padding:10px 16px;border-radius:999px;box-shadow:var(--shadow-lg);transition:opacity .2s ease,transform .2s ease;pointer-events:none;max-width:calc(100vw - 32px);text-align:center}
.vz-toast.show{opacity:1;transform:translate(-50%,0)}
/* admin */
.vz-alist{display:flex;flex-direction:column;gap:12px}
.vz-arow{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);padding:16px 18px;display:flex;flex-direction:column;gap:10px}
.vz-arow-main{display:flex;gap:12px;align-items:flex-start}
.vz-arow-id{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.vz-arow-id b{font-size:16px}
.vz-arow-id .muted{font-size:12.5px}
.vz-arow-legs{display:flex;flex-wrap:wrap;gap:5px;margin-top:4px}
.vz-arow-order{display:flex;gap:4px}
.vz-arow-order form{margin:0}
.vz-arow-edit summary{font-size:13px;font-weight:700;color:var(--gold-deep);cursor:pointer;display:inline-flex;align-items:center;gap:5px}
.vz-arow-edit form{margin-top:10px}
.vz-accessgrid{display:flex;flex-direction:column;gap:8px}
.vz-accessgrid label.check span{display:flex;flex-direction:column}
.pb-viz{margin-top:12px}
@media (max-width:1180px){
  .vz-leg{grid-template-columns:28px repeat(3,minmax(0,1fr)) 36px;grid-auto-flow:row}
  .vz-leg-n{grid-row:1}
  .vz-lf-side{grid-column:2}.vz-lf-qty{grid-column:3}.vz-lf-type{grid-column:4}
  .vz-rm{grid-column:5;grid-row:1}
  .vz-lf-k{grid-column:2}.vz-lf-d{grid-column:3}.vz-lf-iv{grid-column:4}
  .vz-lf-p{grid-column:2/5}
}
@media (max-width:1100px){.vz-grid{grid-template-columns:1fr}.vz-side{position:static}.vz-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:767px){
  .vz-setup{padding:14px}
  .vz-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .vz-f-tk{grid-column:1/-1}
  .vz-more{grid-column:1/-1;justify-content:center}
  .vz-morebox .vz-f{flex:1 1 40%}
  .vz-strat-v b{font-size:17px}
  .vz-chart-head{gap:8px}
  .vz-canvas-wrap{padding:0 2px}
  .vz-controls{grid-template-columns:1fr;padding:12px 14px 16px}
  .vz-tiles{grid-template-columns:1fr 1fr}
  .vz-leg{grid-template-columns:repeat(3,minmax(0,1fr)) 36px;gap:8px;padding:12px}
  .vz-leg-n{display:none}
  .vz-lf-side{grid-column:1;grid-row:1}.vz-lf-type{grid-column:2;grid-row:1}.vz-lf-qty{grid-column:3;grid-row:1}.vz-rm{grid-column:4;grid-row:1}
  .vz-lf-k{grid-column:1/3;grid-row:2}.vz-lf-d{grid-column:3/5;grid-row:2}
  .vz-lf-iv{grid-column:1;grid-row:3}.vz-lf-p{grid-column:2/5;grid-row:3}
  .vz-leg-meta{grid-column:1/-1;grid-row:4}
  .vz-leg-f>span{font-size:9.5px;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .vz-seg button{padding:0 2px;font-size:12.5px}
  .vz-na{display:none}
  .vz-modal{padding:0;align-items:stretch}
  .vz-modal-card{border-radius:0;min-height:100%}
  .vz-picklist{max-height:none}
  .vz-pgrid{grid-template-columns:1fr}
  .vz-table th,.vz-table td{padding:9px 10px}
}
.vz-morebox[hidden],.vz-quote[hidden],.vz-tip[hidden]{display:none!important}
.vz-setup-row>*{min-width:0}
.vz-strat{min-width:0;max-width:100%}
@media (max-width:767px){.vz-strat{flex:1 1 100%}.vz-strat-tag{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.vz-fields{flex:1 1 100%}}
@media (max-width:767px){.vz-table{min-width:0;font-size:13px}.vz-table th,.vz-table td{padding:8px 8px}.vz-table tbody th .vz-tag{display:table;margin:3px 0 0}.vz-table thead th{font-size:10px}}
/* visualizer v2: guide banner, axis toolbar, tour */
.vz-newbar{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,#FFF6E0,#FFFDF7);border:1px solid var(--gold-line);border-radius:var(--r-lg);padding:12px 14px;margin-bottom:16px}
.vz-newbar[hidden]{display:none}
.vz-newbar p{flex:1;margin:0;font-size:14px;color:var(--ink-2);line-height:1.5}
.vz-newbar .btn{flex:none}
.vz-axes{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;padding:0 20px 10px}
.vz-axg{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.vz-axend{margin-left:auto}
.vz-axk{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);margin-right:2px}
.vz-axseg{display:inline-flex;border:1.5px solid var(--line);border-radius:999px;overflow:hidden;background:var(--surface)}
.vz-axseg button{font:inherit;font-size:12px;font-weight:700;color:var(--muted);background:transparent;border:0;padding:5px 9px;cursor:pointer;min-height:30px}
.vz-axseg button+button{border-left:1px solid var(--line)}
.vz-axseg button.on{background:var(--ink);color:#fff}
.vz-axb{width:30px;height:30px;border-radius:50%;border:1.5px solid var(--line);background:var(--surface);color:var(--ink-2);font:inherit;font-size:17px;font-weight:700;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.vz-axb:hover{border-color:var(--gold)}
.vz-axauto{font:inherit;font-size:12px;font-weight:700;color:var(--muted);background:var(--surface);border:1.5px solid var(--line);border-radius:999px;padding:4px 11px;min-height:30px;cursor:pointer}
.vz-axauto.on{background:var(--ink);border-color:var(--ink);color:#fff}
.vz-axlink{display:inline-flex;align-items:center;gap:5px;font:inherit;font-size:12.5px;font-weight:700;color:var(--gold-deep);background:none;border:0;padding:4px 6px;cursor:pointer}
.vz-axlink:hover{text-decoration:underline}
.vz-axlink[hidden]{display:none}
.vz-axbox{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin:0 20px 12px;padding:12px;border-radius:12px;background:var(--surface-2)}
.vz-axbox[hidden]{display:none}
.vz-axbox .vz-f{flex:1 1 120px}
.vz-axbox .vz-f input{background:#fff}
.vz-axbox .vz-hint{flex-basis:100%}
.vz-gesture{display:flex;align-items:center;gap:6px;justify-content:center;font-size:11.5px;color:var(--faint);margin:6px 0 0}
#vz-canvas.grabbing{cursor:grabbing}
.vz-guide-card{max-width:640px}
.vz-gdots{list-style:none;display:flex;gap:6px;padding:0 22px 6px;flex-wrap:wrap}
.vz-gdots button{width:30px;height:30px;border-radius:50%;border:1.5px solid var(--line);background:var(--surface);color:var(--muted);font:inherit;font-size:12.5px;font-weight:800;cursor:pointer}
.vz-gdots button.done{background:var(--sage-soft);border-color:#C9DCC2;color:var(--sage-ink)}
.vz-gdots button.on{background:var(--gold);border-color:var(--gold);color:var(--gold-ink)}
.vz-gsteps{padding:10px 22px 4px;min-height:330px}
.vz-gstep[hidden]{display:none}
.vz-gtop{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.vz-gkick{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-deep)}
.vz-gtop h3{font-family:var(--font-head);font-size:22px;line-height:1.2}
.vz-glead{font-size:15px;color:var(--ink-2);margin:0 0 10px;line-height:1.6}
.vz-glist{list-style:none;display:flex;flex-direction:column;gap:9px}
.vz-glist li{position:relative;padding-left:20px;font-size:14px;line-height:1.55;color:var(--ink-2)}
.vz-glist li::before{content:"";position:absolute;left:3px;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--gold)}
.vz-gkey{display:inline-flex;align-items:center;gap:6px;font-weight:800;color:var(--ink)}
.vz-gkey i{display:inline-block;width:18px;height:3px;border-radius:2px}
.vz-gtip{display:flex;gap:8px;align-items:flex-start;margin:14px 0 0;padding:10px 12px;border-radius:12px;background:var(--gold-soft);border:1px solid var(--gold-line);font-size:13.5px;color:var(--ink-2);line-height:1.5}
.vz-gtip .ic{flex:none;margin-top:2px;color:var(--gold-deep)}
.vz-gnav{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 22px 20px;border-top:1px solid var(--line);margin-top:10px}
.vz-gcount{font-size:13px;font-weight:700;color:var(--muted)}
@media (max-width:767px){
  .vz-axes{padding:0 14px 8px;gap:8px 12px}
  .vz-axend{margin-left:0}
  .vz-axbox{margin:0 14px 10px}
  .vz-axbox .vz-f{flex:1 1 40%}
  .vz-gesture span{font-size:11px}
  .vz-newbar{flex-wrap:wrap}
  .vz-newbar p{flex-basis:calc(100% - 80px)}
  .vz-gsteps{min-height:0}
  .vz-gnav{position:sticky;bottom:0;background:var(--bg)}
}
.vz-g-touch{display:none}
@media (hover:none){.vz-g-mouse{display:none}.vz-g-touch{display:inline}}
.vz-axzoom{display:inline-flex;gap:6px;white-space:nowrap}
@media (max-width:480px){.vz-axseg button{padding:5px 7px;font-size:11.5px}.vz-axk{flex-basis:100%}}
/* watchlist: stock profile, strategy groups, filters, AI drafting */
.wl-profile{display:flex;flex-wrap:wrap;gap:6px}
.wl-hero .wl-profile{margin-top:8px}
.chip.wl-pchip{background:#fff;color:var(--ink-2);font-weight:600}
.chip.wl-pchip .ic{color:var(--faint)}
.wl-pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.wl-pcell{border:1px solid var(--line);border-radius:var(--r-md);padding:12px 14px;background:var(--bg);display:flex;flex-direction:column;gap:2px;min-width:0}
.wl-pcell span{font-size:12px;font-weight:700;color:var(--muted)}
.wl-pcell b{font-size:16px;color:var(--ink)}
.wl-pcell small{font-size:12.5px;color:var(--muted);line-height:1.4}
.wl-table td.wl-tsec{max-width:170px;overflow:hidden;text-overflow:ellipsis}
.wl-table{min-width:1280px}
.wl-filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.wl-fsel{display:flex;flex-direction:column;gap:4px;min-width:0}
.wl-fsel span{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.wl-fsel select{width:100%;min-width:0;font:inherit;font-size:14px;color:var(--ink);background:var(--surface);border:1.5px solid var(--line);border-radius:12px;padding:9px 12px;min-height:42px;cursor:pointer}
.wl-fsel select:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(201,168,76,.18)}
.wl-fsel.on select{border-color:var(--gold);background:var(--gold-soft);font-weight:600}
.wl-stratset{border:0;margin:0;padding:0;min-width:0}
.wl-stratset legend{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:8px;padding:0}
.wl-addai{margin-top:12px!important}
.wl-addai .ic{color:var(--lav-ink);margin-top:1px}
.wl-ai{border:1.5px solid #DCD1EE;background:linear-gradient(135deg,var(--lav-soft) 0%,#FBF9FE 60%,#fff 100%);border-radius:var(--r-lg);padding:14px 16px;margin-bottom:18px}
.wl-ai.off{background:var(--surface-2);border-color:var(--line)}
.wl-ai-head{display:flex;gap:12px;align-items:flex-start}
.wl-ai-head b{display:block;font-size:15px}
.wl-ai-head small{display:block;font-size:13px;color:var(--muted);line-height:1.5}
.wl-ai-head code{font-size:12px;background:#fff;border-radius:6px;padding:1px 5px}
.wl-ai-body{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.wl-ai-secs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.ui-form .wl-ai label.check{padding:9px 12px;background:#fff;font-size:13.5px}
.ui-form .wl-ai input[type=text]{background:#fff}
.wl-ai-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between}
.ui-form .wl-ai label.wl-ai-web{border:0;background:none;padding:4px 0;font-weight:600;color:var(--ink-2)}
.wl-ai-btns{display:flex;gap:8px;margin-left:auto}
.wl-ai-status{font-size:13px;line-height:1.5;color:var(--muted);min-height:0}
.wl-ai-status:empty{display:none}
.wl-ai-status.busy{color:var(--lav-ink)}
.wl-ai-status.busy::before{content:"";display:inline-block;width:12px;height:12px;margin-right:8px;vertical-align:-1px;border-radius:50%;border:2px solid #DCD1EE;border-top-color:var(--lav-ink);animation:wlspin .8s linear infinite}
.wl-ai-status.ok{color:var(--sage-ink)}
.wl-ai-status.err{color:#A2452A}
.wl-ai.busy #wl-ai-go{opacity:.7}
.wl-ai-src{font-size:12.5px;color:var(--muted);background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:10px 12px}
.wl-ai-src ul{margin:6px 0 0;padding-left:18px;display:flex;flex-direction:column;gap:3px}
.wl-ai-src a{color:var(--gold-deep);word-break:break-all}
.wl-ai-filled{animation:wlfill 2.2s ease-out}
@keyframes wlfill{0%{background:var(--lav-soft);border-color:var(--lav-ink)}100%{}}
@keyframes wlspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.wl-ai-filled{animation:none}.wl-ai-status.busy::before{animation:none}}
@media (max-width:1100px){.wl-filters{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px){
  .wl-pgrid{grid-template-columns:1fr}
  .wl-filters{gap:8px}
  .wl-fsel select{font-size:16px;padding:8px 10px}
  .wl-ai{padding:12px}
  .wl-ai-secs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wl-ai-btns{width:100%}.wl-ai-btns .btn{flex:1}
  .ui-form .wl-ai input[type=text]{font-size:16px}
}
@media (max-width:1100px){.wl-detail{align-items:stretch}}
/* watchlist: buy-zone research */
.wl-zai{margin:4px 0 0;background:linear-gradient(135deg,var(--gold-soft) 0%,#FFFDF7 60%,#fff 100%);border-color:var(--gold-line)}
.wl-zres{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:12px 14px}
.wl-zsum{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.wl-zsum>div{display:flex;flex-direction:column;gap:1px;min-width:0}
.wl-zsum span{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.wl-zsum b{font-size:18px;font-variant-numeric:tabular-nums}
.wl-zsum small{font-size:12px;font-weight:700}.wl-zsum small.up{color:#3E6B35}.wl-zsum small.down{color:#A2452A}
.wl-zwarn{display:flex;gap:6px;align-items:flex-start;font-size:13px;color:var(--peach-ink);background:var(--peach-soft);border:1px solid #F4CDB5;border-radius:10px;padding:8px 10px;margin:10px 0 0}
.wl-zsrc{margin-top:10px}
.wl-zsrc summary{font-size:13px;font-weight:600;color:var(--gold-deep);cursor:pointer}
.wl-ztable{width:100%;border-collapse:collapse;font-size:13px;margin-top:8px;min-width:460px}
.wl-ztable th,.wl-ztable td{padding:7px 8px;border-bottom:1px solid var(--line-2);text-align:left;vertical-align:middle}
.wl-ztable thead th{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.wl-ztable .num{text-align:right;font-variant-numeric:tabular-nums;font-weight:700}
.wl-ztable th[scope=row]{font-weight:600}
.wl-ztable a{color:var(--ink);text-decoration-color:var(--gold-line)}
.wl-ztable tr.wl-zout td,.wl-ztable tr.wl-zout th{color:var(--faint)}
.wl-ztable tr.wl-zout .num{text-decoration:line-through}
.wl-zcalc{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center}
.ui-form .wl-zcalc label{display:flex;align-items:center;gap:8px;margin:0;font-size:13px;text-transform:none;letter-spacing:0;color:var(--ink-2)}
.wl-zin{display:inline-flex;align-items:center;gap:4px}
.ui-form .wl-zin input{width:72px;min-height:36px;padding:6px 8px;background:#fff}
.wl-zout-line{flex-basis:100%;font-size:13.5px;color:var(--ink-2)}
.wl-zout-line b{color:var(--gold-deep)}
.wl-zbasis{display:flex;gap:6px;align-items:flex-start;font-size:12.5px;line-height:1.5;color:var(--muted);margin:2px 0 8px}
.wl-zbasis .ic{flex:none;margin-top:2px}
@media (max-width:767px){.wl-zsum{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.wl-zsum b{font-size:15px}.ui-form .wl-zin input{font-size:16px}}
.wl-ztable tbody th{text-transform:none;letter-spacing:0;font-size:13px;color:var(--ink)}
.wl-ztable td:nth-child(3){white-space:nowrap}
.wl-kvsub{display:block;font-size:11.5px;color:var(--faint);font-weight:500;margin-top:1px}

/* ===================================================================== */
/* Legal pages — /terms, /disclaimer (legal/pages.js)                     */
/* ===================================================================== */
body.lg{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:16px;line-height:1.7;-webkit-text-size-adjust:100%}
.lg *{box-sizing:border-box}
.lg-top{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px max(16px,calc((100% - 1120px)/2));background:rgba(250,248,243,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.lg-logo img{display:block;height:43px;width:auto}
.lg-nav{display:flex;align-items:center;gap:4px;flex-wrap:wrap;justify-content:flex-end}
.lg-nav a{font-size:13.5px;font-weight:600;color:var(--ink-2);text-decoration:none;padding:7px 12px;border-radius:999px}
.lg-nav a:hover{background:var(--surface-2)}
.lg-nav a[aria-current="page"]{background:var(--gold-soft);color:var(--gold-ink);box-shadow:inset 0 0 0 1px var(--gold-line)}
.lg-nav .lg-back{border:1px solid var(--line);background:var(--surface);margin-left:6px}
.lg-wrap{max-width:1120px;margin:0 auto;padding:40px 16px 56px}
.lg-head{max-width:760px;margin-bottom:34px}
.lg-kicker{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-deep)}
.lg-head h1{font-family:var(--font-head);font-size:clamp(30px,5vw,44px);line-height:1.15;margin:10px 0 12px;color:var(--ink)}
.lg-lead{font-size:17px;color:var(--ink-2);margin:0 0 14px}
.lg-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;font-size:13px;color:var(--muted);margin:0}
.lg-print{display:inline-flex;align-items:center;gap:6px;font:inherit;font-weight:600;color:var(--gold-deep);background:none;border:0;padding:0;cursor:pointer}
.lg-print:hover{text-decoration:underline}
.lg-grid{display:grid;grid-template-columns:260px minmax(0,1fr);gap:40px;align-items:start}
.lg-toc{position:sticky;top:84px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px 18px 16px;font-size:13.5px;max-height:calc(100vh - 110px);overflow:auto}
.lg-toc-k{display:block;font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.lg-toc ol{margin:0 0 14px;padding-left:20px;line-height:1.45}
.lg-toc li{margin:6px 0;color:var(--faint)}
.lg-toc li a{color:var(--ink-2);text-decoration:none}
.lg-toc li a:hover{color:var(--gold-deep);text-decoration:underline}
.lg-other{display:flex;align-items:center;gap:7px;padding-top:12px;border-top:1px solid var(--line-2);font-weight:700;color:var(--gold-deep);text-decoration:none}
.lg-body{min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);padding:8px 36px 28px;box-shadow:var(--shadow-sm)}
.lg-sec{padding:26px 0 10px;border-bottom:1px solid var(--line-2);scroll-margin-top:84px}
.lg-sec:last-of-type{border-bottom:0}
.lg-sec h2{display:flex;align-items:baseline;gap:12px;font-family:var(--font-head);font-size:22px;line-height:1.3;margin:0 0 12px;color:var(--ink)}
.lg-n{flex:none;display:inline-grid;place-items:center;min-width:28px;height:28px;padding:0 6px;border-radius:999px;background:var(--gold-soft);color:var(--gold-ink);font-family:var(--font-body);font-size:13px;font-weight:800;transform:translateY(-3px)}
.lg-sec p{margin:0 0 14px;color:var(--ink-2)}
.lg-sec ul,.lg-sec ol{margin:0 0 14px;padding-left:22px;color:var(--ink-2)}
.lg-sec li{margin:0 0 8px}
.lg-sec b{color:var(--ink)}
.lg-sec a,.lg-note a{color:var(--gold-deep);font-weight:600}
.lg-key{background:var(--gold-soft);border-left:4px solid var(--gold);border-radius:0 var(--r-md) var(--r-md) 0;padding:14px 16px;color:var(--ink)!important}
.lg-note{margin:22px 0 0;font-size:13.5px;color:var(--muted)}
.lg-foot{text-align:center;font-size:12.5px;color:var(--muted);padding:0 16px 32px}
@media (max-width:900px){
  .lg-grid{grid-template-columns:minmax(0,1fr);gap:20px}
  .lg-toc{position:static;max-height:none}
  .lg-toc ol{columns:2;column-gap:28px}
}
@media (max-width:600px){
  body.lg{font-size:15.5px}
  .lg-top{padding:10px 16px}
  .lg-logo img{height:35px}
  .lg-nav a{padding:6px 9px;font-size:12.5px}
  .lg-nav .lg-back{display:none}
  .lg-wrap{padding:26px 16px 40px}
  .lg-toc ol{columns:1}
  .lg-body{padding:4px 18px 20px;border-radius:var(--r-lg)}
  .lg-sec h2{font-size:19px;gap:10px}
}
@media print{
  .lg-top,.lg-toc,.lg-print{display:none!important}
  body.lg{background:#fff;font-size:11pt}
  .lg-wrap{padding:0}
  .lg-grid{display:block}
  .lg-body{border:0;box-shadow:none;padding:0}
  .lg-sec{break-inside:avoid-page}
  .lg-key{background:none;border-left:3px solid #999}
  .lg-sec a{color:inherit}
}

/* Terms agreement step (/terms/accept) + sign-in consent line */
.tc-points{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:10px}
.tc-points li{display:flex;gap:12px;align-items:flex-start;padding:11px 13px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface)}
.tc-points b{display:block;font-size:14px;color:var(--ink)}
.tc-points small{display:block;font-size:13px;line-height:1.5;color:var(--muted);margin-top:1px}
.tc-ic{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--gold-soft);color:var(--gold-deep)}
.tc-points li:nth-child(2) .tc-ic{background:var(--peach-soft);color:var(--peach-ink)}
.tc-points li:nth-child(3) .tc-ic{background:var(--lav-soft);color:var(--lav-ink)}
.tc-points li:nth-child(4) .tc-ic{background:var(--blue-soft);color:var(--blue-ink)}
.tc-points li:nth-child(5) .tc-ic{background:var(--sage-soft);color:var(--sage-ink)}
.tc-points li:nth-child(6) .tc-ic{background:var(--teal-soft);color:var(--teal-ink)}
.tc-links{display:flex;flex-wrap:wrap;gap:8px 16px;margin:0 0 16px;font-size:13.5px}
.tc-links a{display:inline-flex;align-items:center;gap:6px;color:var(--gold-deep);font-weight:700;text-decoration:none}
.tc-links a:hover{text-decoration:underline}
.tc-check{display:flex;gap:11px;align-items:flex-start;padding:13px 14px;margin-bottom:14px;border:1.5px solid var(--gold-line);border-radius:var(--r-md);background:var(--gold-soft);font-size:13.5px;line-height:1.55;color:var(--ink-2);cursor:pointer}
.tc-check input{flex:none;width:20px;height:20px;margin:1px 0 0;accent-color:var(--gold-deep);cursor:pointer}
.tc-check a{color:var(--gold-deep);font-weight:700}
.auth-legal{margin:12px 0 0;font-size:12.5px;line-height:1.5;color:var(--muted);text-align:center}
.auth-legal a{color:var(--gold-deep);font-weight:600}
.pay-terms{margin:10px 0 0;font-size:12px;line-height:1.5;color:var(--muted)}
.pay-terms a{color:inherit;text-decoration:underline}

/* ---------- Collapsible sidebar (desktop) ------------------------------- */
.app-collapse{position:absolute;top:30px;right:-14px;z-index:2;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-sm);color:var(--muted);cursor:pointer;padding:0;transition:color .12s ease,border-color .12s ease,transform .2s ease}
body.app button.app-collapse{background:var(--surface);padding:0;min-height:0;color:var(--muted);border:1px solid var(--line)}
.app-collapse:hover,body.app button.app-collapse:hover{color:var(--gold-deep);border-color:var(--gold-line)}
.app-collapse:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.app-side{overflow:visible}
@media (min-width:1024px){
  html.side-anim .app-side,html.side-anim .app-body{transition:width .2s ease,margin-left .2s ease}
  html[data-side="c"]{--side-w:76px}
  html[data-side="c"] .app-collapse{transform:rotate(180deg)}
  html[data-side="c"] .app-brand{padding:18px 0 4px}
  html[data-side="c"] .brand-logo,html[data-side="c"] .app-area,html[data-side="c"] .nav-label,html[data-side="c"] .nav-lock,html[data-side="c"] .u-body{display:none}
  html[data-side="c"] .brand-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--gold-soft);border:1px solid var(--gold-line);color:var(--gold-ink);font-family:var(--font-head);font-weight:700;font-size:14px;letter-spacing:.02em}
  html[data-side="c"] .app-nav{padding:6px 12px 14px;overflow-x:hidden}
  html[data-side="c"] .nav-group{margin-top:10px;padding-top:10px;border-top:1px solid var(--line-2)}
  html[data-side="c"] .nav-group:first-child{border-top:0;padding-top:0}
  html[data-side="c"] .nav-item{justify-content:center;padding:10px 0}
  html[data-side="c"] .nav-item.on::before{left:-12px}
  html[data-side="c"] .nav-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  html[data-side="c"] .nav-badge{position:absolute;top:4px;right:6px;padding:2px 5px;font-size:10px}
  html[data-side="c"] .app-user{flex-direction:column;padding:12px 0;gap:6px}
  html[data-side="c"] .app-main .wrap,html[data-side="c"] .app-foot .wrap{max-width:1400px}
}
.side-tip{position:fixed;z-index:60;pointer-events:none;background:var(--ink);color:#fff;font-size:12.5px;font-weight:600;padding:6px 10px;border-radius:8px;white-space:nowrap;box-shadow:var(--shadow-md);transform:translateY(-50%)}
.side-tip::before{content:"";position:absolute;left:-4px;top:50%;width:8px;height:8px;background:inherit;transform:translateY(-50%) rotate(45deg)}
@media (prefers-reduced-motion:reduce){html.side-anim .app-side,html.side-anim .app-body,.app-collapse{transition:none}}
html[data-motion="reduce"].side-anim .app-side,html[data-motion="reduce"].side-anim .app-body{transition:none}

/* ---------- Downloads ---------------------------------------------------- */
.dl-tools{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center;margin-bottom:18px}
.dl-search{display:flex;align-items:center;gap:8px;flex:1 1 260px;max-width:380px;background:var(--surface);border:1.5px solid var(--line);border-radius:999px;padding:0 14px;color:var(--muted)}
.dl-search:focus-within{border-color:var(--gold)}
.dl-search input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:14px;padding:10px 0;color:var(--ink);outline:none}
.dl-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.dl-card{display:flex;gap:14px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px;box-shadow:var(--shadow-sm);transition:border-color .12s ease,box-shadow .12s ease}
.dl-card:hover{border-color:var(--gold-line);box-shadow:var(--shadow-md)}
.dl-card[hidden]{display:none}
.dl-card.locked{background:var(--surface-2)}
.dl-type{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:52px;height:58px;border-radius:12px}
.dl-type b{font-size:10px;font-weight:800;letter-spacing:.05em}
.dl-main{flex:1;min-width:0}
.dl-chips{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:6px}
.dl-chips .chip{font-size:11px;padding:3px 8px}
.dl-title{font-family:var(--font-head);font-size:17px;line-height:1.3;margin:0 0 4px;color:var(--ink);overflow-wrap:anywhere}
.dl-desc{font-size:13.5px;line-height:1.5;color:var(--ink-2);margin:0 0 6px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;white-space:pre-line}
.dl-meta{font-size:12.5px;color:var(--muted);margin:0;overflow-wrap:anywhere}
.dl-act{flex:none;align-self:center}
.dl-note{display:flex;gap:7px;align-items:flex-start;font-size:12.5px;color:var(--muted);margin:20px 0 0;line-height:1.5}
.dl-note a{color:var(--gold-deep);font-weight:600}
.dl-tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:-6px 0 20px}
.dl-tabs a{display:inline-flex;align-items:center;gap:7px;padding:10px 14px;font-size:14px;font-weight:600;color:var(--muted);text-decoration:none;border-bottom:2.5px solid transparent;margin-bottom:-1px}
.dl-tabs a:hover{color:var(--ink)}
.dl-tabs a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--gold)}
.dl-upload{margin:20px 0 26px}
.dl-upload .panel-title{display:flex;align-items:center;gap:8px}
.dl-drop{position:relative;display:flex!important;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:24px 16px;margin:0 0 16px!important;border:2px dashed var(--gold-line);border-radius:var(--r-lg);background:var(--gold-soft);color:var(--gold-deep);cursor:pointer;text-transform:none!important;letter-spacing:0!important;font-size:14px!important;transition:background .12s ease,border-color .12s ease}
.dl-drop b{color:var(--ink);font-size:15px;overflow-wrap:anywhere}
.dl-drop small{color:var(--muted);font-size:12.5px;font-weight:500}
.dl-drop input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.dl-drop.drag,.dl-drop:hover{background:#FFEFC8;border-color:var(--gold)}
.dl-drop.has-file{border-style:solid;background:var(--sage-soft);border-color:var(--sage)}
.dl-drop.too-big{background:var(--peach-soft);border-color:var(--peach)}
.dl-drop:focus-within{outline:2px solid var(--gold);outline-offset:2px}
.dl-check{display:flex!important;align-items:center;gap:8px;text-transform:none!important;letter-spacing:0!important;font-size:14px!important;font-weight:500!important;color:var(--ink-2)!important;cursor:pointer;margin:0!important}
.dl-check input{width:18px;height:18px;accent-color:var(--gold-deep)}
.dl-checks{display:flex;flex-wrap:wrap;gap:10px 22px}
.dl-h{margin:4px 0 14px}
.dl-alist{display:grid;gap:12px}
.dl-arow{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px 18px;box-shadow:var(--shadow-sm)}
.dl-arow.is-hidden{background:var(--surface-2)}
.dl-arow.is-hidden .dl-title{color:var(--muted)}
.dl-arow-main{display:flex;gap:14px;align-items:flex-start}
.dl-stat{flex:none;display:flex;flex-direction:column;align-items:flex-end;text-decoration:none;color:var(--ink);text-align:right;padding:4px 0 0 8px;min-width:110px}
.dl-stat b{font-family:var(--font-head);font-size:24px;line-height:1}
.dl-stat span{font-size:12px;font-weight:600;color:var(--muted)}
.dl-stat small{font-size:11.5px;color:var(--faint);margin-top:2px}
.dl-stat:hover b{color:var(--gold-deep)}
.dl-edit{margin-top:12px}
.dl-edit summary{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--gold-deep);cursor:pointer;list-style:none}
.dl-edit summary::-webkit-details-marker{display:none}
.dl-edit form{margin-top:12px;padding:14px;border:1px solid var(--line-2);border-radius:var(--r-md);background:var(--surface-2)}
.dl-top{margin:0 0 20px}
.dl-top ol{margin:0;padding-left:22px}
.dl-top li{margin:6px 0;font-size:14px}
.dl-top li a{color:var(--ink);font-weight:600;text-decoration:none}
.dl-top li a:hover{color:var(--gold-deep);text-decoration:underline}
.dl-top li span{color:var(--muted);font-size:12.5px;margin-left:8px}
.dl-filter{display:flex!important;flex-wrap:wrap;gap:12px;align-items:flex-end;margin:0 0 10px}
.dl-filter>div{flex:1 1 180px;min-width:0}
.dl-filter .dl-filter-act{flex:0 0 auto;display:flex;gap:8px}
.dl-count{font-size:13px;color:var(--muted);margin:0 0 10px}
.dl-logwrap{overflow:hidden}
table.dl-log{width:100%;border-collapse:collapse}
.dl-log th{text-align:left;font-size:11.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);padding:12px 14px;border-bottom:1px solid var(--line);background:var(--surface-2)}
.dl-log td{padding:11px 14px;border-bottom:1px solid var(--line-2);font-size:14px;vertical-align:top}
.dl-log tr:last-child td{border-bottom:0}
.dl-log td small{display:block;font-size:12px;margin-top:2px}
.dl-log td a{color:var(--ink);font-weight:600;text-decoration:none}
.dl-log td a:hover{color:var(--gold-deep);text-decoration:underline}
.dl-log .chip{font-size:11.5px;padding:3px 8px}
.dl-ip{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px!important;color:var(--muted)}
.dl-pager{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:14px;font-size:13px}
@media (max-width:1180px){ .dl-list{grid-template-columns:minmax(0,1fr)} }
@media (max-width:640px){
  .dl-card{flex-wrap:wrap;padding:14px}
  .dl-type{width:44px;height:50px}
  .dl-act{flex-basis:100%}
  .dl-act .btn{width:100%;justify-content:center}
  .dl-search{max-width:none}
  .dl-arow{padding:14px}
  .dl-arow-main{flex-wrap:wrap}
  .dl-stat{flex-basis:100%;flex-direction:row;align-items:baseline;gap:6px;text-align:left;padding:4px 0 0;min-width:0}
  .dl-stat small{margin:0 0 0 auto}
  .dl-tabs{overflow-x:auto}
  .dl-log thead{display:none}
  .dl-log,.dl-log tbody,.dl-log tr,.dl-log td{display:block;width:100%}
  .dl-log tr{padding:10px 14px;border-bottom:1px solid var(--line-2)}
  .dl-log td{border:0;padding:3px 0;display:flex;gap:10px;font-size:13.5px}
  .dl-log td::before{content:attr(data-l);flex:0 0 64px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);padding-top:2px}
  .dl-log td>*{min-width:0}
}

/* ---------- Settings tabs + Membership ----------------------------------- */
.set-tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:-6px 0 22px;overflow-x:auto}
.set-tabs a{display:inline-flex;align-items:center;gap:7px;padding:10px 14px;font-size:14px;font-weight:600;color:var(--muted);text-decoration:none;border-bottom:2.5px solid transparent;margin-bottom:-1px;white-space:nowrap}
.set-tabs a:hover{color:var(--ink)}
.set-tabs a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--gold)}
.mb-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:18px;align-items:start}
.mb-col{display:grid;gap:18px;min-width:0}
.mb-status.is-ending{border-color:#F4CDB5}
.mb-status.is-issue{border-color:var(--peach)}
.mb-inline{margin-bottom:16px}
.mb-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:16px}
.mb-facts>div{background:var(--surface-2);border:1px solid var(--line-2);border-radius:var(--r-md);padding:12px 14px;min-width:0}
.mb-facts span{display:block;font-size:11.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.mb-facts b{display:block;font-family:var(--font-head);font-size:18px;line-height:1.3;color:var(--ink);overflow-wrap:anywhere}
.mb-facts small{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.mb-explain{font-size:14.5px;line-height:1.6;color:var(--ink-2);margin:0 0 16px}
.mb-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.mb-actions form{margin:0}
.mb-cancel{color:var(--peach-ink)!important}
.mb-note{display:flex;gap:7px;align-items:flex-start;font-size:12.5px;line-height:1.5;color:var(--muted);margin:14px 0 0}
.mb-note a{color:var(--gold-deep);font-weight:600}
.mb-note .ic{margin-top:2px}
.mb-inv{display:grid}
.mb-inv-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line-2);font-size:14px}
.mb-inv-row:last-child{border-bottom:0}
.mb-inv-a{font-weight:700;color:var(--ink)}
.mb-inv-l{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;color:var(--gold-deep);text-decoration:none}
.mb-inv-l:hover{text-decoration:underline}
.mb-empty{font-size:14px;margin:0}
.mb-join{overflow:hidden}
.mb-join-head{padding:26px 24px 22px;background:linear-gradient(180deg,#FFF6E0,var(--surface));border-bottom:1px solid var(--line-2)}
.mb-kick{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-deep)}
.mb-join-head h2{font-family:var(--font-head);font-size:28px;line-height:1.2;margin:8px 0 6px;color:var(--ink)}
.mb-join-head p{font-size:14.5px;line-height:1.6;color:var(--ink-2);margin:0;max-width:560px}
.mb-price{display:flex;align-items:baseline;gap:8px;margin-top:14px}
.mb-price b{font-family:var(--font-head);font-size:36px;line-height:1;color:var(--ink)}
.mb-price span{font-size:14px;color:var(--muted);font-weight:600}
.mb-h3{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:4px 0 12px}
.mb-h3:not(:first-child){margin-top:22px}
.mb-benefits{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.mb-benefits li{display:flex;gap:12px;align-items:flex-start}
.mb-benefits b{display:block;font-size:14px;color:var(--ink)}
.mb-benefits small{display:block;font-size:13px;line-height:1.45;color:var(--muted)}
.mb-how{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.mb-how li{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.55;color:var(--ink-2)}
.mb-how li .ic{flex:none;margin-top:3px;color:var(--gold-deep)}
.mb-how a{color:var(--gold-deep);font-weight:600}
.mb-join-cta{margin-top:24px}
.mb-join-cta .btn{min-height:50px;padding:0 26px;font-size:16px}
.mb-legal{font-size:12.5px;line-height:1.55;color:var(--muted);margin:12px 0 0}
.mb-legal a{color:var(--gold-deep);font-weight:600}
.mb-tl{list-style:none;margin:0;padding:0 0 0 14px;border-left:2px solid var(--line)}
.mb-tl li{position:relative;padding:0 0 12px 12px;font-size:14px}
.mb-tl li::before{content:"";position:absolute;left:-20px;top:5px;width:10px;height:10px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px var(--surface)}
.mb-tl b{display:block;color:var(--ink);font-weight:600}
.mb-tl span{font-size:12.5px;color:var(--muted)}
.mb-faq details{border-bottom:1px solid var(--line-2);padding:10px 0}
.mb-faq summary{cursor:pointer;font-size:14px;font-weight:600;color:var(--ink);list-style:none;display:flex;justify-content:space-between;gap:10px}
.mb-faq summary::-webkit-details-marker{display:none}
.mb-faq summary::after{content:"+";color:var(--gold-deep);font-weight:700}
.mb-faq details[open] summary::after{content:"–"}
.mb-faq p{font-size:13.5px;line-height:1.55;color:var(--ink-2);margin:8px 0 2px}
.mb-faq p a{color:var(--gold-deep);font-weight:600}
.mb-cancel-wrap{max-width:640px}
.mb-steps{list-style:none;margin:0 0 22px;padding:0;display:grid;gap:14px}
.mb-steps li{display:flex;gap:12px;align-items:flex-start}
.mb-steps b{display:block;font-size:15px;color:var(--ink)}
.mb-steps small{display:block;font-size:13.5px;line-height:1.5;color:var(--muted);margin-top:2px}
.mb-sn{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--gold-soft);color:var(--gold-ink);font-weight:800;font-size:13px}
.mb-cancel-form .mb-actions{margin-top:18px}
@media (max-width:1023px){ .mb-grid{grid-template-columns:minmax(0,1fr)} }
@media (max-width:640px){
  .mb-facts{grid-template-columns:minmax(0,1fr)}
  .mb-actions{flex-direction:column;align-items:stretch}
  .mb-actions .btn,.mb-actions form .btn{width:100%;justify-content:center}
  .mb-join-head{padding:22px 18px 18px}
  .mb-join-head h2{font-size:24px}
  .mb-inv-row{grid-template-columns:minmax(0,1fr) auto;row-gap:4px}
}
.mb-cancel-wrap .panel-body{padding-top:22px}
.mb-inv-row .chip{justify-self:start}

/* ---- Enrol (public course checkout: /enrol/:product) ---- */
.en-sum{border:1px solid var(--gold-line);border-radius:var(--r-lg);background:linear-gradient(135deg,#FFF6E0 0%,#FFFDF7 70%,#fff 100%);padding:16px 18px;margin:4px 0 18px}
.en-sum-top{display:flex;flex-direction:column;gap:2px}
.en-sum-k{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-deep)}
.en-sum-name{font-family:var(--font-head);font-size:20px;color:var(--ink)}
.en-sum-tag{font-size:13.5px;line-height:1.5;color:var(--ink-2);margin:6px 0 0}
.en-sum-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-top:10px}
.en-price{font-family:var(--font-head);font-size:28px;font-weight:700;color:var(--ink)}
.en-list{font-size:15px;color:var(--faint)}
.en-tag{font-size:11px;font-weight:700;color:var(--sage-ink);background:var(--sage-soft);border:1px solid var(--sage);border-radius:999px;padding:3px 9px}
.en-note{flex-basis:100%;font-size:12.5px;color:var(--muted)}
.en-sum-meta{list-style:none;margin:10px 0 0;padding:10px 0 0;border-top:1px dashed var(--gold-line);display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;font-weight:600;color:var(--ink-2)}
.en-sum-meta li{display:flex;align-items:center;gap:6px}
.en-sum-meta .ic{color:var(--gold-deep)}
.en-form .auth-label{margin-top:14px}
.en-form .auth-label:first-child{margin-top:0}
.en-form .auth-field input{font-size:16px;font-weight:500;min-height:50px;padding-top:12px;padding-bottom:12px}
.en-opt{font-weight:500;color:var(--faint)}
.en-err{color:#A2461F;font-weight:600}
.en-invalid{border-color:#E39A77}
.en-form .tc-check{margin-top:18px}
.en-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}