:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#edf2f7;font-synthesis:none;text-rendering:optimizelegibility;background:#0b0d12;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}button,select,input{font:inherit}a{color:inherit}.app-shell{background:radial-gradient(circle at 15% 0,#39d6c42e,#0000 34%),linear-gradient(135deg,#0b0d12 0%,#15141a 48%,#0d1412 100%);grid-template-rows:auto minmax(0,1fr) auto;gap:14px;min-height:100vh;padding:16px;display:grid}.topbar,.footer{width:min(1440px,100%);margin:0 auto}.topbar{justify-content:space-between;align-items:center;gap:16px;display:flex}.brand{align-items:center;gap:12px;min-width:0;display:flex}.brand-mark{color:#9bf6ff;background:#08111fb3;border:1px solid #8bd6ff6b;border-radius:8px;place-items:center;width:42px;height:42px;display:grid}.brand h1{margin:0;font-size:1.12rem;line-height:1.1}.brand span{color:#b9c5cf;font-size:.88rem}.top-actions,.transport,.preset-tabs,.footer{align-items:center;gap:8px;display:flex}.top-actions a,button,.footer a{color:#edf2f7;background:#ffffff12;border:1px solid #edf2f724;border-radius:8px;justify-content:center;align-items:center;gap:8px;min-height:38px;text-decoration:none;display:inline-flex}.top-actions a,button{padding:0 12px}button{cursor:pointer}button:hover,.top-actions a:hover,.footer a:hover{background:#9bf6ff1f;border-color:#9bf6ffb3}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline-offset:2px;outline:3px solid #ffcf5a}button:disabled{cursor:wait;opacity:.7}.primary-button{color:#08111f;background:linear-gradient(90deg,#9bf6ff,#ffcf5a);border-color:#0000;flex:1;font-weight:800}.workspace{grid-template-columns:minmax(0,1fr) minmax(300px,360px);gap:16px;width:min(1440px,100%);min-height:0;margin:0 auto;display:grid}.viewport{background-color:#08111f;background-image:linear-gradient(#ffffff08 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px),none;background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:28px 28px;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;border:1px solid #edf2f71f;border-radius:8px;min-height:520px;position:relative;overflow:hidden}.viewport canvas{width:100%;height:100%;min-height:520px;display:block}.viewport-hud{pointer-events:none;gap:8px;display:flex;position:absolute;top:12px;left:12px}.viewport-hud span{color:#edf2f7;text-align:center;text-transform:uppercase;background:#08111fb8;border:1px solid #edf2f71f;border-radius:8px;min-width:58px;padding:7px 10px;font-size:.78rem}.control-panel{background:#0c0e14e0;border:1px solid #edf2f71f;border-radius:8px;flex-direction:column;gap:14px;min-width:0;padding:14px;display:flex}.transport button:not(.primary-button){width:42px;padding:0}.preset-tabs{background:#ffffff0f;border-radius:8px;padding:4px}.preset-tabs button{color:#b9c5cf;background:0 0;border-color:#0000;flex:1;min-width:0}.preset-tabs button.active{color:#08111f;background:#8bd677}.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.metric{background:#ffffff0e;border:1px solid #edf2f71f;border-radius:8px;flex-direction:column;justify-content:space-between;gap:8px;min-height:76px;padding:12px;display:flex}.metric span{color:#b9c5cf;align-items:center;gap:6px;font-size:.78rem;display:inline-flex}.metric strong{overflow-wrap:anywhere;font-size:1.2rem}.sliders{flex-direction:column;gap:13px;display:flex}.sliders h2{align-items:center;gap:8px;margin:2px 0 0;font-size:.94rem;display:flex}.range-control,.select-control{gap:7px;display:grid}.range-control span,.select-control span{color:#ced8e0;justify-content:space-between;align-items:center;gap:12px;font-size:.84rem;display:flex}.range-control output{color:#ffcf5a;font-variant-numeric:tabular-nums}input[type=range]{accent-color:#39d6c4;width:100%}select{color:#edf2f7;background:#16191f;border:1px solid #edf2f724;border-radius:8px;width:100%;min-height:38px;padding:0 10px}.footer{color:#b9c5cf;flex-wrap:wrap;font-size:.78rem}.footer span,.footer a{border-radius:8px;min-height:30px;padding:0 9px}.footer span{background:#ffffff0b;border:1px solid #edf2f71a;align-items:center;display:inline-flex}@media (width<=980px){.workspace{grid-template-columns:1fr}.viewport,.viewport canvas{min-height:58vh}}@media (width<=620px){.app-shell{padding:10px}.topbar{flex-direction:column;align-items:stretch}.top-actions a{flex:1}.brand h1{font-size:1rem}.viewport,.viewport canvas{min-height:48vh}.control-panel{padding:10px}.metric-grid{grid-template-columns:1fr 1fr}}