/* ==========================================================================
   CALIBAN LEDGER — ledger.css — the shared layer.
   One stylesheet, one set of names. Every screen is assembled from these
   primitives. A screen that needs its own CSS is a bug in this file.

   0 tokens · 1 base · 2 layout · 3 type · 4 plate · 5 rail · 6 crew
   7 atoms · 8 evidence · 9 shell · 10 motion

   Class names are the live site's. New primitives added here:
   .seal .stat .tiles/.tile .discrep .worth .obj .kv .perch .console .candle
   ========================================================================== */

/* 0 · TOKENS — everything is a multiple of --ui ----------------------------- */
:where(.ledger){
  --ui:1;
  /* HOW WIDE A SCREEN IS ALLOWED TO GET, IN ONE PLACE.

     Owner: "plenty of apce to make this entire app a little wider", and then
     "the sides of the app we can take up a lot more space the gaps are huge".
     He is right: every screen was capped at 1260px, so on his 2528px monitor
     the app used half the glass and put 630px of empty page down either side.

     It is a token rather than four numbers because four numbers is how the
     roster, the AAR, the codex and the filing came to be capped at 1260, 1180,
     1260 and 1080 in the first place, and three of those differences were not
     decisions. The two that ARE decisions keep their own line below and say
     why.

     NOT `none`. A table can use every pixel it is given; a paragraph cannot,
     and this app has both on the same screens. 1720 is about 150 characters of
     the roll's own type -- wide for prose, right for eleven columns of figures
     -- and it is the number to change if he wants more. */
  --page-w:calc(1720px * var(--ui));
  /* ink, brightest to faintest */
  --ink:#E4EBE2;--ink-2:#A9BCAF;--ink-3:#8E9E93;--ink-4:#6D7D70;--ink-5:#5F7066;--ink-6:#4F5F54;--ink-on-gold:#120E06;
  /* WHAT THE FIRE THROWS OFF, as bare channels because ui/app/embers.js
     builds an rgba() from it per particle. Caliban's forge is orange. */
  --ember-rgb:240,150,60;
  /* the chapter's metal */
  --gold:#C9A45C;--gold-lit:#D8AE4A;--gold-warm:#E2C079;--gold-dim:#8A6A32;--gold-ash:#8C7A52;--gold-line:rgba(201,164,92,.35);
  /* the four states + the machine spirit + escalation */
  --good:#7FB489;--good-2:#6E9E7A;--warn:#B5705A;--warn-2:#C98B74;--bad:#9B2C24;--bad-lit:#C4685F;--cyan:#3BC8B2;--esc:#7A92C4;--esc-lit:#9DB4E0;
  /* ground and surfaces */
  --bg:#0B1210;--bg-deep:#07100D;--row-alt:#101E18;
  --panel:rgba(9,18,14,.62);--panel-2:rgba(11,18,16,.7);--panel-3:rgba(8,16,13,.6);--panel-4:rgba(19,35,27,.55);--panel-on:#172C23;--pop:#0D1A14;
  --tile:linear-gradient(150deg,rgba(70,100,80,.4),rgba(19,30,24,.75));--tile-edge:rgba(178,201,177,.22);
  --line:#1A2A20;--line-2:#2B3A26;--line-3:rgba(178,201,177,.13);--hair:rgba(178,201,177,.10);--hair-2:rgba(178,201,177,.16);
  --rule:rgba(178,201,177,.10);--rule-head:rgba(201,164,92,.22);
  /* light: what every bevel, rivet and lamp is made of */
  --edge-lit:rgba(255,228,158,.20);--edge-dark:rgba(0,0,0,.48);--rivet:rgba(222,206,164,.72);--rivet-shade:rgba(0,0,0,.62);--lift:rgba(74,52,20,.32);
  --glow-live:rgba(216,174,74,.36);--glow-read:rgba(121,196,141,.32);--glow-owed:rgba(180,101,58,.36);--glow-esc:rgba(122,146,196,.36);--glow-spent:rgba(0,0,0,0);
  --cast:0 16px 34px -16px rgba(0,0,0,.9);
  --sink:inset 0 2px 8px rgba(0,0,0,.6);
  --bevel:inset 0 1px 0 var(--edge-lit),inset 0 -1px 0 var(--edge-dark),0 1px 0 var(--edge-dark);
  --face:linear-gradient(168deg,rgba(255,255,255,.04),rgba(255,255,255,0) 36%,rgba(0,0,0,.16) 100%);
  /* type */
  --serif:'Cormorant Garamond',Georgia,serif;--mono:'JetBrains Mono',ui-monospace,Menlo,monospace;--sans:system-ui,-apple-system,'Segoe UI',sans-serif;
  --fs-1:calc(9px*var(--ui));--fs-2:calc(10px*var(--ui));--fs-3:calc(11px*var(--ui));--fs-4:calc(12px*var(--ui));--fs-5:calc(13px*var(--ui));
  --fs-6:calc(14px*var(--ui));--fs-7:calc(16px*var(--ui));--fs-8:calc(20px*var(--ui));--fs-9:calc(26px*var(--ui));--fs-10:calc(44px*var(--ui));
  --ls-1:.1em;--ls-2:.14em;--ls-3:.2em;--ls-head:.26em;--ls-key:.18em;--ls-ctl:.12em;--ls-meta:.06em;--ls-brand:.22em;
  /* space */
  --s1:calc(2px*var(--ui));--s2:calc(4px*var(--ui));--s3:calc(6px*var(--ui));--s4:calc(8px*var(--ui));--s5:calc(10px*var(--ui));
  --s6:calc(12px*var(--ui));--s7:calc(16px*var(--ui));--s8:calc(20px*var(--ui));--s9:calc(26px*var(--ui));
  --gut:clamp(12px,2.1vw,34px);--r1:2px;--r2:3px;
  /* motion */
  --t:.16s ease;--ease-settle:cubic-bezier(.2,.8,.2,1);--ease-thunk:cubic-bezier(.7,0,.3,1);--dur-in:.22s;--dur-screen:.4s;
}

/* 1 · BASE — .ledger is the site root (put it on <body>) --------------------- */
:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)),:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::before,:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::after{box-sizing:border-box}
.ledger{position:relative;overflow:hidden;min-width:0;container-type:inline-size;container-name:ledger;font-family:var(--sans);font-size:var(--fs-5);line-height:1.4;color:var(--ink);background:var(--bg);
  -webkit-font-smoothing:antialiased;text-shadow:0 1px 1px rgba(0,0,0,.55);--gut:calc(28px*var(--ui))}
.ledger a{color:var(--gold);text-decoration:none}.ledger a:hover{color:var(--gold-warm)}
.ledger button,.ledger input{font-family:inherit;color:inherit}
.ledger button{margin:0}
/* AND A BARE BUTTON KEEPS THE BROWSER'S OWN CHROME UNLESS SOMETHING TAKES IT.
   Settings' tab strip is `<button class="subtab">`, and `.subtab` sets colour,
   padding and a bottom rule but never background, border or appearance -- the
   old sheet had a global button reset and the fence keeps it out of `.ledger`.
   So seven tabs drew as light-grey system buttons wearing this sheet's pale
   ink: white on white, unreadable, on a screen an officer opens to decide who
   may do what.

   TYPE SELECTOR ONLY, INSIDE :where(), SO IT WEIGHS (0,0,1). `.ledger button`
   above is (0,1,1) and would outrank every `.btn` rule in this sheet, which are
   deliberately (0,1,0); this has to lose to all of them and beat only the user
   agent. Padding is left alone on purpose -- it is the one thing a bare button
   in this design sometimes still wants from the UA. */
:where(.ledger) button{-webkit-appearance:none;appearance:none;background:none;
  border:0;color:inherit;font:inherit;text-align:inherit}
.ledger :focus-visible{outline:1px solid var(--gold);outline-offset:2px}
.ledger img{display:block;max-width:100%}
.ledger p{margin:0}

/* 2 · LAYOUT — one gap scale, never per-element margins ---------------------- */
.row:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:center;min-width:0}.col:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-direction:column;min-width:0}
.row-base:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){align-items:baseline}.row-top:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){align-items:flex-start}
.g1:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){gap:var(--s1)}.g2:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){gap:var(--s2)}.g3:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){gap:var(--s3)}.g4:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){gap:var(--s4)}.g5:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){gap:var(--s5)}.g6:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){gap:var(--s6)}.g7:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){gap:var(--s7)}.g8:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){gap:var(--s8)}
.grow:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){flex:1 1 0;min-width:0}.grow-0:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){flex:none}.min0:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){min-width:0}.wrap:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){flex-wrap:wrap}.spacer:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){flex:1}
.ellipsis:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nowrap:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){white-space:nowrap}
.right:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){text-align:right}.end:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){justify-content:flex-end}.between:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){justify-content:space-between}.center:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){justify-content:center}

/* 3 · TYPE — two faces, ten steps, one ink ramp ------------------------------ */
.heading:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--serif);font-size:var(--fs-4);font-weight:600;letter-spacing:var(--ls-head);text-transform:uppercase;color:var(--gold);
  text-shadow:0 1px 0 rgba(0,0,0,.55),0 0 14px rgba(216,180,90,.28)}
.label:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--mono);font-size:var(--fs-2);font-weight:600;letter-spacing:var(--ls-key);text-transform:uppercase;color:var(--gold-ash)}
.meta:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--mono);font-size:var(--fs-2);letter-spacing:var(--ls-meta);color:var(--ink-4);line-height:1.5}
.meta-ash:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--mono);font-size:var(--fs-2);letter-spacing:var(--ls-meta);color:var(--gold-ash)}
.lead:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-size:var(--fs-5);line-height:1.55;color:var(--ink-2)}
.mono:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--mono);font-variant-numeric:tabular-nums}
.serif:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--serif)}
.caps:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){text-transform:uppercase;letter-spacing:var(--ls-2)}
.t1:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-size:var(--fs-1)}.t2:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-size:var(--fs-2)}.t3:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-size:var(--fs-3)}.t4:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-size:var(--fs-4)}.t5:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-size:var(--fs-5)}
.t6:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-size:var(--fs-6)}.t7:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-size:var(--fs-7)}.t8:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-size:var(--fs-8)}.t9:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-size:var(--fs-9)}.t10:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-size:var(--fs-10)}
.c-ink:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--ink)}.c-2:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--ink-2)}.c-3:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--ink-3)}.c-4:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--ink-4)}.c-5:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--ink-5)}
.c-gold:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--gold)}.c-warm:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--gold-warm)}.c-good:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--good)}.c-warn:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--warn-2)}.c-bad:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--bad-lit)}
.c-read:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--cyan)}.c-esc:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--esc-lit)}

