/* Three steps: equal-height columns with aligned closing callouts. */
#how .steps{align-items:stretch;gap:28px}
#how .step{display:flex;flex-direction:column;min-width:0}
#how .step .num{font-size:11px;letter-spacing:1.2px;line-height:1.5}
#how .step h3{font-size:23px;line-height:1.25;letter-spacing:-.65px;margin:22px 0 16px}
#how .step p{font-size:15px;line-height:1.75;margin:0 0 24px}
#how .step .word{display:flex;align-items:center;min-height:64px;margin-top:auto;padding:16px 18px;font-size:14px;line-height:1.5;border:1px solid #ffffff0d;border-radius:9px}
@media(max-width:800px){#how .steps{gap:30px}#how .step h3{margin-top:14px}#how .step .word{min-height:0}}
/* The original teaser's Archivo wordmark, kept distinct from readable body copy. */
.brand-word,.logo{font-family:"Archivo","Arial",sans-serif;font-weight:700;text-transform:none;letter-spacing:-.035em}
.brand-word{font-size:1em}
.brand-lockup{display:inline-flex;align-items:baseline;gap:.22em;line-height:1;white-space:nowrap}
.brand-descriptor{font:inherit;letter-spacing:inherit}
body{isolation:isolate;background:#151719}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 12% 18%,#d99b4920,transparent 45%),radial-gradient(ellipse at 85% 65%,#78a8a216,transparent 45%);animation:ambient-drift 24s ease-in-out infinite alternate}
.site.dark{background:transparent}
.dark .product-stage,.prompt-demo-box,.modern-grid article,.tour-panel .image-button{background:linear-gradient(135deg,#ffffff0c,#ffffff02),#202426e8;border:1px solid #ffffff20;box-shadow:inset 0 1px 0 #ffffff0d,0 16px 45px #00000020}
@supports ((backdrop-filter:blur(12px)) or (-webkit-backdrop-filter:blur(12px))){
 .dark .product-stage,.prompt-demo-box,.modern-grid article,.tour-panel .image-button{background:linear-gradient(135deg,#ffffff09,#ffffff02),#202426b8;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
}
.modern-grid article{border-radius:12px;border-top-color:#f1b26a66}
.end{background:linear-gradient(120deg,#dba05a12,#ffffff03);border-top-color:#f1b26a30}
.pill,.sound-choices button,.tour-tabs button,.prompt-step-buttons button,.image-button{transition:transform .2s ease,border-color .2s ease,background-color .2s ease,box-shadow .2s ease}
@media(hover:hover){.pill:hover,.sound-choices button:hover,.tour-tabs button:hover,.prompt-step-buttons button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0003}.image-button:hover{border-color:#f1b26a88;box-shadow:0 10px 30px #0003}}
.pill:active,.sound-choices button:active,.tour-tabs button:active,.prompt-step-buttons button:active{transform:translateY(0)}
.ambient-toggle{border:1px solid #ffffff30;border-radius:24px;background:#202426;color:#c1c4c2;padding:10px 16px;min-height:44px;font-size:11px;line-height:1.5}
.ambient-toggle:disabled{opacity:.7;cursor:default}
.motion-settings{max-width:1240px;margin:auto;padding:0 48px 24px;text-align:right}
@keyframes ambient-drift{from{transform:translateY(-2%);opacity:.65}to{transform:translateY(2%);opacity:1}}
html[data-ambient-paused=true] body::before{animation-play-state:paused}
@media(max-width:800px){.motion-settings{padding-inline:24px}.foot{flex-wrap:wrap}.modern-grid article{padding:24px}}
@media(prefers-reduced-motion:reduce){body::before{animation:none}.pill,.sound-choices button,.tour-tabs button,.prompt-step-buttons button,.image-button{transition:none!important;transform:none!important}html{scroll-behavior:auto}}
@media(prefers-reduced-transparency:reduce){.dark .product-stage,.prompt-demo-box,.modern-grid article,.tour-panel .image-button{background:#202426;backdrop-filter:none;-webkit-backdrop-filter:none}}
.sound-construction{display:grid;grid-template-columns:1fr 1.3fr;gap:40px;margin-top:44px;padding:32px;border:1px solid #f1b26a30;border-radius:12px;background:linear-gradient(135deg,#f1b26a0a,#ffffff03)}.sound-construction h3{font-size:28px;line-height:1.15;letter-spacing:-.8px;font-weight:500;margin:0}.sound-construction p:not(.eyebrow){font-size:15px;line-height:1.8;color:#b9bfbe;margin:0 0 18px}.sound-construction .construction-note{color:#e9c79d!important;font-size:13px!important;margin-bottom:0!important}@media(max-width:800px){.sound-construction{grid-template-columns:1fr;gap:24px;padding:24px}}
.mini-instrument{display:block;width:76px;height:44px;flex:none;color:#f1b26a;overflow:visible}.mini-instrument .keys rect{animation:mini-key-pulse 4.2s ease-in-out infinite}.mini-instrument .keys rect:nth-child(3n + 2){animation-delay:.5s}.mini-instrument .keys rect:nth-child(3n){animation-delay:1s}.footer-brand{display:inline-flex;align-items:center;gap:12px}.footer-brand .mini-instrument{width:66px;height:38px}.foot{flex-wrap:wrap}.mini-instrument .waveform{stroke-dasharray:48 12;animation:mini-signal 8s linear infinite}@keyframes mini-key-pulse{0%,65%,100%{opacity:.58}72%{opacity:1}}@keyframes mini-signal{to{stroke-dashoffset:-240}}html[data-ambient-paused=true] .mini-instrument *{animation-play-state:paused}@media(prefers-reduced-motion:reduce){.mini-instrument *{animation:none!important}}@media(max-width:600px){.logo{gap:7px}.logo .mini-instrument{width:52px;height:32px}}
.patch-download{display:inline-flex;align-items:center;min-height:44px;margin:4px 18px 0 0;color:#f1b26a;font-size:12px;text-underline-offset:4px}
.sheet-story{grid-template-columns:.85fr 1.15fr}.sheet-story figure{margin:0;min-width:0}.sheet-story .image-button{padding:10px;background:#202426b8;border:1px solid #ffffff20;box-shadow:0 16px 45px #0003}.sheet-story img{max-height:540px;object-fit:cover;object-position:top}.sheet-story .sheet-note{color:#e9c79d;font-size:14px}@media(max-width:800px){.sheet-story{grid-template-columns:1fr;gap:28px}.sheet-story img{max-height:480px}}
/* Quiet oscillator traces: periodic tiles loop without a visible reset. */
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='480' height='160' viewBox='0 0 480 160'%3E%3Cpath d='M0 80 C40 80 40 24 80 24 S120 80 160 80 S200 136 240 136 S280 80 320 80 S360 24 400 24 S440 80 480 80' fill='none' stroke='%23f1b26a' stroke-opacity='.17' stroke-width='1.5'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='480' height='160' viewBox='0 0 480 160'%3E%3Cpath d='M0 112 H60 V48 H180 V112 H300 V48 H420 V112 H480' fill='none' stroke='%238db8b1' stroke-opacity='.13' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E");background-size:480px 160px;background-repeat:repeat-x;background-position:0 26vh,0 72vh;animation:oscillator-drift 20s linear infinite}
@keyframes oscillator-drift{to{background-position:480px 26vh,-480px 72vh}}
html[data-ambient-paused=true] body::after{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){body::after{animation:none}}
body::after{opacity:.5}
