/* Dalton Consulting · coming-soon placeholder · "Connections" V3 brand
   Space Grotesk Bold (headings) + Courier Prime (body). Palette from the V3 card. */
:root{
  --paper:#F2E8D5; --paper2:#E8DAC0; --cream:#FBF5E9; --line:#CDB995;
  --ink:#2A2119; --glow:#5B5BD6; --ink2:#5B4A39; --rust:#B5532A; --gold:#C08E25; --teal:#2E6B66;
  --f-head:"Space Grotesk","Helvetica Neue",Arial,sans-serif;
  --f-type:"Courier Prime","Courier New",Courier,monospace;
  /* Gleason map watermark strength (home + inquiries). One knob: try .18 to .32. Scrim keeps body text readable over it. */
  --map-opacity:.30; --map-scrim:.78;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;position:relative;min-height:100vh;background:var(--paper);color:var(--ink);font-family:var(--f-type);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
body::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:50;opacity:.10;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScyNDAnIGhlaWdodD0nMjQwJz48ZmlsdGVyIGlkPSduJz48ZmVUdXJidWxlbmNlIHR5cGU9J2ZyYWN0YWxOb2lzZScgYmFzZUZyZXF1ZW5jeT0nLjg1JyBudW1PY3RhdmVzPSczJyBzdGl0Y2hUaWxlcz0nc3RpdGNoJy8+PGZlQ29sb3JNYXRyaXggdmFsdWVzPScwIDAgMCAwIDAuMTYgIDAgMCAwIDAgMC4xMiAgMCAwIDAgMCAwLjA4ICAwIDAgMCAuNTUgMCcvPjwvZmlsdGVyPjxyZWN0IHdpZHRoPScxMDAlJyBoZWlnaHQ9JzEwMCUnIGZpbHRlcj0ndXJsKCNuKScvPjwvc3ZnPg==")}
h1,h2,h3,p,ol,ul,figure{margin:0;padding:0} ol,ul{list-style:none} a{color:inherit}
:focus-visible{outline:3px solid var(--rust);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:12px;top:-60px;background:var(--ink);color:var(--cream);padding:10px 16px;border-radius:6px;z-index:60;text-decoration:none}.skip:focus{top:12px}
.wrap{width:min(100%,1320px);margin-inline:auto;padding-inline:clamp(18px,4.5vw,44px)}
.rule{height:8px;background:linear-gradient(90deg,var(--rust) 0 40%,var(--gold) 40% 62%,var(--teal) 62% 100%)}
.hl{color:var(--rust)}

/* header */
.site-header{border-bottom:1px solid var(--line)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:14px 24px;padding-block:16px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand .mark{width:58px;flex:none}.brand .mark svg{display:block;width:100%;height:auto}
.brand b{display:block;font-family:var(--f-head);font-weight:700;font-size:1.25rem;line-height:1.1;letter-spacing:-.02em}
.brand small{display:block;font-size:.82rem;color:var(--ink2);margin-top:3px}
.hdr-links{display:flex;align-items:center;gap:20px}
.hdr-links .mail{font-size:.92rem;text-decoration:none;color:var(--ink2)}.hdr-links .mail:hover{color:var(--rust)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.55em;font-family:var(--f-type);font-weight:700;font-size:1rem;line-height:1.2;text-decoration:none;
  background:var(--ink);color:var(--cream);padding:.8em 1.3em;border-radius:6px;border:0;cursor:pointer;transition:background .2s,color .2s}
.btn:hover{background:var(--rust)}
.btn-big{font-size:1.12rem;padding:1em 1.6em}
.btn-gold{background:var(--gold);color:var(--ink)}.btn-gold:hover{background:var(--cream)}
.btn-ghost{background:transparent;color:var(--ink2);box-shadow:inset 0 0 0 1.5px var(--line);font-weight:400;font-size:.9rem;padding:.55em 1em}
.btn-ghost:hover{background:var(--cream);color:var(--ink)}
.arrow{transition:transform .2s}.btn:hover .arrow{transform:translateX(3px)}

/* stage */
.stage{padding-block:clamp(28px,3.6vw,52px) clamp(40px,6vw,88px)}
.stage>.wrap{display:grid;grid-template-columns:minmax(0,.74fr) minmax(0,1.26fr);gap:clamp(28px,4.5vw,64px);align-items:start}
.panel{position:sticky;top:28px}
.eyebrow{font-size:.9rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--rust)}
.eyebrow.ok{color:var(--teal)}
.cursor{display:inline-block;width:.6em;height:1em;background:currentColor;vertical-align:-.12em;margin-left:.2em;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.panel h1{text-wrap:balance;font-family:var(--f-head);font-weight:700;font-size:clamp(2.2rem,1.4rem + 2.6vw,3.5rem);line-height:1.04;letter-spacing:-.035em;margin-top:.4em;max-width:13ch}
.panel .lede{margin-top:20px;color:var(--ink2);max-width:34em}
.panel .byline{margin-top:22px;font-size:1.05rem;color:var(--ink2);padding-top:16px;border-top:2px solid var(--rust);display:inline-block}
.panel .cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-top:26px}
.panel .cta .or{font-size:.95rem;color:var(--ink2)}.panel .cta .or a{color:var(--rust)}
.panel .wink{margin-top:22px;font-size:.92rem;color:var(--ink2);font-style:italic}
.panel .replay{margin-top:18px}
.msg{display:none}
[data-state=tracing] .msg-tracing,[data-state=broken] .msg-broken,[data-state=fixing] .msg-broken,[data-state=fixed] .msg-fixed{display:block}
.msg-fixed h1{max-width:14ch}
.js [data-state] .msg{animation:fadein .45s ease both}
@keyframes fadein{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* static before/after for reduced motion */
.ba{display:none;margin-top:24px;background:var(--cream);border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.reduce .ba{display:block}
.ba svg{display:block;width:100%;height:auto}
.ba figcaption{font-size:.85rem;color:var(--ink2);margin-top:6px}

/* chain */
.chain-wrap{position:relative}
.chain{position:relative;padding:6px 0 30px}
.wires{position:absolute;left:0;top:0;overflow:visible;pointer-events:none;z-index:1}
.chain>li{position:relative;width:calc(50% - 46px);z-index:2}
.chain>li.L{margin-right:auto}.chain>li.R{margin-left:auto}
.chain>li+li{margin-top:-78px}
.chain>li.errwrap{margin-top:12px}
.chain>li.errwrap+li{margin-top:-150px}
.card{background:var(--cream);border:1px solid var(--line);border-radius:10px;padding:12px 16px 14px;box-shadow:0 16px 32px -26px rgba(42,33,25,.7);position:relative}
.card::after{content:"";position:absolute;top:30px;width:16px;border-top:2px dashed var(--line)}
.L .card::after{right:-17px}.R .card::after{left:-17px}
.when{font-size:.8rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--rust)}
.card h3{font-family:var(--f-head);font-weight:700;font-size:1.16rem;letter-spacing:-.02em;line-height:1.2;margin-top:2px}
.card p.t{font-size:.9rem;line-height:1.45;color:var(--ink2);margin-top:4px}
.dot{position:absolute;top:21px;width:20px;height:20px;border-radius:50%;background:var(--cream);border:2px solid var(--ink);z-index:3}
.dot::before{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--ink);transition:background .3s}
.L .dot{left:calc(100% + 16px)}.R .dot{right:calc(100% + 16px)}
.step.last .dot::before{background:var(--rust)}
/* reveal */
.js .step .card,.js .step .dot{opacity:0;transition:opacity .35s ease,transform .35s ease}
.js .step .card{transform:translateY(8px)}
.js .step.on .card,.js .step.on .dot{opacity:1;transform:none}
/* last node: unreachable vs resolved (stacked so height is stable) */
.swap{display:grid}.swap>div{grid-area:1/1;transition:opacity .4s}
.swap .ok{opacity:1}.swap .no{opacity:0;visibility:hidden}
[data-state=tracing] .swap .ok,[data-state=broken] .swap .ok,[data-state=fixing] .swap .ok{opacity:0;visibility:hidden}
[data-state=tracing] .swap .no,[data-state=broken] .swap .no,[data-state=fixing] .swap .no{opacity:1;visibility:visible}
[data-state=broken] .step.last .card,[data-state=fixing] .step.last .card,[data-state=tracing] .step.last .card{border-style:dashed;background:transparent;box-shadow:none}
[data-state=broken] .step.last .dot,[data-state=fixing] .step.last .dot,[data-state=tracing] .step.last .dot{border-style:dashed;border-color:var(--ink2);background:transparent}
[data-state=broken] .step.last .dot::before,[data-state=fixing] .step.last .dot::before,[data-state=tracing] .step.last .dot::before{background:transparent}
.swap .no h3{color:var(--ink2)}
.step.last .ok h3{font-size:1.4rem}
.step.last .ok p.t{color:var(--ink);font-weight:700;font-size:1.02rem}
.step.last .ok p.t .hl{white-space:nowrap}
/* pulses */
.dot.pulse-teal{animation:pulseT .9s ease-out}
.dot.pulse-gold{animation:pulseG .9s ease-out}
.dot.pulse-teal::before{background:var(--teal)}
@keyframes pulseT{0%{box-shadow:0 0 0 0 rgba(46,107,102,.75);border-color:var(--teal)}100%{box-shadow:0 0 0 22px rgba(46,107,102,0);border-color:var(--ink)}}
@keyframes pulseG{0%{box-shadow:0 0 0 0 rgba(192,142,37,.8);border-color:var(--gold)}100%{box-shadow:0 0 0 18px rgba(192,142,37,0);border-color:var(--ink)}}
[data-state=fixed] .step.fixed-end .dot{border-color:var(--teal)}
/* spark */
.spark line{stroke-linecap:round}
.spark{animation:flicker .5s steps(2) infinite;transform-box:fill-box;transform-origin:center}
@keyframes flicker{0%{opacity:1;transform:scale(1) rotate(0)}50%{opacity:.55;transform:scale(.8) rotate(18deg)}100%{opacity:1;transform:scale(1.08) rotate(0)}}

/* error card */
.errwrap{visibility:hidden}
[data-state=broken] .errwrap,[data-state=fixing] .errwrap,[data-state=fixed] .errwrap{visibility:visible}
.js .errwrap .term{opacity:0;transform:translateY(8px);transition:opacity .35s,transform .35s}
[data-state=broken] .errwrap .term,[data-state=fixing] .errwrap .term,[data-state=fixed] .errwrap .term{opacity:1;transform:none}
.term{background:var(--ink);color:#EADFC8;border-radius:10px;padding:16px 18px 18px;border-left:5px solid var(--rust);font-size:.9rem;line-height:1.5;box-shadow:0 18px 36px -24px rgba(42,33,25,.9)}
.term .code{font-weight:700;color:#E07A4F;letter-spacing:.08em}
.term .big{font-family:var(--f-head);font-weight:700;color:var(--cream);font-size:1.35rem;letter-spacing:-.02em;line-height:1.15;margin-top:2px}
.term p{margin-top:6px}
.term .log{margin-top:10px;color:#CBB991;min-height:4.5em}
.term .log li{white-space:pre-wrap}
.term .log li.ok{color:#7FC0B8}
.term .btn{margin-top:12px;font-size:.92rem;padding:.6em 1.1em}
.term .tv{display:grid}.term .tv>div{grid-area:1/1}
.term .fixedv{visibility:hidden}
[data-state=fixed] .term{border-left-color:var(--teal)}
[data-state=fixed] .term .brokenv{display:none}
[data-state=fixed] .term .fixedv{visibility:visible;animation:fadein .4s ease both}
[data-state=fixed] .term .code{color:#7FC0B8}
.term dl{margin:8px 0 0;display:grid;grid-template-columns:auto 1fr;gap:2px 12px}
.term dt{color:#CBB991}.term dd{margin:0;color:var(--cream)}

/* coda */
.coda{background:var(--ink);color:var(--cream);position:relative;overflow:hidden}
.coda .wrap{padding-block:clamp(44px,6vw,80px);display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:center}
.coda h2{font-family:var(--f-head);font-weight:700;font-size:clamp(1.8rem,1.2rem + 1.8vw,2.7rem);line-height:1.08;letter-spacing:-.03em}
.coda p{margin-top:14px;color:#E2D6BE;max-width:36em}
.coda .cta{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;margin-top:24px}
.coda .cta a.plain{color:var(--gold)}
.coda blockquote{margin:0;font-style:italic;font-size:1.15rem;line-height:1.5;color:#D9C9A8}
.coda blockquote::before{content:"";display:block;width:56px;border-top:2px solid var(--rust);margin-bottom:14px}
.coda .sig{margin-top:14px;font-family:var(--f-head);font-weight:700;color:var(--gold);font-size:1.1rem}
.coda .web{position:absolute;right:-120px;bottom:-140px;width:420px;opacity:.10;pointer-events:none}

footer.foot{border-top:1px solid var(--line)}
footer.foot .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;padding-block:20px;font-size:.82rem;color:var(--ink2)}
footer.foot a{color:var(--ink2)}

/* no-JS fallback: show finished state, plain spine */
.no-js .chain::before{content:"";position:absolute;left:50%;top:0;bottom:0;border-left:2px dashed var(--line)}

/* responsive */
@media (max-width:1023px){
  .stage>.wrap{grid-template-columns:1fr}
  .panel{position:static}
  .panel h1,.msg-fixed h1{max-width:18ch}
  .coda .wrap{grid-template-columns:1fr}
}
@media (max-width:679px){
  body{font-size:16px}
  .chain>li,.chain>li.L,.chain>li.R{width:auto;margin-left:46px;margin-right:0}
  .chain>li+li,.chain>li.errwrap,.chain>li.errwrap+li{margin-top:22px}
  .L .dot,.R .dot{left:-38px;right:auto}
  .L .card::after,.R .card::after{left:-19px;right:auto}
  .no-js .chain::before{left:17px}
  .hdr-links .mail{display:none}
  .site-header .wrap{flex-wrap:nowrap;gap:10px}
  .hdr-links .btn{padding:.6em .85em;font-size:.88rem}
  .hdr-links .btn .arrow{display:none}
  .term .log{font-size:.8rem}
  .brand{gap:9px}.brand .mark{width:42px}.brand b{font-size:1.02rem}.brand small{font-size:.66rem;white-space:nowrap}
}
@media (max-width:379px){.hdr-links .btn{padding:.6em .9em;font-size:.9rem}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .cursor{display:none}
}

/* inquiries page */
.inq-hero{padding-block:clamp(36px,5.5vw,76px) clamp(24px,3vw,40px)}
.inq-hero .wrap{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:start}
.inq-hero h1{font-family:var(--f-head);font-weight:700;font-size:clamp(2.1rem,1.3rem + 2.4vw,3.3rem);line-height:1.05;letter-spacing:-.035em;margin-top:.35em}
.inq-hero .sub{margin-top:14px;color:var(--ink2);max-width:38em}
.card-note{margin-top:14px;display:inline-flex;align-items:center;gap:10px;background:var(--cream);border:1px dashed var(--teal);color:var(--teal);font-weight:700;font-size:.95rem;padding:.45em .9em;border-radius:6px}
.card-note .nd{width:12px;height:12px;border-radius:50%;background:var(--teal);box-shadow:16px 0 0 -2px var(--gold);margin-right:14px}
.inq{margin-top:24px;display:grid;gap:18px;background:var(--cream);border:1px solid var(--line);border-radius:10px;padding:clamp(20px,3vw,30px);box-shadow:0 16px 32px -26px rgba(42,33,25,.7)}
.inq .row2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.inq label{display:grid;gap:6px;font-weight:700;font-size:.95rem}
.inq input,.inq select,.inq textarea{font:inherit;font-weight:400;font-size:1rem;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:6px;padding:.7em .8em;width:100%}
.inq input:focus,.inq select:focus,.inq textarea:focus{outline:2px solid var(--teal);outline-offset:1px;border-color:var(--teal)}
.inq button{justify-self:start}.inq .err{color:#9B2C1C;font-weight:700}.inq .done{color:var(--ink2)}.inq .done a{color:var(--rust)}
.aside{background:var(--ink);color:var(--cream);border-radius:10px;padding:clamp(22px,3vw,32px);position:relative;overflow:hidden;margin-top:clamp(0px,4vw,58px)}
.aside .code{font-weight:700;letter-spacing:.1em;color:var(--gold);font-size:.85rem}
.aside h2{font-family:var(--f-head);font-weight:700;font-size:1.6rem;letter-spacing:-.02em;margin-top:4px}
.aside p{color:#E2D6BE;margin-top:8px;position:relative}
.aside .mailbig{margin-top:14px;font-size:1.2rem;font-weight:700}.aside .mailbig a{color:var(--cream);text-decoration-color:var(--rust);text-underline-offset:4px}
.aside blockquote{margin:26px 0 0;font-style:italic;color:#D9C9A8;position:relative;max-width:22em}
.aside blockquote::before{content:"";display:block;width:56px;border-top:2px solid var(--rust);margin-bottom:12px}
.aside .sig{font-family:var(--f-head);font-weight:700;color:var(--gold)}
.aside .byline{margin-top:20px;font-size:.92rem;color:#CBB991}.aside .byline .hl{color:#E07A4F}
.aside .web{position:absolute;right:-110px;bottom:-110px;width:300px;opacity:.12;pointer-events:none}
.back{padding-block:8px 48px;font-size:.95rem;color:var(--ink2)}.back a{color:var(--rust);font-weight:700}
@media (max-width:899px){.inq-hero .wrap{grid-template-columns:1fr}.aside{margin-top:0}}
@media (max-width:559px){.inq .row2{grid-template-columns:1fr}}
/* JS packing (wide screens) */
.chain.packed>li{position:absolute;margin:0!important}
.chain.packed>li.L{left:0}.chain.packed>li.R{right:0}

/* luminous cool accent: soft blue-violet glow on the reconnected link and its nodes (fixed state) */
.wires .wire.glow{filter:drop-shadow(0 0 3px rgba(91,91,214,.75)) drop-shadow(0 0 9px rgba(91,91,214,.38))}
.step.glow .dot{border-color:var(--teal);box-shadow:0 0 0 3px rgba(91,91,214,.14),0 0 16px 3px rgba(91,91,214,.42);transition:box-shadow .6s ease}
.step.glow .dot.pulse-violet{animation:pulseV 1.1s ease-out}
@keyframes pulseV{0%{box-shadow:0 0 0 0 rgba(91,91,214,.85),0 0 22px 6px rgba(91,91,214,.6)}100%{box-shadow:0 0 0 24px rgba(91,91,214,0),0 0 16px 3px rgba(91,91,214,.42)}}
.wires .wire.glow.flare{animation:flare 1.2s ease-out}
@keyframes flare{0%{filter:drop-shadow(0 0 6px rgba(91,91,214,1)) drop-shadow(0 0 18px rgba(91,91,214,.7))}100%{filter:drop-shadow(0 0 3px rgba(91,91,214,.75)) drop-shadow(0 0 9px rgba(91,91,214,.38))}}

/* Paper watermark: Gleason's New Standard Map of the World (Alexander Gleason, 1892; public domain; see assets/CREDITS.txt).
   Upper ~60% of the circular map incl. the full top arc of the sun-time ring. Sepia line work on white with edges feathered
   to white (white = no change under multiply), multiplied into the cream at var(--map-opacity) (default 22%). Kept out of the dark coda. */
.stage,.inq-hero{position:relative;overflow-x:clip}
.stage>.wrap,.inq-hero>.wrap{position:relative;z-index:1}
.stage::before,.inq-hero::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  /* x offset parks the map's centre bullseye (image px 878,935 -> 741,790 at 1520 wide) in the open gutter:
     home = between the text column and the chain cards; inquiries = right of the form, below the Direct line box (1280 wide) */
  background:url("/wm/gleason-redraw.webp") no-repeat calc(50% - 129px) -36px/1520px auto;
  opacity:var(--map-opacity);mix-blend-mode:multiply}
.inq-hero::before{background-position:calc(50% + 123px) -36px}
/* soft cream scrim behind the text column so the bolder map never fights the copy (feathered by blur, no hard box) */
.panel,.inq-hero>.wrap>div:first-child{isolation:isolate}
.inq-hero>.wrap>div:first-child{position:relative}
.panel::before,.inq-hero>.wrap>div:first-child::before{content:"";position:absolute;inset:-14px 4px -14px -22px;z-index:-1;pointer-events:none;
  background:rgba(242,232,213,var(--map-scrim));border-radius:28px;filter:blur(12px)}
@media (max-width:1023px){.panel{position:relative}}
@media (max-width:679px){
  .stage::before,.inq-hero::before{background-image:url("/wm/gleason-redraw-m.webp");background-size:860px auto;background-position:center top -10px}
}
/* telephone (Google Voice: voicemail, transcribed). Never promise a live answer. */
.panel .cta .or{line-height:1.6}
.coda .cta .or{color:#E2D6BE;font-size:.95rem}
.coda p.ring{margin-top:16px;font-size:.92rem;font-style:italic;color:#D9C9A8}
.coda p.ring a{color:var(--gold);font-style:normal;font-weight:700;white-space:nowrap}
.aside .phonelead{margin-top:22px;color:#E2D6BE}
.aside .phonebig{margin-top:6px}
a[href^="tel:"]{white-space:nowrap}

/* small-phone header fit + no sideways scroll (overflow-x:clip keeps the sticky panel working) */
body{overflow-x:clip}
@media (max-width:420px){
  .site-header .wrap{gap:8px}
  .brand{min-width:0}.brand>span:last-child{min-width:0}
  .brand small{white-space:normal;font-size:.64rem}
  .hdr-links .btn{padding:.55em .7em;font-size:.84rem}
}

/* ---- silent film (inquiries): "The Telephone". One fixed screen; scene shots alternate with full-screen intertitles. Original inline SVG figures. ---- */
.film-band{padding-block:6px 30px}
.film-head{display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px;margin:0 auto 12px;max-width:980px}
.film-head .eyebrow{flex-basis:100%}
.film-head h2{font-family:var(--f-head);font-weight:700;font-size:clamp(1.25rem,1rem + .9vw,1.6rem);letter-spacing:-.02em;line-height:1.15;flex:1 1 auto}
.film-ctrl{display:flex;align-items:center;gap:8px;white-space:nowrap}
.film-btn{width:34px;height:34px;border-radius:50%;border:1.5px solid var(--ink);background:var(--cream2);color:var(--ink);font:700 1.25rem/1 Georgia,serif;cursor:pointer;display:grid;place-items:center;padding:0 0 3px}
.film-btn:hover{background:var(--ink);color:var(--cream)}.film-btn:focus-visible,.film-replay:focus-visible{outline:2px solid var(--rust);outline-offset:2px}
.film-count{font-size:.82rem;color:var(--ink2);min-width:3.6em;text-align:center}
.film-replay{font-size:.9rem;font-weight:700;color:var(--rust);text-decoration:none;margin-left:6px}.film-replay:hover{text-decoration:underline}
.film-screen{--c0:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60'%3E%3Cg fill='none' stroke='%23E9E1D2' stroke-width='1.4' stroke-linecap='round' transform='rotate(0 30 30)'%3E%3Cpath d='M4 56V24C4 12 12 4 24 4h32'/%3E%3Cpath d='M10 56V27c0-10 7-17 17-17h29' opacity='.5'/%3E%3Cpath d='M24 4c-9 12 3 21 11 13 6-6-1-12-6-7'/%3E%3Cpath d='M4 24c12-9 21 3 13 11-6 6-12-1-7-6'/%3E%3Cpath d='M17 17c6 2 9 6 9 12' opacity='.7'/%3E%3Ccircle cx='4' cy='56' r='2' fill='%23E9E1D2'/%3E%3Ccircle cx='56' cy='4' r='2' fill='%23E9E1D2'/%3E%3C/g%3E%3C/svg%3E");--c90:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60'%3E%3Cg fill='none' stroke='%23E9E1D2' stroke-width='1.4' stroke-linecap='round' transform='rotate(90 30 30)'%3E%3Cpath d='M4 56V24C4 12 12 4 24 4h32'/%3E%3Cpath d='M10 56V27c0-10 7-17 17-17h29' opacity='.5'/%3E%3Cpath d='M24 4c-9 12 3 21 11 13 6-6-1-12-6-7'/%3E%3Cpath d='M4 24c12-9 21 3 13 11-6 6-12-1-7-6'/%3E%3Cpath d='M17 17c6 2 9 6 9 12' opacity='.7'/%3E%3Ccircle cx='4' cy='56' r='2' fill='%23E9E1D2'/%3E%3Ccircle cx='56' cy='4' r='2' fill='%23E9E1D2'/%3E%3C/g%3E%3C/svg%3E");--c180:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60'%3E%3Cg fill='none' stroke='%23E9E1D2' stroke-width='1.4' stroke-linecap='round' transform='rotate(180 30 30)'%3E%3Cpath d='M4 56V24C4 12 12 4 24 4h32'/%3E%3Cpath d='M10 56V27c0-10 7-17 17-17h29' opacity='.5'/%3E%3Cpath d='M24 4c-9 12 3 21 11 13 6-6-1-12-6-7'/%3E%3Cpath d='M4 24c12-9 21 3 13 11-6 6-12-1-7-6'/%3E%3Cpath d='M17 17c6 2 9 6 9 12' opacity='.7'/%3E%3Ccircle cx='4' cy='56' r='2' fill='%23E9E1D2'/%3E%3Ccircle cx='56' cy='4' r='2' fill='%23E9E1D2'/%3E%3C/g%3E%3C/svg%3E");--c270:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60'%3E%3Cg fill='none' stroke='%23E9E1D2' stroke-width='1.4' stroke-linecap='round' transform='rotate(270 30 30)'%3E%3Cpath d='M4 56V24C4 12 12 4 24 4h32'/%3E%3Cpath d='M10 56V27c0-10 7-17 17-17h29' opacity='.5'/%3E%3Cpath d='M24 4c-9 12 3 21 11 13 6-6-1-12-6-7'/%3E%3Cpath d='M4 24c12-9 21 3 13 11-6 6-12-1-7-6'/%3E%3Cpath d='M17 17c6 2 9 6 9 12' opacity='.7'/%3E%3Ccircle cx='4' cy='56' r='2' fill='%23E9E1D2'/%3E%3Ccircle cx='56' cy='4' r='2' fill='%23E9E1D2'/%3E%3C/g%3E%3C/svg%3E");--orn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 24'%3E%3Cg fill='none' stroke='%23E9E1D2' stroke-width='1.3' stroke-linecap='round'%3E%3Cpath d='M2 12h34M84 12h34'/%3E%3Cpath d='M36 12c8-10 18-10 24 0 6-10 16-10 24 0'/%3E%3Cpath d='M36 12c8 10 18 10 24 0 6 10 16 10 24 0' opacity='.55'/%3E%3Ccircle cx='60' cy='12' r='2.6' fill='%23E9E1D2'/%3E%3C/g%3E%3C/svg%3E");
  position:relative;overflow:hidden;max-width:980px;margin-inline:auto;aspect-ratio:16/9;border-radius:10px;background:#0B0907;container-type:inline-size;
  box-shadow:0 0 0 6px var(--ink),0 0 0 7px var(--line),0 22px 40px -26px rgba(42,33,25,.85)}
.film-screen::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:5;background:radial-gradient(ellipse 72% 68% at 50% 50%,transparent 52%,rgba(0,0,0,.66) 100%)}
.film-screen::after{content:"";position:absolute;inset:-40px;pointer-events:none;z-index:6;opacity:.17;mix-blend-mode:screen;
  background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScyNDAnIGhlaWdodD0nMjQwJz48ZmlsdGVyIGlkPSduJz48ZmVUdXJidWxlbmNlIHR5cGU9J2ZyYWN0YWxOb2lzZScgYmFzZUZyZXF1ZW5jeT0nLjg1JyBudW1PY3RhdmVzPSczJyBzdGl0Y2hUaWxlcz0nc3RpdGNoJy8+PGZlQ29sb3JNYXRyaXggdmFsdWVzPScwIDAgMCAwIDAuMTYgIDAgMCAwIDAgMC4xMiAgMCAwIDAgMCAwLjA4ICAwIDAgMCAuNTUgMCcvPjwvZmlsdGVyPjxyZWN0IHdpZHRoPScxMDAlJyBoZWlnaHQ9JzEwMCUnIGZpbHRlcj0ndXJsKCNuKScvPjwvc3ZnPg==");
  filter:invert(1);animation:grain .9s steps(3) infinite}
@keyframes grain{0%{transform:translate(0,0)}33%{transform:translate(-14px,9px)}66%{transform:translate(11px,-12px)}100%{transform:translate(0,0)}}
.film-screen .scratch{position:absolute;top:0;bottom:0;left:30%;width:1px;background:rgba(239,233,221,.22);z-index:6;pointer-events:none;animation:scratch 7s steps(1) infinite}
@keyframes scratch{0%{left:22%;opacity:.8}9%{opacity:0}31%{left:71%;opacity:.6}36%{opacity:0}58%{left:44%;opacity:.7}61%{opacity:0}100%{opacity:0}}
.reel{position:absolute;inset:0;filter:grayscale(.55) contrast(1.05);animation:flick 4.5s infinite}
@keyframes flick{0%,100%{opacity:1}6%{opacity:.9}7%{opacity:1}39%{opacity:.95}40%{opacity:1}71%{opacity:.88}72%{opacity:1}86%{opacity:.96}87%{opacity:1}}
.shot{position:absolute;inset:0;visibility:hidden;z-index:0}
.shot.on{visibility:visible;z-index:2}.shot.prev{visibility:visible;z-index:1}
.film-screen .shot.scene{display:none}
.film-screen[data-kind=scene] .scene-set{visibility:visible;z-index:2}
.film-screen[data-kind=scene] .scene-set.in{animation:iris .6s ease-out both}
.shot.card.on.in{animation:cardin .55s ease-out both}
@keyframes iris{from{clip-path:circle(0% at 50% 55%)}to{clip-path:circle(80% at 50% 55%)}}
@keyframes cardin{0%{opacity:0;filter:brightness(2)}25%{opacity:.9}35%{opacity:.5}55%{opacity:1}100%{opacity:1;filter:none}}
/* scene shot */
.scene-set .set{position:absolute;inset:0;width:100%;height:100%}
.scene-set::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--spot,50%) 62%,rgba(255,248,230,.16),transparent 38%);transition:background .4s}
.film-screen[data-speaker=bell] .scene-set{--spot:30%}.film-screen[data-speaker=tesla] .scene-set{--spot:70%}
.cast{position:absolute;left:0;right:0;bottom:10%;height:72%;display:flex;justify-content:center;align-items:flex-end;gap:6%;z-index:1}
.fig{margin:0;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;filter:brightness(.62);transition:filter .35s}
.fig-svg{display:block;height:calc(100% - 1.4em);width:auto}
.fig figcaption{font-family:"Cinzel Decorative",Georgia,serif;font-weight:700;font-size:clamp(.62rem,1.5cqw,.8rem);letter-spacing:.12em;color:#CFC6B6;margin-top:2px}
.film-screen[data-speaker=bell] .fig.bell,.film-screen[data-speaker=tesla] .fig.tesla{filter:none}
#film .bell-upper{transform-box:view-box;transform-origin:100px 300px;transition:transform .55s cubic-bezier(.3,1.5,.5,1)}
#film .tesla-arm{transform-box:view-box;transform-origin:94px 168px;transition:transform .55s cubic-bezier(.3,1.4,.5,1)}
#film .spark{opacity:0;animation:none;transition:opacity .2s}
.film-screen[data-speaker=bell].act .bell-upper{transform:rotate(8deg)}
.film-screen[data-speaker=tesla].act .tesla-arm{transform:rotate(166deg)}
.film-screen[data-speaker=tesla].act .spark{opacity:1;animation:zap .28s steps(2) infinite}
@keyframes zap{50%{opacity:.25}}
/* full-screen intertitles */
.shot.card{background:#0B0907;padding:clamp(10px,2.4cqw,22px);border:0;border-radius:0;box-shadow:none}
.shot.card::after{content:none} /* cancel the home chain's .card connector stub (was the faint dash top-left) */
.frame{position:relative;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#EFE9DD;
  border:1.5px solid rgba(233,225,210,.75);outline:1px solid rgba(233,225,210,.3);outline-offset:-9px;border-radius:4px;padding:clamp(28px,6cqw,64px) clamp(30px,9cqw,110px);
  background-image:var(--c0),var(--c90),var(--c270),var(--c180),var(--orn),var(--orn);background-repeat:no-repeat;
  background-size:clamp(34px,7cqw,64px) clamp(34px,7cqw,64px),clamp(34px,7cqw,64px) clamp(34px,7cqw,64px),clamp(34px,7cqw,64px) clamp(34px,7cqw,64px),clamp(34px,7cqw,64px) clamp(34px,7cqw,64px),clamp(80px,14cqw,130px) auto,clamp(80px,14cqw,130px) auto;
  background-position:left 5px top 5px,right 5px top 5px,left 5px bottom 5px,right 5px bottom 5px,center top 14px,center bottom 14px}
.frame p{margin:0}
.frame .who{font-family:"Cinzel Decorative",Georgia,serif;font-weight:700;font-size:clamp(.8rem,2cqw,1.15rem);letter-spacing:.24em;text-transform:uppercase;color:#BDB4A5;margin-bottom:.7em}
.frame .say{font-family:"Cormorant Garamond",Georgia,"Times New Roman",serif;font-weight:600;font-style:italic;font-size:clamp(1.25rem,4.2cqw,2.5rem);line-height:1.22;text-wrap:balance;max-width:24ch}
.frame .big{font-family:"Cinzel Decorative",Georgia,serif;font-weight:700;font-size:clamp(1.7rem,7.4cqw,4.4rem);line-height:1.08;letter-spacing:.06em;text-transform:uppercase;text-wrap:balance}
.frame .rule{width:min(52%,260px);height:1px;background:rgba(233,225,210,.55);margin:.9em auto .8em}
.frame .sub{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-style:italic;font-size:clamp(1.05rem,3cqw,1.8rem);line-height:1.25;color:#DCD4C6;text-wrap:balance}
.aside .film-link{margin-top:8px;font-size:.88rem;font-style:italic;color:#D9C9A8}.aside .film-link a{color:var(--gold)}
@media (max-width:759px){
  .film-screen{aspect-ratio:4/5}
  .cast{height:58%;bottom:14%;gap:2%}
  .frame{padding:44px 26px;outline-offset:-7px}
  .frame .say{font-size:clamp(1.25rem,6.2cqw,1.6rem)}
  .frame .big{font-size:clamp(1.6rem,9cqw,2.3rem)}
  .frame .sub{font-size:clamp(1.05rem,5cqw,1.3rem)}
  .card.final .tail{font-size:clamp(1.3rem,6.4cqw,1.7rem)}
  .film-ctrl{margin-left:auto}
}
@media (prefers-reduced-motion:reduce){
  .reel,.film-screen::after,.film-screen .scratch{animation:none}
  .film-screen .scratch{display:none}
  .film-screen [class*=shot],#film .bell-upper,#film .tesla-arm,.fig{animation:none!important;transition:none!important}
  .film-screen[data-speaker=tesla].act .spark{animation:none}
}

/* ---- Easter egg: "machine" crackles (blue-violet), opens a 1934 clipping. Original copy; font scoped to the card. ---- */
.egg{font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:help;position:relative;display:inline;
  text-decoration:underline dotted rgba(91,91,214,.55);text-decoration-thickness:1px;text-underline-offset:3px}
.egg::after{content:"";position:absolute;left:-2px;right:-2px;bottom:-5px;height:6px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 8' preserveAspectRatio='none'%3E%3Cpath d='M0 5 L7 2 L12 6 L19 1.5 L25 5.5 L31 2 L37 6.5 L43 1.8 L50 5 L55 2.5 L60 4.5' fill='none' stroke='%235B5BD6' stroke-width='1.1' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% 100% no-repeat;
  opacity:0;pointer-events:none;animation:crackle 7s steps(1) infinite}
.egg-2::after{animation-delay:-3.4s}
.egg:hover::after,.egg[aria-expanded=true]::after{animation:zapline .22s steps(2) infinite}
@keyframes crackle{0%,86%,100%{opacity:0;transform:none}87%{opacity:.85}88%{opacity:.15;transform:scaleX(-1)}89%{opacity:.7;transform:scaleX(-1)}90%{opacity:0}93%{opacity:.5}94%{opacity:0}}
@keyframes zapline{0%{opacity:.8}50%{opacity:.35;transform:scaleX(-1)}}
.egg:focus-visible{outline:2px solid var(--glow);outline-offset:2px;border-radius:2px}
.clip{position:fixed;z-index:70;left:0;top:0;width:min(300px,calc(100vw - 28px));filter:drop-shadow(0 10px 14px rgba(42,33,25,.35)) drop-shadow(0 1px 1px rgba(42,33,25,.3));
  transform:rotate(-1.6deg);transform-origin:50% 0}
.clip[hidden]{display:none}
.clip .paper{font-family:"Old Standard TT",Georgia,"Times New Roman",serif;color:#2B2318;text-align:center;padding:12px 16px 22px;
  /* aged newsprint: warm yellow base, foxing, darker aged edge (inset shadow); text kept AA */
  background:radial-gradient(circle at 9% 22%,rgba(139,94,38,0.16) 0 2px,rgba(139,94,38,0) 5px),radial-gradient(circle at 88% 14%,rgba(139,94,38,0.14) 0 3px,rgba(139,94,38,0) 7px),radial-gradient(circle at 76% 63%,rgba(139,94,38,0.12) 0 2px,rgba(139,94,38,0) 5px),radial-gradient(circle at 14% 78%,rgba(139,94,38,0.13) 0 3px,rgba(139,94,38,0) 7px),radial-gradient(circle at 52% 9%,rgba(139,94,38,0.12) 0 1.5px,rgba(139,94,38,0) 4px),radial-gradient(circle at 93% 86%,rgba(139,94,38,0.14) 0 2px,rgba(139,94,38,0) 5px),radial-gradient(ellipse at 18% 12%,rgba(150,105,40,.14),transparent 45%),radial-gradient(ellipse at 85% 80%,rgba(130,88,30,.16),transparent 50%),url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScyNDAnIGhlaWdodD0nMjQwJz48ZmlsdGVyIGlkPSduJz48ZmVUdXJidWxlbmNlIHR5cGU9J2ZyYWN0YWxOb2lzZScgYmFzZUZyZXF1ZW5jeT0nLjg1JyBudW1PY3RhdmVzPSczJyBzdGl0Y2hUaWxlcz0nc3RpdGNoJy8+PGZlQ29sb3JNYXRyaXggdmFsdWVzPScwIDAgMCAwIDAuMTYgIDAgMCAwIDAgMC4xMiAgMCAwIDAgMCAwLjA4ICAwIDAgMCAuNTUgMCcvPjwvZmlsdGVyPjxyZWN0IHdpZHRoPScxMDAlJyBoZWlnaHQ9JzEwMCUnIGZpbHRlcj0ndXJsKCNuKScvPjwvc3ZnPg=="),linear-gradient(172deg,#E9D9A6 0%,#E3CF97 55%,#DCC58A 100%);
  background-size:auto,auto,auto,auto,auto,auto,auto,auto,180px 180px,auto;
  box-shadow:inset 0 0 0 1px rgba(120,80,25,.22),inset 0 0 14px rgba(120,80,25,.32);clip-path:polygon(0 0,100% 0,100.0% 98.4%,96.2% 99.2%,92.3% 98.4%,88.5% 97.2%,84.6% 97.2%,80.8% 99.2%,76.9% 97.2%,73.1% 96.8%,69.2% 96.8%,65.4% 97.2%,61.5% 95.6%,57.7% 100.0%,53.8% 97.2%,50.0% 97.8%,46.2% 98.4%,42.3% 95.6%,38.5% 95.6%,34.6% 100.0%,30.8% 97.2%,26.9% 96.8%,23.1% 96.8%,19.2% 97.2%,15.4% 100.0%,11.5% 97.8%,7.7% 97.2%,3.8% 98.4%,0.0% 96.8%)}
.clip .mast{margin:0;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;border-top:2px solid #2B2318;border-bottom:1px solid #2B2318;padding:3px 0 2px}
.clip .mast span{letter-spacing:.06em}
.clip .head{margin:8px 0 0;font-weight:700;font-size:1.32rem;line-height:1.05;text-transform:uppercase;letter-spacing:.01em}
.clip .deck{margin:6px 0 0;font-style:italic;font-size:.86rem;line-height:1.25;padding-bottom:7px;border-bottom:1px solid rgba(43,35,24,.5)}
.clip .body{margin:7px 0 0;font-size:.84rem;line-height:1.35;text-align:justify;hyphens:auto}
.clip .note{margin:9px 0 0;font-size:.6rem;line-height:1.3;color:#45372A;font-style:italic}
@media (prefers-reduced-motion:reduce){.egg::after{display:none}}

/* ---- end-of-reel burn-out (after THE END) and live Tesla coil ---- */
.film-defs{position:absolute;width:0;height:0}
.burnshot{z-index:3!important;overflow:hidden}
.shot.under{visibility:visible;z-index:1}
.burnshot .holes{position:absolute;inset:0;filter:url(#film-melt)}
.b-hole{position:absolute;width:30cqw;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%) scale(0);
  background:radial-gradient(circle,#FFFDF6 0 22%,#F3E4BC 30%,#C9A46A 37%,#5A3A1C 44%,rgba(15,8,3,.95) 50%,rgba(15,8,3,0) 58%)}
.b-hole.h1{left:54%;top:46%}.b-hole.h2{left:31%;top:63%}.b-hole.h3{left:72%;top:31%}
.burnshot.on .b-hole{animation:burnhole 2.5s cubic-bezier(.55,0,.85,.4) both}
.burnshot.on .h1{animation-delay:.3s}.burnshot.on .h2{animation-delay:.85s}.burnshot.on .h3{animation-delay:1.25s}
@keyframes burnhole{0%{transform:translate(-50%,-50%) scale(0)}14%{transform:translate(-50%,-50%) scale(.14)}30%{transform:translate(-50%,-50%) scale(.22)}60%{transform:translate(-50%,-50%) scale(1.15)}100%{transform:translate(-50%,-50%) scale(5.5)}}
.b-perf{position:absolute;top:-20%;bottom:-20%;width:5.5cqw;opacity:0;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 30'%3E%3Crect x='4' y='8' width='12' height='14' rx='3' fill='%23F4EFE6'/%3E%3C/svg%3E") repeat-y center top/100% auto,#15110E}
.b-perf.l{left:1.2cqw}.b-perf.r{right:1.2cqw}
.burnshot.on .b-perf{animation:perf 3.3s steps(1) both}
@keyframes perf{0%{opacity:0}9%{opacity:1;transform:none}11%{opacity:0}31%{opacity:1;transform:translateY(-7%)}33%{opacity:0}52%{opacity:.9;transform:translateY(5%)}54%{opacity:0}69%{opacity:1;transform:translateY(-3%)}70.5%{opacity:0}100%{opacity:0}}
.b-leader{position:absolute;left:50%;top:50%;height:72%;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);opacity:0;display:grid;place-items:center;
  border:3px solid #EFE9DD;box-shadow:inset 0 0 0 10px #8F887D,inset 0 0 0 12px #EFE9DD,0 0 0 100vmax #6F685E;
  background:linear-gradient(#EFE9DD,#EFE9DD) center/2px 100% no-repeat,linear-gradient(#EFE9DD,#EFE9DD) center/100% 2px no-repeat,#8F887D}
.b-leader i{font:700 clamp(3rem,15cqw,9rem)/1 Georgia,"Times New Roman",serif;font-style:normal;color:#14100D}
.burnshot.on .n3{animation:lead3 3.3s steps(1) both}.burnshot.on .n2{animation:lead2 3.3s steps(1) both}
@keyframes lead3{0%{opacity:0}15%{opacity:1}19.5%{opacity:0}100%{opacity:0}}
@keyframes lead2{0%{opacity:0}36%{opacity:1}40.5%{opacity:0}100%{opacity:0}}
.b-white{position:absolute;inset:0;background:#FFFCF2;opacity:0}
.burnshot.on .b-white{animation:flap 3.3s linear both}
@keyframes flap{0%,73%{opacity:0}75%{opacity:.9}77%{opacity:.15}80%{opacity:1}83%{opacity:.45}87%{opacity:1}91%{opacity:.7}94%,100%{opacity:1}}
.film-screen[data-kind=burn] .reel{animation:burnflick .9s steps(1) infinite}
@keyframes burnflick{0%{opacity:1;transform:none;filter:grayscale(.55) brightness(1)}12%{opacity:.7;transform:translate(1px,-1px);filter:grayscale(.55) brightness(1.45)}20%{opacity:1;transform:none;filter:grayscale(.55)}33%{opacity:.55;transform:translate(-2px,1px);filter:grayscale(.55) brightness(.8)}45%{opacity:1;transform:none;filter:grayscale(.55)}60%{opacity:.8;filter:grayscale(.55) brightness(1.6)}72%{opacity:1;transform:translate(0,2px);filter:grayscale(.55)}85%{opacity:.6;transform:none;filter:grayscale(.55) brightness(1.2)}}
/* final card: completely still and readable */
.film-screen[data-kind=final] .reel,.film-screen[data-kind=final]::after{animation:none}
.film-screen[data-kind=final] .scratch{display:none}
.card.final .tail{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-style:italic;font-size:clamp(1.3rem,4.4cqw,2.5rem);line-height:1.3;color:#EFE9DD;text-wrap:balance}
.card.final .tail a{color:#FFFFFF;text-decoration:none;border-bottom:1px solid rgba(233,225,210,.6);font-style:normal;letter-spacing:.03em;white-space:nowrap}
/* Tesla coil: halo pulse, JS-drawn arcs (silver), wireless bulb */
#film .halo{transform-box:fill-box;transform-origin:center;animation:halo 1.7s ease-in-out infinite}
@keyframes halo{0%,100%{opacity:.35;transform:scale(.85)}50%{opacity:.85;transform:scale(1.15)}}
#film .arcs .g{stroke:rgba(225,225,238,.32);stroke-width:3.2}
#film .arcs .c{stroke:#FBFBFF;stroke-width:1}
#film .bulb-glow{opacity:0;transition:opacity .12s}
#film .bulb .glass{transition:fill .12s}
#film .bulb.lit .bulb-glow{opacity:.95}
#film .bulb.lit .glass{fill:#FFFDF5}
#film .bulb.lit .fil{stroke:#C9C2B4}
@media (max-width:759px){.cast{height:50%;bottom:16%}}
@media (prefers-reduced-motion:reduce){#film .halo{animation:none;opacity:.55}}
@media (max-width:759px){.card.final .tail{font-size:clamp(1.3rem,6.4cqw,1.7rem)}}

/* ---- film FX pass: gate weave + stronger flicker, 3 scratches, dust, random edge/corner burns ---- */
.reel{animation:flick2 3.2s infinite,weave .7s steps(1) infinite}
@keyframes flick2{0%,100%{opacity:1;filter:grayscale(.55) contrast(1.05) brightness(1)}5%{opacity:.82;filter:grayscale(.55) contrast(1.05) brightness(1.18)}6%{opacity:1;filter:grayscale(.55) contrast(1.05) brightness(1)}
  22%{opacity:.9;filter:grayscale(.55) contrast(1.1) brightness(.9)}23%{opacity:1;filter:grayscale(.55) contrast(1.05) brightness(1)}41%{opacity:.78;filter:grayscale(.55) contrast(1.05) brightness(1.12)}42.5%{opacity:1}
  58%{opacity:.92;filter:grayscale(.55) contrast(1.05) brightness(.92)}59%{opacity:1;filter:grayscale(.55) contrast(1.05) brightness(1)}76%{opacity:.84}77%{opacity:1}90%{opacity:.88;filter:grayscale(.55) contrast(1.05) brightness(1.1)}91%{opacity:1;filter:grayscale(.55) contrast(1.05) brightness(1)}}
@keyframes weave{0%{transform:translate(0,0)}14%{transform:translate(1.5px,-1px)}28%{transform:translate(-1px,1.5px)}42%{transform:translate(2px,.5px)}57%{transform:translate(-2px,-1.5px)}71%{transform:translate(.5px,2.5px)}85%{transform:translate(-1.5px,-.5px)}93%{transform:translate(0,-4px)}}
.film-screen .scratch{width:1.5px;background:rgba(239,233,221,.32);animation:scratch 5.3s steps(1) infinite}
.film-screen .scratch.s2{width:1px;background:rgba(0,0,0,.55);animation:scratch2 3.7s steps(1) infinite}
.film-screen .scratch.s3{width:2px;background:rgba(239,233,221,.2);animation:scratch3 8.9s steps(1) infinite}
@keyframes scratch2{0%{left:63%;opacity:.8}6%{left:62.6%}12%{opacity:0}40%{left:17%;opacity:.7}47%{opacity:0}70%{left:83%;opacity:.6}74%{opacity:0}100%{opacity:0}}
@keyframes scratch3{0%{left:38%;opacity:0}20%{opacity:.8;left:38%}24%{left:38.4%}30%{opacity:0}65%{left:9%;opacity:.7}69%{opacity:0}100%{opacity:0}}
.film-screen .dust{position:absolute;inset:0;z-index:6;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 300'%3E%3Cpath d='M181 168Q182 163 180 168' stroke='%23F4EFE6' stroke-width='.8' fill='none'/%3E%3Cpath d='M205 189Q193 192 193 185' stroke='%23F4EFE6' stroke-width='.8' fill='none'/%3E%3Cpath d='M277 13Q286 9 290 16' stroke='%23F4EFE6' stroke-width='.8' fill='none'/%3E%3Ccircle cx='6' cy='159' r='0.8' fill='%23F4EFE6'/%3E%3Ccircle cx='97' cy='9' r='1.1' fill='%23F4EFE6'/%3E%3Ccircle cx='337' cy='156' r='1.2' fill='%23F4EFE6'/%3E%3Ccircle cx='265' cy='137' r='1.9' fill='%23F4EFE6'/%3E%3Ccircle cx='398' cy='252' r='0.9' fill='%23F4EFE6'/%3E%3Ccircle cx='92' cy='87' r='1.6' fill='%23F4EFE6'/%3E%3Ccircle cx='160' cy='254' r='1.8' fill='%23F4EFE6'/%3E%3Ccircle cx='339' cy='0' r='1.8' fill='%23F4EFE6'/%3E%3Ccircle cx='188' cy='294' r='0.6' fill='%23F4EFE6'/%3E%3Ccircle cx='252' cy='234' r='0.6' fill='%23F4EFE6'/%3E%3Cpath d='M133 289Q121 280 122 284' stroke='%23F4EFE6' stroke-width='.8' fill='none'/%3E%3Ccircle cx='319' cy='53' r='1.1' fill='%23F4EFE6'/%3E%3Ccircle cx='76' cy='220' r='1.4' fill='%23F4EFE6'/%3E%3Ccircle cx='47' cy='126' r='0.9' fill='%23F4EFE6'/%3E%3Ccircle cx='388' cy='241' r='1.7' fill='%23F4EFE6'/%3E%3Cpath d='M84 118Q94 110 88 110' stroke='%23F4EFE6' stroke-width='.8' fill='none'/%3E%3Ccircle cx='103' cy='232' r='0.9' fill='%23F4EFE6'/%3E%3Ccircle cx='29' cy='27' r='0.8' fill='%23F4EFE6'/%3E%3Ccircle cx='241' cy='112' r='1.8' fill='%23F4EFE6'/%3E%3C/svg%3E") 0 0/100% 100%;opacity:.55;animation:dust .5s steps(1) infinite}
.film-screen .dust.d2{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 300'%3E%3Cpath d='M219 104Q214 103 213 104' stroke='%23050403' stroke-width='.8' fill='none'/%3E%3Ccircle cx='390' cy='31' r='0.8' fill='%23050403'/%3E%3Ccircle cx='140' cy='300' r='1.4' fill='%23050403'/%3E%3Ccircle cx='168' cy='219' r='0.7' fill='%23050403'/%3E%3Cpath d='M174 122Q177 116 175 116' stroke='%23050403' stroke-width='.8' fill='none'/%3E%3Ccircle cx='205' cy='66' r='1.6' fill='%23050403'/%3E%3Cpath d='M206 226Q206 229 209 229' stroke='%23050403' stroke-width='.8' fill='none'/%3E%3Cpath d='M311 30Q303 24 307 23' stroke='%23050403' stroke-width='.8' fill='none'/%3E%3Ccircle cx='28' cy='119' r='1.4' fill='%23050403'/%3E%3Ccircle cx='187' cy='281' r='0.9' fill='%23050403'/%3E%3Cpath d='M350 210Q349 211 357 219' stroke='%23050403' stroke-width='.8' fill='none'/%3E%3Cpath d='M389 7Q389 10 400 -1' stroke='%23050403' stroke-width='.8' fill='none'/%3E%3Ccircle cx='384' cy='261' r='1.6' fill='%23050403'/%3E%3Ccircle cx='123' cy='2' r='1.7' fill='%23050403'/%3E%3Ccircle cx='380' cy='154' r='0.7' fill='%23050403'/%3E%3Ccircle cx='180' cy='69' r='0.8' fill='%23050403'/%3E%3Ccircle cx='200' cy='38' r='0.7' fill='%23050403'/%3E%3Cpath d='M13 235Q15 232 5 238' stroke='%23050403' stroke-width='.8' fill='none'/%3E%3Cpath d='M133 264Q136 264 137 270' stroke='%23050403' stroke-width='.8' fill='none'/%3E%3Ccircle cx='274' cy='235' r='1.0' fill='%23050403'/%3E%3Ccircle cx='118' cy='266' r='1.4' fill='%23050403'/%3E%3Ccircle cx='174' cy='113' r='1.8' fill='%23050403'/%3E%3C/svg%3E");opacity:.7;animation:dust2 .62s steps(1) infinite}
@keyframes dust{0%{background-position:0 0;opacity:.55}25%{background-position:37% 61%;opacity:.25}50%{background-position:-48% 23%;opacity:.6}75%{background-position:71% -39%;opacity:0}}
@keyframes dust2{0%{background-position:0 0}33%{background-position:-29% 44%;opacity:0}66%{background-position:53% -17%;opacity:.7}}
.film-screen .edgeburn{position:absolute;z-index:6;width:34cqw;aspect-ratio:1;border-radius:50%;pointer-events:none;opacity:0;filter:url(#film-melt);transform:translate(-50%,-50%) scale(.2);
  background:radial-gradient(circle,#FFFDF6 0 16%,#F1DFB0 26%,#C49A5C 34%,#5A3A1C 42%,rgba(15,8,3,.92) 48%,rgba(15,8,3,0) 57%)}
.film-screen .edgeburn.on{animation:edgeburn .85s ease-out both}
@keyframes edgeburn{0%{opacity:0;transform:translate(-50%,-50%) scale(.15)}12%{opacity:1}55%{opacity:1;transform:translate(-50%,-50%) scale(.85)}70%{opacity:.4}78%{opacity:.9}100%{opacity:0;transform:translate(-50%,-50%) scale(1.05)}}
.film-screen[data-kind=final] .dust,.film-screen[data-kind=final] .edgeburn{display:none}
.film-screen[data-kind=final] .reel{animation:none}
/* bigger, brighter coil arcs */
#film .fig.tesla .fig-svg{overflow:visible}
#film .arcs .o{stroke:rgba(220,222,245,.12);stroke-width:12}
#film .arcs .g{stroke:rgba(228,230,248,.38);stroke-width:5.5}
#film .arcs .c{stroke:#FFFFFF;stroke-width:2.1}
#film .halo{r:46px}
#film .arcs[data-hit="1"] ~ .halo,#film .bulb.lit ~ .halo{opacity:1}
@media (prefers-reduced-motion:reduce){.film-screen .scratch,.film-screen .dust,.film-screen .edgeburn{display:none}.reel{animation:none}}

/* sound toggle (piano accompaniment): muted by default */
.film-snd svg{width:18px;height:18px;display:block}
.film-snd .on{display:none}.film-snd[aria-pressed=true] .on{display:inline}.film-snd[aria-pressed=true] .off{display:none}
.film-snd[aria-pressed=true]{background:var(--ink);color:var(--cream)}
.film-btn.film-snd{padding:0;margin-right:4px}