/* SCIKIQ Sales Training: the slide player (scripts/sales-training.js).
   Colours come from the site tokens in main.css, so light and dark both work;
   each module sets --h to its own hue. */
.st-wrap{max-width:1180px;margin:0 auto;padding:0 16px}
.st-hero{padding:clamp(40px,6vw,72px) 0 28px}
.st-hero h1{font-size:clamp(2.1rem,4.6vw,3.4rem);letter-spacing:-.025em;margin:10px 0 12px}
.st-hero .hb-lead{max-width:760px}
.st-int{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--amber);
  background:color-mix(in srgb,var(--amber) 10%,transparent);border:1px solid color-mix(in srgb,var(--amber) 30%,transparent);
  padding:5px 12px;border-radius:999px;margin-top:14px}
.st-stats{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.st-stats div{background:var(--paper);border:1px solid var(--line-soft);border-radius:12px;padding:10px 16px;min-width:112px}
.st-stats b{display:block;font-family:var(--f-display);font-size:1.7rem;line-height:1.1}
.st-stats span{font-size:13px;color:var(--fg-dim)}
#st-app{padding-bottom:clamp(56px,7vw,96px);scroll-margin-top:90px}
.st-i{width:20px;height:20px;flex:none}

/* ── home ───────────────────────────────────────────────── */
.st-overall{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;align-items:center;background:var(--paper);
  border:1px solid var(--line-soft);border-radius:16px;padding:16px 20px;margin-bottom:28px}
.st-overall small{grid-column:1/-1;color:var(--fg-dim);font-size:13px}
.st-track{height:8px;border-radius:9px;background:var(--line-soft);overflow:hidden}
.st-track i,.st-bar i{display:block;height:100%;background:var(--accent);border-radius:9px;transition:width .5s}
.st-phase{margin-bottom:30px}
.st-ph{display:flex;gap:14px;align-items:center;margin-bottom:14px}
.st-phn{font-family:var(--f-display);font-weight:700;font-size:1.05rem;color:var(--accent);border:1.5px solid var(--accent);
  border-radius:10px;width:42px;height:42px;display:grid;place-items:center;flex:none}
.st-ph b{display:block;font-size:1.15rem}
.st-ph small{color:var(--fg-dim);font-size:14px}
.st-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.st-card{position:relative;text-align:left;font:inherit;color:inherit;cursor:pointer;display:flex;flex-direction:column;gap:6px;
  background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:18px 18px 16px;overflow:hidden;
  transition:transform .25s var(--lift,ease),box-shadow .25s,border-color .25s}
.st-card::before{content:"";position:absolute;inset:0 0 auto;height:4px;background:var(--h)}
.st-card:hover,.st-card:focus-visible{transform:translateY(-3px);border-color:color-mix(in srgb,var(--h) 45%,transparent);
  box-shadow:0 18px 36px -20px color-mix(in srgb,var(--h) 60%,transparent)}
.st-cn{position:absolute;right:16px;top:14px;font-family:var(--f-display);font-size:1.6rem;font-weight:700;color:var(--line-strong)}
.st-ci{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;color:var(--h);
  background:color-mix(in srgb,var(--h) 12%,transparent);margin-bottom:4px}
.st-ci .st-i{width:24px;height:24px}
.st-card b{font-size:1.06rem;line-height:1.25;padding-right:34px}
.st-card small{color:var(--fg-dim);font-size:13px}
.st-cm{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--fg-dim);margin-top:auto;padding-top:6px}
.st-cm .st-i{width:14px;height:14px}
.st-cm em{font-style:normal;color:var(--signal);display:inline-flex;align-items:center;gap:3px;font-weight:600}
.st-bar{height:5px;border-radius:9px;background:var(--line-soft);overflow:hidden}
.st-bar i{background:var(--h)}
.st-card.is-done{border-color:color-mix(in srgb,var(--signal) 40%,transparent)}

/* ── stage ──────────────────────────────────────────────── */
.st-stage{--h:var(--accent);background:var(--bg);border:1px solid var(--line);border-radius:22px;overflow:hidden;
  box-shadow:var(--m-shadow,0 12px 32px -16px rgba(0,0,0,.2));display:flex;flex-direction:column;min-height:min(78vh,760px)}
.st-stage:fullscreen{border-radius:0;min-height:100vh;height:100vh}
.st-top{display:flex;align-items:center;gap:12px;padding:10px 14px;border-bottom:1px solid var(--line-soft);
  background:linear-gradient(90deg,color-mix(in srgb,var(--h) 12%,var(--bg)),var(--bg))}
.st-x{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:13.5px;font-weight:600;color:var(--fg);background:var(--bg);
  border:1px solid var(--line);border-radius:10px;padding:7px 11px;cursor:pointer}
.st-x:hover{border-color:var(--h);color:var(--h)}
.st-x .st-i{width:16px;height:16px}
.st-mod{display:flex;align-items:center;gap:8px;font-weight:600;font-size:14.5px;min-width:0;color:var(--h)}
.st-mod span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--fg)}
.st-dots{display:flex;gap:4px;margin-left:auto;flex-wrap:wrap;justify-content:flex-end;max-width:45%}
.st-dots i{width:9px;height:9px;border-radius:50%;background:var(--line);cursor:pointer;transition:transform .2s}
.st-dots i.on{background:color-mix(in srgb,var(--h) 55%,transparent)}
.st-dots i.now{background:var(--h);transform:scale(1.35)}
.st-view{flex:1;padding:clamp(22px,4vw,48px) clamp(18px,4.5vw,56px);overflow:auto;outline:none}
.st-view.go-fwd{animation:st-in .4s var(--lift,ease) both}
.st-view.go-back{animation:st-inb .4s var(--lift,ease) both}
@keyframes st-in{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}
@keyframes st-inb{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:none}}
.st-pop{animation:st-pop .5s var(--lift,ease) both;animation-delay:var(--d,0ms)}
@keyframes st-pop{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.st-pop,.st-view.go-fwd,.st-view.go-back{animation:none}}
.st-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-top:1px solid var(--line-soft);background:var(--paper)}
.st-where{font-size:13px;color:var(--fg-dim);font-variant-numeric:tabular-nums}
.st-btn{display:inline-flex;align-items:center;gap:8px;font:inherit;font-weight:600;font-size:15px;cursor:pointer;
  color:#fff;background:var(--h);border:1px solid var(--h);border-radius:11px;padding:10px 18px;transition:filter .2s,transform .2s}
.st-btn:hover{filter:brightness(1.08);transform:translateY(-1px)}
.st-btn:disabled{opacity:.35;cursor:default;transform:none}
.st-btn.ghost{background:transparent;color:var(--fg);border-color:var(--line-strong)}
.st-btn.ghost:hover{border-color:var(--h);color:var(--h)}
.st-btn .st-i{width:17px;height:17px}

/* ── slide type: shared ─────────────────────────────────── */
.st-k{font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--h);margin-bottom:8px}
.st-h{font-family:var(--f-display);font-size:clamp(1.5rem,2.8vw,2.15rem);line-height:1.18;letter-spacing:-.02em;margin:0 0 10px;max-width:900px}
.st-h.big{font-size:clamp(2rem,4.2vw,3.1rem)}
.st-lead{color:var(--fg-dim);font-size:clamp(1rem,1.4vw,1.12rem);max-width:820px;margin:0 0 22px}
.st-ib{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;flex:none;color:var(--h);
  background:color-mix(in srgb,var(--h) 12%,transparent)}
.st-ib .st-i{width:22px;height:22px}
.st-tag{display:inline-block;font-size:12px;font-weight:600;color:var(--h);background:color-mix(in srgb,var(--h) 10%,transparent);
  border-radius:7px;padding:3px 9px;margin-top:8px;align-self:flex-start}
.st-foot{display:flex;gap:10px;align-items:flex-start;margin-top:20px;padding:14px 18px;border-radius:14px;
  background:color-mix(in srgb,var(--h) 8%,var(--bg));border:1px dashed color-mix(in srgb,var(--h) 40%,transparent);font-size:15px}
.st-foot .st-i{color:var(--h)}
.st-hint{font-size:13px;color:var(--fg-dim);margin-top:12px}
.st-l{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;flex:none;font-weight:700;font-size:13px;
  background:var(--paper-2);color:var(--fg-dim)}

/* title */
.st-title{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(20px,4vw,56px);align-items:start}
.st-view.t-title{background:radial-gradient(120% 90% at 0% 0%,color-mix(in srgb,var(--h) 16%,transparent),transparent 60%)}
.st-meta{display:flex;flex-wrap:wrap;gap:8px 18px;margin:4px 0 26px;font-size:14px;color:var(--fg-dim)}
.st-meta span{display:inline-flex;align-items:center;gap:6px}
.st-meta .st-i{width:16px;height:16px;color:var(--h)}
.st-agenda{background:var(--bg);border:1px solid var(--line);border-radius:18px;padding:20px 22px}
.st-agh{display:flex;align-items:center;gap:8px;font-weight:700;color:var(--h);margin-bottom:10px}
.st-agenda ol{margin:0;padding-left:20px;display:grid;gap:7px;font-size:14.5px}
.st-agenda li::marker{color:var(--h);font-weight:700}

/* objectives */
.st-objs{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:12px;max-width:860px}
.st-objs li{display:flex;gap:14px;align-items:center;font-size:clamp(1rem,1.5vw,1.15rem);padding:12px 16px;border-radius:14px;
  background:var(--paper);border:1px solid var(--line-soft)}

/* tiles */
.st-tiles{display:grid;gap:14px}
.st-tiles.c2{grid-template-columns:repeat(2,1fr)}.st-tiles.c3{grid-template-columns:repeat(3,1fr)}.st-tiles.c4{grid-template-columns:repeat(4,1fr)}
.st-tile{display:flex;flex-direction:column;gap:6px;padding:18px;border-radius:16px;background:var(--bg);border:1px solid var(--line);
  transition:transform .25s,border-color .25s}
.st-tile:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--h) 45%,transparent)}
.st-tile .st-ib{margin-bottom:4px}
.st-tile b{font-size:1.02rem;line-height:1.3}
.st-tile small{color:var(--fg-dim);font-size:14px;line-height:1.5}

