@layer reset, theme, base, components, utilities;

@font-face {
  font-family: "Geist";
  src: url("../fonts/geist-v1.woff2") format("woff2");
  font-weight: 400 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Geist Mono";
  src: url("../fonts/geist-mono-v1.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Serif";
  src: url("../fonts/serif-v1.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: optional;
}
@font-face {
  font-family: "Instrument Serif";
  src: url("../fonts/serif-italic-v1.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: optional;
}
@font-face {
  font-family: "Noto Sans Devanagari";
  src: url("../fonts/deva-v1.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF;
}
@font-face {
  font-family: "Geist Fallback";
  src: local("Arial"), local("ArialMT");
  size-adjust: 104.72%;
  ascent-override: 95.97%;
  descent-override: 28.17%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "Geist Fallback Android";
  src: local("Roboto"), local("Roboto-Regular");
  size-adjust: 104.77%;
  ascent-override: 95.93%;
  descent-override: 28.16%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "Serif Fallback";
  src: local("Times New Roman"), local("TimesNewRomanPSMT");
  font-style: normal;
  size-adjust: 82.59%;
  ascent-override: 119.87%;
  descent-override: 37.53%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "Serif Fallback";
  src: local("Times New Roman Italic"), local("TimesNewRomanPS-ItalicMT");
  font-style: italic;
  size-adjust: 82.59%;
  ascent-override: 119.87%;
  descent-override: 37.53%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "Serif Fallback Android";
  src: local("Noto Serif"), local("NotoSerif");
  size-adjust: 70.35%;
  ascent-override: 140.73%;
  descent-override: 44.07%;
  line-gap-override: 0%;
}

@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  html { -webkit-text-size-adjust: 100.0%; text-size-adjust: 100.0%; }
  body, h1, h2, h3, h4, p, figure, blockquote, dl, dd, ol, ul { margin: 0; }
  ol, ul { padding: 0; list-style: none; }
  img, svg, video { display: block; max-inline-size: calc(2 * 50%); }
  img { block-size: auto; }
  button, input, select, textarea { font: inherit; color: inherit; }
  button { background: none; border: 0; padding: 0; cursor: pointer; }
  a { color: inherit; }
  summary { cursor: pointer; }
  dialog { padding: 0; border: 0; color: inherit; }
}

@layer theme {
  :root {
    color-scheme: light;

    --paper: #fbf8f2;
    --paper-2: #f3efe6;
    --paper-3: #ebe6da;
    --surface: #fffdf9;
    --bubble: #ffffff;
    --ink: #16201f;
    --muted: #4d5b5a;
    --duo: #6b7473;
    --teal: #2f7574;
    --teal-deep: #1f5453;
    --teal-text: #2f7574;
    --on-teal: #ffffff;
    --btn: #2f7574;
    --btn-hover: #1f5453;
    --mint: #dcefea;
    --mint-ink: #16201f;
    --marigold: #f2b544;
    --marigold-ink: #16201f;
    --marigold-soft: #fbecc9;
    --coral: #f29a80;
    --staff: #fdf3dc;
    --staff-line: #eed9a6;
    --line: #e3e0d8;
    --line-strong: #d2cdc1;
    --dot: rgb(22 32 31 / .13);
    --focus: #2f7574;

    --night: #0d2423;
    --night-2: #12302e;
    --night-panel: rgb(4 18 17 / .38);
    --night-text: #eef3f1;
    --night-muted: #a9bdba;
    --night-teal: #6cc3bd;
    --night-line: rgb(238 243 241 / .14);
    --night-grain: .11;

    --shadow-card:
      0 1px 0 rgb(22 32 31 / .03),
      0 2px 4px -2px rgb(22 32 31 / .06),
      0 18px 36px -18px rgb(22 32 31 / .2),
      0 48px 96px -48px rgb(22 32 31 / .18);
    --shadow-slip:
      0 1px 2px rgb(22 32 31 / .08),
      0 10px 24px -8px rgb(22 32 31 / .22);
    --shadow-pop: 0 24px 64px -16px rgb(22 32 31 / .32), 0 2px 6px rgb(22 32 31 / .08);

    --font-sans: "Geist", "Geist Fallback", "Geist Fallback Android", "Noto Sans Devanagari", system-ui, -apple-system, "Segoe UI", sans-serif;
    --font-serif: "Instrument Serif", "Serif Fallback", "Serif Fallback Android", Georgia, serif;
    --font-mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    --font-deva: "Noto Sans Devanagari", "Geist", "Geist Fallback", "Geist Fallback Android", sans-serif;
    --font-deva-ui: "Nirmala UI", "Kohinoor Devanagari", "Devanagari Sangam MN", "Lohit Devanagari", system-ui, sans-serif;

    --fs-micro: .75rem;
    --fs-xs: .8125rem;
    --fs-sm: .875rem;
    --fs-chat: .9375rem;
    --fs-base: clamp(1.0625rem, 1.01rem + .2vw, 1.125rem);
    --fs-lede: clamp(1.0625rem, 1rem + .4vw, 1.3125rem);
    --fs-h3: clamp(2rem, 1.8rem + .6vw, 2.375rem);
    --fs-h2: clamp(2.125rem, 1.5rem + 2.7vw, 3.75rem);
    --fs-h1: clamp(2.625rem, 13.3vw - .35rem, 3.25rem);
    --fs-page: clamp(2.5rem, 1.7rem + 3.2vw, 4.25rem);

    --wrap: 72rem;
    --wrap-text: 44rem;
    --pad: clamp(1rem, 4.5vw, 3rem);
    --gutter: clamp(1rem, 2.6vw, 2.25rem);
    --section: clamp(4rem, 8vw, 8rem);
    --radius: 14px;
    --radius-sm: 10px;
    --radius-xs: 7px;
    --header-h: 4rem;
    --ease-out: cubic-bezier(.2, .7, .2, 1);
    --ease-spring: cubic-bezier(.3, 1.4, .5, 1);
  }

  @media (min-width: 40rem) {
    :root { --fs-h1: clamp(3.25rem, 1.45rem + 4.6vw, 5.125rem); }
  }
  @media (min-width: 64rem) {
    :root { --header-h: 4.5rem; }
  }

  :root[data-theme="dark"] {
    color-scheme: dark;

    --paper: #111a1b;
    --paper-2: #162223;
    --paper-3: #1d2b2c;
    --surface: #142021;
    --bubble: #1a2829;
    --ink: #edf2f0;
    --muted: #a7b8b6;
    --duo: #8fa19f;
    --teal: #6cc3bd;
    --teal-deep: #95d8d2;
    --teal-text: #7ccbc5;
    --on-teal: #0b1516;
    --btn: #6cc3bd;
    --btn-hover: #93d7d1;
    --mint: #1b3b3a;
    --mint-ink: #edf2f0;
    --marigold: #f2b544;
    --marigold-ink: #16201f;
    --marigold-soft: #3a3020;
    --coral: #f29a80;
    --staff: #2a2417;
    --staff-line: #4d3f20;
    --line: #243334;
    --line-strong: #324546;
    --dot: rgb(237 242 240 / .1);
    --focus: #7ccbc5;

    --night: #071514;
    --night-2: #0b1c1b;
    --night-panel: rgb(0 0 0 / .3);
    --night-line: rgb(238 243 241 / .13);
    --night-grain: .2;

    --shadow-card:
      0 1px 0 rgb(0 0 0 / .25),
      0 18px 40px -16px rgb(0 0 0 / .65),
      0 0 0 1px rgb(255 255 255 / .02);
    --shadow-slip:
      0 1px 2px rgb(0 0 0 / .4),
      0 12px 28px -8px rgb(0 0 0 / .6);
    --shadow-pop: 0 24px 64px -16px rgb(0 0 0 / .7), 0 0 0 1px rgb(255 255 255 / .04);
  }
}

@layer base {
  html {
    scroll-padding-top: calc(var(--header-h) + 1rem);
    background: var(--paper);
  }
  html:focus-within { scroll-behavior: smooth; }
  html.has-bar { scroll-padding-bottom: 6rem; }
  @media (prefers-reduced-motion: reduce) {
    html:focus-within { scroll-behavior: auto; }
  }
  body {
    min-block-size: 100dvh;
    background: var(--paper);
    color: var(--ink);
    font-family: var(--font-sans);
    font-size: var(--fs-base);
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: clip;
  }
  h1, h2 {
    font-family: var(--font-serif);
    font-weight: 400;
    text-wrap: balance;
  }
  h3, h4 { font-weight: 600; text-wrap: balance; }
  p, li, dd { text-wrap: pretty; }
  em { font-style: italic; }
  strong, b { font-weight: 600; }
  a { text-underline-offset: .22em; text-decoration-thickness: 1px; }
  :focus-visible {
    outline: 2px solid var(--focus);
    outline-offset: 3px;
    border-radius: 4px;
  }
  ::selection { background: var(--mint); color: var(--mint-ink); }
  [hidden] { display: none !important; }
  [lang="hi"], [lang="mr"] { font-family: var(--font-deva); }
  @supports (text-box: trim-both cap alphabetic) {
    h1, h2 { text-box: trim-both cap alphabetic; }
  }
}

@layer components {

  .wrap {
    max-inline-size: calc(var(--wrap) + 2 * var(--pad));
    margin-inline: auto;
    padding-inline: var(--pad);
  }
  .wrap-text {
    max-inline-size: calc(var(--wrap-text) + 2 * var(--pad));
    margin-inline: auto;
    padding-inline: var(--pad);
  }

  .skip-link {
    position: fixed;
    inset-inline-start: 1rem;
    inset-block-start: -5rem;
    z-index: 100;
    padding: .75rem 1rem;
    background: var(--ink);
    color: var(--paper);
    border-radius: var(--radius-sm);
    font-weight: 500;
    text-decoration: none;
    transition: inset-block-start .2s var(--ease-out);
  }
  .skip-link:focus { inset-block-start: 1rem; }

  .sprite { position: absolute; inline-size: 0; block-size: 0; overflow: hidden; }
  .icon {
    inline-size: 1rem;
    block-size: 1rem;
    flex: none;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .icon-fill { fill: currentColor; stroke: none; }

  .eyebrow {
    font-family: var(--font-mono);
    font-size: var(--fs-micro);
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--muted);
  }
  .eyebrow-accent { color: var(--teal-text); }
  .eyebrow-num { color: var(--ink); }

  .duo {
    font-size: var(--fs-h2);
    line-height: 1.04;
    letter-spacing: -.012em;
    color: var(--ink);
  }
  .duo > span {
    color: var(--duo);
    font-style: italic;
  }

  .lede {
    font-size: var(--fs-lede);
    line-height: 1.55;
    color: var(--muted);
    max-inline-size: 38rem;
  }

  .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55em;
    min-block-size: 2.75rem;
    padding: .7em 1.15em;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    font-family: var(--font-sans);
    font-weight: 500;
    font-size: .9375rem;
    line-height: 1.15;
    letter-spacing: -.005em;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color .2s var(--ease-out), border-color .2s, color .2s, box-shadow .2s, translate .2s var(--ease-out);
  }
  .btn:active { translate: 0 1px; }
  .btn-primary {
    background: var(--btn);
    color: var(--on-teal);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .14), 0 1px 2px rgb(22 32 31 / .16), 0 6px 14px -8px rgb(31 84 83 / .55);
  }
  .btn-primary:hover { background: var(--btn-hover); }
  .btn-secondary {
    background: var(--surface);
    color: var(--ink);
    border-color: var(--line-strong);
  }
  .btn-secondary:hover { border-color: var(--teal); background: var(--paper); }
  .btn-sm { min-block-size: 2.75rem; padding: .55em .95em; font-size: .875rem; }
  .btn-lg { min-block-size: 3.25rem; padding: .9em 1.35em; font-size: 1rem; }
  .btn-block { display: flex; }
  .btn .icon { inline-size: 1em; block-size: 1em; transition: translate .25s var(--ease-out); }
  .btn:hover .icon { translate: .2em 0; }

  .text-link {
    display: inline-flex;
    align-items: center;
    gap: .4em;
    min-block-size: 2.75rem;
    color: var(--ink);
    font-weight: 500;
    text-decoration: none;
  }
  .text-link-label {
    text-decoration: underline;
    text-decoration-color: var(--line-strong);
    text-decoration-thickness: 1px;
    text-underline-offset: .32em;
    transition: text-decoration-color .2s;
  }
  .text-link .icon { color: var(--teal-text); inline-size: 1em; block-size: 1em; transition: translate .25s var(--ease-out); }
  .text-link:hover .text-link-label { text-decoration-color: var(--teal); }
  .text-link:hover .icon { translate: .2em 0; }
  .text-link-sm { font-size: 1rem; }

  .now-dot {
    display: inline-block;
    inline-size: .5rem;
    block-size: .5rem;
    border-radius: 50%;
    background: var(--marigold);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--marigold) 24%, transparent);
    flex: none;
  }

  .site-header {
    position: sticky;
    inset-block-start: 0;
    z-index: 50;
    border-block-end: 1px solid transparent;
    transition: background-color .25s var(--ease-out), border-color .25s, backdrop-filter .25s;
  }
  .site-header.is-scrolled,
  .site-header.is-solid {
    background: color-mix(in srgb, var(--paper) 84%, transparent);
    -webkit-backdrop-filter: blur(14px) saturate(1.2);
    backdrop-filter: blur(14px) saturate(1.2);
    border-block-end-color: var(--line);
  }
  .header-row {
    display: flex;
    align-items: center;
    gap: .5rem;
    block-size: var(--header-h);
  }
  .brand {
    display: inline-flex;
    flex: none;
    margin-inline-start: -.3rem;
    border-radius: 6px;
  }
  .brand-logo { block-size: 2.875rem; inline-size: auto; }
  .brand-logo-dark { display: none; }
  :root[data-theme="dark"] .brand-logo-light { display: none; }
  :root[data-theme="dark"] .brand-logo-dark { display: block; }

  .site-nav { display: none; margin-inline-start: auto; }
  .site-nav ul { display: flex; gap: .125rem; }
  .site-nav a {
    display: inline-flex;
    align-items: center;
    min-block-size: 2.75rem;
    padding: 0 .75rem;
    border-radius: 8px;
    color: var(--muted);
    font-size: .9375rem;
    font-weight: 450;
    text-decoration: none;
    transition: color .2s, background-color .2s;
  }
  .site-nav a:hover { color: var(--ink); background: color-mix(in srgb, var(--ink) 5%, transparent); }
  .site-nav a[aria-current="page"] { color: var(--ink); background: color-mix(in srgb, var(--ink) 6%, transparent); }
  .header-actions { display: flex; align-items: center; gap: .5rem; margin-inline-start: auto; }
  .hide-narrow { display: none; }

  .theme-toggle {
    display: none;
    place-items: center;
    inline-size: 2.75rem;
    block-size: 2.75rem;
    border-radius: 50%;
    color: var(--muted);
    transition: color .2s, background-color .2s;
  }
  .theme-toggle:hover { color: var(--ink); background: color-mix(in srgb, var(--ink) 6%, transparent); }
  .theme-toggle .icon { inline-size: 1.25rem; block-size: 1.25rem; grid-area: 1 / 1; transition: opacity .25s, rotate .4s var(--ease-out), scale .3s; }
  .theme-toggle .icon-sun { opacity: 0; rotate: -60deg; scale: .6; }
  .theme-toggle[aria-pressed="true"] .icon-moon { opacity: 0; rotate: 60deg; scale: .6; }
  .theme-toggle[aria-pressed="true"] .icon-sun { opacity: 1; rotate: 0deg; scale: 1; }

  .menu-button {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    min-block-size: 2.75rem;
    padding: 0 .8rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--line-strong);
    font-size: .875rem;
    font-weight: 500;
    background: color-mix(in srgb, var(--surface) 70%, transparent);
  }
  .menu-button .icon { inline-size: 1rem; block-size: 1rem; }

  @media (min-width: 26rem) {
    .header-row { gap: .75rem; }
  }
  @media (min-width: 64rem) {
    .site-nav { display: block; }
    .header-actions { margin-inline-start: .25rem; }
    .menu-button { display: none; }
    .hide-narrow { display: inline; }
    .js .theme-toggle { display: inline-grid; }
    .brand-logo { block-size: 3.25rem; }
  }
  @media (max-width: 22.4rem) {
    .menu-button-label { display: none; }
    .menu-button { justify-content: center; min-inline-size: 2.75rem; padding: 0 .7rem; }
    .header-actions .btn-sm { padding-inline: .8em; }
    .brand-logo { block-size: 2.75rem; }
  }
  .header-actions .btn-sm { transition: background-color .2s var(--ease-out), opacity .2s var(--ease-out), visibility .2s; }
  @media (max-width: 63.99rem) and (min-height: 30.01rem) {
    html.has-bar .header-actions .btn-sm { visibility: hidden; opacity: 0; }
  }

  .menu {
    position: fixed;
    inset: 0;
    inline-size: auto;
    block-size: auto;
    max-inline-size: none;
    max-block-size: none;
    margin: 0;
    padding: 0 var(--pad) max(1.5rem, env(safe-area-inset-bottom));
    border: 0;
    background: var(--paper);
    color: var(--ink);
    overflow-y: auto;
    overscroll-behavior: contain;
    flex-direction: column;
  }
  .menu:popover-open, .menu.is-open { display: flex; }
  .menu-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    block-size: var(--header-h);
    border-block-end: 1px solid var(--line);
  }
  .menu-close {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    min-block-size: 2.75rem;
    padding: 0 .9rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--line-strong);
    font-size: .875rem;
    font-weight: 500;
  }
  .menu-list { padding-block: .75rem; counter-reset: menu; }
  .menu-list li { border-block-end: 1px solid var(--line); }
  .menu-list a {
    display: flex;
    align-items: baseline;
    gap: 1rem;
    padding: .95rem 0;
    font-family: var(--font-serif);
    font-size: 2.125rem;
    line-height: 1.1;
    text-decoration: none;
  }
  .menu-list a::before {
    counter-increment: menu;
    content: "0" counter(menu);
    font-family: var(--font-mono);
    font-size: var(--fs-micro);
    letter-spacing: .12em;
    color: var(--duo);
    translate: 0 -.55em;
  }
  .menu-theme {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-block: 1rem;
    border-block-end: 1px solid var(--line);
  }
  .menu-theme-label { font-weight: 500; }
  .switch {
    position: relative;
    display: inline-flex;
    align-items: center;
    inline-size: 3.25rem;
    block-size: 2rem;
    padding: 0 .2rem;
    border-radius: 999px;
    background: var(--paper-3);
    border: 1px solid var(--line-strong);
    transition: background-color .25s;
  }
  .switch::before {
    content: "";
    inline-size: 1.5rem;
    block-size: 1.5rem;
    border-radius: 50%;
    background: var(--surface);
    box-shadow: 0 1px 3px rgb(0 0 0 / .2);
    transition: translate .3s var(--ease-out), background-color .25s;
  }
  .switch-wrap { display: inline-flex; align-items: center; gap: .75rem; min-block-size: 2.75rem; padding-inline: .25rem; border-radius: 999px; }
  .switch-wrap[aria-pressed="true"] .switch { background: var(--teal); border-color: var(--teal); }
  .switch-wrap[aria-pressed="true"] .switch::before { translate: 1.2rem 0; background: var(--on-teal); }
  .switch-state { font-size: var(--fs-sm); color: var(--muted); min-inline-size: 1.75rem; }
  .menu-foot { margin-block-start: auto; padding-block-start: 1.5rem; display: grid; gap: 1rem; }
  .menu-meta { display: flex; flex-wrap: wrap; gap: .25rem 1rem; font-size: var(--fs-sm); color: var(--muted); }
  .menu-meta a { text-decoration: none; display: inline-flex; align-items: center; min-block-size: 2.75rem; }
  :root:not(.js) .menu-theme { display: none; }
  html:has(.menu:popover-open), html:has(.menu.is-open) { overflow: hidden; }

  .section {
    --top: var(--section);
    padding-block: var(--top) var(--section);
    scroll-margin-block-start: calc(-1 * var(--top));
  }
  .section-alt { background: var(--paper-2); }
  .section-tight { --top: calc(var(--section) * .6); padding-block-end: calc(var(--section) * .6); }
  .section:not(.section-alt) + .section:not(.section-alt),
  .section-alt + .section-alt { --top: calc(var(--section) * .35); }

  .section-head {
    display: grid;
    gap: 1.1rem var(--gutter);
    padding-block-start: 1.1rem;
    border-block-start: 1px solid var(--line);
    margin-block-end: clamp(2.5rem, 5vw, 4.5rem);
  }
  .section-head .duo { max-inline-size: 22ch; }
  .section-head .lede { margin-block-start: clamp(1.25rem, 2.2vw, 1.75rem); }
  @media (min-width: 60rem) {
    .section-head { grid-template-columns: repeat(12, minmax(0, 1fr)); }
    .section-head > .eyebrow { grid-column: 1 / span 4; padding-block-start: .6rem; }
    .section-head-main { grid-column: 5 / -1; }
  }
  @media (min-width: 80rem) {
    .section-head > .eyebrow { grid-column: 1 / span 3; padding-block-start: .6rem; }
    .section-head-main { grid-column: 4 / -1; }
  }

  .cells {
    display: grid;
    gap: 1px;
    background: var(--line);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    overflow: hidden;
  }
  .cell {
    padding: clamp(1.25rem, 3vw, 2rem);
    background: var(--paper);
  }
  .section-alt .cell { background: var(--paper-2); }

  .pill {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .45rem .85rem .45rem .7rem;
    border: 1px solid var(--line-strong);
    border-radius: 999px;
    font-size: var(--fs-xs);
    font-weight: 500;
    line-height: 1.25;
    color: var(--ink);
    background: color-mix(in srgb, var(--surface) 60%, transparent);
  }
  .pill .icon { inline-size: .95rem; block-size: .95rem; color: var(--teal-text); }

  .checklist { display: grid; gap: .7rem; }
  .checklist li { display: flex; gap: .7rem; align-items: flex-start; line-height: 1.45; }
  .checklist .icon { margin-block-start: .2em; color: var(--teal-text); stroke-width: 2; }

  .demo-note {
    font-size: var(--fs-xs);
    line-height: 1.45;
    color: var(--muted);
  }

  .slot-chip {
    display: inline-flex;
    align-items: center;
    padding: .5em .85em;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--teal) 42%, transparent);
    background: var(--surface);
    color: var(--teal-deep);
    font-size: .8125rem;
    font-weight: 500;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    transition: background-color .25s var(--ease-out), border-color .25s, color .25s;
  }
  .slot-chip.is-picked {
    background: var(--teal);
    border-color: var(--teal);
    color: var(--on-teal);
  }

  .rise { inline-size: .7em; block-size: .8em; fill: currentColor; flex: none; }

  .hero {
    padding-block: clamp(1rem, 4.5vw, 5rem) var(--section);
  }
  .hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    row-gap: 1.5rem;
  }
  .hero-copy .eyebrow { margin-block-end: 1rem; }
  .eyebrow-more { display: none; }
  .hero-title {
    font-size: var(--fs-h1);
    line-height: .98;
    letter-spacing: -.018em;
    color: var(--ink);
  }
  .hero-title em {
    color: var(--teal-text);
    padding-inline-end: .04em;
  }
  .hero-lede {
    margin-block-start: 1.1rem;
    max-inline-size: 35rem;
    font-size: var(--fs-lede);
    line-height: 1.5;
    color: var(--muted);
  }
  .hero-actions {
    display: grid;
    gap: .25rem;
    margin-block-start: 1.25rem;
  }
  .hero-actions .btn { display: flex; }
  .hero-actions .text-link { justify-self: start; }
  .hero-notes { display: grid; gap: 1.25rem; }
  .hero-facts {
    display: grid;
    gap: .55rem;
    font-size: 1rem;
    color: var(--muted);
  }
  .hero-facts li { display: flex; align-items: flex-start; gap: .6rem; line-height: 1.4; }
  .hero-facts .icon { margin-block-start: .15rem; color: var(--teal-text); stroke-width: 1.9; }
  .trust-chips { display: flex; flex-wrap: wrap; gap: .5rem; }
  .price-line { font-size: 1rem; color: var(--muted); }
  .price-line a { color: var(--teal-text); }

  @media (max-width: 29.99rem) {
    .hero-grid { row-gap: 1.25rem; }
    .hero-actions { gap: 0; margin-block-start: 1.1rem; }
    .caption-more { display: none; }
    .demo-caption { margin-block-end: .55rem; }
    .demo-controls { margin-block-end: .5rem; }
    .chat-head { padding: .55rem .8rem; }
    .chat-avatar { inline-size: 1.875rem; block-size: 1.875rem; }
    .chat-list { padding-block-start: .7rem; }
  }
  @media (min-width: 30rem) {
    .eyebrow-more { display: inline; }
    .hero-actions {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: .75rem 1.5rem;
    }
    .hero-actions .btn { display: inline-flex; }
  }
  @media (min-width: 40rem) {
    .hero-grid { row-gap: clamp(1.75rem, 4vw, 2.75rem); }
    .hero-copy .eyebrow { margin-block-end: clamp(1.1rem, 2vw, 1.6rem); }
    .hero-lede { margin-block-start: clamp(1.5rem, 2.6vw, 2.25rem); }
    .hero-actions { margin-block-start: clamp(1.5rem, 2.8vw, 2.25rem); }
    .hero-facts {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0;
      border-block: 1px solid var(--line);
    }
    .hero-facts li { padding: .9rem 1rem .9rem 0; }
    .hero-facts li + li { padding-inline-start: 1rem; border-inline-start: 1px solid var(--line); }
  }
  @media (min-width: 60rem) {
    .hero-grid {
      grid-template-columns: repeat(12, minmax(0, 1fr));
      column-gap: var(--gutter);
      grid-template-rows: auto 1fr;
    }
    .hero-copy { grid-column: 1 / span 7; grid-row: 1; padding-block-start: .25rem; }
    .hero-notes { grid-column: 1 / span 6; grid-row: 2; align-self: end; }
    .demo { grid-column: 8 / -1; grid-row: 1 / span 2; }
  }
  @media (min-width: 40rem) and (max-width: 59.99rem) {
    .demo { max-inline-size: 34rem; }
  }

  .demo { position: relative; container: demo / inline-size; }
  .demo-caption {
    display: flex;
    align-items: baseline;
    gap: .6rem;
    margin-block-end: .75rem;
    font-size: var(--fs-sm);
    line-height: 1.45;
    color: var(--muted);
  }
  .demo-caption .now-dot { translate: 0 -.05rem; }
  .demo .demo-note { margin-block-start: .8rem; }

  .demo-controls {
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    margin-block-end: .6rem;
  }
  .js .demo-controls { display: flex; }

  .lang-switch {
    display: inline-flex;
    flex: 0 1 auto;
    min-inline-size: 0;
    padding: 2px;
    border-radius: 999px;
    background: var(--paper-2);
    border: 1px solid var(--line);
  }
  .lang-option {
    flex: 1 1 auto;
    min-block-size: 2.75rem;
    min-inline-size: 2.75rem;
    padding: 0 .7rem;
    border-radius: 999px;
    font-size: .8125rem;
    font-weight: 500;
    line-height: 1;
    color: var(--muted);
    white-space: nowrap;
    transition: background-color .2s, color .2s, box-shadow .2s;
  }
  .lang-option:hover { color: var(--ink); }
  .lang-option[aria-pressed="true"] {
    background: var(--marigold);
    color: var(--marigold-ink);
    box-shadow: 0 1px 2px rgb(22 32 31 / .14);
  }
  .lang-option[lang] { font-family: var(--font-deva-ui); font-size: .875rem; }
  .lang-option:focus-visible { outline-offset: 1px; border-radius: 999px; }

  .play-button {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    flex: none;
    justify-content: center;
    min-block-size: 2.75rem;
    min-inline-size: 2.75rem;
    padding: 0 .85rem 0 .7rem;
    border-radius: 999px;
    border: 1px solid var(--line-strong);
    font-size: .8125rem;
    font-weight: 500;
    color: var(--ink);
    background: var(--surface);
    transition: border-color .2s;
  }
  .play-button:hover { border-color: var(--teal); }
  .play-button .icon { inline-size: .9rem; block-size: .9rem; stroke-width: 1.8; }
  .play-button .icon-play, .play-button .icon-replay { display: none; }
  .play-button:is([data-mode="paused"], [data-mode="idle"], [data-mode="done"]) .icon-pause { display: none; }
  .play-button:is([data-mode="paused"], [data-mode="idle"]) .icon-play { display: block; }
  .play-button[data-mode="done"] .icon-replay { display: block; }
  .play-button .icon-play { fill: currentColor; stroke-width: 1.2; }

  @container demo (max-width: 22rem) {
    .lang-option { padding: 0 .5rem; font-size: .75rem; }
    .lang-option[lang] { font-size: .8125rem; }
    .play-button { padding: 0 .6rem; }
    .play-label { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  }

  .chat {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    grid-template-areas: "head" "pin" "body" "prog";
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-card);
    isolation: isolate;
  }
  .chat-head {
    grid-area: head;
    display: flex;
    align-items: center;
    gap: .6rem;
    min-inline-size: 0;
    padding: .7rem .9rem;
    border-block-end: 1px solid var(--line);
  }
  .chat-avatar {
    display: grid;
    place-items: center;
    inline-size: 2.125rem;
    block-size: 2.125rem;
    border-radius: 50%;
    background: var(--mint);
    color: var(--teal-deep);
    font-family: var(--font-mono);
    font-size: .75rem;
    letter-spacing: .04em;
    flex: none;
  }
  .chat-name { font-weight: 600; font-size: .9375rem; letter-spacing: -.01em; white-space: nowrap; }
  .chat-tag {
    margin-inline-start: auto;
    font-size: .75rem;
    font-weight: 500;
    color: var(--muted);
    padding: .25em .6em;
    border: 1px solid var(--line);
    border-radius: 999px;
    white-space: nowrap;
  }
  .chat-body { grid-area: body; position: relative; }
  .chat-list {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    padding: .9rem .9rem 1.1rem;
    font-size: var(--fs-chat);
    line-height: 1.42;
  }
  .chat-day {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-block: .2rem .15rem;
    font-size: var(--fs-micro);
    font-weight: 500;
    color: var(--muted);
    white-space: nowrap;
  }
  .chat-day::before, .chat-day::after { content: ""; flex: 1; block-size: 1px; background: var(--line); }
  .chat-day-label { display: inline-flex; align-items: center; gap: .45rem; font-variant-numeric: tabular-nums; }
  .chat-day-label .now-dot { inline-size: .375rem; block-size: .375rem; box-shadow: 0 0 0 2.5px color-mix(in srgb, var(--marigold) 25%, transparent); }
  .chat-day-next { margin-block-start: .8rem; }

  .msg {
    display: flex;
    flex-direction: column;
    max-inline-size: min(86%, 25rem);
    transition: opacity .35s var(--ease-out);
  }
  .msg-patient { align-self: flex-end; align-items: flex-end; }
  .msg-assistant, .msg-staff { align-self: flex-start; align-items: flex-start; }
  .msg-patient + .msg-assistant,
  .msg-assistant + .msg-patient,
  .msg-assistant + .msg-staff,
  .msg-patient + .msg-staff { margin-block-start: .4rem; }

  .bubble {
    padding: .58em .85em .6em;
    border-radius: 1.05em;
    overflow-wrap: anywhere;
  }
  .msg-patient .bubble {
    background: var(--mint);
    color: var(--mint-ink);
    border-end-end-radius: .35em;
  }
  .msg-assistant .bubble {
    background: var(--bubble);
    border: 1px solid var(--line);
    border-end-start-radius: .35em;
    box-shadow: 0 1px 2px rgb(22 32 31 / .04);
  }
  .msg-staff .bubble {
    background: var(--staff);
    border: 1px solid var(--staff-line);
    border-end-start-radius: .35em;
  }
  .stamp {
    margin-block-start: .28rem;
    padding-inline: .2rem;
    font-family: var(--font-mono);
    font-size: var(--fs-micro);
    letter-spacing: .02em;
    color: var(--duo);
    font-variant-numeric: tabular-nums;
  }

  .chat .v { display: none; }
  .chat[data-lang="en"] .v[data-v="en"],
  .chat[data-lang="hinglish"] .v[data-v="hinglish"],
  .chat[data-lang="hi"] .v[data-v="hi"],
  .chat[data-lang="mr"] .v[data-v="mr"] { display: inline; }
  .bubble [lang="hi"], .bubble [lang="mr"] { line-height: 1.62; }

  .slots { display: flex; flex-wrap: wrap; gap: .35rem; margin-block-start: .6rem; }

  .map-card {
    display: flex;
    align-items: center;
    gap: .6rem;
    margin-block-start: .6rem;
    padding: .35rem .7rem .35rem .35rem;
    border: 1px solid var(--line);
    border-radius: .7rem;
    background: var(--surface);
  }
  .map-tile {
    position: relative;
    inline-size: 3rem;
    block-size: 2.25rem;
    border-radius: .45rem;
    background:
      linear-gradient(115deg, transparent 46%, color-mix(in oklch, var(--teal) 30%, var(--paper-2)) 46% 54%, transparent 54%),
      linear-gradient(15deg, transparent 58%, var(--line-strong) 58% 63%, transparent 63%),
      repeating-linear-gradient(90deg, transparent 0 .7rem, var(--line) .7rem calc(.7rem + 1px)),
      var(--paper-2);
    flex: none;
  }
  .map-tile::after {
    content: "";
    position: absolute;
    inset-inline-start: 1.25rem;
    inset-block-start: .55rem;
    inline-size: .55rem;
    block-size: .55rem;
    border-radius: 50% 50% 50% 0;
    rotate: -45deg;
    background: var(--teal);
    box-shadow: 0 0 0 2px var(--surface);
  }
  .map-text { display: grid; line-height: 1.25; font-size: .8125rem; }
  .map-text b { font-weight: 600; }
  .map-text span { color: var(--muted); font-size: .75rem; }

  .seal {
    display: inline-flex;
    align-items: center;
    gap: .4em;
    margin-block-start: .4rem;
    padding: .38em .75em .38em .55em;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--teal) 38%, transparent);
    background: color-mix(in oklch, var(--mint) 60%, var(--surface));
    color: var(--teal-deep);
    font-size: .75rem;
    font-weight: 600;
    white-space: nowrap;
  }
  .seal .icon { inline-size: .95rem; block-size: .95rem; stroke-width: 1.6; }

  .bubble-acts { padding-block-end: 0; overflow: hidden; }
  .acts {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin: .65rem -.85em 0;
    border-block-start: 1px solid var(--line);
  }
  .act {
    position: relative;
    display: grid;
    place-items: center;
    padding: .62em .5em;
    color: var(--teal-deep);
    font-weight: 500;
    font-size: .875rem;
    transition: background-color .3s var(--ease-out);
  }
  .act + .act { border-inline-start: 1px solid var(--line); }
  .act.is-picked { background: color-mix(in srgb, var(--mint) 75%, transparent); }

  .staff-chip {
    display: inline-flex;
    align-items: center;
    gap: .35em;
    margin-block-end: .45em;
    padding: .32em .6em .3em .45em;
    border-radius: .4rem;
    background: var(--marigold);
    color: var(--marigold-ink);
    font-size: .75rem;
    font-weight: 600;
    line-height: 1.1;
  }
  .staff-chip .icon { inline-size: .85rem; block-size: .85rem; stroke-width: 2; }
  .msg-staff .bubble > .staff-text { display: block; }

  .typing { display: none; align-self: flex-start; }
  .typing .bubble {
    display: inline-flex;
    gap: .25rem;
    padding: .8em .9em;
    background: var(--bubble);
    border: 1px solid var(--line);
    border-end-start-radius: .35em;
  }
  .typing.is-staff .bubble { background: var(--staff); border-color: var(--staff-line); }
  .typing i {
    inline-size: .375rem;
    block-size: .375rem;
    border-radius: 50%;
    background: var(--duo);
    opacity: .35;
  }

  .chat-progress {
    grid-area: prog;
    display: none;
    grid-template-columns: repeat(13, minmax(0, 1fr));
    gap: 3px;
    padding: .7rem .9rem .8rem;
    border-block-start: 1px solid var(--line);
  }
  .chat-progress i {
    block-size: 3px;
    border-radius: 2px;
    background: var(--line);
    transition: background-color .4s var(--ease-out);
  }
  .chat-progress i.is-on { background: var(--teal); }

  .pin { grid-area: pin; display: grid; grid-template-rows: 1fr; }
  .pin-inner {
    display: flex;
    align-items: center;
    gap: .5rem;
    min-block-size: 0;
    overflow: hidden;
    padding: .55rem .9rem;
    background: color-mix(in oklch, var(--mint) 70%, var(--surface));
    border-block-end: 1px solid color-mix(in oklch, var(--teal) 22%, var(--line));
    color: var(--teal-deep);
    font-size: .8125rem;
    white-space: nowrap;
  }
  .pin-status { font-weight: 600; }
  .pin-when { color: var(--ink); overflow: hidden; text-overflow: ellipsis; }
  .st-booked { display: none; }

  .slip { display: none; }
  .slip, .mini-slip {
    --notch: .42rem;
    --stub: 2.25rem;
    align-items: stretch;
    background: var(--surface);
    border: 1px solid var(--line-strong);
    border-radius: 12px;
    box-shadow: var(--shadow-slip);
    -webkit-mask:
      radial-gradient(circle at var(--stub) top, transparent var(--notch), #000 calc(var(--notch) + .5px)) top / auto 51% no-repeat,
      radial-gradient(circle at var(--stub) bottom, transparent var(--notch), #000 calc(var(--notch) + .5px)) bottom / auto 51% no-repeat;
    mask:
      radial-gradient(circle at var(--stub) top, transparent var(--notch), #000 calc(var(--notch) + .5px)) top / auto 51% no-repeat,
      radial-gradient(circle at var(--stub) bottom, transparent var(--notch), #000 calc(var(--notch) + .5px)) bottom / auto 51% no-repeat;
  }
  .slip-stub {
    display: grid;
    place-items: center;
    inline-size: var(--stub);
    background: var(--mint);
    color: var(--teal-deep);
    border-inline-end: 1.5px dashed color-mix(in srgb, var(--teal) 42%, transparent);
  }
  .slip-stub .rise { inline-size: .7rem; block-size: .82rem; }
  .slip-main { display: grid; gap: .1rem; padding: .6rem 1rem .65rem .85rem; }
  .slip-status {
    font-size: .75rem;
    font-weight: 600;
    color: var(--teal-deep);
  }
  .slip-when { font-size: 1.0625rem; font-weight: 600; letter-spacing: -.015em; line-height: 1.2; font-variant-numeric: tabular-nums; }
  .slip-who { font-size: .75rem; color: var(--muted); white-space: nowrap; }

  @media (min-width: 76rem) {
    .pin { display: none; }
    .hero-notes { grid-column: 1 / span 5; }
    .slip {
      display: flex;
      position: absolute;
      z-index: 2;
      inset-inline-start: -11rem;
      inset-block-end: 6.25rem;
      rotate: -3deg;
    }
  }

  .chat-hero { block-size: clamp(30rem, 26rem + 10vw, 34rem); }
  :root:not(.js) .chat-hero .chat-body,
  .is-calm .chat-hero .chat-body {
    min-block-size: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: var(--line-strong) transparent;
  }
  .chat-hero .chat-body:focus-visible { outline-offset: -4px; border-radius: 6px; }
  .js:not(.is-calm) .chat-hero .chat-body {
    min-block-size: 0;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to bottom, transparent, #000 1.5rem);
    mask-image: linear-gradient(to bottom, transparent, #000 1.5rem);
  }
  .js:not(.is-calm) .chat-hero .chat-list { translate: 0 var(--shift, 0px); transition: translate .55s var(--ease-out); }
  .js:not(.is-calm) .chat-hero.is-done .chat-body { overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--line-strong) transparent; }
  .js:not(.is-calm) .chat-hero.is-done .chat-list { transition: none; padding-block-end: calc(1.1rem + var(--tail, 0px)); }
  .js:not(.is-calm) .chat-hero .chat-progress { display: grid; }
  .js:not(.is-calm) .chat-hero .chat-list > [data-step]:not(.is-shown) { display: none; }
  .js:not(.is-calm) .chat-hero .chat-list > .is-past { opacity: 0; }
  .js:not(.is-calm) .chat-hero .chat-list > .is-new { animation: bubble-in .26s var(--ease-out) both; }
  .js:not(.is-calm) .chat-hero .msg-patient.is-new { transform-origin: right bottom; }
  .js:not(.is-calm) .chat-hero .msg-assistant.is-new,
  .js:not(.is-calm) .chat-hero .msg-staff.is-new { transform-origin: left bottom; }
  .js:not(.is-calm) .chat-hero .typing.is-shown { display: flex; animation: bubble-in .2s var(--ease-out) both; }
  .js:not(.is-calm) .chat-hero .typing.is-shown i { animation: dot 1s ease-in-out infinite; }
  .js:not(.is-calm) .chat-hero .typing.is-shown i:nth-child(2) { animation-delay: .15s; }
  .js:not(.is-calm) .chat-hero .typing.is-shown i:nth-child(3) { animation-delay: .3s; }

  .js:not(.is-calm) .chat-hero .slot-chip.is-pick:not(.is-picked) { background: var(--surface); border-color: color-mix(in srgb, var(--teal) 42%, transparent); color: var(--teal-deep); }
  .js:not(.is-calm) .chat-hero .slot-chip.is-picked { animation: press .35s var(--ease-spring); }
  .js:not(.is-calm) .chat-hero .act.is-pick:not(.is-picked) { background: transparent; }
  .js:not(.is-calm) .chat-hero .act.is-picked { animation: press .35s var(--ease-spring); }

  .js:not(.is-calm) .chat-hero .msg-handover .bubble { transition: opacity .6s var(--ease-out); }
  .js:not(.is-calm) .chat-hero.is-handed .msg-handover .bubble { opacity: .6; }

  .js:not(.is-calm) .chat-hero .pin { grid-template-rows: 0fr; transition: grid-template-rows .45s var(--ease-out); }
  .js:not(.is-calm) .chat-hero .pin-inner { padding-block: 0; border-block-end-width: 0; transition: padding .45s var(--ease-out); }
  .js:not(.is-calm) .chat-hero.is-booked .pin { grid-template-rows: 1fr; }
  .js:not(.is-calm) .chat-hero.is-booked .pin-inner { padding-block: .55rem; border-block-end-width: 1px; }
  .js:not(.is-calm) .chat-hero .st-booked { display: inline; }
  .js:not(.is-calm) .chat-hero .st-confirmed { display: none; }
  .js:not(.is-calm) .chat-hero.is-confirmed .st-booked { display: none; }
  .js:not(.is-calm) .chat-hero.is-confirmed .st-confirmed { display: inline; }
  .js:not(.is-calm) .chat-hero.is-still * { transition: none; }

  @media (min-width: 76rem) {
    .js:not(.is-calm) .chat-hero .slip {
      opacity: 0;
      translate: 2.5rem .5rem;
      rotate: 2deg;
      transition: opacity .4s var(--ease-out), translate .6s var(--ease-spring), rotate .6s var(--ease-spring);
    }
    .js:not(.is-calm) .chat-hero.is-booked .slip { opacity: 1; translate: 0 0; rotate: -3deg; }
  }

  ::view-transition { pointer-events: none; }
  :root.is-swapping { view-transition-name: none; }
  ::view-transition-group(*) { animation-duration: .32s; animation-timing-function: var(--ease-out); }
  ::view-transition-old(*):not(:only-child) { animation: .2s var(--ease-out) both vt-out; }
  ::view-transition-new(*):not(:only-child) { animation: .3s var(--ease-out) both vt-in; }

  .night {
    --line: var(--night-line);
    position: relative;
    isolation: isolate;
    padding-block: calc(var(--section) + 1rem);
    background-color: var(--night);
    color: var(--night-text);
  }
  .night::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    opacity: var(--night-grain);
    mix-blend-mode: soft-light;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
    background-size: 160px 160px;
  }
  .night .section-head { border-block-start-color: var(--night-line); }
  .night .eyebrow { color: var(--night-muted); }
  .night .eyebrow-num { color: var(--night-teal); }
  .night .duo { color: var(--night-text); }
  .night .duo > span { color: var(--night-muted); }
  .night .lede { color: var(--night-muted); }
  .night :focus-visible { outline-color: var(--night-teal); }

  .night-stamp {
    position: absolute;
    inset-inline: 0;
    z-index: 1;
    pointer-events: none;
  }
  .night-stamp-top { inset-block-start: 0; }
  .night-stamp-bottom { inset-block-end: 0; }
  .night-stamp .wrap { position: relative; }
  .night-stamp-line {
    position: absolute;
    inset-inline: 0;
    inset-block-start: 0;
    block-size: 1px;
    background: linear-gradient(90deg, color-mix(in srgb, var(--marigold) 70%, transparent), color-mix(in srgb, var(--marigold) 16%, transparent) 60%, transparent);
    transform-origin: left center;
  }
  .stamp-pill {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: var(--pad);
    translate: 0 -50%;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .32rem .7rem .32rem .55rem;
    border-radius: 999px;
    background: var(--night);
    border: 1px solid color-mix(in srgb, var(--marigold) 55%, transparent);
    color: var(--marigold);
    font-family: var(--font-mono);
    font-size: var(--fs-micro);
    letter-spacing: .06em;
    white-space: nowrap;
  }
  .stamp-pill .now-dot { inline-size: .4rem; block-size: .4rem; }
  .night-stamp-bottom .stamp-pill { background: var(--paper); color: var(--teal-text); border-color: color-mix(in srgb, var(--teal) 45%, transparent); }
  .night-stamp-bottom .stamp-pill .now-dot { background: var(--teal); box-shadow: 0 0 0 3px color-mix(in srgb, var(--teal) 20%, transparent); }
  .night-stamp-bottom .night-stamp-line { background: linear-gradient(90deg, color-mix(in srgb, var(--teal) 60%, transparent), color-mix(in srgb, var(--teal) 10%, transparent) 60%, transparent); }

  .scribble { position: relative; white-space: nowrap; }
  .scribble-line {
    position: absolute;
    inset-inline: -.04em -.02em;
    inset-block-end: -.2em;
    inline-size: auto;
    block-size: .3em;
    overflow: visible;
    fill: none;
    stroke: var(--marigold);
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
  }
  .scribble-line path { stroke-dasharray: 1; stroke-dashoffset: 0; }
  .js:not(.is-calm) .scribble-line path { stroke-dashoffset: 1; transition: stroke-dashoffset 1.1s cubic-bezier(.6, .1, .3, 1) .2s; }
  .js:not(.is-calm) .scribble.is-drawn .scribble-line path { stroke-dashoffset: 0; }

  .lanes {
    border: 1px solid var(--night-line);
    border-radius: var(--radius);
    background: var(--night-panel);
    overflow: hidden;
  }
  .lanes-top {
    display: flex;
    align-items: center;
    gap: 1.25rem 2rem;
    padding: 1rem 1.1rem;
    border-block-end: 1px solid var(--night-line);
  }
  .lanes-clock { display: grid; gap: .2rem; flex: none; }
  .lanes-tag {
    justify-self: start;
    font-size: .75rem;
    font-weight: 500;
    color: var(--night-muted);
    padding: .15em .6em;
    border: 1px solid var(--night-line);
    border-radius: 999px;
  }
  .clock-time {
    font-family: var(--font-mono);
    font-size: clamp(2.25rem, 1.8rem + 1.8vw, 3.5rem);
    line-height: 1;
    letter-spacing: -.04em;
    color: var(--night-text);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    min-inline-size: 7.6ch;
  }
  .clock-note { font-size: var(--fs-xs); color: var(--night-muted); min-inline-size: 9.5rem; }
  .rail { display: none; }

  .lanes-head,
  .lanes-row,
  .lanes-foot {
    display: grid;
    grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  }
  .lanes-head { grid-template-areas: "off on"; }
  .lanes-row { grid-template-areas: "msg msg" "off on"; }
  .lanes-foot { grid-template-areas: "off on"; }
  .lanes-head > span {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .7rem 1.1rem;
    font-size: .8125rem;
    font-weight: 600;
    color: var(--night-muted);
  }
  .lh-time, .lh-msg { display: none !important; }
  .lane-off { grid-area: off; }
  .lane-on { grid-area: on; }
  .lanes-head .lane-on { color: var(--night-teal); }
  .lanes-head .lane-off, .row-lane.lane-off, .lf-total.lane-off { background: rgb(0 0 0 / .14); }
  .lanes-head .lane-on, .row-lane.lane-on, .lf-total.lane-on { background: color-mix(in srgb, var(--night-teal) 7%, transparent); border-inline-start: 1px solid var(--night-line); }
  .unread-count {
    display: inline-grid;
    place-items: center;
    min-inline-size: 1.4rem;
    block-size: 1.4rem;
    padding-inline: .35rem;
    border-radius: 999px;
    background: var(--coral);
    color: #16201f;
    font-family: var(--font-mono);
    font-size: .75rem;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    transition: opacity .3s, scale .3s var(--ease-spring);
  }

  .lanes-row { border-block-start: 1px solid var(--night-line); }
  .row-msg {
    grid-area: msg;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .4rem .75rem;
    padding: .9rem 1.1rem .85rem;
  }
  .row-time {
    font-family: var(--font-mono);
    font-size: var(--fs-micro);
    letter-spacing: .02em;
    color: var(--night-muted);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
  }
  .row-bubble {
    display: inline-block;
    padding: .45em .8em .5em;
    border-radius: .95em .95em .95em .3em;
    background: color-mix(in srgb, var(--night-teal) 13%, transparent);
    border: 1px solid color-mix(in srgb, var(--night-teal) 20%, transparent);
    color: var(--night-text);
    font-size: .9375rem;
    line-height: 1.35;
  }
  .row-lane {
    display: grid;
    align-items: center;
    justify-items: start;
    padding: .75rem 1.1rem .85rem;
    border-block-start: 1px dashed var(--night-line);
  }
  .row-lane > :is(.wait, .chip) { grid-area: 1 / 1; }
  .chip {
    display: inline-flex;
    align-items: center;
    gap: .45em;
    padding: .36em .7em .36em .6em;
    border-radius: .85rem;
    font-size: .8125rem;
    font-weight: 500;
    line-height: 1.25;
    text-wrap: balance;
  }
  .chip .icon { align-self: flex-start; margin-block-start: .15em; }
  .chip-unread {
    color: #f6c8b9;
    border: 1px solid color-mix(in srgb, var(--coral) 40%, transparent);
    background: color-mix(in srgb, var(--coral) 9%, transparent);
  }
  .chip-unread::before {
    content: "";
    inline-size: .5rem;
    block-size: .5rem;
    border-radius: 50%;
    background: var(--coral);
    flex: none;
  }
  .chip-done {
    color: #dff4f1;
    background: color-mix(in srgb, var(--night-teal) 18%, transparent);
    border: 1px solid color-mix(in srgb, var(--night-teal) 38%, transparent);
  }
  .chip-done .icon, .chip-check .icon { inline-size: .8rem; block-size: .8rem; stroke-width: 2.2; }
  .chip-done .icon { color: var(--night-teal); }
  .chip-check {
    color: #f8e3b4;
    background: color-mix(in srgb, var(--marigold) 14%, transparent);
    border: 1px solid color-mix(in srgb, var(--marigold) 45%, transparent);
  }
  .chip-check .icon { color: var(--marigold); stroke-width: 1.8; inline-size: .9rem; block-size: .9rem; }
  .wait { display: inline-flex; gap: .22rem; padding: .7rem .2rem; visibility: hidden; }
  .wait i { inline-size: .32rem; block-size: .32rem; border-radius: 50%; background: var(--night-muted); opacity: .5; }

  .lanes-foot { border-block-start: 1px solid var(--night-line); }
  .lf-spacer { display: none; }
  .lf-total {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: 1rem 1.1rem 1.1rem;
    font-size: .875rem;
    line-height: 1.35;
  }
  .lf-total.lane-off { color: var(--night-muted); }
  .lf-total.lane-on { color: var(--night-text); font-weight: 600; }
  .rise-tick { inline-size: .75rem; block-size: .875rem; color: var(--night-teal); flex: none; }
  @media (max-width: 25rem) {
    .lanes-head > span, .row-lane, .lf-total { padding-inline: .8rem; }
  }

  .signoff {
    display: grid;
    gap: 2rem;
    align-items: center;
    margin-block-start: clamp(2.5rem, 5vw, 4rem);
  }
  .closing {
    font-family: var(--font-serif);
    font-size: clamp(2rem, 1.55rem + 1.6vw, 2.875rem);
    line-height: 1.1;
    letter-spacing: -.01em;
    color: var(--night-text);
    max-inline-size: 26ch;
    text-wrap: balance;
  }
  .signoff-mark { display: flex; align-items: center; gap: 1.25rem; }
  .signoff-mark img { block-size: 6rem; inline-size: auto; }
  .signoff-note { font-size: var(--fs-sm); color: var(--night-muted); max-inline-size: 16rem; }

  @media (min-width: 48rem) {
    .rail {
      display: block;
      position: relative;
      flex: 1;
      block-size: 2.5rem;
      margin-inline: .5rem .75rem;
    }
    .rail-line {
      position: absolute;
      inset-inline: 0;
      inset-block-start: .7rem;
      block-size: 1px;
      background: var(--night-line);
    }
    .rail-tick {
      position: absolute;
      inset-block-start: 1.25rem;
      inset-inline-start: var(--at);
      translate: -50% 0;
      font-family: var(--font-mono);
      font-size: var(--fs-micro);
      color: var(--night-muted);
      white-space: nowrap;
    }
    .rail-tick::before {
      content: "";
      position: absolute;
      inset-inline-start: 50%;
      inset-block-start: -.55rem;
      inline-size: 1px;
      block-size: .3rem;
      background: var(--night-line);
    }
    .rail-tick:nth-child(2) { --at: 0%; translate: 0 0; }
    .rail-tick:nth-child(2)::before { inset-inline-start: 0; }
    .rail-tick:nth-child(3) { --at: 14.29%; }
    .rail-tick:nth-child(4) { --at: 28.57%; }
    .rail-tick:nth-child(5) { --at: 42.86%; }
    .rail-tick:nth-child(6) { --at: 57.14%; }
    .rail-tick:nth-child(7) { --at: 71.43%; }
    .rail-tick:nth-child(8) { --at: 85.71%; }
    .rail-tick:nth-child(9) { --at: 99.6%; translate: calc(-2 * 50%) 0; }
    .rail-tick:nth-child(9)::before { inset-inline-start: auto; inset-inline-end: 0; }
    .rail-mark {
      position: absolute;
      inset-block-start: .7rem;
      inset-inline-start: var(--at);
      inline-size: .5rem;
      block-size: .5rem;
      translate: -50% -50%;
      border-radius: 50%;
      background: var(--night);
      border: 1.5px solid var(--night-teal);
    }
    .rail-mark:nth-of-type(1) { --at: 6.55%; }
    .rail-mark:nth-of-type(2) { --at: 16.67%; }
    .rail-mark:nth-of-type(3) { --at: 27.14%; }
    .rail-mark:nth-of-type(4) { --at: 79.17%; }
    .rail-mark:nth-of-type(5) { --at: 92.86%; border-color: var(--marigold); border-style: dashed; }
    .rail-now {
      position: absolute;
      inset-block-start: .7rem;
      inset-inline-start: var(--now-at, 92.86%);
      inline-size: .7rem;
      block-size: .7rem;
      translate: -50% -50%;
      border-radius: 50%;
      background: var(--marigold);
      box-shadow: 0 0 0 4px color-mix(in srgb, var(--marigold) 24%, transparent);
      transition: inset-inline-start .9s var(--ease-out);
    }
  }

  @media (min-width: 52rem) {
    .lanes-head,
    .lanes-row,
    .lanes-foot {
      grid-template-columns: 6.5rem minmax(0, 1fr) minmax(11rem, .62fr) minmax(14rem, .8fr);
      grid-template-areas: "time msg off on";
    }
    .lanes-row { grid-template-areas: "time msg off on"; }
    .lanes-foot { grid-template-areas: "space space off on"; }
    .lh-time, .lh-msg { display: flex !important; }
    .lh-time { grid-area: time; }
    .lh-msg { grid-area: msg; padding-inline-start: 0 !important; }
    .lanes-head .lane-off { border-inline-start: 1px solid var(--night-line); }
    .row-msg { display: contents; }
    .row-time { grid-area: time; align-self: center; padding: 1rem 0 1rem 1.1rem; }
    .row-bubble { grid-area: msg; align-self: center; justify-self: start; margin: .85rem 1.25rem .85rem 0; font-size: 1rem; }
    .row-lane { padding: .9rem 1.1rem; border-block-start: 0; border-inline-start: 1px solid var(--night-line); }
    .lf-spacer { display: block; grid-area: space; }
    .lf-total.lane-off { border-inline-start: 1px solid var(--night-line); }
  }

  @media (min-width: 60rem) {
    .signoff {
      grid-template-columns: repeat(12, minmax(0, 1fr));
      column-gap: var(--gutter);
    }
    .closing { grid-column: 1 / span 8; }
    .signoff-mark { grid-column: 9 / -1; justify-self: end; flex-direction: row-reverse; text-align: end; }
    .signoff-mark img { block-size: 10rem; margin-inline-end: -.75rem; }
  }

  .jobs, .extras {
    display: grid;
    gap: 1px;
    background: var(--line);
    grid-template-columns: minmax(0, 1fr);
  }
  .job {
    display: grid;
    align-content: start;
    gap: .9rem;
    padding: clamp(1.25rem, 3vw, 2.25rem);
    background: var(--paper);
  }
  .job-label {
    display: flex;
    align-items: center;
    gap: .6rem;
    font-family: var(--font-mono);
    font-size: var(--fs-micro);
    font-weight: 500;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--teal-text);
  }
  .job-label::before {
    content: "";
    inline-size: .45rem;
    block-size: .45rem;
    border-radius: 2px;
    background: var(--teal);
  }
  .job-title {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--fs-h3);
    line-height: 1.04;
    letter-spacing: -.01em;
    max-inline-size: 15ch;
  }
  .job-body { color: var(--muted); font-size: 1rem; line-height: 1.55; max-inline-size: 34rem; }
  .viz {
    order: -1;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: .55rem;
    min-block-size: 12rem;
    margin-block-end: .4rem;
    padding: 1.25rem;
    border-radius: 12px;
    background-color: var(--paper-2);
    background-image: radial-gradient(circle at 1px 1px, var(--dot) 1px, transparent 1.4px);
    background-size: 16px 16px;
    background-position: 8px 8px;
    border: 1px solid var(--line);
    font-size: .875rem;
    line-height: 1.4;
    overflow: hidden;
  }
  .mini {
    max-inline-size: 88%;
    padding: .55em .8em .58em;
    border-radius: 1em;
  }
  .mini-patient {
    align-self: flex-end;
    background: var(--mint);
    color: var(--mint-ink);
    border-end-end-radius: .35em;
  }
  .mini-assistant {
    align-self: flex-start;
    background: var(--bubble);
    border: 1px solid var(--line);
    border-end-start-radius: .35em;
    box-shadow: 0 1px 2px rgb(22 32 31 / .05);
  }
  .mini-typing { display: none; }
  .mini-reply { position: relative; align-self: flex-start; max-inline-size: 88%; }
  .mini-reply .mini-assistant { max-inline-size: none; }
  .mini-slots { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; }
  .viz-book { align-items: center; gap: 1.1rem; }
  .mini-slip { display: flex; rotate: -2deg; }
  .mini-acts { padding-block-end: 0; overflow: hidden; max-inline-size: 94%; }
  .mini-acts .acts { margin-inline: -.8em; }
  .mini-acts .act { font-size: .8125rem; }
  .tap {
    position: absolute;
    inset-inline-start: 50%;
    inset-block-start: 50%;
    inline-size: 2.25rem;
    block-size: 2.25rem;
    translate: -50% -50%;
    border-radius: 50%;
    background: color-mix(in srgb, var(--teal) 30%, transparent);
    opacity: 0;
    pointer-events: none;
  }
  .mini-status {
    display: inline-flex;
    align-items: center;
    gap: .4em;
    align-self: flex-start;
    margin-inline-start: .2rem;
    font-size: .8125rem;
    font-weight: 600;
    color: var(--teal-deep);
  }
  .mini-status .icon { inline-size: .9rem; block-size: .9rem; stroke-width: 2.2; }

  .extra {
    display: grid;
    align-content: start;
    gap: .5rem;
    padding: clamp(1.25rem, 2.6vw, 1.75rem) clamp(1.25rem, 3vw, 2.25rem);
    background: var(--paper);
  }
  .extra-viz {
    display: flex;
    align-items: center;
    min-block-size: 3rem;
    margin-block-end: .5rem;
  }
  .extra-title { font-size: 1.0625rem; font-weight: 600; letter-spacing: -.01em; line-height: 1.3; }
  .extra-body { font-size: 1rem; line-height: 1.5; color: var(--muted); max-inline-size: 30rem; }

  .lang-chips { flex-wrap: wrap; gap: .35rem; }
  .lang-chips span {
    padding: .3em .65em;
    border-radius: 999px;
    background: var(--surface);
    border: 1px solid var(--line-strong);
    font-size: .8125rem;
    color: var(--ink);
  }
  .lang-chips span:nth-child(2) { background: var(--marigold); border-color: var(--marigold); color: var(--marigold-ink); }
  .lang-chips [lang] { font-family: var(--font-deva-ui); }

  .mini-cal {
    display: grid;
    grid-template-columns: repeat(7, 1.375rem);
    gap: .3rem;
  }
  .mini-cal i {
    display: block;
    block-size: .55rem;
    border-radius: 2px;
    background: var(--line);
    align-self: center;
    justify-self: center;
    inline-size: .55rem;
  }
  .mini-cal i.is-past { background: color-mix(in srgb, var(--teal) 30%, var(--line)); }
  .mini-cal .due {
    display: grid;
    place-items: center;
    inline-size: 1.375rem;
    block-size: 1.375rem;
    border-radius: 50%;
    border: 1.5px solid var(--teal);
    color: var(--teal-deep);
    font-size: var(--fs-micro);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    line-height: 1;
  }

  .chairs { gap: .35rem; }
  .chairs i {
    display: block;
    inline-size: 1.6rem;
    block-size: 1.6rem;
    border-radius: 6px 6px 4px 4px;
    background: color-mix(in srgb, var(--teal) 22%, var(--paper-2));
    border: 1px solid color-mix(in srgb, var(--teal) 28%, transparent);
  }
  .chairs i.is-gap {
    background: var(--teal);
    border-color: var(--teal);
    position: relative;
  }

  @media (min-width: 40rem) and (max-width: 51.99rem) {
    .extra {
      grid-template-columns: 12.5rem minmax(0, 1fr);
      grid-template-areas: "viz title" "viz body";
      align-items: center;
      column-gap: 1.75rem;
    }
    .extra-viz { grid-area: viz; margin: 0; }
    .extra-title { grid-area: title; align-self: end; }
    .extra-body { grid-area: body; align-self: start; }
  }
  @media (min-width: 52rem) {
    .extras { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  }
  @media (min-width: 40rem) and (max-width: 63.99rem) {
    .job {
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      grid-template-areas: "label viz" "title viz" "body viz";
      column-gap: 2rem;
    }
    .job-label { grid-area: label; }
    .job-title { grid-area: title; }
    .job-body { grid-area: body; }
    .viz { grid-area: viz; margin: 0; align-self: stretch; }
  }
  @media (min-width: 64rem) {
    .jobs {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      grid-template-rows: repeat(4, auto);
    }
    .job {
      grid-row: span 4;
      grid-template-rows: subgrid;
      gap: 0;
    }
    .viz { order: 0; margin: 1.75rem 0 0; align-self: stretch; }
    .job-title { margin-block-start: .9rem; }
    .job-body { margin-block-start: .9rem; }
  }

  .safety-grid {
    display: grid;
    gap: clamp(2rem, 4vw, 3rem) var(--gutter);
  }
  .commitments { grid-template-columns: minmax(0, 1fr); align-content: start; }
  .commitment { display: grid; gap: .6rem; align-content: start; }
  .commitment-icon {
    display: grid;
    place-items: center;
    inline-size: 2.5rem;
    block-size: 2.5rem;
    margin-block-end: .35rem;
    border-radius: 10px;
    background: var(--mint);
    color: var(--teal-deep);
  }
  .commitment-icon .icon { inline-size: 1.25rem; block-size: 1.25rem; stroke-width: 1.6; }
  .commitment h3 { font-size: 1.125rem; letter-spacing: -.01em; line-height: 1.3; }
  .commitment p { font-size: 1rem; line-height: 1.55; color: var(--muted); }

  .handover { display: grid; gap: .8rem; align-content: start; }
  .handover-label { display: flex; align-items: center; gap: .55rem; font-size: var(--fs-sm); color: var(--muted); }
  .chat-vignette .chat-list { font-size: 1rem; padding: 1.1rem 1.1rem 1.25rem; gap: .6rem; }
  .chat-vignette .msg { max-inline-size: min(88%, 26rem); }

  .assurance {
    display: grid;
    gap: 1px;
    margin-block-start: clamp(2rem, 4vw, 3rem);
    background: var(--line);
    border-block: 1px solid var(--line);
  }
  .assurance li {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: 1rem .25rem;
    background: var(--paper);
    font-size: 1rem;
    line-height: 1.45;
  }
  .assurance .icon { inline-size: 1.15rem; block-size: 1.15rem; margin-block-start: .1rem; color: var(--teal-text); }
  .assurance a { color: var(--teal-text); white-space: nowrap; }
  .section-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem 1.75rem;
    margin-block-start: clamp(2rem, 4vw, 3rem);
  }
  .section-actions-note { color: var(--muted); font-size: 1rem; }

  @media (min-width: 40rem) {
    .commitments { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .assurance { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .assurance li { padding-inline: 0 1.5rem; }
    .assurance li + li { padding-inline-start: 1.5rem; }
  }
  @media (min-width: 64rem) {
    .safety-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }
    .commitments { grid-column: 1 / span 7; }
    .handover { grid-column: 8 / -1; }
  }

  .team-grid {
    display: grid;
    gap: clamp(2rem, 4vw, 3rem) var(--gutter);
  }
  .points { display: grid; gap: 0; border-block-start: 1px solid var(--line); align-content: start; }
  .points li { display: grid; gap: .35rem; padding-block: 1.1rem; border-block-end: 1px solid var(--line); }
  .points h3 { font-size: 1.0625rem; letter-spacing: -.01em; line-height: 1.3; }
  .points p { color: var(--muted); font-size: 1rem; line-height: 1.55; }

  .sheet-figure { display: grid; gap: .8rem; align-content: start; }
  .sheet {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-card);
    overflow: hidden;
  }
  .sheet-bar {
    display: flex;
    align-items: center;
    gap: .25rem;
    padding: .6rem .7rem;
    border-block-end: 1px solid var(--line);
    background: color-mix(in srgb, var(--paper-2) 60%, var(--surface));
  }
  .sheet-tab {
    padding: .4rem .8rem;
    border-radius: 999px;
    font-size: .8125rem;
    font-weight: 500;
    color: var(--muted);
  }
  .sheet-tab.is-active { background: var(--surface); color: var(--ink); box-shadow: 0 0 0 1px var(--line-strong); }
  .sheet-day {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .85rem 1rem .35rem;
  }
  .sheet-day i { display: block; block-size: .5rem; border-radius: 4px; background: var(--line); }
  .sheet-day i:first-child { inline-size: 4.5rem; background: var(--line-strong); }
  .sheet-day i:last-child { inline-size: 2.5rem; }
  .sheet-rows { padding: .25rem .5rem .6rem; }
  .sheet-row {
    display: grid;
    grid-template-columns: 3.25rem 2.75rem minmax(0, 1fr) auto;
    align-items: center;
    gap: .5rem .75rem;
    padding: .8rem .5rem;
    border-block-end: 1px solid var(--line);
  }
  .sheet-row:last-child { border-block-end: 0; }
  .sheet-time { font-family: var(--font-mono); font-size: .8125rem; color: var(--muted); font-variant-numeric: tabular-nums; }
  .sheet-initials {
    display: grid;
    place-items: center;
    inline-size: 2.25rem;
    block-size: 2.25rem;
    border-radius: 50%;
    background: var(--paper-2);
    border: 1px solid var(--line);
    font-size: .75rem;
    font-weight: 600;
    color: var(--ink);
  }
  .sheet-bars { display: grid; gap: .4rem; min-inline-size: 0; }
  .sheet-bars i { display: block; block-size: .45rem; border-radius: 4px; background: var(--line); }
  .sheet-bars i:first-child { inline-size: 72%; background: var(--line-strong); }
  .sheet-bars i:last-child { inline-size: 46%; }
  .sheet-row:nth-child(2) .sheet-bars i:first-child { inline-size: 58%; }
  .sheet-row:nth-child(3) .sheet-bars i:first-child { inline-size: 66%; }
  .sheet-row:nth-child(4) .sheet-bars i:first-child { inline-size: 52%; }
  .status {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .3em .7em;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 600;
    white-space: nowrap;
    line-height: 1.3;
  }
  .status-confirmed { background: var(--mint); color: var(--teal-deep); }
  .status-booked { background: transparent; color: var(--teal-deep); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--teal) 45%, transparent); }
  .status-person { background: var(--marigold-soft); color: var(--ink); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--marigold) 70%, transparent); }
  .status-person .icon { inline-size: .8rem; block-size: .8rem; stroke-width: 2; }
  .sheet-note { display: flex; align-items: center; gap: .5rem; }
  .sheet-note::before { content: ""; inline-size: .45rem; block-size: .45rem; border-radius: 2px; border: 1px solid var(--duo); }

  @media (max-width: 26rem) {
    .sheet-row { grid-template-columns: 2.9rem 2.25rem minmax(0, 1fr); }
    .sheet-row .status { grid-column: 2 / -1; justify-self: start; }
    .sheet-initials { inline-size: 2rem; block-size: 2rem; }
  }
  @media (min-width: 64rem) {
    .team-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: start; }
    .points { grid-column: 1 / span 5; }
    .sheet-figure { grid-column: 7 / -1; }
  }
  @media (max-width: 63.99rem) {
    .sheet-figure { order: -1; }
  }

  .tab-list {
    display: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .4rem;
    margin-block-end: 1.5rem;
  }
  .js .tab-list { display: grid; }
  .tab {
    min-block-size: 2.875rem;
    padding: .55rem 1.1rem;
    border-radius: 999px;
    border: 1px solid var(--line-strong);
    background: var(--surface);
    font-size: .9375rem;
    font-weight: 500;
    color: var(--muted);
    transition: background-color .2s, color .2s, border-color .2s;
  }
  .tab:hover { color: var(--ink); border-color: var(--teal); }
  .tab[aria-selected="true"] { background: var(--ink); border-color: var(--ink); color: var(--paper); }
  :root[data-theme="dark"] .tab[aria-selected="true"] { background: var(--teal); border-color: var(--teal); color: var(--on-teal); }
  .tab-panel {
    display: grid;
    gap: 1.75rem var(--gutter);
    padding: clamp(1.25rem, 3vw, 2.5rem);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--paper-2);
  }
  .tab-panel + .tab-panel { margin-block-start: 1rem; }
  .js .tab-panel + .tab-panel { margin-block-start: 0; }
  .js .tabs:not([data-ready]) .tab-panel:not(:first-of-type) { display: none; }
  .tab-panel:focus-visible { outline-offset: 4px; border-radius: var(--radius); }
  .panel-copy { display: grid; gap: 1.1rem; align-content: start; }
  .panel-title { font-family: var(--font-serif); font-weight: 400; font-size: var(--fs-h3); line-height: 1.05; }
  .panel-title em { font-style: italic; color: var(--duo); }
  .panel-line { font-size: var(--fs-lede); line-height: 1.5; color: var(--ink); max-inline-size: 30rem; }
  .panel-copy .btn { justify-self: start; text-wrap: balance; }
  .panel-chat { display: grid; gap: .7rem; align-content: start; }
  .chat-snippet .chat-list { padding: 1rem; }
  .tabs-foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .5rem 2rem;
    margin-block-start: 1.25rem;
    color: var(--muted);
    font-size: 1rem;
  }
  .tabs-foot p { display: flex; align-items: center; gap: .55rem; }
  .tabs-foot p .icon { color: var(--teal-text); }

  @media (min-width: 34rem) {
    .tab-list { display: none; grid-template-columns: none; }
    .js .tab-list { display: flex; flex-wrap: wrap; }
  }
  @media (min-width: 52rem) {
    .tab-panel { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); align-items: center; }
    .panel-copy { padding-inline-end: 1rem; }
  }

  .steps { counter-reset: step; }
  .step { display: grid; gap: .6rem; align-content: start; }
  .step-num {
    font-family: var(--font-serif);
    font-size: 3.5rem;
    line-height: .9;
    color: var(--teal-text);
    font-variant-numeric: lining-nums;
    margin-block-end: .5rem;
  }
  .step h3 { font-size: 1.1875rem; letter-spacing: -.01em; line-height: 1.3; }
  @media (min-width: 40rem) and (max-width: 51.99rem) {
    .step { grid-template-columns: 3.5rem minmax(0, 36rem); column-gap: 1.25rem; }
    .step-num { grid-row: span 2; margin: 0; }
  }
  .step p { color: var(--muted); font-size: 1rem; line-height: 1.55; }
  .setup-line { margin-block-start: 1rem; font-size: 1rem; color: var(--muted); }
  @media (min-width: 52rem) {
    .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  }

  .plan {
    display: grid;
    gap: 2rem var(--gutter);
    margin-block-start: clamp(1.5rem, 3vw, 2.25rem);
    padding: clamp(1.5rem, 4vw, 3rem);
    border-radius: var(--radius);
    background: var(--surface);
    border: 1px solid var(--line);
    box-shadow: 0 1px 0 rgb(22 32 31 / .03), 0 12px 32px -20px rgb(22 32 31 / .25);
  }
  .plan-main { display: grid; gap: 1rem; align-content: start; }
  .plan-title { font-family: var(--font-serif); font-weight: 400; font-size: clamp(2.25rem, 1.9rem + 1.4vw, 3rem); line-height: 1; letter-spacing: -.01em; }
  .plan-main p { color: var(--muted); max-inline-size: 34rem; }
  .plan-main .price-row { color: var(--ink); font-weight: 600; }
  .plan-main .btn { justify-self: start; margin-block-start: .5rem; }
  .plan-included { display: grid; gap: 1rem; align-content: start; padding-block-start: 1.5rem; border-block-start: 1px solid var(--line); }
  .plan-sub { font-family: var(--font-mono); font-size: var(--fs-micro); font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
  .plan-included .checklist { font-size: 1rem; }
  @media (min-width: 52rem) {
    .plan { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
    .plan-included { padding-block-start: 0; padding-inline-start: var(--gutter); border-block-start: 0; border-inline-start: 1px solid var(--line); }
  }

  .faq-layout { display: grid; gap: 0 var(--gutter); }
  .faq-list { border-block-start: 1px solid var(--line); }
  .faq-item { border-block-end: 1px solid var(--line); }
  .faq-item summary {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.25rem;
    padding: 1.2rem 0;
    font-size: clamp(1.0625rem, 1rem + .3vw, 1.1875rem);
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: -.01em;
    list-style: none;
  }
  .faq-item summary::-webkit-details-marker { display: none; }
  .faq-item summary > span:first-child { text-wrap: balance; }
  .faq-item summary:hover { color: var(--teal-text); }
  .faq-item summary:focus-visible { outline-offset: 2px; }
  .faq-toggle {
    position: relative;
    flex: none;
    inline-size: 1.75rem;
    block-size: 1.75rem;
    margin-block-start: -.05rem;
    border-radius: 50%;
    border: 1px solid var(--line-strong);
    transition: background-color .2s, border-color .2s, rotate .3s var(--ease-out);
  }
  .faq-toggle::before, .faq-toggle::after {
    content: "";
    position: absolute;
    inset-inline-start: 50%;
    inset-block-start: 50%;
    inline-size: .7rem;
    block-size: 1.5px;
    translate: -50% -50%;
    background: currentColor;
    border-radius: 1px;
  }
  .faq-toggle::after { rotate: 90deg; transition: rotate .3s var(--ease-out); }
  .faq-item[open] .faq-toggle { background: var(--ink); border-color: var(--ink); color: var(--paper); }
  .faq-item[open] .faq-toggle::after { rotate: 0deg; }
  .faq-answer { padding: 0 2.75rem 1.4rem 0; color: var(--muted); max-inline-size: 46rem; }
  .faq-answer p + p { margin-block-start: .8rem; }
  .faq-answer a { color: var(--teal-text); }
  @media (min-width: 60rem) {
    .faq-layout { grid-template-columns: repeat(12, minmax(0, 1fr)); }
    .faq-layout .section-head { grid-column: 1 / span 4; grid-template-columns: none; align-self: start; position: sticky; inset-block-start: calc(var(--header-h) + 2rem); }
    .faq-layout .section-head > .eyebrow { grid-column: auto; padding-block-start: 0; }
    .faq-layout .section-head-main { grid-column: auto; }
    .faq-layout .duo { font-size: clamp(2.25rem, 1.6rem + 1.6vw, 3rem); }
    .faq-list { grid-column: 6 / -1; }
  }

  .cta-band {
    position: relative;
    padding-block: clamp(4rem, 8vw, 7rem);
    background: var(--paper-2);
    border-block-start: 1px solid var(--line);
  }
  .cta-band-grid { display: grid; gap: 2rem var(--gutter); }
  .cta-band .duo { font-size: clamp(2.375rem, 1.6rem + 3vw, 4.25rem); max-inline-size: 18ch; }
  .cta-band-side { display: grid; gap: 1.25rem; align-content: start; }
  .cta-band-body { font-size: var(--fs-lede); color: var(--muted); line-height: 1.5; }
  .cta-band-actions { display: grid; gap: .6rem; }
  .cta-band-actions .btn { display: flex; }
  .contact-links { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; }
  .contact-links a {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    min-block-size: 2.75rem;
    color: var(--ink);
    font-weight: 500;
    text-decoration: underline;
    text-decoration-color: var(--line-strong);
    text-underline-offset: .3em;
  }
  .contact-links a:hover { text-decoration-color: var(--teal); }
  .contact-links .icon { color: var(--teal-text); }
  .cta-band-note { font-size: 1rem; color: var(--muted); line-height: 1.5; }
  .cta-band-note a { color: var(--teal-text); }
  [data-config="hours"] { white-space: nowrap; }
  @media (min-width: 60rem) {
    .cta-band-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: start; }
    .cta-band-grid > .duo { grid-column: 1 / span 7; }
    .cta-band-side { grid-column: 8 / -1; padding-block-start: .5rem; }
  }

  .founder-strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem 1.5rem;
    margin-block-start: clamp(2.5rem, 5vw, 3.5rem);
    padding-block-start: 1.5rem;
    border-block-start: 1px solid var(--line);
  }
  .founder-photo { inline-size: 4rem; block-size: 4rem; border-radius: 50%; object-fit: cover; background: var(--paper-3); }
  .founder-text { display: grid; gap: .2rem; }
  .founder-name { font-weight: 600; }
  .founder-meta { color: var(--muted); font-size: 1rem; }

  .site-footer {
    padding-block: clamp(3rem, 6vw, 5rem) 2rem;
    background: var(--paper);
    border-block-start: 1px solid var(--line);
    font-size: .9375rem;
  }
  .footer-grid {
    display: grid;
    gap: 2.5rem 2rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .footer-brand { grid-column: 1 / -1; display: grid; gap: .9rem; align-content: start; }
  .footer-brand .brand-logo { block-size: 2.75rem; margin-inline-start: -.25rem; }
  .footer-tag { color: var(--ink); font-weight: 500; text-wrap: balance; }
  .footer-contact { display: grid; gap: 0; color: var(--muted); }
  .footer-contact a { display: inline-flex; align-items: center; min-block-size: 2.75rem; color: var(--ink); text-decoration: none; }
  .footer-contact a:hover { text-decoration: underline; color: var(--teal-text); }
  .footer-heading {
    margin-block-end: .75rem;
    font-family: var(--font-mono);
    font-size: var(--fs-micro);
    font-weight: 500;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--muted);
  }
  .footer-col ul { display: grid; gap: 0; }
  .footer-col a {
    display: inline-flex;
    align-items: center;
    min-block-size: 2.75rem;
    min-inline-size: 2.75rem;
    color: var(--ink);
    text-decoration: none;
  }
  .footer-col a:hover { color: var(--teal-text); text-decoration: underline; }
  .patient-note {
    margin-block-start: clamp(2.5rem, 5vw, 3.5rem);
    padding: 1.1rem 1.25rem;
    border: 1px solid var(--line-strong);
    border-radius: 12px;
    font-size: 1rem;
    line-height: 1.6;
    color: var(--muted);
    max-inline-size: 52rem;
  }
  .patient-note strong { color: var(--ink); }
  .patient-note a { color: var(--teal-text); }
  .legal {
    display: grid;
    gap: .35rem;
    margin-block-start: 2rem;
    padding-block-start: 1.25rem;
    border-block-start: 1px solid var(--line);
    font-size: .8125rem;
    color: var(--muted);
  }
  @media (min-width: 48rem) {
    .footer-grid { grid-template-columns: 1.6fr 1fr 1fr 1.2fr; }
    .footer-brand { grid-column: auto; }
    .legal { grid-template-columns: auto 1fr; gap: .75rem 2rem; }
    .legal p + p { text-align: end; }
  }
  .legal .legal-office { grid-column: 1 / -1; text-align: start; }

  .sticky-bar {
    position: fixed;
    inset-inline: 0;
    inset-block-end: 0;
    z-index: 40;
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .65rem var(--pad) max(.65rem, env(safe-area-inset-bottom));
    background: color-mix(in srgb, var(--paper) 90%, transparent);
    -webkit-backdrop-filter: blur(14px) saturate(1.2);
    backdrop-filter: blur(14px) saturate(1.2);
    border-block-start: 1px solid var(--line);
    translate: 0 calc(2 * 50% + 1rem);
    visibility: hidden;
    transition: translate .35s var(--ease-out), visibility 0s linear .35s;
  }
  .sticky-bar.is-visible { translate: 0 0; visibility: visible; transition: translate .35s var(--ease-out), visibility 0s; }
  .sticky-bar .btn { flex: 1 1 auto; min-inline-size: 0; gap: 0; }
  @media (max-width: 23.9rem) {
    .bar-more { display: none; }
  }
  .sticky-link {
    display: inline-flex;
    align-items: center;
    min-block-size: 2.75rem;
    padding-inline: .5rem;
    color: var(--ink);
    font-size: .9375rem;
    font-weight: 500;
    white-space: nowrap;
    text-decoration: underline;
    text-decoration-color: var(--line-strong);
    text-underline-offset: .3em;
  }
  @media (min-width: 64rem) {
    .sticky-bar { display: none; }
  }

  .cta-dialog {
    inline-size: min(26rem, calc(100vw - 2rem));
    max-block-size: calc(100dvh - 2rem);
    margin: auto;
    border-radius: 18px;
    background: var(--surface);
    color: var(--ink);
    border: 1px solid var(--line);
    box-shadow: var(--shadow-pop);
    overflow: auto;
  }
  .cta-dialog::backdrop { background: rgb(10 18 18 / .45); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
  .dialog-inner { display: grid; gap: 1.1rem; padding: 1.5rem 1.5rem 1.4rem; }
  .dialog-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
  .dialog-title { font-family: var(--font-sans); font-size: 1.25rem; font-weight: 600; letter-spacing: -.015em; line-height: 1.3; text-wrap: balance; }
  .dialog-sub { margin-block-start: .25rem; color: var(--muted); font-size: 1rem; }
  .dialog-close {
    display: grid;
    place-items: center;
    flex: none;
    inline-size: 2.75rem;
    block-size: 2.75rem;
    margin: -.6rem -.6rem 0 0;
    border-radius: 50%;
    color: var(--muted);
  }
  .dialog-close:hover { background: var(--paper-2); color: var(--ink); }
  .qr-box {
    display: grid;
    place-items: center;
    justify-self: center;
    inline-size: 13.5rem;
    block-size: 13.5rem;
    padding: .75rem;
    border-radius: 14px;
    background: #ffffff;
    border: 1px solid var(--line);
  }
  .qr-box svg { inline-size: 12rem; block-size: 12rem; }
  .qr-box svg path { fill: #16201f; }
  .qr-wait { inline-size: 1.25rem; block-size: 1.25rem; border-radius: 50%; border: 2px solid var(--line); border-block-start-color: var(--teal); animation: spin .8s linear infinite; }
  .dialog-alt { display: grid; gap: .25rem; padding-block-start: 1rem; border-block-start: 1px solid var(--line); font-size: .9375rem; }
  .dialog-alt a { display: inline-flex; align-items: center; gap: .55rem; min-block-size: 2.75rem; color: var(--ink); text-decoration: none; }
  .dialog-alt a:hover { color: var(--teal-text); text-decoration: underline; }
  .dialog-alt .icon { color: var(--teal-text); }
  .dialog-note { font-size: var(--fs-xs); color: var(--muted); }

  .page-hero {
    padding-block: clamp(2.5rem, 7vw, 6rem) clamp(2rem, 4vw, 3.5rem);
    border-block-end: 1px solid var(--line);
  }
  .page-hero .eyebrow { margin-block-end: 1.1rem; }
  .page-title {
    font-size: var(--fs-page);
    line-height: 1;
    letter-spacing: -.015em;
    max-inline-size: 18ch;
  }
  .page-title em { color: var(--teal-text); }
  .page-hero .lede { margin-block-start: clamp(1.4rem, 2.4vw, 2rem); }
  .page-meta { margin-block-start: 1.25rem; font-size: var(--fs-sm); color: var(--duo); }

  .doc-layout {
    display: grid;
    gap: 2rem var(--gutter);
    padding-block: clamp(2rem, 5vw, 4rem) var(--section);
  }
  .toc {
    align-self: start;
    font-size: .9375rem;
  }
  .toc-title { margin-block-end: .6rem; font-family: var(--font-mono); font-size: var(--fs-micro); font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
  .toc ol { display: grid; gap: 0; }
  .toc-fold > ol { padding: .6rem 1rem 1rem; }
  .toc a {
    display: flex;
    align-items: center;
    min-block-size: 2.75rem;
    padding: .4rem 0 .4rem .75rem;
    border-inline-start: 2px solid var(--line);
    color: var(--muted);
    text-decoration: none;
    line-height: 1.4;
  }
  .toc a:hover { color: var(--ink); border-inline-start-color: var(--teal); }
  .toc a[aria-current="true"], .toc a[aria-current="location"] { color: var(--ink); border-inline-start-color: var(--teal); }
  @media (min-width: 64rem) {
    .doc-layout { grid-template-columns: 15rem minmax(0, 1fr); column-gap: clamp(2.5rem, 5vw, 5rem); }
    .toc {
      position: sticky;
      inset-block-start: calc(var(--header-h) + 1.5rem);
      max-block-size: calc(100dvh - var(--header-h) - 3rem);
      overflow-y: auto;
      padding: 0;
      border: 0;
      background: none;
    }
  }

  .prose {
    max-inline-size: var(--wrap-text);
    font-size: 1.0625rem;
    line-height: 1.7;
    color: var(--ink);
  }
  .prose > * + * { margin-block-start: 1.1em; }
  .prose h2 {
    margin-block-start: 2.4em;
    font-size: clamp(1.75rem, 1.5rem + 1vw, 2.25rem);
    line-height: 1.12;
    letter-spacing: -.01em;
    scroll-margin-block-start: calc(var(--header-h) + 1.5rem);
  }
  .prose h3 {
    margin-block-start: 1.9em;
    font-size: 1.1875rem;
    line-height: 1.35;
    letter-spacing: -.01em;
    scroll-margin-block-start: calc(var(--header-h) + 1.5rem);
  }
  .prose h2 + * { margin-block-start: 1em; }
  .prose h3 + * { margin-block-start: .6em; }
  .prose > :first-child { margin-block-start: 0; }
  .prose h4 { margin-block-start: 1.6em; font-size: 1.0625rem; }
  .prose p, .prose li { color: var(--ink); }
  .prose a { color: var(--teal-text); text-decoration-color: color-mix(in srgb, var(--teal) 45%, transparent); }
  .prose a:hover { text-decoration-color: var(--teal); }
  .prose ul, .prose ol { padding-inline-start: 1.35em; display: grid; gap: .45em; }
  .prose ul { list-style: disc; }
  .prose ol { list-style: decimal; }
  .prose li::marker { color: var(--teal-text); }
  .prose strong { font-weight: 600; }
  .prose blockquote, .prose .callout {
    padding: 1rem 1.25rem;
    border-inline-start: 3px solid var(--teal);
    background: var(--paper-2);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
    color: var(--muted);
  }
  .prose hr { border: 0; border-block-start: 1px solid var(--line); margin-block: 2.5em; }
  .prose table { inline-size: max-content; max-inline-size: calc(2 * 50%); border-collapse: collapse; font-size: .9375rem; display: block; overflow-x: auto; }
  .prose th, .prose td { padding: .65rem .9rem; border: 1px solid var(--line); text-align: start; vertical-align: top; }
  .prose th { background: var(--paper-2); font-weight: 600; }
  .prose code { font-family: var(--font-mono); font-size: .9em; padding: .1em .35em; border-radius: 4px; background: var(--paper-2); }
  .prose-legal { font-size: 1rem; }
  .prose-legal h2 {
    font-family: var(--font-sans);
    font-size: 1.25rem;
    font-weight: 600;
    letter-spacing: -.005em;
    line-height: 1.35;
    padding-block-start: 1.4rem;
    border-block-start: 1px solid var(--line);
  }
  .prose-legal h3 { font-size: 1.0625rem; }
  .prose-legal .caps { text-transform: uppercase; letter-spacing: .05em; }

  .company-block {
    display: grid;
    gap: 1px;
    background: var(--line);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    overflow: hidden;
  }
  .company-block > div { display: grid; gap: .2rem; padding: 1.1rem 1.25rem; background: var(--paper); }
  .company-block dt { font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
  .company-block dd { font-weight: 500; }
  .company-block a { display: inline-flex; align-items: center; min-block-size: 2.75rem; color: var(--teal-text); }
  .company-block dd:has(> a) { margin-block: -.5rem; }
  @media (min-width: 40rem) {
    .company-block { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  .people { display: grid; gap: 1.5rem; }
  .person-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 1.1rem;
    padding: 1.25rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
  }
  .person-photo { inline-size: 5.5rem; block-size: 5.5rem; border-radius: 50%; object-fit: cover; background: var(--paper-3); }
  .person-name { font-size: 1.125rem; font-weight: 600; letter-spacing: -.01em; }
  .person-role { color: var(--muted); font-size: 1rem; }
  @media (min-width: 48rem) {
    .people { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  .card-grid { display: grid; gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
  .card-grid > * { padding: clamp(1.25rem, 3vw, 2rem); background: var(--paper); display: grid; gap: .6rem; align-content: start; }
  .card-grid h3 { font-size: 1.125rem; letter-spacing: -.01em; }
  .card-grid p { color: var(--muted); font-size: 1rem; }
  @media (min-width: 48rem) {
    .card-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .card-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  .notfound {
    display: grid;
    gap: 1.25rem;
    justify-items: start;
    align-content: center;
    min-block-size: calc(100dvh - var(--header-h) - 18rem);
    padding-block: clamp(4rem, 12vw, 9rem);
  }
  .notfound-code { font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: .14em; text-transform: uppercase; color: var(--teal-text); display: inline-flex; align-items: center; gap: .55rem; }
  .notfound-title { font-size: clamp(2.75rem, 1.8rem + 4vw, 5rem); line-height: 1.04; letter-spacing: -.018em; max-inline-size: 14ch; }
  .notfound-title em { color: var(--teal-text); }
  .notfound .lede { max-inline-size: 32rem; }
  .notfound-links { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; margin-block-start: .75rem; align-items: center; }

  .cta-band { scroll-margin-block-start: calc(-1 * clamp(4rem, 8vw, 7rem)); }
  .jump-target:focus { outline: none; }

  @media (max-height: 30rem) {
    html { scroll-padding-top: 1rem; }
    .site-header { position: relative; }
    .sticky-bar { display: none; }
  }

  @media (max-width: 29.99rem) {
    .section-actions { flex-direction: column; align-items: stretch; gap: .5rem; }
    .section-actions .btn, .plan-main .btn, .panel-copy .btn { display: flex; justify-self: stretch; white-space: normal; text-wrap: balance; }
    .section-actions .text-link { align-self: flex-start; }
  }

  @keyframes bubble-in {
    from { opacity: 0; translate: 0 8px; scale: .985; }
    to { opacity: 1; translate: 0 0; scale: 1; }
  }
  @keyframes fade-up {
    from { opacity: 0; translate: 0 4px; }
    to { opacity: 1; translate: 0 0; }
  }
  @keyframes vt-out {
    to { opacity: 0; translate: 0 -6px; }
  }
  @keyframes vt-in {
    from { opacity: 0; translate: 0 6px; }
  }
  @keyframes dot {
    from, 60%, to { opacity: .3; translate: 0 0; }
    30% { opacity: .9; translate: 0 -2px; }
  }
  @keyframes press {
    40% { scale: .94; }
  }
  @keyframes pulse {
    from { box-shadow: 0 0 0 0 color-mix(in srgb, var(--marigold) 55%, transparent); }
    70%, to { box-shadow: 0 0 0 7px color-mix(in srgb, var(--marigold) 0%, transparent); }
  }
  @keyframes tick-up {
    from { translate: 0 6px; opacity: 0; }
    60% { translate: 0 -2px; opacity: 1; }
    to { translate: 0 0; opacity: 1; }
  }
  @keyframes tap {
    from { opacity: 0; scale: .4; }
    35% { opacity: 1; scale: 1; }
    to { opacity: 0; scale: 1.5; }
  }
  @keyframes spin {
    to { rotate: 1turn; }
  }
  @keyframes rise-in {
    from { opacity: 0; translate: 0 10px; }
    to { opacity: 1; translate: 0 0; }
  }
  @keyframes pick {
    to { background: var(--teal); border-color: var(--teal); color: var(--on-teal); }
  }
  @keyframes confirm-fill {
    to { background: color-mix(in srgb, var(--mint) 75%, transparent); }
  }
  @keyframes slip-in {
    from { opacity: 0; translate: 0 14px; rotate: 3deg; }
    to { opacity: 1; translate: 0 0; rotate: -2deg; }
  }
  @keyframes typing-life {
    from { opacity: 0; }
    10%, 90% { opacity: 1; }
    to { opacity: 0; visibility: hidden; }
  }
  @keyframes gap-fill {
    from { background: transparent; border-style: dashed; border-color: var(--duo); }
    45% { background: transparent; border-style: dashed; border-color: var(--duo); }
  }
  @keyframes person-glow {
    from, to { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--marigold) 70%, transparent); }
    50% { box-shadow: inset 0 0 0 1px var(--marigold), 0 0 0 5px color-mix(in srgb, var(--marigold) 25%, transparent); }
  }
  @keyframes fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
  }
  @keyframes mark-draw {
    from { clip-path: inset(99.5% 0 0 0); opacity: .2; }
    to { clip-path: inset(0 0 0 0); opacity: 1; }
  }

  @media (prefers-reduced-motion: no-preference) {
    .demo-caption .now-dot,
    .chat-day-label .now-dot { animation: pulse 2.4s ease-out 3; }

    .menu {
      transition: opacity .22s var(--ease-out), translate .3s var(--ease-out), display .3s allow-discrete, overlay .3s allow-discrete;
    }
    .menu:not(:popover-open):not(.is-open) { opacity: 0; translate: 0 -.5rem; }
    @starting-style {
      .menu:popover-open { opacity: 0; translate: 0 -.5rem; }
    }
    .cta-dialog[open] { animation: rise-in .28s var(--ease-out); }
    .cta-dialog[open]::backdrop { animation: fade-in .28s var(--ease-out); }

    @supports selector(::details-content) {
      .faq-item { interpolate-size: allow-keywords; }
      .faq-item::details-content {
        block-size: 0;
        overflow: clip;
        transition: block-size .32s var(--ease-out), content-visibility .32s allow-discrete;
      }
      .faq-item[open]::details-content { block-size: auto; }
    }

    @view-transition { navigation: auto; }
  }

  .js:not(.is-calm) .lanes.is-armed .lanes-row:not(.is-in) :is(.row-bubble, .row-time) { opacity: .28; }
  .js:not(.is-calm) .lanes.is-armed .lanes-row.is-in :is(.row-bubble, .row-time) { transition: opacity .5s var(--ease-out); opacity: 1; }
  .js:not(.is-calm) .lanes.is-armed .lanes-row:not(.is-in) .chip,
  .js:not(.is-calm) .lanes.is-armed .lanes-row.is-in:not(.is-done) :is(.chip-done, .chip-check) { opacity: 0; visibility: hidden; }
  .js:not(.is-calm) .lanes.is-armed .lanes-row.is-in:not(.is-done) .wait { visibility: visible; }
  .js:not(.is-calm) .lanes.is-armed .lanes-row.is-in:not(.is-done) .wait i { animation: dot 1s ease-in-out infinite; }
  .js:not(.is-calm) .lanes.is-armed .lanes-row.is-in:not(.is-done) .wait i:nth-child(2) { animation-delay: .15s; }
  .js:not(.is-calm) .lanes.is-armed .lanes-row.is-in:not(.is-done) .wait i:nth-child(3) { animation-delay: .3s; }
  .js:not(.is-calm) .lanes.is-armed .lanes-row.is-done :is(.chip-done, .chip-check) { animation: bubble-in .35s var(--ease-out) both; }
  .js:not(.is-calm) .lanes.is-armed .lanes-row.is-in .chip-unread { animation: bubble-in .3s var(--ease-out) both; }
  .js:not(.is-calm) .lanes.is-armed:not(.is-total) .lf-total > * { opacity: 0; }
  .js:not(.is-calm) .lanes.is-total .lf-total > * { animation: fade-up .45s var(--ease-out) both; }
  .js:not(.is-calm) .lanes.is-armed .unread-count[data-n="0"] { opacity: 0; scale: .6; }
  .js:not(.is-calm) .lanes.is-total .rise-tick { animation: tick-up .7s var(--ease-spring) .25s both; }
  .js:not(.is-calm) .lanes.is-still .rail-now { transition: none; }

  .js:not(.is-calm) .night[data-reveal] { transition: background-color .9s var(--ease-out); }
  .js:not(.is-calm) .night[data-reveal]::before { transition: opacity .9s var(--ease-out); }
  .js:not(.is-calm) .night[data-reveal] > .wrap > .section-head { transition: opacity .7s var(--ease-out) .25s; }
  .js:not(.is-calm) .night-stamp-line { transition: scale 1.1s var(--ease-out) .1s; }
  .js:not(.is-calm) .night.is-armed:not(.is-in) { background-color: var(--paper); }
  .js:not(.is-calm) .night.is-armed:not(.is-in)::before { opacity: 0; }
  .js:not(.is-calm) .night.is-armed:not(.is-in) > .wrap > .section-head { opacity: 0; }
  .js:not(.is-calm) .night.is-armed:not(.is-in) > .night-stamp-top .night-stamp-line,
  .js:not(.is-calm) .night-stamp.is-armed:not(.is-in) .night-stamp-line { scale: 0 1; }
  .js:not(.is-calm) .signoff-mark.is-armed:not(.is-in) img { clip-path: inset(99.5% 0 0 0); opacity: .2; }
  .js:not(.is-calm) .signoff-mark.is-in img { animation: mark-draw 1.1s var(--ease-out) both; }
  .js:not(.is-calm) .clock-time.is-tick { animation: fade-up .35s var(--ease-out); }

  .js:not(.is-calm) .job.is-armed:not(.is-in) .mini-patient,
  .js:not(.is-calm) .job.is-armed:not(.is-in) .mini-assistant,
  .js:not(.is-calm) .job.is-armed:not(.is-in) .slot-chip,
  .js:not(.is-calm) .job.is-armed:not(.is-in) .mini-slip,
  .js:not(.is-calm) .job.is-armed:not(.is-in) .mini-status { opacity: 0; }
  .js:not(.is-calm) .job.is-armed .viz .slot-chip.is-picked { background: var(--surface); border-color: color-mix(in srgb, var(--teal) 42%, transparent); color: var(--teal-deep); }
  .js:not(.is-calm) .job.is-armed .viz .act.is-picked { background: transparent; }
  .js:not(.is-calm) .job.is-in .mini-patient { animation: bubble-in .35s var(--ease-out) .2s both; }
  .js:not(.is-calm) .job.is-in .mini-typing {
    display: inline-flex;
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0;
    gap: .22rem;
    padding: .7em .85em;
    border-radius: 1em;
    border-end-start-radius: .35em;
    background: var(--bubble);
    border: 1px solid var(--line);
    animation: typing-life 1.1s linear .7s both;
  }
  .js:not(.is-calm) .job.is-in .mini-typing i { inline-size: .3rem; block-size: .3rem; border-radius: 50%; background: var(--duo); animation: dot 1s ease-in-out infinite; }
  .js:not(.is-calm) .job.is-in .mini-typing i:nth-child(2) { animation-delay: .15s; }
  .js:not(.is-calm) .job.is-in .mini-typing i:nth-child(3) { animation-delay: .3s; }
  .js:not(.is-calm) .job.is-in .mini-assistant { animation: bubble-in .35s var(--ease-out) 1.8s both; }
  .js:not(.is-calm) .job.is-in .slot-chip { animation: bubble-in .35s var(--ease-out) both; }
  .js:not(.is-calm) .job.is-in .slot-chip:nth-child(1) { animation-delay: .2s; }
  .js:not(.is-calm) .job.is-in .slot-chip:nth-child(3) { animation-delay: .44s; }
  .js:not(.is-calm) .job.is-in .viz .slot-chip.is-picked { animation: bubble-in .35s var(--ease-out) .32s both, pick 1ms linear 1.3s forwards, press .35s var(--ease-spring) 1.3s; }
  .js:not(.is-calm) .job.is-in .mini-slip { animation: slip-in .6s var(--ease-spring) 1.75s both; }
  .js:not(.is-calm) .job.is-in .viz-remind .mini-assistant { animation: bubble-in .35s var(--ease-out) .2s both; }
  .js:not(.is-calm) .job.is-in .viz .act.is-picked { animation: confirm-fill 1ms linear 1.45s forwards, press .35s var(--ease-spring) 1.35s; }
  .js:not(.is-calm) .job.is-in .tap { animation: tap .7s var(--ease-out) 1.2s both; }
  .js:not(.is-calm) .job.is-in .mini-status { animation: fade-up .4s var(--ease-out) 1.8s both; }

  .js:not(.is-calm) .reveal.is-armed:not(.is-in) .reveal-item { opacity: 0; translate: 0 8px; }
  .js:not(.is-calm) .reveal.is-in .reveal-item { animation: bubble-in .4s var(--ease-out) both; }
  .js:not(.is-calm) .reveal.is-in .reveal-item:nth-child(2) { animation-delay: .6s; }
  .js:not(.is-calm) .reveal.is-in .reveal-item:nth-child(3) { animation-delay: 1.3s; }
  .js:not(.is-calm) .reveal.is-in .reveal-item:nth-child(4) { animation-delay: 1.8s; }
  .js:not(.is-calm) .reveal.is-in .msg-handover .bubble { animation: dim-to .6s var(--ease-out) 1.5s both; }
  @keyframes dim-to { to { opacity: .6; } }
  .js:not(.is-calm) .sheet.is-armed:not(.is-in) .sheet-row { opacity: 0; translate: 0 6px; }
  .js:not(.is-calm) .sheet.is-in .sheet-row { animation: rise-in .45s var(--ease-out) both; }
  .js:not(.is-calm) .sheet.is-in .sheet-row:nth-child(2) { animation-delay: .12s; }
  .js:not(.is-calm) .sheet.is-in .sheet-row:nth-child(3) { animation-delay: .24s; }
  .js:not(.is-calm) .sheet.is-in .sheet-row:nth-child(4) { animation-delay: .36s; }
  .js:not(.is-calm) .sheet.is-in .status-person { animation: person-glow 1.4s ease-in-out 1s 2; }
  .js:not(.is-calm) .extras.is-in .chairs i.is-gap { animation: gap-fill 1.6s var(--ease-out) .3s both; }
}

@layer utilities {
  .sr-only {
    position: absolute !important;
    inline-size: 1px !important;
    block-size: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }
  .nowrap { white-space: nowrap; }
  .muted { color: var(--muted); }
  .center { text-align: center; }
  .stack-sm > * + * { margin-block-start: .5rem; }
  .stack > * + * { margin-block-start: 1rem; }
  .stack-lg > * + * { margin-block-start: 2rem; }
  .mt-0 { margin-block-start: 0; }
  .mt-1 { margin-block-start: 1rem; }
  .mt-2 { margin-block-start: 2rem; }
  .mt-3 { margin-block-start: 3rem; }
  .is-calm *, .is-calm *::before, .is-calm *::after { animation-duration: 0s !important; animation-delay: 0s !important; transition-duration: 0s !important; }
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  }
}

@layer components {
  .policy-layout {
    --policy-top: clamp(1.75rem, 4vw, 3rem);
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    padding-block-end: var(--section);
  }
  .policy-head {
    padding-block: clamp(2.5rem, 7vw, 6rem) clamp(2rem, 4vw, 3.5rem);
    border-block-end: 1px solid var(--line);
  }
  .policy-head::before {
    content: "Legal" / "";
    display: block;
    margin-block-end: 1.1rem;
    font-family: var(--font-mono);
    font-size: var(--fs-micro);
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--teal-text);
  }
  .policy-head .page-meta { margin-block-start: 1.5rem; }
  .policy-head .page-meta strong { font-weight: 500; color: var(--muted); }

  .policy-toc {
    position: relative;
    z-index: 1;
    margin-block-start: 1.5rem;
    font-size: .9375rem;
  }
  .toc-full { display: none; }
  .toc-fold {
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--paper-2);
  }
  .toc-fold > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-block-size: 3rem;
    padding: .7rem 1rem;
    list-style: none;
    border-radius: var(--radius-sm);
    font-family: var(--font-mono);
    font-size: var(--fs-micro);
    font-weight: 500;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--muted);
  }
  .toc-fold > summary::-webkit-details-marker { display: none; }
  .toc-fold > summary::after {
    content: "";
    inline-size: .5rem;
    block-size: .5rem;
    border-inline-end: 1.5px solid currentColor;
    border-block-end: 1.5px solid currentColor;
    rotate: 45deg;
    translate: 0 -.15rem;
    transition: rotate .2s var(--ease-out), translate .2s var(--ease-out);
  }
  .toc-fold[open] > summary {
    border-end-start-radius: 0;
    border-end-end-radius: 0;
    border-block-end: 1px solid var(--line);
  }
  .toc-fold[open] > summary::after { rotate: 225deg; translate: 0 .1rem; }
  .toc-fold > .toc-list { padding: .6rem 1rem 1rem; }
  .toc-fold .toc-list a { min-block-size: 2.75rem; align-items: center; }
  .toc-list { display: grid; gap: .1rem; }
  .toc-list a {
    display: grid;
    grid-template-columns: 1.9rem minmax(0, 1fr);
    align-items: baseline;
    padding: .38rem .25rem .38rem .75rem;
    border-inline-start: 2px solid var(--line);
    color: var(--muted);
    text-decoration: none;
    line-height: 1.4;
  }
  .toc-list a:hover { color: var(--ink); border-inline-start-color: var(--teal); }
  .toc-num { font-family: var(--font-mono); font-size: var(--fs-micro); color: var(--muted); }
  .toc-sub { display: grid; }
  .toc-sub a { display: flex; padding-inline-start: 2.65rem; font-size: .875rem; }

  .policy-body {
    max-inline-size: 37rem;
    padding-block-start: var(--policy-top);
    font-size: var(--fs-base);
    line-height: 1.7;
  }
  .policy-body h2,
  .policy-body h3,
  .policy-body [id] { scroll-margin-block-start: .75rem; }
  .policy-body .in-short {
    padding: .85rem 1.1rem;
    border-inline-start: 3px solid var(--teal);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
    background: var(--paper-2);
    font-size: max(1rem, .9375em);
    line-height: 1.6;
  }
  .policy-body .policy-sub { margin-block-start: 2em; font-size: 1.0625rem; }
  .policy-body h2 + .policy-sub { margin-block-start: 1.1em; }
  .policy-body .policy-sub + * { margin-block-start: .6em; }
  .policy-body .policy-note { color: var(--muted); }
  .policy-card {
    display: grid;
    gap: .35rem;
    padding: 1.1rem 1.25rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
  }
  .policy-address { display: grid; gap: .1rem; }
  .policy-card a,
  .policy-body p > strong:first-child + a:last-child {
    display: inline-flex;
    align-items: center;
    min-block-size: 2.75rem;
    margin-block: -.4rem;
    vertical-align: middle;
  }
  .prose-legal h2.policy-part {
    margin-block-start: 3.2em;
    padding-block-start: 2.25rem;
    border-block-start: 1px solid var(--line-strong);
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: clamp(2rem, 1.6rem + 1.4vw, 2.75rem);
    line-height: 1.05;
    letter-spacing: -.01em;
    text-transform: none;
  }
  .policy-body .policy-part + * { margin-block-start: 1.5rem; }

  @supports (grid-template-rows: subgrid) {
    .policy-layout { grid-template-rows: auto auto auto; }
    .policy-main {
      grid-row: 1 / span 3;
      grid-column: 1 / -1;
      display: grid;
      grid-template-columns: subgrid;
      grid-template-rows: subgrid;
    }
    .policy-head { grid-row: 1; grid-column: 1 / -1; }
    .policy-toc { grid-row: 2; grid-column: 1 / -1; }
    .policy-body { grid-row: 3; grid-column: 1 / -1; }
  }

  @media (min-width: 64rem) {
    .policy-layout { grid-template-columns: 17rem minmax(0, 1fr); column-gap: clamp(2.5rem, 5vw, 5rem); }
    .policy-toc {
      position: sticky;
      inset-block-start: calc(var(--header-h) + 1.5rem);
      max-block-size: calc(100dvh - var(--header-h) - 3rem);
      overflow-y: auto;
      margin-block-start: var(--policy-top);
      overscroll-behavior: contain;
    }
    .toc-fold { display: none; }
    .toc-full { display: block; }
    .toc-full .toc-title { margin-block-end: .75rem; }
    @supports (grid-template-rows: subgrid) {
      .policy-layout { grid-template-rows: auto auto; }
      .policy-main { grid-row: 1 / span 2; }
      .policy-toc { grid-row: 2; grid-column: 1; }
      .policy-body { grid-row: 2; grid-column: 2; }
    }
  }

  @media print {
    :root:has(.policy-page), .policy-page { background: #fff; }
    .policy-page .skip-link,
    .policy-page .site-header,
    .policy-page .menu,
    .policy-page .site-footer,
    .policy-page .policy-toc,
    .policy-page .cta-dialog { display: none !important; }
    .policy-page .policy-layout,
    .policy-page .policy-main { display: block; max-inline-size: none; padding: 0; }
    .policy-page .policy-head { padding-block: 0 1rem; border-block-end-color: #999; }
    .policy-page .policy-body { max-inline-size: none; padding-block-start: 1.25rem; font-size: 11pt; line-height: 1.5; }
    .policy-page .policy-main,
    .policy-page .policy-main * { color: #000 !important; background: transparent !important; box-shadow: none !important; }
    .policy-page .in-short { border-inline-start-color: #000; }
    .policy-page .policy-card,
    .policy-page .prose-legal h2 { border-color: #999; }
    .policy-page .policy-body a { text-decoration: underline; }
    .policy-page .policy-body li::marker { color: #000; }
    .policy-page .policy-body h2,
    .policy-page .policy-body h3,
    .policy-page .policy-body .policy-sub { break-after: avoid; }
    .policy-page .policy-body p,
    .policy-page .policy-body li { orphans: 3; widows: 3; }
  }
}

@layer components {
  .page-hero .lede a { color: var(--teal-text); text-decoration-color: color-mix(in srgb, var(--teal) 45%, transparent); }
  .page-hero .lede a:hover { text-decoration-color: var(--teal); }
  .menu-list a[aria-current="page"] { color: var(--teal-text); }

  .prose .cells,
  .prose .checklist { padding-inline-start: 0; list-style: none; }
  .prose .cells { gap: 1px; }
  .prose .checklist { gap: .85rem; }
  .prose .checklist li { line-height: 1.6; }
  .prose .checklist .icon { margin-block-start: .3em; }
  .prose .cell h3, .prose .cell h3 + p { margin-block-start: 0; }
  .prose .commitment p { color: var(--muted); }
  .prose .company-block { font-size: 1rem; line-height: 1.5; }
  .company-block > div:last-child:nth-child(odd) { grid-column: 1 / -1; }

  .page-hero:has(+ .section) { border-block-end-color: transparent; }
  .page-hero + .section { --top: calc(var(--section) * .6); }
  .section-body { max-inline-size: 38rem; }
  @media (min-width: 60rem) {
    .section-body { margin-inline-start: calc((2 * 50% + var(--gutter)) / 3); }
  }
  @media (min-width: 80rem) {
    .section-body { margin-inline-start: calc((2 * 50% + var(--gutter)) / 4); }
  }

  @media (max-width: 29.99rem) {
    .notfound-links { justify-self: stretch; flex-direction: column; align-items: stretch; gap: .25rem; }
    .notfound-links .btn { display: flex; white-space: normal; }
    .notfound-links .text-link { align-self: flex-start; }
  }
}