/* MUSE / Cutline Ledger — one visual system built around evidence and decisions. */
:root {
  --paper: #ecebe6;
  --ink: #101114;
  --blue: #2448ff;
  --red: #bd2b25;
  --fog: #d8d7d2;
  --muted: #62656c;
  --white: #ffffff;
  --display: "Manrope", "Aptos Display", Arial, sans-serif;
  --body: "Manrope", "Aptos", Arial, sans-serif;
  --mono: "IBM Plex Mono", "Cascadia Mono", Consolas, monospace;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--paper); scroll-behavior: smooth; }
body { min-width: 320px; margin: 0; background: var(--paper); color: var(--ink); font-family: var(--body); font-size: 14px; line-height: 1.45; }
button, input { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; }
img { display: block; max-width: 100%; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.skip-link { position: fixed; z-index: 100; top: -100px; left: 16px; min-height: 44px; padding: 12px 14px; background: var(--ink); color: var(--white); font-weight: 800; text-decoration: none; }
.skip-link:focus { top: 16px; }

.cutline-shell { min-height: 100vh; overflow: hidden; }
.ledger-header { display: grid; grid-template-columns: 154px minmax(0, 1fr) max-content 68px; min-height: 72px; align-items: center; gap: 22px; padding: 0 clamp(20px, 4vw, 64px); border-bottom: 1px solid var(--ink); }
.wordmark { display: inline-flex; width: max-content; min-height: 44px; align-items: center; font-family: var(--display); font-size: 27px; font-weight: 900; letter-spacing: -.1em; line-height: 1; text-decoration: none; }
.wordmark span { color: var(--blue); }
.ledger-nav { display: flex; min-width: 0; justify-content: center; gap: clamp(12px, 2.1vw, 32px); }
.ledger-link { position: relative; display: inline-flex; min-height: 44px; align-items: center; color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .03em; text-decoration: none; text-transform: uppercase; white-space: nowrap; }
.ledger-link:hover, .ledger-link.is-active { color: var(--ink); }
.ledger-link.is-active::after { content: ""; position: absolute; right: 0; bottom: 4px; left: 0; height: 3px; background: var(--blue); }
.header-state { display: inline-flex; align-items: center; gap: 8px; min-width: 0; color: var(--muted); font-family: var(--mono); font-size: 10px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; white-space: nowrap; }
.state-line { display: block; width: 10px; height: 10px; border-radius: 50%; background: var(--blue); }
.is-feedback .state-line, .is-approved .state-line { background: var(--red); }
.identity { display: grid; width: 44px; height: 44px; place-items: center; padding: 0; border: 1px solid var(--ink); border-radius: 50%; background: transparent; color: var(--ink); }
.identity b { font-family: var(--mono); font-size: 11px; }
.identity span { display: none; }

.ledger-main { width: min(1400px, 100%); margin: auto; padding: 54px clamp(24px, 4.4vw, 72px) 100px; }
.page-lead { display: grid; grid-template-columns: minmax(0, 1fr) minmax(210px, 28%); align-items: end; gap: 48px; margin-bottom: 40px; }
.ledger-kicker { margin: 0 0 10px; color: var(--blue); font-family: var(--mono); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.page-title { max-width: 770px; margin: 0; font-family: var(--display); font-size: clamp(36px, 4.35vw, 64px); font-weight: 900; letter-spacing: -.083em; line-height: .93; }
.page-title:focus { outline: 0; }
.page-aside { max-width: 320px; margin: 0 0 3px; color: var(--muted); font-size: 12px; line-height: 1.55; }

.campaign-record { display: flex; justify-content: space-between; gap: 24px; padding: 13px 0; border-top: 2px solid var(--ink); border-bottom: 1px solid var(--fog); font-family: var(--mono); font-size: 10px; letter-spacing: .035em; }
.record-meta, .record-state { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; }
.record-meta p { margin: 0; color: var(--blue); font-weight: 800; }
.record-meta span, .record-state span { color: var(--muted); }
.record-state strong { color: var(--ink); font-weight: 800; }
.campaign-stage { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(260px, .62fr); gap: clamp(26px, 5vw, 80px); align-items: start; padding: 40px 0 52px; }
.proof-column { min-width: 0; }
.proof-meta { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 4px 16px; margin-bottom: 16px; font-family: var(--mono); }
.proof-meta span { grid-row: span 2; color: var(--blue); font-size: 10px; font-weight: 800; letter-spacing: .07em; }
.proof-meta strong { font-size: 12px; }
.proof-meta small { color: var(--muted); font-size: 10px; }
.proof { position: relative; min-width: 0; margin: 0; overflow: hidden; background: var(--fog); }
.proof > img { width: 100%; height: 100%; object-fit: cover; }
.proof figcaption { position: absolute; right: 0; bottom: 0; left: 0; display: flex; justify-content: space-between; gap: 12px; padding: 10px 12px; background: rgba(16,17,20,.86); color: var(--white); font-family: var(--mono); font-size: 9px; font-weight: 700; }
.campaign-proof { aspect-ratio: 1.35 / 1; min-height: 430px; }
.campaign-proof img { object-position: center; }
.cutline { position: absolute; z-index: 2; width: 3px; background: var(--red); box-shadow: 0 0 0 2px rgba(236,235,230,.55); }
.cutline-main { top: 0; bottom: 26px; left: 69%; }
.decision-field { position: relative; min-width: 0; padding: 0 0 0 24px; border-left: 2px solid var(--red); }
.decision-field h2 { max-width: 360px; margin: 12px 0 14px; font-family: var(--display); font-size: clamp(26px, 2.4vw, 38px); font-weight: 900; letter-spacing: -.075em; line-height: .96; }
.decision-field > p:not(.stage-label) { max-width: 300px; margin: 0 0 22px; color: #34363b; font-size: 13px; line-height: 1.52; }
.cutline-key { display: flex; align-items: center; gap: 9px; }
.cutline-key span { display: block; width: 18px; height: 2px; background: var(--red); }
.cutline-key p { margin: 0; color: var(--red); font-family: var(--mono); font-size: 10px; font-weight: 800; letter-spacing: .06em; }
.stage-label { margin: 20px 0 0; color: var(--blue); font-family: var(--mono); font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.ink-button, .red-button, .line-button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; gap: 16px; padding: 10px 14px; border: 1px solid var(--ink); border-radius: 0; background: var(--ink); color: var(--white); font-size: 12px; font-weight: 800; text-decoration: none; transition: transform .16s ease, background .16s ease, color .16s ease; }
.ink-button:hover:not(:disabled), .red-button:hover:not(:disabled) { transform: translate(-2px, -2px); }
.ink-button i, .red-button i { font-family: var(--mono); font-size: 15px; font-style: normal; }
.red-button { border-color: var(--red); background: var(--red); }
.line-button { border-color: var(--ink); background: transparent; color: var(--ink); }
.line-button:hover:not(:disabled) { background: var(--ink); color: var(--white); }
.line-button:disabled, .red-button:disabled { border-color: var(--fog); background: var(--fog); color: var(--muted); }
.decision-field > small { display: block; max-width: 240px; margin-top: 28px; color: var(--muted); font-family: var(--mono); font-size: 9px; }
.evidence-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--ink); }
.evidence-row { min-height: 106px; display: grid; align-content: center; gap: 5px; padding: 16px 22px 16px 0; }
.evidence-row + .evidence-row { padding-left: 22px; border-left: 1px solid var(--fog); }
.evidence-row span { color: var(--muted); font-family: var(--mono); font-size: 9px; font-weight: 800; letter-spacing: .07em; }
.evidence-row strong { font-size: 13px; }
.evidence-row small { color: var(--muted); font-family: var(--mono); font-size: 9px; }
.evidence-row.is-final strong { color: var(--red); }

.manuscript-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 330px); gap: clamp(34px, 8vw, 110px); align-items: start; }
.manuscript { border-top: 2px solid var(--ink); }
.manuscript-intro { max-width: 760px; margin: 0; padding: 34px 0 40px; font-family: var(--display); font-size: clamp(29px, 3.4vw, 48px); font-weight: 800; letter-spacing: -.065em; line-height: .99; }
.manuscript section { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 18px; padding: 24px 0; border-top: 1px solid var(--fog); }
.manuscript section > span { color: var(--blue); font-family: var(--mono); font-size: 11px; font-weight: 800; }
.manuscript h2 { margin: 0 0 7px; font-size: 12px; font-weight: 900; letter-spacing: .01em; text-transform: uppercase; }
.manuscript p { max-width: 640px; margin: 0; color: #3c3e44; font-size: 16px; line-height: 1.58; }
.marked-clause { position: relative; border-top-color: var(--ink) !important; }
.marked-clause div { position: relative; }
.clause-mark { position: absolute; right: -32px; bottom: -25px; width: 62%; height: 2px; background: var(--red); }
.margin-decision { position: sticky; top: 24px; padding: 0 0 0 24px; border-left: 2px solid var(--red); }
.margin-decision h2 { margin: 14px 0 12px; font-family: var(--display); font-size: 30px; font-weight: 900; letter-spacing: -.07em; line-height: .98; }
.margin-decision > p:not(.cutline-key) { margin: 0 0 22px; color: #3c3e44; font-size: 13px; line-height: 1.55; }
.margin-record { display: grid; gap: 4px; margin: 22px 0; padding: 14px 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--fog); }
.margin-record span, .margin-record small, .margin-lock > span { color: var(--muted); font-family: var(--mono); font-size: 9px; font-weight: 800; letter-spacing: .05em; }
.margin-record strong { font-family: var(--mono); font-size: 12px; }
.margin-lock { margin-top: 34px; padding-top: 16px; border-top: 1px solid var(--ink); }
.margin-lock p { margin: 7px 0 14px; color: var(--muted); font-size: 12px; }

.wall-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; padding-top: 12px; border-top: 2px solid var(--ink); color: var(--blue); font-family: var(--mono); font-size: 10px; font-weight: 800; }
.edit-wall { display: grid; grid-template-columns: 1.2fr .8fr 1.05fr; grid-auto-rows: minmax(168px, 230px); gap: 12px; }
.edit-tile { position: relative; min-width: 0; padding: 0; border: 0; background: transparent; color: var(--ink); text-align: left; }
.edit-tile .proof { width: 100%; height: 100%; }
.edit-tile .proof figcaption { display: none; }
.edit-tile .tile-rail { position: absolute; z-index: 3; top: 0; bottom: 0; left: 0; width: 4px; background: var(--blue); transform: scaleY(0); transform-origin: bottom; transition: transform .18s ease; }
.edit-tile .tile-data { position: absolute; z-index: 3; right: 0; bottom: 0; left: 0; display: grid; gap: 2px; padding: 12px; background: rgba(16,17,20,.88); color: var(--white); }
.tile-data b { font-size: 12px; }
.tile-data small { font-family: var(--mono); font-size: 9px; }
.edit-tile:hover .tile-rail, .edit-tile.is-selected .tile-rail, .edit-tile:focus-visible .tile-rail { transform: scaleY(1); }
.edit-tile img { transition: transform .3s ease; }
.edit-tile:hover img { transform: scale(1.025); }
.edit-tile.source { grid-row: span 2; }.edit-tile.crop { grid-row: span 1; }.edit-tile.v1 { grid-row: span 2; }.edit-tile.feedback { grid-column: span 2; }.edit-tile.v2 { grid-row: span 2; }.edit-tile.signed { grid-column: span 2; }
.empty-ledger { max-width: 760px; padding: 56px 0; border-top: 2px solid var(--ink); border-bottom: 1px solid var(--fog); }
.empty-ledger p { color: var(--blue); font-family: var(--mono); font-size: 10px; font-weight: 800; letter-spacing: .08em; }
.empty-ledger h2 { max-width: 620px; margin: 0 0 28px; font-family: var(--display); font-size: clamp(34px, 4vw, 54px); font-weight: 900; letter-spacing: -.08em; line-height: .95; }

