:root{--bg:oklch(0.985 0.0072 80);--card:#fff;--ink:oklch(0.2 0.027 80);--muted:oklch(0.5 0.027 80);--line:oklch(0.922 0.018 80);--edge:oklch(0.8494 0.0516 77);--brand:oklch(0.36 0.07 155);--brand-ink:oklch(0.216 0.042 155);--gold:oklch(0.68 0.13 70);--sun:oklch(0.72 0.15 45);--soft:oklch(0.955 0.0208 70);--leaf:oklch(0.962 0.0084 155);--r:1rem;--lift:0 2px 0 oklch(0.68 0.13 70/.25),0 18px 36px -24px oklch(0.68 0.13 70/.7)}

*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 "Lexend","Be Vietnam Pro",system-ui,sans-serif}
a{color:inherit}
.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:16px;padding:12px 20px;background:color-mix(in srgb,var(--card) 88%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.logo{font-weight:800;font-size:20px;text-decoration:none}.logo b{color:var(--brand)}.dot{color:var(--gold)}
.top nav{margin-left:auto;display:flex;gap:4px}.top nav a{text-decoration:none;padding:6px 12px;border-radius:99px;font-weight:600;font-size:14px;color:var(--muted)}
.top nav a.on{background:var(--soft);color:var(--ink)}
main{max-width:1080px;margin:0 auto;padding:28px 16px 60px}
.foot{text-align:center;color:var(--muted);font-size:13px;padding:24px 16px;border-top:1px solid var(--line)}
h1{font-size:clamp(28px,5vw,44px);line-height:1.15;margin:.2em 0}
h2{font-size:24px;margin:1.6em 0 .5em}h3{margin:.2em 0}
.eyebrow{text-transform:uppercase;letter-spacing:.08em;font-size:12px;font-weight:700;color:var(--muted)}
.muted{color:var(--muted)}
.hero{border-radius:28px;padding:32px;background:radial-gradient(circle at 88% 18%,oklch(0.86 0.14 75) 0 70px,transparent 72px),linear-gradient(180deg,oklch(0.95 0.04 80),oklch(0.92 0.06 85));color:var(--ink);border:1.5px solid var(--edge);position:relative;overflow:hidden}
.hero .eyebrow{color:var(--brand)}.hero p{max-width:640px;opacity:.95}
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.card{background:var(--card);border:1.5px solid var(--edge);border-radius:20px;padding:20px;box-shadow:var(--lift)}
a.card{text-decoration:none;display:block;transition:transform .15s}a.card:hover{transform:translateY(-3px)}
.chip{display:inline-block;font-size:12px;font-weight:700;padding:3px 10px;border-radius:99px;background:var(--soft);margin:2px 4px 2px 0}
.emoji{font-size:34px}
.q{font-weight:600;font-size:18px}
.band{border-left:5px solid var(--c,var(--brand));padding:14px 18px;border-radius:14px;background:var(--card);border-top:1px solid var(--line);border-right:1px solid var(--line);border-bottom:1px solid var(--line);margin:10px 0}
.band .eyebrow{color:var(--c,var(--brand))}
.concepts{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.concepts div{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px}
.lessonrow{display:flex;gap:14px;align-items:flex-start}
.num{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-weight:800;color:#fff;background:var(--c,var(--brand))}
.act{display:flex;gap:12px;padding:14px;border-radius:14px;background:var(--card);border:1px solid var(--line);margin:8px 0}
.tag{flex:none;font-size:11px;font-weight:800;color:#fff;border-radius:8px;padding:4px 8px;height:max-content;min-width:96px;text-align:center}
.crumb{font-size:14px;color:var(--muted);margin-bottom:8px}.crumb a{text-decoration:none;font-weight:600}
.pager{display:flex;justify-content:space-between;gap:10px;margin-top:24px}
.btn{display:inline-block;text-decoration:none;font-weight:700;padding:10px 24px;border-radius:13.6px;background:var(--brand);color:#fff;box-shadow:0 3px 0 var(--brand-ink)}
.btn.ghost{background:var(--bg);color:var(--ink);border:1px solid var(--line);box-shadow:none}
table{width:100%;border-collapse:collapse;background:var(--card);border-radius:14px;overflow:hidden}
td,th{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
th{width:160px}
.cycle{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.cycle div{border-radius:16px;padding:14px;color:#fff}
@media (max-width:640px){.cycle{grid-template-columns:1fr 1fr}.hero{padding:22px}th{width:110px}.tag{min-width:76px}}
.tree{font-size:15px}.tree .node{border:2px dashed var(--line);border-radius:16px;padding:12px 14px;margin:8px 0;background:var(--card)}
.tree .node .node{margin-left:18px}
.tree .lbl{font-weight:800}.tree .lbl small{font-weight:600;color:var(--muted);margin-left:6px}
.tree .ex{font-size:14px;color:var(--muted)}
.lesson{display:grid;grid-template-columns:280px 1fr;gap:24px;align-items:start}
main:has(.lesson){max-width:1200px}
.side{position:sticky;top:72px;max-height:calc(100vh - 90px);overflow:auto;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:14px}
.side .crumb{display:block;text-decoration:none;font-weight:600}
.lsel{width:100%;margin:6px 0 10px;padding:8px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit;font-size:13px}
.sgroup{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin:12px 6px 4px}
.sitem{display:flex;gap:10px;align-items:flex-start;padding:8px;border-radius:10px;text-decoration:none;font-size:14px;font-weight:600}
.sitem:hover{background:var(--soft)}.sitem.on{background:var(--soft);box-shadow:inset 3px 0 0 var(--brand)}
.sitem small{display:block;font-weight:500;color:var(--muted);font-size:12px}
.sdot{flex:none;width:24px;height:24px;border-radius:8px;display:grid;place-items:center;font-size:12px;font-weight:800;border:2px solid var(--c);color:var(--c)}
.sdot.done{background:var(--c);color:#fff}
.lmain{min-width:0}
.steps li{margin:8px 0;font-size:17px}
.note{width:100%;min-height:140px;padding:12px;border-radius:14px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit}
.donebox{display:flex;gap:8px;align-items:center;margin-top:12px;font-weight:600}
.pager{flex-wrap:wrap}
@media (max-width:820px){.lesson{grid-template-columns:1fr}.side{position:static;max-height:none}}
.soon{opacity:.6}.soon h3{font-size:16px}
summary{cursor:pointer}details .card{border:0;padding:12px 0 0}
a.card.lessonrow{display:flex}
.game{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:16px}
.ghead{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:baseline;margin-bottom:10px}.ghead .muted{font-size:13px}
.gdeck{display:flex;flex-wrap:wrap;gap:8px;min-height:56px;padding:10px;border-radius:14px;background:var(--soft)}
.gbuckets{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.gbucket{min-height:160px;border:2px dashed var(--c);border-radius:16px;padding:10px;display:flex;flex-direction:column;gap:8px;cursor:pointer}
.gbucket.over,.gdeck.over{background:color-mix(in srgb,var(--c,var(--brand)) 12%,transparent)}
.glabel{font-weight:800;color:var(--c)}
.gcard{background:var(--card);border:2px solid var(--line);border-radius:12px;padding:8px 10px;cursor:grab;user-select:none;font-size:14px}
.gdeck .gcard{flex:0 1 auto}
.gcard.picked{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 30%,transparent)}
.gcard.ok{border-color:#16a34a}.gcard.bad{border-color:#dc2626}
.gtop{display:flex;gap:6px;align-items:center}.ge{font-size:20px}.gv{margin-left:auto;font-weight:800}
.gcard.ok .gv{color:#16a34a}.gcard.bad .gv{color:#dc2626}
.gwhy{width:100%;margin-top:6px;padding:6px 8px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit;font-size:13px}
.gexp{margin-top:6px;font-size:13px;color:var(--muted)}
.gbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:14px}
.btn{border:0;cursor:pointer;font:inherit;font-weight:700}.btn[disabled]{opacity:.45;cursor:not-allowed}
.gscore{font-size:17px}.gtake{margin-top:12px}
@media (max-width:640px){.gbuckets{grid-template-columns:1fr}.gbucket{min-height:90px}}
.gintro{margin:0 0 12px;color:var(--muted)}
.gq{padding:12px 0;border-bottom:1px solid var(--line)}.gqq{font-weight:600;margin-bottom:8px}
.gopts{display:flex;flex-wrap:wrap;gap:8px}
.gopt,.gm{font:inherit;font-size:14px;text-align:left;padding:8px 12px;border-radius:12px;border:2px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer}
.gopt:hover:not([disabled]),.gm:hover:not([disabled]){border-color:var(--brand)}
.gopt.ok,.gm.ok,.gorder li.ok{border-color:#16a34a;background:color-mix(in srgb,#16a34a 10%,var(--card))}
.gopt.bad,.gm.bad,.gorder li.bad{border-color:#dc2626;background:color-mix(in srgb,#dc2626 10%,var(--card))}
.gopt.dim,.gm.dim{opacity:.45}.gm.picked{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 30%,transparent)}
.gm small{display:block;color:var(--muted)}
.gorder{list-style:decimal;padding-left:24px;margin:0}
.gorder li{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:8px 10px;margin:6px 0;border:2px solid var(--line);border-radius:12px;background:var(--card)}
.gmv{display:flex;gap:4px}.gmv button{font:inherit;width:32px;height:32px;border-radius:8px;border:1px solid var(--line);background:var(--soft);color:var(--ink);cursor:pointer}
.gmatch{display:grid;grid-template-columns:1fr 1fr;gap:12px}.gmatch>div{display:flex;flex-direction:column;gap:8px}
.gest{display:flex;flex-direction:column;gap:6px;margin:10px 0}.gest input{width:100%}.gval{font-size:24px;font-weight:800;color:var(--brand)}
.gfields{display:grid;gap:10px}.gfields label,.grefl{display:flex;flex-direction:column;gap:4px;font-weight:600;font-size:14px;margin-bottom:10px}
.gfields textarea,.grefl textarea{font:inherit;font-weight:400;padding:8px 10px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--ink)}
.gout{margin-top:12px;padding:12px;border-radius:12px;background:var(--soft)}.gout pre{white-space:pre-wrap;margin:6px 0 0;font:inherit;font-size:14px}
@media (max-width:640px){.gmatch{grid-template-columns:1fr}}

/* Savanna Day · Pride */
h1,h2,h3,.logo{font-family:"Lexend",system-ui,sans-serif;letter-spacing:-.01em}
h1{font-weight:700}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:36px;background:radial-gradient(ellipse at 20% 100%,oklch(0.72 0.1 130/.45) 0 60%,transparent 61%),radial-gradient(ellipse at 75% 100%,oklch(0.65 0.1 140/.4) 0 55%,transparent 56%)}
.hero h1{color:var(--ink);max-width:640px}
.top{background:color-mix(in srgb,var(--bg) 90%,transparent);border-bottom:1px solid var(--line)}
.top nav a.on{background:var(--leaf);color:var(--brand)}
.chip{background:var(--soft);color:oklch(0.32 0.078 70)}
.band{border-color:var(--edge)}
.sitem.on{background:var(--leaf);box-shadow:inset 3px 0 0 var(--brand)}
.sitem:hover{background:var(--soft)}
.side,.game,.act,.concepts div,table{border:1.5px solid var(--edge);box-shadow:var(--lift)}
.gdeck{background:var(--soft)}
.gopt.ok,.gm.ok,.gorder li.ok,.gcard.ok{border-color:var(--brand);background:var(--leaf)}
.gcard.ok .gv{color:var(--brand)}
.foot{border-top:1px solid var(--line)}
/* Savanna Day icon set + cast */
:root{--primary:oklch(0.36 0.07 155);--chart-1:oklch(0.36 0.07 155);--chart-2:oklch(0.68 0.13 70);--chart-3:oklch(0.8 0.16 45)}
.ic{display:inline-flex;width:var(--s);height:var(--s);vertical-align:-.2em}.ic svg{width:100%;height:100%}
.mas{display:inline-flex;width:var(--s);height:var(--s);flex:none}.mas>svg,.mas>span{width:100%!important;height:100%!important}.mas svg{width:100%;height:100%}
.cico{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--soft);color:var(--brand);margin-bottom:6px}
.cico.big{width:68px;height:68px}
.hero{display:flex;align-items:center;justify-content:space-between;gap:16px}
.hleo{position:relative;z-index:1;margin:-10px 0 -20px}
.castrow{display:flex;justify-content:center;gap:clamp(8px,4vw,40px);flex-wrap:wrap;margin:18px 0 6px}
.castm{display:flex;flex-direction:column;align-items:center;text-align:center}.castm b{font-size:14px}.castm small{color:var(--muted);font-size:12px}
.qmas{display:flex;align-items:center;gap:8px}.qmas .band{flex:1}
.ahead{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.gscore{display:flex;align-items:center;gap:10px}
.btn .ic{margin-left:2px}.side .crumb{display:flex;align-items:center;gap:4px}
.sdot .ic{vertical-align:0}
@media (max-width:640px){.hleo .mas{--s:120px!important}.qmas>.mas,.ahead>.mas{--s:60px!important}}
.logo{display:inline-flex;align-items:center;gap:6px}.dot{display:inline-flex;width:30px;height:30px;color:var(--brand)}.dot svg{width:100%;height:100%}
.igrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}
.icell{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 6px;background:var(--card);border:1.5px solid var(--edge);border-radius:16px}
.icell code{font-size:12px;color:var(--muted)}.igrid.old .icell{color:var(--brand);box-shadow:none}
.cico{background:none;width:auto;height:auto;justify-content:start}
/* top-bar course name */
.ctx{display:flex;align-items:center;gap:10px;min-width:0;font-weight:600}.ctx a{text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.csep{color:var(--line);font-size:22px}
/* two-line lesson picker */
.lpick{position:relative;margin-bottom:14px}
.lpick summary{list-style:none;display:grid;grid-template-columns:1fr auto;gap:2px 8px;padding:12px 14px;border:1.5px solid var(--edge);border-radius:14px;background:var(--bg);cursor:pointer}
.lpick summary::-webkit-details-marker{display:none}
.lpick small,.lopt small{grid-column:1;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--brand)}
.lpick summary span{grid-column:1;font-weight:600;line-height:1.35}
.lchev{grid-column:2;grid-row:1/3;align-self:center;transition:transform .15s}.lpick[open] .lchev{transform:rotate(90deg)}
.lmenu{position:absolute;z-index:4;left:0;right:0;top:calc(100% + 6px);background:var(--card);border:1.5px solid var(--edge);border-radius:14px;box-shadow:var(--lift);padding:6px;max-height:60vh;overflow:auto}
.lopt{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:10px;text-decoration:none}.lopt:hover,.lopt.on{background:var(--leaf)}.lopt span{font-weight:600;line-height:1.35}
/* one question at a time */
.qstep{font-size:13px;font-weight:700;color:var(--muted);letter-spacing:.06em;text-transform:uppercase}
.qprog{display:flex;gap:6px;margin:10px 0 22px}.qprog span{flex:1;height:6px;border-radius:9px;background:var(--line)}.qprog .on{background:var(--gold)}.qprog .ok{background:var(--brand)}.qprog .bad{background:oklch(0.62 0.17 30)}
.gqq.big{font-size:22px;line-height:1.4;margin-bottom:20px}
.gopts.col{flex-direction:column;gap:12px}.gopts.col .gopt{display:flex;align-items:center;gap:14px;padding:14px 16px;font-size:16px;width:100%}
.ol{flex:none;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-weight:800;font-size:14px;background:var(--soft);color:var(--brand)}
.gexp.big{font-size:15px;margin-top:16px;padding:12px 14px;border-radius:12px;background:var(--soft);color:var(--ink)}
.qnav{justify-content:space-between;margin-top:24px}
/* breathing room */
main{padding-top:36px}
.lesson{gap:36px}
.side{padding:18px}
.sitem{padding:10px 8px;margin:2px 0}
.game{padding:28px}
.ahead{margin-bottom:22px}
.ahead h1{margin:0}
.gintro{margin-bottom:22px;line-height:1.7}
.pager{margin-top:32px}
.donebox{margin-top:28px}
@media (max-width:640px){.game{padding:18px}.gqq.big{font-size:19px}.ctx .csep{display:none}.ctx{font-size:13px}}
.lpick summary{display:flex;align-items:center;gap:10px}.lsum{flex:1;display:flex;flex-direction:column;gap:2px}.lsum span{font-weight:600;line-height:1.35}
.kc{margin:28px 0}.kc h2{margin:0 0 14px}
.kcrow{display:flex;flex-wrap:wrap;gap:8px}.kcrow .chip{font-size:14px;padding:6px 12px;margin:0}
.kclab{margin:22px 0 10px;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.kcfw{display:grid;gap:10px}
.kcf{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:14px;background:var(--bg);border:1px solid var(--line);text-decoration:none;font-weight:600}
.kcf small{display:block;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--brand)}
/* left panel: scrolls with the page, no outer frame */
.lesson .side{position:static;max-height:none;overflow:visible;background:none;border:0;box-shadow:none;padding:0;border-radius:0}
.story{max-width:720px;margin:32px 0 8px;font-size:18px;line-height:1.8}
.story p{margin:0 0 22px}
.story p:first-child::first-letter{font-size:2.4em;font-weight:700;float:left;line-height:1;margin:4px 8px 0 0;color:var(--brand)}
.gopt.picked{border-color:var(--brand);background:var(--leaf);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 25%,transparent)}.gopt.picked .ol{background:var(--brand);color:#fff}
/* Knowledge card — fixed shape, distinct from games */
.know{--k:var(--brand);background:var(--leaf);border:1.5px solid color-mix(in oklch,var(--brand) 35%,var(--edge));border-left:8px solid var(--k);border-radius:24px;padding:32px;box-shadow:var(--lift)}
.khead{display:flex;align-items:center;gap:16px;margin-bottom:18px}.khead h1{margin:2px 0 0;font-size:clamp(26px,4vw,38px)}
.klab{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--k)}
.kdef{font-size:20px;line-height:1.6;font-weight:500;margin:0 0 24px}
.krow{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.kbox{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px}.kbox p{margin:6px 0 0;line-height:1.65}
.kt{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:oklch(0.32 0.078 70)}
.kmem{background:var(--soft);border:1.5px dashed var(--gold);border-radius:16px;padding:18px}.kmem ul{margin:8px 0 0;padding-left:20px;line-height:1.7;font-weight:600}
.recap{margin:8px 0 0}.rk{display:block;text-decoration:none;padding:12px 0;border-bottom:1px solid var(--edge)}.rk:last-child{border:0}.rk ul{font-weight:500;margin-top:4px}
.sknow{background:var(--leaf)}.sknow.on{box-shadow:inset 3px 0 0 var(--brand)}
.kdot{border:0;background:var(--brand-ink,var(--brand));color:#fff;background:none}
@media (max-width:640px){.krow{grid-template-columns:1fr}.know{padding:20px}.kdef{font-size:17px}}
/* lesson dropdown holds the numbered path */
.lpick{border:1.5px solid var(--edge);border-radius:16px;background:var(--card)}
.lpick summary{border:0;background:none}
.lsum em{font-style:normal;font-size:13px;color:var(--muted);margin-top:4px}
.lpick[open] .lsum em{display:none}
.lbody{padding:4px 8px 10px;border-top:1px solid var(--line)}
.lbody .sitem{margin:2px 0}
.lbody .sdot{border-color:var(--edge);color:var(--ink)}.lbody .sitem.on .sdot{background:var(--brand);border-color:var(--brand);color:#fff}
.lbody .sknow{background:var(--leaf)}
.lbody .sknow .ic{vertical-align:-.25em}
.lother{margin-top:10px;border-top:1px solid var(--line);padding-top:4px}.lother .kclab{margin:10px 8px 4px}
.lmenu{display:none}
/* footer nav */
.fnav{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.fnav a{text-decoration:none;font-weight:600;padding:6px 12px;border-radius:99px;color:var(--muted)}.fnav a.on{background:var(--leaf);color:var(--brand)}
/* calmer left panel text */
.side .sitem{font-weight:400;color:var(--muted)}
.side .sitem.on{color:var(--ink);font-weight:500}
.side .sdot{font-weight:500}
.lsum span,.lopt span{font-weight:500}
/* two dropdowns: one lesson, one activity */
.dd{position:relative;margin-bottom:12px;border:1.5px solid var(--edge);border-radius:16px;background:var(--card)}
.dd summary{list-style:none;display:flex;align-items:center;gap:10px;padding:12px 14px;cursor:pointer}
.dd summary::-webkit-details-marker{display:none}
.dd .lsum small{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--brand)}
.dd .lsum span{font-weight:500;line-height:1.35}
.dd[open] .lchev{transform:rotate(90deg)}
.ddmenu{position:absolute;z-index:6;left:0;right:0;top:calc(100% + 6px);background:var(--card);border:1.5px solid var(--edge);border-radius:14px;box-shadow:var(--lift);padding:6px;max-height:65vh;overflow:auto}
.ddmenu .sdot{border-color:var(--edge);color:var(--ink)}.ddmenu .sitem.on .sdot{background:var(--brand);border-color:var(--brand);color:#fff}
.ddmenu .sknow{background:var(--leaf)}
.dd-lesson .lopt span{font-weight:400}
.kc .kg+.kg{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.kc .kg .kclab{margin:0 0 10px}
.kc a.chip{text-decoration:none}
.deep{margin-top:20px}.deep p{margin:8px 0 12px}
.dgrade{display:inline-flex;align-items:center;gap:8px;font-weight:600}.dgrade select{font:inherit;padding:6px 10px;border-radius:10px;border:1px solid var(--edge);background:var(--bg);color:var(--ink)}
.dprompt{white-space:pre-wrap;font:inherit;font-size:14px;background:var(--soft);border-radius:12px;padding:12px 14px;margin:12px 0 0}
.pgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px;margin-top:28px}
.prog{display:flex;gap:18px;align-items:center;padding:26px}.prog h2{margin:6px 0 4px}.prog p{margin:0 0 12px}
.prog.soon{opacity:.85}.pmas{flex:none}
@media (max-width:640px){.prog{flex-direction:column;align-items:flex-start}}