:root{--bg-color: #1a1a1a;--surface-color: #222;--surface-header: #2a2a2a;--surface-active: #333;--text-color: #b0b0b0;--text-heading: #ffffff;--text-muted: #666;--border-color: #000;--border-active: #333;--accent-color: #3dffab;--accent-secondary: #ff4444;--panel-bg: #1c1511;--bezel-color: #111;--inner-shadow: inset 0 2px 4px rgba(0,0,0,.5);--outer-shadow: 0 4px 8px rgba(0,0,0,.4);--ch-lead: #00ff88;--ch-alto: #bb88ff;--ch-harmonic: #00ccff;--ch-bass: #ff8c00;--ch-rhythm: #cc0000;--ch-vocal: #ff00ff;--master-label-color: #c0c0c0}body.light-theme{--bg-color: #d8d8d8;--surface-color: #e8e8e8;--surface-header: #dddddd;--surface-active: #f5f5f5;--text-color: #444444;--text-heading: #000000;--text-muted: #777777;--border-color: #bbbbbb;--border-active: #aaaaaa;--accent-color: #008f5d;--accent-secondary: #c02b2b;--panel-bg: #e5e0d8;--bezel-color: #ccc;--inner-shadow: inset 0 1px 2px rgba(0,0,0,.1);--outer-shadow: 0 4px 8px rgba(0,0,0,.05);--ch-lead: #00d26a;--ch-alto: #9b59b6;--ch-harmonic: #00a3cc;--ch-bass: #e67e00;--ch-rhythm: #c00000;--ch-vocal: #d100d1;--master-label-color: #444444}html,body{height:100%;margin:0;padding:0;box-sizing:border-box;overflow:hidden}*,*:before,*:after{box-sizing:border-box}body{font-family:Google Sans,sans-serif;font-size:16px;background:var(--bg-color);color:var(--text-color);transition:background-color .3s ease,color .3s ease;display:grid;grid-template-areas:"left header right" "left main right" "left timeline right";grid-template-rows:57px minmax(0,1fr) 80px;grid-template-columns:50px 1fr 290px}top-toolbar,left-sidebar,right-sidebar,bottom-timeline{background:var(--surface-color);box-shadow:var(--outer-shadow)}body.dragging{cursor:ns-resize}body.dragging *{-webkit-user-select:none;user-select:none;pointer-events:none}top-toolbar{grid-area:header;z-index:10;border-bottom:1px solid var(--border-color);padding-top:4px;padding-bottom:4px;box-sizing:border-box}left-sidebar{grid-area:left;z-index:5;border-right:1px solid var(--border-color)}right-sidebar{grid-area:right;z-index:5;border-left:1px solid var(--border-color)}bottom-timeline{grid-area:timeline;z-index:10;background:var(--bg-color)}dj-preset-dialog,vocal-dialog{position:fixed;top:0;right:0;bottom:0;left:0;z-index:999999}prompt-dj-midi{grid-area:main;width:100%;height:100%;z-index:1}toast-message{z-index:9999}@media(max-width:600px){body{grid-template-columns:40px 1fr 192px;grid-template-rows:45px minmax(0,1fr) 70px}}