/* ==========================================================================
   THE DOCKET — component rules for Operate mode.

   Every token comes from `brand/tokens.css`, which is the only place a Docket
   value is declared. This file may not declare one; `token-source.test.ts` fails
   if it does. Components read tokens and nothing else.
   ========================================================================== */

@import url("./tokens.css");

@font-face { font-family: "Archivo"; src: url("./fonts/archivo.woff2") format("woff2"); font-weight: 400 700; font-display: swap; }
@font-face { font-family: "Archivo Black"; src: url("./fonts/archivo-black.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Courier Prime"; src: url("./fonts/courier-prime.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Courier Prime"; src: url("./fonts/courier-prime-bold.woff2") format("woff2"); font-weight: 700; font-display: swap; }






/* ---------- ground ---------- */

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

/* A fieldset carries a browser-default `min-inline-size: min-content` that refuses to
   shrink, which pushes the page into a horizontal scroll at 320px once text zoom
   widens its contents. Every grouped control here is a fieldset, so this is undone
   once, universally, rather than worked around per component. */
fieldset { min-inline-size: 0; }

/* Single-column grids must be allowed below their min-content, or one long token
   widens the whole page. */
.docket-main,
.docket-sheet,
.docket-field,
.docket-list,
.docket-decision,
.docket-attention,
.docket-attention-row,
.docket-attention-decision,
.docket-triplicate,
.docket-choices,
.docket-reason,
.docket-feedback,
.docket-feedback-options,
.docket-disclosure-body { grid-template-columns: minmax(0, 1fr); }

body {
  margin: 0;
  background: var(--bench);
  background-image:
    radial-gradient(circle at 17% 32%, var(--fleck-a) .6px, transparent .7px),
    radial-gradient(circle at 62% 71%, var(--fleck-b) .5px, transparent .6px),
    radial-gradient(circle at 88% 14%, var(--fleck-c) .7px, transparent .8px);
  background-size: 37px 41px, 53px 47px, 71px 67px;
  color: var(--ink-body);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.55;
  overflow-wrap: break-word;
}

h1, h2, h3, h4 {
  margin: 0;
  color: var(--ink);
  font-family: var(--font-stamp);
  font-weight: 400;
  letter-spacing: -.02em;
  text-wrap: balance;
}

p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: var(--owner); }
a:hover { color: var(--ditto); }

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

.docket-scorch :focus-visible { outline-color: var(--owner-lit); }

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  border: 0;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

/* ---------- DocketShell ---------- */

.docket-skip {
  position: fixed;
  z-index: 100;
  top: .6rem;
  left: .8rem;
  padding: .8rem 1rem;
  min-height: var(--target);
  max-width: calc(100vw - 1.6rem);
  translate: 0 -200%;
  background: var(--sheet-card);
  color: var(--ink);
  box-shadow: var(--lift);
  border: 1px solid var(--ink-line-strong);
}

.docket-skip:focus { translate: 0; }

.docket-main {
  width: min(100%, var(--page));
  margin-inline: auto;
  padding: clamp(1rem, 2.6vw, 2.2rem) var(--pad) clamp(3rem, 8vw, 6rem);
  display: grid;
  gap: clamp(.9rem, 2vw, 1.6rem);
}

/* One column, capped at a readable width. A sheet three times wider than the text
   inside it is empty paper, not emphasis. Paired papers divide this column. */
.docket-main > * { max-width: var(--column); }

/* ---------- DocketHeader / BrandWordmark / ThemeSwitcher ---------- */

.docket-header {
  position: sticky;
  z-index: 50;
  top: 0;
  border-bottom: 1px solid var(--scorch-rule-strong);
  background: var(--stock-scorch);
  color: var(--on-scorch);
}

.docket-header-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem 1.2rem;
  width: min(100%, var(--page));
  min-height: 3.6rem;
  margin-inline: auto;
  padding: .5rem var(--pad);
}

/* The wordmark never takes a verdict colour — the one usage rule DESIGN.md calls an
   argument rather than a preference. As a link it would otherwise inherit the blanket
   anchor ink, which is the owner's own blue. It takes the band's ink instead. */
