:root{--felt: #1d4a36;--felt-deep: #12301f;--felt-line: #2f6a4f;--ivory: #fbf7ee;--ivory-2: #efe8d8;--ink: #1b1b1f;--ink-2: #2a2b30;--red: #b3262e;--brass: #d9b45a;--text: #eef3ea;--muted: #a9c2b1;--c1: #c0453b;--c2: #d9b45a;--c3: #3f8f8a;--c4: #4a6fa5;--c5: #8a5a9a;--c6: #d07a3a;--c7: #6a9a4a;--f-display: "Libre Caslon Text", "Georgia", "Times New Roman", serif;--f-ui: "Barlow Semi Condensed", "Arial Narrow", system-ui, sans-serif;--board: min( calc(100vw - 32px) , 820px);color-scheme:dark}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:radial-gradient(ellipse at 50% 20%,var(--felt) 0%,var(--felt) 45%,var(--felt-deep) 100%) fixed,var(--felt-deep);color:var(--text);font-family:var(--f-ui);-webkit-tap-highlight-color:transparent}#root{min-height:100%}.screen{min-height:100%;display:flex;flex-direction:column;align-items:center;gap:18px;padding-block:14px 24px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}.bar{width:var(--board);display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px}.bar .title{display:flex;align-items:center;gap:10px}.bar h1{margin:0;font-family:var(--f-display);font-style:italic;font-weight:400;font-size:1.7rem;letter-spacing:.01em;color:var(--ivory);white-space:nowrap}.back{width:34px;height:34px;padding:0;display:grid;place-items:center;font-size:1.1rem;line-height:1}.stats{display:flex;gap:18px;font-variant-numeric:tabular-nums;font-size:1.15rem;font-weight:600}.stats span{display:flex;flex-direction:column;line-height:1.1;min-width:3.2em}.stats small{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:500}.actions{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}button{font:600 .95rem var(--f-ui);letter-spacing:.03em;color:var(--text);background:transparent;border:1px solid var(--felt-line);border-radius:999px;padding:7px 14px;cursor:pointer;transition:background .15s,border-color .15s;touch-action:manipulation}button:hover:not(:disabled){border-color:var(--muted);background:#ffffff0d}button:disabled{opacity:.4;cursor:default}button:focus-visible,[tabindex]:focus-visible,.slot:focus-visible{outline:2px solid var(--brass);outline-offset:2px}button.primary{background:var(--brass);border-color:var(--brass);color:var(--felt-deep)}button.primary:hover:not(:disabled){background:#e6c46e}.seg{display:flex;border:1px solid var(--felt-line);border-radius:999px;padding:2px}.seg button{border:0;padding:5px 11px}.seg button.on{background:var(--felt-line);color:var(--ivory)}.shake{animation:shake .3s}@keyframes shake{25%{translate:-4px 0}75%{translate:4px 0}}.float{position:fixed;bottom:calc(20px + env(safe-area-inset-bottom,0px));left:50%;transform:translate(-50%);padding:12px 26px;font-size:1.05rem;box-shadow:0 6px 20px #00000059;z-index:20}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;display:grid;place-items:center;background:#0a1a1199;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}.overlay-card{background:var(--ivory);color:var(--ink);border-radius:14px;padding:28px 32px;text-align:center;max-width:340px;box-shadow:0 20px 60px #00000080;animation:rise .4s ease-out}.overlay-card h2{font-family:var(--f-display);font-style:italic;font-weight:400;font-size:2.6rem;margin:4px 0 6px;text-wrap:balance}.overlay-card p{margin:0 0 18px;font-size:1.05rem}.overlay-card .eyebrow{margin:0;color:var(--red);font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600}.overlay-card .row-btns{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.overlay-card button:not(.primary){color:var(--ink);border-color:#cfc6b2}@keyframes rise{0%{transform:translateY(16px);opacity:.4}}.hint{width:var(--board);color:var(--muted);font-size:.85rem;text-align:center;margin:0;text-wrap:balance}.cabinet{position:relative;background:var(--ink);border:2px solid var(--felt-line);border-radius:12px;box-shadow:0 10px 30px #00000059,inset 0 0 0 4px var(--ink-2);overflow:hidden;touch-action:none}.cabinet canvas{display:block;width:100%;height:100%}.cabinet .msg{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;text-align:center;background:#1b1b1f8c;color:var(--ivory);font-family:var(--f-display);font-style:italic;font-size:1.5rem;padding:16px;pointer-events:none}.cabinet .msg small{display:block;font-family:var(--f-ui);font-style:normal;font-size:.95rem;color:var(--muted);margin-top:6px;letter-spacing:.04em}.pad{display:grid;gap:8px;-webkit-user-select:none;user-select:none}.pad button{padding:12px 0;font-size:1.1rem;border-radius:10px;min-width:56px}@media(max-width:520px){.bar h1{font-size:1.35rem}.actions{margin-left:0;width:100%}.actions>:last-child{margin-left:auto}}@media(prefers-reduced-motion:reduce){.shake,.overlay-card{animation:none}}.klondike{--gap: clamp(5px, 1.3vw, 14px);--cw: calc((var(--board) - 6 * var(--gap)) / 7);--ch: calc(var(--cw) * 1.4);--r: calc(var(--cw) * .08);--fan-down: calc(var(--cw) * .14);--fan-up: calc(var(--cw) * .3);--fan-x: calc(var(--cw) * .24);--back: #6e1f2b;--back-line: #8f3240}.klondike .board{width:var(--board);display:flex;flex-direction:column;gap:max(14px,calc(var(--gap) * 2.2));padding-bottom:calc(var(--ch) * 1.2)}.klondike .row{display:grid;grid-template-columns:repeat(7,var(--cw));gap:var(--gap)}.klondike .slot{position:relative;width:var(--cw);height:var(--ch);border-radius:var(--r);border:1.5px solid var(--felt-line);background:#0000001f}.klondike .spacer,.klondike .waste{border:0;background:none}.klondike .spacer{width:var(--cw)}.klondike .stock{cursor:pointer;display:grid;place-items:center;-webkit-user-select:none;user-select:none}.klondike .stock .card{position:absolute;top:0;right:0;bottom:0;left:0}.klondike .stack-depth{box-shadow:1px 1px 0 var(--ivory),2px 2px #00000059,3px 3px 0 var(--ivory),4px 4px #00000059!important}.klondike .recycle{font-size:calc(var(--cw) * .45);color:var(--muted)}.klondike .count{position:absolute;top:-8px;right:-8px;z-index:2;min-width:22px;padding:2px 6px;border-radius:999px;text-align:center;background:var(--felt-deep);border:1px solid var(--felt-line);font-size:.72rem;color:var(--muted);font-variant-numeric:tabular-nums}.klondike .waste .card{position:absolute;top:0}.klondike .foundation{display:grid;place-items:center}.klondike .foundation .card{position:absolute;top:0;right:0;bottom:0;left:0}.klondike .ghost{font-size:calc(var(--cw) * .5);color:var(--felt-line);line-height:1}.klondike .column{position:relative;width:var(--cw);min-height:calc(var(--ch) * 3.6)}.klondike .column>.slot.empty{position:absolute;top:0;left:0}.klondike .column>.card{position:absolute;left:0}.klondike .card{position:relative;width:var(--cw);height:var(--ch);border-radius:var(--r);-webkit-user-select:none;user-select:none;touch-action:none;box-shadow:0 1px 2px #00000059,0 2px 6px #0000002e}.klondike .card.grab{cursor:grab}.klondike .card.face{background:var(--ivory);border:1px solid #d8d0bd;color:var(--ink);font-family:var(--f-display)}.klondike .card.red{color:var(--red)}.klondike .idx{position:absolute;display:flex;flex-direction:column;align-items:center;line-height:.95;font-size:calc(var(--cw) * .24)}.klondike .idx b{font-weight:700;letter-spacing:-.04em}.klondike .idx i{font-style:normal;font-size:.85em}.klondike .idx.tl{top:calc(var(--cw) * .05);left:calc(var(--cw) * .06)}.klondike .idx.br{bottom:calc(var(--cw) * .05);right:calc(var(--cw) * .06);transform:rotate(180deg)}.klondike .pip{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:calc(var(--cw) * .5);font-style:italic;opacity:.9;padding-top:calc(var(--cw) * .04)}.klondike .card.back{background:repeating-linear-gradient(45deg,transparent 0 5px,var(--back-line) 5px 6px),repeating-linear-gradient(-45deg,transparent 0 5px,var(--back-line) 5px 6px),var(--back);border:calc(var(--cw) * .05) solid var(--ivory)}.klondike .drag-layer{position:fixed;z-index:50;pointer-events:none;width:var(--cw)}.klondike .drag-layer .card{position:absolute;left:0;box-shadow:0 10px 24px #00000073;transform:rotate(1.5deg)}@media(max-width:520px){.klondike .card.back{border-width:2px}}.minesweeper .ms-scroll{max-width:100%;overflow-x:auto;padding:4px}.minesweeper .ms-grid{--cell: clamp(22px, calc((min(100vw, 820px) - 40px) / var(--cols)), 34px);display:grid;grid-template-columns:repeat(var(--cols),var(--cell));gap:2px;padding:8px;background:var(--felt-deep);border:1px solid var(--felt-line);border-radius:10px;width:max-content;margin:0 auto;-webkit-user-select:none;user-select:none}.minesweeper .ms-cell{width:var(--cell);height:var(--cell);padding:0;border-radius:4px;border:0;background:var(--ivory-2);box-shadow:inset 0 -2px #0000002e;color:var(--ink);font:700 calc(var(--cell) * .55) var(--f-ui);display:grid;place-items:center;line-height:1;touch-action:manipulation;-webkit-touch-callout:none;transition:none}.minesweeper .ms-cell:hover:not(.open){background:var(--ivory)}.minesweeper .ms-cell.open{background:#ffffff12;box-shadow:none;color:var(--text);cursor:default}.minesweeper .ms-cell.flag{color:var(--red)}.minesweeper .ms-cell.boom{background:var(--red);color:var(--ivory)}.minesweeper .ms-cell.wrong{background:#6b5b3a;color:var(--ivory)}.minesweeper .ms-cell.open.n1{color:#8fb8ff}.minesweeper .ms-cell.open.n2{color:#8fd39a}.minesweeper .ms-cell.open.n3{color:#ff8c7a}.minesweeper .ms-cell.open.n4{color:#c9a0ff}.minesweeper .ms-cell.open.n5{color:#ffb35c}.minesweeper .ms-cell.open.n6{color:#6fe0d8}.minesweeper .ms-cell.open.n7{color:var(--ivory)}.minesweeper .ms-cell.open.n8{color:var(--muted)}.minesweeper .on-flag{background:var(--red);border-color:var(--red);color:var(--ivory)}.g2048 .g-board{--size: min( calc(100vw - 32px) , 440px);--gap: calc(var(--size) * .03);--tile: calc((var(--size) - 5 * var(--gap)) / 4);position:relative;width:var(--size);height:var(--size);padding:var(--gap);display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap);background:var(--felt-deep);border:1px solid var(--felt-line);border-radius:12px;touch-action:none;-webkit-user-select:none;user-select:none}.g2048 .g-cell{border-radius:8px;background:#ffffff0d}.g2048 .g-tile{position:absolute;left:calc(var(--gap) + var(--c) * (var(--tile) + var(--gap)));top:calc(var(--gap) + var(--r) * (var(--tile) + var(--gap)));width:var(--tile);height:var(--tile);border-radius:8px;display:grid;place-items:center;font:700 calc(var(--tile) * .4) var(--f-ui);font-variant-numeric:tabular-nums;transition:left .11s ease-out,top .11s ease-out;box-shadow:inset 0 -3px #00000026}.g2048 .g-tile.fresh span{display:block;animation:g-in .18s .08s both}.g2048 .g-tile.pop span{display:block;animation:g-pop .18s .08s}@keyframes g-in{0%{transform:scale(0)}}@keyframes g-pop{50%{transform:scale(1.18)}}.g2048 .v2{background:#fbf7ee;color:var(--ink)}.g2048 .v4{background:#efe3c6;color:var(--ink)}.g2048 .v8{background:#e8c98a;color:var(--ink)}.g2048 .v16{background:#d9b45a;color:var(--ink)}.g2048 .v32{background:#d07a3a;color:var(--ivory)}.g2048 .v64{background:#c0453b;color:var(--ivory)}.g2048 .v128{background:#b3262e;color:var(--ivory);font-size:calc(var(--tile) * .34)}.g2048 .v256{background:#8f1f2a;color:var(--ivory);font-size:calc(var(--tile) * .34)}.g2048 .v512{background:#6e1f2b;color:var(--brass);font-size:calc(var(--tile) * .34)}.g2048 .v1024{background:#3f8f8a;color:var(--ivory);font-size:calc(var(--tile) * .28)}.g2048 .v2048{background:#1b1b1f;color:var(--brass);font-size:calc(var(--tile) * .28);box-shadow:0 0 0 2px var(--brass),0 0 18px #d9b45a80}.g2048 .v4096{background:#1b1b1f;color:var(--ivory);font-size:calc(var(--tile) * .28);box-shadow:0 0 0 2px var(--ivory)}@media(prefers-reduced-motion:reduce){.g2048 .g-tile{transition:none}.g2048 .g-tile span{animation:none!important}}.sudoku .su-wrap{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;align-items:flex-start;width:var(--board)}.sudoku .su-grid{--size: min( calc(100vw - 32px) , 486px);--cell: calc(var(--size) / 9);width:var(--size);display:grid;grid-template-columns:repeat(9,1fr);background:var(--ivory);border:3px solid var(--ink);border-radius:6px;overflow:hidden;box-shadow:0 10px 30px #0000004d}.sudoku .su-cell{aspect-ratio:1;border-radius:0;border:0;border-right:1px solid #d6cdb8;border-bottom:1px solid #d6cdb8;padding:0;background:transparent;color:#1f4f8a;font:600 calc(var(--cell) * .56) var(--f-ui);display:grid;place-items:center;transition:none}.sudoku .su-cell.br{border-right:2px solid var(--ink)}.sudoku .su-cell.bb{border-bottom:2px solid var(--ink)}.sudoku .su-cell.given{color:var(--ink);font-family:var(--f-display);font-weight:700;font-size:calc(var(--cell) * .5)}.sudoku .su-cell.peer{background:#f1ead9}.sudoku .su-cell.same{background:#ead7a4}.sudoku .su-cell.sel{background:var(--brass)}.sudoku .su-cell.bad{color:var(--red);background:#f6d6d2}.sudoku .su-cell.sel.bad{background:#e8a9a1}.sudoku .su-cell:hover:not(.sel){background:#f5eedd;border-color:#d6cdb8}.sudoku .su-cell.br:hover{border-right-color:var(--ink)}.sudoku .su-cell.bb:hover{border-bottom-color:var(--ink)}.sudoku .notes{display:grid;grid-template-columns:repeat(3,1fr);width:100%;height:100%;padding:2px}.sudoku .notes i{font-style:normal;font-size:calc(var(--cell) * .22);line-height:1;color:#6b6a63;display:grid;place-items:center;font-weight:500}.sudoku .notes i.hl{color:var(--ink);font-weight:700}.sudoku .su-pad{display:grid;grid-template-columns:repeat(3,64px);gap:8px}.sudoku .su-pad button{height:58px;border-radius:10px;font-size:1.5rem;padding:0;position:relative}.sudoku .su-pad button small{position:absolute;right:7px;top:4px;font-size:.65rem;color:var(--muted)}.sudoku .su-pad .wide{grid-column:span 3;font-size:1rem;height:44px}.sudoku .su-pad button:nth-last-child(-n+2){font-size:1rem;height:44px}.sudoku .su-pad #su-erase{grid-column:span 2}.sudoku .su-pad .on{background:var(--brass);color:var(--felt-deep);border-color:var(--brass)}@media(max-width:760px){.sudoku .su-pad{grid-template-columns:repeat(9,1fr);width:min(calc(100vw - 32px),486px);gap:5px}.sudoku .su-pad button{height:50px;font-size:1.3rem}.sudoku .su-pad .wide,.sudoku .su-pad #su-erase,.sudoku .su-pad #su-undo{grid-column:span 3}}.arcade .cabinet.square{width:min(calc(100vw - 32px),540px,calc(100vh - 250px));min-width:260px;aspect-ratio:1}.arcade .cabinet.wide{width:min(calc(100vw - 32px),760px,calc((100vh - 200px) * 4 / 3));min-width:280px;aspect-ratio:4 / 3}.arcade .cabinet.tall{width:min(calc(100vw - 32px),420px,calc((100vh - 250px)*.75));min-width:240px;aspect-ratio:450 / 600}.arcade .cabinet{max-width:100%}.arcade .dpad{grid-template-columns:repeat(3,64px)}.arcade .dpad span{display:block}.arcade .stack-pad{grid-template-columns:repeat(5,minmax(56px,1fr));width:min(calc(100vw - 32px),420px)}@media(hover:hover)and (pointer:fine){.arcade .dpad,.arcade .stack-pad{display:none}}.arcade .cabinet.crossing{width:min(calc(100vw - 32px),520px,calc((100vh - 250px) * 520 / 550));min-width:260px;aspect-ratio:520 / 550}.arcade .cabinet.maze{width:min(calc(100vw - 32px),480px,calc((100vh - 250px) * 456 / 504));min-width:260px;aspect-ratio:456 / 504}.arcade .cabinet.siege{width:min(calc(100vw - 32px),480px,calc((100vh - 240px)*.875));min-width:260px;aspect-ratio:560 / 640}.arcade .cabinet.aim{cursor:crosshair}.arcade .shoot-pad{grid-template-columns:1fr 1.4fr 1fr;width:min(calc(100vw - 32px),420px)}.arcade .drift-pad{grid-template-columns:repeat(5,1fr);width:min(calc(100vw - 32px),460px)}.arcade .pad .fire{background:var(--red);border-color:var(--red);color:var(--ivory)}.arcade .pad button:active{background:#ffffff1f}@media(hover:hover)and (pointer:fine){.arcade .shoot-pad,.arcade .drift-pad{display:none}}.hub{gap:28px;padding-block:28px 40px}.hub-head{width:var(--board)}.hub-head h1{margin:0;font-family:var(--f-display);font-style:italic;font-weight:400;font-size:clamp(2.4rem,7vw,3.6rem);line-height:1;color:var(--ivory);text-wrap:balance}.hub-eyebrow{margin:0 0 8px;color:var(--brass);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600}.shelf{width:var(--board);display:flex;flex-direction:column;gap:12px}.shelf h2{margin:0;display:flex;align-items:center;gap:12px;font:600 .8rem var(--f-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}.shelf h2:after{content:"";flex:1;height:1px;background:var(--felt-line)}.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.tile{display:flex;gap:14px;align-items:center;text-align:left;padding:10px;border-radius:12px;border:1px solid #d8d0bd;background:var(--ivory);color:var(--ink);box-shadow:0 2px #00000040,0 8px 20px #00000026;transition:transform .15s ease-out,box-shadow .15s ease-out}.tile:hover:not(:disabled){background:#fffdf7;border-color:#d8d0bd;transform:translateY(-2px);box-shadow:0 4px #00000040,0 14px 26px #0003}.tile .thumb{width:104px;flex:none;height:auto}.tile-text{display:flex;flex-direction:column;gap:3px;min-width:0}.tile-text strong{font:italic 400 1.35rem var(--f-display);letter-spacing:0}.tile-text span{font-weight:500;font-size:.9rem;letter-spacing:.01em;color:#4a4a50;line-height:1.3}.tile-text em{font-style:normal;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--red);font-weight:600;margin-top:2px}@media(prefers-reduced-motion:reduce){.tile{transition:none}}
