@font-face{font-family:'Bricolage Grotesque Variable';font-style:normal;font-weight:200 800;font-display:swap;src:url(/fonts/bricolage-grotesque-latin-wght-normal-a97804dc.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Atkinson Hyperlegible';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/atkinson-hyperlegible-latin-400-normal-d64ba838.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Atkinson Hyperlegible';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/atkinson-hyperlegible-latin-700-normal-140e2bd2.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

@font-face{font-family:'SM Figures';font-style:normal;font-weight:200 800;font-display:swap;src:url(/fonts/bricolage-grotesque-latin-wght-normal-a97804dc.woff2) format('woff2');unicode-range:U+0030-0039}

:root{
  --ink:#221A5C; --ink2:#3A3378; --mute:#57527F; --faint:#645F8A;
  --paper:#FFFFFF; --ground:#FFF6E5; --band:#F3EEFF; --panel:#FFFDF8;
  --rule:#E3DDF3; --rule-strong:#221A5C; --soft:#E6E0F5;
  --sky:#8FD2FF; --sky-lo:#D4EEFF; --sky2:#62B9FF;
  --indigo:#4B3FD1; --indigo-deep:#3A2FB0; --tang:#FF7A45; --sun:#FFC53D; --mint:#4DD39E; --pink:#FF8FB8; --grass:#57C98E; --grass-deep:#2FA46C;
  --wash:#EEEBFF;
  --line:2px solid var(--ink);
  --drop:5px 5px 0 var(--ink);
  --sans:"SM Figures","Atkinson Hyperlegible","Helvetica Neue",Arial,sans-serif;
  --serif:"Bricolage Grotesque Variable","Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;
  --mono:var(--sans);
  --frame:78rem; --pad:1.5rem; --measure:44rem; --sky-h:31rem;
  --banner:url(/decor/banner-home-cdb37d6e.webp);
}

body:has(.crumbs a[href="/animation-tools/"]),body:has(.mh-nav a[aria-current][href="/animation-tools/"]){--banner:url(/decor/banner-tools-84663be7.webp)}
body:has(.crumbs a[href="/series-features/"]),body:has(.mh-nav a[aria-current][href="/series-features/"]){--banner:url(/decor/banner-features-c2b75ac2.webp)}
body:has(.crumbs a[href="/tool-pairs/"]),body:has(.mh-nav a[aria-current][href="/tool-pairs/"]){--banner:url(/decor/banner-pairs-a454e28a.webp)}
body:has(.crumbs a[href="/animation-questions/"]),body:has(.mh-nav a[aria-current][href="/animation-questions/"]){--banner:url(/decor/banner-questions-3a65be18.webp)}
body:has(.crumbs a[href="/animation-terms/"]),body:has(.mh-nav a[aria-current][href="/animation-terms/"]){--banner:url(/decor/banner-terms-a8960cc0.webp)}
body:has(.crumbs a[href="/series-notes/"]),body:has(.mh-nav a[aria-current][href="/series-notes/"]){--banner:url(/decor/banner-notes-628bc19d.webp)}
body:has(.crumbs a[href="/how-tools-are-read/"]),body:has(.mh-nav a[aria-current][href="/how-tools-are-read/"]){--banner:url(/decor/banner-method-f64c7614.webp)}
body:has(.crumbs a[href="/datasets/"]),body:has(.mh-nav a[aria-current][href="/datasets/"]){--banner:url(/decor/banner-datasets-f8b89681.webp)}

body:has(.hero){--sky-h:41rem}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:1.5rem}
body{position:relative;margin:0;overflow-x:clip;color:var(--ink);font:400 17px/1.7 var(--sans);font-variant-numeric:tabular-nums;
  background:radial-gradient(circle,rgba(75,63,209,.09) 1.3px,transparent 1.7px) 0 0/19px 19px,var(--ground)}

body::before{content:"";position:absolute;z-index:-1;left:0;right:0;top:0;height:var(--sky-h);pointer-events:none;
  background:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'><path d='M0 120V66c90-30 190-48 300-40s200 44 320 42 210-52 330-54 210 34 300 38 130-10 190-18V120z' fill='%2357C98E'/><path d='M0 120V92c140-26 280-30 420-14s260 26 400 14 260-30 380-26 170 12 240 18V120z' fill='%232FA46C'/><path d='M0 120v-8h1440v8z' fill='%23FFF6E5'/></svg>") 0 100%/100% 7.5rem no-repeat,
    radial-gradient(ellipse 5.5rem 2.1rem at 1.5% 62%,#FFFFFF 60%,rgba(255,255,255,0) 62%),
    radial-gradient(ellipse 3.4rem 2.5rem at 4% 56%,#FFFFFF 60%,rgba(255,255,255,0) 62%),
    radial-gradient(ellipse 6.5rem 2.3rem at 98.5% 30%,rgba(255,255,255,.92) 60%,rgba(255,255,255,0) 62%),
    radial-gradient(ellipse 4rem 2.7rem at 96% 25%,rgba(255,255,255,.92) 60%,rgba(255,255,255,0) 62%),
    radial-gradient(ellipse 4.4rem 1.5rem at 60% 74%,rgba(255,255,255,.75) 60%,rgba(255,255,255,0) 62%),
    radial-gradient(circle,rgba(255,255,255,.35) 1.3px,transparent 1.7px) 0 0/19px 19px,
    linear-gradient(180deg,var(--sky) 0,var(--sky-lo) 78%,#E9F6FF 100%);
  animation:skyin 1.1s ease-out both}
a{color:inherit;text-decoration:none}
p a,li a,td a,dd a{text-decoration:underline;text-decoration-color:var(--tang);text-decoration-thickness:2.5px;text-underline-offset:3px}
p a:hover,li a:hover,td a:hover,dd a:hover{color:var(--indigo);text-decoration-style:wavy}
::selection{background:var(--sun);color:var(--ink)}

.skip{position:absolute;left:-999px;top:0;background:var(--indigo);color:#fff;padding:.5rem .8rem;z-index:50}
.skip:focus{left:.5rem}

.masthead{padding:1rem var(--pad) 0}
.mh{max-width:var(--frame);margin:0 auto;padding:.6rem .7rem .6rem .9rem;display:flex;align-items:center;flex-wrap:wrap;gap:.5rem 1.4rem;
  background:var(--indigo);border:var(--line);border-radius:999px;box-shadow:0 5px 0 var(--ink)}
.brand{display:flex;align-items:center;gap:.6rem;font:800 1.35rem/1 var(--serif);letter-spacing:-.02em;color:#FFFFFF}
.mark{display:inline-flex;width:2.4rem;height:2.4rem;border-radius:46% 54% 42% 58% / 55% 45% 55% 45%;background:var(--sun);color:var(--ink);border:var(--line);
  align-items:center;justify-content:center;transform:rotate(-8deg);transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.brand:hover .mark{transform:rotate(8deg) scale(1.08)}
.mark svg{width:1.35rem;height:1.35rem}
.mh-tag{margin:0;font:400 .8rem/1.3 var(--sans);color:#D8D3FF;flex:1 1 13rem}
.mh-nav{display:flex;flex-wrap:wrap;gap:.2rem;font:700 .84rem/1 var(--sans);margin-left:auto}
.mh-nav a{padding:.55rem .82rem;border-radius:999px;color:#FFFFFF;transition:background .2s,transform .2s}
.mh-nav a:hover{background:rgba(255,255,255,.16);transform:translateY(-1px)}
.mh-nav a[aria-current=page]{background:var(--sun);color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}

.sheet{max-width:var(--frame);margin:0 auto;padding:1.5rem var(--pad) 4rem;display:grid;grid-template-columns:12.5rem minmax(0,1fr);gap:2.8rem}
.rail{grid-column:1;grid-row:1;position:sticky;top:1.3rem;align-self:start;margin-top:3rem;font:400 .86rem/1.5 var(--sans);color:var(--ink2)}
.column{grid-column:2;grid-row:1;min-width:0}
.rl,.rl-figs{display:none}
.secnav{padding:.9rem .7rem .7rem;background:var(--paper);border:var(--line);border-radius:22px;box-shadow:5px 5px 0 var(--mint)}
.rl-h{display:flex;align-items:center;gap:.5rem;margin:0 0 .55rem .2rem;font:800 1rem/1 var(--serif);color:var(--ink)}
.rl-h::before{content:"";width:.95rem;height:.95rem;border-radius:46% 54% 42% 58% / 55% 45% 55% 45%;background:var(--tang);border:var(--line)}
.secnav ol{list-style:none;margin:0;padding:0}
.secnav li{margin:0}
.secnav a{display:grid;grid-template-columns:1.7rem minmax(0,1fr);gap:.45rem;align-items:start;padding:.36rem .3rem;border-radius:12px;color:var(--ink2);font-weight:700;text-decoration:none;transition:background .2s,color .2s}
.secnav a i{display:inline-flex;align-items:center;justify-content:center;width:1.55rem;height:1.55rem;border-radius:46% 54% 42% 58% / 55% 45% 55% 45%;background:var(--sun);border:1.5px solid var(--ink);color:var(--ink);font:800 .72rem/1 var(--serif);font-style:normal}
.secnav li:nth-child(4n+2) a i{background:var(--mint)}
.secnav li:nth-child(4n+3) a i{background:var(--pink)}
.secnav li:nth-child(4n) a i{background:var(--sky)}
.secnav a:hover{background:var(--band);color:var(--indigo)}

.sheet:has(.hero),.sheet:has(.crumbs a:only-of-type){grid-template-columns:minmax(0,1fr)}
.sheet:has(.hero) .rail,.sheet:has(.crumbs a:only-of-type) .rail{display:none}
.sheet:has(.hero) .column,.sheet:has(.crumbs a:only-of-type) .column{grid-column:1}

.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem .5rem;font:700 .82rem/1.2 var(--sans);color:var(--ink2);margin:.2rem 0 1.2rem}
.crumbs a{color:var(--ink);text-decoration:underline wavy var(--tang) 1.5px;text-underline-offset:5px}
.crumbs a:hover{color:var(--indigo)}
.sheet:has(.hero) .crumbs{display:none}

main#doc:not(:has(.hero)){--blob:17rem;display:grid;grid-template-columns:minmax(0,1fr) var(--blob);column-gap:2.8rem;align-content:start}
main#doc:not(:has(.hero))>*{grid-column:1/-1;min-width:0}
main#doc:not(:has(.hero))>h1{grid-column:1;grid-row:1;align-self:end}
main#doc:not(:has(.hero))>h1+*{grid-column:1;grid-row:2}
main#doc:not(:has(.hero))::before{content:"";grid-column:2;grid-row:1/span 2;align-self:center;justify-self:center;display:block;width:100%;aspect-ratio:1;margin:0 0 1.4rem;
  background:var(--banner) center/cover no-repeat,var(--sky);border:3px solid var(--ink);
  border-radius:62% 38% 54% 46% / 43% 57% 43% 57%;box-shadow:9px 11px 0 var(--pink);
  animation:pop .9s cubic-bezier(.3,1.4,.5,1) both,morph 16s ease-in-out 1s infinite alternate}

main#doc:not(:has(.hero))::after{content:"";grid-column:2;grid-row:1/span 2;align-self:center;justify-self:start;display:block;width:3.4rem;height:3.4rem;margin:0 0 1.4rem;
  transform:translate(.2rem,calc(var(--blob) / -2 + 1.2rem));
  border-radius:46% 54% 42% 58% / 55% 45% 55% 45%;border:var(--line);box-shadow:3px 3px 0 var(--ink);
  background:radial-gradient(circle at 35% 35%,#FFE38A 0 30%,rgba(255,227,138,0) 31%),var(--sun);
  animation:pop .8s .35s cubic-bezier(.3,1.6,.5,1) both,bob 5s 1.2s ease-in-out infinite alternate}
main#doc>*{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
main#doc>:nth-child(1){animation-delay:.05s} main#doc>:nth-child(2){animation-delay:.14s} main#doc>:nth-child(3){animation-delay:.22s}
main#doc>:nth-child(n+4){animation-delay:.3s}

main#doc>p,main#doc>ul:not(.castgrid):not(.featgrid):not(.entries):not(.facts),main#doc>ol,main#doc>blockquote,main#doc>.clause{max-width:var(--measure)}
h1{font:800 clamp(2.2rem,4.1vw,3.5rem)/1.03 var(--serif);letter-spacing:-.035em;margin:0 0 1.3rem;max-width:20ch;text-wrap:balance;text-shadow:3px 3px 0 #FFFFFF}
h2{display:flex;align-items:center;gap:.85rem;font:800 1.7rem/1.15 var(--serif);letter-spacing:-.025em;margin:3.6rem 0 1.2rem;padding-bottom:.7rem;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 10'><path d='M2 6c8-6 12 4 20 0s12-6 20 0 12 4 20 0 12-6 20 0 12 4 20 0 12-6 16-1' fill='none' stroke='%23FF7A45' stroke-width='3' stroke-linecap='round'/></svg>") 3.45rem 100%/6.5rem .6rem no-repeat}
h2 .secno{flex:none;display:inline-flex;align-items:center;justify-content:center;width:2.65rem;height:2.65rem;border-radius:46% 54% 42% 58% / 55% 45% 55% 45%;
  background:var(--indigo);border:var(--line);box-shadow:3px 3px 0 var(--ink);color:#FFFFFF;font:800 1.08rem/1 var(--serif);letter-spacing:0;text-decoration:none;transform:rotate(-6deg)}
h2:nth-of-type(4n+2) .secno{background:var(--tang);color:var(--ink);transform:rotate(5deg)}
h2:nth-of-type(4n+3) .secno{background:var(--mint);color:var(--ink);transform:rotate(-3deg)}
h2:nth-of-type(4n) .secno{background:var(--sun);color:var(--ink);transform:rotate(7deg)}
h3{font:800 1.16rem/1.3 var(--serif);margin:1.9rem 0 .55rem}
p{margin:0 0 1rem}
ul,ol{margin:0 0 1.1rem;padding-left:1.25rem}
li{margin:.3rem 0}
main#doc>ul:not([class]){list-style:none;padding-left:0}
main#doc>ul:not([class])>li{position:relative;padding-left:1.6rem}
main#doc>ul:not([class])>li::before{content:"";position:absolute;left:0;top:.45em;width:.8rem;height:.8rem;border-radius:46% 54% 42% 58% / 55% 45% 55% 45%;background:var(--sun);border:1.5px solid var(--ink)}

.answer{position:relative;margin:0 0 2rem;max-width:var(--measure);padding:1.1rem 1.35rem 1.15rem;background:var(--paper);border:var(--line);border-radius:22px;box-shadow:6px 6px 0 var(--sun);
  font:400 1.08rem/1.62 var(--sans);color:var(--ink)}
.asof{display:inline-block;margin-left:.35rem;padding:.14rem .6rem;border-radius:999px;background:var(--mint);border:1.5px solid var(--ink);font:700 .72rem/1.4 var(--sans);color:var(--ink);vertical-align:middle;white-space:nowrap}
.answer .asof{display:block;width:max-content;margin:.75rem 0 0}

.hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(18rem,.9fr);gap:3rem;align-items:center;padding:1.2rem 0 1.6rem}
.hero h1{font-size:clamp(2.5rem,5.2vw,4rem);max-width:15ch}
.eyebrow{display:inline-block;margin:0 0 1rem;padding:.42rem .85rem;background:var(--sun);border:var(--line);border-radius:999px;box-shadow:3px 3px 0 var(--ink);
  font:700 .8rem/1 var(--sans);color:var(--ink);transform:rotate(-2deg)}
.hero-art{position:relative;width:100%;max-width:31rem;justify-self:center;aspect-ratio:1}
.hero-art svg{display:none}
.hero-art::before{content:"";position:absolute;inset:0;background:var(--banner) center/cover no-repeat,var(--sky);border:3px solid var(--ink);
  border-radius:62% 38% 54% 46% / 43% 57% 43% 57%;box-shadow:12px 14px 0 var(--pink);animation:pop 1s cubic-bezier(.3,1.4,.5,1) both,morph 16s ease-in-out 1s infinite alternate}
.hero-art::after{content:"";position:absolute;left:-.4rem;top:1.2rem;width:4.6rem;height:4.6rem;border-radius:46% 54% 42% 58% / 55% 45% 55% 45%;border:var(--line);box-shadow:4px 4px 0 var(--ink);
  background:radial-gradient(circle at 35% 35%,#FFE38A 0 30%,rgba(255,227,138,0) 31%),var(--sun);animation:pop .8s .4s cubic-bezier(.3,1.6,.5,1) both,bob 5s 1.2s ease-in-out infinite alternate}
.cta{display:flex;flex-wrap:wrap;gap:.8rem;margin:.4rem 0 0}
.btn{display:inline-block;padding:.85rem 1.3rem;border-radius:16px;background:var(--tang);color:var(--ink) !important;border:var(--line);box-shadow:4px 4px 0 var(--ink);
  font:800 .98rem/1 var(--serif);text-decoration:none !important;transition:transform .2s cubic-bezier(.3,1.6,.5,1),box-shadow .2s}
.btn:hover{transform:translate(-2px,-2px) rotate(-1deg);box-shadow:6px 6px 0 var(--ink)}
.btn.ghost{background:var(--paper);color:var(--ink) !important}
ul.castgrid,ul.featgrid{list-style:none;padding:0;margin:1.3rem 0 1.6rem;display:grid;gap:1.1rem 1.2rem}
ul.castgrid{grid-template-columns:repeat(auto-fill,minmax(15rem,1fr))}
ul.featgrid{grid-template-columns:repeat(auto-fill,minmax(13.5rem,1fr))}
ul.castgrid li,ul.featgrid li{margin:0}
ul.castgrid a,ul.featgrid a{display:flex;flex-direction:column;gap:.25rem;height:100%;padding:1.05rem 1.15rem;background:var(--paper);border:var(--line);
  border-radius:20px;box-shadow:5px 5px 0 var(--sun);text-decoration:none;transition:transform .25s cubic-bezier(.3,1.5,.5,1),box-shadow .25s}
ul.castgrid li:nth-child(4n+2) a,ul.featgrid li:nth-child(4n+2) a{box-shadow:5px 5px 0 var(--mint)}
ul.castgrid li:nth-child(4n+3) a,ul.featgrid li:nth-child(4n+3) a{box-shadow:5px 5px 0 var(--pink)}
ul.castgrid li:nth-child(4n) a,ul.featgrid li:nth-child(4n) a{box-shadow:5px 5px 0 var(--sky2)}
ul.castgrid a:hover,ul.featgrid a:hover{transform:translate(-3px,-3px) rotate(-.8deg);box-shadow:8px 8px 0 var(--ink)}
.blob{width:3.1rem;height:3.1rem;border-radius:46% 54% 42% 58% / 55% 45% 55% 45%;display:flex;align-items:center;border:var(--line);
  justify-content:center;font:800 1rem/1 var(--serif);margin-bottom:.45rem}
.blob.b0{background:var(--sun)}
.blob.b1{background:var(--mint)}
.blob.b2{background:#C9C2FF}
.blob.b3{background:#FFB59A}
.castgrid .nm,.featgrid .nm{font:800 1.12rem/1.2 var(--serif);color:var(--ink)}
.castgrid .kd,.featgrid .kd{font-size:.84rem;color:var(--mute)}
.castgrid .kd::first-letter{text-transform:uppercase}
.traits{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.6rem}
.traits i{font-style:normal;font:700 .7rem/1.3 var(--sans);padding:.2rem .55rem;border-radius:999px;background:var(--band);border:1px solid var(--soft);color:var(--ink2)}
.featgrid b{display:inline-flex;width:2.2rem;height:2.2rem;align-items:center;justify-content:center;border-radius:46% 54% 42% 58% / 55% 45% 55% 45%;background:var(--indigo);border:var(--line);
  color:#FFFFFF;font:800 .95rem/1 var(--serif);margin-bottom:.45rem}
ul.featgrid li:nth-child(4n+2) b{background:var(--tang);color:var(--ink)}
ul.featgrid li:nth-child(4n+3) b{background:var(--mint);color:var(--ink)}
ul.featgrid li:nth-child(4n) b{background:var(--sun);color:var(--ink)}

.statusbox{display:grid;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));gap:.8rem;margin:1.4rem 0 1.8rem}
.sb-row{padding:.75rem .9rem .8rem;background:var(--paper);border:var(--line);border-radius:16px;box-shadow:3px 3px 0 var(--soft)}
.statusbox dt{display:flex;align-items:center;gap:.4rem;font:700 .68rem/1.2 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--indigo)}
.statusbox dt::before{content:"";flex:none;width:.55rem;height:.55rem;border-radius:50%;background:var(--sun);border:1.5px solid var(--ink)}
.statusbox dd{margin:.35rem 0 0;font:400 .93rem/1.42 var(--sans);color:var(--ink2)}
ul.facts{list-style:none;padding:0;margin:1.2rem 0 1.9rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(19rem,1fr));gap:1rem}
li.fact{position:relative;display:flex;flex-direction:column;gap:.45rem;padding:1rem 1.15rem 1.05rem;margin:0;background:var(--paper);border:var(--line);border-radius:20px;box-shadow:5px 5px 0 var(--sky2);transition:transform .25s cubic-bezier(.3,1.5,.5,1),box-shadow .25s}
li.fact:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--ink)}
li.fact .tag{align-self:flex-start;padding:.18rem .6rem;border-radius:999px;background:var(--sun);border:1.5px solid var(--ink);font-size:.68rem;line-height:1.45;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink)}
li.fact .fv{display:flex;flex-direction:column;gap:.15rem;min-width:0}
li.fact .val{font:800 1.04rem/1.4 var(--serif)}
li.fact .note{font-size:.88rem;color:var(--ink2)}
li.fact .meta{margin-top:.2rem;padding-top:.45rem;border-top:2px dotted var(--soft);font-size:.74rem;color:var(--faint)}
li.fact .meta .sep{margin:0 .3rem;color:var(--soft)}

blockquote{position:relative;margin:1.6rem 0 2.4rem;padding:1.1rem 1.35rem 1.1rem 3.6rem;background:var(--paper);border:var(--line);border-radius:26px;box-shadow:5px 5px 0 var(--pink);
  font:400 1.04rem/1.6 var(--sans);color:var(--ink)}
blockquote::before{content:"\201C";position:absolute;left:.85rem;top:.95rem;display:flex;align-items:center;justify-content:center;width:1.9rem;height:1.9rem;padding-top:.5rem;
  border-radius:46% 54% 42% 58% / 55% 45% 55% 45%;background:var(--sun);border:1.5px solid var(--ink);font:800 1.6rem/1 var(--serif);color:var(--ink)}
blockquote::after{content:"";position:absolute;left:2.4rem;bottom:-11px;width:20px;height:20px;background:var(--paper);border-right:var(--line);border-bottom:var(--line);transform:rotate(45deg) skew(12deg,12deg)}
blockquote p{margin:0 0 .35rem}
blockquote cite{font:normal 700 .74rem/1.3 var(--sans);color:var(--mute)}

.chart,.fig-dia,.tablewrap{
  background:linear-gradient(90deg,var(--paper) 2rem,rgba(255,255,255,0) 2.8rem) 0 0/2.8rem 100% no-repeat local,
             linear-gradient(270deg,var(--paper) 2rem,rgba(255,255,255,0) 2.8rem) 100% 0/2.8rem 100% no-repeat local,
             url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='12' r='10.5' fill='%23FFC53D' stroke='%23221A5C' stroke-width='2'/><path d='M7 12h9m-3.5-4 4 4-4 4' fill='none' stroke='%23221A5C' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/></svg>") calc(100% - .55rem) var(--cue-y,.55rem)/var(--cue-s,1.45rem) var(--cue-s,1.45rem) no-repeat scroll,
             radial-gradient(farthest-side at 100% 50%,rgba(34,26,92,.16),rgba(34,26,92,0)) 100% 0/1rem 100% no-repeat scroll,
             radial-gradient(farthest-side at 0 50%,rgba(34,26,92,.16),rgba(34,26,92,0)) 0 0/1rem 100% no-repeat scroll,
             var(--paper)}

.tablewrap{overflow-x:auto;margin:1.4rem 0 .7rem;border:var(--line);border-radius:20px;box-shadow:5px 5px 0 var(--mint)}
table{width:100%;border-collapse:collapse;font-size:.9rem}
caption{caption-side:top;text-align:left;padding:.95rem 1.1rem .65rem;font:800 .95rem/1.4 var(--serif);color:var(--ink)}
thead th{text-align:left;font:700 .7rem/1.2 var(--sans);letter-spacing:.05em;text-transform:uppercase;color:var(--ink);padding:.7rem 1.1rem;background:var(--sun);border-block:var(--line)}
tbody td{padding:.62rem 1.1rem;border-bottom:2px dotted var(--soft);vertical-align:top}
tbody td:first-child{font-weight:700}
tbody tr:hover{background:#FFF7DC}
tbody tr:last-child td{border-bottom:0}
tr.is-current{background:var(--wash)}
tr.is-current td{font-weight:700}
tr.is-current td:first-child{box-shadow:inset 5px 0 0 var(--indigo)}
.tablewrap:has(th:nth-child(6)) td{min-width:10rem}
.tablewrap:has(th:nth-child(6)) :is(td,th):first-child{position:sticky;left:0;z-index:1;background:var(--paper);box-shadow:inset -2px 0 0 var(--ink)}
.tablewrap:has(th:nth-child(6)) th:first-child{background:var(--sun)}
.rule{font-size:.8rem;color:var(--mute);margin:.5rem 0 1.6rem;max-width:var(--measure)}
.rule b{font-weight:700;color:var(--ink2)}
.clause{font-size:.9rem;color:var(--ink2)}

main ul.entries{list-style:none;padding:0;margin:1.2rem 0 2rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.95rem 1.05rem}
ul.entries li{position:relative;margin:0;padding:.95rem 1.05rem .95rem 2.7rem;background:var(--paper);border:var(--line);border-radius:18px;box-shadow:4px 4px 0 var(--soft);font-size:.85rem;color:var(--mute);transition:transform .25s cubic-bezier(.3,1.5,.5,1),box-shadow .25s}
ul.entries li::before{content:"";position:absolute;left:1rem;top:1.15rem;width:.9rem;height:.9rem;border-radius:46% 54% 42% 58% / 55% 45% 55% 45%;background:var(--indigo);border:1.5px solid var(--ink)}
ul.entries li:nth-child(4n+2)::before{background:var(--tang)}
ul.entries li:nth-child(4n+3)::before{background:var(--mint)}
ul.entries li:nth-child(4n)::before{background:var(--sun)}
ul.entries a{display:block;font:800 1.03rem/1.3 var(--serif);color:var(--ink);margin-bottom:.2rem;text-decoration:none}
ul.entries li:hover{transform:translate(-3px,-3px) rotate(-.5deg);box-shadow:7px 7px 0 var(--sun)}
ul.entries li:hover a{color:var(--indigo)}

.stamp{font-size:.74rem;color:var(--faint)}
li.fact .meta a[href^="http"]{color:var(--mute)}

.chart,.fig{width:fit-content;max-width:100%;min-width:min(100%,24rem);margin:1.8rem 0 1.2rem;padding:1.25rem 1.35rem 1.05rem;border:var(--line);border-radius:22px;box-shadow:6px 6px 0 var(--sky2)}
.fig:not(.fig-dia){background:var(--paper)}
.fig:has(img){width:auto}
.chart,.fig-dia{overflow-x:auto;overscroll-behavior-x:contain}
.chart svg,.fig-dia svg{display:block;max-width:100%;overflow:visible;margin:0 auto;height:auto;min-width:calc(attr(width px,0px) * var(--floor,.6))}
.ch-matrix:not(.ch-hl) svg[width^="1"]{max-width:none}
.chart figcaption,.fig figcaption{contain:inline-size;position:sticky;left:0;max-width:var(--measure);margin-top:.75rem;font:400 .86rem/1.5 var(--sans);color:var(--mute)}
.fign{float:left;margin:.02rem .55rem 0 0;padding:.08rem .55rem;border-radius:999px;background:var(--indigo);border:1.5px solid var(--ink);font:800 .7rem/1.5 var(--serif);color:#FFFFFF}
a.fign:hover{background:var(--tang);color:var(--ink)}
.ch-title{font:800 .78rem/1 var(--serif);letter-spacing:.02em;text-transform:uppercase;fill:var(--ink)}
.ch-lab{font:700 .84rem/1 var(--sans);fill:var(--ink2);text-anchor:end}
.ch-lab2{font:400 .86rem/1 var(--sans);fill:var(--ink2)}
.ch-col{font:700 .68rem/1 var(--sans);text-transform:uppercase;fill:var(--ink2);text-anchor:middle}
.ch-val{font:700 .82rem/1 var(--sans);fill:var(--ink);dominant-baseline:middle}
.ch-na{font:400 .78rem/1 var(--sans);fill:var(--faint);dominant-baseline:middle}
.ch-bar{fill:var(--indigo);rx:8px}
.ch-val-in{text-anchor:end;fill:#FFFFFF}
.ch-hl .ch-bar{opacity:.25}
.ch-hl .ch-hi{opacity:1;fill:var(--tang)}
.ch-lab-hi{font-weight:800;fill:var(--ink)}
.ch-a{opacity:1}
.ch-b{opacity:.4}
.ch-keyt{font:700 .76rem/1 var(--sans);fill:var(--ink2)}
.ch-gap{fill:none;stroke:var(--soft);stroke-dasharray:4 3}
.ch-cell{fill:var(--band);stroke:none}
.ch-cell.ch-cur{fill:#FFF1CC;stroke:var(--ink);stroke-width:1.6}
.ch-mark{stroke:var(--ink);stroke-width:1.6}
.ch-m-yes{fill:var(--indigo)}
.ch-m-part{fill:none}
.ch-m-none{fill:#FFFFFF;stroke:var(--mute);stroke-width:1.4;opacity:.7}
.ch-half{fill:var(--indigo)}
.ch-axis,.ch-drop{stroke:var(--soft)}
.ch-dot{fill:var(--tang)}
.ch-date{font:400 .74rem/1 var(--sans);fill:var(--faint);text-anchor:end}
.ch-track{fill:var(--band)}
.ch-span{fill:var(--indigo)}
.fig img{display:block;width:100%;height:auto;background:var(--band);border-radius:14px;border:var(--line)}
.fig .credit{display:block;margin-top:.3rem;font:400 .72rem/1.4 var(--sans);color:var(--faint)}
.figs{display:grid;grid-template-columns:repeat(var(--figcols,3),1fr);gap:.5rem}
.fig-dia{overflow-x:auto}

@media (min-width:40.01rem){
  .fig-dia{width:auto;background:none;border:0;border-radius:0;box-shadow:none;padding:.6rem 0 0}
  .fig-dia svg{margin:0}
  .fig-dia figcaption{margin-top:.6rem;padding-top:.55rem;border-top:2px dotted rgba(34,26,92,.25)}
  
  .answer+.fig-dia{width:fit-content;padding:1.25rem 1.35rem 1.05rem;border:var(--line);border-radius:22px;box-shadow:6px 6px 0 var(--sky2);
    background:linear-gradient(90deg,var(--paper) 2rem,rgba(255,255,255,0) 2.8rem) 0 0/2.8rem 100% no-repeat local,var(--paper)}
  .answer+.fig-dia figcaption{border-top:0;padding-top:0}
}
.dg-band{fill:var(--band)}
.dg-head{font:800 12px/1 var(--serif);letter-spacing:.02em;text-transform:uppercase;fill:var(--ink)}
.dg-box{fill:#FFF1CC;stroke:var(--ink);stroke-width:2;rx:16px}
rect.dg-box[height="62"]+text.dg-head{transform:translateY(12px)}
.dg-store{font:800 13.5px/1 var(--serif);fill:var(--ink)}
.dg-arrow{stroke:var(--tang);stroke-width:2.2;fill:none}
.dg-head-tip{fill:var(--tang)}
.dg-travels{font:700 11.5px/1 var(--sans);fill:var(--mute)}
path.dg-head-tip+text.dg-travels{transform:translateY(-3px)}
.dg-bar{fill:var(--indigo)}
.dg-bartext{font:800 12.5px/1 var(--serif);fill:#FFFFFF}
.dg-rule{stroke:var(--soft);stroke-width:1.5;stroke-dasharray:3 3}
.dg-footlab{font:700 9.5px/1 var(--sans);fill:var(--mute);letter-spacing:.04em;text-transform:uppercase}
.dg-after{font:400 12.5px/1 var(--sans);fill:var(--ink2)}

.site-foot{position:relative;background:linear-gradient(180deg,#9BE3BF 0,#C6F0DB 9rem,#DDF6E9 100%);color:var(--ink);margin-top:7rem}
.site-foot::after{content:"";position:absolute;left:0;right:0;top:-5.4rem;height:5.5rem;pointer-events:none;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 88' preserveAspectRatio='none'><path d='M0 88V50c110-34 230-48 360-30s230 46 360 40 230-54 360-56 240 30 360 36V88z' fill='%2357C98E'/><path d='M0 88V68c150-28 300-32 450-14s270 28 410 16 260-30 380-26 150 10 200 16V88z' fill='%239BE3BF'/></svg>") 0 100%/100% 100% no-repeat}
.site-foot::before{content:"";position:absolute;right:8%;top:-7.2rem;width:4.6rem;height:4.6rem;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 36% 36%,#FFE38A 0 32%,rgba(255,227,138,0) 33%),var(--sun);border:var(--line);box-shadow:4px 4px 0 var(--ink)}
.sf{position:relative;max-width:var(--frame);margin:0 auto;padding:1.6rem var(--pad) 1.6rem;display:grid;grid-template-columns:16rem minmax(0,1fr);gap:2.8rem}
.sf-id{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:.6rem;align-self:start}
.sf-id .mark{width:2.3rem;height:2.3rem}
.sf-id .mark svg{width:1.25rem;height:1.25rem}
.sf-name{font:800 1.25rem/1 var(--serif);color:var(--ink)}
.sf-note{grid-column:1/-1;margin:.9rem 0 0;font-size:.86rem;line-height:1.6;color:var(--ink2)}
.sf-map{columns:4 11rem;column-gap:1.8rem}
.sfc{break-inside:avoid;margin:0 0 1.5rem}
.sfc ul{list-style:none;margin:0;padding:0}
.sfc li{margin:.22rem 0;font-size:.84rem}
.sfc a{color:var(--ink2);text-decoration:none}
.sfc a:hover{color:var(--indigo);text-decoration:underline wavy var(--tang) 1.5px}
.sfh{display:block;font:800 .86rem/1 var(--serif);color:var(--ink);margin:0 0 .6rem;padding-bottom:.45rem;border-bottom:2px dotted rgba(34,26,92,.28)}
details.sfc>summary.sfh{cursor:pointer;list-style:none;display:flex;align-items:baseline;gap:.4rem}
details.sfc>summary.sfh::-webkit-details-marker{display:none}
details.sfc>summary.sfh::after{content:"+";margin-left:auto;display:inline-flex;align-items:center;justify-content:center;width:1.2rem;height:1.2rem;border-radius:50%;background:var(--sun);border:1.5px solid var(--ink);font:800 .8rem/1 var(--serif)}
details.sfc[open]>summary.sfh::after{content:"\2212"}
.sfh .sfn{font-weight:400;opacity:.65}
details.sfc[open]{column-span:all}
details.sfc[open]>ul{columns:4 11rem;column-gap:1.6rem}
details.sfc[open]>ul li{break-inside:avoid}
.sf-bar{position:relative;max-width:var(--frame);margin:0 auto;padding:1rem var(--pad) 1.8rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem;border-top:2px dotted rgba(34,26,92,.28);font:400 .78rem/1.4 var(--sans);color:var(--ink2)}
.sf-dom{font-weight:700}

h2:target,li.fact:target{background-color:#FFF1CC}
a:focus-visible,summary:focus-visible{outline:3px solid var(--tang);outline-offset:2px}

@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes pop{from{opacity:0;scale:.8;rotate:-6deg}to{opacity:1;scale:1;rotate:0deg}}
@keyframes bob{from{translate:0 0}to{translate:0 -7px}}
@keyframes skyin{from{opacity:.4}to{opacity:1}}
@keyframes morph{
  0%{border-radius:62% 38% 54% 46% / 43% 57% 43% 57%}
  50%{border-radius:55% 45% 64% 36% / 37% 63% 47% 53%}
  100%{border-radius:66% 34% 50% 50% / 46% 54% 36% 64%}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

@media (max-width:75rem){
  .mh-tag{display:none}
  .mh{justify-content:space-between}
}
@media (max-width:74rem){
  main#doc:not(:has(.hero)){--blob:14.5rem;column-gap:2.2rem}
}
@media (max-width:62rem){
  :root{--sky-h:27rem}
  body:has(.hero){--sky-h:30rem}
  .sheet{grid-template-columns:minmax(0,1fr);gap:1.2rem}
  .column{grid-column:1;grid-row:1}
  .rail{grid-column:1;grid-row:2;position:static;margin-top:.6rem}
  .hero{grid-template-columns:1fr;gap:2.2rem}
  .hero-art{max-width:22rem}
  .sf{display:block}
  .sf-id{margin-bottom:1.8rem}
  
  .mh{border-radius:24px;padding:.6rem .7rem;gap:.5rem}
  .mh-tag{display:none}
  .mh-nav{margin-left:0;width:100%;justify-content:center;padding:.25rem;border-radius:999px;background:var(--indigo-deep);box-shadow:inset 0 0 0 2px rgba(34,26,92,.5)}
  .mh-nav a{padding:.45rem .7rem}
}
@media (max-width:40rem){
  :root{--sky-h:24rem}
  body:has(.hero){--sky-h:27rem}
  main#doc:not(:has(.hero)){grid-template-columns:minmax(0,1fr)}
  main#doc:not(:has(.hero))>h1{grid-row:1}
  main#doc:not(:has(.hero))>h1+*{grid-row:2}
  main#doc:not(:has(.hero))::before{grid-column:1;grid-row:3;justify-self:start;width:min(62vw,15rem);margin:.2rem 0 2rem .2rem}
  main#doc:not(:has(.hero))::after{grid-column:1;grid-row:3;align-self:start;margin:-.4rem 0 0 -.3rem;width:2.8rem;height:2.8rem;transform:none}
  ul.facts{grid-template-columns:1fr}
  .statusbox{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
  .chart,.fig{--floor:.76;--cue-y:.35rem;--cue-s:1.25rem;margin-inline:-.4rem;max-width:calc(100% + .8rem);min-width:calc(100% + .8rem);padding:1.95rem .7rem .9rem;border-radius:18px;box-shadow:4px 4px 0 var(--sky2)}
  .tablewrap{margin-inline:-.4rem;border-radius:18px}
  tbody td,thead th{padding-inline:.8rem}
  h2{font-size:1.4rem;background-position:3.2rem 100%}
  h2 .secno{width:2.3rem;height:2.3rem;font-size:.95rem}
  .site-foot::before{width:3.4rem;height:3.4rem;top:-5.8rem}
}
@media (max-width:640px){.figs{grid-template-columns:1fr;gap:.5rem}}

@media (max-width:48rem){
  .masthead{padding:.6rem .7rem 0}
  .mh{padding:.45rem .5rem .5rem;gap:.35rem;border-radius:20px;box-shadow:0 4px 0 var(--ink)}
  .brand{font-size:1.08rem;padding-left:.2rem}
  .mark{width:1.9rem;height:1.9rem}
  .mark svg{width:1.1rem;height:1.1rem}
  .mh-tag{display:none}
  .mh-nav{gap:0;font-size:.72rem;padding:.2rem}
  .mh-nav a{padding:.32rem .46rem}
  .sheet{padding:1rem 1rem 2.4rem}
  h1{font-size:1.95rem;text-shadow:2px 2px 0 #FFFFFF}
  .hero h1{font-size:2.25rem}
  .hero-art{max-width:15rem;margin:.2rem 0 .6rem;justify-self:start}
  .hero-art::before{box-shadow:8px 9px 0 var(--pink)}
  .hero-art::after{width:3rem;height:3rem;left:-.5rem;top:.3rem}
  .answer{font-size:1rem;padding:.95rem 1.05rem;box-shadow:5px 5px 0 var(--sun)}
}

.rankwrap table :is(th,td):nth-child(5){white-space:nowrap}

.rankwrap table :is(th,td):nth-child(4){min-width:15em}