.visual-step .kicker{color:var(--lav)}
.visual-step .kicker b{background:var(--lav)}
.visual-filters .filter[aria-pressed=true]{background:var(--lav);border-color:var(--lav);color:#191426}
.visual-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:12px}
.visual-option{display:flex;align-items:center;gap:7px;position:relative;text-align:start;color:var(--ink);padding:8px;min-height:64px;background:#232126;border:1px solid #45414c;border-radius:4px}
.visual-option[aria-pressed=true],.visual-option:hover{border-color:var(--lav);background:#2c2735}
.visual-option b,.visual-option small{display:block;line-height:1.3}
.visual-option b{font-size:13px}.visual-option small{font:400 10px/1.3 var(--mono);color:#c5becb;margin-top:4px;text-align:right}
.visual-glyph{display:grid;place-items:center;flex:none;width:28px;height:28px;border:1px solid #555064;background:#302842;color:#e6d7ff;border-radius:3px;font:500 15px/1 var(--mono)}
.visual-added{position:absolute;bottom:2px;left:4px;color:var(--lime);font:600 11px/1 var(--mono)}
.visual-monitor{border:1px solid #50495d;background:#1a171f;border-radius:5px;overflow:hidden}
.visual-monitorbar,.visual-playbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 12px;background:#292430;color:#ddd3f3;font:500 11px/1.4 var(--mono)}
.visual-monitorbar>span:first-child{display:flex;align-items:center;gap:8px}
.visual-monitorbar i{width:6px;height:6px;border-radius:50%;background:var(--lav);box-shadow:0 0 10px #b3a0ff70}
.visual-stage{display:block;width:100%;height:auto;aspect-ratio:2;background:radial-gradient(ellipse at 65% 25%,#252033,transparent 63%),linear-gradient(90deg,#c6b3fd10 1px,transparent 1px) 0 0/24px 24px,linear-gradient(#c6b3fd10 1px,transparent 1px) 0 0/24px 24px,#141318;stroke:none}
.visual-stage text{fill:#f0ecfb;font-family:var(--mono);stroke:none}
.visual-stage .v-micro{font-size:12px;letter-spacing:.08em;fill:#bcb2ce}.visual-stage .v-label{font-size:16px;font-weight:600}.visual-stage .v-big{font:700 36px/1 var(--display)}
.visual-stage .v-dark{fill:#1a2010}.visual-stage .v-green{fill:var(--lime)}
.visual-stage .v-panel{fill:#252232;stroke:#50485f;stroke-width:1}.visual-stage .v-app{fill:#1c1a23;stroke:#665e76;stroke-width:1.2}
.visual-stage .v-line,.visual-stage .v-signal,.visual-stage .v-purple,.visual-stage .v-outline{fill:none;stroke:#615970;stroke-width:1.5}
.visual-stage .v-signal,.visual-stage .v-outline{stroke:var(--lime);stroke-width:2}
.visual-stage .v-purple{stroke:#bba4ff;stroke-width:2}.visual-stage .v-purple-fill{fill:#8c78c1}.visual-stage .v-rose{fill:#e69798}.visual-stage .v-muted{fill:#6b6379}
.visual-stage .v-accent{fill:var(--lime)}.visual-stage .v-dim{fill:#08070dc9}.visual-stage .v-field{fill:#352d48}.visual-stage .v-land{fill:#aa795c}
.visual-playbar{display:grid;grid-template-columns:auto 1fr auto;min-height:48px;border-top:1px solid #50495d}
.visual-play{color:var(--ink);background:#1c1922;border:1px solid #675d76;border-radius:3px;min-height:32px;padding:4px 9px;font:600 12px/1.3 var(--arabic);white-space:nowrap}
.visual-play:hover{border-color:var(--lav);color:var(--lav)}
.visual-playbar input{width:100%;min-width:40px;margin:0;accent-color:var(--lav);cursor:ew-resize}
.visual-playbar input:focus-visible{outline:2px solid var(--lime);outline-offset:3px}
.visual-playbar output{min-width:48px}.visual-caption{position:static;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px;border:0;margin:0;color:var(--ink);font:inherit;letter-spacing:normal}
.visual-caption h3{font-size:18px;line-height:1.3;margin:0 0 3px}.visual-caption p{color:var(--muted);font-size:13px;line-height:1.45}
.visual-add{flex:none;min-height:42px;padding:6px 10px;font-size:13px;background:var(--lav)}
.visual-add:hover{background:#d9ceff}.visual-add[aria-pressed=true]{background:#252333;border-color:#a599d9;color:#e9e1ff}
.visual-add svg{width:16px;height:16px}
.visual-settings{margin-top:8px}.visual-settings textarea{min-height:64px}
.visual-method{border:1px solid var(--line);background:#202023;border-radius:4px;margin-top:15px;font-size:13px;color:var(--muted)}
.visual-method summary{cursor:pointer;color:var(--ink);padding:8px 12px;font-weight:600}
.visual-method summary:focus-visible{outline:2px solid var(--lime);outline-offset:2px}
.visual-method div{padding:2px 12px 12px}.visual-method ul{margin:6px 0 0;padding-inline-start:20px}.visual-method a{color:var(--lav);text-decoration:underline;text-underline-offset:3px}
.selection-meta .chosen{max-height:85px;overflow:auto}
@media(max-width:1000px){.visual-option{display:grid;grid-template-columns:auto minmax(0,1fr);padding:7px}.visual-glyph{width:23px;height:23px}}
@media(max-width:790px){.visual-option b{font-size:12px}.visual-option small{font-size:9px}.visual-caption{flex-wrap:wrap}.visual-caption .visual-add{width:100%}.top-inner nav{gap:16px}}
@media(max-width:400px){.visual-glyph{display:none}.visual-option{display:block;min-height:58px}.visual-monitorbar{font-size:9px}.visual-playbar{gap:5px;padding-inline:8px}}

.filmrail{grid-template-columns:repeat(5,minmax(0,1fr))}.filmrail i{left:calc(20% - 4px)}

@media(max-width:660px){.filmrail{font-size:8px}.filmrail span{padding-left:3px}}
.visual-stage{direction:ltr;max-height:310px}
.visual-caption .visual-phase{font-size:11px;color:var(--lav);margin-top:3px}
@media(max-width:660px){
  .top-inner{grid-template-columns:1fr auto 1fr;gap:7px}
  .top-inner nav{display:flex}
  .top-inner nav a:not([href="#visuals"]){display:none}
  .top-inner nav a[href="#visuals"]{font-size:12px;color:var(--lav);white-space:nowrap}
  .header-cta{gap:4px;white-space:nowrap}
}
@media(max-width:355px){.header-cta svg{display:none}}

@media(max-width:355px){.top .brand{font-size:22px;gap:5px}.top .brand svg{width:21px;height:21px}}
.template-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.template-card{--template-ink:#c9b8ff;--template-field:#46385d;display:flex;flex-direction:column;align-items:stretch;min-width:0;padding:0;overflow:hidden;text-align:start;color:var(--ink);background:#211e27;border:1px solid #50495d;border-radius:5px;transition:background .16s,border-color .16s}
.template-card:nth-child(2),.template-card:nth-child(5){--template-ink:#d0ef69;--template-field:#48532d}
.template-card:nth-child(3){--template-ink:#ffae92;--template-field:#693f42}
.template-card:nth-child(4){--template-ink:#8edcd8;--template-field:#28474c}
.template-card:nth-child(6){--template-ink:#f0c4eb;--template-field:#594161}
.template-card:hover,.template-card[aria-pressed=true]{border-color:var(--lav);background:#2d2738}
.template-art{position:relative;display:block;background:radial-gradient(ellipse at 52% 45%,var(--template-field),transparent 82%),repeating-linear-gradient(90deg,#c6b3fd13 0 1px,transparent 1px 18px),#19161f;border-bottom:1px solid #443c50}
.template-art>svg{display:block;width:100%;height:auto;aspect-ratio:2.56;stroke:none}
.template-art .select-mark{position:absolute;top:7px;right:7px;width:25px;height:25px}
.template-art .select-mark svg{width:14px;height:14px}
.template-card[aria-pressed=true] .select-mark{background:var(--lav);border-color:var(--lav)}
.t-panel{fill:#211d2a;stroke:var(--template-ink);stroke-opacity:.55}
.t-field{fill:var(--template-field)}
.t-line,.t-accent{fill:none;stroke:#a69ab7;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.t-accent{stroke:var(--template-ink);stroke-width:2.5}
.t-focus{fill:var(--template-ink)}
.t-node{fill:#8978a5}
.t-pointer{fill:#211d2a;stroke:var(--template-ink);stroke-width:1.8;stroke-linejoin:round}
.template-copy{display:block;padding:8px 10px 11px}
.template-copy b,.template-copy small{display:block}
.template-copy b{font-size:16px;line-height:1.35}
.template-copy small{font-size:12px;line-height:1.5;color:#c7c0cc;margin-top:4px}
.template-summary{margin:10px 0;color:#ddd1f6;min-height:20px;font-size:13px}
.visual-custom{background:#201d25;border:1px solid #50495d;border-radius:5px}
.visual-custom>summary{padding:10px 12px;color:#e6dafa;font-size:14px;font-weight:700;cursor:pointer}
.visual-custom>summary:hover{color:var(--ink)}
.visual-custom>summary:focus-visible{outline:2px solid var(--lime);outline-offset:3px}
.visual-custom>summary::marker{color:var(--lav)}
.visual-custom[open]>summary{border-bottom:1px solid #50495d}
.visual-custom-body{padding:12px}
.visual-custom-help{color:var(--muted);font-size:13px;margin-bottom:11px}
@media(max-width:800px){.template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:400px){.template-grid{gap:7px}.template-copy{padding:7px 8px 9px}.template-copy b{font-size:14px}.template-copy small{font-size:11px}.visual-custom-body{padding:8px}}
.visual-tradeoffs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 12px}
.visual-tradeoffs>div{border:1px solid #50495d;border-inline-start:3px solid var(--tradeoff-color);border-radius:4px;padding:8px 11px;background:#24212a}
.visual-benefit{--tradeoff-color:var(--lime)}
.visual-drawback{--tradeoff-color:#ffb59a}
.visual-tradeoffs dt{color:var(--tradeoff-color);font-size:13px;font-weight:700}
.visual-tradeoffs dd{margin:2px 0 0;color:#eee7f3;font-size:13px;line-height:1.5}
@media(max-width:440px){.visual-tradeoffs{grid-template-columns:1fr}}