/* One palette, reserved stages, and one quiet gesture per story beat. */
html.dl {
  --ill-ink:var(--delft-night);--ill-blue:#12306A;--ill-mid:#24437E;--ill-denim:#3F5F9E;
  --ill-pale:#A7B6D3;--ill-mist:#E6EAF3;--ill-paper:#F7F1E3;--ill-sand:#EEE5D1;
  --ill-stone:#E4D6B8;--ill-edge:#D3C19A;--ill-terra:var(--terra);--ill-ochre:var(--ochre);
  --ill-light:var(--ochre-050);--ill-green:#5B6E4E;--ill-leaf:#3E5134;
  --ill-his:#B77D58;--ill-hers:#C9936D;--ill-broker:#986244;
}
.ill[data-state="filled"] .ill__stage{border-radius:2px}
.ill[data-state="filled"] .ill__layer{inset:-3%}
.ill__scene{position:absolute;inset:0;opacity:0;transition:opacity var(--m-card,350ms) var(--m-ease-enter,cubic-bezier(.2,0,0,1))}
.ill__scene:first-child{opacity:1}
.p21held[data-step] .ill__scene{opacity:0}
.p21held[data-step="1"] [data-ill-step="1"],.p21held[data-step="2"] [data-ill-step="2"],
.p21held[data-step="3"] [data-ill-step="3"],.p21held[data-step="4"] [data-ill-step="4"],
.p21held[data-step="5"] [data-ill-step="5"],.p21held[data-step="6"] [data-ill-step="6"]{opacity:1}
.ill-enter .ill__layer{animation:ill-fill var(--m-enter,240ms) ease-out both}
.ill-enter .ill__set{animation-delay:140ms}.ill-enter .ill__cast{animation-delay:280ms}.ill-enter .ill__fore{animation-delay:420ms}
.ill-enter .ill__set svg>use,.ill-enter .ill__cast svg>use{animation:ill-ink 1.2s var(--m-ease-enter,cubic-bezier(.2,0,0,1)) both;animation-delay:140ms}
.ill-enter .ill__cast svg>use{animation-delay:280ms}
[data-ill-gesture]{transform-box:fill-box;transform-origin:center}
.ill-gesture [data-ill-gesture="glow"]{animation:ill-glow 1400ms var(--m-ease-enter,cubic-bezier(.2,0,0,1)) both}
.ill-gesture [data-ill-gesture="light"]{animation:ill-light 1200ms ease-in-out both}
.ill-gesture [data-ill-gesture="page"]{animation:ill-page 1200ms var(--m-ease-enter,cubic-bezier(.2,0,0,1)) both;transform-origin:left center}
.ill-gesture [data-ill-gesture="key"]{animation:ill-key 1200ms var(--m-ease-enter,cubic-bezier(.2,0,0,1)) both;transform-origin:top center}
.ill-paused *{animation-play-state:paused!important}
@keyframes ill-ink{from{stroke-dasharray:1000;stroke-dashoffset:1000;fill-opacity:0}25%{fill-opacity:1}to{stroke-dasharray:1000;stroke-dashoffset:0;fill-opacity:1}}
@keyframes ill-fill{from{opacity:0}to{opacity:1}}
@keyframes ill-glow{0%,100%{transform:scale(1);opacity:1}45%{transform:scale(1.14);opacity:.75}}
@keyframes ill-light{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes ill-page{0%,100%{transform:rotate(0)}40%{transform:rotate(-5deg)}}
@keyframes ill-key{0%,100%{transform:rotate(0)}50%{transform:rotate(13deg)}}
@media(max-width:899.98px){
 .ill--hero{inline-size:min(100%,calc(31svh * 5 / 4));justify-self:center}
 .ill--side,.ill--close{inline-size:min(100%,calc(30svh * 4 / 3));justify-self:center}
}
@media(prefers-reduced-motion:reduce){
 .ill[data-state="filled"] .ill__layer{transform:none!important}
 .ill[data-state="filled"] *{animation:none!important;stroke-dashoffset:0!important}
 .ill__scene{transition:none}
}