:root{--bg-0: #08111f;--bg-1: #0f2239;--ink: #f4f8ff;--accent: #00e8ff;--hot: #ff6b2d;--good: #76ff91}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;touch-action:none}body{font-family:Trebuchet MS,Segoe UI,sans-serif;color:var(--ink);background:radial-gradient(1200px 700px at 10% -20%,#355e92 0%,transparent 62%),radial-gradient(1000px 700px at 85% 120%,#4a2d5e 0%,transparent 60%),linear-gradient(140deg,var(--bg-0),var(--bg-1));overflow:hidden}.chip{pointer-events:auto;position:fixed;bottom:1.5rem;right:1.5rem;border-radius:999px;border:2px solid rgba(0,232,255,.4);padding:1rem 2rem;font-size:1.1rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;background:#00b4dc40;color:#dcf7ff;cursor:pointer;z-index:10;display:none;-webkit-tap-highlight-color:transparent;transition:background .1s,border-color .1s,transform .1s}.chip:active{background:#00e8ff8c;border-color:#00e8ffe6;color:#fff;transform:scale(.93)}canvas{width:100%;height:100%;display:block;touch-action:none}.joystick-base{display:none;position:fixed;width:120px;height:120px;border-radius:50%;border:2px solid rgba(0,232,255,.35);background:#08111f40;align-items:center;justify-content:center;pointer-events:none;z-index:5}.joystick-thumb{position:absolute;width:50px;height:50px;border-radius:50%;top:50%;left:50%;margin:-25px 0 0 -25px;background:radial-gradient(circle at 35% 35%,var(--accent),#007a88);box-shadow:0 0 12px #00e8ff80;pointer-events:none}@media(pointer:coarse){.chip{display:block;padding:1.2rem 2.5rem;font-size:1.25rem;bottom:2rem;right:2rem}}iframe[id*=ogp],iframe[src*="play.fun"],div[id*=ogp],#ogp-widget{z-index:9999!important;pointer-events:auto!important}.explainer{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#08111fe0;color:#f4f8ff;font-family:Trebuchet MS,Segoe UI,sans-serif;text-align:center;padding:2rem;transition:opacity .6s ease;pointer-events:none}.explainer h1{font-size:2.2rem;margin:0 0 1rem;color:var(--accent);text-shadow:0 0 18px rgba(0,232,255,.5)}.explainer p{font-size:1.1rem;line-height:1.6;max-width:420px;margin:.3rem 0;opacity:.85}.explainer .key{display:inline-block;background:#00e8ff33;border:1px solid rgba(0,232,255,.4);border-radius:6px;padding:.15rem .5rem;font-size:.95rem;margin:0 .15rem}.explainer.fade-out{opacity:0}