:root{--ink:#17201d;--muted:#69736e;--paper:#f5f2e9;--green:#176b4a;--lime:#d8ff54;--line:#d6d4ca}*{box-sizing:border-box}html{background:var(--paper)}body{color:var(--ink);background:var(--paper);margin:0;font-family:Arial,Helvetica,sans-serif}button{font:inherit}main{grid-template-columns:minmax(260px,.9fr) minmax(490px,1.1fr);align-items:center;gap:clamp(32px,7vw,110px);max-width:1440px;min-height:100vh;margin:auto;padding:30px clamp(18px,5vw,72px) 20px;display:grid;position:relative}.intro{align-self:center}.brand{letter-spacing:.15em;align-items:center;gap:12px;margin-bottom:clamp(30px,8vh,82px);font-size:13px;font-weight:900;display:flex}.brand-mark{background:var(--green);width:34px;height:34px;color:var(--lime);letter-spacing:-.05em;box-shadow:5px 5px 0 var(--lime);place-items:center;font-size:10px;display:grid}h1{letter-spacing:-.065em;max-width:680px;margin:0;font-size:clamp(46px,5.8vw,86px);line-height:.93}h1 em{color:var(--green);font-family:Georgia,Times New Roman,serif;font-weight:400}.intro>p{color:var(--muted);max-width:390px;margin:28px 0 0;font-size:clamp(15px,1.35vw,19px);line-height:1.6}.game-shell{border:1px solid var(--line);width:min(100%,610px);box-shadow:14px 14px 0 #dfe9ca, 14px 14px 0 1px var(--green);background:#fff;justify-self:end;padding:18px}.game-topbar{border-bottom:1px solid var(--line);grid-template-columns:1fr 1fr 1fr;height:59px;margin-bottom:16px;display:grid}.game-topbar>div{border-right:1px solid var(--line);flex-direction:column;justify-content:center;align-items:center;gap:3px;display:flex}.game-topbar>div:last-child{border-right:0}.eyebrow{letter-spacing:.18em;color:var(--muted);font-size:9px;font-weight:900}.game-topbar strong{font-variant-numeric:tabular-nums;font-size:20px}.game-layout{grid-template-columns:minmax(260px,1fr) 145px;gap:15px;display:grid}.board-wrap{aspect-ratio:1/2;background:#101a17;width:100%;max-height:620px;position:relative;overflow:hidden}.board{background-color:#111b18;background-image:linear-gradient(#26312d 1px,#0000 1px),linear-gradient(90deg,#26312d 1px,#0000 1px);background-size:10% 5%;grid-template-rows:repeat(20,1fr);grid-template-columns:repeat(10,1fr);width:100%;height:100%;display:grid}.cell{min-width:0;margin:1px}.cell.occupied{background:var(--piece);border:2px solid color-mix(in srgb, var(--piece), white 24%);box-shadow:inset -3px -3px 0 color-mix(in srgb, var(--piece), black 22%)}.overlay{color:#fff;text-align:center;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0d1814e6;flex-direction:column;justify-content:center;align-items:center;padding:28px;display:flex;position:absolute;inset:0}.overlay-icon{background:var(--lime);width:48px;height:48px;color:var(--green);place-items:center;margin-bottom:17px;font-size:28px;font-weight:700;display:grid;transform:rotate(-3deg)}.overlay h2{margin:0 0 10px;font-family:Georgia,serif;font-size:clamp(27px,3vw,39px);font-weight:400}.overlay p{color:#bfcac5;max-width:230px;margin:0 0 22px;font-size:12px;line-height:1.55}.start-button{background:var(--lime);color:#17201d;letter-spacing:.13em;cursor:pointer;box-shadow:4px 4px 0 var(--green);border:0;padding:14px 18px;font-size:11px;font-weight:900}.start-button:hover{box-shadow:6px 6px 0 var(--green);transform:translate(-1px,-1px)}.start-button:focus-visible,.touch-controls button:focus-visible{outline-offset:3px;outline:3px solid #fff}.start-button span{margin-left:14px;font-size:16px}.overlay small{color:#8f9b96;letter-spacing:.12em;text-transform:uppercase;margin-top:13px;font-size:9px}aside{flex-direction:column;gap:15px;display:flex}.next-panel,.keys-panel{border:1px solid var(--line);padding:15px}.next-panel{height:131px}.preview-grid{grid-template-columns:repeat(4,1fr);gap:2px;width:88px;margin:20px auto 0;display:grid}.mini{aspect-ratio:1}.mini.filled{background:var(--piece);box-shadow:inset -2px -2px 0 color-mix(in srgb, var(--piece), black 18%)}.keys-panel{flex:1}.key-row{border-bottom:1px solid #e7e6e0;justify-content:space-between;align-items:center;padding:10px 0;display:flex}.key-row:last-child{border:0}.key-row b{color:var(--muted);font-size:9px}kbd{background:#f2f1eb;border:1px solid #d8d6cc;border-bottom-width:3px;place-items:center;min-width:25px;height:25px;margin-right:3px;font-family:inherit;font-size:12px;font-weight:700;display:inline-grid}kbd.space{width:47px;font-size:7px}.touch-controls{grid-template-columns:repeat(5,1fr);gap:7px;padding-top:14px;display:none}.touch-controls button{border:1px solid var(--green);min-height:46px;color:var(--green);touch-action:manipulation;background:#eef3e4;font-size:20px;font-weight:700}.touch-controls .drop{letter-spacing:.1em;background:var(--lime);font-size:9px}footer{color:#8a918d;letter-spacing:.18em;align-items:center;gap:12px;font-size:8px;font-weight:700;display:flex;position:absolute;bottom:28px;left:clamp(18px,5vw,72px)}footer i{background:var(--green);border-radius:50%;width:3px;height:3px}@media (max-width:900px){main{grid-template-columns:1fr;align-items:start;gap:35px;padding-top:22px;padding-bottom:70px}.brand{margin-bottom:30px}.intro{text-align:center}.intro>p{margin-left:auto;margin-right:auto}.game-shell{justify-self:center}footer{white-space:nowrap;position:absolute;left:50%;transform:translate(-50%)}}@media (max-width:580px){main{padding-left:12px;padding-right:12px}h1{font-size:clamp(42px,13vw,62px)}.intro>p{font-size:14px}.game-shell{box-shadow:8px 8px 0 #dfe9ca, 8px 8px 0 1px var(--green);padding:10px}.game-layout{grid-template-columns:minmax(220px,1fr) 92px;gap:8px}.next-panel,.keys-panel{padding:9px}.next-panel{height:95px}.preview-grid{width:68px;margin-top:12px}.key-row{justify-content:center;padding:8px 0}.key-row b{display:none}.space{max-width:43px}.touch-controls{display:grid}footer{bottom:24px}}@media (max-width:390px){.game-layout{grid-template-columns:1fr}aside{display:none}.board-wrap{max-height:none}}