/* GTO Lab Next — one column, one accent, flat surfaces. Theme follows the system until the reader picks one; dark first. */

:root{
  color-scheme:dark;
  --bg:#0f0f10; --surface:#19191c; --surface-2:#222226; --line:#2b2b31;
  --fg:#f4f4f5; --muted:#a1a1aa; --faint:#6f6f78;
  --accent:#a6f4b4; --accent-ink:#0f0f10; --accent-soft:rgba(166,244,180,.10);
  --ok:#6ed68a; --no:#f07167; --ok-soft:rgba(110,214,138,.10); --no-soft:rgba(240,113,103,.10);
  /* four-color deck: spades stay light on dark, hearts red, diamonds blue, clubs green */
  --suit-s:#e4e4e7; --suit-h:#ff6b6b; --suit-d:#5b9dff; --suit-c:#4cc76a;
  /* actions (raise red, check and call green, fold blue, as in solver UIs); rest = hands outside the range.
     Check and call share the green family: one decision never offers both. All-in is the darkest purple. */
  --act-raise:#d9584d; --act-allin:var(--act-purple-4); --act-call:#3fae5c; --act-check:#3d9c5f; --act-fold:#4a78c9;
  --act-bluff:#9b6bd6; --act-value:#d9a441; --act-mix:#8a8a94; --act-rest:#26262b; --act-rest-ink:#6f6f78;
  /* bet sizes: red ramp for bets up to pot (small, medium, large, and one step deeper), purple ramp for overbets and jams (jam darkest) */
  --act-red-1:#e8948c; --act-red-2:#d9584d; --act-red-3:#a8312a; --act-red-4:#8a2822;
  --act-purple-1:#b48ef0; --act-purple-2:#9a6ce3; --act-purple-3:#7f4fcc; --act-purple-4:#5f33a8;
  /* default series colours for data charts */
  --act-chart-1:#6ed68a; --act-chart-2:#5b9dff; --act-chart-3:#e0a53c; --act-chart-4:#b48ef0; --act-chart-5:#f07167; --act-chart-6:#3cc6c0;
  --sans:'Poppins','Noto Sans SC','Microsoft YaHei',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,Consolas,monospace;
  --font-body:17px; --leading-body:1.9; --font-h1:34px; --font-h2:22px; --font-h3:18px;
  --font-small:13px; --font-caption:12px; --measure:680px; --nav-width:240px;
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
  --space-6:24px; --space-8:32px; --space-12:48px; --radius-frame:8px;
}
/* Light palette: used when the system is light and the reader has not picked dark, or when the reader picked light.
   index.html sets data-theme before first paint from the saved choice; no choice means "follow the system". */
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]){
  color-scheme:light;
  --bg:#f6f6f4; --surface:#ffffff; --surface-2:#f0f0ec; --line:#e3e3de;
  --fg:#18181b; --muted:#5f5f68; --faint:#8b8b94;
  --accent:#1f8f4e; --accent-ink:#ffffff; --accent-soft:rgba(31,143,78,.08);
  --ok:#1f8f4e; --no:#c2412d; --ok-soft:#ecf6ef; --no-soft:#fbecea;
  --suit-s:#18181b; --suit-h:#d7263d; --suit-d:#1b5fd1; --suit-c:#16893a;
  --act-raise:#e06a5f; --act-allin:var(--act-purple-4); --act-call:#2e9d51; --act-check:#3fa866; --act-fold:#3b6fc4;
  --act-bluff:#8455c7; --act-value:#c9902a; --act-mix:#7b7b85; --act-rest:#ecece7; --act-rest-ink:#9a9aa2;
  --act-red-1:#f0a39b; --act-red-2:#e06a5f; --act-red-3:#b93a32; --act-red-4:#99302a;
  --act-purple-1:#b996f2; --act-purple-2:#9b6fe0; --act-purple-3:#7a4ac6; --act-purple-4:#56299b;
  --act-chart-1:#1f8f4e; --act-chart-2:#1b5fd1; --act-chart-3:#b7791f; --act-chart-4:#7a4ac6; --act-chart-5:#c2412d; --act-chart-6:#13827d;
}}
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#f6f6f4; --surface:#ffffff; --surface-2:#f0f0ec; --line:#e3e3de;
  --fg:#18181b; --muted:#5f5f68; --faint:#8b8b94;
  --accent:#1f8f4e; --accent-ink:#ffffff; --accent-soft:rgba(31,143,78,.08);
  --ok:#1f8f4e; --no:#c2412d; --ok-soft:#ecf6ef; --no-soft:#fbecea;
  --suit-s:#18181b; --suit-h:#d7263d; --suit-d:#1b5fd1; --suit-c:#16893a;
  --act-raise:#e06a5f; --act-allin:var(--act-purple-4); --act-call:#2e9d51; --act-check:#3fa866; --act-fold:#3b6fc4;
  --act-bluff:#8455c7; --act-value:#c9902a; --act-mix:#7b7b85; --act-rest:#ecece7; --act-rest-ink:#9a9aa2;
  --act-red-1:#f0a39b; --act-red-2:#e06a5f; --act-red-3:#b93a32; --act-red-4:#99302a;
  --act-purple-1:#b996f2; --act-purple-2:#9b6fe0; --act-purple-3:#7a4ac6; --act-purple-4:#56299b;
  --act-chart-1:#1f8f4e; --act-chart-2:#1b5fd1; --act-chart-3:#b7791f; --act-chart-4:#7a4ac6; --act-chart-5:#c2412d; --act-chart-6:#13827d;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scrollbar-gutter:stable}
