/* shared/fonts.css */
@font-face{font-family:"Inter Variable";src:url(/fonts/InterVariable.woff2) format("woff2");font-display:swap;font-weight:100 900;font-style:normal}
/* metric matched stand-in so a late font cannot change a line height or move a later section */
@font-face{font-family:"Inter Fallback";src:local("Arial"),local("Helvetica"),local("Liberation Sans");size-adjust:107.4%;ascent-override:90.49%;descent-override:22.56%;line-gap-override:0%}

/* shared/tokens.css */
/* Shared design tokens. Names are kept from the original token sheet. Modules only read them with var(--t-*). */
:root{
  --os-vw:100vw;
  --t-dark:#140700; --t-light:#f8f8f7; --t-mid:#d0d0c8;
  --t-ink-soft:rgba(20,7,0,.6); --t-light-soft:rgba(248,248,247,.6);
  --t-font-ui:"Inter Variable","Inter Fallback",system-ui,sans-serif;
  --t-font-display:"Inter Variable","Inter Fallback",system-ui,sans-serif;
  --t-label-size:16px; --t-label-lh:1.3; --t-label-ls:0;
  --t-body-size:18px; --t-body-lh:26.1px; --t-body-ls:.016px;
  --t-title-size:18px; --t-title-lh:26.1px; --t-title-wt:400;
  --t-display-size:40px; --t-display-lh:42px; --t-display-ls:-.25px;
  --t-story-size:32px; --t-story-lh:35px;
  --t-btn-size:16px;
  --t-r-card:16px; --t-r-tile:24px; --t-r-pill:96px;
  --t-sec-y:96px; --t-gap:64px; --t-content:1244px;
  --t-tile-ratio:681/440;
  /* ink over the shared backdrop; the backdrop controller rewrites these. Default = over a dark backdrop */
  --slot-ink:#f8f8f7; --slot-ink-soft:rgba(248,248,247,.6);
  --os-ease-sheet:cubic-bezier(.5,.3,0,1);
  --os-spring-hover:linear(0 0%, .004379 1%, .017027 2%, .037197 3%, .064139 4%, .097098 5%, .135326 6%, .178089 7.000000000000001%, .224667 8%, .274366 9%, .326515 10%, .380476 11%, .435642 12%, .491445 13%, .547353 14.000000000000002%, .602874 15%, .65756 16%, .711 17%, .76283 18%, .812725 19%, .860402 20%, .90562 21%, .948177 22%, .98791 23%, 1.024693 24%, 1.058435 25%, 1.089077 26%, 1.116593 27%, 1.140987 28.000000000000004%, 1.162286 28.999999999999996%, 1.180545 30%, 1.19584 31%, 1.208266 32%, 1.217937 33%, 1.22498 34%, 1.229538 35%, 1.231761 36%, 1.231811 37%, 1.229853 38%, 1.226059 39%, 1.220603 40%, 1.213659 41%, 1.205403 42%, 1.196006 43%, 1.185638 44%, 1.174463 45%, 1.162638 46%, 1.150318 47%, 1.137645 48%, 1.124757 49%, 1.111781 50%, 1.098837 51%, 1.086034 52%, 1.073472 53%, 1.061241 54%, 1.04942 55.00000000000001%, 1.038082 56.00000000000001%, 1.027286 56.99999999999999%, 1.017084 57.99999999999999%, 1.007519 59%, .998624 60%, .990425 61%, .982939 62%, .976176 63%, .970139 64%, .964824 65%, .960222 66%, .956318 67%, .953091 68%, .950518 69%, .94857 70%, .947216 71%, .946423 72%, .946154 73%, .946371 74%, .947035 75%, .948105 76%, .949542 77%, .951304 78%, .953352 79%, .955646 80%, .958146 81%, .960816 82%, .963619 83%, .966522 84%, .96949 85%, .972494 86%, .975505 87%, .978496 88%, .981443 89%, .984323 90%, .987118 91%, .989809 92%, .992382 93%, .994822 94%, .99712 95%, .999265 96%, 1.001252 97%, 1.003076 98%, 1.004733 99%, 1.006221 100%);
}

/* shell/shell.css */
/* Shell styles. Page frame, backdrop, shared helpers. Module rules live in each module's style.css.

   Measured on the current site (computed styles, desktop 1481 and phone 390), for module owners:
   - root font size was 16px in the hero page and in every embedded page. Here html is 16px once; rem based CSS keeps working.
   - hero page body: the hero display stack, colour rgb(237,236,236), 16px / 24px, weight 400, antialiased, color-scheme dark. The hero owns this.
   - work pages body: "Inter Variable", system-ui, sans-serif; colour rgb(20,7,0); 16px; line-height normal; weight 400; letter-spacing normal;
     -webkit-font-smoothing antialiased; text-rendering auto; color-scheme light; margin 0.
   - clock scene body: "Inter Variable", Inter, system-ui, sans-serif; colour rgb(0,0,0); 16px; line-height normal; weight 400; antialiased.
   Each module sets these on its own root class (.pj-root, .wr-root, .ck-root, .ps-overlay), never on body. */
