/* ============================================================
   DBS — Ident / Ledger
   Constants: old gold on Prussian blue · Big Shoulders +
   IBM Plex · the horizon line · the Sateroots mark.

   Two registers:
     IDENT  — broadcast furniture. Front door, case openers.
     LEDGER — ruled record. Every surface you actually read.
   Ornate (archival) is reserved for primary documents and
   is not yet in play — no source scans on the site today.
   ============================================================ */

/* ---------- 1. Tokens ---------- */
:root{
  /* Ground — Prussian blue, earthy, never electric */
  --ground:      #0A2432;
  --ground-2:    #10303F;
  --ground-3:    #18404F;
  --ground-deep: #071B26;

  /* Old gold */
  --gold:        #C4A050;
  --gold-lit:    #E3C98C;
  --gold-dim:    #8E7438;

  /* Text — no pure white, ever */
  --paper:       #E8E1D0;
  --paper-dim:   #B3A78E;

  /* The ledger card. In circulation exactly once per case. */
  --card-red:    #B8362C;
  --card-ink:    #F4EAE2;

  /* Rules */
  --rule:        rgba(196,160,80,.30);
  --rule-soft:   rgba(196,160,80,.15);

  /* Type */
  --disp:  "Big Shoulders Display", "Oswald", "Arial Narrow", sans-serif;
  --mono:  "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --serif: "IBM Plex Serif", Georgia, "Times New Roman", serif;

  /* Prose face. Swap to var(--mono) to hold the system at two faces. */
  --prose: var(--serif);

  /* Texture hook — awaiting Patterns Inspo. Currently none. */
  --tex: none;

  --measure: 64ch;
  --gut: clamp(18px, 4vw, 56px);
  --nav-h: 54px;
  --maxw: 1180px;
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }

html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  background:var(--ground);
  color:var(--paper);
  font-family:var(--prose);
  font-size:16.5px;
  line-height:1.68;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; display:block; }
button{ font:inherit; color:inherit; background:none; border:none; cursor:pointer; }
a{ color:var(--gold); }

:focus-visible{ outline:2px solid var(--gold-lit); outline-offset:3px; }

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:900;
  background:var(--gold); color:var(--ground);
  font-family:var(--mono); font-size:12px; letter-spacing:.14em;
  text-transform:uppercase; text-decoration:none; padding:11px 18px;
}
.skip-link:focus{ left:8px; top:8px; }

.noscript-note{ max-width:var(--measure); margin:0 auto; padding:120px var(--gut) 60px; }
.noscript-note h1{ font-family:var(--disp); font-size:44px; letter-spacing:.02em; }
.noscript-note h2{ font-family:var(--disp); font-size:26px; margin:28px 0 10px; color:var(--gold); }
.noscript-note li{ margin:0 0 12px 20px; color:var(--paper-dim); }

/* Shared atoms */
.lbl{
  font-family:var(--mono); font-size:10px; font-weight:500;
  letter-spacing:.2em; text-transform:uppercase; color:var(--gold);
}
.num{ font-variant-numeric:tabular-nums; }
.shell{ max-width:var(--maxw); margin:0 auto; padding:0 var(--gut); }

/* The horizon line — the connective motif, drawn from the mark */
.horizon{
  position:relative; height:1px; background:var(--gold); border:0;
}
/* The label knocks the rule out, so its background has to BE the surface it
   sits on. Surfaces that aren't the page ground set --horizon-bg; without
   that the label reads as a patch of the wrong blue laid over the rule. */
.horizon[data-label]::after{
  content:attr(data-label); position:absolute; right:0; top:-6px;
  background:var(--horizon-bg, var(--ground)); padding-left:10px;
  font-family:var(--mono); font-size:8.5px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--gold);
}

/* ---------- 2. The ambient pattern ----------
   Tumbling blocks, from Patterns Inspo — gold facets on the Prussian ground.
   Replaces the perspective grid that used to run here.

   It spans the whole document rather than starting at a hard offset: the hero
   is opaque and sits above it, so the pattern simply emerges below the lockup
   with no measured breakpoint to keep in sync. `position:absolute` against a
   relatively-positioned body so it covers the document, not the viewport. */
