@view-transition { navigation: auto; }

  html, body { margin: 0; padding: 0; background: #1B2BB0; }
  #loaderRef { display: none !important; }
  main[tabindex="-1"] { scroll-margin-top: 72px; }

  .skip-link {
    position: fixed;
    top: 8px;
    left: 16px;
    z-index: 100;
    min-height: 44px;
    padding: 10px 14px;
    background: #F7B33F;
    color: #1B2BB0;
    font: 500 var(--wb-font-12) "IBM Plex Mono", monospace;
    letter-spacing: 0.08em;
    transform: translateY(calc(-100% - 16px));
  }
  .skip-link:hover,
  .skip-link:focus-visible {
    color: #1B2BB0;
    transform: translateY(0);
  }

  [data-nav-toggle] {
    display: none;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: 88px;
    min-height: 44px;
    border: 1px solid rgba(242,237,225,0.55);
    padding: 8px 12px;
    font: 500 var(--wb-font-11) "IBM Plex Mono", monospace;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    cursor: pointer;
  }
  [data-nav-toggle-mark] {
    display: inline-block;
    font-size: var(--wb-font-18);
    line-height: 1;
    transition: transform 180ms ease;
  }
  [data-navbar][data-nav-open] [data-nav-toggle-mark] { transform: rotate(45deg); }
  [data-nav-panel] { display: contents; }

  [data-sim-controls] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
  }
  [data-sim-controls] button {
    min-width: 0;
    min-height: 48px;
    border: 1px solid currentColor;
    padding: 10px 12px;
    font: 500 var(--wb-font-10)/1.5 "IBM Plex Mono", monospace;
    letter-spacing: 0.08em;
    overflow-wrap: anywhere;
    cursor: pointer;
  }
  [data-balance-status] {
    margin: 10px 0 0;
    font: 400 var(--wb-font-11)/1.6 "IBM Plex Mono", monospace;
    color: #414B8E;
  }

  /* ═══ TWO SURFACES ═══════════════════════════════════════════════
     Rule, held on every route: a PRINTED RECORD is cream. The
     instrument, the argument and the offer are blue. Cream carries
     two densities so the evidence itself has a loud and a quiet. */
  [data-paper] { background: #E8E0CE; color: #1B2BB0; }
  [data-paper="bright"] { background: #F2EDE1; }
  [data-paper], [data-paper] * { border-color: rgba(27,43,176,0.20) !important; }
  /* The authored source used serialised inline styles, so a colour value can never be matched
     by [style*=…]. Anything that must invert on cream carries a real hook. */
  [data-paper] [data-chip] { background: #1B2BB0 !important; color: #F2EDE1 !important; }
  [data-paper] [data-rule] { background: rgba(27,43,176,0.45) !important; }

  /* ═══ INK ON THE BLUE GROUND ═════════════════════════════════════
     #F2EDE1 knocked back by an inline opacity lands between 3.3 and 4.3
     against #1B2BB0 — under AA at every size used here. #A8B0E8 is the
     same cream pulled toward the ground and measures 5.01:1 at full
     strength, so a quiet label is quiet by colour, not by fading out. */
  [style*="opacity: 0.5"]:not([data-paper] *):not([data-rail]),
  [style*="opacity: 0.55"]:not([data-paper] *):not([data-rail]),
  [style*="opacity: 0.6"]:not([data-paper] *):not([data-rail]),
  [style*="opacity: 0.62"]:not([data-paper] *):not([data-rail]),
  [style*="opacity: 0.65"]:not([data-paper] *):not([data-rail]),
  [style*="opacity: 0.7"]:not([data-paper] *):not([data-rail]),
  [style*="opacity: 0.75"]:not([data-paper] *):not([data-rail]) { opacity: 1 !important; color: #A8B0E8 !important; }
  [style*="opacity: 0.85"]:not([data-paper] *),
  [style*="opacity: 0.9"]:not([data-paper] *) { opacity: 1 !important; color: #DDE2F7 !important; }
  /* the vertical folio labels sit on the same ground */
  [data-folio] [style*="writing-mode"]:not([data-paper] *) { color: #A8B0E8 !important; }

  /* ═══ INK AND GREYS ══════════════════════════════════════════════
     On paper, opacity guesses are replaced by two named inks so a
     label has a hex and a reason instead of a transparency.
     #525A92 — tertiary: blue knocked back into the stock. 4.94:1 on
     the QUIET cream #E8E0CE, which is the harder of the two grounds.
     #414B8E — secondary: the same ink one step up.       6.4:1.
     No pure black, no pure white anywhere on the site. */
  [data-paper] [style*="opacity: 0.5"], [data-paper] [style*="opacity: 0.55"], [data-paper] [style*="opacity: 0.6"] { opacity: 1 !important; color: #525A92 !important; }
  [data-paper] [style*="opacity: 0.65"], [data-paper] [style*="opacity: 0.7"], [data-paper] [style*="opacity: 0.75"], [data-paper] [style*="opacity: 0.85"], [data-paper] [style*="opacity: 0.9"] { opacity: 1 !important; color: #414B8E !important; }
  /* a chip that inverted to blue keeps cream inside it */
  [data-paper] [data-chip] * { color: #F2EDE1 !important; }

  /* ═══ THE ACCENT, RATIONED ═══════════════════════════════════════
     One amber registration ink, two densities for two stocks.
     Three referents only: a measured result, the fixed line on a
     figure, the primary action. It never touches a failed figure. */
  [data-measured] { color: #F7B33F !important; }
  /* out-specifies the chip-restore rule above: a measured figure sitting on an
     inverted blue chip is still amber, never plain cream */
  [data-paper] [data-chip] [data-measured], [data-paper] [data-chip][data-measured] { color: #F7B33F !important; }
  [data-measured-p] { color: #8A3F08 !important; }
  [data-act] { border-color: #F7B33F !important; color: #F7B33F !important; background-image: linear-gradient(#F7B33F, #F7B33F) !important; }

  /* ═══ THE LAST MILLIMETRE ════════════════════════════════════════
     Type is rendered, not just set: kerning on, optical sizing on,
     and the stems thinned the way ink is thinned on a dark stock. */
  body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-kerning: normal; font-optical-sizing: auto; }
  [data-paper] { -webkit-font-smoothing: auto; }   /* ink on paper is not thinned */

  /* Every tap target answers immediately instead of waiting 300ms for a
     double-tap that is never coming. */
  [onclick], [data-navitem], [data-act], a, button { touch-action: manipulation; }
  [data-navitem], [data-navlogo] { -webkit-tap-highlight-color: transparent; user-select: none; }

  /* Sections are isolated so a repaint in one never costs a repaint in the
     rest — this is what keeps the scroll honest on a phone. */
  [data-section] { contain: layout paint style; }
  canvas { contain: strict; }

  /* A caret the colour of the ink, not the browser's blue. */
  * { caret-color: #F7B33F; }
  [data-paper] * { caret-color: #8A3F08; }

  /* The active nav item carries a mark, not just a weight change. */
  [data-navitem] { position: relative; }
  [data-navitem][style*="opacity: 1"]::before { content: ""; position: absolute; left: -9px; top: 50%; width: 3px; height: 3px; margin-top: -1.5px; background: #F7B33F; border-radius: 50%; }
  [role="contentinfo"] a[href^="mailto:support"],
  [role="contentinfo"] a[href="/privacy.html"] {
    display: flex;
    width: fit-content;
  }

  /* Figures and receipts never break across a fold. */
  [data-chip], [data-paper] ol li { break-inside: avoid; }

  /* ═══ GRAIN · generated, ~2.5% ══════════════════════════════════ */
  [data-grain] { position: fixed; inset: 0; z-index: 70; pointer-events: none; mix-blend-mode: multiply; opacity: 0.5;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='170'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.88' numOctaves='4'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='170' height='170' filter='url(%23g)' opacity='0.05'/%3E%3C/svg%3E"); }
  html { -webkit-text-size-adjust: 100%; }
  body { -webkit-tap-highlight-color: rgba(242,237,225,0.2); }
  canvas { touch-action: pan-y; }
  * { box-sizing: border-box; }
  a { color: #F2EDE1; text-decoration: none; }
  a:hover { color: #F2EDE1; }
  ::selection { background: #F2EDE1; color: #1B2BB0; }
  @keyframes wbRule { from { transform: scaleY(0); } to { transform: scaleY(1); } }
  @keyframes wbRise { from { transform: translateY(105%); } to { transform: translateY(0); } }
  @keyframes wbTrim { from { opacity: 0; transform: scale(0.4); } to { opacity: 1; transform: scale(1); } }
  @keyframes wbLift { from { transform: translateY(0); } to { transform: translateY(-101%); } }
  @keyframes wbCurtainIn { from { transform: translateX(-101%); } to { transform: translateX(0); } }
  @keyframes wbCurtainOut { from { transform: translateX(0); } to { transform: translateX(101%); } }
  @keyframes wbTick { 0%, 100% { opacity: 0.25; } 50% { opacity: 1; } }
  @keyframes wbMarqA { from { transform: translateX(0); } to { transform: translateX(-50%); } }
  @keyframes wbMarqB { from { transform: translateX(-50%); } to { transform: translateX(0); } }
  @keyframes wbCaret { 0%, 45% { opacity: 1; } 46%, 100% { opacity: 0; } }
  :root {
    --gx: clamp(20px, 4.4vw, 88px);
    --gx2: clamp(26px, 5.2vw, 104px);
    --folio: 108px;
    --wb-font-9: 9px;
    --wb-font-9-5: 9.5px;
    --wb-font-10: 10px;
    --wb-font-10-5: 10.5px;
    --wb-font-11: 11px;
    --wb-font-11-5: 11.5px;
    --wb-font-12: 12px;
    --wb-font-12-5: 12.5px;
    --wb-font-13: 13px;
    --wb-font-13-5: 13.5px;
    --wb-font-15: 15px;
    --wb-font-16-5: 16.5px;
    --wb-font-17: 17px;
    --wb-font-18: 18px;
    --wb-font-19: 19px;
    --wb-font-22: 22px;
    --wb-font-26: 26px;
    --wb-font-30: 30px;
    --wb-font-40: 40px;
    --wb-font-54: 54px;
    --wb-font-64: 64px;
    --wb-font-84: 84px;
    --wb-font-104: 104px;
    --wb-font-116: 116px;
    --wb-font-action-11: 11px;
    --wb-font-action-11-5: 11.5px;
  }

  /* ═══ DISPLAY SETTING ════════════════════════════════════════════
     An annual report sets headlines in sentence case at a measure.
     A 900-weight uppercase slab running the full bleed is a banner. */
  [data-section] [style*="font-weight: 900"] { font-weight: 700 !important; text-transform: none !important; letter-spacing: -0.03em !important; }
  [data-section] h1[style*="font-weight: 600"] { text-transform: none !important; }
  [data-folio] { position: relative; }
  [data-measurewell] { min-width: 0; overflow-wrap: anywhere; }
  /* The measurements card is a narrow column beside the copy on a desktop, which is what the
     42% cap buys. A phone has no beside: 42% of a phone column is about 110px, so the card's
     own title broke over eleven lines and the table inside it was unreadable. The cap is a
     desktop idea and now says so. */
  [data-measurecard] { max-width: min(42%, 360px); }
  @media (max-width: 900px) { [data-measurecard] { max-width: none; } }
  [data-measurewell] * { min-width: 0; }

  /* ══════════════════════════════════════════════════════════════════
     MICRO-CRAFT — the last pass. Every rule below maps to something
     the product actually does. Nothing here is decoration.
     ══════════════════════════════════════════════════════════════════ */

  /* 1 · NUMERALS. One rule for the whole page, not per card: every figure
     is tabular and lines up on the decimal across sections, and the zero
     is slashed so 0 and O are never confused in a measurement. */
  body { font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1, "zero" 1, "ss01" 1; }
  [style*="IBM Plex Mono"] { font-variant-numeric: tabular-nums slashed-zero; }

  /* 2 · A percentage, a euro and a day-count are set DIFFERENTLY.
     The % is a unit, not a digit — it is knocked back and raised so the
     number keeps the baseline to itself. */
  [data-unit] { font-size: 0.54em; letter-spacing: 0.02em; vertical-align: 0.42em; padding-left: 0.06em; }
  [data-euro] { font-size: 0.62em; vertical-align: 0.24em; padding-right: 0.02em; }

  /* 3 · OPTICAL MARGIN. A quotation mark is not ink the eye counts, so it
     hangs outside the measure and the text edge stays true.

     One mechanism only. Pairing text-indent with hanging-punctuation was meant as a fallback,
     but they are not exclusive: Safari honours both and the hang doubled to a full 0.84em,
     which on a phone put the opening quote flat against the left edge of the screen with
     nothing left to give — so the glyph fell outside the clipping ancestor and Safari readers
     saw quotes with the opening mark shaved off. Chromium ignores hanging-punctuation
     entirely, so every gate here rendered the correct 0.42em and stayed green. text-indent is
     the one every engine implements, so it is the one that stays. */
  [data-section] ol li > span:nth-child(2), [data-quote] { text-indent: -0.42em; }
  h1, [data-section] [style*="font-weight: 700"], [data-section] [style*="font-weight: 600"] { text-wrap: balance; }
  [data-section] p { text-wrap: pretty; }

  /* 4 · HAIRLINES. A printed rule is thinner than a screen border. On a
     retina panel the section rules drop to a true half-pixel. */
  @media (min-resolution: 2dppx) {
    [data-section] { border-bottom-width: 0.5px; }
    [data-section] [style*="border-top: 1px solid"] { border-top-width: 0.5px; }
    [data-section] [style*="border-bottom: 1px solid"] { border-bottom-width: 0.5px; }
  }

  /* 5 · TRIM MARKS. Cream sections are sheets, so they carry the printer's
     crop marks at the corners — the same marks that say where a sheet is
     cut. It is the whole product argument in two hairlines: this is an
     addition to a page, and it comes off along a known line. */
  [data-paper] { position: relative; }
  [data-paper]::before, [data-paper]::after {
    content: ""; position: absolute; width: 15px; height: 15px; pointer-events: none;
    border-color: rgba(27,43,176,0.42) !important;
  }
  [data-paper]::before { top: 13px; left: 13px; border-left: 1px solid; border-top: 1px solid; }
  [data-paper]::after { bottom: 13px; right: 13px; border-right: 1px solid; border-bottom: 1px solid; }

  /* 6 · INK SPREAD. A hover does not glow; the edge takes ink and thickens
     by half a pixel, the way a line soaks into card stock. */
  [data-navitem], [data-inkhover] { transition: color 200ms cubic-bezier(0.33,1,0.68,1), box-shadow 220ms cubic-bezier(0.33,1,0.68,1), letter-spacing 260ms cubic-bezier(0.33,1,0.68,1); }
  [data-navitem]:hover, [data-inkhover]:hover { box-shadow: inset 0 -1.5px 0 currentColor; }
  [data-paper] ol li:not([data-chip]) { transition: background-color 220ms cubic-bezier(0.33,1,0.68,1), box-shadow 220ms cubic-bezier(0.33,1,0.68,1); }
  [data-paper] ol li:not([data-chip]):hover { background-color: rgba(27,43,176,0.045); box-shadow: inset 2px 0 0 #8A3F08; }

  /* 7 · THE RULE DRAWS. A measurement is made left to right, so a section
     rule is plotted rather than switched on. Static where unsupported. */
  @supports (animation-timeline: view()) {
    @media (prefers-reduced-motion: no-preference) {
      /* A rule is plotted left to right, in the ink of the stock it is on.
         Cream sheets keep their crop marks, so a section that IS a sheet does
         not plot; a section sitting INSIDE one plots in blue, not cream. */
      [data-section]:not([data-paper]) { position: relative; border-bottom-color: transparent !important; }
      [data-section]:not([data-paper])::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: rgba(242,237,225,0.3); transform: scaleX(0); transform-origin: left; animation: wbPlot linear both; animation-timeline: view(); animation-range: entry 92% cover 62%; }
      [data-paper] [data-section]:not([data-paper])::after,
      [data-onpaper] [data-section]:not([data-paper])::after { background: rgba(27,43,176,0.22); }
      @keyframes wbPlot { to { transform: scaleX(1); } }
    }
  }

  /* 8 · SELECTION obeys the surface it is on. */
  [data-paper] ::selection { background: #1B2BB0; color: #F2EDE1; }

  /* 9 · FOCUS is amber, offset, and never a browser default. */
  :focus-visible { outline: 2px solid #F7B33F; outline-offset: 3px; }
  [data-paper] :focus-visible { outline-color: #8A3F08; }

  /* 10 · CURSOR. The system cursor everywhere; a crosshair only where there
     is data to read off a surface. */
  canvas[data-chart], canvas[data-sim], [data-paper] ol { cursor: crosshair; }

  /* 11 · PRINT. An annual report prints. Blue ink is not printable at this
     coverage, so the whole document falls back to ink on stock. */
  @media print {
    html, body { background: #F2EDE1 !important; }
    [data-section], [data-paper] { background: #F2EDE1 !important; color: #1B2BB0 !important; break-inside: avoid; page-break-inside: avoid; }
    [data-section] { border-bottom: 0.5px solid #1B2BB0 !important; }
    [data-grain], [data-hud], [data-cross], [data-folio] { display: none !important; }
    [data-measured], [data-measured-p] { color: #1B2BB0 !important; text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 2px; }
  }

  @media (max-width: 900px) {
    :root {
      --gx: 18px;
      --gx2: 18px;
      --folio: 0px;
      --wb-font-9: 12px;
      --wb-font-9-5: 12px;
      --wb-font-10: 12.25px;
      --wb-font-10-5: 12.5px;
      --wb-font-11: 12.75px;
      --wb-font-11-5: 13px;
      --wb-font-12: 13.25px;
      --wb-font-12-5: 13.5px;
      --wb-font-13: 14px;
      --wb-font-13-5: 14.5px;
      --wb-font-action-11: 12.75px;
      --wb-font-action-11-5: 13px;
    }
    [data-folio] { display: none !important; }
    main > [style*="grid-template-columns: 56px minmax"] {
      grid-template-columns: minmax(0, 1fr) !important;
    }
    [data-paper]::before, [data-paper]::after { width: 9px; height: 9px; top: 8px; left: 8px; }
    [data-paper]::after { top: auto; left: auto; bottom: 8px; right: 8px; }
    [data-measurewell] { border-left: 0 !important; border-top: 1px solid rgba(242,237,225,0.16) !important; padding: 34px 18px 44px !important; gap: 26px !important; }
    /* ── MOBILE IS COMPOSED, NOT SQUEEZED ──────────────────────────
       Three sections are laid out differently at 390, not resized. */
    /* 1 · the hero measurement runs as a horizontal strip, not a well */
    [data-measurewell] > div:nth-child(2) { display: flex !important; align-items: flex-end; gap: 16px; }
    [data-measurewell] > div:nth-child(2) > div { flex: 1 1 auto; border: 0 !important; padding: 0 !important; display: block !important; }
    [data-measurewell] > div:nth-child(2) > div > span { width: auto !important; display: block; }
    [data-measurewell] > div:nth-child(2) > div:nth-child(2) { flex: 0 0 auto; padding: 0 0 10px !important; }
    [data-measurewell] > div:nth-child(2) > div:nth-child(2) span { font-size: var(--wb-font-9) !important; letter-spacing: 0.14em !important; }
    /* 2 · a return note stacks: quote first, index and tag on one line under it */
    [data-section="Their own words"] ol li { grid-template-columns: 1fr auto !important; gap: 6px 14px !important; }
    [data-section="Their own words"] ol li > span:nth-child(1) { order: 2; }
    [data-section="Their own words"] ol li > span:nth-child(2) { order: 1; grid-column: 1 / -1; font-size: var(--wb-font-19) !important; }
    [data-section="Their own words"] ol li > span:nth-child(3) { order: 3; text-align: right; }
    /* 3 · the figure leads and the argument follows it */
    [data-section="De Meetlijn"] > div:nth-child(1) { order: 2; padding-top: 34px !important; }
    [data-section="De Meetlijn"] > div:nth-child(2) { order: 1; border-left: 0 !important; border-bottom: 1px solid rgba(27,43,176,0.2) !important; padding-top: 60px !important; }
    [data-section="De Meetlijn"] { display: flex !important; flex-direction: column; }
    [data-section] [style*="grid-template-columns"]:not([data-keep-grid]),
    [data-section][style*="grid-template-columns"],
    [style*="grid-template-columns: repeat(12"]:not([data-keep-grid]) { grid-template-columns: 1fr !important; }
    [data-section] * { min-width: 0; }
    [style*="grid-column"] { grid-column: 1 / -1 !important; }
    [style*="position: sticky"] { position: static !important; }
    [style*="writing-mode"] { display: none !important; }
    [style*="border-left: 1px solid"] { border-left: 0 !important; }
    canvas[data-sim] { height: 330px !important; }
    canvas[data-chart] { height: 300px !important; }
    [data-navbar] { display: flex !important; justify-content: space-between !important; align-items: center !important; padding: 0 16px !important; height: 60px !important; gap: 10px !important; }
    [data-navlinks] { gap: 15px !important; font-size: var(--wb-font-11) !important; letter-spacing: 0.08em !important; overflow-x: auto !important; }
    [data-navright] { justify-content: flex-end !important; gap: 10px !important; }
    [data-navright] > span:first-child { display: none !important; }
    [data-loadmark] { font-size: 12vw !important; }
    [data-curtainlabel] { font-size: 13vw !important; }
    [data-hud] { display: none !important; }
  }
  @media (min-width: 901px) and (max-width: 1100px) {
    [role="contentinfo"] > * {
      min-width: 0;
      padding-left: 20px !important;
      padding-right: 20px !important;
    }
    [role="contentinfo"] [data-i] { overflow-wrap: anywhere; }
  }
  @media (max-width: 900px) {
    [data-receipt] { border-left: 1px solid #F2EDE1 !important; padding-left: 16px !important; padding-right: 16px !important; }
  }
  @media (max-width: 560px) {
    :root {
      --wb-font-9: 12px;
      --wb-font-9-5: 12px;
      --wb-font-10: 12.5px;
      --wb-font-10-5: 13px;
      --wb-font-11: 14px;
      --wb-font-11-5: 14.5px;
      --wb-font-12: 15px;
      --wb-font-12-5: 15.5px;
      --wb-font-13: 16px;
      --wb-font-13-5: 16.5px;
      --wb-font-15: 18px;
      --wb-font-16-5: 19.5px;
      --wb-font-17: 20px;
      --wb-font-18: 21px;
      --wb-font-19: 22px;
      --wb-font-22: 25px;
      --wb-font-26: 29px;
      --wb-font-30: 33px;
      --wb-font-40: 43px;
      --wb-font-54: 57px;
      --wb-font-64: 67px;
      --wb-font-84: 87px;
      --wb-font-104: 107px;
      --wb-font-116: 119px;
      --wb-font-action-11: 16px;
      --wb-font-action-11-5: 16px;
    }
    [data-measurewell] > div:nth-child(2) {
      display: grid !important;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px 16px;
    }
    [data-measurewell] > div:nth-child(2) > div:nth-child(1),
    [data-measurewell] > div:nth-child(2) > div:nth-child(3) {
      display: flex !important;
      flex-direction: column;
      align-items: flex-start !important;
      gap: 8px !important;
    }
    [data-measurewell] > div:nth-child(2) > div:nth-child(2) {
      grid-column: 1 / -1;
      grid-row: 2;
      justify-self: stretch;
      padding: 4px 0 10px !important;
    }
    [data-section] [data-i] { overflow-wrap: anywhere; }
    [data-nav-toggle] { display: flex !important; margin-left: auto; }
    [data-nav-panel] { display: none !important; }
    [data-navbar][data-nav-open] [data-nav-panel] {
      position: fixed;
      top: 60px;
      left: 0;
      right: 0;
      display: flex !important;
      flex-direction: column;
      max-height: calc(100dvh - 60px);
      overflow-y: auto;
      padding: 10px 16px 18px;
      background: #1B2BB0;
      border-bottom: 1px solid rgba(242,237,225,0.45);
    }
    [data-navlinks] {
      display: flex !important;
      flex-direction: column;
      width: 100%;
      gap: 0 !important;
      overflow: visible !important;
    }
    [data-navitem] {
      width: 100%;
      min-height: 48px;
      padding: 12px 10px 12px 18px !important;
    }
    [data-navright] {
      display: flex !important;
      width: 100%;
      padding-top: 10px;
      border-top: 1px solid rgba(242,237,225,0.25);
    }
    [data-navright] a { width: 100%; justify-content: center; }
    html[data-mobile-nav-open],
    body[data-mobile-nav-open] { overflow: hidden !important; }
    [data-sim-controls] { grid-template-columns: 1fr; }
    [role="contentinfo"] > * {
      min-width: 0;
      white-space: normal !important;
      overflow-wrap: anywhere;
    }
    [role="contentinfo"] > :last-child > span {
      min-width: 0;
      white-space: normal !important;
      overflow-wrap: anywhere;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    [style*="animation"] { animation-duration: 1ms !important; animation-iteration-count: 1 !important; }
    * { transition-duration: 1ms !important; }
  }
  @media (hover: none) {
    [data-cross] { display: none !important; }
  }

[data-hover="1"]:hover,[data-hover="1"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="2"]:hover,[data-hover="2"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="3"]:hover,[data-hover="3"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="4"]:hover,[data-hover="4"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="5"]:hover,[data-hover="5"]:focus-visible{background-size: 100% 100%; color: #1B2BB0; letter-spacing: 0.26em;}
[data-hover="6"]:hover,[data-hover="6"]:focus-visible{background-size: 100% 100%; color: #1B2BB0; letter-spacing: 0.3em;}
[data-hover="7"]:hover,[data-hover="7"]:focus-visible{background-size: 100% 100%; color: #1B2BB0; letter-spacing: 0.26em;}
[data-hover="8"]:hover,[data-hover="8"]:focus-visible{border-color: #F2EDE1; letter-spacing: 0.26em;}
[data-hover="9"]:hover,[data-hover="9"]:focus-visible{border-color: #F2EDE1; letter-spacing: 0.26em;}
[data-hover="10"]:hover,[data-hover="10"]:focus-visible{background-size: 100% 100%; color: #1B2BB0; letter-spacing: 0.28em;}
[data-hover="11"]:hover,[data-hover="11"]:focus-visible{background-size: 100% 100%; color: #1B2BB0; letter-spacing: 0.3em;}
[data-hover="12"]:hover,[data-hover="12"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="13"]:hover,[data-hover="13"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="14"]:hover,[data-hover="14"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="15"]:hover,[data-hover="15"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="16"]:hover,[data-hover="16"]:focus-visible{background-size: 100% 100%; color: #1B2BB0; letter-spacing: 0.26em;}
[data-hover="17"]:hover,[data-hover="17"]:focus-visible{background-size: 100% 100%; color: #1B2BB0; letter-spacing: 0.3em;}
[data-hover="18"]:hover,[data-hover="18"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="19"]:hover,[data-hover="19"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="20"]:hover,[data-hover="20"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="21"]:hover,[data-hover="21"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="22"]:hover,[data-hover="22"]:focus-visible{background-size: 100% 100%; color: #1B2BB0; letter-spacing: 0.26em;}
[data-hover="23"]:hover,[data-hover="23"]:focus-visible{background-size: 100% 100%; color: #1B2BB0; letter-spacing: 0.3em;}
[data-hover="24"]:hover,[data-hover="24"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="25"]:hover,[data-hover="25"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="26"]:hover,[data-hover="26"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="27"]:hover,[data-hover="27"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="28"]:hover,[data-hover="28"]:focus-visible{background-size: 100% 100%; color: #1B2BB0; letter-spacing: 0.26em;}
[data-hover="29"]:hover,[data-hover="29"]:focus-visible{background-size: 100% 100%; color: #F2EDE1; letter-spacing: 0.3em;}
[data-hover="30"]:hover,[data-hover="30"]:focus-visible{background-size: 100% 100%; color: #1B2BB0; letter-spacing: 0.3em;}
[data-hover="31"]:hover,[data-hover="31"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="32"]:hover,[data-hover="32"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="33"]:hover,[data-hover="33"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="34"]:hover,[data-hover="34"]:focus-visible{border-bottom-color: #F2EDE1;}
[data-hover="35"]:hover,[data-hover="35"]:focus-visible{background-size: 100% 100%; color: #1B2BB0; letter-spacing: 0.26em;}
[data-hover="36"]:hover,[data-hover="36"]:focus-visible{background-size: 100% 100%; color: #1B2BB0; letter-spacing: 0.3em;}

button{font:inherit;color:inherit;background-color:transparent}
a,button,select{min-width:44px;min-height:44px}
a{display:inline-flex;align-items:center}
.lang-label{display:flex;flex-direction:column;gap:5px;margin-top:8px;color:#A8B0E8}
.langsel{min-height:44px;min-width:112px;border:1px solid rgba(242,237,225,.45);background:#1B2BB0;color:#F2EDE1;font:400 12px "IBM Plex Mono",monospace;padding:8px}
[data-onpaper] .langsel{background:#F2EDE1;color:#1B2BB0;border-color:rgba(27,43,176,.45)}
::view-transition-old(root){animation:wbCurtainOut 640ms cubic-bezier(.76,0,.24,1) both}
::view-transition-new(root){animation:wbCurtainIn 620ms cubic-bezier(.76,0,.24,1) both}
@media(max-width:900px){body>div>div:last-of-type{grid-template-columns:1fr!important}body>div>div:last-of-type>div{grid-column:1/-1!important;border-left:0!important;border-top:1px solid rgba(242,237,225,.18)}}
@media(max-width:700px){[data-proof-grid]{grid-template-columns:1fr!important}[data-proof-grid]>div{border-right:0!important;border-top:1px solid rgba(242,237,225,.3)}[data-proof-grid]>div:first-child{border-top:0!important}[data-section-i="dc.section.permissions"]>div:first-child{flex-wrap:wrap!important;gap:8px 24px;align-items:flex-start!important}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}[data-reveal],[data-word]{opacity:1!important;transform:none!important;clip-path:none!important;filter:none!important}}
