
:root{
  --bg:#f5f7ff;--surface:#fff;--surface2:#f9faff;--text:#19223a;--muted:#72809e;
  --primary:#365bd7;--primary2:#7183ea;--primarySoft:#eaf0ff;
  --gold:#f2b642;--green:#2d9a6b;--greenSoft:#e9f8f1;--red:#d65461;--redSoft:#fff0f2;
  --border:#e4e9f4;--shadow:0 16px 44px rgba(41,63,123,.11);--soft:0 8px 24px rgba(41,63,123,.07);
  --r1:14px;--r2:20px;--r3:28px;--safe:env(safe-area-inset-bottom,0px)
}
*{box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth}
body{margin:0;min-width:320px;min-height:100vh;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:radial-gradient(circle at 95% 0,rgba(113,131,234,.16),transparent 28rem),linear-gradient(#fcfdff,var(--bg));-webkit-font-smoothing:antialiased}
button,input{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
a{text-decoration:none;color:inherit}
button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid rgba(54,91,215,.22);outline-offset:3px}
.hidden{display:none!important}
.shell{width:min(1080px,100%);margin:0 auto;padding:20px 16px calc(36px + var(--safe))}
.game-topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;background:rgba(250,252,255,.92);border-bottom:1px solid rgba(228,233,244,.92);backdrop-filter:blur(16px)}
.game-topbar .left{display:flex;align-items:center;gap:10px;min-width:0}
.hub-link{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--border);border-radius:13px;background:#fff;box-shadow:var(--soft);font-weight:900}
.game-title strong,.game-title small{display:block}.game-title strong{font-size:14px}.game-title small{font-size:10px;color:var(--muted);margin-top:1px}
.pill{display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 11px;border-radius:999px;background:var(--primarySoft);color:var(--primary);font-size:12px;font-weight:800}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r3);box-shadow:var(--shadow)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 18px;border:0;border-radius:var(--r1);font-weight:800;cursor:pointer;transition:.18s ease}
.btn:active{transform:translateY(1px)}
.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary2));color:#fff;box-shadow:0 10px 22px rgba(54,91,215,.22)}
.btn-secondary{background:var(--primarySoft);color:var(--primary)}
.btn-ghost{background:transparent;color:var(--muted)}
.btn-block{width:100%}
.eyebrow{display:inline-block;color:var(--primary);font-size:11px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.progress{height:9px;border-radius:999px;background:#e8edf6;overflow:hidden}.progress>i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--primary),var(--primary2));border-radius:inherit;transition:width .25s}
.center{text-align:center}
.muted{color:var(--muted)}
.toast{position:fixed;z-index:99;left:50%;bottom:calc(22px + var(--safe));width:min(90vw,440px);transform:translate(-50%,140%);opacity:0;padding:13px 16px;background:#202940;color:#fff;border-radius:14px;text-align:center;font-size:13px;box-shadow:0 14px 34px rgba(20,28,48,.25);transition:.25s}
.toast.show{transform:translate(-50%,0);opacity:1}
.result-box{padding:30px 20px;text-align:center}.result-icon{font-size:52px}.result-box h1{font-size:clamp(32px,8vw,48px);margin:10px 0 8px;letter-spacing:-.04em}.result-actions{display:grid;gap:9px;margin-top:22px}
.score-row{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:20px 0}.score-row>div{padding:14px;border-radius:16px;background:var(--surface2)}.score-row small,.score-row strong{display:block}.score-row small{color:var(--muted);font-size:10px}.score-row strong{font-size:21px;margin-top:3px}
@media(min-width:680px){.shell{padding:30px 24px 54px}.score-row{grid-template-columns:repeat(4,1fr)}}

.brand-home img,.hub-link img{width:28px;height:28px;object-fit:contain;display:block}

.share-overlay{position:fixed;inset:0;z-index:160;display:grid;place-items:end center;padding:16px;background:rgba(20,28,48,.48);backdrop-filter:blur(6px)}
.share-sheet{width:min(100%,520px);padding:18px 16px calc(18px + var(--safe));border-radius:26px;background:#fff;box-shadow:0 26px 70px rgba(20,28,48,.28)}
.share-sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.share-sheet-head small,.share-sheet-head strong{display:block}.share-sheet-head small{color:var(--primary);font-size:9px;font-weight:900;letter-spacing:.12em}.share-sheet-head strong{margin-top:2px;font-size:18px}.share-close{display:grid;place-items:center;width:38px;height:38px;border:0;border-radius:12px;background:var(--surface2);color:var(--muted);font-size:24px;cursor:pointer}
.share-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.share-option{display:grid;place-items:center;gap:5px;min-height:86px;padding:10px;border:1px solid var(--border);border-radius:16px;background:var(--surface2);color:var(--text);cursor:pointer;text-align:center}.share-option span{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#fff;font-size:20px;font-weight:900;box-shadow:var(--soft)}.share-option b{font-size:10px}
.share-result-btn{background:#eef3ff;color:var(--primary)}
@media(min-width:600px){.share-grid{grid-template-columns:repeat(5,1fr)}}