body{ position:relative; }
#page-pattern{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:url('../images/pattern-tumbling.svg');
  background-repeat:repeat;
  background-position:center top;
  /* Fades out into the footer so the pattern stops before the page ends
     rather than being cut off by it. */
  -webkit-mask-image:linear-gradient(to bottom, #000 0, #000 88%, transparent 100%);
          mask-image:linear-gradient(to bottom, #000 0, #000 88%, transparent 100%);
}

/* ---------- 3. Header / navigation ---------- */
#site-header{
  position:fixed; top:0; left:0; right:0; z-index:60;
  background:rgba(10,36,50,.93);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--rule);
}
.hdr{
  max-width:var(--maxw); margin:0 auto;
  display:flex; align-items:center; gap:14px;
  padding:0 var(--gut); min-height:var(--nav-h);
}
.hdr-mark{
  display:flex; align-items:center; gap:9px;
  text-decoration:none; flex:0 0 auto;
}
.hdr-mark img{ width:26px; height:auto; }
.hdr-mark b{
  font-family:var(--disp); font-weight:800; font-size:21px;
  letter-spacing:.12em; color:var(--gold); line-height:1;
}

#site-nav{
  display:flex; align-items:center; gap:2px;
  margin-left:auto; min-width:0;
  overflow-x:auto; overflow-y:hidden;
  scrollbar-width:none; -ms-overflow-style:none;
}
#site-nav::-webkit-scrollbar{ display:none; }

#site-nav a{
  position:relative; flex:0 0 auto;
  font-family:var(--mono); font-size:10px; font-weight:500;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--paper-dim); text-decoration:none;
  padding:6px 10px; white-space:nowrap;
  border-bottom:2px solid transparent;
  transition:color .12s ease, border-color .12s ease;
}
#site-nav a:hover{ color:var(--gold); }
#site-nav a[aria-current="true"]{ color:var(--gold); border-bottom-color:var(--gold); }
#site-nav .nav-short{ display:none; }

#mute-toggle{
  flex:0 0 auto; width:32px; height:32px;
  display:grid; place-items:center;
  border:1px solid var(--rule); color:var(--paper-dim);
  transition:color .12s ease, border-color .12s ease;
}
#mute-toggle:hover{ color:var(--gold); border-color:var(--gold); }

/* ---------- 4. IDENT — the front door ---------- */
.ident{
  position:relative; z-index:1;
  min-height:88vh; display:flex; flex-direction:column; justify-content:flex-end;
  padding-top:var(--nav-h); overflow:hidden;
}

/* --- The lockup ---
   Mark stacked directly above the headline, both at ONE width. The mark's
   horizon rule spans `ruleSpan` (0.88) of the film's square frame, so setting
   the headline to the same width makes the rule span the headline — which is
   what welds the two into a single object instead of a picture with a caption
   under it. Changing --lockup changes both together, on purpose.

   Type size tracks --lockup rather than the viewport so the headline keeps
   filling the mark's width at every size. 0.172 sets "DIGGING BEYOND" to the
   full measure, which leaves "THE SURFACE" shorter and centered beneath it —
   the long-line-over-short-line the reference uses. */
.ident.is-film{
  background:var(--ground);
  justify-content:center; align-items:center; text-align:center;
  /* Reserve the foot's height so the lockup centers in the space ABOVE the
     wipe and lower third, instead of centring in the whole section and
     landing on top of them. */
  padding-bottom:132px;
}
.lockup{
  --lockup:min(420px, 76vw);
  /* NO z-index. `position:relative` alone does not open a stacking context,
     which matters: the film's `mix-blend-mode` blends against the nearest
     one, and with a z-index here that would be this box — which has no
     background, so the blend would silently do nothing. Left alone, it
     blends against .ident's ground, which is the point. */
  position:relative;
  width:var(--lockup);
  display:flex; flex-direction:column; align-items:center;
}
.ident-film{
  display:block; width:100%; height:auto; aspect-ratio:1/1;
  pointer-events:none;
  /* The square source fits the square box exactly, so there is no letterbox.
     `lighten` is still here for the frame itself: h264 is limited-range YUV
     and the ground does not survive the round trip byte for byte, which shows
     up as a faintly different blue square on the page. max() per channel
     makes a 1-2 level drift disappear while leaving the gold untouched. */
  mix-blend-mode:lighten;
}
.lockup .ident-title{
  /* Measured, not guessed: "DIGGING BEYOND" in Big Shoulders 900 at this
     tracking runs 6.11x its font-size, so it fits the lockup at up to .164.
     .156 keeps a margin for font-loading variance and leaves the headline a
     little narrower than the mark's rule — which is how the reference sits,
     with the wordmark just inside the mark's full width. Above .164 it wraps
     to three lines and the lockup falls apart. */
  font-size:calc(var(--lockup) * .156);
  line-height:.9;
  margin-top:calc(var(--lockup) * -.02);
  /* The specular sweep stays (see .ident-title for the gradient). The mark
     above it is flat, so the shine is the one thing in the lockup that moves
     once the reveal has finished. */
}
.lockup .ident-kick{
  margin:calc(var(--lockup) * .05) 0 0;
  font-size:10px; letter-spacing:.26em;
}

