/* Laws Of Robots — base styles, Ledger v1.2 register. Authored fresh per DaB §4;
   visual reference: docs/Claude_-_20260715i_S268_LOR_Ledger_v1_2_Sampler.html.
   RTL-safe: logical properties throughout (S-3). Zero JavaScript. */

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.55;
}

.wrap { max-inline-size: 68rem; margin-inline: auto; padding-inline: 1.25rem; }

a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 2px; }

.skip {
  position: absolute; inset-inline-start: -999px; inset-block-start: 0;
  background: var(--accent); color: var(--accent-ink); padding: .5rem .75rem;
}
.skip:focus { inset-inline-start: .5rem; inset-block-start: .5rem; z-index: 99; }

/* ============ wordmark — W7 (ratified) ============
   Underlying text stays canonical "Laws Of Robots"; caps are text-transform styling only. */
.wm { color: var(--accent); line-height: 1.05; font-family: var(--serif); display: inline-block; }
.wm .l1 { display: block; font-weight: 700; font-size: 1.5rem; line-height: 1; letter-spacing: .01em; }
.wm .l2 { display: block; font-weight: 500; font-size: .66rem; letter-spacing: .32em; text-transform: uppercase; margin-block-start: .22rem; }
a.wm-link { text-decoration: none; }
.wm-foot { font-size: .82em; }

/* ============ header ============ */
header.site { background: var(--paper); border-block-end: 1px solid var(--line); }
.head-in { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; padding-block: 1rem; }
nav.primary { display: flex; gap: 1.05rem; flex-wrap: wrap; font-size: .92rem; }
nav.primary a { color: var(--ink); text-decoration: none; border-block-end: 2px solid transparent; padding-block-end: 2px; }
nav.primary a:hover, nav.primary a:focus-visible { border-block-end-color: var(--accent-g); }

/* ============ type voices (strict roles: sans interface/headings · serif reading · mono labels/data) ============ */
h1.tagline {
  font-family: var(--font-tagline); font-weight: 600;
  font-size: clamp(2.1rem, 5.4vw, 3.5rem); line-height: 1.08; letter-spacing: -.01em;
  margin: 0 0 1.15rem; max-inline-size: 22ch;
}
h1 { font-family: var(--sans); font-weight: 700; font-size: 1.8rem; letter-spacing: -.01em; margin: 0 0 .5rem; }
h2 { font-family: var(--sans); font-weight: 700; font-size: 1.55rem; letter-spacing: -.01em; margin: 0 0 .4rem; }
.kicker { font-family: var(--mono); font-size: .78rem; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); margin: 0 0 1.1rem; }
.lede { max-inline-size: 56ch; font-size: 1.06rem; color: var(--muted); margin: 0 0 1.8rem; }
/* D269-11 (owner-ruled 2026-07-16): the mono small-caps section labels read
   as section headings, not subscript — raised size/weight + clear block-start
   spacing, mono-caps voice kept. Applies wherever the label style is used
   (the hero kicker is a separate class and is untouched — D269-2). */
.micro { font-family: var(--mono); font-size: .92rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-block: 2.4rem 1rem; }
.prose > .micro:first-child { margin-block-start: .8rem; }
.src { font-family: var(--mono); font-size: .76rem; color: var(--muted); margin: 0 0 1.8rem; max-inline-size: 78ch; }
.micro-note { font-size: .85rem; color: var(--muted); margin: .9rem 0 0; font-style: italic; max-inline-size: 75ch; }

/* ============ hero (tagline-led) ============
   D269-9(b) owner ruling 2026-07-16: the gap between the header rule and the
   kicker reduces to ~40% of the S268 value — 4.2rem → 1.7rem on the token
   scale; one rule governs both form factors. */
.hero { padding-block: 1.7rem 3.2rem; border-block-end: 1px solid var(--line); }
.cta { display: flex; gap: .8rem; flex-wrap: wrap; }

/* ============ buttons — 3px radius, 1.5px border ============ */
.btn {
  display: inline-block; text-decoration: none; font-weight: 600; font-size: .95rem;
  padding: .65rem 1.15rem; border-radius: 3px; border: 1.5px solid var(--accent);
}
.btn.primary { background: var(--accent); color: var(--accent-ink); }
.btn.ghost { color: var(--accent); background: transparent; }

