/* ============================================================================
   KEEP THE RECORD -- site chrome only.
   Every rule is scoped under .kr- so it cannot reach into a tool page. The
   tools carry two different palettes (DAYBREAK's navy/red/white and the field
   kit's paper/ink) and both are hers; the chrome sits around them without
   touching either. This sheet is injected AFTER the tool's own <style>, so on
   a specificity tie the chrome wins on its own elements and loses on hers.
   ========================================================================== */

.kr-chrome, .kr-chrome * { box-sizing: border-box; }
.kr-chrome {
  --kr-navy:#0a3161; --kr-red:#b31942; --kr-ink:#101720; --kr-paper:#fbfaf7;
  --kr-line:rgba(255,255,255,.18); --kr-dim:rgba(255,255,255,.72);
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  font-size:15px; line-height:1.5; letter-spacing:0; font-weight:400;
  text-align:left; text-transform:none;
}

/* ---------- top bar ---------- */
.kr-bar{
  position:relative; z-index:60; background:var(--kr-ink); color:#fff;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.kr-bar .kr-in{
  max-width:1180px; margin:0 auto; padding:0 22px;
  display:flex; align-items:center; gap:18px; min-height:52px; flex-wrap:wrap;
}
.kr-bar a{ color:#fff; text-decoration:none; }
.kr-home{
  font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:11px; font-weight:600;
  letter-spacing:.17em; text-transform:uppercase; white-space:nowrap;
  display:inline-flex; align-items:center; gap:9px; padding:6px 0;
}
.kr-home .kr-mark{
  width:15px; height:15px; flex:none; border-radius:2px;
  background:linear-gradient(180deg,var(--kr-navy) 0 34%,#fff 34% 66%,var(--kr-red) 66% 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.35);
}
.kr-nav{ display:flex; gap:2px; margin-left:auto; flex-wrap:wrap; }
.kr-nav a{
  font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:10.5px; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase; color:var(--kr-dim);
  padding:7px 11px; border-radius:100px; white-space:nowrap;
}
.kr-nav a:hover{ color:#fff; background:rgba(255,255,255,.11); }
.kr-nav a[aria-current="page"]{ color:#fff; background:rgba(255,255,255,.16); }
.kr-nav a:focus-visible, .kr-bar a:focus-visible, .kr-foot a:focus-visible{
  outline:2px solid #fff; outline-offset:2px; border-radius:3px;
}

/* ---------- full-bleed loop band ---------- */
.kr-band{ position:relative; overflow:hidden; background:var(--kr-ink); isolation:isolate; }
.kr-band.kr-tall{ min-height:min(78vh,620px); }
.kr-band.kr-short{ min-height:248px; }
.kr-band video, .kr-band img.kr-poster{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  z-index:0; border:0; display:block;
}
/* The scrim polarity follows the FOOTAGE, not the layout: every band here runs
   light copy, so the scrim darkens, and it is heaviest exactly where the text
   sits rather than an even wash that dims the picture for nothing. */
.kr-band::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  /* KR-SCRIM-V */
  background:
    linear-gradient(to top, rgba(9,13,20,.93) 0%, rgba(9,13,20,.82) 40%,
                    rgba(9,13,20,.55) 70%, rgba(9,13,20,.18) 100%),
    /* KR-SCRIM-H */
    linear-gradient(to right, rgba(9,13,20,.45) 0%, rgba(9,13,20,.10) 55%, rgba(9,13,20,0) 100%);
}
.kr-band .kr-in{
  position:relative; z-index:2; max-width:1180px; margin:0 auto;
  padding:56px 22px 34px; display:flex; flex-direction:column; justify-content:flex-end;
  min-height:inherit;
}
.kr-band.kr-tall .kr-in{ min-height:min(78vh,620px); padding-top:110px; padding-bottom:52px; }
.kr-band.kr-short .kr-in{ min-height:248px; padding-top:64px; padding-bottom:26px; }

.kr-kick{
  font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:11px; font-weight:600;
  /* 11px letterspaced caps is SMALL text: it needs 4.5:1, not 3:1, and it is the
     line that fails while the headline passes. Pure white over the scrim. */
  letter-spacing:.19em; text-transform:uppercase; color:#fff; margin:0 0 14px;
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}
.kr-kick .kr-rule{ display:inline-block; width:26px; height:2px; background:var(--kr-red); flex:none; }
.kr-band h1.kr-h1{
  font-family:'Newsreader',Georgia,serif; font-weight:600; color:#fff;
  font-size:clamp(30px,5.4vw,58px); line-height:1.03; letter-spacing:-.021em;
  margin:0; max-width:19ch; text-shadow:0 2px 26px rgba(0,0,0,.45);
}
.kr-band h1.kr-h1 .kr-dot{ color:#ff5f7e; }
.kr-band .kr-lede{
  color:#fff; font-size:clamp(15px,1.7vw,18.5px); line-height:1.55;
  margin:18px 0 0; max-width:60ch; text-shadow:0 1px 14px rgba(0,0,0,.5);
}
.kr-crumb{
  font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:10.5px; letter-spacing:.13em;
  text-transform:uppercase; color:#fff; margin:16px 0 0; opacity:.92;
}
.kr-crumb a{ color:#fff; text-decoration:none; border-bottom:1px solid rgba(255,255,255,.5); }
.kr-crumb a:hover{ border-bottom-color:#fff; }

/* ---------- footer ---------- */
.kr-foot{ background:var(--kr-ink); color:#fff; margin-top:0; }
.kr-foot .kr-in{ max-width:1180px; margin:0 auto; padding:40px 22px 46px; }
.kr-foot .kr-cols{ display:grid; gap:26px 34px; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); }
.kr-foot h2{
  font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:10px; font-weight:600;
  letter-spacing:.17em; text-transform:uppercase; color:#fff; margin:0 0 11px; border:0; padding:0;
}
.kr-foot h2::after{ content:none; }
.kr-foot ul{ list-style:none; margin:0; padding:0; }
.kr-foot li{ margin:0 0 7px; }
.kr-foot a{ color:var(--kr-dim); text-decoration:none; font-size:13.5px; }
.kr-foot a:hover{ color:#fff; text-decoration:underline; }
.kr-foot .kr-fine{
  margin-top:32px; padding-top:20px; border-top:1px solid rgba(255,255,255,.16);
  font-size:12.5px; color:var(--kr-dim); line-height:1.65; max-width:78ch;
}
.kr-foot .kr-fine b{ color:#fff; font-weight:600; }
.kr-foot .kr-colo{
  font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:10px; letter-spacing:.05em;
  color:rgba(255,255,255,.6); margin-top:16px; line-height:1.85;
}

/* ---------- motion ---------- */
/* Not a decoration: a background that moves without asking is the single most
   common accessibility fault on this fleet. The video is paused AND swapped for
   its own poster frame, so the page still has a picture. */
@media (prefers-reduced-motion: reduce){
  .kr-band video{ display:none !important; }
  .kr-band img.kr-poster{ display:block !important; }
  .kr-chrome *, .kr-chrome *::before, .kr-chrome *::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
}
.kr-band img.kr-poster{ display:none; }

@media (max-width:760px){
  .kr-bar .kr-in{ min-height:0; padding:8px 16px 10px; }
  .kr-nav{ margin-left:0; width:100%; }
  .kr-nav a{ padding:6px 9px; font-size:10px; }
  .kr-band .kr-in{ padding-left:16px; padding-right:16px; }
  .kr-band.kr-tall{ min-height:auto; }
  .kr-band.kr-tall .kr-in{ min-height:auto; padding-top:76px; padding-bottom:40px; }
  .kr-foot .kr-in{ padding-left:16px; padding-right:16px; }
}
@media print{ .kr-bar,.kr-band,.kr-foot{ display:none !important; } }

/* ============================================================================
   Authored pages (home, checks, colophon, film). These have no tool stylesheet
   of their own, so this is their whole document style -- still under .kr-.
   ========================================================================== */
.kr-doc{
  --d-ink:#101720; --d-soft:#3d4757; --d-faint:#606c7e; --d-line:#dfe3ea;
  --d-paper:#fbfaf7; --d-card:#fff; --d-navy:#0a3161; --d-red:#b31942;
  --d-ok:#0a6b39; --d-warn:#8a5a12;
  background:var(--d-paper); color:var(--d-ink);
  font-family:'Inter',system-ui,-apple-system,sans-serif; font-size:16px; line-height:1.62;
}
.kr-doc .kr-w{ max-width:1180px; margin:0 auto; padding:0 22px; }
.kr-doc .kr-narrow{ max-width:74ch; }
.kr-doc section{ padding:52px 0; border-top:1px solid var(--d-line); }
.kr-doc section:first-child{ border-top:0; }
.kr-doc h2{
  font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:11px; font-weight:600;
  letter-spacing:.17em; text-transform:uppercase; color:var(--d-red);
  margin:0 0 8px; display:flex; align-items:center; gap:12px;
}
.kr-doc h2::after{ content:""; flex:1; height:1px; background:var(--d-line); }
.kr-doc h3{
  font-family:'Newsreader',Georgia,serif; font-size:clamp(23px,3vw,31px); font-weight:600;
  letter-spacing:-.017em; line-height:1.16; margin:0 0 14px; color:var(--d-ink);
}
.kr-doc h4{ font-family:'Newsreader',Georgia,serif; font-size:20px; font-weight:600; margin:0 0 6px; }
.kr-doc p{ margin:0 0 15px; max-width:74ch; color:var(--d-soft); }
.kr-doc p.kr-big{ font-size:18.5px; color:var(--d-ink); line-height:1.58; }
.kr-doc a{ color:var(--d-navy); }
.kr-doc strong{ color:var(--d-ink); font-weight:600; }
.kr-doc code, .kr-doc .kr-mono{ font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:.87em; }

/* card grid */
.kr-grid{ display:grid; gap:16px; grid-template-columns:repeat(auto-fill,minmax(288px,1fr)); margin-top:22px; }
.kr-card{
  display:flex; flex-direction:column; background:var(--d-card); border:1px solid var(--d-line);
  border-radius:12px; overflow:hidden; text-decoration:none; color:inherit;
  transition:border-color .15s, transform .15s, box-shadow .15s;
}
.kr-card:hover{ border-color:var(--d-navy); transform:translateY(-2px); box-shadow:0 6px 22px rgba(16,23,32,.09); }
.kr-card:focus-visible{ outline:3px solid var(--d-navy); outline-offset:2px; }
.kr-card .kr-thumb{ position:relative; aspect-ratio:16/7; overflow:hidden; background:#101720; }
.kr-card .kr-thumb video, .kr-card .kr-thumb img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;
}
.kr-card .kr-thumb img{ display:none; }
.kr-card .kr-body{ padding:15px 17px 18px; }
.kr-card .kr-num{
  font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:10px; font-weight:600;
  letter-spacing:.15em; text-transform:uppercase; color:var(--d-red); display:block; margin-bottom:6px;
}
.kr-card h4{ margin:0 0 7px; font-size:19px; line-height:1.22; }
.kr-card p{ margin:0; font-size:13.6px; line-height:1.52; color:var(--d-faint); }
.kr-card .kr-does{
  margin-top:11px; padding-top:10px; border-top:1px solid var(--d-line);
  font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:10.5px; letter-spacing:.06em;
  text-transform:uppercase; color:var(--d-ok);
}
.kr-card .kr-does.kr-static{ color:var(--d-warn); }
@media (prefers-reduced-motion: reduce){
  .kr-card .kr-thumb video{ display:none !important; }
  .kr-card .kr-thumb img{ display:block !important; }
}

/* pull quote / rule blocks */
.kr-rule2{
  background:var(--d-card); border:1px solid var(--d-line); border-left:4px solid var(--d-red);
  border-radius:10px; padding:19px 22px; margin-top:14px;
}
.kr-rule2 h4{ color:var(--d-ink); margin-bottom:7px; }
.kr-rule2 p{ margin:0; font-size:14.6px; }
.kr-two{ display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); }

/* editions strip */
.kr-eds{ display:grid; gap:9px; grid-template-columns:repeat(auto-fill,minmax(112px,1fr)); margin-top:20px; }
.kr-eds a{
  display:block; padding:13px 12px; background:var(--d-card); border:1px solid var(--d-line);
  border-radius:9px; text-decoration:none; text-align:center;
}
.kr-eds a:hover{ border-color:var(--d-navy); }
.kr-eds b{ display:block; font-family:'Newsreader',Georgia,serif; font-size:21px; color:var(--d-navy); }
.kr-eds span{ font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:9.5px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--d-faint); }

/* tables + check rows */
.kr-doc table{ width:100%; border-collapse:collapse; margin-top:16px; font-size:14px; }
.kr-doc th{ text-align:left; font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:10px;
  letter-spacing:.13em; text-transform:uppercase; color:var(--d-faint); font-weight:600;
  border-bottom:2px solid var(--d-ink); padding:8px 10px 8px 0; }
.kr-doc td{ border-bottom:1px solid var(--d-line); padding:11px 10px 11px 0; vertical-align:top; color:var(--d-soft); }
.kr-doc td b{ color:var(--d-ink); }
.kr-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; }

.kr-chk{ display:flex; gap:14px; align-items:flex-start; padding:13px 0; border-bottom:1px solid var(--d-line); }
.kr-chk .kr-pill{
  flex:none; font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:10px; font-weight:600;
  letter-spacing:.1em; text-transform:uppercase; padding:4px 9px; border-radius:100px;
  border:1px solid var(--d-line); color:var(--d-faint); min-width:74px; text-align:center;
}
.kr-chk[data-state=pass] .kr-pill{ color:#fff; background:var(--d-ok); border-color:var(--d-ok); }
.kr-chk[data-state=fail] .kr-pill{ color:#fff; background:var(--d-red); border-color:var(--d-red); }
.kr-chk .kr-what{ font-size:14.6px; color:var(--d-ink); }
.kr-chk .kr-what small{ display:block; color:var(--d-faint); font-size:12.8px; margin-top:3px; }
.kr-chk .kr-got{ margin-left:auto; font-family:'IBM Plex Mono',ui-monospace,monospace;
  font-size:11px; color:var(--d-faint); text-align:right; flex:none; max-width:34ch; word-break:break-word; }
.kr-tally{
  display:flex; gap:22px; flex-wrap:wrap; background:var(--d-card); border:1px solid var(--d-line);
  border-radius:11px; padding:16px 20px; margin-top:18px;
}
.kr-tally div b{ display:block; font-family:'Newsreader',Georgia,serif; font-size:29px; line-height:1; color:var(--d-navy); }
.kr-tally div span{ font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:9.5px;
  letter-spacing:.13em; text-transform:uppercase; color:var(--d-faint); }

/* film */
.kr-film{ background:#0b1119; border-radius:13px; overflow:hidden; border:1px solid #1d2735; }
.kr-film video{ width:100%; display:block; aspect-ratio:16/9; background:#000; }
.kr-film .kr-cap{ padding:15px 19px 19px; color:#c8d2e0; font-size:14px; }
.kr-film .kr-cap b{ color:#fff; font-family:'Newsreader',Georgia,serif; font-size:19px; display:block; margin-bottom:5px; }
.kr-transcript{ margin-top:12px; background:var(--d-card); border:1px solid var(--d-line); border-radius:10px; padding:0 18px; }
.kr-transcript summary{ cursor:pointer; padding:14px 0; font-family:'IBM Plex Mono',ui-monospace,monospace;
  font-size:11px; letter-spacing:.13em; text-transform:uppercase; color:var(--d-navy); }
.kr-transcript p{ font-size:14.5px; }
@media (max-width:760px){
  .kr-doc .kr-w{ padding:0 16px; }
  .kr-doc section{ padding:38px 0; }
  .kr-chk{ flex-wrap:wrap; }
  .kr-chk .kr-got{ margin-left:88px; text-align:left; }
}
