.maia-cabinet{--panel:#33263a;--panel-hi:#43334b;--ink:#f1ebe3;--ink-dim:#b8a9bd;--amber:#ffb84a;--orange:#ff7a2f;--red:#ff3b30;--focus:#fff;box-sizing:border-box;background:radial-gradient(ellipse at 50% 0, color-mix(in oklab, var(--foreground) 7%, var(--background)), var(--background) 70%);flex:1 0 auto;justify-content:center;padding:2rem 1.5rem;display:flex}.maia{box-sizing:border-box;width:min(100%,54rem);height:max-content;color:var(--ink);background:repeating-linear-gradient(90deg, #ffffff05 0 1px, transparent 1px 3px), linear-gradient(180deg, var(--panel-hi), var(--panel) 40%);border-radius:5px;align-content:start;gap:1rem;margin-block:auto;padding:1rem 1.25rem 1.25rem;font-family:Helvetica Neue,Arial Narrow,Arial,sans-serif;display:grid;position:relative;box-shadow:inset 0 1px #ffffff1f,inset 0 -2px #00000073,0 24px 50px #0009}.maia-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem 1.5rem;display:flex}.maia-name{text-transform:uppercase;letter-spacing:.32em;margin:0;font:300 1.6rem/1 Helvetica Neue,Arial,sans-serif}.maia-name span{color:var(--amber);font-weight:700}.maia-tagline{color:var(--ink-dim);text-transform:uppercase;letter-spacing:.24em;margin:.3rem 0 0;font-size:.62rem}.maia-transport{align-items:center;gap:.75rem;display:flex}.maia-status{color:var(--ink-dim);margin:-.25rem 0 0;font-size:.72rem}.maia-display{background:linear-gradient(#0b080d,#151018);border-radius:4px;gap:.45rem;padding:.85rem 1rem .6rem;display:grid;box-shadow:inset 0 3px 8px #000,0 0 0 3px #1c1520,0 1px 0 3px #ffffff14}.maia-bands{gap:.4rem;height:8.5rem;display:flex}.maia-band{background:linear-gradient(#000000c7, #000000c7), linear-gradient(0deg, var(--amber) 0 74%, var(--orange) 74% 92%, var(--red) 92%);isolation:isolate;flex:1;height:100%;position:relative;overflow:hidden;-webkit-mask:repeating-linear-gradient(0deg,#000 0 5px,#0000 5px 7px);mask:repeating-linear-gradient(0deg,#000 0 5px,#0000 5px 7px)}.maia-band-level{mix-blend-mode:color-dodge;background:#bebebe;position:absolute;bottom:0;left:0;right:0}.maia-band-scale{gap:.4rem;display:flex}.maia-band-scale span{color:var(--ink-dim);text-align:center;white-space:nowrap;flex:1;font:600 .55rem/1 ui-monospace,SF Mono,Menlo,monospace}.maia-row{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1.25rem 1.75rem;display:flex}.maia-section{align-content:start;gap:.8rem;min-width:0;margin:0;display:grid}.maia-legend{color:var(--ink-dim);text-transform:uppercase;letter-spacing:.22em;border-bottom:1px solid color-mix(in oklab, var(--ink) 30%, transparent);margin:0;padding-bottom:.35rem;font:700 .6rem/1 Arial Narrow,Arial,sans-serif}.maia-group{flex-wrap:wrap;align-items:flex-end;gap:.9rem 1rem;display:flex}.maia-label{color:var(--ink);text-transform:uppercase;letter-spacing:.16em;white-space:nowrap;font:700 .6rem/1 Arial Narrow,Arial,sans-serif}.maia-knob{--knob-size:2.9rem;justify-items:center;gap:.95rem;padding-top:.9rem;display:inline-grid;position:relative}.maia-knob-control{width:var(--knob-size);aspect-ratio:1;touch-action:none;cursor:ns-resize;position:relative}.maia-knob-thumb{pointer-events:none;background:radial-gradient(circle at 32% 28%, #ffffffbf, transparent 50%), repeating-conic-gradient(from 0deg, #ece4d2 0 5deg, #d1c7b1 5deg 10deg);border-radius:50%;position:absolute;inset:13%;box-shadow:0 6px 8px #0000008c,inset 0 -3px 4px #0003,0 0 0 3px #1c1520,0 0 0 4px #ffffff14}.maia-knob-thumb:after{content:"";background:#2a1f2e;border-radius:2px;width:3px;height:32%;position:absolute;top:8%;left:50%;translate:-50%}.maia-knob-control[data-dragging] .maia-knob-thumb{filter:brightness(1.06)}.maia-knob-mark{pointer-events:none;position:absolute;inset:0}.maia-knob-tick{background:var(--ink-dim);width:1px;height:5px;position:absolute;top:-1px;left:50%;translate:-50%}.maia-knob-mark[data-active] .maia-knob-tick{background:var(--amber)}.maia-knob-numeral{font-variant-numeric:tabular-nums;color:var(--ink-dim);rotate:calc(var(--knob-mark-angle) * -1);font-size:.58rem;line-height:1;position:absolute;top:-1.1rem;left:50%;translate:-50%}.maia-lamp{background:radial-gradient(circle at 35% 30%,#5a3a10,#2a1a08);border-radius:50%;width:.55rem;height:.55rem;display:block;box-shadow:inset 0 1px 2px #000,0 0 0 2px #1c1520}.maia-lamp[data-on]{background:radial-gradient(circle at 35% 30%, #fff3c4, var(--amber) 45%, #b8680a);box-shadow:0 0 0 2px #1c1520,0 0 7px 2px #ffb84a99}.maia-selector{gap:.35rem;display:flex}.maia-key{color:#2a1f2e;text-transform:uppercase;letter-spacing:.14em;cursor:pointer;background:linear-gradient(#f3ede1,#cfc5b2);border:0;border-radius:3px;align-items:center;gap:.45rem;padding:.5rem .7rem;font:700 .62rem/1 Arial Narrow,Arial,sans-serif;display:inline-flex;box-shadow:0 0 0 2px #1c1520,0 3px 4px #00000080,inset 0 1px #fff}.maia-key[aria-pressed=true]{background:linear-gradient(#cfc5b2,#e6dece);transform:translateY(1px);box-shadow:0 0 0 2px #1c1520,0 1px 1px #00000080,inset 0 2px 3px #0000002e}.maia-key:disabled{cursor:default;opacity:.55}.maia-key:focus-visible,.maia-piano-key:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.maia-knob-thumb:has(:focus-visible){outline:2px solid var(--focus);outline-offset:2px}.maia-piano{background:#0d0a0e;border-radius:4px;width:100%;height:6.5rem;padding-top:4px;display:block;position:relative;box-shadow:0 0 0 3px #4a3a52,0 8px 14px #00000080}.maia-piano-key{border:0;position:absolute;top:4px}.maia-piano-key[data-color=white]{background:linear-gradient(#fffdf6,#e6dfcc);border:1px solid #1a1613;border-radius:0 0 3px 3px;height:calc(100% - 4px);box-shadow:inset 0 -5px 4px #00000024}.maia-piano-key[data-color=black]{z-index:1;background:linear-gradient(#2e2a2f,#050405);border-radius:0 0 3px 3px;height:60%;box-shadow:0 3px 4px #0009,inset 0 -3px 2px #ffffff1f}.maia-piano-key[data-active]{filter:brightness(.82)sepia(.5)}@media (prefers-reduced-motion:no-preference){.maia-key{transition:transform 80ms linear,box-shadow 80ms linear}}@media (width<=47.99rem){.maia-cabinet{padding-inline:.5rem}.maia-bands{gap:.2rem}}
