@layer world {
  /* Editorial monochrome. Near-white, enormous margins, photography is the
     only colour on the page. The restraint is the argument. */
  :root {
    --surface:   var(--sf-paper-50);
    --surface-2: var(--sf-paper-100);
    --ink:       #16181A;
    --ink-quiet: var(--sf-grey-500);
    --rule:      color-mix(in oklab, #16181A 14%, transparent);

    --font-display: 'Fraunces', Georgia, serif;
    --display-wdth: 100;
    --display-wght: 400;
    --display-tracking: -.015em;

    --measure: 58ch;
    --rhythm:  clamp(4rem, 10vw, 10rem);

    --ease-world:   cubic-bezier(.32, .06, .12, 1);  /* nothing snaps */
    --dur-assemble: .9s;
    --dur-reveal:   1.1s;
    --dur-vt:       .7s;
  }

  .hero__h { text-transform: none; font-style: italic; }
  .panel__name { text-transform: none; }

  /* An iris, not a wipe — the O in the logo, opening. */
  /* 1.5x so the iris clears the corners of a 16:9 box at full open —
     circle(100%) resolves against the diagonal and leaves them cut. */
  .hero__frame { clip-path: circle(calc(var(--frame-reveal) * 1.5) at 50% 50%); }

  .piece--iris     { inset: 0; margin: auto; width: min(60%, 34rem); }
  .piece--iris circle { stroke: var(--sf-paper-50); fill: none; }
  .piece--datecard { bottom: 12%; left: 50%; translate: -50% 0; width: min(40%, 18rem); }
  .piece--datecard line { stroke: var(--sf-paper-50); }
}