.review-utility { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 52px; margin-bottom: 18px; padding: 0 0 10px; border-bottom: 1px solid var(--fog); color: var(--muted); font-family: var(--mono); font-size: 10px; font-weight: 800; letter-spacing: .05em; }
.review-utility > div { display: flex; gap: 18px; }
.micro-button { min-height: 36px; padding: 5px 0; border: 0; background: transparent; color: var(--ink); font-family: var(--mono); font-size: 10px; font-weight: 800; text-decoration: underline; text-underline-offset: 4px; }
.review-stage { display: grid; grid-template-columns: minmax(360px, 1.45fr) minmax(205px, .6fr) minmax(260px, .63fr); gap: clamp(16px, 2vw, 28px); align-items: start; }
.review-proof { min-height: 650px; }
.review-proof img { object-position: center; }
.review-cutline { top: 0; bottom: 25px; left: 64%; }
.proof-anchor { position: absolute; z-index: 4; display: grid; width: 44px; height: 44px; place-items: center; border: 2px solid var(--white); border-radius: 50%; background: var(--blue); color: var(--white); font-family: var(--mono); font-size: 11px; font-weight: 800; box-shadow: 0 0 0 2px var(--ink); }
.proof-anchor::after { content: ""; position: absolute; width: 56px; height: 2px; background: var(--white); }
.anchor-texture { top: 31%; left: 31%; }.anchor-texture::after { transform: translate(38px, -2px) rotate(-29deg); transform-origin: left; }.anchor-mark { right: 21%; bottom: 26%; background: var(--red); }.anchor-mark::after { right: 35px; transform: rotate(155deg); transform-origin: right; }
.proof-anchor.is-active { outline: 3px solid var(--red); outline-offset: 4px; }
.comment-rail { min-width: 0; }
.comment-rail > p { margin: 1px 0 14px; color: var(--blue); font-family: var(--mono); font-size: 9px; font-weight: 800; letter-spacing: .08em; }
.comment { display: grid; width: 100%; gap: 7px; padding: 16px 0 18px; border: 0; border-top: 1px solid var(--fog); background: transparent; color: var(--ink); text-align: left; }
.comment:last-child { border-bottom: 1px solid var(--fog); }
.comment > span { color: var(--red); font-family: var(--mono); font-size: 12px; font-weight: 800; }
.comment strong { font-size: 13px; line-height: 1.35; }.comment small { color: var(--muted); font-family: var(--mono); font-size: 9px; }.comment em { color: var(--muted); font-size: 12px; font-style: normal; line-height: 1.45; }
.comment.is-active { padding-left: 14px; border-left: 3px solid var(--blue); }
.review-decision { min-width: 0; padding-top: 3px; border-top: 2px solid var(--ink); }
.review-decision h2 { margin: 18px 0 14px; font-family: var(--display); font-size: 32px; font-weight: 900; letter-spacing: -.075em; line-height: .97; }
.review-decision > p { margin: 0 0 18px; color: #3c3e44; font-size: 13px; line-height: 1.5; }
.permission { display: block; margin: -6px 0 16px; color: var(--red); font-family: var(--mono); font-size: 9px; line-height: 1.45; }
.approval-record { display: grid; gap: 7px; margin-top: 42px; padding: 16px 0 0; border-top: 2px solid var(--ink); }
.approval-record span { color: var(--muted); font-family: var(--mono); font-size: 9px; font-weight: 800; letter-spacing: .06em; }.approval-record strong { color: var(--muted); font-family: var(--mono); font-size: 12px; }.approval-record.is-signed { border-color: var(--red); }.approval-record.is-signed span, .approval-record.is-signed strong { color: var(--red); }
.loading-proof, .failed-proof { display: grid; min-height: 470px; align-content: center; justify-items: start; gap: 18px; max-width: 780px; padding: 34px 0; border-top: 2px solid var(--ink); border-bottom: 1px solid var(--fog); }
.loading-cutline { display: block; width: min(75%, 530px); height: 3px; background: var(--blue); animation: cutline-load 1.3s ease-in-out infinite alternate; }.loading-proof p { margin: 0; font-family: var(--display); font-size: 34px; font-weight: 900; letter-spacing: -.065em; }.failed-proof p { margin: 0; color: var(--red); font-family: var(--mono); font-size: 10px; font-weight: 800; letter-spacing: .07em; }.failed-proof h2 { max-width: 540px; margin: 0; font-family: var(--display); font-size: 48px; font-weight: 900; letter-spacing: -.08em; line-height: .94; }.failed-proof > span { width: 42%; height: 3px; background: var(--red); }

.production-shelves { max-width: 1060px; padding: 12px 0 42px; border-top: 2px solid var(--ink); border-bottom: 1px solid var(--fog); }
.shelf { position: relative; display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 18px; min-height: 88px; align-items: start; padding: 16px 0; }
.shelf time { color: var(--blue); font-family: var(--mono); font-size: 11px; font-weight: 800; }.shelf div { display: grid; gap: 3px; }.shelf strong { font-size: 14px; }.shelf small { color: var(--muted); font-family: var(--mono); font-size: 10px; }
.shelf-line { position: absolute; top: 61px; right: 0; left: 128px; height: 1px; background: var(--fog); }.shelf-line::before { content: ""; position: absolute; top: -5px; left: 0; width: 11px; height: 11px; border: 2px solid var(--blue); border-radius: 50%; background: var(--paper); }.shelf-line.complete { background: var(--blue); }.shelf-line.complete::before { background: var(--blue); }.shelf-line.broken { height: 0; border-top: 2px dashed var(--red); background: transparent; }.shelf-line.broken::before { border-color: var(--red); background: var(--red); }.conflict-flag { position: absolute; top: 74px; left: 144px; color: var(--red); font-family: var(--mono); font-size: 9px; letter-spacing: .07em; }
.production-decision { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 330px); gap: clamp(34px, 8vw, 110px); margin-top: 42px; }
.production-decision article > p { margin: 0 0 13px; color: var(--blue); font-family: var(--mono); font-size: 10px; font-weight: 800; letter-spacing: .07em; }.production-decision article h2 { max-width: 590px; margin: 0 0 28px; font-family: var(--display); font-size: clamp(29px, 3.2vw, 47px); font-weight: 900; letter-spacing: -.075em; line-height: .98; }.production-decision dl, .dossier-record dl { margin: 0; border-top: 1px solid var(--ink); }.production-decision dl div, .dossier-record dl div { display: grid; grid-template-columns: 142px minmax(0, 1fr); gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--fog); }.production-decision dt, .dossier-record dt { color: var(--muted); font-family: var(--mono); font-size: 9px; font-weight: 800; }.production-decision dd, .dossier-record dd { margin: 0; font-size: 12px; font-weight: 750; }.has-conflict { border-color: var(--red); }

