:root { --ink:#fff; --paper:#17191d; --leaf:#4169e1; --coral:#4169e1; --sun:#ffbd3f; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:radial-gradient(circle at 7% 0, #242a38 0 8%, transparent 34%),var(--paper); font-family:"DM Sans",Arial,sans-serif; }
.site-shell { max-width:960px; margin:auto; padding:52px 32px 60px; }
.hero { max-width:700px; margin-bottom:38px; }
.eyebrow,.year { font:500 12px "DM Mono",monospace; letter-spacing:.1em; color:var(--leaf); }
.eyebrow { margin:0 0 16px; }
h1,h2,p { margin-top:0; } h1 { font:700 clamp(68px,11vw,140px)/.82 Fraunces,Georgia,serif; letter-spacing:-.075em; margin-bottom:25px; } h1 span { color:var(--coral); }
.intro { max-width:570px; font-size:clamp(18px,2.1vw,23px); line-height:1.45; }
.collection { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.game-card { display:flex; min-height:329px; flex-direction:column; padding:17px; border:1px solid #3e4554; background:#20242a; box-shadow:4px 5px 0 rgba(0,0,0,.32); }
.game-card:hover { transform:translate(-2px,-3px); box-shadow:7px 8px 0 rgba(0,0,0,.38); transition:.2s ease; }
.year { margin:14px 0 6px; } h2 { font:700 31px/.95 Fraunces,Georgia,serif; letter-spacing:-.045em; margin-bottom:9px; } .game-card>p:not(.year) { line-height:1.4; font-size:15px; max-width:260px; }
.launch { margin-top:auto; align-self:flex-start; padding:8px 11px; background:#4169e1; color:#fff; text-decoration:none; font:500 12px "DM Mono",monospace; letter-spacing:.02em; } .launch:hover { background:#5887ff; }.soon { color:#fff; padding:8px 0; background:none; }
.card-art { height:137px; overflow:hidden; position:relative; }
.merlin-art { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; padding:18px 22px; background:#c9342e; border-radius:18px 18px 28px 28px; transform:rotate(-3deg); box-shadow:inset 0 0 0 5px #a71f22; }.merlin-art i { border-radius:50%; background:radial-gradient(circle,#121212 0 51%,#f6f2e6 52% 60%,#ad2928 61%); border:3px solid #f6f2e6; box-shadow:inset 0 1px 2px #f36c5b,0 2px #711719; }.merlin-art i:nth-child(2),.merlin-art i:nth-child(4),.merlin-art i:nth-child(8) { background:radial-gradient(circle,#ff5a42 0 51%,#fff4d4 52% 60%,#ad2928 61%); box-shadow:0 0 10px 3px #ff563c,inset 0 1px 2px #ffe8a0,0 2px #711719; }
.football-art { background:#202824; border-radius:5px; display:grid; grid-template-columns:repeat(3,12px); grid-template-rows:repeat(3,12px); justify-content:center; align-content:center; gap:24px 36px; }.football-art b { width:12px; height:12px; background:#c72428; box-shadow:0 0 9px #ff5743; }.football-art b:first-child { background:#ff4636; box-shadow:0 0 15px #ff9372; }
.derby-art { background:linear-gradient(90deg,#da7650 0 13%,#496b61 13% 87%,#da7650 87%); }.derby-art div { position:absolute; width:56%; height:150%; left:22%; top:-25%; transform:perspective(190px) rotateX(38deg); background:repeating-linear-gradient(90deg,transparent 0 22%,#e8d7a1 22% 24%,transparent 24% 48%); }.derby-art i { width:22px; height:47px; position:absolute; background:var(--sun); border:3px solid #bd502f; top:34px; }.derby-art i:nth-of-type(1){left:33%;}.derby-art i:nth-of-type(2){left:60%;top:94px}.derby-art i:nth-of-type(3){left:47%;top:144px}
.simon-art{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:8px;background:#141414;border-radius:50%;aspect-ratio:1;justify-self:center;width:137px;height:137px}.simon-art i{display:block}.simon-art i:nth-child(1){background:#d34842;border-radius:100% 0 0}.simon-art i:nth-child(2){background:#4169e1;border-radius:0 100% 0 0}.simon-art i:nth-child(3){background:#f1bb38;border-radius:0 0 0 100%}.simon-art i:nth-child(4){background:#348d67;border-radius:0 0 100% 0}
footer { border-top:1px solid #3e4554; padding:22px 32px 30px; color:#fff; font-size:12px; line-height:1.45; }
@media(max-width:760px){.site-shell{padding:46px 20px 50px}.collection{grid-template-columns:1fr}.game-card{min-height:275px}.card-art{height:112px}.simon-art{width:112px;height:112px}footer{padding:22px 20px 30px}}