/* 4 · PLATE — the panel. Every boxed region on every screen is one. --------- */
.plate:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:relative;display:flex;flex-direction:column;min-width:0;
  background:var(--panel-4);background-image:var(--face);
  border:1px solid var(--line-3);border-top-color:rgba(210,225,210,.17);border-radius:var(--r2);
  box-shadow:var(--bevel),var(--cast)}
.plate:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::before{content:"";position:absolute;inset:5px;pointer-events:none;border-radius:1px;z-index:1;
  background:
    radial-gradient(circle at 0 0,var(--rivet) 0 1.4px,var(--rivet-shade) 1.4px 2.6px,transparent 2.7px),
    radial-gradient(circle at 100% 0,var(--rivet) 0 1.4px,var(--rivet-shade) 1.4px 2.6px,transparent 2.7px),
    radial-gradient(circle at 0 100%,var(--rivet) 0 1.4px,var(--rivet-shade) 1.4px 2.6px,transparent 2.7px),
    radial-gradient(circle at 100% 100%,var(--rivet) 0 1.4px,var(--rivet-shade) 1.4px 2.6px,transparent 2.7px)}
.plate-bare:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){--rivet:transparent;--rivet-shade:transparent;background:transparent;border-color:transparent;box-shadow:none}
.plate-lit:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--gold-line);box-shadow:var(--bevel),var(--cast),0 0 26px -12px var(--glow-live)}
.plate-owed:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--warn);box-shadow:var(--bevel),var(--cast),0 0 26px -12px var(--glow-owed)}
.plate-head:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:relative;display:flex;align-items:center;flex-wrap:wrap;gap:var(--s3) var(--s5);
  padding:calc(18px*var(--ui)) var(--s8) calc(9px*var(--ui));border-bottom:1px solid var(--rule-head)}
.plate-head-sub:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-size:max(10px,var(--fs-3));color:var(--ink-3);min-width:0}
.plate-head-meta:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){margin-left:auto;flex:none;font-family:var(--mono);font-size:max(10px,var(--fs-3));letter-spacing:var(--ls-meta);color:var(--ink-3)}
.plate-head-sm:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){padding:var(--s5) 0 var(--s2);gap:var(--s2) var(--s4);border-bottom-color:var(--hair)}
.plate-body:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-direction:column;gap:var(--s6);padding:var(--s7) var(--s8) var(--s8)}
.plate-body-flush:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){padding:0;gap:0}

/* 5 · RAIL — one row in any list. 600 brothers or 6 desks, same rail. ------- */
.rail:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:relative;display:flex;align-items:center;gap:var(--s4);min-width:0;padding:var(--s4) var(--s8);
  border-bottom:1px solid var(--rule);transition:background var(--t),box-shadow var(--t)}
.rail-grid:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:grid;align-items:center;gap:9px}
.rail-sm:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){padding:var(--s2) var(--s3);gap:var(--s3);border-bottom-color:transparent}
.rail-act:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){cursor:pointer}
.rail-act:hover:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){background:var(--lift);box-shadow:inset 3px 0 0 var(--gold-dim)}
.rail-on:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){background:var(--panel-3);box-shadow:inset 3px 0 0 var(--gold-lit),0 0 20px -12px var(--glow-live)}
.rail-you:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){background:var(--panel-3);box-shadow:inset 3px 0 0 var(--gold)}
.rail-owed:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){box-shadow:inset 3px 0 0 var(--warn)}
.rail-spent:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--ink-5)}
.rail-you.rail-act:hover:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){box-shadow:inset 3px 0 0 var(--gold-lit)}
.rail-group:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:baseline;gap:var(--s4);padding:var(--s6) var(--s8) var(--s3);border-bottom:1px solid var(--hair)}
.rail-state:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){flex:none;display:flex;align-items:center;justify-content:flex-end;gap:var(--s3);min-width:calc(96px*var(--ui))}
.rail:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .on-hover{opacity:0;transition:opacity var(--t)}
.rail:hover:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .on-hover,.rail:focus-within:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .on-hover{opacity:1}
/* the key/value rail the filing, the auspex and the record all read as */
.kv:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-template-columns:calc(128px*var(--ui)) minmax(0,1fr) auto;gap:var(--s5);min-height:calc(40px*var(--ui))}
.kv-4:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-template-columns:calc(128px*var(--ui)) minmax(0,1fr) auto auto}
.kv-v:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-size:var(--fs-5);color:var(--ink);line-height:1.4;overflow-wrap:anywhere}
/* the roll — the roster's rail: standing · face · brother · company · points · reports · evidence */
/* SEVEN CELLS STILL, AND THREE OF THEM SAY SOMETHING ELSE. The roll drew
   standing, face, brother, company, points, reports and four verdict
   tallies; it draws standing, face, brother, company, last online, last
   post and on vox. The tallies' 300px block is gone and the three that
   replaced it are even, because none of them is more important than the
   others -- they are one question asked three ways. */
/* ==========================================================================
   EVERY TABLE SHARES THE WIDTH IT HAS, RATHER THAN CLAIMING A FIXED SLICE.

   Owner, with a screenshot of the roster's LAST ONLINE chip sitting on top of
   LAST POST: "every column has this problem, roster reports battle honors ALL
   need to be spaced with the dom size % not dedicated spaceing."

   He is right, and the fault is not that the tracks were too narrow -- it is
   that they were FIXED. `calc(132px * var(--ui))` is 132px at every window
   width, so a chip reading "OFFLINE · 41 MINUTES AGO" overflowed its own
   column and printed across the one beside it; and at 1720px the same tracks
   left the page half empty while still overlapping.

   PROPORTIONAL TRACKS, AND minmax(0, ...) ON EVERY ONE OF THEM. The zero floor
   is the half that actually stops the overlap: a bare `1fr` floors at
   min-content, which for a nowrap chip is the chip's whole width, so the track
   refuses to shrink and the content escapes. `minmax(0,1fr)` lets the track be
   as narrow as the layout needs and the cell clip instead -- which is why the
   rule below giving every grid cell `min-width:0` is part of the same fix and
   not a tidy-up.

   WHAT STAYS FIXED, AND ONLY THIS: a standing number and an avatar circle are
   PHYSICAL sizes -- a 28px face is 28px on any monitor -- so those two tracks
   keep their pixels. Everything that holds words is a share.
   ========================================================================== */
.rail-grid:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) > *{min-width:0}

/* AND A CELL OF WORDS ENDS IN AN ELLIPSIS RATHER THAN IN THE NEXT COLUMN. */
.rail-grid:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) > .meta,
.rail-grid:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) > .mono,
.rail-grid:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) > .kv-v{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.roll-row:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-template-columns:calc(28px*var(--ui)) minmax(0,3fr) minmax(0,1fr) minmax(0,1.6fr) minmax(0,1.2fr) minmax(0,1.3fr);column-gap:var(--s5);min-height:calc(46px*var(--ui))}
.roll-hdr:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){min-height:0;padding-top:var(--s4);padding-bottom:var(--s3);border-bottom-color:var(--rule-head)}
.roll-hdr:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .tallies .label{text-align:right;letter-spacing:.04em;font-size:var(--fs-1)}
.roll-item:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:contents}
.roll-name:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--serif);font-size:var(--fs-7);font-weight:600;color:var(--ink);line-height:1.1}
.rail-you:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .roll-name{color:var(--gold-warm)}
.rank-n:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--mono);font-size:var(--fs-2);font-variant-numeric:tabular-nums;color:var(--ink-4);text-align:right}
.rank-top:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--gold);font-weight:700}
.pts:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--mono);font-size:var(--fs-6);font-weight:500;font-variant-numeric:tabular-nums;color:var(--gold-warm);text-align:right}
.tallies:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s3)}
.tally:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:inline-flex;align-items:center;justify-content:flex-end;gap:var(--s2);font-family:var(--mono);font-size:var(--fs-3);font-variant-numeric:tabular-nums;color:var(--ink-3)}
.tally:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::before{content:"";flex:none;width:5px;height:5px;border-radius:50%;background:var(--lamp,var(--ink-5));box-shadow:0 0 6px var(--lamp,transparent)}
.tally-read:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){--lamp:var(--good)}.tally-wait:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){--lamp:var(--ink-4)}.tally-owed:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){--lamp:var(--warn-2)}.tally-bad:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){--lamp:var(--bad-lit)}
.tally-zero:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--ink-6)}.tally-zero:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::before{opacity:.3;box-shadow:none}
.rail-detail:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-direction:column;gap:var(--s5);padding:var(--s5) var(--s7) var(--s6) calc(88px*var(--ui));border-bottom:1px solid var(--rule);background:rgba(0,0,0,.12)}
.stats-6:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-template-columns:repeat(6,minmax(0,1fr))}
.objs:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-direction:column;gap:var(--s2);padding:var(--s5) var(--s8);border-bottom:1px solid var(--rule)}
.obj:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;justify-content:space-between;gap:var(--s5);padding:var(--s1) 0;border-bottom:1px dashed var(--hair);
  font-family:var(--mono);font-size:var(--fs-2);color:var(--ink-3)}
.obj:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) b{font-weight:500;color:var(--ink-2);font-variant-numeric:tabular-nums}

/* 6 · CREW — a person. Whose he is must read before his name does. --------- */
.crew-group:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:baseline;gap:var(--s4);padding:var(--s3) 0;border-bottom:1px solid var(--hair)}
.crew-list:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-direction:column;gap:var(--s5)}
.crew-card:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;
  grid-template-areas:"id state" "stats stats" "ask ask" "acts acts" "note note";
  gap:var(--s5) var(--s6);padding:var(--s7) calc(18px*var(--ui)) calc(17px*var(--ui));
  background:var(--panel-3);background-image:var(--face);border:1px solid var(--line-3);border-radius:var(--r2);box-shadow:var(--bevel);
  transition:border-color var(--t),box-shadow var(--t),transform var(--t)}