/* chain */
.st-chain{display:flex;align-items:stretch;gap:8px;flex-wrap:wrap}
.st-lk{flex:1 1 140px;position:relative;display:flex;flex-direction:column;gap:6px;padding:16px;border-radius:16px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--h) 7%,var(--bg)),var(--bg));border:1px solid color-mix(in srgb,var(--h) 25%,var(--line))}
.st-lk b{font-size:1rem;line-height:1.25}
.st-lk small{color:var(--fg-dim);font-size:13.5px;line-height:1.45}
.st-num{position:absolute;right:12px;top:10px;font-family:var(--f-display);font-weight:700;color:color-mix(in srgb,var(--h) 45%,transparent)}
.st-ar{align-self:center;color:var(--h);flex:none}

/* ladder */
.st-ladder{list-style:none;margin:0;padding:0;position:relative;display:grid;gap:12px;max-width:900px}
.st-ladder::before{content:"";position:absolute;left:58px;top:10px;bottom:10px;width:2px;background:color-mix(in srgb,var(--h) 30%,transparent)}
.st-ladder li{display:grid;grid-template-columns:118px 1fr;gap:16px;align-items:center;position:relative}
.st-rung{justify-self:center;z-index:1;background:var(--h);color:#fff;font-weight:700;font-size:12.5px;border-radius:999px;padding:6px 12px;text-align:center;
  box-shadow:0 0 0 5px var(--bg)}
.st-ladder li>div{background:var(--paper);border:1px solid var(--line-soft);border-radius:14px;padding:12px 16px}
.st-ladder b{display:block}
.st-ladder small{color:var(--fg-dim);font-size:14px}

/* tables */
.st-tw{overflow-x:auto;border:1px solid var(--line);border-radius:16px}
.st-table,.st-cmp{width:100%;border-collapse:collapse;font-size:14.5px}
.st-table th,.st-table td,.st-cmp th,.st-cmp td{padding:12px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line-soft)}
.st-table thead th,.st-cmp thead th{background:color-mix(in srgb,var(--h) 9%,var(--bg));font-size:13px;letter-spacing:.03em;color:var(--fg)}
.st-table tbody th,.st-cmp tbody th{font-weight:600;min-width:140px}
.st-table tr:last-child>*,.st-cmp tr:last-child>*{border-bottom:0}
.st-table tbody tr:hover,.st-cmp tbody tr:hover{background:var(--paper)}
.st-cmp thead small{display:block;font-weight:500;color:var(--fg-dim);font-size:12px;margin-top:2px}
.st-cmp td{color:var(--fg-dim)}

/* persona */
.st-people{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;align-items:start}
.st-person{border:1px solid var(--line);border-radius:16px;background:var(--bg);overflow:hidden}
.st-person[open]{border-color:color-mix(in srgb,var(--h) 45%,transparent);box-shadow:0 14px 30px -22px var(--h)}
.st-person summary{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;align-items:center;padding:14px 16px;cursor:pointer;list-style:none}
.st-person summary::-webkit-details-marker{display:none}
.st-person summary .st-ib{grid-row:span 2}
.st-person summary small{color:var(--fg-dim);font-size:13px;line-height:1.35}
.st-person dl{margin:0;padding:0 16px 16px;display:grid;gap:3px;font-size:14px}
.st-person dt{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--h);margin-top:8px}
.st-person dd{margin:0;color:var(--fg)}
.st-door{font-style:italic}

/* talk */
.st-talk{display:flex;flex-direction:column;gap:12px;max-width:860px}
.st-bub{max-width:78%;padding:12px 16px 13px;border-radius:18px;position:relative}
.st-bub p{margin:0;font-size:15.5px;line-height:1.5}
.st-who{display:block;font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:3px;opacity:.75}
.st-bub.them{align-self:flex-start;background:var(--paper);border:1px solid var(--line-soft);border-bottom-left-radius:5px}
.st-bub.you{align-self:flex-end;background:var(--h);color:#fff;border-bottom-right-radius:5px}

/* say / not */
.st-sn{display:grid;gap:12px}
.st-snr{display:grid;grid-template-columns:200px 1fr 1fr;gap:10px;align-items:stretch}
.st-snm{font-weight:700;font-size:14px;padding:12px 0}
.st-say,.st-not{display:flex;gap:10px;padding:12px 14px;border-radius:14px;font-size:14.5px;line-height:1.45}
.st-say{background:color-mix(in srgb,var(--signal) 9%,var(--bg));border:1px solid color-mix(in srgb,var(--signal) 35%,transparent)}
.st-say .st-i{color:var(--signal)}
.st-not{background:color-mix(in srgb,var(--critical) 6%,var(--bg));border:1px solid color-mix(in srgb,var(--critical) 25%,transparent);color:var(--fg-dim)}
.st-not span{text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--critical) 50%,transparent)}
.st-not .st-i{color:var(--critical)}

/* battle card */
.st-battle{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.st-bvs{grid-column:1/-1;display:flex;gap:14px;align-items:center;flex-wrap:wrap;padding:14px 18px;border-radius:16px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--h) 14%,var(--bg)),var(--bg));border:1px solid color-mix(in srgb,var(--h) 30%,var(--line))}
.st-bvs b{font-size:1.2rem;display:block}
.st-bvs small{color:var(--fg-dim);font-size:14px}
.st-bvs>div{flex:1 1 300px}
.st-send{font-size:13px;font-weight:600}
.st-send a{color:var(--h);margin-left:4px}
.st-bcol{border-radius:16px;padding:14px 18px;border:1px solid var(--line);background:var(--bg)}
.st-bcol h4{display:flex;align-items:center;gap:8px;font-size:13px;letter-spacing:.06em;text-transform:uppercase;margin:0 0 8px}
.st-bcol ul{margin:0;padding-left:18px;display:grid;gap:5px;font-size:14.5px;line-height:1.45}
.st-bcol.them h4{color:var(--amber)}.st-bcol.us h4{color:var(--signal)}.st-bcol.traps h4{color:var(--accent)}.st-bcol.avoid h4{color:var(--critical)}
.st-bcol.us{background:color-mix(in srgb,var(--signal) 6%,var(--bg))}
.st-bcol.avoid{background:color-mix(in srgb,var(--critical) 5%,var(--bg))}

/* scorer */
.st-scorer{display:grid;grid-template-columns:1.5fr 1fr;gap:20px;align-items:start}
.st-crit{display:grid;gap:8px}
.st-crit label{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:11px 14px;border-radius:13px;
  border:1px solid var(--line);cursor:pointer;transition:border-color .2s,background .2s}
.st-crit input{position:absolute;opacity:0;pointer-events:none}
.st-box{width:24px;height:24px;border-radius:7px;border:1.6px solid var(--line-strong);display:grid;place-items:center;color:transparent;transition:.2s}
.st-box .st-i{width:16px;height:16px}
.st-crit label:has(input:checked){border-color:var(--h);background:color-mix(in srgb,var(--h) 7%,var(--bg))}
.st-crit input:checked+.st-box{background:var(--h);border-color:var(--h);color:#fff}
.st-crit input:focus-visible+.st-box{outline:2px solid var(--h);outline-offset:2px}
.st-cl b{display:block;font-size:14.5px;font-weight:600}
.st-cl small{color:var(--fg-dim);font-size:12.5px}
.st-pts{font-weight:700;color:var(--h);font-variant-numeric:tabular-nums}
.st-meter{position:sticky;top:10px;display:grid;gap:14px;justify-items:center;padding:20px;border-radius:18px;background:var(--paper);border:1px solid var(--line-soft)}
.st-dial{position:relative;width:170px;height:170px}
.st-dial svg{width:100%;height:100%;transform:rotate(-90deg)}
.st-dial circle{fill:none;stroke-width:11;stroke-linecap:round}
.st-dial .trk{stroke:var(--line-soft)}
.st-dial .val{stroke:var(--h);transition:stroke-dasharray .45s var(--lift,ease)}
.st-sv{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--f-display);font-size:2.6rem;font-weight:700;padding-bottom:16px}
.st-sx{position:absolute;left:0;right:0;bottom:48px;text-align:center;font-size:13px;color:var(--fg-dim)}
.st-band{text-align:center;padding:12px 14px;border-radius:13px;background:var(--bg);border:1px solid var(--line);width:100%}
.st-band b{display:block;font-size:1.05rem}
.st-band small{color:var(--fg-dim);font-size:13.5px}
.st-band[data-lvl="hi"]{border-color:var(--signal);background:color-mix(in srgb,var(--signal) 9%,var(--bg))}
.st-band[data-lvl="mid"]{border-color:var(--amber);background:color-mix(in srgb,var(--amber) 9%,var(--bg))}

