:root{
 --paper:#212121;--line:transparent;--ink:#eeeeee;--mute:#aaaaaa;--soft:#888888;--accent:#c8c8c8;
 --surface:linear-gradient(180deg,#282828,#252525);
 --raised:0 1px 3px #00000038,inset 0 1px 1px #ffffff04;
 --well:inset 0 1px 2px #00000040,inset 0 -1px 1px #ffffff02;
 --key:0 1px 2px #00000045,inset 0 1px 1px #ffffff08;
 --key-down:inset 0 1px 2px #00000040,inset 0 -1px 1px #ffffff03;
 --ease:cubic-bezier(.2,.8,.2,1);--spring:cubic-bezier(.22,1.04,.36,1);
}
body{background:#212121}body::before{display:none}
.header,.site-header,footer,.section-bar,.instruction-strip,.game-footnote,.rules-list,.console-top,.metrics,.metric,.stats-row,.card-bottom,.help-note{border:0}
.header,.site-header{height:86px}.brand,.wordmark,.welcome h1,.game-intro h1,.intro h1{text-shadow:none}
.header-label,.eyebrow,.console-id,footer{color:#969696}.welcome{padding:40px 0 32px}.welcome h1 span,.intro h1 span{color:#909090}
.section-bar{padding-top:15px;margin-bottom:20px}.game-cards{gap:24px}
.game-card{border:0;border-radius:14px;background:var(--surface);box-shadow:var(--raised);isolation:isolate;position:relative;overflow:hidden;transition:transform 220ms var(--spring),box-shadow 220ms var(--ease);animation:surface-arrive 380ms var(--ease) backwards}
.game-card:nth-child(2){animation-delay:35ms}.game-card:nth-child(3){animation-delay:70ms}
.game-card:hover{border:0;transform:translateY(-1px);box-shadow:0 2px 3px #00000045,inset 0 1px 1px #ffffff05}.game-card:active{transform:translateY(.5px) scale(.998);transition-duration:90ms}
.card-preview{border:0!important;margin:10px 10px 0;border-radius:9px;height:246px;box-shadow:var(--well);overflow:hidden}
.card-preview::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,transparent 25%,#ffffff05 46%,transparent 67%);opacity:0;transform:translateX(-20%);transition:opacity 280ms var(--ease),transform 500ms var(--ease)}
.game-card:hover .card-preview::after{opacity:1;transform:translateX(10%)}
.blocks-preview,.snake-preview,.merge-preview,.chroma-preview{background:linear-gradient(180deg,#222222,#202020);color:#b5b5b5}
.preview-blocks,.preview-snake,.preview-merge,.preview-chroma{transition:transform 320ms var(--spring);transform:none}
.game-card:hover :is(.preview-blocks,.preview-snake,.preview-merge,.preview-chroma){transform:translateY(-1px)}
.preview-blocks i,.preview-blocks i.filled,.preview-snake i,.preview-snake i.segment,.preview-snake i.food{border:0}
.preview-blocks i:not(.filled),.preview-snake i:not(.segment):not(.food){background:#ffffff02;box-shadow:none}
.preview-blocks i.filled,.preview-snake i.segment,.preview-merge i:not(:empty),.preview-chroma i{box-shadow:0 1px 1px #00000028,inset 0 1px 1px #ffffff0c}
.preview-merge{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr))}
.preview-merge i{min-height:0;line-height:1}.preview-merge i:empty{box-shadow:inset 0 1px 1px #00000020;background:#252525}
.preview-snake i.food{box-shadow:0 1px 2px #00000025}
.card-body{padding:21px 22px 0}.card-bottom{margin-top:12px;padding-top:15px;padding-bottom:20px}.card-title-line h3{font-weight:450}.game-name{color:#b8b8b8}.card-description{color:#a8a8a8}
.count,.tag{border:0;background:#222222;box-shadow:inset 0 1px 1px #00000020;color:#aaaaaa;border-radius:4px}
.extra-game{border:0;border-radius:9px;background:var(--surface);box-shadow:var(--raised);padding:18px 21px;transition:transform 180ms var(--ease)}
.extra-game:hover{transform:translateY(-.5px)}.extra-game:active{transform:translateY(.5px)}
.game-switcher{border:0;background:#212121f5;gap:7px;padding:13px 0 18px;overflow-y:hidden}
.game-switcher a{border:0;padding:10px 14px;color:#b0b0b0;transition:box-shadow 180ms var(--ease),color 180ms var(--ease);border-radius:6px}
.game-switcher a:hover{background:var(--surface);box-shadow:var(--key);color:#eeeeee;transform:none}
.game-switcher a[aria-current='page']{border:0;background:#1e1e1e;color:#e8e8e8;box-shadow:var(--key-down);text-shadow:none;transform:none}
.game-switcher a:active{transform:none;box-shadow:var(--key-down)}
.game-panel,.console{border:0;background:var(--surface);border-radius:14px;box-shadow:var(--raised)}
.game-panel{padding:22px}.console{padding:0 22px}.console-top{padding-top:21px;padding-bottom:14px}
.stats-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:2px 0 14px;align-items:start}
.stats-row>div{min-width:0}.stats-row>div:nth-child(2){justify-self:center}.stats-row>div:last-child{justify-self:end}
.stat-label{font-size:12px;line-height:1.5;margin-bottom:8px;white-space:nowrap}
.stat-value,.metric-number{font-family:var(--sans);font-size:28px;font-weight:450;font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"zero" 0;letter-spacing:-.02em;line-height:1.15;text-shadow:none;display:inline-block;transform-origin:50% 70%;will-change:auto}
.metric{border:0;padding-left:16px}.metrics{padding-top:17px;padding-bottom:18px}#best{font-family:var(--sans);font-weight:450;font-variant-numeric:tabular-nums lining-nums;margin-left:0}.preview-merge i{font-family:var(--sans);font-weight:450}.stat-label,.metric-label{color:#a2a2a2}.unit{color:#888888}
.board-container,.board-wrap,.blocks-board-wrap{border:0;background:#1c1c1c;box-shadow:var(--well);border-radius:8px;padding:8px;isolation:isolate}
.board-container{margin-top:12px}.blocks-board-wrap{padding:8px;border-radius:7px}.blocks-stage{gap:12px}
.snake-canvas,.blocks-canvas{border-radius:4px}.next-piece{border:0;border-radius:7px;background:#222222;box-shadow:var(--well);padding:12px 6px}
.next-piece p,.blocks-side-note{color:#a0a0a0}.game-panel-bottom{margin-top:18px}
.merge-board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:8px;aspect-ratio:1;min-height:0}
.merge-cell{min-width:0;min-height:0;aspect-ratio:1;line-height:1;border:0;border-radius:6px;background:#232323;color:#eeeeee;font-family:var(--sans);font-size:clamp(22px,5.2vw,34px);font-weight:450;letter-spacing:-.025em;box-shadow:inset 0 1px 1px #00000024;position:relative;z-index:1;text-shadow:none}
.merge-cell:not([data-value='0']){box-shadow:0 1px 2px #00000030,inset 0 1px 1px #ffffff0b;text-shadow:none}
.merge-cell[data-value='2']{background:#4b4b4b;color:#eeeeee}.merge-cell[data-value='4']{background:#585858;color:#f3f3f3}
.merge-cell[data-value='8']{background:#666666;color:#ffffff}.merge-cell[data-value='16']{background:#727272;color:#ffffff}
.merge-cell[data-value='32']{background:#858585;color:#101010}.merge-cell[data-value='64']{background:#949494;color:#141414}
.merge-cell[data-value='128']{background:#a3a3a3;color:#171717}.merge-cell[data-value='256']{background:#b1b1b1;color:#1a1a1a}
.merge-cell[data-value='512']{background:#bfbfbf;color:#1c1c1c}.merge-cell[data-value='1024']{background:#cccccc;color:#202020}
.merge-cell[data-value='2048']{background:#dddddd;color:#202020}
.merge-cell[data-value='1024'],.merge-cell[data-value='2048']{font-size:clamp(17px,4.9vw,25px)}
.tile{border:0;border-radius:6px;box-shadow:0 1px 2px #00000030,inset 0 1px 1px #ffffff0b;transition:transform 120ms var(--spring),box-shadow 120ms var(--ease)}
.tile:enabled:hover{transform:translateY(-.5px);box-shadow:0 1px 3px #00000038,inset 0 1px 1px #ffffff0b}
.tile:enabled:active{transform:translateY(.5px) scale(.99);box-shadow:inset 0 1px 2px #00000022}
.tile.reveal::after{border:0;box-shadow:none;background:#ffffff07}
.timer-track{height:3px;background:#1b1b1b;box-shadow:inset 0 1px 1px #00000040;overflow:hidden}.timer-track>div{box-shadow:none}
.status-light,.status-light.running{box-shadow:none}
.quiet-button,.small-button,.direction-button,.blocks-controls button{border:0;background:var(--surface);border-radius:7px;box-shadow:var(--key);transition:transform 130ms var(--spring),box-shadow 130ms var(--ease),filter 130ms var(--ease)}
.quiet-button:hover,.small-button:hover,.direction-button:hover,.blocks-controls button:hover{background:var(--surface);filter:brightness(1.035);transform:none}
.quiet-button:active,.small-button:active,.direction-button:active,.blocks-controls button:active{background:#242424;box-shadow:var(--key-down);transform:translateY(.5px);filter:none;transition-duration:70ms}
.solid-button,.primary-button{border:0;min-height:44px;background:linear-gradient(180deg,#e6e6e6,#d9d9d9);color:#262626;border-radius:7px;box-shadow:0 1px 2px #00000040,inset 0 1px 1px #ffffff25;font-size:14px;transition:transform 140ms var(--spring),box-shadow 160ms var(--ease),filter 140ms var(--ease)}
.solid-button:hover,.primary-button:hover{transform:translateY(-.5px);filter:brightness(1.025);box-shadow:0 2px 3px #00000040,inset 0 1px 1px #ffffff25}
.solid-button:active,.primary-button:active{transform:translateY(.5px);box-shadow:inset 0 1px 2px #00000022,0 1px 1px #00000020;transition-duration:70ms}.button-arrow{font-size:18px}
.game-controls,.blocks-controls{gap:8px;margin-top:18px}.direction-button{border-radius:7px}
kbd{border:0;background:#282828;box-shadow:var(--key);color:#bbbbbb}
.board-overlay,.game-overlay{border:0;background:#242424f0;border-radius:8px;box-shadow:inset 0 1px 2px #00000025;backdrop-filter:blur(8px);animation:overlay-in 220ms var(--ease);z-index:7}
.blocks-overlay{background:#222222f0;border-radius:7px;z-index:7}
dialog{border:0;background:var(--surface);border-radius:12px;box-shadow:0 2px 3px #00000070;animation:overlay-in 220ms var(--ease)}
dialog::backdrop{background:#10101099}dialog .help-note{border:0;padding-top:13px}
.score-pop{display:none}.board-wrap.shake{animation:quiet-miss 210ms var(--ease)}
.fx-layer{position:absolute;inset:0;z-index:5;border-radius:inherit;pointer-events:none;opacity:0;contain:strict}
.fx-row{position:absolute;left:8px;right:8px;top:calc(8px + (100% - 16px)*var(--row)/20);height:calc((100% - 16px)/20);border-radius:2px;background:linear-gradient(90deg,#eeeeee00,#eeeeeeb0 30%,#f5f5f5c0 60%,#eeeeee00);z-index:6;pointer-events:none;transform-origin:center;opacity:0}
:is(button,a,.tile,.blocks-canvas):focus-visible,.game-switcher a:focus-visible{outline:1.5px solid #bdbdbd;outline-offset:3px}
@keyframes surface-arrive{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@keyframes overlay-in{from{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}
@keyframes quiet-miss{0%,100%{transform:translateX(0)}30%{transform:translateX(-1px)}65%{transform:translateX(.5px)}}
@media(max-width:1000px){.game-cards{gap:20px}.card-preview{height:235px;margin:10px 10px 0}.card-body{padding:21px 19px 0}}
@media(max-width:760px){.header,.site-header{height:76px}.welcome{padding:28px 0 24px}.game-switcher{gap:5px;padding:11px 0 16px}.game-switcher a{padding:9px 11px;font-size:13px}.game-cards{gap:20px}.game-card{grid-template-columns:40% 60%;border-radius:12px}.card-preview{height:calc(100% - 20px);margin:10px 0 10px 10px;min-height:235px;border-radius:8px}.card-body{padding:21px 18px 0}.card-bottom{padding-bottom:20px}.game-panel{padding:18px;border-radius:12px}.blocks-panel{padding:16px}.console{padding:0 18px;border-radius:12px}.board-container,.board-wrap,.blocks-board-wrap{padding:8px}.game-controls,.blocks-controls{gap:8px}.direction-button{width:46px}.extra-game{padding:17px 19px}.stat-value,.metric-number{font-size:24px}.stats-row{gap:12px;padding-bottom:12px}.next-piece{padding:12px 6px}.game-card:hover{transform:none}.game-card:hover :is(.preview-blocks,.preview-snake,.preview-merge,.preview-chroma){transform:none}}
@media(max-width:480px){.game-card{display:block}.card-preview{height:235px;min-height:235px;margin:10px 10px 0}.card-body{padding:21px 21px 0}.card-description{min-height:0}.card-bottom{padding-bottom:21px}.blocks-stage{gap:10px;grid-template-columns:minmax(0,250px) 66px}}
@media(max-width:380px){.merge-board{gap:6px}.stat-value,.metric-number{font-size:22px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.game-card:hover,.game-card:active,.extra-game:hover,.extra-game:active,.game-switcher a:hover,.game-switcher a:active,.solid-button:hover,.solid-button:active,.primary-button:hover,.primary-button:active,.quiet-button:hover,.quiet-button:active,.small-button:hover,.small-button:active,.direction-button:hover,.direction-button:active,.blocks-controls button:hover,.blocks-controls button:active,.tile:enabled:hover,.tile:enabled:active{transform:none!important}.game-card:hover :is(.preview-blocks,.preview-snake,.preview-merge,.preview-chroma){transform:none!important}.fx-layer,.fx-row{display:none!important}}
