/* ── working-history threshold ──
   The wall-label page that sits between the register (working-history.html)
   and a preserved historical site (working-history/websites/<slug>/).

   Consumed by:
     working-history/fine-art-2000.html
     working-history/jfsn-2018.html

   Extracted 2026-08-12 from two byte-identical inline <style> blocks (proven
   identical by SHA-256 of the comment-stripped declarations, 54 declarations
   each) so the thresholds cannot drift apart as more are added. The extraction
   was verified behavior-neutral: computed values compared before and after at
   1280/768/375 on both pages.

   MUST be linked AFTER _shared/base.css — it overrides --rule and layers on
   top of base's tokens and .runhead rules. Source order is the whole cascade
   story here; there are no !important flags and no inline style="" attributes
   in either page. */

:root{ --rule:#111010; }
.wrap{max-width:1100px;margin:0 auto;padding:0 clamp(18px,4vw,64px)}

/* ── the label ──
   Measure and type sit deliberately BELOW the register's: the register h1 is
   clamp(30px,6.4vw,80px), this caps at 44px, so a wall label never outranks
   the collection it belongs to. See the design spec's hierarchy table. */
.label{max-width:640px;margin:0 auto 0 0;padding:clamp(30px,5vw,56px) 0 0}
.label .yr{
  font-family:ui-monospace,'SF Mono',Menlo,monospace;
  font-size:11px;letter-spacing:.16em;color:var(--grey)
}
.label h1{
  font-size:clamp(26px,4vw,44px);line-height:1.05;letter-spacing:-.02em;
  font-weight:400;font-style:italic;margin:6px 0 0
}
.label .rule{border-top:1px solid var(--rule);margin:18px 0 22px}
.label p{font-size:clamp(16px,1.5vw,19px);line-height:1.55;max-width:58ch}
.label p + p{margin-top:14px}
/* Interpretation is marked in the text, not only in the markup — but the
   markup carries it too, so it survives being read aloud or copied out. */
.label .reading{color:var(--ink)}
.label .reading b{font-weight:600}

.label .built{
  font-family:ui-monospace,'SF Mono',Menlo,monospace;
  font-size:10.5px;letter-spacing:.05em;color:var(--grey);line-height:1.85;
  border-top:2px solid var(--red);padding-top:12px;margin-top:26px;max-width:58ch
}

/* ── preservation note: visible before entry, closed by default ── */
.preserved{margin-top:26px;max-width:58ch}
.preserved summary{
  font-family:ui-monospace,'SF Mono',Menlo,monospace;
  font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--red);
  cursor:pointer;padding:6px 0;position:relative
}
/* Tap target only — the visible row is 26.3px, which is under the 44px this
   project already holds itself to (see the runhead nav's padding/negative-margin
   note in _shared/base.css). An invisible overlay grows the hit area without
   moving a single pixel of the design or shifting anything below it. */
.preserved summary::after{content:"";position:absolute;inset:-10px 0}
.preserved summary:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.preserved p{font-size:13px;line-height:1.65;color:var(--grey);margin-top:6px}

/* ── the single action ──
   Same treatment as the register's .open, deliberately unchanged. */
.act{margin-top:34px}
.act .open{
  display:inline-block;padding:10px 20px;position:relative;
  border:1px solid var(--ink);color:var(--ink);text-decoration:none;
  font-family:ui-monospace,'SF Mono',Menlo,monospace;
  font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  transition:all var(--ink-dur) var(--ink-ease)
}
/* Tap target only. Padding cannot be used here — it would move the visible
   border and enlarge the button. The overlay leaves the drawn box at 37px
   and takes the hit area to 45px.
   -5px, not -4px: an absolutely positioned child is laid out against its
   parent's PADDING box, so the 1px border sits outside the inset and eats
   one pixel per side. -4px measured 43px by hit test; -5px measures 45px. */
.act .open::after{content:"";position:absolute;inset:-5px 0}
.act .open:hover{background:var(--ink);color:var(--paper)}
.act .open:focus-visible{outline:2px solid var(--red);outline-offset:3px}

.label .back{
  margin:40px 0 clamp(60px,9vw,110px);
  font-family:ui-monospace,'SF Mono',Menlo,monospace;
  font-size:9.5px;letter-spacing:.18em;text-transform:uppercase
}
/* Tap target only. On an inline element vertical padding expands the hit box
   without affecting the line box, so nothing above or below moves. */
.back a{color:var(--grey);text-decoration:none;padding:17px 0;transition:color var(--ink-dur) var(--ink-ease)}
.back a:hover{color:var(--red)}
.back a:focus-visible{outline:2px solid var(--red);outline-offset:3px}

@view-transition { navigation: auto; }