html{font-size:16px;-webkit-text-size-adjust:100%;color-scheme:dark;background:#14120b}
body{margin:0;background:#14120b}
#os-page{overflow-x:clip}
.os-section{position:relative;z-index:100;background:transparent}
#os-run{height:450px}
#os-backdrop{position:fixed;inset:0;z-index:90;pointer-events:none;opacity:0;background:#f8f8f7;transition:opacity 1.3s cubic-bezier(.4,0,.2,1),background-color 1.3s cubic-bezier(.4,0,.2,1)}

/* quiet placeholder behind images: the section ink at 6 percent */
.os-ph{background-color:color-mix(in srgb,var(--slot-ink) 6%,transparent)}
/* images that were not ready when the page script ran fade in once; ready images are never hidden */
img.os-fade{opacity:0;transition:opacity .3s}
img.os-fade.is-loaded{opacity:1}

/* drag carousel state (shared/carousel.js adds these classes to the scroller) */
.os-car{transform:translate(var(--elastic-position-x,0px))}
.os-car.os-car-snap{scroll-snap-type:x mandatory;scroll-behavior:smooth}
.os-car.os-car-nosnap{scroll-snap-type:none;scroll-behavior:auto}
.os-car.os-car-dragging>*{pointer-events:none}

@media (prefers-reduced-motion:reduce){img.os-fade{transition:none}}

/* sections/hero */
/* Hero and pendant. Prefix: hr. */

@font-face { font-family: hr-display; src: url(/a/hero/fonts/display-hanken.woff2) format("woff2"); font-display: swap; font-weight: 100 900; font-style: normal; }
@font-face { font-family: hr-display-fallback; src: local(Arial); ascent-override: 92%; descent-override: 24%; line-gap-override: 0%; size-adjust: 100%; }

/* zero-specificity reset, only what the hero needs */
:where(.hr-root) *, :where(.hr-root) ::before, :where(.hr-root) ::after { box-sizing: border-box; margin: 0; padding: 0; border: 0 solid; }
:where(.hr-root) h1 { font-size: inherit; font-weight: inherit; }
:where(.hr-root) a { color: inherit; text-decoration: inherit; }
:where(.hr-root) canvas { display: block; vertical-align: middle; }

/* the sticky stage: pinned for the whole page, the next section overlaps its last 200px */
.hr-root.os-section {
  position: sticky; top: 0; z-index: 0; overflow: visible;
  height: 100svh; margin-bottom: -200px;
  color-scheme: dark;
  background: transparent;
  font-family: hr-display, hr-display-fallback, system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px; line-height: 24px; font-weight: 400; letter-spacing: normal;
  color: #edecec;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: auto;
  -webkit-text-size-adjust: 100%;
}
.hr-root.hr-gone { visibility: hidden; }
.hr-root ::selection { background-color: #14120b; color: #edecec; }

/* photo group */
.hr-bg { position: absolute; inset: 0; overflow: hidden; pointer-events: none; isolation: isolate; z-index: 0; }
.hr-base { position: absolute; inset: 0; z-index: 2; background-color: #14120b; }
.hr-photo { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 3; pointer-events: none; opacity: 0; }
.hr-photo.hr-on { opacity: 1; transition: opacity 1800ms cubic-bezier(0, 0, .2, 1); }
.hr-photo.hr-instant { transition: none; }
.hr-scrim { position: absolute; inset: 0; z-index: 4; background-color: rgba(0, 0, 0, .2); }
@media (min-width: 900px) { .hr-scrim { background-color: rgba(0, 0, 0, .25); } }

/* the white curve */
.hr-curve-wrap { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.hr-curve { position: absolute; inset: 0; width: 100%; height: 100%; }

/* copy grid */
.hr-grid {
  position: relative; display: grid; width: 100%; min-height: 100%; padding: 1.5rem; gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto 1fr;
}
@media not all and (min-width: 900px) { .hr-grid { padding-top: calc(1rem * 1.4 * 3); } }
@media (min-width: 660px) { .hr-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 900px) { .hr-grid { grid-template-rows: 1fr auto 1fr; gap: 1.5rem; } }
@media (orientation: landscape) and (max-height: 600px) { .hr-grid { grid-template-rows: repeat(1, minmax(0, 1fr)); } }

.hr-col { position: relative; z-index: 10; display: flex; flex-direction: column; width: 100%; align-self: flex-start; grid-column: span 2 / span 2; grid-row-start: 1; }
@media (min-width: 660px) { .hr-col { grid-column: span 2 / span 2; } }
@media (min-width: 900px) { .hr-col { grid-column-start: 2; grid-column-end: span 2; grid-row: 2 / span 1; align-self: center; } }
@media (min-width: 1470px) { .hr-col { grid-column-start: 2; grid-column-end: span 1; } }
@media (orientation: landscape) and (max-height: 600px) { .hr-col { grid-column: span 4 / span 4; } }

.hr-marker { position: absolute; top: 0; left: 0; width: 0; height: 0; pointer-events: none; }

/* hairlines, positioned from the marker by script */
.hr-lines { position: absolute; inset: 0; overflow: hidden; pointer-events: none; opacity: 0; transition: opacity 100ms ease-out; }
.hr-lines.hr-on { opacity: 1; }
.hr-lines-in { position: absolute; inset: 0; }
.hr-lines-in.hr-glide { transition: transform 1100ms linear(0 0%, 0.004 0.6%, 0.014 1.2%, 0.032 1.9%, 0.058 2.7%, 0.114 4.1%, 0.313 8.5%, 0.417 11%, 0.47 12.4%, 0.519 13.8%, 0.563 15.2%, 0.607 16.7%, 0.649 18.3%, 0.686 19.9%, 0.722 21.6%, 0.755 23.4%, 0.785 25.2%, 0.812 27.1%, 0.837 29.1%, 0.86 31.2%, 0.88 33.4%, 0.899 35.8%, 0.915 38.3%, 0.93 40.9%, 0.942 43.7%, 0.954 46.8%, 0.964 50.1%, 0.972 53.6%, 0.984 61.4%, 0.992 70.9%, 0.997 83%, 1 100%) 400ms; }
.hr-line-v { position: absolute; top: -50vh; height: 200vh; width: 1px; background-color: rgba(255, 255, 255, .1); }
.hr-line-h { position: absolute; left: -50vw; width: 200vw; height: 1px; background-color: rgba(255, 255, 255, .1); }

/* text */
.hr-text {
  display: flex; flex-direction: column; align-items: flex-start; width: 100%; gap: calc(1rem * 1.4); text-align: left;
  opacity: 0; pointer-events: none;
  transition-property: opacity; transition-duration: 1100ms; transition-delay: .5s; transition-timing-function: cubic-bezier(0, 0, .2, 1);
}
.hr-text[data-revealed] { opacity: 1; pointer-events: auto; }
.hr-bio { display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; width: min(460px, calc(var(--os-vw, 100%) - 48px)); }
.hr-h1 { font-size: 36px; line-height: 40px; font-weight: 400; letter-spacing: -.025em; text-wrap: balance; white-space: pre-line; }
@media (min-width: 1140px) and (not (min-width: 1470px)) { .hr-h1 { padding-right: 2.5rem; } }
.hr-p { font-size: 1rem; line-height: 1.5; font-weight: 400; letter-spacing: .005em; color: #edecec; text-wrap: balance; }
.hr-p-links { margin-top: .5rem; white-space: pre-wrap; }
/* links: underlined, the line at half strength, full strength on hover */
.hr-link { text-decoration-line: underline; text-decoration-color: color-mix(in srgb, currentColor 50%, transparent); text-underline-offset: 2px; transition: text-decoration-color .2s ease; }
@media (hover: hover) { .hr-link:hover { text-decoration-color: currentColor; } }
.hr-link:focus-visible { outline: 2px solid #edecec; outline-offset: 3px; border-radius: 2px; }

/* pendant (appended to #os-layers by script) */
.hr-pill-canvas { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 150; pointer-events: none; }
.hr-pill-hit { position: fixed; left: 0; top: 0; z-index: 151; width: 60px; height: 60px; border-radius: 50%; cursor: pointer; transform: translate(-9999px, -9999px); -webkit-tap-highlight-color: transparent; }
.hr-pill-hint { font-family: hr-display, hr-display-fallback, system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif; position: absolute; right: calc(100% + 6px); top: 50%; transform: translateY(-50%); padding: 7px 12px; border-radius: 10px; background: #14120b; color: #edecec; font-size: .8125rem; line-height: 1.2; font-weight: 500; white-space: nowrap; pointer-events: none; opacity: 0; transition: opacity .3s ease; box-shadow: 0 10px 28px -10px rgba(0,0,0,.45); }
.hr-pill-hint::after { content: ""; position: absolute; right: 0; top: 50%; width: 8px; height: 8px; margin: -4px -4px 0 0; background: #14120b; transform: rotate(45deg); }
.hr-pill-hit.is-near:not(.is-diving) .hr-pill-hint { opacity: 1; animation: hr-hint-nudge 2.4s ease-in-out infinite; }
@keyframes hr-hint-nudge { 0%, 100% { transform: translate(0, -50%); } 50% { transform: translate(-4px, -50%); } }
@media (max-width: 767px) { .hr-pill-hint { right: auto; left: calc(100% + 6px); } .hr-pill-hint::after { right: auto; left: 0; margin: -4px 0 0 -4px; } }
@media (prefers-reduced-motion: reduce) { .hr-pill-hit.is-near:not(.is-diving) .hr-pill-hint { animation: none; } }
.hr-pill-hit:focus-visible { outline: 2px solid #edecec; outline-offset: 2px; }
.hr-pill-hit[inert] { pointer-events: none; }

/* Contact and awards: hover and focus cards drawn from data attributes, so their text is never part of the page text
   (copying the intro, reading it aloud or extracting it never meets the card). Both open above the link. */
.hr-contact, .hr-awards { position: relative; }
.hr-awards { cursor: help; }
.hr-contact::after, .hr-awards::after { position: absolute; z-index: 2; bottom: calc(100% + 10px); padding: 7px 12px; border-radius: 10px; background: #0b0b0e; color: #edecec; border: 1px solid rgba(255,255,255,.14); font-size: .8125rem; line-height: 1.35; font-weight: 400; text-decoration: none; text-wrap: initial; opacity: 0; pointer-events: none; transition: opacity .18s ease, transform .18s ease; box-shadow: 0 10px 28px -10px rgba(0,0,0,.55); }
.hr-contact::after { content: attr(data-tip); left: 50%; transform: translate(-50%, 4px); white-space: nowrap; font-weight: 500; }
.hr-contact::before { content: ""; position: absolute; z-index: 3; left: 50%; bottom: calc(100% + 6px); width: 8px; height: 8px; margin-left: -4px; background: #0b0b0e; border-right: 1px solid rgba(255,255,255,.14); border-bottom: 1px solid rgba(255,255,255,.14); transform: rotate(45deg); opacity: 0; transition: opacity .18s ease; pointer-events: none; }
.hr-awards::after { content: attr(data-card); left: 0; width: max-content; max-width: min(320px, 80vw); padding: 18px 20px; border-radius: 14px; white-space: pre-line; line-height: 1.75; letter-spacing: .005em; transform: translateY(4px); }
@media (hover: hover) {
  .hr-contact:hover::after, .hr-awards:hover::after { opacity: 1; transform: translate(-50%, 0); }
  .hr-awards:hover::after { transform: none; }
  .hr-contact:hover::before { opacity: 1; }
}
.hr-contact:focus-visible::after, .hr-contact.is-copied::after { opacity: 1; transform: translate(-50%, 0); }
.hr-contact:focus-visible::before, .hr-contact.is-copied::before { opacity: 1; }
.hr-awards:focus::after, .hr-awards:focus-visible::after { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .hr-contact::after, .hr-awards::after, .hr-contact::before { transition: none; } }

/* sections/projects */
/* projects: the dark band with the project card carousel. Prefix pj. Values ported from the work site. */

/* ---- root: isolation (SPEC 1.8). The work frame computed: root 16px, Inter Variable, #140700, antialiased. ---- */
.pj-root{
  color-scheme:light;
  font-family:var(--t-font-ui,"Inter Variable",system-ui,sans-serif);
  font-size:16px; line-height:normal; letter-spacing:normal; font-weight:400;
  color:var(--t-dark,#140700);
  -webkit-font-smoothing:antialiased; text-rendering:auto;
  /* grid variables of the work site (:root there), rebuilt on the section.
     --os-vw is the scrollbar-free viewport width (set by shell, defaulted in tokens.css). */
  --pj-gap:16px; --pj-pad:32px; --pj-cols:8; --pj-gw:var(--os-vw);
  --pj-spring:var(--os-spring-hover,linear(0 0%, .004379 1%, .017027 2%, .037197 3%, .064139 4%, .097098 5%, .135326 6%, .178089 7.000000000000001%, .224667 8%, .274366 9%, .326515 10%, .380476 11%, .435642 12%, .491445 13%, .547353 14.000000000000002%, .602874 15%, .65756 16%, .711 17%, .76283 18%, .812725 19%, .860402 20%, .90562 21%, .948177 22%, .98791 23%, 1.024693 24%, 1.058435 25%, 1.089077 26%, 1.116593 27%, 1.140987 28.000000000000004%, 1.162286 28.999999999999996%, 1.180545 30%, 1.19584 31%, 1.208266 32%, 1.217937 33%, 1.22498 34%, 1.229538 35%, 1.231761 36%, 1.231811 37%, 1.229853 38%, 1.226059 39%, 1.220603 40%, 1.213659 41%, 1.205403 42%, 1.196006 43%, 1.185638 44%, 1.174463 45%, 1.162638 46%, 1.150318 47%, 1.137645 48%, 1.124757 49%, 1.111781 50%, 1.098837 51%, 1.086034 52%, 1.073472 53%, 1.061241 54%, 1.04942 55.00000000000001%, 1.038082 56.00000000000001%, 1.027286 56.99999999999999%, 1.017084 57.99999999999999%, 1.007519 59%, .998624 60%, .990425 61%, .982939 62%, .976176 63%, .970139 64%, .964824 65%, .960222 66%, .956318 67%, .953091 68%, .950518 69%, .94857 70%, .947216 71%, .946423 72%, .946154 73%, .946371 74%, .947035 75%, .948105 76%, .949542 77%, .951304 78%, .953352 79%, .955646 80%, .958146 81%, .960816 82%, .963619 83%, .966522 84%, .96949 85%, .972494 86%, .975505 87%, .978496 88%, .981443 89%, .984323 90%, .987118 91%, .989809 92%, .992382 93%, .994822 94%, .99712 95%, .999265 96%, 1.001252 97%, 1.003076 98%, 1.004733 99%, 1.006221 100%));
  --pj-col:calc((var(--pj-gw) - var(--pj-pad)*2 - (var(--pj-cols) - 1)*var(--pj-gap))/var(--pj-cols));
  --pj-card-w:calc(var(--pj-col)*8 + 7*var(--pj-gap));
  --pj-ratio:4/5;
  --pj-offset:var(--pj-pad);
  position:relative; box-sizing:border-box;
  min-height:100svh;
  padding:64px 0 40px;   /* 64 headroom so a hovered card's shadow is not sliced; 40 = old bottom pad */
}
@media screen and (min-width:752px){
  .pj-root{
    --pj-gw:calc(752px + var(--pj-pad)*2);
    --pj-card-w:calc(var(--pj-col)*6 + 5*var(--pj-gap));
    --pj-ratio:3/2;
    --pj-offset:calc(var(--os-vw)/2 - var(--pj-gw)/2 + (var(--pj-col)*2 + var(--pj-gap)) + var(--pj-gap) + var(--pj-pad));
  }
}
@media screen and (min-width:1145px){
  .pj-root{--pj-pad:0px; --pj-cols:10; --pj-gw:1145px}
}

:where(.pj-root) *,:where(.pj-root) ::before,:where(.pj-root) ::after{box-sizing:border-box}
:where(.pj-root) p{margin:0}
:where(.pj-root) img{display:block;max-width:100%}
:where(.pj-root) a{color:inherit;text-decoration:none}

/* ---- carousel ---- */
.pj-carousel{width:auto}
.pj-scroll{
  display:flex; gap:var(--pj-gap); flex-wrap:nowrap; align-items:flex-start;
  overflow-x:scroll; overflow-y:hidden;
  padding-left:var(--pj-offset); padding-right:var(--pj-offset);
  scroll-padding-inline-start:var(--pj-offset); scroll-padding-inline-end:var(--pj-offset);
  padding-top:42px; margin-top:-42px; padding-bottom:64px;
  /* the work site also had margin-bottom:-64px here; it collapsed into the section edge and never changed its height,
     so it is left out (a negative margin would now shrink the section above its 40px pad) */
  transform:translate(var(--elastic-position-x,0px)); will-change:transform;
  -ms-overflow-style:none; scrollbar-width:none;
}
.pj-scroll::-webkit-scrollbar{display:none}
.pj-scroll.os-car-snap{scroll-snap-type:x mandatory; scroll-behavior:smooth}
.pj-scroll.os-car-free{scroll-snap-type:none; scroll-behavior:auto}
.pj-scroll.os-car-dragging>*{pointer-events:none}
.pj-item{flex-shrink:0; scroll-snap-align:start}

/* ---- card ---- */
.pj-card{
  position:relative; display:flex; flex-direction:column; align-items:flex-start;
  width:var(--pj-card-w); font-size:18px; padding:0; cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.pj-bg{
  position:relative; width:100%; aspect-ratio:var(--pj-ratio); overflow:hidden; border-radius:var(--t-r-tile,24px);
  background-color:color-mix(in srgb,var(--slot-ink,#f8f8f7) 6%,transparent);
  filter:drop-shadow(0 0 0 rgba(0,0,0,0));
}
.pj-bg>picture{display:contents}
.pj-bg img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center}
@media (hover:hover){
  .pj-bg{transition:transform .65s var(--pj-spring),filter .65s var(--pj-spring); will-change:transform,filter}
  .pj-card:hover .pj-bg{transform:scale(1.025); filter:drop-shadow(0 15px 17px rgba(0,0,0,.2))}
}

/* the enlarge disc */
.pj-bg::after{
  content:""; position:absolute; right:20px; bottom:20px; width:44px; height:44px; border-radius:50%;
  background:rgba(255,255,255,.55) url(/a/projects/expand.svg) center/16px 16px no-repeat;
  -webkit-backdrop-filter:blur(10px) saturate(1.3); backdrop-filter:blur(10px) saturate(1.3);
  box-shadow:0 3px 10px rgba(0,0,0,.12); transition:transform .35s cubic-bezier(.5,.3,0,1); pointer-events:none;
}
.pj-card:hover .pj-bg::after{transform:scale(1.12)}

/* locked: lock on the same disc, no shadow, plain cursor */
.pj-card[data-locked]{cursor:default}
.pj-card[data-locked] .pj-bg::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23140700' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E");
  background-size:20px 20px;
}
@media (hover:hover){
  .pj-card[data-locked]:hover .pj-bg{filter:none}
}
.pj-card[data-locked] .pj-bg{filter:none}

/* locked: Coming soon pill, left of the lock disc, same height, shown on hover or keyboard focus */
.pj-soon{
  position:absolute; right:74px; bottom:20px; height:44px; padding:0 20px; display:flex; align-items:center;
  border-radius:22px; font-size:15px; font-weight:500; line-height:1; letter-spacing:0; white-space:nowrap; color:#140700;
  background:rgba(255,255,255,.55); -webkit-backdrop-filter:blur(10px) saturate(1.3); backdrop-filter:blur(10px) saturate(1.3);
  box-shadow:0 3px 10px rgba(0,0,0,.12); opacity:0; transform:translateY(6px); pointer-events:none;
  transition:opacity .3s ease,transform .35s cubic-bezier(.5,.3,0,1);
}
.pj-card[data-locked]:hover .pj-soon,.pj-card[data-locked]:focus-visible .pj-soon{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){.pj-soon{transition:opacity .2s ease; transform:none}}
/* touch screens have no hover: keep the pill visible on locked cards */
@media (hover:none){.pj-card[data-locked] .pj-soon{opacity:1; transform:none}}

/* text */
.pj-cta{display:flex; align-items:flex-start; gap:15px; position:relative; z-index:1; width:100%; padding:.9rem .9rem .9rem .5rem; text-wrap:pretty}
@media screen and (min-width:752px){.pj-cta{padding:.9rem}}
.pj-text{flex:1; width:90%; max-width:none}
.pj-p{font-size:1.075rem; line-height:1.45; letter-spacing:0}
@media (min-width:752px){.pj-p{font-size:1.125rem}}
@media (min-width:1145px){.pj-p{letter-spacing:.001rem}}
.pj-title{font-size:var(--t-title-size,18px); line-height:var(--t-title-lh,26.1px); font-weight:var(--t-title-wt,400); font-variation-settings:"wght" 530; letter-spacing:normal; color:var(--slot-ink,var(--t-dark,#140700))}
.pj-tag{
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; overflow:hidden;
  margin-top:.3rem; opacity:.7; width:min(580px,100%); max-width:580px;
  font-size:var(--t-body-size,18px); line-height:var(--t-body-lh,26.1px); letter-spacing:var(--t-body-ls,.016px); font-weight:400;
  color:var(--slot-ink-soft,var(--t-ink-soft,rgba(20,7,0,.6)));
}

/* sections/sheet */
/* Project sheet. Every selector starts with .ps- or #ps-. Values lifted from the measured sheet. */

/* ---------- shield, overlay, close ---------- */
.ps-shield{position:fixed;inset:0;z-index:2147482990;touch-action:none;background:transparent}
.ps-shield[hidden]{display:none}
.ps-overlay{
  position:fixed;inset:20px 0 0 0;z-index:2147483000;background:#f8f8f7;border-radius:24px 24px 0 0;overflow:hidden;
  transform:translateY(100%);transition:transform 450ms cubic-bezier(.5,.3,0,1);
  color-scheme:light;
  /* grid tokens of the case page (phone first) */
  --ps-vw:var(--os-vw);
  --ps-cols:4;--ps-gutter:1rem;--ps-gpmin:1.5rem;--ps-maxw:768px;--ps-sp:3rem;--ps-sgap:1.5rem;
  --ps-gp:max(var(--ps-gpmin),calc((var(--ps-vw) - var(--ps-maxw))/2));
  --ps-colw:calc((var(--ps-vw) - var(--ps-gp)*2 - var(--ps-gutter)*(var(--ps-cols) - 1))/var(--ps-cols));
  --ps-ink:#140700;--ps-mid:#5e5855;--ps-light:#f8f8f7;--ps-midlight:#d0d0c8;--ps-grey80:#ccc;
  --ps-expo:cubic-bezier(.19,1,.22,1);--ps-cubic:cubic-bezier(.215,.61,.355,1);
  font-family:"Inter Variable",system-ui,sans-serif;font-size:16px;font-weight:500;line-height:normal;letter-spacing:normal;
  color:var(--ps-ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%;
}
.ps-overlay[hidden]{display:none}
.ps-overlay.ps-open{transform:translateY(0)}
@media (min-width:768px){
  .ps-overlay{--ps-sp:4rem;--ps-sgap:3rem;--ps-cols:8;--ps-gpmin:1rem;--ps-maxw:960px}
}
@media (min-width:960px){
  .ps-overlay{--ps-sp:5rem;--ps-cols:10;--ps-maxw:1244px}
}
:where(.ps-root) *,:where(.ps-root) ::before,:where(.ps-root) ::after{box-sizing:border-box;margin:0;-webkit-tap-highlight-color:transparent}
:where(.ps-root) button{font:inherit;color:inherit;letter-spacing:inherit}
:where(.ps-root) img,:where(.ps-root) video,:where(.ps-root) svg{display:block;max-width:100%;vertical-align:middle}
:where(.ps-root) a{color:inherit;text-decoration:none}
.ps-scroll{height:100%;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;outline:none;position:relative}
.ps-close{
  position:absolute;top:24px;right:24px;z-index:2;width:48px;height:48px;border-radius:50%;border:0;padding:0;cursor:pointer;
  background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.14);display:flex;align-items:center;justify-content:center;
}
.ps-close svg{width:14px;height:14px}
.ps-overlay.ps-story-open .ps-close{display:none}

/* ---------- the page ---------- */
.ps-cs{width:100%;padding-bottom:1rem;font-weight:500}
@media (min-width:768px){.ps-cs{padding-bottom:3rem}}

.ps-head{display:flex;flex-direction:column;gap:3.25rem;padding-top:104px;padding-bottom:0}
@media (min-width:768px){.ps-head{padding-top:120px;padding-bottom:var(--ps-sp)}}
.ps-hero{display:grid;column-gap:var(--ps-gutter);row-gap:2.5rem;grid-template-columns:repeat(var(--ps-cols),1fr);grid-template-rows:auto;padding:0 var(--ps-gp)}
.ps-label{grid-column:1/span var(--ps-cols);grid-row:1/2;display:block;font-size:17.92px;line-height:1.2;font-weight:400;color:var(--ps-mid);font-feature-settings:"kern","liga"}
.ps-hgroup{grid-column:1/span var(--ps-cols);grid-row:2/3;display:flex;flex-direction:column;gap:1.25rem}
.ps-title{font-size:clamp(30px,calc(var(--ps-vw)*.085),44px);line-height:1.08;letter-spacing:-.02em;font-weight:400;margin-block:-.175em;max-width:10em;text-wrap:balance;color:var(--ps-ink);font-feature-settings:"kern","liga"}
.ps-excerpt{font-size:clamp(17px,calc(var(--ps-vw)*.048),21px);line-height:1.3;letter-spacing:-.25px;font-weight:400;color:var(--ps-mid);max-width:34ch;text-wrap:balance;font-feature-settings:"kern","liga"}
@media (min-width:768px){
  .ps-label{grid-column:span 3}
  .ps-hgroup{grid-row:1/2;grid-column:span 5;gap:2rem}
}
@media (min-width:960px){
  .ps-label{grid-column:span 4}
  .ps-hgroup{grid-column:span 6}
}

/* gallery: a strip on desktop, a two column card on a phone */
.ps-gallery{display:block;padding:0 var(--ps-gp)}
.ps-gal{
  display:grid;grid-auto-flow:dense;grid-template-columns:1fr 1fr;gap:.75rem;padding:.75rem;width:100%;
  background:#fff;border:.5px solid #eaeaea;border-radius:calc(1rem + .75rem);box-shadow:rgba(0,0,0,.12) 0 12px 31px;
  overflow-x:auto;overflow-y:clip;scrollbar-width:none;overscroll-behavior-x:contain;color:#000
}
.ps-gal::-webkit-scrollbar{display:none}
.ps-asset{display:block;position:relative;aspect-ratio:var(--ps-ar,1.6);border-radius:1rem;clip-path:inset(1px round 1rem);cursor:pointer;min-width:0}
.ps-asset[data-o="landscape"]{grid-column:span 2}
@media (max-width:767.98px){.ps-asset[data-o="landscape"]:first-child:has(+ .ps-asset[data-o="landscape"]) + .ps-asset ~ .ps-asset{display:none}}
.ps-media{position:relative;display:block;width:100%;height:100%;border-radius:inherit;overflow:clip;background-size:cover;background-position:center}
.ps-media img,.ps-media video{position:absolute;inset:0;width:100%;height:100%;border-radius:inherit;object-fit:contain}
@media (min-width:768px){
  .ps-gallery{padding:0}
  .ps-gal{
    --ps-slide:min(450px,calc(var(--ps-colw)*4 + var(--ps-gutter)*3));
    display:block;white-space:nowrap;height:calc(var(--ps-slide)*1.5);margin:-4rem 0;padding:4rem var(--ps-gp);
    scroll-padding:0 var(--ps-gp);background:transparent;border:0;border-radius:0;box-shadow:none;
    max-width:var(--ps-vw)
  }
  .ps-asset{display:inline-block;vertical-align:top;white-space:normal;height:100%;width:var(--ps-fw,820px);min-width:var(--ps-fw,820px);flex:0 0 var(--ps-fw,820px);transition:.8s transform var(--ps-expo)}
  .ps-asset:not(:last-child){margin-right:1rem}
}
@media (any-pointer:fine){
  .ps-asset:hover{transform:scale(1.01)}
}
.ps-asset:focus-visible{transform:scale(1.01)}
.ps-gal[data-ps-over="1"]{cursor:grab}
.ps-gal.ps-dragging,.ps-icar.ps-dragging{cursor:grabbing;user-select:none}

/* meta and story */
.ps-mg{display:block}
@media (min-width:768px){
  .ps-mg{display:grid;column-gap:var(--ps-gutter);grid-template-columns:repeat(var(--ps-cols),1fr);grid-template-rows:auto;padding:0 max(2rem,calc((var(--ps-vw) - var(--ps-maxw))/2))}
}
@media (min-width:1024px){.ps-mg{padding:0 var(--ps-gp)}}
.ps-meta{padding:var(--ps-sp) 0}
@media (min-width:768px){.ps-meta{grid-column:1/span 3}}
@media (min-width:1024px){.ps-meta{grid-column:2/span 3}}
.ps-dl{display:grid;grid-template-columns:1fr;gap:20px;padding:0 var(--ps-gp);font-size:16px;line-height:1.3;letter-spacing:-.01rem;font-weight:400;font-feature-settings:"kern","liga";overflow:visible}
.ps-dl>div{display:block;min-width:0;width:auto}
.ps-dl dt,.ps-dl dd{display:block;margin:0}
@media (min-width:768px){
  .ps-dl{display:flex;flex-direction:column;gap:1.5rem;padding:0;width:100%}
  .ps-dl>div{width:100%}
}
@media (max-width:768px){.ps-head{padding-top:104px}}
@media (min-width:768px) and (max-width:768px){.ps-dl{display:grid;grid-template-columns:1fr;gap:20px}.ps-dl>div{min-width:0;width:auto}}
.ps-avs{display:inline-flex;padding-top:4px}
.ps-dd-role{display:flex;align-items:center;gap:10px}
.ps-dd-role .ps-avs{padding-top:0}
.ps-role{font:inherit;color:var(--ps-mid);margin-left:10px}
.ps-av{display:block;position:relative;width:32px;height:32px;border-radius:50%;outline:2px solid var(--ps-light);background-repeat:no-repeat;margin-right:-4px;transition:.25s transform cubic-bezier(.215,.61,.355,1)}
.ps-ini{display:flex;align-items:center;justify-content:center;background-color:#dcdcd7;color:#5e5855;font:500 12px/1 "Inter Variable",Inter,system-ui,sans-serif;letter-spacing:0}
/* important: each circle carries its own inline z-index (9 down to 1); the hovered one must beat them */
.ps-av:hover,.ps-av:focus-visible{transform:scale(1.04);z-index:10!important}
.ps-tip{position:absolute;left:50%;bottom:calc(100% + .75rem);padding:.5rem 1rem;background:var(--ps-light);color:var(--ps-ink);border-radius:4rem;box-shadow:0 9px 13px #0000000f,0 4px 9px #0000001a,0 1px 5px #0000001c;font-size:16px;line-height:1.2;letter-spacing:0;font-weight:400;white-space:nowrap;opacity:0;visibility:hidden;transform:translate(-50%,.25rem);transition:.25s opacity cubic-bezier(.215,.61,.355,1),.25s transform cubic-bezier(.215,.61,.355,1),.25s visibility;pointer-events:none}
.ps-av:hover .ps-tip,.ps-av:focus-visible .ps-tip{opacity:1;visibility:visible;transform:translate(-50%,0)}
.ps-lnk{display:flex;flex-direction:column;align-items:flex-start}
.ps-lnk a{color:inherit;text-decoration:none;transition:opacity .2s ease}
.ps-lnk a:hover{opacity:.6}

.ps-story-sec{padding:0 var(--ps-gp)}
@media (min-width:768px){.ps-story-sec{grid-column:4/span 7;padding:var(--ps-sp) 0}}
@media (min-width:1024px){.ps-story-sec{grid-column:5/span 5}}
.ps-scard{display:flex;flex-direction:column;align-items:flex-start;position:relative;width:100%;gap:2.5rem;padding:2rem 1.5rem 1.5rem;background:#fff;border:.5px solid #eaeaea;border-radius:calc(1rem + .75rem);box-shadow:rgba(0,0,0,.12) 0 12px 31px;color:#000}
@media (min-width:768px){.ps-scard{gap:var(--ps-sgap);padding:0;background:transparent;border:0;border-radius:0;box-shadow:none}}
.ps-fill{max-width:870px;width:100%;margin-block:-.175em;font-size:1.8125rem;line-height:1.05;letter-spacing:-.02em;font-weight:400;font-feature-settings:"kern","liga"}
@media (min-width:768px){.ps-fill{max-width:30em;font-size:2rem}}
@media (min-width:960px){.ps-fill{font-size:2.25rem}}
.ps-fill p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:6;overflow:hidden;font-size:clamp(22px,calc(var(--ps-vw)*.064),32px);line-height:1.1;text-wrap:pretty}
@media (min-width:768px){.ps-fill p{margin-block:-.175em}}
.ps-fill p span{background-clip:text;-webkit-background-clip:text;background-color:var(--ps-grey80);background-image:linear-gradient(90deg,#000 50%,var(--ps-grey80) 60%);background-position:0 0;background-repeat:no-repeat;background-size:200% 100%;color:transparent}
.ps-fill.ps-fillable p span{background-size:0 100%}

.ps-btn{
  align-items:center;background:none;border:0;border-radius:6rem;color:#000;cursor:pointer;display:flex;gap:.75rem;height:fit-content;justify-content:space-between;
  letter-spacing:0;padding:0;position:static;width:100%;font-size:16px;line-height:1;font-weight:400;text-align:center;touch-action:manipulation;outline:none;
  transition:.8s transform var(--ps-expo),.15s background-color cubic-bezier(.445,.05,.55,.95),.15s color cubic-bezier(.445,.05,.55,.95)
}
.ps-btn svg{width:.8em;stroke:currentcolor;fill:none;overflow:hidden;flex:none}
.ps-btn svg path{stroke-dasharray:10px;stroke-dashoffset:0}
@media (min-width:768px){
  .ps-btn{background:var(--ps-light);border:1px solid #010401;color:#010401;height:2.8125rem;justify-content:center;padding:0 1.5rem;position:relative;width:fit-content}
}
@media (any-pointer:fine){
  .ps-btn:hover{background-color:#010401;color:var(--ps-light);transform:scale(1.04)}
  .ps-btn:hover svg path:first-child{animation:.8s ps-arrowA var(--ps-cubic)}
  .ps-btn:hover svg path:nth-child(2){animation:.8s ps-arrowB var(--ps-cubic)}
}
@media (max-width:767.98px){
  .ps-btn:hover{transform:none}
}
.ps-btn:focus-visible{background-color:#010401;color:var(--ps-light);transform:scale(1.04)}
.ps-btn:focus-visible svg path:first-child{animation:.8s ps-arrowA var(--ps-cubic)}
.ps-btn:focus-visible svg path:nth-child(2){animation:.8s ps-arrowB var(--ps-cubic)}
@media (max-width:767.98px){.ps-btn:focus-visible{transform:none;background-color:transparent;color:#000}}
.ps-btn:active{transform:scale(.98)}
@keyframes ps-arrowA{0%{stroke-dasharray:0px,10px;stroke-dashoffset:-5px;transform:translate(-50%,50%);stroke-width:1px}100%{stroke-dasharray:10px,10px;stroke-dashoffset:0;transform:translate(0);stroke-width:2px}}
@keyframes ps-arrowB{0%{stroke-dasharray:0px,10px;stroke-dashoffset:-5px;transform:translate(50%,-50%);stroke-width:1px}100%{stroke-dasharray:10px,10px;stroke-dashoffset:0;transform:translate(0);stroke-width:2px}}

/* features block, inline */
.ps-featwrap{padding:var(--ps-sp) var(--ps-gp)}
@media (min-width:768px){.ps-featwrap{padding:var(--ps-sp) var(--ps-gp)}}
.ps-feat{
  display:grid;column-gap:var(--ps-gutter);row-gap:4rem;grid-template-columns:repeat(var(--ps-cols),1fr);grid-template-rows:auto;
  padding:3.5rem var(--ps-gp);background:#010401;color:#fff;border-radius:1rem;font-weight:500
}
@media (min-width:768px){.ps-feat{padding:5rem 0;row-gap:6rem}}
@media (min-width:960px){.ps-feat{padding:7rem 0}}
.ps-feat-hg{grid-column:1/span var(--ps-cols);display:flex;flex-direction:column;gap:1.25rem}
.ps-feat-dl{grid-column:1/span var(--ps-cols);display:grid;gap:3rem var(--ps-gutter);grid-template-columns:subgrid;font-size:16px;line-height:1.3;letter-spacing:-.01rem;font-weight:400}
@media (min-width:768px){
  .ps-feat-hg,.ps-feat-dl{grid-column:2/span calc(var(--ps-cols) - 2)}
  .ps-feat-hg{gap:1.75rem}
}
@media (min-width:960px){
  .ps-feat-hg{display:grid;gap:var(--ps-gutter);grid-template-columns:subgrid}
  .ps-feat-lab{grid-column:1/span 3}
  .ps-feat-lead{grid-column:span 3}
}
@media (min-width:1244px){.ps-feat-dl{grid-column:2/span calc(var(--ps-cols) - 1)}}
.ps-feat-lab{font-size:16px;line-height:1.3;letter-spacing:0;font-weight:400;margin-block:-.175em;max-width:500px;text-wrap:balance;color:#fff}
.ps-feat-lead{font-size:40px;line-height:42px;letter-spacing:-.25px;font-weight:400;margin-block:0;max-width:500px;text-wrap:balance;color:var(--ps-midlight)}
.ps-feat-dl>div{display:flex;flex-direction:column;gap:1rem;grid-column:span var(--ps-cols);max-width:284px;width:100%}
@media (min-width:640px){.ps-feat-dl>div{grid-column:span 2}}
@media (min-width:768px){.ps-feat-dl>div{grid-column:span 3}}
@media (min-width:960px){.ps-feat-dl>div{grid-column:span 4}}
@media (min-width:1244px){.ps-feat-dl>div{grid-column:span 3}}
.ps-feat-dl dt,.ps-feat-dl dd{display:block;margin:0}
.ps-feat-dl dd{color:var(--ps-midlight)}

/* impact */
.ps-impact{--ps-pad:var(--ps-gp);display:flex;flex-direction:column;gap:var(--ps-sgap);padding:var(--ps-sp) 0}
@media (min-width:960px){.ps-impact{--ps-pad:calc(var(--ps-gp) + var(--ps-colw) + var(--ps-gutter))}}
.ps-impact-head{display:flex;flex-direction:column;gap:1.25rem;padding:0 var(--ps-gp)}
@media (min-width:768px){.ps-impact-head{gap:1.75rem}}
@media (min-width:960px){.ps-impact-head{padding:0 calc(var(--ps-gp) + var(--ps-colw) + var(--ps-gutter))}}
.ps-h2{font-size:16px;line-height:1.3;letter-spacing:0;font-weight:400;margin-block:-.175em;max-width:500px;text-wrap:balance}
.ps-icar{
  display:grid;gap:1rem;grid-auto-columns:min-content;grid-auto-flow:column;grid-template-rows:auto auto;max-width:100%;padding:0 var(--ps-pad);scroll-padding:0 var(--ps-pad);width:fit-content;
  overflow-x:auto;overflow-y:clip;scrollbar-width:none;overscroll-behavior-x:contain;white-space:nowrap
}
.ps-icar::-webkit-scrollbar{display:none}
.ps-icar[data-ps-over="1"]{cursor:grab}
@media (pointer:coarse){.ps-icar{scroll-snap-type:x mandatory}.ps-icard{scroll-snap-align:center}}
.ps-icard{
  --ps-cw:calc((min(calc(var(--ps-vw)*.95 - var(--ps-gpmin)*2),var(--ps-maxw)) - var(--ps-gutter)*(var(--ps-cols) - 1))/var(--ps-cols));
  display:grid;grid-row:1/3;grid-template-columns:100%;grid-template-rows:subgrid;gap:1.5rem;aspect-ratio:36/41;border-radius:1rem;height:100%;padding:2.25rem 2rem 3rem;
  user-select:none;white-space:normal;background:#fff;color:#000;width:min(400px,calc(var(--ps-cw)*4 + var(--ps-gutter)*3));vertical-align:top
}
@media (min-width:768px){
  .ps-icard{--ps-cw:calc((var(--ps-maxw) - var(--ps-gutter)*(var(--ps-cols) - 1))/var(--ps-cols));width:calc(var(--ps-cw)*3 + var(--ps-gutter)*2)}
}
.ps-ifig{container:ps-icard/inline-size}
.ps-ifig p{font-size:32cqw;letter-spacing:-.05em;margin-bottom:50cqw;font-weight:500;text-wrap:pretty;font-feature-settings:"kern","liga"}
.ps-ico{display:block;font-size:28cqw;margin-bottom:50cqw;position:relative;top:2.5cqw}
.ps-ico svg{height:1em;width:1em;fill:currentcolor}
.ps-ico svg *{fill:currentcolor}
.ps-ititle{font-size:16px;line-height:1.3;letter-spacing:-.025rem;font-weight:400;margin-bottom:.75em;text-wrap:balance;color:#000}
.ps-itext{font-size:16px;line-height:1.3;letter-spacing:-.01rem;font-weight:400;color:var(--ps-mid);text-wrap:pretty}

/* See others */
.ps-others{display:flex;flex-direction:column;align-items:center;gap:var(--ps-sgap);padding:6rem 0;text-align:center}
.ps-others-hg{display:flex;flex-direction:column;gap:1.25rem;width:100%;align-items:center}
@media (min-width:768px){.ps-others-hg{gap:1.75rem}}
.ps-others-lead{font-size:40px;line-height:42px;letter-spacing:-.25px;font-weight:400;color:var(--ps-mid);max-width:500px;text-wrap:balance}
.ps-flip{--ps-fw:min(calc(var(--ps-vw)*.7),400px);display:grid;margin:-2rem 0;padding:2rem 0;place-items:center;overflow:hidden}
@media (min-width:768px){.ps-flip{overflow:visible}}
.ps-fcar{
  grid-area:1/1;display:grid;grid-auto-flow:column;height:100%;padding:0 3.5rem;scroll-padding:0 3.5rem;width:calc(var(--ps-fw)*1.3 + 14rem);max-width:var(--ps-vw);
  overflow-x:auto;overflow-y:clip;scrollbar-width:none;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;cursor:default
}
@media (any-pointer:fine) and (hover:hover){.ps-fcar{scroll-snap-type:none}}
.ps-fcar::-webkit-scrollbar{display:none}
.ps-fcar[data-ps-over="1"]{cursor:grab}
.ps-slide{align-items:center;display:inline-flex;height:100%;justify-content:center;opacity:0;scroll-snap-align:center;scroll-snap-stop:always;width:min(calc(var(--ps-vw) - 7rem),calc(var(--ps-fw)*1.3 + 7rem))}
.ps-slide a{height:100%;width:var(--ps-fw);-webkit-user-drag:none;user-select:none;display:block}
.ps-stack{grid-area:1/1;display:grid;perspective:calc(var(--ps-fw)*2);pointer-events:none;transform-style:preserve-3d;width:var(--ps-fw)}
.ps-fcard{grid-area:1/1;opacity:var(--ps-vis,1);position:relative;text-align:center;transform-style:preserve-3d;width:var(--ps-fw)}
.ps-fcard-in{display:flex;flex-direction:column;gap:2rem}
.ps-fcover{border-radius:1rem;position:relative}
.ps-fcover img{border-radius:inherit;transition:.8s transform var(--ps-expo);width:100%;height:auto}
.ps-fbody{display:flex;flex-direction:column;gap:1rem;opacity:var(--ps-op,1)}
.ps-ftitle{font-size:17.92px;line-height:1.2;letter-spacing:0;font-weight:500}
.ps-fcar:has(a:hover)~.ps-stack .ps-fcard:first-child img{transform:scale(1.015)}

/* ---------- full story dialog ---------- */
.ps-story{
  position:fixed;inset:40px 0 0 0;width:100%;max-width:100%;height:calc(100dvh - 40px);max-height:100%;margin:0;padding:0;border:0;outline:none;
  border-radius:1.5rem 1.5rem 0 0;background:transparent;color:#000;overflow:clip auto;overscroll-behavior:contain;touch-action:pan-y;
  transform:translateY(100%);transform-origin:center top;will-change:transform;transition:transform 450ms cubic-bezier(.5,.3,0,1);
  color-scheme:light;font-family:"Inter Variable",system-ui,sans-serif;font-size:16px;font-weight:500;-webkit-font-smoothing:antialiased;
  --ps-mid:#5e5855;
}
.ps-story:not([open]){display:none}
.ps-story.ps-story-in{transform:translateY(0)}
.ps-story::backdrop{background:transparent}
.ps-sbg{background:#fff;min-height:100%}
.ps-shandle-wrap{align-items:center;border-radius:1.5rem 1.5rem 0 0;display:flex;height:1.75rem;justify-content:center;margin-bottom:-2rem;overflow:hidden;padding:0 .75rem;position:sticky;top:0;width:100%;z-index:2}
.ps-shandle{background:#ccc;border-radius:2rem;height:5px;position:relative;width:42px;z-index:1}
@media (hover:hover){.ps-shandle-wrap{display:none}}
.ps-sclose{
  position:sticky;float:right;top:.75rem;right:.75rem;margin:0 0 -3.25rem;z-index:2;display:flex;align-items:center;justify-content:center;aspect-ratio:1/1;width:3.125rem;
  background:#f8f8f7;border:0;border-radius:100%;color:#000;cursor:pointer;padding:0;font-size:1.15rem;outline:none;transition:.8s transform var(--ps-expo,cubic-bezier(.19,1,.22,1))
}
.ps-sclose svg{width:1em;height:1em}
.ps-sclose::before{border-radius:inherit;box-shadow:0 21px 13px 0 rgba(0,0,0,.06),0 9px 9px 0 rgba(0,0,0,.1),0 2px 5px 0 rgba(0,0,0,.11);content:"";inset:0;opacity:0;position:absolute;transition:.8s opacity var(--ps-expo,cubic-bezier(.19,1,.22,1))}
@media (any-pointer:fine){.ps-sclose:hover::before{opacity:.3}}
.ps-sclose:focus-visible::before{opacity:.3}
@media (min-width:768px){.ps-sclose{top:1.5rem;right:1.5rem;width:3.25rem}}
@media (any-pointer:fine){.ps-sclose:hover{transform:scale(.95)}}
.ps-sclose:focus-visible,.ps-sclose:active{transform:scale(.95)}
@media (pointer:coarse){.ps-sclose{display:none}}
.ps-scontent{
  display:flex;flex-direction:column;gap:3rem;margin:0 auto;width:100%;color:var(--ps-mid);--ps-smax:490px;
  padding-block:clamp(3.5rem,calc(1.58673rem + var(--ps-vw)*.0816327),6rem);padding-inline:max(1.5rem,calc((100% - var(--ps-smax))/2))
}
.ps-sbody>*{font-feature-settings:"kern","liga";letter-spacing:-.01rem;line-height:1.4;font-size:17.92px;font-weight:400}
.ps-sbody>:first-child{color:#000;line-height:1.05;letter-spacing:-.02em;margin-block:-.175em;font-size:1.8125rem}
@media (min-width:768px){.ps-sbody>:first-child{font-size:2rem}}
@media (min-width:960px){.ps-sbody>:first-child{font-size:2.25rem}}
.ps-sbody>:not(:last-child){margin-bottom:1.35em}
.ps-sbody strong{color:#000;font-weight:inherit}
.ps-scredits{display:flex;flex-direction:column;gap:1.5rem;font-size:16px;line-height:1.3}
.ps-scredits[hidden]{display:none}
.ps-scredits dd{display:flex;flex-direction:column;margin:0}

.ps-cap{position:absolute;left:14px;bottom:14px;max-width:calc(100% - 28px);padding:7px 12px;border-radius:999px;background:rgba(20,20,22,.62);color:#fff;font-size:13px;line-height:1.2;letter-spacing:-.005em;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);pointer-events:none}

/* sections/writing */
/* writing: text block, article row, phone stack and article panel. Prefix wr. */

/* isolation (SPEC 1.8): reset, base text and colour scheme live on the root class, never on body.
   The work frame computed: Inter Variable, #140700, 16px, line-height normal, weight 400, antialiased, color-scheme light. */
:where(.wr-root),:where(.wr-root) *,:where(.wr-root) ::before,:where(.wr-root) ::after{box-sizing:border-box}
.wr-root{
  color-scheme:light;
  font-family:var(--t-font-ui,"Inter Variable",system-ui,sans-serif);
  font-size:16px; line-height:normal; letter-spacing:normal; font-weight:400; text-align:start;
  color:var(--t-dark,#140700);
  -webkit-font-smoothing:antialiased; text-rendering:auto; -webkit-tap-highlight-color:transparent;
}

/* generated by tools/build_css.py: compiled rules of the text block, article row, phone stack and article panel */
:where(.wr-root) *, :where(.wr-root) ::before, :where(.wr-root) ::after{box-sizing: inherit;}
:where(.wr-root) h1, :where(.wr-root) h2, :where(.wr-root) h3, :where(.wr-root) h4, :where(.wr-root) h5, :where(.wr-root) h6, :where(.wr-root) p, :where(.wr-root) ol, :where(.wr-root) ul{margin: 0px; padding: 0px; font-weight: 400; font-size: inherit; line-height: inherit; font-family: inherit;}
:where(.wr-root) img{max-width: 100%; height: auto;}
:where(.wr-root) button{border-width: medium; border-style: none; border-color: currentcolor; border-image: none; margin: 0px; padding: 0px; width: auto; overflow: visible; background: transparent; cursor: pointer; white-space: nowrap; color: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; font-size: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; line-height: normal; -webkit-font-smoothing: inherit; appearance: none;}
:where(.wr-root) button:focus{outline: 0px;}
:where(.wr-root) a{text-decoration: none; color: inherit;}
.wr-root .text-10{font-size: 1.075rem; line-height: 1.45; letter-spacing: 0px;}
@media (min-width: 752px){.wr-root .text-10{font-size: 1.125rem; line-height: 1.45; letter-spacing: 0px;}}
@media (min-width: 1145px){.wr-root .text-10{font-size: 1.125rem; line-height: 1.45; letter-spacing: 0.001rem;}}
.wr-root .text-12{font-size: 0.875rem; line-height: 1.1875rem; letter-spacing: 0rem;}
@media (min-width: 752px){.wr-root .text-12{font-size: 0.875rem; line-height: 1.1875rem; letter-spacing: 0rem;}}
@media (min-width: 1145px){.wr-root .text-12{font-size: 0.875rem; line-height: 1.1875rem; letter-spacing: 0rem;}}
.wr-root .spacing-16-mt{margin-top: 1rem;}
@media (min-width: 752px){.wr-root .spacing-16-mt{margin-top: 1rem;}}
@media (min-width: 1145px){.wr-root .spacing-16-mt{margin-top: 1rem;}}
.wr-root .spacing-128-pb{padding-bottom: 4rem;}
@media (min-width: 752px){.wr-root .spacing-128-pb{padding-bottom: 8rem;}}
@media (min-width: 1145px){.wr-root .spacing-128-pb{padding-bottom: 8rem;}}
.wr-root .spacing-128-pt{padding-top: 4rem;}
@media (min-width: 752px){.wr-root .spacing-128-pt{padding-top: 8rem;}}
@media (min-width: 1145px){.wr-root .spacing-128-pt{padding-top: 8rem;}}
.wr-root{color-scheme: light dark; --color-white: #ffffff; --color-off-white: #F3F3F3; --color-black: #000000; --color-off-black: #111111; --color-off-black-bright: #222222; --color-grey-50: #F7F7F7; --color-grey-100: #eee; --color-grey-200: #BABFC5; --color-grey-500: #73808C; --color-grey-600: #595959; --color-grey-700: #333; --color-light-blue: #E6F3FD; --color-dark-blue: #19A0FC; --breakpoint-tablet: 752px; --breakpoint-desktop: 1145px; --spring-elegant-easing: linear(0 0%, .005927 1%, .022466 2%, .047872 3%, .080554 4%, .119068 5%, .162116 6%, .208536 7.000000000000001%, .2573 8%, .3075 9%, .358346 10%, .409157 11%, .45935 12%, .508438 13%, .556014 14.000000000000002%, .601751 15%, .645389 16%, .686733 17%, .72564 18%, .762019 19%, .795818 20%, .827026 21%, .855662 22%, .881772 23%, .905423 24%, .926704 25%, .945714 26%, .962568 27%, .977386 28%, .990295 28.999999999999996%, 1.001426 30%, 1.010911 31%, 1.018881 32%, 1.025465 33%, 1.030792 34%, 1.034982 35%, 1.038155 36%, 1.040423 37%, 1.041892 38%, 1.042662 39%, 1.042827 40%, 1.042473 41%, 1.04168 42%, 1.040522 43%, 1.039065 44%, 1.037371 45%, 1.035493 46%, 1.03348 47%, 1.031376 48%, 1.029217 49%, 1.027037 50%, 1.024864 51%, 1.022722 52%, 1.020631 53%, 1.018608 54%, 1.016667 55.00000000000001%, 1.014817 56.00000000000001%, 1.013067 56.99999999999999%, 1.011422 57.99999999999999%, 1.009887 59%, 1.008462 60%, 1.007148 61%, 1.005944 62%, 1.004847 63%, 1.003855 64%, 1.002964 65%, 1.002169 66%, 1.001466 67%, 1.000848 68%, 1.000311 69%, .999849 70%, .999457 71%, .999128 72%, .998858 73%, .99864 74%, .99847 75%, .998342 76%, .998253 77%, .998196 78%, .998169 79%, .998167 80%, .998186 81%, .998224 82%, .998276 83%, .998341 84%, .998415 85%, .998497 86%, .998584 87%, .998675 88%, .998768 89%, .998861 90%, .998954 91%, .999045 92%, .999134 93%, .99922 94%, .999303 95%, .999381 96%, .999455 97%, .999525 98%, .999589 99%, .99965 100%); --spring-elegant-easing-light: linear(0 0%, .003894 1%, .014828 2%, .031757 3%, .053732 4%, .079896 5%, .109479 6%, .141786 7.000000000000001%, .176202 8%, .212175 9%, .249219 10%, .286907 11%, .324863 12%, .362763 13%, .400326 14.000000000000002%, .437313 15%, .473521 16%, .508781 17%, .542956 18%, .575932 19%, .607625 20%, .637968 21%, .666915 22%, .694437 23%, .720519 24%, .74516 25%, .76837 26%, .790168 27%, .810581 28.000000000000004%, .829644 28.999999999999996%, .847395 30%, .86388 31%, .879146 32%, .893244 33%, .906226 34%, .918147 35%, .92906 36%, .93902 37%, .948082 38%, .956301 39%, .963727 40%, .970415 41%, .976413 42%, .98177 43%, .986534 44%, .990748 45%, .994457 46%, .997701 47%, 1.000519 48%, 1.002948 49%, 1.005022 50%, 1.006775 51%, 1.008237 52%, 1.009436 53%, 1.010399 54%, 1.011152 55.00000000000001%, 1.011717 56.00000000000001%, 1.012115 56.99999999999999%, 1.012368 57.99999999999999%, 1.012491 59%, 1.012503 60%, 1.012418 61%, 1.01225 62%, 1.012012 63%, 1.011716 64%, 1.011371 65%, 1.010986 66%, 1.010571 67%, 1.010132 68%, 1.009676 69%, 1.009209 70%, 1.008735 71%, 1.00826 72%, 1.007787 73%, 1.00732 74%, 1.006861 75%, 1.006412 76%, 1.005976 77%, 1.005554 78%, 1.005148 79%, 1.004758 80%, 1.004385 81%, 1.00403 82%, 1.003693 83%, 1.003373 84%, 1.003072 85%, 1.002789 86%, 1.002523 87%, 1.002274 88%, 1.002042 89%, 1.001826 90%, 1.001626 91%, 1.001441 92%, 1.00127 93%, 1.001113 94%, 1.000969 95%, 1.000837 96%, 1.000717 97%, 1.000608 98%, 1.000509 99%, 1.00042 100%); --spring-bouyant: linear(0 0%, .004379 1%, .017027 2%, .037197 3%, .064139 4%, .097098 5%, .135326 6%, .178089 7.000000000000001%, .224667 8%, .274366 9%, .326515 10%, .380476 11%, .435642 12%, .491445 13%, .547353 14.000000000000002%, .602874 15%, .65756 16%, .711 17%, .76283 18%, .812725 19%, .860402 20%, .90562 21%, .948177 22%, .98791 23%, 1.024693 24%, 1.058435 25%, 1.089077 26%, 1.116593 27%, 1.140987 28.000000000000004%, 1.162286 28.999999999999996%, 1.180545 30%, 1.19584 31%, 1.208266 32%, 1.217937 33%, 1.22498 34%, 1.229538 35%, 1.231761 36%, 1.231811 37%, 1.229853 38%, 1.226059 39%, 1.220603 40%, 1.213659 41%, 1.205403 42%, 1.196006 43%, 1.185638 44%, 1.174463 45%, 1.162638 46%, 1.150318 47%, 1.137645 48%, 1.124757 49%, 1.111781 50%, 1.098837 51%, 1.086034 52%, 1.073472 53%, 1.061241 54%, 1.04942 55.00000000000001%, 1.038082 56.00000000000001%, 1.027286 56.99999999999999%, 1.017084 57.99999999999999%, 1.007519 59%, .998624 60%, .990425 61%, .982939 62%, .976176 63%, .970139 64%, .964824 65%, .960222 66%, .956318 67%, .953091 68%, .950518 69%, .94857 70%, .947216 71%, .946423 72%, .946154 73%, .946371 74%, .947035 75%, .948105 76%, .949542 77%, .951304 78%, .953352 79%, .955646 80%, .958146 81%, .960816 82%, .963619 83%, .966522 84%, .96949 85%, .972494 86%, .975505 87%, .978496 88%, .981443 89%, .984323 90%, .987118 91%, .989809 92%, .992382 93%, .994822 94%, .99712 95%, .999265 96%, 1.001252 97%, 1.003076 98%, 1.004733 99%, 1.006221 100%); --theme-change-speed: .3s; --overlay-speed: .65s; --page-border-radius: 24px; --page-padding: 32px;}
@media screen and (min-width: 1145px){.wr-root{--page-padding: 0px;}}
:where(.wr-root) p{font-size: 1.075rem; line-height: 1.45; letter-spacing: 0px;}
@media (min-width: 752px){:where(.wr-root) p{font-size: 1.125rem; line-height: 1.45; letter-spacing: 0px;}}
@media (min-width: 1145px){:where(.wr-root) p{font-size: 1.125rem; line-height: 1.45; letter-spacing: 0.001rem;}}
:where(.wr-root) h2, :where(.wr-root) .heading-2{font-size: 1.3125rem; line-height: 1.625rem; letter-spacing: -0.00625rem;}
@media (min-width: 752px){:where(.wr-root) h2, :where(.wr-root) .heading-2{font-size: 1.3125rem; line-height: 1.625rem; letter-spacing: -0.015625rem;}}
@media (min-width: 1145px){:where(.wr-root) h2, :where(.wr-root) .heading-2{font-size: 1.5rem; line-height: 1.75rem; letter-spacing: -0.015625rem;}}
:where(.wr-root) h3, :where(.wr-root) .heading-3{font-size: 1.075rem; letter-spacing: 0px; line-height: 22px;}
@media (min-width: 752px){:where(.wr-root) h3, :where(.wr-root) .heading-3{font-size: 1.125rem; line-height: 1.45; letter-spacing: 0px;}}
@media (min-width: 1145px){:where(.wr-root) h3, :where(.wr-root) .heading-3{font-size: 1.125rem; line-height: 1.45; letter-spacing: 0.001rem;}}
@media (min-width: 752px){:where(.wr-root) h3, :where(.wr-root) .heading-3{line-height: 22px;}}
:where(.wr-root) h1, :where(.wr-root) .heading-1, :where(.wr-root) h2, :where(.wr-root) .heading-2, :where(.wr-root) h3, :where(.wr-root) .heading-3, :where(.wr-root) .wr-button, :where(.wr-root) strong, :where(.wr-root) b{font-weight: 400; font-variation-settings: "wght" 530;}
:where(.wr-root) .wr-section{margin-bottom: 4rem;}
@media (min-width: 752px){:where(.wr-root) .wr-section{margin-bottom: 8rem;}}
@media (min-width: 1145px){:where(.wr-root) .wr-section{margin-bottom: 8rem;}}
@media (min-width: 752px){:where(.wr-root) .wr-section{margin-bottom: 10.25rem;}}
@media (min-width: 752px) and (min-width: 752px){:where(.wr-root) .wr-section{margin-bottom: 10.25rem;}}
@media (min-width: 752px) and (min-width: 1145px){:where(.wr-root) .wr-section{margin-bottom: 10.25rem;}}
:where(.wr-root) .wr-section .wr-component{margin-bottom: 2rem;}
@media (min-width: 752px){:where(.wr-root) .wr-section .wr-component{margin-bottom: 4rem;}}
@media (min-width: 1145px){:where(.wr-root) .wr-section .wr-component{margin-bottom: 4rem;}}
:where(.wr-root) .wr-section .wr-component:last-of-type{margin-bottom: 0px;}
:where(.wr-root) .wr-section:last-of-type{margin-bottom: 0px;}
:where(.wr-root) .wr-rich-text h1, :where(.wr-root) .wr-rich-text h2, :where(.wr-root) .wr-rich-text h3, :where(.wr-root) .wr-rich-text hr + p{margin-top: 2rem;}
@media (min-width: 752px){:where(.wr-root) .wr-rich-text h1, :where(.wr-root) .wr-rich-text h2, :where(.wr-root) .wr-rich-text h3, :where(.wr-root) .wr-rich-text hr + p{margin-top: 4rem;}}
@media (min-width: 1145px){:where(.wr-root) .wr-rich-text h1, :where(.wr-root) .wr-rich-text h2, :where(.wr-root) .wr-rich-text h3, :where(.wr-root) .wr-rich-text hr + p{margin-top: 4rem;}}
:where(.wr-root) .wr-rich-text h1:first-child, :where(.wr-root) .wr-rich-text h2:first-child, :where(.wr-root) .wr-rich-text h3:first-child, :where(.wr-root) .wr-rich-text hr + p:first-child{margin-top: 0px;}
:where(.wr-root) .wr-rich-text p, :where(.wr-root) .wr-rich-text .wr-button, :where(.wr-root) .wr-rich-text h1 + h2, :where(.wr-root) .wr-rich-text h2 + h3, :where(.wr-root) .wr-rich-text h2 + h2, :where(.wr-root) .wr-rich-text h3 + h3{margin-top: 0.5rem;}
@media (min-width: 752px){:where(.wr-root) .wr-rich-text p, :where(.wr-root) .wr-rich-text .wr-button, :where(.wr-root) .wr-rich-text h1 + h2, :where(.wr-root) .wr-rich-text h2 + h3, :where(.wr-root) .wr-rich-text h2 + h2, :where(.wr-root) .wr-rich-text h3 + h3{margin-top: 0.5rem;}}
@media (min-width: 1145px){:where(.wr-root) .wr-rich-text p, :where(.wr-root) .wr-rich-text .wr-button, :where(.wr-root) .wr-rich-text h1 + h2, :where(.wr-root) .wr-rich-text h2 + h3, :where(.wr-root) .wr-rich-text h2 + h2, :where(.wr-root) .wr-rich-text h3 + h3{margin-top: 0.5rem;}}
:where(.wr-root) .wr-rich-text p:first-child, :where(.wr-root) .wr-rich-text .wr-button:first-child, :where(.wr-root) .wr-rich-text h1 + h2:first-child, :where(.wr-root) .wr-rich-text h2 + h3:first-child, :where(.wr-root) .wr-rich-text h2 + h2:first-child, :where(.wr-root) .wr-rich-text h3 + h3:first-child{margin-top: 0px;}
:where(.wr-root) .wr-rich-text h3 + p{margin-top: 1rem;}
@media (min-width: 752px){:where(.wr-root) .wr-rich-text h3 + p{margin-top: 1rem;}}
@media (min-width: 1145px){:where(.wr-root) .wr-rich-text h3 + p{margin-top: 1rem;}}
:where(.wr-root) .wr-rich-text p{color: light-dark(var(--color-grey-600),var(--color-white));}
:where(.wr-root) .wr-rich-text p strong, :where(.wr-root) .wr-rich-text p b{font-weight: 400; font-variation-settings: "wght" 400; color: light-dark(var(--color-black),var(--color-white));}
:where(.wr-root) .wr-rich-text p a:only-child{text-decoration: none; color: light-dark(var(--color-grey-500),var(--color-white));}
:where(.wr-root) .wr-rich-text hr{margin-top: 2rem; margin-bottom: 0px;}
@media (min-width: 752px){:where(.wr-root) .wr-rich-text hr{margin-top: 4rem;}}
@media (min-width: 1145px){:where(.wr-root) .wr-rich-text hr{margin-top: 4rem;}}
:where(.wr-root) .wr-rich-text .wr-component{margin-top: 2rem; margin-bottom: 1.5rem;}
@media (min-width: 752px){:where(.wr-root) .wr-rich-text .wr-component{margin-top: 4rem;}}
@media (min-width: 1145px){:where(.wr-root) .wr-rich-text .wr-component{margin-top: 4rem;}}
@media (min-width: 752px){:where(.wr-root) .wr-rich-text .wr-component{margin-bottom: 2rem;}}
@media (min-width: 1145px){:where(.wr-root) .wr-rich-text .wr-component{margin-bottom: 2rem;}}
:where(.wr-root) .wr-rich-text .wr-component:last-of-type{margin-bottom: 0px;}
:where(.wr-root) hr{display: block; width: 100%; height: 1px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; background-color: light-dark(var(--color-grey-200),var(--color-grey-700));}
:where(.wr-root) p, :where(.wr-root) h1, :where(.wr-root) h2, :where(.wr-root) h3, :where(.wr-root) hr, :where(.wr-root) blockquote, :where(.wr-root) ol, :where(.wr-root) ul, :where(.wr-root) .wr-button{grid-column: var(--span-centered-xs);}
:where(.wr-root) .wr-video, :where(.wr-root) .wr-image{--border-radius: 24px;}
:where(.wr-root) .wr-card-classic{--border-radius: 16px;}
:where(.wr-root) .wr-card-classic.wr-card-classic-med{--min-width: 260px; --max-width: 402px; --width: calc(calc(var(--grid-width) - var(--page-padding) * 2 - calc(var(--grid-columns) - 1) * var(--grid-gap)) / var(--grid-columns) * 7 + 6 * var(--grid-gap)); --aspect-ratio: 4/5;}
@media screen and (min-width: 752px){:where(.wr-root) .wr-card-classic.wr-card-classic-med{--width: calc(calc(var(--grid-width) - var(--page-padding) * 2 - calc(var(--grid-columns) - 1) * var(--grid-gap)) / var(--grid-columns) * 4 + 3 * var(--grid-gap));}}
@media screen and (min-width: 1145px){:where(.wr-root) .wr-card-classic.wr-card-classic-med{--min-width: none; --width: calc(calc(var(--grid-width) - var(--page-padding) * 2 - calc(var(--grid-columns) - 1) * var(--grid-gap)) / var(--grid-columns) * 3 + 2 * var(--grid-gap));}}
:where(.wr-root) .wr-carousel{--_col-width: 0; --offset-left: var(--page-padding); --offset-right: var(--offset-left);}
@media screen and (min-width: 752px){:where(.wr-root) .wr-carousel{--offset-left: calc((var(--os-vw) / 2) - (var(--grid-width) / 2) + var(--_col-width) + var(--grid-gap) + var(--page-padding)); --_col-width: calc(calc(var(--grid-width) - var(--page-padding) * 2 - calc(var(--grid-columns) - 1) * var(--grid-gap)) / var(--grid-columns) * 2 + 1 * var(--grid-gap));}}
@media screen and (min-width: 1145px){:where(.wr-root) .wr-carousel{--_col-width: calc(calc(var(--grid-width) - var(--page-padding) * 2 - calc(var(--grid-columns) - 1) * var(--grid-gap)) / var(--grid-columns) * 2 + 1 * var(--grid-gap));}}
@media screen and (min-width: 1512px){:where(.wr-root) .wr-carousel{--_col-width: calc(calc(var(--grid-width) - var(--page-padding) * 2 - calc(var(--grid-columns) - 1) * var(--grid-gap)) / var(--grid-columns) * 2 + 1 * var(--grid-gap));}}
:where(.wr-root) .wr-l2{--easing: var(--spring-elegant-easing-light); --border-radius: var(--page-border-radius); --grid-column: var(--span-centered-full);}
:where(.wr-root) .wr-l2 .wr-section{margin-bottom: 4rem;}
@media (min-width: 752px){:where(.wr-root) .wr-l2 .wr-section{margin-bottom: 8rem;}}
@media (min-width: 1145px){:where(.wr-root) .wr-l2 .wr-section{margin-bottom: 8rem;}}
:where(.wr-root) .wr-l2 .wr-section:last-of-type{margin-bottom: 0px;}
.wr-root{--spacing-8: .5rem;}
.wr-root{--spacing-16: 1rem;}
.wr-root{--spacing-24: 1.5rem;}
.wr-root{--spacing-32: 2rem;}
.wr-root{--spacing-48: 3rem;}
.wr-root{--spacing-64: 4rem;}
.wr-root{--spacing-96: 6rem;}
.wr-root{--spacing-128: 8rem;}
.wr-root{--spacing-164: 10.25rem;}
.wr-root{--spacing-256: 16rem;}
:where(.wr-root) rect.wr-s-107jivb{fill: var(--icon-close-fill-color, light-dark(var(--color-off-white), var(--color-white)));}
:where(.wr-root) path.wr-s-107jivb{fill: var(--icon-close-stroke-color, light-dark(var(--color-off-black), var(--color-black)));}
.wr-root{--grid-columns: 8; --grid-gap: 16px; --grid-width: var(--os-vw); --span-centered-xs: 1 / -1; --span-centered-sm: 1 / -1; --span-centered-med: 1 / -1; --span-centered-lrg: 1 / -1; --span-centered-full: 1 / -1;}
@media screen and (min-width: 752px){.wr-root{--span-centered-xs: 2 / span 6; --span-centered-sm: 2 / span 6; --span-centered-med: 2 / span 6; --span-centered-lrg: 1 / span 8; --grid-width: calc(752px + var(--page-padding) * 2);}}
@media screen and (min-width: 1145px){.wr-root{--grid-columns: 10; --grid-width: 1145px; --span-centered-xs: 4 / span 4; --span-centered-sm: 3 / span 6; --span-centered-med: 3 / span 6; --span-centered-lrg: 2 / span 8;}}
:where(.wr-root) .wr-grid.wr-s-dtc6qx{--_height: var(--grid-height, "auto"); --_width: var(--grid-width, "auto"); --_padding: var(--page-padding, 0px); display: grid; grid-template-columns: repeat(var(--grid-columns),1fr); column-gap: var(--grid-gap); height: var(--_height); width: var(--_width); pointer-events: none; position: relative; left: 50%; transform: translate(-50%);}
:where(.wr-root) .wr-grid.applyPagePadding.wr-s-dtc6qx{padding: 0 var(--_padding);}
:where(.wr-root) .wr-grid.wr-s-dtc6qx > *{pointer-events: auto;}
:where(.wr-root) .wr-grid.wr-s-dtc6qx .span-centered-xs{grid-column: var(--span-centered-xs);}
:where(.wr-root) .wr-grid.wr-s-dtc6qx .span-centered-sm{grid-column: var(--span-centered-sm);}
:where(.wr-root) .wr-grid.wr-s-dtc6qx .span-centered-med{grid-column: var(--span-centered-med);}
:where(.wr-root) .wr-grid.wr-s-dtc6qx .span-centered-lrg{grid-column: var(--span-centered-lrg);}
:where(.wr-root) .wr-grid.wr-s-dtc6qx .span-centered-full{grid-column: var(--span-centered-full);}
.wr-root .spacing-128-pb.wr-s-v87bja{padding-bottom: 4rem;}
@media (min-width: 752px){.wr-root .spacing-128-pb.wr-s-v87bja{padding-bottom: 8rem;}}
@media (min-width: 1145px){.wr-root .spacing-128-pb.wr-s-v87bja{padding-bottom: 8rem;}}
:where(.wr-root) .wr-l2.wr-s-v87bja{--_depth: var(--depth, 3); --_easing: var(--easing); --_border-radius: var(--border-radius, 20px); --_margin-top-bottom: var(--margin-top-bottom, 20px); background-color: var(--bg-color, light-dark(var(--color-white), var(--color-off-black))); border-radius: var(--_border-radius); width: var(--width, var(--grid-width)); height: 100dvh; margin: 0px auto; inset: 0px; overflow: clip auto; overscroll-behavior: contain; position: fixed; touch-action: pan-y; transform: translateY(calc(100dvh + 50px)); transform-origin: center top; transition-timing-function: var(--_easing); z-index: var(--_depth); transition: transform var(--current-speed, 0ms) var(--_easing);}
:where(.wr-root) .wr-l2.wr-s-v87bja::-webkit-scrollbar{display: none;}
@media screen and (min-width: 752px){:where(.wr-root) .wr-l2.wr-s-v87bja{filter: drop-shadow(rgba(0, 0, 0, 0.1) 0px 20px 32px);}}
:where(.wr-root) .panel-container.wr-s-v87bja{grid-column: var(--grid-column, 1/-1); position: relative; z-index: 2; border-radius: 20px;}
:where(.wr-root) .rounded-card.wr-s-v87bja{container-type: inline-size; overflow: hidden; position: relative; transition: all var(--current-speed, 0ms); width: 100%;}
:where(.wr-root) .close-button.wr-s-v87bja{background: transparent; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; cursor: pointer; display: none; padding: 0px; position: sticky; top: 30px; right: 30px; float: right; margin-right: 30px; margin-bottom: -60px; z-index: 4; transition: transform 0.2s, filter 0.2s; will-change: transform, filter;}
@media (hover: hover){:where(.wr-root) .close-button.wr-s-v87bja:hover{filter: drop-shadow(rgba(0, 0, 0, 0.05) 0px 2px 4px); transform: scale(1.05);}}
@media screen and (min-width: 752px){:where(.wr-root) .close-button.wr-s-v87bja{display: block;}}
:where(.wr-root) .pull-handle-button.wr-s-v87bja{align-items: center; background-color: light-dark(var(--color-white),var(--color-off-black)); border-bottom: 1px solid rgba(0,0,0,var(--_border-bottom-opacity, 0)); border-radius: var(--_border-radius) var(--_border-radius) 0 0; display: flex; height: 30px; justify-content: center; left: 0px; position: sticky; top: 0px; transition: border 0.2s; width: 100%; z-index: 1;}
@media screen and (min-width: 752px){:where(.wr-root) .pull-handle-button.wr-s-v87bja{display: none;}}
:where(.wr-root) .pull-handle.wr-s-v87bja{background-color: light-dark(var(--color-black),var(--color-white)); border-radius: 3px; height: 5px; opacity: 0.35; width: 50px;}
:where(.wr-root) .wr-media-link-overlay.wr-s-1gm0vij{position: absolute; bottom: 0px; left: 0px; display: flex; align-items: flex-end; padding: 20px; width: 100%; height: 100%;}
:where(.wr-root) .wr-media-link-overlay.text-contrast.wr-s-1gm0vij{background: linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0) 54%);}
@media screen and (min-width: 752px){:where(.wr-root) .wr-media-link-overlay.wr-s-1gm0vij{padding: 25px 35px;}}
:where(.wr-root) .wr-media-link-overlay.wr-s-1gm0vij .title:where(.wr-s-1gm0vij){color: var(--color);}
:where(.wr-root) .wr-media-link-overlay.wr-s-1gm0vij .description:where(.wr-s-1gm0vij){opacity: 0.5;}
:where(.wr-root) .wr-media-link-overlay.wr-s-1gm0vij .icon-container:where(.wr-s-1gm0vij){flex: 1 1 0%; text-align: right; align-self: flex-end;}
:where(.wr-root) .wr-video.wr-s-1izb5v3{position: relative; background-color: var(--bg-color, transparent); aspect-ratio: var(--aspect-ratio, auto); border-radius: var(--border-radius, 0px); overflow: hidden; width: 100%; --color: var(--color-black);}
:where(.wr-root) video.wr-s-1izb5v3{display: block; opacity: 0; transition: opacity 0.6s ease-in-out; width: 100%; height: 100%; will-change: opacity; object-fit: cover;}
:where(.wr-root) video.show.wr-s-1izb5v3{will-change: opacity; opacity: 1;}
@keyframes wr-s-y0ptvw-fadeInLogo { 
  0% { opacity: 0; transform: scale(0.8); }
  100% { opacity: 1; transform: scale(1); }
}
:where(.wr-root) path.wr-s-1db10ax{fill: var(--color, light-dark(var(--color-black), var(--color-white)));}
.wr-root .text-10.wr-s-l70769{font-size: 1.075rem; line-height: 1.45; letter-spacing: 0px;}
@media (min-width: 752px){.wr-root .text-10.wr-s-l70769{font-size: 1.125rem; line-height: 1.45; letter-spacing: 0px;}}
@media (min-width: 1145px){.wr-root .text-10.wr-s-l70769{font-size: 1.125rem; line-height: 1.45; letter-spacing: 0.001rem;}}
:where(.wr-root) .wr-card-classic.wr-s-l70769{--_width: var(--width, 100%); --_min-width: var(--min-width, none); --_max-width: var(--max-width, none); --_border-radius: var(--border-radius, 15px); --_aspect-ratio: var(--aspect-ratio, 4 / 5); --_color: var(--color, inherit); position: relative; width: var(--_width); aspect-ratio: var(--aspect-ratio, 4/5); min-width: var(--_min-width); max-width: var(--_max-width); display: flex; align-items: flex-end; padding: 26px; font-size: 18px; color: var(--_color);}
:where(.wr-root) .scale-hover.wr-s-l70769{transition: transform var(--hover-speed, .65s) var(--spring-bouyant),filter var(--hover-speed, .65s) var(--spring-bouyant); will-change: transform, filter; filter: drop-shadow(rgba(0, 0, 0, 0) 0px 0px 0px);}
@media (hover: hover){:where(.wr-root) .scale-hover.wr-s-l70769:hover{transform: scale(1.025); filter: drop-shadow(rgba(0, 0, 0, 0.2) 0px 15px 17px);}}
:where(.wr-root) .background.wr-s-l70769{position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-size: cover; background-position: center center; overflow: hidden; border-radius: var(--_border-radius);}
:where(.wr-root) .cta.wr-s-l70769{display: flex; align-items: flex-start; gap: 15px; position: relative; z-index: 1; width: 100%; text-wrap: pretty; opacity: var(--text-opacity, 1); will-change: opacity;}
:where(.wr-root) .cta.wr-s-l70769 .cta-text:where(.wr-s-l70769){flex: 1 1 0%; width: 90%; max-width: 300px;}
:where(.wr-root) .cta.wr-s-l70769 .description:where(.wr-s-l70769){display: block; margin-top: 0.3rem; opacity: 0.7;}
:where(.wr-root) .icon.wr-s-l70769{display: inline-block; margin-left: auto;}
:where(.wr-root) .icon.icon-align-bottom.wr-s-l70769{align-self: flex-end;}
:where(.wr-root) .wr-carousel.wr-s-uvxath{--_gap: var(--gap, var(--grid-gap)); --_offset-left: var(--offset-left, 10px); --_offset-right: var(--offset-right, var(--_offset-left)); --_width: var(--width, auto); width: var(--_width);}
:where(.wr-root) .scroll-container.wr-s-uvxath{display: flex; gap: var(--_gap); flex-wrap: nowrap; overflow-x: scroll; scroll-padding-inline-start: var(--_offset-left); scroll-padding-inline-end: var(--_offset-right); padding-left: var(--_offset-left); padding-right: var(--_offset-right); padding-top: 42px; margin-top: -42px; padding-bottom: 64px; margin-bottom: -64px; transform: translate(var(--elastic-position-x)); will-change: transform; align-items: var(--align-items, flex-start); scrollbar-width: none;}
:where(.wr-root) .scroll-container.wr-s-uvxath::-webkit-scrollbar{display: none;}
:where(.wr-root) .scroll-container.snapAllowed.wr-s-uvxath{scroll-snap-type: x mandatory; scroll-behavior: smooth;}
:where(.wr-root) .scroll-container.wr-s-uvxath > *{scroll-snap-align: start; flex-shrink: 0;}
:where(.wr-root) .scaled.wr-s-7ajyf5{transform-origin: center center; transform: translate(var(--x, 0px)) scale(var(--scale, 1)); will-change: transform;}
.wr-root .spacing-128-pt.wr-s-5vbhxv{padding-top: 4rem;}
@media (min-width: 752px){.wr-root .spacing-128-pt.wr-s-5vbhxv{padding-top: 8rem;}}
@media (min-width: 1145px){.wr-root .spacing-128-pt.wr-s-5vbhxv{padding-top: 8rem;}}
:where(.wr-root) .wr-rich-text.wr-s-5vbhxv{width: 100%; text-wrap: pretty;}
:where(.wr-root) .wr-image.wr-s-dgd58c{position: relative; background-color: var(--bg-color, transparent); aspect-ratio: var(--aspect-ratio, auto); border-radius: var(--border-radius, 0px); height: var(--height, auto); overflow: hidden; width: 100%; --color: var(--color-white);}
:where(.wr-root) img.wr-s-dgd58c{display: block; opacity: 0; transition: opacity 0.6s ease-in-out; width: 100%; height: 100%; object-fit: cover; will-change: opacity;}
:where(.wr-root) img.loaded.wr-s-dgd58c{opacity: 1;}
@keyframes wr-s-3eqgwl-press-scale { 
  0% { transform: scale(1); }
  50% { transform: scale(0.95); }
  100% { transform: scale(1); }
}
.wr-root .text-12.wr-s-18o0t04{font-size: 0.875rem; line-height: 1.1875rem; letter-spacing: 0rem;}
@media (min-width: 752px){.wr-root .text-12.wr-s-18o0t04{font-size: 0.875rem; line-height: 1.1875rem; letter-spacing: 0rem;}}
@media (min-width: 1145px){.wr-root .text-12.wr-s-18o0t04{font-size: 0.875rem; line-height: 1.1875rem; letter-spacing: 0rem;}}
.wr-root .spacing-16-mt.wr-s-18o0t04{margin-top: 1rem;}
@media (min-width: 752px){.wr-root .spacing-16-mt.wr-s-18o0t04{margin-top: 1rem;}}
@media (min-width: 1145px){.wr-root .spacing-16-mt.wr-s-18o0t04{margin-top: 1rem;}}
.wr-root .spacing-128-pt.wr-s-18o0t04{padding-top: 4rem;}
@media (min-width: 752px){.wr-root .spacing-128-pt.wr-s-18o0t04{padding-top: 8rem;}}
@media (min-width: 1145px){.wr-root .spacing-128-pt.wr-s-18o0t04{padding-top: 8rem;}}
:where(.wr-root) .author-date-flex.wr-s-18o0t04{display: flex; gap: 6px;}
:where(.wr-root) hr.wr-s-18o0t04{margin-top: 48px; margin-bottom: -16px;}
@media screen and (max-width: 751px){:where(.wr-root) hr.wr-s-18o0t04{margin-bottom: 16px;}}
:where(.wr-root) .card-stack-item .wr-card-classic{--width: calc(100% - 60px); margin: 0px 30px;}
:where(.wr-root) .card-stack-item-wrapper.wr-s-3eqgwl{--aspect-ratio: 4 / 5; grid-area: 1 / 1 / 2 / 2; z-index: var(--zIndex); perspective: 300px; width: 100%; height: 100%; transform: scale(calc(1 - .2 * var(--drag-progress))); transition: var(--drag-anim-duration) transform var(--cover-card-ease); will-change: height, transform;}
:where(.wr-root) .preserve-3d.wr-s-3eqgwl{transform-style: preserve-3d;}
:where(.wr-root) .card-stack-item.wr-s-3eqgwl{transform: translate(var(--x)) rotateY(var(--rotationY)) translateZ(var(--innerZ)); will-change: transform; transform-origin: center center;}
:where(.wr-root) .inner.wr-s-3eqgwl{transform: rotate(var(--rotationZ)) translate(var(--innerX)); will-change: transform;}
:where(.wr-root) .inner-rot.wr-s-3eqgwl{transform: rotate(var(--innerRotationZ)) rotateY(var(--innerRotationY)); will-change: transform;}
:where(.wr-root) .positionY.wr-s-3eqgwl{transform: translateY(var(--positionY)); will-change: transform; transition: var(--card-anim-duration) transform var(--cover-card-ease);}
:where(.wr-root) .card-stack.wr-s-131wkyw{display: grid; width: 100%; margin: 0px auto; overflow-x: clip;}

/* ---- shared tokens applied to the cards (ported from the token overrides of the work frame) ----
   !important is kept on the rules that had it: the compiled card rules above set the same properties. */
:where(.wr-root) :where(p,strong,b,span,a,li,h1,h2,h3,h4,h5,button,input,textarea,small,div){font-family:var(--t-font-ui)}
.wr-root #wr-thesis [class*="wr-card"] .background{border-radius:var(--t-r-card)!important}
.wr-root #wr-thesis strong,.wr-root #wr-thesis p strong{font-size:var(--t-title-size)!important;line-height:var(--t-title-lh)!important;font-weight:var(--t-title-wt)!important;color:var(--t-dark)!important}
.wr-root #wr-thesis .description,.wr-root #wr-thesis p span{font-size:var(--t-label-size)!important;line-height:var(--t-label-lh)!important;letter-spacing:var(--t-label-ls)!important;color:var(--t-ink-soft)!important}
.wr-root #wr-thesis .cta-text{max-width:calc(100% - 64px)!important}
/* a card whose picture is dark under its text: light text (hard coded, measured from the pictures) */
.wr-root #wr-thesis a[data-ink="light"] strong,.wr-root #wr-thesis a[data-ink="light"] p strong{color:#fff!important}
.wr-root #wr-thesis a[data-ink="light"] .description,.wr-root #wr-thesis a[data-ink="light"] p span{color:rgba(255,255,255,.78)!important}
.wr-root #wr-thesis .cta .icon{display:none!important}

/* the enlarge mark: one translucent disc on every card thumbnail */
.wr-root #wr-thesis a .background::after{content:"";position:absolute;right:16px;bottom:16px;width:44px;height:44px;border-radius:50%;
  background:rgba(255,255,255,.55) url(/badges/expand.svg) center/16px 16px no-repeat;
  -webkit-backdrop-filter:blur(10px) saturate(1.3);backdrop-filter:blur(10px) saturate(1.3);box-shadow:0 3px 10px rgba(0,0,0,.12);
  transition:transform .35s cubic-bezier(.5,.3,0,1);pointer-events:none}

.wr-root #wr-thesis a:hover .background::after{transform:scale(1.12)}

/* the two paragraphs start on the hero's left line (column 2 of its 4 column grid = 25 percent + 18px); wide screens only */
@media (min-width:1024px){
  .wr-root #wr-text .wr-rich-text-styles>p{grid-column:1 / -1!important;width:448px!important;max-width:100%!important;
    margin-left:calc(18px + var(--os-vw) * .25 - max(24px,(var(--os-vw) - 1145px) / 2))!important}
}

/* ---- article panel and its dim layer ----
   The panel itself is the compiled .wr-l2 rule above (fixed, 1145 wide centred, 100dvh high, slides from below by 650 ms spring).
   Here: layer order, the dim layer that replaces the old page dimmer, hidden state, and the loading placeholder. */
.wr-layer [hidden]{display:none!important}
#wr-scrim{position:fixed;inset:0;z-index:2147482990;background:#fff;opacity:0;pointer-events:none;transition:opacity .65s var(--spring-elegant-easing-light)}
#wr-scrim.on{opacity:.9;pointer-events:auto}
@media (max-width:751px){
  #wr-scrim{background:#010401}
  #wr-scrim.on{opacity:.15;pointer-events:none}
}
#wr-article{z-index:2147483000}
#wr-article:focus{outline:none}
.wr-skel{padding:128px 0 0;display:block;min-height:100dvh}
.wr-skel i{display:block;height:14px;border-radius:7px;background:color-mix(in srgb,#140700 6%,transparent);margin:0 0 14px}
.wr-skel .wr-skel-t{height:26px;width:40%;margin-bottom:22px}
.wr-skel .wr-skel-l{width:100%}
.wr-skel .wr-skel-s{width:64%}
/* open state (a class that the captured rules did not carry): the panel sits 20px from the top */
.wr-root .wr-l2.open.wr-s-v87bja{transform:translateY(calc(var(--_drag-delta) * 1px + var(--_margin-top-bottom)))}

/* ---- pictures, phone layout, states ---- */
.wr-root{color-scheme:light}
/* card pictures are real images (lazy) filling the same box the old background filled */
.wr-root .background{background-color:color-mix(in srgb,var(--slot-ink,#140700) 6%,transparent)}
.wr-root .background img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;display:block}
/* the old page had more sections after the thesis one (hidden), so it was never the last one and kept its space below; a hidden tail section does the same.
   flow-root keeps that space inside the section box, as the old frame height did */
.wr-root#writing{display:flow-root}
/* desktop shows the row, phone shows the stack */
.wr-root #wr-thesis .wr-phone{display:none}
@media (max-width:751px){
  .wr-root #wr-thesis .wr-desk{display:none}
  .wr-root #wr-thesis .wr-phone{display:block}
  .wr-root #wr-thesis .wr-phone.card-stack{display:grid}
  
  .wr-root #wr-thesis.wr-section{position:relative;z-index:1}
  .wr-root #wr-stack{touch-action:pan-y}
}

.wr-root .scroll-container:focus{outline:none}
@media (prefers-reduced-motion:reduce){
  #wr-scrim{transition-duration:.01ms}
}
/* the two paragraphs follow two hidden ones in the old page, so the first also had its 8px top margin */
.wr-root #wr-text .wr-rich-text p:first-child{margin-top:.5rem}
/* links inside article text: plain text plus arrow, no underline */
.wr-root .wr-rich-text p a:only-child::after{content:" \2197";display:inline}
/* the row items are never animated here: no permanent compositor layer per item */
.wr-root .scaled.wr-s-7ajyf5{will-change:auto}

/* references inside the articles: real links, underlined, with a short card on hover or focus that says what the thing is */
.wr-root .wr-rich-text-styles a.wr-ref, .wr-root .wr-rich-text a.wr-ref { position: relative; color: inherit; text-decoration-line: underline; text-decoration-color: color-mix(in srgb, currentColor 45%, transparent); text-underline-offset: 3px; cursor: pointer; transition: text-decoration-color .2s ease, color .2s ease; }
.wr-root a.wr-ref:hover, .wr-root a.wr-ref:focus-visible { color: #140700; text-decoration-color: currentColor; }
.wr-root a.wr-ref:focus-visible { outline: 2px solid #140700; outline-offset: 3px; border-radius: 2px; }
.wr-root a.wr-ref::after { content: attr(data-tip); position: absolute; left: var(--tip-x, 0px); bottom: calc(100% + 10px); width: var(--tip-w, 260px); box-sizing: border-box; padding: 9px 12px; border-radius: 9px; background: #140700; color: #f8f8f7; font-size: .8rem; line-height: 1.4; font-weight: 400; font-style: normal; letter-spacing: 0; text-align: left; text-decoration: none; text-transform: none; white-space: normal; opacity: 0; transform: translateY(4px); pointer-events: none; transition: opacity .16s ease, transform .16s ease; z-index: 10; box-shadow: 0 10px 28px rgba(20, 7, 0, .2); }
.wr-root a.wr-ref.tip-below::after { bottom: auto; top: calc(100% + 10px); transform: translateY(-4px); }
.wr-root a.wr-ref:hover::after, .wr-root a.wr-ref:focus-visible::after { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .wr-root a.wr-ref, .wr-root a.wr-ref::after { transition: none; } }
/* an older rule gave a lone link in a paragraph an arrow after it: references use the card instead */
.wr-root .wr-rich-text p a.wr-ref:only-child::after, .wr-root .wr-rich-text-styles p a.wr-ref:only-child::after { content: attr(data-tip); display: block; }
.wr-root .wr-rich-text p a.wr-ref:only-child { text-decoration-line: underline; }

/* hover card with an image: thumbnail on the left, sentence on the right */
.wr-root a.wr-ref[data-img]::after { padding: 12px 14px 12px 112px; min-height: calc(var(--ref-h, 90px) + 24px); background-color: #140700; background-image: var(--ref-img); background-repeat: no-repeat; background-position: 14px 12px; background-size: 84px auto; display: flex; align-items: center; }
.wr-root .wr-rich-text p.wr-credits a { text-decoration-line: underline; text-underline-offset: 2px; }

/* figures in articles: one equal gap above and below, whatever sits next to them */
.wr-root .wr-rich-text-styles p:has(> img) { margin: 44px 0 !important; padding: 0; line-height: 0; }
.wr-root .wr-rich-text-styles p > img { display: block; margin: 0 !important; }
.wr-root .wr-rich-text-styles p:has(> img) + h3 { margin-top: 0 !important; }
.wr-root .wr-rich-text-styles p:has(> img) + p { margin-top: 0 !important; }

/* the title is set on the cover itself; keep the text for screen readers only */
.wr-root .wr-card-classic .cta { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; white-space: nowrap !important; }

/* the cover figure sits the same distance from the rule above as from the text below */
.wr-root .wr-rich-text-styles > p:first-child:has(> img) { margin-top: -4px !important; }

/* sections/clock */
/* Clock section. Geometry first (the section is the last of the page and has its exact height from first paint),
   then the scene stylesheets scoped under .ck-root, then the overrides of tools/style.tail.css. */
.ck-root {
  --ck-ring: max(1400px, min(1800px, calc(var(--os-vw, 1440px) * .98)));
  --ck-sec: calc(600svh + var(--ck-ring) * .35);
  --ck-skip: calc(.33 * (var(--ck-sec) - 100svh));
  position: relative;
  display: flow-root;
  overflow: clip;
  height: var(--ck-h, calc(var(--ck-sec) - var(--ck-skip)));
  color-scheme: light;
  color: #000;
  font-family: var(--t-font-ui, "Inter Variable", system-ui, sans-serif);
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
  letter-spacing: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: auto;
  text-wrap: balance;
}
@media (max-width: 1024px) {
  .ck-root { --ck-ring: min(1800px, calc(var(--os-vw, 390px) * 1.22)); }
}
:where(.ck-root) *, :where(.ck-root) *::before, :where(.ck-root) *::after { margin: 0; padding: 0; box-sizing: border-box; }
:where(.ck-root) :where(h1, h2, h3, h4, h5, h6) { font-weight: 400; font-size: inherit; }
:where(.ck-root) a { color: inherit; text-decoration: none; }

/* ---- scene stylesheets, scoped under .ck-root (generated by tools/build_clock.py) ---- */
.ck-root .text-1{font-family:var(--font-headline);font-weight:500;font-size:var(--text-1);line-height:.85;letter-spacing:-.04em;color:var(--color-black)}
.ck-root .text-2{font-family:var(--font-headline);font-weight:500;font-size:var(--text-2);line-height:.85;letter-spacing:-.03em;color:var(--color-black)}
.ck-root .text-3{font-family:var(--font-headline);font-weight:500;font-size:var(--text-3);line-height:.9;letter-spacing:-.02em;color:var(--color-black)}
.ck-root .text-4{font-family:var(--font-headline);font-weight:500;font-size:var(--text-4);line-height:.85;letter-spacing:-.03em;color:var(--color-black)}
.ck-root .text-5{font-family:var(--font-regular);font-weight:400;font-size:var(--text-5);line-height:1.1;letter-spacing:-.02em;color:var(--color-body)}
.ck-root .text-6{font-family:var(--font-light);font-weight:300;font-size:var(--text-6);line-height:1.4;letter-spacing:0;color:var(--color-body)}
.ck-root .text-7{font-family:var(--font-headline);font-weight:500;font-size:var(--text-7);line-height:normal;letter-spacing:-.015em;color:var(--color-black)}
.ck-root .text-8{font-family:var(--font-mono);font-weight:400;font-size:var(--text-8);line-height:normal;letter-spacing:.05em;text-transform:uppercase;color:var(--color-body)}
.ck-root .text-4.text-4--loose{line-height:1}
.ck-root .text-4.text-4--modal{line-height:.95;letter-spacing:-.02em}
@media(max-width:768px){.ck-root .text-7{font-size:var(--text-8)}}
.ck-root{--reveal-stagger-tight: 40ms;--reveal-stagger: 60ms;--reveal-stagger-loose: 90ms;--reveal-distance: 12%;--reveal-duration: .7s;--reveal-ease: var(--ease-out-expo);--reveal-max-index: 6}
.ck-root{--visual-viewport-height: 100svh;--font-headline: "AntiqueLegacy", serif;--font-regular: "AntiqueLegacy", serif;--font-light: "AntiqueLegacy", serif;--font-mono: "FragmentMono", monospace;--text-1: 160px;--text-2: 96px;--text-3: 56px;--text-4: 40px;--text-5: 20px;--text-6: 18px;--text-7: 16px;--text-8: 14px;--color-black: #000;--color-body: #1A1A1A;--color-red: #2E6FE6;--color-red-remote: #2E6FE6;--color-grey-60: #666;--color-white: #fff;--color-shadow: #e6e6e6;--color-grey-muted: #6F7680;--color-green: #6BFF91;--color-border: #e6e6e6;--shadow-medium: 0 24px 32px rgba(0, 0, 0, .12);--shadow-card-hover: 0px 12px 31px 0px rgba(0, 0, 0, .12);--shadow-card-hover-off: 0px 12px 31px 0px rgba(0, 0, 0, 0);--grid-max: 1440px;--grid-cols: 10;--space-0: 0;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--space-16: 64px;--space-20: 80px;--space-24: 96px;--space-30: 120px;--space-41: 164px;--page-pad: var(--space-12);--page-pad-mobile: var(--space-4);--page-gutter: max(var(--page-pad), calc((var(--os-vw) - var(--grid-max)) / 2 + var(--page-pad)));--radius-card: 24px;--radius-card-mobile: 12px;--card-w: 415px;--card-h: 558px;--card-gap: var(--space-6);--card-slot-min-h: var(--card-h);--ds-section-padding-y: var(--space-30);--ds-section-padding-y-mobile: var(--space-16);--ds-section-content-gap: var(--space-24);--ds-section-content-gap-mobile: var(--space-12);--ds-section-grid-gap: var(--space-12);--ds-section-grid-gap-mobile: var(--space-8);--ds-text-stack-gap: var(--space-10);--ds-text-stack-gap-mobile: var(--space-8);--ds-text-stack-group-gap: var(--space-6);--ds-text-stack-paragraph-gap: var(--space-4);--ds-text-stack-grid-gap: var(--space-16);--ds-text-stack-grid-gap-mobile: var(--space-8);--ds-text-stack-cta-gap: var(--space-2);--ds-text-stack-cta-text-gap: var(--space-3);--ds-text-stack-cta-padding-y: var(--space-3);--ds-text-stack-cta-padding-x: var(--space-5);--ds-card-padding-y: var(--space-12);--ds-card-padding-x: var(--space-8);--ds-card-padding-y-mobile: var(--space-8);--ds-card-padding-x-mobile: var(--space-6);--ds-text-stack-max-width: 520px;--ds-card-caption-max-width: 303px;--ease-out-expo: cubic-bezier(.16, 1, .3, 1);--ease-out-quint: cubic-bezier(.22, 1, .36, 1);--ease-in-out-quint: cubic-bezier(.83, 0, .17, 1);--ease-out-back: cubic-bezier(.34, 1.56, .64, 1);--ease-spring: cubic-bezier(.175, .885, .32, 1.275);--ease-spring-bouncy: linear(0, .008, .032 2%, .13 4.4%, .26 6.6%, .681 13%, .891 17.1%, .968, 1.028, 1.073, 1.103 25.2%, 1.114, 1.119, 1.12, 1.115 31.4%, 1.098 34.4%, 1.042 41.6%, 1.017 45.4%, .998 49.5%, .988 53.9%, .986 60.4%, 1.001 80.9% 100%);--ease-spring-medium: linear(0 0%, .005927 1%, .022466 2%, .047872 3%, .080554 4%, .119068 5%, .162116 6%, .208536 7.000000000000001%, .2573 8%, .3075 9%, .358346 10%, .409157 11%, .45935 12%, .508438 13%, .556014 14.000000000000002%, .601751 15%, .645389 16%, .686733 17%, .72564 18%, .762019 19%, .795818 20%, .827026 21%, .855662 22%, .881772 23%, .905423 24%, .926704 25%, .945714 26%, .962568 27%, .977386 28%, .990295 28.999999999999996%, 1.001426 30%, 1.010911 31%, 1.018881 32%, 1.025465 33%, 1.030792 34%, 1.034982 35%, 1.038155 36%, 1.040423 37%, 1.041892 38%, 1.042662 39%, 1.042827 40%, 1.042473 41%, 1.04168 42%, 1.040522 43%, 1.039065 44%, 1.037371 45%, 1.035493 46%, 1.03348 47%, 1.031376 48%, 1.029217 49%, 1.027037 50%, 1.024864 51%, 1.022722 52%, 1.020631 53%, 1.018608 54%, 1.016667 55.00000000000001%, 1.014817 56.00000000000001%, 1.013067 56.99999999999999%, 1.011422 57.99999999999999%, 1.009887 59%, 1.008462 60%, 1.007148 61%, 1.005944 62%, 1.004847 63%, 1.003855 64%, 1.002964 65%, 1.002169 66%, 1.001466 67%, 1.000848 68%, 1.000311 69%, .999849 70%, .999457 71%, .999128 72%, .998858 73%, .99864 74%, .99847 75%, .998342 76%, .998253 77%, .998196 78%, .998169 79%, .998167 80%, .998186 81%, .998224 82%, .998276 83%, .998341 84%, .998415 85%, .998497 86%, .998584 87%, .998675 88%, .998768 89%, .998861 90%, .998954 91%, .999045 92%, .999134 93%, .99922 94%, .999303 95%, .999381 96%, .999455 97%, .999525 98%, .999589 99%, .99965 100%);--bp-mobile: 768px}
@media(max-width:768px){.ck-root{--text-1: clamp(64px, calc(var(--os-vw) * 25 / 100), 96px);--text-2: 56px;--text-3: 40px;--text-4: 32px;--text-5: 18px;--text-6: 18px;--text-7: 16px;--text-8: 14px;--card-w: min(calc(var(--os-vw) * 75 / 100), 360px);--card-gap: var(--space-4);--card-slot-min-h: auto}}
:where(.ck-root) *,:where(.ck-root) *:before,:where(.ck-root) *:after{margin:0;padding:0;box-sizing:border-box}
.ck-root h1,.ck-root h2,.ck-root h3,.ck-root h4,.ck-root h5,.ck-root h6{font-weight:400;font-size:inherit}
.ck-root a{color:inherit;text-decoration:none}
.ck-root{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-wrap:balance}
.ck-root{width:100%;overflow-x:clip}
.ck-root [data-dom-layout]{position:relative;width:var(--os-vw);height:auto;overflow:visible;pointer-events:auto}
.ck-root img{max-width:100%;height:auto;display:block;-webkit-touch-callout:none;user-select:none}
.ck-root .layout-root{position:relative;width:100%;min-height:100svh}
.ck-root .layout-inner{position:relative;width:100%}
.ck-root .section{position:relative;width:100%;overflow:visible}
.ck-root .headline{--side-bearing: -.08em;margin-left:var(--side-bearing);user-select:none}
.ck-root .countdown-headline-type{font-family:var(--font-headline);font-weight:500;font-size:1600px;line-height:.7;letter-spacing:-.04em;color:var(--color-black)}
.ck-root .shape{position:absolute}
.ck-root .layout-root{--hero-live-pad-x: calc(var(--page-pad) + 4px)}
@media(max-width:768px){.ck-root .layout-root{--hero-live-pad-x: calc(var(--page-pad-mobile) + 4px)}}
.ck-root .countdown{--ring-size: max(1400px, min(1800px, calc(var(--os-vw) * 98 / 100)));--clock-accent: #2E6FE6;--clock-tick: #E5E5E5;position:relative;pointer-events:none;margin-top:max(-140svh,-1300px);padding-bottom:calc(var(--ring-size) * .35)}
.ck-root .countdown-stage{position:relative;height:600svh}
.ck-root .countdown-stage-sticky{position:sticky;top:var(--ck-lag,0px);height:100svh;overflow:visible;z-index:1;isolation:isolate}
.ck-root .countdown [data-id=countdown-headline]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;width:100%;font-size:calc(var(--ring-size) * .75);visibility:hidden}
.ck-root .cd-ring{top:50%;left:50%;transform:translate(-50%,-50%);width:var(--ring-size);height:var(--ring-size);border-radius:50%}
.ck-root .dom-clock-wrap,.ck-root .dom-clock-hand-wrap{position:absolute;top:0;left:50%;width:var(--ring-size);height:var(--ring-size);transform:translate(-50%,100svh);visibility:hidden;pointer-events:none;will-change:transform}
.ck-root .dom-clock-wrap{z-index:10}
.ck-root .dom-clock-hand-wrap{z-index:12} /* os-allow */
.ck-root .dom-clock{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.ck-root .dom-clock-ring{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:visible}
.ck-root .dom-clock-hand-layer{position:absolute;top:calc(var(--ring-size) / 2);left:50%;transform:translate(-50%,-50%);width:calc(var(--ring-size) / 1.6);aspect-ratio:1;pointer-events:none;z-index:2}
.ck-root .dom-clock-hand-dial{position:absolute;inset:0;width:100%;height:100%;filter:drop-shadow(0 2px 4px rgba(0,0,0,.25));will-change:transform}
.ck-root .dom-clock-digits{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(1.05);width:calc(var(--ring-size) * .726);display:flex;gap:0;align-items:stretch;pointer-events:none;transition:transform .5s var(--ease-spring-bouncy)}
.ck-root .dom-clock-digits.is-filled{transform:translate(-50%,-50%) scale(.95)}
.ck-root .dom-clock-digit-slot{flex:1;position:relative;aspect-ratio:66 / 88}
.ck-root .dom-clock-digit-slot svg{display:block;width:100%;height:100%}
.ck-root .countdown .manifesto.manifesto--countdown{position:absolute;top:0;left:50%;transform:translate(-50%) translateY(var(--manifesto-y, 78svh));visibility:var(--manifesto-vis, hidden);width:var(--os-vw);margin:0;padding:24px 0 0;pointer-events:none;z-index:11;isolation:isolate} /* os-allow */
.ck-root .countdown .manifesto.manifesto--countdown .button-row{pointer-events:auto}
@media(max-width:1024px){.ck-root .countdown{--ring-size: min(1800px, calc(var(--os-vw) * 122 / 100))}.ck-root .countdown .manifesto--countdown .manifesto-columns:before{display:block}}
.ck-root .manifesto{position:relative;margin-top:-430px;padding:80px 0 100px;z-index:1}
.ck-root .manifesto-columns{position:relative;display:grid;max-width:var(--grid-max);margin:0 auto;grid-template-columns:repeat(var(--grid-cols),1fr);padding:140px 40px}
.ck-root .manifesto-columns:before{content:"";position:absolute;inset:0 0 0 50%;transform:translate(-50%);width:var(--os-vw);background:linear-gradient(to bottom,transparent 0%,var(--color-white) 35%);pointer-events:none;z-index:-1}
.ck-root .manifesto-left{grid-column:3 / span 3;padding-right:80px}
.ck-root .manifesto-right{grid-column:6 / span 3;padding-right:32px}
.ck-root .manifesto-headline{text-wrap:pretty}
.ck-root .manifesto-body.text-5{color:var(--color-black);max-width:480px;margin-bottom:26px;text-wrap:pretty}
.ck-root .manifesto-btn{--pill-gap: 8px;--pill-text-gap: 10px;--pill-pad-x-start: 20px;--pill-pad-x-end: 24px;--pill-gap-mobile: 6px;--pill-pad-x-start-mobile: 14px;--pill-pad-x-end-mobile: 18px}
.ck-root .manifesto-btn .manifesto-btn__mark{--pill-icon-size: 18px;width:18px;height:auto;transform:translateY(-.5px)}
@media(max-width:1280px)and (min-width:1025px){.ck-root .manifesto-left{grid-column:2 / span 3;padding-right:0}.ck-root .manifesto-right{grid-column:6 / span 4}}
@media(max-width:1024px){.ck-root .manifesto{margin-top:0}.ck-root .manifesto-columns:before{display:none}.ck-root .countdown .manifesto--countdown .manifesto-columns:before{display:block;top:-120px}.ck-root .manifesto-columns{grid-template-columns:1fr;padding:0 var(--page-pad-mobile);height:auto;text-align:center;justify-items:center;max-width:480px;margin:0 auto}.ck-root .manifesto-left{grid-column:1;padding-right:0;margin-bottom:20px}.ck-root .manifesto-right{grid-column:1;display:flex;flex-direction:column;align-items:center;padding-right:0}.ck-root .manifesto-body.text-5{max-width:100%}}
.ck-root .button-row{display:flex;align-items:center;gap:var(--pill-gap, 8px);width:fit-content}
.ck-root button.button-row{appearance:none;border:0;padding:0;background:none;font:inherit;color:inherit;text-align:inherit;cursor:pointer}
.ck-root button.button-row:focus-visible{outline:none}
.ck-root button.button-row:focus-visible .btn-pill{outline:2px solid var(--color-body);outline-offset:2px}
.ck-root button.button-row:disabled{cursor:wait}
.ck-root button.button-row:disabled .btn-pill{cursor:wait;opacity:.72}
.ck-root button.button-row:disabled:hover .btn-pill{transform:none;box-shadow:0 2px 32px #0000001f}
.ck-root .btn-pill{--pill-h: 44px;--pill-icon-size: 20px;display:inline-flex;align-items:center;justify-content:center;height:var(--pill-h);padding-block:var(--pill-pad-y, 12px);padding-inline:var(--pill-pad-x-start, 18px) var(--pill-pad-x-end, 18px);border-radius:9999px;border:1px solid rgba(0,0,0,.1);background:var(--color-white);box-shadow:0 2px 32px #0000001f;cursor:pointer;flex-shrink:0;white-space:nowrap;text-decoration:none;transition:transform .8s var(--ease-out-quint),box-shadow .8s var(--ease-out-quint);will-change:transform}
.ck-root .button-row:hover .btn-pill{transform:scale(1.015);box-shadow:0 3px 32px #00000021}
.ck-root .button-row:active .btn-pill,.ck-root .btn-pill:active{transform:scale(.97)}
.ck-root .btn-pill--icon{width:var(--pill-h);padding:0}
.ck-root .btn-pill__icon{--nudge-x: 1.5px;--nudge-y: -1.5px;width:var(--pill-icon-size);height:var(--pill-icon-size);will-change:transform}
.ck-root .btn-pill__icon--forward{--nudge-y: 0}
.ck-root .button-row:hover .btn-pill--icon .btn-pill__icon{animation:ck-arrow-nudge .8s var(--ease-out-quint) both}
@keyframes ck-arrow-nudge{0%{transform:translate(0)}50%{transform:translate(var(--nudge-x),var(--nudge-y))}to{transform:translate(0)}}
.ck-root .btn-dark .btn-pill{background:var(--color-black);border-color:var(--color-black);color:#fff;box-shadow:none}
.ck-root .btn-pill__text{display:inline-flex;align-items:center;gap:var(--pill-text-gap, 12px);white-space:nowrap}
@media(max-width:768px){.ck-root .btn-pill{padding-block:var(--pill-pad-y-mobile, 15px)}.ck-root .button-row{gap:var(--pill-gap-mobile, 6px)}.ck-root .button-row .btn-pill{--pill-h: 42px;padding-block:var(--pill-pad-y-mobile, 13px);padding-inline:var(--pill-pad-x-start-mobile, 16px) var(--pill-pad-x-end-mobile, 16px)}.ck-root .button-row .btn-pill--icon{padding:0}}

/* ---- overrides for the single page ---- */
.ck-root {
  --font-headline: var(--t-font-ui, "Inter Variable", system-ui, sans-serif);
  --font-regular: var(--t-font-ui, "Inter Variable", system-ui, sans-serif);
  --font-light: var(--t-font-ui, "Inter Variable", system-ui, sans-serif);
  --font-mono: var(--t-font-ui, "Inter Variable", system-ui, sans-serif);
  --color-white: #f8f8f7;
}
.ck-root .countdown { --ring-size: var(--ck-ring); margin-top: calc(-1 * var(--ck-skip)); }
.ck-root [data-dom-layout].ck-reading .countdown { margin-top: 0; }
.ck-root { background: transparent; }
.ck-root [data-layout="image"] { display: block; height: auto; }
.ck-root .manifesto--countdown .manifesto-btn__mark { display: none; }
/* no background of its own: the shared backdrop (#os-backdrop) is the only one */

/* the intro: the section stays invisible until the first build has played (the old frame did the same) */
.ck-root .ck-mount { display: flow-root; opacity: 0; pointer-events: none; }
.ck-root.ck-ready .ck-mount { opacity: 1; pointer-events: auto; }

/* canvas: a pinned window the height of the screen at the top of the section, moved by the page itself */
.ck-root .ck-canvaswrap {
  position: sticky;
  top: 0;
  z-index: 5;
  height: 100svh;
  margin-bottom: -100svh;
  pointer-events: none;
}
.ck-root .ck-canvas { display: block; width: 100%; height: 100%; touch-action: none; pointer-events: none; visibility: hidden; }
.ck-root.ck-live .ck-canvas { visibility: visible; }

/* the dive: the whole section is raised above the page and the pinned window becomes the screen */
.ck-root.ck-diving { z-index: 2147483000; }
.ck-root.ck-diving .ck-canvaswrap { position: fixed; inset: 0; margin: 0; height: auto; pointer-events: auto; }
.ck-root.ck-diving .ck-canvas { visibility: visible; }

/* island for the dive world: takes no space and shows nothing, the scene reads its layout */
.ck-root .ck-mine-wrap { position: relative; height: 0; overflow: clip; visibility: hidden; pointer-events: none; }
.ck-root .ck-mine { position: absolute; left: 0; bottom: 0; display: block; width: 100%; padding: 640px 0 760px; color: #fff; font-family: var(--t-font-ui, "Inter Variable", system-ui, sans-serif); }
.ck-root .ck-mine > * { width: 672px; margin-left: calc(50% - 336px); margin-right: 0; }
.ck-root .ck-mine h2 { font-size: 36px; line-height: 1; font-weight: 500; letter-spacing: -.03em; margin-top: 0; margin-bottom: 18px; }
.ck-root .ck-mine .ck-m-grid { display: grid; margin-bottom: 620px; }
.ck-root .ck-mine .ck-m-projects { grid-template-columns: repeat(5, 120px); gap: 22px 18px; justify-content: start; }
.ck-root .ck-mine .ck-m-articles { width: 840px; margin-left: calc(50% - 420px); grid-template-columns: repeat(6, 110px); justify-content: start; gap: 14px 12px; }
.ck-root .ck-mine [data-id="mine-h-articles"] { margin-left: calc(50% - 420px); }
.ck-root .ck-mine figure { margin: 0; }
.ck-root .ck-mine img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 9px; }
.ck-root .ck-mine .ck-m-articles img { aspect-ratio: 4/5; border-radius: 9px; }
.ck-root .ck-mine figcaption { font-size: 17px; line-height: 1.2; margin-top: 8px; }
.ck-root .ck-mine .ck-m-articles figcaption { font-size: 14px; }
.ck-root .ck-mine .ck-m-name { font-size: 68px; line-height: 1; font-weight: 500; letter-spacing: -.03em; margin-bottom: 26px; width: 700px; margin-left: calc(50% - 350px); }
.ck-root .ck-mine .ck-m-bio { font-size: 22px; line-height: 1.3; width: 640px; margin-left: calc(50% - 350px); margin-bottom: 26px; }
.ck-root .ck-mine .ck-m-links { font-size: 22px; margin-left: calc(50% - 350px); }

/* email button: the check that covers the icon pill for a moment after a click */
.ck-root .ck-check { position: fixed; z-index: 10; pointer-events: none; border-radius: 50%; background: #000; display: flex; align-items: center; justify-content: center; }
.ck-root .ck-probe { position: absolute; left: 0; top: 0; width: 1px; height: var(--ck-sec); visibility: hidden; pointer-events: none; }

/* entry: the pinned stage sits at the section top while that is still below the screen top */
.ck-root .countdown-stage-sticky { top: var(--ck-lag, 0px); }