/* sizer */
.st-sizer{display:grid;grid-template-columns:1fr 1.15fr;gap:20px;align-items:start}
.st-ins{display:grid;gap:10px}
.st-in{display:grid;gap:5px;font-size:14px;font-weight:600}
.st-iw{display:flex;align-items:center;border:1px solid var(--line-strong);border-radius:11px;overflow:hidden;background:var(--bg)}
.st-iw:focus-within{border-color:var(--h);box-shadow:0 0 0 3px color-mix(in srgb,var(--h) 18%,transparent)}
.st-iw input{flex:1;min-width:0;border:0;background:transparent;color:var(--fg);font:inherit;font-size:1.05rem;padding:10px 12px;outline:none}
.st-iw em{font-style:normal;font-weight:500;color:var(--fg-dim);padding:0 12px;font-size:13px;white-space:nowrap}
.st-note{display:flex;gap:8px;font-size:13px;color:var(--fg-dim);margin:4px 0 0}
.st-note .st-i{width:16px;height:16px;color:var(--amber)}
.st-out{display:grid;gap:12px}
.st-big{padding:20px 22px;border-radius:18px;color:#fff;background:linear-gradient(135deg,var(--h),color-mix(in srgb,var(--h) 60%,#000))}
.st-big small{display:block;opacity:.85;font-size:13px;font-weight:600;letter-spacing:.04em}
.st-big b{font-family:var(--f-display);font-size:clamp(2.2rem,5vw,3.2rem);line-height:1.1;font-variant-numeric:tabular-nums}
.st-big span{margin-left:8px;opacity:.85}
.st-math{padding:14px 16px;border-radius:14px;background:var(--paper);border:1px solid var(--line-soft);font-size:14.5px;line-height:1.7;font-variant-numeric:tabular-nums}
.st-half{padding:12px 16px;border-radius:14px;border:1px dashed var(--line-strong);font-size:14px;color:var(--fg-dim)}

/* scenario */
.st-scene{display:grid;gap:14px;max-width:920px}
.st-setup{display:flex;gap:14px;padding:16px 18px;border-radius:16px;background:var(--paper);border-left:4px solid var(--h)}
.st-setup .st-i{color:var(--h);width:24px;height:24px}
.st-setup p{margin:0;font-size:clamp(1rem,1.4vw,1.1rem);line-height:1.55}
.st-opts{display:grid;gap:10px}
.st-opt{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;text-align:left;font:inherit;color:inherit;cursor:pointer;
  padding:12px 14px;border-radius:14px;border:1px solid var(--line);background:var(--bg);transition:border-color .2s,background .2s,transform .2s}
.st-opt:hover{border-color:var(--h);transform:translateX(3px)}
.st-ot{font-size:15px;line-height:1.45;align-self:center}
.st-fb{grid-column:2;display:none;gap:8px;font-size:14px;line-height:1.45;padding-top:6px;color:var(--fg-dim)}
.st-fb .st-i{width:18px;height:18px}
.st-opt.picked .st-fb,.st-opt.reveal .st-fb{display:flex}
.st-opt.best.picked,.st-opt.reveal[data-best="1"]{border-color:var(--signal);background:color-mix(in srgb,var(--signal) 8%,var(--bg))}
.st-opt[data-best="1"] .st-fb .st-i{color:var(--signal)}
.st-opt.miss{border-color:var(--critical);background:color-mix(in srgb,var(--critical) 5%,var(--bg))}
.st-opt[data-best="0"] .st-fb .st-i{color:var(--critical)}
.st-opt.picked .st-l{background:var(--h);color:#fff}
.st-opt.miss .st-l{background:var(--critical)}
.st-opt.best .st-l,.st-opt.reveal[data-best="1"] .st-l{background:var(--signal);color:#fff}

/* funnel */
.st-funnel{display:grid;gap:8px}
.st-fs{display:grid;grid-template-columns:minmax(0,46%) 1fr;gap:18px;align-items:center}
.st-fbar{display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 16px;border-radius:12px;color:#fff;justify-self:center;
  width:var(--w);min-width:150px;background:linear-gradient(90deg,color-mix(in srgb,var(--h) 70%,#000),var(--h),color-mix(in srgb,var(--h) 70%,#000))}
.st-fbar span{font-family:var(--f-display);font-weight:700;opacity:.7}
.st-fbar b{font-size:14.5px}
.st-fx small{color:var(--fg-dim);font-size:14px;display:block}
.st-fx .st-tag{margin-top:4px}

/* quad */
.st-quad{display:grid;grid-template-columns:auto 1fr;grid-template-rows:1fr auto;gap:8px;max-width:900px}
.st-qy{writing-mode:vertical-rl;transform:rotate(180deg);display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-dim)}
.st-qy .st-i{transform:rotate(-90deg);width:16px;height:16px}
.st-qx{grid-column:2;display:flex;align-items:center;justify-content:center;gap:6px;font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-dim)}
.st-qx .st-i{width:16px;height:16px}
.st-qg{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.st-q{padding:18px;border-radius:16px;border:1px solid var(--line);min-height:120px;display:flex;flex-direction:column;gap:6px}
.st-q b{font-size:1.05rem}
.st-q small{color:var(--fg-dim);font-size:14px;line-height:1.45}
.st-q.q1{background:color-mix(in srgb,var(--signal) 10%,var(--bg));border-color:color-mix(in srgb,var(--signal) 40%,transparent)}
.st-q.q0,.st-q.q3{background:color-mix(in srgb,var(--amber) 7%,var(--bg))}
.st-q.q2{background:var(--paper)}

/* quiz */
.st-quiz{max-width:860px}
.st-qq{font-size:clamp(1.1rem,1.8vw,1.3rem);font-weight:600;margin-bottom:16px;line-height:1.4}
.st-qo{display:grid;gap:10px}
.st-qb{display:flex;gap:12px;align-items:center;text-align:left;font:inherit;font-size:15.5px;color:inherit;cursor:pointer;
  padding:12px 14px;border-radius:14px;border:1px solid var(--line);background:var(--bg);transition:.2s}
.st-qb:hover:not(:disabled){border-color:var(--h);transform:translateX(3px)}
.st-qb:disabled{cursor:default}
.st-qb.wrong{border-color:var(--critical);animation:st-shake .4s}
.st-qb.right{border-color:var(--signal);background:color-mix(in srgb,var(--signal) 9%,var(--bg))}
.st-qb.right .st-l{background:var(--signal);color:#fff}
@keyframes st-shake{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.st-why{display:none;gap:10px;margin-top:16px;padding:14px 16px;border-radius:14px;background:color-mix(in srgb,var(--signal) 8%,var(--bg));font-size:15px}
.st-why .st-i{color:var(--signal)}
.st-quiz.solved .st-why{display:flex;animation:st-pop .4s both}

/* recap */
.st-recap{display:grid;grid-template-columns:1.3fr 1fr;gap:24px;align-items:start}
.st-recap ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.st-recap li{display:flex;gap:10px;font-size:15.5px;line-height:1.45}
.st-recap li .st-i{color:var(--signal);margin-top:2px}
.st-done{padding:22px;border-radius:18px;background:var(--paper);border:1px solid var(--line-soft);display:grid;gap:10px;justify-items:start}
.st-done h3{margin:0;font-size:1.15rem}
.st-done p{margin:0;color:var(--fg-dim);font-size:14px}
.st-mark.done{background:var(--signal);border-color:var(--signal)}
.st-links{display:grid;gap:6px;width:100%;margin-top:6px}
.st-links a{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 12px;border-radius:10px;border:1px solid var(--line);
  color:var(--fg);text-decoration:none;font-size:14px;font-weight:500;background:var(--bg)}
.st-links a:hover{border-color:var(--h);color:var(--h)}
.st-links .st-i{width:16px;height:16px}

/* ── responsive ─────────────────────────────────────────── */
@media (max-width:980px){
  .st-tiles.c4{grid-template-columns:repeat(2,1fr)}
  .st-tiles.c3{grid-template-columns:repeat(2,1fr)}
  .st-title,.st-recap,.st-scorer,.st-sizer{grid-template-columns:1fr}
  .st-snr{grid-template-columns:1fr 1fr}.st-snm{grid-column:1/-1;padding:0}
  .st-meter{position:static}
}
@media (max-width:640px){
  .st-tiles.c2,.st-tiles.c3,.st-tiles.c4,.st-battle,.st-qg{grid-template-columns:1fr}
  .st-snr{grid-template-columns:1fr}
  .st-chain{flex-direction:column}.st-ar{transform:rotate(90deg)}
  .st-ladder::before{left:44px}.st-ladder li{grid-template-columns:90px 1fr;gap:10px}
  .st-fs{grid-template-columns:1fr;gap:4px}.st-fbar{justify-self:start;width:100%}
  .st-bub{max-width:92%}
  .st-dots{display:none}
  .st-x span,.st-btn.ghost[data-prev] span{display:none}
  .st-quad{grid-template-columns:1fr}.st-qy{display:none}.st-qx{grid-column:1}
  .st-stage{border-radius:16px;min-height:0}
}
/* keep the player's own bar clear of the sticky site header */
.st-stage{scroll-margin-top:84px}
.st-bcol h4{font-family:var(--f-body)}
.st-bub.you p,.st-bub.you .st-who{color:#fff}

/* ══ v2: SCIKIQ visuals, games and progression ═══════════════════ */
/* so-what bar: the one line to remember on every slide */
.st-so{display:flex;gap:14px;align-items:center;margin-top:22px;padding:12px 16px;border-radius:14px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--h) 12%,var(--bg)),var(--bg));border-left:4px solid var(--h)}
.st-so span{font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--h);white-space:nowrap}
.st-so p{margin:0;font-weight:600;font-size:15.5px;line-height:1.45;color:var(--fg)}
.st-xp{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:600;color:var(--fg-dim);white-space:nowrap;margin-left:auto}
.st-xp .st-i{width:15px;height:15px;color:var(--amber)}
.st-xp b{color:var(--fg)}
.st-dots{margin-left:12px}

/* toasts, confetti */
.st-toast{position:fixed;right:20px;bottom:24px;z-index:9999;display:flex;align-items:center;gap:10px;padding:12px 18px;border-radius:14px;
  background:#111827;color:#fff;box-shadow:0 18px 40px -14px rgba(0,0,0,.5);animation:st-tin .35s var(--lift,ease) both;font-size:14px}
.st-toast b{font-size:16px}.st-toast span{opacity:.8}
.st-toast .st-i{color:#FBBF24}
.st-toast.gold{background:linear-gradient(120deg,#B45309,#F59E0B)}.st-toast.gold .st-i{color:#fff}
.st-toast.out{opacity:0;transform:translateY(10px);transition:.4s}
@keyframes st-tin{from{opacity:0;transform:translateY(16px) scale(.96)}to{opacity:1;transform:none}}
.st-confetti{position:fixed;inset:0;pointer-events:none;z-index:9998;overflow:hidden}
.st-confetti i{position:absolute;top:-12px;width:9px;height:14px;border-radius:2px;animation:st-fall linear forwards}
@keyframes st-fall{to{top:105%;transform:rotate(720deg) translateX(40px)}}

/* home scoreboard */
.st-board{display:grid;grid-template-columns:1.1fr .8fr 1.6fr;gap:14px;margin-bottom:30px}
.st-board>div{background:var(--paper);border:1px solid var(--line-soft);border-radius:18px;padding:18px}
.st-rank{display:flex;gap:14px;align-items:center}
.st-rank>div{flex:1;display:grid;gap:5px}
.st-rank small{color:var(--fg-dim);font-size:12.5px}
.st-rank b{font-family:var(--f-display);font-size:1.5rem;line-height:1.1}
.st-medal{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;color:#fff;flex:none;
  background:radial-gradient(circle at 30% 30%,#FCD34D,#B45309);box-shadow:0 10px 24px -10px #B45309}
.st-medal .st-i{width:28px;height:28px}
.st-prog{display:grid;align-content:center;gap:4px}
.st-prog>b{font-family:var(--f-display);font-size:2.3rem;line-height:1}.st-prog>b small{font-size:1rem;color:var(--fg-dim)}
.st-prog>span{color:var(--fg-dim);font-size:14px}.st-prog>small{color:var(--fg-dim);font-size:12.5px}
.st-prog .st-btn{--h:var(--accent);justify-self:start;margin-top:6px}
.st-shelf{grid-column:3;grid-row:1/3}
.st-shelf>small{display:block;color:var(--fg-dim);font-size:12.5px;margin-bottom:10px}
.st-shelf>div{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:10px}
.st-badge{display:grid;justify-items:center;gap:5px;background:none;border:0;cursor:pointer;font:inherit;color:var(--fg-faint);padding:0}
.st-badge .st-i{width:44px;height:44px;padding:11px;border-radius:50%;background:var(--line-soft);color:var(--fg-faint);filter:grayscale(1);transition:.3s}
.st-badge span{font-size:10.5px;line-height:1.2;text-align:center;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.st-badge.got .st-i{background:var(--h);color:#fff;filter:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--h) 30%,transparent),0 8px 18px -8px var(--h)}
.st-badge.got span{color:var(--fg)}
.st-badge:hover .st-i{transform:scale(1.08)}
.st-how{grid-column:1/3;font-size:13px;color:var(--fg-dim);display:grid;gap:4px}
.st-how b{color:var(--fg);font-size:14px}
.st-keys{display:block;color:var(--fg-dim);font-size:12.5px;margin-top:8px}

/* certificate */
.st-modal{position:fixed;inset:0;z-index:9990;background:rgba(10,12,20,.6);display:grid;place-items:center;padding:16px;animation:st-pop .3s both}
.st-cert{position:relative;max-width:720px;width:100%;background:#fff;color:#101317;border-radius:20px;padding:44px 40px 32px;text-align:center;
  border:10px solid #EEF0FF;box-shadow:0 30px 80px -20px rgba(0,0,0,.6)}
.st-cert .st-close{position:absolute;right:14px;top:14px;color:#101317;background:#fff}
.st-clogo{height:30px;margin-bottom:12px}
.st-cert>small{display:block;letter-spacing:.14em;text-transform:uppercase;font-size:11.5px;color:#676C78}
.st-cert h2{font-family:var(--f-display);font-size:2rem;margin:10px 0 6px}
.st-cert p{color:#3D4250;margin:8px auto;max-width:520px}
.st-cname{font-family:var(--f-display);font-size:1.9rem;text-align:center;border:0;border-bottom:2px solid #2D26D6;width:80%;padding:6px;margin:6px 0 4px;outline:none;color:#101317;background:transparent}
.st-cfoot{display:flex;justify-content:space-between;align-items:center;margin:22px 0 18px;font-size:13px;color:#676C78;border-top:1px solid #E5E7EB;padding-top:14px}
.st-cfoot .st-i{width:34px;height:34px;color:#B45309}
.st-cert .st-print{--h:#2D26D6}
@media print{body.st-printing>*:not(.st-modal){display:none!important}body.st-printing .st-modal{position:static;background:none}
  body.st-printing .st-close,body.st-printing .st-print{display:none}}

/* product screens with hotspots */
.st-screen{display:grid;grid-template-columns:1.55fr 1fr;gap:20px;align-items:start}
.st-shot{border-radius:14px;overflow:hidden;border:1px solid var(--line);background:#fff;box-shadow:0 22px 48px -26px rgba(16,19,23,.45);position:relative}
.st-bar3{display:flex;align-items:center;gap:6px;padding:8px 12px;background:#F1F2F6;border-bottom:1px solid #E3E5EA}
.st-bar3 i{width:10px;height:10px;border-radius:50%;background:#D7DAE0}.st-bar3 i:first-child{background:#F87171}.st-bar3 i:nth-child(2){background:#FBBF24}.st-bar3 i:nth-child(3){background:#34D399}
.st-bar3 span{margin-left:8px;font-size:12px;font-weight:600;color:#4B5160}
.st-img{position:relative}
.st-img img{display:block;width:100%;height:auto}
.st-pin{position:absolute;transform:translate(-50%,-50%);width:30px;height:30px;border-radius:50%;border:2px solid #fff;background:var(--h);color:#fff;
  font:700 13px/1 var(--f-body);cursor:pointer;box-shadow:0 6px 14px -4px rgba(0,0,0,.45);animation:st-pulse 2s infinite}
.st-pin.seen{animation:none;opacity:.75}
.st-pin.on{animation:none;opacity:1;transform:translate(-50%,-50%) scale(1.25);box-shadow:0 0 0 6px color-mix(in srgb,var(--h) 30%,transparent)}
@keyframes st-pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--h) 55%,transparent)}70%{box-shadow:0 0 0 12px transparent}100%{box-shadow:0 0 0 0 transparent}}
.st-demo{position:absolute;right:8px;bottom:8px;font-size:11px;background:rgba(17,24,39,.75);color:#fff;padding:3px 8px;border-radius:6px}
.st-pins{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.st-pins li{display:flex;gap:12px;padding:10px 12px;border-radius:12px;border:1px solid var(--line);cursor:pointer;transition:.2s;opacity:.7}
.st-pins li.seen{opacity:1}
.st-pins li.on{opacity:1;border-color:var(--h);background:color-mix(in srgb,var(--h) 7%,var(--bg));box-shadow:0 10px 24px -18px var(--h)}
.st-pins .n{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--h);color:#fff;font-weight:700;font-size:12.5px}
.st-pins b{display:block;font-size:14.5px}
.st-pins small{display:none;color:var(--fg-dim);font-size:13.5px;line-height:1.45;margin-top:3px}
.st-pins li.on small{display:block;animation:st-pop .3s both}

/* diagram shell */
.st-dg{margin-top:4px}
.st-dpanel{display:flex;gap:10px;align-items:flex-start;margin-top:16px;padding:14px 16px;border-radius:14px;background:var(--paper);border:1px dashed var(--line-strong);font-size:15px;min-height:52px}
.st-dpanel .st-i{color:var(--h);margin-top:2px}
.st-dpanel em{color:var(--fg-dim)}

/* stack */
.st-stack{display:flex;align-items:stretch;gap:0;overflow-x:auto;padding:6px 2px 10px}
.st-col{flex:1 1 0;min-width:128px;display:flex;flex-direction:column;gap:8px;align-items:flex-start;text-align:left;font:inherit;color:inherit;cursor:pointer;
  padding:14px;border-radius:16px;border:1px solid var(--line);background:var(--bg);transition:.25s}
.st-col:hover,.st-col.on{border-color:var(--h);transform:translateY(-3px);box-shadow:0 16px 30px -20px var(--h)}
.st-col.hub{background:linear-gradient(160deg,color-mix(in srgb,var(--h) 16%,var(--bg)),var(--bg));border-color:color-mix(in srgb,var(--h) 45%,var(--line))}
.st-col b{font-size:14.5px}
.st-chips{display:flex;flex-wrap:wrap;gap:5px}
.st-chips em{font-style:normal;font-size:11.5px;font-weight:600;padding:3px 7px;border-radius:6px;background:var(--paper-2);color:var(--fg)}
.st-chips em.lg{background:#fff;border:1px solid var(--line-soft);padding:3px 5px}
.st-chips em.lg img{height:16px;width:auto;display:block}
.st-flow{flex:0 0 26px;position:relative;align-self:center;height:4px;background:color-mix(in srgb,var(--h) 25%,transparent);border-radius:4px;overflow:hidden}
.st-flow i{position:absolute;top:0;left:-30%;width:30%;height:100%;background:var(--h);border-radius:4px;animation:st-run 1.4s linear infinite}
.st-flow i:nth-child(2){animation-delay:.45s}.st-flow i:nth-child(3){animation-delay:.9s}
@keyframes st-run{to{left:110%}}

/* golden record */
.st-golden{display:grid;gap:14px;justify-items:center}
.st-srcs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;width:100%;transition:.6s}
.st-rec{padding:12px 14px;border-radius:14px;border:1px solid var(--line);background:var(--bg);display:grid;gap:5px;font-size:13.5px;transition:.6s var(--lift,ease)}
.st-rec>b{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--h)}
.st-rec small,.st-gold small{display:block;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-faint)}
.st-gold{display:none;width:min(720px,100%);grid-template-columns:repeat(3,1fr);gap:10px;padding:16px;border-radius:18px;
  background:linear-gradient(140deg,color-mix(in srgb,#F59E0B 14%,var(--bg)),var(--bg));border:2px solid #F59E0B;box-shadow:0 18px 40px -22px #B45309}
.st-gh{grid-column:1/-1;display:flex;align-items:center;gap:8px}.st-gh .st-i{color:#B45309}.st-gh em{margin-left:auto;font-style:normal;font-size:12.5px;font-weight:700;color:#B45309}
.st-gold>span{display:grid;gap:2px;font-size:14px}.st-gold>span i{font-style:normal;font-size:11.5px;color:var(--signal)}
.st-golden.resolved .st-rec{opacity:.35;transform:scale(.92)}
.st-golden.resolved .st-gold{display:grid;animation:st-pop .6s var(--lift,ease) both}
.st-golden .st-btn{--h:#B45309}

/* trace */
.st-trace{display:grid;gap:10px;max-width:880px}
.st-step{display:none;gap:14px;align-items:flex-start;padding:14px 16px;border-radius:14px;border:1px solid var(--line);background:var(--bg);position:relative}
.st-step.on{display:flex;animation:st-pop .45s var(--lift,ease) both}
.st-step+.st-step.on::before{content:"";position:absolute;left:36px;top:-11px;width:2px;height:10px;background:var(--h)}
.st-step small{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--h)}
.st-step b{display:block;font-size:16px;margin:2px 0}
.st-step p{margin:0;color:var(--fg-dim);font-size:14px}
.st-trace .st-btn{justify-self:start}

/* value tree */
.st-vt{display:grid;gap:12px;justify-items:center}
.st-vr{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.st-vr.two{display:grid;grid-template-columns:1fr 1fr;gap:20px;width:100%}
.st-vr.two>div{display:grid;gap:10px;justify-items:center;padding:12px;border-radius:16px;background:var(--paper)}
.st-vn{font:inherit;font-weight:700;font-size:14.5px;cursor:pointer;padding:10px 18px;border-radius:12px;border:1.5px solid color-mix(in srgb,var(--h) 45%,var(--line));
  background:var(--bg);color:var(--fg);transition:.2s}
.st-vn:hover,.st-vn.on{background:var(--h);color:#fff;border-color:var(--h);transform:translateY(-2px)}
.st-vt .st-dpanel{width:100%}

/* 60-day gantt */
.st-gantt{position:relative;display:grid;gap:12px;padding-top:26px;padding-bottom:26px}
.st-gw{position:absolute;left:110px;right:0;top:0;height:20px}
.st-gw span{position:absolute;font-size:11.5px;color:var(--fg-faint);transform:translateX(-50%)}
.st-gr{display:grid;grid-template-columns:100px 1fr;gap:10px;align-items:center}
.st-gr>b{font-size:14px}
.st-gt{position:relative;height:40px;border-radius:10px;background:var(--paper);overflow:hidden}
.st-gb{position:absolute;top:4px;bottom:4px;left:var(--a);width:0;border-radius:8px;background:linear-gradient(90deg,var(--h),color-mix(in srgb,var(--h) 70%,#000));
  display:flex;align-items:center;overflow:hidden;animation:st-grow .9s var(--lift,ease) forwards;animation-delay:var(--d)}
.st-gb span{color:#fff;font-size:12.5px;font-weight:600;padding:0 10px;white-space:nowrap}
@keyframes st-grow{to{width:var(--w)}}
.st-g60{position:absolute;top:18px;bottom:-6px;width:0;border-left:2px dashed var(--h)}
.st-g60 span{position:absolute;right:6px;bottom:-24px;background:var(--bg);padding:0 4px;white-space:nowrap;font-size:12px;font-weight:700;color:var(--h)}

/* land and expand stairs */
.st-stairs{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;align-items:end;min-height:300px}
.st-stair{display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:14px 14px 4px 4px;color:#fff;
  min-height:calc(110px + var(--k) * 42px);background:linear-gradient(180deg,var(--h),color-mix(in srgb,var(--h) 65%,#000))}
.st-stair .st-ib{background:rgba(255,255,255,.18);color:#fff}
.st-stair b{font-size:15.5px}.st-stair small{opacity:.9;font-size:13px;line-height:1.4}

/* AI nest */
.st-nest{position:relative;max-width:760px;margin:0 auto}
.st-ring{display:block;width:100%;font:inherit;cursor:pointer;text-align:left;padding:30px 18px 18px;border-radius:26px;border:2px solid;transition:.25s;position:relative}
.st-ring>span{position:absolute;left:18px;top:8px;font-weight:700;font-size:13.5px;letter-spacing:.02em}
.st-ring.r0{border-color:#C7D2FE;background:#EEF2FF;color:#3730A3}
.st-ring.r1{border-color:#A5B4FC;background:#E0E7FF;color:#3730A3;margin-top:4px}
.st-ring.r2{border-color:#818CF8;background:#C7D2FE;color:#312E81;margin-top:4px}
.st-ring.r3{border-color:#4F46E5;background:#4F46E5;color:#fff;min-height:64px;margin-top:4px}
.st-ring.on{box-shadow:0 0 0 4px rgba(79,70,229,.35)}
.st-base{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:10px;padding:10px;border-radius:12px;background:#0F766E;color:#fff;font-weight:600;font-size:14px}
:root[data-theme="dark"] .st-ring.r0{background:#1E1B4B;border-color:#3730A3;color:#C7D2FE}
:root[data-theme="dark"] .st-ring.r1{background:#272463;color:#C7D2FE}
:root[data-theme="dark"] .st-ring.r2{background:#312E81;color:#E0E7FF}

/* proof wall and flashcards (shared flip) */
.st-proof,.st-flips{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.st-flips{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.st-pc,.st-fc{position:relative;min-height:190px;border:0;padding:0;background:none;cursor:pointer;font:inherit;color:inherit;perspective:900px;text-align:left}
.st-pf,.st-pb,.st-ff,.st-fb2{position:absolute;inset:0;border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:6px;backface-visibility:hidden;
  transition:transform .6s var(--lift,ease);border:1px solid var(--line);background:var(--bg)}
.st-pb,.st-fb2{transform:rotateY(180deg);background:linear-gradient(150deg,var(--h),color-mix(in srgb,var(--h) 60%,#000));color:#fff;border-color:transparent}
.st-pc.flip .st-pf,.st-fc.flip .st-ff{transform:rotateY(-180deg)}
.st-pc.flip .st-pb,.st-fc.flip .st-fb2{transform:rotateY(0)}
.st-lg{height:38px;display:flex;align-items:center;margin-bottom:4px;background:#fff;border-radius:8px;padding:4px 8px;align-self:flex-start}
.st-lg img{height:26px;width:auto;max-width:130px;object-fit:contain}
.st-lg.dark{background:#0F172A}
.st-pf b{font-size:15px}.st-pf small{color:var(--fg-dim);font-size:12.5px}
.st-pf em{font-style:normal;font-weight:600;font-size:14px;line-height:1.35;margin-top:auto}
.st-pf i,.st-ff i{display:flex;align-items:center;gap:5px;font-style:normal;font-size:11.5px;color:var(--fg-faint)}
.st-pf i .st-i,.st-ff i .st-i{width:13px;height:13px}
.st-pb small{opacity:.8;font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.st-pb span{font-size:13.5px;line-height:1.45}.st-pb em{font-style:normal;font-size:12.5px;opacity:.9;margin-top:auto}
.st-ff{font-weight:600;font-size:15.5px;line-height:1.4;justify-content:center}
.st-ff small{position:absolute;top:12px;left:14px;font-size:11px;color:var(--fg-faint);font-weight:600}
.st-ff i{position:absolute;bottom:12px;left:14px}
.st-fb2{font-size:14.5px;line-height:1.5;justify-content:center;overflow:auto}

/* match */
.st-match{display:grid;grid-template-columns:1fr 1fr;gap:16px 40px;position:relative}
.st-ml,.st-mr{display:grid;gap:10px;align-content:start}
.st-mi{font:inherit;font-size:14.5px;text-align:left;cursor:pointer;padding:12px 14px;border-radius:12px;border:1.5px solid var(--line);background:var(--bg);color:var(--fg);transition:.2s;line-height:1.35}
.st-mi:hover{border-color:var(--h)}
.st-mi.sel{border-color:var(--h);background:color-mix(in srgb,var(--h) 10%,var(--bg));box-shadow:0 0 0 3px color-mix(in srgb,var(--h) 20%,transparent)}
.st-mi.done{border-color:var(--signal);background:color-mix(in srgb,var(--signal) 10%,var(--bg));cursor:default;opacity:.85}
.st-mi.bad{border-color:var(--critical);animation:st-shake .4s}
.st-mscore{margin-top:14px;font-size:13.5px;color:var(--fg-dim)}.st-mscore span{font-weight:700;color:var(--fg)}

/* sort */
.st-sort{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.st-si{padding:14px;border-radius:14px;border:1px solid var(--line);background:var(--bg);display:flex;flex-direction:column;gap:10px;transition:.25s}
.st-si p{margin:0;font-size:14.5px;font-weight:500;line-height:1.4}
.st-sb{display:flex;flex-wrap:wrap;gap:6px}
.st-sb button{font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;padding:6px 10px;border-radius:999px;border:1px solid var(--line-strong);background:var(--bg);color:var(--fg)}
.st-sb button:hover{border-color:var(--h);color:var(--h)}
.st-sb button.right{background:var(--signal);border-color:var(--signal);color:#fff}
.st-sb button.bad{background:var(--critical);border-color:var(--critical);color:#fff;animation:st-shake .4s}
.st-sw{display:none;color:var(--fg-dim);font-size:13px;line-height:1.45}
.st-si.done{border-color:var(--signal);background:color-mix(in srgb,var(--signal) 6%,var(--bg))}
.st-si.done .st-sw{display:block;animation:st-pop .3s both}
.st-si.done .st-sb button:not(.right){opacity:.35;pointer-events:none}

@media (max-width:980px){
  .st-board{grid-template-columns:1fr 1fr}.st-shelf{grid-column:1/-1;grid-row:auto}.st-how{grid-column:1/-1}
  .st-screen{grid-template-columns:1fr}
  .st-proof{grid-template-columns:repeat(2,1fr)}
  .st-stairs{grid-template-columns:repeat(3,1fr);min-height:0}.st-stair{min-height:120px}
}
@media (max-width:640px){
  .st-board{grid-template-columns:1fr}
  .st-xp{display:none}
  .st-srcs,.st-gold{grid-template-columns:1fr}
  .st-vr.two,.st-match{grid-template-columns:1fr}
  .st-stairs{grid-template-columns:1fr}
  .st-proof{grid-template-columns:1fr}
  .st-stack{flex-direction:column}.st-flow{flex-basis:18px;width:4px;height:18px;align-self:center}
  .st-gr{grid-template-columns:70px 1fr}.st-gw{left:80px}.st-gb span{font-size:11px}
  .st-so{flex-direction:column;align-items:flex-start;gap:4px}
}

/* ══ narrator (scripts/narrator.js) ══════════════════════════════ */
.st-nr{position:relative;display:flex;gap:6px;align-items:center}
.st-nr .st-x.on{background:var(--h);border-color:var(--h);color:#fff}
.st-nr [data-listen].on{animation:st-pulse 2s infinite}
.st-nrset{position:absolute;right:0;top:calc(100% + 8px);z-index:20;width:300px;display:grid;gap:12px;padding:14px;border-radius:14px;
  background:var(--bg);border:1px solid var(--line);box-shadow:0 20px 40px -20px rgba(0,0,0,.4);font-size:13px}
.st-nrset label{display:grid;gap:5px;font-weight:600}
.st-nrset select,.st-nrset input[type=range]{width:100%;font:inherit;font-weight:400}
.st-nrset select{padding:6px;border-radius:8px;border:1px solid var(--line-strong);background:var(--bg);color:var(--fg)}
.st-nrset output{font-weight:400;color:var(--fg-dim)}
.st-nrset .st-hands{display:flex;gap:8px;align-items:flex-start;font-weight:500;line-height:1.35}
.nr-reading{outline:3px solid color-mix(in srgb,var(--h,var(--accent)) 55%,transparent)!important;outline-offset:3px;border-radius:12px;
  background-color:color-mix(in srgb,var(--h,var(--accent)) 7%,transparent);transition:outline-color .2s,background-color .2s}
@media (max-width:640px){.st-nr .st-x span{display:none}.st-mod span{max-width:38vw}}

/* ══ industry intel board ═════════════════════════════════════════ */
.st-ichips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.st-ichips button{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:13px;font-weight:600;cursor:pointer;padding:7px 11px;border-radius:999px;
  border:1px solid var(--line);background:var(--bg);color:var(--fg);transition:.2s}
.st-ichips button .st-i{width:15px;height:15px;color:var(--h)}
.st-ichips button:hover{border-color:var(--h)}
.st-ichips button.on{background:var(--h);border-color:var(--h);color:#fff}.st-ichips button.on .st-i{color:#fff}
.st-iboard{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--bg)}
.st-ihead{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;background:linear-gradient(90deg,color-mix(in srgb,var(--h) 12%,var(--bg)),var(--bg))}
.st-ihead b{font-size:1.15rem}.st-ihead p{margin:4px 0 0;color:var(--fg-dim);font-size:14.5px;line-height:1.5}
.st-itabs{display:flex;gap:2px;overflow-x:auto;border-bottom:1px solid var(--line-soft);padding:0 10px}
.st-itabs button{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:13.5px;font-weight:600;cursor:pointer;padding:11px 12px;border:0;background:none;
  color:var(--fg-dim);border-bottom:2px solid transparent;white-space:nowrap}
.st-itabs button .st-i{width:16px;height:16px}
.st-itabs button.on{color:var(--h);border-bottom-color:var(--h)}
.st-ipanel{padding:16px 18px;animation:st-pop .35s both}
.st-ishape{margin:0 0 14px;font-size:15px;line-height:1.55}
.st-idrv{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.st-idrv>div{padding:12px;border-radius:12px;background:var(--paper)}
.st-idrv b{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--h);margin-bottom:6px}
.st-idrv p{margin:0 0 8px;font-size:13.5px;line-height:1.45;color:var(--fg-dim)}.st-idrv strong{color:var(--fg)}
.st-ileaks,.st-iai,.st-iproof{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.st-ileaks>div,.st-iai>div,.st-iproof>div,.st-isys>div{padding:12px 14px;border-radius:12px;border:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.st-ileaks b,.st-iai b,.st-iproof b{font-size:14.5px}
.st-ileaks p,.st-iai p,.st-iproof p,.st-isys p{margin:0;font-size:13.5px;line-height:1.45;color:var(--fg-dim)}
.st-ileaks span{display:flex;gap:6px;align-items:flex-start;font-size:13px;font-weight:600;color:var(--signal);margin-top:auto}
.st-ileaks span .st-i{width:15px;height:15px;flex:none;margin-top:1px}
.st-isys{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.st-isys b{display:flex;gap:6px;align-items:center;font-size:14px}.st-isys b .st-i{width:16px;height:16px;color:var(--h)}
.st-ient,.st-ipit{margin:12px 0 0;font-size:13.5px;line-height:2}
.st-ient em,.st-ipit em{font-style:normal;font-size:12px;font-weight:600;padding:3px 8px;border-radius:6px;background:var(--paper-2);margin:0 4px 0 0;white-space:nowrap}
.st-ipit em{background:color-mix(in srgb,var(--critical) 10%,var(--bg));color:var(--critical)}
.st-iq{margin:0 0 12px;padding-left:22px;display:grid;gap:8px;font-size:15px;line-height:1.5}
.st-iq li::marker{color:var(--h);font-weight:700}
.st-iai b{display:flex;gap:6px;align-items:center}.st-iai b .st-i{width:16px;height:16px;color:var(--h)}
.st-iai em{font-size:13px;color:var(--fg);margin-top:auto}
.st-ishift{margin:12px 0 0;padding-left:18px;font-size:13.5px;color:var(--fg-dim);display:grid;gap:4px}
.st-iproof em{font-style:normal;font-size:12.5px;color:var(--fg-dim)}
.st-inone{display:flex;gap:10px;padding:14px;border-radius:12px;background:color-mix(in srgb,var(--amber) 8%,var(--bg));border:1px dashed var(--amber);margin-bottom:12px}
.st-inone .st-i{color:var(--amber)}.st-inone p{margin:0;font-size:14px;line-height:1.5}
.st-ipanel .st-links{margin-top:12px}
@media (max-width:980px){.st-idrv{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.st-idrv{grid-template-columns:1fr}.st-itabs button span{display:none}.st-ichips button span{font-size:12px}}
.st-nrset[hidden],.st-nr[hidden]{display:none!important}

/* "Do it in Zoho and the Sales app" slide */
.st-tools{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.st-tcol{padding:18px 20px;border-radius:18px;border:1px solid var(--line);display:flex;flex-direction:column;gap:10px}
.st-tcol.zoho{background:linear-gradient(160deg,color-mix(in srgb,#E42527 7%,var(--bg)),var(--bg))}
.st-tcol.app{background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 8%,var(--bg)),var(--bg))}
.st-tcol h4{display:flex;align-items:center;gap:10px;margin:0;font-size:1.05rem}
.st-tlogo{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#fff;padding:4px 9px;border-radius:7px;background:#E42527}
.st-tcol.app .st-tlogo{background:var(--accent)}
.st-tcol ul{margin:0;padding-left:18px;display:grid;gap:8px;font-size:15px;line-height:1.5}
.st-tlink{margin-top:auto;display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:14px;color:var(--h);text-decoration:none}
.st-tlink .st-i{width:16px;height:16px}
@media (max-width:640px){.st-tools{grid-template-columns:1fr}}

/* figure slide (product image + numbered callouts) */
.st-figure{display:grid;grid-template-columns:1.4fr 1fr;gap:20px;align-items:start}
.st-figure figure{margin:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 22px 48px -26px rgba(16,19,23,.45)}
.st-figure img{display:block;width:100%;height:auto}
.st-figure figcaption{padding:8px 12px;font-size:12.5px;color:#4B5160;background:#F4F5F7;border-top:1px solid #E3E5EA}
.st-fpts{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.st-fpts li{display:flex;gap:12px;padding:11px 13px;border-radius:12px;border:1px solid var(--line);background:var(--bg)}
.st-fpts .n{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--h);color:#fff;font-weight:700;font-size:12.5px}
.st-fpts b{display:block;font-size:14.5px}.st-fpts small{display:block;color:var(--fg-dim);font-size:13.5px;line-height:1.45;margin-top:2px}

/* fabric diagram: stages and layers */
.st-fab{display:grid;gap:8px}
.st-fst{display:grid;grid-template-columns:96px 1fr;gap:10px;align-items:center}
.st-fsn{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:var(--h);border-radius:10px;padding:10px 8px;text-align:center}
.st-fls{display:flex;flex-wrap:wrap;gap:6px}
.st-fl{font:inherit;font-size:13px;font-weight:600;cursor:pointer;padding:8px 12px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--fg);display:inline-flex;gap:7px;align-items:center;transition:.2s}
.st-fl em{font-style:normal;font-size:11px;font-weight:800;color:var(--h);min-width:14px}
.st-fl:hover,.st-fl.on{border-color:var(--h);background:color-mix(in srgb,var(--h) 10%,var(--bg))}
.st-fl.on{box-shadow:0 0 0 3px color-mix(in srgb,var(--h) 20%,transparent)}
.st-fab+.st-dpanel a{color:var(--h);font-weight:600;margin-left:6px}
@media (max-width:980px){.st-figure{grid-template-columns:1fr}}
@media (max-width:640px){.st-fst{grid-template-columns:1fr}}

/* links between the four role academies */
.st-sibs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:18px}
.st-sibs span{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-dim);margin-right:4px}
.st-sibs a{font-size:13.5px;font-weight:600;padding:7px 13px;border-radius:999px;border:1px solid var(--line);color:var(--fg);text-decoration:none;background:var(--bg)}
.st-sibs a:hover{border-color:var(--accent);color:var(--accent)}
.st-sibs a[aria-current]{background:var(--accent);border-color:var(--accent);color:#fff}

/* labs slide */
.st-labs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.st-lab{display:flex;flex-direction:column;gap:6px;padding:16px;border-radius:16px;border:1px solid var(--line);background:var(--bg);text-decoration:none;color:var(--fg);transition:.2s}
.st-lab:hover{border-color:var(--h);transform:translateY(-2px);box-shadow:0 14px 28px -18px var(--h)}
.st-lab b{font-size:15.5px}.st-lab small{color:var(--fg-dim);font-size:13.5px;line-height:1.45}
.st-lab em{font-style:normal;font-size:12px;font-weight:600;color:var(--h);margin-top:auto}
.st-lgo{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:600;color:var(--fg)}
.st-lgo .st-i{width:14px;height:14px}
@media (max-width:980px){.st-labs{grid-template-columns:1fr}}

/* learner record + exam */
.st-me{grid-column:1/3;display:grid;gap:6px;justify-items:start}
.st-me b{display:flex;align-items:center;gap:6px;font-size:14.5px}.st-me b .st-i{color:var(--signal);width:16px;height:16px}
.st-me small{color:var(--fg-dim);font-size:13px}
.st-me .st-btn,.st-exam .st-btn{--h:var(--accent)}
.st-exam{text-align:left;max-width:760px}
.st-exam h3{font-size:1.15rem;line-height:1.4;margin:14px 0}
.st-exam .st-qb{width:100%}
.st-exam .st-track{display:block;margin-top:8px}
.st-form{display:grid;gap:10px;margin:12px 0}
.st-form label{display:grid;gap:4px;font-size:13px;font-weight:600;color:#3D4250}
.st-form input{font:inherit;font-size:15px;padding:9px 11px;border-radius:9px;border:1px solid #C5C9D2}
.st-err{color:#B3261E;font-size:13.5px;min-height:1em}
.st-verify{font-size:12.5px;color:#676C78;margin-top:-6px}
@media (max-width:980px){.st-me{grid-column:1/-1}}

/* ── hands-on types: code, star, graph, tree, design lab ─────────── */
.st-code{display:grid;grid-template-columns:1.45fr 1fr;gap:18px;align-items:start}
.st-code.solo{grid-template-columns:1fr}
.st-cbox{border-radius:14px;overflow:hidden;background:#0F1420;border:1px solid #232B3B;min-width:0}
.st-cbar{display:flex;align-items:center;justify-content:space-between;padding:7px 10px 7px 14px;background:#161D2C;border-bottom:1px solid #232B3B}
.st-cbar>span{font:600 12px/1 var(--f-mono,ui-monospace,monospace);letter-spacing:.06em;text-transform:uppercase;color:#9AA6BD}
.st-ccopy{display:inline-flex;align-items:center;gap:5px;font:inherit;font-size:12px;color:#C9D2E3;background:transparent;border:1px solid #2E3850;border-radius:8px;padding:4px 9px;cursor:pointer}
.st-ccopy .st-i{width:14px;height:14px}
.st-cbox pre{margin:0;padding:14px 16px;line-height:1.5;font-size:13px;overflow:auto;max-height:min(52vh,460px)}
.st-cbox code{display:block;font:13px/1.5 var(--f-mono,ui-monospace,SFMono-Regular,Menlo,monospace);color:#E4E9F2;white-space:pre;background:none;padding:0;border:0}
.st-cbox .k{color:#7FB4FF;font-weight:600}.st-cbox .s{color:#A6E3A1}.st-cbox .c{color:#8792A8;font-style:italic}.st-cbox .p{color:#F5C27A}
.st-cnotes{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:cn}
.st-cnotes li{counter-increment:cn;display:grid;grid-template-columns:28px 1fr;gap:2px 10px;padding:11px 13px;border:1px solid var(--line);border-radius:12px;background:var(--bg)}
.st-cnotes li::before{content:counter(cn);grid-row:span 2;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font-weight:700;font-size:13px;color:#fff;background:var(--h)}
.st-cnotes b{font-size:14.5px}.st-cnotes small{color:var(--fg-dim);font-size:13.5px;line-height:1.45}

.st-star{position:relative;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,auto);gap:22px 26px;align-items:center}
.st-slines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.st-slines line{stroke:color-mix(in srgb,var(--h) 45%,transparent);stroke-width:1.6;stroke-dasharray:5 4;vector-effect:non-scaling-stroke}
.st-sfact,.st-sdim{position:relative;z-index:1;border-radius:14px;padding:12px 14px;text-align:left;font:inherit;color:inherit}
.st-sfact{background:color-mix(in srgb,var(--h) 12%,var(--bg));border:2px solid var(--h);box-shadow:0 18px 36px -22px color-mix(in srgb,var(--h) 70%,transparent)}
.st-sfact small,.st-sdim small{display:block;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--h)}
.st-sfact b{display:block;font-size:1.1rem;margin:2px 0}
.st-sfact em{display:block;font-style:normal;font-size:13px;color:var(--fg-dim);margin-bottom:6px}
.st-sm,.st-sk{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.st-sm i,.st-sk i{font-style:normal;font-size:12px;padding:2px 7px;border-radius:6px;background:var(--bg);border:1px solid var(--line)}
.st-sk i{display:inline-flex;align-items:center;gap:3px;color:var(--fg-dim)}.st-sk .st-i{width:11px;height:11px}
.st-sdim{background:var(--bg);border:1px solid var(--line);cursor:pointer;transition:border-color .2s,transform .2s}
.st-sdim b{display:block;font-size:14.5px;margin:2px 0 3px}
.st-sdim span{display:block;font-size:12.5px;color:var(--fg-dim);line-height:1.4}
.st-sdim:hover,.st-sdim.on{border-color:var(--h);transform:translateY(-2px)}
.st-sdim.on{background:color-mix(in srgb,var(--h) 7%,var(--bg))}

.st-graph{display:grid;gap:12px}
.st-gwrap{border:1px solid var(--line);border-radius:14px;background:var(--paper);overflow-x:auto}
.st-gwrap svg{display:block;width:100%;min-width:620px;height:auto}
.st-ge line{stroke:var(--line-strong);stroke-width:1.6}
.st-ge rect{fill:var(--paper);stroke:none}
.st-ge text{font:500 13px var(--f-body,system-ui);fill:var(--fg-dim);text-anchor:middle}
#st-arr-x path{fill:var(--line-strong)}
.st-gn{cursor:pointer;outline:none}
.st-gn rect{fill:var(--bg);stroke:var(--line-strong);stroke-width:1.6;transition:.2s}
.st-gn text{font:600 14px var(--f-body,system-ui);fill:var(--fg);text-anchor:middle;pointer-events:none}
.st-gn.k-class rect{fill:color-mix(in srgb,var(--h) 14%,var(--bg));stroke:var(--h)}
.st-gn.k-concept rect{fill:color-mix(in srgb,var(--signal) 12%,var(--bg));stroke:var(--signal)}
.st-gn.k-scheme rect{fill:color-mix(in srgb,var(--amber) 14%,var(--bg));stroke:var(--amber)}
.st-gn.k-literal rect{stroke-dasharray:4 3}
.st-gn:focus-visible rect{stroke-width:3}
.st-graph.focus .st-gn:not(.on):not(.near){opacity:.35}
.st-graph.focus .st-ge:not(.on){opacity:.2}
.st-gn.on rect{stroke-width:3}
.st-ge.on line{stroke:var(--h);stroke-width:2.4}.st-ge.on text{fill:var(--h);font-weight:700}
.st-glegend{display:flex;flex-wrap:wrap;gap:14px;font-size:12.5px;color:var(--fg-dim)}
.st-glegend span{display:inline-flex;align-items:center;gap:6px}
.st-glegend i{width:16px;height:11px;border-radius:6px;border:1.6px solid var(--line-strong);background:var(--bg)}
.st-glegend .k-class i{border-color:var(--h);background:color-mix(in srgb,var(--h) 14%,var(--bg))}
.st-glegend .k-concept i{border-color:var(--signal)}.st-glegend .k-scheme i{border-color:var(--amber)}
.st-glegend .k-instance i{border-radius:2px}.st-glegend .k-literal i{border-style:dashed;border-radius:2px}
.st-triples{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:6px}
.st-triples li{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:13px;padding:6px 10px;border-radius:9px;border:1px solid var(--line-soft);transition:.2s}
.st-triples span{font-weight:600}
.st-triples em{font-style:normal;font-family:var(--f-mono,ui-monospace,monospace);font-size:12px;color:var(--h)}
.st-triples em::before{content:"\2014 "}.st-triples em::after{content:" \2192"}
.st-triples li.on{border-color:var(--h);background:color-mix(in srgb,var(--h) 7%,var(--bg))}

.st-tree{border:1px solid var(--line);border-radius:14px;padding:14px 16px;background:var(--paper);max-height:min(56vh,520px);overflow:auto}
.st-tree ul{list-style:none;margin:0;padding:0}
.st-tree ul ul{margin-left:13px;padding-left:16px;border-left:1.5px dashed color-mix(in srgb,var(--h) 40%,transparent)}
.st-tree li{margin:5px 0}
.st-tree summary{cursor:pointer;list-style:none;display:flex;gap:8px;align-items:flex-start}
.st-tree summary::-webkit-details-marker{display:none}
.st-tree summary::before{content:"+";flex:none;width:20px;height:20px;border-radius:6px;display:grid;place-items:center;font-weight:700;font-size:13px;color:#fff;background:var(--h);margin-top:2px}
.st-tree details[open]>summary::before{content:"\2212"}
.st-tree li.leaf{display:flex;gap:8px;padding-left:2px}
.st-tree li.leaf::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:color-mix(in srgb,var(--h) 55%,transparent);margin:8px 6px 0 6px}
.st-tl b{font-size:14.5px;font-weight:600}
.st-tl small{display:block;color:var(--fg-dim);font-size:12.8px;line-height:1.4}

.st-build{display:grid;gap:14px}
.st-bbrief{display:flex;gap:12px;padding:14px 16px;border-radius:14px;background:color-mix(in srgb,var(--h) 9%,var(--bg));border:1px solid color-mix(in srgb,var(--h) 35%,transparent)}
.st-bbrief .st-i{color:var(--h);width:24px;height:24px;margin-top:2px}
.st-bbrief small{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--h)}
.st-bbrief p{margin:3px 0 0;font-size:15px;line-height:1.5}
.st-bsteps{margin:0;padding-left:22px;display:grid;gap:5px;font-size:14px;color:var(--fg-dim)}
.st-bdraft{display:grid;gap:6px;font-size:13px;font-weight:600;color:var(--fg-dim)}
.st-bdraft textarea{font:14px/1.5 var(--f-mono,ui-monospace,monospace);color:var(--fg);background:var(--bg);border:1px solid var(--line-strong);border-radius:12px;padding:12px;resize:vertical;width:100%;box-sizing:border-box}
.st-bdraft textarea:focus{outline:2px solid var(--h);outline-offset:1px}
.st-breveal{justify-self:start}
.st-bans{animation:st-pop .35s both}
.st-bans h4{display:flex;align-items:center;gap:8px;margin:6px 0 10px;font-size:15px}
.st-bans h4 .st-i{color:var(--h)}
.st-bgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.st-bgrid div{padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:var(--bg)}
.st-bgrid b{font-size:14px}.st-bgrid p{margin:4px 0 0;font-size:13.5px;line-height:1.45;color:var(--fg-dim)}
.st-bcheck{display:grid;gap:7px}
.st-bcheck label{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;padding:9px 12px;border-radius:11px;border:1px solid var(--line);cursor:pointer;font-size:14px}
.st-bcheck input{position:absolute;opacity:0;pointer-events:none}
.st-bcheck input:checked+.st-box{background:var(--h);border-color:var(--h);color:#fff}
.st-bcheck input:focus-visible+.st-box{outline:2px solid var(--h);outline-offset:2px}
.st-bscore{font-size:13px;color:var(--fg-dim);margin:8px 0 0}

@media (max-width:980px){.st-code{grid-template-columns:1fr}}
@media (max-width:640px){
  .st-star{grid-template-columns:1fr;gap:10px}.st-star>*{grid-area:auto!important}.st-slines{display:none}.st-sfact{order:-1}
  .st-triples{grid-template-columns:1fr}.st-cbox code{font-size:12px}
}

.st-trkh{margin:44px 0 18px;padding-top:26px;border-top:1px solid var(--line)}
.st-trkh span{display:inline-flex;align-items:center;gap:8px;font-family:var(--f-display);font-size:1.5rem;font-weight:700}
.st-trkh .st-i{color:var(--accent);width:24px;height:24px}
.st-trkh small{display:block;color:var(--fg-dim);font-size:14px;margin-top:4px}
.st-phase.trk .st-ph b{font-size:1.1rem}

.st-ph .st-tst{margin-left:auto;flex:none}
.st-tprog{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--fg-dim);border:1px dashed var(--line-strong);border-radius:999px;padding:5px 12px}
.st-tprog .st-i{width:15px;height:15px;color:var(--amber)}
.st-ctrk{font-family:var(--f-display);font-size:1.15rem;font-weight:700;color:var(--accent);margin:-4px 0 6px}
@media (max-width:640px){.st-ph{flex-wrap:wrap}.st-ph .st-tst{margin-left:56px}}

/* ══ industry common-foundation board ═════════════════════════════ */
.st-fstat{display:block;margin-top:6px;font-size:12.5px;font-weight:600;color:var(--h)}
.st-fh{margin:4px 0 10px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-dim)}
.st-fh:not(:first-child){margin-top:20px}
.st-fhint{display:flex;gap:8px;align-items:center;margin:0 0 12px;font-size:13.5px;color:var(--fg-dim)}
.st-fhint .st-i{width:16px;height:16px;color:var(--h);flex:none}
.st-fmods{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.st-fmods>div{padding:12px 14px;border-radius:12px;background:color-mix(in srgb,var(--h) 7%,var(--bg));border:1px solid color-mix(in srgb,var(--h) 25%,var(--line))}
.st-fmods b{display:flex;gap:6px;align-items:center;font-size:14.5px;margin-bottom:8px}.st-fmods b .st-i{width:17px;height:17px;color:var(--h)}
.st-fdoms{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.st-fdoms button{font:inherit;text-align:left;cursor:pointer;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--fg);display:flex;flex-direction:column;gap:6px;transition:.2s}
.st-fdoms button:hover{border-color:var(--h)}
.st-fdoms b{font-size:14px}.st-fdoms p{margin:0;font-size:13px;line-height:1.45;color:var(--fg-dim)}
.st-fdoms span{margin-top:auto;display:flex;gap:4px;align-items:center;font-size:12.5px;font-weight:600;color:var(--h)}.st-fdoms span .st-i{width:14px;height:14px}
.st-fdchips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.st-fdchips button{font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;padding:5px 10px;border-radius:999px;border:1px solid var(--line);background:var(--bg);color:var(--fg-dim)}
.st-fdchips button.on{background:var(--h);border-color:var(--h);color:#fff}
.st-fents{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.st-fent{padding:12px 14px;border-radius:12px;border:1px solid var(--line);display:flex;flex-direction:column;gap:7px;animation:st-pop .3s both}
.st-fent[hidden]{display:none}
.st-fent-h{display:flex;justify-content:space-between;gap:8px;align-items:baseline}.st-fent-h b{font-size:14.5px}.st-fent-h small{font-size:11.5px;color:var(--fg-dim);text-transform:uppercase;letter-spacing:.06em}
.st-fent p{margin:0;font-size:13px;line-height:1.45;color:var(--fg-dim)}
.st-fkey,.st-fsrc{display:flex;gap:6px;align-items:flex-start;font-size:12.5px}.st-fkey{font-weight:600;color:var(--fg)}.st-fsrc{color:var(--fg-dim);margin-top:auto}
.st-fkey .st-i,.st-fsrc .st-i{width:14px;height:14px;flex:none;color:var(--h);margin-top:1px}
.st-fent .st-chips em,.st-fmods .st-chips em,.st-ftaxs .st-chips em,.st-fareas .st-chips em,.st-ftrace .st-chips em{font-size:11.5px}
.st-fonto{display:grid;grid-template-columns:3fr 2fr;gap:18px}
.st-frels{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.st-frels li{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;background:var(--paper);font-size:13.5px}
.st-frels b{padding:2px 8px;border-radius:6px;border:1px solid var(--line);background:var(--bg)}.st-frels b.me{background:var(--h);border-color:var(--h);color:#fff}
.st-frels span{display:inline-flex;gap:4px;align-items:center;color:var(--fg-dim)}.st-frels span .st-i{width:14px;height:14px}
.st-frels em{margin-left:auto;font-style:normal;font-size:11.5px;font-weight:700;color:var(--h)}
.st-fis,.st-fis ul{list-style:none;margin:0;padding-left:14px;border-left:1px dashed var(--line)}
.st-fis{padding-left:0;border:0}.st-fis li{margin:5px 0;font-size:13.5px}.st-fis small{color:var(--fg-dim);font-size:12px}
.st-ftaxs{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.st-ftaxs>div{padding:12px 14px;border-radius:12px;border:1px solid var(--line);display:flex;flex-direction:column;gap:8px}
.st-ftaxs b{display:flex;gap:6px;align-items:center;font-size:14.5px}.st-ftaxs b .st-i{width:16px;height:16px;color:var(--h)}
.st-ftaxs p{margin:0;font-size:13px;line-height:1.5;color:var(--fg-dim)}.st-ftaxs small{font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--fg-dim)}
.st-flevels{display:flex;flex-wrap:wrap;align-items:center;gap:4px}.st-flevels span{font-size:12px;font-weight:600;padding:3px 8px;border-radius:6px;background:color-mix(in srgb,var(--h) 10%,var(--bg))}
.st-flevels .st-i{width:12px;height:12px;color:var(--fg-dim)}
.st-ftr{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.st-ftr button{font:inherit;font-size:13px;font-weight:600;cursor:pointer;padding:7px 11px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--fg)}
.st-ftr button.on{background:var(--h);border-color:var(--h);color:#fff}
.st-ftrace:empty{display:none}
.st-ftrace>div{padding:10px 14px;border-radius:12px;border:1px solid var(--h);background:color-mix(in srgb,var(--h) 6%,var(--bg));margin-bottom:10px;display:flex;flex-direction:column;gap:6px}
.st-ftrace p{margin:0;display:flex;gap:6px;align-items:flex-start;font-size:13.5px}.st-ftrace p .st-i{width:15px;height:15px;color:var(--h);flex:none;margin-top:2px}
.st-farch{display:grid;gap:6px}
.st-flayer{display:grid;grid-template-columns:200px 1fr;gap:10px;align-items:center;padding:8px 10px;border-radius:12px;border:1px solid var(--line-soft);background:var(--bg)}
.st-flayer.fnd{background:color-mix(in srgb,var(--h) 6%,var(--bg));border-color:color-mix(in srgb,var(--h) 30%,var(--line))}
.st-flh b{display:block;font-size:13.5px}.st-flh small{font-size:11.5px;color:var(--fg-dim)}
.st-fcomps{display:flex;flex-wrap:wrap;gap:5px}
.st-fcomps span{font-size:12px;font-weight:600;padding:4px 8px;border-radius:7px;border:1px solid var(--line);background:var(--bg);transition:.25s}
.st-farch.tracing .st-fcomps span{opacity:.35}
.st-farch.tracing .st-fcomps span.hit{opacity:1;background:var(--h);border-color:var(--h);color:#fff;box-shadow:0 2px 8px color-mix(in srgb,var(--h) 35%,transparent)}
.st-fcross{display:flex;flex-wrap:wrap;gap:8px;padding:8px 2px 0}
.st-fcross span{display:inline-flex;gap:5px;align-items:center;font-size:12px;font-weight:600;color:var(--fg-dim);padding:4px 9px;border-radius:999px;border:1px dashed var(--line)}
.st-fcross .st-i{width:13px;height:13px}
.st-frec{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.st-frec li{display:flex;gap:10px;padding:12px 14px;border-radius:12px;border:1px solid var(--line)}
.st-fn{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--h);color:#fff;font-weight:700;font-size:13px}
.st-frec b{display:block;font-size:14.5px}.st-frec small{display:block;font-size:12px;color:var(--fg-dim);margin:2px 0 6px;line-height:1.4}.st-frec p{margin:0;font-size:13.5px;line-height:1.45}
.st-fscroll{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
.st-ftab{width:100%;border-collapse:collapse;font-size:13px}
.st-ftab th{text-align:left;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-dim);background:var(--paper);padding:8px 10px;white-space:nowrap}
.st-ftab td{padding:8px 10px;border-top:1px solid var(--line-soft);vertical-align:top;line-height:1.45;min-width:110px}
.st-fareas{display:grid;gap:10px}
.st-fareas>div{padding:12px 14px;border-radius:12px;border:1px solid var(--line)}
.st-fareas>div>b{font-size:14.5px}
.st-fmed{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:8px 0}
.st-fmed>div{padding:8px;border-radius:10px;background:var(--paper)}
.st-fmed>div:nth-child(2){background:color-mix(in srgb,#B7791F 10%,var(--bg))}.st-fmed>div:nth-child(3){background:color-mix(in srgb,#94A3B8 16%,var(--bg))}.st-fmed>div:nth-child(4){background:color-mix(in srgb,#EAB308 13%,var(--bg))}
.st-fmed small{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--fg-dim);margin-bottom:4px}
.st-fctl{display:flex;gap:6px;align-items:flex-start;margin:0;font-size:13px;line-height:1.45;color:var(--fg-dim)}.st-fctl b{color:var(--fg)}
.st-fctl .st-i{width:15px;height:15px;color:var(--h);flex:none;margin-top:2px}
.st-fsurv{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.st-fsurv li{display:grid;grid-template-columns:180px 1fr;gap:10px;padding:8px 10px;border-radius:10px;background:var(--paper);font-size:13.5px;line-height:1.45}
.st-fwo{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.st-fwo>div{padding:12px 14px;border-radius:12px;border:1px solid color-mix(in srgb,var(--critical) 30%,var(--line));background:color-mix(in srgb,var(--critical) 4%,var(--bg))}
.st-fwo ul{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px}
.st-fwo li{display:flex;gap:6px;align-items:flex-start;font-size:13px;line-height:1.4;color:var(--fg-dim)}.st-fwo li .st-i{width:14px;height:14px;color:var(--critical);flex:none;margin-top:2px}
.st-fwith{display:flex;gap:10px;margin-top:12px;padding:12px 14px;border-radius:12px;background:color-mix(in srgb,var(--h) 8%,var(--bg));border:1px solid var(--h)}
.st-fwith .st-i{color:var(--h);flex:none}.st-fwith p{margin:0;font-size:14px;line-height:1.5}
@media (max-width:860px){.st-fonto{grid-template-columns:1fr}.st-flayer{grid-template-columns:1fr}.st-fmed{grid-template-columns:1fr 1fr}.st-fsurv li{grid-template-columns:1fr;gap:2px}}

/* download slide: reference templates the learner takes away */
.st-dlc{text-decoration:none;color:inherit;cursor:pointer}
.st-dlb{margin-top:auto;display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--h);padding-top:8px}
.st-dlb .st-i{width:14px;height:14px}