/* ============ the floor — seven L-token chips on the 3px graphic rule;
   meaning carried by words + arrow, never color alone ============ */
.floor-band { padding-block: 2rem 1.6rem; border-block-end: 1px solid var(--line); }
.floor { position: relative; padding-block-end: .9rem; border-block-end: 3px solid var(--accent-g); }
ol.ladder { list-style: none; display: flex; flex-wrap: wrap; gap: .35rem .25rem; align-items: flex-end; margin: 0; padding: 0; }
ol.ladder li {
  display: flex; align-items: center; gap: .45rem;
  border: 1px solid var(--line); background: var(--panel); border-radius: 3px;
  padding: .35rem .6rem; font-size: .88rem;
}
ol.ladder li .tok { font-family: var(--mono); font-weight: 700; font-size: .8rem; color: var(--accent); }
ol.ladder li:not(:last-child)::after { content: "›"; margin-inline-start: .4rem; color: var(--muted); font-weight: 700; }
.ratchet { display: flex; gap: .6rem; align-items: baseline; margin-block-start: .8rem; font-size: .85rem; color: var(--muted); max-inline-size: 75ch; }
.ratchet .arrow { font-family: var(--mono); font-weight: 700; color: var(--accent-g); }

/* ============ law articles (reading voice = serif) ============ */
section.laws { padding-block: 3rem; border-block-end: 1px solid var(--line); }
article.law { display: grid; grid-template-columns: 4rem 1fr; gap: 1.1rem; padding-block: 1.25rem; border-block-start: 1px solid var(--line); }
article.law .n { font-family: var(--mono); font-size: 2.5rem; line-height: 1; color: var(--accent); font-weight: 700; text-align: end; }
article.law h3 { margin: .15rem 0 .5rem; font-family: var(--sans); font-size: 1.05rem; font-weight: 700; }
article.law .tok {
  font-family: var(--mono); font-size: .72rem; border: 1px solid var(--line); border-radius: 3px;
  padding: .08rem .35rem; margin-inline-start: .5rem; vertical-align: middle; color: var(--muted);
}
article.law blockquote { margin: 0; font-family: var(--serif); font-style: italic; font-size: 1.1rem; max-inline-size: 64ch; }

