@import "https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500&display=swap";:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ink:#f4f7f5;--muted:#f4f7f58c;--line:#f4f7f524;--accent:#00d4be;--warm:#ff7a38;--glass:#080a0e8c;color:var(--ink);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#05060a;font-family:Sora,sans-serif;font-weight:500;line-height:1.4}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:#05060a;min-width:320px;overflow:hidden}button,input{font:inherit}.app{width:100%;height:100%;min-height:100dvh;position:relative;overflow:hidden}.viz-canvas{z-index:0;opacity:0;pointer-events:none;width:100%;height:100%;display:block;position:absolute;inset:0}.viz-canvas.is-active{opacity:1}.viz-canvas-meta{z-index:1;background:0 0}.viz-canvas-export{pointer-events:none;z-index:-1;opacity:0!important}.viz-punch{z-index:0;transform-origin:50%;will-change:transform;position:absolute;inset:0}.app.chrome-hidden .chrome{opacity:0;pointer-events:none;transition:opacity .35s}.app:not(.chrome-hidden) .chrome{transition:opacity .35s}.chrome-peek{z-index:5;border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);width:2.4rem;height:2.4rem;color:var(--ink);cursor:pointer;border-radius:50%;font-family:IBM Plex Mono,monospace;font-size:.75rem;position:fixed;top:1rem;right:1rem}.ghost-btn{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--ink);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;border-radius:999px;padding:.4rem .7rem;font-size:.68rem;font-weight:600;transition:border-color .2s,background .2s,transform .2s}.ghost-btn:hover:not(:disabled){background:#00d4be1a;border-color:#00d4be80;transform:translateY(-1px)}.ghost-btn.is-hot,.app.is-recording .ghost-btn.is-hot{color:#ffb4b4;background:#ff3c3c33;border-color:#ff5050b3}.ghost-btn:disabled{opacity:.55;cursor:wait}.ghost-btn.is-locked{color:#ffd4b8;border-color:#ff7a3873}.settings-action-btn.is-locked{color:#ffdcc4;background:#ff7a3829;border-color:#ff7a3880}.unlock-overlay{z-index:30;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:radial-gradient(at 50% 20%,#00d4be1f,#0000 55%),#020306b8;justify-content:center;align-items:center;padding:1.25rem;animation:.25s both export-fade;display:flex;position:fixed;inset:0}.unlock-card{background:linear-gradient(160deg,#12161cf5,#080a0ef0);border:1px solid #ffffff1f;border-radius:18px;width:min(420px,100%);padding:1.35rem 1.35rem 1.15rem;animation:.3s both rise;box-shadow:0 24px 60px #00000080}.unlock-kicker{letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0 0 .45rem;font-family:IBM Plex Mono,monospace;font-size:.68rem}.unlock-title{letter-spacing:-.02em;margin:0 0 .55rem;font-size:1.45rem;font-weight:700;line-height:1.15}.unlock-body{color:var(--muted);margin:0 0 1rem;font-size:.92rem;line-height:1.45}.unlock-perks{gap:.45rem;margin:0 0 1.15rem;padding:0;list-style:none;display:grid}.unlock-perks li{color:#f4f7f5d1;padding-left:1rem;font-size:.82rem;position:relative}.unlock-perks li:before{content:"";background:var(--accent);border-radius:50%;width:.4rem;height:.4rem;position:absolute;top:.45em;left:0;box-shadow:0 0 10px #00d4be8c}.unlock-price-row{align-items:baseline;gap:.55rem;margin-bottom:.9rem;display:flex}.unlock-price{letter-spacing:-.03em;font-size:1.7rem;font-weight:750}.unlock-price-note{letter-spacing:.04em;color:var(--muted);font-family:IBM Plex Mono,monospace;font-size:.68rem}.unlock-cta{color:#04110f;letter-spacing:.01em;cursor:pointer;background:linear-gradient(90deg,#00d4be,#5cffd4);border:0;border-radius:999px;width:100%;padding:.78rem 1rem;font-weight:700}.unlock-cta:disabled{opacity:.55;cursor:not-allowed}.unlock-cta:not(:disabled):hover{filter:brightness(1.05)}.unlock-fineprint{text-align:center;color:var(--muted);margin:.7rem 0 .35rem;font-size:.7rem;line-height:1.4}.unlock-dismiss{color:#f4f7f5b3;cursor:pointer;background:0 0;border:0;width:100%;margin-top:.15rem;padding:.55rem;font-size:.78rem;display:block}.unlock-dismiss:hover{color:var(--ink)}.toast{z-index:6;border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);letter-spacing:.04em;pointer-events:none;white-space:nowrap;border-radius:999px;padding:.55rem .95rem;font-family:IBM Plex Mono,monospace;font-size:.72rem;animation:.25s both toast-rise;position:fixed;bottom:clamp(5.5rem,12vh,7rem);left:50%;transform:translate(-50%)}@keyframes toast-rise{0%{opacity:0;transform:translate(-50%)translateY(14px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.export-overlay{z-index:20;pointer-events:none;background:linear-gradient(#00000026 0%,#0000008c 100%);justify-content:center;align-items:flex-end;padding:1.5rem;animation:.3s both export-fade;display:flex;position:fixed;inset:0}.export-top-bar{background:linear-gradient(90deg,#ff4d4d,#ff9a4d,#ffe08a);height:4px;transition:width .12s linear;position:absolute;top:0;left:0;box-shadow:0 0 18px #ff5a3c8c}.export-card{-webkit-backdrop-filter:blur(22px)saturate(1.2);backdrop-filter:blur(22px)saturate(1.2);pointer-events:none;background:#0a0a0ec7;border:1px solid #ffffff1f;border-radius:16px;width:min(420px,100%);padding:1.1rem 1.2rem 1.15rem;animation:.35s both rise;box-shadow:0 18px 50px #00000073}.export-rec{letter-spacing:.08em;text-transform:uppercase;color:#ffe8e0;align-items:center;gap:.55rem;font-family:IBM Plex Mono,monospace;font-size:.78rem;display:flex}.export-rec-dot{background:#ff4d4d;border-radius:50%;width:.55rem;height:.55rem;animation:1s ease-in-out infinite export-pulse;box-shadow:0 0 10px #ff4646e6}.export-rec-dot.is-done{background:#7dffb3;animation:none;box-shadow:0 0 10px #7dffb3cc}.export-copy{color:#ffffffb8;margin:.55rem 0 .95rem;font-size:.86rem;line-height:1.4}.export-meter{background:#ffffff14;border:1px solid #ffffff0f;border-radius:999px;height:8px;overflow:hidden}.export-meter-fill{border-radius:inherit;background:linear-gradient(90deg,#ff4d4d 0%,#ff8a4a 55%,#ffd36a 100%);height:100%;transition:width .12s linear;box-shadow:0 0 16px #ff643c73}.export-meta{letter-spacing:.04em;color:#ffffff8c;justify-content:space-between;margin-top:.65rem;font-family:IBM Plex Mono,monospace;font-size:.72rem;display:flex}.app.is-recording:after{content:"";z-index:4;pointer-events:none;position:fixed;inset:0;box-shadow:inset 0 0 0 2px #ff464666}@keyframes export-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.85)}}@keyframes export-fade{0%{opacity:0}to{opacity:1}}.chrome{z-index:2;pointer-events:none;flex-direction:column;min-height:100dvh;display:flex;position:relative}.chrome>*{pointer-events:auto}.landing{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;padding:clamp(1.5rem,5vw,3rem);animation:.9s both rise;display:flex}.brand{letter-spacing:-.06em;background:linear-gradient(115deg,#fff 10%,#00d4be 48%,#ff7a38 92%);color:#0000;filter:drop-shadow(0 20px 60px #00d4be40);-webkit-background-clip:text;background-clip:text;margin:0;font-size:clamp(4.5rem,18vw,9rem);font-weight:800;line-height:.85;animation:5s ease-in-out infinite brand-pulse}.tagline{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:1.1rem 0 2.4rem;font-family:IBM Plex Mono,monospace;font-size:clamp(.8rem,2vw,.95rem);animation:.9s .12s both rise}@keyframes brand-pulse{0%,to{filter:drop-shadow(0 20px 60px #00d4be38);transform:scale(1)}50%{filter:drop-shadow(0 28px 80px #ff7a3847);transform:scale(1.015)}}@keyframes rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.topbar{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:.75rem 1rem;padding:1.1rem clamp(1rem,3vw,2rem);animation:.5s both rise;display:grid}.brand-mark{letter-spacing:-.04em;background:linear-gradient(120deg,#fff,#00d4be);color:#0000;-webkit-background-clip:text;background-clip:text;justify-self:start;margin:0;font-size:1.15rem;font-weight:800}.topbar-center{flex-wrap:wrap;justify-content:center;justify-self:center;align-items:center;gap:.55rem;display:flex}.topbar-picker{position:relative}.topbar-modes{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(14px);border-radius:999px;align-items:center;gap:.1rem;padding:.18rem .22rem;display:flex;box-shadow:0 6px 22px #0000002e}.topbar-modes-step{width:1.7rem;height:1.7rem;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:50%;justify-content:center;align-items:center;font-size:1.05rem;line-height:1;transition:background .2s,color .2s;display:inline-flex}.topbar-modes-step:hover{color:#fff;background:#00d4be24}.topbar-modes-main{min-width:4.75rem;color:inherit;cursor:pointer;background:0 0;border:0;border-radius:999px;flex-direction:column;align-items:center;gap:.22rem;padding:.22rem .55rem .28rem;transition:background .2s;display:flex}.topbar-modes-main:hover,.topbar-picker.is-open .topbar-modes-main{background:#00d4be1a}.topbar-modes-name{letter-spacing:.08em;text-transform:uppercase;color:var(--ink);white-space:nowrap;font-size:.66rem;font-weight:700;line-height:1}.topbar-modes-dots{align-items:center;gap:.32rem;display:flex}.topbar-modes-dot{background:#ffffff42;border-radius:50%;width:.34rem;height:.34rem;transition:width .2s,border-radius .2s,background .2s,box-shadow .2s}.topbar-modes-dot.is-active{background:var(--accent);border-radius:999px;width:.72rem;box-shadow:0 0 10px #00d4be8c}.topbar-palette{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(14px);border-radius:999px;align-items:center;gap:.1rem;padding:.18rem .22rem;display:flex;box-shadow:0 6px 22px #0000002e}.topbar-palette-main{min-width:4.5rem;color:inherit;cursor:pointer;background:0 0;border:0;border-radius:999px;align-items:center;gap:.4rem;padding:.28rem .55rem;transition:background .2s;display:flex}.topbar-palette-main:hover,.topbar-picker.is-open .topbar-palette-main{background:#00d4be1a}.topbar-palette-name{letter-spacing:.08em;text-transform:uppercase;color:var(--ink);white-space:nowrap;font-size:.66rem;font-weight:700;line-height:1}.palette-swatch.is-compact{border-radius:.35rem;width:1.35rem;height:1.35rem}.topbar-stage-btn{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(14px);min-height:2.35rem;color:var(--ink);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;border-radius:999px;justify-content:center;align-items:center;padding:.35rem .85rem;font-size:.66rem;font-weight:700;transition:border-color .2s,background .2s,color .2s;display:inline-flex;box-shadow:0 6px 22px #0000002e}.topbar-stage-btn:hover{background:#00d4be1a;border-color:#00d4be73}.topbar-picker.is-open .topbar-stage-btn,.panel-menu.is-open .topbar-stage-btn{background:#00d4be1f;border-color:#00d4be8c}.topbar-stage-btn.is-hot{color:#ffb4b4;background:#ff3c3c33;border-color:#ff5050b3}.panel-pop-center{width:min(20rem,84vw);animation:.2s both rise-center;left:50%;right:auto;transform:translate(-50%)}@keyframes rise-center{0%{opacity:0;transform:translate(-50%)translateY(10px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.topbar-actions{flex-wrap:wrap;justify-content:flex-end;justify-self:end;align-items:center;gap:.45rem;display:flex}.dock{margin-top:auto;padding:0 clamp(.85rem,3vw,1.75rem) clamp(.85rem,3vw,1.5rem);animation:.55s 50ms both rise}.dock-error{z-index:4;position:fixed;bottom:4.5rem;left:50%;transform:translate(-50%)}.player-dock{z-index:3;pointer-events:none;padding:0 clamp(.85rem,3vw,1.75rem);position:fixed;bottom:0;left:0;right:0}.player-dock-sheet{pointer-events:auto;will-change:transform;flex-direction:column;transition:transform .5s cubic-bezier(.22,1,.36,1);display:flex;transform:translateY(calc(100% - 2.65rem))}.player-dock:hover .player-dock-sheet,.player-dock:focus-within .player-dock-sheet{transform:translateY(0)}.player-dock-peek{border:1px solid var(--line);-webkit-backdrop-filter:blur(18px);background:linear-gradient(#0c0e12e0,#080a0eb8);border-bottom:0;border-radius:1.15rem 1.15rem 0 0;justify-content:center;align-items:center;gap:.65rem;min-height:2.65rem;padding:.45rem 1rem .55rem;display:flex;box-shadow:0 -12px 40px #00000059}.player-dock-grip{opacity:.85;background:linear-gradient(90deg,#00d4be,#ff7a38);border-radius:999px;width:2.4rem;height:4px;animation:2.4s ease-in-out infinite grip-pulse;box-shadow:0 0 12px #00d4be59}.player-dock-peek-title{text-overflow:ellipsis;white-space:nowrap;letter-spacing:-.01em;max-width:40vw;font-size:.78rem;font-weight:600;overflow:hidden}.player-dock-peek-artist{text-overflow:ellipsis;white-space:nowrap;letter-spacing:.04em;text-transform:uppercase;max-width:24vw;color:var(--muted);font-family:IBM Plex Mono,monospace;font-size:.65rem;overflow:hidden}.player-dock-peek-hint{letter-spacing:.12em;text-transform:uppercase;color:#f4f7f559;margin-left:auto;font-family:IBM Plex Mono,monospace;font-size:.58rem}.player-dock:hover .player-dock-peek-hint,.player-dock:focus-within .player-dock-peek-hint{opacity:0}@keyframes grip-pulse{0%,to{opacity:.7;transform:scaleX(1)}50%{opacity:1;transform:scaleX(1.12)}}.player-dock-panel{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(20px)saturate(1.2);overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#ffffff38 transparent;border-top:0;border-radius:0 0 1.15rem 1.15rem;flex-direction:column;gap:.75rem;max-height:min(40vh,18rem);padding:.85rem 1rem 1.1rem;display:flex;overflow:hidden auto;box-shadow:0 20px 60px #0006}.player-dock-panel::-webkit-scrollbar{width:8px}.player-dock-panel::-webkit-scrollbar-track{background:0 0}.player-dock-panel::-webkit-scrollbar-thumb{background:#ffffff2e padding-box content-box;border:2px solid #0000;border-radius:999px}.player-dock-panel::-webkit-scrollbar-thumb:hover{background:#00d4be73 padding-box content-box;border:2px solid #0000}.meta-fields{grid-template-columns:1.3fr 1.1fr 1.1fr .7fr;gap:.55rem;display:grid}.meta-field{flex-direction:column;gap:.28rem;min-width:0;display:flex}.meta-field-wide{grid-column:1/-1}.meta-layout-actions{flex-wrap:wrap;grid-column:1/-1;align-items:center;gap:.5rem;margin-top:.15rem;display:flex}.meta-layout-toggle,.meta-layout-reset{appearance:none;color:#ffffffd1;letter-spacing:.04em;cursor:pointer;background:#ffffff0f;border:1px solid #ffffff24;border-radius:999px;padding:.4rem .85rem;font-family:IBM Plex Mono,monospace;font-size:.68rem}.meta-layout-toggle:hover:not(:disabled),.meta-layout-reset:hover{color:#fff;background:#00d4be29;border-color:#00d4be66}.meta-layout-toggle.is-active{color:#fff;background:#00d4be38;border-color:#00d4be8c}.meta-layout-toggle:disabled{opacity:.4;cursor:not-allowed}.meta-layout-actions-hint{color:var(--muted);letter-spacing:.04em;font-family:IBM Plex Mono,monospace;font-size:.58rem}.meta-layout-overlay{z-index:8;pointer-events:none;position:absolute;inset:0}.meta-layout-overlay.is-snapping .meta-layout-grid{opacity:.55}.meta-layout-grid{opacity:0;pointer-events:none;background-image:linear-gradient(90deg,#ffffff12 1px,#0000 1px),linear-gradient(#ffffff12 1px,#0000 1px);background-size:5% 2.5%;transition:opacity .15s;position:absolute;inset:0}.meta-layout-guides{pointer-events:none;position:absolute;inset:0}.meta-layout-guide-x,.meta-layout-guide-y{background:#00d4be8c;position:absolute}.meta-layout-guide-x{width:1px;top:0;bottom:0;transform:translate(-.5px)}.meta-layout-guide-y{height:1px;left:0;right:0;transform:translateY(-.5px)}.meta-layout-handle-chip{box-sizing:border-box;pointer-events:auto;cursor:grab;touch-action:none;color:inherit;font:inherit;background:#00d4be24;border:1.5px solid #00d4bebf;border-radius:.35rem;align-items:center;gap:.35rem;margin-top:-.35rem;padding:.25rem .45rem;display:inline-flex;position:absolute;transform:translate(-50%,-100%);box-shadow:0 0 0 1px #00000059}.meta-layout-handle-chip:hover,.meta-layout-handle-chip.is-active{background:#00d4be3d;border-color:#ffffffd9}.meta-layout-handle-chip.is-active{cursor:grabbing}.meta-layout-handle{color:#ffffffb3;letter-spacing:-.12em;-webkit-user-select:none;user-select:none;font-size:.7rem;line-height:1}.meta-layout-label{letter-spacing:.08em;text-transform:uppercase;color:#ffffffd9;-webkit-user-select:none;user-select:none;font-family:IBM Plex Mono,monospace;font-size:.55rem}.meta-layout-hint{color:#ffffffc7;letter-spacing:.04em;white-space:nowrap;pointer-events:none;background:#0000008c;border:1px solid #ffffff1f;border-radius:999px;margin:0;padding:.35rem .7rem;font-family:IBM Plex Mono,monospace;font-size:.62rem;position:absolute;bottom:1.1rem;left:50%;transform:translate(-50%)}.meta-layout-hint kbd{font:inherit;background:#ffffff14;border:1px solid #fff3;border-radius:.25rem;padding:.05rem .3rem}.viz-punch.is-layout-editing{cursor:default}.meta-artists,.meta-customs{flex-direction:column;grid-column:1/-1;gap:.35rem;min-width:0;display:flex}.meta-customs-head,.meta-artists-head{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.meta-customs-head span,.meta-artists-head span{letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-family:IBM Plex Mono,monospace;font-size:.58rem}.meta-customs-empty{color:var(--muted);letter-spacing:.02em;margin:0;font-family:IBM Plex Mono,monospace;font-size:.68rem}.meta-artist-add,.meta-artist-remove{border:1px solid var(--line);width:1.65rem;height:1.65rem;color:var(--ink);cursor:pointer;background:#ffffff0a;border-radius:.45rem;flex-shrink:0;justify-content:center;align-items:center;font-size:1rem;line-height:1;transition:border-color .2s,background .2s,color .2s;display:inline-flex}.meta-artist-add:hover:not(:disabled),.meta-artist-remove:hover{background:#00d4be1f;border-color:#00d4be8c}.meta-artist-add:disabled{opacity:.35;cursor:not-allowed}.meta-artist-row{align-items:center;gap:.4rem;display:flex}.meta-artist-row input{border:1px solid var(--line);min-width:0;color:var(--ink);background:#ffffff0a;border-radius:.55rem;outline:none;flex:1;padding:.5rem .65rem;font-size:.8rem;transition:border-color .2s,background .2s}.meta-artist-row input::placeholder{color:#f4f7f547}.meta-artist-row input:focus{background:#00d4be0f;border-color:#00d4be8c}.meta-field span{letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-family:IBM Plex Mono,monospace;font-size:.58rem}.meta-field input{border:1px solid var(--line);width:100%;color:var(--ink);background:#ffffff0a;border-radius:.55rem;outline:none;padding:.5rem .65rem;font-size:.8rem;transition:border-color .2s,background .2s}.meta-field input::placeholder{color:#f4f7f547}.meta-field input:focus{background:#00d4be0f;border-color:#00d4be8c}.app.chrome-hidden .player-dock{opacity:0;pointer-events:none}.carousel-hint{letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:1.25rem 0 0;font-family:IBM Plex Mono,monospace;font-size:.68rem;animation:.9s .35s both rise}.viz-carousel{pointer-events:none;z-index:3;justify-content:space-between;align-items:center;gap:.75rem;padding:0 clamp(.5rem,2vw,1.25rem);display:flex;position:absolute;top:50%;left:0;right:0;transform:translateY(-50%)}.viz-carousel>*{pointer-events:auto}.viz-arrow{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(14px);width:3rem;height:3rem;color:var(--ink);cursor:pointer;border-radius:50%;flex-shrink:0;font-size:1.75rem;line-height:1;transition:transform .2s,border-color .2s,background .2s}.viz-arrow:hover{background:#00d4be1f;border-color:#00d4be8c;transform:scale(1.08)}.viz-mode{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(16px);text-align:center;border-radius:1rem;flex-direction:column;align-items:center;gap:.25rem;max-width:min(70vw,16rem);padding:.55rem 1rem .65rem;animation:.35s both mode-in;display:flex}.viz-mode-name{letter-spacing:-.02em;font-size:.95rem;font-weight:700}.viz-mode-blurb{letter-spacing:.02em;color:var(--muted);font-family:IBM Plex Mono,monospace;font-size:.62rem}.viz-dots{gap:.4rem;margin-top:.35rem;display:flex}.viz-dot{cursor:pointer;background:#ffffff38;border:0;border-radius:50%;width:7px;height:7px;padding:0;transition:transform .2s,background .2s}.viz-dot.is-active{background:linear-gradient(120deg,#00d4be,#ff7a38);transform:scale(1.25)}@keyframes mode-in{0%{opacity:0;transform:translateY(6px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}.dropzone-stack{flex-direction:column;align-items:center;gap:1.35rem;width:min(100%,32rem);animation:.9s .2s both rise;display:flex}.dropzone{-webkit-backdrop-filter:blur(18px);cursor:pointer;background:linear-gradient(160deg,#ffffff12,#ffffff05);border:2px dashed #ffffff38;border-radius:1.35rem;flex-direction:column;justify-content:center;align-items:center;gap:.55rem;width:min(100%,32rem);min-height:13.5rem;padding:2.4rem 1.75rem;transition:border-color .25s,background .25s,transform .25s,box-shadow .25s;animation:.9s .2s both rise;display:flex;position:relative;box-shadow:0 24px 80px #00000059}.dropzone-stack .dropzone{width:100%;animation:none}.dropzone:hover,.dropzone.is-dragging{background:linear-gradient(160deg,#00d4be24,#ff7a3812);border-style:dashed;border-color:#00d4beb3;transform:translateY(-2px);box-shadow:0 30px 90px #00d4be24}.dropzone.is-dragging{background:linear-gradient(160deg,#00d4be33,#ff7a381a);border-color:#00d4be}.dropzone.is-dragging .dropzone-icon-wrap{color:#00d4be;background:#00d4be2e;border-color:#00d4be73;transform:translateY(3px)}.dropzone.is-disabled{opacity:.5;cursor:not-allowed;transform:none}.dropzone.is-compact{width:auto;min-height:0;box-shadow:none;background:var(--glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-style:solid;border-width:1px;border-radius:999px;padding:.45rem .85rem;animation:none}.dropzone-icon-wrap{width:4.25rem;height:4.25rem;color:var(--accent);background:#00d4be14;border:1px solid #ffffff24;border-radius:50%;place-items:center;margin-bottom:.35rem;transition:transform .25s,color .25s,background .25s,border-color .25s;display:grid}.dropzone:hover .dropzone-icon-wrap{color:#00d4be;background:#00d4be24;border-color:#00d4be59}.dropzone-icon{display:block}.dropzone-kicker{letter-spacing:.16em;text-transform:uppercase;color:var(--accent);font-size:.78rem;font-weight:600}.dropzone-title{letter-spacing:-.02em;font-size:1.2rem;font-weight:700}.dropzone-hint{color:var(--muted);font-family:IBM Plex Mono,monospace;font-size:.72rem}.dropzone.is-compact .dropzone-hint{font-size:.68rem}.dropzone-demos{flex-direction:column;align-items:center;gap:.7rem;width:100%;display:flex}.dropzone-demos-label{letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-family:IBM Plex Mono,monospace;font-size:.68rem}.dropzone-demos-list{flex-wrap:wrap;justify-content:center;gap:.55rem;display:flex}.dropzone-demo{color:#04110f;letter-spacing:.02em;cursor:pointer;background:linear-gradient(120deg,#00d4be,#00a896 40%,#ff7a38);border:0;border-radius:999px;margin-top:0;padding:.7rem 1.2rem;font-size:.85rem;font-weight:700;transition:transform .2s,filter .2s}.dropzone-demo:hover:not(:disabled){filter:brightness(1.06);transform:scale(1.03)}.dropzone-demo:disabled{opacity:.6;cursor:wait}.panel-menu{position:relative}.panel-pop{z-index:8;border:1px solid var(--line);-webkit-backdrop-filter:blur(18px);background:#080a0ef0;border-radius:1rem;width:min(18.5rem,78vw);padding:.85rem;animation:.2s both rise;position:absolute;top:calc(100% + .45rem);right:0;box-shadow:0 18px 50px #00000073}.panel-pop-settings{width:min(26rem,92vw);max-height:min(78vh,40rem);overflow-y:auto}.panel-pop-credits{width:min(28rem,92vw);max-height:min(78vh,42rem);overflow-y:auto}.panel-pop-credits .meta-fields{margin-top:.15rem}.bg-tabs{background:#ffffff08;border:1px solid #ffffff14;border-radius:.7rem;grid-template-columns:1fr 1fr;gap:.3rem;margin-top:.7rem;padding:.25rem;display:grid}.bg-tab{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;background:0 0;border:0;border-radius:.5rem;justify-content:center;align-items:center;gap:.35rem;padding:.45rem .55rem;font-family:IBM Plex Mono,monospace;font-size:.62rem;font-weight:600;transition:color .2s,background .2s;display:inline-flex;position:relative}.bg-tab:hover{color:var(--ink)}.bg-tab.is-active{color:var(--ink);background:#00d4be24}.bg-tab-dot{background:var(--accent);border-radius:50%;width:.35rem;height:.35rem;box-shadow:0 0 0 2px #00d4be2e}.bg-color-field .palette-custom-controls{margin-top:.15rem}.bg-fill-preview{border:1px solid var(--line);border-radius:.65rem;height:2.75rem;margin-top:.7rem}.settings-section{border-top:1px solid #ffffff14;margin-top:1rem;padding-top:.85rem}.settings-section:first-of-type{border-top:0;margin-top:.65rem;padding-top:0}.settings-section-title{letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 .45rem;font-family:IBM Plex Mono,monospace;font-size:.62rem}.settings-inline-blurb{margin:0 0 .55rem}.mode-list{flex-direction:column;gap:.35rem;margin:0;padding:0;list-style:none;display:flex}.mode-option{border:1px solid var(--line);width:100%;color:var(--ink);text-align:left;cursor:pointer;background:#ffffff08;border-radius:.7rem;justify-content:space-between;align-items:center;gap:.65rem;padding:.55rem .65rem;transition:border-color .2s,background .2s;display:flex}.mode-option:hover{background:#00d4be14;border-color:#00d4be73}.mode-option.is-active{background:#00d4be1f;border-color:#00d4be8c}.mode-option-copy{flex-direction:column;gap:.12rem;min-width:0;display:flex}.mode-option-name{letter-spacing:-.01em;font-size:.84rem;font-weight:700}.mode-option-blurb{color:var(--muted);font-family:IBM Plex Mono,monospace;font-size:.58rem}.mode-option-state{letter-spacing:.06em;text-transform:uppercase;color:var(--accent);flex-shrink:0;font-family:IBM Plex Mono,monospace;font-size:.58rem}.settings-field{flex-direction:column;gap:.3rem;margin-top:.55rem;display:flex}.settings-field span{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-family:IBM Plex Mono,monospace;font-size:.58rem}.settings-field-head{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.settings-random-btn{border:1px solid var(--line);color:var(--muted);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;background:#ffffff0a;border-radius:999px;padding:.15rem .5rem;font-family:IBM Plex Mono,monospace;font-size:.58rem;font-weight:600;transition:border-color .2s,color .2s,background .2s}.settings-random-btn:hover{color:var(--ink);background:#00d4be1a;border-color:#00d4be73}.settings-field input,.settings-field textarea{border:1px solid var(--line);width:100%;color:var(--ink);resize:vertical;background:#ffffff0a;border-radius:.55rem;outline:none;padding:.5rem .65rem;font-size:.8rem}.settings-field input[type=range]{accent-color:var(--accent);background:0 0;border:0;padding:0}.settings-field input:focus,.settings-field textarea:focus{background:#00d4be0f;border-color:#00d4be8c}.settings-actions{flex-wrap:wrap;gap:.4rem;margin-top:.65rem;display:flex}.settings-action-btn{color:var(--ink);cursor:pointer;background:#00d4be24;border:1px solid #00d4be73;border-radius:.55rem;padding:.45rem .75rem;font-size:.75rem;font-weight:600}.settings-action-btn.is-ghost{border-color:var(--line);background:#ffffff0a}.settings-action-btn:disabled{opacity:.5;cursor:wait}.settings-error{color:#ff8f8f;margin:.5rem 0 0;font-family:IBM Plex Mono,monospace;font-size:.62rem;line-height:1.4}.settings-bg-preview{flex-direction:column;gap:.45rem;margin-top:.7rem;display:flex}.settings-bg-preview img{object-fit:cover;border:1px solid var(--line);border-radius:.65rem;width:100%;max-height:7rem}.panel-heading{letter-spacing:-.01em;margin:0;font-size:.78rem;font-weight:700}.panel-blurb{color:var(--muted);margin:.3rem 0 .7rem;font-family:IBM Plex Mono,monospace;font-size:.62rem;line-height:1.45}.panel-blurb kbd{border:1px solid var(--line);background:#ffffff0f;border-radius:.3rem;padding:.05rem .3rem;font-family:inherit;font-size:.58rem;display:inline-block}.track-list{flex-direction:column;gap:.4rem;max-height:min(50vh,22rem);margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.track-list-item{border:1px solid var(--line);width:100%;color:var(--ink);text-align:left;cursor:pointer;background:#ffffff08;border-radius:.7rem;grid-template-rows:auto auto;grid-template-columns:1fr auto;gap:.1rem .65rem;padding:.65rem .7rem;transition:border-color .2s,background .2s;display:grid}.track-list-item:hover:not(:disabled){background:#00d4be14;border-color:#00d4be73}.track-list-item.is-active{background:#00d4be1f;border-color:#00d4be8c}.track-list-item:disabled{opacity:.55;cursor:wait}.track-list-label{letter-spacing:-.01em;grid-column:1;font-size:.82rem;font-weight:700}.track-list-meta{color:var(--muted);grid-column:1;font-family:IBM Plex Mono,monospace;font-size:.6rem}.track-list-state{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);grid-area:1/2/span 2;align-self:center;font-family:IBM Plex Mono,monospace;font-size:.58rem}.track-list-item.is-active .track-list-state{color:var(--accent)}.palette-list{flex-direction:column;gap:.4rem;margin:0;padding:0;list-style:none;display:flex}.palette-option{border:1px solid var(--line);width:100%;color:var(--ink);text-align:left;cursor:pointer;background:#ffffff08;border-radius:.7rem;grid-template-columns:auto 1fr auto;align-items:center;gap:.65rem;padding:.55rem .65rem;transition:border-color .2s,background .2s;display:grid}.palette-option:hover{background:#00d4be14;border-color:#00d4be73}.palette-option.is-active{background:#00d4be1f;border-color:#00d4be8c}.palette-swatch{border:1px solid #ffffff1f;border-radius:.45rem;flex-shrink:0;grid-template-rows:1fr 1fr;grid-template-columns:1fr 1fr;width:1.85rem;height:1.85rem;display:grid;overflow:hidden}.palette-swatch span{display:block}.palette-option-copy{flex-direction:column;gap:.1rem;min-width:0;display:flex}.palette-option-name{letter-spacing:-.01em;font-size:.82rem;font-weight:700}.palette-option-id{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-family:IBM Plex Mono,monospace;font-size:.58rem}.palette-option-state{letter-spacing:.06em;text-transform:uppercase;color:var(--accent);font-family:IBM Plex Mono,monospace;font-size:.58rem}.palette-hint{color:var(--muted);margin:.75rem 0 0;font-family:IBM Plex Mono,monospace;font-size:.6rem;line-height:1.4}.palette-hint strong{color:var(--ink);font-weight:600}.panel-pop-palette{width:min(22rem,88vw);max-height:min(78vh,36rem);overflow-y:auto}.palette-custom{border-top:1px solid #ffffff14;flex-direction:column;gap:.65rem;margin-top:.85rem;padding-top:.75rem;display:flex}.palette-custom-title{letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0;font-family:IBM Plex Mono,monospace;font-size:.58rem}.palette-custom-grid{flex-direction:column;gap:.45rem;display:flex}.palette-custom-field{grid-template-columns:5.5rem 1fr;align-items:center;gap:.55rem;display:grid}.palette-custom-field>span:first-child{letter-spacing:.04em;color:#f4f7f5b8;font-family:IBM Plex Mono,monospace;font-size:.62rem}.palette-custom-controls{align-items:center;gap:.4rem;min-width:0;display:flex}.palette-custom-controls input[type=color]{cursor:pointer;background:0 0;border:1px solid #ffffff29;border-radius:.45rem;flex-shrink:0;width:2rem;height:2rem;padding:0;overflow:hidden}.palette-custom-controls input[type=color]::-webkit-color-swatch-wrapper{padding:0}.palette-custom-controls input[type=color]::-webkit-color-swatch{border:none;border-radius:.35rem}.palette-custom-controls input[type=color]::-moz-color-swatch{border:none;border-radius:.35rem}.palette-custom-hex{border:1px solid var(--line);min-width:0;color:var(--ink);letter-spacing:.04em;text-transform:uppercase;background:#ffffff0a;border-radius:.45rem;outline:none;flex:1;padding:.4rem .55rem;font-family:IBM Plex Mono,monospace;font-size:.72rem}.palette-custom-hex:focus{background:#00d4be0f;border-color:#00d4be8c}.palette-custom-reset{appearance:none;color:#ffffffbf;letter-spacing:.04em;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff24;border-radius:999px;align-self:flex-start;padding:.35rem .7rem;font-family:IBM Plex Mono,monospace;font-size:.62rem}.palette-custom-reset:hover{color:#fff;background:#00d4be1f;border-color:#00d4be66}.transport{-webkit-backdrop-filter:none;box-shadow:none;background:0 0;border:0;border-radius:0;grid-template-columns:auto 1fr;align-items:center;gap:.9rem;padding:0;display:grid}.transport-play{color:#04110f;cursor:pointer;background:linear-gradient(145deg,#00d4be,#ff7a38);border:0;border-radius:50%;width:3.1rem;height:3.1rem;font-size:.85rem;transition:transform .2s,filter .2s;box-shadow:0 8px 28px #00d4be59}.transport-play:hover:not(:disabled){filter:brightness(1.05);transform:scale(1.06)}.transport-play:disabled{opacity:.4;cursor:not-allowed}.transport-meta{flex-direction:column;gap:.35rem;min-width:0;display:flex}.transport-top{justify-content:space-between;align-items:baseline;gap:.75rem;display:flex}.transport-file{text-overflow:ellipsis;white-space:nowrap;letter-spacing:-.01em;font-size:.82rem;font-weight:600;overflow:hidden}.transport-bpm{letter-spacing:.04em;color:var(--muted);flex-shrink:0;font-family:IBM Plex Mono,monospace;font-size:.7rem}.transport-bpm.is-ready{color:var(--accent)}.transport-times{color:var(--muted);justify-content:space-between;font-family:IBM Plex Mono,monospace;font-size:.65rem;display:flex}.transport-timeline{touch-action:none;flex-direction:column;gap:.35rem;display:flex}.transport-timeline.is-zoomed .transport-lane{border-color:#00d4be73}.transport-view-meta{align-items:center;gap:.45rem;display:inline-flex}.transport-zoom-reset{appearance:none;color:#ffffffbf;letter-spacing:.04em;cursor:pointer;background:#ffffff0f;border:1px solid #ffffff24;border-radius:999px;padding:.12rem .45rem;font-family:IBM Plex Mono,monospace;font-size:.58rem}.transport-zoom-reset:hover{color:#fff;background:#00d4be2e;border-color:#00d4be66}.transport-lane{cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;background:#00000047;border:1px solid #ffffff1a;border-radius:.45rem;height:5rem;position:relative;overflow:hidden}.transport-lane.is-marking{cursor:crosshair;background:#00141873;border-color:#00d4be59}.transport-wave{pointer-events:none;z-index:1;width:100%;height:100%;position:absolute;inset:0}.transport-playhead{pointer-events:none;z-index:3;background:#fff;width:2px;margin-left:-1px;position:absolute;top:0;bottom:0;box-shadow:0 0 8px #ffffff73}.transport-marker{z-index:2;cursor:grab;border-radius:.35rem;justify-content:center;align-items:center;min-width:4px;display:flex;position:absolute;top:3px;bottom:3px;overflow:hidden}.transport-marker.is-buildup{background:linear-gradient(90deg,#ffaa4659,#ff78288c);border:1px solid #ffa0468c}.transport-marker.is-drop{background:linear-gradient(90deg,#00d4be59,#5a8cff8c);border:1px solid #00d4be8c}.transport-marker.is-stab{background:linear-gradient(90deg,#ff507866,#ffc85a8c);border:1px solid #ff6e8c99}.transport-marker.is-punch{background:linear-gradient(90deg,#ff283c8c,#ff8c28b3);border:1px solid #ff4632bf}.transport-marker.is-break{background:linear-gradient(90deg,#6e82aa52,#465a8280);border:1px solid #8ca0c880}.transport-marker.is-transition{background:linear-gradient(90deg,#aa64ff59,#50b4ff80);border:1px solid #a078ff8c}.transport-marker.is-leadin{background:linear-gradient(90deg,#ffd25a52,#ff963c80);border:1px solid #ffbe508c}.transport-marker.is-selected{z-index:4;box-shadow:0 0 0 1px #ffffff8c}.transport-marker.is-draft{opacity:.7;pointer-events:none}.transport-marker-label{letter-spacing:.06em;text-transform:uppercase;color:#ffffffd9;pointer-events:none;white-space:nowrap;padding:0 .35rem;font-family:IBM Plex Mono,monospace;font-size:.52rem}.transport-marker-edge{cursor:ew-resize;background:#fff3;border:0;width:8px;padding:0;position:absolute;top:0;bottom:0}.transport-marker-edge.is-start{border-radius:.3rem 0 0 .3rem;left:0}.transport-marker-edge.is-end{border-radius:0 .3rem .3rem 0;right:0}.transport-arrange{flex-wrap:wrap;align-items:center;gap:.35rem;margin-top:.15rem;display:flex}.arrange-tool{border:1px solid var(--line);color:var(--muted);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;background:#ffffff0a;border-radius:999px;padding:.28rem .55rem;font-size:.62rem;font-weight:600;transition:border-color .2s,background .2s,color .2s}.arrange-tool:hover:not(:disabled){color:var(--ink);border-color:#ffffff47}.arrange-tool.is-active{color:var(--ink);background:#00d4be24;border-color:#00d4be80}.arrange-tool.is-buildup.is-active{background:#ff8c3229;border-color:#ff963c8c}.arrange-tool.is-drop.is-active{background:#00d4be29;border-color:#00d4be8c}.arrange-tool.is-stab.is-active{background:#ff5a8229;border-color:#ff6e8c8c}.arrange-tool.is-punch.is-active{background:#ff322833;border-color:#ff4632a6}.arrange-tool.is-break.is-active{background:#6e82aa29;border-color:#8ca0c88c}.arrange-tool.is-transition.is-active{background:#8c64ff29;border-color:#a078ff8c}.arrange-tool.is-leadin.is-active{background:#ffb44629;border-color:#ffbe508c}.arrange-tool.is-danger{color:#ff9b9b;border-color:#ff5a5a66}.arrange-tool.is-automap{color:#b8e4ff;background:#50a0dc1f;border-color:#78c8ff73}.arrange-tool.is-automap:hover:not(:disabled){background:#5ab4f033;border-color:#96dcffa6}.arrange-tool.is-ghost{opacity:.75}.arrange-tool:disabled{opacity:.4;cursor:not-allowed}.arrange-hint{letter-spacing:.02em;color:var(--muted);margin-left:.15rem;font-family:IBM Plex Mono,monospace;font-size:.58rem}.arrange-kbd{opacity:.55;letter-spacing:0;font-weight:500}.transport-seek{appearance:none;background:linear-gradient(90deg, var(--accent) 0%, var(--accent) var(--progress,0%), #ffffff1f var(--progress,0%), #ffffff1f 100%);cursor:pointer;border-radius:999px;outline:none;width:100%;height:18px}.transport-seek::-webkit-slider-thumb{-webkit-appearance:none;cursor:pointer;background:#fff;border-radius:50%;width:22px;height:22px;box-shadow:0 0 0 3px #00d4be59}.transport-seek::-moz-range-thumb{cursor:pointer;background:#fff;border:0;border-radius:50%;width:22px;height:22px}.transport-seek:disabled{opacity:.4;cursor:not-allowed}.status-line,.error-line{margin:1rem 0 0;font-family:IBM Plex Mono,monospace;font-size:.78rem}.status-line{color:var(--muted)}.error-line{color:#ff6b6b}@media (width<=560px){.brand{font-size:clamp(3.6rem,22vw,5.5rem)}.topbar{grid-template-columns:1fr auto;grid-template-areas:"brand actions""center center";gap:.55rem .75rem}.brand-mark{grid-area:brand}.topbar-center{grid-area:center;justify-self:stretch}.topbar-modes,.topbar-palette,.topbar-modes-main,.topbar-palette-main{flex:1}.topbar-actions{grid-area:actions}.meta-fields{grid-template-columns:1fr 1fr}.meta-field-year{grid-column:1/-1}.player-dock-peek-artist,.player-dock-peek-hint{display:none}.transport{gap:.7rem}.transport-play{width:2.75rem;height:2.75rem}}