a.docket-wordmark {
  min-height: var(--target);
  align-self: center;
  color: inherit;
}

.docket-wordmark {
  display: inline-block;
  /* Scales with text zoom, but never past the narrow viewport it has to fit in. */
  width: min(7.5rem, 40vw);
  height: 1.9rem;
  flex: none;
  background: currentColor;
  mask: url("./wordmark.svg") left center / contain no-repeat;
  -webkit-mask: url("./wordmark.svg") left center / contain no-repeat;
}

.docket-surface-name {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  color: var(--on-scorch-meta);
  font-family: var(--font-measure);
  font-size: .72rem;
  letter-spacing: .13em;
  line-height: 1.2;
  text-transform: uppercase;
}

.docket-theme {
  display: flex;
  flex-wrap: wrap;
  flex: 0 1 auto;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: 1px solid var(--scorch-rule-strong);
}

.docket-theme button {
  min-width: var(--target);
  min-height: var(--target);
  padding: .3rem .6rem;
  border: 0;
  border-left: 1px solid var(--scorch-rule-strong);
  background: transparent;
  color: var(--on-scorch-dim);
  cursor: pointer;
  font-family: var(--font-measure);
  font-size: .7rem;
  letter-spacing: .06em;
}

.docket-theme button:first-of-type { border-left: 0; }

.docket-theme button[aria-pressed="true"] {
  background: var(--sheet-card);
  color: var(--ink);
  font-weight: 700;
}

.docket-back-nav { display: flex; }

.docket-back {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  min-height: var(--target);
  padding: .35rem .1rem;
  color: var(--owner);
  font-family: var(--font-measure);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-decoration: none;
}

.docket-back::before { content: "\2190"; font-size: 1.1em; }
.docket-back:hover { color: var(--ink); text-decoration: underline; text-underline-offset: .25em; }

/* ---------- StockSheet ---------- */

.docket-sheet {
  padding: clamp(1rem, 2.6vw, 1.8rem);
  border: 1px solid var(--ink-line);
  box-shadow: var(--lift);
  display: grid;
  gap: .8rem;
  align-content: start;
}

.docket-sheet-card { background-color: var(--sheet-card); }

.docket-sheet-oven {
  background-color: var(--stock-oven);
  background-image:
    radial-gradient(circle at 21% 38%, var(--fleck-a) .7px, transparent .8px),
    radial-gradient(circle at 68% 77%, var(--fleck-c) .6px, transparent .7px);
  background-size: 29px 33px, 47px 41px;
}

.docket-sheet-bench {
  background-color: var(--stock-bench);
  background-image:
    linear-gradient(var(--quadrille) 1px, transparent 1px),
    linear-gradient(90deg, var(--quadrille) 1px, transparent 1px);
  background-size: 1.45rem 1.45rem;
}

.docket-sheet-owner {
  background-color: var(--stock-owner);
  background-image: linear-gradient(var(--laid) 1px, transparent 1px);
  background-size: 100% 1.55rem;
}

.docket-sheet-scorch {
  background-color: var(--stock-scorch);
  border-color: var(--scorch-rule-strong);
  color: var(--on-scorch-body);
}

.docket-sheet-scorch .docket-heading,
.docket-sheet-scorch h1,
.docket-sheet-scorch h2,
.docket-sheet-scorch h3 { color: var(--on-scorch); }

.docket-sheet-scorch .docket-measure-label { color: var(--on-scorch-meta); }
.docket-sheet-scorch .docket-body { color: var(--on-scorch-body); }

/* ---------- DocketHeading / BodyCopy / MeasureLabel ---------- */

.docket-heading { color: var(--ink); }
.docket-heading-page { font-size: clamp(1.7rem, 6vw, 2.5rem); line-height: 1.04; letter-spacing: -.03em; }
.docket-heading-section { font-size: clamp(1.15rem, 3.4vw, 1.45rem); line-height: 1.12; }
.docket-heading-sheet { font-size: clamp(1rem, 3vw, 1.2rem); line-height: 1.18; }
.docket-heading-item { font-size: clamp(.95rem, 2.6vw, 1.05rem); line-height: 1.24; }

