:root{--accent: #ff5a3d;--accent-soft: #ffb3a5;--ink: #1b1f24;--ink-soft: #7d8189;--bg: #f2efe9;--bg-alt: #e7e2d8;--good: #1e9e5a;--bad: #e0402f;--radius: 14px}#overlay{font-size:16px;color:var(--ink)}.screen{position:absolute;inset:0;display:flex;flex-direction:column;padding:24px 20px calc(20px + env(safe-area-inset-bottom));opacity:1;transition:opacity .18s ease}.screen.is-entering{opacity:0}.screen--intro{align-items:center;justify-content:center;text-align:center;gap:14px;background:color-mix(in srgb,var(--bg) 72%,transparent);backdrop-filter:blur(2px);cursor:pointer}.intro-line{font-size:26px;font-weight:800;line-height:1.35;max-width:88%;letter-spacing:-.01em}.intro-sub{font-size:15px;color:var(--ink-soft)}.intro-hints{display:flex;gap:10px;margin-top:6px}.pill{font-size:13px;padding:7px 12px;border-radius:999px;background:var(--bg-alt);color:var(--ink-soft)}.pill--warn{background:color-mix(in srgb,var(--bad) 14%,var(--bg));color:var(--bad)}.intro-tap{margin-top:10px;font-size:15px;font-weight:700;color:var(--accent);animation:pulse 1.4s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}.screen--pause{align-items:center;justify-content:center;text-align:center;gap:8px;background:color-mix(in srgb,var(--bg) 84%,transparent)}.countdown-number{font-size:132px;font-weight:800;line-height:1;color:var(--accent)}.screen--tutorial{touch-action:none;overscroll-behavior:contain;align-items:center;justify-content:flex-start;padding-top:21%;text-align:center;background:color-mix(in srgb,var(--bg) 52%,transparent);cursor:pointer}.tut-card{display:flex;flex-direction:column;align-items:center;gap:18px;max-width:86%;padding:20px 22px 24px;border-radius:20px;background:var(--bg);box-shadow:0 10px 28px #00000029}.tut-line{font-size:27px;font-weight:800;line-height:1.3;letter-spacing:-.01em}.tut-ind{display:flex;align-items:center;justify-content:center;height:58px}.tut-ind--tap .tut-dot{position:relative;width:26px;height:26px;border-radius:999px;background:var(--accent)}.tut-ind--tap .tut-dot:after{content:"";position:absolute;inset:-13px;border:3px solid var(--accent);border-radius:999px;animation:tut-ring 1.3s ease-out infinite}@keyframes tut-ring{0%{transform:scale(.62);opacity:.9}to{transform:scale(1.35);opacity:0}}.tut-ind--slide{flex-direction:column;gap:4px}.tut-arrow{width:26px;height:26px;border-right:5px solid var(--accent);border-bottom:5px solid var(--accent);border-radius:3px;transform:rotate(45deg);animation:tut-fall 1.2s ease-in-out infinite}.tut-ind--slide .tut-arrow:last-child{opacity:.45;animation-delay:.18s}@keyframes tut-fall{0%,to{transform:translateY(-5px) rotate(45deg);opacity:.35}45%{transform:translateY(5px) rotate(45deg);opacity:1}}.tut-card.is-shake{animation:tut-shake .42s ease}@keyframes tut-shake{0%,to{transform:translate(0)}18%{transform:translate(-9px)}42%{transform:translate(8px)}68%{transform:translate(-5px)}86%{transform:translate(3px)}}@media (prefers-reduced-motion: reduce){.tut-ind--tap .tut-dot:after,.tut-arrow,.tut-card.is-shake{animation:none}.tut-ind--tap .tut-dot:after{opacity:.7}}.screen--revive{align-items:center;justify-content:flex-end;gap:10px;background:color-mix(in srgb,var(--bg) 78%,transparent)}.revive-title{font-size:30px;font-weight:800;line-height:1.25;max-width:92%;text-align:center;text-wrap:balance}.revive-body{font-size:15px;color:var(--ink-soft);margin-bottom:8px}.screen--result{background:var(--bg);overflow-y:auto;-webkit-overflow-scrolling:touch;gap:12px}.result-title{font-size:28px;font-weight:800;line-height:1.3;letter-spacing:-.01em;margin-top:8px}.result-distance{display:flex;align-items:baseline;gap:6px;font-weight:800;line-height:1}.result-distance b{font-size:76px;letter-spacing:-.03em}.result-distance span{font-size:20px;color:var(--ink-soft)}.result-sub{font-size:15px;color:var(--ink-soft)}.result-actions{display:flex;flex-direction:column;gap:10px;margin-top:4px}.btn{display:block;width:100%;padding:17px 16px;border:0;border-radius:var(--radius);font:inherit;font-size:17px;font-weight:700;text-align:center;cursor:pointer;background:var(--bg-alt);color:var(--ink);-webkit-appearance:none;appearance:none;transition:transform 90ms ease}.btn:active{transform:scale(.985)}.btn:disabled{opacity:.55;cursor:default}.btn--primary{background:var(--accent);color:#fff}.btn--ghost{background:transparent;color:var(--accent);text-decoration:underline;text-underline-offset:3px;padding:12px;font-size:15px;font-weight:600}.divider{height:1px;background:var(--bg-alt);margin:6px 0}.chain{display:flex;flex-direction:column;gap:6px}.chain-head{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;color:var(--ink-soft)}.chain-row{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;background:var(--bg-alt);font-size:15px}.chain-row--you{background:color-mix(in srgb,var(--accent) 16%,var(--bg));font-weight:700}.chain-rank{width:22px;color:var(--ink-soft);font-variant-numeric:tabular-nums}.chain-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chain-score{font-variant-numeric:tabular-nums;font-weight:700}.chain-empty{padding:10px 4px;background:transparent;border-top:1px dashed var(--bg-alt);color:var(--ink-soft);font-size:15px;line-height:1.5}.nick{display:flex;flex-direction:column;gap:8px}.nick-label{font-size:13px;color:var(--ink-soft)}.nick-row{display:flex;gap:8px}.nick-input{flex:1;min-width:0;padding:14px;border:2px solid var(--bg-alt);border-radius:var(--radius);background:#fff;font:inherit;font-size:17px;font-weight:600;color:var(--ink)}.nick-input:focus{outline:none;border-color:var(--accent)}.nick-btn{flex:0 0 auto;padding:0 16px;border:0;border-radius:var(--radius);background:var(--bg-alt);font:inherit;font-size:20px;font-weight:700;cursor:pointer;color:var(--ink)}.nick-msg{font-size:13px;color:var(--ink-soft);min-height:16px}.nick-msg--err{color:var(--bad)}.feedback{margin-top:auto;padding-top:14px;display:flex;flex-wrap:wrap;justify-content:center;gap:4px 16px}.feedback a,.feedback button{padding:0;border:0;background:none;font:inherit;font-size:13px;color:var(--ink-soft);text-decoration:underline;text-underline-offset:3px;cursor:pointer}.feedback button:disabled{cursor:default;text-decoration:none;color:var(--accent);font-weight:700}.toast{position:absolute;left:50%;bottom:calc(28px + env(safe-area-inset-bottom));transform:translate(-50%);padding:11px 16px;border-radius:999px;background:#14161aeb;color:#fff;font-size:14px;font-weight:600;white-space:nowrap;opacity:1;transition:opacity .24s ease;pointer-events:none;z-index:10}.toast--out{opacity:0}.spacer{flex:1 1 auto;min-height:8px}
