*{box-sizing:border-box}html{color-scheme:dark}body{margin:0;background:#101019;color:#f7f5eb;font-family:system-ui,"Microsoft YaHei",sans-serif}a{color:inherit;text-decoration:none;touch-action:manipulation}header,footer{max-width:1320px;margin:auto;padding:24px 32px;display:flex;align-items:center;justify-content:space-between}header{border-bottom:1px solid #30313b}header>span,.eyebrow{color:#969aa9;letter-spacing:.16em;font-size:13px}.brand{font-size:21px;font-weight:800}.brand b{display:inline-grid;place-items:center;width:37px;height:37px;background:#d8ff62;color:#101019;margin-right:10px}main{max-width:1320px;margin:auto;padding:32px}.intro{display:flex;align-items:end;justify-content:space-between;flex-direction:row-reverse;margin-bottom:24px}h1{margin:0;font-size:clamp(28px,4vw,46px)}.mode-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.mode-card{position:relative;min-height:515px;border:1px solid #41434c;overflow:hidden;background:#181c28;transition:transform .2s,border-color .2s}.mode-card:hover,.mode-card:focus-visible{transform:translateY(-5px);border-color:var(--accent);outline:2px solid var(--accent);outline-offset:4px}.fighting{--accent:#d8ff62}.tactics{--accent:#ffc56d}.chess{--accent:#a2e5d0}.scene{position:absolute;width:100%;height:100%;object-fit:cover;image-rendering:pixelated;opacity:.52}.veil{position:absolute;inset:0;background:linear-gradient(180deg,#11111970,transparent 35%,#111119 84%)}.card-top{position:relative;display:flex;justify-content:space-between;padding:22px;color:var(--accent);font-size:13px;letter-spacing:.06em}.card-top span:last-child{border:1px solid var(--accent);padding:3px 8px}.cast{position:absolute;inset:60px 0 145px;display:flex;align-items:flex-end;justify-content:center;gap:0}.cast canvas{width:36%;height:auto;image-rendering:pixelated;margin:0 -3%}.cast canvas:nth-child(2){z-index:1;transform:translateY(12px) scale(1.12)}.card-bottom{position:absolute;bottom:0;width:100%;padding:28px}.card-bottom h2{font-size:30px;margin:0;color:var(--accent);display:flex;justify-content:space-between}.card-bottom h2 b{font-weight:400}.card-bottom p{font-size:18px;margin:14px 0}.card-bottom>span{font-size:14px;color:#acb0bf}footer{font-size:13px;color:#9398a8;gap:16px;flex-wrap:wrap}footer a{color:#e6e9f0}a:focus-visible{outline:2px solid #d8ff62}@media(max-width:650px){header,footer{padding:18px}main{padding:24px 18px}.intro{display:block}.eyebrow{display:block;margin-bottom:10px}.mode-grid{grid-template-columns:1fr;gap:18px}.mode-card{min-height:360px}.cast{inset:37px 10px 105px}.cast canvas{max-height:225px;width:32%;object-fit:contain}.card-top{padding:16px}.card-bottom{padding:20px}.card-bottom h2{font-size:29px}.card-bottom p{font-size:16px;margin:8px 0}.card-bottom>span{font-size:13px}}@media(prefers-reduced-motion:reduce){.mode-card{transition:none}}

@media(min-width:651px) and (max-width:1000px){.mode-grid{grid-template-columns:1fr}.mode-card{min-height:360px}.cast{inset:35px 20% 110px}.cast canvas{max-height:235px;width:32%;object-fit:contain}}
