@font-face { font-family: "Red Hat Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("assets/fonts/red-hat-mono-400.ttf") format("truetype"); }
@font-face { font-family: "Red Hat Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("assets/fonts/red-hat-mono-500.ttf") format("truetype"); }
@font-face { font-family: "Red Hat Mono"; font-style: normal; font-weight: 600; font-display: swap; src: url("assets/fonts/red-hat-mono-600.ttf") format("truetype"); }
@font-face { font-family: "Red Hat Text"; font-style: normal; font-weight: 400; font-display: swap; src: url("assets/fonts/red-hat-text-400.ttf") format("truetype"); }
@font-face { font-family: "Red Hat Text"; font-style: normal; font-weight: 500; font-display: swap; src: url("assets/fonts/red-hat-text-500.ttf") format("truetype"); }
@font-face { font-family: "Red Hat Text"; font-style: normal; font-weight: 600; font-display: swap; src: url("assets/fonts/red-hat-text-600.ttf") format("truetype"); }
@font-face { font-family: "Schibsted Grotesk"; font-style: normal; font-weight: 600; font-display: swap; src: url("assets/fonts/schibsted-grotesk-600.ttf") format("truetype"); }
@font-face { font-family: "Schibsted Grotesk"; font-style: normal; font-weight: 700; font-display: swap; src: url("assets/fonts/schibsted-grotesk-700.ttf") format("truetype"); }
@font-face { font-family: "Spline Sans Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("assets/fonts/spline-sans-mono-500.ttf") format("truetype"); }
@font-face { font-family: "Spline Sans Mono"; font-style: normal; font-weight: 600; font-display: swap; src: url("assets/fonts/spline-sans-mono-600.ttf") format("truetype"); }

:root {
  --u: calc(100vw / 1920);
  --paper: #001F47;
  --chrome: #0F1F4A;
  --surface: #022957;
  --surface-strong: #052F60;
  --rule: #155E96;
  --rule-soft: #174777;
  --ink: #F4F7FF;
  --muted: #B9CAE4;
  --blue: #3A86FF;
  --cyan: #24E7D0;
  --orange: #FB5607;
  --bar-track: #173E69;
  --rule-panel-width: max(1px, calc(2.3 * var(--u)));
  --rule-panel-colour: #013B70;
  --rule-card-width: max(1px, calc(2.3 * var(--u)));
  --rule-card-colour: #013068;
  --rule-input-width: max(1px, calc(2.3 * var(--u)));
  --rule-input-colour: #015196;
  --rule-row-width: max(1px, calc(2.3 * var(--u)));
  --rule-row-colour: #01366B;
  --rule-table-width: max(1px, calc(2.3 * var(--u)));
  --rule-table-colour: #003B78;
  --rule-divider-width: max(1px, calc(1.1 * var(--u)));
  --rule-divider-colour: #255D92;
  --motion-fast: 140ms;
  --motion-base: 320ms;
  --motion-long: 640ms;
  --motion-ease: cubic-bezier(.16, 1, .3, 1);
}

* { box-sizing: border-box; }
html { min-width: 0; background: var(--paper); color-scheme: dark; }
body { margin: 0; min-width: 0; min-height: 100vh; overflow-x: hidden; background: var(--paper); color: var(--ink); font-family: "Red Hat Text", Arial, sans-serif; font-size: max(12px, calc(17 * var(--u))); }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { color: inherit; font: inherit; }
input, textarea { background: transparent; }
select { background-color: var(--paper); }
button { appearance: none; background: transparent; border: 0; padding: 0; cursor: pointer; }
.ico-copy { width: 1em; height: 1em; vertical-align: -.15em; fill: none; stroke: currentColor; stroke-width: 1.5; }

/* The single shared route frame. */
.page-frame { width: calc(1898 * var(--u)); min-height: calc(1080 * var(--u) - 174 * var(--u)); margin-left: calc(16 * var(--u)); margin-right: calc(6 * var(--u)); padding: 0; background: var(--paper); position: relative; transform-origin: left center; }
.page-rail { align-self: stretch; min-height: 100%; }

/* Shared border vocabulary; route files use classes only. */
.rule-panel { border: var(--rule-panel-width) solid var(--rule-panel-colour); }

.rule-panel-strong { border-color: var(--rule); }
.rule-card { border: var(--rule-card-width) solid var(--rule-card-colour); }
.rule-card-blue { border-color: var(--blue); }
.rule-card-orange { border-color: var(--orange); }
.rule-card-cyan { border-color: var(--cyan); }
.rule-input { border: var(--rule-input-width) solid var(--rule-input-colour); box-sizing: border-box; padding: calc(12 * var(--u)) calc(16 * var(--u)); }
.rule-row { border: var(--rule-row-width) solid var(--rule-row-colour); }
.rule-table { border: var(--rule-table-width) solid var(--rule-table-colour); }

.rule-table-strong { border-color: var(--rule); }
.rule-divider-x { border-top: var(--rule-divider-width) solid var(--rule-divider-colour); }
.rule-divider-y { border-left: var(--rule-divider-width) solid var(--rule-divider-colour); }
.rule-none { border: 0; }
.rule-shared-top { border-top-width: 0; }
.rule-shared-left { border-left-width: 0; }
.rule-shared-bottom { border-bottom-width: 0; }
.rule-shared-right { border-right-width: 0; }

/* Named pre-send continuity repairs, kept in the shared rule vocabulary. */
.home-rail,
.home-hero,
.home-table,
.home-card,
.exit .composer,
.exit .preview,
.exit .evidence,
.exit .receipt,
.exit .route-map,
.exit .method,
.c-asset,
.signal-board { border-color: var(--rule); }

.signal-board .siren-row[data-siren-rule="liquid"] { border-bottom-width: var(--rule-row-width); }

.ledger-list-panel { height: calc(512 * var(--u)); }

/* Exact supplied chrome geometry, scaled from its 1920 design plate. */
[data-chrome="nav"] { width: 100%; height: calc(88 * var(--u)); display: flex; align-items: center; padding: 0 calc(16 * var(--u)); background: var(--chrome); border: max(1px, calc(1 * var(--u))) solid #174777; border-bottom-color: #28659b; font-family: "Red Hat Text", Arial, sans-serif; position: relative; z-index: 50; }
[data-chrome="nav"] .brand { height: calc(87 * var(--u)); width: calc(296 * var(--u)); display: flex; align-items: center; gap: calc(14 * var(--u)); border-right: max(1px, calc(1 * var(--u))) solid #174777; padding: 0 calc(14 * var(--u)); flex: 0 0 auto; }
[data-chrome="nav"] .brand img { width: calc(47 * var(--u)); height: calc(47 * var(--u)); object-fit: contain; }
[data-chrome="nav"] .brand b { font-family: "Schibsted Grotesk", Arial, sans-serif; font-size: calc(25 * var(--u)); letter-spacing: calc(5 * var(--u)); }
[data-chrome="nav"] .links { height: 100%; display: flex; align-items: center; gap: calc(4 * var(--u)); }
[data-chrome="nav"] .route { position: relative; height: 100%; display: grid; place-items: center; padding: 0 calc(22 * var(--u)); font-size: max(12px, calc(16 * var(--u))); white-space: nowrap; color: #d5e2f6; }
[data-chrome="nav"] .route::after { content: ""; position: absolute; left: calc(20 * var(--u)); right: calc(20 * var(--u)); bottom: calc(11 * var(--u)); height: max(1px, calc(3 * var(--u))); background: transparent; transform: scaleX(0); transform-origin: left; transition: transform var(--motion-base) var(--motion-ease), background-color var(--motion-fast) var(--motion-ease); }
[data-chrome="nav"] .route.is-active { color: #fff; font-weight: 600; }
[data-chrome="nav"] .route.is-active::after { background: var(--orange); transform: scaleX(1); }
[data-chrome="nav"] .spacer { flex: 1; }
[data-chrome="nav"] .block { font-family: "Red Hat Mono", monospace; font-size: max(12px, calc(14 * var(--u))); white-space: nowrap; color: #d5e2f6; border-right: max(1px, calc(1 * var(--u))) solid #28659b; padding-right: calc(20 * var(--u)); }
[data-chrome="nav"] .block b { color: var(--blue); font-weight: 500; }
[data-chrome="nav"] .actions { display: flex; align-items: center; gap: calc(12 * var(--u)); margin-left: calc(18 * var(--u)); }
[data-chrome="nav"] .social { font-size: max(12px, calc(15 * var(--u))); padding: calc(10 * var(--u)) calc(8 * var(--u)); }
.menu-toggle { display: none; }

[data-chrome="footer"] { width: 100%; min-height: calc(86 * var(--u)); display: grid; grid-template-columns: calc(255 * var(--u)) 1fr auto; align-items: center; padding: 0 calc(30 * var(--u)); background: var(--chrome); border: max(1px, calc(1 * var(--u))) solid #174777; border-top-color: #28659b; font-family: "Red Hat Text", Arial, sans-serif; font-size: max(12px, calc(14 * var(--u))); }
[data-chrome="footer"] .brand { height: calc(58 * var(--u)); display: flex; align-items: center; gap: calc(12 * var(--u)); border-right: max(1px, calc(1 * var(--u))) solid #28659b; }
[data-chrome="footer"] .brand img { width: calc(40 * var(--u)); height: calc(40 * var(--u)); object-fit: contain; }
[data-chrome="footer"] .brand b { font-family: "Schibsted Grotesk", Arial, sans-serif; font-size: calc(20 * var(--u)); letter-spacing: calc(4 * var(--u)); }
[data-chrome="footer"] .voice { padding: 0 calc(24 * var(--u)); }
[data-chrome="footer"] .actions { min-height: calc(58 * var(--u)); display: flex; align-items: center; gap: calc(18 * var(--u)); border-left: max(1px, calc(1 * var(--u))) solid #28659b; padding-left: calc(22 * var(--u)); }
[data-chrome="footer"] .mono { font-family: "Red Hat Mono", monospace; }
[data-chrome="footer"] .ca { border: max(1px, calc(1 * var(--u))) solid #7ba7d1; border-radius: calc(6 * var(--u)); padding: calc(11 * var(--u)) calc(16 * var(--u)); white-space: nowrap; }
.social { cursor: pointer; transition: opacity var(--motion-fast) var(--motion-ease), transform var(--motion-fast) var(--motion-ease); }
.social:hover { transform: translateX(calc(1 * var(--u))); }
[data-chrome="footer"] .ca[hidden] { display: none; }
.social.is-disabled { cursor: default; opacity: .48; pointer-events: none; }

/* Project motion helpers. */
[data-motion="inspect"] { transform-origin: left center; }
[data-motion="inspect"]:not(.is-examined) { transform: scaleX(.99); }
[data-motion="inspect"].is-examined { transform: scaleX(1); transition: transform var(--motion-base) var(--motion-ease); }
[data-motion="seal"]:not(.is-examined) { transform: scale(1.008); }
[data-motion="seal"].is-examined { transform: scale(1); transition: transform var(--motion-base) var(--motion-ease); }
[data-motion="grow"] { transform-origin: left center; }
[data-motion="grow"]:not(.is-examined) { transform: scaleX(0); }
[data-motion="grow"].is-examined { transform: scaleX(1); transition: transform var(--motion-long) var(--motion-ease); }
.examiner-action { transition: transform var(--motion-fast) var(--motion-ease), opacity var(--motion-fast) var(--motion-ease); }
.examiner-action:hover { transform: scale(.985); }
.examiner-count, .examiner-live-tick { display: inline-block; transition: transform var(--motion-fast) var(--motion-ease), opacity var(--motion-fast) var(--motion-ease); }
.examiner-count.is-cash-counting { opacity: .76; transform: translateY(-.08em); }
.examiner-live-tick.is-sealing { opacity: .76; transform: scale(1.035); }

@media (max-width: 1023px) {
  :root { --u: 1px; }
  body { font-size: 15px; }
  [data-chrome="nav"] { height: 72px; padding: 0 14px; }
  [data-chrome="nav"] .brand { width: auto; height: 71px; gap: 10px; padding: 0 12px 0 0; border-right: 0; }
  [data-chrome="nav"] .brand img { width: 40px; height: 40px; }
  [data-chrome="nav"] .brand b { font-size: 20px; letter-spacing: 3px; }
  .menu-toggle { width: 46px; height: 42px; margin-left: auto; display: grid; place-items: center; background: transparent; border: max(1px, 1px) solid #28659b; border-radius: 4px; color: var(--ink); cursor: pointer; }
  .menu-toggle span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .menu-toggle i, .menu-toggle i::before, .menu-toggle i::after { width: 20px; height: 2px; display: block; background: currentColor; content: ""; transition: transform var(--motion-fast) var(--motion-ease); }
  .menu-toggle i::before { transform: translateY(-6px); }
  .menu-toggle i::after { transform: translateY(4px); }
  .menu-toggle[aria-expanded="true"] i { background: transparent; }
  .menu-toggle[aria-expanded="true"] i::before { transform: translateY(0) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] i::after { transform: translateY(-2px) rotate(-45deg); }
  [data-chrome="nav"] .links { position: absolute; top: 71px; left: 0; right: 0; height: auto; display: none; padding: 8px 14px 14px; background: var(--chrome); border-bottom: max(1px, 1px) solid #28659b; }
  [data-chrome="nav"].menu-open .links { display: grid; grid-template-columns: 1fr 1fr; }
  [data-chrome="nav"] .route { min-height: 48px; padding: 0 14px; justify-items: start; font-size: 15px; }
  [data-chrome="nav"] .route::after { left: 14px; right: 14px; bottom: 5px; }
  [data-chrome="nav"] .spacer, [data-chrome="nav"] .block { display: none; }
  [data-chrome="nav"] .actions { margin-left: 8px; gap: 2px; }
  [data-chrome="nav"] .social { font-size: 13px; padding: 8px 5px; }
  .page-frame { width: calc(100% - 24px); min-height: calc(100vh - 72px); margin: 0 12px; }
  [data-chrome="footer"] { min-height: 176px; grid-template-columns: 1fr; gap: 12px; padding: 18px 16px; font-size: 13px; }
  [data-chrome="footer"] .brand { height: 48px; border-right: 0; }
  [data-chrome="footer"] .brand img { width: 40px; height: 40px; }
  [data-chrome="footer"] .voice { padding: 0; line-height: 1.4; }
  [data-chrome="footer"] .actions { min-height: 0; flex-wrap: wrap; gap: 12px; padding: 12px 0 0; border-left: 0; border-top: max(1px, 1px) solid #28659b; }
  [data-chrome="footer"] .ca { border-radius: 6px; padding: 8px 10px; }
  .rule-input { padding: 12px 14px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
  [data-motion]:not(.is-examined) { opacity: 1 !important; transform: none !important; }
}