.dossier { display: grid; grid-template-columns: minmax(340px, 1.18fr) minmax(280px, .72fr); gap: clamp(30px, 7vw, 100px); align-items: stretch; max-width: 1120px; border-top: 2px solid var(--ink); padding-top: 20px; }
.dossier-proof { min-height: 560px; }.signed-proof { height: 100%; min-height: 560px; }.dossier-cut { position: absolute; top: 0; bottom: 26px; left: 73%; width: 3px; background: var(--red); }.dossier-record { display: flex; flex-direction: column; padding: 10px 0; }.dossier-record > p { margin: 0 0 15px; color: var(--red); font-family: var(--mono); font-size: 10px; font-weight: 800; letter-spacing: .08em; }.signature-stamp { display: inline-flex; width: max-content; margin-bottom: 20px; padding: 5px 7px; background: var(--red); color: var(--white); font-family: var(--mono); font-size: 10px; font-weight: 800; letter-spacing: .07em; }.dossier-record h2 { margin: 0 0 30px; font-family: var(--display); font-size: clamp(38px, 4.3vw, 58px); font-weight: 900; letter-spacing: -.09em; line-height: .91; }.dossier-record ol { display: grid; gap: 9px; margin: auto 0 0; padding: 24px 0 0; border-top: 2px solid var(--ink); list-style: none; counter-reset: dossier; }.dossier-record li { counter-increment: dossier; display: flex; gap: 10px; font-size: 12px; font-weight: 800; }.dossier-record li::before { content: "0" counter(dossier); color: var(--red); font-family: var(--mono); font-size: 10px; }.blocked-dossier { position: relative; max-width: 760px; padding: 24px 0 64px; border-top: 2px solid var(--ink); }.blocked-mark { display: block; margin-bottom: 12px; color: var(--red); font-family: var(--display); font-size: 92px; font-weight: 900; line-height: .7; }.blocked-dossier > p { margin: 0 0 14px; color: var(--red); font-family: var(--mono); font-size: 10px; font-weight: 800; letter-spacing: .07em; }.blocked-dossier h2 { max-width: 680px; margin: 0; font-family: var(--display); font-size: clamp(38px, 5vw, 66px); font-weight: 900; letter-spacing: -.09em; line-height: .91; }.blocked-cut { display: block; width: 70%; height: 3px; margin: 32px 0; background: var(--red); }

