@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&family=Space+Mono:wght@400;700&display=swap');
*{box-sizing:border-box;margin:0;padding:0}
:root{--p:#8b5cf6;--pc:#c084fc;--c:#22d3ee;--g:#34d399;--bg:#05050f;--bg2:#07071a;--b:rgba(139,92,246,.18);--mono:'Space Mono',monospace;--sans:'Space Grotesk',sans-serif}
body{margin:0;padding:0;background:var(--bg)}
.app{background:var(--bg);color:#e2e2f0;font-family:var(--sans);min-height:640px;position:relative}
.screen{display:none;flex-direction:column;min-height:640px;position:relative}
.screen.active{display:flex}
.neon-bg{position:fixed;inset:0;pointer-events:none;z-index:0}
.z1{position:relative;z-index:1}
.mono{font-family:var(--mono)}

/* SPLASH */
#s-splash{background:#05050f;align-items:center;justify-content:center;overflow:hidden}
.sp-wrap{text-align:center;position:relative;z-index:2}
.sp-ring{width:110px;height:110px;border-radius:50%;border:1.5px solid rgba(139,92,246,.12);border-top-color:#8b5cf6;border-right-color:#c084fc;animation:sp-spin 1.4s linear infinite;margin:0 auto 1.6rem;position:relative;display:flex;align-items:center;justify-content:center}
.sp-ring::after{content:'';position:absolute;inset:10px;border-radius:50%;border:1px solid rgba(139,92,246,.07);border-bottom-color:#8b5cf6;animation:sp-spin 2.1s linear infinite reverse}
@keyframes sp-spin{to{transform:rotate(360deg)}}
.sp-I{font-family:var(--mono);font-size:52px;font-weight:700;color:#fff;line-height:1;position:relative;opacity:0;transform:scale(.5);transition:opacity .7s,transform .7s;animation:none}
.sp-I::before{content:'I';position:absolute;left:-3px;top:1px;color:#00fff7;opacity:.5;clip-path:polygon(0 22%,100% 22%,100% 40%,0 40%)}
.sp-I::after{content:'I';position:absolute;left:3px;top:-1px;color:#ff2cf4;opacity:.4;clip-path:polygon(0 60%,100% 60%,100% 78%,0 78%)}
.sp-word{font-family:var(--mono);font-size:26px;font-weight:700;letter-spacing:.18em;color:#fff;margin-top:.5rem;opacity:0;transition:opacity .6s}
.sp-word b{color:var(--p)}
.sp-sub{font-family:var(--mono);font-size:10px;letter-spacing:.22em;color:rgba(200,200,220,.28);text-transform:uppercase;margin-top:.3rem;opacity:0;transition:opacity .5s}
.sp-bar{width:200px;height:2px;background:rgba(139,92,246,.1);margin:1.6rem auto .6rem;border-radius:1px;overflow:hidden}
.sp-fill{height:2px;background:linear-gradient(90deg,#7c3aed,#c084fc);width:0%;transition:width .15s linear;border-radius:1px}
.sp-pct{font-family:var(--mono);font-size:11px;color:rgba(139,92,246,.55);letter-spacing:.1em;margin-bottom:.5rem}
.sp-step{font-family:var(--mono);font-size:10px;color:rgba(200,200,220,.22);letter-spacing:.08em;height:16px;transition:opacity .3s}
.sp-dots{display:inline-flex;gap:5px;margin-top:1.4rem}
.sp-dot{width:5px;height:5px;border-radius:50%;background:rgba(139,92,246,.18)}
.sp-dot.a{background:#8b5cf6;animation:sp-pulse 1.2s ease-in-out infinite}
.sp-dot:nth-child(2).a{animation-delay:.2s}
.sp-dot:nth-child(3).a{animation-delay:.4s}
@keyframes sp-pulse{0%,100%{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}

/* AUTH */
#s-auth{background:#05050f;align-items:center;justify-content:center;padding:2rem 1rem}
.auth-box{background:rgba(7,7,26,.96);border:.5px solid var(--b);border-top:2px solid var(--p);padding:2rem;width:100%;max-width:360px}
.auth-I{font-family:var(--mono);font-size:40px;font-weight:700;color:#fff;text-align:center;line-height:1;margin-bottom:.25rem;position:relative}
.auth-I::before{content:'I';position:absolute;left:50%;margin-left:-7px;top:2px;color:#00fff7;opacity:.4;clip-path:polygon(0 22%,100% 22%,100% 38%,0 38%)}
.auth-logo{font-family:var(--mono);font-size:18px;font-weight:700;color:#fff;letter-spacing:.1em;text-align:center;margin-bottom:.2rem}
.auth-logo b{color:var(--p)}
.auth-tagline{font-family:var(--mono);font-size:10px;color:rgba(200,200,220,.28);letter-spacing:.15em;text-transform:uppercase;text-align:center;margin-bottom:1.5rem}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:.5px;background:rgba(139,92,246,.1);margin-bottom:1.25rem}
.auth-tab{background:var(--bg2);padding:.6rem;text-align:center;cursor:pointer;font-family:var(--mono);font-size:11px;letter-spacing:.07em;color:rgba(200,200,220,.35);border-top:2px solid transparent;transition:all .2s}
.auth-tab.sel{border-top-color:var(--p);color:#e2e2f0;background:rgba(139,92,246,.08)}
.af{margin-bottom:.65rem}
.al{font-family:var(--mono);font-size:9px;color:rgba(200,200,220,.32);letter-spacing:.1em;text-transform:uppercase;margin-bottom:4px;display:block}
.ai{width:100%;background:#030310;border:.5px solid rgba(139,92,246,.2);color:#e2e2f0;font-family:var(--mono);font-size:12px;padding:8px 11px;outline:none;transition:border-color .2s}
.ai:focus{border-color:var(--p)}
.ai::placeholder{color:rgba(200,200,220,.18)}
.a-submit{width:100%;padding:11px;background:var(--p);color:#fff;border:none;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;margin-top:.2rem;transition:background .2s}
.a-submit:hover{background:#7c3aed}
.a-note{font-size:12px;color:rgba(200,200,220,.22);text-align:center;margin-top:.65rem;line-height:1.5}
.a-note span{color:var(--pc);cursor:pointer}
.a-div{display:flex;align-items:center;gap:.65rem;margin:.65rem 0}
.a-div::before,.a-div::after{content:'';flex:1;height:.5px;background:rgba(139,92,246,.13)}
.a-div span{font-family:var(--mono);font-size:10px;color:rgba(200,200,220,.22)}
.a-social{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.a-soc{padding:7px;border:.5px solid rgba(139,92,246,.18);background:transparent;color:rgba(200,200,220,.45);font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:5px;font-family:var(--mono);transition:all .2s}
.a-soc:hover{border-color:rgba(139,92,246,.38);color:#e2e2f0}

/* TUTORIAL */
#s-tutorial{background:#05050f;align-items:center;justify-content:center;padding:2rem 1rem}
.tut-box{background:rgba(7,7,26,.96);border:.5px solid var(--b);border-top:2px solid var(--p);padding:1.75rem;width:100%;max-width:440px}
.tut-bar{display:flex;gap:3px;margin-bottom:1.25rem}
.tut-dot{flex:1;height:3px;background:rgba(139,92,246,.12);transition:background .3s}
.tut-dot.on{background:var(--p)}
.tut-icon{font-size:32px;margin-bottom:.65rem;display:block}
.tut-title{font-size:19px;font-weight:500;color:#fff;margin-bottom:.4rem}
.tut-desc{font-size:13px;color:rgba(200,200,220,.48);line-height:1.7;margin-bottom:1rem}
.tut-hl{background:rgba(139,92,246,.07);border:.5px solid rgba(139,92,246,.18);padding:.75rem;margin-bottom:1rem}
.tut-hl-row{display:flex;align-items:center;gap:7px;padding:.25rem 0;font-size:12px;color:rgba(200,200,220,.6)}
.tut-hl-row i{font-size:14px;color:var(--p);flex-shrink:0}
.tut-nav{display:flex;justify-content:space-between;align-items:center}
.tut-skip{font-family:var(--mono);font-size:10px;color:rgba(200,200,220,.22);cursor:pointer;background:none;border:none;letter-spacing:.07em}
.tut-skip:hover{color:rgba(200,200,220,.45)}
.tut-ctr{font-family:var(--mono);font-size:10px;color:rgba(200,200,220,.22)}
.tut-next{font-family:var(--mono);font-size:11px;padding:8px 20px;background:var(--p);color:#fff;border:none;cursor:pointer;letter-spacing:.08em;text-transform:uppercase;transition:background .2s}
.tut-next:hover{background:#7c3aed}

/* HOME */
#s-home{background:var(--bg)}
.app-nav{display:flex;align-items:center;justify-content:space-between;padding:.7rem 1.5rem;border-bottom:.5px solid var(--b);background:rgba(5,5,15,.97)}
.nav-logo{font-family:var(--mono);font-size:15px;font-weight:700;color:#fff;cursor:pointer;display:flex;align-items:center;gap:5px;letter-spacing:.06em}
.nav-logo b{color:var(--p)}
.logo-I-wrap{position:relative;display:inline-block;line-height:1}
.logo-I-wrap::before{content:'I';position:absolute;left:-2px;top:1px;color:#00fff7;opacity:.35;clip-path:polygon(0 22%,100% 22%,100% 38%,0 38%)}
.nav-right{display:flex;align-items:center;gap:.45rem}
.nbtn{font-family:var(--mono);font-size:10px;padding:5px 11px;border:.5px solid;background:transparent;cursor:pointer;letter-spacing:.07em;text-transform:uppercase;transition:all .2s}
.nav-av{width:30px;height:30px;border-radius:50%;background:rgba(139,92,246,.15);border:.5px solid var(--p);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:10px;font-weight:700;color:var(--p);cursor:pointer}
.hero{padding:2.75rem 2rem 1.75rem;text-align:center}
.hbadge{display:inline-block;font-family:var(--mono);font-size:10px;letter-spacing:.16em;color:var(--pc);border:.5px solid rgba(192,132,252,.26);padding:4px 13px;margin-bottom:1.1rem;text-transform:uppercase}
.htitle{font-family:var(--mono);font-size:clamp(22px,5vw,42px);font-weight:700;line-height:1.08;color:#fff;margin-bottom:.75rem}
.htitle .acc{color:var(--p)}
.hdesc{font-size:14px;color:rgba(200,200,220,.42);max-width:400px;margin:0 auto 1.5rem;line-height:1.7}
.hctas{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;margin-bottom:1.75rem}
.hcta-p{font-family:var(--mono);font-size:11px;font-weight:700;padding:9px 22px;background:var(--p);color:#fff;border:none;cursor:pointer;letter-spacing:.08em;text-transform:uppercase;transition:background .2s}
.hcta-p:hover{background:#7c3aed}
.hcta-g{font-family:var(--mono);font-size:11px;padding:9px 22px;background:transparent;color:rgba(200,200,220,.5);border:.5px solid rgba(200,200,220,.16);cursor:pointer;letter-spacing:.08em;text-transform:uppercase;transition:all .2s}
.hcta-g:hover{color:#e2e2f0;border-color:rgba(200,200,220,.38)}
.ticker{overflow:hidden;padding:.6rem 0;border-top:.5px solid rgba(139,92,246,.08);border-bottom:.5px solid rgba(139,92,246,.08)}
.ticker-inner{display:flex;gap:2rem;animation:tick 22s linear infinite;width:max-content}
.ti{font-family:var(--mono);font-size:10px;color:rgba(139,92,246,.38);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.ti::before{content:'// '}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.studios-label{padding:1.25rem 1.5rem .6rem;font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:rgba(255,255,255,.16);text-transform:uppercase;display:flex;align-items:center;gap:.65rem}
.studios-label::after{content:'';flex:1;height:.5px;background:rgba(255,255,255,.05)}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:rgba(139,92,246,.1);margin:0 1.5rem}
.card{background:var(--bg2);padding:1.6rem 1.25rem;border-top:2px solid transparent;cursor:pointer;transition:background .18s;user-select:none}
.card:hover{background:rgba(13,13,32,1)}
.card:active{background:rgba(20,20,40,1)}
.card.tb{border-top-color:#c084fc}
.card.vs{border-top-color:#22d3ee}
.card.ds{border-top-color:#34d399}
.card-num{font-family:var(--mono);font-size:10px;color:rgba(200,200,220,.18);letter-spacing:.1em;margin-bottom:.4rem}
.card-ic{font-size:24px;margin-bottom:.6rem;display:block}
.card-name{font-size:16px;font-weight:500;color:#fff;margin-bottom:.3rem}
.card-desc{font-size:12px;color:rgba(200,200,220,.38);line-height:1.6;margin-bottom:.75rem}
.card-tags{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:.85rem}
.ctag{font-family:var(--mono);font-size:9px;padding:2px 7px;letter-spacing:.06em;text-transform:uppercase}
.card-btn{font-family:var(--mono);font-size:10px;padding:7px 13px;border:.5px solid;background:transparent;cursor:pointer;letter-spacing:.07em;text-transform:uppercase;transition:all .2s;width:100%;display:block}
.hstats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:.5px solid rgba(139,92,246,.07);border-bottom:.5px solid rgba(139,92,246,.07);margin:1.25rem 1.5rem}
.hstat{padding:1.1rem .75rem;border-right:.5px solid rgba(139,92,246,.07);text-align:center}
.hstat:last-child{border-right:none}
.hstat-n{font-family:var(--mono);font-size:20px;font-weight:700;color:#fff}
.hstat-n b{color:var(--p)}
.hstat-l{font-size:10px;color:rgba(200,200,220,.25);letter-spacing:.07em;text-transform:uppercase;margin-top:2px}
.home-foot{padding:.85rem 1.5rem;display:flex;justify-content:space-between;border-top:.5px solid rgba(139,92,246,.06)}
.hf-l{font-family:var(--mono);font-size:10px;color:rgba(200,200,220,.13);letter-spacing:.08em}
.hf-r{font-size:10px;color:rgba(200,200,220,.15)}

/* SETUP WIZARD */
#s-setup{background:#05050f;align-items:center;justify-content:center;padding:2rem 1rem}
.wiz{background:rgba(7,7,26,.97);border:.5px solid var(--b);width:100%;max-width:460px}
.wiz-hd{padding:1.1rem 1.4rem;border-bottom:.5px solid var(--b);border-top:2px solid var(--p)}
.wiz-title{font-size:16px;font-weight:500;color:#fff;margin-bottom:2px}
.wiz-sub{font-size:12px;color:rgba(200,200,220,.38)}
.wiz-prog{height:2px;background:rgba(139,92,246,.1)}
.wiz-prog-fill{height:2px;background:var(--p);transition:width .3s}
.wiz-body{padding:1.25rem 1.4rem}
.wiz-q{font-size:14px;font-weight:500;color:#fff;margin-bottom:.3rem}
.wiz-hint{font-size:12px;color:rgba(200,200,220,.38);margin-bottom:.85rem;line-height:1.55}
.wiz-opts{display:flex;flex-direction:column;gap:.45rem;margin-bottom:1rem}
.wiz-opt{display:flex;align-items:center;gap:9px;padding:.65rem .9rem;border:.5px solid rgba(139,92,246,.16);cursor:pointer;transition:all .18s;background:transparent}
.wiz-opt:hover{border-color:rgba(139,92,246,.38);background:rgba(139,92,246,.04)}
.wiz-opt.sel{border-color:var(--p);background:rgba(139,92,246,.1)}
.wiz-opt-ic{width:26px;height:26px;display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0}
.wiz-opt-t{font-size:13px;font-weight:500;color:#e2e2f0}
.wiz-opt-s{font-size:11px;color:rgba(200,200,220,.32);margin-top:1px}
.wiz-inp{width:100%;background:#030310;border:.5px solid rgba(139,92,246,.2);color:#e2e2f0;font-family:var(--mono);font-size:12px;padding:8px 11px;outline:none;transition:border-color .2s;margin-bottom:1rem}
.wiz-inp:focus{border-color:var(--p)}
.wiz-inp::placeholder{color:rgba(200,200,220,.18)}
.wiz-nav{display:flex;justify-content:space-between;align-items:center;padding:.9rem 1.4rem;border-top:.5px solid var(--b)}
.wiz-back{font-family:var(--mono);font-size:10px;padding:7px 14px;border:.5px solid rgba(200,200,220,.13);color:rgba(200,200,220,.35);background:transparent;cursor:pointer;letter-spacing:.07em;transition:all .2s}
.wiz-back:hover{color:#e2e2f0;border-color:rgba(200,200,220,.32)}
.wiz-step{font-family:var(--mono);font-size:10px;color:rgba(200,200,220,.22)}
.wiz-next{font-family:var(--mono);font-size:11px;padding:8px 20px;background:var(--p);color:#fff;border:none;cursor:pointer;letter-spacing:.08em;text-transform:uppercase;transition:background .2s}
.wiz-next:hover{background:#7c3aed}

/* STUDIO SHARED */
.stu-nav{display:flex;align-items:center;justify-content:space-between;padding:.6rem 1.25rem;border-bottom:.5px solid}
.stu-nl{display:flex;align-items:center;gap:.6rem}
.stu-badge{font-family:var(--mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase}
.sbtns{display:flex;gap:4px;flex-wrap:wrap}
.sbtn{font-family:var(--mono);font-size:10px;padding:4px 10px;border:.5px solid;background:transparent;cursor:pointer;letter-spacing:.07em;text-transform:uppercase;transition:all .18s}
.back-btn{font-family:var(--mono);font-size:10px;padding:4px 10px;border:.5px solid rgba(200,200,220,.13);color:rgba(200,200,220,.38);background:transparent;cursor:pointer;letter-spacing:.07em;text-transform:uppercase;transition:all .18s}
.back-btn:hover{color:#e2e2f0;border-color:rgba(200,200,220,.32)}

/* TIDAL BEAT */
#s-tb{background:#07030f}
.tb-t{display:flex;align-items:center;gap:5px;padding:.48rem .85rem;border-bottom:.5px solid rgba(192,132,252,.1);background:#07030f;flex-wrap:wrap}
.tb-play{width:26px;height:26px;background:#c084fc;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;flex-shrink:0;transition:background .18s}
.tb-play:hover{background:#a855f7}
.tbb{font-family:var(--mono);font-size:9px;padding:4px 9px;border:.5px solid rgba(192,132,252,.18);background:transparent;color:rgba(192,132,252,.55);cursor:pointer;letter-spacing:.06em;transition:all .18s;display:inline-flex;align-items:center;gap:4px}
.tbb i{font-size:11px}
.tbb.icon-only{padding:4px 7px}
.tbb:hover,.tbb.on{background:rgba(192,132,252,.1);color:#e9d5ff;border-color:#c084fc}
.tb-bpm-grp{display:flex;align-items:center;gap:4px;margin-left:.35rem}
.tb-bpm-lbl{font-family:var(--mono);font-size:9px;color:rgba(192,132,252,.35);letter-spacing:.08em}
.tb-bpm-btn{width:18px;height:18px;border:.5px solid rgba(192,132,252,.2);background:transparent;color:rgba(192,132,252,.55);cursor:pointer;font-size:12px;display:flex;align-items:center;justify-content:center;line-height:1;padding:0;transition:all .18s}
.tb-bpm-btn:hover{background:rgba(192,132,252,.1);color:#c084fc}
.tb-bpm-val{font-family:var(--mono);font-size:12px;font-weight:700;color:#c084fc;min-width:28px;text-align:center}
.tb-time{font-family:var(--mono);font-size:10px;color:rgba(192,132,252,.32);margin-left:auto;border:.5px solid rgba(192,132,252,.13);padding:3px 7px}
.tb-body{display:grid;grid-template-columns:198px 1fr;flex:1;min-height:200px}
.tb-tracks{border-right:.5px solid rgba(192,132,252,.1);overflow:hidden}
.tb-track-hd{height:18px;border-bottom:.5px solid rgba(192,132,252,.1);display:flex;align-items:center;padding:0 .55rem;background:#07030f}
.tb-tr{display:flex;align-items:center;gap:4px;padding:.32rem .45rem;border-bottom:.5px solid rgba(192,132,252,.05);height:34px;background:#07030f}
.tb-tn{font-family:var(--mono);font-size:9px;color:rgba(200,200,220,.45);width:46px;flex-shrink:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tb-vol{flex:1;height:3px;background:rgba(192,132,252,.1);cursor:pointer;position:relative;min-width:18px}
.tb-vf{height:3px;position:absolute;left:0;top:0;pointer-events:none}
.tb-m{width:16px;height:16px;border:.5px solid rgba(192,132,252,.18);display:flex;align-items:center;justify-content:center;cursor:pointer;font-family:var(--mono);font-size:8px;color:rgba(192,132,252,.38);transition:all .15s;flex-shrink:0}
.tb-m:hover,.tb-m.on{background:rgba(192,132,252,.12);color:#c084fc;border-color:#c084fc}
.tb-grid{background:#0a0416;overflow:hidden}
.tb-ghd{display:flex;height:18px;background:#07030f;border-bottom:.5px solid rgba(192,132,252,.1)}
.tb-gb{flex:1;text-align:center;font-family:var(--mono);font-size:8px;color:rgba(192,132,252,.2);line-height:18px;border-right:.5px solid rgba(192,132,252,.04)}
.tb-grs{display:flex;flex-direction:column}
.tb-gr{display:flex;height:34px;border-bottom:.5px solid rgba(192,132,252,.04)}
.tb-cell{flex:1;border-right:.5px solid rgba(192,132,252,.03);cursor:pointer;transition:background .1s;position:relative}
.tb-cell:hover{background:rgba(192,132,252,.08)}
.tb-cell.on{background:rgba(192,132,252,.25)}
.tb-cell.on::after{content:'';position:absolute;inset:5px;background:#c084fc;opacity:.55}
.tb-wave{height:48px;background:#07030f;border-top:.5px solid rgba(192,132,252,.1);display:flex;align-items:center;padding:0 .7rem;gap:2px}
.tw-b{width:2px;border-radius:1px;background:#c084fc;opacity:.6;transition:height .08s}
.tb-mix{display:grid;grid-template-columns:repeat(7,1fr);gap:.5px;background:rgba(192,132,252,.07);border-top:.5px solid rgba(192,132,252,.1)}
.tb-ch{background:#07030f;padding:.45rem .3rem;display:flex;flex-direction:column;align-items:center;gap:4px}
.tb-chn{font-family:var(--mono);font-size:8px;color:rgba(192,132,252,.38);letter-spacing:.06em;text-transform:uppercase}
.tb-fd{width:3px;height:38px;background:rgba(192,132,252,.1);position:relative;margin:0 auto;cursor:pointer}
.tb-ff{width:3px;background:#c084fc;position:absolute;bottom:0;transition:height .12s}
.tb-cv{font-family:var(--mono);font-size:8px;color:rgba(192,132,252,.3)}

/* BEAT FREQ PANEL */
.tb-freq-panel{background:#06030f;border-top:.5px solid rgba(192,132,252,.12);padding:.5rem .7rem .6rem;display:flex;flex-direction:column;gap:0}
.tb-freq-hd{font-family:var(--mono);font-size:9px;color:rgba(192,132,252,.3);letter-spacing:.16em;text-transform:uppercase;padding:.2rem 0 .5rem;border-bottom:.5px solid rgba(192,132,252,.08);margin-bottom:.4rem;display:flex;align-items:center;justify-content:space-between}
.tb-freq-badge{font-size:8px;color:rgba(192,132,252,.5);border:.5px solid rgba(192,132,252,.2);padding:1px 7px;letter-spacing:.06em}
.tb-freq-row{display:flex;align-items:center;gap:7px;padding:.28rem .3rem;border-bottom:.5px solid rgba(192,132,252,.04)}
.tb-freq-row:last-child{border-bottom:none}
.tb-freq-name{font-family:var(--mono);font-size:9px;color:rgba(200,200,220,.45);width:48px;flex-shrink:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tb-freq-hz{font-family:var(--mono);font-size:10px;font-weight:700;min-width:66px;flex-shrink:0}
.tb-freq-shape{font-family:var(--mono);font-size:8px;color:rgba(200,200,220,.25);width:52px;flex-shrink:0;letter-spacing:.04em}
.tb-freq-canvas{flex:1;height:26px}
.tb-freq-active{font-family:var(--mono);font-size:8px;color:rgba(200,200,220,.2);width:28px;text-align:right;flex-shrink:0}

/* VISUAL STUDIO */
#s-vs{background:#1d1d1d}
.vs-t{display:flex;align-items:center;gap:5px;padding:.42rem .85rem;border-bottom:.5px solid rgba(34,211,238,.1);background:#1b1b1b;flex-wrap:wrap}
.vs-tool{width:26px;height:26px;border:.5px solid rgba(34,211,238,.16);background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .14s;color:rgba(34,211,238,.42);font-size:13px}
.vs-tool:hover,.vs-tool.sel{background:rgba(34,211,238,.09);border-color:#22d3ee;color:#22d3ee}
.vs-play-btn{width:26px;height:26px;background:#22d3ee;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;transition:background .18s}
.vs-play-btn:hover{background:#06b6d4}
.vsb{font-family:var(--mono);font-size:9px;padding:4px 9px;border:.5px solid rgba(34,211,238,.18);background:transparent;color:rgba(34,211,238,.5);cursor:pointer;letter-spacing:.06em;transition:all .18s}
.vsb:hover,.vsb.on{background:rgba(34,211,238,.09);color:#22d3ee;border-color:#22d3ee}
.vs-main{display:flex;flex:1;min-height:0}
.vs-layers{border-right:.5px solid rgba(34,211,238,.09);background:#202020;padding:.55rem;width:155px;flex-shrink:0;overflow:auto}
.vs-lt{font-family:var(--mono);font-size:9px;color:rgba(34,211,238,.28);letter-spacing:.13em;text-transform:uppercase;margin-bottom:.45rem;padding-bottom:.35rem;border-bottom:.5px solid rgba(34,211,238,.06)}
.vs-lyr{display:flex;align-items:center;gap:5px;padding:.28rem .32rem;cursor:pointer;transition:background .12s;font-size:12px;color:rgba(200,200,220,.52)}
.vs-lyr:hover{background:rgba(34,211,238,.06)}
.vs-lyr.sel{background:rgba(34,211,238,.1);border-left:2px solid #22d3ee;color:#e2e2f0}
.vs-ldot{width:7px;height:7px;flex-shrink:0;border-radius:1px}
.vs-add{font-family:var(--mono);font-size:9px;color:rgba(34,211,238,.28);padding:.32rem;cursor:pointer;border:.5px dashed rgba(34,211,238,.13);text-align:center;margin-top:.45rem;transition:all .18s}
.vs-add:hover{border-color:rgba(34,211,238,.32);color:rgba(34,211,238,.55)}
.vs-canvas{flex:1;background:#1a1a1a;display:flex;flex-direction:column;min-width:0}
.vs-tlhd{display:flex;height:16px;background:#1b1b1b;border-bottom:.5px solid rgba(34,211,238,.06)}
.vs-tln{width:54px;font-family:var(--mono);font-size:8px;color:rgba(34,211,238,.2);text-align:center;border-right:.5px solid rgba(34,211,238,.06);line-height:16px}
.vs-tlm{flex:1;display:flex}
.vs-tlmk{flex:1;border-right:.5px solid rgba(34,211,238,.04);font-family:var(--mono);font-size:7px;color:rgba(34,211,238,.18);text-align:center;line-height:16px}
.vs-tlrows{display:flex;flex-direction:column}
.vs-tlrow{display:flex;height:24px;border-bottom:.5px solid rgba(34,211,238,.04)}
.vs-tll{width:54px;flex-shrink:0;border-right:.5px solid rgba(34,211,238,.05);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:8px;color:rgba(34,211,238,.22);overflow:hidden}
.vs-tlt{flex:1;background:#1a1a1a;position:relative;cursor:pointer}
.vs-tlt:hover{background:rgba(34,211,238,.03)}
.vs-clip{position:absolute;top:5px;bottom:5px;display:flex;align-items:center;padding:0 4px}
.vs-cn{font-family:var(--mono);font-size:8px;color:rgba(255,255,255,.5)}
.vs-ph{position:absolute;top:0;bottom:0;width:1px;background:#22d3ee;cursor:ew-resize;z-index:5}
.vs-prev{flex:1;display:flex;align-items:center;justify-content:center;padding:1rem;min-height:0}
.vs-scr{width:100%;max-width:560px;aspect-ratio:16/9;background:#000;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}
.vs-props{background:#202020;border-left:.5px solid rgba(34,211,238,.07);padding:.55rem;width:140px;flex-shrink:0;overflow:auto}
.vs-pt{font-family:var(--mono);font-size:9px;color:rgba(34,211,238,.25);letter-spacing:.12em;text-transform:uppercase;margin-bottom:.45rem;padding-bottom:.35rem;border-bottom:.5px solid rgba(34,211,238,.05)}
.vs-pr{display:flex;justify-content:space-between;align-items:center;padding:.28rem 0;border-bottom:.5px solid rgba(34,211,238,.04);font-size:11px}
.vs-pk{color:rgba(200,200,220,.3)}
.vs-pi{background:transparent;border:none;color:#22d3ee;font-family:var(--mono);font-size:10px;width:52px;text-align:right;outline:none}
.vs-pi:focus{background:rgba(34,211,238,.05)}

/* VS FILE MANAGER */
.vs-fm-overlay{display:none;position:fixed;inset:0;z-index:200;background:rgba(5,5,15,.82);align-items:center;justify-content:center}
.vs-fm-overlay.open{display:flex}
.vs-fm-box{background:#0d0d20;border:.5px solid rgba(34,211,238,.22);border-top:2px solid #22d3ee;width:100%;max-width:460px;max-height:82vh;display:flex;flex-direction:column;box-shadow:0 0 60px rgba(34,211,238,.07)}
.vs-fm-hd{padding:.8rem 1rem;border-bottom:.5px solid rgba(34,211,238,.1);display:flex;align-items:center;justify-content:space-between}
.vs-fm-title{font-family:var(--mono);font-size:13px;font-weight:700;color:#22d3ee;letter-spacing:.07em}
.vs-fm-x{background:none;border:none;color:rgba(200,200,220,.35);cursor:pointer;font-size:18px;line-height:1;padding:0}
.vs-fm-x:hover{color:#e2e2f0}
.vs-fm-tabs{display:flex;border-bottom:.5px solid rgba(34,211,238,.08)}
.vs-fm-tab{flex:1;padding:.5rem;text-align:center;font-family:var(--mono);font-size:10px;color:rgba(200,200,220,.28);cursor:pointer;letter-spacing:.07em;border-bottom:2px solid transparent;transition:all .18s;text-transform:uppercase}
.vs-fm-tab.sel{color:#22d3ee;border-bottom-color:#22d3ee;background:rgba(34,211,238,.03)}
.vs-fm-body{flex:1;padding:.9rem 1rem;overflow-y:auto}
.vs-fm-drop{border:1.5px dashed rgba(34,211,238,.2);padding:1.6rem 1rem;text-align:center;cursor:pointer;transition:all .2s;margin-bottom:.7rem;background:transparent}
.vs-fm-drop:hover,.vs-fm-drop.drag{border-color:#22d3ee;background:rgba(34,211,238,.04)}
.vs-fm-drop i{font-size:26px;color:rgba(34,211,238,.35);display:block;margin-bottom:.45rem}
.vs-fm-drop-t{font-size:13px;color:rgba(200,200,220,.45)}
.vs-fm-drop-s{font-size:10px;color:rgba(200,200,220,.2);margin-top:.2rem}
.vs-fm-list{display:flex;flex-direction:column;gap:.3rem}
.vs-fm-file{display:flex;align-items:center;gap:8px;padding:.4rem .6rem;border:.5px solid rgba(34,211,238,.1);transition:all .15s;background:transparent}
.vs-fm-file:hover{border-color:rgba(34,211,238,.3);background:rgba(34,211,238,.04)}
.vs-fm-file i{color:#22d3ee;font-size:14px;flex-shrink:0}
.vs-fm-fn{font-family:var(--mono);font-size:11px;color:#e2e2f0;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vs-fm-fs{font-size:10px;color:rgba(200,200,220,.25);flex-shrink:0}
.vs-fm-btn-rm{background:none;border:none;color:rgba(248,113,113,.3);cursor:pointer;font-size:12px;padding:2px 4px;flex-shrink:0}
.vs-fm-btn-rm:hover{color:#f87171}
.vs-fm-btn-use{font-family:var(--mono);font-size:9px;padding:3px 9px;border:.5px solid rgba(34,211,238,.25);background:transparent;color:rgba(34,211,238,.6);cursor:pointer;letter-spacing:.06em;flex-shrink:0;transition:all .15s}
.vs-fm-btn-use:hover{border-color:#22d3ee;color:#22d3ee}
.vs-fm-empty{text-align:center;padding:1.5rem;font-size:12px;color:rgba(200,200,220,.2);font-family:var(--mono)}
.vs-new-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.vs-new-tile{padding:.85rem .7rem;border:.5px solid rgba(34,211,238,.12);cursor:pointer;text-align:center;transition:all .18s;background:transparent}
.vs-new-tile:hover{border-color:#22d3ee;background:rgba(34,211,238,.06)}
.vs-new-tile i{font-size:22px;color:#22d3ee;display:block;margin-bottom:.4rem}
.vs-new-tile-t{font-size:12px;font-weight:500;color:#e2e2f0}
.vs-new-tile-s{font-size:10px;color:rgba(200,200,220,.28);margin-top:2px;line-height:1.4}
.vs-fm-footer{padding:.6rem 1rem;border-top:.5px solid rgba(34,211,238,.08);display:flex;justify-content:flex-end;gap:.45rem}
.vs-fm-action{font-family:var(--mono);font-size:10px;padding:6px 15px;cursor:pointer;letter-spacing:.07em;transition:all .2s;border:none}
.vs-fm-action.pri{background:#22d3ee;color:#0d0d1f}
.vs-fm-action.pri:hover{background:#06b6d4}
.vs-fm-action.sec{background:transparent;border:.5px solid rgba(34,211,238,.2);color:rgba(34,211,238,.55)}
.vs-fm-action.sec:hover{border-color:#22d3ee;color:#22d3ee}
.vs-canvas-edit{position:absolute;inset:0;cursor:crosshair}
.vs-canvas-wrap{position:relative;width:100%;height:100%}
.vs-layer-edit-btn{font-family:var(--mono);font-size:8px;padding:2px 7px;border:.5px solid rgba(34,211,238,.2);background:transparent;color:rgba(34,211,238,.5);cursor:pointer;margin-left:auto;letter-spacing:.05em;transition:all .15s}
.vs-layer-edit-btn:hover{border-color:#22d3ee;color:#22d3ee}
.vs-layer-row{display:flex;align-items:center;gap:5px;padding:.3rem .4rem;border-bottom:.5px solid rgba(34,211,238,.04);cursor:pointer;transition:background .12s}
.vs-layer-row:hover{background:rgba(34,211,238,.04)}
.vs-layer-row.sel{background:rgba(34,211,238,.07);border-left:2px solid #22d3ee}

/* DEV STUDIO */
#s-ds{background:#030f09}
.ds-t{display:flex;align-items:center;gap:5px;padding:.48rem .85rem;border-bottom:.5px solid rgba(52,211,153,.1);background:#030f09;flex-wrap:wrap}
.dsb{font-family:var(--mono);font-size:9px;padding:4px 9px;border:.5px solid rgba(52,211,153,.18);background:transparent;color:rgba(52,211,153,.52);cursor:pointer;letter-spacing:.06em;transition:all .18s;display:inline-flex;align-items:center;gap:4px}
.dsb i{font-size:11px}
.dsb:hover{background:rgba(52,211,153,.07);color:#34d399}
.dsb.run{background:#34d399;color:#010a03;border-color:#34d399;font-weight:700}
.dsb.run:hover{background:#10b981}
.ds-layout{display:grid;grid-template-columns:38px 175px 1fr 180px;flex:1;min-height:0}
.ds-side{border-right:.5px solid rgba(52,211,153,.09);background:#030f09;display:flex;flex-direction:column}
.ds-fh{font-family:var(--mono);font-size:9px;color:rgba(52,211,153,.28);letter-spacing:.12em;padding:.48rem .6rem;border-bottom:.5px solid rgba(52,211,153,.06);text-transform:uppercase}
.ds-fi{display:flex;align-items:center;gap:5px;padding:.26rem .6rem;cursor:pointer;font-size:11px;color:rgba(200,200,220,.48);transition:background .12s}
.ds-fi:hover{background:rgba(52,211,153,.06);color:#e2e2f0}
.ds-fi.sel{background:rgba(52,211,153,.1);color:#e2e2f0}
.ds-fi i{font-size:12px}
.ds-ind{padding-left:1rem}
.ds-ed{background:#020d05;display:flex;flex-direction:column}
.ds-tabs{display:flex;background:#030f09;border-bottom:.5px solid rgba(52,211,153,.09)}
.ds-tab{font-family:var(--mono);font-size:10px;padding:.36rem .8rem;color:rgba(200,200,220,.28);border-right:.5px solid rgba(52,211,153,.06);cursor:pointer;letter-spacing:.05em;border-bottom:1.5px solid transparent;transition:all .14s}
.ds-tab.sel{color:#34d399;background:#020d05;border-bottom-color:#34d399}
.ds-code-wrap{flex:1;display:flex;overflow:hidden;min-height:180px}
.ds-gut{background:#020d05;padding:.6rem 0;border-right:.5px solid rgba(52,211,153,.05);min-width:30px;text-align:right;user-select:none}
.ds-ln{font-size:10px;font-family:var(--mono);color:rgba(52,211,153,.16);padding:.03rem .45rem .03rem .2rem;line-height:1.75;display:block}
.ds-ln.cur{color:rgba(52,211,153,.48)}
.ds-ea{flex:1;background:#020d05;color:#e2e2f0;font-family:var(--mono);font-size:11px;line-height:1.75;padding:.6rem .7rem;border:none;outline:none;resize:none;tab-size:2;white-space:pre;overflow:auto}
.ds-con{background:#010a03;border-top:.5px solid rgba(52,211,153,.09);padding:.38rem .6rem;max-height:80px;overflow-y:auto;flex-shrink:0}
.ds-conh{font-family:var(--mono);font-size:9px;color:rgba(52,211,153,.25);letter-spacing:.12em;margin-bottom:.28rem;text-transform:uppercase}
.ds-log{font-family:var(--mono);font-size:10px;line-height:1.6}
.ds-log .ok{color:#34d399}.ds-log .info{color:rgba(52,211,153,.38)}.ds-log .err{color:#f87171}.ds-log .warn{color:#fb923c}
.ds-prev{border-left:.5px solid rgba(52,211,153,.09);background:#020d05;display:flex;flex-direction:column}
.ds-ph{font-family:var(--mono);font-size:9px;color:rgba(52,211,153,.28);letter-spacing:.12em;padding:.48rem .6rem;border-bottom:.5px solid rgba(52,211,153,.06);display:flex;align-items:center;justify-content:space-between;text-transform:uppercase}
.ds-game{background:#010a03;flex:1;display:flex;align-items:center;justify-content:center;overflow:hidden;min-height:150px}
.ds-stats{background:#030f09;border-top:.5px solid rgba(52,211,153,.06);padding:.35rem .6rem;display:flex;justify-content:space-between}
.ds-si{font-family:var(--mono);font-size:10px}
.ds-sk{color:rgba(52,211,153,.26)}.ds-sv{color:#34d399}

/* SETTINGS */
#s-settings{background:var(--bg)}
.set-lay{display:grid;grid-template-columns:180px 1fr;flex:1;min-height:560px}
.set-side{border-right:.5px solid var(--b);background:var(--bg2)}
.set-ph{padding:1rem;border-bottom:.5px solid var(--b);display:flex;flex-direction:column;align-items:center;gap:.35rem;text-align:center}
.set-av{width:46px;height:46px;border-radius:50%;background:rgba(139,92,246,.14);border:1.5px solid var(--p);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:15px;font-weight:700;color:var(--p)}
.set-pn{font-size:13px;font-weight:500;color:#fff}
.set-tier{font-family:var(--mono);font-size:9px;color:var(--p);padding:2px 7px;border:.5px solid rgba(139,92,246,.22);background:rgba(139,92,246,.07)}
.set-grp{padding:.32rem .7rem .12rem;font-family:var(--mono);font-size:9px;color:rgba(200,200,220,.18);letter-spacing:.14em;text-transform:uppercase;margin-top:.2rem}
.set-ni{display:flex;align-items:center;gap:6px;padding:.38rem .9rem;cursor:pointer;font-size:12px;color:rgba(200,200,220,.48);transition:all .13s;border-left:2px solid transparent}
.set-ni:hover{background:rgba(139,92,246,.06);color:#e2e2f0}
.set-ni.sel{color:#e2e2f0;background:rgba(139,92,246,.09);border-left-color:var(--p)}
.set-ni i{font-size:14px}
.set-con{padding:1.4rem;overflow:auto}
.set-tc>div{display:none}
.set-tc>div.on{display:block}
.set-st{font-size:16px;font-weight:500;color:#fff;margin-bottom:.18rem}
.set-ss{font-size:12px;color:rgba(200,200,220,.35);margin-bottom:1.1rem;line-height:1.5}
.set-card{background:var(--bg2);border:.5px solid var(--b);padding:1rem;margin-bottom:.75rem}
.set-row{display:flex;align-items:center;justify-content:space-between;padding:.5rem 0;border-bottom:.5px solid rgba(139,92,246,.06)}
.set-row:last-child{border-bottom:none}
.set-rl{font-size:12px;color:rgba(200,200,220,.62)}
.set-rs{font-size:11px;color:rgba(200,200,220,.26);margin-top:1px}
.set-val{font-family:var(--mono);font-size:11px;color:var(--p)}
.set-inp{background:#030310;border:.5px solid rgba(139,92,246,.18);color:#e2e2f0;font-family:var(--mono);font-size:11px;padding:4px 8px;width:150px;outline:none;transition:border-color .2s}
.set-inp:focus{border-color:var(--p)}
.set-tog{width:34px;height:18px;border-radius:9px;position:relative;cursor:pointer;flex-shrink:0;transition:background .18s;background:var(--p)}
.set-tog.off{background:rgba(200,200,220,.09)}
.set-tog-t{width:14px;height:14px;background:#fff;border-radius:50%;position:absolute;top:2px;left:18px;transition:left .18s}
.set-tog.off .set-tog-t{left:2px}
.set-btn{font-family:var(--mono);font-size:10px;padding:5px 12px;border:.5px solid;background:transparent;cursor:pointer;letter-spacing:.06em;text-transform:uppercase;transition:all .18s}
.set-btn.p{border-color:var(--p);color:var(--p)}.set-btn.p:hover{background:rgba(139,92,246,.07)}
.set-btn.d{border-color:rgba(248,113,113,.28);color:rgba(248,113,113,.52)}.set-btn.d:hover{background:rgba(248,113,113,.06);color:#f87171}
.up-strip{background:rgba(139,92,246,.05);border:.5px solid rgba(139,92,246,.16);padding:.75rem;display:flex;align-items:center;justify-content:space-between;gap:.65rem;margin-top:.65rem}
.up-t{font-size:12px;color:rgba(200,200,220,.42);line-height:1.5}
.up-t b{color:#a78bfa;font-weight:500}
.up-btn{font-family:var(--mono);font-size:10px;padding:6px 13px;background:var(--p);color:#fff;border:none;cursor:pointer;letter-spacing:.07em;text-transform:uppercase;white-space:nowrap;flex-shrink:0;transition:background .18s}
.up-btn:hover{background:#7c3aed}
.redeem-box{margin-top:.7rem;padding-top:.65rem;border-top:.5px solid rgba(139,92,246,.1)}
.redeem-t{font-family:var(--mono);font-size:9px;color:rgba(200,200,220,.35);letter-spacing:.1em;text-transform:uppercase;margin-bottom:.4rem}
.redeem-row{display:flex;gap:6px}
.redeem-msg{font-size:11px;margin-top:.4rem;min-height:14px}
.redeem-msg.ok{color:#34d399}
.redeem-msg.err{color:#f87171}

/* AI assist popover (shared across studios) */
.ai-pop{background:#15121f;border:.5px solid rgba(139,92,246,.3);box-shadow:0 12px 32px rgba(0,0,0,.55);z-index:999;min-width:210px;max-width:260px}
.ai-pop-opt{display:flex;align-items:flex-start;gap:9px;padding:.6rem .75rem;cursor:pointer;border-bottom:.5px solid rgba(139,92,246,.08);transition:background .12s}
.ai-pop-opt:last-child{border-bottom:none}
.ai-pop-opt:hover{background:rgba(139,92,246,.1)}
.ai-pop-opt i{font-size:15px;color:#a78bfa;margin-top:1px;flex-shrink:0}
.ai-pop-t{font-size:12px;color:#e2e2f0;font-weight:500}
.ai-pop-s{font-size:10px;color:rgba(200,200,220,.35);margin-top:1px}

/* Dev Studio error diagnostics */
.ds-ln.err-line{background:rgba(248,113,113,.22);color:#f87171;border-radius:2px}
.ds-tip{display:flex;align-items:flex-start;gap:6px;padding:.4rem .5rem;background:rgba(250,204,21,.06);border:.5px solid rgba(250,204,21,.18);margin:.2rem 0;font-size:11px;color:#fde68a}
.ds-tip i{flex-shrink:0;margin-top:1px;color:#facc15}

/* PAYMENT */
#s-payment{background:var(--bg);align-items:center;justify-content:center;padding:2rem 1rem}
.pay-box{background:var(--bg2);border:.5px solid rgba(139,92,246,.26);border-top:2px solid var(--p);width:100%;max-width:400px}
.pay-hd{padding:1rem 1.35rem;border-bottom:.5px solid var(--b);display:flex;align-items:center;justify-content:space-between}
.pay-title{font-size:15px;font-weight:500;color:#fff}
.pay-close{width:24px;height:24px;border:.5px solid rgba(200,200,220,.13);background:transparent;color:rgba(200,200,220,.45);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;transition:all .18s}
.pay-close:hover{border-color:rgba(200,200,220,.32);color:#e2e2f0}
.pay-b{padding:1.1rem 1.35rem}
.plan-sw{display:grid;grid-template-columns:1fr 1fr;gap:.5px;background:rgba(139,92,246,.09);margin-bottom:1rem}
.ps-o{background:var(--bg2);padding:.7rem .9rem;cursor:pointer;border-top:2px solid transparent;text-align:center;transition:all .18s}
.ps-o.sel{border-top-color:var(--p);background:rgba(139,92,246,.07)}
.ps-on{font-size:13px;font-weight:500;color:#fff;margin-bottom:2px}
.ps-op{font-family:var(--mono);font-size:10px;color:rgba(200,200,220,.35)}
.ps-o.sel .ps-op{color:#a78bfa}
.pay-price-b{text-align:center;padding:.75rem;background:rgba(139,92,246,.04);border:.5px solid rgba(139,92,246,.12);margin-bottom:.9rem}
.pay-price{font-family:var(--mono);font-size:26px;font-weight:700;color:#fff}
.pay-price b{font-size:12px;color:rgba(200,200,220,.35);font-weight:400}
.pay-note{font-size:11px;color:rgba(200,200,220,.28);margin-top:.2rem}
.pay-feats{display:flex;flex-direction:column;gap:.35rem;margin-bottom:.9rem}
.pay-feat{display:flex;align-items:center;gap:6px;font-size:12px;color:rgba(200,200,220,.58)}
.pay-feat i{font-size:13px;color:var(--g);flex-shrink:0}
.pay-form{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.75rem}
.pf-l{font-family:var(--mono);font-size:9px;color:rgba(200,200,220,.28);letter-spacing:.09em;text-transform:uppercase;margin-bottom:3px}
.pf-i{background:#030310;border:.5px solid rgba(139,92,246,.18);color:#e2e2f0;font-family:var(--mono);font-size:11px;padding:7px 10px;width:100%;outline:none;transition:border-color .18s}
.pf-i:focus{border-color:var(--p)}
.pf-i::placeholder{color:rgba(200,200,220,.16)}
.pf-row{display:grid;grid-template-columns:1fr 1fr;gap:.45rem}
.pay-submit{width:100%;padding:10px;background:var(--p);color:#fff;border:none;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;cursor:pointer;transition:background .18s}
.pay-submit:hover{background:#7c3aed}
.pay-sec{text-align:center;font-size:11px;color:rgba(200,200,220,.2);margin-top:.45rem;display:flex;align-items:center;justify-content:center;gap:4px}

/* TOAST */
.toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);background:#16162a;color:#e2e2f0;font-family:var(--mono);font-size:11px;padding:9px 18px;border:.5px solid rgba(139,92,246,.3);z-index:999;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;letter-spacing:.04em}
.toast.show{opacity:1;transform:translateX(-50%) translateY(-4px)}

/* HOME CARD PREVIEW */
.card-preview{height:60px;margin:.7rem 0;position:relative;overflow:hidden;border:.5px solid rgba(255,255,255,.05);background:rgba(255,255,255,.015)}
.cp-tb{display:flex;flex-direction:column;justify-content:center;gap:4px;padding:8px 9px;height:100%}
.cp-tb-row{display:flex;gap:3px}
.cp-tb-c{width:7px;height:7px;background:rgba(192,132,252,.13)}
.cp-tb-c.on{background:#c084fc}
.cp-scan{position:absolute;top:0;bottom:0;width:1px;background:#e9d5ff;opacity:.55;left:6px;animation:cpScan 2.6s linear infinite}
@keyframes cpScan{0%{left:6px}100%{left:calc(100% - 8px)}}
.cp-vs{display:flex;flex-direction:column;gap:5px;padding:9px;height:100%;justify-content:center}
.cp-vs-clip{height:9px;border-radius:1px}
.cp-ds{display:flex;flex-direction:column;gap:4px;padding:9px;height:100%;position:relative}
.cp-ds-line{height:3px;border-radius:1px;background:rgba(52,211,153,.18)}
.cp-ds-spr{position:absolute;width:7px;height:7px;background:#34d399;bottom:9px;left:11px;animation:cpJump 1.15s ease-in-out infinite}
@keyframes cpJump{0%,100%{transform:translateY(0)}40%{transform:translateY(-13px)}}

/* STUDIO PICKER */
#s-picker{background:#05050f}
.pick-box{width:100%;max-width:560px}
.pick-hd{text-align:center;margin-bottom:1.5rem}
.pick-title{font-size:21px;font-weight:600;color:#fff;margin-bottom:.3rem}
.pick-sub{font-size:12px;color:rgba(200,200,220,.4)}
.pick-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.pick-tile{background:rgba(255,255,255,.02);border:.5px solid rgba(139,92,246,.18);padding:1.7rem 1.2rem;text-align:center;cursor:pointer;transition:all .2s}
.pick-tile:hover{border-color:rgba(139,92,246,.5);background:rgba(139,92,246,.05);transform:translateY(-2px)}
.pick-tile i{font-size:30px;color:var(--p);margin-bottom:.6rem;display:block}
.pick-tile-t{font-size:14px;font-weight:600;color:#fff;margin-bottom:.25rem}
.pick-tile-s{font-size:11px;color:rgba(200,200,220,.4)}
.pick-list{display:flex;flex-direction:column;gap:.5rem;max-height:50vh;overflow:auto}
.pick-proj{display:flex;align-items:center;gap:.7rem;padding:.7rem .9rem;border:.5px solid rgba(139,92,246,.14);background:rgba(255,255,255,.015)}
.pick-proj-ic{width:34px;height:34px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:15px}
.pick-proj-i{flex:1;min-width:0}
.pick-proj-n{font-size:13px;color:#e2e2f0;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pick-proj-d{font-size:10px;color:rgba(200,200,220,.32);margin-top:1px}
.pick-proj-open{font-family:var(--mono);font-size:10px;padding:5px 10px;border:.5px solid;background:transparent;cursor:pointer;letter-spacing:.06em;white-space:nowrap;flex-shrink:0}
.pick-proj-del{width:26px;height:26px;border:.5px solid rgba(248,113,113,.2);color:rgba(248,113,113,.55);background:transparent;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:all .15s}
.pick-proj-del:hover{background:rgba(248,113,113,.08);border-color:#f87171;color:#f87171}

/* TIDAL BEAT — DAW additions */
.tb-tools{display:flex;align-items:center;gap:6px;padding:.4rem .85rem;border-bottom:.5px solid rgba(192,132,252,.07);flex-wrap:wrap;position:relative}
.tb-addtrack{font-family:var(--mono);font-size:9px;padding:4px 9px;border:.5px dashed rgba(192,132,252,.32);background:transparent;color:rgba(192,132,252,.65);cursor:pointer;letter-spacing:.05em;display:flex;align-items:center;gap:3px}
.tb-addtrack:hover{border-color:#c084fc;color:#c084fc;background:rgba(192,132,252,.06)}
.tb-addpanel{position:absolute;top:100%;left:.85rem;background:#0e0820;border:.5px solid rgba(192,132,252,.3);z-index:30;display:none;flex-direction:column;min-width:140px;box-shadow:0 8px 24px rgba(0,0,0,.5)}
.tb-addopt{font-family:var(--mono);font-size:10px;padding:7px 11px;color:rgba(192,132,252,.6);cursor:pointer;display:flex;align-items:center;gap:6px;transition:all .12s}
.tb-addopt:hover{background:rgba(192,132,252,.1);color:#e9d5ff}
.tb-pat{font-family:var(--mono);font-size:9px;padding:3px 8px;border:.5px solid rgba(192,132,252,.16);background:transparent;color:rgba(192,132,252,.45);cursor:pointer;letter-spacing:.04em}
.tb-pat.on{background:#c084fc;color:#1a0a2e;border-color:#c084fc;font-weight:700}
.tb-pat.add{border-style:dashed}
.tb-patrow{display:flex;align-items:center;gap:4px;padding:.32rem .85rem;border-bottom:.5px solid rgba(192,132,252,.05)}
.tb-arr{display:flex;align-items:center;gap:5px;padding:.32rem .85rem;border-bottom:.5px solid rgba(192,132,252,.05);flex-wrap:wrap}
.tb-arr-l{font-family:var(--mono);font-size:8px;color:rgba(192,132,252,.28);letter-spacing:.1em;text-transform:uppercase;margin-right:3px}
.tb-chip{font-family:var(--mono);font-size:10px;background:rgba(192,132,252,.1);color:#e9d5ff;padding:3px 5px 3px 8px;display:flex;align-items:center;gap:4px;border:.5px solid rgba(192,132,252,.25)}
.tb-chip i{cursor:pointer;font-size:10px;color:rgba(248,113,113,.6)}
.tb-chip i:hover{color:#f87171}
.tb-arr-add{font-family:var(--mono);font-size:9px;background:#0e0820;color:rgba(192,132,252,.55);border:.5px solid rgba(192,132,252,.2);padding:3px 5px}
.tb-fx{font-family:var(--mono);font-size:8px;background:#0a0416;color:rgba(192,132,252,.5);border:.5px solid rgba(192,132,252,.16);width:48px;flex-shrink:0;padding:1px}
.tb-rm{width:16px;height:16px;border:.5px solid rgba(248,113,113,.2);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:9px;color:rgba(248,113,113,.5);flex-shrink:0;transition:all .15s}
.tb-rm:hover{border-color:#f87171;color:#f87171;background:rgba(248,113,113,.08)}
.tb-recs{display:flex;flex-direction:column;gap:2px;padding:.3rem .85rem;max-height:60px;overflow:auto}
.tb-recitem{font-family:var(--mono);font-size:9px;color:#c084fc;display:flex;align-items:center;gap:5px;text-decoration:none;padding:2px 0}
.tb-recitem:hover{color:#e9d5ff}

/* TIDAL BEAT — mastering-suite chrome */
#s-tb{background:#1c1c1c}
.tb-icontoolbar{display:flex;align-items:center;gap:3px;padding:.32rem .7rem;background:#232323;border-bottom:.5px solid #111;flex-wrap:wrap}
.tb-icbtn{width:24px;height:24px;display:flex;align-items:center;justify-content:center;color:rgba(220,220,220,.32);font-size:12px;cursor:pointer;border-radius:3px;transition:all .12s}
.tb-icbtn:hover{background:rgba(192,132,252,.12);color:#c084fc}
.tb-icsep{width:.5px;height:15px;background:rgba(255,255,255,.08);margin:0 3px}
.tb-showme{margin-left:auto;font-family:var(--mono);font-size:9px;color:rgba(192,132,252,.5);border:.5px solid rgba(192,132,252,.2);padding:3px 9px;border-radius:3px;cursor:pointer;white-space:nowrap}
.tb-showme:hover{color:#c084fc;border-color:#c084fc}
.tb-shell{display:flex;flex:1;min-height:0}
.tb-actionrail{width:148px;flex-shrink:0;background:#1f1f1f;border-right:.5px solid #111;overflow-y:auto;padding:.5rem 0}
.tb-ar-grp{font-family:var(--mono);font-size:8px;color:rgba(192,132,252,.3);letter-spacing:.1em;text-transform:uppercase;padding:.5rem .7rem .35rem}
.tb-ar-grid{display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:0 .6rem}
.tb-ar-tile{display:flex;flex-direction:column;align-items:center;gap:3px;padding:.4rem .2rem;border:.5px solid rgba(192,132,252,.08);background:rgba(255,255,255,.012);cursor:pointer;transition:all .15s;text-align:center}
.tb-ar-tile:hover{border-color:rgba(192,132,252,.4);background:rgba(192,132,252,.06)}
.tb-ar-tile i{font-size:15px;color:rgba(192,132,252,.5)}
.tb-ar-tile span{font-size:7.5px;color:rgba(200,200,220,.34);line-height:1.15}
.tb-main{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0}
.tb-meters{display:flex;align-items:stretch;gap:10px;padding:.4rem .85rem;border-bottom:.5px solid rgba(192,132,252,.07);background:#1a0f24}
.tb-timebig{font-family:var(--mono);font-size:19px;font-weight:700;color:#e9d5ff;background:#0a0414;border:.5px solid rgba(192,132,252,.25);padding:.3rem .7rem;letter-spacing:.03em;display:flex;align-items:center}
.tb-chanmeters{display:flex;gap:4px;align-items:flex-end}
.tb-cm{display:flex;flex-direction:column;align-items:center;gap:2px}
.tb-cm-bar{width:7px;height:34px;background:#0a0414;border:.5px solid rgba(192,132,252,.16);position:relative;overflow:hidden}
.tb-cm-fill{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,#22c55e,#eab308 60%,#ef4444 88%);transition:height .08s}
.tb-cm-lbl{font-family:var(--mono);font-size:6.5px;color:rgba(192,132,252,.3)}
.tb-loudness{display:flex;gap:14px;align-items:center;margin-left:auto;flex-wrap:wrap}
.tb-ld{display:flex;flex-direction:column;align-items:center;font-family:var(--mono)}
.tb-ld-v{font-size:11px;color:#e9d5ff;font-weight:700}
.tb-ld-k{font-size:6.5px;color:rgba(192,132,252,.32);letter-spacing:.05em}
.tb-filebrowser{border-top:.5px solid #111;background:#1f1f1f;padding:.4rem .7rem;display:flex;flex-direction:column;gap:1px;max-height:90px;overflow:auto;flex-shrink:0}
.tb-fb-hd{font-family:var(--mono);font-size:8px;color:rgba(192,132,252,.28);letter-spacing:.1em;text-transform:uppercase;margin-bottom:.25rem}
.tb-fb-row{display:flex;align-items:center;gap:5px;font-size:10px;color:rgba(200,200,220,.32);padding:1px 0}
.tb-fb-row i{font-size:10px;flex-shrink:0}
.tb-fb-ind{padding-left:14px}

/* VISUAL STUDIO — CapCut additions */
.vs-addwrap{position:relative}
.vs-addpanel{position:absolute;bottom:100%;left:0;background:#06181b;border:.5px solid rgba(34,211,238,.3);z-index:30;display:none;flex-direction:column;min-width:130px;box-shadow:0 8px 24px rgba(0,0,0,.5);margin-bottom:4px}
.vs-addopt{font-family:var(--mono);font-size:10px;padding:7px 11px;color:rgba(34,211,238,.6);cursor:pointer;display:flex;align-items:center;gap:6px;transition:all .12s}
.vs-addopt:hover{background:rgba(34,211,238,.1);color:#a5f3fc}
.vs-lyr-rm{margin-left:auto;font-size:11px;color:rgba(248,113,113,.4);flex-shrink:0}
.vs-lyr-rm:hover{color:#f87171}
.vs-clip.sel{outline:1px solid #fff}
.vs-rsz-l,.vs-rsz-r{position:absolute;top:0;bottom:0;width:5px;cursor:ew-resize}
.vs-rsz-l{left:0}.vs-rsz-r{right:0}
.vs-pe{font-size:11px;color:rgba(200,200,220,.3);padding:.4rem 0}
.vs-exportwrap{display:flex;align-items:center;gap:6px}

/* VISUAL STUDIO — Grease Pencil chrome */
#s-vs{background:#1d1d1d}
.vs-wstabs{display:flex;align-items:center;gap:2px;padding:.32rem .7rem;background:#1b1b1b;border-bottom:.5px solid #0c0c0c;font-family:var(--mono);font-size:9px;color:rgba(220,220,220,.32);flex-wrap:wrap}
.vs-wstab{padding:3px 9px;cursor:pointer;border-radius:3px}
.vs-wstab:hover{background:rgba(255,255,255,.05);color:rgba(220,220,220,.6)}
.vs-wstab.sel{background:#2c2c2c;color:#22d3ee}
.vs-wstab.add{font-weight:700;color:rgba(34,211,238,.4)}
.vs-optchip{font-family:var(--mono);font-size:9px;color:rgba(34,211,238,.4);border:.5px solid rgba(34,211,238,.14);padding:4px 8px;border-radius:2px;background:#1b1b1b;white-space:nowrap}
.vs-optchip b{color:#22d3ee}
.vs-body{display:flex;flex-direction:column;flex:1;min-height:0}
.vs-toolrail{width:32px;flex-shrink:0;background:#232323;border-right:.5px solid #0c0c0c;display:flex;flex-direction:column;align-items:center;padding:.45rem 0;gap:5px}
.vs-outliner{margin-bottom:.5rem;padding-bottom:.45rem;border-bottom:.5px solid rgba(34,211,238,.06)}
.vs-out-row{display:flex;align-items:center;gap:5px;padding:2px 3px;font-size:10px;color:rgba(200,200,220,.32);border-radius:2px}
.vs-out-row i{font-size:10px}
.vs-out-row.sel{background:rgba(34,211,238,.1);color:#22d3ee}
.vs-viewport{flex:1;position:relative;background:#1a1a1a;display:flex;align-items:center;justify-content:center;overflow:hidden;min-height:160px}
.vs-viewport-hd{position:absolute;top:9px;left:11px;font-family:var(--mono);font-size:9px;color:rgba(220,220,220,.28);line-height:1.4}
.vs-gizmo{position:absolute;top:9px;right:11px;width:30px;height:30px;border-radius:50%;border:.5px solid rgba(220,220,220,.14);display:flex;align-items:center;justify-content:center;color:rgba(34,211,238,.32);font-size:13px}
.vs-vp-canvas-wrap{box-shadow:0 0 0 1px rgba(0,0,0,.6),0 12px 40px rgba(0,0,0,.5)}
.vs-eyelock{display:flex;gap:5px;margin-left:auto;flex-shrink:0}
.vs-eyelock i{font-size:11px;color:rgba(200,200,220,.2);cursor:pointer}
.vs-eyelock i.on{color:#22d3ee}
.vs-lyr.hidden-layer{opacity:.4}
.vs-dopesheet{border-top:.5px solid #0c0c0c;background:#1d1d1d;flex-shrink:0}
.vs-ds-menubar{display:flex;gap:13px;padding:.26rem .7rem;font-family:var(--mono);font-size:8px;color:rgba(220,220,220,.26);border-bottom:.5px solid rgba(34,211,238,.04)}
.vs-clip-kf{position:absolute;top:50%;width:7px;height:7px;background:#fde68a;transform:translate(-50%,-50%) rotate(45deg);border:.5px solid #1d1d1d;pointer-events:none}
.vs-ds-transport{display:flex;align-items:center;gap:13px;padding:.32rem .7rem;border-top:.5px solid rgba(34,211,238,.05);font-family:var(--mono);font-size:9px;color:rgba(220,220,220,.3);flex-wrap:wrap}
.vs-ds-transport input{width:36px;background:#232323;border:.5px solid rgba(34,211,238,.14);color:#22d3ee;font-family:var(--mono);font-size:9px;text-align:center;padding:3px 2px;border-radius:2px}
.vs-ds-transport label{display:flex;align-items:center;gap:4px}

/* DEV STUDIO — file mgmt */
/* DEV STUDIO — VS Code chrome */
#s-ds{background:#1e1e1e}
.vsc-titlebar{display:flex;align-items:center;gap:10px;padding:.4rem .7rem;background:#191919;border-bottom:.5px solid #0a0a0a}
.vsc-dots{display:flex;gap:6px;flex-shrink:0}
.vsc-dots span{width:10px;height:10px;border-radius:50%;display:block}
.vsc-dots span:nth-child(1){background:#ff5f57}
.vsc-dots span:nth-child(2){background:#febc2e}
.vsc-dots span:nth-child(3){background:#28c840}
.vsc-addr{flex:1;background:#2a2a2a;border-radius:5px;padding:4px 12px;font-family:var(--mono);font-size:10px;color:rgba(220,220,220,.5);display:flex;align-items:center;gap:6px;max-width:340px}
.vsc-addr i{font-size:10px;color:rgba(52,211,153,.5)}
.vsc-topbar{display:flex;align-items:center;justify-content:space-between;padding:.5rem .85rem;border-bottom:.5px solid rgba(52,211,153,.1);background:#1e1e1e;flex-wrap:wrap;gap:.5rem}
.vsc-activitybar{background:#181818;border-right:.5px solid #0a0a0a;display:flex;flex-direction:column;align-items:center;padding:.6rem 0;gap:.3rem}
.vsc-act{width:28px;height:28px;display:flex;align-items:center;justify-content:center;color:rgba(200,200,200,.32);cursor:pointer;font-size:15px;border-left:2px solid transparent;transition:all .15s}
.vsc-act:hover{color:rgba(220,220,220,.6)}
.vsc-act.sel{color:#fff;border-left-color:#34d399}
.ds-fi.root{font-weight:600;color:rgba(220,220,220,.55);gap:3px;cursor:default}
.ds-fi.root i:first-child{font-size:9px;margin-right:1px}
.ds-breadcrumb{display:flex;align-items:center;gap:5px;padding:.28rem .7rem;font-family:var(--mono);font-size:9px;color:rgba(200,200,220,.32);border-bottom:.5px solid rgba(52,211,153,.05);background:#1b1b1b}
.ds-breadcrumb i{font-size:8px;color:rgba(200,200,220,.18)}
.ds-tab-rm{margin-left:5px;font-size:10px;color:rgba(200,200,220,.25)}
.ds-tab-rm:hover{color:#f87171}
.ds-codearea{position:relative;flex:1;overflow:hidden}
.ds-highlight{position:absolute;top:0;left:0;right:0;bottom:0;margin:0;padding:.6rem .7rem;font-family:var(--mono);font-size:11px;line-height:1.75;white-space:pre;overflow:auto;color:#e2e2f0;pointer-events:none}
.tok-k{color:#c586c0}.tok-s{color:#ce9178}.tok-c{color:#6a9955}.tok-n{color:#b5cea8}
.ds-codearea .ds-ea{position:absolute;top:0;left:0;right:0;bottom:0;background:transparent;color:transparent;caret-color:#34d399}
.ds-minimap{width:46px;flex-shrink:0;background:#1a1a1a;border-left:.5px solid rgba(52,211,153,.05);padding:6px 0;overflow:hidden}
.ds-mm-line{height:2px;margin:1.5px 4px;background:rgba(52,211,153,.22);border-radius:1px}
.vsc-statusbar{display:flex;align-items:center;justify-content:space-between;background:#0c3d24;color:#d7fbe8;padding:.22rem .7rem;font-family:var(--mono);font-size:9px;flex-shrink:0;gap:1rem}
.vsc-stat-l,.vsc-stat-r{display:flex;align-items:center;gap:11px}
.vsc-stat-l i,.vsc-stat-r i{font-size:9px;margin-right:2px}
.ds-addfile{font-family:var(--mono);font-size:8px;color:rgba(52,211,153,.4);cursor:pointer;letter-spacing:.06em;float:right}
.ds-addfile:hover{color:#34d399}
.ds-frm{margin-left:auto;font-size:11px;color:rgba(248,113,113,.4)}
.ds-frm:hover{color:#f87171}