:root{--ink:#3a3150;--ink-soft:#7a7190;--card:#fffaf2eb;--accent:#ff7a59;--accent-dark:#e8603f;--radius:22px;--shadow:0 10px 30px #3a31502e, 0 2px 6px #3a315014;--font:ui-rounded, "SF Pro Rounded", "Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;--safe-bottom:env(safe-area-inset-bottom,0px);--safe-top:env(safe-area-inset-top,0px)}*{box-sizing:border-box}html,body{overscroll-behavior:none;height:100%;font-family:var(--font);color:var(--ink);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;background:linear-gradient(#7ccaf5 0%,#bfe6fa 50%,#fde9d6 100%);margin:0;overflow:hidden}#app{position:fixed;inset:0}.game-canvas{touch-action:none;outline:none;width:100%;height:100%;display:block;position:fixed;inset:0}.ui{pointer-events:none;z-index:10;position:fixed;inset:0}.ui button{font:inherit;color:inherit;cursor:pointer;border:0}.ui button:focus-visible{outline-offset:2px;outline:3px solid #ff7a5999}.loading{pointer-events:auto;background:linear-gradient(#7ccaf5 0%,#bfe6fa 60%,#fde9d6 100%);place-items:center;transition:opacity .6s,visibility .6s;display:grid;position:absolute;inset:0}.loading.is-hidden{opacity:0;visibility:hidden;pointer-events:none}.loading__card{text-align:center;background:var(--card);border-radius:var(--radius);width:min(320px,100vw - 48px);box-shadow:var(--shadow);padding:28px 28px 22px}.loading__dots{justify-content:center;gap:8px;height:28px;margin-bottom:10px;display:flex}.loading__dots span{background:var(--accent);border-radius:50%;width:14px;height:14px;animation:1s ease-in-out infinite bounce}.loading__dots span:nth-child(2){background:#ffd166;animation-delay:.15s}.loading__dots span:nth-child(3){background:#7fd47a;animation-delay:.3s}@keyframes bounce{0%,to{transform:translateY(10px)}50%{transform:translateY(-4px)}}.loading__title{margin:0 0 16px;font-size:18px;font-weight:700}.progress{background:#3a31501a;border-radius:999px;height:10px;overflow:hidden}.progress__bar{border-radius:inherit;background:linear-gradient(90deg, #ffb35c, var(--accent));transform-origin:0;height:100%;transition:transform .25s ease-out;transform:scaleX(0)}.loading__pct{color:var(--ink-soft);font-variant-numeric:tabular-nums;margin:10px 0 0;font-size:13px}.bubble{will-change:transform;position:absolute;top:0;left:0}.bubble__inner{white-space:nowrap;box-shadow:var(--shadow);opacity:0;transform-origin:50% 100%;background:#fff;border-radius:18px;padding:10px 16px;font-size:16px;font-weight:700;transition:opacity .25s,transform .35s cubic-bezier(.34,1.56,.64,1);position:relative;transform:translate(-50%,calc(-100% - 6px))scale(.6)}.bubble__inner:after{content:"";background:#fff;border-radius:3px;width:14px;height:14px;position:absolute;bottom:-7px;left:50%;transform:translate(-50%)rotate(45deg)}.bubble.is-visible .bubble__inner{opacity:1;transform:translate(-50%,calc(-100% - 12px))scale(1)}.hud .nameplate{opacity:0;top:calc(16px + var(--safe-top));background:var(--card);box-shadow:var(--shadow);border-radius:18px;flex-direction:column;padding:10px 18px 12px;transition:opacity .5s,transform .6s cubic-bezier(.34,1.56,.64,1);display:flex;position:absolute;left:16px;transform:translateY(-24px)}.nameplate__eyebrow{letter-spacing:.06em;text-transform:uppercase;color:var(--accent);font-size:12px;font-weight:700}.nameplate__name{font-size:20px;line-height:1.2}.hud.is-visible .nameplate{opacity:1;transform:translateY(0)}.hint{left:50%;bottom:calc(24px + var(--safe-bottom));color:#fff;white-space:nowrap;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;background:#3a3150b8;border-radius:999px;padding:9px 16px;font-size:14px;font-weight:600;transition:opacity .35s,transform .35s;position:absolute;transform:translate(-50%,8px)}.hint.is-visible{opacity:1;transform:translate(-50%)}.joystick{left:calc(24px + env(safe-area-inset-left,0px));bottom:calc(32px + var(--safe-bottom));z-index:11;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);touch-action:none;opacity:0;pointer-events:none;background:#ffffff47;border:2px solid #ffffff8c;border-radius:50%;width:124px;height:124px;transition:opacity .4s;position:fixed}.joystick.is-visible{opacity:1;pointer-events:auto}.joystick__knob{background:#fff;border-radius:50%;width:54px;height:54px;transition:transform .2s ease-out;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 4px 12px #3a315040}.joystick.is-active .joystick__knob{transition:none}.ui .error__cta{color:#fff;background:var(--accent);border-radius:999px;width:100%;padding:13px 18px;font-weight:700;transition:background .2s,transform .15s;box-shadow:0 4px 12px #ff7a5959}.ui .error__cta:hover{background:var(--accent-dark)}.ui .error__cta:active{transform:scale(.97)}.error{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;visibility:hidden;background:#bfe6fa99;place-items:center;padding:24px;transition:opacity .4s,visibility .4s;display:grid;position:absolute;inset:0}.error.is-visible{opacity:1;visibility:visible;pointer-events:auto}.error__card{text-align:center;width:min(340px,100%);box-shadow:var(--shadow);background:#fffaf2;border-radius:26px;padding:28px 24px 22px}.error__icon{font-size:40px}.error__card h2{margin:8px 0 6px;font-size:20px}.error__card p{color:var(--ink-soft);margin:0 0 18px}@media (width<=480px){.hud .nameplate{padding:8px 14px 10px}.nameplate__name{font-size:17px}.hint{font-size:13px}}@media (width<=640px){.hint{top:calc(92px + var(--safe-top));bottom:auto}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}