:root{font-family:Yu Gothic UI,Hiragino Kaku Gothic ProN,sans-serif;color:#eef4ec;background:#091b24;font-synthesis:none;--lime:#d5ed81;--muted:#adbfbd;--line:#45616a}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{min-height:44px;border:1px solid var(--line);border-radius:6px;padding:10px 16px;background:#1c3742;color:#f2f7ed;cursor:pointer;font-weight:700;transition:background .15s}button:hover{background:#2b4b55}button:focus-visible,[tabindex]:focus-visible{outline:3px solid #e5fca2;outline-offset:3px}button.primary{background:var(--lime);color:#1b3027;border-color:var(--lime);width:100%;font-weight:900;box-shadow:0 3px #88a04d}button.primary:hover{background:#e8f7b0}h1,h2,p{margin:0}small{font-size:11px}.app{min-height:100dvh;display:flex;align-items:center;justify-content:center;gap:clamp(40px,8vw,150px);padding:24px}.desktop-note{max-width:390px}.wordmark,.brand,.score-strip strong,.call strong,.result-panel h2,footer{font-family:Bahnschrift,Arial Narrow,sans-serif}.wordmark{font-size:32px;font-weight:800;letter-spacing:2px}.dot{color:var(--lime)}.desktop-note h1{font-size:clamp(42px,5vw,72px);line-height:1.35;letter-spacing:-.05em;font-weight:900;margin:35px 0 25px}.desktop-note p{font-size:15px;color:var(--muted);line-height:2.1}.desktop-instruction{display:flex;gap:25px;margin:45px 0 18px;font-weight:700;color:var(--lime)}.desktop-note small{color:var(--muted)}.game-shell{position:relative;display:flex;flex-direction:column;width:420px;height:min(900px,calc(100dvh - 48px));min-height:600px;overflow:hidden;background:#112d38;border:1px solid #34505d;border-radius:18px;box-shadow:0 25px 80px #0005}.scoreboard{display:flex;justify-content:space-between;align-items:center;padding:15px 20px 12px;background:#102733}.brand{font-size:27px;letter-spacing:1px;font-weight:800;line-height:1}.brand small{font-family:Yu Gothic UI,Hiragino Kaku Gothic ProN,sans-serif;display:block;letter-spacing:.04em;font-size:9px;font-weight:400;color:#b7c9c6;margin-top:7px}.settings-button{padding:9px 10px;background:transparent;min-width:44px}.score-strip{display:flex;align-items:center;background:#16333e;padding:10px 20px;border-bottom:1px solid #52635a;gap:26px}.score-strip>div:first-child{flex:1}.score-strip span{display:block;color:#bdd0c8;font-size:9px;font-weight:700;letter-spacing:.05em}.score-strip strong{font-size:27px;line-height:1.2;letter-spacing:2px;font-weight:700}.score-strip b{font-weight:500;color:#a4b8b4;font-size:17px}.field{position:relative;flex:1;min-height:0;isolation:isolate}.field canvas{display:block;touch-action:none}.field-caption{position:absolute;top:14px;left:16px;right:16px;display:flex;justify-content:space-between;font-size:10px;color:#e1eee8;text-shadow:0 1px 3px #000;pointer-events:none}.field-caption span:first-child{border-left:3px solid var(--lime);padding-left:7px}.title-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:24px;background:linear-gradient(0deg,#102b39f5,#102b39b0 35%,#102b3930 85%)}.title-copy h1{font-size:52px;font-weight:900;line-height:1.3;letter-spacing:-.04em;margin:13px 0 16px}.title-rule{display:block;width:32px;height:4px;background:var(--lime)}.title-copy p{font-size:12px;line-height:1.9;color:#e3eae2}.start-button{margin-top:26px;display:flex;justify-content:space-between;align-items:center;padding:14px 18px}.title-overlay>small{color:#bdcbc1;text-align:center;margin-top:12px;font-size:10px}.control-pad{position:relative;flex-shrink:0;min-height:118px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;background:#15333d;border-top:1px solid #49615e;touch-action:none;user-select:none;-webkit-user-select:none;overscroll-behavior:contain;color:#d8e3d6}.control-pad.active{background:radial-gradient(ellipse at 50% 30%,#284a4c,#17343e);cursor:grab}.control-pad strong{font-size:12px;font-weight:500}.control-pad small{color:#9fb4ac;font-size:10px}.pad-mark{color:var(--lime);font-size:22px;line-height:1}.pad-line{width:65%;height:1px;background:linear-gradient(90deg,transparent,#5d7771,transparent);margin-top:5px}footer{padding:9px 15px;display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.4px;color:#9badab;background:#102733}.phase-hint{position:absolute;bottom:18px;left:12px;right:12px;text-align:center;border-radius:4px;background:#102733dc;padding:10px 4px;font-size:12px;pointer-events:none}.call{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#16352d66;pointer-events:none;text-shadow:0 3px 14px #0008}.call strong{font-style:italic;font-size:76px;font-weight:800;color:var(--lime)}.call span{font-weight:900;font-size:19px;letter-spacing:2px}.call.failed strong{font-size:51px;color:#f4cfb0}.call.failed span{font-size:12px;letter-spacing:0}.result-panel{position:absolute;left:14px;right:14px;bottom:16px;background:#102b38f5;border:1px solid #6c8170;border-radius:10px;padding:22px 20px;box-shadow:0 12px 30px #0003}.result-tag{font-size:10px;font-weight:700;letter-spacing:.1em;color:var(--lime);margin-bottom:7px}.result-panel h2{font-size:36px;line-height:1.1;letter-spacing:.5px;font-weight:800}.result-panel>p:not(.result-tag){font-size:12px;color:#cbd8d0;line-height:1.6;margin-top:10px}.result-panel.failure{border-color:#b89477}.result-panel.failure .result-tag{color:#f5cba9}.quality{display:flex;gap:35px;margin:18px 0;padding:12px 0;border-block:1px solid #47605f}.quality span{font-size:10px;color:#bfcfc8}.quality strong{display:block;font-size:26px;color:#fff;line-height:1.3}.quality small{font-size:12px;color:#bfcfc8}.result-actions{display:grid;gap:9px}.text-button{background:transparent;border-color:transparent;font-size:12px;padding:5px}.guide,.pause-overlay{position:absolute;left:15px;right:15px;top:50%;transform:translateY(-50%);border:1px solid #8eaa85;background:#102a38f7;border-radius:10px;padding:25px 20px;box-shadow:0 0 0 100vmax #04121b77}.guide h2{font-size:23px;line-height:1.5}.guide ol{padding-left:18px;font-size:12px;line-height:2.1;margin:18px 0}.guide>p:not(.result-tag),.pause-overlay p{font-size:11px;color:#bfcfc8;line-height:1.8;margin:15px 0}.replay-top{position:absolute;top:40px;left:13px;right:13px;display:flex;align-items:center;justify-content:space-between;gap:8px}.replay-top span{font-size:11px;font-weight:700;background:#102b39ce;padding:8px}.replay-top button{font-size:11px;padding:8px 12px}.replay-bottom{position:absolute;bottom:12px;left:12px;right:12px;background:#102b39ed;border-radius:6px;padding:10px}.camera-tabs{display:flex;gap:5px}.camera-tabs button{font-size:10px;padding:5px;flex:1;min-height:44px}.camera-tabs button[aria-pressed=true]{background:var(--lime);color:#152c27}.legend{display:flex;gap:10px;flex-wrap:wrap;font-size:9px;margin:10px 0}.blue{color:#70c6ff}.green{color:#86efb2}.yellow{color:#ffe279}.replay-bottom p{font-size:9px;line-height:1.8;color:#bdcfca}.debug{position:absolute;top:80px;left:0;max-height:45%;overflow:auto;font-size:9px;pointer-events:none;background:#000b;z-index:5}dialog{color:#ecf4eb;background:#14303e;border:1px solid #6e8b81;border-radius:12px;padding:24px;width:min(360px,calc(100vw - 30px));box-shadow:0 20px 100px #0008}dialog::backdrop{background:#061721bb}dialog form{display:grid;gap:20px}.section-heading{display:flex;justify-content:space-between;align-items:center}.section-heading h2{font-size:22px}.section-heading button{font-size:24px;background:transparent}dialog label{font-size:13px;display:block}dialog .toggle{display:flex;align-items:center;justify-content:space-between;gap:16px}dialog input[type=checkbox]{width:23px;height:23px;accent-color:var(--lime)}dialog input[type=range]{display:block;width:100%;margin:15px 0 0;accent-color:var(--lime);min-height:24px}dialog output{float:right;color:#c9e59c}dialog .muted{font-size:11px;color:var(--muted)}.fallback{padding:50px 20px;font-size:14px}@media(max-width:760px){.app{padding:0;display:block}.desktop-note{display:none}.game-shell{width:100%;height:100dvh;min-height:540px;border:0;border-radius:0;max-width:520px;margin:0 auto;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}.scoreboard{padding:12px 18px 10px}.score-strip{padding:9px 18px}.control-pad{min-height:115px}footer{padding:8px 16px}}@media(max-height:700px){.scoreboard{padding-top:8px;padding-bottom:8px}.brand{font-size:23px}.score-strip{padding-top:6px;padding-bottom:6px}.control-pad{min-height:92px}.title-copy h1{font-size:40px}.title-overlay{padding:20px}.start-button{margin-top:16px}.result-panel{padding:15px;bottom:10px}.result-panel h2{font-size:29px}.quality{margin:12px 0;padding:8px 0}.guide{padding:18px}.guide h2{font-size:21px}.guide ol{margin:12px 0}.guide>p:not(.result-tag){margin:10px 0}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}.result-panel .practice-record{margin:0 0 12px!important;font-size:10px!important}.field{touch-action:none}.mitt-control{position:absolute;transform:translate(-50%,-50%);min-height:64px;min-width:64px;padding:0;border:1px dashed #e5fca275;border-radius:45%;background:transparent;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab;z-index:2;transition:none}.mitt-control:hover{background:#e5fca20b}.mitt-control[data-dragging=true]{cursor:grabbing;border-color:#e5fca2;border-style:solid}.mitt-control span{position:absolute;top:100%;left:50%;transform:translate(-50%);margin-top:5px;white-space:nowrap;font-size:10px;color:#effaca;background:#12303ddd;border-radius:4px;padding:4px 7px;pointer-events:none}.mitt-control[data-dragging=true] span{visibility:hidden}.pitch-preview{position:absolute;transform:translate(-50%,-50%);width:58px;height:58px;border:3px solid #7fddff;border-radius:50%;box-shadow:0 0 0 5px #7fddff25,inset 0 0 0 5px #7fddff18;pointer-events:none;z-index:1}.pitch-preview:after{content:"+";position:absolute;inset:0;text-align:center;line-height:50px;font-size:24px;color:#abebff}.pitch-preview span{position:absolute;bottom:100%;left:50%;transform:translate(-50%);white-space:nowrap;margin-bottom:10px;padding:4px 8px;background:#102733ed;border-radius:4px;font-size:11px;font-weight:700;color:#abebff}.mitt-control[hidden],.pitch-preview[hidden]{display:none}.guide,.pause-overlay,.result-panel{z-index:4}.phase-hint{pointer-events:none}.title-copy h1{font-size:clamp(25px,7.5vw,32px);line-height:1.5;letter-spacing:0}.desktop-note h1{font-size:36px;letter-spacing:0}.desktop-rules{margin:24px 0}.guide h2{font-size:23px}.pitcher-info{position:absolute;top:39px;left:14px;right:14px;font-size:10px;line-height:1.5;color:#d5e5e6;pointer-events:none;background:#102b3980;padding:4px 6px;border-radius:3px}.lobby{width:min(100% - 40px,680px);margin:72px auto;color:#e9f1ed}.lobby h1{font-size:26px;margin-bottom:28px}.lobby nav a{display:grid;grid-template-columns:1fr auto;gap:10px;padding:24px;border:1px solid #52665d;border-radius:12px;color:inherit;text-decoration:none;background:#1c3028}.lobby nav a:focus-visible,.lobby nav a:hover{outline:2px solid #b7e4c7;outline-offset:3px}.lobby strong{font-size:20px}.lobby span{grid-column:1;color:#bfd0c7;font-size:14px}.lobby b{grid-column:2;grid-row:1 / 3;align-self:center;font-size:24px}.lobby nav{display:grid;gap:16px}.lobby nav button:disabled{display:grid;grid-template-columns:1fr auto;gap:10px;padding:24px;text-align:left;border:1px solid #52665d;border-radius:12px;background:#20302b;color:#9ea9a5;cursor:not-allowed;opacity:.65}.lobby nav button:disabled span{color:#b4beb9}.success-achievements{display:grid;gap:5px;margin:12px 0;color:#e0edaf}.success-achievements strong{font-size:23px}.success-achievements>span{font-size:12px;color:#ffe29a}.success-achievements small{color:#c5d2c9}.quality-meter{height:6px;border-radius:3px;background:#ffffff25;overflow:hidden;margin:-8px 0 12px}.quality-meter>span{display:block;height:100%;background:#d5ed81;transform-origin:left;animation:quality-fill .4s ease-out}.result-details{margin:10px 0 14px;font-size:12px}.result-details summary{cursor:pointer;min-height:30px;display:flex;align-items:center}.result-details p{font-size:11px!important;margin:6px 0!important;line-height:1.5}.success-pulse{position:absolute;inset:0;pointer-events:none;z-index:3;box-shadow:inset 0 0 0 3px #d5ed81;animation:success-pulse .45s ease-out both}.call:not(.failed) strong{animation:strike-impact .25s ease-out both}.result-panel{max-height:calc(100% - 50px);overflow:auto}@keyframes success-pulse{0%{box-shadow:inset 0 0 70px #e4f6a377;opacity:1}to{box-shadow:inset 0 0 #e4f6a300;opacity:0}}@keyframes strike-impact{0%{transform:scale(1.16)}to{transform:scale(1)}}@keyframes quality-fill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@media(max-height:700px){.success-achievements{margin:7px 0;gap:3px}.success-achievements strong{font-size:19px}.result-details{margin:6px 0}.quality-meter{margin-bottom:6px}.score-strip{gap:8px}.score-strip span{font-size:9px}}@media(prefers-reduced-motion:reduce){.success-pulse,.call:not(.failed) strong,.quality-meter>span{animation:none}.success-pulse{display:none}}.feedback-result{display:flex;flex-direction:column;gap:10px;max-height:calc(100% - 50px);padding:16px!important}.result-scroll{min-height:0;overflow:auto}.feedback-result .result-actions{flex-shrink:0;margin:0}.feedback-result h2{font-size:28px;margin-bottom:8px}.feedback-result.compact-result h2{font-size:22px;margin-bottom:6px}.feedback-result .success-achievements{margin:6px 0}.framing-assessment,.catch-assessment{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;font-size:12px}.framing-assessment strong{font-size:17px;color:#e3eab7}.failure .framing-assessment strong{color:#ffbf92}.catch-assessment strong{font-size:20px}.catch-assessment small{font-size:10px}.accuracy-note{font-size:10px;color:#adbfbd}.feedback-result .quality-meter{height:4px;margin:4px 0 8px}.feedback-result .failure-advice{font-size:12px!important;line-height:1.5!important;margin:6px 0!important}.feedback-result .next-milestone{font-size:11px!important;margin:4px 0!important;color:#c5d2c9}.feedback-result .result-details{margin:4px 0;font-size:11px}.feedback-result .result-details summary{min-height:28px}.judgement-diagram{margin:10px 0;padding:8px;background:#0a202a;border-radius:6px}.judgement-diagram figcaption{font-size:11px;color:#c6d6d1}.judgement-diagram svg{width:100%;height:85px;display:block}.judgement-diagram text{fill:#d4dfda;font-size:10px;text-anchor:middle}.judgement-diagram>div{display:flex;justify-content:space-between;gap:6px;font-size:11px}.judgement-diagram strong{color:#e3eab7}.compact-result .judgement-diagram{margin:6px 0;padding:6px}.compact-result .judgement-diagram svg{height:65px}@media(max-height:700px){.feedback-result{gap:6px;padding:10px!important}.feedback-result h2{font-size:23px}.feedback-result .success-achievements strong{font-size:16px}.judgement-diagram svg{height:60px}.judgement-diagram{margin:6px 0;padding:6px}}.result-continue{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:inherit;background:transparent;padding:0}.result-continue:hover{background:#ffffff06}.result-continue:focus-visible{outline-offset:-3px}.feedback-result .judgement-diagram{padding:8px;margin:8px 0 0}.feedback-result .judgement-diagram svg{height:125px}.feedback-result .judgement-diagram>div{margin-top:4px}.feedback-result .judgement-diagram .zone-overview{height:130px}.feedback-result .judgement-diagram .boundary-detail{height:85px}.result-continue{pointer-events:none}.feedback-result.success{cursor:pointer}.result-scroll{overscroll-behavior:contain}.inspection-toggle{display:block;background:transparent;border-color:#527078;font-size:12px;padding:6px 12px;margin-top:8px;min-height:36px}.feedback-result.compact-result{padding:12px!important}.feedback-result .result-scroll>small{display:block;color:#e7d8a1;margin-top:6px}.game-shell[data-phase=call] .call{pointer-events:none}@media(max-height:620px){.feedback-result .judgement-diagram .zone-overview{height:110px}}
