:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#24314a;background:#f7f8fb}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{min-height:100vh;background:radial-gradient(circle at 15% 10%,#e8f8ff 0,transparent 28%),radial-gradient(circle at 90% 12%,#fff0f5 0,transparent 28%),linear-gradient(180deg,#fbfdff,#f6f3ff)}button{font:inherit}.topbar{height:70px;padding:0 28px;display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.9);backdrop-filter:blur(16px);border-bottom:1px solid rgba(36,49,74,.08);position:sticky;top:0;z-index:20}.brand{display:flex;gap:10px;align-items:center;cursor:pointer}.brandmark{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:#24314a;color:#fff;font-weight:900}.brand strong{letter-spacing:.08em}.scoreline{font-size:14px;color:#718096}.home{max-width:1200px;margin:0 auto;padding:76px 24px 70px}.hero{text-align:center;max-width:900px;margin:0 auto 46px}.eyebrow{font-size:12px;letter-spacing:.2em;font-weight:900;color:#6c63ff;margin-bottom:18px}.hero h1{font-size:clamp(38px,5vw,68px);line-height:1.06;margin:0;color:#24314a;letter-spacing:-.045em}.hero h1 span{background:linear-gradient(90deg,#5aa9e6,#8e7dff,#ff7f6a);-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{font-size:18px;line-height:1.7;color:#627089;max-width:760px;margin:24px auto}.chips{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.chips span{padding:8px 12px;border-radius:999px;background:#fff;border:1px solid rgba(36,49,74,.09);font-size:12px;font-weight:800;color:#607086}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.game-card{background:rgba(255,255,255,.94);border:1px solid rgba(36,49,74,.08);border-radius:28px;padding:28px;box-shadow:0 18px 44px rgba(38,46,77,.08)}.game-icon{font-size:46px}.game-card h2{font-size:24px;margin:12px 0 6px}.dna{font-size:14px;color:#7a889c;margin:0 0 22px}.rounds{display:grid;gap:10px}.rounds button{display:grid;grid-template-columns:44px 1fr 20px;align-items:center;text-align:left;border:0;background:#f8fafc;padding:11px 12px;border-radius:16px;color:#24314a;cursor:pointer;transition:.16s transform,.16s background}.rounds button:hover{transform:translateY(-2px);background:#eef7ff}.rounds b{font-size:12px;background:#fff;border-radius:10px;padding:8px 7px;text-align:center}.rounds span{font-size:14px;font-weight:800;padding-left:10px}.rounds i{font-style:normal;font-size:22px;color:#8ca0b8}.stage-shell{height:calc(100dvh - 70px);min-height:620px;padding:14px;display:grid;place-items:center;overflow:hidden;background:linear-gradient(180deg,#edf8ff,#f7f4ff)}.phaser-wrap{width:100%;height:100%;display:grid;place-items:center}.phaser-wrap canvas{display:block;max-width:100%;max-height:100%;border-radius:20px;box-shadow:0 22px 60px rgba(33,48,74,.18);touch-action:none}.rotate-note{display:none}footer{text-align:center;padding:18px;color:#94a1b2;font-size:12px}@media(max-width:900px){.cards{grid-template-columns:1fr}.home{padding-top:44px}.game-card{padding:22px}.topbar{height:60px;padding:0 16px}.hero p{font-size:16px}.topbar.playing{display:none}.stage-shell{height:100dvh;min-height:100dvh;padding:0;background:#eaf5fb}.phaser-wrap{width:100vw;height:100dvh;aspect-ratio:auto}.phaser-wrap canvas{border-radius:0;box-shadow:none}}@media(max-width:900px) and (orientation:portrait){.stage-shell{position:relative;padding:18px;background:linear-gradient(160deg,#eaf7ff,#f7efff)}.rotate-note{position:absolute;z-index:40;left:24px;right:24px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;background:rgba(255,255,255,.96);border:1px solid rgba(36,49,74,.1);border-radius:24px;padding:24px 20px;box-shadow:0 22px 60px rgba(33,48,74,.2);color:#24314a}.rotate-note b{font-size:20px}.rotate-note span{font-size:13px;line-height:1.5;color:#718096}.phaser-wrap{opacity:.1;filter:blur(8px);pointer-events:none}.phaser-wrap canvas{border-radius:22px}}@media(max-width:900px) and (orientation:landscape){.stage-shell{padding:max(2px,env(safe-area-inset-top)) max(2px,env(safe-area-inset-right)) max(2px,env(safe-area-inset-bottom)) max(2px,env(safe-area-inset-left))}.phaser-wrap canvas{max-width:100vw;max-height:100dvh}}