/* Lower furniture pinned to the foot while the lockup centers. Absolute
   rather than a flex auto-margin, because an auto margin would swallow the
   free space and stop `justify-content:center` working. */
.ident-foot{
  position:absolute; left:0; right:0; bottom:0; z-index:3;
  text-align:left;
}

.sr-only{
  position:absolute; width:1px; height:1px; padding:0;
  margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.ident-furn{
  position:absolute; top:calc(var(--nav-h) + 18px); left:0; right:0; z-index:3;
  max-width:var(--maxw); margin:0 auto; padding:0 var(--gut);
  display:flex; align-items:flex-start; gap:12px;
}
.ident-stamp{
  margin-left:auto; text-align:right;
  font-family:var(--mono); font-size:9px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--paper-dim); line-height:1.8;
}
.ident-stamp b{ color:var(--gold); font-weight:500; display:block; }

.ident-core{ position:relative; z-index:3; max-width:var(--maxw); margin:0 auto; width:100%; padding:0 var(--gut); }
.ident-kick{
  font-family:var(--mono); font-size:10px; letter-spacing:.32em;
  text-transform:uppercase; color:var(--gold); margin-bottom:12px;
}
.ident-title{
  font-family:var(--disp); font-weight:900;
  font-size:clamp(58px,13vw,178px); line-height:.82;
  letter-spacing:.006em; text-transform:uppercase;
  text-wrap:balance;
  background:linear-gradient(100deg,
      var(--gold) 0%, var(--gold) 38%, var(--gold-lit) 48%, #FFF3D6 51%,
      var(--gold-lit) 54%, var(--gold) 64%, var(--gold) 100%);
  background-size:300% 100%;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:shine 8s linear infinite;
}
@keyframes shine{ from{ background-position:140% 0; } to{ background-position:-40% 0; } }

/* The horizon as the wipe the wordmark sits on */
.ident-wipe{
  position:relative; z-index:3; height:1px; background:var(--gold);
  box-shadow:0 0 16px rgba(196,160,80,.5);
  max-width:var(--maxw); margin:22px auto 0; width:calc(100% - 2*var(--gut));
}
.ident-lower{
  position:relative; z-index:3; max-width:var(--maxw); margin:0 auto; width:100%;
  padding:14px var(--gut) 30px;
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
}
.ident-lower .loc{
  font-family:var(--mono); font-size:11px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--paper);
}
.ident-lower .tag{
  font-family:var(--mono); font-size:9px; font-weight:600; letter-spacing:.18em;
  text-transform:uppercase; color:var(--ground); background:var(--gold); padding:3px 10px;
}
.ident-lower .rt{
  margin-left:auto; font-family:var(--mono); font-size:9px;
  letter-spacing:.18em; text-transform:uppercase; color:var(--paper-dim);
}
.ident-scroll{
  font-family:var(--mono); font-size:9px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--paper-dim);
}

/* ---------- 5. LEDGER — reading surfaces ---------- */
.ledger{ position:relative; z-index:1; padding:76px 0 0; }
.ledger:last-of-type{ padding-bottom:96px; }
.sheet{
  max-width:var(--maxw); margin:0 auto; padding:0 var(--gut);
  scroll-margin-top:calc(var(--nav-h) + 16px);
}
.sheet-inner{
  background:rgba(16,48,63,.94); border:1px solid var(--rule);
  background-image:var(--tex);
}

/* Sheet collar — the ruled header row */
.collar{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(124px,1fr));
  border-bottom:1px solid var(--rule);
}
.collar > div{
  padding:9px 14px; border-right:1px solid var(--rule-soft);
  font-family:var(--mono); font-size:9px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--paper-dim);
}
.collar > div:last-child{ border-right:0; }
.collar b{ display:block; color:var(--gold); font-weight:500; font-size:11px; margin-top:3px; }