body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.75 var(--sans);font-variant-numeric:tabular-nums}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
button:disabled{cursor:default}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
h1,h2,p{margin:0}
kbd{font:500 11px var(--mono);color:var(--faint);border:1px solid var(--line);border-radius:3px;padding:0 5px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.dim{color:var(--faint)}.small{font-size:12.5px}.nowrap{white-space:nowrap}

/* Bar */
.bar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:32px;height:56px;padding-inline:24px;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.logo{font-weight:600;text-decoration:none;display:flex;gap:7px;align-items:center;flex-shrink:0;white-space:nowrap}
.logo img{display:block;width:48px;height:48px;object-fit:contain;image-rendering:pixelated}
.logo span{display:block;width:84px}
.logo em{font-style:normal;font-weight:500;color:var(--accent)}
.bar nav{display:flex;gap:4px}
.bar nav a{text-decoration:none;padding:5px 12px;border-radius:4px;color:var(--muted);font-weight:500;font-size:14px}
.bar nav a:hover{color:var(--fg)}
.bar nav a.on{background:var(--surface-2);color:var(--fg)}
/* "工具" opens a menu of the tools; the bar names the one in use */
.bar nav a[data-shell-menu-button]{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.bar .nav-current{color:var(--fg)}
.bar .nav-caret{flex:none;opacity:.7;transition:transform .12s}
.bar nav a[aria-expanded="true"]{color:var(--fg)}
.bar nav a[aria-expanded="true"] .nav-caret{transform:rotate(180deg)}
.nav-menu{position:absolute;top:calc(100% + 4px);z-index:20;min-width:240px;padding:var(--space-1);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-frame);box-shadow:0 10px 30px rgba(0,0,0,.22)}
.nav-menu[hidden]{display:none}
/* An invisible bridge up to the bar, so the pointer can cross from "工具" to the menu without leaving it. */
.nav-menu::before{content:"";position:absolute;left:0;right:0;top:-18px;height:18px}
.nav-menu a{display:block;padding:var(--space-2) var(--space-3);border-radius:6px;text-decoration:none;color:var(--fg)}
.nav-menu a:hover,.nav-menu a:focus-visible{background:var(--surface-2);outline:none}
.nav-menu a:focus-visible{box-shadow:inset 0 0 0 2px var(--accent)}
.nav-menu b{display:block;font-size:14px;font-weight:600;line-height:1.4}
.nav-menu span{display:block;font-size:var(--font-caption);color:var(--muted);line-height:1.5}
.nav-menu a[aria-current="page"] b{color:var(--accent)}
.nav-menu a[aria-current="page"] b::after{content:" ✓";font-weight:400}
/* On a phone the bar has no room for the tool name; the menu still marks the tool in use. */
@media (max-width:560px){.bar .nav-current{display:none}.nav-menu{min-width:0}}
.theme-toggle{margin-left:auto;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:var(--muted)}
.theme-toggle:hover{color:var(--fg);background:var(--surface-2)}
.theme-toggle svg{width:18px;height:18px}

main{max-width:1040px;margin:0 auto;padding:32px 16px 96px}
main.view-practice{max-width:760px}
.head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:18px}
h1{font-size:28px;font-weight:500;letter-spacing:-.4px;line-height:1.3;text-wrap:balance}
.stat{color:var(--muted);font-size:13px}.stat b{color:var(--fg);font-family:var(--mono);font-weight:500}

/* Filters */
.filters{display:grid;gap:8px;margin-bottom:18px}
.chips{display:flex;flex-wrap:wrap;gap:4px}
.chip{padding:4px 11px;border-radius:4px;font-size:13px;color:var(--muted);display:inline-flex;gap:6px;align-items:center}
.chip:hover{color:var(--fg)}
.chip.on{background:var(--surface-2);color:var(--fg);font-weight:500}
.chip .acc{font:500 11px var(--mono);color:var(--ok)}.chip .acc.low{color:var(--no)}
.seg .chip{font-size:12px}
.scope{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:13.5px;color:var(--muted);background:var(--surface);border-radius:6px;padding:10px 14px;margin-bottom:16px}
.scope b{color:var(--fg)}
.link{color:var(--accent);font-size:13px}

