/* /learn pages. LaTeX typography (Computer Modern, self-hosted) on the dark
   site; navigation and UI in the site's sans-serif. Mobile first. */
@font-face{font-family:'CMU Serif';font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/cmu/cmunrm.8da2bd09fcb4.woff2") format('woff2')}
@font-face{font-family:'CMU Serif';font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/cmu/cmunbx.a8b7291ecb05.woff2") format('woff2')}
@font-face{font-family:'CMU Serif';font-style:italic;font-weight:400;font-display:swap;src:url("../fonts/cmu/cmunti.61953bc21f78.woff2") format('woff2')}
@font-face{font-family:'CMU Serif';font-style:italic;font-weight:700;font-display:swap;src:url("../fonts/cmu/cmunbi.82a0a9c06b54.woff2") format('woff2')}
:root{--bg:#020617;--card:rgba(255,255,255,.035);--line:rgba(255,255,255,.09);--line2:rgba(255,255,255,.16);
--txt:#d4d8e0;--txt2:#9aa3b5;--txt3:#6c7590;--hi:#f1f3f7;--accent:#8B7CFF;--accent2:#3ECF8E;--link:#a9b8ff;
--serif:'CMU Serif','Latin Modern Roman',Georgia,serif;--sans:Inter,system-ui,sans-serif}
.learn-page main{padding:28px 0 72px}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.wrap.narrow{max-width:820px}
/* header: Learn stands out */
.ct-nav a.ct-nav-learn{color:#fff;font-weight:600;position:relative}
.ct-nav a.ct-nav-learn::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:2px;background:linear-gradient(90deg,#8B7CFF,#3ECF8E)}
.ct-free{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#0b1020;background:linear-gradient(90deg,#8B7CFF,#3ECF8E);vertical-align:2px}
/* breadcrumbs */
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0 0 28px;padding:0;font:500 13.5px/1.4 var(--sans);color:var(--txt3)}
.crumbs li+li::before{content:"›";margin-right:6px;color:var(--txt3)}
.crumbs a{color:var(--txt2);text-decoration:none}.crumbs a:hover{color:#fff}
.crumbs li[aria-current]{color:var(--txt)}
/* hero */
.kicker{font:600 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--accent2);margin:0 0 14px}
.lhero h1,.mhead h1{font:600 46px/1.1 'Space Grotesk',var(--sans);color:var(--hi);margin:0 0 16px;letter-spacing:-.01em}
.lede{font:400 19px/1.6 var(--sans);color:var(--txt2);max-width:720px;margin:0 0 26px}
.lhero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:18px}
.btn-primary,.btn-ghost{display:inline-flex;align-items:center;padding:12px 20px;border-radius:10px;font:600 15px var(--sans);text-decoration:none}
.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:#7a6af0}
.btn-ghost{border:1px solid var(--line2);color:var(--txt)}.btn-ghost:hover{border-color:var(--accent);color:#fff}
.lhero-stats{font:400 14px var(--sans);color:var(--txt3);margin:0}.lhero-stats b{color:var(--txt)}
.lhero{padding:8px 0 30px;border-bottom:1px solid var(--line);margin-bottom:28px}
/* search */
.find input{width:100%;max-width:520px;padding:12px 16px;border-radius:10px;border:1px solid var(--line2);background:var(--card);color:#fff;font:400 15px var(--sans);margin-bottom:26px}
.find input:focus{outline:none;border-color:var(--accent)}
/* module grid */
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-bottom:56px}
.mcard{display:flex;flex-direction:column;gap:6px;padding:18px 18px 16px;border:1px solid var(--line);border-radius:14px;background:var(--card);text-decoration:none;transition:border-color .15s,transform .15s}
.mcard:hover{border-color:var(--accent);transform:translateY(-2px)}
.mno{font:600 12px var(--sans);color:var(--accent);letter-spacing:.08em}
.mtitle{font:600 18px/1.3 'Space Grotesk',var(--sans);color:var(--hi)}
.mdesc{font:400 14px/1.5 var(--sans);color:var(--txt2);flex:1}
.mmeta{display:flex;align-items:center;gap:10px;font:500 12.5px var(--sans);color:var(--txt3);margin-top:6px}
.mbar{flex:1;height:4px;border-radius:4px;background:var(--line);overflow:hidden}.mbar i{display:block;height:100%;background:linear-gradient(90deg,#8B7CFF,#3ECF8E)}
/* curriculum lists */
.section-title{font:600 28px 'Space Grotesk',var(--sans);color:var(--hi);margin:0 0 18px}
.curriculum{columns:2 440px;column-gap:40px}
.mlist{break-inside:avoid;margin:0 0 30px}
.mlist h2{display:flex;align-items:baseline;gap:10px;font:600 19px 'Space Grotesk',var(--sans);margin:0 0 8px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.mlist h2 a{color:var(--hi);text-decoration:none}.mlist h2 a:hover{color:var(--accent)}
.lessons{list-style:none;margin:0;padding:0}
.lrow a,.lrow.is-planned{display:flex;gap:12px;padding:7px 8px;border-radius:8px;text-decoration:none}
.lrow a:hover{background:rgba(139,124,255,.1)}
.lnum{flex:0 0 22px;font:500 13px/1.6 var(--sans);color:var(--txt3);text-align:right}
.ltxt{display:flex;flex-direction:column}
.ltitle{font:500 15px/1.5 var(--sans);color:var(--txt)}
.lrow a .ltitle{color:var(--hi)}
.lsum{font:400 13.5px/1.45 var(--sans);color:var(--txt2)}
.lsoon{font:500 11px var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--txt3)}
.lrow.is-planned .ltitle{color:var(--txt3)}
.ldraft{font:600 11px var(--sans);letter-spacing:.06em;text-transform:uppercase;color:#FFC46B;border:1px solid rgba(255,196,107,.35);border-radius:999px;padding:1px 8px}
.lessons.small .ldraft{display:none}
.lessons.big .lrow a,.lessons.big .lrow.is-planned{padding:12px 12px}
.lessons.big .ltitle{font-size:17px}
.lessons.big .lnum{font-size:15px;flex-basis:28px}
.lessons.big{border-top:1px solid var(--line)}
.lessons.big .lrow{border-bottom:1px solid var(--line)}
/* module page */
.mhead{padding-bottom:26px}
.mintro{font:400 16px/1.65 var(--sans);color:var(--txt);max-width:720px;margin:0 0 16px}
/* pager */
.pager{display:flex;gap:14px;margin:40px 0 0}
.pager a{flex:1;display:flex;flex-direction:column;gap:4px;padding:14px 18px;border:1px solid var(--line);border-radius:12px;color:var(--hi);font:600 16px 'Space Grotesk',var(--sans);text-decoration:none}
.pager a span{font:500 12px var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--txt3)}
.pager a:hover{border-color:var(--accent)}
.pager .pager-next{text-align:right}
.pager .is-planned{color:var(--txt3);pointer-events:none}
/* lesson layout */
.lesson-grid{display:grid;grid-template-columns:260px minmax(0,1fr);gap:48px;align-items:start}
.lside{position:sticky;top:84px;max-height:calc(100vh - 100px);overflow:auto;padding-right:6px}
.lside summary{font:600 15px 'Space Grotesk',var(--sans);color:var(--hi);cursor:pointer;padding:6px 8px;list-style:none}
.lside summary span{color:var(--txt3);font:400 13px var(--sans)}
.lside summary::-webkit-details-marker{display:none}
.lessons.small .ltitle{font-size:13.5px}.lessons.small .lnum{font-size:12px}
.lessons.small .lrow a,.lessons.small .lrow.is-planned{padding:5px 8px}
.lessons.small .lsum,.lessons.small .lsoon{display:none}
.lrow.is-current a{background:rgba(139,124,255,.16)}.lrow.is-current .ltitle{color:#fff}
.lrow.is-current a{box-shadow:inset 2px 0 0 var(--accent)}
.allmods{display:block;margin:12px 8px;font:500 13px var(--sans);color:var(--link);text-decoration:none}
/* lesson article: LaTeX-like typography on dark */
.lesson{max-width:720px;font-family:var(--serif);color:var(--txt)}
.lesson .kicker{font-family:var(--sans)}
.lesson h1{font:400 38px/1.2 var(--serif);color:var(--hi);margin:0 0 14px}
.byline{font:400 16px/1.5 var(--serif);color:var(--txt);margin:0 0 26px}
.bname{font-variant:small-caps;letter-spacing:.03em;color:var(--hi)}
.bmeta{color:var(--txt3);font-size:14.5px}
.summary{border-left:3px solid var(--accent2);background:rgba(62,207,142,.06);padding:14px 18px;margin:0 0 30px;font:400 17px/1.6 var(--serif);color:var(--txt)}
.summary b{color:var(--hi)}
.body{counter-reset:sec fig;font-size:18.4px;line-height:1.65;text-align:justify;hyphens:auto;-webkit-hyphens:auto}
.body p{margin:0 0 .9em;color:var(--txt)}
.body p+p{text-indent:1.5em}
.body h2{counter-increment:sec;font:700 21px/1.3 var(--serif);color:var(--hi);margin:2em 0 .7em;text-align:left}
.body h2::before{content:counter(sec) "\2003"}
.body h3{font:700 18px var(--serif);color:var(--hi);margin:1.5em 0 .5em}
.body a{color:var(--link);text-decoration:none}.body a:hover{text-decoration:underline}
.body strong{color:var(--hi)}
.body ul,.body ol{padding-left:1.6em}.body li{margin:.35em 0}
.body figure{margin:1.8em 0 1.6em}
.body figure img{display:block;max-width:100%;height:auto;margin:0 auto;border:1px solid var(--line2)}
.body figcaption{counter-increment:fig;margin:.7em 1.5em 0;font-size:15.5px;line-height:1.45;text-align:left;hyphens:none}
.body figcaption::before{content:"Figure " counter(fig) ". ";font-weight:700;color:var(--hi)}
.body table{margin:1.4em auto 1.6em;border-collapse:collapse;border-top:1.5px solid #c9ced8;border-bottom:1.5px solid #c9ced8;font-variant-numeric:lining-nums tabular-nums}
.body th,.body td{padding:5px 14px;color:var(--txt);text-align:left;white-space:nowrap}
.body th{font-weight:400;border-bottom:.8px solid #c9ced8}
.body img{max-width:100%;height:auto}
.seealso{margin-top:44px;padding-top:24px;border-top:1px solid var(--line);font-family:var(--sans)}
.seealso h2{font:600 15px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--txt2);margin:0 0 8px}
.seealso ul{margin:0 0 22px;padding-left:1.2em}.seealso a{color:var(--link);text-decoration:none;font-size:16px}
.cta-levels{margin:30px 0 0;padding:16px 18px;border-radius:12px;border:1px solid rgba(139,124,255,.35);background:rgba(139,124,255,.08);font:500 15px var(--sans);color:var(--txt)}
.cta-levels a{color:#fff;font-weight:600}
.disclaimer{font:400 13px var(--sans);color:var(--txt3);margin-top:18px}
@media (max-width:900px){
 .lesson-grid{grid-template-columns:1fr;gap:18px}
 .lside{position:static;max-height:none;border:1px solid var(--line);border-radius:12px;padding:6px}
 .lside details:not([open]) summary::after{content:" ▸"}
 .lhero h1,.mhead h1{font-size:34px}
 .lesson h1{font-size:30px}
 .body{text-align:left;font-size:17.5px}
 .pager{flex-direction:column}
 .body table{display:block;overflow-x:auto}
}

.counter{max-width:520px;margin-top:6px}
.counter-num{font:500 15px var(--sans);color:var(--txt2);margin-bottom:8px}
.counter-num b{font:600 26px 'Space Grotesk',var(--sans);color:var(--hi);margin-right:2px}
.counter-bar{height:8px;border-radius:8px;background:var(--line);overflow:hidden}
.counter-bar i{display:block;height:100%;border-radius:8px;background:linear-gradient(90deg,#8B7CFF,#3ECF8E)}
.counter-note{font:400 13px var(--sans);color:var(--txt3);margin-top:8px}
.track{grid-column:1/-1;font:600 13px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--accent2);margin:18px 0 0}
.curriculum .track-wide{column-span:all;margin:10px 0 18px}
.lmeta{display:flex;gap:8px;align-items:center;margin-top:2px}
.lfmt{font:600 10.5px var(--sans);letter-spacing:.05em;text-transform:uppercase;padding:1px 7px;border-radius:999px;border:1px solid var(--line2);color:var(--txt2)}
.lfmt-how-to{color:#8fd9b6;border-color:rgba(62,207,142,.35)}
.lfmt-practice{color:#ffcf85;border-color:rgba(255,196,107,.35)}
.lfmt-example{color:#b9b0ff;border-color:rgba(139,124,255,.4)}
.lfmt-where-to-find{color:#8ec5ff;border-color:rgba(100,170,255,.35)}
.lfmt-market-read{color:#ff9fb0;border-color:rgba(255,120,150,.35)}
.lessons.small .lmeta{display:none}
/* progress + sign-up prompts */
.me-card{display:flex;flex-wrap:wrap;align-items:center;gap:14px 18px;margin-top:22px;padding:18px 20px;border-radius:14px;border:1px solid rgba(139,124,255,.35);background:linear-gradient(135deg,rgba(139,124,255,.12),rgba(62,207,142,.06))}
.me-card>div{flex:1 1 320px}
.me-card .counter-bar{margin-top:10px;max-width:420px}
.me-hi{font:600 18px 'Space Grotesk',var(--sans);color:var(--hi);margin:0 0 4px}
.me-sub{font:400 14.5px/1.5 var(--sans);color:var(--txt2);margin:0}.me-sub b{color:var(--txt)}
.me-login{font:500 14px var(--sans);color:var(--txt2);text-decoration:none}.me-login:hover{color:#fff}
.lp-card{margin:40px 0 0;padding:20px;border-radius:14px;border:1px solid var(--line2);background:var(--card);font-family:var(--sans)}
.lp-btn{padding:12px 20px;border-radius:10px;border:1px solid var(--accent2);background:transparent;color:#8fd9b6;font:600 15px var(--sans);cursor:pointer}
.lp-btn:hover{background:rgba(62,207,142,.1)}
.lp-btn.is-done{background:rgba(62,207,142,.16);color:#fff;border-color:rgba(62,207,142,.6)}
.lp-note{margin:12px 0 0;font:400 14px var(--sans);color:var(--txt2)}.lp-note a{color:var(--link)}
.lp-join{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.lp-join p{flex:1 1 100%;margin:0;font:400 15px/1.55 var(--sans);color:var(--txt)}.lp-join b{color:var(--hi)}
.lrow.is-done .lnum{color:transparent;position:relative}
.lrow.is-done .lnum::after{content:"✓";position:absolute;right:0;color:var(--accent2);font-weight:700}
.seealso,.seealso h2,.seealso ul{text-align:left}
.notify{flex:1 1 100%;display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;padding-top:12px;border-top:1px solid var(--line);font:500 13.5px var(--sans);color:var(--txt2)}
.notify label,.optin{display:inline-flex;gap:6px;align-items:center;color:var(--txt);cursor:pointer}
.optin{flex:1 1 100%;font:400 14px var(--sans);color:var(--txt2)}
.notify input,.optin input{accent-color:#8B7CFF}
.me-card>.notify{flex:1 1 100%}

/* formulas (MathML) and code */
.body math{font-family:var(--serif);font-size:1.05em}
.body .formula{margin:1.2em 0;overflow-x:auto;text-align:center;text-indent:0}
.body pre{overflow-x:auto;background:rgba(255,255,255,.05);padding:14px 16px;border-radius:8px;font-size:14px;line-height:1.5;text-align:left;hyphens:none}
.body code{font-size:.9em}
.body blockquote{margin:1.2em 2em;color:var(--txt);border-left:2px solid var(--line2);padding-left:14px}
.staff-banner{margin:0 0 22px;padding:12px 16px;border-radius:10px;font:500 14px var(--sans);color:#FFC46B;background:rgba(255,196,107,.08);border:1px solid rgba(255,196,107,.25)}
.newsletter{margin-top:22px;padding:16px 18px;border-radius:12px;border:1px dashed var(--line2);font:400 14px var(--sans);color:var(--txt2)}
.case-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:0 0 26px;font-family:var(--sans)}
.case-facts div{padding:10px 12px;border:1px solid var(--line);border-radius:10px}
.case-facts span{display:block;font:600 11px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--txt3)}
.case-facts b{font:600 15px var(--sans);color:var(--hi)}
.tag-planned{display:inline-block;padding:2px 9px;border-radius:999px;font:600 11px var(--sans);color:#8fd9b6;border:1px solid rgba(62,207,142,.4)}
.tag-after{color:#ffcf85;border-color:rgba(255,196,107,.4)}
.byline a.bname{text-decoration:none;color:var(--hi)}.byline a.bname:hover{text-decoration:underline}
/* Selected text must stay readable on every grey and white tone. */
.learn-page ::selection{background:rgba(139,124,255,.55);color:#fff}
.learn-page ::-moz-selection{background:rgba(139,124,255,.55);color:#fff}
/* "What most traders miss" box and the "Check yourself" answers */
.body .callout{margin:1.6em 0;padding:16px 20px;border-radius:10px;border:1px solid rgba(187,133,36,.45);
  background:rgba(187,133,36,.08);text-align:left;hyphens:none}
.body .callout p{text-indent:0;margin:0 0 .6em}.body .callout p:last-child{margin-bottom:0}
.body .callout strong:first-child{color:#E2B25C}
.body details{margin:.7em 0;padding:12px 16px;border:1px solid var(--line2);border-radius:10px;background:var(--card);text-align:left}
.body details summary{cursor:pointer;font-weight:700;color:var(--hi);list-style:none}
.body details summary::-webkit-details-marker{display:none}
.body details summary::before{content:"+ ";color:var(--accent)}
.body details[open] summary::before{content:"− "}
.body details p{text-indent:0;margin:.6em 0 0}
/* lesson test */
.ltest{margin:44px 0 0;padding:26px 24px;border-radius:16px;border:1px solid var(--line2);background:linear-gradient(180deg,rgba(139,124,255,.07),rgba(139,124,255,.015));font-family:var(--sans)}
.ltest.is-passed{border-color:rgba(62,207,142,.45);background:linear-gradient(180deg,rgba(62,207,142,.07),rgba(62,207,142,.015))}
.ltest-kicker{font:600 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0 0 10px}
.ltest h2{text-align:left;font:600 26px/1.2 'Space Grotesk',var(--sans);color:var(--hi);margin:0 0 10px}
.ltest-sub{margin:-4px 0 10px;font:500 16px/1.4 var(--sans);color:#c2b8ff}
.ltest-rules{font:400 14.5px/1.6 var(--sans);color:var(--txt2);margin:0 0 14px;max-width:680px}
.ltest-now,.ltest-pass{padding:12px 16px;border-radius:10px;font:400 15px/1.55 var(--sans);color:var(--txt)}
.ltest-now{background:rgba(255,255,255,.04);border:1px solid var(--line)}
.ltest-now b{color:var(--hi)}
.ltest-pass{background:rgba(62,207,142,.1);border:1px solid rgba(62,207,142,.35)}
.ltest-pass b{color:#8fe3bd}.ltest-pass a{color:var(--link)}
.tq-list{list-style:none;counter-reset:tq;margin:22px 0 0;padding:0}
.tq{counter-increment:tq;margin:0 0 14px;padding:16px 18px;border-radius:12px;border:1px solid var(--line);background:rgba(2,6,23,.45);transition:border-color .2s}
.tq.tq-right{border-color:rgba(62,207,142,.35)}
.tq.tq-missing{border-color:rgba(255,196,107,.6)}
.tq-q{margin:0 0 12px;font:500 16.5px/1.5 var(--sans);color:var(--hi)}
.tq-q::before{content:counter(tq) ". ";color:var(--accent);font-weight:700}
.tq-opts{display:grid;gap:8px}
.tq-opt{display:flex;gap:12px;align-items:flex-start;padding:10px 14px;border-radius:10px;border:1px solid var(--line);cursor:pointer;font:400 15px/1.5 var(--sans);color:var(--txt);transition:background .15s,border-color .15s}
.tq-opt:hover{border-color:var(--line2);background:rgba(255,255,255,.03)}
.tq-opt input{margin:4px 0 0;accent-color:var(--accent);flex:none}
.tq-opt:has(input:checked){border-color:rgba(139,124,255,.6);background:rgba(139,124,255,.08)}
.tq .tq-opt.is-right{border-color:rgba(62,207,142,.6);background:rgba(62,207,142,.13);color:#e4f7ee}
.tq .tq-opt.is-right input{accent-color:#3ECF8E}
.tq .tq-opt.is-wrong{border-color:rgba(232,84,118,.65);background:rgba(232,84,118,.12);color:#f6dde3}
.tq .tq-opt.is-wrong input{accent-color:#E85476}
.tq-opt:has(input:disabled){cursor:default}
.tq-opt:has(input:disabled):not(.is-right){opacity:.55}
.tq-why{margin:12px 0 0;padding:10px 14px;border-left:3px solid var(--accent2);background:rgba(62,207,142,.05);font:400 14.5px/1.55 var(--sans);color:var(--txt2)}
.ltest-bar{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:18px}
.ltest-bar .btn-primary{border:0;cursor:pointer}
.ltest-bar .btn-primary:disabled{opacity:.5;cursor:not-allowed}
.ltest-msg{font:500 14.5px/1.5 var(--sans);color:#ffc46b}
.tq-reset{margin-left:auto;background:none;border:1px dashed rgba(255,196,107,.4);color:#ffc46b;border-radius:8px;padding:6px 10px;font:500 12.5px var(--sans);cursor:pointer}
.tmodal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(2,6,23,.72);backdrop-filter:blur(4px)}
.tmodal[hidden]{display:none}
.tmodal-card{position:relative;width:100%;max-width:440px;padding:28px 26px 24px;border-radius:16px;border:1px solid var(--line2);background:#0b1020;box-shadow:0 30px 80px rgba(0,0,0,.5);font-family:var(--sans)}
.tmodal-card h3{font:600 23px/1.25 'Space Grotesk',var(--sans);color:var(--hi);margin:0 0 12px}
.tmodal-card ul{margin:0 0 20px;padding-left:18px;color:var(--txt2);font:400 14.5px/1.6 var(--sans)}
.tmodal-card .btn-primary{width:100%;justify-content:center;box-sizing:border-box}
.tmodal-card .me-login{display:block;margin-top:12px;text-align:center;color:var(--link);font:500 14px var(--sans)}
.tmodal-x{position:absolute;top:10px;right:12px;background:none;border:0;color:var(--txt3);font-size:24px;cursor:pointer;line-height:1}
@media (max-width:640px){.ltest{padding:20px 16px}.ltest h2{font-size:22px}.tq{padding:14px}}
/* staff: approve and schedule */
.pubbox{margin:0 0 24px;padding:14px 16px;border-radius:12px;border:1px solid rgba(255,196,107,.3);background:rgba(255,196,107,.06);font:400 14px/1.55 var(--sans);color:var(--txt)}
.pubbox-state{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.pubbox-test{color:var(--txt3)}
.pubchip{display:inline-block;padding:1px 9px;border-radius:999px;font:700 11px/1.7 var(--sans);letter-spacing:.06em;text-transform:uppercase}
.pubchip.is-live{background:rgba(62,207,142,.16);color:#8fe3bd}
.pubchip.is-sched{background:rgba(139,124,255,.18);color:#c2b8ff}
.pubchip.is-draft{background:rgba(255,196,107,.16);color:#ffc46b}
.pubchip.is-void{background:rgba(232,84,118,.16);color:#f39ab0}
.pubbox-form{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:12px}
.pubbox-form label{display:flex;align-items:center;gap:8px;color:var(--txt2)}
.pubbox-form input[type=date]{padding:7px 10px;border-radius:8px;border:1px solid var(--line2);background:#0b1020;color:var(--hi);font:500 14px var(--sans);color-scheme:dark}
.pubbox-at{color:var(--txt3)}
.pub-approve,.pub-withdraw{padding:8px 14px;border-radius:8px;font:600 14px var(--sans);cursor:pointer}
.pub-approve{border:0;background:#3ECF8E;color:#04210f}.pub-approve:hover{background:#5ad9a0}
.pub-withdraw{border:1px solid rgba(232,84,118,.5);background:transparent;color:#f39ab0}
.pub-approve:disabled,.pub-withdraw:disabled{opacity:.5;cursor:wait}
.pubbox-note{margin:10px 0 0;color:var(--txt3);font-size:13px}
.pubbox-msg{margin:6px 0 0;color:#ffc46b;font-weight:500}.pubbox-msg:empty{display:none}
.ldraft.is-sched{color:#c2b8ff;border-color:rgba(139,124,255,.45)}
/* learning rank */
.rank-card{margin:0;padding:16px 18px;border-radius:14px;border:1px solid rgba(139,124,255,.3);background:linear-gradient(135deg,rgba(139,124,255,.1),rgba(62,207,142,.05));font-family:var(--sans)}
.rank-who{display:flex;align-items:center;gap:12px}
.rank-who b{display:block;color:var(--hi);font:600 16px/1.3 'Space Grotesk',var(--sans)}
.rank-who span{color:var(--txt3);font-size:13px}
.rank-pic{width:44px;height:44px;border-radius:50%;flex:none;object-fit:cover;border:2px solid rgba(139,124,255,.5)}
.rank-ini{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#8B7CFF,#3ECF8E);color:#0b1020;font:700 18px var(--sans);border:0}
.rank-tier{margin-left:auto;padding:6px 12px;border-radius:999px;background:rgba(139,124,255,.18);color:#d6d0ff;font:700 15px var(--sans);white-space:nowrap}
.rank-tier.is-elite{background:linear-gradient(90deg,#BB8524,#e0b04d);color:#1a1205}
.rank-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0 10px}
.rank-stats div{padding:8px 10px;border-radius:10px;background:rgba(2,6,23,.45);border:1px solid var(--line)}
.rank-stats dt{color:var(--txt3);font-size:11.5px;letter-spacing:.04em;text-transform:uppercase}
.rank-stats dd{margin:2px 0 0;color:var(--hi);font:700 20px 'Space Grotesk',var(--sans)}
.rank-line{margin:0;color:var(--txt2);font-size:14px;line-height:1.55}.rank-line b{color:#c2b8ff}
.rank-fine{margin:8px 0 0;color:var(--txt3);font-size:12px}
@media (max-width:560px){.rank-stats{grid-template-columns:repeat(2,1fr)}}
.me-card>.rank-card{flex:1 1 100%;order:-1}
.ltest.is-collapsed #tq-body,.ltest.is-collapsed .ltest-rules{display:none}
.ltest-open{display:flex;align-items:center;gap:12px;width:100%;margin:6px 0 0;padding:14px 18px;border-radius:12px;border:1px solid rgba(139,124,255,.5);background:rgba(139,124,255,.14);color:var(--hi);font:600 16px var(--sans);cursor:pointer;text-align:left;transition:background .15s}
.ltest-open:hover{background:rgba(139,124,255,.22)}
.ltest-open span{color:var(--txt2);font-weight:400;font-size:14px}
.ltest-open i{margin-left:auto;font-style:normal;color:var(--accent)}
.ltest:not(.is-collapsed) .ltest-open{display:none}
.body-after{margin-top:24px}
/* passing a lesson test */
.tconfetti{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:1002}
.tcele{position:fixed;inset:0;z-index:1001;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(2,6,23,.7);backdrop-filter:blur(5px);opacity:0;transition:opacity .25s}
.tcele.is-on{opacity:1}
.tcele-card{position:relative;width:100%;max-width:440px;padding:30px 26px 24px;border-radius:20px;text-align:center;border:1px solid rgba(62,207,142,.45);background:radial-gradient(120% 90% at 50% 0%,rgba(62,207,142,.18),rgba(139,124,255,.08) 55%,#0b1020);box-shadow:0 30px 90px rgba(0,0,0,.55),0 0 60px rgba(62,207,142,.15);font-family:var(--sans);transform:translateY(16px) scale(.94);transition:transform .45s cubic-bezier(.2,1.4,.4,1)}
.tcele.is-on .tcele-card{transform:none}
.tcele-badge{width:76px;height:76px;margin:0 auto 14px}
.tcele-badge svg{width:100%;height:100%}
.tcele-badge circle{fill:rgba(62,207,142,.14);stroke:#3ECF8E;stroke-width:2.5;stroke-dasharray:151;stroke-dashoffset:151;animation:tdraw .7s .1s ease-out forwards}
.tcele-badge path{fill:none;stroke:#3ECF8E;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;stroke-dashoffset:40;animation:tdraw .45s .65s ease-out forwards}
@keyframes tdraw{to{stroke-dashoffset:0}}
.tcele-card h3{margin:0 0 8px;font:600 24px/1.25 'Space Grotesk',var(--sans);color:var(--hi)}
.tcele-score{margin:6px 0 4px;color:#8fe3bd;font:700 64px/1 'Space Grotesk',var(--sans)}
.tcele-score span{font-size:32px;margin-left:2px}
.tcele-sub{margin:0 0 10px;color:var(--txt2);font-size:14.5px;line-height:1.5}
.tcele-rank{margin:0 0 16px;color:var(--txt);font-size:15px}.tcele-rank b{color:#e0b04d}
.tcele-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
@media (prefers-reduced-motion:reduce){.tcele-card,.tcele{transition:none}.tcele-badge circle,.tcele-badge path{animation:none;stroke-dashoffset:0}}
.lscore{margin-left:auto;padding:1px 9px;border-radius:999px;font:700 12px/1.7 var(--sans);letter-spacing:.02em;color:#c2b8ff;background:rgba(139,124,255,.16);border:1px solid rgba(139,124,255,.35);white-space:nowrap}
.lscore.is-good{color:#8fe3bd;background:rgba(62,207,142,.13);border-color:rgba(62,207,142,.4)}
.lscore.is-perfect{color:#1a1205;background:linear-gradient(90deg,#BB8524,#e0b04d);border-color:transparent}
.lmeta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.lessons.small .lscore{font-size:10.5px;padding:0 7px}
.lessons.small .lmeta:has(.lscore){display:flex}
.lessons.small .lmeta .lfmt{display:none}
.lrow .ltxt{flex:1;min-width:0}
.body .credit{margin:-.6em 0 1.4em;text-align:center;text-indent:0;font:400 12.5px/1.4 var(--sans);color:var(--txt3)}.body .credit a{color:var(--txt3)}
.body table{max-width:100%}.body td{white-space:normal}
.lesson-grid>*,.lesson{min-width:0}.body .formula{max-width:100%}
.body p>math,.body li>math,.body details math{display:inline-block;max-width:100%;overflow-x:auto;overflow-y:hidden;vertical-align:middle}