.crew-id:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:id;display:flex;align-items:center;gap:var(--s5);min-width:0}
.crew-name:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--serif);font-size:var(--fs-7);font-weight:600;line-height:1.1;color:var(--ink);overflow-wrap:anywhere}
.crew-place:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){}
.crew-state:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:state;display:flex;flex-direction:column;align-items:flex-end;gap:var(--s2);text-align:right;min-width:0}
.crew-state:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .stamp{max-width:calc(260px*var(--ui))}
.crew-stats:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:stats;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;
  background:var(--hair);border:1px solid var(--hair);border-radius:var(--r1);overflow:hidden;box-shadow:var(--sink)}
.stat:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-direction:column;gap:2px;padding:var(--s3) var(--s4);background:var(--bg);min-width:0}
.stat-k:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--mono);font-size:var(--fs-1);letter-spacing:var(--ls-1);text-transform:uppercase;color:var(--ink-4);line-height:1.2}
.stat-v:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--mono);font-size:var(--fs-5);font-variant-numeric:tabular-nums;color:var(--ink-2)}
.stat-total:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .stat-v{color:var(--gold-warm);font-weight:500}
.crew-ask:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:ask;display:flex;gap:var(--s4);padding:var(--s4) var(--s5);border-left:2px solid var(--esc);
  background:rgba(122,146,196,.08);font-size:var(--fs-4);line-height:1.5;color:var(--ink-2)}
.crew-acts:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:acts;display:flex;align-items:center;flex-wrap:wrap;gap:var(--s4)}
.crew-pts:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){margin-left:auto;display:flex;align-items:center;gap:var(--s3)}
.crew-note:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:note;display:flex;gap:var(--s4)}
.crew-note:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .field{flex:1}
.crew-mine:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--gold-line);box-shadow:var(--bevel),var(--cast),0 0 34px -14px var(--glow-live)}
.crew-mine:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::after{content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:3px;background:var(--gold);border-radius:var(--r2) 0 0 var(--r2);box-shadow:0 0 10px var(--glow-live)}
.crew-other:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){opacity:.72;filter:saturate(.55)}
/* THE CONTROLS FOLLOW THE CAPABILITY, NOT THE SQUAD. This read
   `.crew-other .crew-acts,.crew-other .crew-note` -- Fable's model, where a
   card outside your own squad is not yours to act on. The owner's rule is
   different and he stated it twice: "ALL aars are approved by the company
   sgt but anyone sgt or higher can approve an aar". The card still NAMES
   the sergeant it is addressed to -- that is `.crew-other` and the band
   over the arch, and both stay -- but a lieutenant reading it may act, and
   with this rule on the squad he could not: three buttons rendered into a
   `display:none` row, which is why the owner could see no approve or
   reject button anywhere on the site.
   `.crew-locked` is set from the server's own approve_aar answer, so a
   brother who holds nothing loses them on every card -- including his own
   squad's, where they used to draw and then refuse him. */
.crew-locked:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .crew-acts,.crew-locked:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .crew-note,.crew-credited:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .crew-acts,.crew-escalated:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .crew-acts{display:none}
.crew-you:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .crew-name{color:var(--gold-warm)}
.crew-credited:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .stamp{color:var(--good)}
.crew-escalated:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .stamp{color:var(--esc-lit)}
.add-man:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){margin-left:auto}
.standing:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(28px*var(--ui));align-items:end;padding:calc(40px*var(--ui)) var(--s8) var(--s6)}

/* 7 · ATOMS ------------------------------------------------------------------ */
.btn:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:var(--s3);
  min-height:calc(34px*var(--ui));padding:0 var(--s6);border:1px solid var(--line-3);border-radius:var(--r1);
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(0,0,0,.12));
  font-family:var(--mono);font-size:var(--fs-2);font-weight:500;letter-spacing:var(--ls-ctl);text-transform:uppercase;
  color:var(--ink-2);text-align:center;white-space:nowrap;box-shadow:var(--bevel);
  transition:background var(--t),box-shadow var(--t),color var(--t),border-color var(--t),transform .08s var(--ease-thunk)}
.btn:hover:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--ink);border-color:var(--gold-line);background:linear-gradient(180deg,rgba(255,236,180,.08),rgba(0,0,0,.14))}
.btn:active:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){transform:translateY(2px);box-shadow:var(--sink)}
.btn:disabled:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){cursor:not-allowed;opacity:.45;transform:none;box-shadow:none}
.btn-sm:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){min-height:calc(26px*var(--ui));padding:0 var(--s4);font-size:var(--fs-1);letter-spacing:var(--ls-1)}
.btn-lg:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){min-height:calc(46px*var(--ui));padding:0 calc(34px*var(--ui));font-size:var(--fs-6);letter-spacing:var(--ls-3)}
.btn-quiet:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:transparent;background:transparent;box-shadow:none;color:var(--ink-3)}
.btn-gold:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:#6D5220;background:linear-gradient(180deg,var(--gold-lit),#A9832A);color:var(--ink-on-gold);
  box-shadow:inset 0 1px 0 rgba(255,236,180,.55),0 1px 0 var(--edge-dark)}
.btn-bad:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:rgba(155,44,36,.7);color:var(--bad-lit);background:linear-gradient(180deg,rgba(155,44,36,.14),rgba(0,0,0,.3))}
.btn-bad:hover:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--bad);color:#E0857C}
.btn-bad:active:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){transform:translateY(3px)}
.btn-esc:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:rgba(122,146,196,.5);color:var(--esc-lit)}
.btn-outline:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--gold-line);color:var(--gold)}
/* THE SEAL — crediting a brother. Travel, a seated thunk, light that answers. */
.seal:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:relative;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:var(--s3);
  min-height:calc(44px*var(--ui));padding:0 var(--s8);border:1px solid #6D5220;border-radius:var(--r1);
  background:linear-gradient(180deg,var(--gold-warm),var(--gold-lit) 40%,#A9832A);
  font-family:var(--mono);font-size:var(--fs-3);font-weight:700;letter-spacing:var(--ls-head);text-transform:uppercase;
  color:var(--ink-on-gold);text-shadow:0 1px 0 rgba(255,236,180,.35);
  box-shadow:inset 0 1px 0 rgba(255,236,180,.6),inset 0 -2px 0 rgba(0,0,0,.18),0 4px 0 #5A4118,0 12px 20px -8px rgba(0,0,0,.85),0 0 28px -8px var(--glow-live);
  transition:transform .09s var(--ease-thunk),box-shadow .09s var(--ease-thunk),filter var(--t)}
.seal:hover:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){filter:brightness(1.06)}
.seal:active:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){transform:translateY(4px);
  box-shadow:inset 0 1px 0 rgba(255,236,180,.3),inset 0 2px 6px rgba(0,0,0,.35),0 0 0 #5A4118,0 2px 4px -2px rgba(0,0,0,.8),0 0 40px -6px var(--glow-live)}
.chip:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:inline-flex;align-items:center;gap:var(--s2);border:1px solid var(--gold-line);border-radius:var(--r1);
  padding:calc(2px*var(--ui)) var(--s3);font-family:var(--mono);font-size:var(--fs-1);font-weight:500;letter-spacing:var(--ls-ctl);
  text-transform:uppercase;color:var(--ink-3);background:transparent;white-space:nowrap}
.chip-on:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){background:var(--panel-on);color:var(--ink)}
.chip-you:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--gold);color:var(--ink-on-gold);background:var(--gold);text-shadow:none}
.chip-bad:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--bad-lit);border-color:var(--bad)}
.chip-dim:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--line-2);color:var(--ink-4)}
.views:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-wrap:wrap;gap:var(--s3)}
.views:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .chip{cursor:pointer;min-height:calc(28px*var(--ui));padding:0 var(--s5)}
.field-find:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){width:calc(220px*var(--ui))}
.you-stand:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){margin-left:auto}
.only-phone:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:none}
.mark:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:inline-flex;align-items:center;gap:var(--s3);flex:none;padding:var(--s2) var(--s4);
  border:1px solid var(--line-3);border-radius:var(--r1);font-family:var(--mono);font-size:var(--fs-1);font-weight:500;
  letter-spacing:var(--ls-2);text-transform:uppercase;white-space:nowrap;color:var(--ink-3)}
.mark-sm:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){padding:0 var(--s2)}
.mark-live:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--gold-warm);border-color:var(--gold-line);background:var(--lift);box-shadow:0 0 14px -6px var(--glow-live)}
.mark-read:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--good);border-color:var(--good-2);box-shadow:0 0 14px -6px var(--glow-read)}
.mark-owed:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--warn-2);border-color:var(--warn);box-shadow:0 0 14px -6px var(--glow-owed)}
.mark-esc:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--esc-lit);border-color:var(--esc);box-shadow:0 0 14px -6px var(--glow-esc)}
.mark-bad:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--bad-lit);border-color:var(--bad)}
.mark-spent:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--ink-5);border-color:var(--line-3)}
.mark-lamp:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 7px currentColor}
.avatar:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:center;justify-content:center;flex:none;width:calc(28px*var(--ui));height:calc(28px*var(--ui));
  border-radius:50%;overflow:hidden;background:var(--tile);border:1px solid var(--tile-edge);
  font-family:var(--mono);font-size:var(--fs-1);color:var(--ink-2);box-shadow:var(--sink)}
.avatar-sm:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){width:calc(22px*var(--ui));height:calc(22px*var(--ui))}
.avatar-lg:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){width:calc(44px*var(--ui));height:calc(44px*var(--ui));font-size:var(--fs-4)}
.avatar-officer:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--gold)}.avatar-sgt:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--gold-dim)}
.avatar-me:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){width:calc(64px*var(--ui));height:calc(64px*var(--ui));font-size:var(--fs-8);border-color:var(--gold-line)}
.field:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){min-height:calc(34px*var(--ui));border:1px solid var(--gold-line);background:var(--bg);padding:0 var(--s4);
  font-family:var(--mono);font-size:var(--fs-4);color:var(--ink);outline:none;border-radius:var(--r1);box-shadow:var(--sink)}