/* rgba(16,48,63,.94) resolved over --ground. Flat value because a knockout
   cannot be translucent — it has to hide the rule behind it. */
.sheet-body{ padding:clamp(22px,3.4vw,40px); --horizon-bg:#102F3E; }
.sheet-title{
  font-family:var(--disp); font-weight:800;
  font-size:clamp(32px,5vw,54px); line-height:.92;
  letter-spacing:.015em; text-transform:uppercase; color:var(--paper);
  text-wrap:balance;
}
.sheet-intro{
  font-size:16px; line-height:1.68; color:var(--paper-dim);
  max-width:var(--measure); margin-top:14px;
}

/* ---------- 6. Case index (ledger register) ---------- */
.case-list{ display:grid; gap:1px; background:var(--rule-soft); margin-top:30px; }
.case-row{
  background:var(--ground-2); background-image:var(--tex);
  display:grid; gap:4px 24px;
  grid-template-columns:88px minmax(0,1fr) auto;
  align-items:start; padding:22px 20px;
  transition:background-color .14s ease;
}
.case-row:hover{ background-color:var(--ground-3); }
.case-row-no{
  font-family:var(--disp); font-weight:800; font-size:34px; line-height:.9;
  color:var(--gold-dim); font-variant-numeric:tabular-nums;
}
.case-row-main{ min-width:0; }
.case-row h3{
  font-family:var(--disp); font-weight:800; font-size:28px;
  line-height:1; letter-spacing:.02em; text-transform:uppercase; color:var(--paper);
}
.case-row-loc{
  font-family:var(--mono); font-size:9.5px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--paper-dim); margin-top:7px;
}
.case-row-desc{
  font-size:15px; line-height:1.62; color:var(--paper-dim);
  max-width:58ch; margin-top:10px;
}
.case-row-go{ display:flex; flex-direction:column; align-items:flex-end; gap:12px; }

.status{
  font-family:var(--mono); font-size:8.5px; font-weight:500; letter-spacing:.18em;
  text-transform:uppercase; padding:3px 9px; white-space:nowrap;
  border:1px solid currentColor;
}
.status.active{ color:var(--gold); }
.status.ongoing{ color:#7FA8A0; }

.open-case{
  font-family:var(--mono); font-size:9.5px; font-weight:500; letter-spacing:.2em;
  text-transform:uppercase; color:var(--gold);
  border:1px solid var(--rule); padding:9px 16px; white-space:nowrap;
  transition:border-color .12s ease, background-color .12s ease, color .12s ease;
}
.open-case:hover{ border-color:var(--gold); background:var(--gold); color:var(--ground); }

/* ---------- 7. Media / about / donate (ledger register) ---------- */
.media-list{ display:grid; gap:1px; background:var(--rule-soft); margin-top:26px; }
.media-item{ background:var(--ground-2); background-image:var(--tex); padding:22px 20px; }
.media-item-head{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.media-item h3{
  font-family:var(--disp); font-weight:800; font-size:24px;
  letter-spacing:.02em; text-transform:uppercase; color:var(--paper); line-height:1;
}
.media-item-sub{
  font-family:var(--mono); font-size:9px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--paper-dim); margin-top:8px;
}
.media-item p{ font-size:15px; line-height:1.64; color:var(--paper-dim); max-width:var(--measure); margin-top:10px; }
.media-item .status{ margin-left:auto; }

.phases{ display:flex; flex-wrap:wrap; gap:1px; background:var(--rule-soft); margin-top:22px; }
.phase{
  flex:1 1 150px; background:var(--ground-2); padding:14px 16px;
  font-family:var(--mono); font-size:9.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gold);
}
.phase span{ display:block; color:var(--paper-dim); font-size:8.5px; margin-bottom:5px; }
.founder{
  font-style:italic; color:var(--paper-dim); font-size:15px;
  border-left:2px solid var(--gold); padding-left:16px; margin-top:26px; max-width:var(--measure);
}

.donate-emph{
  font-family:var(--mono); font-size:11px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--gold); margin-top:18px;
}
.donate-btn{
  display:inline-block; margin-top:24px;
  font-family:var(--mono); font-size:11px; font-weight:500; letter-spacing:.2em;
  text-transform:uppercase; text-decoration:none;
  color:var(--ground); background:var(--gold); padding:14px 34px;
  transition:background-color .12s ease;
}
.donate-btn:hover{ background:var(--gold-lit); }

