:root{color-scheme:dark;--paper:#f2f3ee;--dim:#b7c4c4;--lime:#d5f795}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 65% 0,#233533,#101719 60%);color:var(--paper);font:16px/1.5 system-ui,sans-serif}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:2px solid var(--lime);outline-offset:5px}
.bar{padding:12px max(20px,calc((100vw - 1080px)/2));display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid #39494a;background:#101719}
.bar>a:last-child{font-size:14px;color:var(--dim)}
.brand{display:flex;align-items:center;gap:9px;font-weight:850;font-size:20px}.brand img{width:32px;height:32px}
main{max-width:1120px;margin:auto;padding:clamp(30px,6vw,75px) 20px 48px}
.label{margin:0;color:var(--lime);font:750 12px ui-monospace,monospace;letter-spacing:.15em}
h1{margin:7px 0 10px;line-height:.98;font-size:clamp(48px,10vw,96px);letter-spacing:-.075em}h1 span{color:var(--lime)}
.lead{margin:0 0 27px;color:var(--dim)}
.games{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.game{--accent:#bcb2ff;display:flex;flex-direction:column;overflow:hidden;border:1px solid #465155;border-radius:14px;background:#1b2226;transition:border-color .18s,transform .18s}
.game.survival{--accent:#d5f795}
.game:hover{border-color:var(--accent);transform:translateY(-3px)}
.cover{position:relative;overflow:hidden;aspect-ratio:16/7;background:#24233d}
.survival .cover{background:#455137}
.cover canvas{display:block;width:100%;height:100%;image-rendering:pixelated}
.cover>span{position:absolute;left:13px;top:13px;border:1px solid #c3d0cf50;background:#121b20ed;padding:6px 8px;color:var(--accent);font:750 11px ui-monospace,monospace;letter-spacing:.08em}
.copy{padding:16px 18px 18px;display:flex;flex:1;flex-direction:column}
h2{font-size:clamp(26px,4vw,38px);line-height:1.08;letter-spacing:-.045em;margin:0}
.copy p{color:var(--dim);margin:8px 0 16px;max-width:38ch}
.play{margin-top:auto;color:var(--accent);font-weight:750;display:flex;justify-content:space-between;border-top:1px solid #465155;padding-top:10px}
.play::after{content:"";width:7px;height:7px;margin:7px 3px 0 0;border:solid currentColor;border-width:2px 2px 0 0;transform:rotate(45deg)}
@media(max-width:620px){.games{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.game{transition:none}.game:hover{transform:none}}
.game.clutch{--accent:#ffc481}
.clutch .cover{background:#20373b}
.cover img{display:block;width:100%;height:100%;object-fit:cover;image-rendering:pixelated}
@media(min-width:850px){.games{grid-template-columns:repeat(3,minmax(0,1fr))}.game h2{font-size:clamp(24px,3vw,34px)}}