:root,:root[data-theme=dark]{--turf: #1e1f22;--turf-dark: #0a141f;--turf-line: #24405a;--chalk: #ede7d9;--chalk-dim: #b9b2a1;--brass: #c9a227;--brass-bright: #e4c04f;--amber: #ffa94d;--scarlet: #a6192e;--navy: #16233b;--correct: #54ff90;--correct-bright: #4fc172;--surface-1: rgba(237, 231, 217, .05);--tint-gold: rgba(201, 162, 39, .12);--tint-red: rgba(166, 25, 46, .12);--tint-amber: rgba(224, 141, 60, .22);--tint-correct: rgba(84, 255, 144, .12);--text-danger: #ff5c5c;--shadow-color: rgba(0, 0, 0, .4);--glow-gold: rgba(201, 162, 39, .25);--hover-gold-tint: rgba(201, 162, 39, .18);--radial-glow: transparent}:root[data-theme=light]{--turf: #f2ede2;--turf-dark: #1f1608;--turf-line: #d8cfb8;--chalk: #2a2318;--chalk-dim: #6f6552;--brass: #b8860b;--brass-bright: #bd8b17;--amber: #d9720f;--scarlet: #dc3f54;--navy: #fdf9ef;--correct: #54ff90;--correct-bright: #4fc172;--surface-1: rgba(31, 22, 8, .04);--tint-gold: rgba(184, 134, 11, .14);--tint-red: rgba(143, 22, 38, .1);--tint-amber: rgba(181, 101, 29, .18);--tint-correct: rgba(47, 143, 78, .14);--text-danger: #880017;--shadow-color: rgba(20, 20, 10, .15);--glow-gold: rgba(184, 134, 11, .18);--hover-gold-tint: rgba(184, 134, 11, .16);--radial-glow: rgba(184, 134, 11, .06)}:root{--font-display: "Anton", "Arial Narrow", sans-serif;--font-body: "Inter", system-ui, -apple-system, sans-serif;--font-mono: "JetBrains Mono", "Courier New", monospace}*{box-sizing:border-box}html,body{margin:0;padding:0;min-height:100%}body{background:radial-gradient(ellipse at top,var(--radial-glow),transparent 55%),var(--turf);color:var(--chalk);font-family:var(--font-body);-webkit-font-smoothing:antialiased;transition:background-color .2s ease,color .2s ease}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}.submit-btn{font-family:var(--font-display);letter-spacing:.04em;font-size:.95rem;padding:0 1.3rem;background:var(--brass);color:var(--turf-dark);border:none;border-radius:4px;cursor:pointer;transition:background-color .15s ease}.submit-btn:hover{background:var(--brass-bright)}.submit-btn:focus-visible{outline:2px solid var(--brass-bright);outline-offset:2px}.error-msg{margin:0;color:var(--text-danger);font-size:.85rem}.board{display:flex;flex-direction:column;gap:4px;border-bottom:2px solid var(--turf-line);padding-bottom:1rem}.board-row{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:4px;align-items:stretch}.board-head{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--chalk-dim);padding:0 .15rem .3rem;text-align:center}.col-title{display:flex;align-items:center;justify-content:center;text-align:center;font-size:.85rem;font-weight:600;padding:.5rem .6rem;overflow-wrap:anywhere}.board-row:not(.board-head) .col-title{background:var(--surface-1);border:1px solid var(--turf-line);border-radius:3px}.cell{display:flex;align-items:center;justify-content:center;gap:.15rem;font-family:var(--font-mono);font-size:.82rem;font-weight:500;padding:.5rem .3rem;border-radius:3px;border:1px solid var(--turf-line);text-align:center}.cell-match{background:var(--correct);border-color:var(--correct-bright);color:var(--turf-dark);font-weight:700}.cell-close{background:var(--tint-amber);border-color:var(--amber);color:var(--amber)}.cell-far{background:var(--tint-red);border-color:var(--scarlet);color:var(--text-danger)}.arrow{font-style:normal;font-size:.9em}.winning-row .col-title{border-color:var(--correct-bright)!important;color:var(--correct-bright)}@keyframes title-pop{0%{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}@keyframes cell-flip{0%{transform:rotateX(-90deg);opacity:0}to{transform:rotateX(0);opacity:1}}.board-row:not(.board-head){perspective:400px}.board-row:not(.board-head) .col-title{animation:title-pop .15s ease-out}.board-row:not(.board-head) .cell{animation:cell-flip .35s ease-in backwards}.board-row:not(.board-head) .cell:nth-of-type(2){animation-delay:.12s}.board-row:not(.board-head) .cell:nth-of-type(3){animation-delay:.27s}.board-row:not(.board-head) .cell:nth-of-type(4){animation-delay:.42s}.board-row:not(.board-head) .cell:nth-of-type(5){animation-delay:.57s}@media(max-width:480px){.board-row{grid-template-columns:1.1fr repeat(4,1fr)}.cell,.col-title{font-size:.72rem;padding:.4rem .2rem}.submit-btn{padding:.65rem 1.3rem}}