:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#07090b;--surface:#ffffff0b;--surface-2:#ffffff12;--border:#ffffff17;--border-strong:#ffffff29;--text:#f4f7f5;--text-dim:#9fb0ac;--text-faint:#6b7b78;--accent:#2fe3c0;--accent-ink:#052420;--highlight:#d8f25b;--danger:#ff8d7a;--good:#6ff0b8;--warn:#ffcf7a;--r-xl:30px;--r-lg:22px;--r-md:15px;--r-sm:11px;--tap:64px;--shadow:0 24px 70px -28px #000000d9;--ease:cubic-bezier(.22, .61, .36, 1);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:17px}*{box-sizing:border-box}body{background:var(--bg);min-height:100dvh;margin:0}button,input,textarea,select{font:inherit;color:inherit}h1,h2,h3,p,ol,ul{margin:0}:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.app{min-height:100dvh;padding-bottom:env(safe-area-inset-bottom);flex-direction:column;display:flex;position:relative;overflow:hidden}.ambient{z-index:-2;filter:blur(70px)saturate(1.3)brightness(.55);transition:background-image .8s var(--ease);background:radial-gradient(120% 120% at 70% 10%,#16302c 0%,#0b1316 45%,#07090b 100%) 50%/cover;position:fixed;inset:-10%;transform:scale(1.18)}.ambient-veil{z-index:-1;background:radial-gradient(140% 100% at 50% -10%,#0000 30%,#07090b8c 100%),linear-gradient(#07090b59,#07090bc7);position:fixed;inset:0}.topbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding:clamp(16px,2.4vw,28px) clamp(18px,3vw,40px);display:flex}.brand{align-items:center;gap:12px;display:flex}.brand-mark{background:linear-gradient(135deg, var(--accent), #1ba488);width:42px;height:42px;color:var(--accent-ink);border-radius:13px;place-items:center;display:grid;box-shadow:0 10px 30px -10px #2fe3c099}.brand-name{letter-spacing:.01em;font-size:1.22rem;font-weight:600}.brand-name b{color:var(--accent);font-weight:800}.chips{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.chip{background:var(--surface);border:1px solid var(--border);height:40px;color:var(--text-dim);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);white-space:nowrap;border-radius:999px;align-items:center;gap:7px;padding:0 15px;font-size:.92rem;font-weight:600;display:inline-flex}.chip.accent{color:var(--accent);background:#2fe3c01a;border-color:#2fe3c066}.chip.good{color:var(--good)}.chip.warn{color:var(--warn);border-color:#ffcf7a59}.chip-btn{cursor:pointer;transition:background .16s var(--ease), border-color .16s var(--ease)}.chip-btn:hover{background:var(--surface-2);border-color:var(--border-strong)}.chip.connect{cursor:pointer;color:var(--accent-ink);background:linear-gradient(135deg, var(--accent), #19b294);transition:transform .12s var(--ease), filter .16s var(--ease);border-color:#0000;font-weight:700;box-shadow:0 12px 32px -14px #2fe3c0b3}.chip.connect:hover{filter:brightness(1.06)}.chip.connect:active{transform:scale(.97)}.stage-wrap{flex:1;justify-content:center;align-items:center;width:100%;padding:clamp(8px,2vw,28px) clamp(18px,3vw,40px) clamp(24px,4vw,48px);display:flex}.glass{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);-webkit-backdrop-filter:blur(26px);backdrop-filter:blur(26px);box-shadow:var(--shadow)}.muted{color:var(--text-dim)}.muted.big{padding:28px 4px;font-size:1.2rem}.analyze-failed{flex-direction:column;align-items:flex-start;gap:16px;padding:8px 4px 20px;display:flex}.setup{gap:16px;width:min(560px,100%);padding:clamp(24px,3vw,38px);display:grid}.eyebrow{text-transform:uppercase;letter-spacing:.16em;color:var(--accent);font-size:.74rem;font-weight:700}.setup-title{letter-spacing:-.02em;font-size:clamp(2rem,4.5vw,3rem);font-weight:800;line-height:1.02}.setup-sub{color:var(--text-dim);margin-top:-4px;font-size:1.02rem}.field{letter-spacing:.02em;text-transform:uppercase;color:var(--text-faint);gap:8px;font-size:.82rem;font-weight:600;display:grid}.field input,.field textarea{border:1px solid var(--border-strong);border-radius:var(--r-md);width:100%;min-height:54px;color:var(--text);letter-spacing:0;text-transform:none;transition:border-color .18s var(--ease), background .18s var(--ease);background:#00000047;outline:none;padding:14px 16px;font-size:1.05rem;font-weight:500}.field textarea{resize:vertical;line-height:1.4}.field input::placeholder,.field textarea::placeholder{color:var(--text-faint)}.field input:focus,.field textarea:focus{border-color:var(--accent);background:#0006}.segments{grid-template-columns:repeat(4,1fr);gap:9px;display:grid}.seg{border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2);min-height:52px;color:var(--text-dim);text-transform:capitalize;cursor:pointer;transition:all .16s var(--ease);font-weight:600}.seg.selected{background:var(--text);color:#08110f;border-color:#0000}.cta{border-radius:var(--r-lg);background:linear-gradient(135deg, var(--accent), #19b294);width:100%;min-height:66px;color:var(--accent-ink);letter-spacing:.01em;cursor:pointer;transition:transform .12s var(--ease), filter .16s var(--ease);border:0;justify-content:center;align-items:center;gap:11px;margin-top:4px;font-size:1.12rem;font-weight:800;display:inline-flex;box-shadow:0 18px 44px -18px #2fe3c0b3}.cta:hover{filter:brightness(1.06)}.cta:active{transform:scale(.985)}button:disabled,.cta:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.ghost{border:1px solid var(--border-strong);border-radius:var(--r-md);background:var(--surface-2);width:100%;min-height:54px;color:var(--text);cursor:pointer;justify-content:center;align-items:center;gap:9px;font-weight:600;display:inline-flex}.cockpit{grid-template-columns:1fr;gap:clamp(14px,1.6vw,22px);width:min(1320px,100%);min-height:min(720px,100dvh - 150px);display:grid;position:relative}.stage{flex-direction:column;gap:clamp(18px,2.4vw,30px);padding:clamp(20px,2.4vw,34px);display:flex}.stage-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.now-label{letter-spacing:.18em;text-transform:uppercase;color:var(--accent);font-size:.78rem;font-weight:700}.dest{color:var(--text-dim);align-items:center;gap:6px;font-size:.95rem;font-weight:600;display:inline-flex}.hero{flex:1;grid-template-columns:clamp(150px,24vw,300px) 1fr;align-content:center;align-items:center;gap:clamp(20px,3vw,40px);display:grid}.art-xl{aspect-ratio:1;border-radius:var(--r-lg);background:var(--surface-2);border:1px solid var(--border);width:100%;color:var(--text-faint);place-items:center;display:grid;overflow:hidden;box-shadow:0 30px 60px -24px #000c}.art-xl img{object-fit:cover;width:100%;height:100%}.hero-meta{gap:8px;min-width:0;display:grid}.hero-title{letter-spacing:-.02em;overflow-wrap:anywhere;font-size:clamp(1.6rem,3.4vw,2.8rem);font-weight:800;line-height:1.04}.hero-artist{color:var(--text);font-size:clamp(1.05rem,1.8vw,1.4rem);font-weight:600}.hero-album{color:var(--text-dim);font-size:.98rem}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.transport{flex-wrap:wrap;align-items:center;gap:12px;margin-top:auto;display:flex}.ctrl{min-height:var(--tap);border:1px solid var(--border-strong);border-radius:var(--r-lg);background:var(--surface-2);color:var(--text);cursor:pointer;transition:transform .12s var(--ease), background .16s var(--ease);justify-content:center;align-items:center;gap:10px;padding:0 22px;font-size:1.02rem;font-weight:700;text-decoration:none;display:inline-flex}.ctrl:active{transform:scale(.97)}.ctrl.big{flex:1;min-width:180px;font-size:1.12rem}.ctrl.primary{background:linear-gradient(135deg, var(--accent), #19b294);color:var(--accent-ink);border-color:#0000;box-shadow:0 16px 40px -18px #2fe3c0b3}.ctrl.danger{color:var(--danger);border-color:#ff8d7a4d}.transport-note{min-height:var(--tap);color:var(--text-dim);flex:1;align-items:center;padding:0 4px;font-weight:500;display:inline-flex}.rail{flex-direction:column;gap:16px;padding:clamp(18px,2vw,26px);display:flex}.rail-head{letter-spacing:.16em;text-transform:uppercase;color:var(--text-faint);justify-content:space-between;align-items:center;font-size:.78rem;font-weight:700;display:flex}.counter{color:var(--accent);letter-spacing:0;font-size:1rem}.queue{gap:8px;padding:0;list-style:none;display:grid}.q-row{border-radius:var(--r-md);background:var(--surface);border:1px solid var(--border);grid-template-columns:22px 46px 1fr;align-items:center;gap:12px;min-height:64px;padding:8px 12px;display:grid}.q-num{color:var(--text-faint);font-variant-numeric:tabular-nums;text-align:center;font-weight:700}.q-art{background:var(--surface-2);width:46px;height:46px;color:var(--text-faint);border-radius:9px;place-items:center;display:grid;overflow:hidden}.q-art img{object-fit:cover;width:100%;height:100%}.q-meta{gap:2px;min-width:0;display:grid}.q-title{white-space:nowrap;text-overflow:ellipsis;font-weight:700;overflow:hidden}.q-artist{color:var(--text-dim);white-space:nowrap;text-overflow:ellipsis;font-size:.9rem;overflow:hidden}.phase-rail{border-radius:var(--r-md);border:1px solid var(--border);background:#00000040;justify-content:space-between;align-items:center;gap:6px;margin-top:auto;padding:12px;display:flex}.phase{height:40px;color:var(--text-faint);cursor:pointer;transition:background .28s var(--ease), color .28s var(--ease), transform .18s var(--ease), box-shadow .28s var(--ease);background:0 0;border:0;border-radius:999px;align-items:center;gap:7px;padding:0 12px;display:inline-flex}.phase:hover:not(.on):not(:disabled){background:var(--surface-2);color:var(--text);transform:translateY(-1px)}.phase:active:not(:disabled){transform:scale(.94)}.phase:disabled{cursor:default}.phase.on{background:linear-gradient(135deg, var(--accent), #19b294);color:var(--accent-ink);animation:phasePop .42s var(--ease);box-shadow:0 10px 26px -12px #2fe3c0cc}.phase.pending{color:var(--accent)}.phase.pending:after{content:"";border:1.5px solid var(--accent);animation:phasePulse 1s var(--ease) infinite;border-radius:999px;position:absolute;inset:0}.phase{position:relative}.phase em{white-space:nowrap;animation:phaseLabelIn .3s var(--ease);font-size:.86rem;font-style:normal;font-weight:700}@keyframes phasePop{0%{transform:scale(.8)}55%{transform:scale(1.08)}to{transform:scale(1)}}@keyframes phasePulse{0%{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(1.5)}}@keyframes phaseLabelIn{0%{opacity:0;max-width:0}to{opacity:1;max-width:140px}}.vibe-mix{border-radius:var(--r-md);border:1px solid var(--border);background:#00000040;margin-top:10px;padding:12px}.vibe-head{justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:9px;display:flex}.vibe-title{letter-spacing:.04em;color:var(--text);align-items:center;gap:6px;font-size:.78rem;font-weight:700;display:inline-flex}.vibe-sub{color:var(--text-faint);white-space:nowrap;font-size:.72rem}.vibe-segments{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.vibe{background:var(--surface-2);height:40px;color:var(--text-faint);cursor:pointer;transition:background .28s var(--ease), color .28s var(--ease), transform .18s var(--ease), box-shadow .28s var(--ease);border:0;border-radius:999px;justify-content:center;align-items:center;gap:6px;padding:0 8px;font-size:.82rem;font-weight:700;display:inline-flex;position:relative}.vibe:hover:not(.on):not(:disabled){color:var(--text);transform:translateY(-1px)}.vibe:active:not(:disabled){transform:scale(.94)}.vibe:disabled{cursor:default}.vibe.on{background:linear-gradient(135deg, var(--accent), #19b294);color:var(--accent-ink);animation:phasePop .42s var(--ease);box-shadow:0 10px 26px -12px #2fe3c0cc}.vibe.pending{color:var(--accent)}.vibe.pending:after{content:"";border:1.5px solid var(--accent);animation:phasePulse 1s var(--ease) infinite;border-radius:999px;position:absolute;inset:0}.q-row{animation:qIn .5s var(--ease) both}@keyframes qIn{0%{opacity:0;transform:translate(14px)}to{opacity:1;transform:translate(0)}}.retuning{z-index:5;border-radius:var(--r-xl);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:fadeIn .25s var(--ease);background:#07090b8c;place-items:center;display:grid;position:absolute;inset:0}.retuning-card{text-align:center;justify-items:center;gap:12px;display:grid}.retuning-orb{background:radial-gradient(circle at 35% 30%, #5ff0d6, var(--accent) 45%, #0d8f77 100%);width:78px;height:78px;animation:orbPulse 1.4s var(--ease) infinite;border-radius:50%;box-shadow:0 0 60px -6px #2fe3c0e6}.retuning-label{letter-spacing:.18em;text-transform:uppercase;color:var(--text-dim);font-size:.78rem;font-weight:700}.retuning-phase{letter-spacing:-.02em;color:var(--text);font-size:clamp(1.6rem,3vw,2.4rem);font-weight:800}@keyframes orbPulse{0%,to{transform:scale(1);box-shadow:0 0 60px -6px #2fe3c0e6}50%{transform:scale(1.12);box-shadow:0 0 90px #2fe3c0}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.advanced{color:var(--text-dim);margin-top:4px}.advanced summary{cursor:pointer;color:var(--text-faint);padding:8px 0;font-size:.92rem;list-style:none}.advanced summary::-webkit-details-marker{display:none}.advanced-body{gap:10px;margin-top:8px;display:grid}.history-list{gap:8px;display:grid}.history-row{border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface);min-height:58px;color:var(--text);text-align:left;cursor:pointer;gap:3px;padding:10px 14px;display:grid}.history-row small{color:var(--text-dim);text-transform:capitalize}.error{color:var(--danger);font-size:.95rem;font-weight:500}.spin{animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width>=920px){.cockpit{grid-template-columns:1.55fr 1fr;align-items:stretch}}@media (width<=620px){:root{font-size:16px}.segments{grid-template-columns:repeat(2,1fr)}.hero{text-align:center;grid-template-columns:1fr;justify-items:center}.art-xl{width:min(260px,72vw)}.phase em{display:none}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation-duration:.01ms!important}}.mood-grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.mood{min-height:var(--tap);border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface);color:var(--text-dim);cursor:pointer;transition:background .28s var(--ease), color .28s var(--ease), transform .18s var(--ease), border-color .28s var(--ease), box-shadow .28s var(--ease);flex-direction:column;justify-content:center;align-items:center;gap:7px;padding:12px 8px;font-size:.86rem;font-weight:700;display:flex}.mood:hover:not(.on){color:var(--text);border-color:var(--border-strong);transform:translateY(-1px)}.mood:active{transform:scale(.96)}.mood.on{background:linear-gradient(135deg, var(--accent), #19b294);color:var(--accent-ink);border-color:#0000;box-shadow:0 12px 30px -14px #2fe3c0d9}.quick-picks{flex-wrap:wrap;gap:8px;margin:-4px 0 4px;display:flex}.quick-pick{border:1px solid var(--border);background:var(--surface);height:38px;color:var(--text-dim);cursor:pointer;transition:background .24s var(--ease), color .24s var(--ease), border-color .24s var(--ease);border-radius:999px;align-items:center;gap:6px;padding:0 13px;font-size:.85rem;font-weight:600;display:inline-flex}.quick-pick:hover:not(.on){color:var(--text);border-color:var(--border-strong)}.quick-pick.on{border-color:var(--accent);color:var(--accent)}.context-strip{flex-wrap:wrap;gap:8px;margin:4px 0 2px;display:flex}.ctx-pill{border:1px solid var(--border);background:#00000047;border-radius:999px;align-items:baseline;gap:7px;padding:7px 13px;display:inline-flex}.ctx-label{letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint);font-size:.68rem;font-weight:700}.ctx-value{color:var(--text);font-size:.92rem;font-weight:700}.vibe-genres{color:var(--text-dim);margin-top:9px;font-size:.84rem}.vibe-genres span{letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint);margin-bottom:2px;font-size:.68rem;font-weight:700;display:block}.connect-wrap{position:relative}.device-menu{border-radius:var(--r-md);border:1px solid var(--border-strong);min-width:240px;box-shadow:var(--shadow);z-index:6;background:#0c1012f5;gap:4px;padding:8px;display:grid;position:absolute;bottom:calc(100% + 8px);right:0}.device-row{border-radius:var(--r-sm);color:var(--text);cursor:pointer;text-align:left;background:0 0;border:0;align-items:center;gap:9px;padding:10px 12px;display:flex}.device-row:hover{background:var(--surface-2)}.device-row.on{color:var(--accent)}.device-name{flex:1;font-weight:700}.device-type{color:var(--text-faint);font-size:.75rem}.device-empty{color:var(--text-dim);padding:10px 12px;font-size:.85rem}