:root{--black:#000;--white:#fff;--green:#0f8f38;--soft:rgba(255,255,255,.7);--line:rgba(255,255,255,.25)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--black);color:var(--white);font-family:Arial,Helvetica,sans-serif}.game-shell{min-height:100vh;display:grid;place-items:center;padding:20px 12px}.game-card{width:min(760px,100%);padding:28px;background:var(--black);border:1px solid var(--line);box-shadow:7px 7px 0 var(--green)}.eyebrow,.label,footer,.instructions{font:700 11px/1.3 monospace;letter-spacing:.12em;color:var(--green);text-transform:uppercase}.eyebrow{margin:0 0 8px}h1{font-size:clamp(48px,10vw,72px);letter-spacing:-.09em;line-height:.85;margin:0}h1 span{color:var(--green)}.tagline{font-size:15px;color:var(--soft);margin:15px 0 26px}.game-layout{display:flex;gap:24px;align-items:stretch}.board-wrap{position:relative;flex:none;border:2px solid var(--white);background:var(--black)}canvas{display:block;image-rendering:pixelated}#board{width:min(300px,calc(100vw - 135px));height:auto}.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:rgba(0,0,0,.92);gap:8px}.overlay strong{font-size:34px;letter-spacing:-.08em;color:var(--green)}.overlay span{font:13px monospace;color:var(--soft);margin-bottom:10px}.overlay.hidden{display:none}button{border:1px solid var(--green);background:var(--green);color:var(--black);font:800 14px Arial,sans-serif;padding:11px 18px;cursor:pointer}.panel{min-width:155px;display:flex;flex-direction:column;gap:18px}.stats{border-top:1px solid var(--line)}.stat{padding:10px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:baseline}.stat span{font:11px monospace;text-transform:uppercase;color:var(--soft)}.stat strong{font-size:25px;letter-spacing:-.07em}.next-piece{padding:4px 0}.next-piece .label{display:block;margin-bottom:5px}#next{width:120px;height:120px;background:var(--black);border:1px solid var(--line)}.secondary{background:var(--black);border-color:var(--white);color:var(--white);width:100%}.instructions{margin-top:auto;color:var(--soft);letter-spacing:.04em}.instructions p{margin:5px 0}kbd{border:1px solid var(--white);padding:2px 4px;color:var(--white);font:inherit}.mobile-controls{display:none;gap:8px;margin-top:20px}.mobile-controls button{flex:1;padding:14px 6px;font-size:21px;border-color:var(--green);background:var(--black);color:var(--green)}footer{margin-top:25px;border-top:1px solid var(--line);padding-top:15px}footer span{color:var(--green)}@media(max-width:540px){.game-card{padding:20px 14px;box-shadow:4px 4px 0 var(--green)}.game-layout{gap:12px}.panel{min-width:90px;gap:12px}.stat{display:block}.stat strong{display:block;margin-top:3px;font-size:20px}#next{width:88px;height:88px}.instructions{display:none}.secondary{font-size:12px;padding:10px}.mobile-controls{display:flex}.tagline{margin-bottom:18px}}@keyframes tetris-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes tetris-glow{0%,100%{box-shadow:0 0 0 rgba(15,143,56,0)}50%{box-shadow:0 0 24px rgba(15,143,56,.42)}}@keyframes tetris-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}.game-card{animation:tetris-rise .5s ease-out both}.game-card header{animation:tetris-rise .55s .08s ease-out both}.board-wrap{animation:tetris-glow 2.8s ease-in-out infinite}.panel{animation:tetris-rise .55s .15s ease-out both}.overlay strong{animation:tetris-pulse 1.5s ease-in-out infinite}.mobile-controls button,.secondary,button{transition:transform .12s ease,background .12s ease,color .12s ease}.mobile-controls button:active,button:active{transform:scale(.92)}.stat strong{animation:tetris-pulse 2.6s ease-in-out infinite}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}} .records{margin-top:24px;padding:18px;border:1px solid var(--line);background:var(--black)}.record-head{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:10px}.record-head h2{margin:0;color:var(--green)}.record-head span,.records h3,.name-label,#record-note{font:700 11px monospace;color:var(--soft)}.name-label{display:block;margin-top:14px}.name-label input{display:block;width:100%;padding:11px;margin-top:6px;background:var(--black);border:1px solid var(--line);color:var(--white)}#save-score{width:100%;margin-top:10px}.record-columns{display:grid;grid-template-columns:1fr 1fr;gap:14px;border-top:1px solid var(--line);padding-top:10px}.records h3{color:var(--green)}.records ol{padding-left:20px}.records li{display:flex;justify-content:space-between;padding:4px 0;font:11px monospace}.records li span{color:var(--green)}@media(max-width:540px){.record-columns{grid-template-columns:1fr}} [data-theme=light]{--black:#f5f7f4;--white:#101612;--green:#0f8f38;--soft:rgba(16,22,18,.72);--line:rgba(16,22,18,.24)}[data-theme=light] body{background:var(--black)}.theme-toggle{position:fixed;z-index:20;top:14px;right:14px;width:46px;height:46px;border:1px solid var(--green);border-radius:50%;background:var(--black);color:var(--green);font-size:21px;cursor:pointer;box-shadow:3px 3px 0 var(--green);cursor:pointer}.theme-toggle:active{transform:scale(.9)}[data-theme=light] .theme-toggle{box-shadow:3px 3px 0 var(--white)}@media(max-width:540px){.theme-toggle{top:10px;right:10px;width:42px;height:42px}} .brand-logo{display:block;width:min(150px,40vw);height:auto;margin:0 0 14px}.game-card{box-shadow:none}.board-wrap{border-color:var(--green)}button,.mobile-controls button{background:transparent;color:var(--white);border-color:var(--green)}button:active,.mobile-controls button:active{background:var(--green);color:var(--black)}.theme-toggle{box-shadow:none;border-radius:0}.theme-toggle:active{background:var(--green);color:var(--black)}