/* Snowball visual study: a working room, paper records and physical controls.
   The prototype's information architecture lives in styles.css and app.js. */

:root {
  --canvas: #ede8dc;
  --surface: #fbf8f0;
  --surface-2: #f7f1e1;
  --surface-3: #e2dccb;
  --ink: #211d15;
  --ink-2: #453e31;
  --muted: #645c4e;
  --line: #d7d0bd;
  --line-strong: #b9b19b;
  --accent: #e8a22b;
  --accent-hover: #f0b548;
  --accent-ink: #211d15;
  --accent-soft: #f6e7c6;
  --warning: #a8420f;
  --warning-ink: #923b12;
  --warning-soft: #f9e4d8;
  --good: #2e7d46;
  --good-soft: #e2efe5;
  --danger: #b3261e;
  --danger-soft: #f8e4e0;
  --side: #211d15;
  --side-ink: #fbf8f0;
  --side-muted: #c9bea9;
  --side-line: #665d4d;
  --shadow: 4px 4px 0 rgba(33, 29, 21, .15);
  --shadow-deep: 8px 8px 0 rgba(33, 29, 21, .22);
  --radius: 3px;
  --font: Archivo, system-ui, sans-serif;
  --body: Archivo, system-ui, sans-serif;
  --mono: 'Spline Sans Mono', ui-monospace, monospace;
}

:root[data-theme=dark] {
  --canvas: #201e1a;
  --surface: #302d27;
  --surface-2: #39352c;
  --surface-3: #26231e;
  --ink: #f7f1e1;
  --ink-2: #e5dbc8;
  --muted: #c4b8a1;
  --line: #615b4d;
  --line-strong: #8b806d;
  --accent: #e8a22b;
  --accent-hover: #f4bd59;
  --accent-ink: #211d15;
  --accent-soft: #56401c;
  --warning: #f49a66;
  --warning-ink: #ffb287;
  --warning-soft: #4b2b20;
  --good: #9ed5a9;
  --good-soft: #294534;
  --danger: #f2a69d;
  --danger-soft: #4b2d28;
  --side: #12110e;
  --side-ink: #f7f1e1;
  --side-muted: #c9bea9;
  --side-line: #625b4b;
  --shadow: 4px 4px 0 rgba(0, 0, 0, .38);
  --shadow-deep: 8px 8px 0 rgba(0, 0, 0, .52);
}

body { font-size: 15px; }
h1, h2, h3 { letter-spacing: -.045em; }
.overline, .nav-caption, .crumb, .reference-title, .scenario-control span,
.asof, .lane-title, .mobile-section-title { letter-spacing: .06em; }

