:root{--bg:#050505;--surface:#0b0b0b;--surface2:#111;--line:#232323;--line2:#333;--white:#f5f5f2;--muted:#8b8b86;--soft:#c7c7c1;--danger:#ff5b5b;--radius:18px;--sidebar:176px;--top:72px;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color-scheme:dark}
*{box-sizing:border-box}html{background:var(--bg);scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--white);min-height:100vh;overflow-x:hidden}button,input,select{font:inherit}button{color:inherit}a{color:inherit;text-decoration:none}.muted{color:var(--muted)}[hidden]{display:none!important}.grain{position:fixed;inset:0;pointer-events:none;z-index:120;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E")}
.portal-stage{position:fixed;inset:0;z-index:110;display:grid;place-items:center;pointer-events:none;opacity:0;visibility:hidden;background:#000;overflow:hidden}.portal-stage.is-bursting{visibility:visible;animation:portalStage .72s cubic-bezier(.5,0,.2,1)}.portal-core{width:12px;height:12px;background:white;border-radius:50%;box-shadow:0 0 30px #fff}.portal-ring{position:absolute;border:1px solid rgba(255,255,255,.78);border-radius:50%;transform:scale(.05);opacity:0}.ring-a{width:42vmin;height:42vmin}.ring-b{width:74vmin;height:74vmin}.ring-c{width:120vmin;height:120vmin}.is-bursting .portal-ring{animation:ringBurst .72s cubic-bezier(.1,.75,.2,1)}.is-bursting .ring-b{animation-delay:.05s}.is-bursting .ring-c{animation-delay:.1s}.portal-scan{position:absolute;width:1px;height:200vh;background:linear-gradient(transparent,#fff,transparent);transform:rotate(30deg);opacity:.1}@keyframes portalStage{0%{opacity:0}18%{opacity:1}62%{opacity:1}100%{opacity:0}}@keyframes ringBurst{0%{transform:scale(.04);opacity:.9}100%{transform:scale(1.45);opacity:0}}
.auth-gate{position:fixed;inset:0;z-index:100;background:#050505;display:grid;place-items:center;padding:28px}.auth-card{width:min(1120px,96vw);min-height:650px;border:1px solid var(--line);border-radius:26px;display:grid;grid-template-columns:1.08fr .92fr;overflow:hidden;background:#090909;box-shadow:0 28px 90px rgba(0,0,0,.5)}.auth-art{position:relative;display:flex;align-items:flex-end;justify-content:space-between;padding:34px;background:radial-gradient(circle at 50% 45%,#1b1b1b 0 2%,#0b0b0b 16%,#050505 62%);border-right:1px solid var(--line);overflow:hidden}.auth-art>span{font:600 10px/1 monospace;letter-spacing:.2em;color:#62625f}.portal-mini{position:absolute;inset:50% auto auto 50%;width:340px;height:340px;transform:translate(-50%,-50%);border:1px solid #252525;border-radius:50%;display:grid;place-items:center}.portal-mini:before,.portal-mini:after,.portal-mini i{content:"";position:absolute;border:1px solid #3b3b3b;border-radius:50%}.portal-mini:before{inset:18%}.portal-mini:after{inset:34%;border-color:#777}.portal-mini i:nth-child(1){inset:45%;background:#fff;border-color:#fff;box-shadow:0 0 44px #fff}.portal-mini i:nth-child(2){width:150%;height:1px;border:0;border-top:1px solid #232323}.portal-mini i:nth-child(3){height:150%;width:1px;border:0;border-left:1px solid #232323}.auth-copy{padding:56px;display:flex;flex-direction:column;justify-content:center}.wordmark,.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:-.025em}.wordmark-dot,.live-dot{width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 14px rgba(255,255,255,.6)}.kicker{margin:32px 0 12px;font:700 10px/1.2 ui-monospace,monospace;letter-spacing:.18em;color:#777}.auth-copy h1,.hero-copy h1,.view-head h1{font-size:clamp(42px,5vw,70px);line-height:.92;letter-spacing:-.06em;margin:0;font-weight:620}.auth-copy h1 em,.hero-copy h1 em{font-weight:350;color:#8b8b86;font-style:normal}.auth-copy>.muted{max-width:430px;line-height:1.6}.auth-tabs{display:flex;gap:0;margin:28px 0 16px;border-bottom:1px solid var(--line)}.auth-tab{border:0;background:none;padding:10px 0;margin-right:24px;color:#666;font:700 11px/1 monospace;letter-spacing:.11em;border-bottom:1px solid transparent}.auth-tab.is-active{color:#fff;border-color:#fff}.field{display:flex;flex-direction:column;gap:8px;margin:13px 0}.field>span{font:700 10px/1 ui-monospace,monospace;color:#777;letter-spacing:.11em;text-transform:uppercase}.field input,.field select{height:50px;border:1px solid var(--line);border-radius:10px;background:#070707;color:#fff;padding:0 14px;outline:none;transition:.2s}.field input:focus,.field select:focus{border-color:#666;background:#0c0c0c}.password-wrap{position:relative}.password-wrap input{width:100%;padding-right:64px}.password-wrap button{position:absolute;right:7px;top:7px;height:36px;border:0;background:#141414;border-radius:7px;font:700 9px monospace;color:#999;padding:0 12px}.primary,.ghost,.text-button{border:0;cursor:pointer;transition:.2s ease}.primary{background:#f3f3ef;color:#070707;border-radius:9px;padding:0 20px;height:48px;font:800 11px/1 ui-monospace,monospace;letter-spacing:.08em;display:inline-flex;align-items:center;justify-content:center;gap:18px}.primary:hover{background:white;transform:translateY(-1px)}.primary:disabled{opacity:.45;cursor:not-allowed;transform:none}.ghost{background:transparent;border:1px solid var(--line);border-radius:9px;padding:0 18px;height:48px;font:700 10px/1 ui-monospace,monospace;letter-spacing:.08em}.ghost:hover{border-color:#666;background:#0d0d0d}.ghost.small{height:36px;padding:0 12px;font-size:9px}.wide{width:100%}.tall{height:58px}.text-button{background:none;color:#777;margin:14px auto 0;display:block;font-size:12px}.status-text{min-height:19px;color:#8a8a86;font-size:12px;line-height:1.45}.status-text.is-error{color:#ff7777}.status-text.is-success{color:#d8d8d2}
body.auth-locked .app-shell{filter:blur(10px);pointer-events:none;opacity:.12}body:not(.auth-locked) .auth-gate{display:none}.app-shell{min-height:100vh;transition:.35s}.topbar{position:fixed;inset:0 0 auto 0;height:var(--top);z-index:50;background:rgba(5,5,5,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--line);display:grid;grid-template-columns:var(--sidebar) 1fr auto;align-items:center;padding:0 24px}.brand{font-size:13px}.brand-glyph{width:28px;height:28px;border:1px solid #555;border-radius:50%;display:grid;place-items:center;font:700 11px monospace}.topbar-center{justify-self:center;display:flex;align-items:center;gap:10px;font:700 9px monospace;letter-spacing:.12em;color:#777}.topbar-right{display:flex;align-items:center;gap:14px}.user-chip{display:flex;align-items:center;gap:9px;border-left:1px solid var(--line);padding-left:14px}.user-chip>span{width:30px;height:30px;background:#eee;color:#111;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:11px}.user-chip div{display:flex;flex-direction:column;gap:2px}.user-chip strong{font-size:11px}.user-chip small{font:700 8px monospace;color:#777}.sidebar{position:fixed;left:0;top:var(--top);bottom:0;width:var(--sidebar);border-right:1px solid var(--line);padding:26px 18px;display:flex;flex-direction:column;justify-content:space-between;background:#050505;z-index:40}.side-nav,.side-bottom{display:flex;flex-direction:column;gap:5px}.nav-item{height:42px;border:0;background:none;border-radius:8px;display:grid;grid-template-columns:32px 1fr;align-items:center;text-align:left;color:#62625e;cursor:pointer;padding:0 9px}.nav-item span{font:600 9px monospace}.nav-item b{font-size:11px;font-weight:600}.nav-item:hover,.nav-item.is-active{background:#0f0f0f;color:#eee}.nav-item.is-active span{color:#fff}.nav-item.danger:hover{color:#ff7b7b}.workspace{margin-left:var(--sidebar);padding-top:var(--top);min-height:100vh}.view{display:none;min-height:calc(100vh - var(--top));padding:clamp(38px,6vw,88px) clamp(26px,5vw,74px) 80px}.view.is-active{display:block;animation:viewIn .45s ease both}@keyframes viewIn{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}.reveal{animation:reveal .7s ease both}.reveal:nth-child(2){animation-delay:.06s}.reveal:nth-child(3){animation-delay:.12s}@keyframes reveal{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.hero-grid{min-height:560px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;border-bottom:1px solid var(--line)}.hero-copy{max-width:760px}.hero-copy .kicker{margin-top:0}.hero-copy h1{font-size:clamp(56px,7.1vw,108px)}.lead{max-width:610px;font-size:16px;line-height:1.65;color:#898985;margin:28px 0}.hero-actions{display:flex;gap:10px}.hero-portal{display:grid;place-items:center;min-height:480px;position:relative}.hero-portal>p{position:absolute;bottom:25px;font:700 8px monospace;letter-spacing:.2em;color:#555}.portal-object{width:min(36vw,430px);aspect-ratio:1;border-radius:50%;border:1px solid #1d1d1d;position:relative;display:grid;place-items:center;background:radial-gradient(circle,#202020 0 1%,#0d0d0d 18%,transparent 54%)}.portal-object:before,.portal-object:after,.portal-object i{content:"";position:absolute;border:1px solid #2c2c2c;border-radius:50%}.portal-object:before{inset:15%}.portal-object:after{inset:30%;border-color:#4a4a4a}.portal-object i:nth-child(1){inset:41%;border-color:#888}.portal-object i:nth-child(2){left:50%;top:-12%;bottom:-12%;width:1px;border:0;border-left:1px solid #171717}.portal-object i:nth-child(3){top:50%;left:-12%;right:-12%;height:1px;border:0;border-top:1px solid #171717}.portal-object i:nth-child(4){inset:47%;background:#f5f5f2;border:0;box-shadow:0 0 50px rgba(255,255,255,.45)}.portal-object span{position:absolute;inset:5%;border:1px dashed #1e1e1e;border-radius:50%;animation:spin 22s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.dashboard-strip{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}.dashboard-strip article{padding:32px 18px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:7px}.dashboard-strip article:last-child{border-right:0}.metric-label{font:700 8px monospace;letter-spacing:.17em;color:#656561}.dashboard-strip strong{font-size:23px;letter-spacing:-.04em}.dashboard-strip small{font-size:10px;color:#666}.manifest{display:grid;grid-template-columns:1fr 1fr;gap:60px;padding:90px 0 20px;align-items:end}.manifest h2{font-size:clamp(34px,4.2vw,60px);line-height:1;letter-spacing:-.05em;margin:0}.manifest>p{max-width:520px;color:#858580;line-height:1.8;font-size:14px}
.view-head{display:flex;justify-content:space-between;align-items:flex-end;padding-bottom:36px;border-bottom:1px solid var(--line);margin-bottom:30px}.view-head .kicker{margin:0 0 14px}.view-head h1{font-size:clamp(48px,6vw,86px)}.view-head>p{max-width:430px;color:#777;line-height:1.6;font-size:12px;text-align:right}.panel{border:1px solid var(--line);background:#080808;border-radius:var(--radius)}.download-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(320px,.7fr);gap:16px}.form-panel{padding:28px}.platform-line{display:flex;align-items:center;gap:9px;font:700 9px monospace;letter-spacing:.1em;color:#777;margin-bottom:20px}.platform-dot{width:7px;height:7px;border-radius:50%;background:#454545}.platform-dot.youtube{background:#fff}.platform-dot.spotify{background:#bbb}.platform-dot.soundcloud{background:#888}.field.giant input{height:68px;font-size:17px;letter-spacing:-.02em}.form-grid{display:grid;gap:12px}.form-grid.three{grid-template-columns:repeat(3,1fr)}.toggle-row{display:flex;align-items:end;gap:24px;margin:8px 0 22px}.toggle{display:flex;align-items:center;gap:10px;color:#999;font:700 10px monospace;letter-spacing:.08em;height:50px}.toggle input{display:none}.toggle>span{width:34px;height:18px;border:1px solid #444;border-radius:20px;position:relative}.toggle>span:after{content:"";position:absolute;width:12px;height:12px;border-radius:50%;background:#666;left:2px;top:2px;transition:.2s}.toggle input:checked+span{border-color:#aaa}.toggle input:checked+span:after{left:18px;background:#fff}.field.compact{width:110px;margin:0}.download-note{display:flex;gap:14px;border:1px dashed #292929;padding:14px;border-radius:10px;margin:14px 0 18px}.download-note span{font:800 8px monospace;letter-spacing:.15em;color:#ddd;padding-top:2px}.download-note p{margin:0;font-size:11px;line-height:1.55;color:#6f6f6b}.process-panel{min-height:500px;padding:26px;position:relative;overflow:hidden}.process-panel .kicker{margin:0}.live-job{margin-top:18px;border-top:1px solid var(--line);padding-top:18px;position:relative;z-index:2}.live-job.empty span{font:700 9px monospace;color:#4f4f4b}.live-job h3{font-size:18px;margin:8px 0}.live-job p{color:#777;font-size:11px}.job-progress{height:2px;background:#202020;margin-top:16px;overflow:hidden}.job-progress i{display:block;height:100%;background:#fff}.process-orbit{position:absolute;width:320px;height:320px;border:1px solid #171717;border-radius:50%;right:-80px;bottom:-100px}.process-orbit:before,.process-orbit i{content:"";position:absolute;border:1px solid #242424;border-radius:50%}.process-orbit:before{inset:22%}.process-orbit i:nth-child(1){inset:39%;border-color:#555}.process-orbit i:nth-child(2){left:50%;top:-20%;bottom:-20%;width:1px;border:0;border-left:1px solid #151515}.process-orbit span{position:absolute;left:50%;top:50%;width:5px;height:5px;border-radius:50%;background:#fff;transform:translate(-50%,-50%);box-shadow:0 0 18px #fff}
.lab-shell{border:1px solid var(--line);background:#070707;border-radius:20px;overflow:hidden}.lab-topline{height:82px;display:flex;align-items:center;gap:10px;padding:0 22px;border-bottom:1px solid var(--line)}.file-drop{height:48px;min-width:230px;border:1px dashed #3a3a3a;border-radius:9px;padding:8px 13px;display:flex;flex-direction:column;justify-content:center;cursor:pointer}.file-drop input{display:none}.file-drop span{font:800 9px monospace;letter-spacing:.1em}.file-drop small{font-size:8px;color:#555;margin-top:4px;max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lab-presets{display:flex;gap:6px;margin-left:auto}.lab-presets button{height:34px;border:1px solid #262626;background:#0b0b0b;border-radius:7px;color:#747470;font:700 8px monospace;letter-spacing:.08em;padding:0 11px;cursor:pointer}.lab-presets button:hover,.lab-presets button.is-active{border-color:#777;color:#fff}.visualizer-wrap{height:260px;position:relative;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#080808,#050505)}#spectrum{width:100%;height:100%;display:block}.visualizer-meta{position:absolute;left:18px;right:18px;bottom:12px;display:flex;justify-content:space-between;font:700 8px monospace;color:#555;letter-spacing:.11em}#lab-player{width:calc(100% - 36px);height:42px;margin:12px 18px;filter:grayscale(1) invert(.88);opacity:.55}.eq-console{display:grid;grid-template-columns:88px 1fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);min-height:350px}.preamp-col{border-right:1px solid var(--line);display:grid;place-items:center}.preamp-col label,.eq-band{height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;font:700 8px monospace;color:#777;letter-spacing:.07em}.preamp-col output,.eq-band output{color:#ddd;font-size:8px}.eq-bands{display:grid;grid-template-columns:repeat(11,1fr)}.eq-band{border-right:1px solid #151515}.eq-band:last-child{border-right:0}.eq-band input,.preamp-col input{appearance:none;-webkit-appearance:slider-vertical;width:16px;height:220px;background:transparent;writing-mode:vertical-lr;direction:rtl}.eq-band input::-webkit-slider-runnable-track,.preamp-col input::-webkit-slider-runnable-track{width:2px;background:#303030}.eq-band input::-webkit-slider-thumb,.preamp-col input::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:13px;border-radius:50%;background:#f2f2ed;margin-left:-5.5px;box-shadow:0 0 0 3px #090909}.lab-footer{min-height:76px;padding:0 20px;display:flex;align-items:center;justify-content:space-between}.lab-info{display:flex;align-items:center;gap:9px;font:700 8px monospace;letter-spacing:.12em;color:#5f5f5a}.lab-actions{display:flex;gap:8px}.lab-shell>.status-text{padding:0 20px 18px;margin:0}
.library-list,.queue-board{border-top:1px solid var(--line)}.library-row,.queue-row{display:grid;grid-template-columns:50px minmax(0,1fr) 120px 110px auto;gap:14px;align-items:center;min-height:78px;border-bottom:1px solid var(--line);padding:10px 6px}.library-index{font:700 9px monospace;color:#555}.library-main strong,.queue-main strong{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.library-main small,.queue-main small{display:block;color:#656561;margin-top:5px;font-size:9px}.format-pill,.status-pill{font:700 8px monospace;letter-spacing:.1em;color:#777}.library-actions{display:flex;justify-content:flex-end;gap:6px}.mini-button{height:32px;border:1px solid #282828;background:#090909;color:#888;border-radius:7px;font:700 8px monospace;cursor:pointer;padding:0 11px}.mini-button:hover{color:#fff;border-color:#555}.queue-progress{height:2px;background:#202020}.queue-progress i{display:block;height:100%;background:#fff}.empty-state{padding:70px 10px;color:#555;text-align:center;font:700 9px monospace;letter-spacing:.1em}.account-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:16px}.account-grid>.panel{min-height:300px;padding:30px}.account-card{text-align:center}.account-monogram{width:88px;height:88px;border-radius:50%;display:grid;place-items:center;background:#eee;color:#111;margin:8px auto 22px;font-size:28px;font-weight:800}.account-card h2{margin:0 0 4px}.account-card p{color:#666}.plan-badge{display:inline-block;border:1px solid #333;border-radius:999px;padding:7px 12px;font:800 8px monospace;letter-spacing:.12em;margin-top:12px}.account-grid article:nth-child(2){display:flex;flex-direction:column;align-items:flex-start}.account-grid article:nth-child(2) .kicker{margin-top:0}.account-grid article:nth-child(2) h2{font-size:34px;letter-spacing:-.04em;margin:8px 0}.account-grid article:nth-child(2) .ghost{margin-top:auto}.toast-host{position:fixed;right:20px;bottom:20px;z-index:130;display:flex;flex-direction:column;gap:8px}.toast{width:min(360px,90vw);padding:13px 15px;border:1px solid #333;background:#0c0c0c;border-radius:9px;box-shadow:0 12px 40px rgba(0,0,0,.45);font-size:11px;animation:toastIn .25s ease}.toast.error{border-color:#5b2a2a;color:#ff9a9a}@keyframes toastIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:980px){:root{--sidebar:0px}.auth-card{grid-template-columns:1fr}.auth-art{display:none}.auth-copy{padding:36px}.topbar{grid-template-columns:1fr auto}.topbar-center{display:none}.sidebar{width:100%;height:58px;top:auto;bottom:0;border:0;border-top:1px solid var(--line);padding:6px 8px;flex-direction:row;background:#050505}.side-nav{flex:1;flex-direction:row}.side-bottom{flex-direction:row}.nav-item{height:46px;display:flex;justify-content:center;padding:0 11px}.nav-item span{display:none}.nav-item b{font-size:9px}.nav-item.danger{display:none}.workspace{margin-left:0;padding-bottom:60px}.view{padding:42px 24px 60px}.hero-grid{grid-template-columns:1fr;min-height:0;padding:45px 0}.hero-portal{min-height:360px}.portal-object{width:min(75vw,360px)}.dashboard-strip{grid-template-columns:1fr 1fr}.manifest{grid-template-columns:1fr}.download-layout{grid-template-columns:1fr}.process-panel{min-height:300px}.view-head{align-items:flex-start;gap:20px}.view-head>p{text-align:left}.eq-console{grid-template-columns:64px 1fr;overflow-x:auto}.eq-bands{min-width:780px}.lab-topline{height:auto;min-height:82px;flex-wrap:wrap;padding:12px}.lab-presets{order:3;width:100%;margin:0;overflow:auto}.library-row,.queue-row{grid-template-columns:34px 1fr auto}.library-row>*:nth-child(3),.library-row>*:nth-child(4),.queue-row>*:nth-child(3),.queue-row>*:nth-child(4){display:none}.account-grid{grid-template-columns:1fr}.form-grid.three{grid-template-columns:1fr}.topbar-right .ghost{display:none}}
@media(max-width:600px){.topbar{height:64px;padding:0 14px}.brand span:last-child{font-size:11px}.user-chip div{display:none}.workspace{padding-top:64px}.view{padding:28px 16px 50px}.hero-copy h1{font-size:52px}.dashboard-strip{grid-template-columns:1fr}.dashboard-strip article{border-right:0;border-bottom:1px solid var(--line)}.hero-actions{flex-direction:column;align-items:stretch}.hero-actions>*{width:100%}.view-head{flex-direction:column}.view-head h1{font-size:52px}.lab-actions{width:100%;margin-top:10px}.lab-footer{flex-wrap:wrap;padding:14px}.lab-actions button{flex:1}.auth-copy{padding:28px 22px}.auth-copy h1{font-size:45px}}


/* MusicHubMycn v3 — ambient field, portal depth and motion system */
.ambient-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.92}.ambient-grid{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.21;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:72px 72px;mask-image:radial-gradient(circle at 50% 45%,#000 0 36%,transparent 78%);animation:gridDrift 24s linear infinite}.cursor-signal{position:fixed;left:0;top:0;width:46px;height:46px;margin:-23px 0 0 -23px;border:1px solid rgba(255,255,255,.12);border-radius:50%;z-index:125;pointer-events:none;opacity:0;transform:translate3d(var(--cx,-80px),var(--cy,-80px),0);transition:opacity .25s ease}.cursor-signal i,.cursor-signal b{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%}.cursor-signal i{width:4px;height:4px;background:#fff;box-shadow:0 0 16px rgba(255,255,255,.9)}.cursor-signal b{width:12px;height:12px;border:1px solid rgba(255,255,255,.2);animation:cursorPing 1.8s ease-out infinite}.cursor-signal.is-visible{opacity:.7}.grain{z-index:140}.auth-gate{background:radial-gradient(circle at 18% 28%,rgba(255,255,255,.026),transparent 26%),radial-gradient(circle at 82% 70%,rgba(255,255,255,.018),transparent 30%),rgba(5,5,5,.78);backdrop-filter:blur(1px)}.auth-card{position:relative;isolation:isolate;background:linear-gradient(135deg,rgba(12,12,12,.94),rgba(7,7,7,.96));box-shadow:0 35px 110px rgba(0,0,0,.62),0 0 0 1px rgba(255,255,255,.015) inset;transition:border-color .35s ease,box-shadow .35s ease;transform-style:preserve-3d}.auth-card:before{content:"";position:absolute;inset:-1px;z-index:-1;border-radius:26px;background:radial-gradient(460px circle at var(--card-x,50%) var(--card-y,50%),rgba(255,255,255,.085),transparent 44%);opacity:.9;pointer-events:none}.auth-card:after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;border-radius:inherit;background:linear-gradient(108deg,transparent 0 42%,rgba(255,255,255,.025) 49%,transparent 56%);background-size:220% 100%;animation:cardSheen 8s ease-in-out infinite}.auth-art{background:radial-gradient(circle at 50% 45%,rgba(255,255,255,.06) 0 1%,rgba(255,255,255,.025) 7%,rgba(10,10,10,.84) 30%,rgba(4,4,4,.94) 70%);overflow:hidden}.auth-art:before,.auth-art:after{content:"";position:absolute;pointer-events:none}.auth-art:before{inset:-30%;background:conic-gradient(from 15deg,transparent 0 15%,rgba(255,255,255,.025) 15.5%,transparent 16% 49%,rgba(255,255,255,.018) 49.5%,transparent 50%);animation:slowSpin 26s linear infinite}.auth-art:after{left:8%;right:8%;top:50%;height:1px;background:linear-gradient(90deg,transparent,#313131,transparent);box-shadow:0 -120px 0 rgba(255,255,255,.018),0 120px 0 rgba(255,255,255,.018)}.portal-mini{animation:portalFloat 5.8s ease-in-out infinite,portalRotate 34s linear infinite;box-shadow:0 0 60px rgba(255,255,255,.025),0 0 160px rgba(255,255,255,.02)}.portal-mini:before{animation:ringBreath 4.4s ease-in-out infinite}.portal-mini:after{animation:ringBreath 4.4s 1s ease-in-out infinite}.portal-mini i:nth-child(1){animation:coreBreathe 2.8s ease-in-out infinite}.portal-satellite{position:absolute;width:5px;height:5px;border-radius:50%;background:#d9d9d4;box-shadow:0 0 14px rgba(255,255,255,.7);transform-origin:170px 2px}.portal-satellite.s1{left:50%;top:49%;animation:satellite1 7s linear infinite}.portal-satellite.s2{left:50%;top:49%;opacity:.55;animation:satellite2 11s linear infinite}.portal-satellite.s3{left:50%;top:49%;width:3px;height:3px;opacity:.38;animation:satellite3 16s linear infinite}.auth-signal{position:absolute;left:34px;top:34px;display:flex;align-items:center;gap:9px;font:700 8px/1 ui-monospace,monospace;letter-spacing:.16em;color:#565652}.auth-signal i{width:28px;height:1px;background:#555;position:relative;overflow:hidden}.auth-signal i:after{content:"";position:absolute;inset:0;background:#fff;transform:translateX(-110%);animation:signalSweep 2.2s ease-in-out infinite}.auth-copy>*{position:relative;z-index:6}.wordmark-dot,.live-dot{animation:livePulse 2.2s ease-in-out infinite}.field input,.field select,.primary,.ghost,.auth-tab{position:relative;z-index:2}.field input:focus{box-shadow:0 0 0 3px rgba(255,255,255,.025),0 14px 35px rgba(0,0,0,.32)}.primary{overflow:hidden;isolation:isolate}.primary:after{content:"";position:absolute;inset:-100% -30%;z-index:-1;background:linear-gradient(110deg,transparent 40%,rgba(255,255,255,.58) 50%,transparent 60%);transform:translateX(-75%) rotate(8deg);opacity:.34}.primary:hover:after{animation:buttonSweep .75s ease}.app-shell{position:relative;z-index:2;background:linear-gradient(180deg,rgba(5,5,5,.55),rgba(5,5,5,.78))}.topbar,.sidebar{background:rgba(5,5,5,.72)}.panel,.lab-shell,.dashboard-strip{backdrop-filter:blur(15px);background-color:rgba(8,8,8,.78)}.hero-portal{perspective:900px}.portal-object{animation:heroPortalFloat 7s ease-in-out infinite;filter:drop-shadow(0 0 50px rgba(255,255,255,.035))}.portal-object:after{content:"";position:absolute;inset:18%;border:1px dashed rgba(255,255,255,.09);border-radius:50%;animation:portalReverse 18s linear infinite}.portal-object i:nth-child(1){animation:portalOrbitA 14s linear infinite}.portal-object i:nth-child(2){animation:portalOrbitB 19s linear reverse infinite}.portal-object span{animation:coreBreathe 2.8s ease-in-out infinite}.portal-stage{background:radial-gradient(circle at 50% 50%,#080808 0,#000 58%)}.portal-stage.is-bursting:before{content:"";position:absolute;inset:-20%;background:repeating-conic-gradient(from 0deg,rgba(255,255,255,.10) 0 .35deg,transparent .35deg 4deg);mask-image:radial-gradient(circle,transparent 0 10%,#000 26%,transparent 67%);animation:warpSpin .72s ease-out}.portal-spark{position:absolute;left:50%;top:50%;width:var(--size,2px);height:var(--size,2px);border-radius:50%;background:#fff;box-shadow:0 0 14px rgba(255,255,255,.8);transform:translate(-50%,-50%) rotate(var(--angle)) translateX(0);animation:portalSpark .72s cubic-bezier(.1,.68,.12,1) forwards}.reveal{animation-duration:.85s}.view.is-active .reveal{animation-name:revealV3}.dashboard-strip article,.panel,.manifest{transition:transform .3s ease,border-color .3s ease,background-color .3s ease}.dashboard-strip article:hover,.panel:hover,.manifest:hover{border-color:#343434;background-color:rgba(12,12,12,.82)}
@keyframes gridDrift{to{background-position:72px 72px}}@keyframes cursorPing{0%{transform:translate(-50%,-50%) scale(.6);opacity:.7}100%{transform:translate(-50%,-50%) scale(2.5);opacity:0}}@keyframes cardSheen{0%,65%,100%{background-position:170% 0}78%{background-position:-60% 0}}@keyframes slowSpin{to{transform:rotate(360deg)}}@keyframes portalFloat{0%,100%{translate:-50% -50%;scale:1}50%{translate:-50% calc(-50% - 8px);scale:1.018}}@keyframes portalRotate{to{rotate:360deg}}@keyframes ringBreath{0%,100%{opacity:.35;transform:scale(1)}50%{opacity:.8;transform:scale(1.045)}}@keyframes coreBreathe{0%,100%{box-shadow:0 0 24px rgba(255,255,255,.7);scale:.9}50%{box-shadow:0 0 52px #fff,0 0 100px rgba(255,255,255,.2);scale:1.13}}@keyframes satellite1{to{transform:rotate(360deg) translateX(150px) rotate(-360deg)}}@keyframes satellite2{from{transform:rotate(90deg) translateX(112px)}to{transform:rotate(450deg) translateX(112px)}}@keyframes satellite3{from{transform:rotate(220deg) translateX(74px)}to{transform:rotate(580deg) translateX(74px)}}@keyframes signalSweep{50%,100%{transform:translateX(110%)}}@keyframes livePulse{0%,100%{opacity:.45;box-shadow:0 0 5px rgba(255,255,255,.2)}50%{opacity:1;box-shadow:0 0 18px rgba(255,255,255,.9)}}@keyframes buttonSweep{to{transform:translateX(75%) rotate(8deg)}}@keyframes heroPortalFloat{0%,100%{transform:translateY(0) rotateX(0deg)}50%{transform:translateY(-10px) rotateX(2deg)}}@keyframes portalReverse{to{transform:rotate(-360deg)}}@keyframes portalOrbitA{to{transform:rotate(360deg)}}@keyframes portalOrbitB{to{transform:rotate(360deg)}}@keyframes warpSpin{to{transform:rotate(25deg) scale(1.2);opacity:0}}@keyframes portalSpark{0%{opacity:0;transform:translate(-50%,-50%) rotate(var(--angle)) translateX(8px) scale(.4)}18%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) rotate(var(--angle)) translateX(var(--dist,48vmin)) scale(.1)}}@keyframes revealV3{from{opacity:0;transform:translateY(24px) scale(.992);filter:blur(5px)}to{opacity:1;transform:none;filter:none}}
@media(pointer:coarse){.cursor-signal{display:none}}@media(prefers-reduced-motion:reduce){.ambient-grid,.portal-mini,.portal-mini:before,.portal-mini:after,.portal-mini i,.portal-object,.portal-object:after,.wordmark-dot,.live-dot,.auth-card:after{animation:none!important}.cursor-signal{display:none}.portal-spark{display:none}}


/* ================================================================
   MusicHubMycn v4 — Sonic Nebula UI
   Rich motion, aurora glass, interactive particle field.
   ================================================================ */
:root{--cyan:#6ce5ff;--violet:#9b6cff;--pink:#ff5aa7;--mint:#72ffc8;--ink:#05050a;--glass:rgba(12,12,22,.66);--glass2:rgba(17,18,31,.76);--glow:0 0 45px rgba(var(--accent-rgb),.13);--line:rgba(255,255,255,.105);--line2:rgba(255,255,255,.18);--surface:#0a0a12;--surface2:#10111c;--white:#f8f8fb;--muted:#9a9aad;--soft:#d3d4de}
html,body{background:#040408}body{background:radial-gradient(circle at var(--mx,72%) var(--my,18%),rgba(104,224,255,.075),transparent 24%),radial-gradient(circle at 16% 78%,rgba(255,78,163,.055),transparent 28%),linear-gradient(140deg,#040408 0,#070711 48%,#050509 100%)}
.ambient-canvas{opacity:1;z-index:0}.ambient-grid{z-index:1;opacity:.34;background-image:linear-gradient(rgba(var(--accent-rgb),.025) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--accent2-rgb),.022) 1px,transparent 1px);background-size:58px 58px;mask-image:radial-gradient(ellipse at var(--mx,50%) var(--my,50%),#000 0 18%,rgba(0,0,0,.45) 48%,transparent 82%);animation:gridV4 22s linear infinite}.aurora-field{position:fixed;inset:-20%;z-index:0;pointer-events:none;filter:blur(75px);opacity:.38;mix-blend-mode:screen}.aurora-field i{position:absolute;width:38vw;height:38vw;border-radius:50%;opacity:.24}.aurora-field i:nth-child(1){left:8%;top:9%;background:radial-gradient(circle,var(--violet),transparent 68%);animation:auroraA 18s ease-in-out infinite}.aurora-field i:nth-child(2){right:4%;top:24%;background:radial-gradient(circle,var(--cyan),transparent 68%);animation:auroraB 22s ease-in-out infinite}.aurora-field i:nth-child(3){left:42%;bottom:2%;background:radial-gradient(circle,var(--pink),transparent 68%);animation:auroraC 25s ease-in-out infinite}.cursor-glow{position:fixed;left:-125px;top:-125px;width:250px;height:250px;border-radius:50%;z-index:2;pointer-events:none;opacity:0;background:radial-gradient(circle,rgba(var(--accent-rgb),.11),rgba(var(--accent2-rgb),.045) 42%,transparent 72%);filter:blur(8px);transition:opacity .25s ease}.cursor-glow.is-visible{opacity:1}.cursor-signal{border-color:rgba(var(--accent-rgb),.24);mix-blend-mode:screen}.cursor-signal i{background:var(--cyan);box-shadow:0 0 18px var(--cyan)}.cursor-signal b{border-color:rgba(var(--accent2-rgb),.42)}.grain{opacity:.025}
/* no more full-screen portal wipe */
.portal-stage.fx-stage{display:block;position:fixed;inset:0;z-index:90;pointer-events:none;background:transparent;opacity:0;visibility:hidden;overflow:hidden}.portal-stage.fx-stage.is-bursting{visibility:visible;animation:none;opacity:1}.fx-bloom{position:absolute;left:62%;top:48%;width:12px;height:12px;border-radius:50%;transform:translate(-50%,-50%);background:#fff;box-shadow:0 0 35px #fff,0 0 100px var(--cyan),0 0 180px var(--violet);opacity:0}.is-bursting .fx-bloom{animation:fxBloom .48s cubic-bezier(.15,.75,.18,1)}.fx-ring{position:absolute;left:62%;top:48%;width:24vmin;height:24vmin;border:1px solid rgba(var(--accent-rgb),.34);border-radius:50%;transform:translate(-50%,-50%) scale(.1);opacity:0}.is-bursting .fx-ring{animation:fxRing .5s cubic-bezier(.12,.72,.15,1)}.is-bursting .fx-ring.ring-b{animation-delay:.05s;border-color:rgba(var(--accent3-rgb),.22)}.fx-streak{position:absolute;left:0;right:0;top:48%;height:1px;background:linear-gradient(90deg,transparent,rgba(var(--accent-rgb),.55),#fff,rgba(var(--accent2-rgb),.4),transparent);transform:scaleX(0);opacity:0}.is-bursting .fx-streak{animation:fxStreak .42s ease-out}
/* auth */
.auth-gate{z-index:100;background:rgba(3,3,8,.56);backdrop-filter:blur(8px);padding:34px}.auth-card{width:min(1240px,96vw);min-height:700px;grid-template-columns:1.1fr .9fr;border:1px solid rgba(255,255,255,.12);border-radius:32px;background:linear-gradient(145deg,rgba(15,15,27,.84),rgba(7,7,14,.91));box-shadow:0 40px 140px rgba(0,0,0,.72),0 0 80px rgba(var(--accent-rgb),.055),0 0 120px rgba(var(--accent2-rgb),.045);transform:perspective(1400px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .16s ease-out,border-color .35s ease,box-shadow .35s ease}.auth-card:before{background:radial-gradient(600px circle at var(--card-x,50%) var(--card-y,50%),rgba(var(--accent-rgb),.12),rgba(var(--accent2-rgb),.035) 38%,transparent 64%)}.auth-card:after{background:linear-gradient(110deg,transparent 0 37%,rgba(var(--accent-rgb),.045) 46%,rgba(255,255,255,.04) 50%,rgba(var(--accent3-rgb),.03) 54%,transparent 63%);background-size:240% 100%}.auth-art{border-right:1px solid rgba(255,255,255,.1);background:radial-gradient(circle at 50% 44%,rgba(var(--accent-rgb),.08),transparent 13%),radial-gradient(circle at 58% 46%,rgba(var(--accent2-rgb),.12),transparent 30%),linear-gradient(145deg,rgba(11,12,24,.88),rgba(5,5,10,.96));overflow:hidden}.auth-art:before{background:conic-gradient(from 0deg,transparent 0 12%,rgba(var(--accent-rgb),.065) 12.4%,transparent 13% 37%,rgba(var(--accent2-rgb),.05) 37.4%,transparent 38% 65%,rgba(var(--accent3-rgb),.04) 65.5%,transparent 66%);animation:slowSpin 38s linear infinite}.auth-art:after{background:linear-gradient(90deg,transparent,rgba(var(--accent-rgb),.16),transparent);box-shadow:0 -140px 0 rgba(var(--accent2-rgb),.035),0 140px 0 rgba(var(--accent3-rgb),.03)}.portal-mini.sonic-sphere{width:410px;height:410px;border:0;background:radial-gradient(circle,rgba(255,255,255,.95) 0 1.6%,rgba(var(--accent-rgb),.18) 2%,rgba(var(--accent2-rgb),.08) 12%,rgba(7,7,14,.18) 35%,transparent 65%);box-shadow:none;animation:sonicFloat 6s ease-in-out infinite}.sonic-halo{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(255,255,255,.1)}.halo-a{inset:7%;border-color:rgba(var(--accent-rgb),.26);box-shadow:0 0 45px rgba(var(--accent-rgb),.08);animation:haloSpin 17s linear infinite}.halo-b{inset:23%;border-style:dashed;border-color:rgba(var(--accent2-rgb),.34);animation:haloSpin 13s linear reverse infinite}.halo-c{inset:38%;border-color:rgba(var(--accent3-rgb),.3);animation:haloPulse 3.4s ease-in-out infinite}.sonic-disc{position:absolute;inset:42%;border-radius:50%;background:conic-gradient(from 180deg,var(--cyan),#fff,var(--pink),var(--violet),var(--cyan));padding:2px;box-shadow:0 0 38px rgba(var(--accent-rgb),.28),0 0 70px rgba(var(--accent2-rgb),.15);animation:discSpin 7s linear infinite}.sonic-disc span{display:block;width:100%;height:100%;border-radius:50%;background:#080811;box-shadow:inset 0 0 20px rgba(255,255,255,.1)}.mini-spectrum{position:absolute;left:10%;right:10%;bottom:13%;height:70px;display:flex;align-items:flex-end;justify-content:center;gap:5px;mask-image:linear-gradient(90deg,transparent,#000 13%,#000 87%,transparent)}.mini-spectrum i{position:static!important;width:3px!important;height:calc(8px + var(--n)*2.2px)!important;border:0!important;border-radius:5px!important;background:linear-gradient(to top,var(--violet),var(--cyan))!important;animation:miniEq calc(.75s + var(--n)*.025s) ease-in-out infinite alternate!important;opacity:.75}.auth-feature-stack{position:absolute;right:28px;bottom:30px;display:flex;flex-direction:column;align-items:flex-end;gap:7px}.auth-feature-stack b{font:700 8px/1 ui-monospace,monospace;letter-spacing:.13em;color:#8c8da2;padding:8px 10px;border:1px solid rgba(255,255,255,.08);border-radius:999px;background:rgba(7,7,14,.5);backdrop-filter:blur(8px)}.portal-satellite.s1{background:var(--cyan);box-shadow:0 0 16px var(--cyan)}.portal-satellite.s2{background:var(--pink);box-shadow:0 0 14px var(--pink)}.portal-satellite.s3{background:var(--violet);box-shadow:0 0 14px var(--violet)}.auth-signal{color:#797a91}.auth-signal i{background:#283044}.auth-signal i:after{background:linear-gradient(90deg,var(--cyan),#fff,var(--pink))}.auth-copy{padding:62px}.wordmark{font-size:15px}.wordmark-dot,.live-dot{background:var(--cyan);box-shadow:0 0 16px var(--cyan)}.kicker{color:#86879c}.auth-copy h1 em,.hero-copy h1 em{background:linear-gradient(90deg,var(--cyan),#bfb2ff 52%,var(--pink));-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:520}.auth-tabs{border-color:rgba(255,255,255,.09)}.auth-tab.is-active{border-color:var(--cyan);color:#fff;text-shadow:0 0 15px rgba(var(--accent-rgb),.35)}.field input,.field select{background:rgba(7,8,15,.72);border-color:rgba(255,255,255,.11);box-shadow:inset 0 1px rgba(255,255,255,.025)}.field input:focus,.field select:focus{border-color:rgba(var(--accent-rgb),.58);background:rgba(10,11,20,.88);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.06),0 12px 35px rgba(0,0,0,.3)}.password-wrap button{background:rgba(var(--accent-rgb),.08);color:#bcefff}.primary{background:linear-gradient(100deg,#effcff 0,var(--cyan) 28%,#b9a4ff 70%,#ff9ac6 100%);color:#090911;box-shadow:0 10px 30px rgba(var(--accent-rgb),.12),0 0 0 1px rgba(255,255,255,.18) inset}.primary:hover{filter:brightness(1.09) saturate(1.08);box-shadow:0 14px 42px rgba(var(--accent-rgb),.22),0 0 35px rgba(var(--accent2-rgb),.12);transform:translateY(-2px)}.ghost{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.12);backdrop-filter:blur(10px)}.ghost:hover{border-color:rgba(var(--accent-rgb),.42);background:rgba(var(--accent-rgb),.055);box-shadow:0 0 24px rgba(var(--accent-rgb),.08)}.status-text.is-error{color:#ff8db4;text-shadow:0 0 16px rgba(var(--accent3-rgb),.18)}.status-text.is-success{color:#8fffd3}
/* shell */
.app-shell{z-index:3;background:linear-gradient(180deg,rgba(4,4,9,.42),rgba(4,4,9,.72))}.topbar,.sidebar{background:rgba(6,6,13,.70);backdrop-filter:blur(24px) saturate(140%);border-color:rgba(255,255,255,.08)}.brand-glyph{border:1px solid rgba(var(--accent-rgb),.4);background:linear-gradient(135deg,rgba(var(--accent-rgb),.15),rgba(var(--accent2-rgb),.12));box-shadow:0 0 22px rgba(var(--accent-rgb),.09)}.user-chip>span{background:linear-gradient(135deg,var(--cyan),var(--violet));color:#070710;box-shadow:0 0 22px rgba(var(--accent-rgb),.12)}.nav-item{color:#77798e}.nav-item:hover{background:linear-gradient(90deg,rgba(var(--accent-rgb),.065),rgba(var(--accent2-rgb),.025));color:#e8ecf7}.nav-item.is-active{background:linear-gradient(90deg,rgba(var(--accent-rgb),.12),rgba(var(--accent2-rgb),.055),transparent);color:#fff;box-shadow:inset 2px 0 var(--cyan)}.nav-item.is-active span{color:var(--cyan)}.workspace{position:relative}.view{position:relative}.view:before{content:"";position:absolute;width:460px;height:460px;border-radius:50%;right:3%;top:8%;background:radial-gradient(circle,rgba(var(--accent2-rgb),.06),transparent 68%);filter:blur(20px);pointer-events:none}.view.is-active{animation:viewV4 .55s cubic-bezier(.16,.72,.22,1) both}.view.is-active .reveal{animation:revealV4 .72s cubic-bezier(.16,.72,.22,1) both}.panel,.lab-shell,.dashboard-strip,.manifest{background:linear-gradient(145deg,rgba(16,17,29,.76),rgba(8,8,16,.72));border-color:rgba(255,255,255,.1);box-shadow:0 18px 60px rgba(0,0,0,.18),inset 0 1px rgba(255,255,255,.025);backdrop-filter:blur(18px) saturate(125%)}.panel:hover,.manifest:hover{border-color:rgba(var(--accent-rgb),.22);box-shadow:0 22px 72px rgba(0,0,0,.28),0 0 35px rgba(var(--accent-rgb),.045)}
/* hero */
.hero-grid{border-color:rgba(255,255,255,.08)}.hero-copy h1{font-weight:650;text-shadow:0 15px 70px rgba(0,0,0,.45)}.lead{color:#a7a8ba;font-size:17px}.hero-portal{perspective:1100px;overflow:visible}.portal-object.audio-reactor{width:min(38vw,470px);border:0;background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.94) 0 1.3%,rgba(var(--accent-rgb),.22) 2%,rgba(var(--accent2-rgb),.12) 12%,rgba(var(--accent3-rgb),.055) 25%,rgba(8,8,18,.18) 47%,transparent 68%);animation:reactorFloat 7s ease-in-out infinite;filter:drop-shadow(0 0 85px rgba(var(--accent-rgb),.12));transform-style:preserve-3d}.portal-object.audio-reactor:before,.portal-object.audio-reactor:after{display:none}.reactor-orbit{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.13)}.orbit-a{inset:4%;border-color:rgba(var(--accent-rgb),.23);animation:orbitWarpA 17s linear infinite}.orbit-b{inset:17%;border-style:dashed;border-color:rgba(var(--accent2-rgb),.28);animation:orbitWarpB 12s linear reverse infinite}.orbit-c{inset:31%;border-color:rgba(var(--accent3-rgb),.25);animation:haloPulse 3.6s ease-in-out infinite}.reactor-disc{position:absolute;inset:40%;border-radius:50%;padding:2px;background:conic-gradient(var(--cyan),#fff,var(--pink),var(--violet),var(--cyan));box-shadow:0 0 55px rgba(var(--accent-rgb),.34);animation:discSpin 6s linear infinite}.reactor-disc span{display:block;width:100%;height:100%;border-radius:50%;background:#070712}.reactor-bars{position:absolute;left:14%;right:14%;bottom:17%;height:95px;display:flex;align-items:flex-end;justify-content:center;gap:5px;transform:perspective(500px) rotateX(8deg);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}.reactor-bars i{position:static!important;width:4px!important;height:calc(12px + var(--i)*2px)!important;border:0!important;border-radius:5px!important;background:linear-gradient(to top,var(--violet),var(--cyan))!important;opacity:.72;animation:reactorEq calc(.55s + var(--i)*.033s) ease-in-out infinite alternate!important}.reactor-node{position:absolute;width:8px;height:8px;border-radius:50%;box-shadow:0 0 20px currentColor}.node-a{left:11%;top:38%;background:var(--cyan);color:var(--cyan);animation:nodeFloat 4s ease-in-out infinite}.node-b{right:13%;top:62%;background:var(--pink);color:var(--pink);animation:nodeFloat 5s 1s ease-in-out infinite}.floating-chip{position:absolute;display:flex;align-items:center;gap:9px;padding:10px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.11);background:rgba(8,9,17,.64);backdrop-filter:blur(14px);box-shadow:0 12px 35px rgba(0,0,0,.25);font:700 8px/1 ui-monospace,monospace;letter-spacing:.08em;color:#b8bac9;animation:chipFloat 5s ease-in-out infinite}.floating-chip span{color:var(--cyan)}.chip-a{right:2%;top:20%}.chip-b{left:7%;bottom:18%;animation-delay:1.2s}.hero-ticker{display:flex;align-items:center;justify-content:center;gap:20px;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.08);overflow:hidden;color:#65677a;font:800 9px/1 ui-monospace,monospace;letter-spacing:.22em}.hero-ticker i{width:5px;height:5px;border-radius:50%;background:var(--cyan);box-shadow:0 0 14px var(--cyan)}.dashboard-strip{border-color:rgba(255,255,255,.08)}.dashboard-strip article{border-color:rgba(255,255,255,.08);position:relative;overflow:hidden}.dashboard-strip article:after{content:"";position:absolute;inset:auto 18px 0;height:1px;background:linear-gradient(90deg,var(--cyan),var(--violet),transparent);transform:scaleX(0);transform-origin:left;transition:transform .35s ease}.dashboard-strip article:hover:after{transform:scaleX(1)}
/* audio lab + forms */
.platform-dot{box-shadow:0 0 18px currentColor}.platform-dot.youtube{background:#ff5d6c}.platform-dot.spotify{background:#6dffad}.platform-dot.soundcloud{background:#ff9d5c}.download-note{background:linear-gradient(90deg,rgba(var(--accent-rgb),.045),rgba(var(--accent2-rgb),.03));border-color:rgba(var(--accent-rgb),.16)}.process-orbit{filter:drop-shadow(0 0 25px rgba(var(--accent-rgb),.12))}.visualizer-wrap{background:radial-gradient(circle at 50% 100%,rgba(var(--accent-rgb),.075),transparent 45%),linear-gradient(#070811,#06070e);border-color:rgba(var(--accent-rgb),.14)}.lab-shell{box-shadow:0 26px 90px rgba(0,0,0,.32),0 0 55px rgba(var(--accent-rgb),.035)}.lab-presets button.is-active{color:#061015;background:linear-gradient(90deg,var(--cyan),#c2b1ff)}.eq-band input[type=range]{accent-color:var(--cyan)}.queue-progress i,.job-progress i{background:linear-gradient(90deg,var(--violet),var(--cyan),var(--mint));box-shadow:0 0 14px rgba(var(--accent-rgb),.25)}.status-pill{border-color:rgba(var(--accent-rgb),.15);background:rgba(var(--accent-rgb),.045);color:#b8f3ff}
/* scroll energy */
body.scroll-energy .ambient-grid{opacity:.5;filter:brightness(1.35)}body.scroll-energy .topbar{box-shadow:0 8px 35px rgba(var(--accent-rgb),.035)}
@keyframes gridV4{to{background-position:58px 58px}}@keyframes auroraA{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(18vw,10vh) scale(1.18)}}@keyframes auroraB{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-15vw,18vh) scale(.86)}}@keyframes auroraC{0%,100%{transform:translate(0,0) scale(.92)}50%{transform:translate(-8vw,-20vh) scale(1.15)}}@keyframes fxBloom{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}35%{opacity:.95}100%{opacity:0;transform:translate(-50%,-50%) scale(14)}}@keyframes fxRing{0%{opacity:.75;transform:translate(-50%,-50%) scale(.08)}100%{opacity:0;transform:translate(-50%,-50%) scale(3.5)}}@keyframes fxStreak{0%{opacity:0;transform:scaleX(0)}35%{opacity:.75}100%{opacity:0;transform:scaleX(1)}}@keyframes sonicFloat{0%,100%{transform:translate(-50%,-50%) translateY(0) rotateX(0deg)}50%{transform:translate(-50%,-50%) translateY(-10px) rotateX(4deg)}}@keyframes haloSpin{to{transform:rotate(360deg)}}@keyframes haloPulse{0%,100%{opacity:.38;transform:scale(.96)}50%{opacity:.9;transform:scale(1.05)}}@keyframes discSpin{to{transform:rotate(360deg)}}@keyframes miniEq{from{transform:scaleY(.22);filter:hue-rotate(0)}to{transform:scaleY(1);filter:hue-rotate(28deg)}}@keyframes reactorFloat{0%,100%{transform:translateY(0) rotateX(0) rotateY(0)}50%{transform:translateY(-12px) rotateX(3deg) rotateY(-2deg)}}@keyframes orbitWarpA{to{transform:rotate(360deg) rotateX(10deg)}}@keyframes orbitWarpB{to{transform:rotate(-360deg) rotateY(14deg)}}@keyframes reactorEq{from{transform:scaleY(.18);opacity:.42}to{transform:scaleY(1);opacity:.96}}@keyframes nodeFloat{0%,100%{transform:translate(0,0) scale(.8)}50%{transform:translate(14px,-10px) scale(1.2)}}@keyframes chipFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes viewV4{from{opacity:0;transform:translateY(12px) scale(.994);filter:blur(5px)}to{opacity:1;transform:none;filter:none}}@keyframes revealV4{from{opacity:0;transform:translateY(25px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@media(max-width:980px){.auth-card{grid-template-columns:1fr;max-height:92vh;overflow:auto}.auth-art{min-height:330px;border-right:0;border-bottom:1px solid rgba(255,255,255,.09)}.portal-mini.sonic-sphere{width:300px;height:300px}.auth-feature-stack{display:none}.floating-chip{display:none}.portal-object.audio-reactor{width:min(72vw,420px)}}
@media(max-width:600px){.auth-gate{padding:12px}.auth-card{border-radius:22px}.auth-copy{padding:30px 22px}.auth-art{min-height:265px}.portal-mini.sonic-sphere{width:235px;height:235px}.hero-copy h1{font-size:52px}.hero-ticker{gap:10px;font-size:7px;letter-spacing:.12em}.portal-object.audio-reactor{width:82vw}.reactor-bars{height:70px}.cursor-glow,.cursor-signal{display:none}}
@media(prefers-reduced-motion:reduce){.aurora-field i,.sonic-halo,.sonic-disc,.mini-spectrum i,.reactor-orbit,.reactor-disc,.reactor-bars i,.reactor-node,.floating-chip{animation:none!important}.auth-card{transform:none!important}.fx-stage{display:none!important}}

/* v4 conflict guards for legacy portal selectors */
.portal-mini.sonic-sphere:before,.portal-mini.sonic-sphere:after{display:none!important}.portal-object.audio-reactor>span,.portal-object.audio-reactor .reactor-disc span{animation:none}.portal-object.audio-reactor .reactor-node{animation:nodeFloat 4s ease-in-out infinite}.portal-object.audio-reactor .node-b{animation-duration:5s;animation-delay:1s}.portal-stage.fx-stage:before{display:none!important}.portal-stage.fx-stage .ring-a{width:24vmin;height:24vmin}.portal-stage.fx-stage .ring-b{width:32vmin;height:32vmin}


/* ================================================================
   MusicHubMycn v5 — PRISM PULSE
   No portal-on-scroll. Theme-reactive particles, light trails and
   gentle scroll motion. Themes: red, pink, purple, blue, cyan, salmon.
   ================================================================ */
:root{
  --accent:#59e4ff;--accent2:#6b8cff;--accent3:#c36dff;--accent4:#72ffd2;
  --accent-rgb:89,228,255;--accent2-rgb:107,140,255;--accent3-rgb:195,109,255;--accent4-rgb:114,255,210;
  --cyan:var(--accent);--violet:var(--accent2);--pink:var(--accent3);--mint:var(--accent4);
  --theme-name:"CYAN";--scroll-shift:0px;
}
html[data-theme="red"]{--accent:#ff4f67;--accent2:#ff734f;--accent3:#ff2d55;--accent4:#ffd0d7;--accent-rgb:255,79,103;--accent2-rgb:255,115,79;--accent3-rgb:255,45,85;--accent4-rgb:255,208,215;--theme-name:"RED"}
html[data-theme="pink"]{--accent:#ff5aa7;--accent2:#d66cff;--accent3:#ff8dc6;--accent4:#ffd0e7;--accent-rgb:255,90,167;--accent2-rgb:214,108,255;--accent3-rgb:255,141,198;--accent4-rgb:255,208,231;--theme-name:"PINK"}
html[data-theme="purple"]{--accent:#a66cff;--accent2:#6f70ff;--accent3:#db63ff;--accent4:#d5c0ff;--accent-rgb:166,108,255;--accent2-rgb:111,112,255;--accent3-rgb:219,99,255;--accent4-rgb:213,192,255;--theme-name:"PURPLE"}
html[data-theme="blue"]{--accent:#4f8dff;--accent2:#315dff;--accent3:#72b8ff;--accent4:#a6d9ff;--accent-rgb:79,141,255;--accent2-rgb:49,93,255;--accent3-rgb:114,184,255;--accent4-rgb:166,217,255;--theme-name:"BLUE"}
html[data-theme="cyan"]{--accent:#59e4ff;--accent2:#6b8cff;--accent3:#66ffd4;--accent4:#b4f6ff;--accent-rgb:89,228,255;--accent2-rgb:107,140,255;--accent3-rgb:102,255,212;--accent4-rgb:180,246,255;--theme-name:"CYAN"}
html[data-theme="salmon"]{--accent:#ff8b79;--accent2:#ff5f78;--accent3:#ffb18f;--accent4:#ffd4bf;--accent-rgb:255,139,121;--accent2-rgb:255,95,120;--accent3-rgb:255,177,143;--accent4-rgb:255,212,191;--theme-name:"SALMON"}

html,body{background:#05050a}
body{
  background:
    radial-gradient(circle at var(--mx,74%) var(--my,20%),rgba(var(--accent-rgb),.12),transparent 25%),
    radial-gradient(circle at 13% 78%,rgba(var(--accent3-rgb),.08),transparent 32%),
    radial-gradient(circle at 82% 82%,rgba(var(--accent2-rgb),.06),transparent 28%),
    linear-gradient(145deg,#040408 0,#080812 48%,#05050b 100%);
  transition:background .55s ease,color .35s ease;
}
.ambient-grid{background-image:linear-gradient(rgba(var(--accent-rgb),.035) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--accent2-rgb),.03) 1px,transparent 1px);transform:translate3d(0,var(--scroll-shift),0);transition:opacity .25s ease,filter .25s ease}
.aurora-field{transform:translate3d(0,calc(var(--scroll-shift) * .55),0);transition:filter .5s ease,opacity .5s ease}
.aurora-field i:nth-child(1){background:radial-gradient(circle,var(--accent2),transparent 68%)}
.aurora-field i:nth-child(2){background:radial-gradient(circle,var(--accent),transparent 68%)}
.aurora-field i:nth-child(3){background:radial-gradient(circle,var(--accent3),transparent 68%)}
.cursor-glow{background:radial-gradient(circle,rgba(var(--accent-rgb),.17),rgba(var(--accent2-rgb),.07) 42%,transparent 72%)}
.cursor-signal{border-color:rgba(var(--accent-rgb),.28)}.cursor-signal i{background:var(--accent);box-shadow:0 0 20px var(--accent)}.cursor-signal b{border-color:rgba(var(--accent2-rgb),.46)}

/* no full-screen portal / wipe at all */
.portal-stage,.fx-stage,.fx-bloom,.fx-ring,.fx-streak{display:none!important}

/* floating light trails: decorative, slow and non-blocking */
.light-trails{position:fixed;inset:-20%;z-index:1;pointer-events:none;overflow:hidden;opacity:.55;filter:blur(.2px)}
.light-trails .trail{position:absolute;width:46vw;height:1px;border-radius:999px;background:linear-gradient(90deg,transparent,rgba(var(--accent-rgb),.32),rgba(255,255,255,.22),rgba(var(--accent3-rgb),.20),transparent);box-shadow:0 0 28px rgba(var(--accent-rgb),.11);transform-origin:center;will-change:transform,opacity}
.light-trails .t1{left:3%;top:22%;transform:rotate(-18deg);animation:trailDrift1 13s ease-in-out infinite}
.light-trails .t2{right:0;top:39%;transform:rotate(16deg);animation:trailDrift2 17s ease-in-out infinite}
.light-trails .t3{left:24%;bottom:18%;width:62vw;transform:rotate(7deg);animation:trailDrift3 21s ease-in-out infinite}
.light-trails .t4{left:40%;top:8%;width:34vw;transform:rotate(62deg);opacity:.35;animation:trailDrift4 19s ease-in-out infinite}

/* global theme dock */
.theme-picker{position:fixed;right:18px;bottom:18px;z-index:140;display:flex;flex-direction:column;align-items:flex-end;gap:8px;pointer-events:auto}
.theme-toggle{height:40px;display:flex;align-items:center;gap:9px;padding:0 13px;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(8,9,17,.76);backdrop-filter:blur(18px) saturate(150%);box-shadow:0 12px 42px rgba(0,0,0,.35),0 0 28px rgba(var(--accent-rgb),.08);cursor:pointer;color:#dfe3ef;font:800 9px/1 ui-monospace,monospace;letter-spacing:.12em;transition:.25s ease}
.theme-toggle:hover{border-color:rgba(var(--accent-rgb),.48);transform:translateY(-2px);box-shadow:0 15px 45px rgba(0,0,0,.4),0 0 30px rgba(var(--accent-rgb),.13)}
.theme-toggle-dot{width:11px;height:11px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent3));box-shadow:0 0 16px rgba(var(--accent-rgb),.65)}
.theme-menu{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:8px;border:1px solid rgba(255,255,255,.11);border-radius:17px;background:rgba(8,9,17,.88);backdrop-filter:blur(24px) saturate(155%);box-shadow:0 18px 70px rgba(0,0,0,.5);opacity:0;transform:translateY(8px) scale(.96);pointer-events:none;transition:.22s ease;transform-origin:bottom right}
.theme-picker.is-open .theme-menu{opacity:1;transform:none;pointer-events:auto}
.theme-menu button{width:74px;height:48px;border:1px solid transparent;border-radius:11px;background:rgba(255,255,255,.025);color:#7f8295;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer;font:700 7px/1 ui-monospace,monospace;letter-spacing:.08em;transition:.2s ease;text-transform:uppercase}
.theme-menu button i{display:block;width:18px;height:8px;border-radius:99px;background:var(--swatch);box-shadow:0 0 16px color-mix(in srgb,var(--swatch) 40%,transparent)}
.theme-menu button:hover,.theme-menu button.is-active{border-color:rgba(255,255,255,.13);background:rgba(255,255,255,.055);color:#fff;transform:translateY(-1px)}
.theme-menu button.is-active{box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.23),0 0 18px rgba(var(--accent-rgb),.08)}

/* richer glass + themed UI */
.auth-gate{background:rgba(3,3,9,.48)}
.auth-card{border-color:rgba(var(--accent-rgb),.16);box-shadow:0 44px 150px rgba(0,0,0,.72),0 0 100px rgba(var(--accent-rgb),.08),0 0 150px rgba(var(--accent2-rgb),.055)}
.auth-card:before{background:radial-gradient(650px circle at var(--card-x,50%) var(--card-y,50%),rgba(var(--accent-rgb),.15),rgba(var(--accent2-rgb),.045) 40%,transparent 66%)}
.auth-art{background:radial-gradient(circle at 50% 44%,rgba(var(--accent-rgb),.12),transparent 15%),radial-gradient(circle at 58% 46%,rgba(var(--accent2-rgb),.14),transparent 31%),radial-gradient(circle at 42% 62%,rgba(var(--accent3-rgb),.08),transparent 38%),linear-gradient(145deg,rgba(11,12,24,.9),rgba(5,5,10,.97))}
.auth-art:before{background:conic-gradient(from 0deg,transparent 0 12%,rgba(var(--accent-rgb),.09) 12.4%,transparent 13% 37%,rgba(var(--accent2-rgb),.07) 37.4%,transparent 38% 65%,rgba(var(--accent3-rgb),.06) 65.5%,transparent 66%)}
.portal-mini.sonic-sphere{background:radial-gradient(circle,rgba(255,255,255,.96) 0 1.5%,rgba(var(--accent-rgb),.24) 2%,rgba(var(--accent2-rgb),.11) 13%,rgba(var(--accent3-rgb),.05) 27%,rgba(7,7,14,.18) 42%,transparent 68%);filter:drop-shadow(0 0 68px rgba(var(--accent-rgb),.12))}
.halo-a{border-color:rgba(var(--accent-rgb),.32);box-shadow:0 0 48px rgba(var(--accent-rgb),.10)}.halo-b{border-color:rgba(var(--accent2-rgb),.35)}.halo-c{border-color:rgba(var(--accent3-rgb),.34)}
.sonic-disc,.reactor-disc{background:conic-gradient(from 180deg,var(--accent),#fff,var(--accent3),var(--accent2),var(--accent));box-shadow:0 0 42px rgba(var(--accent-rgb),.32),0 0 76px rgba(var(--accent2-rgb),.16)}
.auth-copy h1 em,.hero-copy h1 em{background:linear-gradient(90deg,var(--accent),var(--accent4) 48%,var(--accent3));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 40px rgba(var(--accent-rgb),.08)}
.wordmark-dot,.live-dot{background:var(--accent);box-shadow:0 0 18px var(--accent)}
.auth-tab.is-active{border-color:var(--accent);text-shadow:0 0 16px rgba(var(--accent-rgb),.38)}
.field input:focus,.field select:focus{border-color:rgba(var(--accent-rgb),.60);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.07),0 14px 38px rgba(0,0,0,.34)}
.primary{background:linear-gradient(105deg,#fff 0,var(--accent4) 16%,var(--accent) 42%,var(--accent2) 72%,var(--accent3) 100%);box-shadow:0 12px 34px rgba(var(--accent-rgb),.16),0 0 0 1px rgba(255,255,255,.19) inset}
.primary:hover{box-shadow:0 15px 46px rgba(var(--accent-rgb),.25),0 0 38px rgba(var(--accent2-rgb),.14)}
.ghost:hover{border-color:rgba(var(--accent-rgb),.46);background:rgba(var(--accent-rgb),.065);box-shadow:0 0 26px rgba(var(--accent-rgb),.09)}
.brand-glyph{border-color:rgba(var(--accent-rgb),.42);background:linear-gradient(135deg,rgba(var(--accent-rgb),.16),rgba(var(--accent2-rgb),.13));box-shadow:0 0 24px rgba(var(--accent-rgb),.10)}
.user-chip>span{background:linear-gradient(135deg,var(--accent),var(--accent2));box-shadow:0 0 24px rgba(var(--accent-rgb),.16)}
.nav-item:hover{background:linear-gradient(90deg,rgba(var(--accent-rgb),.08),rgba(var(--accent2-rgb),.03))}.nav-item.is-active{background:linear-gradient(90deg,rgba(var(--accent-rgb),.15),rgba(var(--accent2-rgb),.065),transparent);box-shadow:inset 2px 0 var(--accent)}.nav-item.is-active span{color:var(--accent)}
.view:before{background:radial-gradient(circle,rgba(var(--accent2-rgb),.08),transparent 68%)}
.panel,.lab-shell,.dashboard-strip,.manifest{background:linear-gradient(145deg,rgba(17,18,31,.78),rgba(8,8,17,.74));border-color:rgba(255,255,255,.105);box-shadow:0 22px 72px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.03);transition:border-color .3s ease,box-shadow .3s ease,transform .3s ease}
.panel:hover,.manifest:hover{border-color:rgba(var(--accent-rgb),.25);box-shadow:0 28px 84px rgba(0,0,0,.3),0 0 42px rgba(var(--accent-rgb),.055);transform:translateY(-2px)}
.portal-object.audio-reactor{background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.94) 0 1.3%,rgba(var(--accent-rgb),.26) 2%,rgba(var(--accent2-rgb),.14) 12%,rgba(var(--accent3-rgb),.07) 26%,rgba(8,8,18,.18) 48%,transparent 70%);filter:drop-shadow(0 0 92px rgba(var(--accent-rgb),.16))}
.orbit-a{border-color:rgba(var(--accent-rgb),.28)}.orbit-b{border-color:rgba(var(--accent2-rgb),.31)}.orbit-c{border-color:rgba(var(--accent3-rgb),.29)}
.reactor-bars i{background:linear-gradient(to top,var(--accent2),var(--accent),var(--accent4))!important}.node-a{background:var(--accent);color:var(--accent)}.node-b{background:var(--accent3);color:var(--accent3)}.floating-chip span{color:var(--accent)}
.hero-ticker i{background:var(--accent);box-shadow:0 0 16px var(--accent)}.dashboard-strip article:after{background:linear-gradient(90deg,var(--accent),var(--accent2),var(--accent3),transparent)}
.download-note{background:linear-gradient(90deg,rgba(var(--accent-rgb),.055),rgba(var(--accent2-rgb),.035));border-color:rgba(var(--accent-rgb),.18)}
.visualizer-wrap{background:radial-gradient(circle at 50% 100%,rgba(var(--accent-rgb),.09),transparent 48%),linear-gradient(#070811,#06070e);border-color:rgba(var(--accent-rgb),.17)}
.lab-presets button.is-active{color:#071014;background:linear-gradient(90deg,var(--accent),var(--accent4))}.eq-band input[type=range]{accent-color:var(--accent)}.queue-progress i,.job-progress i{background:linear-gradient(90deg,var(--accent2),var(--accent),var(--accent4));box-shadow:0 0 16px rgba(var(--accent-rgb),.28)}

/* only soft scroll feedback — no flashes, no rings */
body.is-soft-scrolling .ambient-grid{opacity:.42;filter:brightness(1.09)}
body.is-soft-scrolling .topbar{box-shadow:0 8px 42px rgba(var(--accent-rgb),.045)}
.view.is-active{animation:viewSoft .46s cubic-bezier(.2,.72,.2,1) both}.view.is-active .reveal{animation:revealSoft .62s cubic-bezier(.2,.72,.2,1) both}
.scroll-fade{opacity:.72;transform:translateY(12px);transition:opacity .7s cubic-bezier(.18,.7,.2,1),transform .7s cubic-bezier(.18,.7,.2,1)}.scroll-fade.is-inview{opacity:1;transform:none}

@keyframes trailDrift1{0%,100%{transform:translate3d(-5vw,0,0) rotate(-18deg);opacity:.18}50%{transform:translate3d(18vw,6vh,0) rotate(-15deg);opacity:.62}}
@keyframes trailDrift2{0%,100%{transform:translate3d(8vw,0,0) rotate(16deg);opacity:.18}50%{transform:translate3d(-17vw,-4vh,0) rotate(12deg);opacity:.52}}
@keyframes trailDrift3{0%,100%{transform:translate3d(-8vw,0,0) rotate(7deg);opacity:.12}50%{transform:translate3d(12vw,-7vh,0) rotate(10deg);opacity:.48}}
@keyframes trailDrift4{0%,100%{transform:translate3d(0,-7vh,0) rotate(62deg);opacity:.10}50%{transform:translate3d(5vw,16vh,0) rotate(66deg);opacity:.38}}
@keyframes viewSoft{from{opacity:0;transform:translateY(9px);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}
@keyframes revealSoft{from{opacity:0;transform:translateY(18px);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}

@media(max-width:720px){.theme-picker{right:10px;bottom:10px}.theme-menu{grid-template-columns:repeat(2,1fr)}.theme-menu button{width:66px}.light-trails{opacity:.35}}
@media(prefers-reduced-motion:reduce){.light-trails{display:none}.scroll-fade{opacity:1;transform:none;transition:none}.view.is-active,.view.is-active .reveal{animation:none!important}}

/* =========================================================
   MusicHubMycn v6 — Aurora Studio
   Smooth background, floating navigation and integrated EQ.
   ========================================================= */
:root{--sidebar:208px;--top:82px}
.grain,.ambient-grid{display:none!important}
body{background:
  radial-gradient(1200px 900px at 8% -10%,rgba(var(--accent-rgb),.09),transparent 62%),
  radial-gradient(1000px 760px at 100% 12%,rgba(var(--accent2-rgb),.08),transparent 64%),
  radial-gradient(850px 700px at 58% 108%,rgba(var(--accent3-rgb),.065),transparent 62%),
  linear-gradient(145deg,#05060b 0%,#070812 44%,#04050a 100%);
  background-attachment:fixed}
.ambient-canvas{filter:none!important;image-rendering:auto!important;opacity:.92}
.aurora-field{filter:blur(70px) saturate(125%);opacity:.52}
.aurora-field i{border-radius:50%;will-change:transform;mix-blend-mode:screen}
.light-trails{opacity:.46;filter:blur(.25px)}
.light-trails .trail{height:1px;border-radius:99px;background:linear-gradient(90deg,transparent,rgba(var(--accent-rgb),.08),rgba(var(--accent-rgb),.28),rgba(var(--accent3-rgb),.12),transparent)}
.cursor-signal{opacity:.22!important}.cursor-glow{filter:blur(8px);opacity:.45!important}

.topbar{height:72px;inset:14px 18px auto calc(var(--sidebar) + 18px);border:1px solid rgba(255,255,255,.09);border-radius:18px;background:rgba(8,9,16,.72);backdrop-filter:blur(24px) saturate(150%);grid-template-columns:1fr auto auto;padding:0 18px;box-shadow:0 18px 60px rgba(0,0,0,.26),inset 0 1px rgba(255,255,255,.035)}
.sidebar{top:14px;left:14px;bottom:14px;width:var(--sidebar);border:1px solid rgba(255,255,255,.09);border-radius:22px;padding:18px 13px;background:linear-gradient(180deg,rgba(10,11,19,.82),rgba(6,7,13,.76));backdrop-filter:blur(26px) saturate(145%);box-shadow:0 22px 70px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.035)}
.workspace{margin-left:calc(var(--sidebar) + 14px);padding-top:100px}
.side-nav,.side-bottom{gap:8px}.nav-item{height:48px;border-radius:13px;grid-template-columns:38px 1fr;padding:0 10px;color:#777b8c;position:relative;overflow:hidden}.nav-item:before{content:"";position:absolute;inset:0;background:radial-gradient(180px circle at 0 50%,rgba(var(--accent-rgb),.14),transparent 70%);opacity:0;transition:.25s}.nav-item:hover:before,.nav-item.is-active:before{opacity:1}.nav-item:hover,.nav-item.is-active{background:rgba(255,255,255,.035);box-shadow:none;color:#f5f6ff}.nav-item.is-active{border:1px solid rgba(var(--accent-rgb),.18)}.nav-icon{width:30px;height:30px;border:1px solid rgba(255,255,255,.08);border-radius:10px;display:grid!important;place-items:center;font:700 14px/1 ui-sans-serif!important;color:#85889a!important;background:rgba(255,255,255,.025);z-index:1}.nav-item.is-active .nav-icon{color:#fff!important;border-color:rgba(var(--accent-rgb),.32);background:rgba(var(--accent-rgb),.12);box-shadow:0 0 22px rgba(var(--accent-rgb),.12)}.nav-item b{font-size:12px;z-index:1}
.brand-glyph{border-radius:10px;background:linear-gradient(135deg,rgba(var(--accent-rgb),.24),rgba(var(--accent2-rgb),.16));border-color:rgba(var(--accent-rgb),.28)}

.view{padding-top:54px}.view-head h1 em{font-style:normal;background:linear-gradient(90deg,var(--accent),var(--accent4),var(--accent3));background-clip:text;-webkit-background-clip:text;color:transparent;font-weight:520}.studio-head{align-items:flex-end}
.glass-card{border:1px solid rgba(255,255,255,.095);background:linear-gradient(145deg,rgba(14,16,28,.82),rgba(8,9,17,.72));backdrop-filter:blur(24px) saturate(145%);box-shadow:0 28px 90px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.035);border-radius:24px}

/* engine badge */
.engine-state{display:flex;align-items:center;gap:11px;min-width:240px;padding:12px 15px;border:1px solid rgba(255,255,255,.09);border-radius:15px;background:rgba(10,11,20,.65);backdrop-filter:blur(16px)}.engine-state>i{width:10px;height:10px;border-radius:50%;background:#7b7e8e;box-shadow:0 0 14px rgba(123,126,142,.35)}.engine-state div{display:flex;flex-direction:column;gap:4px}.engine-state b{font:800 9px/1 ui-monospace,monospace;letter-spacing:.08em}.engine-state span{font-size:10px;color:#777b8b}.engine-state.is-online{border-color:rgba(93,255,185,.17)}.engine-state.is-online>i{background:#5dffb9;box-shadow:0 0 18px rgba(93,255,185,.65)}.engine-state.is-offline{border-color:rgba(255,95,119,.18)}.engine-state.is-offline>i{background:#ff5f77;box-shadow:0 0 18px rgba(255,95,119,.5)}

/* download + Ears-like EQ */
.download-studio{display:grid;grid-template-columns:minmax(360px,.78fr) minmax(560px,1.35fr);gap:18px;align-items:start}.studio-source,.studio-eq,.studio-submit{padding:24px}.studio-eq{grid-row:span 2}.studio-submit{grid-column:1;display:flex;flex-direction:column;gap:18px}.section-cap{display:flex;align-items:center;gap:12px;margin-bottom:18px}.section-cap>span{width:34px;height:34px;border:1px solid rgba(var(--accent-rgb),.24);border-radius:11px;display:grid;place-items:center;background:rgba(var(--accent-rgb),.07);font:800 9px ui-monospace,monospace;color:var(--accent)}.section-cap div{display:flex;flex-direction:column;gap:4px}.section-cap b{font:800 10px/1 ui-monospace,monospace;letter-spacing:.13em}.section-cap small{font:700 8px/1 ui-monospace,monospace;letter-spacing:.12em;color:#6f7386}.source-field input{height:66px!important;border-radius:15px!important;font-size:15px!important;background:rgba(4,5,11,.7)!important}.source-options{display:grid;grid-template-columns:1fr 1fr auto 72px;gap:10px;align-items:end}.studio-toggle{height:50px;margin-bottom:13px;padding:0 12px;border:1px solid rgba(255,255,255,.09);border-radius:12px;background:rgba(255,255,255,.025)}
.eq-stage-head{display:flex;justify-content:space-between;align-items:flex-start}.eq-power{display:flex;align-items:center;gap:9px;height:34px;padding:0 11px;border:1px solid rgba(var(--accent-rgb),.2);border-radius:999px;background:rgba(var(--accent-rgb),.055);cursor:pointer}.eq-power input{position:absolute;opacity:0}.eq-power i{width:8px;height:8px;border-radius:50%;background:#5dffb9;box-shadow:0 0 13px rgba(93,255,185,.6)}.eq-power:has(input:not(:checked)) i{background:#6b6e7b;box-shadow:none}.eq-power b{font:800 8px ui-monospace,monospace;letter-spacing:.11em}.eq-preset-row{display:flex;gap:7px;flex-wrap:wrap;margin:2px 0 14px}.eq-preset-row button,.donation-quick button{height:32px;padding:0 11px;border:1px solid rgba(255,255,255,.08);border-radius:999px;background:rgba(255,255,255,.025);color:#7d8193;font:800 8px ui-monospace,monospace;letter-spacing:.07em;cursor:pointer;transition:.2s}.eq-preset-row button:hover,.eq-preset-row button.is-active,.donation-quick button:hover{color:#fff;border-color:rgba(var(--accent-rgb),.27);background:rgba(var(--accent-rgb),.08);box-shadow:0 0 22px rgba(var(--accent-rgb),.08)}
.eq-graph-wrap{position:relative;height:340px;border:1px solid rgba(255,255,255,.075);border-radius:18px;overflow:hidden;background:radial-gradient(600px 260px at 50% 110%,rgba(var(--accent-rgb),.10),transparent 70%),linear-gradient(180deg,rgba(4,6,13,.92),rgba(8,9,18,.74));transition:.25s}.eq-graph-wrap:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 35%,rgba(var(--accent-rgb),.025),transparent 62%)}.eq-graph-wrap.is-disabled{opacity:.38;filter:saturate(.3)}#download-eq-graph{width:100%;height:100%;display:block;touch-action:none;cursor:crosshair}.eq-db-scale{position:absolute;left:9px;top:18px;bottom:34px;display:flex;flex-direction:column;justify-content:space-between;color:#555b70;font:700 8px ui-monospace,monospace;pointer-events:none}.eq-frequency-labels{position:absolute;left:45px;right:18px;bottom:10px;display:flex;justify-content:space-between;color:#596075;font:700 8px ui-monospace,monospace;pointer-events:none}.eq-control-row{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-top:16px}.preamp-inline{display:grid;grid-template-columns:auto minmax(130px,220px) 64px;align-items:center;gap:10px;font:800 8px ui-monospace,monospace;letter-spacing:.08em;color:#757a8e}.preamp-inline input{accent-color:var(--accent)}.preamp-inline output{color:#dfe6f6}.preview-actions{display:flex;align-items:center;gap:8px}.preview-file input{display:none}.preview-file span,.preview-play{height:38px;padding:0 12px;display:flex;align-items:center;border:1px solid rgba(255,255,255,.09);border-radius:10px;background:rgba(255,255,255,.025);font:800 8px ui-monospace,monospace;letter-spacing:.08em;cursor:pointer}.preview-play{gap:8px}.preview-play i{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px rgba(var(--accent-rgb),.6)}.preview-play:disabled{opacity:.35;cursor:not-allowed}.preview-player-shell{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;margin-top:12px;padding:10px 12px;border:1px solid rgba(255,255,255,.075);border-radius:13px;background:rgba(4,5,11,.5)}#download-preview-player{width:100%;height:36px}.preview-meta{display:flex;flex-direction:column;text-align:right;gap:3px}.preview-meta span{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}.preview-meta b{font:700 8px ui-monospace,monospace;color:#6c7184}.eq-helper{margin:13px 0 0;color:#666b7e;font-size:11px;line-height:1.55}
.download-summary{display:flex;align-items:center;gap:13px}.download-summary>div{display:flex;flex-direction:column;gap:4px}.download-summary b{font:800 9px ui-monospace,monospace;letter-spacing:.1em}.download-summary small{font-size:10px;color:#707589}.summary-wave{display:flex;align-items:center;gap:2px;height:30px}.summary-wave i{width:3px;border-radius:99px;background:linear-gradient(var(--accent4),var(--accent));animation:v6Wave .8s ease-in-out infinite alternate}.summary-wave i:nth-child(1){height:9px}.summary-wave i:nth-child(2){height:22px;animation-delay:-.3s}.summary-wave i:nth-child(3){height:14px;animation-delay:-.55s}.summary-wave i:nth-child(4){height:27px;animation-delay:-.15s}.summary-wave i:nth-child(5){height:12px;animation-delay:-.45s}.studio-download-button{height:62px;border-radius:15px;font-size:12px;justify-content:space-between;padding:0 22px}.download-live-strip{display:grid;grid-template-columns:1fr .8fr;gap:18px;margin-top:18px}.download-live-strip>div{border:1px solid rgba(255,255,255,.075);border-radius:20px;padding:20px;background:rgba(9,10,18,.55);backdrop-filter:blur(18px)}.download-live-strip .kicker{margin:0 0 12px}.worker-tip{display:flex;align-items:center;gap:12px}.worker-tip>i{width:10px;height:10px;border-radius:50%;background:var(--accent);box-shadow:0 0 20px rgba(var(--accent-rgb),.55)}.worker-tip p{margin:0;font-size:11px;line-height:1.55;color:#707588}
.queue-row.failed{border-color:rgba(255,88,113,.18)!important}.queue-row.failed .status-pill{color:#ff8ca1;border-color:rgba(255,88,113,.24)}.queue-error{display:block!important;color:#ff899e!important;margin-top:5px!important;white-space:normal!important}

/* pricing + support */
.pricing-grid{display:grid;grid-template-columns:repeat(2,minmax(280px,520px));gap:20px;max-width:1080px}.pricing-card{padding:30px;position:relative;overflow:hidden}.pricing-card.featured{border-color:rgba(var(--accent-rgb),.3);box-shadow:0 28px 100px rgba(0,0,0,.3),0 0 70px rgba(var(--accent-rgb),.08)}.plan-orbit{display:inline-grid;place-items:center;height:28px;padding:0 11px;border-radius:999px;border:1px solid rgba(255,255,255,.1);font:800 8px ui-monospace,monospace;letter-spacing:.13em;color:#969aab}.pricing-card h2{font-size:42px;margin:24px 0 4px;letter-spacing:-.04em}.pricing-card>p{color:#74798b}.price{margin:28px 0}.price b{font-size:26px}.price small{color:#666b7a}.pricing-card ul{list-style:none;padding:0;margin:0 0 28px;display:grid;gap:12px}.pricing-card li{font-size:12px;color:#b3b6c3}.pricing-card li:before{content:"✓";color:var(--accent);margin-right:10px}.popular{position:absolute;right:18px;top:18px;font:800 7px ui-monospace,monospace;letter-spacing:.12em;color:var(--accent);padding:7px 9px;border:1px solid rgba(var(--accent-rgb),.23);border-radius:999px;background:rgba(var(--accent-rgb),.06)}.ad-slot{margin-top:24px;max-width:1080px;padding:18px 22px;border:1px dashed rgba(255,255,255,.10);border-radius:18px;background:rgba(255,255,255,.018);display:flex;gap:16px;align-items:center}.ad-slot span{font:800 8px ui-monospace,monospace;color:#666b7b;letter-spacing:.14em}.ad-slot p{margin:0;font-size:11px;color:#626777}.support-hero{display:grid;grid-template-columns:1fr minmax(320px,480px);gap:36px;align-items:center;min-height:560px}.support-hero h1{font-size:clamp(54px,7vw,104px);line-height:.9;letter-spacing:-.06em;margin:0}.support-hero h1 em{font-style:normal;background:linear-gradient(90deg,var(--accent),var(--accent4),var(--accent3));background-clip:text;-webkit-background-clip:text;color:transparent}.support-hero>div>p:not(.kicker){max-width:580px;color:#7d8294;line-height:1.65}.donation-card{padding:30px}.heart-pulse{display:grid;place-items:center;width:74px;height:74px;border-radius:24px;background:radial-gradient(circle,rgba(var(--accent-rgb),.18),rgba(var(--accent2-rgb),.05));border:1px solid rgba(var(--accent-rgb),.22);font-size:34px;color:var(--accent);box-shadow:0 0 50px rgba(var(--accent-rgb),.09);animation:heartFloat 3s ease-in-out infinite}.donation-quick{display:flex;gap:7px;margin:14px 0 18px;flex-wrap:wrap}

/* calmer hero — no portal language/flash */
.hero-portal{overflow:hidden}.portal-object.audio-reactor{border-radius:34%;border-color:rgba(var(--accent-rgb),.12);background:radial-gradient(circle at 50% 50%,rgba(var(--accent-rgb),.18),transparent 16%),radial-gradient(circle at 50% 50%,rgba(var(--accent2-rgb),.08),transparent 46%);filter:drop-shadow(0 0 70px rgba(var(--accent-rgb),.10));animation:v6ReactorFloat 7s ease-in-out infinite}.reactor-orbit{opacity:.5}.reactor-disc{animation:discSpin 16s linear infinite}.reactor-bars i{animation-duration:calc(1.4s + var(--i)*.025s)!important}.hero-portal>p{color:#4f5363}

@keyframes v6Wave{from{transform:scaleY(.55);opacity:.55}to{transform:scaleY(1.05);opacity:1}}@keyframes heartFloat{50%{transform:translateY(-5px) rotate(-3deg)}}@keyframes v6ReactorFloat{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-8px) rotate(1deg)}}

@media(max-width:1180px){.download-studio{grid-template-columns:1fr}.studio-eq{grid-row:auto}.studio-submit{grid-column:auto}.source-options{grid-template-columns:1fr 1fr}.pricing-grid{grid-template-columns:1fr}.support-hero{grid-template-columns:1fr}.download-live-strip{grid-template-columns:1fr}}
@media(max-width:980px){:root{--sidebar:0px}.topbar{left:12px;right:12px;top:10px}.sidebar{left:10px;right:10px;bottom:10px;top:auto;width:auto;height:66px;border-radius:18px;padding:7px 9px;flex-direction:row}.side-nav{display:grid;grid-template-columns:repeat(6,1fr);gap:3px;width:100%}.side-bottom{display:none}.nav-item{height:50px;display:flex!important;justify-content:center;padding:0}.nav-item b{display:none}.nav-icon{display:grid!important}.workspace{margin-left:0;padding-top:94px;padding-bottom:80px}.eq-control-row{align-items:stretch;flex-direction:column}.preview-actions{flex-wrap:wrap}.studio-head{align-items:flex-start;flex-direction:column}.engine-state{min-width:0;width:100%}}
@media(max-width:720px){.view{padding:30px 14px 86px}.download-studio{gap:12px}.studio-source,.studio-eq,.studio-submit{padding:17px;border-radius:18px}.source-options{grid-template-columns:1fr 1fr}.eq-graph-wrap{height:280px}.eq-frequency-labels{font-size:6px}.preview-actions .ghost,.preview-file span{width:100%;justify-content:center}.preview-player-shell{grid-template-columns:1fr}.preview-meta{text-align:left}.download-live-strip{gap:12px}.support-hero h1{font-size:50px}.side-nav{grid-template-columns:repeat(6,1fr)}.nav-item:nth-child(6){display:none!important}}
@media(prefers-reduced-motion:reduce){.summary-wave i,.heart-pulse,.portal-object.audio-reactor{animation:none!important}}