.docket-body {
  max-width: var(--measure);
  color: var(--ink-body);
}

.docket-body-lede { font-size: 1.05rem; }
.docket-body-note { color: var(--ink-muted); font-size: .93rem; }

.docket-measure-label {
  display: block;
  color: var(--ink-muted);
  font-family: var(--font-measure);
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .14em;
  line-height: 1.3;
  text-transform: uppercase;
}

.docket-field { display: grid; gap: .25rem; }
.docket-field + .docket-field { margin-top: .75rem; }
.docket-field > .docket-field:first-of-type { margin-top: .45rem; }

.docket-list { display: grid; gap: .45rem; }
.docket-list li { display: grid; gap: .15rem; }
.docket-list-bulleted li { padding-left: 1.35rem; position: relative; }
.docket-list-bulleted li::before { position: absolute; left: 0; content: "—"; color: var(--ink-muted); }

/* ---------- EvidenceMark ----------
   Five classes, each with its own border grammar so the mark survives greyscale,
   forced colours, and a colour-blind reader. `result` is a separate field: a failure
   takes the struck/leak treatment on top of its class and never becomes a class. */

.docket-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.15rem;
  padding: .35rem .7rem;
  color: var(--ink-muted);
  font-family: var(--font-measure);
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .07em;
  line-height: 1.1;
  text-transform: uppercase;
}

.docket-mark-claimed { border: 2px dotted var(--claim); color: var(--claim); }
.docket-mark-measured { border: 2px solid var(--measured); color: var(--measured); }
.docket-mark-observed { border: 2px dashed var(--observed); color: var(--observed); }
.docket-mark-owner { border: 3px double var(--owner); color: var(--owner); }
.docket-mark-unknown { padding-inline: .22rem; border-bottom: 2px solid var(--ditto); color: var(--ditto); }

