/* App surface, using the shared app starter and its tokens. */
/* Prime Traders brand layer: palette and gradients from the course site redesign (assets/site/tokens.css). Dark is the default. */
:root{--pt-lime:#B8F500;--pt-ink:#101810;--accent:#4A6600;--accent-bright:var(--pt-lime);--accent-deep:#3F5700;--accent-ink:var(--pt-ink);--accent-on-dark:var(--pt-lime);--accent-soft:color-mix(in srgb,var(--pt-lime) 22%,#F7F8F5);--accent-faint:color-mix(in srgb,var(--pt-lime) 12%,#F7F8F5);--bg:#F7F8F5;--surface:#FFFFFF;--surface-2:#EEF1EA;--ink-field:var(--pt-ink);--on-ink:#F7F8F5;--on-ink-muted:#BCC5BE;--ink:var(--pt-ink);--muted-strong:#3F4A42;--muted:#58635B;--line:#DDE3DC;--line-strong:#C3CBC2;--pt-glow:color-mix(in srgb,var(--pt-lime) 22%,transparent);--pt-glow-soft:color-mix(in srgb,var(--pt-lime) 9%,transparent);color-scheme:light}
:root[data-theme="dark"]{--accent:var(--pt-lime);--accent-deep:var(--pt-lime);--accent-soft:color-mix(in srgb,var(--pt-lime) 16%,transparent);--accent-faint:color-mix(in srgb,var(--pt-lime) 9%,transparent);--bg:#0B110B;--surface:#141C14;--surface-2:#1B241C;--ink-field:#0B110B;--ink:#F7F8F5;--muted-strong:#D3DAD4;--muted:#BCC5BE;--line:#2C372D;--line-strong:#38453A;--shadow:0 28px 80px rgba(0,0,0,.5);--shadow-soft:0 12px 38px rgba(0,0,0,.4);color-scheme:dark}
body{padding-bottom:calc(92px + env(safe-area-inset-bottom))}button{cursor:pointer}button:disabled{opacity:.6;cursor:default}.wrap{width:var(--shell);max-width:1100px;margin:auto}.top{height:var(--header-height);position:absolute;top:0;left:0;right:0;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1100px)/2));color:var(--on-ink);background:transparent;transition:background .2s var(--ease-out)}.top.scrolled{position:fixed;background:var(--ink-field);backdrop-filter:blur(16px)}.wordmark{font-weight:800;font-size:var(--fs-h3);letter-spacing:var(--tr-h3);line-height:1}.wordmark span{display:block;font-size:var(--fs-micro);letter-spacing:var(--tr-eyebrow);margin-top:5px}.quiet{min-height:44px;padding:8px 16px;background:transparent;border:1px solid var(--line-strong);border-radius:var(--radius-sm);color:inherit}.top .quiet{border-color:var(--on-ink-muted)}.hero{padding:calc(var(--header-height) + 36px) 0 48px;background:var(--ink-field);color:var(--on-ink);min-height:430px}.hero h1{font-size:var(--fs-display);line-height:.98;font-weight:600;letter-spacing:var(--tr-display);margin:20px 0 28px}.hero h1.compact{font-size:var(--fs-h2)}.hero-copy{color:var(--on-ink-muted);font-size:var(--fs-lead);margin-bottom:24px}.eyebrow{font-size:var(--fs-micro);font-weight:800;letter-spacing:var(--tr-eyebrow);color:var(--accent-deep);text-transform:uppercase}.hero .eyebrow{color:var(--accent-on-dark)}.demo-note{font-size:var(--fs-small);color:var(--on-ink-muted);margin-top:16px}.section{padding:44px 0}.section h2{font-size:var(--fs-h3);font-weight:600;letter-spacing:var(--tr-h3);margin-bottom:20px}.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center}.muted{color:var(--muted)}.band{background:var(--surface-2)}.stats{display:flex;gap:40px;padding-top:20px;border-top:1px solid var(--line)}.stats strong{display:block;font-size:var(--fs-h3);font-weight:600}.stats span{font-size:var(--fs-small);color:var(--muted)}.progress{width:100%;height:6px;background:var(--line-strong);margin:16px 0}.progress i{display:block;height:100%;background:var(--accent)}.month-strip{display:flex;overflow:auto;gap:0;scroll-snap-type:x mandatory;padding-bottom:20px}.month{flex:0 0 230px;padding:20px 24px 0 0;scroll-snap-align:start;border-top:1px solid var(--line-strong)}.month strong{display:block;font-size:var(--fs-h3);font-weight:600;margin-bottom:12px}.month p{max-width:190px}.month small{display:block;color:var(--muted);margin-top:12px}.lesson-row{display:grid;grid-template-columns:54px 1fr auto;align-items:center;gap:24px;padding:22px 0;border-top:1px solid var(--line)}.lesson-row .number{font-size:var(--fs-h3);color:var(--muted)}.lesson-row h3{font-size:var(--fs-lead);font-weight:600}.lesson-row p{font-size:var(--fs-small);color:var(--muted);margin-top:5px}.linkbutton{display:inline-flex;align-items:center;justify-content:center;min-height:44px;border:0;background:transparent;color:var(--accent-deep);padding:8px 0;font-weight:600;text-align:left}.bottom{position:fixed;bottom:0;left:0;right:0;z-index:10;display:flex;justify-content:center;background:var(--surface);border-top:1px solid var(--line);padding:8px 16px calc(8px + env(safe-area-inset-bottom));gap:8px}.bottom button{flex:1;max-width:150px;min-height:60px;border:0;background:transparent;color:var(--muted);font-size:var(--fs-small);font-weight:600;border-radius:var(--radius-sm)}.bottom button span{display:block;font-size:var(--fs-h3);line-height:1;margin-bottom:5px}.bottom button[aria-current=page]{color:var(--accent-deep);background:var(--accent-faint)}.form{max-width:560px;display:grid;gap:16px}.form label{display:grid;gap:6px}.form input{width:100%;min-height:48px;font-size:var(--fs-body);border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--surface);padding:10px 14px}.actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:20px}.state{font-size:var(--fs-small);color:var(--muted)}.ref-link{overflow-wrap:anywhere;padding:18px 0;border-bottom:1px solid var(--line);font-weight:600}.article{max-width:760px}.article p{margin:16px 0}.article h2{margin-top:24px}.test-step{padding:20px 0;border-bottom:1px solid var(--line)}.test-step h3{font-size:var(--fs-lead)}#message:not(:empty){position:fixed;bottom:100px;left:16px;right:16px;margin:auto;max-width:560px;padding:16px 22px;background:var(--ink);color:var(--bg);border-radius:var(--radius-sm);z-index:50;box-shadow:var(--shadow)}@media(max-width:760px){.top{padding:0 16px}.hero{min-height:390px;padding-top:calc(var(--header-height) + 28px)}.hero h1{margin-top:16px}.intro-grid{grid-template-columns:1fr;gap:28px}.section{padding:32px 0}.lesson-row{grid-template-columns:32px 1fr;gap:16px}.lesson-row>:last-child{grid-column:2}.stats{gap:24px}.bottom{gap:0;padding-left:4px;padding-right:4px}.bottom button{font-size:var(--fs-micro)}.month{flex-basis:210px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.wordmark{min-height:44px}.top.scrolled{background:color-mix(in srgb,var(--ink-field) 88%,transparent)}
/* Prime Traders brand surfaces: last, so they win over the starter rules above. */
body{background:radial-gradient(ellipse 80% 40% at 100% 0,var(--pt-glow-soft),transparent 70%) no-repeat,var(--bg)}
.hero{background:radial-gradient(circle at 88% 12%,var(--pt-glow),transparent 38%),radial-gradient(circle at 6% 100%,var(--pt-glow-soft),transparent 42%),linear-gradient(180deg,#101810,#0B110B)}
.band{background:radial-gradient(circle at 100% 0,var(--accent-soft),transparent 45%),var(--surface-2)}
.button-accent:hover{background:#C8FF2E}
.form input{color:var(--ink)}