:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#07070c;--bg-raised:#0d0d15;--surface:#ffffff09;--surface-2:#fff1;--surface-solid:#12121b;--line:#ffffff14;--line-strong:#ffffff29;--text:#f4f3fb;--text-soft:#a7a5bd;--text-faint:#6f6d86;--violet:#8b5cf6;--violet-soft:#a78bfa;--cyan:#22d3ee;--pink:#f472b6;--amber:#fbbf24;--mint:#34d399;--rose:#fb7185;--blue:#60a5fa;--grad:linear-gradient(120deg, var(--violet) 0%, var(--cyan) 100%);--grad-text:linear-gradient(100deg, #c4b5fd 0%, var(--cyan) 45%, var(--pink) 100%);--s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:20px;--s-6:24px;--s-8:32px;--s-10:40px;--s-12:48px;--s-16:64px;--s-20:80px;--s-24:96px;--font-display:"Inter Tight", "Inter", system-ui, sans-serif;--font-body:"Inter", system-ui, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;--fs-xs:.75rem;--fs-sm:.875rem;--fs-md:1rem;--fs-lg:1.125rem;--fs-xl:1.375rem;--fs-2xl:clamp(1.5rem, 1.25rem + 1vw, 2rem);--fs-3xl:clamp(1.875rem, 1.4rem + 2vw, 2.75rem);--fs-4xl:clamp(2.5rem, 1.5rem + 4.4vw, 4.75rem);--lh-tight:1.04;--lh-snug:1.3;--lh-body:1.6;--tracking-tight:-.035em;--r-sm:10px;--r-md:14px;--r-lg:20px;--r-xl:28px;--r-pill:999px;--sh-soft:0 12px 32px -14px #000000b3;--sh-lift:0 24px 60px -20px #000c;--glow:0 10px 40px -12px #8b5cf6b3;--blur:18px;--ease-out:cubic-bezier(.22, 1, .36, 1);--t-fast:.15s;--t-med:.3s;--t-slow:.6s;--container:1200px;--gutter:var(--s-6);font-family:var(--font-body);font-size:16px;line-height:var(--lh-body);color:var(--text)}@media (width<=640px){:root{--gutter:var(--s-4)}}*,:before,:after{box-sizing:border-box}body{background:var(--bg);-webkit-font-smoothing:antialiased;min-height:100svh;margin:0;overflow-x:clip}@keyframes drift{0%{transform:translate(0,0)rotate(0)}50%{transform:translate(-4%,3%)rotate(8deg)}to{transform:translate(0,0)rotate(0)}}body:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(38% 32% at 22% 18%,#8b5cf638,#0000 70%),radial-gradient(34% 30% at 80% 12%,#22d3ee24,#0000 70%),radial-gradient(40% 36% at 65% 85%,#f472b61f,#0000 70%);animation:38s ease-in-out infinite drift;position:fixed;inset:-25%}h1,h2,h3,h4,p{margin:0}h1,h2,h3{font-family:var(--font-display);font-weight:600;line-height:var(--lh-tight);letter-spacing:var(--tracking-tight)}a{color:inherit}img{max-width:100%;display:block}::selection{color:var(--text);background:#8b5cf673}:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}@keyframes page-in{0%{opacity:0;filter:blur(6px)}}.home,.layout{animation:page-in var(--t-slow) var(--ease-out) both}.grad-text{background:var(--grad-text);color:#0000;-webkit-background-clip:text;background-clip:text}button,a.btn{justify-content:center;align-items:center;gap:var(--s-2);min-height:44px;padding:var(--s-2) var(--s-5);font:500 var(--fs-sm) / 1.2 var(--font-body);color:var(--text);background:var(--surface-2);border:1px solid var(--line-strong);border-radius:var(--r-pill);cursor:pointer;transition:background-color var(--t-fast), border-color var(--t-fast), box-shadow var(--t-med) var(--ease-out), transform var(--t-fast);text-decoration:none;display:inline-flex}button:hover:not(:disabled),a.btn:hover{background:#ffffff1a;border-color:#ffffff3d}button:active:not(:disabled),a.btn:active{transform:scale(.98)}button:disabled{opacity:.5;cursor:default}.btn-primary,a.btn.btn-primary,a.btn.cta,.form button[type=submit]{color:#fff;background:var(--grad);box-shadow:var(--glow);border-color:#0000;font-weight:600}.btn-primary:hover:not(:disabled),a.btn.btn-primary:hover,a.btn.cta:hover,.form button[type=submit]:hover:not(:disabled){background:var(--grad);border-color:#0000;box-shadow:0 14px 50px -10px #8b5cf6e6}a.btn.cta{min-height:54px;padding:var(--s-3) var(--s-8);font-size:var(--fs-md)}.ghost,a.btn.ghost{color:var(--text-soft);background:0 0;border-color:#0000}.ghost:hover:not(:disabled),a.btn.ghost:hover{color:var(--text);background:var(--surface-2);border-color:var(--line)}.link-btn{min-height:0;color:var(--text-soft);text-underline-offset:3px;background:0 0;border:none;padding:0;text-decoration:underline}.link-btn:hover:not(:disabled){color:var(--text);background:0 0}.panel{padding:var(--s-6);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-soft);-webkit-backdrop-filter:blur(var(--blur))}.panel h2{font-size:var(--fs-lg);letter-spacing:-.01em}.grow{flex:1}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}label{gap:var(--s-2);font-size:var(--fs-xs);color:var(--text-soft);flex-direction:column;font-weight:500;display:flex}input[type=number],input[type=text],textarea,select{width:100%;min-height:42px;padding:var(--s-2) var(--s-3);font:400 var(--fs-sm) var(--font-body);color:var(--text);border:1px solid var(--line);border-radius:var(--r-sm);transition:border-color var(--t-fast), box-shadow var(--t-fast);background:#0000004d}input[type=number]{font-family:var(--font-mono)}textarea{min-height:0;line-height:var(--lh-snug);resize:vertical}select{appearance:none;padding-right:var(--s-10);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23a7a5bd' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--s-3) center;cursor:pointer}select option{color:var(--text);background:var(--surface-solid)}input[type=number]:focus,input[type=text]:focus,textarea:focus,select:focus{border-color:#8b5cf6b3;outline:none;box-shadow:0 0 0 3px #8b5cf633}input[type=number]:disabled,input[type=text]:disabled,select:disabled{opacity:.5}input::placeholder{color:var(--text-faint)}label.check{align-items:center;gap:var(--s-3);font-size:var(--fs-sm);color:var(--text);cursor:pointer;flex-direction:row}input[type=checkbox]{appearance:none;border:1px solid var(--line-strong);cursor:pointer;width:20px;height:20px;transition:background-color var(--t-fast), border-color var(--t-fast);background:#0000004d;border-radius:6px;flex-shrink:0;place-items:center;margin:0;display:grid}input[type=checkbox]:after{content:"";width:9px;height:5px;transition:transform var(--t-fast) var(--ease-out);border-bottom:2px solid #fff;border-left:2px solid #fff;transform:translateY(-1px)rotate(-45deg)scale(0)}input[type=checkbox]:checked{background:var(--violet);border-color:var(--violet)}input[type=checkbox]:checked:after{transform:translateY(-1px)rotate(-45deg)scale(1)}input[type=range]{appearance:none;border-radius:var(--r-pill);cursor:pointer;background:#ffffff1f;height:4px;margin:0}input[type=range]::-webkit-slider-thumb{appearance:none;background:#fff;border-radius:50%;width:16px;height:16px;box-shadow:0 0 0 4px #8b5cf659,0 0 16px #8b5cf6cc}input[type=range]::-moz-range-thumb{background:#fff;border:none;border-radius:50%;width:16px;height:16px;box-shadow:0 0 0 4px #8b5cf659,0 0 16px #8b5cf6cc}input[type=file]{font:400 var(--fs-xs) var(--font-body);color:var(--text-faint)}input[type=file]::file-selector-button{margin-right:var(--s-2);padding:var(--s-1) var(--s-3);font:500 var(--fs-xs) var(--font-body);color:var(--text);background:var(--surface-2);border:1px solid var(--line-strong);border-radius:var(--r-pill);cursor:pointer}.chips{gap:var(--s-2);flex-wrap:wrap;display:flex}.chip,.feature{align-items:center;gap:var(--s-2);padding:var(--s-1) var(--s-3);font-size:var(--fs-xs);color:var(--text-soft);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-pill);font-weight:500;display:inline-flex}.chip span{font-family:var(--font-mono);color:var(--text)}.chip:before,.feature:before{content:"";background:var(--tone,var(--violet));width:6px;height:6px;box-shadow:0 0 10px var(--tone,var(--violet));border-radius:50%;flex-shrink:0}.chip-cyan,.feature-cyan{--tone:var(--cyan)}.chip-amber,.feature-amber{--tone:var(--amber)}.chip-coral{--tone:var(--rose)}.chip-mint,.feature-mint{--tone:var(--mint)}.feature-pink{--tone:var(--pink)}.error{padding:var(--s-3) var(--s-4);font-size:var(--fs-sm);color:#fecdd3;border-radius:var(--r-md);background:#fb71851a;border:1px solid #fb718559}.hint{margin-top:var(--s-3);padding:var(--s-3);font-size:var(--fs-xs);color:#fde68a;border-radius:var(--r-md);background:#fbbf2414;border:1px solid #fbbf2440}.stats{margin-top:var(--s-3);font-size:var(--fs-xs);color:var(--text-faint)}.home{max-width:var(--container);padding:var(--s-4) var(--gutter) var(--s-16);margin:0 auto}.home-nav{top:var(--s-3);z-index:20;justify-content:space-between;align-items:center;gap:var(--s-3);padding:var(--s-2) var(--s-2) var(--s-2) var(--s-4);border:1px solid var(--line);border-radius:var(--r-pill);-webkit-backdrop-filter:blur(var(--blur));background:#0d0d1599;display:flex;position:sticky}.brand,a.brand{align-items:center;gap:var(--s-2);color:var(--text);text-decoration:none;display:inline-flex}.brand-logo{width:28px;height:28px}.brand-text{font-family:var(--font-display);font-size:var(--fs-lg);letter-spacing:-.02em;font-weight:600}.nav-right{align-items:center;gap:var(--s-1);display:flex}.hero{isolation:isolate;padding:var(--s-24) 0 var(--s-16);text-align:center;position:relative}@keyframes spin{to{transform:translate(-50%,-50%)rotate(360deg)}}.hero:before{content:"";z-index:-1;aspect-ratio:1;filter:blur(18px);opacity:.8;background:conic-gradient(#8b5cf600 0deg,#8b5cf659 70deg,#22d3ee40 150deg,#f472b647 250deg,#8b5cf600 360deg);border-radius:50%;width:min(720px,110vw);animation:40s linear infinite spin;position:absolute;top:46%;left:50%;transform:translate(-50%,-50%);-webkit-mask:radial-gradient(closest-side,#0000 58%,#000 60% 72%,#0000 74%);mask:radial-gradient(closest-side,#0000 58%,#000 60% 72%,#0000 74%)}.hero-badge{align-items:center;gap:var(--s-2);margin-bottom:var(--s-8);padding:var(--s-1) var(--s-3);font:500 var(--fs-xs) var(--font-mono);color:var(--text-soft);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-pill);display:inline-flex}.hero-badge:before{content:"";background:var(--mint);width:6px;height:6px;box-shadow:0 0 10px var(--mint);border-radius:50%}.hero h1{max-width:17ch;font-size:var(--fs-4xl);margin:0 auto;font-weight:600}.hero h1>span:not(.text-effect){background:var(--grad-text);color:#0000;-webkit-background-clip:text;background-clip:text}.hero>p{max-width:36rem;margin:var(--s-6) auto 0;font-size:var(--fs-lg);line-height:var(--lh-body);color:var(--text-soft)}.hero .cta,.hero .magnetic{margin-top:var(--s-10)}.features{justify-content:center;gap:var(--s-2);margin:var(--s-10) 0 0;flex-wrap:wrap;padding:0;list-style:none;display:flex}.feature{padding:var(--s-2) var(--s-4);font-size:var(--fs-sm)}@media (width<=640px){.hero{padding:var(--s-16) 0 var(--s-12)}.hero>p,.brand-text{font-size:var(--fs-md)}.nav-right .ghost{display:none}}.cards-title{margin-bottom:var(--s-8);font-size:var(--fs-3xl)}.cards{gap:var(--s-5);grid-template-columns:repeat(auto-fill,minmax(260px,1fr));display:grid}.cards>*{height:100%;display:flex}.card{isolation:isolate;color:var(--text);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);transition:border-color var(--t-med), transform var(--t-med) var(--ease-out), box-shadow var(--t-med) var(--ease-out);flex-direction:column;flex:1;text-decoration:none;display:flex;position:relative;overflow:hidden}.card:after{content:"";z-index:1;pointer-events:none;background:radial-gradient(320px circle at var(--mx,50%) var(--my,0%), color-mix(in srgb, var(--accent,var(--violet)) 22%, transparent), transparent 60%);opacity:0;transition:opacity var(--t-med);position:absolute;inset:0}a.card:hover{border-color:color-mix(in srgb, var(--accent,var(--violet)) 45%, transparent);box-shadow:var(--sh-lift);transform:translateY(-4px)}a.card:hover:after{opacity:1}.card-media{aspect-ratio:1/.78;background:radial-gradient(circle at 50% 40%, color-mix(in srgb, var(--accent) 30%, transparent), transparent 70%), var(--bg-raised);border-bottom:1px solid var(--line);position:relative;overflow:hidden}.card-media img{object-fit:cover;width:100%;height:100%;transition:transform var(--t-slow) var(--ease-out)}a.card:hover .card-media img{transform:scale(1.05)}.card-body{gap:var(--s-2);padding:var(--s-5);flex-direction:column;flex:1;display:flex}.card-index{font:500 var(--fs-xs) var(--font-mono);color:var(--text-faint)}.card h3{font-size:var(--fs-xl);letter-spacing:-.02em}.card p{font-size:var(--fs-sm);color:var(--text-soft);flex:1}.card-cta{margin-top:var(--s-2);font-size:var(--fs-sm);color:var(--text-soft);transition:color var(--t-fast);font-weight:500}a.card:hover .card-cta{color:var(--text)}.faq{max-width:820px;margin:var(--s-24) auto 0}.faq .cards-title{text-align:center}.faq-list{border-top:1px solid var(--line);flex-direction:column;display:flex}.faq-item{border-bottom:1px solid var(--line)}.faq-item summary{justify-content:space-between;align-items:center;gap:var(--s-4);padding:var(--s-5) var(--s-1);font-size:var(--fs-md);cursor:pointer;transition:color var(--t-fast);font-weight:500;list-style:none;display:flex}.faq-item summary:hover{color:var(--violet-soft)}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:after{content:"+";font:300 var(--fs-xl) var(--font-body);color:var(--text-faint);transition:transform var(--t-med) var(--ease-out);flex-shrink:0}.faq-item[open] summary:after{transform:rotate(45deg)}.faq-item p{padding:0 var(--s-1) var(--s-5);font-size:var(--fs-sm);line-height:var(--lh-body);color:var(--text-soft)}@media (width<=640px){.cards{grid-template-columns:1fr}}@keyframes fade-in{0%{opacity:0}}.overlay{z-index:50;padding:var(--gutter);-webkit-backdrop-filter:blur(8px);animation:fade-in var(--t-med) ease-out;background:#04040899;place-items:center;display:grid;position:fixed;inset:0}.modal{width:100%;max-width:480px;padding:var(--s-8);box-shadow:var(--sh-lift), var(--glow);background:#12121bd9}.modal h2{font-size:var(--fs-2xl)}.modal-sub{margin-top:var(--s-2);font-size:var(--fs-sm);color:var(--text-soft)}.modal-steps{gap:var(--s-3);margin:var(--s-6) 0 0;flex-direction:column;padding:0;list-style:none;display:flex}.modal-steps li{align-items:center;gap:var(--s-3);font-size:var(--fs-sm);display:flex}.modal-icon,.howto-icon{width:36px;height:36px;font-size:var(--fs-md);background:color-mix(in srgb, var(--accent) 16%, transparent);border:1px solid color-mix(in srgb, var(--accent) 35%, transparent);border-radius:var(--r-sm);flex-shrink:0;place-items:center;display:grid}.modal-actions{align-items:center;gap:var(--s-5);margin-top:var(--s-8);flex-wrap:wrap;display:flex}.howto-steps{gap:var(--s-3);flex-direction:column;max-width:760px;margin:0 auto;padding:0;list-style:none;display:flex}.howto-step{align-items:flex-start;gap:var(--s-4);padding:var(--s-5);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);animation:page-in var(--t-slow) var(--ease-out) both;animation-delay:calc(var(--i,0) * 80ms + .12s);display:flex}.howto-icon{width:44px;height:44px;font-size:var(--fs-lg)}.howto-step h3{font-size:var(--fs-lg);letter-spacing:-.01em}.howto-num{margin-right:var(--s-2);font:500 var(--fs-sm) var(--font-mono);color:var(--text-faint)}.howto-step p{margin-top:var(--s-1);font-size:var(--fs-sm);color:var(--text-soft)}.howto-cta{margin:var(--s-16) 0 var(--s-2);text-align:center}@media (width<=640px){.modal{padding:var(--s-6)}.howto-step{padding:var(--s-4)}}.footer{margin-top:var(--s-24)}.footer-cta{isolation:isolate;justify-content:space-between;align-items:center;gap:var(--s-6);padding:var(--s-10) var(--s-8);color:var(--text);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);flex-wrap:wrap;text-decoration:none;display:flex;position:relative;overflow:hidden}.footer-cta:before{content:"";z-index:-1;transition:opacity var(--t-med);background:radial-gradient(40% 60% at 15%,#8b5cf647,#0000 70%),radial-gradient(35% 55% at 85%,#22d3ee2e,#0000 70%);position:absolute;inset:-40% -10%}.footer-cta:hover{border-color:var(--line-strong)}.footer-cta-title{font:600 var(--fs-2xl) / var(--lh-tight) var(--font-display);letter-spacing:var(--tracking-tight);display:block}.footer-cta-sub{margin-top:var(--s-2);font-size:var(--fs-md);color:var(--text-soft);display:block}.footer-cta-btn{min-height:48px;padding:var(--s-2) var(--s-6);font-size:var(--fs-md);border-radius:var(--r-pill);pointer-events:none;flex-shrink:0;align-items:center;display:inline-flex}.footer-body{gap:var(--s-8);padding:var(--s-16) var(--s-1) var(--s-10);grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);display:grid}.footer-brand p{max-width:30ch;margin-top:var(--s-3);font-size:var(--fs-sm);color:var(--text-soft)}.footer-col h4{margin:0 0 var(--s-4);font:500 var(--fs-xs) var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint)}.footer-col ul{gap:var(--s-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.footer-col li,.footer-col a{font-size:var(--fs-sm);color:var(--text-soft);transition:color var(--t-fast);text-decoration:none}.footer-col a:hover{color:var(--text)}.footer-bottom{justify-content:space-between;align-items:center;gap:var(--s-3);padding:var(--s-5) var(--s-1) 0;font:400 var(--fs-xs) var(--font-mono);color:var(--text-faint);border-top:1px solid var(--line);flex-wrap:wrap;display:flex}.footer-bottom a{color:var(--text-soft);text-decoration:none}.footer-bottom a:hover{color:var(--text)}@media (width<=900px){.footer-body{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}}@media (width<=640px){.footer-cta{padding:var(--s-8) var(--s-5)}.footer-body{gap:var(--s-6);padding-top:var(--s-10);grid-template-columns:1fr}}.layout{gap:var(--s-5);max-width:1360px;padding:var(--s-4) var(--gutter) var(--s-12);flex-direction:column;margin:0 auto;display:flex}.topbar{align-items:center;gap:var(--s-3);padding:var(--s-2) var(--s-3);border:1px solid var(--line);border-radius:var(--r-pill);-webkit-backdrop-filter:blur(var(--blur));background:#0d0d1599;display:flex}.topbar .back{min-height:36px;padding:var(--s-1) var(--s-4)}.topbar-logo{width:28px;height:28px}.topbar h1{font-size:var(--fs-lg);letter-spacing:-.02em}.topbar p{font:400 var(--fs-xs) var(--font-mono);color:var(--text-faint)}@keyframes pulse{50%{opacity:.3}}.status{align-items:center;gap:var(--s-2);padding:var(--s-1) var(--s-3);font:500 var(--fs-xs) var(--font-mono);letter-spacing:.06em;color:var(--text-soft);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-pill);display:inline-flex}.status:before{content:"";background:var(--mint);width:6px;height:6px;box-shadow:0 0 10px var(--mint);border-radius:50%}.status.busy:before{background:var(--amber);box-shadow:0 0 10px var(--amber);animation:.9s ease-in-out infinite pulse}.studio{gap:var(--s-5);grid-template-columns:300px minmax(0,1fr) 300px;align-items:start;display:grid}.preview-title{margin-bottom:var(--s-4);font:600 var(--fs-xl) / var(--lh-snug) var(--font-display);letter-spacing:-.02em;text-align:center;color:var(--text)}.screen{border:1px solid var(--line-strong);border-radius:var(--r-lg);max-width:640px;margin:0 auto;overflow:hidden;box-shadow:0 0 0 1px #0009,0 30px 80px -30px #8b5cf673}canvas{width:100%;display:block}.controls{align-items:center;gap:var(--s-3);max-width:640px;margin:var(--s-4) auto 0;display:flex}.controls .play{min-width:96px}.sound-toggle{width:44px;font-size:var(--fs-md);padding:0}.controls input[type=range]{flex:1}.time{font:400 var(--fs-xs) var(--font-mono);font-variant-numeric:tabular-nums;color:var(--text-soft);white-space:nowrap}.player .chips{max-width:640px;margin:var(--s-4) auto 0;justify-content:center}.empty,.side-placeholder{text-align:center;color:var(--text-faint);place-items:center;display:grid}.empty{min-height:420px;font-size:var(--fs-md)}.side-placeholder{padding:var(--s-10) var(--s-4);font-size:var(--fs-sm)}@media (width<=1200px){.studio{grid-template-columns:280px minmax(0,1fr)}.export{grid-column:1/-1}}@media (width<=900px){.studio{grid-template-columns:1fr}.studio>.player,.studio>.empty{order:-1}}@media (width<=640px){.topbar{border-radius:var(--r-lg);flex-wrap:wrap}.topbar p,.topbar-logo{display:none}.panel{padding:var(--s-4)}.controls{flex-wrap:wrap}.controls input[type=range]{order:3;min-width:100%}.empty{min-height:260px}}.form{gap:var(--s-4);flex-direction:column;display:flex}.seed-row{gap:var(--s-2);display:flex}.dice{width:42px;min-height:42px;font-size:var(--fs-md);border-radius:var(--r-sm);flex-shrink:0;padding:0}.dice-face{display:inline-block}.form-section{margin-top:var(--s-2);padding-top:var(--s-4);font:500 var(--fs-xs) var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint);border-top:1px solid var(--line)}.form button[type=submit]{min-height:48px;margin-top:var(--s-2);font-size:var(--fs-md)}.ends-when{padding:var(--s-2) var(--s-3);font-size:var(--fs-xs);color:var(--text-soft);border-radius:var(--r-sm);background:#34d39914;border:1px solid #34d3994d}.hook-chips{gap:var(--s-2);margin-top:calc(var(--s-1) * -1);flex-wrap:wrap;display:flex}.hook-chip{min-height:0;padding:var(--s-1) var(--s-3);font-size:var(--fs-xs);text-align:left;color:var(--text-soft);background:var(--surface);border-color:var(--line);font-weight:400}.hook-chip[aria-pressed=true]{color:var(--text);background:#8b5cf62e;border-color:#8b5cf699}.export-options{align-items:stretch;gap:var(--s-4);margin-top:var(--s-5);flex-direction:column;display:flex}.export-options>button{min-height:48px;font-size:var(--fs-md);color:#fff;background:var(--grad);box-shadow:var(--glow);border-color:#0000;font-weight:600}.export-options>button:hover:not(:disabled){background:var(--grad)}.melody-name{align-items:center;gap:var(--s-2);margin-top:var(--s-1);font-size:var(--fs-xs);color:var(--text-soft);display:flex}@keyframes shimmer{to{background-position:200% 0}}.progress{height:6px;margin-top:var(--s-4);border-radius:var(--r-pill);background:#ffffff14;overflow:hidden}.progress-bar{background:linear-gradient(90deg, var(--violet), var(--cyan), var(--violet));border-radius:inherit;background-size:200% 100%;height:100%;transition:width .2s;animation:1.4s linear infinite shimmer;box-shadow:0 0 12px #22d3ee99}.tpl-crumb{font:400 var(--fs-xs) var(--font-mono);color:var(--text-faint);margin:0 auto var(--s-6)!important}.tpl-crumb a{color:var(--text-soft);text-decoration:none}.tpl-crumb a:hover{color:var(--text)}.tpl-hero h1{max-width:18ch}.tpl-hero>p{max-width:42rem}.tpl-grid{gap:var(--s-12);grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;display:grid}.tpl-preview{justify-content:center;align-items:center;gap:var(--s-3);aspect-ratio:1;padding:var(--s-6);isolation:isolate;text-align:center;flex-direction:column;display:flex;position:relative;overflow:hidden}.tpl-preview-img{z-index:-2;object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.tpl-preview:before{content:"";z-index:-1;background:radial-gradient(circle,#07070cbf,#07070c59 70%);position:absolute;inset:0}.tpl-preview button{min-height:48px;font-size:var(--fs-md)}.tpl-preview .stats{max-width:34ch;color:var(--text-soft);margin-top:0}.tpl-text p,.tpl-text li{font-size:var(--fs-md);line-height:var(--lh-body);color:var(--text-soft)}.tpl-text p+p{margin-top:var(--s-4)}.tpl-text h2{margin:var(--s-10) 0 var(--s-4);font-size:var(--fs-2xl)}.tpl-text h2:first-child{margin-top:0}.tpl-text ol{gap:var(--s-4);counter-reset:step;flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.tpl-text ol li{padding-left:var(--s-10);counter-increment:step;position:relative}.tpl-text ol li:before{content:counter(step, decimal-leading-zero);font:500 var(--fs-sm) var(--font-mono);color:var(--text-faint);position:absolute;top:2px;left:0}.tpl-section{margin-top:var(--s-24)}.tpl-params{justify-content:flex-start;margin-top:0}.tpl-idea{gap:var(--s-2);padding:var(--s-6)}.tpl-idea h3{font-size:var(--fs-lg)}.tpl-others{gap:var(--s-2);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.tpl-others a{align-items:center;gap:var(--s-2);padding:var(--s-2) var(--s-4);font-size:var(--fs-sm);color:var(--text-soft);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-pill);transition:color var(--t-fast), border-color var(--t-fast), background-color var(--t-fast);text-decoration:none;display:inline-flex}.tpl-others a:hover{color:var(--text);background:var(--surface-2);border-color:var(--line-strong)}@media (width<=900px){.tpl-grid{gap:var(--s-8);grid-template-columns:1fr}.tpl-grid>.panel{width:100%;max-width:520px;margin:0 auto}}.picker-tool{gap:var(--s-6);grid-template-columns:minmax(260px,320px) minmax(0,1fr);align-items:start;display:grid}.picker-tool>:nth-child(n+3){grid-column:2}.picker-form{gap:var(--s-4);flex-direction:column;grid-row:span 3;display:flex}.picker-form textarea{min-height:220px;font-family:var(--font-mono);line-height:var(--lh-body)}.picker-form button{min-height:48px;font-size:var(--fs-md)}.picker-empty{justify-content:center;align-items:center;gap:var(--s-4);text-align:center;min-height:360px;color:var(--text-soft);flex-direction:column;display:flex}.picker-empty-icon{font-size:56px}.picker-results{align-items:flex-start;gap:var(--s-3);flex-direction:column;display:flex}.picker-results summary{color:var(--text);cursor:pointer;font-weight:600}.picker-ranking{margin:var(--s-3) 0 0;padding-left:var(--s-6);columns:2;font-family:var(--font-mono);font-size:var(--fs-sm);color:var(--text-soft)}.picker-ranking .is-winner{font-family:var(--font-display);font-size:var(--fs-lg);color:var(--text);font-weight:700}@media (width<=900px){.picker-tool{grid-template-columns:1fr}.picker-tool>:nth-child(n+3){grid-column:auto}.picker-form{grid-row:auto}}