.docket-mark-result {
  display: inline-flex;
  align-items: center;
  min-height: 2.15rem;
  margin-left: .5rem;
  font-family: var(--font-measure);
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.docket-mark-result-pass { color: var(--measured); }
.docket-mark-result-fail { color: var(--leak); text-decoration: line-through 2px; }
.docket-mark-result-unknown { color: var(--ditto); }

.docket-mark-pair { display: inline-flex; align-items: center; flex-wrap: wrap; }

/* ---------- MeasureLabel state chips ---------- */

.docket-state {
  display: inline-flex;
  align-items: center;
  min-height: 2.15rem;
  padding: .35rem .75rem;
  border: 1px solid var(--ink-line-strong);
  color: var(--ink-muted);
  font-family: var(--font-measure);
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .07em;
  line-height: 1.1;
  text-transform: uppercase;
}

.docket-state-owner { border: 3px double var(--owner); color: var(--owner); }
.docket-state-claim { border: 2px dotted var(--claim); color: var(--claim); }
.docket-state-measured { border: 2px solid var(--measured); color: var(--measured); }
.docket-state-leak { border: 2px solid var(--leak); color: var(--leak); }
.docket-state-unknown { padding-inline: .25rem; border: 0; border-bottom: 2px solid var(--ditto); color: var(--ditto); }

.docket-state-row { display: flex; flex-wrap: wrap; gap: .4rem .5rem; }

/* ---------- TriplicateRecord ---------- */

.docket-triplicate { display: grid; gap: clamp(.8rem, 2vw, 1.2rem); }

@media (min-width: 52rem) {
  .docket-triplicate-supporting { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- AttentionList / AttentionRow ---------- */

.docket-attention { display: grid; gap: clamp(.8rem, 2vw, 1.2rem); }

.docket-attention-row { display: grid; gap: .75rem; }
.docket-attention-decisions { display: grid; gap: .8rem; border-top: 1px solid var(--ink-line); padding-top: .8rem; }
.docket-attention-decision { display: grid; gap: .3rem; }
.docket-attention-actions { display: flex; flex-wrap: wrap; gap: 1rem 1.25rem; }

/* ---------- DecisionRequest / ChoiceList / OwnerActionSet ---------- */

.docket-decision { display: grid; gap: .9rem; }
.docket-decision-question { font-size: clamp(1.1rem, 3.2vw, 1.35rem); line-height: 1.2; }

.docket-choices { display: grid; gap: .6rem; margin: 0; padding: 0; border: 0; }
.docket-choices legend { padding: 0; }

.docket-choice {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .15rem .7rem;
  align-items: start;
  min-height: var(--target);
  padding: calc(.8rem - 2px) calc(.9rem - 2px);
  border: 2px solid var(--ink-line-strong);
  /* Transparent, not a fill. A choice sits on the owner's own stock, and any fixed
     surface token is darker than that stock in one theme and lighter in the other — which
     is how these came to read as recessed panels rather than as the thing you press.
     An outline reads as pressable on any paper; the fill is what SELECTED means. */
  background: transparent;
  cursor: pointer;
}

.docket-choice:hover { border-color: var(--owner); background: var(--wash); }
.docket-choice:hover .docket-choice-label { color: var(--owner); }

.docket-choice input {
  width: 1.35rem;
  height: 1.35rem;
  margin: .1rem 0 0;
  grid-row: 1 / span 2;
  accent-color: var(--owner);
}

.docket-choice-label { font-size: 1.05rem; font-weight: 700; line-height: 1.25; color: var(--ink); }
.docket-choice-consequence { color: var(--ink-body); font-size: .95rem; }
/* Chosen is unmistakable: the owner's double rule, their ink on the label, and a bar
   down the inline edge that survives greyscale and forced colours. */
.docket-choice:has(input:checked) {
  border: 3px double var(--owner);
  border-inline-start-width: 7px;
  border-inline-start-style: solid;
  padding: calc(.8rem - 3px) calc(.9rem - 3px);
  padding-inline-start: calc(.9rem - 7px);
  background: var(--wash-strong);
}

.docket-choice:has(input:checked) .docket-choice-label { color: var(--owner); }
.docket-choice:has(input:focus-visible) { outline: 3px solid var(--focus); outline-offset: 3px; }

.docket-recommendation { display: grid; gap: .3rem; border-left: 1px solid var(--ink-line-strong); padding-left: .8rem; }

/* A rule between two things that are not the same thing: orientation this package
   authored, and a notice it may not touch a word of. */
.docket-parting { width: 100%; height: 0; margin: .3rem 0; border: 0; border-top: 1px solid var(--ink-line); }

/* ---------- TermsBlock ---------- */

.docket-terms { display: grid; gap: 0; margin: 0; border-top: 1px solid var(--ink-line); }
.docket-terms > div { display: grid; gap: .2rem .0; padding: .7rem 0; border-bottom: 1px solid var(--ink-line); }
.docket-terms dd { margin: 0; }
.docket-terms dd .docket-body { margin: 0; }
.docket-terms .docket-list { gap: .25rem; }

@media (min-width: 40rem) {
  .docket-terms > div { grid-template-columns: minmax(0, 13rem) minmax(0, 1fr); gap: .2rem 1.4rem; align-items: baseline; }
}

/* ---------- CopyablePrompt ---------- */

.docket-prompt { display: grid; gap: .4rem; justify-items: start; margin-top: .9rem; }

.docket-prompt-field {
  width: 100%;
  padding: .65rem .75rem;
  border: 2px solid var(--ink-line-strong);
  background: var(--sheet-card);
  color: var(--ink);
  font-family: var(--font-measure);
  font-size: .9rem;
  line-height: 1.45;
  resize: vertical;
}

.docket-prompt-field:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }

.docket-reason { display: grid; gap: .3rem; }

.docket-reason textarea {
  width: 100%;
  min-height: 5rem;
  padding: .6rem;
  border: 1px solid var(--ink-body);
  background: var(--wash);
  color: var(--ink-body);
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.45;
  resize: vertical;
}

/* Universal one-line field used by owner-only Docket surfaces such as sign-in. */
.docket-input {
  width: 100%;
  min-height: var(--target);
  padding: .6rem;
  border: 1px solid var(--ink-line-strong);
  background: var(--sheet-card);
  color: var(--ink-body);
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.45;
}

.docket-input:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }

.docket-actions { display: flex; flex-wrap: wrap; gap: 1rem 1.25rem; }

.docket-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--target);
  min-height: var(--target);
  padding: .6rem 1rem;
  border: 1px solid var(--ink-body);
  background: var(--wash);
  color: var(--ink);
  cursor: pointer;
  font-family: var(--font-body);
  font-size: .97rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
}