.field:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::placeholder{color:var(--ink-5)}
.field:focus:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--gold)}
.field-wide:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){width:100%}
.tiles:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-bottom:1px solid var(--line)}
.tile:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-direction:column;gap:var(--s2);padding:var(--s6) var(--s8);border-right:1px solid var(--line);min-width:0}
.tile:last-child:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-right:0}
.tiles-3:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-template-columns:repeat(3,minmax(0,1fr))}
.tile-n:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--mono);font-size:var(--fs-9);font-weight:500;font-variant-numeric:tabular-nums lining-nums;color:var(--ink);line-height:1.1}
.tile-n:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) small{font-size:var(--fs-2);color:var(--ink-4);letter-spacing:var(--ls-meta);font-weight:400}
.tile-word:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-size:var(--fs-6);letter-spacing:var(--ls-2);text-transform:uppercase;padding-top:calc(7px*var(--ui))}
.empty:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:center;justify-content:center;padding:var(--s8);text-align:center;
  font-family:var(--mono);font-size:var(--fs-2);letter-spacing:var(--ls-2);text-transform:uppercase;color:var(--ink-5);
  border:1px dashed var(--line-3);border-radius:var(--r1)}
.discrep:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;gap:var(--s5);padding:var(--s6) var(--s7);border:1px solid var(--warn);border-radius:var(--r1);
  background:rgba(181,112,90,.08);box-shadow:0 0 24px -14px var(--glow-owed);color:var(--ink-2);font-size:var(--fs-5);line-height:1.55}
.discrep:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .label{color:var(--warn-2);flex:none;padding-top:2px}
.worth:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:center;gap:var(--s6)}
.worth-n:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--serif);font-size:calc(56px*var(--ui));font-weight:600;line-height:1;color:var(--gold-warm);text-shadow:0 0 24px rgba(216,180,90,.3)}
.working:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){align-items:baseline}
.working:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .mono{flex:none;min-width:calc(24px*var(--ui))}

/* 8 · EVIDENCE --------------------------------------------------------------- */
.gallery:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:grid;grid-template-columns:repeat(auto-fill,minmax(calc(240px*var(--ui)),1fr));gap:var(--s6)}
.shot:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:relative;aspect-ratio:16/10;overflow:hidden;cursor:pointer;margin:0;border:1px solid var(--hair-2);border-radius:var(--r1);
  background:#0B1310;box-shadow:var(--sink);transition:border-color var(--t),transform var(--t),box-shadow var(--t)}
.shot:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) img{width:100%;height:100%;object-fit:cover;filter:saturate(.9) brightness(.92);transition:filter var(--t),transform .5s var(--ease-settle)}
.shot:hover:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--gold);transform:translateY(-2px);box-shadow:var(--cast)}
.shot:hover:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) img{filter:none;transform:scale(1.03)}
.shot-tags:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:absolute;top:var(--s4);left:var(--s4);display:flex;gap:var(--s3)}
.shot-badge:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){padding:calc(3px*var(--ui)) var(--s3);font-family:var(--mono);font-size:var(--fs-1);font-weight:500;letter-spacing:var(--ls-1);
  text-transform:uppercase;border-radius:var(--r1);color:var(--gold-warm);border:1px solid var(--gold-line);background:rgba(10,16,13,.85)}
.shot-badge-read:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--good);border-color:var(--good-2)}

/* 9 · SHELL — nav, the screen grid, the console, the candles, the perches --- */
.topbar:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:relative;z-index:5;display:flex;align-items:center;gap:calc(30px*var(--ui));padding:var(--s6) var(--gut);
  background:rgba(9,15,12,.9);border-bottom:1px solid var(--hair)}
.brand:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:center;gap:var(--s5)}
.sigil:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){width:calc(26px*var(--ui));height:calc(26px*var(--ui));object-fit:contain}
.wordmark:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--serif);font-size:var(--fs-6);font-weight:600;letter-spacing:var(--ls-brand);text-transform:uppercase;color:var(--ink);white-space:nowrap}
.nav:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;gap:calc(22px*var(--ui))}
.navtab:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--mono);font-size:calc(10.5px*var(--ui));letter-spacing:var(--ls-2);text-transform:uppercase;color:var(--ink-4);
  padding:var(--s2) 0;border-bottom:1px solid transparent;cursor:pointer;white-space:nowrap;transition:color var(--t)}
.navtab:hover:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--ink-2)}
.navtab-on:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){color:var(--gold);border-bottom-color:var(--gold)}
.topbar-end:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){margin-left:auto;display:flex;align-items:center;gap:var(--s5)}
.aar:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:relative;display:grid;gap:var(--s7);padding:var(--s8) var(--gut) calc(250px*var(--ui));align-items:start;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  grid-template-areas:"head head" "team team" "filing auspex" "evidence record" "notes notes"}
.a-head:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:head}.a-team:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:team}.a-filing:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:filing}.a-auspex:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:auspex}
.a-evidence:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:evidence}.a-record:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:record}.a-notes:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:notes}
/* the record as one table: what was filed beside what the auspex read, one row per field */
.a-cmp:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:cmp;display:none}
.cmp-row:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-template-columns:minmax(calc(64px*var(--ui)),calc(92px*var(--ui))) minmax(0,1fr) minmax(0,1fr) calc(100px*var(--ui));min-height:calc(34px*var(--ui))}
.cmp-hdr:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){min-height:0;padding-top:var(--s4);padding-bottom:var(--s2);border-bottom-color:var(--rule-head)}
.cmp-row:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .kv-v{font-size:var(--fs-4);overflow-wrap:normal;word-break:normal}
.cmp-diff:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .kv-v{color:var(--warn-2)}
.cmp-diff:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .kv-v.c-read{color:var(--cyan)}
.cmp-foot:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-direction:column;gap:var(--s5);padding:var(--s6) var(--s8) 0}
.head-acts:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:center;flex-wrap:wrap;gap:var(--s4);padding:var(--s5) var(--s8)}
.roster:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:relative;display:grid;gap:var(--s7);padding:var(--s8) var(--gut) calc(250px*var(--ui));align-items:start;
  grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "standing" "roll"}
.r-head:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:head}.r-standing:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:standing}.r-roll:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-area:roll}
.companies:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s7);align-items:start}
/* every other screen: one grid, sections in source order, the head across the top */
.screen:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:relative;display:grid;gap:var(--s7);padding:var(--s8) var(--gut) calc(250px*var(--ui));align-items:start;grid-template-columns:minmax(0,1fr)}
.screen-2:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.screen-wizard:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
.s-head:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)),.span-2:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-column:1/-1}
.tiles-5:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-template-columns:repeat(5,minmax(0,1fr))}
.field-date:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){width:calc(110px*var(--ui))}
/* reports */
/* THE BROTHERS COLUMN HOLDS NAMES NOW and takes the width for it. It was
   120px of overlapping initials; it is 260px of face-and-name, which is
   what the owner asked to read. The page got wider in the same pass, so
   nothing else gave anything up for it. */
.rep-row:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-template-columns:minmax(0,1.7fr) minmax(0,1fr) minmax(0,3fr) minmax(0,1.1fr) minmax(0,2.4fr) minmax(0,.6fr) minmax(0,.7fr) minmax(0,1.2fr);column-gap:var(--s5);min-height:calc(46px*var(--ui))}
.faces:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:center}
.faces:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .avatar{margin-left:calc(-8px*var(--ui));box-shadow:0 0 0 2px var(--bg)}
.faces:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .avatar:first-child{margin-left:0}
.faces:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .meta{margin-left:var(--s3)}
/* the filing wizard */
.steps:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-wrap:wrap;gap:var(--s3)}
.radio:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){flex:none;width:calc(14px*var(--ui));height:calc(14px*var(--ui));border-radius:50%;border:1px solid var(--gold-line);box-shadow:var(--sink)}
.radio-on:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){background:var(--gold);border-color:var(--gold);box-shadow:0 0 10px var(--glow-live)}
.drop:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s3);min-height:calc(160px*var(--ui));padding:var(--s7);
  border:1px dashed var(--gold-line);border-radius:var(--r2);background:rgba(0,0,0,.18);color:var(--ink-2);text-align:center;
  font-family:var(--mono);font-size:var(--fs-3);letter-spacing:var(--ls-2);text-transform:uppercase}
.thumbs:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s4)}
.thumb:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:relative;aspect-ratio:16/10;overflow:hidden;border:1px solid var(--hair-2);border-radius:var(--r1);background:#0B1310}
.thumb:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) img{width:100%;height:100%;object-fit:cover;filter:saturate(.9) brightness(.85)}
.thumb-queued:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) img{opacity:.35}
.thumb-x:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:absolute;top:4px;right:4px;display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;cursor:pointer;
  border:1px solid var(--line-3);background:rgba(10,16,13,.85);color:var(--ink-2);font-family:var(--mono);font-size:11px}
