:root{color-scheme:dark;--bg:#080711;--panel:#121121;--panel2:#18162a;--line:rgba(216,213,244,.14);--text:#f4f2ff;--muted:#aaa9c2;--pink:#ff56a9;--violet:#ae8bff;--cyan:#66efff;--gold:#efd6a4;--radius:17px;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;font-optical-sizing:auto}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--bg);color:var(--text);min-width:320px;line-height:1.55}
body:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;height:990px;background:linear-gradient(180deg,rgba(6,6,16,.37),#080711 98%),url("./assets/edm-universe-background.jpg") center 12%/cover no-repeat;opacity:.32;pointer-events:none}
a{color:inherit}
button,input,select{font:inherit}
button,a,select,input{touch-action:manipulation}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.topbar{height:84px;max-width:1540px;margin:auto;padding:0 clamp(19px,4.7vw,84px);display:flex;align-items:center;gap:24px;border-bottom:1px solid rgba(224,219,254,.11)}
.brand{display:flex;gap:12px;align-items:center;text-decoration:none;min-width:0}
.brand img{width:44px;height:44px;object-fit:cover;border-radius:12px;border:1px solid rgba(255,255,255,.22);box-shadow:0 0 30px rgba(248,49,151,.2)}
.brand strong{font-size:17px;font-weight:850;letter-spacing:.07em;line-height:1.1;display:block;white-space:nowrap}
.brand em{font-style:normal;color:var(--pink)}
.brand small{display:block;font-size:8px;letter-spacing:.22em;font-weight:800;color:var(--muted);margin-top:5px;white-space:nowrap}
.navigation{display:flex;gap:clamp(14px,2.3vw,35px);align-items:center;margin:auto}
.navigation a,.nav-cta{font-size:10px;font-weight:850;letter-spacing:.1em;text-decoration:none;white-space:nowrap}
.navigation a{color:#c4c1d2;transition:color .2s}
.navigation a:hover{color:#fff}
.nav-cta{border:1px solid #8c75bb;padding:12px 15px;border-radius:7px;background:rgba(58,41,98,.38)}
.nav-cta span{color:var(--pink);margin-left:8px}
.hero{max-width:1540px;margin:auto;min-height:580px;padding:95px clamp(19px,6.2vw,108px) 82px;display:grid;grid-template-columns:minmax(0,1.17fr) minmax(0,1fr);align-items:center;gap:clamp(32px,5vw,85px);position:relative}
.hero-glow{position:absolute;z-index:-1;width:450px;height:450px;background:radial-gradient(circle,rgba(178,51,190,.21),transparent 65%);filter:blur(20px);left:20%;top:20%;pointer-events:none}
.eyebrow,.kicker{color:#f1b3de;letter-spacing:.19em;font-size:10px;font-weight:850}
.eyebrow{display:flex;align-items:center;gap:10px}
.pulsedot{display:inline-block;width:7px;height:7px;background:#61f7ca;border-radius:50%;box-shadow:0 0 13px #61f7ca}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(40px,4.65vw,76px);letter-spacing:-.056em;line-height:1.09;margin:25px 0}
h1 span{background:linear-gradient(90deg,#f7caeb 0%,#eaa2ff 47%,#99cdff 100%);color:transparent;background-clip:text}
.lead{font-size:clamp(14px,1.23vw,18px);color:#c8c4da;max-width:610px;line-height:1.8;margin:0 0 32px}
.hero-buttons{display:flex;flex-wrap:wrap;gap:11px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:13px;text-decoration:none;min-height:49px;padding:14px 21px;border-radius:7px;font-size:11px;letter-spacing:.065em;font-weight:850;cursor:pointer;transition:transform .18s,box-shadow .18s;background:none;border:1px solid transparent;color:#fff}
.button:hover:not(:disabled){transform:translateY(-2px)}
.button:disabled{opacity:.38;cursor:not-allowed}
.button.primary{background:linear-gradient(115deg,#f949a4,#8b55e9);box-shadow:0 8px 32px rgba(222,54,162,.25)}
.button.primary:hover{box-shadow:0 8px 42px rgba(222,54,162,.45)}
.button.ghost,.button.outline{border-color:rgba(235,226,255,.31);background:rgba(15,13,31,.57)}
.button.ghost:hover,.button.outline:hover{border-color:var(--violet)}
.hero-under{font-size:10px;color:#9e9ab3;letter-spacing:.01em;margin-top:24px}
.hero-under span{color:#a985e0;margin:0 7px}
.hero-display{border:1px solid rgba(225,192,255,.23);border-radius:13px;background:linear-gradient(140deg,rgba(38,24,64,.77),rgba(7,10,28,.93));padding:17px;box-shadow:0 28px 95px #05020d,0 0 80px rgba(149,79,234,.13);transform:perspective(950px) rotateY(-7deg) rotateX(2deg)}
.display-head,.display-foot{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:8px;letter-spacing:.14em;font-weight:800;color:#c7b0e5}
.status-light{color:#79f0c7}
.scope{height:280px;display:flex;align-items:center;justify-content:center;gap:7px;position:relative;border:1px solid rgba(146,128,201,.2);margin:17px 0;background:radial-gradient(ellipse at center,rgba(119,56,168,.13),transparent 65%),#080a19;overflow:hidden}
.scope-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(140,113,198,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(140,113,198,.09) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(90deg,transparent,#000 25%,#000 75%,transparent)}
.scope-bass{width:11%;height:20%;border-radius:9px;background:linear-gradient(180deg,rgba(93,240,255,.98),rgba(179,96,250,.87),rgba(255,55,151,.65));box-shadow:0 0 19px rgba(154,70,255,.43);transform-origin:center;filter:blur(.25px)}
.bass-a{height:23%;transform:skew(-8deg)}.bass-b{height:44%}.bass-c{height:78%}.bass-d{height:62%}.bass-e{height:29%;transform:skew(6deg)}
.scope:after{content:"";height:1px;background:rgba(109,252,253,.62);position:absolute;left:0;right:0;top:50%;box-shadow:0 0 15px #40b9ff}
.scope-mark{position:absolute;bottom:12px;left:16px;color:#b2aacc;font-size:9px;letter-spacing:.12em;font-weight:750}.scope-mark strong{color:#f374bd}
.display-foot{justify-content:space-around;color:#9e99c2}
.metrics{max-width:1390px;margin:0 auto 52px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0}
.metrics div{border-right:1px solid var(--line);padding:5px 19px;display:flex;align-items:flex-start;flex-direction:column;gap:3px}
.metrics div:last-child{border-right:0}.metrics strong{font-size:clamp(24px,3vw,40px);letter-spacing:-.05em;font-weight:720;color:#fff;line-height:1.1}.metrics span{font-size:11px;color:#aaa6c1}
.section{max-width:1430px;margin:auto;padding:77px clamp(19px,5vw,70px)}
.section-header{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:31px}
.section-header h2,.full-heading h2{font-size:clamp(32px,3.6vw,54px);letter-spacing:-.055em;line-height:1.08;margin:13px 0 12px}
.section-header p{max-width:685px;color:#aeabc7;line-height:1.75;margin:0;font-size:14px}
.tag{color:#d5b7ff;border:1px solid #684c99;background:#30244455;font-size:10px;letter-spacing:.11em;font-weight:750;border-radius:30px;padding:9px 13px;white-space:nowrap}
.studio-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:16px}
.studio-form,.output-panel,.lesson-feature,.lesson-quiz{background:linear-gradient(145deg,#18162a,#11101e);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.studio-form{padding-bottom:26px}
.panel-top{height:51px;display:flex;justify-content:space-between;align-items:center;padding:0 26px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.02);gap:9px;color:#d6c9e9;font-size:10px;letter-spacing:.11em}
.dot-three{font-size:10px;letter-spacing:.19em;color:#e75da9}.top-index{font-size:9px;color:#8fa4c7}
.field{padding:20px 26px 0}
.field label{color:#e8e0fa;font-size:10px;letter-spacing:.12em;font-weight:750;display:flex;justify-content:space-between}
.field input:not([type=range]),.field select{height:48px;width:100%;margin-top:10px;color:#f4edff;background:#0b0a18;border:1px solid #403957;border-radius:7px;padding:0 14px;outline-offset:2px}
.field select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,#bdade8 50%),linear-gradient(135deg,#bdade8 50%,transparent 50%);background-position:calc(100% - 19px) 20px,calc(100% - 13px) 20px;background-size:6px 6px;background-repeat:no-repeat}
.field select option{background:#151226;color:#fff}
.field input[type=range]{width:100%;accent-color:#d74bcc;margin-top:14px;height:21px;cursor:pointer}
.field-note,.source-link{font-size:11px;color:#aba6c6;margin:9px 0 0}
.source-link{color:#a7dfff;display:inline-block;text-decoration:underline;text-underline-offset:3px}
.range-labels{display:flex;justify-content:space-between;color:#8e89ab;font-size:9px;letter-spacing:.08em}
.form-submit{margin:27px 26px 0;width:calc(100% - 52px)}
.form-bottom{text-align:center;color:#8a879f;font-size:10px;padding:0 19px;margin:15px 0 0}
.output-panel{background:linear-gradient(155deg,#1b1730,#0b0c1b)}
.output-inner{padding:30px 32px}
.output-caption{font-size:10px;letter-spacing:.17em;color:#e9a5ca;font-weight:850}
.output-inner h3{font-size:clamp(22px,2.6vw,34px);line-height:1.1;letter-spacing:-.035em;margin:16px 0 10px}
.output-inner>p{font-size:13px;color:#aaa8c4;line-height:1.7}
.result-content{min-height:285px;padding:20px;margin:22px 0 18px;background:linear-gradient(150deg,#0b0a18,#111329);border:1px dashed #4c4369;border-radius:10px}
.empty-wave{display:flex;align-items:center;justify-content:center;gap:6px;margin:60px 0 27px;height:55px}
.empty-wave i{background:linear-gradient(#68dff5,#e259b7);width:5px;height:17px;border-radius:3px}
.empty-wave i:nth-child(2n){height:34px}.empty-wave i:nth-child(3n){height:51px}.empty-wave i:nth-child(5n){height:24px}
.empty-copy{text-align:center;color:#a9a1bf;font-size:12px}
.result-label{display:inline-block;font-size:9px;letter-spacing:.14em;color:#a9f5fa;font-weight:850;margin:14px 0 6px}
.result-label:first-child{margin-top:0}
.result-text{font-size:12px;color:#d7d1e8;line-height:1.85;overflow-wrap:anywhere;white-space:pre-line}
.result-list{padding-left:19px;color:#d7d1e8;font-size:12px;line-height:1.7}
.result-list li{margin:5px 0}
.result-topline{color:#dca9ef;font-size:12px;font-weight:780;letter-spacing:.04em}
.output-actions{display:flex;gap:9px;flex-wrap:wrap}
.output-actions .button{flex:1;min-width:100px;font-size:10px}
.visually-announced{margin:11px 0 0;font-size:12px;color:#92e9cd;min-height:17px}
.disclaimer{font-size:11px;color:#9491ae;margin-top:20px;line-height:1.7}
.academy-section{padding-top:85px}
.academy-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.lesson-feature,.lesson-quiz{padding:31px;min-height:330px}
.lesson-top{display:flex;gap:15px;justify-content:space-between;color:#e9aad5;font-size:10px;letter-spacing:.13em;font-weight:850}
.academy-grid h3{font-size:clamp(19px,2.4vw,29px);letter-spacing:-.035em;line-height:1.15;max-width:450px;margin:18px 0}
.lesson-feature p,.lesson-quiz p{font-size:13px;line-height:1.8;color:#b1accb}
.lesson-tags{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0}
.lesson-tags span{font-size:9px;color:#bdb1e7;background:#302944;border:1px solid #4a3b70;padding:6px 8px;border-radius:3px}
.lesson-check{display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);padding-top:20px;color:#e6dff7;font-size:12px}
.lesson-check input{accent-color:var(--pink);width:17px;height:17px}
.quiz-choices{display:grid;gap:9px}
.quiz-choices button{background:#100e20;border:1px solid #4d4569;border-radius:6px;min-height:43px;text-align:left;padding:10px 13px;color:#e3dcef;cursor:pointer;font-size:12px}
.quiz-choices button:hover{border-color:#9a68e6}
.quiz-choices button.correct{border-color:#52d7ae;background:#15372c}
.quiz-choices button.incorrect{border-color:#e479a1;background:#38202b}
#quizFeedback{min-height:31px}
.full-section{position:relative;padding-bottom:115px}
.full-bg{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 80% 15%,rgba(136,79,208,.18),transparent 55%);pointer-events:none}
.full-heading h2 em{font-style:normal;color:#e8a5ff}
.full-heading p{max-width:660px;color:#ada8c4;font-size:14px;line-height:1.8}
.feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:35px 0}
.feature{background:#171323;border:1px solid var(--line);padding:24px;border-radius:9px;min-height:202px}
.feature-number{color:#ed74ba;font-size:11px;letter-spacing:.15em}
.feature h3{margin:19px 0 8px;font-size:17px;letter-spacing:-.025em}
.feature p{color:#aaa4c0;font-size:12px;line-height:1.8;margin:0}
.closing-banner{margin-top:45px;padding:34px;display:flex;justify-content:space-between;align-items:center;gap:25px;border-radius:13px;border:1px solid #644384;background:linear-gradient(110deg,rgba(94,38,103,.35),rgba(24,20,56,.68))}
.closing-banner h3{font-size:24px;letter-spacing:-.035em;margin:11px 0 8px}.closing-banner p{margin:0;color:#bbb3cf;font-size:12px;max-width:670px;line-height:1.8}
.closing-banner .button{flex-shrink:0}
footer{max-width:1430px;margin:auto;border-top:1px solid var(--line);padding:25px clamp(19px,5vw,70px) 38px;display:flex;justify-content:space-between;gap:17px;flex-wrap:wrap;color:#9a93af;font-size:10px;letter-spacing:.03em}
footer a{color:#e0abda;text-decoration:none}
.skip-link{position:absolute;left:10px;top:-80px;background:#fff;color:#111;padding:10px 14px;z-index:100}
.skip-link:focus{top:10px}
@media(max-width:1050px){.navigation{display:none}.topbar{justify-content:space-between}.hero{grid-template-columns:1fr 1fr;padding-top:73px;gap:24px}.hero-display{transform:none}.scope{height:228px}.metrics{margin-left:20px;margin-right:20px}}
@media(max-width:760px){.topbar{height:73px}.brand strong{font-size:13px}.brand small{font-size:7px;letter-spacing:.13em}.brand img{width:39px;height:39px}.nav-cta{padding:9px;font-size:9px}.hero{grid-template-columns:1fr;min-height:0;padding:67px 24px 53px}.hero-display{max-width:560px;width:100%;justify-self:center}.hero-glow{display:none}.scope{height:205px}.metrics{grid-template-columns:repeat(2,1fr);margin:15px 20px;padding:13px 0}.metrics div{padding:15px}.metrics div:nth-child(2){border-right:0}.metrics div:nth-child(-n+2){border-bottom:1px solid var(--line)}.section{padding:62px 22px}.section-header{align-items:start;flex-direction:column}.studio-grid,.academy-grid{grid-template-columns:1fr}.output-inner{padding:24px}.output-panel{min-height:0}.result-content{min-height:235px}.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.closing-banner{align-items:start;flex-direction:column}}
@media(max-width:430px){.nav-cta{font-size:0;min-width:36px;min-height:34px;display:flex;align-items:center;justify-content:center}.nav-cta span{font-size:17px;margin:0}.hero{padding:50px 19px 37px}.hero-buttons{flex-direction:column}.hero-buttons .button{width:100%}.hero-under{line-height:2}.scope{height:169px}.metrics div{padding:11px}.section{padding-left:16px;padding-right:16px}.studio-form .field{padding-left:18px;padding-right:18px}.form-submit{margin-left:18px;width:calc(100% - 36px)}.panel-top{padding:0 17px}.feature-grid{grid-template-columns:1fr 1fr;gap:8px}.feature{padding:17px;min-height:220px}.lesson-feature,.lesson-quiz{padding:23px}.full-section{padding-bottom:65px}.closing-banner{padding:23px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}

.privacy-page{max-width:830px}.privacy-title{font-size:clamp(36px,5vw,60px)}.privacy-return{margin-top:35px}