/* ---------- 8. Case overlay — ident on top, ledger underneath ---------- */
#case-overlay{
  position:fixed; inset:0; z-index:200;
  background:var(--ground); overflow-y:auto; overscroll-behavior:contain;
  transform:translateY(100%);
  transition:transform .42s cubic-bezier(.22,1,.36,1);
}
#case-overlay.open{ transform:translateY(0); }
#case-overlay[hidden]{ display:none; }

.case-close{
  position:fixed; top:14px; right:calc(var(--gut) - 4px); z-index:12;
  width:42px; height:42px; display:grid; place-items:center;
  background:rgba(10,36,50,.9); border:1px solid var(--rule);
  color:var(--paper); font-size:20px; line-height:1;
  transition:border-color .12s ease, color .12s ease;
}
.case-close:hover{ border-color:var(--gold); color:var(--gold); }

/* Ident half */
.case-ident{
  position:relative; min-height:66vh; overflow:hidden;
  display:flex; flex-direction:column; justify-content:flex-end;
}
.case-bed{ position:absolute; inset:0; }
.case-bed canvas{ width:100%; height:100%; display:block; }
/* Let the survey stay gold up top; only darken where type has to land. */
.case-bed::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg,
    rgba(10,36,50,.12) 0%,
    rgba(10,36,50,.30) 42%,
    rgba(10,36,50,.72) 72%,
    var(--ground) 100%);
}
.case-ident .ident-furn{ top:18px; }
.case-ident .ident-core{ padding-bottom:0; }
.case-ident .ident-title{ font-size:clamp(46px,10vw,132px); }

/* The stamp sits left so it never meets the close button. */
.case-ident .ident-stamp{ margin-left:0; text-align:left; }

.terrain-name{
  font-family:var(--mono); font-size:8.5px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--gold);
  text-shadow:0 1px 6px rgba(7,27,38,.95);
}

/* Ledger half */
.case-ledger{ max-width:var(--maxw); margin:0 auto; padding:0 var(--gut) 90px; }
.case-ledger-inner{ background:rgba(16,48,63,.94); border:1px solid var(--rule); border-top:0; }

.surface-split{ padding:clamp(22px,3.4vw,40px); --horizon-bg:#102F3E; }
.band{ padding:20px 0; }
.band + .band{ border-top:1px dashed var(--rule-soft); }
.band-k{
  font-family:var(--mono); font-size:9px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--gold); margin-bottom:9px;
}
.band p{ font-size:16px; line-height:1.7; color:var(--paper-dim); max-width:var(--measure); }
.band.is-record p{ color:var(--paper); }

.case-stats{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  border-top:1px solid var(--gold); margin-top:8px;
}
.case-stats > div{ padding:16px 16px 16px 0; border-right:1px solid var(--rule-soft); }
.case-stats > div:last-child{ border-right:0; }
.case-stats b{
  display:block; font-family:var(--disp); font-weight:800; font-size:40px;
  line-height:.9; color:var(--gold); font-variant-numeric:tabular-nums;
}
.case-stats span{
  display:block; font-family:var(--mono); font-size:8.5px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--paper-dim); margin-top:7px;
}

.thesis{
  font-size:17px; line-height:1.62; font-style:italic; color:var(--paper);
  border-left:2px solid var(--gold); padding-left:18px;
  max-width:var(--measure); margin-top:28px;
}

/* The ledger card. Dry. No shine, no glow, no radius, no tail. */
.ledger-card{
  display:flex; align-items:baseline; gap:16px; flex-wrap:wrap;
  background:var(--card-red); color:var(--card-ink);
  padding:18px 20px; margin-top:30px;
  border-radius:0; box-shadow:none; animation:none; transition:none;
}
.ledger-card b{
  font-family:var(--disp); font-weight:900; font-size:46px; line-height:.85;
  font-variant-numeric:tabular-nums;
}
.ledger-card span{
  font-family:var(--mono); font-size:10px; font-weight:500;
  letter-spacing:.22em; text-transform:uppercase;
}

