.mode-switch{position:absolute;z-index:4;top:29px;left:50%;transform:translateX(-50%);display:flex;padding:4px;background:#101b15e8;border:1px solid #d4bd8e40;border-radius:6px;backdrop-filter:blur(16px);box-shadow:0 5px 24px #0002}
#viewport canvas:focus-visible{outline:1px solid #d4bd8e55;outline-offset:-3px}
.mode-tab{min-width:142px;min-height:42px;padding:10px 24px;border:1px solid transparent;border-radius:3px;background:transparent;color:#b9c1b1;font-size:14px;letter-spacing:2px;transition:background .2s,color .2s}
.mode-tab.active{background:#d4bd8e;color:#19291e;border-color:#e1cfa8}.mode-tab:hover:not(.active){color:#f0e8d9;background:#35473560}
.camera-nav[hidden],.play-mode .camera-nav{display:none!important}.camera-nav{top:100px}.camera-nav .view{font-size:13px}
.play-status{top:112px}.shot-panel{top:100px}.play-kicker{font-size:12px;letter-spacing:2px}.play-status>span.keyboard-hint{color:#d5bd8f;font-size:13px;letter-spacing:.2px;margin-top:5px}.play-status #shot-result{font-size:12px;color:var(--muted)}
.keyboard-help{margin-top:18px;border-top:1px solid var(--line);padding-top:12px;color:#c8d0bd;font-size:14px}.keyboard-help summary{cursor:pointer;padding:4px 0;list-style-position:inside}.keyboard-help summary span{float:right;color:#899d88;font-size:12px}.keyboard-help dl{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:10px 14px;margin:16px 0 4px}.keyboard-help dt,.keyboard-help dd{margin:0;align-self:center}.keyboard-help dd{font-size:12px;color:#a8b9a5;line-height:1.5}kbd{display:inline-block;min-width:20px;padding:3px 5px;text-align:center;font:11px Consolas,monospace;letter-spacing:0;border:1px solid #cbb48745;border-bottom-width:2px;border-radius:3px;color:#e5d2ad;background:#0e191366}
.play-mode .play-tools{right:365px}.scene-label{top:179px}.settings{top:156px}
@media(max-width:1000px) and (min-width:651px){.mode-tab{min-width:116px;padding:10px 16px}.mode-switch{top:28px}.play-status{top:110px}.shot-panel{top:100px}.play-mode .play-tools{right:320px}.play-status>span.keyboard-hint{font-size:11px}}
@media(max-width:950px) and (min-width:651px){.brand small,.live{display:none}.brand{font-size:21px}.mode-tab{min-width:104px;padding:10px 12px}}
@media(max-width:650px){
  .mode-switch{top:65px;left:14px;right:14px;transform:none;padding:3px}.mode-tab{flex:1;min-width:0;min-height:42px;font-size:14px;padding:9px 8px;letter-spacing:1px}
  .camera-nav{top:124px;left:14px;right:14px;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px}.camera-nav .view{font-size:12px;min-height:38px;padding:8px 4px}.camera-nav [data-view="photo"]{grid-column:2/4}
  .scene-label{top:218px}.pocket-inspection{top:250px}.settings,.play-mode .settings{top:124px;max-height:calc(100dvh - 145px)}
  .play-status{top:127px;left:18px}.play-status strong{font-size:13px}.play-status #shot-result{font-size:11px}.play-status>span.keyboard-hint{display:none}.play-tools,.play-mode .play-tools{top:175px;left:14px;right:14px;bottom:auto;gap:5px;flex-wrap:nowrap;justify-content:center}.play-tools button,.play-tools select{font-size:12px;min-height:33px;padding:5px 7px}.play-tools .play-drag-hint{display:none}
  .shot-panel{top:auto;bottom:12px}.keyboard-help{display:none}.play-mode .topbar{top:18px}.topbar{top:18px}.brand{font-size:19px}.brand-symbol{width:33px;height:33px}.topright{gap:10px}.live{display:none}
}
@media(max-height:620px) and (min-width:651px){.mode-switch{top:13px}.mode-tab{min-height:35px;padding:6px 18px}.camera-nav{top:76px}.play-status{top:89px}.shot-panel{top:80px}.play-status>span.keyboard-hint{font-size:11px;margin-top:0}.settings{top:112px}}
