*{margin:0;padding:0;box-sizing:border-box}:root{--panel-bg: rgba(255, 255, 255, .92);--panel-radius: 20px;--panel-shadow: 0 10px 40px rgba(30, 60, 120, .18);--ink: #2b3a55;--accent: #ff7f66;--accent-dark: #d94a38;--sky: #7ec8f2;font-family:Nunito,Varela Round,Quicksand,ui-rounded,-apple-system,SF Pro Rounded,Segoe UI,sans-serif}html,body{width:100%;height:100%;overflow:hidden;background:var(--sky);color:var(--ink);-webkit-user-select:none;user-select:none;touch-action:none}#game-canvas{position:fixed;inset:0;width:100%;height:100%;display:block;filter:saturate(1.08) contrast(1.04)}#ui-root{position:fixed;inset:0;pointer-events:none}.screen{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:auto;padding:16px}.card{background:var(--panel-bg);border-radius:var(--panel-radius);box-shadow:var(--panel-shadow);padding:28px 32px;max-width:440px;width:100%;text-align:center;backdrop-filter:blur(6px);max-height:92vh;overflow-y:auto}.card h1{font-size:2.2rem;letter-spacing:-.5px;color:var(--ink)}.card h1 .plane-emoji{display:inline-block;transform:rotate(-12deg)}.card .subtitle{margin:4px 0 18px;opacity:.75;font-size:.95rem}.card input[type=text]{width:100%;padding:12px 16px;border:2px solid #dbe4f0;border-radius:14px;font-size:1.05rem;font-family:inherit;text-align:center;color:var(--ink);outline:none;background:#fff}.card input[type=text]:focus{border-color:var(--accent)}.btn{display:inline-block;margin-top:14px;padding:13px 34px;border:none;border-radius:16px;background:linear-gradient(180deg,var(--accent),var(--accent-dark));color:#fff;font-size:1.15rem;font-weight:800;font-family:inherit;cursor:pointer;box-shadow:0 6px 18px #d94a3859;transition:transform .12s ease,box-shadow .12s ease}.btn:hover{transform:translateY(-2px);box-shadow:0 9px 22px #d94a3866}.btn:active{transform:translateY(0)}.btn.secondary{background:#e8eef7;color:var(--ink);box-shadow:0 4px 12px #1e3c781f}.legend{margin-top:18px;font-size:.82rem;text-align:left;background:#f4f7fc;border-radius:14px;padding:12px 16px;line-height:1.75}.legend b{display:inline-block;min-width:84px}kbd{background:#fff;border:1px solid #ccd6e4;border-bottom-width:2px;border-radius:6px;padding:1px 6px;font-family:inherit;font-size:.78rem}.color-legend{display:flex;justify-content:center;gap:10px;margin-top:14px;font-size:.75rem;flex-wrap:wrap}.color-legend .swatch{display:flex;align-items:center;gap:5px}.color-legend .chip{width:14px;height:14px;border-radius:4px;display:inline-block}.gh-link{display:inline-flex;align-items:center;gap:6px;margin-top:16px;padding:7px 14px;border-radius:999px;background:#2b3a55;color:#fff;font-size:.78rem;font-weight:700;text-decoration:none;transition:transform .12s ease,background .12s ease}.gh-link:hover{background:#3d5170;transform:translateY(-1px)}.demo-badge{display:inline-block;margin-top:10px;padding:4px 12px;border-radius:999px;background:#ffedcc;color:#9a6b0f;font-size:.75rem;font-weight:700}.error-text{color:var(--accent-dark);margin:10px 0;font-size:.9rem;min-height:1.2em}.stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 6px}.stat{background:#f4f7fc;border-radius:14px;padding:10px 8px}.stat .value{font-size:1.35rem;font-weight:800;color:var(--ink)}.stat .label{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;opacity:.65}.crash-building{background:#fdeae5;border:2px solid #f6c4b8;border-radius:14px;padding:12px;margin-top:12px;font-size:.95rem}.crash-building .date{font-weight:800;font-size:1.15rem;color:var(--accent-dark)}.week-chart{display:flex;justify-content:center;align-items:flex-end;gap:8px;height:74px;margin-top:12px}.wc-col{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;width:26px}.wc-bar{width:100%;border-radius:5px 5px 0 0;background:#f0a93a;min-height:4px}.wc-col.crash .wc-bar{background:var(--accent-dark)}.wc-count{font-size:.62rem;font-weight:800;opacity:.7}.wc-day{font-size:.62rem;opacity:.55;margin-top:2px}.wc-col.crash .wc-count,.wc-col.crash .wc-day{color:var(--accent-dark);opacity:1}.profile-row{display:flex;align-items:center;justify-content:center;gap:12px;margin:4px 0 14px}.profile-row .avatar{width:52px;height:52px;border-radius:50%;border:3px solid #fff;box-shadow:0 4px 12px #1e3c7840}.profile-row .year-stats{text-align:left;font-size:.82rem;line-height:1.5;opacity:.85}.best-score{margin-top:10px;font-size:.85rem;opacity:.75}.loading-bar{width:100%;height:10px;border-radius:999px;background:#e4ebf5;overflow:hidden;margin-top:16px}.loading-bar .fill{height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,var(--accent),#f6b93b);transition:width .25s ease}#hud{position:absolute;inset:0;pointer-events:none;display:none;font-weight:700}#hud.visible{display:block}.hud-dash{position:absolute;bottom:calc(10px + env(safe-area-inset-bottom,0px));left:50%;transform:translate(-50%);display:flex;gap:18px;align-items:center;background:#2b3a55d1;color:#eef4ff;border-radius:18px 18px 10px 10px;padding:10px 22px;font-size:.9rem;box-shadow:0 -4px 20px #0003;max-width:calc(100vw - 16px);overflow:hidden}.hud-dash .gauge{text-align:center;min-width:64px}.speed-gauge{position:relative}.speed-gauge .dial{width:64px;height:40px;display:block;margin:0 auto 1px;overflow:visible}.speed-gauge .g-value{font-size:.8rem!important;line-height:1}.alt-gauge .alt-track{width:12px;height:40px;border-radius:999px;background:#ffffff38;margin:0 auto 4px;display:flex;align-items:flex-end;overflow:hidden}.alt-gauge .alt-fill{width:100%;background:linear-gradient(180deg,#ff9d8a,#7ec8f2);border-radius:999px;transition:height .15s linear}.hud-dash .gauge .g-value{font-size:1.15rem;font-variant-numeric:tabular-nums}.hud-dash .gauge .g-label{font-size:.6rem;text-transform:uppercase;letter-spacing:.1em;opacity:.65}.hud-top{position:absolute;top:12px;left:50%;transform:translate(-50%);text-align:center;color:#fff;text-shadow:0 2px 8px rgba(30,60,120,.45)}.hud-top .hud-date{font-size:1.25rem;font-weight:800}.progress-track{width:min(420px,70vw);height:8px;border-radius:999px;background:#ffffff59;margin:6px auto 0;overflow:hidden}.progress-track{position:relative}.progress-track .fill{height:100%;background:#fff;border-radius:999px;width:0%}.progress-track .ticks{position:absolute;inset:0;z-index:1}.progress-track .tick{position:absolute;top:0;width:2px;height:100%;background:#2b3a5559}.meter-track{width:70px;height:8px;border-radius:999px;background:#ffffff40;overflow:hidden;margin:4px auto 0}.meter-track .fill{height:100%;background:#7ef2b8;border-radius:999px;width:100%}.combo-badge{position:absolute;top:84px;left:50%;transform:translate(-50%) scale(1);color:#fff;background:var(--accent-dark);border-radius:999px;padding:4px 18px;font-size:1.3rem;font-weight:900;opacity:0;transition:opacity .2s;text-shadow:none}.combo-badge.visible{opacity:1}.popup{position:absolute;color:#fff;font-weight:900;font-size:1.1rem;text-shadow:0 2px 6px rgba(180,40,20,.6);pointer-events:none;animation:popfly .9s ease-out forwards;white-space:nowrap}.popup.gold{color:#ffd75e;text-shadow:0 2px 8px rgba(140,90,0,.7);font-size:1.3rem}.speedlines{position:absolute;inset:-10%;pointer-events:none;opacity:0;transition:opacity .25s;background:repeating-conic-gradient(rgba(255,255,255,.14) 0deg 1deg,transparent 1deg 9deg);-webkit-mask-image:radial-gradient(circle at center,transparent 42%,black 78%);mask-image:radial-gradient(circle at center,transparent 42%,black 78%)}.speedlines.on{opacity:1;animation:streak-spin 1.6s linear infinite}@keyframes streak-spin{0%{transform:rotate(0)}to{transform:rotate(9deg)}}@media (prefers-reduced-motion: reduce){.speedlines.on{animation:none;opacity:.4}}@keyframes popfly{0%{opacity:0;transform:translate(-50%) scale(.6)}15%{opacity:1;transform:translate(-50%,-10px) scale(1.15)}to{opacity:0;transform:translate(-50%,-60px) scale(1)}}#mute-btn,#pause-btn{position:absolute;top:12px;width:42px;height:42px;border-radius:14px;border:none;background:#ffffffd9;box-shadow:0 4px 14px #1e3c7833;font-size:1.2rem;cursor:pointer;pointer-events:auto;color:var(--ink)}#mute-btn{right:12px}#pause-btn{right:62px;display:none}#hud.visible~#pause-btn,body.playing #pause-btn{display:block}.vignette{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 120px #141e3c59;opacity:0;transition:opacity .3s}.vignette.slowmo{opacity:1}.touch-hint{display:none;font-size:.78rem;opacity:.7;margin-top:10px}@media (pointer: coarse){.touch-hint{display:block}.kbd-legend{display:none}}@media (max-width: 560px){.hud-dash{gap:9px;padding:7px 12px;font-size:.72rem}.hud-dash .gauge{min-width:44px}.hud-dash .gauge .g-value{font-size:.95rem}.speed-gauge .dial{width:46px;height:29px}.speed-gauge .g-value{font-size:.7rem!important}.alt-gauge .alt-track{width:9px;height:26px}.meter-track{width:52px}.hud-dash .gauge .g-label{font-size:.52rem}.card{padding:20px}}
