:root{--bg:#04070e;--panel:rgba(12,20,36,.82);--line:rgba(120,150,200,.22);--ink:#eef2f8;--muted:#a9b7cc;--blue:#3b8bff;--orange:#f39a2b;--stamp:#ffd21f;color-scheme:dark}
*{box-sizing:border-box}
html,body{margin:0}
body{color:var(--ink);font-family:"Barlow","Segoe UI",system-ui,sans-serif;line-height:1.55;min-height:100vh;background:var(--bg)}
body::before{content:"";position:fixed;inset:0;z-index:-1;background:url(/assets/bg-desktop.jpg) center bottom/cover no-repeat var(--bg)}
@media (max-aspect-ratio:3/4){body::before{background-image:url(/assets/bg-mobile.jpg)}}
a{color:#9cc8ff}
.wrap{max-width:1000px;margin:0 auto;padding:22px 18px 40px}
h1,h2,h3{font-family:"Barlow Condensed","Arial Narrow",sans-serif;letter-spacing:.02em;line-height:1.1}
.hero{text-align:center;padding:16px 0 10px}
.banner{display:block;width:100%;max-width:820px;height:auto;margin:0 auto;mix-blend-mode:screen}
.tag{color:var(--muted);font-size:19px;margin:6px 0 18px}
.play-soon{display:inline-flex;align-items:center;gap:12px;padding:10px 18px 10px 14px;border-radius:12px;background:#000;border:1px solid #5d6b80;color:#fff;text-decoration:none;box-shadow:0 6px 20px rgba(0,0,0,.45)}
.play-soon .ico{width:34px;height:34px;border-radius:8px;display:grid;place-items:center;background:linear-gradient(135deg,var(--blue),var(--orange));font-size:18px}
.play-soon small{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#c6cfdb;line-height:1.1}
.play-soon b{display:block;font-size:21px;line-height:1.1;font-weight:700}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;align-items:center}
.btn{display:inline-block;padding:11px 18px;border-radius:10px;font-weight:700;text-decoration:none;background:rgba(27,39,64,.9);color:var(--ink);border:1px solid var(--line)}
.btn.go{background:var(--orange);color:#1e1206;border-color:transparent}
h2{font-size:32px;margin:36px 0 14px;text-align:center}
.games{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{background:var(--panel);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid var(--line);border-radius:16px;padding:18px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px}
.icon{position:relative;width:min(200px,60vw);aspect-ratio:1;container-type:inline-size}
.icon img{width:100%;height:100%;border-radius:22%;display:block;object-fit:cover;box-shadow:0 10px 30px rgba(0,0,0,.55)}
.stamp{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-14deg);white-space:nowrap;background:var(--stamp);color:#141006;font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-weight:800;font-size:10cqw;letter-spacing:.07em;padding:.15em .55em;border:2px solid #141006;outline:2px solid var(--stamp);box-shadow:0 6px 16px rgba(0,0,0,.5);
  -webkit-mask-image:radial-gradient(circle at 20% 30%,#000 60%,rgba(0,0,0,.82) 61%),radial-gradient(circle at 80% 70%,#000 55%,rgba(0,0,0,.85) 56%);mask-image:radial-gradient(circle at 20% 30%,#000 60%,rgba(0,0,0,.82) 61%),radial-gradient(circle at 80% 70%,#000 55%,rgba(0,0,0,.85) 56%);-webkit-mask-composite:source-over;mask-composite:add}
.card h3{margin:6px 0 0;font-size:30px}
.card .kind{margin:-6px 0 0;color:var(--orange);font-weight:700;font-size:14px;letter-spacing:.12em;text-transform:uppercase}
.card p{margin:0;color:var(--muted)}
.card .btns{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:auto;padding-top:6px}
.panel{background:var(--panel);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid var(--line);border-radius:16px;padding:22px}
.join{margin-top:36px;display:grid;gap:12px;text-align:center;justify-items:center}
.join h2{margin:0}
.join p{margin:0;color:var(--muted);max-width:620px}
footer{border-top:1px solid var(--line);margin-top:40px;padding-top:18px;color:var(--muted);font-size:15px;display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:space-between}
.doc{max-width:780px}
.doc .banner{max-width:420px;margin:0}
.doc h1{font-size:42px;margin:14px 0 4px}
.doc h2{font-size:26px;text-align:left;margin:26px 0 8px}
.doc ol,.doc ul{padding-left:22px}
.doc li{margin:6px 0}
.small{font-size:15px;color:var(--muted)}
.callout{border-left:4px solid var(--orange);padding:10px 14px;background:rgba(243,154,43,.08);border-radius:6px}
.chips{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0}
.chips img{width:56px;height:56px;border-radius:14px}
