:root{--serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", "Hoefler Text", Georgia, "Times New Roman", serif;--sans: -apple-system, "SF Pro Text", "Segoe UI", Helvetica, Arial, sans-serif;--bg: #f4ead6;--bg-2: #ebdfc4;--bg-3: #e2d3b3;--panel: #f9f2e3;--ink: #2a2119;--ink-2: #5a4a3a;--ink-3: #8a7a66;--indigo: #1f2a44;--indigo-2: #2f3d5f;--indigo-ink: #f4ead6;--gold: #b8892b;--gold-2: #d4a94a;--gold-soft: rgba(184, 137, 43, .16);--oxblood: #7a2e2b;--olive: #5f6b3a;--line: #c9b993;--line-2: #b8a57d;--ok: #3f7a4a;--ok-soft: rgba(63, 122, 74, .14);--bad: #9a3b32;--bad-soft: rgba(154, 59, 50, .14);--water: #c4d0d3;--land: #efe3c8;--coast: #6b5f4e;--shadow: 0 1px 2px rgba(42, 33, 25, .08), 0 10px 30px rgba(42, 33, 25, .1);--radius: 14px;color-scheme:light}:root[data-theme=dark]{color-scheme:dark}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){color-scheme:dark}}:root[data-theme=dark],:root.dark{--bg: #151a27;--bg-2: #1b2233;--bg-3: #232c40;--panel: #1d2536;--ink: #efe6d2;--ink-2: #c9bda3;--ink-3: #8f8570;--indigo: #d4a94a;--indigo-2: #e2bd63;--indigo-ink: #151a27;--gold: #d4a94a;--gold-2: #e7c46b;--gold-soft: rgba(212, 169, 74, .16);--line: #3a4560;--line-2: #4c587a;--ok: #7cc48a;--ok-soft: rgba(124, 196, 138, .16);--bad: #e08a80;--bad-soft: rgba(224, 138, 128, .16);--water: #2a3a4e;--land: #232c40;--coast: #8a9ab8;--shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 10px 30px rgba(0, 0, 0, .35)}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:var(--serif);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased}body{min-height:100dvh;background-image:radial-gradient(1200px 600px at 50% -10%,rgba(184,137,43,.1),transparent 60%)}button,input,select{font:inherit;color:inherit}a{color:var(--indigo)}h1,h2,h3{font-weight:500;letter-spacing:.01em;margin:0;line-height:1.2}h1{font-size:2rem}h2{font-size:1.45rem}h3{font-size:1.15rem}p{margin:.4rem 0}.caps{font-family:var(--sans);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}.muted{color:var(--ink-2)}.small{font-size:.9rem}.tiny{font-size:.8rem}.app{max-width:880px;margin:0 auto;padding:16px 16px 96px}@media (min-width: 640px){.app{padding:28px 24px 96px}}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 0 18px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}.brand .mark{width:36px;height:36px;border-radius:10px;background:var(--indigo);display:grid;place-items:center;color:var(--indigo-ink);box-shadow:inset 0 0 0 2px var(--gold)}.brand h1{font-size:1.4rem}.nav{position:fixed;bottom:0;left:0;right:0;background:color-mix(in srgb,var(--panel) 92%,transparent);backdrop-filter:blur(10px);border-top:1px solid var(--line);display:flex;justify-content:center;gap:2px;padding:6px 8px calc(6px + env(safe-area-inset-bottom));z-index:20}.nav a{flex:1;max-width:110px;text-align:center;text-decoration:none;color:var(--ink-2);font-family:var(--sans);font-size:.62rem;letter-spacing:.02em;padding:6px 1px;border-radius:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav a.active{color:var(--indigo);background:var(--gold-soft)}.nav a span{display:block;font-size:1.15rem;line-height:1.2}.card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);margin-bottom:16px;animation:rise .35s ease both}.card.ornate{padding:26px}.card.ornate:before{content:"";position:absolute;inset:7px;border:1px solid var(--line);border-radius:calc(var(--radius) - 6px);pointer-events:none}.card.ornate:after{content:"✦";position:absolute;top:-1px;left:50%;transform:translate(-50%,-55%);font-size:.8rem;color:var(--gold);background:var(--panel);padding:0 8px}.card.quiet{box-shadow:none;background:var(--bg-2)}.card-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:8px}.stack{display:flex;flex-direction:column;gap:12px}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.btn{appearance:none;text-decoration:none;display:inline-block;text-align:center;border:1px solid var(--indigo);background:var(--indigo);color:var(--indigo-ink);padding:12px 20px;border-radius:12px;cursor:pointer;font-family:var(--serif);font-size:1.02rem;letter-spacing:.01em;transition:transform .08s ease,background .15s ease,opacity .15s ease}.btn:hover{background:var(--indigo-2)}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.45;cursor:default;transform:none}.btn.outline{background:transparent;color:var(--indigo)}.btn.outline:hover{background:var(--gold-soft)}.btn.gold{background:var(--gold);border-color:var(--gold);color:#1d1608}.btn.gold:hover{background:var(--gold-2)}.btn.big{padding:16px 28px;font-size:1.15rem;width:100%}.btn.small{padding:8px 14px;font-size:.92rem;border-radius:10px}.btn.ghost{background:transparent;border-color:var(--line-2);color:var(--ink-2)}.options{display:grid;gap:10px;margin-top:14px}.option{text-align:left;border:1px solid var(--line-2);background:var(--bg-2);color:var(--ink);padding:14px 16px;border-radius:12px;cursor:pointer;font-family:var(--serif);font-size:1.02rem;line-height:1.35;display:flex;gap:12px;align-items:center;transition:background .15s ease,border-color .15s ease,transform .08s ease}.option:hover{background:var(--gold-soft);border-color:var(--gold)}.option:active{transform:scale(.99)}.option .key{font-family:var(--sans);font-size:.7rem;color:var(--ink-3);border:1px solid var(--line-2);border-radius:6px;min-width:22px;height:22px;display:grid;place-items:center;flex-shrink:0}.option.correct{background:var(--ok-soft);border-color:var(--ok)}.option.wrong{background:var(--bad-soft);border-color:var(--bad)}.option.dim{opacity:.55}.option:disabled{cursor:default}.prompt{font-size:1.22rem;line-height:1.4;margin:4px 0 8px}.stem{font-style:italic;font-size:1.12rem;line-height:1.6;color:var(--ink);background:var(--bg-2);border-left:3px solid var(--gold);padding:12px 16px;border-radius:8px;margin:10px 0 6px}.passage{font-size:1.35rem;line-height:1.65;text-align:center;padding:18px 8px;font-style:italic}@media (min-width: 640px){.passage{font-size:1.55rem;padding:24px}}.reference{font-family:var(--sans);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);text-align:center}.timer{height:6px;background:var(--bg-3);border-radius:4px;overflow:hidden;margin:10px 0}.timer>div{height:100%;background:linear-gradient(90deg,var(--gold),var(--gold-2));transition:width .25s linear}.timer.urgent>div{background:var(--oxblood)}.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.chips.strip{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}.chips.strip .chip{flex:0 0 auto}.chip{border:1px solid var(--line-2);background:var(--bg-2);color:var(--ink);padding:9px 13px;border-radius:999px;cursor:pointer;font-family:var(--serif);font-size:.98rem;line-height:1.3;transition:background .15s ease,opacity .15s ease;text-align:left}.chip:hover{background:var(--gold-soft);border-color:var(--gold)}.chip.used{opacity:.35}.chip.selected{background:var(--indigo);color:var(--indigo-ink);border-color:var(--indigo)}.chip.correct{background:var(--ok-soft);border-color:var(--ok)}.chip.wrong{background:var(--bad-soft);border-color:var(--bad)}.chip:disabled{cursor:default}.sequence{display:flex;flex-direction:column;gap:6px;margin-top:12px;min-height:40px}.seq-item{display:flex;gap:10px;align-items:center;padding:8px 12px;border-radius:10px;background:var(--bg-2);border:1px solid var(--line)}.seq-item .n{font-family:var(--sans);font-size:.75rem;color:var(--gold);min-width:20px}.seq-item.correct{border-color:var(--ok);background:var(--ok-soft)}.seq-item.wrong{border-color:var(--bad);background:var(--bad-soft)}.feedback{border-top:1px solid var(--line);margin-top:18px;padding-top:14px;animation:rise .3s ease both}.feedback .verdict{font-family:var(--sans);font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:6px}.feedback .verdict.ok{color:var(--ok)}.feedback .verdict.bad{color:var(--bad)}.feedback .explain{white-space:pre-wrap;font-size:1.02rem;line-height:1.55}.rule{background:var(--indigo);color:var(--indigo-ink);border-radius:12px;padding:14px 18px;font-size:1.15rem;text-align:center}.rule.changed{background:var(--oxblood);color:#f4ead6}.rule .caps{color:#f4ead6bf;display:block;margin-bottom:4px}.stage{min-height:200px;display:grid;place-items:center;text-align:center;padding:12px}.stage .name{font-size:2.2rem;line-height:1.1}.stage .icon{margin-bottom:8px}.flash{position:absolute;left:50%;top:50%;transform:translate(-50%,-190%);padding:6px 14px;border-radius:999px;font-family:var(--sans);font-size:.85rem;letter-spacing:.12em;text-transform:uppercase;pointer-events:none;animation:fade .7s ease both;white-space:nowrap}.flash.ok{color:var(--ok);background:var(--ok-soft);box-shadow:0 0 0 1px var(--ok)}.flash.bad{color:var(--bad);background:var(--bad-soft);box-shadow:0 0 0 1px var(--bad)}.go{width:100%;height:88px;font-size:1.4rem;letter-spacing:.2em;border-radius:16px}.input{width:100%;padding:12px 14px;border:1px solid var(--line-2);border-radius:10px;background:var(--bg-2);color:var(--ink);font-family:var(--serif);font-size:1.05rem}.input:focus{outline:2px solid var(--gold);border-color:var(--gold)}.input.correct{border-color:var(--ok);background:var(--ok-soft)}.input.wrong{border-color:var(--bad);background:var(--bad-soft)}.map{width:100%;border-radius:12px;border:1px solid var(--line-2);background:var(--land);display:block;box-shadow:inset 0 0 40px #785a1e1f}.map .dot{cursor:pointer}.map text{font-family:var(--serif);pointer-events:none}.lgrid{display:grid;gap:6px;margin-top:12px}.lcell{aspect-ratio:1.15;border:1px dashed var(--line-2);border-radius:8px;display:grid;place-items:center;text-align:center;font-size:.78rem;line-height:1.15;padding:4px;cursor:pointer;background:var(--bg-2)}.lcell.filled{border-style:solid;background:var(--gold-soft)}.lcell.correct{border-color:var(--ok);background:var(--ok-soft)}.lcell.wrong{border-color:var(--bad);background:var(--bad-soft)}.lcell.target{box-shadow:inset 0 0 0 2px var(--gold)}.progress-rule{display:flex;gap:6px;margin:4px 0 16px}.progress-rule i{flex:1;height:4px;border-radius:2px;background:var(--bg-3)}.progress-rule i.done{background:var(--gold)}.progress-rule i.now{background:var(--indigo)}.stat{display:flex;flex-direction:column;gap:2px}.stat b{font-size:1.5rem;font-weight:500}.bar{height:8px;background:var(--bg-3);border-radius:4px;overflow:hidden}.bar>i{display:block;height:100%;background:var(--gold)}table.plain{width:100%;border-collapse:collapse;font-size:.95rem}table.plain th,table.plain td{text-align:left;padding:8px 6px;border-bottom:1px solid var(--line)}table.plain th{font-family:var(--sans);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-weight:500}.badge{display:inline-block;font-family:var(--sans);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border-radius:999px;border:1px solid var(--line-2);color:var(--ink-2)}.badge.strong{border-color:var(--ok);color:var(--ok)}.badge.moderate{border-color:var(--gold);color:var(--gold)}.badge.mixed{border-color:var(--ink-3)}.badge.weak{border-color:var(--bad);color:var(--bad)}.pill-nav{display:flex;gap:6px;flex-wrap:wrap}.pill-nav button{border:1px solid var(--line-2);background:transparent;color:var(--ink-2);border-radius:999px;padding:6px 12px;cursor:pointer;font-family:var(--sans);font-size:.78rem}.pill-nav button.active{background:var(--indigo);color:var(--indigo-ink);border-color:var(--indigo)}.tl{position:relative;padding-left:26px}.tl:before{content:"";position:absolute;left:8px;top:0;bottom:0;width:2px;background:var(--line-2)}.tl-item{position:relative;padding:8px 0 14px}.tl-item:before{content:"";position:absolute;left:-22px;top:16px;width:10px;height:10px;border-radius:50%;background:var(--gold);border:2px solid var(--panel)}.tl-item.foreign:before{background:var(--indigo)}.milestone{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line)}.milestone .star{color:var(--gold);font-size:1.2rem}.overlay{position:fixed;inset:0;background:#14100a80;display:grid;place-items:center;z-index:30;padding:16px}.overlay .card{max-width:420px;width:100%}.glyph{width:44px;height:44px}.pattern-grid{display:grid;gap:8px;margin:12px 0}.pcell{aspect-ratio:1;border:1px solid var(--line-2);border-radius:10px;display:grid;place-items:center;background:var(--bg-2)}.pcell.missing{border:2px dashed var(--gold)}.match{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.match .col{display:flex;flex-direction:column;gap:8px}.pairline{font-size:.9rem;color:var(--ink-2)}.sparkline{width:100%;height:44px}.hidden-sr{position:absolute;left:-9999px}@keyframes rise{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes fade{0%{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.card,.feedback,.flash{animation:none}.btn,.option{transition:none}}:root.reduce-motion .card,:root.reduce-motion .feedback,:root.reduce-motion .flash{animation:none}