.docket-action-primary {
  border: 3px double var(--owner);
  background: var(--wash-strong);
  color: var(--ink);
}

.docket-action-go {
  border-color: var(--cta);
  background: var(--cta);
  color: var(--cta-ink);
}

.docket-action-quiet { font-weight: 400; }

/* An act that is not a verdict, filled rather than outlined.
   Graphite was the first try and it was wrong: a low-chroma neutral outline is the same
   visual family as the inert control two buttons away, so "not yet" and "you cannot press
   this" read alike. Amber is not a fallback — it is the Oven's own ink, and sending work
   back is precisely handing it to the unverified side. Filled, it cannot be mistaken for
   disabled; ink measured at 6.54:1 light and 10.72:1 dark. */
.docket-action-aside {
  border-color: var(--claim);
  background: var(--claim);
  color: var(--on-claim);
  font-weight: 700;
}

.docket-action-aside::after { content: "\2192"; margin-left: .45rem; font-size: 1.05em; }
.docket-action-aside:hover { border-color: var(--ink); color: var(--on-claim); }

.docket-actions-split {
  align-self: stretch;
  width: 1px;
  min-height: var(--target);
  margin-inline: .5rem;
  background: var(--ink-line);
}

/* Wrapped onto its own line, a vertical hairline is a stray tick; the divider becomes the
   full-width rule it is standing in for. */
@media (max-width: 30rem) {
  .docket-actions-split { width: 100%; height: 1px; min-height: 0; margin: .35rem 0; }
}
.docket-action:hover { border-color: var(--owner); }

/* A control with nothing to act on. It keeps its place and its focus ring so the reason
   beside it can be read; it simply carries no action to fire. */
.docket-action[aria-disabled="true"] {
  border-color: var(--ink-line);
  background: transparent;
  color: var(--ink-muted);
  cursor: default;
}

.docket-action[aria-disabled="true"]:hover { border-color: var(--ink-line); }
.docket-actions-hint { margin-top: .55rem; color: var(--ink-muted); }

/* ---------- TechnicalDisclosure / TrailList ---------- */

.docket-disclosure {
  border: 1px solid var(--ink-line);
  background: var(--wash);
}

.docket-disclosure > summary {
  display: flex;
  align-items: center;
  gap: .5rem;
  min-height: var(--target);
  padding: .7rem 1rem;
  cursor: pointer;
  font-family: var(--font-measure);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-body);
}

.docket-disclosure > summary::after { content: "[+]"; }
.docket-disclosure[open] > summary::after { content: "[-]"; }
.docket-disclosure-body { display: grid; gap: 1.1rem; padding: 0 1rem 1rem; }

.docket-scroll { overflow-x: auto; }

.docket-record {
  display: grid;
  gap: .2rem;
  padding: .55rem 0;
  border-top: 1px solid var(--ink-line);
  font-family: var(--font-measure);
  font-size: .8rem;
  overflow-wrap: anywhere;
}