.thumb-state:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:absolute;left:4px;bottom:6px}
.bar:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(0,0,0,.6)}
.bar-fill:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){height:100%;background:var(--cyan);box-shadow:0 0 8px var(--cyan)}
.picks:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:grid;grid-template-columns:repeat(auto-fill,minmax(calc(170px*var(--ui)),1fr));gap:var(--s3)}
.pick:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:center;gap:var(--s3);min-width:0;padding:var(--s3) var(--s4);cursor:pointer;border:1px solid var(--hair);border-radius:var(--r1);background:rgba(0,0,0,.14)}
.pick:hover:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--gold-line)}
.pick-on:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--gold);background:var(--lift);box-shadow:0 0 14px -6px var(--glow-live)}
.chosen:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-wrap:wrap;gap:var(--s3)}
.chip-x:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){cursor:pointer;color:var(--ink-4);padding-left:var(--s2)}
.wiz-nav:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:center;gap:var(--s4);padding-top:var(--s5);border-top:1px solid var(--hair)}
.auspex-total:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:center;gap:var(--s5);padding-top:var(--s6);border-top:1px solid var(--rule-head)}
/* the filing route: no nav, a slim bar, the two plates, a foot with one key */
.filing:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-direction:column;min-height:calc(760px*var(--ui))}
.filing-bar:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){justify-content:flex-start;gap:var(--s5)}
.filing:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .screen{flex:1;width:100%;padding-bottom:var(--s9);align-content:start}
.filing-foot:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:center;gap:var(--s5);padding:var(--s5) var(--gut);border-top:1px solid var(--gold-line);background:rgba(9,15,12,.94)}
.seal:disabled:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){cursor:not-allowed;filter:saturate(.35) brightness(.7);transform:none;box-shadow:inset 0 1px 0 rgba(255,236,180,.2),0 4px 0 #3E2C10}
/* strategium */
.tree:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-direction:column;gap:var(--s4)}
.tree-l:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-direction:column;gap:var(--s4);margin-left:calc(22px*var(--ui));padding-left:calc(18px*var(--ui));border-left:1px solid var(--gold-line)}
.post:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:center;gap:var(--s4);min-width:0;padding:var(--s4) var(--s5);border:1px solid var(--line-3);border-radius:var(--r2);background:var(--panel-3)}
.post-name:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--serif);font-size:var(--fs-6);font-weight:600;color:var(--ink);line-height:1.1}
.post-title:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--mono);font-size:var(--fs-1);letter-spacing:var(--ls-2);text-transform:uppercase;color:var(--gold-ash)}
.post-desk:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--gold-line);box-shadow:0 0 20px -10px var(--glow-live)}
.grip:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){flex:none;color:var(--ink-5);font-family:var(--mono);font-size:var(--fs-4);cursor:grab;letter-spacing:-.2em}
.grip:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::before{content:"⋮⋮"}
.days:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){width:calc(52px*var(--ui));justify-content:center;display:inline-flex;align-items:center}
.desk-row:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) auto}
/* battle honours */
.honours:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s5)}
.honour:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-direction:column;gap:var(--s3);min-width:0;padding:var(--s6) var(--s6) var(--s5);border:1px solid var(--line-3);border-radius:var(--r2);background:var(--panel-3)}
.honour-name:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--serif);font-size:var(--fs-7);font-weight:600;color:var(--gold-warm);line-height:1.1}
.honour-quest:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-size:var(--fs-3);line-height:1.45;color:var(--ink-3)}
.honour-holder:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:center;gap:var(--s3);min-width:0;padding-top:var(--s3);border-top:1px solid var(--hair);font-family:var(--mono);font-size:var(--fs-2);color:var(--ink-2)}
.honour-open:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){opacity:.55}
.honour-open:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .honour-name{color:var(--ink-3)}
.stat-row:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-template-columns:minmax(0,2.9fr) minmax(0,1fr) repeat(8,minmax(0,.78fr)) minmax(0,1fr);column-gap:var(--s4);min-height:calc(42px*var(--ui))}
/* the codex */
.codex-n:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){font-family:var(--serif);font-size:var(--fs-10);font-weight:400;line-height:1;color:var(--gold);opacity:.8}
.tariff:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-template-columns:minmax(0,1fr) auto;min-height:calc(40px*var(--ui))}
.field-n:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:inline-flex;align-items:center;justify-content:center;width:calc(56px*var(--ui));min-height:calc(30px*var(--ui));padding:0;color:var(--gold-warm);font-weight:700;font-size:var(--fs-5)}
.law:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:center;flex-wrap:wrap;gap:var(--s4);padding:var(--s5) var(--s7);border:1px solid var(--warn);border-radius:var(--r1);background:rgba(181,112,90,.08);box-shadow:0 0 24px -14px var(--glow-owed)}
.law:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .lead{color:var(--ink)}
.rule-foot:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-wrap:wrap;align-items:center;gap:var(--s4) var(--s7);padding:var(--s5) var(--s7);border-top:1px solid var(--hair)}
.proofs:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:inline-flex;flex-wrap:wrap;gap:var(--s3)}
/* authority */
.cap-wrap:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){overflow-x:auto}
.cap:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:grid;grid-template-columns:minmax(calc(180px*var(--ui)),1.6fr) repeat(8,minmax(calc(64px*var(--ui)),1fr));min-width:max-content}
.cap:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) > *{display:flex;align-items:center;justify-content:center;gap:var(--s2);min-height:calc(40px*var(--ui));padding:0 var(--s3);border-bottom:1px solid var(--rule);border-right:1px solid var(--hair)}
.cap:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) > *:nth-child(9n+1){justify-content:flex-start;padding-left:var(--s7)}
.cap:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) > *:nth-child(9n){border-right:0}
.cap:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) > .cap-h{min-height:0;padding-top:var(--s4);padding-bottom:var(--s3);border-bottom-color:var(--rule-head);text-align:center}
.yes:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 8px var(--glow-live)}
.yes-named:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){background:var(--esc-lit);box-shadow:0 0 8px var(--glow-esc)}
.no:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){width:6px;height:1px;background:var(--ink-6)}
.no-named:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){width:8px;height:8px;border-radius:50%;border:1px solid var(--bad-lit);background:transparent}
.toggle:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:relative;flex:none;width:calc(34px*var(--ui));height:calc(18px*var(--ui));cursor:pointer;border-radius:999px;border:1px solid var(--gold-line);background:rgba(0,0,0,.4);box-shadow:var(--sink)}
.toggle:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::after{content:"";position:absolute;top:2px;left:2px;width:calc(12px*var(--ui));height:calc(12px*var(--ui));border-radius:50%;background:var(--ink-4);transition:left var(--t),background var(--t)}
.toggle-on:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::after{left:calc(100% - 14px*var(--ui) - 2px);background:var(--gold);box-shadow:0 0 8px var(--glow-live)}
/* AND THE SAME FAULT WAITING IN THE SCOPE ROW: 96 fixed pixels for a word
   the chapter chooses -- "his company", "his command", "the chapter". Words
   get max-content; only figures get a number. */
.scope-row:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-template-columns:minmax(0,1fr) max-content minmax(0,1.6fr)}
/* THE RANK MARK IS AS WIDE AS THE RANK, NOT 84px. It was a fixed track and
   COMPANY MASTER wants 97 of them, so the mark printed 13px into "by rank"
   beside it -- "COMPANY MASTEBy rank" on the Inner Circle. A word that is
   whatever length the chapter gave it cannot have a number assigned to it;
   `max-content` is the honest track, and the name beside it gives the room.
   The last column is the × and stays `auto` -- it is a glyph. */
.named-row:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-template-columns:minmax(0,2fr) minmax(0,1.2fr) max-content minmax(0,1fr) auto}
/* audit */
.log-row:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-template-columns:calc(112px*var(--ui)) minmax(0,1.1fr) calc(128px*var(--ui)) minmax(0,1.1fr) minmax(0,1.4fr);column-gap:var(--s5);min-height:calc(44px*var(--ui))}
.quote:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){padding:var(--s4) var(--s6);border-left:2px solid var(--gold-dim);font-family:var(--serif);font-size:var(--fs-6);font-style:italic;line-height:1.4;color:var(--ink-2)}
/* the gate */
.signin:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:grid;place-items:center;min-height:calc(720px*var(--ui));padding:var(--s9) var(--gut) calc(200px*var(--ui))}
.gate:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;flex-direction:column;align-items:center;gap:var(--s6);width:min(100%,calc(360px*var(--ui)));text-align:center}
.shield:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){width:calc(120px*var(--ui));height:auto;filter:drop-shadow(0 18px 30px rgba(0,0,0,.9))}
.field-code:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){width:calc(200px*var(--ui));min-height:calc(44px*var(--ui));text-align:center;letter-spacing:.3em;font-size:var(--fs-7)}
.gate-or:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:center;gap:var(--s5);width:100%}
.gate-or:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::before,.gate-or:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::after{content:"";flex:1;height:1px;background:var(--hair-2)}
.company-open:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){grid-column:1/-1}
.team-body:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){gap:var(--s5)}
.console:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:absolute;right:calc(64px*var(--ui));bottom:0;width:calc(210px*var(--ui));pointer-events:none;z-index:2}
.console:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) img{width:100%;height:auto;filter:brightness(.6) saturate(.55) contrast(1.05);
  -webkit-mask-image:linear-gradient(180deg,#000 80%,transparent);mask-image:linear-gradient(180deg,#000 80%,transparent)}
.console-glass:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:absolute;left:21%;top:17.5%;width:58%;height:28%;border-radius:4px;
  background:radial-gradient(ellipse at 30% 20%,rgba(120,150,140,.14),rgba(0,0,0,.7) 60%);box-shadow:inset 0 0 20px rgba(0,0,0,.8)}
.candles:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:absolute;right:calc(18px*var(--ui));bottom:calc(10px*var(--ui));display:flex;align-items:flex-end;gap:var(--s4);z-index:2;pointer-events:none}
.candle:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){position:relative;display:block;width:calc(7px*var(--ui));height:calc(30px*var(--ui));border-radius:2px 2px 1px 1px;
  background:linear-gradient(180deg,#EFE3C8,#C9B48E 70%,#9B8B6C)}
.candle:nth-child(2):where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){height:calc(22px*var(--ui))}
.candle:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::before{content:"";position:absolute;left:50%;top:calc(-13px*var(--ui));width:calc(7px*var(--ui));height:calc(14px*var(--ui));
  margin-left:calc(-3.5px*var(--ui));border-radius:50% 50% 50% 50%/65% 65% 35% 35%;
  background:radial-gradient(circle at 50% 75%,#FFF4C2 0,#F0B24A 45%,rgba(226,160,58,0) 75%);
  box-shadow:0 0 22px 8px rgba(226,160,58,.32);transform-origin:50% 100%;animation:flicker 1.7s ease-in-out infinite alternate}
.candle:nth-child(2):where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::before{animation-duration:2.3s;animation-delay:-.8s}
/* where the servo-skull lands. Markers only — the solver is yours. */
.perch:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:none;position:absolute;z-index:6;align-items:center;gap:var(--s2);padding:3px 7px;border:1px dashed rgba(59,200,178,.65);border-radius:999px;
  background:rgba(5,11,9,.85);font-family:var(--mono);font-size:var(--fs-1);letter-spacing:var(--ls-2);text-transform:uppercase;color:var(--cyan);pointer-events:none;text-shadow:none}
.show-perches:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .perch{display:inline-flex}
.perch:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;box-shadow:0 0 6px currentColor}
.perch-head:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){top:-9px;right:calc(140px*var(--ui))}
.perch-team:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){top:-9px;left:42%}
.perch-gallery:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){top:-9px;right:calc(40px*var(--ui))}
.perch-console:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){top:5%;left:-6%}