/* Plate collar under the terrain */
.plate-collar{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(104px,1fr));
  border-top:1px solid var(--rule);
}
.plate-collar > div{
  padding:9px 12px; border-right:1px solid var(--rule-soft);
  font-family:var(--mono); font-size:8px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--paper-dim);
}
.plate-collar > div:last-child{ border-right:0; }
.plate-collar b{ display:block; color:var(--gold); font-weight:500; font-size:10px; margin-top:2px; }

/* ---------- 8b. The desk — current work, inside Investigations ----------
   Ledger register throughout. No ident furniture: this is a file being
   worked, not a case being presented, and the styling must not make it
   look more finished than it is. */
.desk{ margin-top:54px; }
.desk-intro{
  font-size:15px; line-height:1.66; color:var(--paper-dim);
  max-width:var(--measure); margin:18px 0 22px;
}
.desk-file{
  background:var(--ground-2); background-image:var(--tex);
  border:1px solid var(--rule-soft); padding:clamp(20px,3vw,32px);
}
.desk-head{ display:flex; align-items:flex-start; gap:18px; flex-wrap:wrap; }
.desk-head h3{
  font-family:var(--disp); font-weight:800; font-size:clamp(26px,3.4vw,38px);
  line-height:1; letter-spacing:.01em;
}
.desk-loc{
  font-family:var(--mono); font-size:10px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--paper-dim); margin-top:8px;
}
.desk-head .status{ margin-left:auto; }
.desk-sum{
  font-size:16px; line-height:1.7; color:var(--paper);
  max-width:var(--measure); margin-top:18px;
}
.desk-ledger{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(138px,1fr));
  gap:1px; background:var(--rule-soft); margin:26px 0 4px;
}
.desk-ledger > div{ background:var(--ground); padding:14px 16px; }
.desk-ledger span{
  display:block; font-family:var(--mono); font-size:9px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--paper-dim); line-height:1.5;
}
.desk-ledger b{
  display:block; font-family:var(--disp); font-weight:800; font-size:30px;
  line-height:1; color:var(--gold); margin-top:8px;
}
.desk-k{
  font-family:var(--mono); font-size:10px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--gold); margin:30px 0 12px;
}
.desk-held{ list-style:none; max-width:var(--measure); }
.desk-held li{
  font-size:14.5px; line-height:1.62; color:var(--paper-dim);
  padding:10px 0 10px 20px; position:relative;
  border-top:1px dashed var(--rule-soft);
}
.desk-held li::before{
  content:''; position:absolute; left:0; top:19px;
  width:8px; height:1px; background:var(--gold-dim);
}
.desk-note{
  font-size:14px; line-height:1.66; color:var(--paper-dim);
  max-width:var(--measure); margin-top:16px; font-style:italic;
}
.desk-ahead{ display:grid; gap:1px; background:var(--rule-soft); }
.ahead-row{
  background:var(--ground); padding:13px 16px;
  display:grid; grid-template-columns:112px minmax(0,1fr); gap:16px;
  align-items:baseline; font-size:14.5px; line-height:1.6; color:var(--paper-dim);
}
.ahead-date{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gold);
}
.desk .ledger-card{ margin-top:30px; }

/* ---------- 8c. Publications ---------- */
.sheet-note{
  font-size:14px; line-height:1.68; color:var(--paper-dim);
  max-width:var(--measure); margin-top:26px;
  padding-top:16px; border-top:1px solid var(--rule-soft);
}
.sheet-sub{
  font-size:15px; line-height:1.66; color:var(--paper-dim);
  max-width:var(--measure); margin:18px 0 0;
}

/* The Digest masthead. Deliberately NOT a second house style — it is the
   DBS palette holding a different publication's name, the way a broadcaster
   trails a title it carries. Warm serif for the mark, ledger underneath. */
