:root{color-scheme:dark;--bg:#090f1b;--panel:#14243a;--line:#35546c;--text:#edf8ff;--muted:#9ebccd;--mint:#9bf0e8;font:14px/1.6 Inter,system-ui,'Segoe UI',sans-serif}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 85% -6%,#264362,var(--bg) 52%);color:var(--text)}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.4;cursor:not-allowed}a{color:#9debe5}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--mint);outline-offset:3px}.bar{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;border-bottom:1px solid #31536e;background:#0c1929;padding:19px max(24px,calc((100vw - 1600px)/2))}.brand{color:#f3fcff;font-weight:850;font-size:20px;letter-spacing:.08em;text-decoration:none}.brand span{font-weight:500;color:#aacbda;font-size:11px}.bar nav{display:flex;gap:15px;flex-wrap:wrap}.bar nav a{font:750 10px ui-monospace,monospace;letter-spacing:.07em;text-decoration:none}.state{color:#a4d6dc;font:750 10px ui-monospace,monospace}.state i{display:inline-block;width:7px;height:7px;background:#9ef0cc;border-radius:50%;box-shadow:0 0 12px #85f5d6;margin-right:8px}main{max-width:1550px;padding:0 22px;margin:auto}.eyebrow,.section-title span{font:750 10px ui-monospace,monospace;letter-spacing:.15em;color:#97dce5}.hero{padding:52px 6px 34px;border-bottom:1px solid #344e64}.hero h1{font-size:clamp(43px,6.4vw,94px);line-height:1.02;letter-spacing:-.082em;margin:19px 0}.hero h1 em{font-style:normal;color:transparent;background:linear-gradient(110deg,#9cf3ea,#baa2ff);background-clip:text;-webkit-background-clip:text}.hero p{max-width:810px;font-size:15px;color:#b5c9d8}.tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:25px}.tags span{font:700 9px ui-monospace,monospace;border:1px solid #487484;border-radius:4px;background:#152a3b;color:#a4dce2;padding:8px}.section-title{display:flex;align-items:end;justify-content:space-between;gap:15px;flex-wrap:wrap;margin:35px 0 18px}.section-title h2{font-size:clamp(28px,3.5vw,46px);letter-spacing:-.065em;margin:6px 0}.play-controls{display:flex;gap:9px;flex-wrap:wrap}.primary,.secondary{border-radius:7px;padding:12px 15px;font:850 10px ui-monospace,monospace;letter-spacing:.06em}.primary{border:0;background:linear-gradient(110deg,#9df1ea,#a8d9f5);color:#08232d}.secondary{background:#18344a;color:#b9e6eb;border:1px solid #5d889c}.board{border:1px solid #416278;border-radius:12px;background:linear-gradient(130deg,#172c43,#0e1d30);padding:22px}.transport{display:flex;gap:11px;align-items:end;flex-wrap:wrap}.transport label,.control-row label,.voice-panel label{font:750 10px ui-monospace,monospace;color:#b2d5df;letter-spacing:.09em}.transport :is(input,select),.control-row select,.voice-panel input{display:block;margin-top:7px;background:#081829;border:1px solid #456b81;border-radius:6px;color:white;padding:10px;min-width:0}.transport #songname{width:200px}.transport #bpm{width:80px}.transport button{margin-bottom:1px}.sequencer{margin-top:23px;overflow-x:auto;border:1px solid #34576d;border-radius:9px;background:#0c192a}.seq-head{display:flex;justify-content:space-between;gap:13px;padding:13px 15px;border-bottom:1px solid #385a6f;color:#a0d9e0;font:700 10px ui-monospace,monospace}.grid{min-width:660px;padding:11px}.track-row{display:grid;grid-template-columns:122px repeat(16,minmax(25px,1fr));gap:5px;margin:7px 0;align-items:center}.track-row strong{font-size:11px;color:#b1cfdf}.step{border:1px solid #385367;border-radius:4px;min-height:33px;background:#18263a;color:#c8e7f3;padding:0;font-size:8px}.step:nth-child(4n+2){border-left-color:#9fe9d2}.step.on{background:linear-gradient(125deg,#61cbbf,#98e0f3);color:#0c2931;box-shadow:0 0 12px #70d9cc30;border-color:#91eee1}.step.current{outline:2px solid #edcfa3;outline-offset:0}.control-row{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:23px}.control-row label{display:flex;align-items:center;gap:8px}.control-row input{accent-color:#9befdd}#message{font-size:12px;color:#b5d2dc;flex:1;min-width:210px}.split{display:grid;grid-template-columns:1fr 1fr;gap:25px}.soundgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.sound{min-height:90px;text-align:left;border:1px solid #44657c;border-radius:9px;background:linear-gradient(140deg,#1b344a,#111e31);padding:14px;color:#e8f9ff}.sound.active{background:#214e59;border-color:#9feedd}.sound strong,.sound small{display:block}.sound strong{font-size:17px}.sound small{color:#9db9ca}.sound-controls{display:flex;gap:9px;flex-wrap:wrap;margin-top:13px}.muted{color:#aac4d0;font-size:12px}.sfx{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.sfx article{padding:14px;border:1px solid #375a70;background:#14283e;border-radius:8px;min-width:0}.sfx strong{display:block;font-size:13px;margin-bottom:7px}.sfx audio{width:100%;height:36px}.sfx a{font:750 10px ui-monospace,monospace}.roles-section{margin-top:40px}.label{font:700 10px ui-monospace,monospace;color:#e1c5a9}.roles{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.role{min-height:115px;padding:18px;border:1px solid #3b5e74;border-radius:9px;background:linear-gradient(125deg,#1b3147,#121f33)}.role small{font:700 10px ui-monospace,monospace;color:#9fdde2}.role strong{display:block;margin-top:18px}.role p{font-size:11px;color:#a9c4d2}.disclosure{margin-top:18px;border-left:3px solid #eac194;padding:17px;background:#23273a;color:#d0c6d1;font-size:12px}.voice-panel{display:flex;align-items:end;gap:10px;flex-wrap:wrap;margin-top:19px}.voice-panel label{flex:1;min-width:220px}.voice-panel input{width:100%}footer{display:flex;gap:16px;justify-content:space-between;flex-wrap:wrap;border-top:1px solid #385570;padding:25px 0;margin-top:55px;color:#8caab9;font:750 10px ui-monospace,monospace}@media(max-width:950px){.split{grid-template-columns:1fr}.roles{grid-template-columns:repeat(3,1fr)}}@media(max-width:650px){main{padding:0 13px}.bar{padding:14px}.hero{padding-top:32px}.roles,.soundgrid{grid-template-columns:repeat(2,1fr)}.sfx{grid-template-columns:1fr}.transport #songname{width:160px}.board{padding:12px}.transport label{font-size:9px}}@media(max-width:410px){.roles{grid-template-columns:1fr}.section-title h2{font-size:29px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
