#pitching{position:relative;width:100%;height:100dvh;overflow:hidden;isolation:isolate}#pitching>:not(dialog){touch-action:none}.pitch-hud{position:absolute;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:calc(env(safe-area-inset-top) + 10px) 16px;font:12px monospace;background:linear-gradient(#102a32d9,transparent)}.pitch-hud a{font-weight:bold}.pitch-heading{position:absolute;top:calc(env(safe-area-inset-top) + 64px);left:12px;right:12px;text-align:center;display:grid;gap:5px;pointer-events:none}.pitch-heading strong{font-size:18px}.pitch-heading span{font:12px monospace;color:#dcebd7}#pitch-feedback{position:absolute;top:23%;left:10%;right:10%;text-align:center;font:bold 19px monospace;color:#fff2c4;text-shadow:0 2px #16382d;pointer-events:none}.pitch-controls{position:absolute;bottom:calc(env(safe-area-inset-bottom) + 12px);left:12px;right:12px;text-align:center}#arsenal{display:flex;justify-content:center;gap:6px;flex-wrap:wrap}#arsenal button{padding:7px 9px;font-size:11px;background:#142c35e8}#arsenal button[aria-pressed=true]{border-color:#71c8ff;background:#204963}#instruction{font:11px/1.5 monospace;margin:9px 0;color:#f4edd8}#throw,#next{min-width:160px;min-height:54px;border-radius:28px;border-color:#83c7e3;background:#214656}#throw[data-held=true]{background:#376980}#accuracy{position:absolute;right:8%;top:31%;height:30%;width:20px;background:#647278;border:2px solid #d7e0da;border-radius:12px;overflow:visible;pointer-events:none}#accuracy .good-zone{position:absolute;top:15%;height:10%;width:100%;background:#69c78d}#accuracy .perfect-zone{position:absolute;top:18%;height:4%;width:100%;background:#48b8f5}#release-line{position:absolute;bottom:0;width:32px;height:3px;left:-8px;background:white;box-shadow:0 0 3px #08212e}#accuracy>span{position:absolute;top:calc(100% + 10px);left:-15px;font:8px monospace}#pitching[data-phase=aim] #release-line{opacity:.45}#pitching[data-phase=delivery] #accuracy,#pitching[data-phase=result] #accuracy{visibility:hidden}#pitching[data-phase=delivery] #arsenal{visibility:hidden}
@media(orientation:landscape){.pitch-heading{top:14%;font-size:12px;left:25%;right:25%}.pitch-heading strong{font-size:14px}.pitch-controls{left:auto;width:220px;right:12px;bottom:12px}#arsenal{gap:4px}#arsenal button{font-size:9px;min-height:38px;padding:5px}#instruction{font-size:9px}#accuracy{right:30%;top:30%;height:42%}#pitch-feedback{left:25%;right:30%;top:23%;font-size:15px}}

/* Share batting's aim circle and keep the pitching control centered. */
.pitch-controls{display:flex;flex-direction:column;align-items:center}.pitch-controls .aim-wrap{margin:0 auto}
@media(orientation:landscape){.pitch-controls{left:12px;right:12px;width:auto;pointer-events:none}.pitch-controls .aim-wrap,#arsenal{pointer-events:auto}#arsenal{position:absolute;right:0;bottom:0;width:210px}#instruction{max-width:210px}}

#pitch-target{position:absolute;transform:translate(-50%,-50%);border:1.5px solid #72cfff;border-radius:50%;background:#42b5ff30;pointer-events:none;}

#pitching[data-phase=inplay] #accuracy,#pitching[data-phase=inplay] #arsenal{visibility:hidden}

.pitch-hud{display:grid;grid-template-columns:auto 1fr auto;gap:5px 10px;font-size:10px}.pitch-hud>a{grid-column:1;grid-row:1}.pitch-hud #pitch-count{grid-column:2;grid-row:1;text-align:center}.pitch-hud #base-status{grid-column:2;grid-row:2;text-align:center;font-size:9px}.pitch-hud #menu{grid-column:3;grid-row:1 / 3}
