:root{--bg: #0e1411;--panel: #16201b;--line: #2a3a31;--grass: #1c5b3a;--grass-2: #1a5436;--ink: #e8f0ea;--muted: #93a89c;--primary: #3ad07f;--decoy: #e0c24a;--ball: #ffffff;--def: #d8543f;--keeper: #3f7fd8;--fail: #d8543f}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,Hiragino Kaku Gothic ProN,sans-serif;-webkit-user-select:none;user-select:none;overflow:hidden}.app{display:flex;flex-direction:column;height:100vh;height:100dvh;max-width:480px;margin:0 auto}.topbar{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;gap:8px;border-bottom:1px solid var(--line)}.brand strong{font-size:15px}.tagline{display:block;font-size:10px;color:var(--muted)}.title{font-style:italic;font-weight:800;font-size:17px;letter-spacing:.5px}.title-line{color:var(--decoy)}.stageno{display:block;font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}.objective{padding:6px 12px;font-size:12px;color:var(--ink);background:#12211a;border-bottom:1px solid var(--line)}.primary-toggle-btn{font-size:13px;font-weight:700}.pass{flex:1;max-width:220px;background:var(--decoy);color:#2a2200;border-color:transparent;font-weight:800;font-style:italic;font-size:18px;letter-spacing:1px;padding:12px}.account{display:flex;gap:6px;align-items:center}button{font:inherit;cursor:pointer;border-radius:8px;border:1px solid var(--line);background:var(--panel);color:var(--ink);padding:7px 12px}button:disabled{opacity:.4;cursor:default}button.primary{background:var(--primary);color:#06301c;border-color:transparent;font-weight:700}button.ghost{background:transparent}.balance{font-weight:600}.balance .plus{color:var(--primary);font-weight:800}.banner{display:flex;justify-content:space-between;align-items:center;background:#1f3a2a;color:var(--ink);padding:8px 12px;font-size:13px}.chapter-caption{margin-right:8px;font-weight:800;font-style:italic;color:var(--decoy)}.lock{opacity:.7}.intermission{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;padding:24px;border:none;border-radius:0;background:#000000b3;color:var(--ink);animation:im-fade .25s ease-out}@keyframes im-fade{0%{opacity:0}to{opacity:1}}.im-clear{font-size:26px;font-weight:800;font-style:italic;letter-spacing:1px;color:var(--decoy)}.im-next-title{margin-top:14px;font-size:18px;font-weight:700}.im-next{font-size:14px;color:var(--muted)}.im-tap{margin-top:18px;font-size:12px;color:var(--muted);opacity:.8}.story-overlay{cursor:pointer;overflow:hidden;z-index:90;background:#020403}.story-shell{display:flex;flex-direction:column;align-items:center;gap:8px;width:min(96vw,520px);max-height:calc(100vh - 28px);isolation:isolate}.story-subtitle{font-size:13px;font-weight:700;color:var(--muted)}.story-stage{position:relative;width:min(92vw,460px);height:min(48vh,330px);min-height:220px;overflow:hidden;border:2px solid rgba(255,255,255,.82);border-radius:8px;background:linear-gradient(90deg,rgba(255,255,255,.16) 1px,transparent 1px) 50% 0 / 42px 100%,linear-gradient(180deg,rgba(255,255,255,.12) 1px,transparent 1px) 0 50% / 100% 38px,linear-gradient(135deg,#1c7449,#145c3b 55%,#0f4c34);box-shadow:inset 0 0 0 1px #00000073,0 10px 24px #0000006b}.story-stage-ending{height:min(46vh,360px)}.story-bg{position:absolute;inset:0;background-size:cover;background-position:center 35%;background-repeat:no-repeat}.story-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0000001a,#0000001f 55%,#00000080)}.story-field-lines{position:absolute;inset:14px;border:1px solid rgba(255,255,255,.36);border-radius:8px;pointer-events:none}.story-field-lines:before,.story-field-lines:after{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:#ffffff47}.story-field-lines:after{left:50%;top:50%;bottom:auto;width:76px;height:76px;border:1px solid rgba(255,255,255,.24);border-radius:50%;background:transparent;transform:translate(-50%,-50%)}.story-actor{--kit: #1f4fff;--accent: #ffffff;position:absolute;left:var(--from-x);top:var(--from-y);z-index:2;display:flex;flex-direction:column;align-items:center;transform:translate(-50%,-50%);animation:story-actor-move var(--scene-duration) cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--actor-delay)}.story-actor-balanced{--kit: #f6f7f3;--accent: #17814e}.story-actor-sprinter,.story-actor-passer{--kit: #f6f7f3;--accent: #c4213d}.story-actor-post,.story-actor-anchor{--kit: #142b54;--accent: #ffffff}.story-actor-finisher{--kit: #0d7c45;--accent: #ffd33d}@keyframes story-actor-move{0%,8%{left:var(--from-x);top:var(--from-y)}74%,to{left:var(--to-x);top:var(--to-y)}}.story-actor-shadow{position:absolute;left:50%;bottom:-6px;width:42px;height:9px;background:#0000005c;border-radius:50%;transform:translate(-50%);filter:blur(2px)}.story-actor-card{position:relative;display:flex;flex-direction:column;align-items:center;width:58px;height:66px;filter:drop-shadow(0 4px 5px rgba(0,0,0,.5))}.story-actor-portrait{position:relative;z-index:2;width:46px;height:46px;border:2px solid var(--accent);border-radius:50%;object-fit:cover;background:#f4e8d2;pointer-events:none}.story-actor-kit{width:36px;height:24px;margin-top:-5px;border:2px solid var(--accent);border-radius:6px 6px 8px 8px;background:var(--kit)}.story-actor-name{max-width:72px;margin-top:2px;padding:1px 4px;border-radius:6px;background:#030e0db8;color:#fff;font-size:10px;font-weight:800;white-space:nowrap}.story-pose-run .story-actor-card{animation:story-run-bob .42s ease-in-out infinite alternate}.story-pose-talk .story-actor-card{animation:story-talk-bob 1s ease-in-out infinite alternate}.story-pose-kick .story-actor-card{animation:story-kick-bob .78s ease-in-out infinite}.story-pose-hold .story-actor-card{animation:story-hold-brace 1.2s ease-in-out infinite alternate}.story-pose-celebrate .story-actor-card{animation:story-celebrate-hop .72s ease-in-out infinite alternate}.story-pose-disappointed .story-actor-card{transform:translateY(4px) rotate(-2deg);filter:drop-shadow(0 3px 4px rgba(0,0,0,.45)) grayscale(.15)}@keyframes story-run-bob{0%{transform:translateY(0) rotate(-7deg)}to{transform:translateY(-8px) rotate(7deg)}}@keyframes story-talk-bob{0%{transform:translateY(0)}to{transform:translateY(-3px)}}@keyframes story-kick-bob{0%,to{transform:rotate(-5deg)}50%{transform:rotate(8deg) translateY(-4px)}}@keyframes story-hold-brace{0%{transform:scale(1.03)}to{transform:scale(.98) translateY(2px)}}@keyframes story-celebrate-hop{0%{transform:translateY(0) scale(1)}to{transform:translateY(-8px) scale(1.04)}}.story-bubble{position:absolute;left:clamp(136px,var(--bubble-x),calc(100% - 136px));top:clamp(34px,var(--bubble-y),calc(100% - 34px));z-index:5;max-width:min(72%,270px);padding:8px 10px;border:2px solid rgba(255,255,255,.9);border-radius:8px;background:#030e0de0;color:#fff;font-size:13px;font-weight:700;line-height:1.35;text-align:left;opacity:0;transform:translate(-50%,-50%) scale(.96);animation:story-bubble-pop 2.4s ease-out both;pointer-events:none}.story-bubble-speaker{display:inline-block;margin-right:6px;color:var(--decoy);font-size:11px;font-weight:900}@keyframes story-bubble-pop{0%{opacity:0;transform:translate(-50%,-44%) scale(.94)}12%,80%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-56%) scale(.98)}}.story-caption{max-width:min(90vw,480px);font-size:14px;font-weight:800;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.9)}.story-ending-window{position:fixed;z-index:60}.story-ending-shell{gap:10px}.story-ending-stats{display:flex;flex-direction:column;gap:5px;padding:8px 12px;border:1px solid rgba(255,255,255,.28);border-radius:8px;background:#030e0dad;opacity:0;animation:story-ending-stats-reveal 14.5s linear both}@keyframes story-ending-stats-reveal{0%,58%{opacity:0;transform:translateY(8px)}66%,to{opacity:1;transform:translateY(0)}}.status-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 12px 6px;background:#12211a;border-bottom:1px solid var(--line)}.lives{display:inline-flex;gap:2px;font-size:15px;line-height:1}.life.spent{filter:grayscale(1) brightness(.5);opacity:.35}.streak{font-size:11px;font-weight:700;color:var(--muted)}.endwindow{position:absolute;inset:0;z-index:30;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:16px;background:#040a079e;color:var(--ink);text-align:center;cursor:pointer;animation:im-fade .25s ease-out}.go-title{font-size:38px;font-weight:800;font-style:italic;letter-spacing:2px;color:var(--fail);text-shadow:0 2px 10px rgba(0,0,0,.9)}.complete-title{color:var(--decoy)}.ending-window{z-index:35;gap:14px;background:#000000e0}.ending-window.story-ending-window{position:fixed;inset:0;z-index:90;background:#020403}.ending-slot{display:flex;flex-direction:column;align-items:center;gap:8px;padding:28px 24px;min-width:min(82vw,420px);border:1px dashed rgba(255,255,255,.18);border-radius:14px}.ending-title{font-size:30px;font-weight:800;font-style:italic;letter-spacing:2px;color:var(--decoy);text-shadow:0 2px 10px rgba(0,0,0,.9)}.ending-subtitle{font-size:14px;color:var(--muted);letter-spacing:1px}.go-record{font-size:18px;font-weight:800;font-style:italic;letter-spacing:1px;color:var(--decoy);text-shadow:0 1px 6px rgba(0,0,0,.9)}.go-stats{font-size:15px;color:var(--ink);text-shadow:0 1px 6px rgba(0,0,0,.9)}.go-misses{font-size:18px;font-weight:900;font-style:italic;letter-spacing:1px;color:var(--muted);text-shadow:0 1px 6px rgba(0,0,0,.9)}.score{font-size:12px;font-weight:800;color:var(--decoy)}.retry-window{position:absolute;inset:0;z-index:25;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:16px;background:#040a076b;text-align:center;cursor:pointer;animation:im-fade .18s ease-out}.retry-window-defensive{justify-content:flex-end;padding-bottom:clamp(26px,8vh,64px);background:linear-gradient(to bottom,#040a071a,#040a0729 42%,#040a0794 72%,#040a07ad)}.rw-reason{font-size:34px;font-weight:800;font-style:italic;letter-spacing:1px;color:var(--fail);text-shadow:0 2px 8px rgba(0,0,0,.8)}.rw-chain{font-size:13px;color:#cde3d8;text-shadow:0 1px 4px rgba(0,0,0,.9)}.rw-lives{font-size:14px;font-weight:700;color:var(--ink);text-shadow:0 1px 4px rgba(0,0,0,.9)}.rw-btn{margin-top:6px;min-width:180px;padding:14px 28px;background:var(--decoy);color:#2a2200;border:none;border-radius:12px;font-weight:800;font-style:italic;font-size:22px;letter-spacing:1px;box-shadow:0 4px 14px #00000080;cursor:pointer}.rw-noslife{font-size:20px;font-weight:800;color:var(--muted);text-shadow:0 1px 4px rgba(0,0,0,.9)}.rw-tap{font-size:12px;color:var(--muted);opacity:.85}.stage{position:relative;flex:1;display:flex;align-items:center;justify-content:center;padding:8px;min-height:0}.dev-bg3d-hud{position:absolute;top:6px;left:6px;z-index:5;padding:4px 7px;font-size:11px;line-height:1.4;font-variant-numeric:tabular-nums;color:#cfffe2;background:#0009;border-radius:6px;pointer-events:none;white-space:nowrap}.dev-stage-select{margin-top:8px;font-size:12px;color:var(--muted)}.stage-bg{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center center;background-repeat:no-repeat;pointer-events:none;--stage-bg-dim: .62}.stage-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,var(--stage-bg-dim)) 0% 55%,rgba(0,0,0,calc(var(--stage-bg-dim) + .2)))}.stage>.pitch{position:relative;z-index:1}.pitch{width:auto;height:auto;max-width:100%;max-height:100%;touch-action:none}.overlay3d{position:absolute;inset:0;z-index:0;pointer-events:none}.overlay3d-canvas{display:block;width:100%;height:100%}.stage.has-3d{align-items:flex-start}.stage.has-3d .pitch{position:relative;z-index:1;transform:scale(.46);transform-origin:top center;transition:opacity .45s ease,transform .45s ease}.stage.has-3d .field{fill-opacity:.7}.stage.has-3d.board-hidden .pitch{opacity:0;transform:scale(.4) translateY(-16px);pointer-events:none}.field{fill:var(--grass);stroke:var(--line);stroke-width:2}.turf-stripe{fill:var(--grass-stripe, var(--grass))}.turf-stripes{opacity:var(--turf-stripe-alpha, 0);pointer-events:none}.goal{stroke:#fff;stroke-width:6;stroke-linecap:round}.frame{fill:#ffffff08;stroke:#ffffff2e;stroke-width:1;stroke-dasharray:6 5}.piece-body{fill:var(--panel);stroke:var(--muted);stroke-width:2}.piece-p1 .piece-body{fill:#2b6cb0;stroke:#9ccaf0}.piece-primary .piece-body{fill:#1f6e44;stroke:var(--primary);stroke-width:3}.piece-decoy .piece-body{fill:#4a431f;stroke:var(--decoy)}.piece-label{fill:var(--ink);font-size:12px;font-weight:700;pointer-events:none}.token-shadow{fill:#0000004d}.token-figure{transform-box:fill-box;transform-origin:center}.token-leg{stroke:#051218d1;stroke-width:4;stroke-linecap:round}.token-action-leg{stroke:#fff;stroke-width:4.5;stroke-linecap:round}.token-action-leg-shoot{stroke:#ffd900;stroke-width:5.5}.token-stand{pointer-events:none}.token-stand-sprite{filter:drop-shadow(0 3px 3px rgba(0,0,0,.5)) drop-shadow(0 0 3px rgba(255,255,255,.18))}.token-stand-sprite-defender{filter:drop-shadow(0 3px 3px rgba(0,0,0,.5)) drop-shadow(0 0 4px rgba(255,217,0,.16))}.token-stand-sprite-gk{filter:drop-shadow(0 3px 3px rgba(0,0,0,.52)) drop-shadow(0 0 5px rgba(204,255,0,.3))}.token-action-pose{pointer-events:none}.token-action-pose-sprite{filter:drop-shadow(0 3px 3px rgba(0,0,0,.52)) drop-shadow(0 0 5px rgba(255,255,255,.2))}.token-action-pose-sprite-kick,.token-action-pose-sprite-kickWatch,.token-action-pose-sprite-shoot{filter:drop-shadow(0 3px 3px rgba(0,0,0,.52)) drop-shadow(0 0 6px rgba(255,217,0,.24))}.token-action-pose-sprite-receive{filter:drop-shadow(0 3px 3px rgba(0,0,0,.52)) drop-shadow(0 0 5px rgba(255,255,255,.26))}.token-action-pose-sprite-celebrate{filter:drop-shadow(0 3px 3px rgba(0,0,0,.52)) drop-shadow(0 0 8px rgba(255,217,0,.28))}.token-action-pose-sprite-disappointed{filter:drop-shadow(0 3px 3px rgba(0,0,0,.52)) drop-shadow(0 0 4px rgba(4,20,18,.24))}.token-block-reach{pointer-events:none}.token-block-sprite{filter:drop-shadow(0 3px 3px rgba(0,0,0,.55)) drop-shadow(0 0 5px rgba(255,255,255,.3))}.token-block-sprite-block{filter:drop-shadow(0 3px 3px rgba(0,0,0,.55)) drop-shadow(0 0 6px rgba(255,217,0,.38))}.token-block-sprite-save{filter:drop-shadow(0 3px 3px rgba(0,0,0,.55)) drop-shadow(0 0 7px rgba(204,255,0,.42))}.token-block-impact{fill:#ffd90047;stroke:#fffffff2;stroke-width:3.4}.token-block-impact-save{fill:#ccff0029;stroke:#ccff00e6}.token-block-contact{fill:#ffffffc7;stroke:#0a141299;stroke-width:1}.token-block-contact-save{fill:#ccff00d1}.token-shoulder{stroke:#00000059;stroke-width:1}.token-body{stroke:#ffffff80;stroke-width:1}.token-head{stroke:#00000059;stroke-width:1}.token-nose{opacity:.95}.token-portrait{pointer-events:none}.token-portrait-frame{fill:none;stroke:#ffffffb8;stroke-width:1.2}.token-receive-pulse{fill:none;stroke:#fff;stroke-width:2;pointer-events:none}.token-ring{fill:none;stroke-width:3}.token-number{fill:#fff;font-size:10px;font-weight:800;pointer-events:none}.token-sprite-number{fill:#fff;stroke:#041c4ab8;stroke-width:2.4;paint-order:stroke;font-size:10px;font-weight:900;pointer-events:none}.token-sprite-number-action{font-size:9px}.token-role-label{fill:#fff;stroke:#041c4ad1;stroke-width:2.6;paint-order:stroke;font-size:9px;font-weight:800;letter-spacing:.2px;pointer-events:none}.tip-handle{fill:#ffffffd9;stroke:#06301c;stroke-width:2}.run-arrow{stroke-width:4;fill:none}.run-arrow-primary{stroke:#ffd900}.run-arrow-decoy{stroke:#93a89c;stroke-dasharray:8 6}.arrowhead{fill:var(--muted)}.preview-line{stroke:#fff;stroke-width:2;stroke-dasharray:3 6;opacity:.85}.preview-target{fill:#fff;opacity:.85}.ball{fill:var(--ball);stroke:#102018;stroke-width:1}.pass-dir{stroke-width:3.5;stroke-linecap:round;pointer-events:none}.ball-trail{stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;fill:none;pointer-events:none;opacity:.9}.result-veil{fill:#00000073}.result-panel{fill:#030e0deb;stroke:#ffffffe0;stroke-width:2;filter:drop-shadow(0 4px 8px rgba(0,0,0,.45))}.result-head-svg{font-size:32px;font-weight:800;font-style:italic;letter-spacing:1px;paint-order:stroke;stroke:#020c0aad;stroke-width:3.5px}.result-svg.goal .result-head-svg{fill:#ffd900}.result-svg.fail .result-head-svg{fill:#ff8a1f}.result-chain-svg{font-size:15px;fill:#cde3d8;paint-order:stroke;stroke:#020c0aad;stroke-width:2.2px}.result-chain-svg.hint{fill:var(--muted)}.result-next{cursor:pointer}.result-next-bg{fill:#ffd900;stroke:#fff;stroke-width:2}.result-next-text{font-size:18px;font-weight:800;font-style:italic;fill:#2a2200;stroke:none}.controls{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px;border-top:1px solid var(--line)}.primary-toggle{display:flex;align-items:center;gap:4px;font-size:12px;color:var(--muted)}.seg{padding:6px 12px}.seg.active{border-color:var(--primary);color:var(--primary);font-weight:700}.kick{flex:1;background:var(--primary);color:#06301c;border-color:transparent;font-weight:800;font-size:16px;padding:12px;max-width:200px}.modal-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;padding:16px;z-index:50}.modal-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px;width:100%;max-width:360px}.modal-title{margin:0 0 12px}.modal-form{display:flex;flex-direction:column;gap:12px}.modal-field{display:flex;flex-direction:column;gap:4px;font-size:13px}.modal-field input{padding:10px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit}.modal-error{color:var(--fail);font-size:13px;margin:0}.modal-actions{display:flex;justify-content:flex-end;gap:8px}.pack-list{list-style:none;padding:0;margin:0 0 12px;display:flex;flex-direction:column;gap:8px}.pack{width:100%;display:flex;align-items:center;justify-content:space-between;padding:12px}.pack-ingots{color:var(--primary);font-weight:700}.title-screen{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px;text-align:center;background:#061b33}.title-logo-img{width:80%;max-width:80%;height:auto;object-fit:contain;margin-bottom:4px;filter:drop-shadow(0 4px 14px rgba(0,0,0,.45))}.title-lastrun{font-size:13px;color:var(--ink)}.title-best{font-size:14px;font-weight:700;color:var(--decoy)}.title-start{margin-top:8px;min-width:230px;padding:18px 32px;background:var(--decoy);color:#2a2200;border:none;border-radius:14px;font-weight:800;font-style:italic;font-size:26px;letter-spacing:1px;display:flex;flex-direction:column;align-items:center;gap:4px;box-shadow:0 6px 18px #00000080;cursor:pointer}.title-start:disabled{opacity:.45;cursor:default}.ts-sub{font-size:12px;font-weight:700;font-style:normal;opacity:.85}.title-soldout{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:13px;color:var(--muted)}.title-sub-link{background:transparent;border:1px solid var(--decoy);color:var(--decoy);border-radius:8px;padding:8px 16px;font-weight:700}.title-menu{display:flex;gap:10px;margin-top:6px}.title-menu button{background:var(--panel);border:1px solid var(--line);color:var(--ink);border-radius:8px;padding:10px 18px}.title-panel{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;background:#0009;padding:24px}.tp-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px;min-width:250px;display:flex;flex-direction:column;gap:10px}.tp-card h3{margin:0;font-size:16px}.tp-row{display:flex;justify-content:space-between;gap:12px;font-size:14px;font-weight:700}.tp-note{font-size:11px;color:var(--muted);margin:0}.tp-toggle{display:flex;justify-content:space-between;align-items:center;font-size:14px}.tp-toggle button{background:var(--decoy);color:#2a2200;border:none;border-radius:6px;padding:4px 16px;font-weight:800}.tp-close{background:var(--panel);border:1px solid var(--line);color:var(--ink);border-radius:8px;padding:9px}.language-select{background:var(--decoy);color:#2a2200;border:none;border-radius:6px;padding:4px 10px;font-weight:800;font-size:14px}