:root{--ground:#fcfcfb;--ink:#1a1a18;--muted:#85857c;--faint:#b4b4ab;--hairline:#e5e5de;--accent:#3e7a52;--loss:#a05548;--sq-light:#f1f0ea;--sq-dark:#dbd9ce;--piece-light:#fcfcfb;--piece-dark:#1a1a18;--trace-ground:#0e100e;--trace-glow:#74b08a;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--ground:#131412;--ink:#e9e9e2;--muted:#8b8b81;--faint:#5c5c54;--hairline:#2a2b26;--accent:#74b08a;--loss:#c07a6c;--sq-light:#22231f;--sq-dark:#1a1b17;--piece-light:#e9e9e2;--piece-dark:#080907}}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{background:var(--ground);color:var(--ink);font-variant-numeric:tabular-nums;overscroll-behavior:none;min-height:100dvh;font-family:system-ui,Helvetica Neue,sans-serif}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border:none}.app{flex-direction:column;max-width:420px;height:100dvh;margin:0 auto;display:flex}.topbar{padding:calc(env(safe-area-inset-top) + 16px) 20px 16px;border-bottom:1px solid var(--hairline);justify-content:space-between;gap:12px;display:flex}.resource{flex-direction:column;gap:2px;display:flex}.resource:last-child{align-items:flex-end}.resource-value{letter-spacing:-.01em;font-size:1.75rem;font-weight:300;line-height:1}.resource-label{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-size:.72rem;font-weight:500}.content{-webkit-overflow-scrolling:touch;flex:1;overflow-y:auto}.screen{padding:0 20px calc(env(safe-area-inset-bottom) + 24px);flex-direction:column;display:flex}.section{border-bottom:1px solid var(--hairline);flex-direction:column;gap:8px;padding:20px 0;display:flex}.section:last-child{border-bottom:none}.section h2{letter-spacing:-.01em;font-size:1rem;font-weight:600}.muted{color:var(--muted);font-size:.85rem}.lead{padding:20px 0 0}.empty{text-align:center;color:var(--muted);padding:40px 20px}.rival-line{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.rating-chip{color:var(--muted);font-size:.85rem;font-weight:500}.board{aspect-ratio:1;border:1px solid var(--hairline);-webkit-user-select:none;user-select:none;touch-action:manipulation;width:100%;margin:4px 0;position:relative}.board-squares{grid-template-rows:repeat(8,1fr);grid-template-columns:repeat(8,1fr);display:grid;position:absolute;inset:0}.square.light{background:var(--sq-light)}.square.dark{background:var(--sq-dark)}.square.highlighted{box-shadow:inset 0 0 0 2px var(--accent)}.piece{will-change:transform;pointer-events:none;justify-content:center;align-items:center;width:12.5%;height:12.5%;font-size:min(8vw,4.6dvh);line-height:1;transition-property:transform;transition-timing-function:cubic-bezier(.3,.9,.35,1);display:flex;position:absolute;top:0;left:0}.piece.white{color:var(--piece-light);text-shadow:0 1px 0 var(--piece-dark), 0 -1px 0 var(--piece-dark), 1px 0 0 var(--piece-dark), -1px 0 0 var(--piece-dark)}.piece.black{color:var(--piece-dark);text-shadow:0 1px 0 var(--piece-light), 0 -1px 0 var(--piece-light), 1px 0 0 var(--piece-light), -1px 0 0 var(--piece-light)}.trace-panel{margin:8px 0 4px}.trace{background:var(--trace-ground);width:100%;height:72px;display:block}.trace-axis{stroke:#3a4038;stroke-width:1px;stroke-dasharray:3 5;vector-effect:non-scaling-stroke}.trace-glow{fill:none;stroke:var(--trace-glow);stroke-width:6px;stroke-opacity:.25;stroke-linejoin:round;vector-effect:non-scaling-stroke}.trace-line{fill:none;stroke:var(--trace-glow);stroke-width:1.6px;stroke-linejoin:round;vector-effect:non-scaling-stroke}.trace-head{fill:#d8f0e2}.trace-labels{text-transform:uppercase;letter-spacing:.08em;color:var(--faint);justify-content:space-between;gap:12px;margin-top:6px;font-size:.68rem;font-weight:500;display:flex}.blunder{color:var(--loss);font-weight:600}.result-card strong{font-size:.95rem;font-weight:600}.result-card p{color:var(--muted);font-size:.85rem}.result-card.win strong{color:var(--accent)}.result-card.loss strong{color:var(--loss)}.lives{gap:6px;font-size:1rem;line-height:1.75rem;display:inline-flex}.life{color:var(--accent)}.life.spent{color:var(--hairline)}.build{flex-wrap:wrap;gap:6px;margin-top:2px;display:flex}.build-chip{border:1px solid var(--hairline);color:var(--muted);padding:4px 8px;font-size:.78rem}.build-chip.archetype{border-color:var(--ink);color:var(--ink)}.build-chip.rare{border-color:var(--accent);color:var(--accent)}.build-chip.edged{border-style:dashed}.card-option{text-align:left;align-items:flex-start;width:100%}.card-name{letter-spacing:-.01em;justify-content:space-between;align-items:baseline;gap:10px;width:100%;font-size:1rem;font-weight:600;display:flex}.tier-mark{text-transform:uppercase;letter-spacing:.08em;color:var(--faint);flex:none;font-size:.66rem;font-weight:500}.tier-mark.strong{color:var(--muted)}.tier-mark.rare{color:var(--accent)}.edge-mark{text-transform:uppercase;letter-spacing:.08em;color:var(--loss);font-size:.66rem;font-weight:500}.card-option:disabled{opacity:.45;cursor:default}.card-option .muted{line-height:1.35}.result-card .action{margin-top:12px}.result-card.draw strong{color:var(--muted)}.controls{flex-direction:column;gap:12px;padding:20px 0;display:flex}.action{background:var(--ink);min-height:44px;color:var(--ground);margin-top:4px;font-size:.88rem;font-weight:500}.action:disabled{opacity:.35;cursor:default}@media (prefers-reduced-motion:reduce){.piece{transition-duration:0s!important}}