/* ============ status spec-sheet (word + symbol marks, never color alone) ============ */
section.status { padding-block: 3rem; border-block-end: 1px solid var(--line); }
.sheet { border: 1px solid var(--line); background: var(--panel); border-radius: 4px; overflow: hidden; margin-block-start: 1.3rem; }
.row {
  display: grid; grid-template-columns: minmax(9rem, 14rem) 1fr auto; gap: 1rem;
  align-items: baseline; padding: .85rem 1.1rem; border-block-start: 1px solid var(--line);
}
.row:first-child { border-block-start: none; }
.row .k { font-family: var(--mono); font-size: .76rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.row .v { font-size: .95rem; }
.mark { font-family: var(--mono); font-size: .72rem; letter-spacing: .08em; border-radius: 3px; padding: .14rem .45rem; border: 1px solid var(--ink); white-space: nowrap; }
.mark.planned { border-style: dashed; color: var(--muted); border-color: var(--muted); }
.mark.notclaimed { border-style: dotted; color: var(--muted); border-color: var(--muted); }
/* D269-11: base .micro now carries the raised block-start spacing; only the
   first label after the status lede stays tucked. */
.status .micro:first-of-type { margin-block-start: 1rem; }
.prose { max-inline-size: 65ch; }

/* ============ the-laws page: TOC + structural catalog rendering ============ */
.laws-page { padding-block: 3rem; }
.toc { border: 1px solid var(--line); background: var(--panel); border-radius: 4px; padding: 1rem 1.25rem; margin-block: 1.6rem; max-inline-size: 48rem; }
.toc ol { list-style: none; margin: 0; padding: 0; font-size: .92rem; }
.toc li { padding-block: .12rem; }
.toc li.toc-l3 { padding-inline-start: 1.25rem; }
.catalog { max-inline-size: 75ch; }
.catalog h1 { font-size: 1.7rem; margin-block: 1.8rem .6rem; }
.catalog h2 { margin-block: 2.2rem .5rem; }
.catalog h3 { font-family: var(--sans); font-size: 1.08rem; font-weight: 700; margin-block: 1.6rem .4rem; }
.catalog em { font-family: var(--serif); }
.catalog hr { border: 0; border-block-start: 1px solid var(--line); margin-block: 2rem; }
.table-wrap { overflow-x: auto; }
.catalog table { border-collapse: collapse; font-size: .92rem; }
.catalog th, .catalog td { border: 1px solid var(--line); padding: .4rem .6rem; text-align: start; }
.catalog code { font-family: var(--mono); font-size: .88em; background: var(--chip); border-radius: 3px; padding: .05em .3em; }
.catalog blockquote { margin: 0; padding-inline-start: 1rem; border-inline-start: 3px solid var(--accent-g); font-family: var(--serif); }
.catalog-manifest { margin-block-start: 2.5rem; border-block-start: 3px solid var(--accent-g); padding-block-start: .9rem; }
.mono-line { font-family: var(--mono); font-size: .78rem; color: var(--muted); overflow-wrap: anywhere; margin: 0; }

/* floor placement on /the-laws (owner floor ruling 2026-07-15) */
.floor-inset { margin-block: 2rem 2.2rem; }

/* ============ footer ============ */
footer.site-foot { padding-block: 2.4rem 3rem; color: var(--muted); font-size: .9rem; }
.foot-in { display: flex; flex-direction: column; gap: .9rem; }
nav.footer { display: flex; gap: 1rem; flex-wrap: wrap; }
.flag { font-family: var(--mono); font-size: .72rem; color: var(--muted); }
.fine { font-size: .8rem; margin: 0; }

/* ============ S269 batch-1: content pages ============ */
.page { padding-block: 3rem; }

/* memorable statement (D269-7): one per page, owner-ruled, flag-gated —
   renders only while the page's _data/statements.json flag is true */
.statement {
  font-family: var(--serif); font-style: italic; font-size: 1.18rem;
  border-inline-start: 3px solid var(--accent-g); padding-inline-start: 1rem;
  margin-block: 2rem; max-inline-size: 55ch;
}
/* D269-10 (owner-ruled 2026-07-16): sentence-atomic wrap — each sentence is
   an inline-block that moves whole to the next line; a sentence wider than
   the line degrades to normal internal wrapping. Zero-JS. */
.statement .s { display: inline-block; }

/* home What It Is (D269-1): adapted copy + verbatim spans from the pinned
   positioning statement (data-span elements digest-checked at every build) */
.what-it-is ul { padding-inline-start: 1.15rem; margin-block: .9rem; }
.what-it-is li { margin-block: .4rem; }

/* papers rows (D269-4): title · author/version-date/reading-time · abstract ·
   PDF link · size + digest in the /the-laws mono-line pattern */
.paper { border-block-start: 1px solid var(--line); padding-block: 1.6rem .4rem; margin-block-start: 1.6rem; max-inline-size: 70ch; }
.paper h2 { font-size: 1.25rem; }
.paper-meta { font-family: var(--mono); font-size: .78rem; color: var(--muted); margin: .2rem 0 .9rem; }
.paper-abstract { font-family: var(--serif); font-size: 1.04rem; max-inline-size: 62ch; }
.fine-links { margin-block-start: 2rem; }

@media (max-width: 560px) {
  article.law { grid-template-columns: 3rem 1fr; }
  article.law .n { font-size: 1.9rem; }
  .row { grid-template-columns: 1fr; gap: .15rem; }
  /* D269-9(a) owner ruling 2026-07-16: deliberate compact wrapped nav at
     narrow widths — wordmark row, nav rows below, tightened gaps; no
     horizontal scroll, zero-JS, no hamburger; tab order and :focus-visible
     unchanged; desktop untouched (media-scoped). */
  .head-in { flex-direction: column; align-items: flex-start; gap: .7rem; padding-block: .85rem; }
  nav.primary { gap: .45rem 1.05rem; }
}

/* No animation is used anywhere on this site; the guard keeps that promise durable. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}
