/* Self-hosted subsets — latin + greek only. Greek coverage verified in cmap. */
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:100 900;font-display:swap;src:url('fonts/inter-tight-var-greek-ext.woff2') format('woff2');unicode-range:U+1F00-1FFF;}@font-face{font-family:'Inter Tight';font-style:normal;font-weight:100 900;font-display:swap;src:url('fonts/inter-tight-var-greek.woff2') format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;}@font-face{font-family:'Inter Tight';font-style:normal;font-weight:100 900;font-display:swap;src:url('fonts/inter-tight-var-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}@font-face{font-family:'Inter Tight';font-style:normal;font-weight:100 900;font-display:swap;src:url('fonts/inter-tight-var-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/plex-mono-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/plex-mono-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}@font-face{font-family:'Manrope';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/manrope-500-greek.woff2') format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/manrope-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:800;font-display:swap;src:url('fonts/manrope-800-greek.woff2') format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:800;font-display:swap;src:url('fonts/manrope-800-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/plex-400-greek.woff2') format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/plex-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/plex-600-greek.woff2') format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/plex-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/mono-500-greek.woff2') format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/mono-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}


/* ==========================================================================
   UTM Portal — «The Gauging Sheet»
   Identity: engineering-drawing linework · the amber UTM point · stamped figures.
   Library surfaces are paper-light (reading, printing); the landing hero commits
   to dock-dusk ink. Contrast of every text pair verified, not eyeballed.
   ========================================================================== */

:root {
  /* ink & paper — cool steel neutrals, chroma toward blue, never warm */
  --ink-900:#0B1220;
  --ink-700:#1E293B;
  --ink-500:#47566B;   /* 7.08:1 on --paper */
  --paper:#F7F9FB;
  --surface:#FFFFFF;
  --line:#D8DFE8;
  --line-strong:#B9C4D2;

  /* signal — one accent, everywhere: CTA, active facet, focus, logo dot, UTM point */
  --amber:#F59E0B;
  --amber-deep:#D97706;
  --amber-ink:#7C4A03;
  --ok:#15803D;
  --danger:#B91C1C;

  /* ink-surface variants (hero band, footer) */
  --on-ink:#E8EEF6;
  --on-ink-muted:#9FB0C6;
  --ink-line:rgba(232,238,246,.16);

  /* type */
  --f-display:'Inter Tight', system-ui, sans-serif;
  --f-body:'Inter Tight', system-ui, sans-serif;
  --f-mono:'IBM Plex Mono','JetBrains Mono', ui-monospace, monospace;

  /* measure & rhythm */
  --w-page:68rem;
  --w-wide:84rem;
  --w-read:70ch;
  --gut:clamp(1rem, 4vw, 2rem);
  --s-1:.5rem; --s-2:.75rem; --s-3:1rem; --s-4:1.5rem;
  --s-5:2rem; --s-6:3rem; --s-7:4.5rem; --s-8:7rem;

  --r-sm:6px; --r-md:10px; --r-lg:14px;

  /* semantic depth — never arbitrary 9999 */
  --z-sticky:100; --z-tray:200; --z-backdrop:300; --z-modal:400; --z-toast:500;

  --nav-h:64px;
  --ease-out:cubic-bezier(.22,1,.36,1);
  --t-fast:150ms; --t-med:240ms;
}

*, *::before, *::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body {
  margin:0;
  background:var(--paper);
  color:var(--ink-700);
  font:400 1rem/1.6 var(--f-body);
  overflow-x:hidden;
}
img, svg, video { max-width:100%; height:auto; display:block; }

h1,h2,h3 { font-family:var(--f-display); color:var(--ink-900); text-wrap:balance; margin:0 0 var(--s-3); }
h1 { font-size:clamp(2.3rem, 5vw, 4.2rem); font-weight:600; line-height:1.06; letter-spacing:-.03em; }
h2 { font-size:clamp(1.6rem, 3.2vw, 2.5rem); font-weight:600; line-height:1.15; letter-spacing:-.02em; }
h3 { font-size:clamp(1.15rem, 2vw, 1.45rem); font-weight:700; line-height:1.25; letter-spacing:-.01em; }
p  { margin:0 0 var(--s-3); text-wrap:pretty; }
a  { color:var(--ink-900); text-underline-offset:3px; text-decoration-thickness:1px; }
a:hover { text-decoration-color:var(--amber); }

/* every figure the trade reads as data is stamped, not typeset */
.num, .mono { font-family:var(--f-mono); font-variant-numeric:tabular-nums; letter-spacing:-.02em; }

:where(a,button,input,select,summary,[tabindex]):focus-visible {
  outline:2px solid var(--amber);
  outline-offset:2px;
  border-radius:var(--r-sm);
}

.wrap { width:min(100% - var(--gut)*2, var(--w-page)); margin-inline:auto; }
.wrap-wide { width:min(100% - var(--gut)*2, var(--w-wide)); margin-inline:auto; }
.skip {
  position:absolute; left:-9999px; top:0; background:var(--amber); color:var(--ink-900);
  padding:.7rem 1rem; font-weight:700; z-index:var(--z-toast);
}
.skip:focus { left:.5rem; top:.5rem; }

/* ---------- buttons: exactly one filled amber per view ---------- */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  min-height:48px; padding:.75rem 1.25rem;
  font:600 1rem/1 var(--f-body); text-decoration:none; cursor:pointer;
  border-radius:var(--r-md); border:1px solid transparent;
  transition:background var(--t-fast) var(--ease-out), color var(--t-fast) var(--ease-out),
             border-color var(--t-fast) var(--ease-out);
}
.btn-amber { background:var(--amber); color:var(--ink-900); font-weight:700; }
.btn-amber:hover { background:var(--amber-deep); }
.btn-line { border-color:var(--line-strong); color:var(--ink-900); background:transparent; }
.btn-line:hover { border-color:var(--ink-900); }
.btn-on-ink { border-color:rgba(232,238,246,.45); color:var(--on-ink); background:transparent; }
.btn-on-ink:hover { border-color:var(--on-ink); background:rgba(232,238,246,.08); }