/* states the wiring needs: loading, outage, forbidden ------------------------ */
.skeleton:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:block;height:calc(12px*var(--ui));border-radius:2px;background:linear-gradient(90deg,rgba(178,201,177,.06),rgba(178,201,177,.14),rgba(178,201,177,.06));background-size:200% 100%;animation:shimmer 1.4s linear infinite}
.skeleton-row:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){min-height:calc(46px*var(--ui));gap:var(--s5)}
.skeleton-row:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) .skeleton{flex:1}
.banner:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:flex;align-items:center;gap:var(--s5);padding:var(--s4) var(--gut);border-bottom:1px solid var(--warn);background:rgba(181,112,90,.10);color:var(--ink);font-family:var(--mono);font-size:var(--fs-3)}
.banner-esc:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-bottom-color:var(--esc);background:rgba(122,146,196,.10)}
.empty-bad:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--bad);color:var(--bad-lit)}

/* ==========================================================================
   THE LOOK — the agreed direction, folded onto the primitives above.
   Flat plates with a gold hairline and a centred serif head; three depth
   states (raised / recessed / lit); tables in a recess; men as arched cards.
   ========================================================================== */
html,body{margin:0}
body.ledger,.ledger.page{min-height:100vh}
.ledger .crew-credited .crew-state .mark{width:calc(62px*var(--ui));height:calc(62px*var(--ui));border-radius:50%;justify-content:center;padding:0;
  font-size:calc(7.5px*var(--ui));letter-spacing:.08em;border:2px solid #6A4A12;color:var(--ink-on-gold);text-shadow:none;
  background:radial-gradient(circle at 35% 30%,#F3DA9A,#C9A45C 45%,#8A6A32 82%,#6A4A12);
  box-shadow:0 4px 10px rgba(0,0,0,.65),inset 0 0 0 4px rgba(255,236,180,.28),inset 0 0 0 5px rgba(90,60,10,.55);transform:rotate(-8deg)}
.ledger .crew-credited .crew-state .mark-lamp::before{display:none}
.ledger{--panel-4:transparent;--face:none;--line-3:transparent;--edge-lit:transparent;--edge-dark:transparent;--rivet:transparent;--rivet-shade:transparent;
  --cast:none;--rule-head:rgba(201,164,92,.35);--r1:0;
  background:#0A110E;
  background-image:radial-gradient(ellipse 40% 60% at 50% 0,rgba(226,192,121,.11),transparent 60%),
    linear-gradient(90deg,transparent 22%,rgba(226,192,121,.035) 34%,transparent 46%),
    linear-gradient(90deg,transparent 54%,rgba(226,192,121,.03) 66%,transparent 78%),
    radial-gradient(ellipse 60% 40% at 50% 100%,rgba(196,138,58,.12),transparent 60%)}
/* THE AAR IS TWO COLUMNS OF READING and keeps its own, narrower cap: the
   record and the evidence are read across, not scanned down. */
.ledger .aar{max-width:calc(1500px * var(--ui));margin:0 auto;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  grid-template-areas:"head head" "team team" "filing auspex" "evidence evidence" "record record" "notes notes";
  gap:calc(44px*var(--ui)) calc(48px*var(--ui));padding-top:calc(44px*var(--ui))}
.ledger .plate{box-shadow:none;border:0;border-top:1px solid var(--gold-line);border-radius:0;background:transparent}
.ledger .plate-head{flex-direction:column;align-items:center;text-align:center;gap:var(--s3);padding:calc(22px*var(--ui)) 0 calc(18px*var(--ui));border-bottom:0}
.ledger .plate-head-meta{margin-left:0}
.ledger .plate-head::after{content:"";width:calc(56px*var(--ui));height:1px;background:var(--gold);margin-top:var(--s3);box-shadow:0 0 12px var(--glow-live)}
.ledger .heading{display:block;font-size:var(--fs-9);font-weight:400;letter-spacing:var(--ls-3);color:var(--ink);text-shadow:0 0 30px rgba(226,192,121,.25)}
.ledger .heading::first-letter{color:var(--gold-warm)}
.ledger .a-head .heading{font-size:var(--fs-10);letter-spacing:var(--ls-2)}
.ledger .a-head .plate-head{padding-top:0}
.ledger .plate-body{padding:var(--s6) 0 0}
.ledger .plate-body-flush{padding:0}
.ledger .rail,.ledger .objs{padding-left:0;padding-right:0}
.ledger .tiles{border-bottom:0}
.ledger .tile{align-items:center;text-align:center;border-right-color:var(--gold-line)}
.ledger .tile-n{font-family:var(--serif);font-size:calc(34px*var(--ui));font-weight:500}
.ledger .head-acts{justify-content:center;padding-left:0;padding-right:0}
.ledger .head-acts .spacer{display:none}
.ledger .team-body{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(28px*var(--ui));align-items:end;padding-top:calc(40px*var(--ui))}
.ledger .crew-group{display:none}
.ledger .crew-list{display:contents}
.ledger .crew-list-mine .crew-card{order:2;transform:translateY(calc(-18px*var(--ui)))}
.ledger .crew-list-other .crew-card:first-child{order:1}
.ledger .crew-list-other .crew-card:last-child{order:3}
/* THE EMPTY STATE IS A SENTENCE, NOT A MAN, SO IT DOES NOT TAKE A MAN'S COLUMN.
   `.crew-list` is display:contents, so this div becomes a direct child of the
   three-column team grid and was being placed in ONE of those columns -- a
   stubby dashed box in the left third with two columns of dark beside it, and
   the words centred inside the third rather than under the panel. It spans the
   row like `.add-man` below, which is the same case: a thing that belongs to the
   whole fireteam rather than to one place in it. `order:3` puts it after the
   card it is explaining instead of competing with it for column one. */
/* ORDER 4, BEHIND THE CARDS, AND THAT IS THE WHOLE POINT OF THE NUMBER.
   At order:3 this sat BETWEEN the ordered cards -- others are 1 and 3, yours is
   2 -- and a full-row item cannot share a row, so grid auto-placement broke the
   row at the empty and put every card on a line of its own: three arches
   stacked down the left third with a full-width dashed box among them. `.add-man`
   below is order:4 for exactly this reason. A sentence about the fireteam comes
   after the fireteam. */
.ledger .crew-list .empty{grid-column:1/-1;order:4;align-self:center;justify-self:stretch;
  min-height:calc(200px*var(--ui))}
.ledger .add-man{grid-column:1/-1;justify-self:center;order:4}
.ledger .crew-card{grid-template-columns:minmax(0,1fr);grid-template-areas:"id" "state" "stats" "ask" "acts" "note";justify-items:center;text-align:center;
  padding:calc(48px*var(--ui)) calc(22px*var(--ui)) calc(22px*var(--ui));border-radius:calc(160px*var(--ui)) calc(160px*var(--ui)) 0 0;
  background:linear-gradient(180deg,rgba(226,192,121,.07),rgba(11,18,16,.85) 30%,rgba(7,16,13,.96));background-image:none;
  border:1px solid var(--gold-line);box-shadow:none}
.ledger .crew-card::before{content:attr(data-band);position:absolute;top:calc(-30px*var(--ui));left:0;right:0;text-align:center;
  font-family:var(--mono);font-size:var(--fs-1);letter-spacing:var(--ls-head);text-transform:uppercase;color:var(--gold-ash)}
.ledger .crew-mine::after{display:none}
.ledger .crew-mine{border-color:var(--gold);box-shadow:0 0 70px -20px var(--glow-live),inset 0 1px 0 rgba(255,228,158,.25)}
.ledger .crew-mine::before{color:var(--gold-warm)}
.ledger .crew-other{opacity:.62}
.ledger .crew-id{flex-direction:column;text-align:center}
.ledger .crew-id .col{align-items:center}
.ledger .crew-id .avatar{width:calc(72px*var(--ui));height:calc(72px*var(--ui));font-size:var(--fs-8);border-color:var(--gold-line)}
.ledger .crew-id .row{justify-content:center}
.ledger .crew-name{font-size:var(--fs-8);font-weight:500}
.ledger .crew-state{align-items:center;text-align:center}
.ledger .crew-stats{grid-template-columns:repeat(3,minmax(0,1fr));background:transparent;border:0;box-shadow:none;gap:var(--s2) var(--s5);width:100%}
.ledger .stat{background:transparent;padding:var(--s2) 0;align-items:center;border-bottom:1px solid var(--hair)}
.ledger .stat-v{font-family:var(--serif);font-size:var(--fs-7)}
.ledger .crew-ask{width:100%;text-align:left}
.ledger .crew-acts{justify-content:center;width:100%}
.ledger .crew-pts{margin-left:0;width:100%;justify-content:center}
.ledger .seal{border-radius:999px;background:transparent;color:var(--gold-warm);border:1px solid var(--gold);
  font-family:var(--serif);font-size:var(--fs-7);font-weight:600;letter-spacing:var(--ls-2);min-width:calc(210px*var(--ui));text-shadow:none;
  box-shadow:0 0 24px -10px var(--glow-live)}
.ledger .seal:hover{background:var(--gold);color:var(--ink-on-gold);filter:none}
.ledger .seal:active{transform:translateY(2px);box-shadow:inset 0 2px 6px rgba(0,0,0,.4)}
.ledger .btn{border-radius:999px;background:transparent;box-shadow:none;border-color:var(--line-2)}
.ledger .btn:hover{border-color:var(--gold-line)}
.ledger .field{background:rgba(7,16,13,.8);border-radius:0;border-color:var(--line-2)}
.ledger .crew-note{width:100%}
.ledger .topbar{background:transparent;border-bottom-color:var(--gold-line);justify-content:center}
.ledger .topbar-end{margin-left:0}
.ledger .gallery{grid-template-columns:repeat(4,minmax(0,1fr))}
.ledger .worth{justify-content:center;text-align:left}
.ledger .discrep{border:0;border-left:2px solid var(--warn);border-radius:0;background:transparent;box-shadow:none}
.ledger .empty{border-radius:0}
.ledger .mark{border-radius:999px}
.ledger .aar{gap:calc(22px*var(--ui)) calc(26px*var(--ui));padding-top:var(--s8);max-width:calc(1560px * var(--ui))}
.ledger .heading{font-size:var(--fs-7);letter-spacing:var(--ls-2)}
.ledger .a-head .heading{font-size:var(--fs-8)}
.ledger .plate-head{padding:calc(12px*var(--ui)) 0 calc(9px*var(--ui));gap:var(--s2)}
.ledger .plate-head::after{width:calc(40px*var(--ui));margin-top:var(--s2)}
.ledger .plate-body{padding-top:var(--s5);gap:var(--s5)}
.ledger .tile{padding:var(--s5) var(--s6)}
.ledger .tile-n{font-size:calc(22px*var(--ui))}
.ledger .kv{min-height:calc(34px*var(--ui))}
.ledger .kv-v{font-size:var(--fs-4)}
.ledger .team-body{gap:var(--s7);padding-top:calc(28px*var(--ui))}
.ledger .crew-card{padding:calc(26px*var(--ui)) var(--s7) var(--s7);border-radius:calc(84px*var(--ui)) calc(84px*var(--ui)) 0 0;gap:var(--s4)}
.ledger .crew-card::before{top:calc(-22px*var(--ui))}
.ledger .crew-list-mine .crew-card{transform:translateY(calc(-10px*var(--ui)))}
.ledger .crew-id .avatar{width:calc(44px*var(--ui));height:calc(44px*var(--ui));font-size:var(--fs-4)}
.ledger .crew-name{font-size:var(--fs-6)}
.ledger .stat{padding:var(--s1) 0}
.ledger .stat-v{font-size:var(--fs-5)}
.ledger .seal{min-height:calc(38px*var(--ui));min-width:calc(160px*var(--ui));font-size:var(--fs-5)}
.ledger .btn{min-height:calc(30px*var(--ui))}
.ledger .worth-n{font-size:calc(36px*var(--ui))}
.ledger .gallery{gap:var(--s4)}
.ledger .crew-credited .crew-state .mark{width:calc(50px*var(--ui));height:calc(50px*var(--ui));font-size:calc(6.5px*var(--ui))}
.ledger .crew-mine{border-color:var(--gold);
  box-shadow:0 0 90px -16px rgba(216,174,74,.5),0 24px 60px -30px rgba(216,174,74,.35),inset 0 1px 0 rgba(255,228,158,.3)}
.ledger .crew-mine .avatar{border-color:var(--gold);box-shadow:0 0 24px -4px var(--glow-live)}
.ledger .crew-mine .crew-name{color:var(--gold-warm);text-shadow:0 0 18px rgba(216,174,74,.35)}
.ledger .crew-pts{margin-left:auto}
.ledger .crew-acts{flex-direction:row;flex-wrap:wrap;justify-content:center}
.ledger .a-team.plate-lit{border-top-color:var(--gold)}
.ledger{--panel-4:rgba(12,22,17,.74);
  --catch:inset 0 1px 0 rgba(255,228,158,.12);--catch-lit:inset 0 1px 0 rgba(255,228,158,.3);
  --cast:0 18px 32px -18px rgba(0,0,0,.92);--cast-sm:0 6px 12px -6px rgba(0,0,0,.85);
  --glow:0 0 80px -16px rgba(216,174,74,.5);--glow-sm:0 0 24px -6px rgba(216,174,74,.5);
  --sink:inset 0 1px 6px rgba(0,0,0,.45),inset 0 -1px 0 rgba(255,228,158,.05);
  --recess-bg:linear-gradient(180deg,rgba(0,0,0,.22),rgba(7,16,13,.3) 40%,rgba(0,0,0,.26));
  --recess-line:rgba(178,201,177,.07);--raise-line:rgba(178,201,177,.2);--edge-line:rgba(178,201,177,.06)}
.ledger .aar{grid-template-areas:"head head" "team team" "cmp evidence" "notes notes"}
.ledger .a-cmp{display:flex}
.ledger .a-filing,.ledger .a-auspex,.ledger .a-record{display:none}
.ledger .a-cmp,.ledger .a-evidence{align-self:stretch}
.ledger .gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
.ledger :is(.a-head,.r-head:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)),.s-head) .plate-head:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){flex-direction:row;align-items:center;justify-content:flex-start;text-align:left;padding:var(--s6) var(--s8);gap:var(--s7);flex-wrap:wrap}
.ledger :is(.a-head,.r-head:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)),.s-head) .add-man:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){margin-left:auto}
.ledger :is(.a-head,.r-head:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)),.s-head) .plate-head:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::after{display:none}
.ledger :is(.a-head,.r-head:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)),.s-head) .heading:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){display:inline-block;font-size:var(--fs-8);letter-spacing:var(--ls-2);line-height:1}
.ledger .crew-card{border-color:var(--raise-line);background:linear-gradient(180deg,rgba(226,192,121,.08),rgba(11,18,16,.9) 30%,rgba(7,16,13,.98));box-shadow:var(--catch),var(--cast)}
.ledger .crew-mine{border-color:var(--gold);box-shadow:var(--catch-lit),var(--cast),var(--glow)}
.ledger .avatar{border-color:var(--raise-line);box-shadow:var(--catch),var(--cast-sm)}
.ledger .crew-mine .avatar{border-color:var(--gold);box-shadow:var(--catch),var(--cast-sm),var(--glow-sm)}
.ledger .shot{border-color:var(--raise-line);border-radius:var(--r2);box-shadow:var(--catch),var(--cast)}
.ledger .shot:hover{border-color:var(--gold);box-shadow:var(--catch-lit),var(--cast),var(--glow-sm)}
.ledger .btn{border-color:var(--raise-line);background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(0,0,0,.28));box-shadow:var(--catch),0 2px 0 rgba(0,0,0,.55),var(--cast-sm)}
.ledger .btn:hover{border-color:var(--gold-line)}
.ledger .btn:active{transform:translateY(2px);box-shadow:var(--sink)}
.ledger .btn-quiet{border-color:transparent;background:transparent;box-shadow:none}
.ledger .seal{border-color:#6D5220;color:var(--ink-on-gold);background:linear-gradient(180deg,var(--gold-warm),var(--gold-lit) 45%,#A9832A);
  box-shadow:inset 0 1px 0 rgba(255,236,180,.6),0 4px 0 #5A4118,var(--cast),var(--glow-sm)}
.ledger .seal:hover{background:linear-gradient(180deg,#F0D48E,var(--gold-lit) 45%,#A9832A);color:var(--ink-on-gold)}
.ledger .seal:active{transform:translateY(4px);box-shadow:inset 0 1px 0 rgba(255,236,180,.3),inset 0 2px 6px rgba(0,0,0,.35),0 0 0 #5A4118,var(--cast-sm),var(--glow-sm)}
.ledger .cmp,.ledger .roll,.ledger .a-notes .plate-body,.ledger .crew-stats{background:var(--recess-bg);border:1px solid var(--recess-line);border-radius:var(--r2);box-shadow:var(--sink)}
.ledger .a-notes .plate-body{padding:0;gap:0}
.ledger .crew-stats{padding:var(--s2) var(--s4)}
.ledger .stat{border-bottom-color:var(--edge-line)}
.ledger .field{background:rgba(4,10,8,.7);border:1px solid var(--recess-line);box-shadow:var(--sink)}
.ledger .field:focus{border-color:var(--gold)}
.ledger .cmp-row{grid-template-columns:calc(92px*var(--ui)) minmax(0,1fr) minmax(0,1fr) calc(100px*var(--ui))}
.ledger :is(.cmp,.roll) .rail:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){padding-left:var(--s7);padding-right:var(--s7);border-bottom-color:var(--edge-line);box-shadow:none}
.ledger :is(.cmp-hdr,.roll-hdr):where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){background:rgba(0,0,0,.14);border-bottom-color:var(--rule-head)}
.ledger .cmp .cmp-diff{background:linear-gradient(90deg,rgba(181,112,90,.07),transparent 55%);box-shadow:inset 2px 0 0 rgba(181,112,90,.7)}
.ledger .cmp-foot{padding:var(--s7);border-top:1px solid var(--edge-line)}
.ledger .a-notes .empty{border:0;border-bottom:1px solid var(--edge-line);border-radius:0;padding:var(--s8) var(--s7);background:transparent;box-shadow:none}
.ledger .a-notes .row{padding:var(--s5) var(--s7)}
.ledger .discrep{background:transparent;border:0;border-left:2px solid var(--warn);border-radius:0;box-shadow:none}
.ledger .worth-n{text-shadow:0 0 22px rgba(216,180,90,.3),0 1px 0 rgba(0,0,0,.7)}
.ledger .empty{border-color:var(--edge-line)}
.ledger .roster{max-width:var(--page-w);margin:0 auto;gap:calc(22px*var(--ui)) calc(26px*var(--ui));padding-top:var(--s8)}
.ledger .standing{padding-top:calc(34px*var(--ui))}
.ledger .standing .crew-first{transform:translateY(calc(-10px*var(--ui)))}
.ledger .standing .crew-state .worth-n{font-size:calc(40px*var(--ui))}
.ledger .rail-you{background:linear-gradient(90deg,rgba(216,174,74,.10),transparent 60%);box-shadow:inset 3px 0 0 var(--gold),0 0 40px -10px var(--glow-live)}
.ledger .rail-you .avatar{border-color:var(--gold);box-shadow:var(--catch),var(--cast-sm),var(--glow-sm)}
.ledger .rail-detail{background:rgba(0,0,0,.14);border-bottom-color:var(--edge-line)}
.ledger .rail-detail .crew-stats{background:transparent;border:0;box-shadow:none;padding:0}
.ledger .avatar-officer{border-color:var(--gold)}
.ledger .avatar-sgt{border-color:var(--gold-dim)}
.ledger .company .plate-head{padding-top:calc(14px*var(--ui))}
.ledger .company .plate-body{padding-top:var(--s4)}
.ledger .company .roll{margin:0 var(--s6) var(--s6)}
.ledger .company .empty{margin:0 var(--s6) var(--s6)}
.ledger .screen{max-width:var(--page-w);margin:0 auto;gap:calc(22px*var(--ui)) calc(26px*var(--ui));padding-top:var(--s8)}
.ledger .codex .plate-head .heading{font-size:var(--fs-9)}
.ledger .codex .s-head .heading{font-size:var(--fs-8)}
.ledger :is(.honour,.post:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)),.thumb):where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--raise-line);box-shadow:var(--catch),var(--cast-sm)}
.ledger :is(.honour,.post):where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){background:linear-gradient(180deg,rgba(226,192,121,.06),rgba(11,18,16,.9) 30%,rgba(7,16,13,.98))}
.ledger :is(.post-desk,.honour-held):where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){border-color:var(--gold-line);box-shadow:var(--catch-lit),var(--cast-sm),var(--glow-sm)}
.ledger .drop{background:var(--recess-bg);box-shadow:var(--sink)}
.ledger .pick{background:transparent;border-color:var(--recess-line)}
.ledger .pick-on{border-color:var(--gold);background:var(--lift)}
.ledger .cap > *{border-bottom-color:var(--edge-line);border-right-color:var(--edge-line)}
.ledger .cap > .cap-h{background:rgba(0,0,0,.14);border-bottom-color:var(--rule-head)}
.ledger .law{background:rgba(0,0,0,.16);border-color:rgba(181,112,90,.35)}
.ledger .signin .wordmark{font-size:var(--fs-8);letter-spacing:var(--ls-3)}
.ledger .gate .seal{min-width:calc(240px*var(--ui))}
.ledger .auspex-total .worth-n{font-size:calc(40px*var(--ui))}
.ledger .field-n{background:rgba(4,10,8,.7)}
/* FILING STAYS NARROW ON PURPOSE. It is a form answered one question at a
   time, and a form stretched across a monitor is a form whose label and
   field are a foot apart. */
