/* Hallmark · theme: custom · idea: the approved Dengue identity presents its real vocal plugin · posture: Restrained · imagery: illustrative montage from real plugin and FL Studio captures · scope: existing brand extension */
/* Critique: keep the approved montage and seven vocal rows; enable the verified release download, describe Master separately, and keep source/licences reachable. */
/* Hallmark · waive 79 · approved product hero with genuine montage and release action · preserve its composition instead of adding invented proof to fill 191px. */
/* Hallmark · waive 77 · seven vocal rows plus Master, installation, privacy and source/licences are the complete product scope · retain legible FL Studio instructions and concise Master Dengue information without invented proof or filler. */
/* Hallmark · waive 59 · the optional source/licence disclosure is a supporting footer control · keep the Dengue Voz source links beside their AGPL-3.0-or-later notice without empty 120px bands. */
/* Hallmark · exception 58 · current render reports FAIL: 106 words from y550 across caption/effects, reduced from113 in0.2.50; retain the approved composition under the user's scoped preservation instruction. */
/* Hallmark · hero-review: historical approved hero; not rerun before the existing below-fold content. */
/* Hallmark · finish-review: subagent fix · obsolete availability introduction and stale review records resolved; same five screenshots recaptured for final evidence. */
:root { color-scheme: dark; --bg: #0c0e0c; --panel: #161a14; --raised: #25291f; --ink: #f0eadb; --muted: #aaa596; --rule: #3c4031; --accent: #c0c88b; --accent-ink: #11130e; --clear: transparent; --font-body: "Segoe UI", Arial, sans-serif; --font-display: "Arial Narrow", "Roboto Condensed", "Segoe UI", sans-serif; --space-xs: 8px; --space-sm: 12px; --space-md: 16px; --space-lg: 24px; --space-xl: 40px; --space-2xl: 64px; --gutter: clamp(16px, 4vw, 64px); }
* { box-sizing: border-box; }
html, body { margin: 0; overflow-x: clip; }
html { scroll-behavior: smooth; scroll-padding-top: var(--space-lg); scrollbar-color: var(--muted) var(--bg); scrollbar-width: auto; }
body { background: var(--bg); color: var(--ink); font: 400 1rem/1.65 var(--font-body); font-synthesis: none; }
::selection { background: var(--accent); color: var(--accent-ink); }
* { scrollbar-color: var(--muted) var(--bg); }
::-webkit-scrollbar { width: 14px; height: 14px; }
::-webkit-scrollbar-track, ::-webkit-scrollbar-corner { background: var(--bg); }
::-webkit-scrollbar-thumb { background: var(--muted); border: 3px solid var(--bg); border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: var(--accent); }
::-webkit-scrollbar-thumb:active { background: var(--ink); }
::-webkit-scrollbar-thumb:disabled { background: var(--rule); }
a { color: inherit; text-underline-offset: 5px; }
a:hover { color: var(--accent); }
a:active { color: var(--muted); }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 5px; }
img { max-width: 100%; height: auto; display: block; }
.page-header, main, footer { width: min(100% - 2 * var(--gutter), 1376px); margin-inline: auto; }
.page-header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-lg); padding-block: var(--space-md); }
.page-header > a { width: 112px; flex-shrink: 0; }
.header-actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: var(--space-lg); }
.header-actions > a, summary { min-height: 44px; display: inline-flex; align-items: center; }
.language-menu { position: relative; }
summary { cursor: pointer; font-size: .875rem; }
.language-menu nav { position: absolute; z-index: 10; inset-inline-end: 0; top: 100%; background: var(--panel); border: 1px solid var(--rule); padding: var(--space-xs); min-width: 180px; max-height: 65dvh; overflow-y: auto; }
.language-menu nav a { display: block; padding: var(--space-xs) var(--space-md); min-height: 44px; text-decoration: none; }
.language-menu nav a[aria-current] { color: var(--accent); background: var(--raised); }
.skip { position: fixed; inset-inline-start: var(--space-md); top: var(--space-md); transform: translateY(-180%); background: var(--accent); color: var(--accent-ink); padding: var(--space-sm) var(--space-md); z-index: 20; }
.skip:focus-visible { transform: none; }
.plugin-hero { display: grid; grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr); align-items: center; gap: var(--space-xl); padding-block: var(--space-xl) var(--space-2xl); }
h1, h2 { font-family: var(--font-display); min-width: 0; overflow-wrap: break-word; text-wrap: balance; margin: 0; line-height: 1.12; font-weight: 800; }
h1 { font-size: clamp(3rem, 6vw, 5.75rem); letter-spacing: -.04em; }
h2 { font-size: clamp(2rem, 3vw, 3rem); max-width: 18ch; }
.lead { font-size: clamp(1.25rem, 1.8vw, 1.65rem); max-width: 28ch; margin-block: var(--space-lg); }
.hero-actions { display: flex; align-items: center; gap: var(--space-lg); flex-wrap: wrap; }
button { min-height: 48px; padding: var(--space-sm) var(--space-lg); border: 1px solid var(--rule); border-radius: 4px; background: var(--raised); color: var(--muted); font: 400 1rem/1.4 var(--font-body); }
button:disabled { cursor: not-allowed; opacity: .8; }
.hero-actions a { display: inline-flex; align-items: center; min-height: 48px; white-space: nowrap; }
#availability, .platform, figcaption { color: var(--muted); font-size: .875rem; }
#availability { max-width: 40ch; }
.platform { display: flex; gap: var(--space-lg); }
figure { margin: 0; min-width: 0; }
.plugin-visual img { width: 100%; }
figcaption { margin-top: var(--space-md); }
.effects { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: var(--space-xl); border-top: 1px solid var(--rule); padding-block: var(--space-2xl); }
dl { margin: 0; }
dl > div { display: grid; grid-template-columns: minmax(0, .6fr) minmax(0, 1.4fr); gap: var(--space-lg); padding-block: var(--space-lg); border-bottom: 1px solid var(--rule); }
dl > div:first-child { padding-top: 0; }
dt { font-weight: 700; font-size: 1.25rem; }
dd { margin: 0; color: var(--muted); }
.installation { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: var(--space-xl); padding-block: var(--space-2xl); }
.installation > div p { max-width: 65ch; color: var(--muted); }
ol { margin: 0; padding-inline-start: var(--space-lg); }
li { padding-inline-start: var(--space-xs); margin-bottom: var(--space-lg); }
code { overflow-wrap: anywhere; color: var(--accent); font-size: .9em; }
.privacy { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: var(--space-xl); border-top: 1px solid var(--rule); padding-block: var(--space-2xl); }
.privacy p { margin: 0; max-width: 64ch; color: var(--muted); }
.translation-notice { color: var(--muted); max-width: 75ch; font-size: .875rem; }
footer { display: flex; flex-wrap: wrap; gap: var(--space-lg); align-items: center; justify-content: space-between; padding-block: var(--space-xl); border-top: 1px solid var(--rule); }
footer > img { width: 100px; }
footer .approval { width: 220px; }
@media (max-width: 900px) { .plugin-hero, .effects, .installation, .privacy { grid-template-columns: minmax(0, 1fr); } .plugin-hero { gap: var(--space-lg); } .lead { max-width: 38ch; } .plugin-visual { max-width: 920px; } }
@media (max-width: 480px) { .page-header { align-items: flex-start; } .page-header > a { width: 80px; } .header-actions { gap: 0 var(--space-md); } .plugin-hero { padding-top: var(--space-lg); } dl > div { grid-template-columns: minmax(0, 1fr); gap: var(--space-xs); } footer .approval { width: 180px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
@media (forced-colors: active) { * { scrollbar-color: auto; } button:disabled { opacity: 1; border-style: dashed; } }

.studio-credit { max-width: 48ch; margin: 0; font-size: 1rem; overflow-wrap: anywhere; }

.language-menu:not([open]) > nav { display: none; }

.hero-actions .download { white-space: normal; max-width: 100%; gap: var(--space-sm); padding: var(--space-sm) var(--space-md); border: 1px solid var(--rule); border-radius: 4px; background: var(--accent); color: var(--accent-ink); text-decoration: none; line-height: 1.4; }
.download svg { flex-shrink: 0; }
.download span { min-width: 0; overflow-wrap: anywhere; }
.hero-actions .download:hover { background: var(--ink); }
.hero-actions .download:active { background: var(--muted); }
.master-mode p { margin: 0; max-width: 58ch; color: var(--muted); }
.release-source { border-top: 1px solid var(--rule); padding-block: var(--space-lg); }
.release-source ul { margin-block: var(--space-md) 0; padding-inline-start: var(--space-lg); }
.release-source a { display: inline-flex; min-height: 44px; align-items: center; max-width: 100%; overflow-wrap: anywhere; }
body { padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); }

.installation ol { list-style: none; padding: 0; }
.installation li { padding: 0; margin: 0; border-bottom: 1px solid var(--rule); }
.install-step summary { display: flex; justify-content: space-between; gap: var(--space-md); width: 100%; padding-block: var(--space-lg); font-size: 1.1rem; }
.install-step summary::after { content: "+"; flex-shrink: 0; color: var(--accent); }
.install-step[open] > summary::after { content: "−"; }
.step-copy { padding-bottom: var(--space-lg); line-height: 1.8; }
.install-step:not([open]) > .step-copy { display: none; }


.installation { display: block; max-width: 920px; margin-inline: auto; }
.installation > div p { max-width: 65ch; }
.installation ol { margin-top: var(--space-xl); }

.language-menu nav { width: min(440px, calc(100dvw - 2 * var(--gutter))); max-width: calc(100dvw - 2 * var(--gutter)); overflow-wrap: anywhere; }

footer > a { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }

footer { padding-block: calc(var(--space-xl) + var(--space-md)); }

.beat-guide { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: var(--space-xl); border-top: 1px solid var(--rule); padding-block: var(--space-2xl); }
.beat-guide p { color: var(--muted); max-width: 65ch; }
.beat-guide p:first-child { margin-top: 0; }
@media (max-width: 900px) { .beat-guide { grid-template-columns: minmax(0, 1fr); } }

.beat-guide ol { list-style: none; padding: 0; }
.beat-guide li { padding: 0; margin: 0; border-bottom: 1px solid var(--rule); }
.platform-guides { display: grid; grid-template-columns: minmax(0,.7fr) minmax(0,1.3fr); gap: var(--space-xl); padding-block: var(--space-2xl); border-top: 1px solid var(--rule); }
.platform-guides > * { min-width: 0; overflow-wrap: anywhere; }
.hero-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: stretch; }
.hero-actions .download { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-sm); white-space: normal; }
.hero-actions > a:last-child { grid-column: 1 / -1; }
@media (max-width: 900px) { .platform-guides { grid-template-columns: minmax(0,1fr); } }
@media (max-width: 480px) { .hero-actions { grid-template-columns: minmax(0,1fr); } }
.release-source summary { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); }
.release-source summary::after { content: "+"; color: var(--accent); font-weight: 700; flex-shrink: 0; }
.release-source details[open] > summary::after { content: "−"; }