:root{--sob-red: #e01b24;--sob-red-dark: #9a1119;--sob-bg: #05060a;--sob-ink: #f5f5f5;--sob-muted: #a3a3a3;--sob-gold: #ffd23f;--sob-safe-top: env(safe-area-inset-top, 0px);--sob-safe-bottom: env(safe-area-inset-bottom, 0px);--sob-safe-left: env(safe-area-inset-left, 0px);--sob-safe-right: env(safe-area-inset-right, 0px)}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--sob-bg);color:var(--sob-ink);font-family:Oswald,system-ui,-apple-system,sans-serif;overscroll-behavior:none}#sob-root{height:100%}.sob-root{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;background:var(--sob-bg);overflow:hidden;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.sob-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;touch-action:none}.sob-header{position:absolute;top:0;left:0;right:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:calc(10px + var(--sob-safe-top)) calc(16px + var(--sob-safe-right)) 10px calc(16px + var(--sob-safe-left));background:linear-gradient(to bottom,#000000b8,#0000);pointer-events:none}.sob-header a{pointer-events:auto}.sob-back{color:var(--sob-muted);text-decoration:none;font-weight:600;font-size:15px;letter-spacing:.02em;transition:color .2s ease}.sob-back:hover{color:var(--sob-ink)}.sob-title{font-weight:700;letter-spacing:.14em;font-size:clamp(14px,3.5vw,20px);color:var(--sob-ink)}.sob-title:first-letter{color:var(--sob-red)}.sob-hint{color:var(--sob-muted);font-size:13px;letter-spacing:.05em}@media (max-width: 640px){.sob-hint{display:none}}.sob-pause-btn{pointer-events:auto;background:#0006;border:1px solid #2a2d35;color:var(--sob-ink);width:34px;height:34px;border-radius:8px;font-size:14px;line-height:1;cursor:pointer}.sob-pause-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:40;display:flex;align-items:center;justify-content:center;background:#030408b8;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.sob-pause-card{text-align:center}.sob-pause-title{font-size:40px;font-weight:700;letter-spacing:.1em}.sob-pause-sub{color:var(--sob-muted);letter-spacing:.05em}.sob-hud{position:absolute;top:0;left:0;right:0;z-index:8;padding:calc(52px + var(--sob-safe-top)) calc(14px + var(--sob-safe-right)) 0 calc(14px + var(--sob-safe-left));pointer-events:none}.sob-hud-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center}.sob-health{display:flex;gap:4px}.sob-glove{width:30px;height:30px;fill:none;stroke-width:1.6;transition:opacity .3s ease,transform .3s ease}.sob-glove.is-filled{stroke:#fff;fill:var(--sob-red)}.sob-glove.is-empty{stroke:#3a3d45;fill:none;opacity:.5;transform:scale(.85)}.sob-timer{font-size:clamp(34px,9vw,56px);font-weight:700;font-variant-numeric:tabular-nums;line-height:1;text-align:center;text-shadow:0 2px 10px rgba(0,0,0,.6)}.sob-timer.is-low{color:var(--sob-red);animation:sob-blink 1s steps(2,start) infinite}@keyframes sob-blink{50%{opacity:.45}}.sob-score-box{text-align:right}.sob-score{font-size:clamp(18px,5vw,26px);font-weight:600;font-variant-numeric:tabular-nums}.sob-mult{color:var(--sob-gold);font-weight:700;font-size:18px}.sob-opp{margin-top:8px;text-align:center}.sob-opp-name{font-size:clamp(12px,3.4vw,15px);letter-spacing:.04em;color:#e5e5e5}.sob-opp-tier{color:var(--sob-red);font-weight:700}.sob-opp-nick{color:var(--sob-muted)}.sob-opp-hp{display:flex;gap:4px;justify-content:center;margin-top:4px}.sob-opp-hp-seg{width:clamp(26px,9vw,54px);height:7px;border-radius:3px;background:#2a2d35;transition:background .3s ease}.sob-opp-hp-seg.is-on{background:linear-gradient(90deg,var(--sob-red),#ff5a63)}.sob-meter{margin-top:10px;display:inline-flex;align-items:center;gap:8px}.sob-meter-label{font-size:11px;letter-spacing:.12em;color:var(--sob-muted)}.sob-meter.is-ready .sob-meter-label{color:var(--sob-gold)}.sob-meter-segs{display:flex;gap:4px}.sob-meter-seg{width:22px;height:8px;border-radius:2px;background:#2a2d35}.sob-meter-seg.is-on{background:var(--sob-gold);box-shadow:0 0 8px #ffd23f99}.sob-controls{position:absolute;left:0;right:0;bottom:0;z-index:12;display:flex;flex-direction:column;gap:8px;padding:8px calc(10px + var(--sob-safe-right)) calc(10px + var(--sob-safe-bottom)) calc(10px + var(--sob-safe-left));touch-action:none}.sob-counter-bar{width:100%;min-height:56px;border:2px solid #33363f;border-radius:12px;background:#16181f;color:#6b6f78;font-weight:700;letter-spacing:.18em;font-size:18px;display:flex;align-items:center;justify-content:center;gap:12px;cursor:pointer;touch-action:none;transition:background .2s ease,color .2s ease,border-color .2s ease}.sob-counter-bar[data-ready=true]{color:#1a1203;background:linear-gradient(180deg,#ffe06a,var(--sob-gold));border-color:#fff0b0;box-shadow:0 0 22px #ffd23f80;animation:sob-pulse 1.1s ease-in-out infinite}@keyframes sob-pulse{50%{box-shadow:0 0 34px #ffd23fd9}}.sob-counter-bar:active{transform:translateY(1px)}.sob-defense-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.sob-defense-btn{min-height:72px;border:2px solid #33363f;border-radius:12px;background:#16181feb;color:var(--sob-ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.sob-defense-btn:active{background:var(--sob-red-dark);border-color:var(--sob-red);transform:translateY(1px)}.sob-def-icon svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.sob-def-label{font-size:13px;font-weight:600;letter-spacing:.04em}.sob-key{font-size:10px;color:var(--sob-muted);border:1px solid #33363f;border-radius:4px;padding:0 4px;line-height:14px}.sob-counter-bar[data-ready=true] .sob-key{color:#3a2a00;border-color:#0000004d}@media (hover: hover) and (pointer: fine) and (min-width: 860px){.sob-controls{left:50%;right:auto;transform:translate(-50%);width:min(560px,92vw)}.sob-defense-btn{min-height:64px}}@media (orientation: landscape) and (max-height: 540px){.sob-hud{padding-top:calc(44px + var(--sob-safe-top))}.sob-defense-row{grid-template-columns:repeat(4,1fr);gap:6px}.sob-defense-btn{min-height:56px}.sob-counter-bar{min-height:44px}}.sob-screen{position:absolute;top:0;right:0;bottom:0;left:0;z-index:30;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:calc(60px + var(--sob-safe-top)) 20px calc(24px + var(--sob-safe-bottom));background:radial-gradient(ellipse at center,#0304088c,#030408db)}.sob-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2px solid #3a3d45;background:#14161de6;color:var(--sob-ink);font-family:inherit;font-weight:700;letter-spacing:.08em;font-size:18px;padding:14px 28px;border-radius:12px;cursor:pointer;text-decoration:none;transition:transform .12s ease,background .2s ease,border-color .2s ease;min-width:220px}.sob-btn:hover{border-color:#5a5d66}.sob-btn:active{transform:translateY(1px)}.sob-btn-primary{background:var(--sob-red);border-color:#ff5a63;box-shadow:0 8px 26px #e01b2459}.sob-btn-primary:hover{background:#f22731}.sob-btn-link{background:transparent;border-color:transparent;color:var(--sob-muted);min-width:0;font-size:15px;letter-spacing:.04em}.sob-btn-link:hover{color:var(--sob-ink)}.sob-menu-btns{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:8px}.sob-menu-inner{display:flex;flex-direction:column;align-items:center;gap:14px}.sob-logo{margin:0;font-size:clamp(38px,11vw,88px);font-weight:700;letter-spacing:.04em;line-height:.95;color:#fff;text-shadow:0 6px 30px rgba(224,27,36,.35);animation:sob-logo-in .5s ease both}@keyframes sob-logo-in{0%{opacity:0;transform:scale(.92) translateY(10px)}}.sob-logo-or{color:var(--sob-red)}.sob-tagline{margin:0;color:var(--sob-muted);font-size:clamp(14px,3.6vw,18px);max-width:34ch}.sob-best{margin:8px 0 0;color:var(--sob-muted);letter-spacing:.16em;font-size:13px}.sob-best span{color:var(--sob-gold);font-weight:700;font-size:20px;margin-left:6px}.sob-mute{position:absolute;top:calc(12px + var(--sob-safe-top));right:calc(14px + var(--sob-safe-right));background:#0006;border:1px solid #2a2d35;border-radius:10px;width:42px;height:42px;font-size:20px;cursor:pointer}.sob-tut-card{background:#0e1016eb;border:1px solid #262a33;border-radius:18px;padding:28px 26px;max-width:440px;width:100%}.sob-tut-dots{display:flex;justify-content:center;gap:8px;margin-bottom:16px}.sob-dot{width:9px;height:9px;border-radius:50%;background:#2f333c}.sob-dot.is-active{background:var(--sob-gold)}.sob-dot.is-done{background:var(--sob-red)}.sob-tut-kicker{color:var(--sob-muted);letter-spacing:.14em;text-transform:uppercase;font-size:12px}.sob-tut-attack{margin:4px 0 10px;font-size:clamp(30px,8vw,46px);font-weight:700;color:#fff}.sob-tut-tell{color:#cfcfcf;margin:0 0 14px;font-size:16px}.sob-tut-do{color:var(--sob-ink);font-size:17px}.sob-tut-do strong{color:var(--sob-gold)}.sob-tut-feedback{margin-top:12px;color:#ff8a90;font-size:14px;min-height:18px}.sob-skip{position:absolute;top:calc(12px + var(--sob-safe-top));right:calc(14px + var(--sob-safe-right));background:transparent;border:none;color:var(--sob-muted);font-family:inherit;font-size:15px;cursor:pointer}.sob-skip:hover{color:var(--sob-ink)}.sob-countdown{position:absolute;top:0;right:0;bottom:0;left:0;z-index:25;display:flex;align-items:center;justify-content:center;pointer-events:none}.sob-count-num{font-size:clamp(90px,28vw,220px);font-weight:700;color:#fff;text-shadow:0 10px 50px rgba(224,27,36,.5);animation:sob-count-pop .65s ease-out}.sob-count-num.is-fight{color:var(--sob-red);font-size:clamp(64px,18vw,150px)}@keyframes sob-count-pop{0%{opacity:0;transform:scale(1.6)}40%{opacity:1;transform:scale(1)}}.sob-go-card{background:#0e1016f0;border:1px solid #262a33;border-radius:20px;padding:30px 28px;max-width:440px;width:100%}.sob-go-head{margin:0 0 6px;font-size:clamp(30px,8vw,46px);font-weight:700;letter-spacing:.04em}.sob-go-head.is-ko{color:var(--sob-red)}.sob-go-head.is-time{color:var(--sob-gold)}.sob-go-newbest{display:inline-block;background:var(--sob-gold);color:#1a1203;font-weight:700;letter-spacing:.1em;padding:4px 12px;border-radius:999px;font-size:13px;margin-bottom:8px;animation:sob-logo-in .4s ease both}.sob-go-score{font-size:clamp(46px,13vw,72px);font-weight:700;font-variant-numeric:tabular-nums;line-height:1;color:#fff}.sob-go-title{color:var(--sob-gold);letter-spacing:.1em;text-transform:uppercase;font-size:15px;margin-top:4px}.sob-go-stats{display:flex;justify-content:center;gap:22px;margin:22px 0}.sob-go-stats>div{display:flex;flex-direction:column;gap:2px}.sob-go-stat-val{font-size:24px;font-weight:700;color:#fff;font-variant-numeric:tabular-nums}.sob-go-stat-label{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--sob-muted)}