.digest{
  border:1px solid var(--rule); background:var(--ground-2);
  background-image:var(--tex); margin-top:28px;
  --horizon-bg:var(--ground-2);
}
.digest-head{ padding:clamp(26px,4vw,44px) clamp(20px,3vw,34px) 24px; text-align:center; }
.digest-mast{
  font-family:var(--serif); font-style:italic; font-weight:600;
  font-size:clamp(34px,5.6vw,58px); line-height:1; color:var(--paper);
  letter-spacing:-.01em;
}
.digest-mast b{ color:var(--gold); font-weight:600; }
.digest-stand{
  font-family:var(--mono); font-size:10px; letter-spacing:.24em;
  text-transform:uppercase; color:var(--gold); margin-top:16px;
}
.digest-by{
  font-family:var(--mono); font-size:9.5px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--paper-dim); margin-top:9px;
}
.digest .horizon{ margin:0 clamp(20px,3vw,34px); }
.digest-body{ padding:26px clamp(20px,3vw,34px) clamp(24px,3vw,34px); }
.digest-desc{ font-size:15.5px; line-height:1.7; color:var(--paper-dim); max-width:var(--measure); }
.digest-state{
  font-family:var(--mono); font-size:11px; line-height:1.7; color:var(--paper);
  max-width:var(--measure); margin-top:16px;
  border-left:2px solid var(--gold-dim); padding-left:14px;
}
.digest-issues{ list-style:none; margin-top:26px; }
.digest-issues li{
  display:grid; grid-template-columns:44px minmax(0,1fr) auto;
  gap:16px; align-items:baseline;
  padding:11px 0; border-top:1px dashed var(--rule-soft);
}
.iss-no{
  font-family:var(--mono); font-size:11px; color:var(--gold-dim); letter-spacing:.1em;
}
.iss-title{ font-size:15px; color:var(--paper); }
.iss-date{
  font-family:var(--mono); font-size:10px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--paper-dim);
}
.digest-acts{ display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.btn-solid,.btn-ghost{
  font-family:var(--mono); font-size:11px; font-weight:500;
  letter-spacing:.18em; text-transform:uppercase; text-decoration:none;
  padding:13px 24px; transition:background .14s ease, color .14s ease, border-color .14s ease;
}
.btn-solid{ background:var(--gold); color:var(--ground); border:1px solid var(--gold); }
.btn-solid:hover{ background:var(--gold-lit); border-color:var(--gold-lit); }
.btn-ghost{ color:var(--gold); border:1px solid var(--rule); }
.btn-ghost:hover{ border-color:var(--gold); background:var(--ground-3); }

.media-item-link{ margin-top:14px; }
.media-item-link a{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.16em;
  text-transform:uppercase; text-decoration:none;
}
.media-item-link a:hover{ color:var(--gold-lit); }
/* A citation we hold but cannot yet link. Reads as a source line, not a
   dead button — a fabricated DOI on a page about citation discipline
   would be the worst available error. */
.media-item-link.is-flat{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--paper-dim);
}

/* ---------- 8d. Standards ---------- */
.tiers{ display:grid; gap:1px; background:var(--rule-soft); margin:20px 0 0; }
.tier{
  background:var(--ground-2); background-image:var(--tex);
  display:grid; grid-template-columns:128px minmax(0,1.5fr) minmax(0,1fr);
  gap:18px; padding:16px 18px; align-items:baseline;
}
.tier b{
  font-family:var(--mono); font-size:11px; font-weight:600; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gold);
}
.tier-rule{ font-size:14.5px; line-height:1.6; color:var(--paper); }
.tier-use{
  font-family:var(--mono); font-size:11px; line-height:1.65; color:var(--paper-dim);
}
.tiers-note{
  font-size:14.5px; line-height:1.7; color:var(--paper-dim);
  max-width:var(--measure); margin:20px 0 40px;
}
.rules{ display:grid; gap:1px; background:var(--rule-soft); margin-top:20px; }
.rule{ background:var(--ground-2); background-image:var(--tex); padding:18px 20px; }
.rule-k{
  font-family:var(--disp); font-weight:700; font-size:20px; line-height:1.2;
  color:var(--paper); letter-spacing:.01em;
}
.rule-v{
  font-size:14.5px; line-height:1.66; color:var(--paper-dim);
  max-width:var(--measure); margin-top:9px;
}

/* A file with no rendered survey states the absence. */
.plate-none{
  font-family:var(--mono); font-size:10.5px; line-height:1.7;
  letter-spacing:.08em; color:var(--paper-dim);
  border-bottom:1px solid var(--rule-soft); padding:16px 18px;
}
/* 66vh is a frame sized to hold a terrain render. With no survey there is
   nothing in it, so the opener closes up to the height of its own type
   rather than reserving a screen of empty ground. */
.case-ident.is-flat{ background:var(--ground-deep); min-height:0; padding-top:82px; }
.question{ padding-top:22px; margin-top:22px; border-top:1px solid var(--rule); }
.question p:last-child{
  font-family:var(--prose); font-size:17px; line-height:1.7;
  color:var(--paper); max-width:var(--measure); margin-top:10px;
}

