:root{--color-bg: #faf8ef;--color-board: #bbada0;--color-cell-empty: #cdc1b4;--color-text: #776e65;--color-text-light: #f9f6f2;--color-button: #8f7a66;--color-button-hover: #9f8b77;--color-overlay: rgba(238, 228, 218, .73);--color-overlay-win: rgba(237, 194, 46, .5);--bg-a: rgba(242, 177, 121, .3);--bg-b: rgba(120, 165, 210, .22);--gap: clamp(6px, 2.4vw, 15px)}[data-theme=dark]{--color-bg: #1a1917;--color-board: #3b3733;--color-cell-empty: #4c4741;--color-text: #ece3d8;--color-text-light: #f9f6f2;--color-button: #a08d78;--color-button-hover: #b09c86;--color-overlay: rgba(26, 25, 23, .82);--color-overlay-win: rgba(237, 194, 46, .45);--bg-a: rgba(210, 170, 120, .16);--bg-b: rgba(96, 120, 160, .16)}[data-theme=neon]{--color-bg: #0d0221;--color-board: #241b4a;--color-cell-empty: #2f2560;--color-text: #e6e1ff;--color-text-light: #ffffff;--color-button: #7b2ff7;--color-button-hover: #9d4edd;--color-overlay: rgba(13, 2, 33, .82);--color-overlay-win: rgba(157, 78, 221, .5);--bg-a: rgba(157, 78, 221, .34);--bg-b: rgba(0, 200, 255, .2)}[data-theme=ocean]{--color-bg: #0a2540;--color-board: #14507a;--color-cell-empty: #1d6ca3;--color-text: #e0f2ff;--color-text-light: #ffffff;--color-button: #1e88c7;--color-button-hover: #34a0d8;--color-overlay: rgba(10, 37, 64, .82);--color-overlay-win: rgba(72, 202, 228, .5);--bg-a: rgba(52, 160, 216, .32);--bg-b: rgba(72, 202, 228, .22)}[data-theme=forest]{--color-bg: #e9f5e1;--color-board: #6a8f5f;--color-cell-empty: #86a878;--color-text: #2f4a2a;--color-text-light: #f5faf2;--color-button: #4e8a45;--color-button-hover: #5fa055;--color-overlay: rgba(233, 245, 225, .82);--color-overlay-win: rgba(78, 138, 69, .5);--bg-a: rgba(120, 170, 100, .3);--bg-b: rgba(196, 220, 150, .3)}[data-theme=sunset]{--color-bg: #2a1a2e;--color-board: #7a3b5a;--color-cell-empty: #9a4f6e;--color-text: #ffe8d6;--color-text-light: #ffffff;--color-button: #e8623a;--color-button-hover: #f47a52;--color-overlay: rgba(42, 26, 46, .82);--color-overlay-win: rgba(232, 98, 58, .5);--bg-a: rgba(244, 122, 82, .32);--bg-b: rgba(200, 80, 130, .26)}*{box-sizing:border-box}html,body{margin:0;padding:0;min-height:100%;overflow-x:hidden}html{background-color:var(--color-bg);transition:background-color .25s ease}body{font-family:Clear Sans,Helvetica Neue,Arial,sans-serif;background:transparent;color:var(--color-text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;transition:background-color .25s ease,color .25s ease}body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(65vw 65vw at 8% -5%,var(--bg-a),transparent 58%),radial-gradient(60vw 60vw at 102% 104%,var(--bg-b),transparent 58%),radial-gradient(48vw 48vw at 95% 4%,var(--bg-b),transparent 62%);transition:background .3s ease}button{font-family:inherit;cursor:pointer;border:none}.btn-primary{background:var(--color-button);color:var(--color-text-light);font-weight:700;font-size:clamp(.95rem,3.6vw,1.1rem);padding:.75rem clamp(1rem,4.5vw,1.75rem);border-radius:6px;transition:background-color .1s ease-in-out,transform .1s ease-in-out;min-height:44px}.btn-primary:hover{background:var(--color-button-hover)}.btn-primary:active{transform:translateY(1px)}.btn-primary:focus-visible{outline:3px solid var(--color-button);outline-offset:3px}.btn-primary.ghost{background:transparent;color:var(--color-text);box-shadow:inset 0 0 0 2px var(--color-button)}.btn-primary.ghost:hover{background:color-mix(in srgb,var(--color-button) 15%,transparent)}@media(prefers-reduced-motion:reduce){body,.btn-primary{transition:none}}