.role-stage { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 330px); gap: clamp(34px, 8vw, 110px); }.role-stage article { border-top: 2px solid var(--ink); padding-top: 22px; }.role-stage article > p { margin: 0 0 9px; color: var(--blue); font-family: var(--mono); font-size: 10px; font-weight: 800; letter-spacing: .07em; }.role-stage article h2 { margin: 0 0 12px; font-family: var(--display); font-size: 58px; font-weight: 900; letter-spacing: -.09em; line-height: .9; }.role-stage article > strong { color: var(--muted); font-size: 13px; }.role-switch { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; max-width: 540px; margin-top: 42px; }.role-switch button { display: flex; min-height: 96px; align-items: end; gap: 10px; padding: 14px; border: 1px solid var(--fog); background: transparent; color: var(--ink); font-size: 12px; font-weight: 800; text-align: left; }.role-switch button b { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 50%; background: var(--ink); color: var(--white); font-family: var(--mono); font-size: 9px; }.role-switch button.is-active { border: 2px solid var(--blue); }.role-switch button.is-active b { background: var(--blue); }
.state-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 960px; border-top: 2px solid var(--ink); }.state-grid article { min-height: 230px; padding: 24px 32px 24px 0; border-bottom: 1px solid var(--fog); }.state-grid article:nth-child(even) { padding-right: 0; padding-left: 32px; border-left: 1px solid var(--fog); }.state-grid article > span { color: var(--blue); font-family: var(--mono); font-size: 10px; font-weight: 800; }.state-grid h2 { max-width: 310px; margin: 13px 0 8px; font-family: var(--display); font-size: 30px; font-weight: 900; letter-spacing: -.07em; line-height: .98; }.state-grid p { max-width: 300px; min-height: 38px; margin: 0 0 18px; color: var(--muted); font-size: 12px; }.state-grid .state-reset { background: #ffe1dc; padding-right: 24px; }
.mobile-ledger-nav { display: none; }

/* Casebook — the portfolio entry point uses the same ledger rules, but tells the product story before opening the live workflow. */
.case-hero { display: grid; grid-template-areas: "copy atlas" "facts atlas"; grid-template-columns: minmax(0, .88fr) minmax(420px, 1.12fr); grid-template-rows: auto 1fr; column-gap: clamp(32px, 6.4vw, 104px); row-gap: 0; align-items: stretch; padding: 8px 0 102px; border-top: 2px solid var(--ink); }
.case-hero-copy { grid-area: copy; display: flex; min-width: 0; flex-direction: column; padding: 4px 0 0; }
.case-topline { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-bottom: 18px; border-bottom: 1px solid var(--fog); color: var(--blue); font-family: var(--mono); font-size: 10px; font-weight: 800; letter-spacing: .07em; }
.case-topline p { margin: 0; }.case-topline span { color: var(--muted); font-size: 9px; text-align: right; }
.case-hero .page-title { max-width: 680px; margin-top: clamp(42px, 8vw, 110px); font-size: clamp(54px, 5.85vw, 88px); letter-spacing: -.105em; line-height: .86; }
.case-hero .page-title em { color: var(--blue); font-style: normal; }
.case-lede { max-width: 530px; margin: 29px 0 0; color: #34363b; font-size: 17px; line-height: 1.52; }
.case-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; margin-top: 32px; }.case-text-link { display: inline-flex; min-height: 44px; align-items: center; gap: 8px; color: var(--ink); font-size: 12px; font-weight: 800; text-underline-offset: 5px; }.case-text-link span { color: var(--blue); font-family: var(--mono); font-size: 17px; }
.case-facts { grid-area: facts; display: grid; align-self: end; margin: 0; padding-top: 46px; }.case-facts div { display: grid; grid-template-columns: 128px minmax(0, 1fr); gap: 16px; padding: 12px 0; border-top: 1px solid var(--fog); }.case-facts div:last-child { border-bottom: 1px solid var(--fog); }.case-facts dt { color: var(--blue); font-family: var(--mono); font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }.case-facts dd { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.case-atlas { grid-area: atlas; position: relative; min-width: 0; align-self: stretch; }.case-atlas-proof { height: 100%; min-height: 650px; aspect-ratio: 1.12 / 1; }.case-atlas-proof img { object-position: 55% center; }.case-atlas-proof figcaption { align-items: center; }.case-cut { position: absolute; z-index: 2; width: 3px; background: var(--red); box-shadow: 0 0 0 2px rgba(236,235,230,.58); }.case-cut-a { top: 8%; right: 22%; bottom: 39%; }.case-cut-b { right: 8%; bottom: 26px; left: 22%; height: 3px; width: auto; }.case-atlas-index { position: absolute; z-index: 3; top: 20px; left: 20px; display: grid; gap: 6px; width: min(170px, 35%); padding: 12px; border-left: 3px solid var(--blue); background: rgba(236,235,230,.92); color: var(--ink); font-family: var(--mono); }.case-atlas-index span { color: var(--blue); font-size: 9px; font-weight: 800; letter-spacing: .07em; }.case-atlas-index b { font-size: 25px; letter-spacing: -.09em; }.case-atlas-index small { color: var(--muted); font-size: 8px; font-weight: 800; line-height: 1.35; }
.case-sequence { padding: 84px 0 0; border-top: 2px solid var(--ink); }.case-section-head { display: grid; grid-template-columns: minmax(0, 1.16fr) minmax(260px, .58fr); gap: clamp(28px, 7vw, 104px); align-items: end; margin-bottom: 34px; }.case-section-head h2, .case-claims h2 { max-width: 760px; margin: 0; font-family: var(--display); font-size: clamp(35px, 4.1vw, 62px); font-weight: 900; letter-spacing: -.092em; line-height: .9; }.case-section-head > p { max-width: 320px; margin: 0 0 4px; color: var(--muted); font-size: 12px; line-height: 1.55; }
.case-selector-row { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1px solid var(--ink); }.case-selector { display: grid; min-height: 118px; align-content: space-between; gap: 12px; padding: 16px 18px 16px 0; border: 0; border-bottom: 1px solid var(--fog); background: transparent; color: var(--ink); text-align: left; }.case-selector + .case-selector { padding-right: 0; padding-left: 18px; border-left: 1px solid var(--fog); }.case-selector > span { color: var(--blue); font-family: var(--mono); font-size: 10px; font-weight: 800; }.case-selector strong { font-size: 14px; }.case-selector small { color: var(--muted); font-family: var(--mono); font-size: 9px; }.case-selector.is-active { background: var(--ink); color: var(--white); }.case-selector.is-active > span { color: var(--red); }.case-selector.is-active small { color: #b9babd; }.case-selector:hover:not(.is-active) { background: rgba(255,255,255,.42); }
.case-scene { display: grid; grid-template-columns: minmax(300px, .8fr) minmax(360px, 1.2fr); gap: clamp(34px, 9vw, 150px); align-items: stretch; padding: 52px 0 0; }.case-scene-copy { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; padding: 18px 0 26px; }.case-scene-mark { display: flex; align-items: center; gap: 12px; }.case-scene-mark > span { display: grid; width: 37px; height: 37px; place-items: center; border-radius: 50%; background: var(--blue); color: var(--white); font-family: var(--mono); font-size: 10px; font-weight: 800; }.case-scene-mark p { margin: 0; color: var(--red); font-family: var(--mono); font-size: 10px; font-weight: 800; letter-spacing: .06em; }.case-scene-copy h2 { max-width: 550px; margin: 33px 0 18px; font-family: var(--display); font-size: clamp(37px, 4.1vw, 61px); font-weight: 900; letter-spacing: -.095em; line-height: .89; }.case-scene-copy > p { max-width: 455px; margin: 0; color: #34363b; font-size: 14px; line-height: 1.58; }.case-scene-copy .line-button { margin-top: auto; }.case-scene-proof { min-width: 0; }.case-scene-image { min-height: 560px; height: 100%; }.case-scene-image img { animation: case-reveal .42s cubic-bezier(.2,.8,.2,1) both; }.case-scene-image figcaption { padding-right: 16px; padding-left: 16px; }.case-scene-cut { position: absolute; top: 0; right: 31%; bottom: 27px; width: 3px; background: var(--red); box-shadow: 0 0 0 2px rgba(236,235,230,.58); }
.case-claims { display: grid; grid-template-columns: minmax(260px, .62fr) minmax(0, 1.38fr); gap: clamp(32px, 8vw, 128px); margin-top: 120px; padding: 26px 0 0; border-top: 2px solid var(--ink); }.case-claims h2 { font-size: clamp(33px, 3.35vw, 49px); }.case-claims ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; padding: 0; border-top: 1px solid var(--ink); list-style: none; counter-reset: case; }.case-claims li { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 12px; min-height: 148px; padding: 18px 20px 20px 0; border-bottom: 1px solid var(--fog); }.case-claims li:nth-child(even) { padding-right: 0; padding-left: 20px; border-left: 1px solid var(--fog); }.case-claims li > span { color: var(--blue); font-family: var(--mono); font-size: 10px; font-weight: 800; }.case-claims strong { display: block; margin-bottom: 7px; font-size: 13px; line-height: 1.35; }.case-claims p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.micro-button { min-height: 44px; display: inline-flex; align-items: center; }

@keyframes case-reveal { from { opacity: .4; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

@keyframes cutline-load { from { width: 28%; } to { width: 75%; } }
@media (max-width: 1050px) { .ledger-header { grid-template-columns: 132px minmax(0,1fr) 44px; }.header-state { display: none; }.ledger-nav { gap: clamp(8px, 1.5vw, 12px); font-size: 10px; }.campaign-stage { grid-template-columns: minmax(0, 1fr) 270px; gap: 32px; }.review-stage { grid-template-columns: minmax(330px, 1.2fr) minmax(210px, .75fr); }.review-decision { grid-column: 1 / -1; display: grid; grid-template-columns: 1.1fr .9fr; gap: 24px; }.review-decision .cutline-key, .review-decision h2 { grid-column: 1; }.review-decision > p, .review-decision > button, .review-decision .permission { grid-column: 1; }.approval-record { grid-column: 2; grid-row: 1 / span 4; margin: 0; }.dossier { gap: 44px; } }
@media (max-width: 760px) { body { padding-bottom: 72px; }.ledger-header { display: flex; min-height: 64px; justify-content: space-between; padding: 0 16px; }.ledger-nav { display: none; }.wordmark { font-size: 25px; }.ledger-main { padding: 34px 16px 60px; }.page-lead { display: block; margin-bottom: 30px; }.page-title { font-size: clamp(36px, 10vw, 53px); }.page-aside { max-width: 480px; margin-top: 18px; }.campaign-record { display: block; }.record-meta { gap: 10px 14px; }.record-state { margin-top: 12px; }.campaign-stage { grid-template-columns: 1fr; padding: 26px 0 40px; }.campaign-proof { min-height: 470px; aspect-ratio: 1 / 1.18; }.decision-field { padding-left: 18px; }.decision-field h2 { font-size: 33px; }.evidence-strip { grid-template-columns: 1fr; }.evidence-row, .evidence-row + .evidence-row { min-height: 84px; padding: 14px 0; border-left: 0; border-top: 1px solid var(--fog); }.evidence-row:first-child { border-top: 0; }.manuscript-layout, .production-decision, .role-stage { grid-template-columns: 1fr; gap: 38px; }.manuscript-intro { padding: 26px 0 32px; }.manuscript section { grid-template-columns: 32px minmax(0,1fr); }.manuscript p { font-size: 15px; }.clause-mark { right: 0; width: 76%; }.margin-decision { position: static; padding-top: 22px; border-top: 2px solid var(--ink); }.edit-wall { grid-template-columns: repeat(2, minmax(0,1fr)); grid-auto-rows: minmax(210px, 48vw); }.edit-tile.source, .edit-tile.v1, .edit-tile.v2 { grid-row: span 2; }.edit-tile.feedback, .edit-tile.signed { grid-column: span 2; }.review-utility { align-items: flex-start; }.review-stage { grid-template-columns: 1fr; }.review-proof { min-height: 118vw; }.review-decision { display: block; }.approval-record { margin-top: 32px; }.shelf { grid-template-columns: 86px minmax(0,1fr); }.shelf-line { left: 101px; }.conflict-flag { left: 116px; }.dossier { grid-template-columns: 1fr; }.dossier-proof, .signed-proof { min-height: 115vw; }.signed-proof img { object-position: 27% center; }.state-grid { grid-template-columns: 1fr; }.state-grid article, .state-grid article:nth-child(even) { min-height: 0; padding: 23px 0; border-left: 0; }.state-grid .state-reset { padding: 23px 14px; }.mobile-ledger-nav { position: fixed; z-index: 10; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); min-height: 64px; border-top: 1px solid var(--ink); background: var(--paper); }.mobile-ledger-nav .ledger-link { min-height: 64px; justify-content: center; font-size: 9px; letter-spacing: 0; }.mobile-ledger-nav .ledger-link.is-active::after { right: 42%; bottom: 8px; left: 42%; height: 3px; }.identity { border: 0; } }
@media (max-width: 430px) { .page-title { font-size: 36px; }.campaign-proof { min-height: 107vw; }.proof-meta { grid-template-columns: 88px minmax(0,1fr); }.proof-meta small { font-size: 9px; }.proof figcaption { font-size: 8px; }.edit-wall { grid-template-columns: 1fr; grid-auto-rows: minmax(250px, 90vw); }.edit-tile.source, .edit-tile.v1, .edit-tile.v2 { grid-row: span 1; }.edit-tile.feedback, .edit-tile.signed { grid-column: auto; }.review-utility { display: block; }.review-utility > div { margin-top: 7px; }.review-proof { min-height: 134vw; }.production-decision article h2 { font-size: 32px; }.production-decision dl div, .dossier-record dl div { grid-template-columns: 1fr; gap: 3px; }.role-switch { grid-template-columns: 1fr; }.blocked-dossier h2 { font-size: 40px; } }
@media (max-width: 1050px) { .case-hero { grid-template-columns: minmax(0, .94fr) minmax(330px, 1.06fr); gap: 46px; }.case-hero .page-title { font-size: clamp(52px, 6.2vw, 72px); }.case-atlas-proof { min-height: 570px; }.case-section-head { gap: 42px; }.case-scene { grid-template-columns: minmax(270px, .76fr) minmax(330px, 1.24fr); gap: 54px; }.case-scene-image { min-height: 510px; }.case-claims { gap: 46px; } }
@media (max-width: 760px) { .case-hero { display: grid; grid-template-areas: "copy" "atlas" "facts"; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto; row-gap: 0; padding: 2px 0 76px; }.case-hero-copy { min-height: 0; }.case-topline { padding-bottom: 14px; }.case-topline span { max-width: 138px; }.case-hero .page-title { margin-top: 46px; font-size: clamp(48px, 12.4vw, 68px); }.case-lede { margin-top: 24px; font-size: 16px; }.case-actions { margin-top: 27px; }.case-facts { margin-top: 46px; padding-top: 0; }.case-facts div { grid-template-columns: 104px minmax(0,1fr); gap: 12px; }.case-atlas { margin-top: 46px; }.case-atlas-proof { min-height: 0; height: auto; aspect-ratio: 1.04 / 1; }.case-atlas-index { top: 14px; left: 14px; }.case-sequence { padding-top: 62px; }.case-section-head { display: block; margin-bottom: 28px; }.case-section-head > p { margin-top: 18px; }.case-section-head h2 { font-size: clamp(36px, 10.2vw, 54px); }.case-selector-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }.case-selector { min-height: 104px; padding: 14px 14px 14px 0; }.case-selector + .case-selector { padding-right: 0; padding-left: 14px; }.case-selector:nth-child(3) { border-left: 0; }.case-selector:nth-child(5) { grid-column: 1 / -1; }.case-scene { grid-template-columns: 1fr; gap: 28px; padding-top: 38px; }.case-scene-copy { padding: 0; }.case-scene-copy h2 { margin-top: 27px; font-size: clamp(38px, 10.9vw, 57px); }.case-scene-copy .line-button { margin-top: 30px; }.case-scene-image { min-height: 112vw; }.case-claims { display: block; margin-top: 78px; padding-top: 20px; }.case-claims h2 { margin-top: 7px; font-size: clamp(35px, 9.8vw, 48px); }.case-claims ol { margin-top: 34px; }.case-claims li { min-height: 126px; padding: 16px 15px 17px 0; }.case-claims li:nth-child(even) { padding-right: 0; padding-left: 15px; } }
@media (max-width: 430px) { .case-topline { align-items: flex-start; }.case-topline span { line-height: 1.35; }.case-hero .page-title { font-size: 47px; }.case-facts div { grid-template-columns: 1fr; gap: 4px; }.case-atlas-proof { aspect-ratio: .94 / 1; }.case-selector { min-height: 96px; }.case-selector strong { font-size: 13px; }.case-scene-image { min-height: 128vw; }.case-claims ol { grid-template-columns: 1fr; }.case-claims li, .case-claims li:nth-child(even) { min-height: 0; padding: 17px 0; border-left: 0; } }
@media (max-width: 760px) { .production-shelves { padding-bottom: 26px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; } }