#play-hud[hidden]{display:none}.play-mode .scene-label{display:none}.play-mode .footer-row{display:none}.play-mode .bottom-area{bottom:22px;right:365px}.play-mode .camera-nav{margin:0;gap:0}.play-mode .view{padding:12px 15px;font-size:11px}.play-mode .vignette{background:linear-gradient(180deg,#09100b99,transparent 15%,transparent 80%,#09100b88)}
.play-status{position:absolute;left:40px;top:100px;display:flex;flex-direction:column;gap:7px;pointer-events:none}.play-kicker{font-size:11px;letter-spacing:3px;color:var(--gold)}.play-status strong{font-weight:400;font-size:17px}.play-status>span:last-child{font-size:12px;color:var(--muted)}.play-tools{position:absolute;left:40px;bottom:84px;display:flex;gap:8px}.play-tools button,.shot-actions button,.practice-row button,#tip-center{border:1px solid var(--line);background:#18221be6;color:#d9d7c8;padding:9px 12px;font-size:12px;border-radius:3px;min-height:36px}.play-tools button:hover,.shot-actions button:hover,.practice-row button:hover{border-color:var(--gold)}.play-tools button[aria-checked=false]{color:#8e998d}.play-tools i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--gold);margin-left:6px;vertical-align:middle}.play-tools button[aria-checked=false] i{background:#6f7a6a}.play-tools button[aria-pressed=true]{color:var(--gold)}
.shot-panel{position:absolute;right:32px;top:100px;bottom:24px;width:298px;max-height:680px;overflow:auto;scrollbar-width:thin;padding:20px;background:linear-gradient(145deg,#1b271fee,#111c16f5);border:1px solid #d4bd8e33;border-radius:5px;box-shadow:0 15px 55px #0003;backdrop-filter:blur(18px);font-size:13px}.practice-row{display:flex;gap:10px;align-items:center}.practice-row label{color:var(--muted);font-size:12px;flex-shrink:0}.practice-row select{font-size:13px;padding:9px;border-radius:3px}.practice-row button{padding:8px;white-space:nowrap}.spin-block{display:flex;gap:20px;align-items:center;margin-top:22px}.tip-side{flex-shrink:0;text-align:center}#tip-pad{position:relative;display:block;width:94px;height:94px;border:1px solid #c2bca3;border-radius:50%;background:radial-gradient(circle at 34% 28%,#fffef6,#ece9db 52%,#a8aca1);box-shadow:inset -6px -7px 14px #4052454a,0 5px 20px #0003;touch-action:none;padding:0}.tip-cross::before,.tip-cross::after{content:'';position:absolute;left:50%;top:50%;background:#6c796662}.tip-cross::before{width:68%;height:1px;transform:translate(-50%,-50%)}.tip-cross::after{height:68%;width:1px;transform:translate(-50%,-50%)}#tip-dot{position:absolute;width:12px;height:12px;left:50%;top:50%;border:2px solid #fff5d9;border-radius:50%;background:#ad623f;box-shadow:0 1px 4px #182c18aa;transform:translate(-50%,-50%);pointer-events:none}#tip-center{margin-top:8px;padding:3px 7px;min-height:28px;font-size:11px;background:transparent;border-color:transparent;color:var(--muted)}.spin-fields{flex:1;min-width:0}.spin-fields strong{display:block;font-size:14px;font-weight:400;color:var(--gold);margin-bottom:14px}.shot-panel label{display:block;color:#c1c7b7;font-size:12px}.shot-panel output{float:right;color:var(--gold);font-variant-numeric:tabular-nums}.spin-fields input{margin-top:9px;margin-bottom:12px}.shot-panel input[type=range]{height:20px;margin:4px 0 8px}.spin-presets{display:flex;gap:4px;margin-top:10px}.spin-presets button{flex:1;min-height:33px;font-size:12px;padding:5px 0;background:transparent;border:1px solid var(--line);border-radius:3px;color:#b8c1af}.spin-presets button.active{border-color:#c7ae77;background:#c7ae7716;color:#e3c892}.fine-controls{margin-top:20px;border-top:1px solid var(--line);padding-top:17px}.power-field{margin-top:10px}.shoot{width:100%;min-height:58px;margin-top:4px;border:1px solid #e3cf9b;background:linear-gradient(135deg,#dcc794,#bba16c);border-radius:3px;color:#17261b;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;touch-action:none;box-shadow:0 5px 18px #0003}.shoot>span{font-size:17px;letter-spacing:3px}.shoot>small{font-size:11px;letter-spacing:.5px}.shoot:disabled{cursor:default;opacity:.45}.shoot.charging{background:#f0dcad}.shot-actions{display:flex;gap:8px;margin-top:12px}.shot-actions button{flex:1;padding:7px 3px;background:transparent;font-size:11px}.shot-actions button[aria-pressed=true]{color:var(--gold);border-color:var(--gold)}.play-note{font-size:11px;line-height:1.8;color:#8f9e8c;margin:14px 0 0}.play-mode .toast{bottom:145px;left:calc((100% - 340px)/2)}
.tip-axis{position:absolute;color:#727e696f;font-size:9px;line-height:1;pointer-events:none}.tip-axis.high{top:8px;left:50%;transform:translateX(-50%)}.tip-axis.low{bottom:8px;left:50%;transform:translateX(-50%)}.tip-axis.left{left:8px;top:50%;transform:translateY(-50%)}.tip-axis.right{right:8px;top:50%;transform:translateY(-50%)}
.play-tools select{width:auto;min-height:36px;padding:7px 9px;font-size:12px;border-radius:3px;background:#18221be6;color:#d9d7c8}.play-interaction{display:flex;gap:0}.play-interaction button:first-child{border-radius:3px 0 0 3px}.play-interaction button:last-child{border-radius:0 3px 3px 0;margin-left:-1px}.play-interaction button.active{position:relative;border-color:#c7ae77;color:#e3c892;background:#283526}#play-camera-reset{font-size:18px;padding:4px 10px}
.play-drag-hint{display:flex;align-items:center;color:#c8d0bd;font-size:12px;background:#18221be6;border:1px solid var(--line);border-radius:3px;padding:7px 10px;white-space:nowrap}
@media(max-width:1000px) and (min-width:651px){.play-mode .view{padding:12px 9px;font-size:10px}.play-mode .view span{display:none}.shot-panel{right:20px;width:280px;padding:16px}.play-mode .bottom-area{right:320px;left:20px}.play-status,.play-tools{left:24px}.play-status{top:95px}}
@media(max-width:650px){.play-status{left:18px;top:76px;gap:4px}.play-kicker{display:none}.play-status strong{font-size:13px}.play-status>span:last-child{font-size:10px}.play-tools{left:auto;right:14px;top:78px;bottom:auto;gap:4px}.play-tools button{padding:6px 7px;min-height:30px;font-size:10px}.play-tools i{margin-left:3px;width:4px;height:4px}.shot-panel{left:12px;right:12px;top:auto;bottom:51px;width:auto;height:243px;max-height:none;padding:12px;overflow:visible;display:grid;grid-template-columns:112px minmax(0,1fr);grid-template-rows:33px 107px 56px;gap:9px 15px;background:#152219f2}.practice-row{grid-column:1/3;gap:8px}.practice-row label{font-size:11px}.practice-row select{padding:6px 9px;font-size:12px;height:33px}.practice-row button{padding:5px 10px;min-height:33px}.spin-block{grid-column:1;grid-row:2;margin:0;display:block}.tip-side{position:relative}#tip-pad{width:76px;height:76px;margin:0 auto}#tip-center{margin:2px 0 0;font-size:10px;min-height:24px}.spin-fields{display:none}.spin-presets{display:none}.fine-controls{grid-column:2;grid-row:2;margin:0;border:0;padding:0}.fine-controls label{font-size:11px}.fine-controls input[type=range]{margin:0 0 2px;height:20px}.power-field{grid-column:2;grid-row:2;margin:70px 0 0}.power-field label{font-size:11px}.power-field input[type=range]{height:20px;margin:0}.shoot{grid-column:2;grid-row:3;margin:0;min-height:50px}.shoot>span{font-size:15px}.shoot>small{font-size:10px}.shot-actions{grid-column:1;grid-row:3;margin:0;flex-direction:column;gap:3px}.shot-actions button{min-height:24px;padding:3px;font-size:10px}.play-note{display:none}.play-mode .bottom-area{left:10px;right:10px;bottom:9px}.play-mode .view{font-size:10px;padding:10px 6px;flex:1;white-space:nowrap}.play-mode .view span{display:none}.play-mode .toast{left:50%;bottom:307px;font-size:11px}.play-mode .settings{max-height:calc(100dvh - 100px);overflow:auto}.play-mode .brand{font-size:18px}.play-mode .brand small{font-size:6px}.play-mode .topbar{top:18px;left:18px;right:14px}.play-mode .vignette{background:linear-gradient(180deg,#09100ba0,transparent 20%,transparent 65%,#09100b66)}}
@media(max-height:580px) and (min-width:651px){.shot-panel{top:74px;padding:12px;bottom:14px}.play-status{top:84px}.spin-block{margin-top:12px}.fine-controls{margin-top:12px;padding-top:10px}.play-note{display:none}}
@media(max-width:650px){.play-tools{left:14px;right:14px;top:112px;gap:5px;justify-content:center}.play-tools select{font-size:11px;min-height:32px;padding:5px 7px}.play-tools button{font-size:11px;min-height:32px;padding:5px 7px}.play-interaction button{padding:5px 8px}#play-camera-reset{font-size:17px;padding:3px 7px}.play-tools i{display:none}}
@media(max-width:650px){.play-drag-hint{font-size:10px;padding:5px 6px}.play-tools{gap:4px}.play-tools select{padding:5px}.play-tools button{padding:5px}}

/* Scene navigation has one top position in presentation and practice modes. */
.camera-nav,.play-mode .camera-nav{position:absolute;top:88px;left:40px;right:40px;display:flex;justify-content:center;gap:4px;margin:0;z-index:3}
.camera-nav .view,.play-mode .camera-nav .view{padding:13px 20px;font-size:12px;white-space:nowrap}
.scene-label{top:164px}.settings{top:148px}.play-status{top:155px}.shot-panel{top:155px}.play-tools{bottom:28px;right:365px;flex-wrap:wrap}
#cue-clearance{margin:4px 0 10px;font-size:11px;line-height:1.6;color:#dbc28e}#cue-clearance[hidden]{display:none}
@media(max-width:1050px) and (min-width:651px){.camera-nav,.play-mode .camera-nav{left:20px;right:20px}.camera-nav .view,.play-mode .camera-nav .view{padding:13px 10px;font-size:12px}.camera-nav .view span{display:none}.play-status{top:155px}.shot-panel{top:155px}}
@media(max-width:1000px) and (min-width:651px){.play-tools{right:320px}}
@media(max-width:650px){
  .camera-nav,.play-mode .camera-nav{top:66px;left:14px;right:14px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px}
  .camera-nav .view,.play-mode .camera-nav .view{padding:9px 4px;font-size:12px;line-height:20px;min-height:40px;letter-spacing:0}.camera-nav .view span{display:none}
  .scene-label{top:169px}.settings,.play-mode .settings{top:158px;max-height:calc(100dvh - 178px);overflow:auto}
  .pocket-inspection{top:204px}
  .play-status{top:157px;left:18px}.play-tools{top:203px;bottom:auto;left:14px;right:14px}.shot-panel{top:auto;bottom:12px;height:252px;grid-template-rows:33px 116px 56px}
  #cue-elevation-value{font-size:10px}#cue-clearance{margin:0;position:absolute;left:12px;right:12px;bottom:3px;font-size:9px;line-height:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .play-mode .toast{bottom:278px}.play-mode .bottom-area{bottom:9px}.play-tools .play-drag-hint{display:none}
}
@media(max-height:620px) and (min-width:651px){.topbar{top:14px}.camera-nav,.play-mode .camera-nav{top:64px}.camera-nav .view,.play-mode .camera-nav .view{padding:8px 10px}.play-status{top:115px}.shot-panel{top:115px;bottom:12px}.play-tools{bottom:14px}.play-kicker{display:none}.play-status strong{font-size:14px}.play-status>span:last-child{font-size:11px}.settings{top:112px}.scene-label{top:122px}}