@font-face{font-family:"Plus Jakarta Sans";src:url(fonts/jakarta.woff2) format("woff2");font-weight:400 800;font-display:swap}
:root{--grape:#5426B2;--pink:#FF4A98;--mint:#58E9BF;--cream:#FFF8EC;--navy:#27194A;--lav:#D2C2F6;--bg:#160C33;--line:rgba(255,248,236,.13);--mute:#BFB2E6;--panel:rgba(39,25,74,.72);
--f:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--f);color:var(--cream);background:#160C33 radial-gradient(120% 70% at 50% -10%,#3A1F86 0%,#1E1046 45%,#120a2b 100%) fixed;min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:3px solid var(--mint);outline-offset:2px;border-radius:10px}
.top{max-width:1400px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:14px clamp(14px,3vw,36px) 0}
.back{font-size:13px;font-weight:700;color:var(--mute);text-decoration:none;padding:8px 0}
.back:hover{color:var(--cream)}
.wm{font-size:12px;font-weight:800;letter-spacing:.16em;color:var(--mute)}.wm b{color:var(--mint)}
main{max-width:1400px;margin:0 auto;padding:0 clamp(14px,3vw,36px) 28px}
.hero{padding:10px 0 14px}
h1{font-size:clamp(30px,5.6vw,52px);font-weight:800;letter-spacing:-.02em;line-height:1.05}
.tag-line{color:var(--mute);font-size:clamp(14px,1.6vw,17px);max-width:62ch;margin-top:6px;line-height:1.45}
.studio{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:18px;align-items:start}
.stagewrap{position:relative;border-radius:22px;overflow:hidden;background:radial-gradient(90% 80% at 50% 30%,#3b2585 0%,#21124d 60%,#170c38 100%);border:1px solid var(--line);height:min(74vh,720px);min-height:360px;position:sticky;top:12px}
#stage{display:block;width:100%;height:100%;touch-action:none;cursor:grab}
#stage:active{cursor:grabbing}
.stagehud{position:absolute;left:14px;top:12px;display:flex;gap:10px;align-items:center;pointer-events:none}
.hint{font-size:12px;color:var(--mute);opacity:.85}
.stagebtns{position:absolute;right:12px;bottom:12px;display:flex;gap:8px}
.ghost{background:rgba(22,12,51,.66);border:1px solid var(--line);border-radius:999px;padding:9px 14px;font-size:13px;font-weight:700;backdrop-filter:blur(6px)}
.ghost.on{border-color:var(--mint);color:var(--mint)}
.panel{display:flex;flex-direction:column;gap:12px}
.blk{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:14px}
h2{font-size:21px;font-weight:800}h3{font-size:14px;font-weight:800;letter-spacing:.02em;margin-bottom:10px}
.mut{color:var(--mute);font-size:13.5px;line-height:1.45;margin-top:4px}.sm{font-size:12.5px}
.tag{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.04em;padding:4px 9px;border-radius:999px;background:var(--mint);color:#16103a}
.t-intermediate{background:var(--lav)}.t-master{background:var(--pink);color:#fff}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.chip{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:999px;padding:7px 12px;font-size:13px;font-weight:600;color:var(--cream);background:rgba(255,255,255,.04);min-height:34px}
.chips.sm .chip{padding:6px 11px;font-size:12.5px;min-height:32px}
.chip.on{background:var(--cream);color:#1b1040;border-color:var(--cream)}
.chip i{width:12px;height:12px;border-radius:50%;display:inline-block;box-shadow:0 0 0 1px rgba(0,0,0,.25) inset}
.cards{display:grid;gap:8px}
.card{display:flex;gap:12px;align-items:center;text-align:left;padding:8px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.03);transition:border-color .15s,background .15s}
.card:hover{background:rgba(255,255,255,.07)}
.card.on{border-color:var(--mint);background:rgba(88,233,191,.09)}
.card img{width:96px;height:72px;border-radius:10px;object-fit:cover;background:#2a1a5c;flex:none}
.ct{display:flex;flex-direction:column;gap:4px;min-width:0}.ct b{font-size:15px}.ct small{color:var(--mute);font-size:12px}.ct .tag{align-self:flex-start;font-size:10px;padding:3px 8px}
.swatches{display:flex;flex-wrap:wrap;gap:7px;margin:6px 0 4px}
.sw{width:30px;height:30px;border-radius:50%;box-shadow:0 0 0 1px rgba(255,255,255,.2) inset;position:relative}
.sw.on{box-shadow:0 0 0 2px #160C33,0 0 0 4px var(--mint)}
.sw.custom{display:inline-flex;align-items:center;justify-content:center;background:conic-gradient(#ff4a98,#5426b2,#3ba0ff,#58e9bf,#ff4a98);overflow:hidden;cursor:pointer}
.sw.custom input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.sw.custom span{font-weight:800;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5);pointer-events:none}
.namef{display:flex;flex-direction:column;gap:6px;margin-top:6px;font-size:13px;font-weight:600}.namef em{color:var(--mute);font-style:normal;font-weight:500}
.namef input{font:inherit;font-size:16px;color:var(--cream);background:rgba(0,0,0,.25);border:1px solid var(--line);border-radius:12px;padding:10px 12px;outline:none}
.namef input:focus{border-color:var(--mint)}
.cta{display:block;width:100%;text-align:center;background:linear-gradient(90deg,var(--pink),#c23bd0 55%,var(--grape));color:#fff;font-weight:800;font-size:16px;padding:15px 18px;border-radius:14px;text-decoration:none;box-shadow:0 8px 24px rgba(255,74,152,.25)}
.cta:disabled{opacity:.7}
.cta.alt{width:auto;display:inline-block;background:var(--mint);color:#16103a;box-shadow:none;white-space:nowrap}
.dlb .size{margin-top:0}
.proofs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:22px}
.pcard{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:16px}
.pcard ul{list-style:none;display:grid;gap:8px}
.pcard li{font-size:13.5px;line-height:1.45;color:#e9e2fa;padding-left:18px;position:relative}
.pcard li::before{content:"";position:absolute;left:2px;top:7px;width:7px;height:7px;border-radius:50%;background:var(--mint)}
.pcard b{color:var(--cream)}
.pcard .mut{margin-top:10px}
.showoff{margin-top:22px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px;border-radius:20px;background:linear-gradient(100deg,rgba(84,38,178,.55),rgba(255,74,152,.28));border:1px solid var(--line)}
.showoff p{color:#efe8ff;margin-top:4px;font-size:14.5px;line-height:1.45}.showoff a{color:var(--mint);font-weight:700}
.showoff .cta.alt{color:#16103a}
.foot{display:flex;justify-content:space-between;gap:12px;padding:20px 2px 4px;color:var(--mute);font-size:13px}.foot a{text-decoration:none;font-weight:700}
@media (max-width:980px){.studio{grid-template-columns:1fr}.stagewrap{position:relative;top:0;height:58vh;min-height:320px}.proofs{grid-template-columns:1fr}}
@media (max-width:980px) and (orientation:landscape) and (max-height:520px){.studio{grid-template-columns:minmax(0,1fr) 330px}.stagewrap{position:sticky;top:8px;height:calc(100vh - 16px);min-height:0}.hero{padding:4px 0 8px}h1{font-size:26px}.tag-line{display:none}}
@media (max-width:560px){.showoff{flex-direction:column;align-items:flex-start}.hint{display:none}.stagewrap{border-radius:18px}}
.bare .top,.bare .hero,.bare .panel,.bare .proofs,.bare .showoff,.bare .foot,.bare .stagebtns,.bare .stagehud{display:none}
.bare main{padding:0;max-width:none}.bare .studio{display:block}.bare .stagewrap{position:fixed;inset:0;height:100vh;border-radius:0;border:0}
.ogtitle{display:none}
.bare.titled .ogtitle{display:flex;flex-direction:column;gap:8px;position:absolute;left:56px;top:50px;z-index:2;pointer-events:none}
.ogtitle span{font-size:20px;font-weight:800;letter-spacing:.18em;color:var(--mute)}.ogtitle span b{color:var(--mint)}
.ogtitle strong{font-size:68px;line-height:1;font-weight:800;letter-spacing:-.02em;color:var(--cream);max-width:7em}
.ogtitle em{font-style:normal;font-size:26px;font-weight:700;color:var(--pink)}