/* ---------- shell: nav ---------- */
.nav {
  position:sticky; top:0; z-index:var(--z-sticky);
  background:var(--paper); border-bottom:1px solid var(--line);
  transition:background var(--t-med) var(--ease-out), border-color var(--t-med) var(--ease-out);
}
.nav-in { display:flex; align-items:center; gap:var(--s-4); min-height:64px; }
.brand {
  display:inline-flex; align-items:center; gap:.55rem; min-height:44px;
  font:600 1.1rem/1 var(--f-display); letter-spacing:-.02em;
  color:var(--ink-900); text-decoration:none; margin-right:auto;
}
.brand-dot { width:11px; height:11px; border-radius:50%; border:2.5px solid var(--amber); flex:none; }
.nav-links { display:flex; align-items:center; gap:var(--s-2); }
.nav-links a { color:var(--ink-700); text-decoration:none; padding:.6rem .7rem; border-radius:var(--r-sm); font-weight:500; }
.nav-links a:hover { color:var(--ink-900); background:rgba(11,18,32,.05); }
.nav-links a[aria-current="page"] { color:var(--ink-900); font-weight:700; box-shadow:inset 0 -2px 0 var(--amber); }
.nav .btn { min-height:44px; padding:.6rem 1rem; }
/* the nav link rule would otherwise repaint the CTA's text: pin it */
.nav .nav-links a.btn-amber { color:var(--ink-900); }
/* over the hero band the bar inverts — one bar, two skins */
.nav.over-ink { background:transparent; border-bottom-color:transparent; }
.nav.over-ink .brand { color:var(--on-ink); }
.nav.over-ink .nav-links a:not(.btn) { color:var(--on-ink-muted); }
.nav.over-ink .nav-links a:not(.btn):hover { color:#fff; background:rgba(255,255,255,.08); }
.nav-toggle { display:none; }

@media (max-width:720px) {
  .nav-toggle {
    display:inline-flex; align-items:center; justify-content:center;
    width:44px; height:44px; background:none; border:1px solid var(--line-strong);
    border-radius:var(--r-sm); color:inherit;
  }
  .nav.over-ink .nav-toggle { border-color:rgba(232,238,246,.4); color:var(--on-ink); }
  .nav-links {
    position:absolute; inset:64px 0 auto; flex-direction:column; align-items:stretch;
    background:var(--surface); border-bottom:1px solid var(--line);
    padding:var(--s-2); gap:.25rem; display:none;
    box-shadow:0 18px 40px rgba(11,18,32,.12);
  }
  .nav-links.open { display:flex; }
  .nav-links a, .nav-links .btn { min-height:48px; justify-content:flex-start; color:var(--ink-700); }
  .nav-links .btn { justify-content:center; margin-top:.35rem; }
}

/* ---------- shell: footer ---------- */
.footer { background:var(--ink-900); color:var(--on-ink-muted); margin-top:var(--s-8); padding:var(--s-7) 0 var(--s-5); }
.footer a { color:var(--on-ink); text-decoration:none; }
.footer a:hover { text-decoration:underline; text-decoration-color:var(--amber); }
.footer-grid { display:grid; gap:var(--s-5); grid-template-columns:repeat(auto-fit, minmax(210px,1fr)); }
.footer h3 { font:700 .95rem/1.2 var(--f-display); color:var(--on-ink); margin:0 0 var(--s-2); letter-spacing:0; }
.footer ul { list-style:none; margin:0; padding:0; display:grid; gap:.2rem; }
.footer li a { display:inline-flex; align-items:center; min-height:44px; }
.footer-base a { display:inline-flex; align-items:center; min-height:44px; }
.footer-base {
  margin-top:var(--s-5); padding-top:var(--s-3); border-top:1px solid var(--ink-line);
  display:flex; flex-wrap:wrap; gap:var(--s-3); justify-content:space-between; font-size:.85rem;
}

/* ---------- hairline rule with frame ticks (drawing linework, used structurally) ---------- */
.rule-ticks { height:1px; background:var(--line); position:relative; margin:var(--s-6) 0; }
.rule-ticks::before {
  content:''; position:absolute; inset:-4px 0 auto 0; height:9px;
  background-image:repeating-linear-gradient(90deg, var(--line-strong) 0 1px, transparent 1px 64px);
}

/* ---------- library: search ---------- */
.searchbox { position:relative; display:flex; align-items:center; }
.searchbox input {
  width:100%; min-height:56px; padding:.9rem 1rem .9rem 3rem;
  font:400 1.05rem/1.4 var(--f-body); color:var(--ink-900);
  background:var(--surface); border:1px solid var(--line-strong); border-radius:var(--r-md);
}
.searchbox input::placeholder { color:var(--ink-500); }
.searchbox svg { position:absolute; left:1rem; width:20px; height:20px; color:var(--ink-500); pointer-events:none; }
.searchbox input:focus-visible { outline:2px solid var(--amber); outline-offset:1px; border-color:var(--amber); }

/* ---------- library: index shelves (a list, not a card zoo) ---------- */
.shelf { margin:var(--s-6) 0; }
.shelf h2 { font-size:1.25rem; margin-bottom:var(--s-2); }
.idx { list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.idx li { border-bottom:1px solid var(--line); }
.idx a {
  display:flex; align-items:center; gap:var(--s-3); min-height:52px; padding:.7rem .25rem;
  text-decoration:none; color:var(--ink-900);
}
.idx a:hover { background:var(--surface); }
.idx .idx-name { font-weight:600; }
.idx .idx-note { color:var(--ink-500); font-size:.9rem; }
.idx .idx-count { margin-left:auto; color:var(--ink-500); font-size:.85rem; }

/* ---------- library: result rows (rows, never cards) ---------- */
.rows { list-style:none; margin:0; padding:0; }
.row-doc { border-bottom:1px solid var(--line); }
.row-doc > a {
  display:grid; gap:.3rem var(--s-3); padding:.85rem .75rem; min-height:56px;
  grid-template-columns:1fr auto; align-items:start; text-decoration:none; color:inherit;
  transition:background var(--t-fast) var(--ease-out);
}
.row-doc > a:hover { background:var(--surface); }
.row-title { font-weight:600; color:var(--ink-900); line-height:1.35; }
.row-sum { grid-column:1/-1; color:var(--ink-500); font-size:.92rem; line-height:1.5; }
.row-meta { display:flex; flex-wrap:wrap; gap:.4rem; align-items:center; justify-self:end; }
.tag {
  font:400 .74rem/1 var(--f-mono); letter-spacing:0;
  padding:.35rem .5rem; border:1px solid var(--line-strong); border-radius:var(--r-sm);
  color:var(--ink-500); white-space:nowrap;
}
.tag-own { border-color:var(--amber); color:var(--amber-ink); background:rgba(245,158,11,.1); }

/* ---------- library: facets ---------- */
.lib-layout { display:grid; gap:var(--s-5); align-items:start; }
@media (min-width:900px) { .lib-layout { grid-template-columns:250px 1fr; } }
.facets h3 { font-size:.95rem; margin:0 0 .5rem; }
.facet-group { border-bottom:1px solid var(--line); padding:var(--s-3) 0; }
.facet-group:first-of-type { border-top:1px solid var(--line); }
.facet-opt { display:flex; align-items:center; gap:.6rem; min-height:44px; cursor:pointer; }
.facet-opt input { width:18px; height:18px; accent-color:var(--amber); flex:none; }
.facet-opt .fc { margin-left:auto; color:var(--ink-500); font-size:.8rem; }
.facet-opt.zero { opacity:.45; }
.chips { display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:var(--s-3); }
.chip {
  display:inline-flex; align-items:center; gap:.4rem; min-height:36px; padding:.3rem .6rem;
  background:rgba(245,158,11,.14); border:1px solid var(--amber); border-radius:999px;
  font-size:.85rem; color:var(--amber-ink); cursor:pointer;
}
.chip:hover { background:rgba(245,158,11,.24); }
.results-head { display:flex; flex-wrap:wrap; gap:var(--s-3); align-items:baseline; justify-content:space-between; }
.count { font-family:var(--f-mono); color:var(--ink-500); font-size:.9rem; }

/* mobile: a tray, not another page */
.tray-open-btn { display:none; }
@media (max-width:899px) {
  .facets {
    position:fixed; inset:auto 0 0 0; z-index:var(--z-tray);
    background:var(--surface); border-top:1px solid var(--line-strong);
    border-radius:var(--r-lg) var(--r-lg) 0 0; padding:var(--s-4) var(--gut) calc(var(--s-4) + 72px);
    max-height:78vh; overflow:auto; transform:translateY(101%);
    transition:transform var(--t-med) var(--ease-out); box-shadow:0 -18px 40px rgba(11,18,32,.18);
  }
  .facets.open { transform:translateY(0); }
  .tray-open-btn { display:inline-flex; }
  .tray-apply {
    position:fixed; left:0; right:0; bottom:0; z-index:calc(var(--z-tray) + 1);
    padding:var(--s-2) var(--gut) calc(var(--s-2) + env(safe-area-inset-bottom));
    background:var(--surface); border-top:1px solid var(--line); display:none;
  }
  .facets.open ~ .tray-apply { display:block; }
  .tray-apply .btn { width:100%; }
  .tray-backdrop {
    position:fixed; inset:0; background:rgba(11,18,32,.45); z-index:calc(var(--z-tray) - 1);
    opacity:0; pointer-events:none; transition:opacity var(--t-med) var(--ease-out);
  }
  .tray-backdrop.on { opacity:1; pointer-events:auto; }
}

/* ---------- doc page ---------- */
.crumb { font-size:.88rem; color:var(--ink-500); margin:var(--s-4) 0 var(--s-2); }
.crumb a { color:var(--ink-500); display:inline-flex; align-items:center; min-height:44px; }
.doc-layout { display:grid; gap:var(--s-6); align-items:start; }
@media (min-width:960px) { .doc-layout { grid-template-columns:minmax(0,1fr) 260px; } }
.doc-body { max-width:var(--w-read); font-size:1.125rem; line-height:1.7; }
.doc-body h2 { margin-top:var(--s-5); }
.doc-body li { margin-bottom:.4rem; }
.doc-meta {
  font-family:var(--f-mono); font-size:.82rem; color:var(--ink-500);
  display:flex; flex-wrap:wrap; gap:.75rem; margin-bottom:var(--s-4);
}
.source-note {
  border:1px solid var(--line); background:var(--surface); border-radius:var(--r-md);
  padding:var(--s-3); font-size:.92rem; color:var(--ink-500);
}
.app-cta {
  border:1px solid var(--amber); border-radius:var(--r-md); background:rgba(245,158,11,.07);
  padding:var(--s-4); margin-top:var(--s-5);
}
.app-cta h3 { margin-bottom:.4rem; }
.rail-links { list-style:none; margin:0; padding:0; display:grid; gap:.5rem; }
.rail-links a { display:block; min-height:44px; padding:.6rem 0; color:var(--ink-700); text-decoration:none; border-bottom:1px solid var(--line); }
.rail-links a:hover { color:var(--ink-900); }
.sample-flag {
  display:inline-block; font:700 .7rem/1 var(--f-mono); letter-spacing:.06em;
  background:var(--ink-900); color:var(--amber); padding:.35rem .5rem; border-radius:var(--r-sm);
}
mark, .pagefind-ui__result-excerpt mark {
  background:transparent; color:inherit; font-weight:600;
  box-shadow:inset 0 -.35em 0 rgba(245,158,11,.35);
}

/* ---------- landing: ink band ---------- */
.band-ink { background:var(--ink-900); color:var(--on-ink); }
.band-ink h1, .band-ink h2 { color:#fff; }
.band-ink p { color:var(--on-ink); }

/* ---------- comparison table ---------- */
/* wide content scrolls inside itself; the page never scrolls sideways */
.table-scroll { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.table-scroll .cmp { min-width:34rem; }
.cmp { width:100%; border-collapse:collapse; font-size:.98rem; }
.cmp caption { text-align:left; color:var(--ink-500); font-size:.9rem; padding-bottom:var(--s-2); }
.cmp th, .cmp td { border:1px solid var(--line); padding:.7rem .8rem; text-align:left; vertical-align:top; }
.cmp thead th { font-family:var(--f-display); font-size:.95rem; background:transparent; }
.cmp tbody th { font-weight:500; color:var(--ink-700); }
.cmp .col-pro { background:var(--surface); box-shadow:inset 0 0 0 1px var(--amber); }
.cmp .yes { color:var(--ok); font-weight:700; }
.cmp .no  { color:var(--ink-500); }
.cmp td.num, .cmp th.num { font-family:var(--f-mono); }

/* ---------- print: technicians print guides for the yard ---------- */
@media print {
  .nav, .footer, .app-cta, .tray-apply, .facets, .searchbox, .skip { display:none !important; }
  body { background:#fff; color:#000; font-size:11pt; }
  .doc-body { max-width:none; font-size:11pt; }
  a[href^="http"]::after { content:" (" attr(href) ")"; font-size:9pt; color:#444; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important;
  }
}
