/* Critical modal visibility fix */
[hidden],
.consent-backdrop[hidden],
.consent-backdrop.is-hidden {
  display: none !important;
}

:root{color-scheme:dark;--bg:#070913;--panel:rgba(18,24,50,.78);--panel2:rgba(25,34,72,.94);--text:#f8fbff;--muted:#a8b3cf;--line:rgba(255,255,255,.13);--accent:#39ffe2;--pink:#ff3df2;--warn:#ffe760;--danger:#ff5a7a;--good:#78ff87;--shadow:0 22px 90px rgba(0,0,0,.45);--radius:24px;--pulse:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}html{background:var(--bg);scroll-behavior:smooth}body{min-height:100vh;margin:0;color:var(--text);background:radial-gradient(circle at 50% 0%,rgba(57,255,226,calc(.12 + var(--pulse)*.22)),transparent 34rem),radial-gradient(circle at 0 20%,rgba(255,61,242,.13),transparent 28rem),linear-gradient(180deg,#0d1022 0%,#070913 100%);padding:calc(16px + env(safe-area-inset-top)) 14px calc(28px + env(safe-area-inset-bottom))}button,input,select{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}a{color:var(--accent)}.skip-link{position:fixed;top:8px;left:8px;translate:0 -140%;background:var(--text);color:#041019;padding:10px 12px;border-radius:12px;z-index:99}.skip-link:focus{translate:0}.topbar,.app-shell,.footer{width:min(1180px,100%);margin-inline:auto}.topbar{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:16px}.top-actions,.transport,.button-row,.consent-actions{display:flex;gap:10px;flex-wrap:wrap}h1,h2,h3,p{margin-top:0}h1{margin-bottom:0;font-size:clamp(1.4rem,7vw,3.4rem);letter-spacing:-.06em}h2{letter-spacing:-.04em;margin-bottom:.4rem}.eyebrow{margin-bottom:.35rem;color:var(--accent);font-weight:850;letter-spacing:.12em;text-transform:uppercase;font-size:.72rem}.app-shell{display:grid;gap:14px}.panel{border:1px solid var(--line);background:linear-gradient(180deg,var(--panel),rgba(12,16,34,.82));backdrop-filter:blur(20px);box-shadow:var(--shadow);border-radius:var(--radius)}.hero{display:grid;gap:18px;padding:20px;overflow:hidden;position:relative}.hero p,.tool-card p,.small-copy{color:var(--muted);line-height:1.55}.display{display:grid;gap:8px;align-content:center;min-height:112px;border-radius:20px;padding:18px;background:rgba(0,0,0,.22);border:1px solid var(--line)}.display span,.display small{color:var(--muted)}.display strong{font-size:clamp(2rem,12vw,4.4rem);letter-spacing:-.08em}.transport{padding:12px;position:sticky;top:8px;z-index:10}button,.file-label,.import-label,select{border:0;border-radius:999px;min-height:48px;padding:0 16px;color:var(--text);background:rgba(255,255,255,.08);border:1px solid var(--line);display:inline-grid;place-items:center;text-decoration:none}.primary-transport{flex:1 1 160px;background:linear-gradient(135deg,var(--accent),#2e6dff);color:#041019;font-weight:900}.primary-btn{background:linear-gradient(135deg,var(--accent),#2e6dff);color:#041019;font-weight:850}.secondary-btn{background:rgba(57,255,226,.12);border-color:rgba(57,255,226,.32)}.ghost-btn{background:rgba(255,255,255,.055)}.danger-btn{background:rgba(255,90,122,.14);border-color:rgba(255,90,122,.44)}.control-grid{display:grid;gap:12px;padding:16px}.control-grid label{display:grid;gap:8px}.control-grid span{color:var(--muted);display:flex;justify-content:space-between}.control-grid strong{color:var(--text)}input[type=range]{width:100%;accent-color:var(--accent)}select{width:100%;background:#141a36}.scenes-section,.fx-section,.pads-section,.sequencer-section{padding:16px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}.scenes-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.scene-btn{min-height:76px;border-radius:18px;justify-items:start;align-content:center}.scene-btn[aria-current=true]{border-color:rgba(57,255,226,.9);box-shadow:0 0 0 1px rgba(57,255,226,.3),0 16px 55px rgba(57,255,226,.1)}.scene-btn small{color:var(--muted)}.fx-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.fx-btn{min-height:86px;border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.04)),#151a34}.fx-btn.is-active{background:linear-gradient(135deg,var(--pink),#2e6dff)}.pads-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.pad{min-height:130px;justify-items:start;align-content:space-between;border-radius:22px;padding:14px;background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.04)),#151a34;position:relative;overflow:hidden}.pad:after{content:"";position:absolute;inset:auto -20% -35% 10%;height:90px;background:radial-gradient(circle,var(--pad-glow,rgba(57,255,226,.2)),transparent 68%)}.pad[aria-pressed=true]{border-color:rgba(57,255,226,.8);box-shadow:0 0 0 1px rgba(57,255,226,.28),0 18px 60px rgba(57,255,226,.08)}.pad strong{display:block;font-size:clamp(1rem,4vw,1.35rem);letter-spacing:-.03em}.pad small,.pad__index{color:var(--muted)}.pad__state{font-size:.72rem;font-weight:900;letter-spacing:.12em;color:var(--accent)}.pad--pink{--pad-glow:rgba(255,61,242,.34)}.pad--blue{--pad-glow:rgba(46,109,255,.36)}.pad--violet{--pad-glow:rgba(151,96,255,.34)}.pad--yellow{--pad-glow:rgba(255,231,96,.34)}.pad--green{--pad-glow:rgba(120,255,135,.34)}.pad--orange{--pad-glow:rgba(255,154,77,.34)}.pad--cyan{--pad-glow:rgba(57,255,226,.34)}.pad--white{--pad-glow:rgba(255,255,255,.28)}.pad--red{--pad-glow:rgba(255,90,122,.34)}.pad--lime{--pad-glow:rgba(170,255,80,.34)}.sequencer-scroll{overflow-x:auto;padding-bottom:8px;scrollbar-color:var(--accent) transparent}.seq-row{display:grid;grid-template-columns:112px repeat(16,minmax(34px,1fr));gap:6px;min-width:720px;align-items:center;margin-bottom:6px}.seq-row--header{color:var(--muted);font-size:.72rem;text-align:center;text-transform:uppercase;letter-spacing:.08em}.seq-track{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.seq-step{min-height:34px;border-radius:10px;padding:0;background:rgba(255,255,255,.055)}.seq-step[aria-pressed=true]{background:linear-gradient(135deg,var(--accent),var(--pink));box-shadow:0 0 18px rgba(57,255,226,.2)}.seq-step.is-current{outline:2px solid var(--warn);outline-offset:2px}.utility-grid{display:grid;gap:14px}.tool-card{padding:16px}.arrangement{display:grid;gap:8px}.arr-slot{display:grid;grid-template-columns:54px 1fr;gap:8px;align-items:center;color:var(--muted)}.arr-slot select{min-height:42px}.file-label input,.import-label input{display:none}.mini-list{display:grid;gap:8px;margin-top:12px;color:var(--muted)}.mini-list span,.mini-list a{border:1px solid var(--line);border-radius:999px;padding:8px 10px;background:rgba(255,255,255,.05)}.settings-panel{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:30;display:grid;justify-items:end;opacity:1;pointer-events:auto}.settings-panel[aria-hidden=true]{opacity:0;pointer-events:none}.settings-panel__inner{width:min(440px,100%);height:100%;border-radius:28px 0 0 28px;padding:max(18px,env(safe-area-inset-top)) 18px max(18px,env(safe-area-inset-bottom));overflow:auto}.consent-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.62);z-index:40;display:grid;place-items:end center;padding:14px}.consent-dialog{width:min(680px,100%);padding:18px;max-height:min(760px,92vh);overflow:auto;position:relative}.consent-close{position:absolute;top:14px;right:14px;min-height:38px;width:38px;padding:0;font-size:1.35rem;line-height:1}.consent-row{display:grid;grid-template-columns:auto 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--line)}.consent-row span{display:grid;gap:4px}.consent-row small{color:var(--muted)}.toast{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));transform:translate(-50%,140%);background:#f8fbff;color:#07101f;border-radius:999px;padding:12px 16px;box-shadow:var(--shadow);z-index:60;transition:transform .18s ease;max-width:min(420px,calc(100% - 24px));text-align:center}.toast.is-visible{transform:translate(-50%,0)}.footer{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;padding:28px 0 6px;color:var(--muted)}hr{border:0;border-top:1px solid var(--line);margin:18px 0}code{color:var(--warn)}@media (min-width:720px){body{padding-inline:24px}.hero{grid-template-columns:1fr minmax(260px,.42fr);padding:26px}.control-grid{grid-template-columns:repeat(4,1fr)}.scenes-grid{grid-template-columns:repeat(6,1fr)}.fx-grid{grid-template-columns:repeat(4,1fr)}.pads-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.utility-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.consent-backdrop{place-items:center}}@media (min-width:1024px){.app-shell{grid-template-columns:1.05fr .95fr}.hero,.transport,.control-grid,.sequencer-section,.utility-grid{grid-column:1/-1}.pads-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.pad{min-height:150px}.fx-section{align-self:start}}@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;scroll-behavior:auto!important;transition-duration:.001ms!important}}


/* Mobile overflow guard */
html, body { max-width: 100%; overflow-x: hidden; }