@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&display=swap";.sidebar-container{--sidebar-rail-width: 62px;--sidebar-panel-width: clamp(400px, 31vw, 468px);position:fixed;top:0;left:0;bottom:0;z-index:120;display:flex;pointer-events:none;isolation:isolate}.sidebar-rail{width:var(--sidebar-rail-width);height:100%;display:flex;flex-direction:column;align-items:center;padding:18px 8px;gap:8px;background:linear-gradient(180deg,#0b1019fa,#070b12fa);border-right:0;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:12px 0 32px #02060a38;pointer-events:auto;z-index:2}.sidebar-rail__btn{width:46px;height:46px;display:flex;align-items:center;justify-content:center;gap:6px;border-radius:12px;background:transparent;border:0;color:#e1ecf78f;cursor:pointer;transition:transform .1s ease,color .1s ease,background .1s ease,box-shadow .1s ease;position:relative;font-size:.66rem;letter-spacing:.02em}.sidebar-rail__btn:before{content:"";position:absolute;left:-8px;width:3px;height:18px;border-radius:999px;background:transparent;opacity:0;transition:opacity .1s ease,background .1s ease}.sidebar-rail__label{display:none;line-height:1}.sidebar-rail__btn:hover{transform:translateY(-1px);background:#f4f1e80f;color:#f4faffdb;box-shadow:none}.sidebar-rail__btn:focus-visible{outline:0;background:#f4f1e814;color:#ffcbb0fa}.sidebar-rail__btn:focus-visible:before{background:#ff7a3db8;opacity:1}.sidebar-container--disabled .sidebar-rail{background:linear-gradient(180deg,#0b1019c7,#070c13db)}.sidebar-container--disabled .sidebar-rail__btn,.sidebar-rail__btn:disabled{cursor:default;opacity:.36}.sidebar-container--disabled .sidebar-rail__btn:hover,.sidebar-rail__btn:disabled:hover{transform:none;background:transparent;color:#e1ecf794}.sidebar-rail__btn--active{background:#f4f1e814;color:#ffcbb0fa;box-shadow:none}.sidebar-rail__btn--active:before{background:#ff7a3df2;opacity:1}.sidebar-rail__btn--active:hover{background:#f4f1e81a}.sidebar-rail__btn--playing{color:#ffbca0f5}.sidebar-rail__pulse{position:absolute;top:4px;right:4px;width:6px;height:6px;border-radius:50%;background:#ff6b35;animation:railPulse 1.5s ease-in-out infinite}@keyframes railPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}.sidebar-panel{width:var(--sidebar-panel-width);height:100%;background:linear-gradient(180deg,#0c111bfb,#080c14fc);border-right:0;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:18px 0 44px #02060a3d;display:flex;flex-direction:column;transform:translate(-100%);opacity:0;transition:transform .1s cubic-bezier(.4,0,.2,1),opacity .1s ease;pointer-events:none;z-index:1}.sidebar-panel--open{transform:translate(0);opacity:1;pointer-events:auto}.sidebar-panel__header{padding:22px 22px 16px;border-bottom:0;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:12px}.sidebar-panel__heading-group{min-width:0;display:flex;flex-direction:column;gap:4px}.sidebar-panel__title{font-size:.88rem;font-weight:500;letter-spacing:.03em;text-transform:none;color:#f5faffe0;margin:0}.sidebar-panel__subtitle{margin:0;font-size:.72rem;color:#c4d4e594;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-panel__close{display:none;align-items:center;justify-content:center;width:44px;height:44px;border-radius:10px;border:0;background:#ffffff0d;color:#f4faffd1;font-size:1.1rem;line-height:1;transition:background-color .1s ease,border-color .1s ease,color .1s ease}.sidebar-panel__close:hover{background:#ff84542e;color:#ffd7be}.sidebar-panel__content{flex:1;overflow-y:auto;padding:14px 22px 24px}.sound-tab{display:flex;flex-direction:column;gap:12px}.sound-tab__surface{display:flex;flex-direction:column;gap:18px;padding:0;background:transparent;border:0;box-shadow:none}.voice-tab{display:flex;flex-direction:column;gap:18px}.voice-tab__section{display:flex;flex-direction:column;gap:8px}.voice-tab__label,.voice-tab__heading{margin:0;color:#c4d4e59e;font-size:.68rem;font-weight:500;letter-spacing:.02em}.voice-tab__label-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.voice-tab__label-actions{display:inline-flex;align-items:center;gap:8px}.voice-tab__dice{width:30px;height:30px;border-radius:8px;border:1px solid rgba(168,153,132,.2);background:#3c3836c7;color:#ebdbb2c7;display:inline-flex;align-items:center;justify-content:center;transition:background .1s ease,border-color .1s ease,color .1s ease}.voice-tab__dice:hover:not(:disabled),.voice-tab__dice:focus-visible:not(:disabled){background:#d799212e;border-color:#d799215c;color:#ebdbb2f5}.voice-tab__dice:disabled{opacity:.48;cursor:wait}.voice-tab__typing{color:#c4d4e575;font-size:.58rem;letter-spacing:.06em;text-transform:uppercase}.voice-tab__typing--on{color:#ffd296e6}.voice-tab__input{width:100%;min-height:118px;resize:vertical;border-radius:8px;border:1px solid rgba(255,255,255,.11);background:#ffffff09;color:#f5faffe6;padding:11px 12px;font:inherit;font-size:.78rem;line-height:1.45;letter-spacing:0}.voice-tab__input::-moz-placeholder{color:#c4d4e559}.voice-tab__input::placeholder{color:#c4d4e559}.voice-tab__input:focus-visible{outline:2px solid rgba(255,136,91,.45);outline-offset:1px}.voice-tab__preset-row,.voice-tab__chunks{display:flex;flex-wrap:wrap;gap:6px}.voice-tab__preset,.voice-tab__chunk{min-height:32px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:#ffffff09;color:#e2edf8c7;font-size:.61rem;letter-spacing:.01em}.voice-tab__preset{padding:0 10px;cursor:pointer;transition:background-color .1s ease,border-color .1s ease,color .1s ease,transform .1s ease}.voice-tab__preset:hover{transform:translateY(-1px);background:#ff7e4d1c;border-color:#ff936847;color:#ffe7d8f2}.voice-tab__statebar{min-height:38px;display:flex;align-items:center;gap:8px;color:#e2edf8c7;font-size:.66rem;letter-spacing:.02em}.voice-tab__state-dot{width:7px;height:7px;border-radius:50%;background:#bed0e261}.voice-tab__state-dot--on{background:#ff824df2;box-shadow:0 0 14px #ff764857}.voice-tab__state-count{margin-left:auto;color:#bed0e27a;font-size:.58rem;letter-spacing:.06em;text-transform:uppercase}.voice-tab__toolbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.voice-tab__toggle,.voice-tab__ghost{min-height:42px;border-radius:8px;padding:0 12px;font-size:.68rem;letter-spacing:.01em;transition:background-color .1s ease,border-color .1s ease,color .1s ease,transform .1s ease;border:1px solid rgba(255,255,255,.1);background:#ffffff09;color:#dce9f6b8}.voice-tab__toggle--on{border-color:#ffa1776b;background:#ff7e4d29;color:#ffe7d8f5}.voice-tab__ghost:hover:not(:disabled),.voice-tab__toggle:hover:not(:disabled){background:#ffffff0f;color:#f4faffe6}.voice-tab__toggle:disabled,.voice-tab__ghost:disabled{opacity:.42;cursor:not-allowed}.voice-tab__chunk{display:inline-flex;align-items:center;gap:6px;padding:0 10px 0 7px}.voice-tab__chunk-index{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:#ffffff14;color:#c4d4e5b3;font-size:.54rem;font-variant-numeric:tabular-nums}.voice-tab__chunk--active{border-color:#ffa58194;background:#ff7e4d29;color:#ffe8dafa}.voice-tab__chunk--next:not(.voice-tab__chunk--active){border-color:#fff3;color:#f4faffe6}.voice-tab__empty,.voice-tab__error{margin:0;font-size:.66rem;line-height:1.35}.voice-tab__empty{color:#bed0e280}.voice-tab__error{color:#ffbca0f0}.sidebar-backdrop{position:fixed;inset:0;left:calc(var(--sidebar-rail-width) + var(--sidebar-panel-width));background:transparent;pointer-events:auto;z-index:0}.midi-tab{display:flex;flex-direction:column;gap:22px}.midi-tab__section{display:flex;flex-direction:column;gap:10px}.midi-tab__section+.midi-tab__section{padding-top:2px}.midi-tab__heading{font-size:.66rem;font-weight:500;letter-spacing:.03em;text-transform:none;color:#c4d4e5a3;margin:0}.midi-tab__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}.midi-tab__search{width:100%;min-height:44px;border-radius:8px;border:0;background:#f4f1e80f;color:#f5faffe0;padding:10px 12px;font-size:.64rem;letter-spacing:.02em}.midi-tab__search::-moz-placeholder{color:#c4d4e573}.midi-tab__search::placeholder{color:#c4d4e573}.midi-tab__search:focus-visible{outline:2px solid rgba(255,136,91,.45);outline-offset:1px}.midi-tab__item{margin:0}.midi-tab__file-btn{width:100%;min-height:52px;padding:10px 12px 10px 14px;border-radius:8px;background:transparent;border:0;text-align:left;cursor:pointer;transition:transform .1s ease,background-color .1s ease,color .1s ease;display:flex;flex-direction:column;gap:3px;position:relative;overflow:hidden}.midi-tab__file-btn:before{content:"";position:absolute;top:12px;bottom:12px;left:0;width:2px;border-radius:999px;background:transparent;opacity:0;transition:opacity .1s ease,background .1s ease}.midi-tab__file-btn:hover{transform:none;background:#f4f1e80e}.midi-tab__file-btn:focus-visible{outline:0;background:#f4f1e811}.midi-tab__file-btn:focus-visible:before{background:#ff7a3db8;opacity:1}.midi-tab__file-btn--active{background:#ff7a3d1f;box-shadow:none}.midi-tab__file-btn--active:before{background:#ff7a3dd9;opacity:1}.midi-tab__file-btn:disabled{opacity:.4;cursor:not-allowed}.midi-tab__file-name{font-size:.72rem;font-weight:500;color:#f4faffed;line-height:1.3}.midi-tab__file-composer{font-size:.58rem;color:#c4d4e585;letter-spacing:.03em;text-transform:none}.midi-tab__upload-btn{display:block;width:100%;min-height:44px;padding:10px 12px;border-radius:8px;background:#f4f1e80a;border:0;color:#d6e2f09e;font-size:.64rem;font-weight:400;letter-spacing:.03em;text-transform:none;text-align:center;cursor:pointer;transition:all .1s ease}.midi-tab__upload-btn:hover{background:#ff7e4d1c;color:#f4faffe6}.midi-tab__upload-btn:focus-visible{outline:0;background:#ff7e4d1f;color:#f4faffe6}.midi-tab__upload-btn--loading{opacity:.5;cursor:wait}.midi-tab__error{padding:8px;border-radius:4px;background:#ff7a3d1a;border-left:2px solid rgba(255,122,61,.5);color:#f4f1e8f2;font-size:.68rem}.midi-tab__empty{font-size:.66rem;color:#bed0e28f;text-align:center;padding:8px 6px}.midi-player{display:flex;flex-direction:column;gap:10px;padding:14px;border-radius:10px;background:#f4f1e80d;border:0;box-shadow:none}.midi-player__progress{height:5px;background:#ffffff14;border-radius:999px;overflow:hidden}.midi-player__progress-bar{height:100%;background:linear-gradient(90deg,#ffb794f2,#ff7a4aeb);transition:width .1s linear}.midi-player__time{display:flex;justify-content:space-between;font-size:.6rem;color:#fff6;font-variant-numeric:tabular-nums}.midi-player__controls{display:flex;justify-content:center;gap:8px}.midi-player__btn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:9px;background:#ffffff0e;border:0;color:#e5f0fcbd;transition:all .1s ease}.midi-player__btn:hover:not(:disabled){background:#ff6b3526}.midi-player__btn:focus-visible{outline:0;background:#ff6b352b;color:#ffdcc6f2}.midi-player__btn:disabled{opacity:.2;cursor:not-allowed}.midi-player__btn--play{background:#ff7a3d33;color:#ffd0b5}.midi-player__btn--play:hover:not(:disabled){background:#ff6b354d}.midi-player__info{display:flex;flex-direction:column;gap:2px;padding-top:6px;border-top:0}.midi-player__title{font-size:.69rem;color:#f5faffe6;line-height:1.25}.midi-player__meta{font-size:.58rem;color:#fff6;text-transform:none;letter-spacing:.03em}.midi-player__tempo{display:flex;flex-direction:column;gap:4px;padding-top:8px;border-top:0}.midi-player__tempo-label{display:flex;justify-content:space-between;align-items:center;font-size:.6rem;color:#ffffff80;text-transform:none;letter-spacing:.03em}.midi-player__tempo-value{font-variant-numeric:tabular-nums;color:#ff6b35e6}.midi-player__tempo-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:5px;background:#ffffff14;border-radius:999px;outline:none;cursor:pointer}.midi-player__tempo-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;background:#ff6b35e6;border-radius:50%;cursor:pointer;-webkit-transition:transform .1s ease;transition:transform .1s ease}.midi-player__tempo-slider::-webkit-slider-thumb:hover{transform:scale(1.15)}.midi-player__tempo-slider::-moz-range-thumb{width:16px;height:16px;background:#ff6b35e6;border:none;border-radius:50%;cursor:pointer}.samples-tab{display:flex;flex-direction:column;gap:20px}.samples-tab__section{display:flex;flex-direction:column;gap:8px}.samples-tab__heading{font-size:.6rem;font-weight:400;letter-spacing:.03em;text-transform:none;color:#fff6;margin:0}.samples-tab__import-btns{display:flex;gap:6px}.samples-tab__import-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:10px;border-radius:6px;background:#ff6b3514;border:1px solid rgba(255,107,53,.15);color:#fffc;font-size:.65rem;font-weight:400;letter-spacing:.05em;cursor:pointer;transition:all .1s ease}.samples-tab__import-btn:hover{background:#ff6b3526;border-color:#ff6b3540}.samples-tab__import-btn--secondary{flex:.5;background:transparent;border:1px dashed rgba(255,255,255,.1);color:#ffffff80}.samples-tab__import-btn--secondary:hover{background:#ffffff0a;border-color:#fff3;color:#ffffffb3}.samples-tab__import-btn--loading{opacity:.5;cursor:wait}.samples-tab__error{padding:8px;border-radius:4px;background:#ff7a3d1a;border-left:2px solid rgba(255,122,61,.5);color:#f4f1e8f2;font-size:.68rem}.samples-tab__stats{font-size:.6rem;color:#ffffff59;text-align:center;padding:4px 0}.samples-tab__starter-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.samples-tab__starter-controls{display:flex;flex-direction:column;gap:8px}.samples-tab__starter-families{display:flex;flex-wrap:wrap;gap:6px}.samples-tab__starter-family-btn{min-height:32px;padding:0 8px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:#ffffff08;color:#d1e0f1c7;font-size:.5rem;letter-spacing:.07em;text-transform:uppercase}.samples-tab__starter-family-btn--active{border-color:#ff9e7457;background:#ff7e4d24;color:#ffe2cdf0}.samples-tab__starter-btn{display:flex;flex-direction:column;align-items:flex-start;gap:3px;width:100%;min-height:52px;padding:8px;border-radius:8px;border:1px solid rgba(255,255,255,.1);background:#ffffff08;color:#f0f7ffdb;text-align:left;transition:border-color .1s ease,background-color .1s ease,transform .1s ease}.samples-tab__starter-btn:hover{border-color:#ff966d59;background:#ff824d1c;transform:translateY(-1px)}.samples-tab__starter-btn--active{border-color:#ffa5817a;background:linear-gradient(180deg,#ff926538,#ff6a3824)}.samples-tab__starter-name{font-size:.63rem;font-weight:500;line-height:1.2}.samples-tab__starter-family{font-size:.52rem;letter-spacing:.07em;text-transform:uppercase;color:#bed1e4b8}.samples-tab__starter-empty{font-size:.62rem;color:#bed0e299;text-align:center;padding:8px 4px}.samples-tab__loading,.samples-tab__empty{font-size:.7rem;color:#fff6;text-align:center;padding:20px 10px}.samples-tab__categories{display:flex;flex-direction:column;gap:2px}.samples-tab__category{display:flex;flex-direction:column}.samples-tab__category-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px}.samples-tab__category-header{display:flex;align-items:center;gap:6px;width:100%;padding:8px 6px;border-radius:4px;background:transparent;border:none;color:#ffffffb3;cursor:pointer;transition:all .1s ease;text-align:left}.samples-tab__category-header:hover{background:#ffffff0a}.samples-tab__category-chevron{transition:transform .1s ease;flex-shrink:0;opacity:.5}.samples-tab__category-header--expanded .samples-tab__category-chevron{transform:rotate(90deg)}.samples-tab__category-name{flex:1;font-size:.7rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.samples-tab__category-count{font-size:.6rem;color:#ffffff59;padding:2px 6px;background:#ffffff0d;border-radius:10px}.samples-tab__category-delete{opacity:0;width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;padding:4px;background:transparent;border:none;color:#ff7a3dcc;cursor:pointer;border-radius:4px;transition:all .1s ease}.samples-tab__category-row:hover .samples-tab__category-delete{opacity:1}.samples-tab__category-delete:hover{background:#ff7a3d26;color:#ff7a3d}.samples-tab__list{list-style:none;margin:0;padding:0 0 0 18px;display:flex;flex-direction:column;gap:1px}.samples-tab__item{margin:0}.samples-tab__sample-btn{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:44px;padding:8px 10px;border-radius:4px;background:transparent;border:none;color:#ffffffa6;cursor:pointer;transition:all .1s ease;text-align:left}.samples-tab__sample-btn:hover{background:#ff6b3514;color:#ffffffe6}.samples-tab__sample-btn--active{background:#ff6b351f;border-left:2px solid rgba(255,107,53,.6);color:#fffffff2}.midi-tab__skeleton,.samples-tab__loading{display:flex;flex-direction:column;gap:8px}.midi-tab__skeleton-row,.samples-tab__skeleton-row{height:44px;border-radius:10px;background:linear-gradient(90deg,#f4f1e80f,#f4f1e824,#f4f1e80f);background-size:200% 100%;animation:sidebarSkeleton 1.1s ease-in-out infinite}@keyframes sidebarSkeleton{0%{background-position:200% 0}to{background-position:-200% 0}}.samples-tab__sample-name{flex:1;font-size:.68rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.samples-tab__sample-meta{font-size:.58rem;color:#ffffff59;font-variant-numeric:tabular-nums}@media (max-width: 900px){.sidebar-container{inset:auto 0 0;width:100%;flex-direction:column;justify-content:flex-end}.sidebar-rail{width:100%;height:auto;min-height:56px;flex-direction:row;justify-content:center;padding:8px max(12px,env(safe-area-inset-left,0px)) calc(8px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-right,0px));border-right:0;border-top:0;background:#0a0e17f0;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.sidebar-rail__btn{flex:1;width:auto;min-height:40px;max-width:200px;padding:8px 10px;border-radius:10px}.sidebar-rail__label{display:inline}.sidebar-rail__pulse{top:8px;right:10px}.sidebar-panel{position:fixed;right:0;bottom:calc(56px + env(safe-area-inset-bottom,0px));left:0;width:auto;height:auto;max-height:min(72vh,560px);border-right:0;border-top:0;border-radius:14px 14px 0 0;transform:translateY(calc(100% + 24px));opacity:1}.sidebar-panel--open{transform:translateY(0)}.sidebar-panel__header{padding:12px 14px}.sidebar-panel__title{font-size:.78rem;letter-spacing:.03em}.sidebar-panel__close{display:inline-flex}.sidebar-panel__content{padding:12px 14px 16px}.sidebar-backdrop{left:0;background:#05081073;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.midi-tab,.samples-tab{gap:16px}.midi-tab__section,.samples-tab__section{gap:10px}.midi-player__btn{width:36px;height:36px}.midi-tab__file-btn,.midi-tab__upload-btn{padding:12px}.samples-tab__import-btns{flex-direction:column}.samples-tab__import-btn,.samples-tab__import-btn--secondary{flex:1;width:100%;min-height:38px}.samples-tab__starter-grid{grid-template-columns:1fr}.samples-tab__sample-btn{padding:8px 10px}.samples-tab__category-delete{opacity:1}}@media (max-width: 520px){.sidebar-rail{min-height:54px;gap:6px;padding-inline:max(10px,env(safe-area-inset-left,0px))}.sidebar-rail__btn{max-width:none;min-height:38px;padding:8px;font-size:.6rem;letter-spacing:.06em}.sidebar-panel{bottom:calc(54px + env(safe-area-inset-bottom,0px));max-height:78vh}.midi-player__controls{gap:10px}}.song-study{position:relative;min-height:100vh;color:var(--color-text-primary)}.song-study__backdrop{position:fixed;inset:0;pointer-events:none;background:#1d2021}.song-study__backdrop:after{content:"";position:absolute;inset:0;background:#3c383638;opacity:1}.song-study__shell{position:relative;z-index:1;width:var(--max-shell-width);margin:0 auto;padding:var(--space-xl) var(--space-lg) var(--space-2xl);display:flex;flex-direction:column;gap:16px}.song-study__nav{display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap}.song-study__nav-link{min-height:24px;padding:0;color:var(--color-text-secondary);text-decoration:none;display:inline-flex;align-items:center;justify-content:center;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid transparent;transition:color .12s ease,border-color .12s ease}.song-study__nav-link:hover,.song-study__nav-link:focus-visible{color:var(--color-text-primary);border-color:#d799216b;outline:none}.song-study__masthead,.song-study__transport,.song-study__readouts,.song-study__stage,.song-study__error{animation:study-fade-up .62s cubic-bezier(.2,.8,.2,1) both}.song-study__transport{animation-delay:90ms}.song-study__readouts{animation-delay:.16s}.song-study__stage,.song-study__error{animation-delay:.22s}.song-study__masthead{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:18px}.song-study__title-group{min-width:0;display:flex;flex-direction:column;gap:6px}.song-study__eyebrow,.song-study__metric span,.song-study__status{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--color-text-secondary)}.song-study__title-group h1{--song-study-title-min: 1.55rem;margin:0;max-width:100%;font-size:clamp(2.2rem,5.4vw,4.8rem);line-height:.94;letter-spacing:.05em;white-space:nowrap}.song-study__status{display:inline-flex;align-items:center;gap:10px;white-space:nowrap}.song-study__status-dot{width:10px;height:10px;border-radius:999px;background:#ffa470b3;box-shadow:0 0 0 6px #ffa47014}.song-study__status-dot.is-ready{background:#74d2a8eb;box-shadow:0 0 0 6px #74d2a81a}.song-study__transport,.song-study__metric,.song-study__error{border:1px solid rgba(255,255,255,.12);background:#0c121cb8;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.song-study__transport{display:flex;flex-direction:column;gap:12px;padding:14px 18px;border-radius:24px}.song-study__transport-main,.song-study__tempo{display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap}.song-study__transport-row{display:grid;grid-template-columns:auto minmax(180px,1fr) auto;align-items:center;gap:16px}.song-study__action,.song-study__tempo-chip{border:0;background:transparent;color:var(--color-text-primary);cursor:pointer;border-bottom:1px solid transparent;transition:color .14s ease,border-color .14s ease,opacity .14s ease}.song-study__action{padding:0;min-height:24px;min-width:24px;display:inline-flex;align-items:center;justify-content:center}.song-study__action--primary,.song-study__tempo-chip.is-active{color:var(--color-text-primary);border-bottom-color:#d799216b}.song-study__action:hover:not(:disabled),.song-study__action:focus-visible,.song-study__tempo-chip:hover,.song-study__tempo-chip:focus-visible{border-bottom-color:#d799216b;outline:none}.song-study__action:disabled{cursor:default;opacity:.45}.song-study__action-icon{width:16px;height:16px;display:block;fill:currentColor}.song-study__progress{min-width:0;display:flex;flex-direction:column;gap:8px;position:relative}.song-study__scrubber{width:100%;margin:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:10px;border-radius:999px;background:linear-gradient(90deg,rgba(215,153,33,.88) 0,rgba(215,153,33,.88) var(--song-study-progress, 0%),rgba(255,255,255,.08) var(--song-study-progress, 0%),rgba(255,255,255,.08) 100%);cursor:pointer}.song-study__scrubber::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:999px;border:1px solid rgba(255,171,123,.52);background:#ebdbb2}.song-study__scrubber::-moz-range-thumb{width:16px;height:16px;border-radius:999px;border:1px solid rgba(255,171,123,.52);background:#ebdbb2}.song-study__scrubber:disabled{cursor:default;opacity:.45}.song-study__progress-track{width:100%;height:7px;border-radius:999px;overflow:hidden;background:#ffffff14}.song-study__progress-fill{display:block;height:100%;border-radius:inherit;background:#d79921e0}.song-study__progress-meta{display:flex;justify-content:space-between;gap:14px;font-size:.82rem;color:var(--color-text-secondary)}.song-study__seek-tools{display:flex;justify-content:center;gap:12px;align-items:center}.song-study__skip-group{display:inline-flex;gap:10px}.song-study__tempo-chip{padding:0;min-width:0;min-height:24px;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}.song-study__readouts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.song-study__metric{padding:16px 18px;border-radius:20px;display:flex;flex-direction:column;gap:8px}.song-study__metric strong{font-size:clamp(1.4rem,3vw,2.3rem);letter-spacing:.04em}.song-study__metric p{margin:0;color:var(--color-text-secondary)}.song-study__error{padding:18px;border-radius:22px;display:flex;align-items:center;justify-content:space-between;gap:16px}.song-study__error p{margin:0;color:var(--color-text-secondary)}.song-study__stage{width:100%;min-height:0}@keyframes study-fade-up{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 980px){.song-study__masthead,.song-study__transport-row{grid-template-columns:1fr;align-items:start}.song-study__status{white-space:normal}.song-study__seek-tools{justify-content:flex-start}}@media (max-width: 760px){.song-study__shell{width:100%;padding:max(12px,calc(env(safe-area-inset-top,0px) + 8px)) var(--space-sm) calc(88px + env(safe-area-inset-bottom,0px))}.song-study__readouts{grid-template-columns:1fr}.song-study__progress-meta{font-size:.76rem}.song-study__seek-tools{justify-content:flex-start}}.pipeline-page{min-height:100vh;background:#1d2021;color:var(--color-text-primary)}.pipeline-page__shell{width:var(--max-shell-width);margin:0 auto;padding:var(--space-xl) var(--space-lg) var(--space-2xl)}.pipeline-page__header{width:100%;margin-bottom:18px}.pipeline-flow{position:relative;display:flex;flex-direction:column;gap:18px}.pipeline-flow:before{content:"";position:absolute;left:23px;top:24px;bottom:24px;width:1px;background:#d799212e}.pipeline-flow--single:before{display:none}.pipeline-step{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr);gap:16px;align-items:start}.pipeline-step__marker{position:relative;z-index:1;width:48px;height:48px;border-radius:999px;border:1px solid rgba(215,153,33,.34);background:#282828fa;color:var(--color-text-secondary);display:inline-flex;align-items:center;justify-content:center;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase}.pipeline-card{padding:18px 20px;border:1px solid rgba(168,153,132,.18);background:#282828eb;border-radius:22px;display:flex;flex-direction:column;gap:14px}.pipeline-card__header{display:flex;flex-direction:column;gap:6px}.pipeline-card__split{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.pipeline-card h2{margin:0;font-size:clamp(1.3rem,2vw,1.8rem);line-height:1}.pipeline-card__header p,.pipeline-note p,.pipeline-muted,.pipeline-error,.pipeline-source{margin:0;color:var(--color-text-secondary)}.pipeline-field span,.pipeline-chip,.pipeline-tool strong,.pipeline-job__metric span,.pipeline-form__divider span{font-size:.74rem;letter-spacing:.1em;text-transform:uppercase}.pipeline-chip{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:0 10px;border-radius:999px;border:1px solid rgba(168,153,132,.18);background:#3c3836b8}.pipeline-chip.is-ready{background:#98971a29;border-color:#98971a47}.pipeline-chip.is-warning{background:#cc241d24;border-color:#cc241d3d}.pipeline-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.pipeline-field{display:flex;flex-direction:column;gap:6px}.pipeline-field--wide,.pipeline-form__divider{grid-column:1 / -1}.pipeline-field input{min-height:48px;padding:0 14px;border-radius:14px;border:1px solid rgba(168,153,132,.18);background:#1d2021f0;color:var(--color-text-primary);font:inherit}.pipeline-field input:focus-visible{outline:none;border-color:#d7992157}.pipeline-field input::-moz-placeholder{color:#ebdbb261}.pipeline-field input::placeholder{color:#ebdbb261}.pipeline-form__divider{display:flex;align-items:center;gap:12px;color:var(--color-text-tertiary)}.pipeline-form__divider:before,.pipeline-form__divider:after{content:"";height:1px;background:#a8998424;flex:1 1 auto}.pipeline-disclosure{border:1px solid rgba(168,153,132,.14);border-radius:18px;background:#1d2021bd}.pipeline-disclosure summary{list-style:none;cursor:pointer;padding:14px 16px;color:var(--color-text-primary);font-size:.84rem;letter-spacing:.04em}.pipeline-disclosure summary::-webkit-details-marker{display:none}.pipeline-disclosure__content{padding:0 16px 16px;display:flex;flex-direction:column;gap:12px}.pipeline-tool-grid,.pipeline-job{display:grid;gap:12px}.pipeline-tool-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.pipeline-tool,.pipeline-job__metric,.pipeline-note,.pipeline-source{border:1px solid rgba(168,153,132,.14);border-radius:16px;background:#1d2021f0}.pipeline-tool{min-height:44px;padding:10px 12px;display:flex;align-items:center;gap:10px}.pipeline-tool__dot{width:8px;height:8px;border-radius:999px;flex:0 0 auto}.pipeline-tool__dot.is-ready{background:#98971a}.pipeline-tool__dot.is-missing{background:#cc241d}.pipeline-note{padding:12px;display:flex;flex-direction:column;gap:8px}.pipeline-note code{padding:10px 12px;border-radius:12px;background:#3c3836eb;color:var(--color-text-primary);overflow-x:auto}.pipeline-job{grid-template-columns:repeat(3,minmax(0,1fr))}.pipeline-job__metric{padding:12px;display:flex;flex-direction:column;gap:6px}.pipeline-job__metric strong{font-size:1rem}.sparkle-spinner{width:1.05rem;height:1.05rem;color:currentColor;flex:0 0 auto}.sparkle-spinner__track,.sparkle-spinner__dash{fill:none;stroke:currentColor;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.sparkle-spinner__track{opacity:.16}.sparkle-spinner__dash{stroke-dasharray:28 72;stroke-dashoffset:2}.sparkle-spinner.is-spinning{animation:pipeline-sparkle-spin 1.3s linear infinite}.sparkle-spinner.is-spinning .sparkle-spinner__dash{animation:pipeline-sparkle-dash 1.6s ease-in-out infinite}.sparkle-spinner.is-complete .sparkle-spinner__track{opacity:.26}.sparkle-spinner.is-complete .sparkle-spinner__dash{stroke-dasharray:100 0;stroke-dashoffset:0}.pipeline-progress{padding:14px 16px 12px;border:1px solid rgba(168,153,132,.16);border-radius:18px;background:#1d2021c7;display:flex;flex-direction:column;gap:12px}.pipeline-progress.is-complete{border-color:#98971a47}.pipeline-progress.is-failed{border-color:#cc241d47}.pipeline-progress__status{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center}.pipeline-progress__sparkle{width:1.35rem;height:1.35rem;color:#d79921f5}.pipeline-progress.is-complete .pipeline-progress__sparkle{color:#98971a}.pipeline-progress.is-failed .pipeline-progress__sparkle{color:#fb4934}.pipeline-progress__copy{display:flex;flex-direction:column;gap:4px;min-width:0}.pipeline-progress__copy strong{font-size:.96rem}.pipeline-progress__copy span,.pipeline-progress__percent{color:var(--color-text-secondary);font-size:.74rem;letter-spacing:.08em;text-transform:uppercase}.pipeline-progress__percent{justify-self:end;white-space:nowrap}.pipeline-progress__rail{position:relative;height:22px}.pipeline-progress__track,.pipeline-progress__fill{position:absolute;left:0;right:0;top:50%;height:2px;transform-origin:left center}.pipeline-progress__track{background:#a8998429;transform:translateY(-50%)}.pipeline-progress__fill{background:linear-gradient(90deg,#d79921b8,#ebdbb2eb);transform:translateY(-50%) scaleX(0)}.pipeline-progress.is-complete .pipeline-progress__fill{background:linear-gradient(90deg,#98971ac7,#b8bb26f5)}.pipeline-progress.is-failed .pipeline-progress__fill{background:linear-gradient(90deg,#cc241db8,#fb4934f5)}.pipeline-progress__marker{position:absolute;top:50%;width:22px;height:22px;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center}.pipeline-progress__sparkle--marker{width:1.15rem;height:1.15rem;background:#1d2021fa}.pipeline-progress__steps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.pipeline-progress__step{height:4px;border-radius:999px;background:#a8998429}.pipeline-progress__step.is-done,.pipeline-progress__step.is-current{background:#d7992185}.pipeline-progress.is-complete .pipeline-progress__step.is-done,.pipeline-progress.is-complete .pipeline-progress__step.is-current{background:#98971ad1}.pipeline-progress.is-failed .pipeline-progress__step.is-current{background:#cc241dd1}.pipeline-source{display:block;padding:12px;word-break:break-all}.pipeline-actions{display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap}.pipeline-submit{min-height:42px;padding:0 16px;border-radius:999px;font:inherit;letter-spacing:.08em;text-transform:uppercase;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;transition:background-color .12s ease,border-color .12s ease,opacity .12s ease,transform .12s ease;border:1px solid rgba(215,153,33,.36);background:#d799212e;color:var(--color-text-primary)}.pipeline-submit:hover,.pipeline-submit:focus-visible{transform:translateY(-1px);outline:none;background:#d7992142;border-color:#d799216b}.pipeline-submit:disabled{opacity:.45}.pipeline-error{color:#fb4934}@keyframes pipeline-sparkle-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pipeline-sparkle-dash{0%{stroke-dasharray:18 82;stroke-dashoffset:6}50%{stroke-dasharray:36 64;stroke-dashoffset:28}to{stroke-dasharray:18 82;stroke-dashoffset:88}}@media (max-width: 720px){.pipeline-page__shell{width:100%;padding:max(12px,calc(env(safe-area-inset-top,0px) + 8px)) var(--space-sm) calc(88px + env(safe-area-inset-bottom,0px))}.pipeline-flow:before{left:19px}.pipeline-step{grid-template-columns:40px minmax(0,1fr);gap:12px}.pipeline-step__marker{width:40px;height:40px}.pipeline-card__split,.pipeline-form,.pipeline-job{grid-template-columns:1fr;flex-direction:column;align-items:flex-start}.pipeline-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pipeline-progress__status{grid-template-columns:auto minmax(0,1fr)}.pipeline-progress__percent{grid-column:2;justify-self:start}.pipeline-progress__steps{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:6px}}.study-library{min-height:100vh;background:#1d2021;color:var(--color-text-primary)}.study-library__shell{width:var(--max-shell-width);margin:0 auto;padding:var(--space-xl) var(--space-lg) var(--space-2xl);display:flex;flex-direction:column;gap:18px}.study-library__panel{border:1px solid rgba(168,153,132,.18);border-radius:8px;background:#282828eb;padding:18px 20px;display:flex;flex-direction:column;gap:16px}.study-library__toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding-bottom:16px;border-bottom:1px solid rgba(168,153,132,.14)}.study-library__title-group{display:flex;flex-direction:column;gap:6px}.study-library__title-group h1{margin:0;color:var(--color-text-primary);font-size:clamp(1.5rem,2.4vw,2rem);line-height:1;letter-spacing:.02em}.study-library__title-group span{color:var(--color-text-secondary);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase}.study-library__flow{position:relative;display:flex;flex-direction:column;gap:18px}.study-library__flow:before{content:"";position:absolute;left:23px;top:24px;bottom:24px;width:1px;background:linear-gradient(180deg,#d799214d,#a899842e)}.study-library__node{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr);gap:16px;align-items:start}.study-library__marker{position:relative;z-index:1;width:48px;height:48px;border-radius:999px;border:1px solid rgba(215,153,33,.34);background:#282828fa;color:var(--color-text-secondary);display:inline-flex;align-items:center;justify-content:center;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase}.study-library__body{padding:18px 20px;border:1px solid rgba(168,153,132,.18);background:#282828eb;border-radius:22px;display:flex;flex-direction:column;gap:14px}.study-library__choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.study-library__choice{min-height:118px;padding:18px;border-radius:20px;border:1px solid rgba(168,153,132,.18);background:#1d2021d1;color:var(--color-text-secondary);text-align:left;display:flex;flex-direction:column;justify-content:space-between;gap:12px;transition:border-color .14s ease,background-color .14s ease,color .14s ease,transform .14s ease}.study-library__choice strong,.study-library__study-main strong,.study-library__run-main strong{font-size:clamp(1.25rem,3vw,1.8rem);line-height:1;letter-spacing:.03em}.study-library__choice span,.study-library__study-kicker,.study-library__study-side span,.study-library__run-meta span{font-size:.74rem;letter-spacing:.1em;text-transform:uppercase}.study-library__choice:hover,.study-library__choice:focus-visible{color:var(--color-text-primary);border-color:#d799214d;background:#32302ff5;transform:translateY(-1px);outline:none}.study-library__choice.is-active{color:var(--color-text-primary);border-color:#d7992157;background:#d7992129}.study-library__list,.study-library__run-list{display:flex;flex-direction:column}.study-library__study,.study-library__run{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;padding:14px 0;border-top:1px solid rgba(168,153,132,.14)}.study-library__study:first-child,.study-library__run:first-child{padding-top:0;border-top:0}.study-library__study:last-child,.study-library__run:last-child{padding-bottom:0}.study-library__study-main,.study-library__study-side,.study-library__run-main,.study-library__run-meta,.study-library__create,.study-library__empty{display:flex;flex-direction:column;gap:8px}.study-library__study-main p,.study-library__create p,.study-library__empty p,.study-library__run-main span,.study-library__error{margin:0;color:var(--color-text-secondary)}.study-library__study-side,.study-library__run-meta{align-items:end;text-align:right}.study-library__study-actions{display:inline-flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.study-library__action{min-height:38px;padding:0 14px;border-radius:999px;border:1px solid rgba(168,153,132,.18);background:#3c383694;color:var(--color-text-secondary);text-decoration:none;display:inline-flex;align-items:center;justify-content:center;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;transition:background-color .12s ease,border-color .12s ease,color .12s ease,transform .12s ease}.study-library__action:hover,.study-library__action:focus-visible{color:var(--color-text-primary);background:#504945db;border-color:#d799214d;transform:translateY(-1px);outline:none}.study-library__action:disabled{opacity:.45;transform:none}.study-library__action--primary{color:var(--color-text-primary);background:#d799212e;border-color:#d7992157}.study-library__details{border:1px solid rgba(168,153,132,.14);border-radius:18px;background:#1d2021bd}.study-library__details summary{list-style:none;cursor:pointer;padding:14px 16px;color:var(--color-text-primary);font-size:.84rem;letter-spacing:.04em}.study-library__details summary::-webkit-details-marker{display:none}.study-library__details[open]{padding-bottom:14px}.study-library__details[open] .study-library__run-list,.study-library__details[open] .study-library__error{padding:0 16px}.study-library__error{color:#fb4934}@media (max-width: 720px){.study-library__shell{width:100%;padding:max(12px,calc(env(safe-area-inset-top,0px) + 8px)) var(--space-sm) calc(88px + env(safe-area-inset-bottom,0px))}.study-library__toolbar{flex-direction:column}.study-library__flow:before{left:19px}.study-library__node{grid-template-columns:40px minmax(0,1fr);gap:12px}.study-library__marker{width:40px;height:40px}.study-library__choice-grid,.study-library__study,.study-library__run{grid-template-columns:1fr}.study-library__study-side,.study-library__run-meta{align-items:start;text-align:left}.study-library__study-actions{justify-content:flex-start}}.voice-loop-page{min-height:100vh;background:#1d2021;color:var(--color-text-primary)}.voice-loop-shell{width:var(--max-shell-width);margin:0 auto;padding:var(--space-xl) var(--space-lg) var(--space-2xl)}.voice-loop-header{width:100%;margin-bottom:20px}.voice-loop-workspace{display:grid;grid-template-columns:minmax(300px,348px) minmax(0,1fr);gap:18px;align-items:stretch}.voice-loop-controls,.voice-loop-stage{border:1px solid rgba(168,153,132,.18);border-radius:8px;background:#282828eb;box-shadow:none}.voice-loop-controls{position:sticky;top:20px;max-height:calc(100vh - 40px);display:flex;flex-direction:column;gap:14px;padding:16px;overflow:auto}.voice-loop-field{display:flex;flex-direction:column;gap:7px}.voice-loop-field-header{display:flex;align-items:center;justify-content:space-between;gap:10px}.voice-loop-field>span,.voice-loop-field-header label,.voice-loop-stats span,.voice-loop-chord span{color:#ebdbb294;font-size:.68rem;letter-spacing:.05em;text-transform:uppercase}.voice-loop-dice{width:28px;height:28px;border:0;border-radius:6px;background:transparent;color:#ebdbb2ad;display:inline-flex;align-items:center;justify-content:center;transition:background .1s ease,color .1s ease}.voice-loop-dice:hover:not(:disabled),.voice-loop-dice:focus-visible:not(:disabled){background:#d799211f;color:#fabd2f}.voice-loop-dice:disabled{color:#a899844d}.voice-loop-field textarea,.voice-loop-field input:not([type=range]),.voice-loop-field select{width:100%;border:1px solid rgba(168,153,132,.18);border-radius:8px;background:#1d2021f5;color:#ebdbb2f5;font:inherit}.voice-loop-field textarea,.voice-loop-field input:not([type=range]){padding:12px}.voice-loop-field textarea{min-height:108px;resize:vertical}.voice-loop-field select{min-height:42px;padding:0 10px}.voice-loop-field textarea:focus-visible,.voice-loop-field input:focus-visible,.voice-loop-field select:focus-visible{outline:none;border-color:#d7992170;box-shadow:0 0 0 1px #d799212e}.voice-loop-field input[type=range]{width:100%;accent-color:#d79921}.voice-loop-control-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.voice-loop-actions{display:grid;grid-template-columns:1fr .62fr .72fr;gap:10px}.voice-loop-actions--top{padding-bottom:12px;border-bottom:1px solid rgba(168,153,132,.14)}.voice-loop-status{display:inline-flex;align-items:center;gap:8px;min-height:24px;color:#ebdbb2ad;font-size:.72rem}.voice-loop-status__dot{width:7px;height:7px;border-radius:999px;background:#a8998494}.voice-loop-status--working .voice-loop-status__dot{background:#fabd2f;animation:voice-loop-status-pulse .9s ease-in-out infinite}.voice-loop-status--ready .voice-loop-status__dot{background:#b8bb26}.voice-loop-status--warn .voice-loop-status__dot{background:#d79921}.voice-loop-status--error .voice-loop-status__dot{background:#fb4934}.voice-loop-button{min-height:44px;padding:0 14px;border:1px solid rgba(168,153,132,.2);border-radius:8px;background:#3c3836c7;color:#ebdbb2f0;font-size:.78rem;letter-spacing:.02em;transition:background .1s ease,border-color .1s ease,color .1s ease}.voice-loop-button:hover:not(:disabled),.voice-loop-button:focus-visible:not(:disabled){background:#504945e6;border-color:#d7992157}.voice-loop-button--primary{background:#d7992133;border-color:#d7992157}.voice-loop-button--record{border-color:#cc241d4d}.voice-loop-button--record.is-recording,.voice-loop-button--record:hover:not(:disabled),.voice-loop-button--record:focus-visible:not(:disabled){background:#cc241d2e;border-color:#fb493480}.voice-loop-message{margin:0;padding:10px 12px;border:1px solid rgba(215,153,33,.24);border-radius:8px;background:#d7992114;color:#ebdbb2c7;font-size:.76rem}.voice-loop-stage{min-width:0;height:100%;display:flex;flex-direction:column;gap:16px;padding:16px;overflow:hidden}.voice-loop-score{width:100%;flex:1;min-height:210px;resize:vertical;border:1px solid rgba(168,153,132,.18);border-radius:8px;background:#1d2021f5;color:#ebdbb2f5;padding:12px;font:inherit;font-size:.74rem;line-height:1.55}.voice-loop-score:focus-visible{outline:none;border-color:#d7992170;box-shadow:0 0 0 1px #d799212e}.voice-loop-readout{display:flex;justify-content:flex-end}.voice-loop-stats{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.voice-loop-stats span{min-height:24px;display:inline-flex;align-items:center;padding:0;border:0;background:transparent}.voice-loop-phrase{display:flex;flex-wrap:wrap;gap:8px;min-height:44px;font-size:clamp(1rem,1.8vw,1.56rem);line-height:1.12}.voice-loop-phrase span{color:#ebdbb26b;transition:color 80ms ease,transform 80ms ease}.voice-loop-phrase span.is-active{color:#fabd2f;transform:translateY(-1px)}.voice-loop-grid{--voice-loop-cell-min: 38px;display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--voice-loop-cell-min),1fr));grid-auto-rows:58px;gap:4px;max-height:256px;overflow:auto;padding-bottom:5px}.voice-loop-cell{position:relative;min-width:var(--voice-loop-cell-min);min-height:58px;border:1px solid rgba(168,153,132,.12);border-radius:6px;background:#1d2021db;display:flex;flex-direction:column;justify-content:flex-end;gap:3px;padding:6px 5px;overflow:hidden;text-align:left}.voice-loop-cell.is-bar{border-left-color:#d7992180}.voice-loop-cell.has-hit{background:#3c3836d1;border-color:#a8998442}.voice-loop-cell.is-active{background:#d7992133;border-color:#fabd2f94;animation:voice-loop-cell-flash .18s ease-out}.voice-loop-cell__note,.voice-loop-cell__word{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.voice-loop-cell__note{color:#fabd2f;font-size:.62rem}.voice-loop-cell__word{color:#ebdbb2d1;font-size:.55rem}.voice-loop-chords{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.voice-loop-chord{min-height:76px;border:1px solid rgba(168,153,132,.14);border-radius:8px;background:#1d2021b8;padding:10px;display:flex;flex-direction:column;justify-content:space-between;gap:5px}.voice-loop-chord.is-active{border-color:#d799216b;background:#d799211f}.voice-loop-chord strong{color:#ebdbb2f2;font-size:.92rem;font-weight:600}.voice-loop-chord small{color:#ebdbb294}.voice-loop-piano{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:4px;min-height:58px}.voice-loop-piano__key{border:1px solid rgba(168,153,132,.14);border-radius:6px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:7px;color:#ebdbb294;font-size:.64rem;transition:background 80ms ease,color 80ms ease,transform 80ms ease}.voice-loop-piano__key.is-white{min-height:58px;background:#ebdbb21f}.voice-loop-piano__key.is-black{min-height:40px;background:#3c3836eb}.voice-loop-piano__key.is-active{background:#d79921;color:#1d2021;transform:translateY(-2px)}@keyframes voice-loop-cell-flash{0%{box-shadow:0 0 0 1px #fabd2f85}to{box-shadow:0 0 0 10px #fabd2f00}}@keyframes voice-loop-status-pulse{0%,to{opacity:.45;transform:scale(.9)}50%{opacity:1;transform:scale(1.2)}}@media (max-width: 920px){.voice-loop-workspace{grid-template-columns:1fr}.voice-loop-controls{position:static}}@media (max-width: 680px){.voice-loop-shell{width:100%;padding:max(12px,calc(env(safe-area-inset-top,0px) + 8px)) var(--space-sm) calc(88px + env(safe-area-inset-bottom,0px))}.voice-loop-readout,.voice-loop-stats{justify-content:flex-start}.voice-loop-control-grid,.voice-loop-actions,.voice-loop-chords{grid-template-columns:1fr}.voice-loop-grid{--voice-loop-cell-min: 48px}}:root{--color-core-ink: #10151f;--color-core-paper: #f4f1e8;--color-core-accent: #ff7a3d;--color-bg-sky: var(--color-core-ink);--color-bg-deep: var(--color-core-ink);--color-primary-soft: rgba(16, 21, 31, .92);--color-primary-dim: rgba(16, 21, 31, .98);--color-accent-sheen: rgba(255, 122, 61, .2);--color-accent-sheen-strong: rgba(255, 122, 61, .42);--color-accent-silver: rgba(255, 122, 61, .16);--color-glimmer-one: rgba(255, 122, 61, 1);--color-glimmer-two: rgba(255, 122, 61, .75);--color-glimmer-three: rgba(255, 122, 61, .42);--color-text-primary: rgba(244, 241, 232, .96);--color-text-secondary: rgba(244, 241, 232, .76);--color-text-tertiary: rgba(244, 241, 232, .58);--color-key-white: rgba(244, 241, 232, .92);--color-key-active: rgba(255, 122, 61, .32);--color-key-black: rgba(16, 21, 31, .98);--color-key-black-active: rgba(255, 122, 61, .44);--color-surface: rgba(16, 21, 31, .72);--color-surface-intense: rgba(16, 21, 31, .86);--color-surface-soft: rgba(16, 21, 31, .58);--color-chip: rgba(16, 21, 31, .62);--shadow-radiant: 0 8px 24px rgba(0, 0, 0, .6);--shadow-floating: 0 4px 16px rgba(0, 0, 0, .5);--shadow-soft: 0 2px 8px rgba(0, 0, 0, .4);--shadow-touch: 0 1px 4px rgba(0, 0, 0, .3);--space-xs: 6px;--space-sm: 10px;--space-md: 16px;--space-lg: 20px;--space-xl: 28px;--space-2xl: 40px;--border-glass: 1px solid rgba(255, 122, 61, .22);--border-glass-subtle: 1px solid rgba(255, 122, 61, .14);--blur-surface: 0px;--blur-overlay: 0px;--transition-dissolve: .1s ease;--transition-surface: .1s ease;--transition-hover: .1s ease;--radius-large: 14px;--radius-medium: 12px;--radius-small: 10px;--max-shell-width: min(92vw, 1080px);--wave-candy-height: clamp(180px, 22vh, 240px);--scroll-progress: 0}*,*:before,*:after{box-sizing:border-box}html,body{height:100%;direction:ltr}body{margin:0;min-height:100%;background:var(--color-bg-deep);color:var(--color-text-primary);font-family:IBM Plex Mono,Menlo,Monaco,monospace;line-height:1.5;font-weight:400;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;position:relative;overflow-x:hidden;text-align:left}#root{min-height:100vh;position:relative;z-index:1}button,input,select,textarea{font-family:inherit;font-weight:500}button{cursor:pointer;background:none;border:none;color:inherit;padding:0}p,span,label,dd,dt,li,code,kbd{color:var(--color-text-primary);opacity:1;text-shadow:none}small{color:var(--color-text-secondary);opacity:.9}h1,h2,h3,h4{font-weight:500;line-height:1.3;letter-spacing:.04em;text-transform:uppercase;color:var(--color-text-primary);text-shadow:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:focus-visible{outline:3px solid var(--color-accent-sheen);outline-offset:4px}*{scrollbar-width:none}*::-webkit-scrollbar{width:0;height:0}button:disabled{opacity:.45;cursor:not-allowed}.simple-background{position:fixed;inset:0;z-index:0;pointer-events:none;background:var(--color-bg-deep)}.gradient-layer{display:none}.app-stage{position:relative;min-height:100vh;display:flex;flex-direction:column}.app-shell{position:relative;width:var(--max-shell-width);margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:var(--space-xl);padding:var(--space-xl) var(--space-lg) var(--space-2xl);min-height:100vh}.app-shell>*{position:relative;z-index:1}.tier-focus{box-shadow:var(--shadow-radiant);border:1px solid rgba(255,255,255,.32)}.tier-support{box-shadow:var(--shadow-floating);border:1px solid rgba(255,255,255,.24)}.tier-subtle{box-shadow:var(--shadow-soft);border:1px solid rgba(255,255,255,.14);opacity:.92}.content-tertiary{order:0;flex:0 0 auto}.content-primary{order:1;flex:1 1 auto}.content-secondary{order:2;flex:0 1 auto}.zone-top{width:min(1040px,100%);position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;justify-content:space-between;gap:18px 28px;padding:10px 0 18px;border-radius:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;border:0;border-bottom:1px solid rgba(244,241,232,.08);box-shadow:none;overflow:visible}.zone-center{width:min(1200px,95vw);flex:1;display:flex;flex-direction:column;align-items:center;gap:var(--space-lg);padding:var(--space-lg) 0}.zone-bottom{width:min(1200px,95vw);display:flex;justify-content:center;padding-bottom:var(--space-lg)}.brand-block{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0}.brand-title{font-weight:600;font-size:1.24rem;letter-spacing:.03em;color:var(--color-glimmer-one);text-shadow:none;margin:0;padding-left:1px}.brand-subtitle{font-weight:300;font-size:clamp(.8rem,1.2vw,1rem);letter-spacing:.18em;color:var(--color-text-secondary);text-transform:uppercase;opacity:.92}.header-controls{display:flex;align-items:flex-start;gap:14px 18px;justify-content:flex-end;flex-wrap:wrap;max-width:none}.header-nav{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.header-actions{display:flex;align-items:center;gap:6px;padding-left:18px;border-left:1px solid rgba(244,241,232,.08)}.header-controls .button-icon{width:40px;height:40px;border-radius:999px;font-size:.92rem;background:transparent;border-color:transparent;box-shadow:none;color:var(--color-text-secondary)}.header-controls .button-icon:hover{background:#f4f1e814;color:var(--color-text-primary)}.header-controls label.button-icon{cursor:pointer}.header-controls .button-icon.loading{opacity:.5;pointer-events:none}.panel{position:relative;background:var(--color-surface);border:var(--border-glass);border-radius:var(--radius-medium);padding:var(--space-md);display:flex;flex-direction:column;gap:var(--space-md);-webkit-backdrop-filter:blur(var(--blur-surface)) brightness(1.08);backdrop-filter:blur(var(--blur-surface)) brightness(1.08);box-shadow:var(--shadow-soft);overflow:hidden}.panel.elevated{box-shadow:var(--shadow-floating);background:linear-gradient(200deg,var(--color-surface) 0%,rgba(244,241,232,.08) 100%)}.app-notice{position:fixed;right:18px;bottom:18px;z-index:130;padding:10px 14px;border-radius:999px;background:#10151fe6;border:1px solid rgba(255,122,61,.4);color:var(--color-text-primary);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;box-shadow:var(--shadow-floating)}.button-icon,.button-primary,.waveform-button{position:relative;overflow:hidden;border-radius:var(--radius-small);background:linear-gradient(180deg,#f4f1e833,#f4f1e81a);border:var(--border-glass-subtle);color:var(--color-text-primary);-webkit-backdrop-filter:blur(14px) brightness(1.1);backdrop-filter:blur(14px) brightness(1.1);transition:transform var(--transition-hover),filter var(--transition-hover),box-shadow var(--transition-hover);box-shadow:var(--shadow-touch)}.button-icon{width:48px;height:48px;display:inline-flex;align-items:center;justify-content:center;border-radius:14px;font-size:1.1rem;color:var(--color-text-primary)}.button-primary{min-height:48px;padding:12px 18px;border-radius:999px;font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;background:linear-gradient(180deg,#ff7a3d57,#ff7a3d38)}.button-link{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:6px 0;border-radius:0;border:1px solid transparent;background:transparent;font-size:.78rem;font-weight:500;letter-spacing:.02em;color:var(--color-text-secondary);text-decoration:none;transition:color .1s ease,border-color .1s ease,background-color .1s ease}.button-link:hover{color:var(--color-text-primary)}.button-link:focus-visible{outline:none;color:var(--color-text-primary)}.button-link--nav{padding-bottom:8px;border-bottom-color:transparent}.button-link--nav:hover,.button-link--nav:focus-visible,.button-link--nav.is-active{border-bottom-color:#ff7a3d52}.button-link--nav.is-active{color:var(--color-text-primary)}.button-link--quiet{min-height:34px;padding:0 12px;border-radius:999px;background:#f4f1e80d}.button-link--quiet:hover,.button-link--quiet:focus-visible{background:#f4f1e81a}.button-link:disabled,.button-link.is-disabled,.button-icon:disabled,.button-icon.is-disabled{opacity:.38;cursor:not-allowed;pointer-events:none}.button-icon:hover,.button-primary:hover,.waveform-button:hover{opacity:.8}.control-chip{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:999px;background:var(--color-chip);color:var(--color-text-secondary);font-size:clamp(.72rem,.9vw,.85rem);letter-spacing:.14em;text-transform:uppercase;box-shadow:0 8px 20px #101c2847;-webkit-backdrop-filter:blur(12px) brightness(1.08);backdrop-filter:blur(12px) brightness(1.08)}.slider-group{display:flex;flex-direction:column;gap:12px}.label-stack{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:16px}.label-stack__meta{display:inline-flex;align-items:center;justify-content:flex-end;gap:8px;margin-left:auto;min-width:0}.slider-value{font-size:clamp(.75rem,.9vw,.85rem);letter-spacing:.02em;color:var(--color-text-tertiary)}.slider-description{font-size:clamp(.72rem,.95vw,.85rem);color:var(--color-text-secondary);opacity:.9;letter-spacing:.01em}.slider-input-wrapper{position:relative;width:100%;min-height:28px;display:flex;align-items:center;justify-content:center;padding:10px 0;border-radius:999px;background:transparent;overflow:visible;--slider-progress: 50%}.slider-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:20px}.select-input-wrapper{position:relative}.control-select{width:100%;min-height:46px;padding:0 14px;border-radius:14px;border:1px solid rgba(244,241,232,.12);background:linear-gradient(180deg,#f4f1e824,#f4f1e80f);color:var(--color-text-primary);box-shadow:inset 0 0 0 1px #ffffff0a}.control-select:focus-visible{outline:none;border-color:#ff7a3d75;box-shadow:0 0 0 1px #ff7a3d33}.segment-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:10px}.segment-button{min-height:42px;padding:10px 12px;border-radius:14px;border:1px solid rgba(244,241,232,.08);background:#f4f1e80a;color:var(--color-text-secondary);letter-spacing:.02em;font-size:.74rem;transition:border-color .12s ease,color .12s ease,transform .12s ease,background .12s ease}.segment-button:hover{color:var(--color-text-primary);transform:translateY(-1px)}.segment-button.is-active{color:var(--color-text-primary);border-color:#ff7a3d6b;background:#ff7a3d24;box-shadow:none}.effect-summary{display:flex;flex-wrap:wrap;gap:6px}.effect-chip{display:inline-flex;align-items:center;min-height:auto;padding:0;border-radius:0;background:transparent;border:0;color:var(--color-text-secondary);font-size:.64rem;letter-spacing:.02em}.effect-chip+.effect-chip:before{content:"·";margin-right:6px;color:var(--color-text-tertiary)}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:6px;border-radius:999px;background:linear-gradient(90deg,rgba(255,122,61,.24) 0%,rgba(255,122,61,.62) var(--slider-progress, 50%),rgba(244,241,232,.06) calc(var(--slider-progress, 50%) + .1%),rgba(244,241,232,.06) 100%);transition:all .1s ease;border:none;box-shadow:none}input[type=range]:hover{background:linear-gradient(90deg,rgba(255,122,61,.36) 0%,rgba(255,122,61,.78) var(--slider-progress, 50%),rgba(244,241,232,.08) calc(var(--slider-progress, 50%) + .1%),rgba(244,241,232,.08) 100%)}input[type=range]:focus-visible{outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:#ff7a3df2;border:1px solid rgba(255,204,177,.92);box-shadow:0 0 0 5px #ff7a3d1f,0 8px 16px #0c18243d;cursor:pointer;-webkit-transition:all .1s ease;transition:all .1s ease}input[type=range]::-webkit-slider-thumb:hover{background:#ff7a3d;box-shadow:0 0 0 6px #ff7a3d29,0 10px 18px #0c182447}input[type=range]::-webkit-slider-thumb:active{transform:scale(.94)}input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#ff7a3df2;border:1px solid rgba(255,204,177,.92);box-shadow:0 0 0 5px #ff7a3d1f,0 8px 16px #0c18243d;cursor:pointer;-moz-transition:all .1s ease;transition:all .1s ease}input[type=range]::-moz-range-thumb:hover{background:#ff7a3d;box-shadow:0 0 0 6px #ff7a3d29,0 10px 18px #0c182447}input[type=range]::-moz-range-thumb:active{transform:scale(.94)}.inline-toggle-pill{display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:0 12px;border-radius:999px;border:1px solid rgba(244,241,232,.1);background:#f4f1e80d;color:var(--color-text-secondary);font-size:.64rem;letter-spacing:.02em;transition:border-color .12s ease,color .12s ease,background .12s ease,transform .12s ease}.inline-toggle-pill:hover{color:var(--color-text-primary);transform:translateY(-1px)}.inline-toggle-pill.is-active{border-color:#ff7a3d61;background:#ff7a3d24;color:#ffdeccf0}.inline-toggle-pill--subtle{min-height:28px;padding:0 10px;font-size:.56rem}.inline-toggle-pill__dot{width:7px;height:7px;border-radius:50%;background:#f4f1e842;transition:background .12s ease,box-shadow .12s ease}.inline-toggle-pill.is-active .inline-toggle-pill__dot{background:#ff7a3deb;box-shadow:0 0 0 4px #ff7a3d24}.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:clamp(.78rem,.95vw,.88rem);color:var(--color-text-secondary);letter-spacing:.02em}.toggle-row input[type=checkbox]{width:52px;height:32px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#ffffff1f;border-radius:999px;position:relative;border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 0 12px #10151f40;transition:background .1s ease}.toggle-row input[type=checkbox]:after{content:"";position:absolute;top:4px;left:4px;width:22px;height:22px;border-radius:50% 50% 45% 45%;background:linear-gradient(180deg,#f8fafbe6,#d1dce5b3);box-shadow:0 8px 16px #0c182452;transition:transform .1s ease}.toggle-row input[type=checkbox]:checked{background:#e8f0f557}.toggle-row input[type=checkbox]:checked:after{transform:translate(22px)}.fieldset{border:0;padding:0;margin:0;display:flex;flex-direction:column;gap:16px}.fieldset+.fieldset{margin-top:20px}.record-button{position:relative}.record-button.recording{background:#ff7a3d4d;border-color:#ff7a3d80;animation:recordPulse 1s ease-in-out infinite}.record-button.recording span{color:#ff7a3d}@keyframes recordPulse{0%,to{box-shadow:0 0 #ff7a3d66}50%{box-shadow:0 0 0 8px #ff7a3d00}}.recording-indicator{color:#ff7a3d;font-weight:500;animation:blink 1s ease-in-out infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.4}}.keyboard-surface{position:relative;width:min(1400px,96vw);min-height:clamp(280px,40vh,420px);padding:var(--space-lg);display:flex;flex-direction:column;justify-content:flex-start;gap:var(--space-md);border-radius:var(--radius-large);background:radial-gradient(120% 90% at 50% 5%,#ff9c6017,#ff9c6000 58%),linear-gradient(190deg,#121a26e6,#090e16f2);border:1px solid rgba(255,255,255,.18);-webkit-backdrop-filter:blur(var(--blur-overlay)) brightness(1.08);backdrop-filter:blur(var(--blur-overlay)) brightness(1.08);box-shadow:0 32px 60px #03070e9e,inset 0 1px #ffffff14;overflow:hidden}.keyboard-header{display:flex;justify-content:flex-start;align-items:center;color:var(--color-text-secondary);font-size:clamp(.8rem,1vw,.95rem);letter-spacing:.18em;text-transform:uppercase;gap:var(--space-sm)}.keyboard-region{position:relative;width:100%;display:flex;flex-direction:column;gap:var(--space-sm);min-height:0}.keyboard-legend{display:inline-flex;gap:var(--space-sm);font-size:clamp(.7rem,.9vw,.85rem);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.14em}.keyboard-wrapper{position:relative;width:100%;flex:1 1 auto;display:grid;grid-template-rows:minmax(0,1fr) auto;justify-items:stretch;align-items:stretch;align-content:stretch;gap:var(--space-sm);min-height:0;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.white-keys{position:relative;display:grid;grid-template-columns:repeat(11,1fr);width:100%;height:100%;min-height:clamp(120px,20vh,180px);grid-row:1;border-radius:20px;overflow:hidden;background:linear-gradient(180deg,#0d121ceb,#080d15fa);box-shadow:inset 0 1px #ffffff14,inset 0 -22px 32px #00000073;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);gap:2px}.key-white{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:clamp(6px,1.3vw,12px);border:none;background:linear-gradient(180deg,#f8fafefa,#e3e9f1f5 52%,#d4dde9f2);color:var(--color-text-secondary);transition:transform .1s cubic-bezier(.22,.61,.36,1),box-shadow .1s cubic-bezier(.22,.61,.36,1),background-color .1s ease;border-radius:0 0 18px 18px;cursor:pointer;text-shadow:none;width:100%;min-width:0;min-height:100%;box-shadow:inset 0 1px #ffffffe6,inset 0 -8px 12px #5260773d}.key-white:last-child{border-right:none}.key-white:hover{transform:translateY(-2px) scaleY(1.02);box-shadow:inset 0 1px #fffffff5,inset 0 -8px 12px #48587047,0 14px 26px #0000004d}.key-white.active,.key-white[data-active=true]{background:linear-gradient(180deg,#ffc9aafa,#ffb084fa 55%,#ff8d64fa);transform:translateY(4px) scaleY(.985);box-shadow:inset 0 1px #ffecdbd9,inset 0 -8px 16px #78382152,0 22px 34px #080e1666}.key-white:focus-visible{outline:3px solid var(--color-accent-sheen-strong);outline-offset:2px}.key-white .note-label,.key-white .key-label{position:absolute;font-size:clamp(.6rem,.8vw,.75rem);color:#141c2cc7;opacity:.9;letter-spacing:.08em}.key-white .note-label{bottom:clamp(8px,1.6vw,14px);color:#0a101ce6;opacity:.96;font-weight:500}.key-white .key-label{top:clamp(8px,1.2vw,12px);left:clamp(6px,1vw,10px);font-weight:600;opacity:.7}.black-keys-layer{position:absolute;inset:0;pointer-events:none;grid-row:1}.key-black{position:absolute;top:0;pointer-events:auto;margin-top:clamp(8px,1.5vw,12px);background:linear-gradient(180deg,#303a4af5,#0e1521fc 65%,#090e16);border-radius:0 0 14px 14px;border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px #d8e2f257,inset 0 -8px 14px #02060cbf,0 18px 28px #0000008c;color:#f8fafbe6;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:var(--space-xs);transition:transform .1s cubic-bezier(.22,.61,.36,1),box-shadow .1s cubic-bezier(.22,.61,.36,1),background-color .1s ease;transform:translate(-50%);cursor:pointer;min-width:clamp(24px,4vw,48px);min-height:clamp(44px,8vh,80px);z-index:2}.key-black:hover{transform:translate(-50%) translateY(-2px) scale(1.02);box-shadow:inset 0 1px #d8e2f26b,inset 0 -8px 14px #02060cbf,0 24px 34px #0000009e}.key-black.active,.key-black[data-active=true]{background:linear-gradient(180deg,#ffb792fa,#ff9066fa 52%,#c25f39fa);transform:translate(-50%) translateY(4px) scale(.99);box-shadow:inset 0 1px #ffe4d199,inset 0 -10px 18px #5c2212b3,0 16px 24px #0810188c}.key-black:focus-visible{outline:3px solid var(--color-accent-sheen-strong);outline-offset:2px}.key-black .note-label,.key-black .key-label{position:absolute;font-size:clamp(.55rem,.75vw,.7rem);opacity:.92}.key-black .note-label{bottom:clamp(6px,1.4vw,12px);font-weight:500;opacity:.96}.key-black .key-label{top:clamp(6px,1.2vw,10px);left:50%;transform:translate(-50%);font-weight:600;opacity:.78}.key-active-indicator{position:absolute;inset:6px;border-radius:inherit;background:linear-gradient(180deg,#ffffff29,#fff0);animation:notePulse 1.2s ease-in-out infinite;pointer-events:none;mix-blend-mode:soft-light}.keyboard-meta{grid-row:2;text-align:center;font-size:clamp(.65rem,1.4vw,.8rem);color:var(--color-text-tertiary);letter-spacing:.14em;text-transform:uppercase;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-small);background:#e8f0f51f;-webkit-backdrop-filter:blur(10px) brightness(1.05);backdrop-filter:blur(10px) brightness(1.05);box-shadow:0 12px 20px #101c2833;max-width:100%}.keyboard-loading{display:flex;align-items:center;justify-content:center;width:100%;border-radius:18px;background:#ffffff14;color:var(--color-text-secondary);font-size:clamp(.85rem,1vw,1rem);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);text-transform:uppercase;letter-spacing:.18em}.keyboard-hints{display:flex;justify-content:center;gap:var(--space-lg);font-size:clamp(.65rem,.8vw,.75rem);color:var(--color-text-tertiary);opacity:.7;letter-spacing:.1em;text-transform:uppercase}.keyboard-hint{display:inline-flex;gap:4px}.warmup-indicator{position:absolute;right:24px;bottom:24px;display:inline-flex;align-items:center;gap:12px;padding:12px 18px;border-radius:999px;background:#e8f0f53d;border:1px solid rgba(255,255,255,.2);color:var(--color-text-secondary);font-size:clamp(.72rem,.9vw,.85rem);letter-spacing:.14em;text-transform:uppercase;box-shadow:0 18px 32px #101c2852;-webkit-backdrop-filter:blur(12px) brightness(1.05);backdrop-filter:blur(12px) brightness(1.05);overflow:hidden}.warmup-indicator__pulse{width:8px;height:8px;border-radius:50%;background:var(--color-glimmer-one)}.controls-surface{position:relative;width:min(1200px,95vw);display:grid;grid-template-columns:clamp(220px,24vw,300px) minmax(0,1fr);gap:var(--space-lg);padding:var(--space-lg);align-items:flex-start;border-radius:var(--radius-large);background:linear-gradient(210deg,var(--color-surface-intense) 0%,rgba(244,241,232,.07) 100%);border:var(--border-glass);-webkit-backdrop-filter:blur(var(--blur-overlay)) brightness(1.1);backdrop-filter:blur(var(--blur-overlay)) brightness(1.1);box-shadow:var(--shadow-floating);overflow:hidden}.controls-panel{display:flex;flex-direction:column;gap:var(--space-md);min-width:0}.controls-panel.wide{display:flex;flex-direction:column;gap:var(--space-md)}.controls-surface>.controls-panel:first-child{grid-column:1}.controls-surface>.controls-panel.wide{grid-column:2}.controls-heading{font-size:clamp(.92rem,1.1vw,1.02rem);font-weight:500;letter-spacing:.03em;color:var(--color-text-secondary)}.control-groups{display:flex;flex-direction:column;gap:18px}.control-groups--embedded,.control-groups--compact{gap:14px}.control-section{display:flex;flex-direction:column;gap:var(--space-md)}.control-section-shell{display:flex;flex-direction:column;gap:14px;padding:0 0 18px;border-radius:0;background:transparent;border:0;border-bottom:1px solid rgba(244,241,232,.08);box-shadow:none}.control-section-shell:last-child{padding-bottom:0;border-bottom:0}.control-section-shell.is-collapsed{gap:8px}.control-section-header{display:flex;align-items:flex-start;gap:14px}.control-section-toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:1 1 auto;min-height:auto;padding:0;background:transparent;border:none;color:inherit;text-align:left;transition:color .12s ease}.control-section-toggle__copy{display:flex;flex:1 1 auto;flex-direction:column;align-items:flex-start;gap:6px;min-width:0}.control-section-toggle__chevron{flex:0 0 auto;width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:transparent;border:0;color:var(--color-text-tertiary);font-size:1.1rem;line-height:1;transition:background .12s ease,color .12s ease}.control-section-toggle:hover .controls-heading{color:var(--color-text-primary)}.control-section-toggle:hover .control-section-toggle__chevron,.control-section-toggle:focus-visible .control-section-toggle__chevron{background:#ff7a3d14;color:var(--color-text-primary)}.control-section-header__accessory{flex:0 0 auto}.control-section-summary{display:inline-flex;flex-wrap:wrap;gap:4px 8px;min-width:0}.control-section-shell.is-open .control-section-summary{display:none}.control-section-body{display:flex;flex-direction:column;gap:18px}.section-footer-actions{display:flex;justify-content:flex-start}.effect-macro-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(136px,1fr));gap:16px 14px}.effect-macro-dial{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0;--dial-size: 112px}.effect-macro-dial__touch{width:var(--dial-size);height:var(--dial-size);display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:radial-gradient(circle at 30% 24%,#ffffff0f,#fff0 42%),linear-gradient(180deg,#121822e6,#080b12fa);border:1px solid rgba(244,241,232,.08);box-shadow:inset 0 0 0 1px #ffffff08,0 16px 30px #03080f47;touch-action:none;cursor:ns-resize}.effect-macro-dial__touch:focus-visible{outline:none;box-shadow:0 0 0 1px #f6ba7852,0 0 0 4px #f6ba7814,inset 0 0 0 1px #ffffff0a,0 16px 30px #03080f57}.effect-macro-dial.is-disabled .effect-macro-dial__touch{cursor:not-allowed;opacity:.62}.effect-macro-dial__canvas{width:var(--dial-size);height:var(--dial-size);display:block}.effect-macro-dial__meta{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}.effect-macro-dial__label{font-size:.64rem;letter-spacing:.02em;color:var(--color-text-secondary)}.effect-macro-dial__value{font-size:.74rem;letter-spacing:.02em;color:var(--color-text-primary)}.effect-macro-dial__meta-line{font-size:.66rem;letter-spacing:.02em;color:var(--color-text-secondary);white-space:nowrap}.effect-macro-dial--compact{gap:6px}.effect-macro-dial--compact .effect-macro-dial__meta{gap:0}.slider-row{display:flex;align-items:center;justify-content:space-between;gap:16px}.waveform-panel{display:flex;flex-direction:column;gap:10px;padding:12px}.waveform-panel--inline{gap:14px;padding:0 0 18px;border-bottom:1px solid rgba(244,241,232,.08)}.waveform-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.waveform-grid--inline{grid-template-columns:repeat(2,minmax(0,1fr))}.waveform-button{min-height:48px;text-align:center;justify-content:center;padding:10px 12px;font-size:clamp(.74rem,.9vw,.82rem);font-weight:500;letter-spacing:.02em;display:flex;align-items:center;background:#f4f1e80a;border:1px solid transparent;box-shadow:none;min-width:52px}.waveform-button--compact{min-height:44px;padding:10px 12px;border-radius:14px;font-size:.68rem;letter-spacing:.02em}.waveform-button.is-active{color:var(--color-text-primary);box-shadow:none;border-color:#ff7a3d6b;background:#ff7a3d24;transform:none}.waveform-button--compact.is-active{box-shadow:none}.control-groups--compact .control-section{gap:12px}.control-groups--compact .effect-macro-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.control-groups--compact .segment-grid{gap:8px}.control-groups--compact .segment-button{min-height:40px;padding:9px 10px;font-size:.68rem}.control-groups--compact .control-section-shell{padding:0 0 16px}.control-groups--compact .label-stack{align-items:flex-start}.control-groups--compact .slider-description{letter-spacing:.01em}.panel-footer{display:flex;flex-direction:column;gap:var(--space-sm)}.wave-candy,.keyboard-surface,.controls-surface{width:min(1200px,95vw)}.wave-candy{gap:var(--space-sm);padding:var(--space-md)}.wave-candy--raylib{height:var(--wave-candy-height);min-height:var(--wave-candy-height);padding:var(--space-sm)}.wave-candy-gear{position:absolute;top:10px;right:12px;font-size:.85rem;line-height:1;padding:6px;border-radius:8px;border:1px solid rgba(150,170,190,.35);color:#d2dce6d9;background:#080c1299;text-shadow:0 0 8px rgba(10,18,28,.6);transition:color .1s ease,border-color .1s ease,background .1s ease}.wave-candy-gear:hover:not(:disabled){color:#f6c484f2;border-color:#f6ba7899;background:#0a121ccc}.wave-candy-gear[aria-pressed=true]{color:#a0dcfff2;border-color:#78c8ff99;background:#0c1622d9}.wave-candy-gear:disabled{opacity:.5;cursor:not-allowed}.wave-candy__viewport{position:relative;flex:1 1 auto;min-height:0;width:100%;height:100%}.wave-candy__canvas{display:block;width:100%;height:100%;border-radius:12px;background:#06090ee6}.wave-candy-grid{display:grid;grid-template-columns:minmax(160px,1.1fr) minmax(200px,1.5fr) minmax(80px,.55fr) minmax(160px,1fr) minmax(180px,1.1fr);grid-auto-rows:150px;gap:var(--space-sm);align-items:stretch}.candy-tile{display:flex;flex-direction:column;gap:6px;padding:10px;min-height:140px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:#070b12a6;box-shadow:inset 0 0 18px #04080e8c}.candy-meter{min-width:90px}.candy-label{font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--color-text-secondary)}.candy-canvas{width:100%;flex:1 1 auto;min-height:0;border-radius:10px;background:#06090ee6}.birds-eye-radar{width:100%;padding:10px;background:radial-gradient(120% 120% at 50% 0%,#5babe81a,#5babe800 42%),radial-gradient(90% 110% at 50% 108%,#ff7e3e24,#ff7e3e00 50%),linear-gradient(180deg,#070d16f5,#040910fa)}.birds-eye-radar__stage{position:relative;min-height:clamp(240px,38vh,430px);border-radius:14px;overflow:hidden;background:radial-gradient(circle at 50% 102%,rgba(255,128,58,.22),transparent 58%),radial-gradient(circle at 50% -12%,rgba(80,124,196,.14),transparent 40%),#03080ef5;border:1px solid rgba(146,178,214,.24);box-shadow:inset 0 0 0 1px #ffffff0d,inset 0 -60px 100px #ff722e14,0 26px 48px #03080e57}.birds-eye-radar__canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.birds-eye-radar__empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;pointer-events:none;padding:14px;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:#deecfca8;text-shadow:0 0 20px rgba(1,5,10,.92)}.shortcuts-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:clamp(32px,6vw,64px);background:#10151f80;-webkit-backdrop-filter:blur(20px) brightness(.95);backdrop-filter:blur(20px) brightness(.95);z-index:40;animation:dissolveIn var(--transition-dissolve) forwards}.shortcuts-card{width:min(520px,100%);display:flex;flex-direction:column;gap:clamp(24px,3vw,32px);border-radius:var(--radius-medium);background:linear-gradient(210deg,#10151ff5,#10151fdb);border:var(--border-glass);-webkit-backdrop-filter:blur(var(--blur-overlay)) brightness(1.08);backdrop-filter:blur(var(--blur-overlay)) brightness(1.08);box-shadow:var(--shadow-floating);padding:clamp(28px,4vw,36px);position:relative;overflow:hidden}.shortcuts-header{display:flex;align-items:center;justify-content:space-between;font-size:clamp(1rem,1.2vw,1.15rem);font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--color-text-secondary)}.shortcuts-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 28px;font-size:clamp(.78rem,.95vw,.9rem);color:var(--color-text-secondary)}.shortcuts-grid dt{font-weight:500;color:var(--color-text-primary);letter-spacing:.06em;text-transform:uppercase}.shortcuts-grid dd{margin:6px 0 0;color:var(--color-text-secondary);opacity:.92}.error-boundary-container{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:clamp(32px,6vw,64px);background:linear-gradient(180deg,var(--color-bg-sky) 0%,var(--color-bg-deep) 100%);z-index:50}.error-boundary-card{width:min(600px,100%);display:flex;flex-direction:column;gap:clamp(24px,3vw,32px);border-radius:var(--radius-medium);background:linear-gradient(210deg,#10151ff5,#10151fdb);border:var(--border-glass);-webkit-backdrop-filter:blur(var(--blur-overlay)) brightness(1.08);backdrop-filter:blur(var(--blur-overlay)) brightness(1.08);box-shadow:var(--shadow-floating);padding:clamp(28px,4vw,36px);position:relative;overflow:hidden}.error-boundary-header{display:flex;align-items:center;justify-content:space-between;gap:16px}.error-boundary-header h1{font-size:clamp(1.2rem,1.5vw,1.4rem);margin:0}.error-badge{padding:8px 16px;border-radius:999px;background:#ff7a3d33;color:#ff7a3d;font-size:clamp(.7rem,.9vw,.8rem);letter-spacing:.12em;text-transform:uppercase;font-weight:400}.error-boundary-content{display:flex;flex-direction:column;gap:20px}.error-message{font-size:clamp(.85rem,1vw,.95rem);line-height:1.6;color:var(--color-text-secondary)}.error-details{background:#ffffff0d;border-radius:var(--radius-small);padding:16px;border:1px solid rgba(255,255,255,.1)}.error-details summary{cursor:pointer;font-weight:400;letter-spacing:.08em;text-transform:uppercase;font-size:clamp(.75rem,.9vw,.85rem);color:var(--color-text-secondary);margin-bottom:12px}.error-stack{margin:12px 0 0;padding:16px;background:#00000026;border-radius:8px;overflow-x:auto;font-size:clamp(.7rem,.85vw,.8rem);line-height:1.5;color:#f8fafbe6;font-family:IBM Plex Mono,monospace}.command-palette-overlay{position:fixed;inset:0;z-index:70;display:flex;align-items:flex-start;justify-content:center;padding:clamp(24px,6vw,48px);background:#10151f73;-webkit-backdrop-filter:blur(16px) brightness(.95);backdrop-filter:blur(16px) brightness(.95)}.command-palette{width:min(640px,100%);max-height:min(520px,78vh);gap:10px}.command-palette__input{width:100%;min-height:52px;border-radius:var(--radius-medium);border:1px solid rgba(255,122,61,.34);background:#10151fb8;color:var(--color-text-primary);font-size:.92rem;padding:0 14px}.command-palette__input::-moz-placeholder{color:var(--color-text-secondary)}.command-palette__input::placeholder{color:var(--color-text-secondary)}.command-palette__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;overflow-y:auto}.command-palette__item{margin:0}.command-palette__action{width:100%;min-height:48px;border-radius:var(--radius-small);border:1px solid rgba(255,122,61,.2);background:#f4f1e80a;color:var(--color-text-primary);display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;text-align:left;gap:12px;padding:10px 12px;transition:border-color .1s ease,background-color .1s ease}.command-palette__action:hover,.command-palette__action--active{border-color:#ff7a3d73;background:#ff7a3d24}.command-palette__label{font-size:.82rem;letter-spacing:.04em;text-transform:uppercase}.command-palette__shortcut{font-family:IBM Plex Mono,monospace;font-size:.72rem;color:var(--color-text-secondary)}.command-palette__empty{margin:0;padding:10px 0 4px;color:var(--color-text-secondary);font-size:.82rem;text-transform:uppercase}.brandkit-card{max-width:640px}.brandkit-preview{border:1px solid rgba(255,122,61,.28);border-radius:var(--radius-medium);padding:10px;background:#10151fa6}.brandkit-preview svg{width:100%;height:auto;display:block}.brandkit-actions{display:flex;flex-wrap:wrap;gap:10px}.brandkit-colors{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.brandkit-color{display:grid;grid-template-columns:20px 80px minmax(0,1fr);align-items:center;gap:10px;font-size:.78rem}.brandkit-swatch{width:18px;height:18px;border-radius:4px;border:1px solid rgba(244,241,232,.4)}.error-boundary-actions{display:flex;gap:16px;align-items:center;justify-content:flex-start}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes dissolveIn{0%{opacity:0}to{opacity:1}}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes notePulse{0%,to{opacity:.8}50%{opacity:.4}}@media (max-width: 1200px){.app-shell{width:min(100%,1100px);padding:var(--space-xl) var(--space-lg) var(--space-2xl);gap:var(--space-lg)}.zone-top{width:min(1000px,100%)}.zone-center,.zone-bottom,.wave-candy,.keyboard-surface,.controls-surface{width:min(100%,96vw)}}@media (max-width: 900px){:root{--wave-candy-height: clamp(140px, 24vh, 190px)}.app-shell{width:100%;max-width:none;padding:max(12px,calc(env(safe-area-inset-top,0px) + 8px)) var(--space-sm) calc(88px + env(safe-area-inset-bottom,0px));gap:var(--space-md)}.zone-top,.zone-center,.zone-bottom,.wave-candy,.keyboard-surface,.controls-surface{width:100%;max-width:100%}.zone-top{grid-template-columns:1fr;padding:0 0 14px;gap:12px;border-radius:0}.brand-block{width:auto;align-items:flex-start}.brand-title{font-size:1rem;letter-spacing:.02em}.header-controls{width:100%;align-items:flex-start;gap:10px;justify-content:flex-start}.header-nav{width:100%;gap:14px}.header-actions{width:100%;padding-left:0;padding-top:10px;border-left:0;border-top:1px solid rgba(244,241,232,.08);justify-content:flex-start;flex-wrap:wrap}.header-controls .button-icon{width:42px;height:42px;font-size:1rem}.zone-center{gap:var(--space-md);padding:0}.zone-bottom{padding-bottom:0}.wave-candy{padding:10px}.wave-candy--raylib{height:var(--wave-candy-height);min-height:var(--wave-candy-height)}.wave-candy-gear{top:8px;right:8px;font-size:.76rem}.birds-eye-radar{padding:8px}.birds-eye-radar__stage{min-height:clamp(210px,30vh,290px);border-radius:12px}.keyboard-surface{min-height:240px;max-height:none;padding:12px;gap:10px;border-radius:12px}.keyboard-header{flex-wrap:wrap;row-gap:6px;-moz-column-gap:10px;column-gap:10px;font-size:.72rem;letter-spacing:.1em}.keyboard-legend{font-size:.63rem;letter-spacing:.08em}.keyboard-region{gap:8px}.white-keys{min-height:clamp(110px,28vw,145px)}.key-white .note-label,.key-white .key-label{font-size:clamp(.48rem,1.7vw,.62rem)}.key-black{margin-top:6px;min-width:clamp(19px,5vw,30px);min-height:clamp(40px,13vw,64px);border-radius:0 0 10px 10px}.keyboard-meta{font-size:.62rem;letter-spacing:.1em;padding:4px 8px}.keyboard-hints{gap:8px;font-size:.56rem;letter-spacing:.06em;flex-wrap:wrap;justify-content:flex-start;opacity:.65}.warmup-indicator{position:static;max-width:100%;width:-moz-fit-content;width:fit-content;padding:8px 10px;gap:8px;font-size:.6rem;letter-spacing:.08em;box-shadow:none}.controls-surface{padding:12px;grid-template-columns:1fr;gap:12px;border-radius:12px}.controls-panel,.controls-panel.wide{gap:12px}.panel{padding:12px;gap:12px;border-radius:12px}.control-section-shell{padding:0 0 14px;border-radius:0;gap:10px}.control-section-body{gap:12px}.effect-macro-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.effect-macro-dial__touch,.effect-macro-dial__canvas{width:min(var(--dial-size, 96px),96px);height:min(var(--dial-size, 96px),96px)}.controls-heading{font-size:.78rem;letter-spacing:.03em}.label-stack{gap:8px;align-items:center}.slider-group{gap:8px}.slider-grid{grid-template-columns:1fr}.slider-description{font-size:.68rem;letter-spacing:.02em}.toggle-row{font-size:.68rem;letter-spacing:.05em}.waveform-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.waveform-grid--inline{grid-template-columns:repeat(2,minmax(0,1fr))}.waveform-button{min-height:56px;padding:12px;font-size:.72rem;letter-spacing:.02em}.waveform-button--compact{min-height:42px;padding:10px 12px;font-size:.66rem;letter-spacing:.02em}.waveform-button.is-active{transform:none}.panel-footer{flex-direction:column}.shortcuts-overlay{padding:16px}.shortcuts-card{padding:16px;gap:16px}.shortcuts-grid{grid-template-columns:1fr;gap:10px}}@media (max-width: 700px){.zone-top{display:flex;flex-direction:column;align-items:flex-start}.brand-title{width:auto;text-align:left}.header-controls{width:100%;justify-content:flex-start}.keyboard-hints{display:none}.waveform-grid{grid-template-columns:1fr}.waveform-grid--inline{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 520px){.app-shell{padding-right:8px;padding-left:8px;padding-bottom:calc(82px + env(safe-area-inset-bottom,0px))}.zone-top{padding-bottom:12px}.brand-title{font-size:.92rem;letter-spacing:.02em}.header-controls .button-icon{width:40px;height:40px}.wave-candy--raylib{height:clamp(120px,22vh,160px);min-height:clamp(120px,22vh,160px)}.birds-eye-radar__stage{min-height:clamp(144px,25vh,194px)}.keyboard-surface{padding:10px;border-radius:10px}.keyboard-header{font-size:.68rem;letter-spacing:.08em}.keyboard-legend{font-size:.58rem}.white-keys{border-radius:12px}.key-black{min-width:clamp(17px,5.5vw,24px);min-height:clamp(34px,14vw,50px)}.controls-surface{padding:10px;gap:10px}.panel{padding:10px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}:root{--color-core-ink: #1d2021;--color-core-paper: #ebdbb2;--color-core-accent: #d79921;--color-bg-sky: #1d2021;--color-bg-deep: #1d2021;--color-primary-soft: rgba(29, 32, 33, .94);--color-primary-dim: rgba(29, 32, 33, .98);--color-accent-sheen: rgba(215, 153, 33, .18);--color-accent-sheen-strong: rgba(215, 153, 33, .4);--color-accent-silver: rgba(215, 153, 33, .12);--color-glimmer-one: #ebdbb2;--color-glimmer-two: rgba(235, 219, 178, .9);--color-glimmer-three: rgba(235, 219, 178, .58);--color-text-primary: rgba(235, 219, 178, .96);--color-text-secondary: rgba(235, 219, 178, .72);--color-text-tertiary: rgba(235, 219, 178, .5);--color-key-white: rgba(235, 219, 178, .96);--color-key-active: rgba(215, 153, 33, .34);--color-key-black: rgba(60, 56, 54, .98);--color-key-black-active: rgba(214, 93, 14, .54);--color-surface: rgba(40, 40, 40, .92);--color-surface-intense: rgba(50, 48, 47, .96);--color-surface-soft: rgba(40, 40, 40, .84);--color-chip: rgba(60, 56, 54, .9);--border-glass: 1px solid rgba(168, 153, 132, .22);--border-glass-subtle: 1px solid rgba(168, 153, 132, .16)}body{background:var(--color-bg-deep)}.simple-background,.gradient-layer{background:var(--color-bg-deep)!important}.zone-top,.panel,.panel.elevated,.controls-surface,.keyboard-surface,.birds-eye-radar,.birds-eye-radar__stage,.shortcuts-card,.shortcuts-overlay,.app-notice,.button-icon,.button-primary,.waveform-button,.segment-button,.control-select{background-image:none!important}.zone-top,.panel,.panel.elevated,.controls-surface,.shortcuts-card{background:#282828eb!important;border-color:#a899842e!important}.button-icon,.button-primary,.waveform-button,.segment-button,.button-link,.control-select{background:#3c3836d6!important;border:1px solid rgba(168,153,132,.18)!important;color:var(--color-text-primary)!important;box-shadow:none!important}.button-link{display:inline-flex;align-items:center}.button-primary,.segment-button.is-active,.waveform-button[aria-pressed=true]{background:#d7992133!important;border-color:#d7992152!important}.keyboard-surface,.birds-eye-radar,.birds-eye-radar__stage,.wave-candy__canvas,.candy-canvas{background:#1d2021f5!important;border-color:#a899842e!important;box-shadow:none!important}.white-keys{background:#3c3836fa!important;box-shadow:none!important}.key-white{background:#ebdbb2!important;color:#1d2021!important;box-shadow:none!important}.key-white.active,.key-white[data-active=true]{background:#d79921!important}.key-black{background:#3c3836!important;box-shadow:none!important}.key-black.active,.key-black[data-active=true]{background:#d65d0e!important}input[type=range]{background:#a8998429!important}input[type=range]::-webkit-slider-thumb{background:#d79921!important;border-color:#ebdbb2cc!important;box-shadow:none!important}h1,h2,h3,h4,.brand-title{letter-spacing:.03em}.zone-top{background:none!important;border:0!important;border-bottom:1px solid rgba(168,153,132,.18)!important;box-shadow:none!important}.header-actions{border-left-color:#a899842e}.button-link{background:transparent!important;border:0!important}.button-link--nav{border-bottom:1px solid transparent!important}.button-link--nav:hover,.button-link--nav:focus-visible,.button-link--nav.is-active{border-bottom-color:#d7992152!important}.button-link--quiet{background:#3c3836b8!important;border:1px solid rgba(168,153,132,.18)!important}.header-controls .button-icon{background:transparent!important;border-color:transparent!important}.header-controls .button-icon:hover{background:#3c3836d6!important;border-color:#a899842e!important}.waveform-button{background:#3c383680!important;border:1px solid transparent!important}.waveform-button.is-active{background:#d7992133!important;border-color:#d7992152!important}@media (max-width: 900px){.header-actions{border-left:0;border-top:1px solid rgba(168,153,132,.18)}}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com
 */*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.\!container{width:100%!important}.container{width:100%}@media (min-width: 640px){.\!container{max-width:640px!important}.container{max-width:640px}}@media (min-width: 768px){.\!container{max-width:768px!important}.container{max-width:768px}}@media (min-width: 1024px){.\!container{max-width:1024px!important}.container{max-width:1024px}}@media (min-width: 1280px){.\!container{max-width:1280px!important}.container{max-width:1280px}}@media (min-width: 1536px){.\!container{max-width:1536px!important}.container{max-width:1536px}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.visible{visibility:visible}.static{position:static}.absolute{position:absolute}.relative{position:relative}.block{display:block}.inline{display:inline}.table{display:table}.hidden{display:none}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.resize{resize:both}.uppercase{text-transform:uppercase}.lowercase{text-transform:lowercase}.shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.blur{--tw-blur: blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}