.recording-app{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:radial-gradient(at 80% 0,#19284e,#0000 40%),#080c17;min-height:100vh}.recording-workspace{max-width:1440px;margin:auto;padding:24px}.recording-header{justify-content:space-between;align-items:center;gap:24px;margin-bottom:20px;display:flex}.recording-header h1{margin:8px 0;font-size:clamp(28px,4vw,46px);line-height:1.1}.recording-app input,.recording-app select{font:inherit;color:#f3f7ff;background:#121b2d;border:1px solid #53617f;border-radius:8px;min-width:0;max-width:100%;padding:8px}.recording-app input[type=range]{accent-color:#5cdef5;width:100%;padding:0}.recording-app input[type=checkbox]{width:auto}.recording-app button{color:#eaf3ff;cursor:pointer;background:#18243a;border:1px solid #4a5e7d;border-radius:8px;min-height:44px;padding:10px 14px;font:600 14px/1.3 system-ui}.recording-app button:disabled{opacity:.45;cursor:not-allowed}.recording-app button[aria-pressed=true]{background:#553672;border-color:#d090ff}.recording-app .play-button{background:#164d5f;border-color:#5cdef5}.recording-app .record-button{background:#632839;border-color:#f28caa}.recording-app label{color:#c7d4e7;flex-direction:column;gap:6px;font-size:14px;display:flex}.recording-app label.check{flex-direction:row;align-items:center}.recording-transport{z-index:15;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background:#0e1526f5;border:1px solid #3b4d70;border-radius:16px;padding:16px;position:sticky;top:0}.transport-buttons,.transport-settings,.recording-actions,.beat-heading{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.transport-settings{gap:18px;margin-top:14px}.transport-settings input[type=number]{width:84px}.time-display{color:#72e9ff;margin-left:auto;font:700 24px monospace}.playhead-label{margin-top:14px}.recording-status{color:#73ddef;background:#132336;border-radius:10px;min-height:48px;padding:12px 16px}.recording-note{color:#a6b7cf;line-height:1.55;font-size:14px!important}.recording-columns{grid-template-columns:minmax(0,1fr) 320px;align-items:start;gap:18px;display:grid}.recording-panel{background:linear-gradient(145deg,#131d31,#0d1424);border:1px solid #344560;border-radius:16px;min-width:0;margin-bottom:18px;padding:20px}.recording-panel h2{margin:0 0 16px;font-size:23px;line-height:1.2}.recording-panel h3{font-size:18px}.recording-actions{margin:14px 0}.file-button{border:1px solid #4a5e7d;border-radius:8px;padding:10px 12px}.file-button input{max-width:240px;font-size:14px}.timeline{padding:12px 0}.track-row{text-align:left;grid-template-columns:170px minmax(0,1fr);align-items:center;gap:10px;width:100%;margin-bottom:8px;padding:12px!important;display:grid!important}.track-row.selected{background:#19334c;border-color:#6bd9ed}.track-title{overflow-wrap:anywhere;min-width:0}.track-title small{color:#afc2d9;margin-top:5px;font-size:12px;display:block}.track-lane{background:repeating-linear-gradient(90deg,#ffffff10 0 1px,#0000 1px 25%);border-radius:6px;height:58px;display:block;position:relative;overflow:hidden}.audio-region{opacity:.85;border-radius:4px;justify-content:space-around;align-items:center;gap:1px;min-width:2px;display:flex;position:absolute;top:4px;bottom:4px}.audio-region i{background:#e6fbff80;width:2px;display:block}.lane-playhead{background:#fff;width:2px;position:absolute;top:0;bottom:0}.region-controls{grid-template-columns:1fr 1fr;gap:15px;display:grid}.empty-tracks{text-align:center;color:#a8bdd6;border:1px dashed #4b627f;border-radius:12px;padding:35px 15px}.channel-strip label{margin:12px 0}.channel-strip output{float:right;color:#70dcea}.channel-strip ol{padding-left:20px;font-size:14px}.listen-back{border:1px solid #4b537a;border-radius:12px;margin:20px 0;padding:14px}.listen-back audio{width:100%;margin:12px 0;display:block}.drum-pads{grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0;display:grid}.recording-app .drum-pad{touch-action:manipulation;background:linear-gradient(135deg,#1b3d54,#171d31);border:1px solid #4c9fb3;min-height:90px;padding:22px 10px;font-size:18px;box-shadow:inset 0 -5px #0005}.recording-app .drum-pad:active{background:#225a72;transform:translateY(2px)}.drum-pad small{color:#b4d7e5;margin-top:6px;font-size:12px;display:block}.recording-app .pad-0{background:linear-gradient(135deg,#59325f,#201a35);border-color:#d489f7}.beat-heading{justify-content:space-between}.beat-heading input[type=number]{width:90px}.sequencer-scroll{max-width:100%;margin:14px 0;padding:8px 0;overflow-x:auto}.sequencer{align-items:center;gap:3px;width:max-content;font-size:12px;display:grid}.sequence-row{display:contents}.recording-app .sequencer button{background:#1a2a40;border:1px solid #3a4f67;border-radius:4px;width:28px;height:28px;min-height:28px;padding:0}.recording-app .sequencer button.on{background:#52d4da;border-color:#b2ffff}.sequencer .bar-line{border-left:2px solid #ce94f3!important}.recording-app .sequencer .piano-key{text-align:left;color:#101a26;background:#d5e4ef;width:110px;padding:0 10px}.piano-roll button.on{background:#c485e6!important}.recording-app details{border-top:1px solid #3b4c66;margin-top:22px;padding-top:15px}.recording-app summary{cursor:pointer;color:#89dcf1}:is(.recording-app button:focus-visible,.recording-app a:focus-visible,.recording-app input:focus-visible,.recording-app select:focus-visible){outline-offset:3px;outline:3px solid #64e5f2}.recording-app a{color:#6cdbf1}.recording-app p{overflow-wrap:anywhere}@media (max-width:1000px){.recording-columns{grid-template-columns:1fr}.channel-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 20px;display:grid}.channel-strip h2,.channel-strip h3,.channel-strip p,.channel-strip ol,.channel-strip .recording-actions{grid-column:1/-1}}@media (max-width:620px){.recording-workspace{padding:14px}.recording-header{flex-direction:column;align-items:stretch}.recording-transport{position:relative}.recording-panel{padding:15px}.transport-buttons button{flex:1;min-width:85px}.track-row{grid-template-columns:1fr!important}.track-lane{height:50px}.drum-pads{grid-template-columns:repeat(2,1fr)}.channel-strip{display:block}.region-controls{grid-template-columns:1fr}.time-display{margin-left:0}.recording-actions>*{max-width:100%}}