/* Supracited v9 kit "explode" (SIGNATURE-HEROES-SPEC-V9 4.10): the exploded number on /method; copied by site/build_sig.py.
   v3: no sheet change; the hover-selection fix is in the script, carried forward unchanged under the new version. */
@property --k{syntax:'<number>';inherits:false;initial-value:1}
@property --zz{syntax:'<length>';inherits:false;initial-value:0px}
@property --sc{syntax:'<number>';inherits:false;initial-value:1}
.sg--explode .sg-say:empty{display:none}
.ex-box{position:relative}
.ex-stack{display:grid;gap:1rem}
.ex-p{position:relative;box-sizing:border-box;padding:1.25rem 1.4rem;background:#fff;border:1px solid var(--sg-hair);border-radius:16px;
color:var(--sg-ink);transition:border-color .2s,box-shadow .2s}
.ex-p.on{border-color:var(--sg-gold);box-shadow:inset 0 0 0 1px var(--sg-gold)}
.ex-l{margin:0 0 .5rem;font-size:15px;font-weight:600;line-height:1.4;color:var(--sg-teal)}
.ex-v p{margin:0}
.ex-tx{margin:.75rem 0 0;font-size:16px;line-height:1.55;color:var(--sg-muted)}
.ex-big{font-size:clamp(3.25rem,2.6rem + 2vw,4.5rem);font-weight:700;line-height:1;letter-spacing:-.03em}
.ex-v .ex-key{margin-top:.5rem;font-size:16px;font-weight:600;line-height:1.4}
.ex-dots{display:grid;gap:5px}
.ex-r{display:flex;gap:5px}
.ex-d{width:10px;height:10px;border-radius:50%;box-sizing:border-box;border:1.25px solid var(--sg-ring)}
.ex-d.on{background:var(--sg-teal);border-color:var(--sg-teal)}
.ex-v .ex-cap{margin-top:.75rem;font-size:16px;font-weight:600;line-height:1.4}
.ex-sv{display:block;width:100%;height:14px;overflow:visible}
.ex-rt{fill:var(--sg-track)}.ex-rb{fill:var(--sg-tint)}.ex-rk{stroke:var(--sg-gold-deep);stroke-width:2}
.ex-v .ex-rl{position:relative;height:1.5em;margin-top:.5rem;font-size:15px;font-weight:600;line-height:1.5}
.ex-rl span{position:absolute;top:0;transform:translateX(-50%);white-space:nowrap}
.ex-rl span:last-child{transform:translateX(-100%)}
.ex-v .ex-a{margin:0;font-size:18px;font-weight:600;line-height:1.4;color:var(--sg-ink);max-width:none}
.ex-dt{font-size:18px;font-weight:600;line-height:1.4}
.ex-side,.ex-ld{display:none}
.ex-calls{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.ex-c{display:inline-flex;align-items:center;min-height:2.75rem;padding:0 1rem;border:1px solid var(--sg-hair);border-radius:999px;background:#fff;
color:var(--sg-ink);font:inherit;font-size:15px;font-weight:600;line-height:1.2;cursor:pointer;transition:border-color .2s,background-color .2s,color .2s}
.ex-c.cur{border-color:var(--sg-teal)}
.ex-c[aria-pressed="true"]{background:var(--sg-teal);border-color:var(--sg-teal);color:#fff}
.ex-c:focus-visible{outline:2px solid var(--sg-teal);outline-offset:2px}
.ex-t{display:grid;margin-top:1.25rem}
.ex-tt{grid-area:1/1;margin:0;font-size:16px;line-height:1.55;color:var(--sg-ink);visibility:hidden}
.ex-tt.on{visibility:visible}
@media (min-width:45rem){.ex-stack{grid-template-columns:repeat(2,minmax(0,1fr))}.ex-p.p0{grid-column:1/-1}}
@media (scripting:none){.sg--explode .sg-stage{display:none}}
@media (min-width:45rem) and (prefers-reduced-motion:no-preference) and (scripting:enabled){
.sg--explode:not(.ex-flat) .sg-stage{display:grid;grid-template-columns:minmax(0,1fr) 18rem;column-gap:clamp(1.5rem,3vw,3rem);align-items:center}
.sg--explode:not(.ex-flat) .ex-box{height:31rem;perspective:1400px;perspective-origin:50% 76%;--pw:clamp(15rem,26vw,22rem)}
.sg--explode:not(.ex-flat) .ex-stack{display:block;position:absolute;left:50%;top:76%;width:0;height:0;transform-style:preserve-3d;--rz:-28deg}
.sg--explode:not(.ex-flat) .ex-p{position:absolute;left:calc(var(--pw) / -2);top:calc(var(--pw) * -.2727);width:var(--pw);height:calc(var(--pw) * .5455);
padding:1.1rem 1.25rem;display:flex;flex-direction:column;justify-content:center;
box-shadow:0 1px 2px rgba(12,23,21,.05),0 14px 30px -18px rgba(12,23,21,.25);--zz:calc(var(--d) * 1px);
transform:rotateX(calc(52deg * var(--k))) rotateZ(calc(var(--rz) * var(--k))) translateZ(var(--zz)) scale(var(--sc));
transition:--zz .9s cubic-bezier(.33,1,.68,1) calc(var(--n) * 70ms),--k .42s ease,--sc .42s ease,opacity .3s,border-color .2s,box-shadow .2s}
.sg--explode:not(.ex-flat) .ex-p.on{box-shadow:inset 0 0 0 1px var(--sg-gold),0 24px 50px -20px rgba(12,23,21,.35)}
.sg--explode.ex-open:not(.ex-flat) .ex-p{--zz:calc(var(--d) * var(--pw) * .21)}
.sg--explode.ex-lead .ex-p{transition-delay:0s}
/* forward of every tilted corner (z 360px), scaled so it reads at 1.04 of its size: 1.04 x (1400 - 360) / 1400 */
.sg--explode:not(.ex-flat) .ex-p.on{--k:0;--zz:360px;--sc:.773;transition:--zz .42s ease,--k .42s ease,--sc .42s ease,opacity .3s,border-color .2s,box-shadow .2s}
.sg--explode.ex-act:not(.ex-flat) .ex-p:not(.on){opacity:.45}
/* at rest a lower plate shows only its front strip, so its contents sit there (v9 WP-4); they move by transform
   only (--ey, set by the kit), so a swing never re-lays them out (CLS 0) */
.sg--explode.ex-ey:not(.ex-flat) .ex-p>:is(.ex-l,.ex-v){transition:transform .42s ease}
.sg--explode:not(.ex-flat) .ex-p:not(.p0):not(.on)>:is(.ex-l,.ex-v){transform:translateY(var(--ey,0px))}
.sg--explode:not(.ex-flat) .ex-tx{display:none}
.sg--explode:not(.ex-flat) .ex-l{visibility:hidden;margin:0 0 .4rem}.sg--explode:not(.ex-flat) .ex-p.on .ex-l{visibility:visible}
.sg--explode:not(.ex-flat) .ex-side{display:block;position:relative;z-index:2}
.sg--explode:not(.ex-flat) .ex-ld{display:block;position:absolute;left:0;top:0;z-index:1;width:100px;height:1px;background:var(--sg-ring);
transform-origin:0 50%;transform:translate(var(--lx,0),var(--ly,0)) rotate(var(--la,0)) scaleX(var(--ls,0));opacity:0;pointer-events:none}
.sg--explode.ex-lead:not(.ex-flat) .ex-ld{opacity:1;transition:opacity .2s}
.sg--explode.ex-act:not(.ex-flat) .ex-ld{opacity:.35}
.sg--explode:not(.ex-flat) .ex-big{font-size:clamp(3rem,1.6rem + 2.4vw,4.5rem)}
.sg--explode:not(.ex-flat) .ex-dots{gap:4px}.sg--explode:not(.ex-flat) .ex-r{gap:4px}
.sg--explode:not(.ex-flat) .ex-v .ex-cap,.sg--explode:not(.ex-flat) .ex-v .ex-rl{margin-top:.5rem}}
.ex-p.p0{--d:4;--n:0}.ex-p.p1{--d:3;--n:1}.ex-p.p2{--d:2;--n:2}.ex-p.p3{--d:1;--n:3}.ex-p.p4{--d:0;--n:4}
.ex-x0{left:0%}.ex-x1{left:1%}.ex-x2{left:2%}.ex-x3{left:3%}.ex-x4{left:4%}.ex-x5{left:5%}.ex-x6{left:6%}.ex-x7{left:7%}.ex-x8{left:8%}.ex-x9{left:9%}.ex-x10{left:10%}.ex-x11{left:11%}.ex-x12{left:12%}.ex-x13{left:13%}.ex-x14{left:14%}.ex-x15{left:15%}.ex-x16{left:16%}.ex-x17{left:17%}.ex-x18{left:18%}.ex-x19{left:19%}.ex-x20{left:20%}.ex-x21{left:21%}.ex-x22{left:22%}.ex-x23{left:23%}.ex-x24{left:24%}.ex-x25{left:25%}.ex-x26{left:26%}.ex-x27{left:27%}.ex-x28{left:28%}.ex-x29{left:29%}.ex-x30{left:30%}.ex-x31{left:31%}.ex-x32{left:32%}.ex-x33{left:33%}.ex-x34{left:34%}.ex-x35{left:35%}.ex-x36{left:36%}.ex-x37{left:37%}.ex-x38{left:38%}.ex-x39{left:39%}.ex-x40{left:40%}.ex-x41{left:41%}.ex-x42{left:42%}.ex-x43{left:43%}.ex-x44{left:44%}.ex-x45{left:45%}.ex-x46{left:46%}.ex-x47{left:47%}.ex-x48{left:48%}.ex-x49{left:49%}.ex-x50{left:50%}.ex-x51{left:51%}.ex-x52{left:52%}.ex-x53{left:53%}.ex-x54{left:54%}.ex-x55{left:55%}.ex-x56{left:56%}.ex-x57{left:57%}.ex-x58{left:58%}.ex-x59{left:59%}.ex-x60{left:60%}.ex-x61{left:61%}.ex-x62{left:62%}.ex-x63{left:63%}.ex-x64{left:64%}.ex-x65{left:65%}.ex-x66{left:66%}.ex-x67{left:67%}.ex-x68{left:68%}.ex-x69{left:69%}.ex-x70{left:70%}.ex-x71{left:71%}.ex-x72{left:72%}.ex-x73{left:73%}.ex-x74{left:74%}.ex-x75{left:75%}.ex-x76{left:76%}.ex-x77{left:77%}.ex-x78{left:78%}.ex-x79{left:79%}.ex-x80{left:80%}.ex-x81{left:81%}.ex-x82{left:82%}.ex-x83{left:83%}.ex-x84{left:84%}.ex-x85{left:85%}.ex-x86{left:86%}.ex-x87{left:87%}.ex-x88{left:88%}.ex-x89{left:89%}.ex-x90{left:90%}.ex-x91{left:91%}.ex-x92{left:92%}.ex-x93{left:93%}.ex-x94{left:94%}.ex-x95{left:95%}.ex-x96{left:96%}.ex-x97{left:97%}.ex-x98{left:98%}.ex-x99{left:99%}.ex-x100{left:100%}
@media (max-width:44.99rem),(prefers-reduced-motion:reduce){.sg--explode .sg-hint{display:none}}
.sg--explode.ex-flat .sg-hint{display:none}
