/* EVOLVE Build 016 — watch-and-tune workbench. Loaded after feature styles. */
:root{--workbench-height:56dvh}
.workbench-mobile-toolbar,.workbench-drawer-head{display:none}
@media(min-width:821px){
 #panel-studio .viewport-deck{position:sticky;top:8px;z-index:8;padding:5px 0 8px;background:linear-gradient(180deg,#09121df6 87%,#09121d00)}
 #panel-studio .viewport-deck .canvas-shell canvas{height:clamp(340px,49svh,600px)}
 #panel-studio .studio{grid-template-columns:minmax(0,1fr) minmax(265px,310px)}
 #panel-studio .side{min-width:0}
}
@media(max-width:820px){
 body{overflow-x:clip}
 #panel-studio .studio{display:block;position:relative}
 #panel-studio .workspace{min-width:0}
 #panel-studio .viewport-deck{position:sticky;top:0;z-index:45;border:1px solid #2d5367;border-radius:0 0 16px 16px;padding:7px 7px 4px;margin:0 -4px 12px;background:#0b1722f8;backdrop-filter:blur(12px);box-shadow:0 15px 25px #0008}
 #panel-studio .viewport-deck .canvas-shell{border-radius:10px}
 #panel-studio .viewport-deck .canvas-shell canvas{height:clamp(248px,48svh,470px);min-height:0}
 #panel-studio .viewport-deck .toolstrip{flex-wrap:nowrap;white-space:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;gap:6px;margin:0 0 8px;padding:3px 0 7px}
 #panel-studio .viewport-deck .toolstrip button{flex:0 0 auto;min-height:40px}
 #panel-studio .viewport-deck .toolstrip .separator{flex:0 0 1px}
 #panel-studio .viewport-deck .stats{display:flex;gap:5px;overflow-x:auto;margin-top:6px}
 #panel-studio .viewport-deck .stat{padding:4px 9px;flex:1;min-width:0;text-align:center}
 #panel-studio .viewport-deck .stat b{font-size:13px}
 #panel-studio .viewport-deck .stat span{font-size:8px;white-space:nowrap}
 #panel-studio .viewport-deck #status{font-size:10px;margin:4px 2px 2px;padding:2px 0;max-height:31px;overflow:hidden}
 .workbench-mobile-toolbar{display:flex;flex-direction:column;gap:7px;padding:8px 1px 2px}
 .workbench-quick{display:grid;grid-template-columns:1fr 1fr;gap:8px}
 .workbench-quick label{display:grid;grid-template-columns:auto 1fr auto;gap:5px;align-items:center;min-width:0;font:10px var(--mono);color:#b7dce2}
 .workbench-quick label input{min-width:0;width:100%;accent-color:var(--cyan);touch-action:pan-y}
 .workbench-quick output{min-width:34px;color:var(--cyan);text-align:right}
 .workbench-launchers{display:flex;flex-wrap:nowrap;gap:6px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;padding:0 0 5px;scroll-snap-type:x proximity}
 .workbench-launchers button{flex:0 0 auto;scroll-snap-align:start;min-width:70px;border:1px solid #3a596e;border-radius:7px;background:#193449;color:#daeef0;font:10px var(--mono);min-height:38px;padding:3px 1px;white-space:nowrap}
 .workbench-launchers button[aria-expanded=true]{background:var(--cyan);border-color:var(--cyan);color:#07191e;font-weight:700}
 .workbench-launchers button:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
 html.workbench-open #panel-studio .viewport-deck .canvas-shell canvas{height:clamp(200px,36svh,335px)}
 #panel-studio .side{display:block;grid-template-columns:unset;position:fixed;z-index:65;bottom:0;left:0;right:0;height:var(--workbench-height);min-height:210px;max-height:76dvh;padding:0 max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));margin:0;background:#0e1b2a;border:1px solid #426b78;border-bottom:0;border-radius:16px 16px 0 0;box-shadow:0 -25px 80px #000e;overflow-y:auto;overscroll-behavior:contain;transform:translateY(105%);visibility:hidden;pointer-events:none;transition:transform .2s ease,visibility .2s;scrollbar-width:thin}
 html.workbench-open #panel-studio .side{transform:translateY(0);visibility:visible;pointer-events:auto}
 .workbench-drawer-head{display:flex;position:sticky;z-index:3;top:0;align-items:center;justify-content:space-between;gap:10px;background:#0e1b2afa;border-bottom:1px solid #355668;padding:11px 1px 9px;margin-bottom:9px;backdrop-filter:blur(12px)}
 .workbench-drawer-head>strong{font-size:14px;letter-spacing:-.02em}
 .workbench-drawer-head button{background:#213e4e;border:1px solid #426577;border-radius:8px;min-height:38px;min-width:75px;color:#e6f9f8;font:11px var(--mono)}
 #workbench-handle{display:block;width:40px;height:7px;background:#577f91;border-radius:9px;touch-action:none;cursor:ns-resize;align-self:center;flex:none}
 #panel-studio .side>.panel{display:none!important}
 html.workbench-open #panel-studio .side>.panel.workbench-active{display:block!important}
 html.workbench-open #panel-studio .side>.panel.workbench-active input[type=range]{touch-action:pan-y}
 html.workbench-open #panel-studio .side>.panel.workbench-active .range{min-height:35px}
 html.workbench-open #panel-studio .side>.panel.workbench-active button{min-height:38px}
 #panel-studio .side>.panel{margin:0 0 8px;padding:14px}
 #panel-studio .side .form-row select{max-width:55%}
 #panel-studio .side .actions button{min-height:40px}
 #panel-studio .canvas-bottom{bottom:7px;left:7px;right:7px}
 #panel-studio .canvas-top{top:7px;left:7px;right:7px}
 #panel-studio .canvas-top .floating{font-size:9px;padding:4px 6px}
 #panel-studio .canvas-bottom>span{font-size:9px}
}
@media(max-width:410px){
 .workbench-launchers button{font-size:10px;min-height:40px}
 #panel-studio .viewport-deck .canvas-shell canvas{height:clamp(220px,43svh,400px)}
 html.workbench-open #panel-studio .viewport-deck .canvas-shell canvas{height:clamp(185px,32svh,300px)}
 #panel-studio .viewport-deck .stats .stat{padding:4px 3px}
 #panel-studio .viewport-deck .stat span{font-size:7px}
}
@media(prefers-reduced-motion:reduce){
 #panel-studio .side{transition:none}
}
