/* Existing visual world, precise reading and working surfaces. No panel skin. */
.mala-site{--mala-gap:24px;--mala-reading:66ch;line-height:1.5}
.mala-site:not(.is-running) .mala-mark{display:none!important}
.mala-site:not(.is-running) :is(input,textarea,select){max-width:100%;font-size:16px;line-height:1.45}
.mala-site:not(.is-running) :is(input,select):not([type=range]):not([type=checkbox]):not([type=radio]):not([type=color]){min-height:48px}
.mala-site:not(.is-running) textarea{padding:12px 14px;resize:vertical}
.mala-site .mala-footer__links a,.mala-runtime .footer a{display:inline-flex;align-items:center;min-height:44px}
.mala-site .mala-footer,.mala-runtime .footer{gap:16px 32px;align-items:center;line-height:1.5}
.mala-runtime:not(.mala-home) .step{width:min(100%,1400px);padding:44px 48px 56px;min-height:calc(100svh - 180px)}
.mala-runtime:not(.mala-home) .step>h2{max-width:100%;font-size:64px;line-height:1.06;letter-spacing:-.025em;margin-bottom:20px;text-wrap:balance}
.mala-runtime:not(.mala-home) .step>.mala-lead{font:400 19px/1.6 var(--mala-sans);max-width:var(--mala-reading);margin-bottom:36px}
.mala-runtime:not(.mala-home) .choice{min-width:0;min-height:132px;padding:18px 8px;gap:16px}
.mala-runtime:not(.mala-home) .choice strong{font-size:38px;line-height:1.15;overflow-wrap:break-word}
.mala-runtime:not(.mala-home) .context-note{font:400 18px/1.55 var(--mala-sans);max-width:65ch;min-height:84px}
.mala-runtime .step-nav{gap:20px;margin-top:28px;min-height:52px}
.mala-runtime .step-nav :is(button,a){min-height:48px;line-height:1.4;font-family:var(--mala-sans);font-size:16px}
.mala-runtime .mala-runtime-tools{max-width:1400px;width:100%;margin-inline:auto;gap:24px;padding-inline:48px}
.mala-runtime [data-view=settings]>.mala-settings-intro{max-width:72ch;margin-bottom:32px}
.mala-settings-body{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,1fr);gap:0 48px;align-items:start}
.mala-settings-selection{min-width:0;grid-column:2;grid-row:1}.mala-settings-visual{min-width:0;position:sticky;top:24px;grid-column:1;grid-row:1 / 3}
.mala-settings-controls{min-width:0;grid-column:2;grid-row:2}
.mala-runtime .mala-controls-heading{font:600 18px/1.4 var(--mala-sans);margin:0 0 12px}
.mala-runtime .mala-mode-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 20px;margin:0 0 28px}
.mala-runtime .mala-mode{display:grid;grid-template-columns:62px minmax(0,1fr);align-items:center;justify-items:start;gap:10px;min-height:68px;padding:8px 12px 8px 0;text-align:left;color:var(--mala-ink)}
.mala-runtime .mala-mode .mala-mode-label{font:450 16px/1.35 var(--mala-sans);text-align:left;min-width:0;max-width:100%;overflow-wrap:anywhere}
.mala-runtime .mala-mode .mala-mode-icon{height:36px;width:62px;gap:3px;justify-content:flex-start}
.mala-runtime .mala-mode-icon svg{width:42px;height:32px;filter:none;stroke-width:2.4;stroke:currentColor}
.mala-runtime .mala-mode-icon:has(.mala-combo-plus) svg{width:25px;height:27px}
.mala-runtime .mala-combo-plus{font-size:17px}
.mala-runtime .mala-mode[aria-checked=true]{color:var(--mala-ink)}
.mala-runtime .mala-mode[aria-checked=true] .mala-mode-label{font-weight:750;font-style:normal}
.mala-runtime .mala-mode[aria-checked=true] .mala-mode-icon{color:var(--mala-ink)}
.mala-runtime .mala-mode::before{display:none}
.mala-mode-selected{display:none;position:absolute;right:0;top:2px;width:18px;height:18px;color:var(--mala-ink)}
.mala-mode-selected svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.mala-mode[aria-checked=true] .mala-mode-selected{display:block}
.mala-runtime .mala-preview{margin:0;padding:0;overflow:visible}
.mala-runtime .mala-preview canvas.mala-vhs{width:100%;height:auto;aspect-ratio:4/3;object-position:center;min-height:240px}
.mala-runtime .mala-preview-actions{position:static;inset:auto;display:flex;gap:8px 20px;flex-wrap:wrap;margin-top:12px}
.mala-runtime .mala-preview-actions button{color:var(--mala-ink);text-shadow:none;font:500 15px/1.4 var(--mala-sans);padding:8px 0;min-height:44px}
.mala-runtime .mala-preview figcaption{margin-top:10px;padding:0;min-height:72px;font:400 15px/1.55 var(--mala-sans);max-width:60ch}
.mala-runtime .mala-range-grid{grid-template-columns:1fr;gap:24px;margin:0}
.mala-runtime .mala-range-head{align-items:center;min-height:48px;gap:12px}
.mala-runtime .mala-range-head>label{font:500 17px/1.4 var(--mala-sans);white-space:nowrap}
.mala-runtime .mala-range-head>output{font:600 23px/1.2 var(--mala-sans)}
.mala-runtime .mala-range .value-input{flex:0 0 auto!important;width:84px!important;max-width:84px;min-height:44px!important;font:600 23px/1.2 var(--mala-sans)!important;padding:4px 7px!important}
.mala-runtime .mala-value{font-size:14px;gap:6px}
.mala-runtime .range-scale,.mala-runtime .mala-control-note{font:400 14px/1.5 var(--mala-sans)}
.mala-runtime .mala-notice-slot{min-height:64px;padding-top:12px}
.mala-runtime .mala-advanced{margin:12px 0}
.mala-runtime .mala-advanced>summary{font:500 16px/1.5 var(--mala-sans);min-height:44px}
.mala-runtime .fields{gap:24px;margin:20px 0}
.mala-runtime .fields select{width:100%;font-size:15px}
.mala-set-estimate{display:block;min-height:52px;padding-block:12px;font:600 16px/1.5 var(--mala-sans);font-variant-numeric:tabular-nums;overflow-anchor:none}
.mala-runtime .mala-settings-controls>.step-nav{margin-top:12px}
.mala-runtime .mala-settings-body :is(.mala-range,.mala-set-estimate,.mala-settings-controls){overflow-anchor:none}
.mala-runtime #baselineChoices{max-width:900px;gap:8px}
.mala-runtime #baselineChoices button{min-height:48px;font-family:var(--mala-sans);font-size:19px}
.mala-runtime #baselineTitle{font-size:34px;line-height:1.2;max-width:30ch}
.mala-runtime :is(#baselinePrompt,#ratingRuleHelp,#baselineAnchors,#baselineStatus){font:400 17px/1.6 var(--mala-sans);max-width:65ch}
.mala-runtime .check{min-height:44px}
.mala-runtime dialog:not(#flowDialog){width:min(840px,calc(100vw - 32px));padding:32px}
.mala-runtime dialog:not(#flowDialog) h2{font-size:42px;line-height:1.1}
.mala-runtime dialog:not(#flowDialog) p{font:400 18px/1.6 var(--mala-sans)}
@media(max-width:1020px){.mala-runtime:not(.mala-home) .step{padding:32px 28px 48px}.mala-runtime:not(.mala-home) .step>h2{font-size:52px}.mala-settings-body{gap:28px;grid-template-columns:minmax(0,.9fr) minmax(340px,1fr)}.mala-runtime .mala-runtime-tools{padding-inline:28px}.mala-runtime .mala-mode{grid-template-columns:46px 1fr;gap:6px}.mala-runtime .mala-mode .mala-mode-icon{width:46px}.mala-runtime .mala-mode-icon svg{width:34px}.mala-runtime .mala-mode-icon:has(.mala-combo-plus) svg{width:19px}}
@media(max-width:780px){.mala-settings-body{grid-template-columns:1fr;gap:28px}.mala-settings-selection,.mala-settings-visual,.mala-settings-controls{grid-row:auto;grid-column:auto}.mala-settings-visual{position:static}.mala-runtime .mala-preview canvas.mala-vhs{aspect-ratio:16/10;min-height:220px}.mala-runtime .mala-preview figcaption{min-height:0}.mala-runtime .mala-mode-choices{margin-bottom:0}}
@media(max-width:650px){.mala-runtime:not(.mala-home) .step{padding:28px 20px 40px}.mala-runtime:not(.mala-home) .step>h2{font-size:42px;line-height:1.08;margin-bottom:16px}.mala-runtime:not(.mala-home) .step>.mala-lead{font-size:17px;line-height:1.55;margin-bottom:28px}.mala-runtime .choices{grid-template-columns:1fr;gap:12px}.mala-runtime:not(.mala-home) .choice{min-height:104px;padding-block:16px}.mala-runtime:not(.mala-home) .choice strong{font-size:32px}.mala-runtime .mala-runtime-tools{padding-inline:20px;gap:20px;flex-wrap:wrap}.mala-runtime .mala-mode .mala-mode-label{font-size:15px}.mala-runtime .mala-mode{padding-right:6px;min-height:72px;grid-template-columns:42px minmax(0,1fr)}.mala-runtime .mala-mode-choices{gap:8px 16px}.mala-runtime .mala-preview{margin:0}.mala-runtime .mala-preview figcaption,.mala-runtime .mala-preview-actions{padding-inline:0}.mala-runtime #baselineChoices{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px 8px}.mala-runtime #baselineChoices button{min-height:48px;min-width:40px}.mala-runtime .fields{grid-template-columns:1fr}.mala-runtime dialog:not(#flowDialog){padding:24px}.mala-runtime dialog:not(#flowDialog) h2{font-size:36px}}
@media(max-width:360px){.mala-runtime .mala-mode-choices{gap:8px 12px}.mala-runtime .mala-mode{grid-template-columns:1fr;gap:4px;min-height:88px;justify-items:start}.mala-runtime .mala-mode .mala-mode-label{font-size:15px}.mala-runtime .mala-mode .mala-mode-icon{width:62px}.mala-runtime .mala-mode-icon:has(.mala-combo-plus) svg{width:24px}.mala-runtime .mala-range-head>label{font-size:16px}}

/* Reserve the conditional sequence explanation so count changes cannot move a focused slider. */
.mala-sequence-slot{min-height:96px;overflow-anchor:none;padding-top:12px}
.mala-runtime .mala-sequence-slot #sequenceSummary{margin:0;font:400 16px/1.5 var(--mala-sans);max-width:60ch}
.mala-runtime .mala-settings-body :is(.mala-settings-selection,.mala-settings-visual){overflow-anchor:none}
@media(max-width:360px){.mala-runtime #baselineChoices{grid-template-columns:repeat(5,minmax(0,1fr))}.mala-runtime #baselineChoices button{min-width:44px}.mala-sequence-slot{min-height:112px}}