/* Question card */
.card{background:var(--surface);border-radius:8px;padding:22px}
.empty{color:var(--muted)}
.meta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font-size:12.5px;color:var(--muted);margin-bottom:12px}
.meta.center{justify-content:center}
.tag{font-size:11.5px;font-weight:600;padding:1px 8px;border-radius:4px;background:var(--surface-2);color:var(--fg)}
.context{font-size:14px;color:var(--muted);border-left:2px solid var(--line);padding-left:12px;margin-bottom:10px}
.prompt{font-size:18px;font-weight:500;line-height:1.65;margin-bottom:18px;text-wrap:pretty}
.pages{display:grid;gap:10px;margin-bottom:18px}
.pages img{width:100%;border-radius:6px;background:#fff;display:block}
.options{display:grid;gap:6px}
.options.compact{grid-template-columns:repeat(auto-fit,minmax(72px,1fr))}
.option{display:flex;gap:12px;align-items:center;text-align:left;padding:11px 14px;border:1px solid var(--line);border-radius:6px;font-size:14.5px;line-height:1.55;transition:border-color .12s,background .12s}
.option:hover:not(:disabled){border-color:var(--muted)}
.options.compact .option{justify-content:center;font-weight:600}
.options.compact kbd{display:none}
.option.picked{border-color:var(--accent);background:var(--accent-soft)}
.option.right{border-color:var(--ok);background:var(--ok-soft)}
.option.wrong{border-color:var(--no);background:var(--no-soft)}
.option:disabled:not(.right):not(.wrong){opacity:.55}
.number{display:flex;gap:8px}
.number input{flex:1;min-width:0;font:500 18px var(--mono);color:var(--fg);background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:9px 14px}
.number input:focus{outline:none;border-color:var(--accent)}
.btn{padding:8px 16px;border-radius:4px;font-size:14px;font-weight:600;background:var(--surface-2);display:inline-flex;gap:8px;align-items:center;white-space:nowrap}
.btn:hover:not(:disabled){filter:brightness(1.15)}
.btn:disabled{opacity:.45}
.btn.primary{background:var(--accent);color:var(--accent-ink)}
.btn.primary kbd{color:inherit;border-color:currentColor;opacity:.55}
.row{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px;font-size:13px}
.pair{display:flex;gap:8px}
.error{color:var(--no);font-size:13px;margin-top:8px}
.result{margin-top:20px;padding-top:18px;border-top:1px solid var(--line);display:grid;gap:10px;font-size:14.5px}
.verdict{font-weight:600}
.result.ok .verdict{color:var(--ok)}.result.no .verdict{color:var(--no)}
.verdict b{color:var(--fg)}
.formula{font:14px/1.7 var(--mono);background:var(--bg);border-radius:6px;padding:10px 14px;overflow-x:auto}
.formula .katex-display{margin:0}


/* Library: card grid with typographic covers */
.lib-chips{margin-bottom:24px}

/* Library: one filter row (shelves left, reading status right), quiet per-card state */
.lib-filters{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 24px;margin-bottom:24px}
.cover-progress{display:block;height:4px;border-radius:2px;background:var(--surface-2);overflow:hidden}
.cover-progress i{display:block;height:100%;background:var(--accent)}
.cover .fav{position:absolute;right:14px;top:10px;font-size:15px;color:#ffd166}
.cover-progress{position:absolute;left:0;right:0;bottom:0;border-radius:0;background:rgba(255,255,255,.18)}
.post-meta .done{color:var(--ok)}
.post-meta .reading-now{color:var(--accent)}

/* Reader: a progress line under the top bar, favorite icon in the meta line, a short-lived resume notice */
.read-progress{position:fixed;left:0;right:0;top:56px;height:2px;z-index:6;pointer-events:none}
.read-progress i{display:block;height:100%;width:0;background:var(--accent);transition:width .15s linear}
.fav-toggle{font-size:16px;line-height:1;color:var(--faint);padding:2px 4px;border-radius:4px}
.fav-toggle:hover{color:var(--fg)}
.fav-toggle[aria-pressed="true"]{color:#e0a800}
.resume-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:8;display:flex;align-items:center;gap:12px;max-width:calc(100vw - 32px);
  background:var(--surface-2);border:1px solid var(--line);border-radius:8px;padding:10px 12px 10px 16px;font-size:13.5px;box-shadow:0 8px 24px rgba(0,0,0,.25);
  animation:toast-out .4s ease 7s forwards}
.resume-toast .link{font-size:13.5px}
.toast-x{color:var(--faint);font-size:18px;line-height:1;padding:0 4px}
.toast-x:hover{color:var(--fg)}
@keyframes toast-out{to{opacity:0;visibility:hidden}}
.reader-finish{display:grid;gap:14px;margin-top:40px;padding:18px;background:var(--surface);border-radius:8px}
.finish-status{margin:0!important;font-size:14.5px!important;color:var(--muted);display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px}
.finish-status.done{color:var(--ok)}
.finish-status .link{font-size:13px;color:var(--faint)}
.finish-next{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding-top:14px;border-top:1px solid var(--line);font-size:14px}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 28px}
.post{text-decoration:none;display:flex;flex-direction:column;min-width:0}
.cover{--hue:150;position:relative;aspect-ratio:16/9;max-width:100%;border-radius:8px;overflow:hidden;margin-bottom:14px;
  background:radial-gradient(120% 140% at 85% 10%,hsl(var(--hue) 70% 42%) 0%,hsl(var(--hue) 60% 22%) 45%,hsl(var(--hue) 40% 9%) 100%);
  transition:transform .2s}
.post:hover .cover{transform:translateY(-2px)}
.cover .kicker{position:absolute;left:16px;top:13px;font:500 10.5px var(--mono);letter-spacing:1px;color:rgba(255,255,255,.72)}
.cover .suit{position:absolute;right:-6px;bottom:-34px;font-size:150px;line-height:1;color:rgba(255,255,255,.09)}
.cover .word{position:absolute;left:16px;right:16px;bottom:12px;font:500 clamp(20px,2.3vw,28px)/1.15 var(--sans);color:#fff;letter-spacing:-.3px;text-wrap:balance}
.post h2{font-size:17px;font-weight:500;line-height:1.45;margin-bottom:6px;text-wrap:balance}
.post:hover h2{color:var(--accent)}
.post p{font-size:13.5px;color:var(--muted);line-height:1.7;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:12px}
.post-meta{margin-top:auto;display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;font-size:12px;color:var(--faint)}

/* Library from nav.yaml: group headings, a collapsed tag filter (tags.yaml), clickable card tags */
.post-card{display:flex;flex-direction:column;min-width:0}
.post-card .post{flex:1}
.post-num{font:500 13px var(--mono);color:var(--faint);margin-right:8px}
.post-meta .badge{font-size:11px;padding:0 6px;border-radius:4px;background:var(--accent-soft);color:var(--accent)}
.post-meta .badge.warn{background:rgba(224,168,0,.14);color:#e0a800}
.post-tags{display:flex;flex-wrap:wrap;gap:2px 10px;margin-top:6px}
.post-tag{font-size:12px;color:var(--faint);padding:0}
.post-tag:hover{color:var(--accent)}
.post-tag.danger,.lib-facet.danger{color:var(--no)}
/* "By situation" entry points: cards of 1–3 picked articles per spot. */
.sit-intro{max-width:68ch;color:var(--muted);font-size:14px;line-height:1.8;margin-bottom:8px}
.sit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.sit-pot+.sit-pot{margin-top:28px}.sit-pot>h3{font-size:16px;font-weight:600;margin-bottom:12px}
.sit-card{display:flex;flex-direction:column;gap:8px;padding:18px 20px;background:var(--surface);border:1px solid var(--line);border-radius:8px;min-width:0}
.sit-card h3,.sit-card h4{font-size:15px;font-weight:600;line-height:1.5}
.sit-line{font:500 12.5px/1.6 var(--mono);color:var(--muted);overflow-wrap:anywhere}
.sit-question{font-size:14px;line-height:1.7}
.sit-entries{display:grid;gap:8px;margin:4px 0;padding-left:20px;font-size:14px;line-height:1.6}
.sit-entries li::marker{color:var(--faint);font:500 12px var(--mono)}
.sit-entries a{color:var(--accent);text-underline-offset:3px;overflow-wrap:anywhere}.sit-entries a.read{color:var(--muted)}
.sit-entries small{display:block;color:var(--muted);font-size:12.5px}
.sit-format{display:inline-block;margin-left:8px;padding:1px 6px;border:1px solid var(--line);border-radius:4px;color:var(--muted);font-size:11px;line-height:1.5;white-space:nowrap;vertical-align:1px}
.sit-note,.sit-empty{color:var(--muted);font-size:12.5px;line-height:1.7}
@media(max-width:760px){.sit-grid{grid-template-columns:minmax(0,1fr)}.sit-card{padding:16px}}
/* Reading routes: ordered article lists, and the strip under an article that belongs to one. */
.routes{display:grid;gap:20px}.routes .sit-intro{margin-bottom:0}
.route-card{display:grid;gap:12px;padding:22px 24px;background:var(--surface);border:1px solid var(--line);border-radius:8px;min-width:0}
.route-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.route-head h2{font-size:18px;font-weight:600;line-height:1.4}
.route-kind{display:inline-block;padding:1px 7px;border:1px solid var(--line);border-radius:4px;color:var(--muted);font-size:11.5px;font-weight:400;line-height:1.6;white-space:nowrap}
.route-summary{font-size:14px;line-height:1.7}
.route-progress{display:flex;align-items:center;gap:14px;flex-wrap:wrap;color:var(--muted);font:500 12.5px var(--mono)}.route-done{color:var(--accent)}.route-progress .btn{font-family:var(--sans);text-decoration:none}
.route-steps{display:grid;gap:10px;padding-left:22px;font-size:14.5px;line-height:1.6}
.route-steps li::marker{color:var(--faint);font:500 12.5px var(--mono)}.route-steps li.next::marker{color:var(--accent)}
.route-steps a{color:var(--accent);text-underline-offset:3px;overflow-wrap:anywhere}.route-steps li.read a{color:var(--muted)}
.route-steps small{display:block;color:var(--muted);font-size:12.5px}
.route-read{margin-left:8px;color:var(--faint);font-size:11.5px;white-space:nowrap}
.route-evidence{padding-top:12px;border-top:1px solid var(--line);color:var(--muted);font-size:12.5px;line-height:1.7}
.route-strip{display:grid;gap:12px;margin-top:var(--space-8);padding:16px 18px;background:var(--surface);border:1px solid var(--line);border-radius:8px}
.route-strip+.route-strip{margin-top:12px}
.route-strip-head{display:flex;align-items:baseline;gap:6px 10px;flex-wrap:wrap;color:var(--muted);font-size:var(--font-small)}
.route-strip-head a{color:var(--muted);text-underline-offset:3px}.route-strip-head strong{color:var(--fg);font-weight:600}
.route-strip-links{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}
.route-strip-links a{min-width:0;display:grid;gap:4px;text-decoration:none}.route-next,.route-end{text-align:right}
.route-strip-links a span,.route-strip-links small,.route-end{color:var(--muted);font-size:var(--font-small)}
.route-strip-links strong{font-size:15px;font-weight:500;overflow-wrap:anywhere}.route-strip-links a:hover strong{color:var(--accent)}
@media(max-width:760px){.route-card{padding:18px 16px}.route-strip-links{grid-template-columns:minmax(0,1fr);gap:12px}.route-next,.route-end{text-align:left}.route-strip-links>span[aria-hidden]{display:none}}
.lib-group{font-size:14px;font-weight:600;color:var(--muted);margin:36px 0 16px;letter-spacing:.3px}
.lib-group:first-of-type{margin-top:8px}

/* Library layout: index sidebar + main column; the filter is one button that opens a checkbox panel */
.lib-filters{position:relative}
.lib-filter-btn{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--fg);padding:6px 4px}
.lib-filter-btn:hover,.lib-filter-btn[aria-expanded="true"]{color:var(--accent)}
.lib-filter-icon{font-size:15px;line-height:1}
.lib-panel{position:absolute;right:0;top:calc(100% + 6px);z-index:10;width:min(520px,100%);display:grid;gap:6px;padding:12px 16px 14px;
  background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 28px rgba(0,0,0,.22)}
.lib-panel-head{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:600;margin-bottom:4px}
.lib-panel-head .link{font-size:12.5px;font-weight:400;color:var(--muted);margin-left:12px}
.lib-close{font-size:16px!important;line-height:1}
.lib-row{display:flex;gap:10px;align-items:baseline}
.lib-row-label{flex:0 0 56px;font-size:12px;color:var(--faint)}
.lib-row-tags{display:flex;flex-wrap:wrap;gap:4px}
.lib-facet{font-size:12.5px;padding:2px 9px;border-radius:999px;color:var(--muted);background:transparent;border:1px solid var(--line);display:inline-flex;gap:5px;align-items:baseline}
.lib-facet:hover:not(:disabled){color:var(--fg);border-color:var(--muted)}
.lib-facet[aria-pressed="true"]{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
.lib-facet:disabled{opacity:.35;cursor:default}
.lib-count{font:10.5px var(--mono);color:var(--faint)}
.lib-selected{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:-12px 0 18px}
.lib-chip{font-size:12.5px;padding:2px 10px;border-radius:999px;background:var(--accent-soft);color:var(--accent)}
.lib-selected .link{font-size:12.5px;color:var(--faint)}
.lib-index{font-size:13px;scrollbar-width:thin}
.lib-index summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:6px;padding:4px 0}
.lib-index summary::-webkit-details-marker{display:none}
.lib-index summary::before{content:'▸';font-size:10px;color:var(--faint);width:10px;transition:transform .15s}
.lib-index details[open]>summary::before{transform:rotate(90deg)}
.lib-index-title{font-size:14px;font-weight:600;color:var(--fg)}
.idx-heading{font-size:11.5px;color:var(--faint);letter-spacing:.5px;margin:14px 0 4px}
.idx-dim>summary{color:var(--fg);font-weight:500}
.idx-dim>.idx-tag,.idx-dim>ul{margin-left:14px}
.idx-tag>summary{color:var(--muted)}
.idx-count{margin-left:auto;font:11px var(--mono);color:var(--faint)}
.lib-index ul{list-style:none;margin:2px 0 6px 16px;padding:0;border-left:1px solid var(--line)}
.lib-index li a{display:block;padding:3px 0 3px 10px;color:var(--muted);text-decoration:none;line-height:1.45}
.lib-index li a:hover{color:var(--accent)}
.lib-index li a.read{color:var(--faint)}
.idx-num{font:11px var(--mono);color:var(--faint);margin-right:6px}
.lib-index li a.current{color:var(--accent);font-weight:500;box-shadow:inset 2px 0 0 var(--accent)}

/* Docs-site frame (after Starlight): on article pages the header spans the window, the index is a
   fixed pane flush with the left edge, and in the reader this article's outline is a fixed pane on the right. */
main.view-library{max-width:none;margin:0;padding:0}
.lib-index{position:fixed;top:56px;bottom:0;left:0;z-index:3;width:var(--side-width);overflow-y:auto;padding:16px 16px 40px;
  background:var(--surface);border-right:1px solid var(--line)}
.lib-main{margin-left:var(--side-width);padding:32px 40px 96px;min-width:0}
.reader-layout.has-index{display:block;margin:0 var(--toc-width) 0 var(--side-width);padding:32px 48px 96px}
.reader-layout.has-index .reader{max-width:var(--measure);margin:0 auto}
.reader-layout.has-index .reader-outline{position:fixed;top:56px;bottom:0;right:0;width:var(--toc-width);max-height:none;padding:24px 20px;border-left:1px solid var(--line)}
:root{--side-width:280px;--toc-width:240px}
@media (max-width:1180px){
  .reader-layout.has-index{margin-right:0}
  .reader-layout.has-index .reader-outline{display:none}
  .reader-layout.has-index .reader-outline-bar{display:flex}
}
@media (max-width:900px){
  main.view-library{padding:22px 16px 96px}
  .lib-index{position:static;width:auto;border:1px solid var(--line);border-radius:8px;padding:8px 12px;margin-bottom:16px}
  .lib-main{margin-left:0;padding:0}
  .reader-layout.has-index{margin:0;padding:0}
  .reader-layout .lib-index{display:none}
  .lib-panel{position:static;width:100%;margin-top:10px;box-shadow:none}
}

/* Tools open straight onto the tool: the switcher and the tool's one-line description share a row. The tab already
   names the tool, so its h1 stays for assistive technology only. */
main.view-tools{padding-top:14px}
main.view-tools .head{display:block;position:relative;height:0;margin:0}
main.view-tools .head h1{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
main.view-tools .head .stat{position:absolute;right:0;bottom:25px;white-space:nowrap}
@media (max-width:640px){main.view-tools .head{height:auto;margin-bottom:10px}main.view-tools .head .stat{position:static;white-space:normal}}

/* Reader */
.reader{max-width:var(--measure);width:100%;min-width:0;margin:0 auto}
.reader-layout{display:grid;grid-template-columns:var(--nav-width) minmax(0,var(--measure));gap:var(--space-8);justify-content:center;align-items:start}
.reader-outline{position:sticky;top:80px;max-height:calc(100dvh - 104px);overflow-y:auto;padding:4px 14px 12px 0;scrollbar-width:thin}
.outline-label{font-size:12px;font-weight:600;letter-spacing:1px;color:var(--faint);margin-bottom:14px}
.reader-outline nav ol,.outline-dialog nav ol{list-style:none;padding:0;margin:0 0 20px}
.reader-outline nav li,.outline-dialog nav li{margin-bottom:4px}
[data-reader-section]{display:block;width:100%;text-align:left;padding:8px 10px;border-left:2px solid transparent;border-radius:0 4px 4px 0;font-size:13px;line-height:1.6;color:var(--muted);overflow-wrap:anywhere}
[data-reader-section]:hover{color:var(--fg);background:var(--surface)}
[data-reader-section][aria-current="location"]{border-left-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
/* The bar only carries the outline button; it takes no space where the outline column is visible. */
.reader-outline-bar{display:none;align-items:center;gap:12px;margin-bottom:var(--space-6)}
.outline-dialog{position:fixed;inset:0 auto 0 0;margin:0;width:min(360px,90vw);max-width:none;height:100dvh;max-height:none;padding:20px;background:var(--bg);color:var(--fg);border:0;border-right:1px solid var(--line);overflow-y:auto}
.outline-dialog::backdrop{background:rgba(0,0,0,.55)}
.outline-dialog header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}
.outline-dialog h2{font-size:18px;font-weight:500;margin:0}
.outline-dialog [data-reader-section]{font-size:15px;padding-block:12px}
.reader h1{font-size:var(--font-h1);font-weight:600;line-height:1.45;margin:0 0 var(--space-3);text-wrap:balance}
.article-header{margin-bottom:var(--space-8);padding-bottom:var(--space-6);border-bottom:1px solid var(--line)}
.reader .article-subtitle{font-size:18px;color:var(--muted);line-height:1.7;margin-bottom:var(--space-4)}
.article-tags{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 var(--space-4)}
.article-tag{text-decoration:none;font-size:13px;padding:3px 11px;border-radius:999px;color:var(--fg);background:var(--surface);border:1px solid var(--line);transition:border-color .12s,color .12s}
.article-tag:hover{border-color:var(--accent);color:var(--accent)}
.article-tag.danger{color:var(--no)}
.article-meta{display:flex;gap:8px 16px;flex-wrap:wrap;align-items:center;color:var(--muted);font-size:var(--font-small)}
.article-meta .fav-toggle{margin-left:auto}
/* Book provenance is working information: shown while editing or auditing, hidden in the editing server's preview mode. */
html[data-gto-dev-mode="preview"] .byline-working{display:none}
.reader .byline{color:var(--faint);font-size:var(--font-caption);line-height:1.7;margin:8px 0 0;overflow-wrap:anywhere}
.reader .meta{margin-top:20px;margin-bottom:6px}
.reader h2{color:var(--accent);font-size:var(--font-h2);font-weight:500;margin:var(--space-8) 0 var(--space-3)}
.reader p,.reader li{font-size:var(--font-body);line-height:var(--leading-body)}
.reader p{margin-bottom:1em}
.reader-content>ul,.reader-content>ol{margin-block:var(--space-6);padding-left:1.5em}
.reader-content li+li{margin-top:var(--space-2)}
.reader-content .article-lead{color:var(--fg)}
.reader .lede{color:var(--muted);font-size:16.5px}
.reader .formula{margin:var(--space-6) 0}
.article-pagination{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;border-top:1px solid var(--line);margin-top:var(--space-8);padding-top:var(--space-6)}
.article-pagination a{min-width:0;text-decoration:none;display:grid;gap:6px}
.article-pagination span{color:var(--muted);font-size:var(--font-small)}
.article-pagination strong{font-size:15px;font-weight:500;overflow-wrap:anywhere}
.article-pagination a:hover strong{color:var(--accent)}
.article-next{text-align:right}
.inline-term{display:inline;padding:0;border-bottom:1px dashed var(--accent);border-radius:0;color:inherit;font:inherit;line-height:inherit;text-align:inherit}
.inline-term:hover{color:var(--accent);background:var(--accent-soft)}
.inline-source{font-size:.7em;line-height:0;vertical-align:super;margin-left:2px}
.inline-source button{padding:0 3px;color:var(--accent);font:inherit;line-height:1.2;min-width:1.2em}
.annotation-definition,.annotation-note,.annotation-location{margin:0 0 12px;line-height:1.8;overflow-wrap:anywhere}
.annotation-definition:last-child{margin-bottom:0}
.annotation-location{color:var(--muted);font-size:var(--font-small)}
.annotation-related{display:grid;gap:8px;margin-top:16px;padding-top:12px;border-top:1px solid var(--line)}
.annotation-related p{margin:0;color:var(--faint);font-size:var(--font-small)}
.annotation-related a,.annotation-book-link{color:var(--accent);text-underline-offset:3px}
.annotation-page-image{display:grid;gap:8px;width:100%;margin-top:16px;padding:0;text-align:left;color:var(--accent);font-size:var(--font-small)}
.annotation-page-image img{display:block;max-width:100%;max-height:300px;object-fit:contain;object-position:left;cursor:zoom-in}
.reading-error,.reading-notice{font-size:.875rem;line-height:1.6;margin:12px 0;overflow-wrap:anywhere}
.reading-error{color:var(--no)}.reading-notice{color:var(--accent)}
.reading-error:empty,.reading-notice:empty{display:none}
.reader-content h2{scroll-margin-top:80px}
.reading-backup{border-top:1px solid var(--line);padding-top:18px;margin-top:30px;font-size:.875rem}
.reading-backup summary{cursor:pointer;color:var(--muted)}
.reading-backup p{margin:14px 0;max-width:680px;color:var(--muted)}
.reading-backup .row{flex-wrap:wrap;justify-content:flex-start;gap:12px}
.backup-file{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.backup-file input{max-width:100%;font:inherit;color:var(--muted)}
.backup-text{display:block;margin-top:16px;color:var(--muted)}
.backup-text textarea{display:block;box-sizing:border-box;width:100%;height:12rem;margin-top:8px;padding:12px;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--fg);font:.875rem/1.5 var(--mono);resize:vertical}
.import-preview{background:var(--surface);padding:4px 16px 16px;margin-top:16px;border-radius:8px}
/* Keep KaTeX's internal span layout intact; scroll only the formula, not the page. */
.math-block,.math-display{max-width:100%;overflow-x:auto;overflow-y:hidden;padding-block:12px}
.math-block{font-family:var(--sans);font-size:1rem}
.math-display{display:block;margin:12px 0}
.math-inline .katex{font-size:1.06em}
.math-block .katex-display,.math-display .katex-display{margin:0;min-width:100%;width:max-content;text-align:center}
.math-block .katex-display>.katex,.math-display .katex-display>.katex{text-align:center}
.math-error{font-family:var(--mono);font-size:.9em;overflow-wrap:anywhere}
/* Cards in running text: bold rank + suit, colored by suit, never split across lines */
.pcards{white-space:nowrap;font-weight:600;letter-spacing:.2px}
.pcard.suit-s,.tile.suit-s{color:var(--suit-s)}.pcard.suit-h,.tile.suit-h{color:var(--suit-h)}
.pcard.suit-d,.tile.suit-d{color:var(--suit-d)}.pcard.suit-c,.tile.suit-c{color:var(--suit-c)}

/* Range chart: 13×13 grid, each cell split left-to-right by action frequency */
.range-chart{position:relative;margin:22px 0;padding:18px;background:var(--surface);border-radius:8px}
.rc-board{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;margin:0 0 12px!important;font:600 18px/1.2 var(--mono)}
.rc-board small{font:400 12px var(--sans);color:var(--faint);margin-left:8px}
.rc-cell.rc-dead{opacity:.25}
.rc-cell.rc-split::after{content:'';position:absolute;right:2px;top:2px;width:4px;height:4px;border-radius:50%;background:var(--fg);opacity:.75}
.rc-cell{position:relative}
.rc-cell.rc-on{outline:2px solid var(--accent);outline-offset:-2px}
.rc-card{position:absolute;z-index:3;width:min(300px,calc(100% - 16px));padding:12px 14px;background:var(--bg);border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.35);font-size:12.5px;pointer-events:none}
.rc-card-head{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 8px!important;font:600 15px var(--mono)}
.rc-card-head small{font:400 12px var(--sans);color:var(--faint)}
.rc-row{display:grid;grid-template-columns:minmax(0,1fr) 90px 46px;gap:8px;align-items:center;margin:4px 0}
.rc-row span:first-child{display:flex;gap:6px;align-items:center;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rc-row span:first-child i{flex:none;width:9px;height:9px;border-radius:2px}
.rc-row b{font:500 12px var(--mono);text-align:right}
.rc-bar{height:6px;border-radius:3px;background:var(--surface-2);overflow:hidden}
.rc-bar i{display:block;height:100%}
.rc-sub{margin:10px 0 4px!important;font-size:11.5px!important;color:var(--faint)}
.rc-combo{display:grid;grid-template-columns:auto auto 44px minmax(0,1fr);gap:4px 6px;align-items:center;margin:3px 0;font-family:var(--mono);font-weight:600}
.rc-combo small{font:400 11.5px var(--sans);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rc-mini{height:8px;border-radius:2px;background:var(--act-rest)}
.rc-empty{color:var(--faint);margin:0!important}
.rc-title{font-size:14px!important;font-weight:600;margin:0 0 12px!important;line-height:1.5!important}
.rc-grid{display:grid;grid-template-columns:repeat(13,minmax(0,1fr));gap:2px;max-width:560px}
.rc-cell{aspect-ratio:1;display:grid;place-items:center;border-radius:2px;background:var(--act-rest);color:#fff;
  font:500 clamp(7px,1.6vw,11px)/1 var(--mono);text-shadow:0 0 2px rgba(0,0,0,.45);overflow:hidden;cursor:default}
.rc-cell.rc-rest{color:var(--act-rest-ink);text-shadow:none}
.rc-cell.rc-hl{outline:2px solid var(--fg);outline-offset:-2px}
.rc-legend{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:12px;font-size:12.5px;color:var(--muted)}
.rc-key{display:inline-flex;align-items:baseline;gap:6px}
.rc-key i{width:10px;height:10px;border-radius:2px;align-self:center}
.rc-key b{color:var(--fg);font:500 12.5px var(--mono)}
.rc-key small{color:var(--faint);font-size:11.5px}
.range-chart figcaption{margin-top:12px;padding-top:10px;border-top:1px solid var(--line);font-size:12.5px;color:var(--faint);line-height:1.6}
.rc-source{display:block}

/* Key takeaway box */
.key-box{margin:var(--space-6) 0;padding:14px 18px;border-left:3px solid var(--accent);background:var(--accent-soft);border-radius:0}
.key-box .key-label{font-size:12px!important;font-weight:600;color:var(--accent);letter-spacing:.5px;margin:0 0 4px!important;line-height:1.4!important}
.key-box p:last-child{margin:0!important;font-weight:500;color:var(--fg)}

/* Tables */
.table-wrap{margin:20px 0;overflow-x:auto;border:1px solid var(--line);border-radius:8px}
.table-wrap table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.6}
.table-wrap th,.table-wrap td{padding:9px 14px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}
.table-wrap th{background:var(--surface);font-weight:600;color:var(--muted);font-size:13px}
.table-wrap tr:last-child td{border-bottom:0}
.table-wrap td{font-variant-numeric:tabular-nums}
.table-wrap .a-right{text-align:right}.table-wrap .a-center{text-align:center}

/* Original book figure (whole page or a crop) */
.book-figure{margin:22px 0}
.bf-frame{position:relative;overflow:hidden;border-radius:6px;background:#fff;max-width:100%}
.bf-frame img{display:block;width:100%}
.bf-frame.bf-crop img{position:absolute;max-width:none}
.book-figure figcaption{margin-top:8px;font-size:13px;color:var(--muted);line-height:1.6}
.bf-source{display:block;font-size:12px;color:var(--faint)}

/* Data chart */
.data-chart{margin:22px 0;padding:18px;background:var(--surface);border-radius:8px}
.ch-title{font-size:14px!important;font-weight:600;margin:0 0 8px!important;line-height:1.5!important}
.data-chart svg{display:block;width:100%;height:auto;overflow:visible}
.ch-grid{stroke:var(--line);stroke-width:1}
.ch-tick{fill:var(--faint);font:11px var(--mono)}
.ch-label{fill:var(--muted);font:12px var(--sans)}
.ch-line{fill:none;stroke:var(--c);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.ch-dot{fill:var(--c);stroke:var(--surface);stroke-width:1.5}
.ch-bar{fill:var(--c)}
.ch-legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:8px;font-size:12.5px;color:var(--muted)}
.ch-legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}
.data-chart figcaption{margin-top:10px;padding-top:10px;border-top:1px solid var(--line);font-size:12.5px;color:var(--faint);line-height:1.6}
.ch-source{display:block}

/* Board figure */
.board{margin:22px 0;padding:18px;background:var(--surface);border-radius:8px}
.board-row{display:flex;flex-wrap:wrap;gap:16px 22px;align-items:flex-start}
.street{display:flex;flex-direction:column;gap:8px;min-width:0}
.street.hand{padding-right:22px;border-right:1px solid var(--line)}
.tiles{display:flex;gap:5px}
.tile{width:44px;height:60px;border-radius:6px;background:var(--bg);border:1px solid var(--line);display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;font-family:var(--mono)}
.tile b{font-size:21px;font-weight:600}
.tile i{font-style:normal;font-size:17px;margin-top:3px}
.street-label{font-size:12.5px!important;line-height:1.5!important;color:var(--faint);margin:0!important;max-width:220px}
.street-label>.street-action{display:block;color:var(--muted)}
.board figcaption{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);font-size:12.5px;color:var(--faint)}

.example{background:var(--surface);border-radius:8px;padding:16px 18px;margin:18px 0}
.example .example-label{font-size:12px;font-weight:600;color:var(--accent);letter-spacing:.5px;margin-bottom:6px}
.example p,.example li{font-size:14.5px}
.example ol{padding-left:20px;margin:8px 0}
.example p:last-child{margin-bottom:0}
.scope-note{font-size:13.5px!important;color:var(--faint);border-top:1px solid var(--line);padding-top:14px;margin-top:28px}
.loading{margin-top:40px}
.cta{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:40px;background:var(--surface);border-radius:8px;padding:16px 18px;font-size:14px}

@media (max-width:900px){
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .reader-layout,.reader-layout.has-index{display:block}.reader-outline{display:none}.reader-layout .lib-index{display:none}
  .reader-outline-bar{display:flex;align-items:center;gap:12px;position:sticky;top:56px;z-index:4;padding:8px 0;background:var(--bg);border-bottom:1px solid var(--line);margin-top:12px}
  .reader-outline-bar .btn{font-size:13px;padding:6px 10px;flex-shrink:0}
  .reader-outline-bar span{min-width:0;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .reader-content h2{scroll-margin-top:128px}
  .article-pagination{position:fixed;z-index:4;bottom:0;left:0;right:0;max-width:var(--measure);margin:0 auto;padding:10px 16px max(10px,env(safe-area-inset-bottom));background:var(--bg);gap:20px}
  .article-pagination strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .article-pagination a{gap:2px}
  .view-library:has(.reader){padding-bottom:120px}
}
@media (max-width:720px){
  .bar{gap:16px}
  main{padding-top:22px}
  .card{padding:16px}
  .prompt{font-size:16.5px}
  .reader h1{font-size:26px}
}
@media (max-width:900px){.bar{padding-inline:16px}}
@media (max-width:560px){.cards{grid-template-columns:minmax(0,1fr)}}
@media (max-width:600px){
  .bar .logo img{width:38px;height:38px}
  .bar nav{min-width:0;overflow-x:auto;scrollbar-width:none}
  .bar nav::-webkit-scrollbar{display:none}
  .bar nav[aria-label] a{flex-shrink:0;white-space:nowrap;padding-inline:5px;font-size:12px}
}
@media (max-width:380px){
  .bar{gap:8px;padding-inline:12px}
  .bar .logo{gap:4px;font-size:13px}
  .bar .logo span{width:75px}
  .bar .logo img{width:38px;height:38px}
  .bar nav a{padding-inline:6px;white-space:nowrap}
  .theme-toggle{width:30px;height:30px;flex-shrink:0}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Imported article bodies retain semantic structure and use the reader palette. */
.web-content{overflow-wrap:anywhere;line-height:1.9}
.web-content :is(h3,h4,h5,h6){line-height:1.5;margin:1.8em 0 .65em}
.web-content :is(ul,ol){padding-left:1.7em;margin:1em 0}
.web-content li{margin:.35em 0}
.web-content figure{margin:1.6em 0}
.web-content img{display:block;max-width:100%;height:auto;margin:auto;border-radius:8px}
.web-content figcaption{font-size:.88em;line-height:1.6;opacity:.78;margin-top:.65em;text-align:center}
.web-content a{text-decoration:underline;text-underline-offset:3px;color:inherit}
.web-content .web-image-link{display:block}
.web-content blockquote{margin:1.4em 0;padding:.35em 1.2em;border-left:3px solid currentColor;opacity:.86}
.web-content table{display:block;max-width:100%;overflow-x:auto;border-collapse:collapse;margin:1.4em 0}
.web-content :is(td,th){padding:.55em .8em;border:1px solid #8886;text-align:left}
.web-content pre{overflow:auto;white-space:pre-wrap}
.web-content details{margin:1.2em 0;padding:.75em 1em;border:1px solid #8885;border-radius:8px}
.web-content summary{cursor:pointer;font-weight:600;line-height:1.6}
.web-content details[open]>summary{margin-bottom:.8em}
/* web-quiz.js keeps a question's solver result off the page until the question is answered. */
.web-content details[hidden]{display:none}
/* An article's own quiz, made answerable (web-quiz.js): the options are buttons, and the labels that say which
   one is right stay hidden until the reader has picked. Without the script it is the folded block it always was. */
.web-content .web-quiz.is-live{display:grid;gap:6px;padding:0;border:0;counter-reset:web-quiz}
.web-content .web-quiz.is-live>summary{display:none}
.web-content .web-quiz.is-live .web-quiz-option{counter-increment:web-quiz;display:flex;gap:12px;align-items:center;margin:0;padding:11px 14px;border:1px solid var(--line);border-radius:6px;font-size:14.5px;line-height:1.55;cursor:pointer;transition:border-color .12s,background .12s}
.web-content .web-quiz.is-live .web-quiz-option::before{content:counter(web-quiz);flex:none;display:grid;place-items:center;min-width:22px;height:22px;border:1px solid var(--line);border-radius:4px;font:500 12px var(--mono);color:var(--muted)}
.web-content .web-quiz.is-live:not(.is-done) .web-quiz-option:hover{border-color:var(--muted)}
.web-content .web-quiz.is-live .web-quiz-option:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.web-content .web-quiz.is-live:not(.is-done) .web-quiz-option>strong:first-child{display:none}
.web-content .web-quiz.is-done .web-quiz-option{cursor:default}
.web-content .web-quiz.is-done .web-quiz-option.right{border-color:var(--ok);background:var(--ok-soft)}
.web-content .web-quiz.is-done .web-quiz-option.wrong{border-color:var(--no);background:var(--no-soft)}
.web-content .web-quiz.is-done .web-quiz-option:not(.right):not(.wrong){opacity:.6}
.web-content .web-quiz-verdict{margin:4px 0 0;font-size:14px;font-weight:600}
.web-content .web-quiz-verdict.ok{color:var(--ok)}.web-content .web-quiz-verdict.no{color:var(--no)}
.web-content .web-quiz-verdict:focus{outline:none}
/* Term definitions from imported articles: always shown, set apart from the prose. */
.web-content .term-note{margin:1.2em 0;padding:.7em 1em .8em;border-left:3px solid var(--accent);border-radius:0 6px 6px 0;background:var(--accent-soft);font-size:.94em;line-height:1.8}
.web-content :is(.term-note,.term-note>.gto-dev-target:first-child)>p:first-child{margin:0 0 .25em;font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--accent)}
.web-content .term-note>:last-child{margin-bottom:0}
.web-content :is(.term-note,.term-note>.gto-dev-target:first-child)>p:first-child+*{margin-top:0}
/* A picture that stands for a link (video cover, solver position): the picture opens the target and one line below says what it is. */
/* While editing, the editor wraps each child of a container in .gto-dev-target; the child rules below match both shapes. */
.web-content .web-linked-figure{position:relative}
.web-content .web-linked-figure .web-image-link{position:relative;width:fit-content;max-width:100%;margin-inline:auto}
/* The source's generic link text is replaced by the label; the link is stretched over the picture so the cover opens the target. */
.web-content :is(.web-linked-figure,.web-linked-figure>.gto-dev-target)>p{margin:.55em 0 0;text-align:center;line-height:1.6}
.web-content :is(.web-linked-figure,.web-linked-figure>.gto-dev-target)>p a{font-size:0;text-decoration:none}
.web-content :is(.web-linked-figure,.web-linked-figure>.gto-dev-target)>p a::after{content:var(--link-label);font-size:calc(var(--font-body,16px)*.88);color:var(--muted)}
.web-content :is(.web-linked-figure,.web-linked-figure>.gto-dev-target)>p a:hover::after{color:var(--accent)}
.web-content :is(.web-linked-figure,.web-linked-figure>.gto-dev-target)>p a::before{content:'';position:absolute;inset:0;z-index:1}
.web-content :is(.web-linked-figure,.web-linked-figure>.gto-dev-target)>figcaption{position:relative;z-index:2}
/* While editing, a click selects the block instead of following the stretched link. */
html[data-gto-dev-mode="edit"] .web-content :is(.web-linked-figure,.web-linked-figure>.gto-dev-target)>p a::before{content:none}
.web-content .web-linked-figure.is-video:not(.is-portrait) .web-image-link::after{content:"";position:absolute;left:50%;top:50%;height:min(52px,70%);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:rgba(0,0,0,.62) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M9 7v10l8-5z'/%3E%3C/svg%3E") center/60% no-repeat;pointer-events:none}
/* A person's portrait beside their quote: small and round, the quote is the content. The portrait itself is the link. */
.web-content .web-linked-figure.is-portrait{float:left;width:64px;margin:.25em 1.1em .5em 0}
.web-content .web-linked-figure.is-portrait img{border-radius:50%}
.web-content :is(.web-linked-figure.is-portrait,.web-linked-figure.is-portrait>.gto-dev-target)>p{margin:0;line-height:0}
.web-content :is(.web-linked-figure.is-portrait,.web-linked-figure.is-portrait>.gto-dev-target)>p a::after{content:none}
.web-content .web-linked-figure.is-portrait+div{overflow:hidden;margin:1.4em 0 .5em;padding-left:1em;border-left:3px solid var(--line)}
.web-content .web-linked-figure.is-portrait+div+p{margin:0 0 1.4em calc(64px + 1.1em);padding-left:1em;font-size:.9em;line-height:1.7;color:var(--muted)}
.web-content .web-linked-figure.is-portrait+div+p+*{clear:both}
@media(max-width:600px){.web-content .web-linked-figure.is-portrait{width:48px;margin-right:.8em}.web-content .web-linked-figure.is-portrait+div+p{margin-left:calc(48px + .8em)}}

/* Capability flags describe this build, never the success of a content request. */
html:not([data-books-enabled="true"]) [data-shell-nav="books"],
html:not([data-courses-enabled="true"]) [data-shell-nav="courses"]{display:none}
.loading-placeholder{width:100%;min-width:0;padding:8px 0 24px}
.loading-placeholder h1{margin-bottom:18px}
.loading-status{font-size:13px;color:var(--muted);margin-bottom:22px}
.skeleton-body{max-width:var(--measure);min-height:540px}
.skeleton-line{height:13px;border-radius:3px;background:var(--surface-2);margin:0 0 16px;width:100%}
.skeleton-line:nth-child(5n+1){width:66%;height:24px;margin-bottom:26px}
.skeleton-line:nth-child(5n){width:78%}
.skeleton-figure{height:210px;border:1px solid var(--line);background:var(--surface);border-radius:8px;margin:32px 0}
.loading-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;min-height:520px}
.skeleton-card{background:var(--surface);border:1px solid var(--line);padding:22px;border-radius:8px;min-height:200px}
.skeleton-tool{max-width:840px;min-height:570px;padding:24px;background:var(--surface);border-radius:8px}
.skeleton-table{height:320px;background:var(--surface-2);border-radius:8px;margin-top:30px}
@media(max-width:700px){.loading-grid{grid-template-columns:1fr}.skeleton-card{min-height:160px}.skeleton-tool{padding:16px}.skeleton-figure{height:180px}}
/* No loading animation or artificial wait, including reduced-motion preferences. */
@media(prefers-reduced-motion:reduce){.loading-placeholder{animation:none;transition:none}}

main.view-library>.loading-placeholder{width:calc(100% - var(--side-width));margin-left:var(--side-width);padding:32px 40px 96px}
main.view-courses>.loading-placeholder{max-width:960px;margin:0 auto;padding:48px 28px 80px}
@media(max-width:850px){main.view-library>.loading-placeholder{width:100%;margin:0;padding:22px 16px 96px}main.view-courses>.loading-placeholder{padding:30px 22px 60px}}
/* The optional cache controls sit after page content and do not change the reading frame. */
.text-cache-footer{max-width:1100px;margin:24px auto;padding:0 24px 24px;color:var(--muted)}
.text-cache-controls{font-size:13px}
main.view-library+.text-cache-footer{max-width:none;margin-left:var(--side-width);padding-left:40px;padding-right:40px}
@media(max-width:850px){main.view-library+.text-cache-footer{margin-left:0;padding-left:16px;padding-right:16px}}