:root{--red:#b3121b;--red-dark:#7a0b12;--red-soft:#f6e3e4;--ink:#1c1a19;--ink-soft:#4a4644;--muted:#8a847c;--paper:#fbf8f3;--paper-2:#f2ece2;--rule:#e2d9cc;--ok:#2f8f4e;
 --serif:"PT Serif",Georgia,"Times New Roman",serif;--sans:"Oswald","Arial Narrow",Impact,sans-serif;--side:260px}
@media (prefers-color-scheme:dark){:root{--ink:#ece6dc;--ink-soft:#b8b0a4;--muted:#8d867c;--paper:#171514;--paper-2:#211e1c;--rule:#3a3532;--red:#e0323c;--red-dark:#b3121b;--red-soft:#3a1b1d}}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:19px;line-height:1.62;-webkit-font-smoothing:antialiased}
#app{display:flex;min-height:100vh}
/* ---- sidebar ---- */
#side{width:var(--side);flex:none;position:sticky;top:0;height:100vh;overflow:auto;background:var(--paper-2);border-right:1px solid var(--rule);display:flex;flex-direction:column;font-family:var(--sans)}
.side-brand{padding:1.1rem 1.2rem .8rem;background:var(--red);color:#fff}
.sb-t{font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:1.05rem;line-height:1.1}.sb-s{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;opacity:.8;margin-top:.2rem}
.side-user{padding:1rem 1.2rem;border-bottom:1px solid var(--rule)}
.su-name{font-weight:700;font-size:1.15rem;margin-bottom:.6rem}
.su-level{display:flex;align-items:center;gap:.8rem}
.lvl-ring{position:relative;width:56px;height:56px;flex:none}.lvl-ring svg{width:56px;height:56px;transform:rotate(-90deg)}
.lvl-ring circle{fill:none;stroke-width:3.2}.lvl-ring .bg{stroke:var(--rule)}.lvl-ring .fg{stroke:var(--red);stroke-linecap:round;stroke-dasharray:97.4;stroke-dashoffset:97.4;transition:stroke-dashoffset .8s}
.lvl-num{position:absolute;inset:0;display:grid;place-items:center;font-weight:700;font-size:1.5rem;color:var(--red)}
.lvl-txt{font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);line-height:1.3}.lvl-txt b{display:block;color:var(--ink);font-size:.9rem}
.su-streak{margin-top:.8rem;display:flex;align-items:baseline;gap:.4rem;font-size:.85rem;color:var(--ink-soft)}.streak-n{font-weight:700;font-size:1.2rem;color:var(--ink)}
.side-nav{padding:.6rem 0 1.5rem;flex:1}
.side-nav a{display:block;padding:.55rem 1.2rem;color:var(--ink);text-decoration:none;font-weight:500;letter-spacing:.04em;text-transform:uppercase;font-size:.9rem;border-left:3px solid transparent}
.side-nav a:hover{background:rgba(179,18,27,.06)}.side-nav a.active{border-left-color:var(--red);color:var(--red)}
.nav-lbl{padding:.9rem 1.2rem .3rem;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.lesson-list{list-style:none;margin:0;padding:0}
.lesson-list a{display:flex;align-items:center;gap:.7rem;text-transform:none;letter-spacing:0;font-size:.95rem;padding:.45rem 1.2rem}
.ll-num{font-weight:700;color:var(--muted);min-width:1.2em;text-align:right}.lesson-list a.active .ll-num{color:var(--red)}
.ll-t{flex:1;line-height:1.15}.ll-bar{display:flex;gap:2px;width:34px;flex:none}.ll-bar i{flex:1;height:5px;background:var(--rule);border-radius:2px}.ll-bar i.on{background:var(--red)}.ll-bar i.half{background:linear-gradient(90deg,var(--red) 50%,var(--rule) 50%)}
.lesson-list a.done .ll-num{color:var(--ok)}
/* ---- main ---- */
#main{flex:1;min-width:0}
.view{min-height:100vh}
.wrap{max-width:720px;margin:0 auto;padding:2.5rem 1.4rem 5rem}
/* cover / onboarding */
.cover{background:radial-gradient(ellipse at 30% 20%,#e0323c 0%,#b3121b 40%,#5c070d 100%);color:#fff;min-height:100vh;padding:clamp(3rem,10vh,7rem) 1.5rem;text-align:center;position:relative;overflow:hidden}
.cover:before{content:"";position:absolute;inset:0;background:repeating-conic-gradient(from 0deg at 50% 60%,rgba(255,255,255,.07) 0 6deg,transparent 6deg 12deg);pointer-events:none}
.cover .inner{position:relative;max-width:760px;margin:0 auto}
.cover h1{font-family:var(--sans);font-weight:700;font-size:clamp(2.6rem,8vw,5.6rem);line-height:.95;margin:0;letter-spacing:.02em;text-transform:uppercase;text-shadow:0 4px 18px rgba(0,0,0,.45)}
.cover p{font-family:var(--sans);font-weight:500;font-size:clamp(1rem,2.4vw,1.4rem);letter-spacing:.06em;text-transform:uppercase;margin:1.2rem auto 0;max-width:34ch;opacity:.95}
.cover .meta{font-family:var(--serif);text-transform:none;letter-spacing:0;font-size:.95rem;opacity:.7;margin-top:1.6rem}
.ob-card{background:rgba(0,0,0,.28);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.25);border-radius:14px;padding:1.6rem 1.8rem;max-width:560px;margin:2.5rem auto 0;text-align:left}
.cover .ob-p{font-family:var(--serif);text-transform:none;letter-spacing:0;font-size:1.15rem;line-height:1.5;margin:0 0 1rem;opacity:1}
.cover .ob-hint{font-family:var(--serif);text-transform:none;letter-spacing:0;font-size:.9rem;opacity:.75;margin:.5rem 0 1rem}
#ob-name{width:100%;font:inherit;font-family:var(--serif);font-size:1.4rem;padding:.6rem .8rem;border-radius:8px;border:2px solid rgba(255,255,255,.5);background:rgba(255,255,255,.12);color:#fff;outline:none}
#ob-name:focus{border-color:#fff;background:rgba(255,255,255,.2)}#ob-name::placeholder{color:rgba(255,255,255,.55)}
.ob-grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin-bottom:1.2rem}
.ob-grid div{background:rgba(255,255,255,.1);border-radius:10px;padding:.8rem 1rem}.ob-grid b{display:block;font-family:var(--sans);letter-spacing:.06em;text-transform:uppercase;font-size:.9rem;margin-bottom:.2rem}.cover .ob-grid span{font-family:var(--serif);text-transform:none;letter-spacing:0;font-size:.9rem;opacity:.85;line-height:1.35;display:block}
/* buttons */
.btn{font-family:var(--sans);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.85rem;border:0;border-radius:8px;padding:.6rem 1.1rem;cursor:pointer;transition:.15s}
.btn.primary{background:var(--red);color:#fff}.btn.primary:hover{background:var(--red-dark)}.btn.primary:disabled{opacity:.35;cursor:default}
.btn.ghost{background:transparent;color:var(--ink-soft);border:1px solid var(--rule)}.btn.ghost:hover{border-color:var(--red);color:var(--red)}.btn.ghost:disabled{opacity:.3;cursor:default}
.btn.light{background:#fff;color:var(--red-dark);font-size:.95rem;padding:.7rem 1.4rem}.btn.light:hover{background:#ffe9b0}
/* lesson */
.lesson{display:none}.lesson.active{display:block}
.lesson-head{border-bottom:4px solid var(--red);padding-bottom:1.2rem;margin-bottom:2rem}
.lh-top{display:flex;gap:1rem;align-items:baseline;font-family:var(--sans);letter-spacing:.12em;text-transform:uppercase;font-size:.8rem;color:var(--muted)}.lh-num{color:var(--red);font-weight:700}
.lesson-head h1{font-family:var(--sans);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:clamp(1.9rem,5vw,2.8rem);line-height:1.02;margin:.3rem 0 1rem;color:var(--red)}
.lh-obj{background:var(--paper-2);border-radius:10px;padding:1rem 1.3rem}.lh-greet{font-style:italic;color:var(--ink-soft);margin-bottom:.4rem}.lh-greet:empty{display:none}
.lh-lbl{font-family:var(--sans);letter-spacing:.1em;text-transform:uppercase;font-size:.78rem;color:var(--muted);margin:0 0 .3rem}.lh-obj ul{margin:0;padding-left:1.2em;font-size:.97em}.lh-obj li{margin:.15em 0}
.blk{position:relative}
.blk.read>p,.blk.read>ul,.blk.read>.callout{}
.lesson-body>.blk:first-of-type>p::first-letter{font-family:var(--sans);font-weight:700;font-size:3.4em;line-height:.8;float:left;color:var(--red);margin:.08em .12em 0 0}
p{margin:0 0 1.1em;hyphens:auto}strong{font-weight:700}ul{padding-left:1.3em;margin:0 0 1.2em}li{margin:.3em 0}
.callout{margin:1.8rem 0;border-radius:12px}
.pull{background:linear-gradient(135deg,#d0202a,#8e0d14);color:#fff;padding:1.3rem 1.6rem;font-family:var(--sans);font-weight:500;font-size:1.28rem;line-height:1.35;position:relative;box-shadow:0 8px 24px rgba(120,10,15,.22)}
.pull:after{content:"";position:absolute;right:0;bottom:0;border-style:solid;border-width:0 0 26px 26px;border-color:transparent transparent var(--paper) transparent;border-bottom-right-radius:12px}
.pull p{margin:0;hyphens:none}
.box{background:linear-gradient(180deg,#c9161f,#9a0f16);color:#fff;padding:1.2rem 1.5rem;border:3px solid #e8e0d2;box-shadow:0 0 0 2px #8a8a8a,0 10px 24px rgba(0,0,0,.2);font-size:1.02rem}
.box p{margin:0 0 .7em;hyphens:none}.box p:last-child{margin:0}.box strong{color:#ffe9b0}
.dialog{background:linear-gradient(135deg,#d0202a,#7a0b12);color:#fff;padding:1.2rem 1.6rem;font-family:var(--sans);font-weight:500;font-size:1.12rem;line-height:1.5}.dialog p{margin:.15em 0;hyphens:none}
.list{background:linear-gradient(135deg,#d0202a,#7a0b12);color:#fff;padding:1.2rem 1.6rem 1.2rem 1.2rem;font-family:var(--sans);font-weight:500;font-size:1.1rem}.list ul{margin:0;padding-left:1.4em}.list li{margin:.35em 0}
/* exercises */
.ex{margin:2.2rem 0;border:2px solid var(--red);border-radius:14px;padding:1.2rem 1.4rem 1.3rem;background:var(--paper);position:relative;box-shadow:0 6px 20px rgba(120,10,15,.08)}
.ex-slot{border-style:dashed;border-color:#c9a0a3;box-shadow:none;background:transparent}
.ex-head{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;margin-bottom:.5rem}
.ex-tag{font-family:var(--sans);font-weight:700;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:#fff;background:var(--red);padding:.2rem .55rem;border-radius:4px}
.ex-slot .ex-tag{background:#c9a0a3}
.ex h3{font-family:var(--sans);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:1.25rem;margin:0;color:var(--red)}
.ex-slot h3{color:var(--ink-soft)}
.ex-stage{margin-left:auto;font-family:var(--sans);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border:1px solid var(--rule);border-radius:999px;padding:.15rem .6rem}
.ex-desc{font-size:.95em;color:var(--ink-soft);margin:0 0 .8em}
.ex label{display:block;font-family:var(--sans);letter-spacing:.04em;font-size:.88rem;color:var(--ink-soft);margin:.7rem 0 .2rem}
.ex textarea,.fieldtask textarea{display:block;width:100%;font:inherit;font-family:var(--serif);font-size:1rem;line-height:1.45;padding:.6rem .8rem;border:1px solid var(--rule);border-radius:8px;background:var(--paper-2);color:var(--ink);resize:vertical;margin-top:.25rem}
.ex textarea:focus,.fieldtask textarea:focus{outline:none;border-color:var(--red)}
.ex-row{display:flex;align-items:center;gap:1rem;margin-top:1rem}
.ex-status{font-family:var(--sans);font-size:.85rem;letter-spacing:.04em;color:var(--ok)}
.ex-note{font-size:.88em;color:var(--muted);margin:.9em 0 0;font-style:italic}
.ex.done{border-color:var(--ok)}.ex.done .ex-tag{background:var(--ok)}.ex.done h3{color:var(--ok)}
/* lesson end */
.lesson-end{margin-top:3rem}
.keycard{background:var(--red);color:#fff;border-radius:14px;padding:1.3rem 1.6rem;margin-bottom:1.6rem}
.kc-lbl{font-family:var(--sans);font-weight:700;letter-spacing:.16em;text-transform:uppercase;font-size:.75rem;opacity:.85;margin-bottom:.4rem}
.keycard ul{margin:0;padding-left:1.2em}.keycard li{margin:.4em 0;font-size:1.02em}
.fieldtask{border:2px solid var(--ink);border-radius:14px;padding:1.2rem 1.4rem 1.3rem}
.ft-head{display:flex;align-items:center;gap:.8rem;margin-bottom:.4rem}.ft-head .ex-tag{background:var(--ink)}.ft-head h3{font-family:var(--sans);text-transform:uppercase;font-size:1.25rem;margin:0}
.fieldtask label{display:block;font-family:var(--sans);font-size:.88rem;color:var(--ink-soft);margin:.7rem 0 .2rem}
.fieldtask.done{border-color:var(--ok)}.fieldtask.done .ex-tag{background:var(--ok)}
.lesson-nav{display:flex;justify-content:space-between;margin-top:2rem;gap:1rem}
/* dashboard */
.dash{max-width:860px;margin:0 auto;padding:2.5rem 1.4rem 5rem}
.dash h1{font-family:var(--sans);text-transform:uppercase;color:var(--red);font-size:2.4rem;margin:0 0 .2rem}
.dash .sub{color:var(--ink-soft);margin:0 0 1.8rem}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:2rem}
.card{background:var(--paper-2);border-radius:12px;padding:1rem 1.2rem}.card .c-l{font-family:var(--sans);letter-spacing:.12em;text-transform:uppercase;font-size:.72rem;color:var(--muted)}.card .c-v{font-family:var(--sans);font-weight:700;font-size:2rem;color:var(--red);line-height:1.1}.card .c-s{font-size:.88em;color:var(--ink-soft)}
.dash h2{font-family:var(--sans);text-transform:uppercase;letter-spacing:.06em;font-size:1.1rem;color:var(--ink);margin:1.6rem 0 .6rem}
.dl{list-style:none;margin:0;padding:0}.dl li{display:grid;grid-template-columns:2.2rem 1fr auto;gap:.8rem;align-items:center;padding:.6rem 0;border-bottom:1px solid var(--rule)}
.dl .n{font-family:var(--sans);font-weight:700;color:var(--red);font-size:1.3rem}.dl .t{line-height:1.2}.dl .t small{display:block;color:var(--muted);font-size:.8em}
.seg{display:flex;gap:4px}.seg i{width:34px;height:8px;border-radius:3px;background:var(--rule);position:relative;overflow:hidden}.seg i b{position:absolute;inset:0;background:var(--red);transform-origin:left;transform:scaleX(var(--p,0))}.seg i.ok b{background:var(--ok)}
.seg-lbl{display:flex;gap:4px;font-family:var(--sans);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.seg-lbl span{width:34px;text-align:center}
.goals-view{background:var(--paper-2);border-left:4px solid var(--red);padding:.9rem 1.2rem;border-radius:0 10px 10px 0}.goals-view p{margin:.3em 0}.goals-view b{font-family:var(--sans);letter-spacing:.06em;text-transform:uppercase;font-size:.75rem;color:var(--muted);display:block}
.empty{color:var(--muted);font-style:italic}
/* journal */
.jr{max-width:760px;margin:0 auto;padding:2.5rem 1.4rem 5rem}
.jr h1{font-family:var(--sans);text-transform:uppercase;color:var(--red);font-size:2.4rem;margin:0 0 1rem}
.jr-tools{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:1.5rem}
.je{border-bottom:1px solid var(--rule);padding:.8rem 0}.je .je-m{font-family:var(--sans);letter-spacing:.08em;text-transform:uppercase;font-size:.72rem;color:var(--muted)}.je .je-m a{color:var(--red);text-decoration:none}.je p{margin:.3em 0}
/* notes on blocks */
.nt-btn{position:absolute;left:-2.7rem;top:.15em;width:1.9rem;height:1.9rem;border:0;background:transparent;cursor:pointer;opacity:0;font-size:1.1rem;color:var(--muted);transition:.15s}
.blk:hover .nt-btn,.blk.has-note .nt-btn{opacity:1}.blk.has-note .nt-btn{color:var(--red)}
.nt-btn.bm{top:.15em}.blk.bookmarked .nt-btn.bm{opacity:1;color:var(--red)}
.note{margin:-.4rem 0 1.2rem;border-left:3px solid var(--red);padding:.5rem .9rem;background:var(--paper-2);border-radius:0 8px 8px 0}
.note textarea{width:100%;font:inherit;font-size:.95rem;border:0;background:transparent;resize:vertical;color:var(--ink);outline:none;min-height:3.2em}
.note .nt-lbl{font-family:var(--sans);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
.blk.bookmarked{background:linear-gradient(90deg,rgba(179,18,27,.09),transparent 70%);border-radius:6px;margin-left:-.9rem;padding-left:.9rem;margin-right:-.9rem;padding-right:.9rem}
.blk.bookmarked::after{content:"";position:absolute;left:-.9rem;top:0;bottom:0;width:3px;background:var(--red);border-radius:2px}
/* ribbon & toast */
#bm-ribbon{position:fixed;bottom:16px;right:16px;width:230px;z-index:20;font-family:var(--sans);color:#fff;transform:translateY(130%);transition:transform .5s cubic-bezier(.2,.9,.3,1.2)}
#bm-ribbon.show{transform:none}
#bm-ribbon .body{background:linear-gradient(180deg,#d0202a,#8e0d14);padding:.9rem 1rem 1rem;border-radius:12px;box-shadow:0 10px 26px rgba(90,5,10,.35)}
#bm-ribbon .lbl{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;opacity:.8}#bm-ribbon .ch{font-weight:700;font-size:1rem;line-height:1.2;margin:.3rem 0;text-transform:uppercase}
#bm-ribbon .snip{font-family:var(--serif);font-size:.84rem;line-height:1.35;opacity:.92;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-style:italic}
#bm-ribbon .row{display:flex;gap:.5rem;margin-top:.7rem}#bm-ribbon button{font-family:var(--sans);font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:.72rem;border:0;border-radius:6px;padding:.4rem .7rem;cursor:pointer}
#bm-ribbon .go{background:#fff;color:var(--red-dark);flex:1}#bm-ribbon .del{background:rgba(0,0,0,.25);color:#fff}
#toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);background:var(--ink);color:var(--paper);font-family:var(--sans);letter-spacing:.06em;font-size:.9rem;padding:.6rem 1.1rem;border-radius:999px;opacity:0;transition:.25s;z-index:30;pointer-events:none;white-space:nowrap}
#toast.show{opacity:1;transform:translate(-50%,0)}#toast b{color:#ffe9b0}
/* responsive */
@media (max-width:900px){#app{flex-direction:column}#side{width:100%;height:auto;position:static;border-right:0;border-bottom:1px solid var(--rule)}.side-nav{display:none}.side-user{display:flex;gap:1.5rem;align-items:center}.su-name{margin:0}.su-streak{margin:0}
 #mnav{display:flex}}
@media (max-width:640px){body{font-size:17px}.nt-btn{left:-1.4rem;width:1.3rem}.ob-grid{grid-template-columns:1fr}}
#mnav{display:none;position:sticky;top:0;z-index:9;background:var(--red);color:#fff;font-family:var(--sans);gap:.5rem;padding:.4rem .8rem;overflow:auto}
#mnav a{color:#fff;text-decoration:none;padding:.3rem .6rem;border-radius:6px;white-space:nowrap;font-size:.85rem}#mnav a.active{background:rgba(255,255,255,.22)}

#app.onboard #side,#app.onboard #mnav{display:none}

.practice{border:2px solid var(--ink);border-radius:14px;padding:1.2rem 1.4rem 1.3rem;margin-bottom:1.6rem}
.practice.done{border-color:var(--ok)}.practice.done .ft-head .ex-tag{background:var(--ok)}
.pr-task{font-size:1.05em;margin:.2em 0 1em}
.takeaway{background:var(--paper-2);border-radius:10px;padding:.9rem 1.1rem;margin-bottom:1.2rem}
.ta-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.4rem}.ta-head b{font-family:var(--sans);letter-spacing:.12em;text-transform:uppercase;font-size:.78rem;color:var(--red)}
.ta-key{margin:0;padding-left:1.2em;font-size:.95em}.ta-key li{margin:.2em 0}
.ta-notes{margin:.5em 0 0;padding-left:1.2em;font-size:.95em;font-style:italic;color:var(--ink-soft)}.ta-notes:empty{display:none}.ta-notes li{margin:.2em 0}
.btn.sm{font-size:.72rem;padding:.35rem .7rem}
.debrief{border-top:1px dashed var(--rule);padding-top:.8rem}
.db-lbl{font-family:var(--sans);font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:.9rem;margin-bottom:.2rem}
.practice label{display:block;font-family:var(--sans);font-size:.88rem;color:var(--ink-soft);margin:.7rem 0 .2rem}
.practice textarea,.practice input[type=number],.practice select{display:block;width:100%;font:inherit;font-family:var(--serif);font-size:1rem;padding:.55rem .8rem;border:1px solid var(--rule);border-radius:8px;background:var(--paper-2);color:var(--ink);margin-top:.25rem}
.practice input[type=number]{max-width:140px}.practice textarea:focus,.practice select:focus,.practice input:focus{outline:none;border-color:var(--red)}
.multi{margin:.7rem 0 .2rem}.m-l{display:block;font-family:var(--sans);font-size:.88rem;color:var(--ink-soft);margin-bottom:.3rem}
.chk{display:inline-flex!important;align-items:center;gap:.35rem;margin:.2rem .6rem .2rem 0!important;font-family:var(--serif)!important;font-size:.95rem!important;color:var(--ink)!important;cursor:pointer}
.chk input{accent-color:var(--red)}
.unlock{margin:1.2rem 0 0;font-family:var(--sans);font-size:.9rem;letter-spacing:.03em}
.unlock ul{list-style:none;margin:.4rem 0 0;padding:0}.unlock li{padding:.25rem 0;color:var(--muted)}.unlock li.ok{color:var(--ok)}.unlock li:before{content:"○ ";}.unlock li.ok:before{content:"● "}
.unlock .u-t{font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft)}.unlock.open .u-t{color:var(--ok)}
.lesson-list a.locked{opacity:.45}.lesson-list a.locked .ll-num:after{content:" 🔒";font-size:.7em}

/* ---- схемы ---- */
.fig{margin:2.2rem 0;padding:1.2rem 1rem .8rem;border:1px solid var(--rule);border-radius:14px;background:var(--paper-2)}
.fig svg{width:100%;height:auto;display:block;color:var(--ink);font-family:var(--sans)}
.fig figcaption{font-family:var(--sans);font-size:.85rem;letter-spacing:.02em;color:var(--ink-soft);margin:.8rem .2rem 0;line-height:1.4}
.fig figcaption:before{content:"Схема · ";color:var(--red);font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:.75rem}
.fig .ln{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fig .thin{fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;opacity:.8}
.fig .acc{fill:none;stroke:var(--red);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.fig .accf{fill:var(--red);stroke:none}
.fig .dash{stroke-dasharray:5 5}
.fig .paper{fill:var(--paper)}.fig .paperf{fill:var(--paper)}
.fig .softf{fill:var(--red-soft)}
.fig .ink{fill:currentColor}
.fig .lbl{fill:currentColor}.fig .mut{fill:var(--muted)}.fig .inv{fill:#fff}.fig .accl{fill:var(--red)}
.fig .ln.paper,.fig .thin.paper{fill:var(--paper)}
.fig .acc.paper{fill:var(--paper)}

/* ---- упражнения: виджеты ---- */
.su-belief{margin-top:.8rem;background:var(--paper);border-left:3px solid var(--red);padding:.5rem .7rem;border-radius:0 8px 8px 0}
.sb-l{font-size:.65rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}.sb-txt{font-family:var(--serif);font-style:italic;font-size:.9rem;line-height:1.3;margin-top:.15rem}
.q-prog{font-family:var(--sans);font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:.3rem}
.q-t{font-size:1.05em;margin:0 0 .8em}.q-sub{font-family:var(--sans);font-size:.85rem;letter-spacing:.04em;color:var(--ink-soft);margin:.8em 0 .3em}
.q-opts{display:flex;flex-direction:column;gap:.45rem}.q-opts.row{flex-direction:row;flex-wrap:wrap}.q-opts.small .q-opt{font-size:.85rem;padding:.4rem .7rem}
.q-opt{font:inherit;font-size:.97rem;text-align:left;padding:.6rem .9rem;border:1.5px solid var(--rule);border-radius:9px;background:var(--paper-2);color:var(--ink);cursor:pointer;transition:.15s}
.q-opt:hover{border-color:var(--red)}.q-opt.ok{border-color:var(--ok);background:rgba(47,143,78,.12)}.q-opt.bad{border-color:var(--red);background:var(--red-soft)}.q-opt:disabled{cursor:default;opacity:.85}
.q-opt.seen{border-color:var(--ok)}.q-opt.warn{box-shadow:0 0 0 2px var(--red)}
.q-why{margin-top:.8rem}.q-why .good,.q-why .bad,.q-res{padding:.8rem 1rem;border-radius:9px;margin-bottom:.7rem;font-size:.97em}
.good,.q-res.good{background:rgba(47,143,78,.12);border-left:3px solid var(--ok)}.bad,.q-res.bad{background:var(--red-soft);border-left:3px solid var(--red)}.q-res{background:var(--paper-2);border-left:3px solid var(--red)}
.q-res p{margin:.4em 0 0}.q-res b{font-family:var(--sans);letter-spacing:.03em}
.s-card{font-size:1.1em;padding:1rem 1.2rem;border:2px solid var(--ink);border-radius:12px;margin-bottom:.8rem;background:var(--paper)}
.chk-list{display:flex;flex-direction:column;gap:.2rem}.chk.big{font-size:1rem!important;display:flex!important;padding:.3rem 0}
.banter{margin:0 0 .5em;padding-left:1.2em;font-size:.97em}.banter li{margin:.3em 0}
.own{display:block;width:100%;font:inherit;font-family:var(--serif);font-size:1rem;padding:.5rem .8rem;border:1px solid var(--rule);border-radius:8px;background:var(--paper-2);color:var(--ink);margin:.3rem 0}.own:focus{outline:none;border-color:var(--red)}
.pill{display:inline-block;background:var(--paper);border:1px solid var(--rule);border-radius:999px;padding:.15rem .6rem;font-size:.9em;margin:.15rem .2rem .15rem 0}
.wz{border:1.5px solid var(--rule);border-radius:10px;padding:.8rem 1rem;margin:.5rem 0;opacity:.55}.wz.cur{opacity:1;border-color:var(--red)}.wz.done{opacity:1;border-color:var(--ok)}
.wz-h{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--sans)}.wz-d{font-size:.75rem;color:var(--ok);letter-spacing:.06em}.wz-hint{font-size:.92em;color:var(--ink-soft);margin:.3em 0 .5em}
.wz textarea,.ex .ex-body textarea{display:block;width:100%;font:inherit;font-family:var(--serif);font-size:1rem;line-height:1.45;padding:.55rem .8rem;border:1px solid var(--rule);border-radius:8px;background:var(--paper-2);color:var(--ink);resize:vertical}
.ex .ex-body label{display:block;font-family:var(--sans);font-size:.88rem;color:var(--ink-soft);margin:.7rem 0 .2rem}
.fm-detail ul{margin:.6em 0;padding-left:1.2em;font-size:.95em}
.eyes-wrap{display:grid;grid-template-columns:220px 1fr;gap:1rem;align-items:center}.eyes{width:100%}.eyes .face{fill:var(--paper);stroke:var(--ink);stroke-width:2}.eyes .eye{fill:#fff;stroke:var(--ink);stroke-width:1.5}.eyes .pupil{fill:var(--ink);transition:.3s}.eyes .mouth{fill:none;stroke:var(--ink);stroke-width:1.5}
.eyes .dir{cursor:pointer}.eyes .dir circle{fill:var(--paper-2);stroke:var(--rule);stroke-width:1.5}.eyes .dir:hover circle{stroke:var(--red)}.eyes .dir.seen circle{fill:var(--red);stroke:var(--red)}.eyes .dir.seen text{fill:#fff}.eyes .dir text{font-size:14px;fill:var(--ink);pointer-events:none}
.eyes .tri{fill:none;stroke:var(--red);stroke-dasharray:4 4}.eyes .dot{fill:var(--red)}.eyes-txt{font-size:.97em}
.rw{margin-bottom:1rem}.rw details{margin-top:.3rem;font-size:.92em}.rw summary{cursor:pointer;color:var(--red);font-family:var(--sans);font-size:.85rem}
.story-txt{background:var(--paper-2);border-left:3px solid var(--red);padding:.9rem 1.1rem;border-radius:0 10px 10px 0;font-style:italic;margin-top:1rem}
.cnt{text-align:center;margin-bottom:1rem}.cnt-big{font-family:var(--sans);font-weight:700;font-size:3rem;color:var(--red);line-height:1}.cnt-big small{font-size:1.1rem;color:var(--muted);margin-left:.3rem}.cnt-sub{font-family:var(--sans);font-size:.85rem;color:var(--ink-soft);margin-top:.3rem}
.xbar{height:8px;background:var(--rule);border-radius:4px;overflow:hidden;margin:.5rem auto;max-width:320px}.xbar i{display:block;height:100%;background:var(--red)}
.cnt-log{list-style:none;padding:0;margin:.8rem 0 0;font-size:.92em}.cnt-log li{border-top:1px solid var(--rule);padding:.35rem 0}.cnt-log span{font-family:var(--sans);color:var(--muted);font-size:.8rem;margin-right:.5rem}
.db-post{margin:.6rem 0}.db-post summary{cursor:pointer;font-family:var(--sans);font-size:.88rem;color:var(--red)}
.radar-wrap{display:grid;grid-template-columns:300px 1fr;gap:1rem;align-items:center}.radar{width:100%}.radar .rg{fill:none;stroke:var(--rule)}.radar .rc{fill:rgba(28,26,25,.12);stroke:var(--ink);stroke-width:1.5}.radar .rs{fill:rgba(179,18,27,.2);stroke:var(--red);stroke-width:2}
.radar-leg{font-family:var(--sans);font-size:.85rem}.radar-leg span{display:block;padding-left:1.2rem;position:relative;margin:.3rem 0}.radar-leg span:before{content:"";position:absolute;left:0;top:.3em;width:.8em;height:.8em;border-radius:2px}.radar-leg .ls:before{background:var(--red)}.radar-leg .lc:before{background:var(--ink)}
.radar-list{margin-top:1rem}.rl{display:grid!important;grid-template-columns:1fr 120px 1.5em 1.5em;gap:.6rem;align-items:center;font-family:var(--serif)!important;font-size:.9rem!important;color:var(--ink)!important;margin:.15rem 0!important;padding:.2rem 0;border-bottom:1px solid var(--rule)}.rl input{accent-color:var(--red)}.rl b{font-family:var(--sans);color:var(--red);text-align:center}.rl i{font-family:var(--sans);font-style:normal;color:var(--muted);text-align:center}
@media (max-width:640px){.eyes-wrap,.radar-wrap{grid-template-columns:1fr}.rl{grid-template-columns:1fr 90px 1.2em 1.2em}}

/* ---- мини-игры ---- */
.tr-map svg{width:100%;max-width:360px;display:block;margin:0 auto .6rem}.tr-path{fill:none;stroke:var(--red);stroke-width:2;stroke-dasharray:6 5}.tr-you{fill:var(--ink)}.tr-map text{fill:var(--red);font-family:var(--sans)}.tr-map .mut{fill:var(--muted)}
.tr-steps{margin:.5rem 0}.tr-step{padding:.4rem .8rem;border-left:3px solid var(--red);background:var(--paper-2);margin:.3rem 0;border-radius:0 8px 8px 0;font-style:italic}
.bf{width:100%;background:var(--paper-2);border-radius:12px;touch-action:none;user-select:none;display:block}.bf-ground{stroke:var(--ink);stroke-width:2}
.bf-her circle,.bf-her path{fill:var(--paper);stroke:var(--ink);stroke-width:2}.bf-fly path{fill:none;stroke:var(--red);stroke-width:2}
.bf-o{cursor:pointer}.bf-o.rock path{fill:var(--paper);stroke:var(--ink);stroke-width:2}.bf-o.hole path{fill:var(--ink)}.bf-o:hover path{stroke:var(--red);fill:var(--red-soft)}
.bf-hud{font-family:var(--sans);font-size:14px;fill:var(--ink-soft)}.bf-msg{margin:.6rem 0;font-size:.95em;min-height:1.4em}.bf-msg .good,.bf-msg .bad{padding:.6rem .9rem;border-radius:8px}
.ts-stage{border-radius:14px;min-height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem;text-align:center;padding:1rem;background:var(--paper-2);position:relative;user-select:none}
.ts-stage.wait{background:var(--ink);color:var(--paper);cursor:wait}.ts-stage.go{background:var(--paper);border:2px solid var(--red)}.ts-stage.miss{background:var(--red);color:#fff}.ts-stage.ok{background:rgba(47,143,78,.15);border:2px solid var(--ok)}
.ts-hud{position:absolute;top:.6rem;left:.9rem;font-family:var(--sans);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.ts-txt{font-family:var(--sans);font-size:1.3rem;line-height:1.25;max-width:26ch}.ts-sub{font-family:var(--sans);font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;opacity:.8}
.ts-sil{width:70px}.ts-sil circle,.ts-sil path{fill:var(--ink)}
.ts-bar{width:220px;height:8px;background:var(--rule);border-radius:4px;overflow:hidden}.ts-bar i{display:block;height:100%;background:var(--red);transform-origin:left;transform:scaleX(1)}
.ts-btn{font-size:1.1rem;padding:.9rem 2rem}

/* ---- Ева ---- */
.sc-log{margin-bottom:.6rem}.sc-nar{color:var(--ink-soft);font-style:italic;margin:.6rem 0 .3rem;font-size:.97em}
.sc-hint{font-family:var(--sans);font-size:.78rem;letter-spacing:.06em;color:var(--red);margin:.2rem 0 .4rem}
.sc-eva{background:var(--paper-2);border-radius:14px 14px 14px 4px;padding:.6rem .9rem;margin:.3rem 0;max-width:85%}.sc-eva b{color:var(--red);font-family:var(--sans);font-weight:700;letter-spacing:.04em}
.sc-you{background:var(--red);color:#fff;border-radius:14px 14px 4px 14px;padding:.6rem .9rem;margin:.3rem 0 .3rem auto;max-width:85%;width:fit-content}
.sc-why{font-size:.88em;color:var(--ink-soft);margin:.1rem 0 .6rem;padding-left:.8rem;border-left:2px solid var(--rule)}.sc-why.g{border-color:var(--ok)}.sc-why.b{border-color:var(--red)}
.sc-cur{border-top:1px dashed var(--rule);padding-top:.6rem}
.fin-score{font-family:var(--sans);font-size:2.2rem;color:var(--red);margin:.2rem 0 .6rem}.fin-score b{font-size:3rem}
.fin-tab{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:.95rem;margin-bottom:1rem}.fin-tab td{padding:.35rem .4rem;border-bottom:1px solid var(--rule)}.fin-tab td:last-child{text-align:right;font-weight:700}.fin-tab .g{color:var(--ok)}.fin-tab .b{color:var(--red)}
.fin-flags{padding-left:1.2em;font-size:.95em}.fin-flags i{color:var(--muted);font-style:normal;font-family:var(--sans);font-size:.85em}

/* ---- кабинет ---- */
#top{position:sticky;top:0;z-index:15;display:flex;align-items:center;gap:1rem;background:var(--red);color:#fff;padding:.5rem 1rem;font-family:var(--sans);box-shadow:0 2px 10px rgba(0,0,0,.25)}
.tb-brand{color:#fff;text-decoration:none;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.9rem;white-space:nowrap}
.tb-mid{flex:1;text-align:center;font-size:.85rem;letter-spacing:.06em;opacity:.9;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tb-user{color:#fff;text-decoration:none;display:flex;align-items:center;gap:.5rem;font-size:.9rem}
.tb-lvl{background:#fff;color:var(--red-dark);font-weight:700;width:1.7rem;height:1.7rem;border-radius:50%;display:grid;place-items:center;font-size:.95rem}
#view{min-height:100vh}
.center{max-width:720px;margin:0 auto;padding:2rem 1.2rem 5rem}
/* login */
.login-card{background:rgba(0,0,0,.28);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.25);border-radius:14px;padding:1.6rem 1.8rem;max-width:460px;margin:2.5rem auto 0;text-align:left;color:#fff}
.cover .login-card p{font-family:var(--serif);text-transform:none;letter-spacing:0;font-size:1.05rem;line-height:1.5;margin:0 0 1rem;opacity:1}
.cover .login-card .hint{font-size:.88rem;opacity:.75;margin-top:.6rem}
.cover .login-card .err{font-size:.9rem;color:#ffd0d0;margin-top:.5rem}
.login-card input{width:100%;font:inherit;font-family:var(--serif);font-size:1.3rem;padding:.6rem .8rem;border-radius:8px;border:2px solid rgba(255,255,255,.5);background:rgba(255,255,255,.12);color:#fff;outline:none;margin-bottom:.8rem;letter-spacing:.02em}
.login-card input:focus{border-color:#fff;background:rgba(255,255,255,.2)}.login-card input::placeholder{color:rgba(255,255,255,.55)}
.login-card input.code{font-family:var(--sans);font-size:2rem;letter-spacing:.5em;text-align:center}
.login-card .row{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.btn.link{background:transparent;color:#fff;opacity:.8;text-transform:none;letter-spacing:0;font-weight:500;padding:.5rem .3rem}.btn.link:hover{opacity:1}
/* menu */
.menu{max-width:980px;margin:0 auto;padding:1.5rem 1.2rem 6rem}
.mh{display:grid;grid-template-columns:1fr auto;gap:1.5rem;align-items:center;margin-bottom:1.5rem}
.mh h1{font-family:var(--sans);text-transform:uppercase;color:var(--red);font-size:clamp(1.6rem,4vw,2.4rem);margin:0;line-height:1.05}
.mh .sub{color:var(--ink-soft);margin:.3rem 0 0}
.mstat{display:flex;gap:1.2rem;align-items:center;font-family:var(--sans)}
.mstat .lvl-ring{width:64px;height:64px}.mstat .lvl-ring svg{width:64px;height:64px}.mstat .lvl-num{font-size:1.7rem}
.mstat .st{font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);line-height:1.3}.mstat .st b{display:block;color:var(--ink);font-size:1rem;letter-spacing:.02em}
.belief-chip{border-left:3px solid var(--red);background:var(--paper-2);padding:.5rem .8rem;border-radius:0 8px 8px 0;font-style:italic;color:var(--ink-soft);margin:0 0 1.2rem;font-size:.95rem}
.cta{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:var(--red);color:#fff;border-radius:14px;padding:1.1rem 1.4rem;text-decoration:none;margin-bottom:1.8rem;box-shadow:0 8px 24px rgba(120,10,15,.25);transition:.15s}
.cta:hover{background:var(--red-dark)}.cta .c-l{font-family:var(--sans);letter-spacing:.14em;text-transform:uppercase;font-size:.75rem;opacity:.85}.cta .c-t{font-family:var(--sans);font-weight:700;font-size:1.25rem;line-height:1.1;margin-top:.15rem}.cta .c-s{font-size:.9rem;opacity:.9;margin-top:.2rem}.cta .c-a{font-family:var(--sans);font-size:1.8rem}
.lgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:.9rem}
.lcard{display:block;text-decoration:none;color:var(--ink);background:var(--paper-2);border:1.5px solid var(--rule);border-radius:12px;padding:1rem 1.1rem;position:relative;transition:.15s}
.lcard:hover{border-color:var(--red)}.lcard.cur{border-color:var(--red);box-shadow:0 0 0 2px var(--red-soft)}.lcard.done{border-color:var(--ok)}.lcard.locked{opacity:.55}.lcard.paid-locked{opacity:.8}
.lc-top{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--sans)}.lc-num{font-weight:700;color:var(--red);font-size:1.4rem}.lcard.done .lc-num{color:var(--ok)}.lc-st{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.lc-t{font-family:var(--sans);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:1.05rem;margin:.2rem 0 .1rem;line-height:1.1}.lc-g{font-size:.9rem;color:var(--ink-soft);margin:0 0 .6rem}
.lc-seg{display:flex;gap:4px}.lc-seg i{flex:1;height:6px;border-radius:3px;background:var(--rule);position:relative;overflow:hidden}.lc-seg i b{position:absolute;inset:0;background:var(--red);transform-origin:left;transform:scaleX(var(--p,0))}.lc-seg i.ok b{background:var(--ok)}
.lc-seg-l{display:flex;gap:4px;font-family:var(--sans);font-size:.6rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:.25rem}.lc-seg-l span{flex:1}
.mfoot{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:2rem}
/* lesson chrome */
.lbar{position:sticky;top:0;z-index:15;display:flex;align-items:center;gap:1rem;background:var(--paper);border-bottom:1px solid var(--rule);padding:.5rem 1rem;font-family:var(--sans);font-size:.85rem}
.lbar a{color:var(--red);text-decoration:none;font-weight:700;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}.lbar .lb-t{flex:1;color:var(--ink-soft);letter-spacing:.06em;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lbar .lb-p{height:4px;background:var(--rule);border-radius:2px;width:120px;overflow:hidden}.lbar .lb-p i{display:block;height:100%;background:var(--red)}
.lesson{display:block}
/* pay */
.pay{max-width:760px;margin:0 auto;padding:2rem 1.2rem 5rem}
.pay h1{font-family:var(--sans);text-transform:uppercase;color:var(--red);font-size:2rem;margin:0 0 .3rem}
.pay .price{font-family:var(--sans);font-weight:700;font-size:2.6rem;color:var(--red);margin:.6rem 0}
.pay ul{padding-left:1.2em}.pay li{margin:.35em 0}
.pay .lock-list{list-style:none;padding:0;margin:1rem 0}.pay .lock-list li{padding:.5rem .8rem;border:1px solid var(--rule);border-radius:8px;margin:.3rem 0;display:flex;gap:.7rem;align-items:baseline}.pay .lock-list b{font-family:var(--sans);color:var(--red)}
.pay .code-row{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;margin-top:1rem}.pay .code-row input{font:inherit;font-family:var(--sans);font-size:1.1rem;letter-spacing:.1em;padding:.5rem .8rem;border:1px solid var(--rule);border-radius:8px;background:var(--paper-2);color:var(--ink);text-transform:uppercase;width:180px}
/* settings/admin */
.set{max-width:720px;margin:0 auto;padding:2rem 1.2rem 5rem}.set h1,.adm h1{font-family:var(--sans);text-transform:uppercase;color:var(--red);font-size:2rem;margin:0 0 1rem}
.set h2,.adm h2{font-family:var(--sans);text-transform:uppercase;letter-spacing:.06em;font-size:1rem;margin:1.6rem 0 .5rem}
.set input[type=text]{font:inherit;font-family:var(--serif);font-size:1rem;padding:.5rem .8rem;border:1px solid var(--rule);border-radius:8px;background:var(--paper-2);color:var(--ink);width:280px;max-width:100%}
.adm{max-width:1100px;margin:0 auto;padding:2rem 1.2rem 5rem}
.adm table{width:100%;border-collapse:collapse;font-size:.9rem;font-family:var(--sans)}.adm th,.adm td{text-align:left;padding:.45rem .5rem;border-bottom:1px solid var(--rule)}.adm th{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.adm .tools{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center;margin:.6rem 0}.adm input{font:inherit;font-family:var(--sans);font-size:.95rem;padding:.45rem .7rem;border:1px solid var(--rule);border-radius:8px;background:var(--paper-2);color:var(--ink)}
.funnel{display:grid;grid-template-columns:repeat(10,1fr);gap:.4rem;align-items:end;height:160px;margin:.5rem 0 1.5rem}.funnel div{background:var(--red-soft);border-radius:6px 6px 0 0;position:relative;display:flex;flex-direction:column;justify-content:flex-end}.funnel div b{display:block;background:var(--red);border-radius:6px 6px 0 0;min-height:2px}.funnel div span{position:absolute;bottom:-1.4rem;left:0;right:0;text-align:center;font-family:var(--sans);font-size:.75rem;color:var(--muted)}
.codes{font-family:ui-monospace,Menlo,monospace;font-size:.9rem;white-space:pre;background:var(--paper-2);padding:.8rem 1rem;border-radius:8px;max-height:260px;overflow:auto}
.pill-ok{color:var(--ok);font-weight:700}.pill-no{color:var(--muted)}
@media (max-width:640px){.mh{grid-template-columns:1fr}.cta{position:sticky;bottom:12px;z-index:5}.lbar .lb-p{display:none}}

/* Keep expired-session save notices inside the login flow, away from the course header. */
.cover .inner .login-sync-note{max-width:460px;margin:1.5rem auto 0;font:400 .9rem/1.5 var(--sans);text-transform:none;letter-spacing:normal;color:var(--ink-soft);opacity:1}

/* Product theme. Concatenated after the legacy lesson and app styles. */
:root {
  color-scheme: dark;
  --paper: var(--mv-bg);
  --paper-2: var(--mv-surface);
  --ink: var(--mv-text);
  --ink-soft: var(--mv-text-secondary);
  --muted: var(--mv-text-muted);
  --rule: var(--mv-border);
  --red: var(--mv-accent);
  --red-dark: var(--mv-accent-hover);
  --red-soft: var(--mv-accent-tint);
  --ok: var(--mv-success);
  --serif: var(--mv-body);
  --sans: var(--mv-body);
  --course-header: 77px;
}
html { scroll-padding-top: calc(var(--course-header) + 64px); }
body { font: 16px/1.65 var(--mv-body); background: var(--mv-bg); color: var(--mv-text); }
[hidden], #top[hidden] { display: none !important; }
button, input, select, textarea { font-family: var(--mv-body); }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: var(--mv-accent); text-underline-offset: 4px; }
button, a, input, textarea, select { transition: background var(--mv-motion), border-color var(--mv-motion), color var(--mv-motion); }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible, summary:focus-visible {
  outline: 2px solid var(--mv-focus); outline-offset: 4px;
}
::selection { background: var(--mv-accent-tint); color: var(--mv-text); }
input, textarea, select { accent-color: var(--mv-accent); }
p { hyphens: none; overflow-wrap: break-word; }
h1, h2, h3 { text-wrap: balance; }
.menu, .jr, .set, .pay, .dash, .center, .adm { padding-top: 48px; padding-bottom: 96px; }
.menu { max-width: 1120px; padding-inline: 40px; }
.wrap { max-width: 820px; padding: 48px 40px 96px; }
.jr, .set, .pay, .center { max-width: 820px; padding-inline: 40px; }
.menu h1, .jr h1, .set h1, .pay h1, .dash h1, .adm h1 {
  font: 600 clamp(36px, 4.5vw, 52px)/1.08 var(--mv-display); letter-spacing: -.015em;
  color: var(--mv-text); margin: 0 0 18px; text-transform: none;
}
.set h2, .pay h2, .adm h2, .dash h2 { font: 500 25px/1.2 var(--mv-display); text-transform: none; letter-spacing: 0; margin: 32px 0 14px; }
.empty { font-style: normal; color: var(--mv-text-secondary); }

/* Shared product header, with all destinations still available on a phone. */
#top {
  min-height: var(--course-header); padding: 16px max(24px, calc((100vw - 1200px) / 2)); gap: 28px;
  background: var(--mv-bg); color: var(--mv-text); border-bottom: 1px solid var(--mv-border); box-shadow: none;
}
.tb-brand { display: flex; align-items: center; gap: 11px; max-width: 225px; color: var(--mv-text); font: 600 18px/1.07 var(--mv-display); letter-spacing: .015em; white-space: normal; }
.tb-mark { display: block; flex: none; width: 8px; height: 30px; transform: skewY(-16deg); background: var(--mv-accent); }
.tb-nav { flex: 1; display: flex; justify-content: center; align-items: center; gap: 28px; }
.tb-nav a { display: inline-flex; align-items: center; min-height: 44px; color: var(--mv-text-secondary); text-decoration: none; font-size: 13px; }
.tb-nav a:hover, .tb-nav a[aria-current="page"] { color: var(--mv-text); }
.tb-nav a[aria-current="page"] { box-shadow: inset 0 -2px var(--mv-accent); }
.tb-user { color: var(--mv-text-secondary); gap: 10px; font-size: 13px; min-width: 0; }
.tb-name { max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tb-lvl { width: 34px; height: 34px; flex: none; background: var(--mv-surface-raised); color: var(--mv-text); font: 500 21px var(--mv-display); }

/* Every principal action uses the same high-contrast button. */
.btn, .btn.sm, .btn.light, #bm-ribbon button {
  display: inline-flex; justify-content: center; align-items: center; gap: 10px; min-height: var(--mv-control-height);
  padding: 12px 20px; border: 1px solid transparent; border-radius: var(--mv-radius-control);
  font: 600 14px/1.4 var(--mv-body); letter-spacing: 0; text-transform: none; text-decoration: none;
}
.btn.primary, .btn.light, #bm-ribbon .go { background: var(--mv-accent); color: var(--mv-on-accent); }
.btn.primary:hover, .btn.light:hover, #bm-ribbon .go:hover { background: var(--mv-accent-hover); }
.btn.ghost, .btn.link { background: transparent; color: var(--mv-text); border: 1px solid var(--mv-border); opacity: 1; }
.btn.ghost:hover, .btn.link:hover { background: var(--mv-surface-raised); border-color: var(--mv-text-muted); color: var(--mv-text); }
.btn:disabled, .btn.primary:disabled, .btn.ghost:disabled, .btn.light:disabled {
  background: var(--mv-surface-raised); color: var(--mv-text-muted); border-color: var(--mv-border); cursor: not-allowed; opacity: 1;
}
.btn.sm { padding-inline: 14px; font-size: 13px; }

/* Login: the cover belongs to the same product; fields have an opaque surface. */
.cover {
  min-height: 100svh; padding: 72px 40px 80px; text-align: left; background: var(--mv-bg);
  background-image: linear-gradient(90deg, #101114 4%, #101114e8 36%, #10111438 100%), linear-gradient(0deg, #101114 0%, #10111400 75%), url('/assets/hero-editorial-v1.png?v=5418249e55');
  background-size: cover; background-position: center, center, 72% center;
}
.cover::before { display: none; }
.cover .inner { max-width: 1120px; }
.cover h1 { max-width: 10ch; margin: 0; color: var(--mv-text); font: 600 clamp(48px, 6vw, 78px)/1.025 var(--mv-display); letter-spacing: -.025em; text-shadow: none; }
.cover > .inner > p { max-width: 430px; margin: 24px 0 0; font: 400 16px/1.65 var(--mv-body); text-transform: none; letter-spacing: 0; color: var(--mv-text-secondary); opacity: 1; }
.cover > .inner > p.meta { margin-top: 14px; font-size: 12px; }
.login-card { max-width: 460px; margin: 32px 0 0; padding: 28px; background: var(--mv-surface); border: 1px solid var(--mv-border); border-radius: var(--mv-radius-surface); color: var(--mv-text); backdrop-filter: none; }
.cover .login-card p { max-width: none; color: var(--mv-text); font: 400 16px/1.65 var(--mv-body); }
.cover .login-card .hint { color: var(--mv-text-secondary); font-size: 13px; opacity: 1; margin: 16px 0 0; }
.cover .login-card .err { font-size: 14px; line-height: 1.5; color: var(--mv-error); margin-top: 12px; }
.login-card input, #ob-name { font: 400 16px/1.5 var(--mv-body); min-height: 52px; background: var(--mv-bg); color: var(--mv-text); border: 1px solid var(--mv-border); border-radius: var(--mv-radius-control); padding: 12px 14px; letter-spacing: 0; margin-bottom: 16px; }
.login-card input:focus, #ob-name:focus { background: var(--mv-bg); border-color: var(--mv-accent); }
.login-card input::placeholder, #ob-name::placeholder { color: var(--mv-text-muted); }
.login-card input.code { font-family: var(--mv-body); font-size: 28px; letter-spacing: .3em; }
.login-card .row { gap: 12px; }
.login-card .btn { flex: 1; }

/* Dashboard: a quiet card with one explicit continuation action. */
.mh { grid-template-columns: 1fr; gap: 24px; margin-bottom: 28px; }
.mh h1 { margin-bottom: 14px; }
.mh .sub { max-width: 540px; font-size: 14px; line-height: 1.6; }
.mstat { gap: 20px; padding-bottom: 24px; border-bottom: 1px solid var(--mv-border); }
.mstat .lvl-ring, .mstat .lvl-ring svg { width: 60px; height: 60px; }
.mstat .lvl-num { font: 600 32px var(--mv-display); color: var(--mv-text); }
.mstat .st { font-size: 11px; line-height: 1.5; letter-spacing: 0; text-transform: none; color: var(--mv-text-muted); }
.mstat .st b { font-weight: 500; font-size: 14px; margin-bottom: 3px; }
.mstat .st:nth-last-child(-n+2) { padding-left: 24px; border-left: 1px solid var(--mv-border); }
.cta { position: static; padding: 28px; background: var(--mv-surface); border: 1px solid var(--mv-border); border-radius: var(--mv-radius-surface); box-shadow: none; color: var(--mv-text); gap: 32px; margin: 0 0 32px; }
.cta:hover { background: var(--mv-surface); border-color: var(--mv-text-muted); }
.cta .c-l { color: var(--mv-accent); font: 600 11px/1.4 var(--mv-body); letter-spacing: .15em; opacity: 1; }
.cta .c-t { font: 600 32px/1.15 var(--mv-display); margin-top: 10px; }
.cta .c-s { max-width: 530px; font-size: 14px; line-height: 1.65; color: var(--mv-text-secondary); opacity: 1; margin-top: 12px; }
.cta .c-a { flex: none; font: 600 14px/1.4 var(--mv-body); color: var(--mv-on-accent); background: var(--mv-accent); min-height: 48px; padding: 14px 22px; border-radius: var(--mv-radius-control); display: inline-flex; align-items: center; justify-content: center; gap: 22px; }
.cta:hover .c-a { background: var(--mv-accent-hover); }
.lgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.lcard { display: flex; flex-direction: column; min-width: 0; padding: 24px; background: var(--mv-surface); border-width: 1px; border-radius: var(--mv-radius-surface); }
.lcard.cur { box-shadow: none; border-color: var(--mv-accent); }
.lcard.done { border-color: var(--mv-border); }
.lcard.locked, .lcard.paid-locked { opacity: 1; }
.lcard.locked .lc-t { color: var(--mv-text-secondary); }
.lc-top { margin-bottom: 14px; gap: 16px; }
.lc-num { font: 500 27px/1 var(--mv-display); color: var(--mv-text-muted); }
.lcard.cur .lc-num, .lcard.cur .lc-st { color: var(--mv-accent); }
.lcard.done .lc-num, .lcard.done .lc-st { color: var(--mv-success); }
.lc-st { font: 400 11px/1.5 var(--mv-body); letter-spacing: 0; text-transform: none; }
.lc-t { font: 500 25px/1.15 var(--mv-display); text-transform: none; letter-spacing: 0; margin: 0 0 10px; }
.lc-g { font-size: 13px; line-height: 1.65; margin-bottom: 22px; }
.lc-seg { margin-top: auto; }
.lc-seg i { height: 4px; }
.lc-seg-l { margin-top: 6px; font-size: 10px; line-height: 1.4; letter-spacing: 0; text-transform: none; }
.mfoot { margin-top: 32px; gap: 12px; }

/* Long-form reading has a flat background and the approved straight inset. */
.lbar { top: var(--course-header); min-height: 58px; padding: 12px max(24px, calc((100vw - 1120px) / 2)); gap: 20px; background: var(--mv-bg); z-index: 14; font-size: 12px; }
.lbar a { color: var(--mv-text); font-size: 12px; text-transform: none; letter-spacing: 0; }
.lbar .lb-t { text-transform: none; letter-spacing: 0; }
.lbar .lb-p { flex: none; }
.lesson { font-size: var(--mv-reading-size); line-height: var(--mv-reading-leading); }
.lesson-head { border-bottom: 0; padding-bottom: 0; margin-bottom: 36px; }
.lh-top { font: 500 11px/1.5 var(--mv-body); letter-spacing: .13em; }
.lesson-head h1 { font: 600 clamp(40px, 5vw, 60px)/1.07 var(--mv-display); letter-spacing: -.015em; color: var(--mv-text); margin: 14px 0 28px; }
.lh-obj { background: none; border: 0; border-left: 2px solid var(--mv-accent); border-radius: 0; padding: 2px 0 2px 20px; font-size: 16px; line-height: 1.7; color: var(--mv-text-secondary); }
.lh-greet { font-style: normal; margin-bottom: 12px; }
.lh-lbl { font: 500 11px/1.5 var(--mv-body); letter-spacing: .1em; margin-bottom: 8px; }
.lesson-body > .blk:first-of-type > p::first-letter { font: inherit; color: inherit; float: none; margin: 0; }
.lesson-body p { margin-bottom: 1.25em; }
.pull { background: none; border-top: 1px solid var(--mv-border); border-bottom: 1px solid var(--mv-border); border-radius: 0; box-shadow: none; color: var(--mv-text); padding: 24px 0; font: 500 28px/1.35 var(--mv-display); }
.pull::after { display: none; }
.box, .dialog, .list, .keycard { background: var(--mv-surface); color: var(--mv-text); border: 1px solid var(--mv-border); border-radius: var(--mv-radius-surface); box-shadow: none; padding: 24px; font: inherit; }
.box strong { color: var(--mv-text); }
/* Existing lesson callouts: accent the takeaway and boxed heading only. */
.lesson-body .callout.pull,
.lesson-body .callout.box > p:first-child > strong:first-child { color: var(--mv-accent); }
.dialog { line-height: 1.7; }
.keycard { font-size: 17px; }
.kc-lbl { font: 600 11px/1.4 var(--mv-body); letter-spacing: .13em; color: var(--mv-accent); opacity: 1; margin-bottom: 12px; }
.lesson-nav { gap: 16px; align-items: stretch; }
.lesson-nav .btn { flex: 1; }

/* Exercises and scene replies share the same controls and feedback surfaces. */
.ex, .practice, .fieldtask { padding: 28px; margin-block: 36px; border: 1px solid var(--mv-border); border-radius: var(--mv-radius-surface); background: var(--mv-surface); box-shadow: none; font-size: 16px; line-height: 1.65; }
.ex.done, .practice.done, .fieldtask.done { border-color: var(--mv-success); }
.ex-head, .ft-head { gap: 12px; margin-bottom: 18px; }
.ex h3, .ft-head h3, .ex.done h3 { font: 500 27px/1.15 var(--mv-display); color: var(--mv-text); text-transform: none; letter-spacing: 0; }
.ex-tag, .ex.done .ex-tag, .ft-head .ex-tag { background: var(--mv-accent-tint); color: var(--mv-accent); padding: 5px 8px; font: 600 10px/1.4 var(--mv-body); letter-spacing: .1em; }
.ex.done .ex-tag, .practice.done .ft-head .ex-tag, .fieldtask.done .ft-head .ex-tag { background: var(--mv-success-tint); color: var(--mv-success); }
.ex-stage { letter-spacing: 0; font-size: 11px; padding: 4px 9px; }
.ex-desc { font-size: 14px; line-height: 1.65; margin-bottom: 22px; }
.ex label, .ex .ex-body label, .practice label, .fieldtask label { font-size: 13px; line-height: 1.6; letter-spacing: 0; margin-top: 16px; }
.ex textarea, .ex .ex-body textarea, .practice textarea, .fieldtask textarea, .practice select, .practice input[type=number], .own, .set input[type=text], .pay .code-row input, .adm input {
  background: var(--mv-bg); border: 1px solid var(--mv-border); border-radius: var(--mv-radius-control); color: var(--mv-text); padding: 12px 14px; min-height: 48px; font: 400 16px/1.6 var(--mv-body);
}
textarea { min-height: 104px; }
input::placeholder, textarea::placeholder { color: var(--mv-text-muted); opacity: 1; }
.ex textarea:focus-visible, .ex .ex-body textarea:focus-visible, .practice textarea:focus-visible, .fieldtask textarea:focus-visible, .practice select:focus-visible, .practice input:focus-visible, .own:focus-visible, .note textarea:focus-visible {
  outline: 2px solid var(--mv-focus); outline-offset: 4px; border-color: var(--mv-accent);
}
.ex-row, .ex .ex-row { gap: 16px; margin-top: 24px; flex-wrap: wrap; }
.ex-status, .ex-note { font-size: 13px; letter-spacing: 0; font-style: normal; }
.q-t { font-size: 17px; margin-bottom: 20px; }
.q-prog, .q-sub { font-size: 11px; letter-spacing: .07em; margin-bottom: 12px; }
.q-opts { gap: 10px; }
.q-opt, .q-opts.small .q-opt { min-height: 48px; padding: 14px 16px; border-width: 1px; border-radius: var(--mv-radius-control); font: 400 15px/1.6 var(--mv-body); background: var(--mv-surface); }
.q-opt:hover { background: var(--mv-surface-raised); border-color: var(--mv-text-muted); }
.q-opt.ok { background: var(--mv-success-tint); border-color: var(--mv-success); }
.q-opt.bad { background: var(--mv-error-tint); border-color: var(--mv-error); }
.q-opt:disabled { cursor: default; opacity: 1; }
.q-opt:disabled:not(.ok):not(.bad) { color: var(--mv-text-secondary); }
.q-opt.warn { box-shadow: none; border-color: var(--mv-accent); }
.q-why { margin-top: 22px; }
.q-why .good, .q-why .bad, .q-res { padding: 18px; line-height: 1.7; font-size: 15px; }
.q-res b { letter-spacing: 0; }
.s-card { background: var(--mv-surface-raised); border: 1px solid var(--mv-border); padding: 20px; font-size: 17px; }
.wz { padding: 20px; border-width: 1px; opacity: 1; }
.wz:not(.cur):not(.done) { color: var(--mv-text-secondary); }
.wz-h { flex-wrap: wrap; gap: 8px; }
.wz-hint { font-size: 14px; }
.takeaway { border: 1px solid var(--mv-border); background: var(--mv-bg); padding: 20px; }
.ta-head { align-items: flex-start; flex-wrap: wrap; }
.ta-head b { font-size: 11px; letter-spacing: .1em; }
.debrief { margin-top: 24px; border-top-style: solid; padding-top: 20px; }
.db-lbl { font-size: 14px; letter-spacing: 0; }
.chk { min-height: 44px; padding: 6px 0; }
.chk input { width: 18px; height: 18px; }
.unlock { margin-top: 24px; font-size: 13px; letter-spacing: 0; }
.unlock .u-t { text-transform: none; letter-spacing: 0; }
.cnt-big, .fin-score { font-family: var(--mv-display); }
.ts-stage.wait { background: var(--mv-surface-raised); color: var(--mv-text); }
.ts-stage.miss { background: var(--mv-error-tint); color: var(--mv-error); }
.ts-stage.ok { background: var(--mv-success-tint); color: var(--mv-text); }
.sc-eva { max-width: 90%; background: var(--mv-surface-raised); padding: 18px 20px; border-radius: 12px 12px 12px 2px; }
.sc-eva b { font-size: 12px; }
.sc-you { max-width: 90%; background: var(--mv-accent-tint); border: 1px solid var(--mv-border); color: var(--mv-text); border-radius: 12px 12px 2px 12px; padding: 16px 18px; margin-top: 12px; }
.sc-hint { font-size: 12px; letter-spacing: 0; }
.sc-nar { font-size: 14px; margin: 20px 0 12px; }
.sc-why { border-left: 2px solid var(--mv-border); border-radius: 0; padding: 2px 0 2px 16px; margin: 16px 0 24px; font-size: 14px; }
.sc-why.g { border-color: var(--mv-success); }
.sc-why.b { border-color: var(--mv-error); }
.sc-why.g { color: var(--mv-success); }
.sc-why.b { color: var(--mv-error); }
.sc-cur { border-top-style: solid; padding-top: 20px; }
.fin-tab { font-size: 14px; }
.fin-tab td { padding: 12px 8px; }

/* Rounded cards have an even frame; straight text insets retain their line. */
.belief-chip, .goals-view, .note, .su-belief, .story-txt, .tr-step, .q-res, .good, .bad, .q-res.good, .q-res.bad {
  border: 1px solid var(--mv-border); border-radius: var(--mv-radius-surface); box-shadow: none;
}
.belief-chip, .goals-view, .note, .su-belief, .story-txt, .tr-step { padding: 16px 20px; background: var(--mv-surface); }
.good, .q-res.good { background: var(--mv-success-tint); color: var(--mv-text); }
.bad, .q-res.bad { background: var(--mv-error-tint); color: var(--mv-text); }
.q-why .good b, .q-res.good b { color: var(--mv-success); }
.q-why .bad b, .q-res.bad b { color: var(--mv-error); }
.blk.bookmarked { background: var(--mv-accent-tint); box-shadow: 0 0 0 1px var(--mv-border); border-radius: var(--mv-radius-control); }
.blk.bookmarked::after { display: none; }
.nt-btn:focus-visible, .blk:focus-within .nt-btn { opacity: 1; }
.note textarea { font: 400 16px/1.65 var(--mv-body); }

/* Diagrams retain their existing geometry and all 25 radar dimensions. */
.fig { background: var(--mv-surface); border-radius: var(--mv-radius-surface); padding: 24px 18px 16px; }
.fig .inv { fill: var(--mv-on-accent); }
.fig figcaption { font-size: 12px; line-height: 1.65; letter-spacing: 0; }
.fig figcaption::before { font-size: 10px; }
.eyes .eye { fill: var(--mv-surface-raised); }
.eyes .dir.seen text { fill: var(--mv-on-accent); }
.radar-wrap { grid-template-columns: minmax(0, 320px) minmax(0, 1fr); gap: 24px; }
.radar .rs { fill: #f5f1ea0b; stroke: var(--mv-text); stroke-width: 1.8; stroke-dasharray: 5 4; }
.radar .rc { fill: #ff2d5526; stroke: var(--mv-accent); stroke-width: 2; }
.radar-leg { font-size: 13px; color: var(--mv-text-secondary); line-height: 1.65; }
.radar-leg span { padding-left: 28px; margin: 12px 0; }
.radar-leg span::before { width: 18px; height: 0; top: .75em; border-radius: 0; background: none; }
.radar-leg .ls::before { background: none; border-top: 2px dashed var(--mv-text); }
.radar-leg .lc::before { background: none; border-top: 2px solid var(--mv-accent); }
.rl { font-size: 13px !important; grid-template-columns: minmax(0, 1fr) 120px 24px 24px; gap: 12px; padding: 12px 0; }
.rl input { width: 100%; min-width: 0; height: 44px; }
.rl b { color: var(--mv-text); }
.rl i { color: var(--mv-accent); }

/* Journal, purchase and preferences use the same quiet surfaces. */
.je { border: 1px solid var(--mv-border); border-radius: var(--mv-radius-surface); background: var(--mv-surface); padding: 24px; margin-bottom: 16px; }
.je .je-m { font-size: 11px; letter-spacing: .06em; margin-bottom: 14px; }
.je p { font-size: 16px; line-height: 1.75; }
.set > p, .pay > p { color: var(--mv-text-secondary); }
.set > p { overflow-wrap: anywhere; }
.set input[type=text] { width: min(100%, 320px); margin-right: 8px; }
.pay .price { font: 600 60px/1.15 var(--mv-display); color: var(--mv-text); margin: 32px 0 16px; }
.pay .lock-list { margin-block: 28px; }
.pay .lock-list li { background: var(--mv-surface); padding: 18px; gap: 16px; border-radius: var(--mv-radius-control); margin: 8px 0; font-size: 14px; }
.pay .lock-list b { font: 500 23px/1.3 var(--mv-display); min-width: 20px; }
.pay .lock-list i { color: var(--mv-text-secondary); font-style: normal; }
.pay .code-row { gap: 12px; }
.pay .code-row input { width: 205px; letter-spacing: .06em; }
.card { border: 1px solid var(--mv-border); border-radius: var(--mv-radius-surface); }
.card .c-v { font-family: var(--mv-display); }
.adm { overflow-x: auto; }
.adm table { font-size: 13px; }
#bm-ribbon { color: var(--mv-text); width: 290px; bottom: 20px; right: 20px; }
#bm-ribbon .body { background: var(--mv-surface-raised); border: 1px solid var(--mv-border); box-shadow: 0 12px 40px #0005; padding: 20px; }
#bm-ribbon .lbl { color: var(--mv-accent); font-size: 10px; opacity: 1; }
#bm-ribbon .ch { font: 500 20px/1.25 var(--mv-display); margin: 10px 0; text-transform: none; }
#bm-ribbon .snip { color: var(--mv-text-secondary); font-size: 12px; line-height: 1.65; font-style: normal; }
#bm-ribbon .row { margin-top: 16px; }
#bm-ribbon .del { background: transparent; color: var(--mv-text); border: 1px solid var(--mv-border); min-width: 48px; padding: 10px; }
#toast { max-width: calc(100vw - 40px); border: 1px solid var(--mv-border); border-radius: var(--mv-radius-control); background: var(--mv-surface-raised); color: var(--mv-text); box-shadow: 0 8px 30px #0006; font-size: 14px; line-height: 1.6; letter-spacing: 0; white-space: normal; text-align: center; }
#toast b { color: var(--mv-success); }

@media (max-width: 760px) {
  :root { --course-header: 126px; }
  #top { display: grid; grid-template-columns: minmax(0, 1fr) auto; padding: 16px 24px 0; column-gap: 16px; row-gap: 8px; }
  .tb-brand { max-width: 225px; }
  .tb-user { grid-column: 2; grid-row: 1; }
  .tb-name { display: none; }
  .tb-nav { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; gap: 28px; }
  .tb-nav a { min-height: 44px; }
  .menu, .jr, .set, .pay, .center, .dash { padding: 32px 24px 80px; }
  .wrap { padding: 36px 32px 80px; }
  .cover { padding: 156px 24px 56px; background-position: center, center, 70% top; background-size: cover; background-image: linear-gradient(0deg, #101114 0%, #101114 15%, #101114e6 65%, #10111420 100%), url('/assets/hero-editorial-v1.png?v=5418249e55'); }
  .cover h1 { font-size: 52px; }
  .cover > .inner > p { font-size: 14px; max-width: 360px; }
  .login-card { max-width: 480px; padding: 24px; }
  .mstat { gap: 14px; flex-wrap: wrap; }
  .mstat .st:nth-last-child(-n+2) { padding-left: 14px; }
  .cta { flex-direction: column; align-items: stretch; padding: 24px; gap: 22px; }
  .cta .c-a { align-self: flex-start; }
  .lbar { min-height: 54px; padding: 10px 24px; gap: 14px; }
  .lbar .lb-p { display: none; }
  .ex, .practice, .fieldtask { padding: 22px; }
  .radar-wrap, .eyes-wrap { grid-template-columns: 1fr; }
  .radar, .eyes { max-width: 340px; margin-inline: auto; }
  .radar-leg { display: flex; flex-wrap: wrap; gap: 0 20px; }
  .rl { grid-template-columns: minmax(0, 1fr) 104px 24px 24px; gap: 8px; }
}
@media (max-width: 520px) {
  .lgrid { grid-template-columns: 1fr; gap: 12px; }
  .lcard { padding: 22px; }
  .menu h1, .jr h1, .set h1, .pay h1 { font-size: 40px; }
  .mstat { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
  .mstat > .lvl-ring { grid-column: 1; }
  .mstat > .st:nth-child(2) { grid-column: 2 / -1; }
  .mstat .st:nth-last-child(-n+2) { grid-column: span 2; border-left: 0; border-top: 1px solid var(--mv-border); padding: 14px 0 0; }
  .cta .c-a { align-self: stretch; }
  .cta .c-t { font-size: 30px; }
  .mfoot .btn { flex: 1 1 auto; }
  .lesson { font-size: 18px; line-height: 1.7; }
  .lesson-head h1 { font-size: 43px; }
  .lh-obj { font-size: 15px; padding-left: 18px; }
  .wrap { padding-inline: 24px; }
  .ex, .practice, .fieldtask { padding: 20px; margin-block: 30px; }
  .ex-head { align-items: flex-start; }
  .ex h3 { font-size: 25px; flex-basis: 100%; order: 2; }
  .ex-stage { margin-left: auto; }
  .ex-tag { align-self: center; }
  .ex-row { align-items: stretch; }
  .ex-row > .btn { flex: 1 1 auto; }
  .box, .dialog, .list, .keycard { padding: 20px; }
  .pull { font-size: 26px; }
  .q-opt, .q-opts.small .q-opt { padding: 13px 14px; font-size: 15px; }
  .q-opts.row { flex-direction: column; }
  .sc-eva, .sc-you { max-width: 96%; padding: 15px; }
  .rl { grid-template-columns: minmax(0, 1fr) 24px 24px; gap: 6px; padding: 14px 0; }
  .rl > span { grid-column: 1 / -1; }
  .rl input { grid-column: 1; }
  .nt-btn { left: -22px; width: 22px; font-size: 15px; }
  .set input[type=text] { display: block; width: 100%; margin: 0 0 12px; }
  .pay .code-row input { width: 100%; }
  .pay .code-row .btn { width: 100%; }
  .je { padding: 20px; }
  .login-card { padding: 22px; }
  .login-card .row { flex-direction: column; align-items: stretch; }
  #bm-ribbon { width: min(290px, calc(100vw - 32px)); bottom: 16px; right: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
.sync-status{width:min(1180px,calc(100% - 40px));margin:12px auto 0;color:var(--muted);font-size:12px;line-height:1.5}
.sync-status a{margin-left:10px;text-decoration:underline;text-underline-offset:3px}
.sync-conflict pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:260px;overflow:auto;font:inherit}