/* OFFICE AFTER HOURS — all interface chrome stays outside the playing room. */
.oh-page{--oh-ink:#eee4ce;--oh-muted:#a9b8b6;--oh-line:#ffffff20;box-sizing:border-box;background:#121f27;color:var(--oh-ink);height:100svh;min-height:540px;max-width:none;width:100%;display:flex;flex-direction:column;overflow:hidden;font-family:Arial,"PingFang SC","Microsoft YaHei",sans-serif;padding:0 max(0px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(0px,env(safe-area-inset-left))}
.oh-page *, .oh-page *:before,.oh-page *:after{box-sizing:border-box}.oh-page button,.oh-page input{font:inherit}.oh-page button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}.oh-page a{color:inherit;text-decoration:none}.oh-page button:focus-visible,.oh-page a:focus-visible{outline:2px solid #eec788;outline-offset:3px}.oh-page button:disabled{opacity:.38;cursor:default}.oh-nav{height:52px;min-height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 22px;border-bottom:1px solid var(--oh-line);font-size:12px;letter-spacing:.04em}.oh-nav>a{display:flex;min-width:64px;height:44px;align-items:center}.oh-nav>span{font-size:11px;color:#b7bcb4;letter-spacing:.13em}.oh-nav b{color:var(--oh-ink);margin-left:9px;font-weight:500}.oh-button{border:1px solid var(--oh-line);border-radius:7px;background:#243239;color:var(--oh-ink);cursor:pointer;min-height:44px;padding:10px 16px;line-height:1.3;font-size:13px;letter-spacing:.015em}.oh-button:hover:not(:disabled){background:#34433f}.oh-help{padding:0;width:38px;min-height:34px;background:none;border-radius:50%;font-family:Georgia,serif;font-size:18px}.oh-stage{min-height:210px;flex:1;position:relative;isolation:isolate;overflow:hidden}.oh-stage canvas{width:100%;height:100%;display:block;touch-action:manipulation}.oh-heading{position:absolute;top:22px;left:26px;right:26px;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none;z-index:2}.oh-eyebrow{font-size:10px;letter-spacing:.16em;font-weight:500;color:var(--oh-muted);margin:0 0 9px}.oh-heading h1{margin:0;font-size:clamp(19px,2.1vw,30px);line-height:1.4;font-weight:500;letter-spacing:.025em}.oh-tempo{pointer-events:auto;background:#17262a99;font-size:22px;font-variant-numeric:tabular-nums;font-family:Georgia,serif;line-height:1;padding:9px 11px;min-width:56px;border-color:#dfc79140}.oh-tempo small{display:block;font-size:9px;font-family:monospace;letter-spacing:.1em;margin-top:6px}.oh-hotspots{position:absolute;inset:0;pointer-events:none;z-index:3}.oh-object{position:absolute;transform:translate(-50%,-50%);border:0;background:none;color:#ded7c3;pointer-events:auto;display:flex;align-items:center;justify-content:center;flex-direction:column;min-width:64px;height:62px;padding:4px;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none}.oh-dot{display:flex;align-items:center;justify-content:center;font-family:monospace;font-size:17px;height:27px;width:27px;border:1px solid #dfd5b660;border-radius:50%;background:#142327b3;box-shadow:0 2px 8px #0003;color:#d0d7c6}.oh-object.is-on .oh-dot{background:#e6c590;color:#263839;border-color:#f5e3c4;font-size:11px;box-shadow:0 0 14px #d9ae5930}.oh-object.pending .oh-dot{outline:1px dashed #eee4ce;outline-offset:4px}.oh-object-name{font-size:10px;white-space:nowrap;margin-top:4px;letter-spacing:.02em;text-shadow:0 1px 4px #081115,0 1px 6px #081115;opacity:.85}.oh-object.selected .oh-object-name{color:#fff3d3;opacity:1}.oh-object:disabled{pointer-events:none;opacity:0}.oh-scene-footer{position:absolute;bottom:9px;left:26px;right:26px;display:flex;justify-content:space-between;pointer-events:none;color:#aab9b4;font:10px monospace;letter-spacing:.09em}.oh-deck{position:relative;flex:none;z-index:5;border-top:1px solid #ffffff1c;background:#19282d;padding:15px 24px 10px;box-shadow:0 -15px 45px #0d181d66}.oh-mix-status{display:flex;align-items:center;justify-content:space-between;margin:0 auto 10px;max-width:900px;gap:10px;font-size:11px;color:#b1bbb3;min-height:28px}.oh-mix-status b{font:22px Georgia,serif;color:#f0dfb9}.oh-mix-status i{margin-left:15px;letter-spacing:4px;font-style:normal;color:#d1b789;font-size:10px}.oh-selected-name{display:flex;align-items:center;gap:9px}.oh-inline{min-height:30px;font-size:11px;padding:4px 8px;background:none;border-color:#ffffff22}.oh-transport{display:flex;max-width:900px;margin:auto;gap:8px;align-items:stretch}.oh-primary{background:#dec49c;color:#18282b;border-color:#e9d3b3;font-weight:600}.oh-primary:hover:not(:disabled){background:#f0dabb}.oh-transport>.oh-primary{flex:1.25}.oh-drop{flex:1;background:#314743;border-color:#70897b70}.oh-play{width:47px;min-width:47px;padding:10px;font-size:17px;border-radius:50%;background:none}.oh-undo{width:44px;min-width:44px;padding:8px;font-size:22px;background:none}.oh-instruction{text-align:center;font-size:11px;color:#a2afaa;margin:11px 0 0;min-height:16px}.oh-notice{font-size:11px;color:#c1bcaa;text-align:center;margin:0;padding:0 16px;background:#19282d;min-height:20px;max-height:35px;line-height:1.4}.oh-panel{position:absolute;z-index:6;bottom:34px;left:50%;transform:translateX(-50%);width:min(calc(100% - 32px),480px);padding:11px 14px 14px;background:#1e3137f5;border:1px solid #80938260;box-shadow:0 15px 30px #0005;border-radius:11px}.oh-panel>div:first-child{display:flex;align-items:center;justify-content:space-between;font-size:12px}.oh-close{padding:0;min-height:34px;width:34px;font-size:23px;border:0;background:none}.oh-patterns{display:flex;gap:6px;margin:6px 0 10px}.oh-patterns button{flex:1;font-size:12px;min-height:44px;padding:7px 4px;background:transparent}.oh-patterns .chosen{border-color:#d6bd89;background:#d6bd8917;color:#ffe2ad}.oh-panel small{font-size:10px;color:#b6bcb1}.oh-drop-caption{pointer-events:none;position:absolute;left:0;right:0;top:52%;text-align:center;color:#f4dba9;font-size:clamp(26px,4vw,42px);font-weight:600;text-shadow:0 2px 20px #071316;letter-spacing:.1em}.oh-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;background:#121f27;z-index:7;font-size:12px;color:#d4d0ba}.oh-loading[hidden]{display:none}.oh-loading span{width:7px;height:7px;border-radius:50%;background:#dabc85;animation:oh-light 1.2s ease-in-out infinite}@keyframes oh-light{50%{opacity:.25}}.oh-result-heading{max-width:900px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px}.oh-result-heading h2{font-size:20px;margin:3px 0 7px;font-weight:500;line-height:1.3;overflow-wrap:anywhere}.oh-result-heading .oh-eyebrow{font-size:9px}.oh-result-heading p{margin:0;color:#a5b5af;font-size:11px}.oh-sections{display:flex;max-width:900px;margin:14px auto 10px;gap:4px}.oh-sections span{flex:1;border-top:2px solid #ffffff16;padding-top:5px;font-size:9px;color:#8a9f9c}.oh-sections .active{border-color:#dec18c;color:#ebd7aa}.oh-result-actions{display:flex;max-width:900px;gap:8px;margin:auto}.oh-result-actions button{flex:1;font-size:12px;padding:9px 7px}.oh-result-more{display:flex;max-width:900px;margin:4px auto 0;align-items:center;justify-content:center;gap:16px}.oh-result-more button,.oh-result-more a{border:0;background:none;padding:8px 0;min-height:32px;font-size:11px;color:#c4c3b0}.oh-title-input{width:100%;font:inherit;padding:12px;border:1px solid #6c827970;border-radius:5px;margin:10px 0 18px}.oh-export-preview{width:100%;max-height:60svh;background:#121f27;object-fit:contain;border-radius:8px}.oh-preview-note{font-size:13px;color:#707b74}
@media(min-width:850px){.oh-page{max-height:1080px}.oh-heading{left:36px;top:28px}.oh-deck{padding-top:13px}.oh-stage canvas{max-width:1500px;margin:auto}.oh-nav{padding:0 34px}.oh-instruction{margin-top:9px}.oh-object-name{font-size:11px}.oh-scene-footer{left:36px;right:36px}.oh-result-heading h2{font-size:23px}}
@media(max-width:480px){.oh-nav{padding:0 15px;height:47px;min-height:47px}.oh-nav>span{font-size:9px;letter-spacing:.10em}.oh-nav b{margin-left:6px}.oh-heading{left:17px;right:17px;top:16px}.oh-heading h1{font-size:18px;line-height:1.45}.oh-heading .oh-eyebrow{font-size:8px;margin-bottom:6px}.oh-deck{padding:10px 14px 7px}.oh-selected-name{gap:5px;font-size:10px}.oh-mix-status{margin-bottom:6px}.oh-mix-status i{margin-left:7px;letter-spacing:2px}.oh-transport{gap:6px}.oh-transport .oh-button{font-size:12px;padding:10px 7px}.oh-transport .oh-play{font-size:16px;min-width:43px;width:43px}.oh-transport .oh-undo{font-size:20px;min-width:36px;width:36px}.oh-object-name{font-size:9px}.oh-object{min-width:57px}.oh-scene-footer{left:17px;right:17px;bottom:7px}.oh-result-heading h2{font-size:18px}.oh-result-actions{gap:5px}.oh-result-actions button{font-size:11px}.oh-notice{font-size:10px}.oh-result-more{gap:20px}}
@media(max-height:650px){.oh-page{min-height:460px}.oh-heading h1{font-size:15px}.oh-heading{top:10px}.oh-deck{padding-top:7px}.oh-instruction{margin:6px 0 0}.oh-nav{height:42px;min-height:42px}.oh-result-heading .oh-eyebrow{display:none}.oh-result-heading h2{font-size:16px}.oh-sections{margin-top:8px}.oh-result-more{margin:0}.oh-object-name{font-size:9px}}
@media(prefers-reduced-motion:reduce){.oh-loading span{animation:none}}
.oh-object .oh-dot{height:24px;width:24px;font-size:15px}.oh-page.is-playing .oh-object:not(.selected) .oh-object-name{opacity:.52}.oh-page.is-playing .oh-object:not(.selected):not(.is-on) .oh-dot{background:#14232770;border-color:#dfd5b63d}.oh-object:hover .oh-object-name{opacity:1!important}
.oh-page.is-playing .oh-object .oh-dot{width:15px;height:15px;font-size:11px;box-shadow:0 0 9px #d9ae5920}.oh-page.is-playing .oh-object.selected .oh-dot{width:20px;height:20px}
/* Live set: the room leads; menus stay below it. */
.oh-page.is-playing .oh-heading h1{font-size:13px;line-height:1.25;opacity:.48}.oh-page.is-playing .oh-heading h1 br{display:none}.oh-page.is-playing .oh-heading .oh-eyebrow{opacity:.5}.oh-page.is-playing .oh-object:not(.selected):not(.guide) .oh-object-name{opacity:0}.oh-object.guide .oh-dot{outline:2px solid #f2d8a3;outline-offset:5px;box-shadow:0 0 24px #e2b87960}.oh-object.guide .oh-object-name{color:#fff0c9;opacity:1!important}.oh-secondary{max-width:900px;margin:5px auto -2px;display:flex;justify-content:space-between}.oh-secondary button{border:0;min-height:32px;padding:5px 0;color:#b8c2b6}.oh-recording{flex:1.25;background:#633f38;border-color:#c9826d;font-size:12px;font-variant-numeric:tabular-nums;color:#ffead4}.oh-patterns button small{display:block;font:9px monospace;margin-top:6px}.oh-take-strip{max-width:900px;margin:10px auto;color:#b9bcaa;font-size:10px;border-top:1px solid #ffffff25;padding-top:8px}.oh-challenge-bar,.oh-challenge-result{max-width:900px;margin:0 auto 7px;font-size:11px;color:#dfc799;display:flex;align-items:center;justify-content:space-between}.oh-secret-result{max-width:900px;margin:6px auto 10px;font-size:11px;color:#ddc590}.oh-instruction{margin-top:5px}.oh-notice{min-height:28px}.oh-transport .oh-play,.oh-transport .oh-undo{min-width:44px;width:44px}.oh-stage .oh-tempo:disabled{opacity:.5}.oh-page .oh-patterns button:disabled{opacity:.4}
@media(max-width:360px){.oh-deck{padding-left:10px;padding-right:10px}.oh-mix-status i{display:none}.oh-selected-name{gap:4px}.oh-transport{gap:4px}.oh-transport .oh-button{font-size:11px}.oh-transport .oh-play{font-size:16px}.oh-transport .oh-undo{font-size:20px}.oh-selected-name .oh-inline{font-size:10px}.oh-instruction{font-size:10px}.oh-result-more{gap:14px}.oh-result-actions button{font-size:10px}}
@media(max-height:650px){.oh-secondary{margin-top:1px}.oh-instruction{margin-top:2px}.oh-heading h1{font-size:12px}.oh-object{height:48px;min-width:48px}.oh-object-name{font-size:8px}}