/* Layout uses the original midiflow tokens. Each stack owns its spacing once. */
html { --section-space:96px; scroll-padding-top:24px; }
body { margin:0; background:var(--ground); }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
p,h1,h2,h3,h4,figure { margin:0; }
h1,h2,h3 { text-wrap:balance; }
p { text-wrap:pretty; }
[hidden] { display:none !important; }
.container { width:min(1120px,calc(100% - 40px)); margin-inline:auto; }
.mf .label { font-size:12px; }
.skip { position:absolute; top:-100px; padding:12px; background:var(--panel); z-index:10; }
.skip:focus { top:8px; }
.review-bar { border-bottom:1px solid var(--line); background:var(--panel); color:var(--ink-muted); font-size:12px; }
.review-bar .container { display:flex; justify-content:space-between; gap:16px; padding-block:8px; }
.review-bar strong { font-weight:500; }
.site-header { min-height:88px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:inline-flex; flex:none; align-items:center; min-height:44px; }
.brand img { object-fit:contain; height:auto; }
.brand-pro img { width:209px; }
.site-footer .brand-pro img { width:175px; }
.logo-light { display:none; }
[data-theme="light"] .logo-light { display:block; }
[data-theme="light"] .logo-dark { display:none; }
.primary-nav { display:flex; gap:24px; font-size:13px; color:var(--ink-muted); }
.primary-nav a,.locale-link { display:inline-flex; align-items:center; min-height:44px; }
.primary-nav a:hover,.text-link:hover { color:var(--accent-ink); }
.header-controls { display:flex; align-items:center; gap:12px; }
.locales { display:flex; gap:4px; }
.locale-link { padding-inline:8px; color:var(--ink-muted); font-size:12px; font-weight:600; }
.locale-link[aria-current="page"] { color:var(--accent-ink); text-decoration:underline; text-underline-offset:6px; }
.theme-toggle { width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; border:0; background:transparent; color:var(--ink-muted); cursor:pointer; border-radius:var(--radius-md); }
.theme-toggle span { display:inline-flex; }
.theme-toggle .mf-icon { width:16px; height:16px; }
[data-theme="dark"] .theme-moon,[data-theme="light"] .theme-sun { display:none; }
.hero { --hero-group-space:32px; --hero-edge-space:64px; --hero-label-space:24px; padding:var(--hero-edge-space) 0; text-align:center; }
.hero-copy { display:flex; flex-direction:column; align-items:center; gap:0; max-width:960px; margin-inline:auto; }
.eyebrow { color:var(--accent-ink); }
.hero h1 { margin-top:var(--hero-label-space); font-size:clamp(38px,5vw,64px); line-height:1.08; }
.hero h1 span { color:var(--accent-ink); }
.hero-lead { max-width:800px; margin-top:var(--hero-group-space); color:var(--ink-muted); font-size:20px; line-height:1.5; }
.hero-actions { display:flex; justify-content:center; margin-top:var(--hero-group-space); }
.hero-actions .cta { min-height:52px; padding:14px 24px; font-size:16px; }
.cta { height:auto; min-height:48px; padding:12px 20px; font-size:14px; white-space:normal; text-align:center; line-height:20px; }
.hero-meta { display:flex; flex-direction:column; gap:0; margin-top:16px; color:var(--ink-muted); }
.platform { font-size:13px; line-height:20px; }
.text-link { display:inline-flex; align-items:center; gap:6px; min-height:44px; font-size:13px; text-decoration:underline; text-underline-offset:4px; }
.product-preview { max-width:900px; margin-inline:auto; scroll-margin-top:20px; }
.film-frame { position:relative; overflow:hidden; border-radius:var(--radius-xl); border:1px solid var(--line-strong); background:var(--panel); }
.film-frame video { display:block; width:100%; height:auto; aspect-ratio:80/49; }
.film-controls { position:absolute; z-index:2; bottom:12px; right:16px; display:flex; align-items:center; height:44px; border-radius:8px; background:#f8f7f3ed; }
/* One clickable cover hides the chat until the visitor starts the film. */
.film-sound-prompt { position:absolute; z-index:2; inset:0; display:block; width:100%; height:100%; padding:0; border:0; border-radius:inherit; background:#141519; color:#f4f3f0; font-family:Figtree,sans-serif; text-align:center; cursor:pointer; }
.film-sound-prompt:focus-visible { outline:3px solid #b7a6ff; outline-offset:-5px; }
.sound-cover-copy { position:absolute; top:24px; left:24px; right:24px; display:grid; grid-template-columns:64px auto; grid-template-rows:auto auto; justify-content:center; align-items:center; gap:8px 24px; text-align:start; }
.sound-cover-play { display:flex; align-items:center; justify-content:center; width:64px; height:64px; grid-row:1 / 3; border-radius:50%; background:#7155ea; color:#fff; animation:sound-invitation 2.4s ease-out infinite; transition:background .15s; }
.sound-cover-play .mf-icon { width:30px; height:30px; margin-left:4px; }
.film-sound-prompt:hover .sound-cover-play { background:#6347e3; }
.sound-cover-title { font-size:clamp(24px,3vw,36px); font-weight:600; line-height:1.15; letter-spacing:-.6px; }
.sound-cover-subtitle { display:flex; align-items:center; gap:8px; font-size:15px; line-height:22px; color:#a8a9b3; }
.sound-cover-subtitle .mf-icon { width:18px; height:18px; }
.sound-cover-wave { position:absolute; top:36%; left:8%; width:84%; height:30%; fill:#8b6cf6; pointer-events:none; }
@keyframes sound-invitation { 0%,100% { box-shadow:0 0 0 0 #8b6cf600; } 30% { box-shadow:0 0 0 0 #8b6cf650; } 75% { box-shadow:0 0 0 14px #8b6cf600; } }
@media (prefers-reduced-motion:reduce) { .sound-cover-play { animation:none; transition:none; } }
.film-control { display:flex; align-items:center; justify-content:center; width:44px; height:44px; border:0; border-radius:8px; background:transparent; color:#625e56; cursor:pointer; }
.film-control:hover { background:#eae7df; color:#2d2b28; }
.film-control:focus-visible { outline:2px solid var(--accent); outline-offset:-3px; }
.film-control span { display:flex; }
.film-control .mf-icon { width:18px; height:18px; }
#film-sound[data-muted="true"] .sound-on,#film-sound[data-muted="false"] .sound-off,
#film-pause[data-paused="true"] .show-pause,#film-pause[data-paused="false"] .show-play { display:none; }
.client-experience { display:flex; flex-direction:column; gap:4px; padding-top:16px; text-align:center; font-size:14px; line-height:1.5; }
.client-experience strong { font-size:16px; font-weight:600; }
.client-experience span { color:var(--ink-muted); }
.section { padding-top:var(--section-space); scroll-margin-top:24px; }
.section > .eyebrow,.section > div:first-child > .eyebrow { margin-bottom:12px; }
.section-lead { color:var(--ink-muted); max-width:680px; margin-top:12px; }
.feature-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; margin-top:24px; }
.feature-grid article { display:flex; flex-direction:column; gap:12px; }
.feature-index { display:inline-flex; align-items:center; justify-content:center; align-self:flex-start; flex:none; width:44px; height:44px; border-radius:50%; background:var(--accent-fill); color:var(--on-accent); font-size:22px; line-height:1; font-weight:600; }
.instrument-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:24px; }
.instrument-card,.sampler-feature,.support-roadmap { padding:24px; gap:12px; }
.instrument-card > .text-link { align-self:flex-start; margin-top:auto; }
.support-roadmap,.sampler-feature { margin-top:20px; }
.support-roadmap { border-color:var(--accent); background:var(--accent-tint); }
.support-roadmap > div { display:flex; flex-direction:column; gap:12px; }
.support-roadmap h3 { font-size:26px; line-height:1.2; }
.sampler-feature h3 { font-size:26px; line-height:1.2; }
.sampler-feature .body-l { font-size:16px; line-height:1.55; }
.support-more { margin:16px auto 0; max-width:900px; text-align:center; font-size:13px; line-height:1.5; }
.compatibility { display:grid; grid-template-columns:1fr 1fr; gap:32px; margin-top:56px; padding:24px; }
.compatibility > div { display:flex; flex-direction:column; gap:12px; }
.vst-logo { width:80px; height:auto; align-self:flex-start; }
.checklist { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.checklist li { display:flex; gap:8px; align-items:flex-start; }
.checklist .mf-icon { margin-top:3px; color:var(--accent-ink); flex:none; }
.pricing-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:24px; }
.price-card { padding:24px; gap:16px; }
.price-card:first-child { border-color:var(--accent); }
.price-sub { color:var(--ink-muted); }
.price-foot { margin-top:auto; }
.price-block { display:flex; flex-direction:column; gap:12px; }
.price-annual { display:flex; flex-direction:column; align-items:flex-start; gap:12px; font-size:32px; font-weight:600; line-height:1.2; color:var(--ink); }
.price-amount { display:inline-flex; align-items:baseline; gap:4px; white-space:nowrap; }
.price-unit { font-size:18px; font-weight:500; }
.price-billing { font-size:14px; line-height:1.5; font-weight:400; }
.faq-section { display:grid; grid-template-columns:.7fr 1.3fr; gap:40px; }
.faq-list { display:grid; gap:24px; }
.faq-list article { display:flex; flex-direction:column; gap:8px; }
.faq-list h3 { font-size:16px; }
.faq-list p { font-size:14px; line-height:1.6; }
.closing { display:flex; flex-direction:column; align-items:center; gap:16px; margin-top:var(--section-space); padding:32px; background:var(--accent-tint); border:1px solid var(--line); border-radius:var(--radius-xl); text-align:center; }
.site-footer { padding-block:var(--section-space) 32px; display:flex; justify-content:space-between; gap:32px; }
.site-footer nav { display:flex; flex-wrap:wrap; gap:20px; align-items:center; }
.site-footer button { min-height:44px; background:none; border:0; padding:0; font-size:13px; color:var(--ink); cursor:pointer; }
.site-footer > div:last-child { text-align:end; align-self:center; }
.site-footer > div:last-child nav { justify-content:flex-end; }
.trademark-notice { padding-bottom:32px; font-size:12px; line-height:1.6; }
.modal { color:var(--ink); width:min(560px,calc(100% - 32px)); max-height:calc(100dvh - 32px); padding:32px; overflow-y:auto; margin:auto; }
.modal:not([open]) { display:none; }
.modal::backdrop { background:rgb(0 0 0 / 65%); }
.modal-head { display:flex; justify-content:space-between; align-items:center; }
.modal ol { margin:0; padding-inline-start:24px; }
.modal li + li { margin-top:12px; }
.close-dialog { min-height:44px; min-width:44px; }
blockquote { margin:0; padding:16px; background:var(--panel); border:1px solid var(--line); border-radius:var(--radius-md); }
/* Installation uses a page so the main CTA has a stable, linkable destination. */
.start-page { max-width:1040px; padding-block:8px 56px; display:flex; flex-direction:column; gap:32px; }
.start-back { align-self:flex-start; }
.start-intro { display:flex; flex-direction:column; gap:12px; max-width:720px; }
.start-intro h1 { font-size:clamp(36px,4vw,48px); line-height:1.1; }
.start-layout { display:grid; grid-template-columns:1.2fr 1fr; gap:56px; align-items:start; }
.start-steps { display:flex; flex-direction:column; gap:24px; }
.start-steps ol { display:flex; flex-direction:column; gap:24px; list-style:none; margin:0; padding:0; }
.start-steps li { display:flex; gap:16px; align-items:flex-start; }
.start-steps li > div { display:flex; flex-direction:column; gap:6px; padding-top:2px; }
.start-steps h3 { font-size:18px; line-height:1.35; }
.start-steps p { font-size:15px; line-height:1.6; }
.start-download { padding:28px; gap:16px; }
.start-download h2 { font-size:24px; line-height:1.25; }
.start-download > p { font-size:14px; line-height:1.5; }
.start-download button:disabled { opacity:.5; cursor:not-allowed; }
.start-availability { display:flex; flex-direction:column; gap:6px; }
.start-availability > p:first-child { font-size:14px; font-weight:600; }
.start-prompt { padding:24px; display:grid; grid-template-columns:1fr auto; gap:24px; align-items:center; border:1px solid var(--line); border-radius:var(--radius-xl); background:var(--panel); }
.start-prompt > div:first-child { display:flex; flex-direction:column; gap:12px; }
.start-prompt blockquote { padding:0; border:0; font-size:16px; line-height:1.6; }
.start-copy { display:flex; flex-direction:column; gap:8px; }
.start-copy [role="status"]:empty { display:none; }
.start-client { display:flex; flex-direction:column; gap:8px; max-width:840px; font-size:14px; line-height:1.6; }
@media(max-width:767px) {
 .start-page { gap:24px; padding-block:8px 40px; }
 .start-layout { grid-template-columns:1fr; gap:32px; }
 .start-download { order:-1; padding:24px; }
 .start-prompt { grid-template-columns:1fr; gap:20px; padding:24px; }
 .start-copy button { width:100%; }
}
.reference-page { max-width:850px; padding-block:32px 56px; display:flex; flex-direction:column; gap:24px; }
.reference-page section { display:flex; flex-direction:column; gap:12px; }
.reference-page audio { max-width:100%; }
.legal-layout { display:grid; grid-template-columns:220px minmax(0,1fr); gap:64px; padding-block:24px 56px; }
.legal-sidebar { align-self:start; position:sticky; top:24px; }
.legal-links { display:flex; flex-wrap:wrap; gap:8px 24px; }
.legal-links a { display:inline-flex; align-items:center; min-height:44px; font-size:14px; text-decoration:underline; text-underline-offset:4px; }
.legal-footer .legal-links a { text-decoration:none; }
.legal-sidebar .legal-links { flex-direction:column; gap:0; margin-top:16px; }
.legal-links a[aria-current="page"] { color:var(--accent-ink); font-weight:600; }
.legal-document { min-width:0; max-width:760px; display:flex; flex-direction:column; gap:32px; line-height:1.7; overflow-wrap:anywhere; }
.legal-heading { display:flex; flex-direction:column; gap:12px; }
.legal-heading h1 { font-size:clamp(32px,4vw,44px); line-height:1.12; text-align:start; }
.document-meta { display:flex; flex-wrap:wrap; align-items:center; gap:4px 24px; font-size:13px; color:var(--ink-muted); }
.document-meta button { border:0; background:none; color:inherit; padding:0; cursor:pointer; }
.legal-notice { padding:16px 20px; background:var(--accent-tint); border-left:3px solid var(--accent); border-radius:0 8px 8px 0; font-size:14px; line-height:1.6; }
.legal-notice strong { display:block; margin-bottom:4px; }
.document-contents { display:flex; flex-wrap:wrap; gap:0 20px; padding-block:12px; border-block:1px solid var(--line); }
.document-contents a { display:inline-flex; align-items:center; min-height:40px; font-size:13px; color:var(--ink-muted); }
.legal-document section { display:flex; flex-direction:column; gap:12px; scroll-margin-top:24px; }
.legal-document h2 { font-size:24px; line-height:1.3; text-align:start; }
.legal-document h3 { font-size:20px; line-height:1.35; }
.legal-document p a { text-decoration:underline; text-underline-offset:3px; color:var(--accent-ink); }
.legal-footer { border-top:1px solid var(--line); padding-block:24px 40px; display:flex; flex-direction:column; gap:16px; }
.declaration { border-top:1px solid var(--line); padding-top:32px; }
.declaration form,.declaration form > div,.declaration #declaration-review { display:flex; flex-direction:column; gap:8px; }
.declaration label { font-size:14px; font-weight:600; margin-top:12px; }
.declaration input,.declaration select,.declaration textarea { font:inherit; font-size:16px; width:100%; min-width:0; box-sizing:border-box; padding:10px 12px; color:var(--ink); background:var(--panel); border:1px solid var(--line-strong); border-radius:8px; }
.declaration textarea { resize:vertical; }
.declaration button { align-self:flex-start; margin-top:16px; }
.declaration button:disabled { opacity:.55; cursor:not-allowed; }
.declaration-actions { display:flex; flex-wrap:wrap; gap:12px; }
#declaration-text { font:inherit; white-space:pre-wrap; overflow-wrap:anywhere; padding:20px; border:1px solid var(--line); border-radius:8px; background:var(--panel); }
.legal-body :focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
@media(max-width:1000px) { .primary-nav { gap:16px; } }
@media(max-width:767px) {
 .container { width:calc(100% - 32px); }
 .site-header { min-height:80px; flex-wrap:wrap; gap:0 12px; }
 .site-header .brand img { width:130px; height:auto; }
 .site-header .brand-pro img { width:168px; }
 .primary-nav { order:3; width:100%; justify-content:space-between; border-top:1px solid var(--line); gap:8px; font-size:12px; }
 .header-controls { gap:4px; }
 .locale-link { padding-inline:4px; min-width:30px; justify-content:center; }
 .review-bar span { max-width:185px; text-align:end; line-height:14px; }
 .hero { --hero-group-space:24px; --hero-edge-space:40px; --hero-label-space:20px; }
 .hero h1 { font-size:clamp(34px,8.5vw,48px); line-height:1.08; }
 .hero-lead { font-size:18px; }
 .film-frame video { aspect-ratio:40/41; }
 .sound-cover-copy { display:flex; flex-direction:column; top:24px; left:16px; right:16px; gap:10px; text-align:center; }
 .sound-cover-play { width:64px; height:64px; margin-bottom:2px; }
 .sound-cover-play .mf-icon { width:26px; height:26px; }
 .sound-cover-title { max-width:300px; font-size:24px; }
 .sound-cover-subtitle { font-size:14px; }
 .sound-cover-wave { top:68%; height:20%; }
 .client-experience { font-size:13px; }
 .client-experience strong { font-size:15px; }
 html { --section-space:64px; }
 .display-l { font-size:32px; line-height:1.15; }
 .feature-grid,.instrument-grid,.pricing-grid,.compatibility,.faq-section { grid-template-columns:1fr; gap:24px; }
 .compatibility { margin-top:40px; }
 .closing { padding:24px; }
 .site-footer { flex-direction:column; gap:20px; }
 .site-footer > div:last-child { text-align:start; align-self:flex-start; }
 .site-footer > div:last-child nav { justify-content:flex-start; }
 .legal-layout { grid-template-columns:1fr; gap:24px; padding-top:8px; }
 .legal-sidebar { position:static; }
 .legal-sidebar .legal-links { flex-direction:row; gap:0 20px; margin-top:8px; padding-bottom:16px; border-bottom:1px solid var(--line); }
 .legal-document { gap:24px; }
}
@media(max-width:359px) { .header-controls { gap:0; } .site-header .brand img { width:110px; } .site-header .brand-pro img { width:142px; } }
@media print { .review-bar,.header-controls,dialog,.film-controls { display:none !important; } }
@media print {
 .legal-body { background:white !important; color:black !important; }
 .legal-body .site-header,.legal-sidebar,.legal-footer,.document-contents,.print-document,.declaration-actions,.declaration button,.declaration form { display:none !important; }
 .legal-layout { display:block; width:100%; padding:0; }
 .legal-document { max-width:none; font-size:11pt; gap:18pt; }
 .legal-document h2 { break-after:avoid; }
 .legal-document a { color:black !important; }
 .legal-notice,#declaration-text { background:white !important; border:1px solid #888; }
}

.client-experience a { text-decoration:underline; text-underline-offset:3px; }

/* Sound sources, deeper preset support, then a single roadmap statement. */
.sound-sources { display:grid; grid-template-columns:1fr 1fr; gap:40px; margin-top:32px; }
.sound-source { display:flex; flex-direction:column; gap:12px; padding-block:24px; border-block:1px solid var(--line); }
.sound-source h3,.preset-support > h3 { font-size:26px; line-height:1.25; }
.sound-source p { font-size:16px; line-height:1.6; }
.source-footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-top:auto; padding-top:12px; }
.source-footer .vst-logo { width:64px; }
.preset-support { margin-top:40px; }
.preset-support > p { margin-top:8px; max-width:720px; }
.site-footer .text-link { text-decoration:none; color:var(--ink-muted); }
.site-footer a:hover,.legal-links a:hover { color:var(--accent-ink); }
.site-footer a:focus-visible,.legal-links a:focus-visible { outline:2px solid var(--accent); outline-offset:4px; border-radius:3px; }
/* Compatibility is a readable reference, separate from the landing page. */
.compatibility-page { max-width:1040px; display:flex; flex-direction:column; gap:32px; padding-block:8px 64px; }
.compat-nav { display:flex; flex-wrap:wrap; gap:8px 24px; padding-block:12px; border-block:1px solid var(--line); }
.compat-nav a { display:inline-flex; align-items:center; min-height:40px; font-size:14px; color:var(--accent-ink); }
.compat-detail { display:flex; flex-direction:column; gap:16px; padding-top:24px; scroll-margin-top:24px; }
.compat-detail h2 { font-size:30px; line-height:1.2; }
.compat-detail > p { max-width:800px; color:var(--ink-muted); }
.compat-subtitle { margin-top:16px; font-size:22px; }
.compat-presets { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.compat-presets article { padding:24px; gap:12px; scroll-margin-top:24px; }
.format-table { width:100%; border-collapse:collapse; font-size:15px; line-height:1.6; text-align:start; }
.format-table th,.format-table td { padding:16px; border-bottom:1px solid var(--line); vertical-align:top; text-align:start; }
.format-table thead { color:var(--ink-muted); font-size:13px; }
.format-table tbody th { white-space:nowrap; }
.format-table code { font-size:13px; overflow-wrap:anywhere; }
.compat-notes { display:flex; flex-direction:column; gap:24px; margin-top:8px; max-width:800px; }
.compat-notes article { display:flex; flex-direction:column; gap:8px; }
.compat-notes h3 { font-size:18px; }
.compat-notes p { color:var(--ink-muted); }
.file-formats { display:flex; flex-direction:column; gap:16px; margin:0; }
.file-formats > div { display:grid; grid-template-columns:180px 1fr; gap:24px; }
.file-formats dt { font-weight:600; }
.file-formats dd { margin:0; color:var(--ink-muted); }
@media(max-width:767px) {
 .sound-sources,.compat-presets { grid-template-columns:1fr; gap:24px; }
 .sound-source + .sound-source { border-top:0; padding-top:0; }
 .preset-support { margin-top:32px; }
 .compatibility-page { gap:24px; padding-bottom:40px; }
 .format-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
 .format-table,.format-table tbody,.format-table tr,.format-table th,.format-table td { display:block; }
 .format-table tr { padding-block:16px; border-bottom:1px solid var(--line); }
 .format-table th,.format-table td { padding:4px 0; border:0; }
 .file-formats > div { grid-template-columns:1fr; gap:4px; }
}

/* Waveforms come from the supplied demo takes, not an invented DAW view. */
.workflow-proof { margin:32px 0 0; padding:28px; border:1px solid var(--line); border-radius:var(--radius-xl); background:var(--panel); }
.workflow-proof-stages { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.workflow-proof-stage { min-width:0; display:grid; grid-template-rows:subgrid; grid-row:span 5; gap:12px; }
.workflow-proof-stage h3 { font-size:18px; line-height:1.4; }
.workflow-proof-stage svg { display:block; width:100%; height:72px; fill:var(--accent); }
.workflow-proof-stage p { font-size:14px; color:var(--ink-muted); }
.workflow-proof-stage .workflow-source { font-size:13px; }
.workflow-proof-stage .workflow-description { line-height:1.65; }
.workflow-proof figcaption { margin-top:20px; font-size:14px; line-height:1.5; color:var(--ink-muted); }
@media(max-width:767px) { .workflow-proof { padding:24px; } .workflow-proof-stages { grid-template-columns:1fr; gap:24px; } .workflow-proof-stage svg { height:56px; } }