.docket-record-label {
  color: var(--ink-muted);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.docket-trail { display: grid; }
.docket-trail-row { display: grid; gap: .2rem; grid-template-columns: 2.2rem minmax(0, 1fr); padding: .55rem 0; border-top: 1px solid var(--ink-line); font-family: var(--font-measure); font-size: .8rem; }
.docket-trail-sequence { color: var(--ink-muted); font-weight: 700; }
.docket-trail-body { display: grid; gap: .15rem; overflow-wrap: anywhere; }

/* ---------- ProcessFeedback ---------- */

.docket-feedback {
  display: grid;
  gap: .7rem;
  border: 1px dashed var(--ink-line-strong);
  padding: clamp(.9rem, 2.2vw, 1.2rem);
  background: transparent;
}

.docket-feedback .docket-heading { font-family: var(--font-body); font-size: 1rem; font-weight: 700; }
.docket-feedback-options { display: grid; gap: .45rem; margin: 0; padding: 0; border: 0; }

.docket-feedback-option {
  display: flex;
  align-items: center;
  gap: .6rem;
  min-height: var(--target);
  padding: .4rem .5rem;
  border: 1px solid var(--ink-body);
  cursor: pointer;
  font-size: .95rem;
}

.docket-feedback-option input { width: 1.1rem; height: 1.1rem; accent-color: var(--owner); }
.docket-feedback-option:has(input:checked) { border: 2px solid var(--ink-line-strong); padding: calc(.4rem - 1px) calc(.5rem - 1px); }

/* ---------- announcements ---------- */

.docket-announce {
  display: grid;
  gap: .25rem;
  border-left: 1px solid var(--ink-line-strong);
  padding: .55rem .8rem;
  background: var(--wash);
  color: var(--ink-body);
  font-size: .95rem;
}

.docket-announce-slot:empty { display: none; }
.docket-announce-problem { border-left-color: var(--leak); color: var(--leak); }

/* ---------- the neutral card, at night ----------
   A card is a surface, never an authority stock. In light it is the bright note the
   palette needs. In dark it cannot be — it sits at kraft's own lightness — so rather
   than paint a large neutral slab that outweighs the Oven, the Bench, and the owner,
   it becomes a ruled area and lets the bench show through. */

@media (prefers-color-scheme: dark) {
  
}



/* ---------- responsive ----------
   One semantic column below --single-column. Nothing reorders: DOM order is reading
   order at every width, so the decision that must come first comes first in the
   markup rather than by a visual `order` that a screen reader never sees. */

@media (max-width: 51.999rem) {
  .docket-triplicate,
  .docket-triplicate-supporting { grid-template-columns: minmax(0, 1fr); }
  .docket-header-inner { min-height: 0; padding-block: .5rem; column-gap: .8rem; }
  .docket-wordmark { width: min(6rem, 40vw); height: 1.55rem; }
  .docket-surface-name { font-size: .66rem; letter-spacing: .1em; }
}

/* Long owner copy is never clamped, at any width or zoom: the ask, the consequence,
   the recommendation, the limits, and the errors are the decision. */
.docket-body,
.docket-choice-consequence,
.docket-recommendation,
.docket-announce { -webkit-line-clamp: none; overflow: visible; text-overflow: clip; }

/* ---------- forced colours ----------
   Keep the word and the border grammar. System colours replace the palette; the
   dotted/solid/dashed/double/underline distinction is what still carries meaning. */

@media (forced-colors: active) {
  .docket-mark-claimed { border-style: dotted; }
  .docket-mark-measured { border-style: solid; }
  .docket-mark-observed { border-style: dashed; }
  .docket-mark-owner { border-style: double; }
  .docket-mark-unknown { border-bottom-style: solid; }
  .docket-mark-result-fail { text-decoration: line-through 2px; }
  .docket-state-owner,
  .docket-choice:has(input:checked),
  .docket-action-primary { border-style: double; }
  .docket-action-go { border-style: solid; forced-color-adjust: none; background: Canvas; color: CanvasText; }
  .docket-state-claim { border-style: dotted; }
  .docket-state-measured,
  .docket-state-leak { border-style: solid; }
  .docket-state-unknown { border-bottom-style: solid; }
  .docket-sheet,
  .docket-disclosure,
  .docket-feedback { border-style: solid; forced-color-adjust: none; background: Canvas; color: CanvasText; }
  .docket-sheet { box-shadow: none; }
  :focus-visible { outline: 3px solid Highlight; }
}

/* ---------- motion ----------
   Exponential ease-out from an already-visible default; nothing hides content until
   it plays, so reduced motion loses an easing curve and never a paragraph. */

.docket-skip { transition: translate 160ms cubic-bezier(.16, 1, .3, 1); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

@media print {
  .docket-header, .docket-skip { position: static; }
  .docket-sheet { box-shadow: none; }
  .docket-disclosure > summary { display: none; }
}