/* ---------- 9. Footer ---------- */
.site-foot{
  position:relative; z-index:1; border-top:1px solid var(--rule);
  background:var(--ground-deep);
}
.site-foot .shell{
  display:flex; flex-wrap:wrap; gap:12px 28px; align-items:center;
  padding-top:22px; padding-bottom:22px;
  font-family:var(--mono); font-size:9px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--paper-dim);
}
.site-foot b{ color:var(--gold); font-weight:500; }
.foot-top{ border-bottom:1px solid var(--rule-soft); align-items:flex-start; }
.foot-id{ display:flex; flex-direction:column; gap:7px; }
/* Collapsing hairline borders rather than the gap-over-a-tinted-background
   trick used elsewhere: this row wraps, and a background behind the gaps
   paints an empty ruled cell in the gap the wrap leaves behind. */
.foot-follow{ display:flex; flex-wrap:wrap; margin-left:auto; }
.foot-follow a{
  background:var(--ground-deep); text-decoration:none; color:var(--paper-dim);
  padding:10px 16px; border:1px solid var(--rule-soft);
  margin:0 0 -1px -1px;
  transition:background .14s ease, color .14s ease;
}
.foot-follow a:hover{ background:var(--ground-2); color:var(--gold); }
.foot-follow b{ display:block; margin-top:5px; letter-spacing:.1em; text-transform:none; }
.foot-bot span:first-child{ max-width:62ch; letter-spacing:.1em; line-height:1.9; text-transform:none; font-size:10px; }
.foot-copy{ margin-left:auto; }

/* ---------- 10. Responsive ---------- */
@media (max-width:860px){
  :root{ --nav-h:50px; }
  .case-row{ grid-template-columns:56px minmax(0,1fr); }
  .case-row-go{ grid-column:1 / -1; flex-direction:row; align-items:center; justify-content:space-between; }
  .case-row-no{ font-size:26px; }
  .case-stats > div{ padding-right:12px; }

  /* Three-column tier rows collapse to a stack; the label stays first so
     the register still reads top-down as Documented → Contested. */
  .tier{ grid-template-columns:1fr; gap:7px; }
  .foot-follow{ margin-left:0; }
}

@media (max-width:600px){
  #site-nav .nav-long{ display:none; }
  #site-nav .nav-short{ display:inline; }
  #site-nav a{ padding:6px 8px; letter-spacing:.14em; }
  .hdr{ gap:8px; }
  .hdr-mark img{ width:22px; }
  .hdr-mark b{ font-size:18px; }
  .ident{ min-height:82vh; }
  .ident-lower .rt{ margin-left:0; width:100%; }
  .ledger-card b{ font-size:36px; }
  .desk-head .status{ margin-left:0; }
  .ahead-row{ grid-template-columns:1fr; gap:5px; }
  .digest-issues li{ grid-template-columns:36px minmax(0,1fr); }
  .iss-date{ grid-column:2; }
  .digest-acts .btn-solid,.digest-acts .btn-ghost{ flex:1 1 100%; text-align:center; }
  .case-close{ top:10px; right:10px; width:40px; height:40px; }
}

/* ---------- 11. Motion ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .ident-title{ background-position:50% 0; }
}

/* ============================================
   Koenig editor cards.
   Ghost's editor emits these; the ledger column is the measure, so wide
   breaks out modestly and full takes the sheet. Nothing here gets a radius
   or a shadow.
   ============================================ */
.kg-card{ margin:1.6rem 0; }

.kg-width-wide{
  position:relative;
  width:min(92vw, 1100px);
  margin-left:50%;
  transform:translateX(-50%);
}

.kg-width-full{
  position:relative;
  width:100vw;
  max-width:100vw;
  margin-left:50%;
  transform:translateX(-50%);
}

.kg-image, .kg-image-card img{ display:block; width:100%; height:auto; }

.kg-image-card figcaption,
.kg-embed-card figcaption,
.kg-gallery-card figcaption{
  margin-top:.5rem;
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.04em;
  color:var(--paper-dim);
  text-align:left;
}

.kg-bookmark-card a{ text-decoration:none; }

/* The register heading is a link now that a case has its own URL. It should
   still read as the heading it was, not as body copy with a rule under it. */
.case-row-main h3 a{
  color:inherit;
  text-decoration:none;
}
.case-row-main h3 a:hover{
  color:var(--gold-lit);
}