.ledger.filing .screen{max-width:calc(1180px * var(--ui))}
.ledger .filing-bar{justify-content:flex-start;padding-top:var(--s5);padding-bottom:var(--s5)}
.ledger .filing-bar .add-man{margin-left:auto}
.ledger .filing-foot .seal{margin-left:0}
.ledger .filing-bar .heading{font-size:var(--fs-6)}
.ledger.filing .plate-head .label{margin-bottom:var(--s1)}

/* 10 · MOTION --------------------------------------------------------------- */
@keyframes flicker{0%{transform:scaleY(1) scaleX(1);opacity:.95}50%{transform:scaleY(1.12) scaleX(.9) translateX(.5px);opacity:1}100%{transform:scaleY(.94) scaleX(1.05);opacity:.9}}
@keyframes shimmer{from{background-position:200% 0}to{background-position:-200% 0}}
@keyframes enter{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .candle:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *))::before{animation:none}
  .shot:hover:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)){transform:none}
  .rail:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)),.mark:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)),.btn:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)),.seal:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)),.shot:where(.ledger,.ledger *):not(:where(.oldskool,.oldskool *)) img{transition:none}
}

/* PHONE — one container query on .ledger; the same rules fire on a real phone and in a 390px frame */
@container ledger (max-width:720px){
  .ledger .topbar{flex-wrap:wrap;gap:var(--s4) var(--s6);padding:var(--s5) var(--s6);justify-content:flex-start}
  .ledger .nav{order:3;width:100%;overflow-x:auto;gap:var(--s6);padding-bottom:var(--s2);scrollbar-width:none}
  .ledger .topbar-end{margin-left:auto}
  .ledger .topbar-end .btn{display:none}
  .ledger .aar{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "team" "cmp" "filing" "auspex" "evidence" "record" "notes";
    gap:var(--s6);padding:var(--s6) var(--s5) calc(150px*var(--ui));max-width:none}
  .ledger .plate-head{padding:var(--s6) var(--s6) var(--s4);gap:var(--s2) var(--s4)}
  .ledger .plate-head-sub,.ledger .plate-head-meta{width:100%;margin-left:0}
  .ledger .plate-body{padding:var(--s6) var(--s6) var(--s7);gap:var(--s5)}
  .ledger .rail,.ledger .objs{padding-left:var(--s6);padding-right:var(--s6)}
  .ledger .heading{font-size:var(--fs-5)}
  .ledger .a-head .heading{font-size:var(--fs-6)}
  .ledger .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ledger .tile{padding:var(--s5) var(--s6);border-bottom:1px solid var(--line)}
  .ledger .tile:nth-child(2n){border-right:0}
  .ledger .tile-n{font-size:var(--fs-8)}
  .ledger .head-acts{padding:var(--s5) var(--s6)}
  .ledger .head-acts .spacer{display:none}
  .ledger .team-body{display:flex;flex-direction:column;align-items:stretch;padding-top:0;gap:var(--s5)}
  .ledger .crew-group{display:flex}
  .ledger .crew-list,.ledger .crew-list-other{display:flex;flex-direction:column;gap:var(--s5);width:100%}
  .ledger .crew-card,.ledger .crew-list-mine .crew-card{grid-template-columns:minmax(0,1fr);grid-template-areas:"id" "state" "stats" "ask" "acts" "note";
    padding:var(--s6);gap:var(--s5);transform:none;justify-items:stretch;text-align:left;border-radius:var(--r2)}
  .ledger .crew-card::before{display:none}
  .ledger .crew-id{flex-direction:row;text-align:left}
  .ledger .crew-id .col{align-items:flex-start}
  .ledger .crew-id .row{justify-content:flex-start}
  .ledger .crew-state{align-items:flex-start;text-align:left}
  .ledger .crew-state .stamp{max-width:none}
  .ledger .crew-stats,.ledger .crew-list-mine .crew-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ledger .stat{align-items:flex-start}
  .ledger .crew-acts{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .ledger .crew-locked .crew-acts,.ledger .crew-locked .crew-note,.ledger .crew-credited .crew-acts,.ledger .crew-escalated .crew-acts{display:none}
  .ledger .seal{grid-column:1/-1;min-height:calc(48px*var(--ui));min-width:0}
  .ledger .crew-pts{grid-column:1/-1;margin-left:0;justify-content:space-between;width:100%}
  .ledger .kv,.ledger .kv-4{grid-template-columns:calc(88px*var(--ui)) minmax(0,1fr);row-gap:var(--s2)}
  .ledger .kv .mark,.ledger .kv .btn{grid-column:2;justify-self:start}
  .ledger .kv .on-hover{opacity:1}
  .ledger .kv-v{font-size:var(--fs-4)}
  .ledger .cmp-row{grid-template-columns:calc(64px*var(--ui)) minmax(0,1fr) minmax(0,1fr) calc(22px*var(--ui));column-gap:var(--s3)}
  .ledger .cmp-row .label{letter-spacing:var(--ls-1);font-size:calc(8.5px*var(--ui));overflow-wrap:anywhere}
  .ledger .cmp-row .kv-v{overflow-wrap:normal;font-size:var(--fs-3)}
  .ledger .cmp .on-hover{display:none}
  .ledger .cmp-foot{padding-left:var(--s6);padding-right:var(--s6)}
  .ledger .gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s4)}
  .ledger .worth-n{font-size:calc(40px*var(--ui))}
  .ledger .discrep{flex-direction:column;gap:var(--s3)}
  .ledger .console{width:calc(140px*var(--ui));right:calc(28px*var(--ui))}
  .ledger .candles{right:var(--s4)}
  .ledger .perch-head{right:var(--s6)}
  .ledger .perch-team{left:auto;right:var(--s6)}
  /* the roster */
  .ledger .roster{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "standing" "roll";gap:var(--s6);padding:var(--s6) var(--s5) calc(150px*var(--ui));max-width:none}
  .ledger .standing{display:flex;flex-direction:column;align-items:stretch;gap:var(--s5);padding:var(--s5) 0 0}
  .ledger .standing .crew-card{transform:none}
  .ledger .standing .crew-card:nth-child(1){order:2}.ledger .standing .crew-card:nth-child(2){order:1}.ledger .standing .crew-card:nth-child(3){order:3}
  .ledger .standing .crew-state{flex-direction:row;align-items:baseline;gap:var(--s3)}
  .ledger .roll-row{grid-template-columns:calc(28px*var(--ui)) minmax(0,1fr) auto;column-gap:var(--s4)}
  /* A PHONE KEEPS THE NAME AND THE ONE FACT THAT CHANGES HOURLY. Company,
     last online and last post are all in his card, one tap away. */
  .ledger .roll-co,.ledger .roll-seen,.ledger .roll-post{display:none}
  .ledger .only-phone{display:inline}
  .ledger .rail-detail{padding-left:var(--s6)}
  .ledger .stats-6{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ledger .companies{grid-template-columns:minmax(0,1fr)}
  .ledger .views{order:5}
  .ledger .field-find{width:100%;order:6}
  .ledger .you-stand{margin-left:auto}
  /* the other screens */
  .ledger .screen{grid-template-columns:minmax(0,1fr);gap:var(--s6);padding:var(--s6) var(--s5) calc(150px*var(--ui));max-width:none}
  .ledger .screen > *{grid-column:auto}
  .ledger .tiles-5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ledger .tiles-5 .tile:last-child{grid-column:1/-1}
  .ledger .field-date{width:calc(50% - var(--s2))}
  .ledger .rep-row{grid-template-columns:minmax(0,1fr) auto auto;row-gap:var(--s2)}
  .ledger .rep-state{grid-column:1/-1}
  .ledger .rep-id,.ledger .rep-diff,.ledger .rep-men,.ledger .rep-by{display:none}
  .ledger .steps{width:100%;order:9}
  .ledger .thumbs{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ledger .picks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ledger .tree-l{margin-left:var(--s4);padding-left:var(--s5)}
  .ledger .post{flex-wrap:wrap}
  .ledger .rail.wrap > .grow{flex:1 1 100%}
  .ledger .rail.wrap > .avatar + .grow{flex:1 1 calc(100% - 36px*var(--ui))}
  .ledger .desk-row{grid-template-columns:minmax(0,1fr) auto;row-gap:var(--s2)}
  .ledger .desk-row > :nth-child(2){grid-column:1/-1;order:3}
  .ledger .honours{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ledger .stat-row{grid-template-columns:minmax(0,1fr) calc(56px*var(--ui)) calc(72px*var(--ui))}
  .ledger .st-more{display:none}
  .ledger .scope-row{grid-template-columns:minmax(0,1fr) auto;row-gap:var(--s2)}
  .ledger .scope-row > :nth-child(3){grid-column:1/-1}
  .ledger .named-row{grid-template-columns:minmax(0,1fr) auto auto;row-gap:var(--s2)}
  .ledger .named-row > :nth-child(2),.ledger .named-row > :nth-child(4){grid-column:1/-1}
  .ledger .log-row{grid-template-columns:calc(60px*var(--ui)) minmax(0,1fr);row-gap:var(--s2)}
  .ledger .log-act,.ledger .log-target,.ledger .log-why{grid-column:2}
  .ledger .signin{min-height:calc(640px*var(--ui));padding-top:var(--s8)}
  .ledger .filing-bar{flex-wrap:nowrap}
  .ledger .filing-bar .meta{display:none}
  .ledger .filing-foot{padding:var(--s5) var(--s5)}
  .ledger .filing-foot .meta{display:none}
}