:root{--color-sky-top: #8ECDE6;--color-sky-bottom: #F6EED9;--color-perfect: #FFB627;--color-perfect-text: #6B4A00;--color-good: #6FA8DC;--color-good-text: #FFFFFF;--color-text: #3A4438;--color-text-sub: #6E7A6B;--color-hud-bg: rgba(255, 255, 255, .85);--color-overlay: rgba(58, 68, 56, .45);--color-card: #FFFFFF;--color-button: #E8842F;--color-button-text: #FFFFFF;--color-best: #E8842F;--font-family: -apple-system, BlinkMacSystemFont, "Hiragino Maru Gothic ProN", "Hiragino Sans", "Noto Sans JP", sans-serif;--radius-s: 8px;--radius-m: 16px;--radius-pill: 999px;--shadow-card: 0 4px 16px rgba(58, 68, 56, .18)}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden;overscroll-behavior:none}body{font-family:var(--font-family);color:var(--color-text)}#app{position:fixed;top:0;right:0;bottom:0;left:0;background:linear-gradient(var(--color-sky-top) 0%,var(--color-sky-bottom) 78%);touch-action:none;user-select:none;-webkit-user-select:none}#stage{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}#stage canvas{position:absolute;top:0;right:0;bottom:0;left:0;display:block}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.boot-error{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:var(--color-card);border-radius:var(--radius-m);box-shadow:var(--shadow-card);padding:18px 24px;font-weight:700;max-width:88vw;text-align:center}.overlay.center{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}.overlay.dim{background:var(--color-overlay)}[hidden]{display:none!important}.pill{display:inline-flex;align-items:center;gap:8px;background:var(--color-hud-bg);border-radius:var(--radius-pill);padding:8px 16px;font-weight:700;font-size:16px}.coat-dot{width:14px;height:14px;border-radius:50%;background:#8b5a33;flex:none}.name-pill{position:absolute;left:16px;top:12px}.dist-pill{position:absolute;right:16px;top:12px;font-size:22px}.dist-pill small{font-size:13px;font-weight:700;color:var(--color-text-sub);margin-left:8px}#judge-slot{position:absolute;left:0;right:0;top:18%;display:flex;justify-content:center}.judge{border-radius:var(--radius-pill);padding:10px 22px;font-weight:800;font-size:26px;animation:judge-pop .25s ease-out}.judge[data-grade=perfect]{background:var(--color-perfect);color:var(--color-perfect-text);transform:rotate(-4deg);text-align:center}.judge[data-grade=perfect] .plus{display:block;font-size:15px}.judge[data-grade=good]{background:var(--color-good);color:var(--color-good-text)}@keyframes judge-pop{0%{scale:.4;opacity:0}to{scale:1;opacity:1}}.logo{font-weight:800;font-size:40px;letter-spacing:.06em;text-align:center}.logo small{display:block;font-size:14px;font-weight:700;color:var(--color-text-sub);margin-top:8px;letter-spacing:.1em}.best-pill b{color:var(--color-best);font-size:18px}.btn{background:var(--color-button);color:var(--color-button-text);border-radius:var(--radius-pill);padding:14px 42px;font-weight:700;font-size:22px;box-shadow:var(--shadow-card)}.hint{font-size:14px;font-weight:700;color:var(--color-text-sub)}#hud-title .hint{position:absolute;bottom:20px}#hud-title .logo{animation:float 2.4s ease-in-out infinite}@keyframes float{0%,to{translate:0 0}50%{translate:0 -6px}}.card{background:var(--color-card);border-radius:var(--radius-m);box-shadow:var(--shadow-card);text-align:center;padding:22px 26px;max-width:min(360px,88vw);pointer-events:none;display:flex;flex-direction:column;align-items:center;gap:4px}.card h2{font-size:22px}.ran-with{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:700;color:var(--color-text-sub)}.ran-with .coat-dot{width:12px;height:12px}.score{font-weight:800;font-size:34px;margin-top:6px}.score.is-best{color:var(--color-best)}.breakdown{font-size:14px;font-weight:700;color:var(--color-text-sub)}.breakdown b{color:var(--color-perfect-text);background:var(--color-perfect);border-radius:var(--radius-s);padding:2px 8px;margin-left:4px}.best-line{font-size:14px;font-weight:700;margin-top:6px}.best-line b{color:var(--color-best)}.new-best{display:inline-block;background:var(--color-perfect);color:var(--color-perfect-text);border-radius:var(--radius-pill);padding:6px 18px;font-weight:700;font-size:14px;transform:rotate(-3deg)}.card .btn{font-size:18px;padding:12px 36px;margin-top:12px}.card .hint{margin-top:4px}#hud-result{flex-direction:row;flex-wrap:wrap}.ranking{background:var(--color-hud-bg);border-radius:var(--radius-m);box-shadow:var(--shadow-card);padding:12px 16px;pointer-events:none;width:210px;max-width:88vw}.ranking-title{font-size:13px;font-weight:700;color:var(--color-text-sub);text-align:center;margin-bottom:4px}.ranking-list{list-style:none;display:flex;flex-direction:column;gap:1px}.ranking-row{display:flex;align-items:baseline;gap:8px;font-size:12px;font-weight:700;padding:1px 8px;border-radius:var(--radius-s)}.ranking-row .rk-rank{width:2.4em;color:var(--color-text-sub)}.ranking-row .rk-score{flex:1;text-align:right}.ranking-row .rk-date{font-size:11px;color:var(--color-text-sub)}.ranking-row[data-current="1"]{background:var(--color-perfect);color:var(--color-perfect-text)}.ranking-row[data-current="1"] .rk-rank,.ranking-row[data-current="1"] .rk-date{color:var(--color-perfect-text)}@media(orientation:portrait){.name-pill{left:12px;top:12px;padding:6px 12px;font-size:14px}.dist-pill{right:12px;top:52px;padding:6px 12px;font-size:18px}.logo{font-size:32px}.judge{font-size:22px}#hud-result{flex-direction:column}}