/* The dark strip belongs to the study controls, not to the product. */
.reference-bar { background: #171510; border-bottom: 2px solid #7e6c47; }
.reference-symbol { border-radius: 2px; border-color: #a99162; color: #f7f1e1; }
.reference-title b { color: #e8a22b; }
.segmented { border-radius: 2px; background: #312d24; border-color: #665d4d; }
.segmented button { border-radius: 1px; }
.segmented button.active { background: #e8a22b; color: #211d15; }
.scenario-control select, .theme-button, .reset-button { border-radius: 2px; }
.theme-button, .reset-button { border-color: #81745c; }
.compare-link { color: #e0c88f; }

.brand { letter-spacing: -.075em; }
.brand-wordmark { display: block; padding-left: 7px; font-size: 27px; font-weight: 800; letter-spacing: -.08em; }
.brand-mark { border-radius: 3px; background: #d4dfce; color: #211d15; }
.brand-mark span, .brand-dot, .phone-brand span { color: #e8a22b; }
.badge { border-radius: 2px; }
.badge-amber { border-color: #d8a982; }
.badge-green { border-color: #a8c9ad; }

button, input, select, textarea { border-radius: 2px; }
button { transition: transform .08s ease, box-shadow .08s ease, background-color .12s ease; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: 140ms; animation-timing-function: ease-out; }
button:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 rgba(33, 29, 21, .15); }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid #d2571e;
  outline-offset: 3px;
}
.primary-button, .secondary-button, .danger-button, .light-button,
.brief-action, .top-agent, .footer-action { border-radius: 3px; font-weight: 800; }
.primary-button { background: var(--accent); color: var(--accent-ink); border: 2px solid var(--ink); box-shadow: var(--shadow); }
.secondary-button { background: var(--surface-2); color: var(--ink); border: 2px solid var(--line-strong); box-shadow: var(--shadow); }
.danger-button { border: 2px solid var(--danger); box-shadow: var(--shadow); }
.light-button { background: var(--accent); color: #211d15; border: 2px solid #211d15; box-shadow: 3px 3px 0 #0c0b09; }
.text-link { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }

/* Shared kiosk: the left side is the station rail; the work occupies the wall. */
.kiosk-shell { background: var(--canvas); min-height: calc(100vh - 48px); }
.kiosk-top { height: 82px; background: var(--side); border-bottom: 4px solid var(--accent); padding: 0 32px; }
.kiosk-top .brand { font-size: 29px; }
.kiosk-top .brand-mark { width: 38px; height: 38px; font-size: 27px; }
.kiosk-top-center { color: var(--side-muted); font-size: 13px; }
.kiosk-top-right { font-size: 15px; gap: 17px; }
.kiosk-top-right .badge { font-size: 11px; padding: 8px 10px; }
.kiosk-main { width: 100%; max-width: none; padding: 28px 32px 36px; }
.kiosk-intro { border-bottom: 2px solid var(--line-strong); padding-bottom: 18px; margin-bottom: 24px; }
.kiosk-intro h1 { font-size: clamp(37px, 3vw, 55px); margin: 3px 0 3px; line-height: 1.07; }
.kiosk-intro p { font-size: clamp(15px, 1.2vw, 20px); color: var(--ink-2); }
.kiosk-intro .overline { font-size: 12px; color: var(--muted); }
.weather { font-size: 34px; }
.weather span { font-size: 13px; color: var(--ink-2); }
.kiosk-content { grid-template-columns: clamp(300px, 23vw, 410px) minmax(0, 1fr); gap: 30px; align-items: start; }
.kiosk-content > div { grid-column: 2; grid-row: 1; min-width: 0; }
.kiosk-side { grid-column: 1; grid-row: 1; gap: 16px; }
.kiosk-side .crew-panel, .kiosk-side .kiosk-shortcuts {
  background: var(--surface-2); border: 2px solid var(--ink); border-radius: 3px;
  box-shadow: var(--shadow); padding: 20px;
}
.kiosk-side .section-head { margin-bottom: 12px; }
.kiosk-side .section-head h2 { font-size: 25px; line-height: 1.1; }
.crew-panel p { font-size: 14px; line-height: 1.4; color: var(--ink-2); margin: 0 0 16px; }
.crew-buttons { gap: 11px; }
.kiosk-shell .crew-button {
  min-height: 74px; background: var(--surface); color: var(--ink);
  border: 2px solid var(--ink); border-radius: 3px; box-shadow: 4px 4px 0 rgba(33, 29, 21, .16);
  font-size: 19px; padding: 10px 14px; gap: 14px;
}
.crew-button span, .signed-person span {
  width: 41px; height: 41px; border-radius: 2px; background: var(--accent);
  color: #211d15; font-size: 19px;
}
.signed-person { min-height: 61px; }
.signed-person strong { font-size: 20px; }
.kiosk-shortcuts > .overline { padding: 0 0 12px; }
.kiosk-shortcuts .record-row { background: transparent; border-top: 1px solid var(--line-strong); min-height: 67px; }
.kiosk-shortcuts .row-main strong { font-size: 16px; }
.kiosk-shortcuts .row-main small { font-size: 12px; }
.kiosk-content .section-head { margin-bottom: 13px; }
.kiosk-content .section-head h2 { font-size: 27px; line-height: 1.1; margin-top: 4px; }
.kiosk-content .overline, .kiosk-shortcuts > .overline { font-size: 12px; }
.kiosk-lists { gap: 14px; margin-bottom: 32px; }
.kiosk-lists button {
  min-height: 115px; background: var(--surface-2); border: 2px solid var(--ink);
  border-radius: 3px; box-shadow: var(--shadow); padding: 17px 19px; gap: 16px;
}
.kiosk-list-symbol { width: 58px; height: 58px; border-radius: 2px; background: var(--accent); color: #211d15; }
.kiosk-lists strong { font-size: clamp(17px, 1.2vw, 22px); line-height: 1.2; }
.kiosk-lists small { font-size: clamp(12px, .86vw, 15px); color: var(--ink-2); }
.kiosk-lists b { font-size: 25px; }
.kiosk-lanes { gap: 14px; }
.kiosk-lanes .lane { background: transparent; border: 0; border-radius: 0; padding: 0; }
.kiosk-lanes .lane-title { font-size: 13px; font-weight: 700; padding: 0 0 8px; color: var(--muted); }
.kiosk-lanes .lane-title b { font-size: 12px; }
.kiosk-lanes .lane-title.amber { color: var(--warning-ink); }
.kiosk-lanes .lane-title.green { color: var(--good); }
.kiosk-lanes .record-row {
  min-height: 82px; background: var(--surface); border: 2px solid var(--line-strong);
  border-left: 7px solid var(--line-strong); border-radius: 3px;
  box-shadow: var(--shadow); padding: 11px 16px; margin-bottom: 10px;
}
.kiosk-lanes .lane:has(.lane-title.amber) .record-row { border-left-color: #d2571e; }
.kiosk-lanes .lane:has(.lane-title.green) .record-row { border-left-color: #2e7d46; }
.kiosk-lanes .row-main strong { font-size: clamp(17px, 1.2vw, 21px); }
.kiosk-lanes .row-main small { font-size: clamp(12px, .9vw, 15px); color: var(--ink-2); }
.kiosk-lanes .row-icon, .kiosk-shortcuts .row-icon { background: var(--surface-3); border-radius: 2px; color: var(--ink); }
.kiosk-alert { border: 2px solid var(--warning); border-left-width: 8px; border-radius: 2px; font-size: 16px; padding: 15px 18px; }
.kiosk-footer { background: var(--side); border-top: 3px solid var(--accent); color: var(--side-ink); font-size: 13px; min-height: 64px; }
.footer-action { background: var(--accent); color: #211d15; border: 2px solid #211d15; min-height: 44px; box-shadow: 3px 3px 0 #0a0907; }

/* The walk-up station is a room fixture. The head is read from a distance;
   the left rail holds people and durable doors; only the work region scrolls. */
.room-shell { height: calc(100vh - 48px); min-height: 680px; display: flex; flex-direction: column; }
.room-head { flex: none; min-height: 144px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 25px; padding: 19px 36px; background: var(--surface-2); border-bottom: 4px solid var(--ink); }
.room-farm { display: grid; align-content: center; gap: 2px; }
.room-farm strong { font: 600 clamp(34px, 2.5vw, 49px)/1.05 Fraunces, Georgia, serif; letter-spacing: -.06em; }
.room-farm span { color: var(--muted); font: 700 10px var(--mono); letter-spacing: .09em; }
.room-moment { display: grid; justify-items: center; line-height: 1; }
.room-moment strong { font: 800 clamp(55px, 5vw, 103px)/.9 var(--font); letter-spacing: -.085em; font-variant-numeric: tabular-nums; }
.room-moment span { margin-top: 10px; font: 700 11px var(--mono); color: var(--muted); letter-spacing: .045em; }
.room-conditions { justify-self: end; text-align: right; display: grid; gap: 12px; justify-items: end; }
.room-conditions > strong { font-size: 21px; }
.room-conditions .badge { font-size: 10px; }
.room-weather, .room-source, .top-status { display: inline-flex; align-items: center; justify-content: flex-end; gap: 5px; padding: 0; border: 0; background: transparent; color: var(--ink); cursor: pointer; }
.room-weather { min-height: 40px; font: 800 21px var(--font); }
.room-weather:hover, .room-weather:focus-visible { color: #aa5f00; }
.room-source .badge, .top-status .badge { pointer-events: none; }
.room-source:focus-visible, .top-status:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.room-frame { flex: 1; min-height: 0; display: grid; grid-template-columns: clamp(310px, 23vw, 450px) minmax(0, 1fr); }
.room-rail { min-height: 0; overflow: auto; background: var(--surface-3); border-right: 4px solid var(--ink); padding: 25px 22px 35px; }
.room-rail-title { padding: 0 0 15px; border-bottom: 2px solid var(--line-strong); display: flex; align-items: end; justify-content: space-between; gap: 7px; }
.room-rail-title .overline { font-size: 12px; }
.room-rail-title h2 { font-size: 30px; line-height: 1.1; margin-top: 5px; }
.room-help { flex: none; color: var(--ink); background: transparent; border: 0; border-bottom: 2px solid var(--ink); padding: 3px; font-weight: 800; }
.room-rail-copy { color: var(--ink-2); font-size: 14px; margin: 15px 0; }
.room-people { display: grid; gap: 11px; }
.room-person-button { min-height: 75px; background: var(--surface-2); color: var(--ink); border: 2px solid var(--ink); box-shadow: var(--shadow); display: flex; align-items: center; gap: 13px; padding: 9px 12px; text-align: left; font-size: 20px; }
.room-person-button span, .room-person > span { width: 46px; height: 46px; flex: none; display: grid; place-items: center; background: var(--accent); color: #211d15; font: 800 21px var(--font); }
.room-person { display: flex; align-items: center; gap: 14px; min-height: 90px; }
.room-person strong, .room-person small { display: block; }
.room-person strong { font-size: 24px; }
.room-person small { color: var(--muted); font-size: 13px; }
.room-handback { min-height: 49px; width: 100%; text-align: left; border: 2px solid var(--line-strong); background: var(--surface-2); color: var(--ink); font-weight: 800; padding: 9px; }
.room-doors { display: grid; gap: 0; margin-top: 26px; border-top: 2px solid var(--ink); }
.room-agent-rail { display: flex; align-items: center; gap: 9px; width: 100%; min-height: 52px; margin-top: 15px; padding: 9px 12px; border: 2px solid var(--ink); background: var(--accent); color: #211d15; font-weight: 800; text-align: left; box-shadow: var(--shadow); }
.room-agent-rail svg:last-child { margin-left: auto; }
.room-walkup-help { display: flex; align-items: center; gap: 9px; width: 100%; min-height: 49px; padding: 9px 11px; margin: 0 0 14px; border: 2px solid var(--ink); background: var(--surface-2); color: var(--ink); font-weight: 800; text-align: left; }
.room-walkup-help svg:last-child { margin-left: auto; }
.room-door-label { font: 700 11px var(--mono); color: var(--muted); letter-spacing: .08em; padding: 15px 0 8px; }
.room-door { width: 100%; min-height: 69px; padding: 8px 2px; display: flex; align-items: center; gap: 12px; text-align: left; color: var(--ink); background: transparent; border: 0; border-bottom: 1px solid var(--line-strong); }
.room-door > span { flex: 1; }
.room-door strong, .room-door small { display: block; }
.room-door strong { font-size: 17px; }
.room-door small { font-size: 11px; color: var(--muted); margin-top: 1px; }
.room-clock-door { color: var(--ink); }
.room-clock-door > svg:first-child { color: #a8420f; }
.room-wall { display: flex; flex-direction: column; overflow: hidden; min-width: 0; background: var(--canvas); }
.room-wall-scroll { flex: 1; overflow: auto; padding: 30px 36px 35px; }
.room-wall-intro { display: flex; justify-content: space-between; align-items: end; gap: 20px; padding-bottom: 21px; border-bottom: 2px solid var(--line-strong); margin-bottom: 26px; }
.room-wall-intro h1 { font-size: clamp(34px, 2.65vw, 52px); margin-top: 6px; line-height: 1.06; }
.room-wall-status { display: flex; gap: 7px; align-items: center; white-space: nowrap; font-size: 13px; color: var(--muted); }
.room-section-title { display: flex; align-items: end; justify-content: space-between; gap: 12px; margin: 22px 0 13px; }
.room-section-title h2 { font-size: clamp(26px, 1.8vw, 33px); line-height: 1; margin-top: 3px; }
.room-section-title > small { color: var(--muted); font-size: 12px; text-align: right; }
.room-list-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.room-list { min-width: 0; min-height: 151px; background: var(--surface-2); color: var(--ink); border: 2px solid var(--ink); box-shadow: var(--shadow); padding: 16px 20px; text-align: left; }
.room-list-head { display: flex; align-items: center; gap: 11px; }
.room-list-head > svg { width: 41px; height: 41px; padding: 8px; background: var(--accent); color: #211d15; }
.room-list-head strong { font-size: clamp(17px, 1.15vw, 22px); flex: 1; line-height: 1.1; }
.room-list-head b { font: 800 26px var(--font); }
.room-list-detail { display: block; margin: 9px 0 0 52px; font-size: 13px; color: var(--ink-2); }
.room-list-preview { display: flex; flex-wrap: wrap; gap: 7px; margin: 14px 0 0 52px; font: 600 11px var(--mono); color: var(--muted); }
.room-list-preview span { font: inherit; border-left: 1px solid var(--line-strong); padding-left: 7px; }
.room-list-preview span:first-child { border-left: 0; padding-left: 0; }
.signal[data-action] { text-align: left; color: var(--ink); cursor: pointer; }
.signal[data-action]:hover, .signal[data-action]:focus-visible { border-color: var(--ink); background: var(--accent-soft); }
.bar-chart { height: 185px; }
.bar-chart b { font: 800 10px var(--mono); color: var(--ink); }
.room-lanes .lane-title { padding-top: 2px; }
.room-lanes .record-row { min-height: 75px; }
.room-foot { flex: none; min-height: 74px; padding: 12px 24px; display: flex; align-items: center; gap: 10px; background: var(--surface-2); border-top: 3px solid var(--ink); }
.room-foot > div { flex: 1; }
.room-foot strong, .room-foot span { display: block; }
.room-foot strong { font-size: 15px; }
.room-foot span { color: var(--muted); font-size: 12px; }
.room-foot-action, .room-foot-agent { min-height: 46px; display: flex; align-items: center; gap: 8px; padding: 9px 15px; border: 2px solid var(--ink); box-shadow: var(--shadow); color: #211d15; background: var(--accent); font-weight: 800; white-space: nowrap; }
.room-foot-agent { background: var(--surface); color: var(--ink); }
.room-wall > .record-workspace { flex: 1; min-height: 0; overflow: auto; margin: 23px; }
.room-wall .record-workspace .dossier-body { max-width: 1100px; }
.room-wall > .run-workspace { flex: 1; min-height: 0; overflow: auto; margin: 23px; }
.room-agent-workspace, .room-capture-workspace { overflow: auto; flex: 1; padding: 34px 40px; background: var(--canvas); }
.room-back { display: block; width: max-content; padding: 0 0 4px; margin-bottom: 18px; border: 0; border-bottom: 2px solid var(--ink); background: transparent; color: var(--ink); font-weight: 800; }
.room-agent-workspace > header h1, .room-capture-workspace h1 { font-size: clamp(34px, 2.7vw, 52px); line-height: 1.05; margin: 8px 0 9px; }
.room-agent-workspace > header p, .room-capture-workspace > p { color: var(--ink-2); font-size: 16px; max-width: 670px; }
.agent-context { max-width: 820px; display: flex; align-items: center; justify-content: space-between; gap: 25px; margin: 27px 0 0; padding: 19px 22px; background: var(--surface-2); border: 2px solid var(--ink); border-left: 8px solid var(--accent); box-shadow: var(--shadow); }
.agent-context h2 { font-size: 23px; margin: 7px 0 4px; }
.agent-context p { font-size: 13px; color: var(--ink-2); max-width: 570px; }
.agent-context > div:last-child { flex: none; display: grid; justify-items: start; gap: 9px; }
.agent-context .text-link { font-size: 12px; }
.room-agent-input { max-width: 820px; display: flex; gap: 10px; margin: 29px 0; padding: 8px; background: var(--surface-2); border: 2px solid var(--ink); box-shadow: var(--shadow); }
.room-agent-input input { flex: 1; min-width: 0; padding: 12px; background: transparent; border: 0; color: var(--ink); font: 600 17px var(--font); }
.room-agent-input .primary-button { display: flex; gap: 10px; align-items: center; }
.room-agent-prompts { max-width: 820px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 0 0 25px; }
.room-agent-prompts > .overline { grid-column: 1 / -1; }
.room-agent-prompts .agent-prompt { text-align: left; min-height: 71px; display: flex; align-items: center; gap: 8px; padding: 12px; background: var(--surface-2); color: var(--ink); border: 2px solid var(--line-strong); box-shadow: var(--shadow); font: 800 13px var(--font); }
.room-agent-prompts .agent-prompt svg { flex: none; margin-left: auto; }
.room-agent-exchanges { max-width: 820px; }
.room-agent-exchanges .exchange { padding: 18px; background: var(--surface-2); border: 2px solid var(--line-strong); }
.room-agent-exchanges .question { margin-left: 0; font-weight: 800; }
.room-agent-exchanges .answer { font-size: 15px; }
.room-agent-identity { display: flex; align-items: center; gap: 8px; max-width: 820px; margin-top: 20px; padding: 15px 0; border-top: 2px solid var(--line-strong); color: var(--muted); font-size: 13px; }
.room-capture-workspace form { max-width: 760px; display: grid; gap: 12px; margin: 30px 0; }
.room-capture-workspace label { font-weight: 800; }
.room-capture-workspace textarea { width: 100%; min-height: 190px; resize: vertical; padding: 16px; background: var(--surface-2); color: var(--ink); border: 2px solid var(--ink); font: 500 17px var(--font); }
.room-capture-workspace .primary-button { justify-self: start; display: flex; align-items: center; gap: 12px; }
.room-help-workspace { flex: 1; overflow: auto; padding: 34px 40px; }
.room-help-workspace h1 { font-size: clamp(34px, 2.7vw, 52px); margin: 8px 0; }
.room-help-workspace > p { color: var(--ink-2); font-size: 17px; max-width: 780px; }
.record-back { display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 0 0 4px; border: 0; border-bottom: 2px solid var(--ink); background: transparent; color: var(--ink); font: 800 13px var(--font); cursor: pointer; }
.record-back svg { transform: rotate(180deg); }
.room-manager-open, .room-lock { display: flex; align-items: center; gap: 9px; margin: 8px 0; background: var(--accent); border-color: var(--ink); box-shadow: var(--shadow); }
.room-lock { background: var(--surface-2); }
.room-door.current { background: var(--accent-soft); padding-left: 9px; border-left: 5px solid var(--accent); }
.room-manager-step { flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center; padding: 24px; overflow: auto; }
.manager-step-panel { width: min(100%, 1080px); border: 2px solid var(--ink); background: var(--surface-2); box-shadow: 7px 7px 0 var(--shadow); }
.manager-step-head { min-height: 57px; display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 9px 22px; border-bottom: 2px solid var(--ink); }
.manager-step-head .record-back { margin: 0; }
.manager-step-head > span { font: 800 11px var(--mono); letter-spacing: .06em; color: var(--muted); }
.manager-step-main { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 390px); align-items: start; gap: clamp(20px, 4vw, 60px); padding: 25px 35px 30px; }
.room-manager-step-copy h1 { font-size: clamp(34px, 3vw, 51px); line-height: 1.03; margin: 10px 0 14px; }
.room-manager-step-copy p { color: var(--ink-2); font-size: clamp(16px, 1.15vw, 19px); max-width: 450px; }
.manager-boundary { margin-top: 24px; padding: 14px; display: flex; align-items: start; gap: 11px; max-width: 470px; background: var(--canvas); border-left: 5px solid var(--accent); font-size: 13px; }
.manager-boundary svg { flex: none; }
.room-manager-step .clock-card { width: 100%; margin: 0; padding: 16px; box-shadow: none; border-top: 5px solid var(--accent); }
.room-manager-step .clock-digits { padding: 13px 0 16px; }
.room-manager-step .clock-key { min-height: 53px; }
.room-manager-step .clock-continue { width: 100%; margin-top: 11px; min-height: 49px; }
.room-manager-step .clock-continue:disabled { opacity: .5; cursor: not-allowed; box-shadow: none; }
.manager-code-error { margin: 10px 0 0; color: var(--danger); font-size: 13px; font-weight: 800; }
.manager-wall, .manager-page { flex: 1; min-height: 0; overflow: auto; padding: 30px clamp(23px, 3vw, 54px) 46px; }
.manager-wall-head { display: flex; align-items: start; justify-content: space-between; gap: 20px; padding-bottom: 20px; border-bottom: 3px solid var(--ink); }
.manager-wall-head h1 { font-size: clamp(35px, 2.8vw, 54px); line-height: 1.04; margin: 7px 0; }
.manager-wall-head p { color: var(--ink-2); font-size: 15px; }
.manager-pulse { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 20px 0; }
.manager-pulse button { min-width: 0; min-height: 130px; padding: 17px; text-align: left; display: flex; flex-direction: column; background: var(--surface-2); color: var(--ink); border: 2px solid var(--ink); box-shadow: var(--shadow); }
.manager-pulse button:hover, .manager-wall-block .record-row:hover { background: var(--accent-soft); }
.manager-pulse span { font: 800 11px var(--mono); color: var(--muted); letter-spacing: .05em; }
.manager-pulse strong { font: 800 clamp(28px, 2.3vw, 45px)/1 var(--font); letter-spacing: -.05em; margin: auto 0 7px; }
.manager-pulse small { color: var(--ink-2); font-size: 12px; }
.manager-wall-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.manager-wall-block { background: var(--surface-2); border: 2px solid var(--ink); min-width: 0; }
.manager-wall-block > .overline { padding: 18px 20px 0; }
.manager-wall-block > h2 { font-size: 24px; padding: 4px 20px 14px; }
.manager-wall-block .record-row { min-height: 70px; }
.manager-wall-clear { padding: 20px; color: var(--muted); }
.manager-wall-bottom { display: flex; align-items: center; gap: 15px; margin-top: 17px; padding: 16px 20px; background: var(--side); color: var(--side-ink); }
.manager-wall-bottom > div { flex: 1; }
.manager-wall-bottom strong, .manager-wall-bottom span { display: block; }
.manager-wall-bottom span { color: #c2d4c5; font-size: 12px; margin-top: 3px; }
.manager-wall-bottom .room-foot-agent { background: var(--accent); color: #211d15; }
.manager-page { max-width: none; }
.manager-page .page-head h1 { font-size: clamp(34px, 2.7vw, 52px); }
.manager-page .record-row { min-height: 60px; }
@media (max-width: 1250px) { .manager-pulse { grid-template-columns: repeat(2, 1fr); } .manager-wall-columns { grid-template-columns: 1fr; } .manager-wall-head .badge { display: none; } }
@media (max-width: 900px) { .manager-step-main { grid-template-columns: 1fr; gap: 18px; padding: 22px; } .manager-boundary { margin-top: 14px; } }
@media (max-width: 900px) and (max-height: 650px) { .room-manager-step { align-items: flex-start; padding: 12px; } .manager-step-head { min-height: 43px; padding: 5px 12px; } .manager-step-main { display: block; padding: 12px; } .room-manager-step-copy { display: none; } .room-manager-step .clock-key { min-height: 48px; } }
@media (max-width: 900px) and (max-height: 650px) { .room-clock { display: block; padding: 12px; } .room-clock .clock-intro .record-back { padding-bottom: 7px; } .room-clock .clock-intro h1 { font-size: 27px; margin: 3px 0; } .room-clock .clock-intro p { display: none; } .room-clock .clock-card { width: 100%; max-width: none; margin: 10px 0; padding: 12px; } .room-clock .clock-key { min-height: 48px; } }
.help-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; margin-top: 31px; }
.help-grid section { display: flex; flex-direction: column; align-items: start; padding: 20px; background: var(--surface-2); border: 2px solid var(--ink); box-shadow: var(--shadow); }
.help-grid h2 { font-size: 22px; margin: 12px 0 8px; }
.help-grid p { flex: 1; color: var(--ink-2); font-size: 13px; }
.help-grid button { margin-top: 22px; }
.desktop-main > .room-agent-workspace { margin: 0 0 24px; border: 2px solid var(--ink); box-shadow: var(--shadow); }
.run-workspace { background: var(--surface-2); border: 2px solid var(--ink); box-shadow: var(--shadow); }
.run-workspace .run-sheet { width: 100%; height: auto; max-height: none; min-height: 100%; overflow: visible; border: 0; box-shadow: none; }
.run-workspace .run-sheet > header { padding: 25px 32px; }
.run-workspace .run-items { max-width: 1100px; }
.run-workspace .run-sheet > footer { position: sticky; bottom: 0; background: var(--surface-2); }
.run-workspace .run-items > p { font-size: 15px; max-width: 700px; margin: 12px 0; }
.run-workspace .run-items > .primary-button { font-size: 16px; padding: 12px 20px; }
.round-preview { margin-top: 28px; border-top: 2px solid var(--line-strong); }
.round-preview > .overline { padding: 18px 0 3px; }
.round-preview .run-item .badge { flex: none; }

/* A punch has its own focused space because it becomes payroll. */
.clock-workspace { background: var(--canvas); color: var(--ink); }
.room-clock { flex: 1; overflow: auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(350px, 470px); align-content: center; column-gap: clamp(30px, 7vw, 145px); padding: 35px clamp(35px, 7vw, 135px); }
.clock-intro { align-self: start; }
.clock-intro .record-back { display: flex; gap: 8px; align-items: center; border: 0; background: transparent; color: var(--ink); padding: 0 0 40px; font-weight: 800; }
.clock-intro .record-back svg { transform: rotate(180deg); }
.clock-intro h1 { font-size: clamp(40px, 4vw, 68px); max-width: 620px; line-height: 1.02; margin: 10px 0 16px; }
.clock-intro p { max-width: 590px; font-size: clamp(17px, 1.3vw, 22px); color: var(--ink-2); }
.clock-card { background: var(--surface-2); border: 2px solid var(--ink); box-shadow: var(--shadow); padding: 24px; align-self: center; }
.clock-digits { display: flex; justify-content: center; gap: 17px; padding: 19px 0 23px; }
.clock-digits span { width: 19px; height: 19px; border: 2px solid var(--ink); border-radius: 50%; }
.clock-digits span.filled { background: var(--ink); }
.clock-pad { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.clock-key { min-height: 66px; border: 2px solid var(--line-strong); background: var(--surface); color: var(--ink); font-size: 27px; font-weight: 800; }
.clock-key[data-action=clock-clear] { font-size: 15px; }
.clock-continue { width: 100%; min-height: 64px; margin-top: 16px; font-size: 20px; }
.clock-demo-note { grid-column: 2; color: var(--muted); font-size: 12px; max-width: 470px; margin: 12px 0 0; }
.clock-person { display: flex; align-items: center; gap: 13px; padding: 8px 0 20px; border-bottom: 2px solid var(--line-strong); }
.clock-person > span { width: 57px; height: 57px; background: var(--accent); color: #211d15; display: grid; place-items: center; font-size: 27px; font-weight: 800; }
.clock-person strong, .clock-person small { display: block; }
.clock-person strong { font-size: 22px; }
.clock-person small { color: var(--muted); font-size: 13px; }
.clock-hours { display: flex; justify-content: space-between; align-items: center; padding: 25px 0; }
.clock-hours span { font: 700 12px var(--mono); color: var(--muted); }
.clock-hours strong { font-size: 34px; }
.clock-receipt { display: grid; justify-items: center; text-align: center; gap: 13px; padding: 35px 5px; }
.clock-receipt svg { background: var(--good-soft); color: var(--good); width: 65px; height: 65px; padding: 14px; border-radius: 50%; }
.clock-receipt strong { font-size: 27px; }
.clock-receipt p { font-size: 15px; color: var(--ink-2); }

/* The manager's room uses the same material system at a denser scale. */
.sidebar { border-right: 4px solid var(--accent); }
.farm-identity, .agent-status { border-radius: 2px; border-width: 2px; }
.farm-monogram, .profile > span { border-radius: 2px; background: #755f33; color: #fbf8f0; }
.nav-link { border-radius: 2px; }
.nav-link.active { background: #e8a22b; color: #211d15; font-weight: 800; }
.nav-link.active svg { color: #211d15; }
.nav-link.active:before { background: #211d15; }
.nav-link em { background: #a8420f; border-radius: 2px; }
.topbar { background: var(--surface-2); border-bottom: 2px solid var(--line-strong); }
.top-agent { background: var(--accent); color: #211d15; border: 2px solid var(--ink); box-shadow: 2px 2px 0 rgba(33,29,21,.2); }
.desktop-main { max-width: 1600px; }
.page-head h1 { font-size: clamp(34px, 2.55vw, 47px); }
.page-head p { font-size: 15px; color: var(--ink-2); }
.brief { background: var(--surface-2); color: var(--ink); border: 2px solid var(--ink); border-left: 9px solid var(--accent); box-shadow: var(--shadow); }
.brief-icon { background: var(--accent); border: 2px solid var(--ink); color: #211d15; border-radius: 2px; }
.brief .overline { color: var(--muted); }
.brief p { color: var(--ink-2); }
.brief-action { color: var(--ink); border: 2px solid var(--ink); background: var(--surface); box-shadow: var(--shadow); }
.signal, .panel, .work-card, .metric-card, .explore-card, .proof-banner, .proof-grid > div,
.finance-numbers > div, .mobile-outcome { border-radius: 3px; border: 2px solid var(--line-strong); box-shadow: var(--shadow); }
.signal, .panel, .work-card, .metric-card, .explore-card, .proof-grid > div,
.finance-numbers > div { background: var(--surface); }
.record-row { border-radius: 2px; }
.row-icon { border-radius: 2px; background: var(--surface-3); color: var(--ink); }
.row-main strong { font-weight: 800; }
.row-main small { color: var(--muted); }
.dossier, .run-sheet, .small-sheet { border-left: 4px solid var(--accent); }
.dossier > header, .run-sheet > header, .small-sheet > header { background: var(--surface-2); border-bottom: 2px solid var(--line-strong); }
.run-progress i { background: var(--accent); }
.agent-mode, .agent-prompt, .question { border: 1px solid var(--line-strong); border-radius: 2px; }
.record-workspace { background: var(--surface-2); border: 2px solid var(--ink); box-shadow: var(--shadow); min-height: min(720px, calc(100vh - 210px)); }
.record-workspace .record-back { display: flex; align-items: center; gap: 9px; border: 0; background: var(--canvas); color: var(--ink); width: 100%; min-height: 49px; padding: 0 25px; font-weight: 800; text-align: left; border-bottom: 2px solid var(--ink); }
.record-workspace .record-back svg { transform: rotate(180deg); }
.record-workspace > header { padding: 30px 36px 24px; border-bottom: 2px solid var(--line-strong); }
.record-workspace > header h2 { font-size: clamp(31px, 2.4vw, 46px); margin: 6px 0; }
.record-workspace > header p { color: var(--ink-2); font-size: 14px; }
.record-workspace .dossier-body { padding: 27px 36px 50px; max-width: 1100px; overflow: visible; }
.record-workspace .dossier-lead { font-size: 16px; max-width: 780px; }
.record-workspace .dossier-section h3 { font-size: 25px; }
.record-workspace .dossier-section p { font-size: 14px; max-width: 780px; }
.record-workspace .fact-grid { max-width: 850px; }
.record-workspace .fact-grid > div { min-height: 86px; padding: 15px; }
.record-workspace .fact-grid strong { font-size: 16px; }
.record-workspace .dossier-line { font-size: 14px; max-width: 900px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.agent-capture { margin: 23px 0 5px; padding: 16px; background: var(--surface-2); border: 2px solid var(--line-strong); border-radius: 3px; box-shadow: var(--shadow); }
.agent-capture h2 { font-size: 17px; margin: 7px 0 4px; }
.agent-capture form { display: grid; gap: 9px; margin-top: 12px; }
.agent-capture textarea { width: 100%; min-height: 80px; padding: 11px; background: var(--surface); color: var(--ink); border: 2px solid var(--line-strong); resize: vertical; }
.agent-capture .primary-button { justify-content: center; }
.agent-capture small { display: block; margin-top: 10px; font-size: 11px; color: var(--muted); }

/* Phone: same materials, smaller controls for a person in motion. */
.mobile-stage { background: var(--canvas); }
.mobile-context h2 { font-family: Fraunces, Georgia, serif; font-weight: 500; letter-spacing: -.055em; }
.role-toggle { border-radius: 2px; }
.role-toggle { background: var(--surface-2); border: 2px solid var(--line-strong); }
.role-toggle button { color: var(--ink-2); }
.role-toggle button.active { background: var(--accent); color: #211d15; }
.phone { border-color: #211d15; box-shadow: 0 24px 60px rgba(33,29,21,.22); }
:root[data-theme=dark] .phone { border-color: #766a52; }
.phone-top { background: var(--surface-2); border-bottom: 2px solid var(--ink); }
.phone-brand { font-size: 22px; }
.phone-nav { background: var(--surface-2); border-top: 2px solid var(--ink); }
.phone-nav button.active { color: var(--ink); background: var(--accent-soft); box-shadow: inset 0 4px 0 var(--accent); }
.phone-farm { font: 700 9px var(--mono); letter-spacing: .07em; color: var(--muted); }
.phone-nav .agent-nav { color: var(--ink); background: var(--surface-2); border-left: 2px solid var(--line-strong); border-right: 2px solid var(--line-strong); font-weight: 800; }
.phone-nav .agent-nav.active { background: var(--accent); color: #211d15; box-shadow: inset 0 4px 0 #211d15; }
.phone-nav .agent-nav svg { stroke-width: 2.1; color: #a8420f; }
.phone-nav .agent-nav.active svg { color: #211d15; }
.mobile-page h1 { font-size: 31px; }
.mobile-page > p { font-size: 13px; color: var(--ink-2); }
.mobile-feature, .mobile-brief { background: var(--side); color: var(--side-ink); border: 2px solid var(--accent); border-radius: 3px; box-shadow: var(--shadow); }
.feature-top, .mobile-feature p, .feature-meta, .mobile-brief p { color: #eadcc0; }
.mobile-feature h2 { font-size: 25px; }
.mobile-page > .record-row, .mobile-notice, .mobile-form, .week-card, .mobile-decision,
.capture-record, .mobile-outcome { border: 2px solid var(--line-strong); border-radius: 3px; box-shadow: var(--shadow); }
.mobile-page > .record-row { background: var(--surface-2); min-height: 70px; margin: 10px 0; }
.mobile-notice { border-color: var(--warning); border-left-width: 6px; }
.mobile-form input, .dossier-form input, .mobile-form textarea, .small-sheet textarea { border-radius: 2px; }
.mobile-agent .agent-mode { margin: 16px 0; display: flex; }
.mobile-agent .agent-mode { color: var(--ink); }
.mobile-agent .agent-mode > svg { color: #a8420f; }
.mobile-agent .agent-mode strong { font-size: 12px; }
.mobile-agent .agent-mode small { font-size: 10px; color: var(--ink-2); }
.mobile-agent-input { display: flex; gap: 7px; padding: 8px; background: var(--surface-2); border: 2px solid var(--ink); box-shadow: var(--shadow); }
.mobile-agent-input input { flex: 1; min-width: 0; background: transparent; border: 0; color: var(--ink); font-size: 12px; padding: 7px; outline: none; }
.mobile-agent-input button { width: 35px; border: 2px solid var(--ink); background: var(--accent); color: #211d15; display: grid; place-items: center; }
.mobile-agent .agent-prompt-label { margin: 22px 0 8px; }
.mobile-agent .agent-prompt { width: 100%; padding: 12px; background: var(--surface); color: var(--ink); border: 1px solid var(--line-strong); text-align: left; min-height: 45px; font-size: 12px; }
.mobile-agent .agent-prompt svg { margin-left: auto; }
.mobile-agent .exchange { margin-top: 18px; }
.mobile-agent .question { margin-left: 24px; }
.mobile-agent .answer { color: var(--ink); }
.mobile-agent .agent-source { flex-wrap: wrap; }
.mobile-agent .agent-capture { margin-top: 25px; }
.mobile-agent .agent-capture textarea { min-height: 72px; font-size: 12px; }
.mobile-agent .agent-capture .primary-button { min-height: 44px; font-size: 11px; }
.mobile-time-card { display: grid; gap: 12px; padding: 16px; margin: 20px 0 22px; border: 2px solid var(--ink); background: var(--surface-2); box-shadow: var(--shadow); }
.mobile-time-card span, .mobile-time-card strong, .mobile-time-card small { display: block; }
.mobile-time-card span { font: 700 9px var(--mono); color: var(--muted); }
.mobile-time-card strong { font-size: 22px; margin: 4px 0; }
.mobile-time-card small, .mobile-time-foot { color: var(--muted); font-size: 11px; }
.mobile-time-card .primary-button { width: 100%; min-height: 45px; }
.clock-mobile { padding: 17px; }
.clock-mobile .clock-intro .record-back { padding-bottom: 18px; font-size: 11px; }
.clock-mobile .clock-intro h1 { font-size: 28px; margin: 7px 0; }
.clock-mobile .clock-intro p { font-size: 12px; }
.clock-mobile .clock-card { margin-top: 16px; padding: 13px; }
.clock-mobile .clock-key { min-height: 44px; font-size: 21px; }
.clock-mobile .clock-continue { min-height: 44px; font-size: 13px; }
.clock-mobile .clock-demo-note { font-size: 9px; margin-top: 12px; }
.clock-mobile .clock-person strong { font-size: 15px; }
.clock-mobile .clock-person small { font-size: 10px; }
.clock-mobile .clock-receipt strong { font-size: 18px; }
.clock-mobile .clock-receipt p { font-size: 11px; }
.phone .run-workspace { border: 0; box-shadow: none; min-height: 100%; }
.phone .run-workspace .run-sheet > header { padding: 18px; }
.phone .run-workspace .run-sheet > header h2 { font-size: 23px; }
.phone .run-workspace .run-items { padding: 16px; }
.phone .run-workspace .run-item { display: grid; gap: 10px; }
.phone .run-workspace .run-item-actions { justify-content: start; flex-wrap: wrap; }
.phone .run-workspace .run-sheet > footer { display: grid; gap: 10px; padding: 15px; }
.phone .record-workspace { border: 0; box-shadow: none; min-height: 100%; }
.phone .record-workspace .record-back { min-height: 43px; padding: 0 17px; font-size: 11px; }
.phone .record-workspace > header { padding: 19px 18px 17px; }
.phone .record-workspace > header h2 { font-size: 25px; }
.phone .record-workspace .dossier-body { padding: 17px 18px 35px; }
.phone .record-workspace .dossier-lead { font-size: 12px; }
.phone .record-workspace .dossier-section h3 { font-size: 19px; }
.phone .record-workspace .dossier-section p { font-size: 11px; }
.phone .record-workspace .fact-grid > div { min-height: 65px; padding: 9px; }
.phone .record-workspace .fact-grid strong { font-size: 11px; }

@media (min-width: 1600px) {
  .kiosk-main { padding: 30px 42px 42px; }
  .kiosk-content { gap: 38px; }
  .kiosk-lists button { min-height: 134px; }
  .kiosk-lanes .record-row { min-height: 91px; }
  .kiosk-shell .crew-button { min-height: 85px; }
  .room-head { min-height: 120px; }
  .room-moment strong { font-size: 86px; }
  .room-wall-scroll { padding-top: 20px; }
  .room-wall-intro { margin-bottom: 15px; padding-bottom: 15px; }
  .room-section-title { margin: 16px 0 9px; }
  .room-list { min-height: 125px; padding: 12px 18px; }
  .room-list-preview { margin-top: 9px; }
  .room-lanes { gap: 6px; }
  .room-lanes .lane { padding: 6px 9px; }
  .room-lanes .lane-title { padding-bottom: 4px; }
  .kiosk-lanes.room-lanes .record-row { min-height: 71px; padding: 8px 10px; }
  .room-foot { min-height: 62px; }
}

@media (max-width: 1100px) {
  .kiosk-content { grid-template-columns: 285px minmax(0, 1fr); gap: 20px; }
  .kiosk-main { padding: 22px; }
  .kiosk-lists { grid-template-columns: 1fr; }
  .kiosk-lists button { min-height: 83px; }
  .kiosk-list-symbol { width: 44px; height: 44px; }
  .kiosk-lists strong { font-size: 18px; }
}

@media (max-width: 760px) {
  .kiosk-top { height: 64px; padding: 0 16px; }
  .kiosk-top .brand { font-size: 22px; }
  .kiosk-top .brand-mark { width: 31px; height: 31px; font-size: 21px; }
  .kiosk-main { padding: 20px 16px; }
  .kiosk-content { grid-template-columns: 1fr; }
  .kiosk-side { grid-column: 1; grid-row: 1; }
  .kiosk-content > div { grid-column: 1; grid-row: 2; }
  .crew-buttons { grid-template-columns: repeat(3, 1fr); }
  .kiosk-shell .crew-button { min-height: 63px; font-size: 16px; padding: 7px; }
  .kiosk-side .kiosk-shortcuts { display: none; }
  .kiosk-intro h1 { font-size: 33px; }
  .kiosk-intro p { font-size: 15px; }
  .desktop-main { padding: 22px 14px; }
}

@media (max-width: 480px) {
  .kiosk-main { padding: 16px 12px; }
  .kiosk-lists { grid-template-columns: 1fr; }
  .crew-buttons { grid-template-columns: 1fr; }
  .kiosk-shell .crew-button { min-height: 60px; }
  .kiosk-top-right .badge { display: none; }
  .phone { border: 0; border-radius: 0; box-shadow: none; }
}

@media (max-width: 1100px) {
  .room-head { min-height: 86px; padding: 10px 22px; }
  .room-farm strong { font-size: 31px; }
  .room-moment strong { font-size: 50px; }
  .room-conditions > strong { font-size: 16px; }
  .room-frame { grid-template-columns: 295px minmax(0, 1fr); }
  .room-rail { padding: 18px 15px; }
  .room-rail-title h2 { font-size: 26px; }
  .room-rail-copy { margin: 10px 0; }
  .room-people { gap: 8px; }
  .room-person-button { min-height: 60px; font-size: 18px; }
  .room-person-button span { width: 38px; height: 38px; font-size: 18px; }
  .room-doors { margin-top: 14px; }
  .room-door-label { padding-top: 10px; }
  .room-door { min-height: 56px; }
  .room-wall-scroll { padding: 13px 19px; }
  .room-wall-intro { padding-bottom: 10px; margin-bottom: 12px; }
  .room-wall-intro h1 { font-size: 30px; }
  .room-section-title { margin: 11px 0 7px; }
  .room-section-title h2 { font-size: 24px; }
  .room-list-grid { grid-template-columns: 1fr 1fr; gap: 9px; }
  .room-list { min-height: 91px; padding: 10px; }
  .room-list-head > svg { width: 32px; height: 32px; padding: 5px; }
  .room-list-head strong { font-size: 15px; }
  .room-list-head b { font-size: 21px; }
  .room-list-detail { margin: 6px 0 0 43px; font-size: 11px; }
  .room-list-preview { display: none; }
  .room-lanes { gap: 5px; }
  .room-lanes .lane { padding: 4px 8px; }
  .room-lanes .lane-title { padding: 0 0 3px; font-size: 11px; }
  .room-lanes .record-row { min-height: 53px; padding: 5px 8px; }
  .room-lanes .row-icon { width: 29px; height: 29px; }
  .room-lanes .row-main strong { font-size: 13px; }
  .room-lanes .row-main small { font-size: 10px; }
  .room-foot { min-height: 57px; padding: 8px 15px; }
  .room-foot span { display: none; }
  .room-foot-action, .room-foot-agent { font-size: 12px; }
  .room-clock { grid-template-columns: 1fr 360px; padding: 25px 40px; gap: 30px; }
  .help-grid { grid-template-columns: 1fr; }
}

@media (min-width: 1101px) and (max-height: 950px) {
  .room-head { min-height: 114px; }
  .room-moment strong { font-size: 75px; }
  .room-wall-scroll { padding-top: 19px; }
  .room-wall-intro { margin-bottom: 15px; padding-bottom: 14px; }
  .room-section-title { margin: 15px 0 8px; }
  .room-list { min-height: 115px; padding: 12px 17px; }
  .room-list-preview { margin-top: 8px; }
  .room-lanes { gap: 5px; }
  .room-lanes .lane { padding: 5px 9px; }
  .room-lanes .lane-title { padding-bottom: 3px; }
  .room-lanes .record-row { min-height: 58px; padding: 7px 10px; }
  .room-foot { min-height: 58px; }
}

@media (min-width: 481px) and (max-height: 800px) {
  .mobile-stage { padding-top: 20px; }
  .mobile-context { padding-top: 85px; }
  .phone { height: min(716px, calc(100vh - 88px)); }
}

@media (min-width: 761px) and (max-width: 1100px) and (min-height: 950px) {
  .room-head { min-height: 105px; }
  .room-wall-scroll { padding-top: 25px; }
  .room-wall-intro { padding-bottom: 18px; margin-bottom: 20px; }
  .room-section-title { margin: 20px 0 12px; }
  .room-list { min-height: 111px; }
  .room-lanes { gap: 10px; }
  .room-lanes .lane { padding: 8px; }
  .room-lanes .record-row { min-height: 73px; }
}

@media (max-width: 850px) {
  .reference-bar .reset-button, .reference-bar .compare-link { display: none; }
}

@media (max-width: 760px) {
  .room-shell { height: auto; min-height: calc(100vh - 48px); }
  .room-head { min-height: 90px; grid-template-columns: 1fr auto; }
  .room-farm strong { font-size: 27px; }
  .room-moment { justify-items: end; }
  .room-moment strong { font-size: 45px; }
  .room-moment span, .room-conditions { display: none; }
  .room-frame { display: block; }
  .room-rail { overflow: visible; border-right: 0; border-bottom: 3px solid var(--ink); }
  .room-rail-title h2 { font-size: 22px; }
  .room-people { grid-template-columns: repeat(3, 1fr); }
  .room-person-button { min-height: 65px; gap: 6px; padding: 6px; font-size: 14px; }
  .room-person-button span { width: 34px; height: 34px; font-size: 15px; }
  .room-doors { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 10px; margin-top: 15px; }
  .room-door-label { grid-column: 1 / -1; }
  .room-door { min-height: 56px; gap: 4px; }
  .room-door small, .room-door > svg:last-child { display: none; }
  .room-door strong { font-size: 12px; }
  .room-wall { overflow: visible; }
  .room-wall-scroll { overflow: visible; }
  .room-wall-intro h1 { font-size: 30px; }
  .room-wall-status { display: none; }
  .room-section-title > small { display: none; }
  .room-foot { flex-wrap: wrap; }
  .room-clock { display: block; padding: 25px 20px; }
  .room-clock .clock-card { margin: 20px auto; max-width: 430px; }
}

@media (prefers-reduced-motion: reduce) {
  button { transition: none; }
  ::view-transition-old(root), ::view-transition-new(root) { animation-duration: 0ms; }
}

/* A goal is a continuing condition, so its surface reads as an instrument rather than a task card. */
.loop-shell { color: var(--ink); }
.loop-calm { display: flex; align-items: start; gap: 18px; padding: 27px; border: 2px solid var(--ink); background: var(--surface-2); }
.loop-calm > svg { color: var(--good); flex: none; }
.loop-calm h2 { font-size: 30px; margin: 5px 0; }
.loop-calm p { color: var(--ink-2); max-width: 700px; }
.manager-loop-callout { display: flex; align-items: center; gap: 17px; width: 100%; min-height: 92px; margin: 0 0 18px; padding: 17px 20px; text-align: left; background: var(--accent); border: 2px solid var(--ink); box-shadow: var(--shadow); color: #211d15; }
.manager-loop-callout > span:nth-child(2) { flex: 1; }
.manager-loop-callout small, .manager-loop-callout strong, .manager-loop-callout em { display: block; }
.manager-loop-callout small { font: 800 10px var(--mono); letter-spacing: .05em; }
.manager-loop-callout strong { font-size: clamp(18px,1.45vw,25px); margin: 4px 0; }
.manager-loop-callout em { font-size: 12px; font-style: normal; }
.loop-tabs { margin-top: 5px; }
.loop-feature { display: block; width: 100%; padding: 0; text-align: left; background: var(--surface-2); color: var(--ink); border: 3px solid var(--ink); box-shadow: var(--shadow); }
.loop-feature-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 19px; background: var(--side); color: var(--side-ink); font: 800 11px var(--mono); letter-spacing: .06em; }
.loop-feature-main { display: grid; grid-template-columns: minmax(0, 1fr) 180px; gap: 25px; padding: 25px 28px; }
.loop-feature-main h2 { font-size: clamp(27px, 2.3vw, 42px); max-width: 740px; line-height: 1.08; }
.loop-feature-main p { color: var(--ink-2); font-size: 15px; max-width: 650px; margin: 14px 0 22px; }
.loop-feature-link { display: flex; align-items: center; gap: 8px; font-weight: 800; color: var(--accent); }
.loop-gauge { border-left: 2px solid var(--ink); padding-left: 24px; display: flex; flex-direction: column; align-items: start; justify-content: center; }
.loop-gauge span, .loop-overview-foot span, .loop-facts span { font: 800 10px var(--mono); color: var(--muted); letter-spacing: .05em; }
.loop-gauge strong { font: 800 56px/1 var(--font); letter-spacing: -.07em; margin: 6px 0; }
.loop-gauge em { font-size: 24px; color: var(--muted); font-style: normal; }
.loop-gauge small { color: var(--ink-2); font-size: 12px; }
.loop-overview-foot { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0; margin: 16px 0 25px; background: var(--surface-2); border: 2px solid var(--ink); }
.loop-overview-foot > div { display: grid; align-content: center; gap: 6px; min-height: 93px; padding: 13px 18px; border-right: 1px solid var(--line-strong); }
.loop-overview-foot > div:last-child { border-right: 0; }
.loop-overview-foot strong { font-size: 16px; }
.loop-overview-foot small { color: var(--muted); font-size: 11px; }
.loop-quiet-rows { border-top: 2px solid var(--ink); padding-top: 15px; }
.loop-quiet-rows > .overline { margin-bottom: 10px; }
.loop-quiet-rows .record-row { min-height: 67px; background: var(--surface-2); border: 1px solid var(--line-strong); }
.loop-detail > .record-back { margin-bottom: 20px; }
.loop-detail-head { display: flex; align-items: start; justify-content: space-between; gap: 30px; }
.loop-detail-head h1 { font-size: clamp(31px, 2.65vw, 52px); max-width: 900px; line-height: 1.05; margin: 8px 0 13px; }
.loop-detail-head p { max-width: 750px; font-size: 15px; color: var(--ink-2); }
.loop-status { min-width: 145px; display: flex; flex-direction: column; align-items: end; padding-top: 5px; }
.loop-status strong { font: 800 42px/1 var(--font); margin: 11px 0 3px; }
.loop-status span { color: var(--muted); font-size: 11px; }
.loop-sequence { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 0; margin: 28px 0 22px; border: 2px solid var(--ink); background: var(--surface-2); }
.loop-step { min-width: 0; display: grid; align-content: start; gap: 5px; min-height: 115px; padding: 14px; border-right: 1px solid var(--line-strong); }
.loop-step:last-child { border-right: 0; }
.loop-step.current { background: var(--accent-soft); box-shadow: inset 0 5px var(--accent); }
.loop-step.done { box-shadow: inset 0 5px var(--good); }
.loop-step b { color: var(--muted); font: 800 10px var(--mono); }
.loop-step strong { font-size: 17px; }
.loop-step small { color: var(--ink-2); font-size: 11px; line-height: 1.3; }
.loop-detail-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 15px; }
.loop-plan, .loop-place { min-width: 0; padding: 24px; background: var(--surface-2); border: 2px solid var(--ink); }
.loop-plan h2, .loop-place h2, .loop-proof h2, .loop-control h2, .loop-history h2 { font-size: clamp(23px, 1.8vw, 32px); line-height: 1.12; margin: 7px 0 13px; }
.loop-plan > p, .loop-place > p, .loop-proof p, .loop-control-intro p, .loop-history > p { color: var(--ink-2); font-size: 14px; line-height: 1.5; }
.loop-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin-top: 21px; border: 1px solid var(--line-strong); background: var(--line-strong); }
.loop-facts > div { display: grid; gap: 5px; min-height: 70px; padding: 11px; background: var(--surface); }
.loop-facts strong { font-size: 13px; }
.loop-decision-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 20px; }
.loop-decision-actions .primary-button, .loop-decision-actions .secondary-button { min-height: 45px; font-size: 13px; }
.loop-held { display: flex; align-items: center; gap: 9px; width: 100%; padding: 11px; border-left: 5px solid var(--warning); background: var(--warning-soft); font-size: 12px; font-weight: 800; }
.loop-decision-stamp { display: flex; align-items: center; gap: 9px; margin-top: 20px; padding: 11px 13px; border-left: 5px solid var(--accent); background: var(--accent-soft); font-size: 13px; }
.loop-place-row { display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; padding: 11px 0; border-bottom: 1px solid var(--line-strong); }
.loop-place-row span { font-weight: 800; font-size: 14px; }
.loop-place-row strong { font-size: 13px; }
.loop-place-row small { grid-column: 1 / -1; color: var(--muted); font-size: 11px; }
.loop-place-note { margin-top: 14px; padding: 10px; border-left: 4px solid var(--warning); background: var(--warning-soft); }
.loop-actuators { margin-top: 20px; }
.loop-actuators > .overline { padding-bottom: 10px; }
.loop-actuator-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.loop-actuator { min-width: 0; min-height: 218px; padding: 18px; display: flex; flex-direction: column; align-items: start; border: 2px solid var(--ink); background: var(--surface-2); }
.loop-actuator.human { border-top: 8px solid var(--accent); }
.loop-actuator.digital { border-top: 8px solid var(--good); }
.loop-actuator.physical { border-top: 8px solid var(--line-strong); }
.loop-actuator-top { width: 100%; display: flex; align-items: center; gap: 8px; }
.loop-actuator-top > span { flex: 1; font: 800 10px var(--mono); color: var(--muted); }
.loop-actuator h3 { font-size: 21px; margin: 17px 0 6px; }
.loop-actuator p { color: var(--ink-2); font-size: 12px; line-height: 1.45; margin-bottom: 14px; }
.loop-actuator .secondary-button { margin-top: auto; }
.loop-proof { background: var(--side); color: var(--side-ink); padding: 28px; margin-top: 20px; }
.loop-proof > div { max-width: 1100px; }
.loop-proof .overline { color: #adc7ae; }
.loop-proof h2 { font-size: clamp(28px, 2.25vw, 43px); }
.loop-proof p { color: #c8d7c9; }
.loop-proof-source { display: flex; align-items: center; gap: 13px; padding: 15px; margin-top: 20px; border: 1px solid #91a79b; }
.loop-proof-source > span { flex: 1; }
.loop-proof-source strong, .loop-proof-source small { display: block; }
.loop-proof-source small { color: #bfd0c0; margin-top: 3px; font-size: 11px; }
.loop-simulate { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 22px; padding-top: 14px; border-top: 1px solid #728479; }
.loop-simulate > span { width: 100%; font: 800 10px var(--mono); color: #c3d2c5; }
.loop-control-intro { max-width: 790px; margin-bottom: 22px; }
.loop-capability { display: flex; align-items: center; gap: 17px; min-height: 100px; padding: 16px; margin-bottom: 8px; background: var(--surface-2); border: 2px solid var(--ink); }
.loop-capability-icon { width: 46px; height: 46px; display: grid; place-items: center; background: var(--accent); color: #211d15; }
.loop-capability > div { flex: 1; min-width: 0; }
.loop-capability > div > span { font: 800 10px var(--mono); color: var(--muted); }
.loop-capability h3 { font-size: 20px; margin: 3px 0; }
.loop-capability p { color: var(--ink-2); font-size: 12px; }
.loop-control-floor { display: flex; align-items: center; gap: 15px; margin-top: 19px; padding: 19px; background: var(--side); color: var(--side-ink); }
.loop-control-floor > div { flex: 1; }
.loop-control-floor strong { font-size: 18px; }
.loop-control-floor p { font-size: 12px; color: #c3d4c6; margin-top: 4px; }
.loop-history { max-width: 950px; }
.loop-history-list { border-top: 2px solid var(--ink); margin: 25px 0; }
.loop-history-list > div { display: grid; grid-template-columns: 70px 130px minmax(0,1fr); gap: 12px; padding: 16px 12px; border-bottom: 1px solid var(--line-strong); background: var(--surface-2); font-size: 13px; }
.loop-history-list time { font: 700 11px var(--mono); color: var(--muted); }
@media (max-width: 1250px) { .loop-detail-grid, .loop-actuator-grid { grid-template-columns: 1fr; } .loop-actuator { min-height: 0; } .loop-sequence { grid-template-columns: repeat(5,minmax(0,1fr)); } .loop-step { padding: 10px; } .loop-step strong { font-size: 14px; } }
@media (max-width: 760px) { .loop-feature-main, .loop-overview-foot, .loop-detail-grid { grid-template-columns: 1fr; } .loop-gauge { border-left: 0; border-top: 2px solid var(--ink); padding: 15px 0 0; } .loop-overview-foot > div { border-right: 0; border-bottom: 1px solid var(--line-strong); } .loop-detail-head { display: block; } .loop-status { align-items: start; } .loop-sequence { overflow-x: auto; display: flex; } .loop-step { min-width: 135px; } .loop-control-floor { align-items: start; flex-wrap: wrap; } .loop-history-list > div { grid-template-columns: 58px minmax(0,1fr); } .loop-history-list > div span { grid-column: 2; } }
.mobile-loops .loop-shell .page-head h1 { font-size: 25px; }
.mobile-loops .loop-feature-main { padding: 17px; }
.mobile-loops .loop-feature-main h2 { font-size: 22px; }
.mobile-loops .loop-feature-main p, .mobile-loops .loop-detail-head p { font-size: 12px; }
.mobile-loops .loop-status strong { font-size: 30px; }
.mobile-loops .loop-actuator-grid, .mobile-loops .loop-detail-grid, .mobile-loops .loop-overview-foot { grid-template-columns: 1fr; }
.mobile-loops .loop-sequence { display: flex; overflow-x: auto; }
.mobile-loops .loop-step { min-width: 130px; }
.mobile-loops .loop-plan, .mobile-loops .loop-place, .mobile-loops .loop-proof { padding: 15px; }
.mobile-loops .loop-facts { grid-template-columns: 1fr; }
.mobile-loops .loop-history-list > div { grid-template-columns: 1fr; gap: 4px; }
.mobile-loops .loop-history-list > div span { grid-column: 1; }
.loop-map-intro { display: flex; justify-content: space-between; align-items: start; gap: 24px; margin: 8px 0 24px; }
.loop-map-intro h1 { font-size: clamp(32px,3vw,51px); line-height: 1.06; margin: 8px 0 12px; }
.loop-map-intro p { max-width: 780px; color: var(--ink-2); font-size: 15px; }
.loop-map-canvas { position: relative; min-height: 350px; border: 2px solid var(--ink); padding: 20px 25px; background: repeating-linear-gradient(0deg,transparent 0 39px,var(--line) 40px),repeating-linear-gradient(90deg,var(--surface-2) 0 39px,var(--line) 40px); box-shadow: 7px 7px 0 var(--shadow); }
.loop-map-label { font: 800 11px var(--mono); letter-spacing: .09em; }
.loop-map-path { display: flex; align-items: center; justify-content: center; gap: 20px; min-height: 215px; }
.loop-map-node { display: grid; gap: 8px; min-width: 220px; padding: 20px; border: 2px solid var(--ink); background: var(--surface); box-shadow: 5px 5px 0 var(--shadow); }
.loop-map-node small, .loop-map-side small { font: 800 10px var(--mono); letter-spacing: .08em; }
.loop-map-node strong { font-size: 23px; line-height: 1.1; }
.loop-map-node span, .loop-map-side span { font-size: 12px; color: var(--ink-2); }
.loop-map-node.destination { border-top: 7px solid var(--accent); }
.loop-map-link { display: grid; justify-items: center; gap: 9px; color: var(--ink); }
.loop-map-link span { font: 800 10px var(--mono); white-space: nowrap; }
.loop-map-side { display: flex; gap: 9px; }
.loop-map-side > div { display: grid; gap: 4px; min-width: 175px; padding: 10px 13px; background: var(--surface); border: 1px solid var(--line-strong); }
.loop-map-side strong { font-size: 14px; }
.loop-map-ledger { display: grid; grid-template-columns: 1.25fr 1fr; gap: 12px; margin-top: 24px; }
.loop-map-ledger section { padding: 24px; border: 2px solid var(--ink); background: var(--surface); }
.loop-map-ledger h2 { font-size: 24px; margin: 7px 0 18px; }
.loop-map-ledger p { color: var(--ink-2); line-height: 1.5; }
.loop-map-ledger .secondary-button { margin-top: 15px; }
.loop-map-fact { display: flex; justify-content: space-between; gap: 18px; padding: 11px 0; border-top: 1px solid var(--line-strong); font-size: 13px; }
.loop-map-fact span { color: var(--ink-2); text-align: right; }
@media (max-width: 760px) { .loop-map-intro { display: block; } .loop-map-path { flex-direction: column; gap: 8px; padding: 20px 0; } .loop-map-link { transform: rotate(90deg); margin: 5px 0; } .loop-map-link span { display: none; } .loop-map-node { width: 100%; min-width: 0; } .loop-map-side { flex-direction: column; } .loop-map-ledger { grid-template-columns: 1fr; } .loop-map-fact { display: grid; gap: 2px; } .loop-map-fact span { text-align: left; } }
.context-page { flex: 1; min-height: 0; overflow: auto; padding: 32px clamp(22px,3vw,54px) 48px; }
.context-page > .record-back { margin-bottom: 22px; }
.context-hero { display: flex; align-items: stretch; justify-content: space-between; gap: 25px; padding: 0 0 26px; border-bottom: 3px solid var(--ink); }
.context-hero h1 { font-size: clamp(33px,3vw,53px); line-height: 1.03; margin: 7px 0 12px; }
.context-hero p { max-width: 760px; font-size: 16px; color: var(--ink-2); }
.context-reading { flex: none; min-width: 190px; display: grid; align-content: center; justify-items: center; padding: 15px 20px; border: 2px solid var(--ink); background: var(--accent); }
.context-reading strong { font: 800 52px/1 var(--font); letter-spacing: -.05em; }
.context-reading span { font: 800 10px var(--mono); margin-top: 6px; }
.context-reading.source-reading { background: var(--surface-2); }
.context-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; margin-top: 25px; }
.context-grid section { min-width: 0; padding: 23px; border: 2px solid var(--ink); background: var(--surface-2); }
.context-grid h2 { font-size: 25px; margin: 7px 0 16px; }
.context-grid p { color: var(--ink-2); font-size: 14px; line-height: 1.45; }
.context-line { display: flex; justify-content: space-between; gap: 12px; border-top: 1px solid var(--line-strong); padding: 15px 0; font-size: 13px; }
.context-line span { text-align: right; color: var(--ink-2); }
.context-note { border-top: 2px solid var(--ink); padding-top: 14px; }
.context-impact { display: flex; align-items: start; gap: 11px; padding: 15px; margin: 20px 0; border-left: 5px solid var(--accent); background: var(--canvas); }
.context-impact svg { flex: none; }
.context-impact strong, .context-impact small { display: block; }
.context-impact small { color: var(--ink-2); font-size: 12px; margin-top: 4px; }
.context-related { margin-top: 18px; border: 2px solid var(--ink); }
@media (max-width: 900px) { .context-hero, .context-grid { display: grid; grid-template-columns: 1fr; } .context-reading { justify-items: start; } }

/* A list record is an operating surface: cohort, today's commitment, then members. */
.fresh-record > header { padding: 12px 28px 10px; }
.fresh-record > header h2 { font-size: clamp(29px, 2.2vw, 40px); margin: 2px 0; }
.fresh-record > header p { display: none; }
.fresh-record .dossier-body { max-width: none; padding: 15px 28px 38px; }
.fresh-list-summary { display: grid; grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr); gap: 12px; }
.fresh-count, .fresh-round { min-width: 0; padding: 13px 16px; border: 2px solid var(--ink); }
.fresh-count { background: var(--accent); color: var(--accent-ink); }
.fresh-count .overline { color: var(--accent-ink); }
.fresh-count > strong { display: block; margin: 4px 0; font: 800 clamp(43px, 3.5vw, 59px)/1 var(--font); letter-spacing: -.07em; }
.fresh-count > strong span { font-size: .42em; letter-spacing: -.03em; }
.fresh-count p { max-width: 330px; font-size: 12px; }
.fresh-round { background: var(--surface); }
.fresh-round h3 { margin: 5px 0 9px; font-size: clamp(22px, 2vw, 29px); }
.fresh-round p { margin: 6px 0 9px; color: var(--ink-2); font-size: 12px; }
.fresh-progress { height: 11px; border: 1px solid var(--ink); background: var(--surface-3); }
.fresh-progress i { display: block; height: 100%; background: var(--good); }
.fresh-members-head { display: flex; justify-content: space-between; align-items: end; gap: 15px; margin: 15px 0 8px; }
.fresh-members-head h3 { margin-top: 4px; font-size: clamp(22px, 2vw, 29px); }
.fresh-members-head > span { color: var(--muted); font: 700 10px var(--mono); white-space: nowrap; }
.fresh-members { border: 2px solid var(--ink); background: var(--surface); }
.fresh-members .record-row { min-height: 68px; border-bottom: 1px solid var(--line); padding: 8px 18px; }
.fresh-members .record-row:last-child { border-bottom: 0; }
.fresh-members .row-icon { background: var(--accent-soft); }
.fresh-members .record-row:hover, .fresh-members .record-row:focus-visible { background: var(--accent-soft); }
.fresh-list-foot { display: flex; gap: 18px; margin-top: 18px; padding: 15px 18px; border-left: 5px solid var(--ink); background: var(--canvas); font-size: 12px; }
.fresh-list-foot strong { flex: none; }
.fresh-list-foot p { color: var(--ink-2); }
@media (max-width: 850px) { .fresh-list-summary { grid-template-columns: 1fr; } .fresh-members-head { align-items: start; flex-direction: column; } .fresh-list-foot { display: block; } .fresh-list-foot p { margin-top: 5px; } }

/* The animal record starts with attention and action; source disagreement remains visible. */
.cow-record > header { padding: 17px 28px 14px; }
.cow-record > header h2 { font-size: clamp(31px, 2.8vw, 43px); margin: 3px 0; }
.cow-record .dossier-body { max-width: none; padding: 16px 28px 35px; }
.cow-overview { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(270px, .85fr); gap: 12px; }
.cow-state, .cow-next { min-width: 0; border: 2px solid var(--ink); padding: 20px 22px; }
.cow-state { display: flex; flex-direction: column; background: var(--accent); color: var(--accent-ink); }
.cow-state .overline { color: inherit; }
.cow-state-warning { background: var(--warning-soft); color: var(--ink); border-color: var(--warning); }
.cow-state-good { background: var(--good-soft); color: var(--ink); border-color: var(--good); }
.cow-state h3 { max-width: 560px; margin: 7px 0 8px; font-size: clamp(28px, 2.7vw, 41px); line-height: 1.06; }
.cow-state p { max-width: 560px; font-size: 14px; line-height: 1.45; }
.cow-state-foot { display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: center; margin-top: auto; padding-top: 22px; font: 700 11px var(--mono); }
.cow-state-foot span:first-child { display: inline-flex; align-items: center; gap: 7px; }
.cow-next { background: var(--surface); display: flex; flex-direction: column; align-items: flex-start; }
.cow-next h3 { margin: 7px 0; font-size: clamp(23px, 2vw, 29px); line-height: 1.1; }
.cow-next p { color: var(--ink-2); font-size: 13px; line-height: 1.45; }
.cow-next .primary-button { margin-top: auto; min-height: 46px; padding: 9px 15px; }
.cow-evidence { margin-top: 24px; }
.cow-section-title { display: flex; align-items: end; justify-content: space-between; gap: 15px; border-bottom: 2px solid var(--ink); padding-bottom: 9px; }
.cow-section-title h3 { margin-top: 3px; font-size: 25px; }
.cow-section-title > span { font: 800 10px var(--mono); color: var(--muted); }
.cow-source-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 12px 0; }
.cow-source-grid > div { background: var(--surface); border: 1px solid var(--line-strong); border-left: 5px solid var(--good); padding: 13px 15px; }
.cow-source-grid .cow-source-conflict { border-left-color: var(--warning); background: var(--warning-soft); }
.cow-source-grid .cow-source-physical { border-left-color: var(--good); background: var(--good-soft); }
.cow-source-grid span, .cow-source-grid small { display: block; font: 700 10px var(--mono); color: var(--muted); }
.cow-source-grid strong { display: block; font-size: 21px; margin: 3px 0; }
.cow-evidence-note { max-width: 680px; color: var(--ink-2); font-size: 12px; margin: 5px 0 14px; }
.cow-evidence .record-row { max-width: 680px; min-height: 53px; border-top: 1px solid var(--line); }
.cow-record .history-block { margin-top: 19px; border-top: 2px solid var(--ink); }
.cow-record .history-block > .overline { color: var(--ink); }
.cow-record .history-block > div:not(:first-child) { margin: 8px 0; padding: 3px 0 7px 14px; }
.cow-record .history-block p { font-size: 12px; }
.cow-physical-actions { width: 100%; margin-top: auto; padding-top: 10px; }
.cow-physical-actions p { margin: 4px 0 9px; }
.cow-physical-actions .primary-button, .cow-physical-actions .secondary-button { margin: 0 7px 7px 0; min-height: 40px; }
.cow-depth { margin-top: 27px; }
.cow-depth-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; margin-top: 12px; }
.cow-vitals, .cow-care { border: 2px solid var(--ink); background: var(--surface); padding: 18px 20px; min-width: 0; }
.cow-vital-value { display: flex; align-items: baseline; gap: 15px; margin: 8px 0 15px; font: 800 42px/1 var(--font); letter-spacing: -.06em; }
.cow-vital-value small { color: var(--muted); font: 700 10px var(--mono); letter-spacing: 0; }
.cow-readings { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--line-strong); }
.cow-readings > div { min-width: 0; padding: 11px 12px; border-right: 1px solid var(--line-strong); }
.cow-readings > div:last-child { border-right: 0; }
.cow-readings .pending { background: var(--accent-soft); }
.cow-readings .observed { background: var(--good-soft); }
.cow-readings span, .cow-readings small { display: block; color: var(--muted); font: 700 9px var(--mono); }
.cow-readings strong { display: block; font-size: 19px; margin: 4px 0; }
.cow-vitals > p { margin-top: 13px; color: var(--muted); font-size: 11px; }
.cow-care > div:not(.overline) { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.cow-care span { color: var(--muted); font: 700 10px var(--mono); }
.cow-care strong { text-align: right; font-size: 13px; }
.cow-temperature-form { display: flex; gap: 10px; align-items: end; margin-top: 16px; }
.cow-temperature-form label { display: grid; gap: 4px; flex: 1; font-size: 11px; font-weight: 800; }
.cow-temperature-form label span { display: inline; }
.cow-temperature-form input { width: 100%; min-height: 41px; padding: 8px; border: 2px solid var(--ink); background: var(--surface-2); color: var(--ink); }
.cow-temperature-form button { min-height: 41px; }
.cow-related { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 13px; }
.cow-related .record-row { border: 1px solid var(--line-strong); background: var(--surface); }
@media (max-width: 850px) { .cow-overview { grid-template-columns: 1fr; } .cow-next .primary-button { margin-top: 17px; } }
@media (max-width: 850px) { .cow-depth-grid, .cow-related { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .cow-record > header { padding: 14px 17px; } .cow-record .dossier-body { padding: 13px 17px 28px; } .cow-state, .cow-next { padding: 16px; } .cow-state h3 { font-size: 27px; } .cow-source-grid { grid-template-columns: 1fr; gap: 7px; } .cow-section-title h3 { font-size: 21px; } }
.phone .cow-record > header { padding: 12px 17px; }
.phone .cow-record .dossier-body { padding: 11px 17px 25px; }
.phone .cow-overview, .phone .cow-source-grid { grid-template-columns: 1fr; }
.phone .cow-overview { gap: 8px; }
.phone .cow-state, .phone .cow-next { padding: 12px 14px; }
.phone .cow-state h3 { font-size: 23px; margin: 4px 0; }
.phone .cow-state p, .phone .cow-next p { font-size: 11px; }
.phone .cow-state-foot { padding-top: 9px; font-size: 9px; }
.phone .cow-next h3 { font-size: 18px; margin: 4px 0; }
.phone .cow-next .primary-button { margin-top: 9px; min-height: 38px; }
.phone .cow-section-title h3 { font-size: 20px; }
.phone .cow-source-grid { gap: 7px; }
.phone .cow-depth-grid, .phone .cow-related { grid-template-columns: 1fr; }
.phone .cow-vitals, .phone .cow-care { padding: 13px; }
.phone .cow-temperature-form { display: grid; }
.phone .cow-readings > div { padding: 7px; }
.phone .cow-readings strong { font-size: 13px; }
.phone .cow-readings span, .phone .cow-readings small { font-size: 8px; }

/* Robot 3 is a machine state and a recovery loop, not a sheet of equal facts. */
.robot-record > header { padding: 17px 28px 14px; }
.robot-record > header h2 { font-size: clamp(31px, 2.8vw, 43px); margin: 3px 0; }
.robot-record .dossier-body { max-width: none; padding: 16px 28px 35px; }
.robot-overview { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(290px, .88fr); gap: 12px; }
.robot-state, .robot-next { min-width: 0; border: 2px solid var(--ink); padding: 20px 22px; }
.robot-state-down { background: var(--ink); color: var(--surface); }
.robot-state-down .overline { color: var(--accent); }
.robot-state-good { background: var(--good-soft); color: var(--ink); border-color: var(--good); }
.robot-state h3 { margin: 7px 0; font-size: clamp(36px, 3.1vw, 48px); line-height: 1; }
.robot-state p { max-width: 570px; font-size: 13px; line-height: 1.45; }
.robot-state-measure { display: flex; gap: 13px; align-items: end; margin-top: 25px; }
.robot-state-measure strong { font: 800 42px/1 var(--font); letter-spacing: -.07em; }
.robot-state-measure span { font: 700 10px/1.45 var(--mono); }
.robot-next { display: flex; flex-direction: column; align-items: flex-start; background: var(--surface); }
.robot-next h3 { margin: 7px 0; font-size: clamp(23px, 2vw, 29px); line-height: 1.12; }
.robot-next p { color: var(--ink-2); font-size: 13px; line-height: 1.45; }
.robot-next > .primary-button, .robot-next > .record-row { margin-top: auto; }
.robot-next > .record-row { width: 100%; padding-left: 0; padding-right: 0; }
.robot-next > small { color: var(--muted); font: 700 9px var(--mono); margin-top: 7px; }
.robot-loop, .robot-impact { margin-top: 24px; }
.robot-section-head { display: flex; justify-content: space-between; align-items: end; gap: 15px; padding-bottom: 9px; border-bottom: 2px solid var(--ink); }
.robot-section-head h3 { margin-top: 3px; font-size: 25px; }
.robot-section-head > span { font: 800 10px var(--mono); color: var(--muted); }
.robot-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.robot-steps > div { position: relative; min-width: 0; border: 1px solid var(--line-strong); border-top: 5px solid var(--line-strong); background: var(--surface); padding: 14px 16px; }
.robot-steps > .done { border-top-color: var(--good); }
.robot-steps > .current { border-top-color: var(--accent); background: var(--accent-soft); }
.robot-steps > .waiting { border-top-style: dashed; }
.robot-steps b { display: inline-block; margin-bottom: 14px; font: 800 16px var(--mono); }
.robot-steps span, .robot-steps small { display: block; color: var(--muted); font: 700 10px var(--mono); }
.robot-steps strong { display: block; font-size: 18px; margin: 5px 0; }
.robot-impact-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.robot-impact-grid > div { border-left: 4px solid var(--ink); background: var(--surface); padding: 12px 15px; }
.robot-impact-grid span, .robot-impact-grid small { display: block; color: var(--muted); font: 700 10px/1.4 var(--mono); }
.robot-impact-grid strong { display: block; font-size: 20px; margin: 5px 0; }
.robot-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 15px; margin-top: 16px; }
.robot-links .record-row { border-top: 1px solid var(--line); }
.robot-record .history-block { margin-top: 20px; border-top: 2px solid var(--ink); }
.robot-record .history-block p { font-size: 12px; }
@media (max-width: 850px) { .robot-overview, .robot-steps, .robot-impact-grid, .robot-links { grid-template-columns: 1fr; } .robot-next > .primary-button, .robot-next > .record-row { margin-top: 15px; } }
.phone .robot-record > header { padding: 12px 17px; }
.phone .robot-record .dossier-body { padding: 11px 17px 25px; }
.phone .robot-overview, .phone .robot-steps, .phone .robot-impact-grid, .phone .robot-links { grid-template-columns: 1fr; }
.phone .robot-overview { gap: 8px; }
.phone .robot-state, .phone .robot-next { padding: 13px 15px; }
.phone .robot-state h3 { font-size: 27px; }
.phone .robot-state p, .phone .robot-next p { font-size: 11px; }
.phone .robot-state-measure { margin-top: 10px; }
.phone .robot-state-measure strong { font-size: 30px; }
.phone .robot-next h3 { font-size: 19px; }
.phone .robot-section-head h3 { font-size: 20px; }

@media (min-width: 1250px) {
  .desktop-main > .room-agent-workspace { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-content: start; }
  .desktop-main > .room-agent-workspace > header, .desktop-main > .room-agent-workspace > form, .desktop-main > .room-agent-workspace > .room-agent-prompts, .desktop-main > .room-agent-workspace > .room-agent-exchanges { grid-column: 1 / -1; }
  .desktop-main > .room-agent-workspace .agent-context, .desktop-main > .room-agent-workspace .agent-investigation { max-width: none; min-width: 0; margin: 0; }
  .desktop-main > .room-agent-workspace .agent-context, .desktop-main > .room-agent-workspace .agent-investigation-ready, .desktop-main > .room-agent-workspace .agent-investigation-result { display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; }
  .desktop-main > .room-agent-workspace .room-agent-input { max-width: none; margin: 0; }
  .desktop-main > .room-agent-workspace .room-agent-prompts { max-width: none; margin: 0; }
  .desktop-main > .room-agent-workspace .room-agent-exchanges { max-width: none; }
}
.agent-investigation { max-width: 820px; margin: 17px 0 0; padding: 18px 22px; background: var(--surface-2); border: 2px solid var(--ink); box-shadow: var(--shadow); }
.agent-investigation-ready, .agent-investigation-result { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 7px; }
.agent-investigation h2 { font-size: 21px; line-height: 1.16; margin-bottom: 6px; }
.agent-investigation p { font-size: 13px; color: var(--ink-2); max-width: 540px; }
.agent-investigation .primary-button { flex: none; min-height: 43px; }
.mobile-agent .agent-investigation { margin: 15px 0; padding: 14px; box-shadow: none; }
.mobile-agent .agent-investigation-ready, .mobile-agent .agent-investigation-result { display: grid; }
.mobile-agent .agent-investigation h2 { font-size: 16px; }
.mobile-agent .agent-investigation p { font-size: 12px; }
@media (max-width: 900px) { .agent-investigation-ready, .agent-investigation-result { align-items: start; flex-direction: column; } }

/* Crew attention: one owned action, then time and a single door to the wider farm. */
.room-priority { display: grid; gap: 8px; padding: 17px; background: var(--ink); color: var(--surface); border: 2px solid var(--ink); box-shadow: 5px 5px 0 var(--accent); margin-bottom: 8px; }
.room-priority .overline { color: var(--accent); }
.room-priority > strong { font: 800 24px/1.05 var(--font); letter-spacing: -.04em; }
.room-priority > span { color: var(--line-strong); font-size: 12px; }
.room-priority-action { min-height: 53px; margin-top: 7px; display: flex; align-items: center; justify-content: space-between; gap: 10px; background: var(--accent); color: #201b12; border: 2px solid var(--accent); padding: 9px 13px; font: 800 15px var(--font); text-align: left; }
.room-priority-action:hover { filter: brightness(1.08); transform: translateY(-1px); }
.room-priority-progress { box-shadow: none; }
.room-priority-progress > strong { font-size: 20px; }
.room-priority-meter { height: 7px; background: #ffffff30; margin-top: 7px; }
.room-priority-meter i { display: block; height: 100%; background: var(--accent); }
.crew-lookup { flex: 1; min-height: 0; overflow: auto; padding: 27px clamp(20px,3vw,48px) 48px; }
.crew-lookup h1 { font-size: clamp(34px,3vw,50px); line-height: 1; margin: 8px 0; }
.crew-lookup > p { max-width: 610px; color: var(--ink-2); font-size: 15px; }
.crew-lookup-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; margin-top: 30px; }
.crew-lookup-grid section { background: var(--surface); border: 2px solid var(--ink); padding: 16px 20px; }
.crew-lookup-grid section > .overline { padding-bottom: 11px; border-bottom: 2px solid var(--ink); }
.crew-lookup-grid .record-row { min-height: 72px; }

/* A camera belongs to a place; the plan is a navigable instrument, not a 3D postcard. */
.farm-workspace,.cameras-workspace { min-width: 0; }
.farm-workspace .page-head,.cameras-workspace .page-head { margin-bottom: 19px; }
.farm-workspace .page-head h1,.cameras-workspace .page-head h1 { font-size: clamp(34px,3.6vw,54px); line-height: 1.03; }
.farm-layout { display: grid; grid-template-columns: minmax(0,1.65fr) minmax(280px,.75fr); align-items: stretch; gap: 14px; }
.farm-plan,.farm-inspector,.camera-main,.camera-side { min-width: 0; border: 2px solid var(--ink); background: var(--surface); }
.farm-plan { padding: 14px; }
.farm-plan-head { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 12px; font: 800 10px var(--mono); letter-spacing: .05em; }
.farm-plan-head span:last-child { color: var(--muted); }
.farm-plan-stage { position: relative; height: min(49vw,455px); min-height: 345px; overflow: hidden; background: #d8ddce; border: 2px solid #53654d; }
:root[data-theme=dark] .farm-plan-stage { background: #36463c; border-color: #92a18d; }
.farm-plan-grid { position: absolute; inset: 0; opacity: .23; background-image: linear-gradient(#71846b 1px,transparent 1px),linear-gradient(90deg,#71846b 1px,transparent 1px); background-size: 23px 23px; }
.farm-plan-aisle { position: absolute; left: 3%; right: 3%; top: 43%; height: 17%; display: flex; justify-content: center; align-items: center; gap: 20px; background: #848f7d; color: #fff; border-top: 3px dashed #f2ebca; border-bottom: 3px dashed #f2ebca; font: 800 10px var(--mono); letter-spacing: .08em; }
.farm-plan-aisle span { opacity: .8; }
.farm-zone { position: absolute; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 6px; text-align: left; background: #f2eee1; border: 3px solid #465747; color: #19221c; padding: 14px; box-shadow: 4px 4px 0 #17231b50; transition: transform .18s ease,box-shadow .18s ease,background .18s ease; }
.farm-zone:hover,.farm-zone.active { background: #f3c96f; transform: translateY(-3px); box-shadow: 6px 7px 0 #17231b60; }
.farm-zone small { font: 800 10px var(--mono); letter-spacing: .07em; }
.farm-zone strong { font: 800 clamp(17px,2vw,29px)/1 var(--font); letter-spacing: -.05em; }
.farm-zone span { font-size: 11px; font-weight: 700; }
.zone-fresh { left: 5%; top: 7%; width: 39%; height: 31%; }
.zone-robot { right: 5%; top: 7%; width: 37%; height: 31%; }
.zone-gate { left: 35%; bottom: 7%; width: 30%; height: 26%; }
.zone-pen2 { left: 5%; bottom: 7%; width: 27%; height: 26%; z-index: 2; background: #e4e9de; }
.zone-pen2 strong { font-size: clamp(17px,1.8vw,25px); }
.zone-gate { left: 41%; width: 27%; }
.farm-route-svg { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
.farm-route-svg path { fill: none; stroke: #be6b1d; stroke-width: 6; stroke-dasharray: 11 9; filter: drop-shadow(0 1px 0 #fff); }
.farm-route-svg.held path { stroke: #ad4938; stroke-dasharray: 3 12; }
.farm-route-label { position: absolute; z-index: 4; left: 42%; top: 58%; padding: 5px 7px; color: #241b10; background: #f2c66b; border: 1px solid #5e4219; font: 800 9px var(--mono); white-space: nowrap; }
.farm-route-label.held { color: #fff; background: #9e4936; border-color: #5d261e; }
.farm-object-marker { position: absolute; z-index: 5; display: flex; align-items: center; gap: 4px; min-height: 26px; padding: 3px 6px; border: 2px solid #415247; background: #fffdf4; color: #1a281e; box-shadow: 2px 2px 0 #20362655; font: 800 9px var(--mono); white-space: nowrap; }
.farm-object-marker:hover { transform: translateY(-2px); }
.marker-cow-fresh { left: 6%; top: 32%; }
.marker-cow-read { left: 6%; bottom: 10%; }
.marker-cow-read.conflict { border-color: #a04733; background: #f6dbcf; }
.marker-robot { right: 6%; top: 32%; }
.marker-robot.fault { border-color: #a04733; background: #f6dbcf; }
.farm-route-line { position: absolute; left: 49%; top: 37%; height: 41%; border-left: 5px dashed #b87625; pointer-events: none; }
.farm-camera-cone { position: absolute; z-index: 3; background: #ec9e2a38; pointer-events: none; }
.cone-fresh { left: 14%; top: 12%; width: 30%; height: 32%; clip-path: polygon(0 0,100% 0,50% 100%); }
.cone-robot { right: 9%; top: 12%; width: 30%; height: 32%; clip-path: polygon(0 0,100% 0,50% 100%); }
.cone-gate { left: 39%; bottom: 15%; width: 24%; height: 28%; clip-path: polygon(50% 0,0 100%,100% 100%); background: #ad764c38; }
.farm-camera-pin { position: absolute; z-index: 4; display: flex; align-items: center; gap: 4px; min-height: 35px; padding: 5px 7px; border: 2px solid var(--ink); background: #19241e; color: #fff; box-shadow: 3px 3px 0 #f3c96f; }
.farm-camera-pin b { font: 800 10px var(--mono); }
.farm-camera-pin:hover { background: #a75d17; }
.farm-camera-pin.offline { background: #735e4e; box-shadow: 3px 3px 0 #ccb7a0; }
.pin-fresh { left: 28%; top: 35%; }
.pin-robot { right: 21%; top: 35%; }
.pin-gate { left: 47%; bottom: 30%; }
.farm-compass { position: absolute; bottom: 12px; right: 14px; font: 800 15px var(--mono); color: #304033; }
.farm-plan-legend { display: flex; flex-wrap: wrap; gap: 15px; padding: 13px 2px 0; color: var(--ink-2); font: 700 10px var(--mono); }
.farm-plan-legend span { display: flex; align-items: center; gap: 6px; }
.farm-plan-legend i { display: inline-block; width: 13px; height: 13px; border: 2px solid var(--ink); }
.farm-plan-legend .legend-place { background: #f3c96f; }
.farm-plan-legend .legend-route { background: #848f7d; }
.farm-plan-legend .legend-camera { border-radius: 50%; background: var(--ink); }
.farm-inspector { display: flex; flex-direction: column; padding: 21px; }
.farm-inspector h2 { font-size: clamp(29px,2.5vw,39px); line-height: 1; margin: 8px 0; }
.farm-inspector > p { color: var(--ink-2); font-size: 13px; }
.farm-inspector-state { display: flex; align-items: center; gap: 11px; border-top: 2px solid var(--ink); border-bottom: 1px solid var(--line-strong); margin-top: 22px; padding: 16px 0; }
.farm-inspector-state > svg { padding: 7px; box-sizing: content-box; background: var(--accent-soft); }
.farm-inspector-state strong,.farm-inspector-state small { display: block; }
.farm-inspector-state small { color: var(--muted); font-size: 11px; margin-top: 3px; }
.farm-inspector > .primary-button { margin: 13px 0 23px; min-height: 45px; }
.farm-inspector-divider { border-top: 2px solid var(--ink); margin-bottom: 15px; }
.farm-inspector > .record-row { margin-top: 7px; }
.farm-place-claims { display: grid; gap: 7px; margin: 11px 0 17px; }
.farm-place-claims span { display: flex; justify-content: space-between; gap: 9px; border-bottom: 1px solid var(--line); padding-bottom: 7px; font-size: 11px; }
.farm-place-claims b { color: var(--muted); font: 800 9px var(--mono); }
.farm-fact-note { margin-top: auto; display: flex; gap: 9px; background: var(--warning-soft); padding: 13px; color: var(--ink-2); font-size: 12px; }
.farm-model-note { margin-top: 13px; display: flex; gap: 17px; padding: 15px 19px; border-left: 5px solid var(--accent); background: var(--surface-2); }
.farm-model-note strong { flex: none; font: 800 11px var(--mono); }
.farm-model-note span { font-size: 12px; color: var(--ink-2); }

.camera-layout { display: grid; grid-template-columns: minmax(0,1.7fr) minmax(275px,.7fr); gap: 14px; }
.camera-media { position: relative; min-height: 350px; aspect-ratio: 16/9; overflow: hidden; background: #1d2621; color: #fff; }
.camera-media img { width: 100%; height: 100%; display: block; object-fit: cover; }
.camera-corner-label,.camera-sample-label { position: absolute; z-index: 1; padding: 7px 9px; font: 800 10px var(--mono); letter-spacing: .055em; background: #101915db; color: #fff; }
.camera-corner-label { left: 16px; top: 16px; }
.camera-sample-label { right: 16px; bottom: 16px; }
.camera-no-frame { min-height: 350px; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 11px; background: repeating-linear-gradient(135deg,#202b26,#202b26 17px,#29362f 17px,#29362f 18px); }
.camera-no-frame strong { font: 800 28px var(--font); }
.camera-no-frame span { max-width: 270px; text-align: center; font-size: 12px; color: #cad6c8; }
.camera-main-foot { display: flex; justify-content: space-between; align-items: start; gap: 10px; padding: 17px 20px; }
.camera-source-bar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 5px 12px; padding: 9px 18px; background: var(--ink); color: var(--surface); font: 800 9px var(--mono); }
.camera-main-foot h2 { font-size: 28px; line-height: 1; margin: 5px 0; }
.camera-main-foot p { color: var(--ink-2); font-size: 12px; }
.camera-proof { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); border-top: 2px solid var(--ink); }
.camera-proof > div { padding: 15px; border-right: 1px solid var(--line-strong); }
.camera-proof > div:last-child { border: 0; }
.camera-proof span,.camera-proof strong { display: block; }
.camera-proof span { color: var(--muted); font: 800 9px var(--mono); }
.camera-proof strong { margin-top: 6px; font-size: 13px; }
.camera-side { padding: 19px; }
.camera-side h2 { margin: 5px 0 20px; font-size: 27px; }
.camera-choices { border-top: 2px solid var(--ink); }
.camera-choice { display: flex; align-items: center; width: 100%; gap: 10px; padding: 12px 4px; min-height: 72px; text-align: left; color: var(--ink); background: none; border: 0; border-bottom: 1px solid var(--line-strong); }
.camera-choice.active { background: var(--accent-soft); padding-left: 10px; border-left: 5px solid var(--accent); }
.camera-choice > span:nth-child(2) { flex: 1; }
.camera-choice strong,.camera-choice small { display: block; }
.camera-choice small { color: var(--muted); margin-top: 3px; }
.camera-choice-icon { padding: 8px; background: var(--surface-3); }
.camera-side-section { border-top: 2px solid var(--ink); margin-top: 23px; padding-top: 15px; }
.camera-side-section p { margin: 8px 0; color: var(--ink-2); font-size: 12px; }
.camera-side-section .record-row { margin-top: 8px; }
.camera-integrity { display: flex; gap: 13px; margin-top: 13px; padding: 16px; color: var(--ink); background: var(--accent-soft); border-left: 5px solid var(--accent); }
.camera-integrity strong { font-size: 14px; }
.camera-integrity p { max-width: 850px; margin-top: 3px; font-size: 12px; color: var(--ink-2); }
.camera-investigation { margin-top: 14px; border: 2px solid var(--ink); background: var(--surface); }
.camera-investigation-head { display: flex; justify-content: space-between; align-items: end; gap: 16px; padding: 19px 21px; border-bottom: 2px solid var(--ink); }
.camera-investigation-head h2 { font-size: clamp(22px,2.1vw,31px); margin: 5px 0; }
.camera-investigation-head p { color: var(--ink-2); font-size: 12px; }
.camera-investigation-head .secondary-button { flex: none; }
.camera-timeline { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0; padding: 18px 20px; }
.camera-timeline-event { min-width: 0; border-top: 4px solid var(--line-strong); border-right: 1px solid var(--line-strong); padding: 11px 13px 5px; }
.camera-timeline-event:first-child { padding-left: 0; }
.camera-timeline-event:last-child { border-right: 0; }
.camera-timeline-event.fault { border-top-color: var(--danger); }
.camera-timeline-event.camera { border-top-color: var(--accent); }
.camera-timeline-event.work,.camera-timeline-event.note { border-top-color: var(--warning); }
.camera-timeline-event.good { border-top-color: var(--good); }
.camera-timeline-event time { display: block; color: var(--muted); font: 800 10px var(--mono); }
.camera-timeline-event strong { display: block; font-size: 14px; margin: 6px 0; }
.camera-timeline-event p { color: var(--ink-2); font-size: 11px; }
.camera-note-form { display: grid; gap: 6px; padding: 16px 21px 20px; border-top: 1px solid var(--line-strong); }
.camera-note-form label { font: 800 11px var(--mono); }
.camera-note-form > div { display: flex; gap: 8px; }
.camera-note-form input { flex: 1; min-width: 0; min-height: 43px; padding: 8px 10px; border: 2px solid var(--ink); color: var(--ink); background: var(--surface-2); }
.camera-note-form small { color: var(--muted); font-size: 10px; }
.record-camera-link { display: grid; grid-template-columns: minmax(180px,.65fr) minmax(0,1fr); gap: 0; margin-top: 22px; border: 2px solid var(--ink); background: var(--surface); }
.record-camera-link img { width: 100%; height: 100%; min-height: 180px; object-fit: cover; }
.record-camera-link > div { padding: 17px 21px; }
.record-camera-link h3 { font-size: 23px; margin: 5px 0; }
.record-camera-link p { max-width: 500px; color: var(--ink-2); font-size: 12px; }
.record-camera-link .secondary-button { margin: 12px 0 6px; }
.record-camera-link small { display: block; color: var(--muted); font: 800 9px var(--mono); }
@media (max-width: 1050px) { .farm-layout,.camera-layout { grid-template-columns: 1fr; } .farm-plan-stage { height: 430px; } .farm-inspector { min-height: 250px; } }
@media (max-width: 1050px) { .camera-timeline { grid-template-columns: repeat(2,minmax(0,1fr)); row-gap: 13px; } }
@media (max-width: 700px) { .crew-lookup-grid,.record-camera-link { grid-template-columns: 1fr; } .farm-plan-stage { height: 350px; min-height: 0; } .farm-zone { padding: 9px; } .farm-zone strong { font-size: 16px; } .farm-zone span { font-size: 9px; } .farm-model-note { display: block; } .farm-model-note span { display: block; margin-top: 5px; } .camera-proof { grid-template-columns: 1fr; } .camera-proof > div { border-right: 0; border-bottom: 1px solid var(--line-strong); } .record-camera-link img { height: 180px; } }
@media (max-width: 700px) { .camera-investigation-head { display: block; } .camera-investigation-head .secondary-button { margin-top: 10px; } .camera-timeline { grid-template-columns: 1fr; } .camera-timeline-event { border-right: 0; padding-left: 0; } .camera-note-form > div { display: grid; } }
.phone .mobile-spatial { padding: 14px 12px 28px; }
.phone .mobile-spatial .page-head { display: block; }
.phone .mobile-spatial .page-head h1 { font-size: 30px; }
.phone .mobile-spatial .page-head p { font-size: 12px; }
.phone .mobile-spatial .page-head .secondary-button { margin-top: 12px; }
.phone .mobile-spatial .farm-plan { padding: 8px; }
.phone .mobile-spatial .farm-plan-head { font-size: 8px; }
.phone .mobile-spatial .farm-plan-stage { height: 290px; }
.phone .mobile-spatial .farm-zone small { font-size: 8px; }
.phone .mobile-spatial .farm-zone strong { font-size: 14px; }
.phone .mobile-spatial .farm-zone span { font-size: 8px; }
.phone .mobile-spatial .farm-inspector { padding: 15px; }
.phone .mobile-spatial .camera-media,.phone .mobile-spatial .camera-no-frame { min-height: 220px; }
.phone .mobile-spatial .camera-media { aspect-ratio: 4/3; }
.phone .mobile-spatial .camera-media img { object-position: center; }
.phone .mobile-spatial .camera-corner-label,.phone .mobile-spatial .camera-sample-label { font-size: 8px; padding: 5px; }
.phone .mobile-spatial .camera-corner-label { left: 8px; top: 8px; }
.phone .mobile-spatial .camera-sample-label { right: 8px; bottom: 8px; }
.phone .mobile-spatial .camera-side { padding: 14px; }
.phone .mobile-camera-quick { padding: 14px 15px 28px; }
.mobile-camera-quick h1 { font-size: 32px; line-height: 1; margin: 6px 0; }
.mobile-camera-quick > p { color: var(--ink-2); font-size: 12px; line-height: 1.4; margin-bottom: 13px; }
.mobile-camera-frame { height: 152px; position: relative; border: 2px solid var(--ink); overflow: hidden; background: #19241e; }
.mobile-camera-frame img { width: 100%; height: 100%; display: block; object-fit: cover; }
.mobile-camera-frame > span { position: absolute; bottom: 6px; right: 6px; padding: 4px 6px; background: #101915e8; color: #fff; font: 800 8px var(--mono); }
.mobile-camera-frame .camera-no-frame { min-height: 150px; }
.mobile-camera-frame .camera-no-frame strong { font-size: 19px; }
.mobile-camera-readings { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); border: 2px solid var(--ink); border-top: 0; background: var(--surface); }
.mobile-camera-readings div { min-width: 0; padding: 10px 7px; border-right: 1px solid var(--line-strong); }
.mobile-camera-readings div:last-child { border: 0; }
.mobile-camera-readings span,.mobile-camera-readings strong { display: block; }
.mobile-camera-readings span { color: var(--muted); font: 800 8px var(--mono); }
.mobile-camera-readings strong { font-size: 11px; margin-top: 4px; line-height: 1.2; }
.mobile-camera-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin: 11px 0 22px; }
.mobile-camera-actions button { min-width: 0; font-size: 10px; padding: 7px; min-height: 42px; }
.mobile-camera-quick .camera-investigation-head { padding: 14px; }
.mobile-camera-quick .camera-investigation-head h2 { font-size: 19px; }
.mobile-camera-quick .camera-timeline { padding: 11px 14px; }
.mobile-camera-quick .camera-investigation-head .secondary-button { display: none; }

.money-workspace { display: grid; gap: 16px; }
.money-workspace .finance-context { margin: 0; }
.money-book-check { display: grid; grid-template-columns: 1.4fr 1fr 1fr; border: 2px solid var(--ink); background: var(--surface-2); }
.money-book-check > div { display: grid; gap: 5px; align-content: center; padding: 15px 18px; border-right: 1px solid var(--line-strong); }
.money-book-check > div:last-child { border-right: 0; }
.money-book-check span,.money-verdict span,.money-cash-grid span { font: 800 10px var(--mono); color: var(--muted); letter-spacing: .07em; }
.money-book-check strong { font-size: 15px; }
.money-book-check small,.money-verdict small,.money-cash-grid small { font-size: 11px; color: var(--ink-2); }
.money-verdict { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.money-verdict > div { display: grid; gap: 5px; padding: 20px 22px; min-width: 0; border: 2px solid var(--ink); background: var(--surface-2); }
.money-verdict > div.net { background: var(--accent-soft); border-color: var(--accent); }
.money-verdict strong { font: 800 clamp(31px,3vw,46px)/1 var(--font); letter-spacing: -.05em; margin: 6px 0; }
.money-verdict em { display: inline-block; justify-self: start; margin-top: 8px; padding: 5px 8px; border: 1px solid var(--line-strong); font: 800 11px var(--mono); font-style: normal; }
.money-workspace .tabs { margin: 0; }
.money-summary-layout { display: grid; grid-template-columns: 1.15fr 1fr; gap: 15px; }
.money-panel { background: var(--surface-2); border: 2px solid var(--ink); padding: 23px; }
.money-panel h3 { font-size: 25px; margin: 5px 0 14px; }
.money-panel > p { color: var(--ink-2); font-size: 12px; max-width: 600px; }
.money-trend { height: 190px; display: grid; grid-template-columns: repeat(13,minmax(0,1fr)); gap: 5px; align-items: end; padding: 8px 3px 20px; margin: 8px 0 15px; border-bottom: 2px solid var(--line-strong); }
.money-trend-month { height: 100%; display: flex; flex-direction: column; justify-content: end; align-items: stretch; position: relative; min-width: 0; }
.money-trend-month strong { position: absolute; bottom: calc(100% - 2px); left: 50%; transform: translateX(-50%); white-space: nowrap; font: 800 11px var(--mono); }
.money-trend-month i { display: block; min-height: 4px; background: var(--line-strong); }
.money-trend-month.current i { background: var(--accent); }
.money-trend-month span { position: absolute; top: 100%; width: 100%; text-align: center; white-space: nowrap; font: 700 9px var(--mono); color: var(--muted); }
.money-trend-month:not(:first-child):not(:last-child):not(:nth-child(4)):not(:nth-child(7)):not(:nth-child(10)) span { display: none; }
.money-category-table { border-top: 2px solid var(--ink); }
.money-table-head,.money-category-table button { display: grid; grid-template-columns: 1fr 115px 90px; gap: 10px; align-items: center; }
.money-table-head { padding: 9px 0; font: 800 9px var(--mono); color: var(--muted); }
.money-category-table button { width: 100%; border: 0; border-top: 1px solid var(--line-strong); background: transparent; text-align: left; padding: 13px 0; color: var(--ink); }
.money-category-table button:hover { background: var(--accent-soft); }
.money-category-table button > span:first-child { display: grid; gap: 7px; }
.money-category-table button strong { font-size: 12px; }
.money-category-table button > span:nth-child(2) { font: 700 11px var(--mono); }
.money-category-table i { height: 5px; width: 100%; background: var(--surface-3); }
.money-category-table i b { height: 100%; display: block; background: var(--accent); }
.money-next { display: flex; align-items: center; justify-content: space-between; gap: 20px; border-left: 5px solid var(--accent); background: var(--accent-soft); padding: 17px 19px; }
.money-next strong { display: block; font: 800 20px var(--font); margin: 4px 0; }
.money-next p { font-size: 12px; color: var(--ink-2); }
.money-next .primary-button { flex: none; }
.money-cash-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.money-cash-grid > div { display: grid; gap: 7px; border: 2px solid var(--ink); background: var(--surface-2); padding: 18px; }
.money-cash-grid strong { font: 800 30px var(--font); }
.money-transaction-split { display: flex; justify-content: space-between; gap: 12px; padding: 13px 0; border-top: 2px solid var(--ink); border-bottom: 2px solid var(--ink); font-size: 13px; }
.week-workspace { flex: 1; overflow: auto; padding: clamp(18px,3vw,42px); background: var(--canvas); }
.week-workspace h1 { font-size: clamp(38px,4vw,58px); line-height: 1; margin: 8px 0; }
.week-workspace > p { max-width: 720px; color: var(--ink-2); font-size: 15px; }
.week-summary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-top: 23px; }
.week-summary > div { display: grid; gap: 4px; padding: 17px; background: var(--surface-2); border: 2px solid var(--ink); }
.week-summary span,.week-summary small { font: 800 10px var(--mono); color: var(--muted); }
.week-summary strong { font-size: 28px; }
.week-days { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-top: 20px; }
.week-day { display: flex; align-items: center; gap: 9px; min-height: 69px; padding: 13px; border: 2px solid var(--line-strong); color: var(--ink); background: var(--surface-2); text-align: left; }
.week-day.active { border-color: var(--ink); background: var(--accent-soft); }
.week-day span { flex: 1; font-size: 12px; }
.week-action { margin-top: 13px; padding: 20px; border: 2px solid var(--ink); background: var(--surface-2); }
.week-action h2 { font-size: 27px; margin: 7px 0; }
.week-action p { color: var(--ink-2); font-size: 13px; max-width: 640px; }
.week-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 16px; }
.week-pass-on { margin-top: 18px; padding: 18px 20px; border-left: 5px solid var(--accent); background: var(--accent-soft); }
.week-pass-on strong { display: block; font-size: 20px; margin-top: 5px; }
.week-pass-on p { max-width: 650px; font-size: 13px; margin: 7px 0 13px; }
.support-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; margin: 24px 0; }
.support-grid section { padding: 20px; border: 2px solid var(--ink); background: var(--surface-2); }
.support-grid h2 { font-size: 23px; margin: 8px 0; }
.support-grid p { color: var(--ink-2); font-size: 13px; }
.support-form { display: grid; gap: 9px; margin-top: 12px; }
.support-form label,.clock-passon label { display: grid; gap: 7px; font-weight: 800; font-size: 12px; }
.support-form textarea,.clock-passon textarea { min-height: 78px; padding: 9px; border: 2px solid var(--ink); color: var(--ink); background: var(--surface); font: 14px var(--font); resize: vertical; }
.support-receipts > div:not(.overline) { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; border-top: 1px solid var(--line-strong); padding: 10px 0; }
.support-receipts span:not(.badge) { flex: 1; font-size: 12px; }
.help-utility { display: flex; gap: 8px; flex-wrap: wrap; }
.clock-briefing { border-top: 2px solid var(--ink); padding-top: 15px; }
.clock-briefing strong { display: block; font-size: 19px; margin-top: 5px; }
.clock-briefing p { font-size: 12px; color: var(--ink-2); }
.clock-briefing-links .record-row { min-height: 56px; }
.clock-briefing-links > span { display: block; font-size: 11px; margin-top: 8px; }
.clock-passon { display: grid; }
.weather-workspace { padding: clamp(18px,3vw,40px); }
.weather-title { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 21px; }
.weather-title h1 { font-size: clamp(39px,4vw,61px); line-height: 1; margin: 7px 0; }
.weather-title p { color: var(--ink-2); max-width: 620px; font-size: 15px; }
.weather-current { display: grid; grid-template-columns: auto auto; align-items: center; column-gap: 9px; padding: 11px 16px; border-left: 4px solid var(--accent); background: var(--surface-2); }
.weather-current strong { font-size: 35px; line-height: 1; }
.weather-current span { grid-column: 1 / -1; font: 800 10px var(--mono); color: var(--muted); margin-top: 5px; }
.weather-layout { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(280px,.75fr); gap: 14px; align-items: start; }
.weather-radar,.weather-forecast { min-width: 0; border: 2px solid var(--ink); background: var(--surface-2); }
.weather-radar-heading { display: flex; align-items: end; justify-content: space-between; gap: 9px; padding: 15px 18px; }
.weather-radar-heading h2,.weather-forecast h2 { font-size: 24px; margin: 4px 0 0; }
.weather-map { position: relative; height: clamp(300px,31vw,450px); overflow: hidden; background: #aec6ba; isolation: isolate; }
.weather-tiles { position: absolute; width: 768px; height: 768px; left: 50%; top: 50%; transform: translate(-50%,-50%); display: grid; grid-template-columns: repeat(3,256px); grid-template-rows: repeat(3,256px); filter: saturate(.85) contrast(.95); }
.weather-tiles img { width: 256px; height: 256px; display: block; }
.weather-rain { position: absolute; inset: 0; pointer-events: none; }
.weather-rain i { position: absolute; display: block; border-radius: 50%; filter: blur(18px); mix-blend-mode: multiply; }
.weather-rain i:nth-child(1) { width: 53%; height: 88%; left: -34%; top: -24%; background: radial-gradient(ellipse,#185aa6a8 0%,#29a8df8f 40%,#72d3e03d 70%,transparent 82%); }
.weather-rain i:nth-child(2) { width: 37%; height: 61%; left: -19%; top: 35%; background: radial-gradient(ellipse,#0e4d99ad 0%,#30a0d184 43%,transparent 74%); }
.weather-rain i:nth-child(3) { width: 24%; height: 43%; left: 4%; top: -3%; background: radial-gradient(ellipse,#277bbb8f 0%,#53bad17a 47%,transparent 75%); }
.weather-rain.rain-0 i { transform: translateX(-25%); }
.weather-rain.rain-1 i { transform: translateX(8%); }
.weather-rain.rain-2 i { transform: translateX(36%); }
.weather-rain.rain-3 i { transform: translateX(65%); }
.weather-rain i { transition: transform .48s ease; }
.weather-map-mark { position: absolute; left: 59%; top: 47%; transform: translate(-50%,-50%); display: grid; justify-items: center; gap: 4px; z-index: 2; }
.weather-map-mark b { width: 16px; height: 16px; background: var(--accent); border: 4px solid var(--ink); border-radius: 50%; box-shadow: 0 0 0 4px #fff9; }
.weather-map-mark span,.weather-map-compass,.weather-attribution { padding: 5px 7px; background: #161c1de0; color: #fff; font: 800 9px var(--mono); white-space: nowrap; }
.weather-map-compass { position: absolute; top: 10px; right: 10px; }
.weather-attribution { position: absolute; bottom: 7px; right: 7px; text-decoration: underline; font-size: 8px; }
.weather-radar-controls { display: flex; gap: 13px; padding: 13px 18px 7px; }
.weather-play { min-width: 71px; height: 49px; background: var(--ink); border: 2px solid var(--ink); color: var(--surface); font-weight: 800; }
.weather-radar-controls > div { flex: 1; min-width: 0; }
.weather-radar-controls input { display: block; width: 100%; accent-color: var(--accent); margin: 4px 0 8px; min-height: 20px; }
.weather-time-labels { display: flex; justify-content: space-between; gap: 8px; color: var(--muted); font: 800 9px var(--mono); }
.weather-time-labels strong { color: var(--ink); }
.weather-radar-caveat { padding: 5px 18px 16px; font-size: 10px; color: var(--ink-2); }
.weather-forecast { padding: 18px; }
.weather-hourly { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 3px; margin: 15px 0 18px; }
.weather-hourly > div { display: grid; justify-items: center; gap: 5px; border-top: 3px solid var(--line-strong); padding: 10px 1px; }
.weather-hourly strong,.weather-hourly small { font: 800 9px var(--mono); white-space: nowrap; }
.weather-hourly b { font-size: 17px; }
.weather-hourly small { color: #2b7a9c; }
.weather-daily-label { border-top: 2px solid var(--ink); padding-top: 18px; }
.weather-day { display: grid; grid-template-columns: 65px 1fr auto; gap: 8px; align-items: center; border-bottom: 1px solid var(--line-strong); padding: 15px 0; font-size: 12px; }
.weather-day.warning span { color: #9d5e00; font-weight: 800; }
.weather-forecast-source { font-size: 10px; color: var(--muted); margin-top: 16px; }
.weather-work-link { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 14px; padding: 19px 23px; background: var(--accent-soft); border-left: 6px solid var(--accent); }
.weather-work-link h2 { font-size: 23px; margin: 5px 0; }
.weather-work-link p { color: var(--ink-2); font-size: 12px; }
.weather-work-link .primary-button { flex: none; }
@media (max-width: 1150px) { .weather-layout { grid-template-columns: 1fr; } .weather-map { height: 370px; } }
@media (max-width: 700px) { .weather-workspace { padding: 0; } .weather-title { align-items: start; } .weather-title h1 { font-size: 31px; } .weather-title p { font-size: 12px; } .weather-current { display: none; } .weather-radar-heading { align-items: start; flex-direction: column; } .weather-radar-heading h2 { font-size: 19px; } .weather-map { height: 260px; } .weather-hourly { overflow-x: auto; grid-template-columns: repeat(6,52px); } .weather-work-link { align-items: start; flex-direction: column; padding: 14px; } .weather-work-link h2 { font-size: 19px; } .weather-time-labels { font-size: 8px; } }
.phone .weather-title { display: block; margin-bottom: 14px; }
.phone .weather-title h1 { font-size: 29px; }
.phone .weather-title p { font-size: 11px; }
.phone .weather-current { display: none; }
.phone .weather-layout { display: grid; grid-template-columns: 1fr; }
.phone .weather-radar-heading { display: block; padding: 12px; }
.phone .weather-radar-heading h2 { font-size: 19px; }
.phone .weather-radar-heading .badge { margin-top: 7px; }
.phone .weather-map { height: 230px; }
.phone .weather-radar-controls { padding: 10px; }
.phone .weather-time-labels { font-size: 7px; }
.phone .weather-radar-caveat { padding: 5px 10px 12px; }
.phone .weather-forecast { padding: 12px; }
.phone .weather-hourly { overflow-x: auto; grid-template-columns: repeat(6,52px); }
.phone .weather-work-link { flex-direction: column; align-items: start; padding: 12px; }
.phone .weather-work-link h2 { font-size: 19px; }
.phone .mobile-review .page-head { display: block; }
.phone .mobile-review .page-head h1 { font-size: 28px; }
.phone .mobile-review .page-head p { font-size: 12px; }
.phone .mobile-review .two-columns { grid-template-columns: 1fr; }
.phone .mobile-review .panel { padding: 14px; }
.phone .mobile-review .panel h2 { font-size: 20px; }
.phone .mobile-review .review-proposal h3 { font-size: 17px; }
.phone .mobile-review .decision-actions { display: grid; }
.farm-head-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.farm-mapping-alert { display: flex; align-items: center; gap: 11px; margin: 0 0 14px; padding: 13px 16px; border-left: 5px solid var(--warning); background: var(--warning-soft); }
.farm-mapping-alert > div { flex: 1; }
.farm-mapping-alert strong,.farm-mapping-alert span { display: block; }
.farm-mapping-alert strong { font-size: 14px; }
.farm-mapping-alert span { font-size: 11px; color: var(--ink-2); }
.farm-plan-editing { cursor: crosshair; outline: 4px solid var(--accent); outline-offset: -4px; }
.farm-plan-editing::after { content: "TAP AN OPEN AREA TO MOVE THE SELECTED PLACE"; position: absolute; z-index: 6; bottom: 10px; left: 10px; padding: 6px 8px; background: var(--ink); color: var(--surface); font: 800 9px var(--mono); pointer-events: none; }
.farm-edit-inspector h2 { font-size: 30px; margin: 7px 0; }
.farm-edit-inspector > p,.farm-impact p { color: var(--ink-2); font-size: 12px; }
.farm-nudge { display: flex; flex-wrap: wrap; gap: 5px; margin: 15px 0; }
.farm-nudge button { min-width: 43px; min-height: 40px; padding: 4px; }
.farm-plan-form { display: grid; gap: 12px; }
.farm-plan-form label { display: grid; gap: 5px; font: 800 10px var(--mono); }
.farm-plan-form input,.farm-plan-form textarea { width: 100%; border: 2px solid var(--ink); padding: 9px; background: var(--surface-2); color: var(--ink); font: 14px var(--font); }
.farm-plan-form textarea { min-height: 78px; resize: vertical; }
.farm-edit-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.farm-impact { border-top: 2px solid var(--ink); margin-top: 17px; padding-top: 14px; }
.farm-impact strong { display: block; font-size: 15px; margin: 5px 0; }
.phone .farm-head-actions { margin-top: 9px; }
.phone .farm-edit-actions { display: grid; }
.phone .mobile-spatial .farm-layout { display: flex; flex-direction: column-reverse; }
.phone .mobile-spatial .farm-workspace:has(.farm-plan-editing) .farm-layout { flex-direction: column; }
.phone .mobile-spatial .farm-plan,.phone .mobile-spatial .farm-inspector { width: 100%; }
.phone .mobile-spatial .farm-plan-head { flex-wrap: wrap; }
.phone .mobile-spatial .farm-mapping-alert { align-items: flex-start; flex-wrap: wrap; }
.phone .mobile-spatial .farm-mapping-alert > div { flex: 1 1 calc(100% - 34px); }
.phone .mobile-spatial .farm-mapping-alert .text-link { margin-left: 30px; width: calc(100% - 30px); }
@media (max-width: 1100px) and (min-width: 701px) {
  .room-head { min-height: 112px; padding-top: 12px; padding-bottom: 12px; }
  .room-rail { padding: 14px 15px 20px; }
  .room-rail-title { padding-bottom: 9px; }
  .room-rail-title h2 { font-size: 26px; }
  .room-person { min-height: 67px; }
  .room-person > span { width: 42px; height: 42px; }
  .room-person strong { font-size: 22px; }
  .room-handback { min-height: 41px; }
  .room-doors { margin-top: 15px; }
  .room-priority { gap: 5px; padding: 12px; }
  .room-priority > strong { font-size: 21px; }
  .room-priority-action { min-height: 43px; margin-top: 3px; }
  .room-agent-rail { min-height: 43px; margin-top: 10px; }
  .room-door { min-height: 57px; }
  .room-door-label { padding: 9px 0 5px; }
}
.control-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; }
.control-card { display: flex; flex-direction: column; align-items: start; padding: 21px; border: 2px solid var(--ink); background: var(--surface-2); }
.control-card h2 { font-size: 26px; margin: 7px 0; }
.control-card p { flex: 1; color: var(--ink-2); font-size: 12px; max-width: 560px; }
.control-status { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; width: 100%; border-top: 1px solid var(--line-strong); margin: 19px 0 13px; padding-top: 13px; }
.control-status span:last-child { color: var(--ink-2); font-size: 11px; }
.control-display { display: flex; align-items: center; justify-content: space-between; gap: 15px; border-top: 2px solid var(--ink); margin-top: 20px; padding: 17px 0; }
.control-display strong { display: block; font-size: 19px; margin-top: 4px; }
.control-display p,.control-reference-note { color: var(--muted); font-size: 11px; }
.control-reference-note { max-width: 800px; }
@media (max-width: 900px) { .control-grid { grid-template-columns: 1fr; } }
.phone .control-grid { grid-template-columns: 1fr; }
.phone .control-card { padding: 13px; }
.phone .control-card h2 { font-size: 20px; }
@media (max-width: 700px) { .support-grid,.week-summary,.week-days { grid-template-columns: 1fr; } .phone .week-workspace { padding: 0; } .phone .week-workspace h1 { font-size: 31px; } .phone .week-workspace > p { font-size: 12px; } .phone .week-actions { display: grid; } .phone .room-help-workspace { padding: 0; } .phone .support-grid { grid-template-columns: 1fr; } .phone .support-grid section { padding: 13px; } }
@media (max-width: 1050px) { .money-book-check,.money-summary-layout { grid-template-columns: 1fr; } .money-book-check > div { border-right: 0; border-bottom: 1px solid var(--line-strong); } .money-book-check > div:last-child { border-bottom: 0; } }
@media (max-width: 700px) { .money-verdict,.money-cash-grid { grid-template-columns: 1fr; } .money-next { align-items: start; flex-direction: column; } .money-table-head,.money-category-table button { grid-template-columns: 1fr 70px 80px; } }
.mobile-outcome-switch { display: grid; grid-template-columns: 1fr 1fr; margin: 18px 0; border: 2px solid var(--ink); }
.mobile-outcome-switch button { min-height: 42px; border: 0; background: var(--surface-2); color: var(--ink); font-weight: 800; }
.mobile-outcome-switch button + button { border-left: 1px solid var(--ink); }
.mobile-outcome-switch button.active { background: var(--accent); }
.mobile-money-hero { border: 2px solid var(--ink); background: var(--accent-soft); padding: 17px; display: grid; gap: 5px; }
.mobile-money-hero > strong { font: 800 48px/1 var(--font); letter-spacing: -.05em; margin-top: 5px; }
.mobile-money-hero > span,.mobile-money-pair span { font: 800 10px var(--mono); color: var(--ink-2); }
.mobile-money-hero p { margin-top: 9px; font-size: 12px; }
.mobile-money-hero small { border-top: 1px solid var(--line-strong); padding-top: 9px; margin-top: 6px; color: var(--ink-2); font-size: 10px; }
.mobile-money-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 9px; }
.mobile-money-pair > div { display: grid; gap: 4px; padding: 12px; border: 1px solid var(--line-strong); background: var(--surface-2); }
.mobile-money-pair strong { font: 800 22px var(--font); }
.mobile-money-pair small,.mobile-money-foot { color: var(--ink-2); font-size: 10px; }
.mobile-money-foot { padding: 15px 0; }
.mobile-camera-quick .camera-note-form { padding: 12px 14px; }
.mobile-camera-switch { margin-top: 20px; }
.run-item-measure { align-items: center; }
.room-wall .run-workspace .run-item { padding: 11px 0; }
.run-measure-form { display: flex; align-items: end; gap: 7px; flex-wrap: wrap; justify-content: flex-end; }
.run-measure-form label { display: grid; gap: 4px; min-width: 145px; font: 800 10px var(--mono); color: var(--ink-2); }
.run-measure-form input { width: 170px; min-height: 44px; padding: 8px 10px; border: 2px solid var(--ink); color: var(--ink); background: var(--surface-2); font: 700 13px var(--body); }
.run-measure-form .primary-button { min-height: 44px; }
.run-measure-form .text-link { display: flex; align-items: center; min-height: 44px; padding: 0 8px; border: 1px solid var(--line-strong); background: var(--surface-2); color: var(--ink); font-weight: 800; text-decoration: none; }
.phone .run-measure-form { width: 100%; justify-content: stretch; }
.phone .run-measure-form label { flex: 1; }
.phone .run-measure-form input { width: 100%; }