/* XiaoYu no-green palette
   Green is reserved for live/online indicators only. All product chrome,
   selection, completion, charts and decorative accents use blue, lilac,
   apricot or neutral tones. Loaded after stability.css. */

:root {
  /* Fluent 2 inspired semantic roles, mapped to XiaoYu's own palette. */
  --xy-brand-action: #586fae;
  --xy-brand-action-hover: #495f98;
  --xy-brand-subtle: #edf1f9;
  --xy-brand-border: #cbd5eb;
  --xy-status-live: #4c9b76;
  --xy-status-done: #7669a8;
  --xy-status-warning: #a56530;
  --xy-surface-page: #f8f9fc;
  --xy-surface-content: #ffffff;
  --xy-surface-raised: #ffffff;
  --xy-text-primary: #27334b;
  --xy-text-secondary: #59657b;
  --xy-focus: #9b754d;
  --xy-space-1: 4px;
  --xy-space-2: 8px;
  --xy-space-3: 12px;
  --xy-space-4: 16px;
  --xy-space-6: 24px;
  --xy-space-8: 32px;
  --xy-radius-control: 10px;
  --xy-radius-panel: 16px;
  --xy-motion-fast: 160ms;
  --accent: #586fae;
  --accent-ink: #ffffff;
  --accent-soft: color-mix(in srgb, #586fae 13%, transparent);
  --positive: #586fae;
  --green: #6679b8;
  --chart-1: #586fae;
  --chart-2: #b3a2cf;
  --c-teal: #557fb7;
  --c-teal-tint: #e9eff8;
  --c-teal-line: #c7d5ea;
  --c-teal-ink: #3e6292;
  --c-green: #7669a8;
  --c-green-tint: #eeeaf7;
  --c-green-line: #d6cfee;
  --c-green-ink: #574d82;
}

:root.dark {
  color-scheme: dark;
  --xy-brand-action: #a7b8ef;
  --xy-brand-action-hover: #c1cdf5;
  --xy-brand-subtle: #262c3a;
  --xy-brand-border: #3c465f;
  --xy-status-live: #71c99a;
  --xy-status-done: #c7b8e5;
  --xy-status-warning: #e2b484;
  --xy-surface-page: #111318;
  --xy-surface-content: #1d2129;
  --xy-surface-raised: #252a35;
  --xy-text-primary: #eff1f5;
  --xy-text-secondary: #b6bbc6;
  --xy-focus: #d0af84;
  --page: #111318;
  --canvas: #171a21;
  --surface: #1d2129;
  --inset: #181b22;
  --field: #20242d;
  --hover: #252a35;
  --hover-2: #2d3340;
  --line: #2c313c;
  --line-strong: #3d4452;
  --ink: #eff1f5;
  --ink-2: #b6bbc6;
  --ink-3: #858b98;
  --accent: #a7b8ef;
  --accent-ink: #1b2238;
  --accent-soft: color-mix(in srgb, #a7b8ef 17%, transparent);
  --positive: #a7b8ef;
  --green: #9cace3;
  --chart-1: #9fb3ef;
  --chart-2: #c7b8e5;
  --c-teal: #91b7e8;
  --c-teal-tint: #202b3d;
  --c-teal-line: #334762;
  --c-teal-ink: #bad2ef;
  --c-green: #b4a4dc;
  --c-green-tint: #2b2638;
  --c-green-line: #443b5b;
  --c-green-ink: #d1c5eb;
  --material-surface: rgba(30, 34, 43, .9);
  --material-floating: rgba(35, 39, 49, .97);
  --material-overlay: rgba(27, 30, 38, .98);
  --native-line: rgba(215, 220, 238, .13);
}

/* Navigation and global controls */
.sidebar .seal {
  background: linear-gradient(145deg, #e8e8f7, #dce7f6 54%, #f6e5d8) !important;
  color: #586fae !important;
}

.sidebar .nav-link.active,
.nav-project.active {
  border-color: color-mix(in srgb, #7286bd 26%, transparent) !important;
  background: color-mix(in srgb, #dfe6f5 78%, var(--surface)) !important;
  color: #344a82 !important;
}

.sidebar .nav-link.active::before {
  background: linear-gradient(180deg, #657bb8, #9c88c4) !important;
  box-shadow: 0 0 8px rgba(101, 123, 184, .28) !important;
}

html.dark .sidebar .nav-link.active,
html.dark .nav-project.active {
  background: rgba(159, 178, 232, .15) !important;
  color: #e8ecfa !important;
}

.button.primary {
  background: var(--xy-brand-action) !important;
  border-color: var(--xy-brand-action) !important;
}

.button.primary:hover {
  background: var(--xy-brand-action-hover) !important;
  border-color: var(--xy-brand-action-hover) !important;
}

/* Semantic completion uses blue/lilac; only live presence stays green. */
.badge.good,
.race-state--done,
.simulation-status--ready,
.herness-history-item.active {
  color: #4f6399 !important;
  border-color: #ccd5ea !important;
  background: #edf1f9 !important;
}

html.dark .badge.good,
html.dark .race-state--done,
html.dark .simulation-status--ready,
html.dark .herness-history-item.active {
  color: #bdc9ef !important;
  border-color: #3c465f !important;
  background: #262c3a !important;
}

.metric-strip,
.notice,
.drop-zone,
.ops-station.active,
.list-row:hover {
  border-color: color-mix(in srgb, #7184bb 24%, var(--line)) !important;
}

/* Herness keeps green exclusively on its online dot/readout. */
.herness-shell {
  --h-mint: #e9edf7;
  --h-blue: #e5edf8;
  --h-apricot: #f8eadc;
  --h-lilac: #eee8f8;
  --h-line: color-mix(in srgb, var(--line) 76%, #8397c4 24%);
}

.herness-history-item.active { box-shadow: inset 3px 0 #6f82b7; }
.herness-mini-mark { background: #e9edf5; color: #4f6090; }
.herness-trust { color: var(--ink-2); }

/* Illustrated homepage chrome: remove mint/sage UI accents without recoloring
   the artwork itself. */
body[data-page="home"] .sidebar {
  background:
    linear-gradient(rgba(248, 244, 238, .96), rgba(235, 238, 248, .96)),
    repeating-linear-gradient(90deg, transparent 0 5px, rgba(71, 66, 91, .025) 5px 6px) !important;
}

body[data-page="home"] .nav-project.active,
body[data-page="home"] .nav-link.active {
  background: #e7eaf4 !important;
  color: #3e4f80 !important;
}

.project-block--mint {
  --tile: #e4eaf7;
  --tile-ink: #50679e;
  --tile-edge: #94a7cf;
}

.project-block--sage {
  --tile: #f4e5da;
  --tile-ink: #8a5a3d;
  --tile-edge: #d0a989;
}

.project-block--paper {
  --tile: #ece7f3;
  --tile-ink: #6d5f83;
  --tile-edge: #b2a4c5;
}

.hub-focus__copy small,
.hub-eyebrow { color: #a1472e; }

/* Workflow canvas and bill agent previously used green as a category color. */
.c-canvas,
.c-output { background: #6679b8; }
.blk-wire.t-canvas,
.blk-wire.t-output { stroke: #6679b8; }
.blk-port.t-canvas,
.blk-port.t-output { border-color: #6679b8; color: #6679b8; }

.bill-confidence-fill { background: linear-gradient(90deg, #657bb8, #a38ac3); }

/* The only approved green signals. */
.status-dot,
.project-presence--ready::before,
.herness-trust::before,
[data-status="online"]::before,
.online-dot,
.ops-live-dot,
.today-source-dot,
.mecha-live,
.mz-live-dot {
  background-color: var(--xy-status-live) !important;
}

.status-dot,
.herness-live.online { color: #397a64 !important; }
.herness-live.online { background-color: transparent !important; }
html.dark .herness-live.online { color: #71c99a !important; }

/* Accounting uses blue for income and apricot for outflow. */
.bill-budget > div i { background: linear-gradient(90deg, #5d73ad, #9a88c2); }
.bill-conclusion { background: linear-gradient(120deg, #edf1fa, #f1edf8, #f8efe6); }
.bill-trend-bars .income { background: #667db8; }
.bill-ledger-row .income { color: #50689f; }
.dark .bill-ledger-row .income { color: #a9b9eb; }
.band-trend b.down { color: #9fb3ef; }

/* Today board can still exist behind alternate home routes. */
.today-board {
  --today-green: #586fae;
  --today-mint: #e9edf7;
  --today-line: rgba(82, 99, 147, .17);
}
.today-metric:hover { background: #f2f4f9; }
.today-ask { background: linear-gradient(145deg, #edf0f8, #eef3fa 58%, #fbf0df); border-color: #d4d9e8; }
.today-ask-actions a { background: linear-gradient(135deg, #667db8, #725f99); }
.today-ask-actions a + a { color: #4f6194; border-color: #b9c3df; }
.today-status { background: linear-gradient(145deg, rgba(255,255,255,.93), rgba(235,239,249,.86)); }
.today-impact { background: rgba(88, 111, 174, .09); }
.today-go { border-color: rgba(88, 111, 174, .24); }
.dark .today-board {
  --today-ink: #eff1f5;
  --today-muted: #aeb4c0;
  --today-line: rgba(188, 197, 226, .14);
  --today-panel: rgba(31, 34, 43, .86);
  --today-green: #a7b8ef;
  --today-mint: #272c3a;
}
.dark .today-metric:hover { background: #222630; }
.dark .today-ask { background: linear-gradient(145deg, #272d3c, #2d3042 58%, #463b2b); border-color: #41485a; }
.dark .today-status { background: linear-gradient(145deg, rgba(38,43,56,.94), rgba(29,33,43,.9)); }

/* Mission bay and the legacy mecha bridge use blue/lilac for interface energy;
   their actual live lamps remain green above. */
.mission-bay {
  --mz-aqua: #87b9e4;
  --mz-green: #a89bd2;
  --mz-line-strong: rgba(135, 185, 228, .3);
}
html:not(.dark) .mission-bay {
  --mz-bg: #f7f8fc;
  --mz-panel: rgba(255,255,255,.84);
  --mz-panel-2: #f1f3f9;
  --mz-line: rgba(86, 103, 151, .15);
  --mz-line-strong: rgba(93, 126, 185, .3);
  --mz-ink: #303a59;
  --mz-muted: #6f7892;
  --mz-faint: #949aab;
  --mz-aqua: #5d82bd;
  --mz-green: #8073ae;
}
html:not(.dark) .mission-deck {
  background:
    radial-gradient(circle at 8% 4%, rgba(190, 207, 241, .5), transparent 31%),
    radial-gradient(circle at 92% 12%, rgba(220, 208, 241, .44), transparent 29%),
    radial-gradient(circle at 18% 90%, rgba(250, 218, 183, .36), transparent 25%),
    linear-gradient(150deg, #fcfcff 0%, #f5f6fb 54%, #faf8fc 100%);
}
.mecha-bridge {
  --mx-aqua: #87b9e4;
  --mx-green: #a89bd2;
}

/* Older homepage declarations can reappear during route transitions. */
.dark .hub-focus__mark { background: rgba(106, 122, 178, .3); color: #c2ccef; }
.project-block--mint { --tile: #e4eaf7; --tile-ink: #50679e; --tile-edge: #94a7cf; }
.project-block--sage { --tile: #f4e5da; --tile-ink: #8a5a3d; --tile-edge: #d0a989; }

/* The workbench uses semantic state roles; completion is not presence. */
:root {
  --ops-tint-green: var(--xy-brand-subtle);
}
:root.dark {
  --ops-tint-green: var(--xy-brand-subtle);
}
.ops-stat.completed,
.ops-status.delivered,
.ops-alert-clear > .ui-icon {
  color: var(--xy-status-done);
}
.ops-station.active .ops-station-lamp {
  background: var(--xy-brand-action);
}

/* Ledger income is a category, with the same cool palette as the rest of UI. */
body[data-page="ledger"] {
  --lg-in: var(--c-green);
  --lg-in-ink: var(--c-green-ink);
  --lg-in-tint: var(--c-green-tint);
}

/* Mission filters and primary actions follow one action color in both themes. */
.mission-bay .mz-filter button[aria-pressed="true"] {
  color: var(--xy-brand-action);
  background: var(--xy-brand-subtle);
  border-color: var(--xy-brand-border);
}
.mission-bay .button.primary {
  color: var(--accent-ink);
  background: var(--xy-brand-action);
  border-color: var(--xy-brand-action);
}
.mission-bay .button.primary:hover {
  background: var(--xy-brand-action-hover);
}

/* Shared browser states make the visual system work without a component rewrite. */
::selection { background: var(--xy-brand-border); color: var(--xy-text-primary); }
:where(button, a, input, textarea, select, summary):focus-visible {
  outline: 2px solid var(--xy-focus);
  outline-offset: 3px;
}
:where(input, textarea) { caret-color: var(--xy-brand-action); }

/* One icon grammar across navigation, ledger, missions and workbench controls. */
.xy-icon { flex: none; vertical-align: -0.15em; stroke-width: 1.7; }
.nav-link .xy-icon { width: 19px; height: 19px; }
#theme-toggle .xy-icon { width: 18px; height: 18px; }
#theme-toggle { display: inline-grid; place-items: center; min-width: 36px; min-height: 36px; }
#theme-toggle .xy-icon { transition: transform var(--xy-motion-fast) ease; }
#theme-toggle:hover .xy-icon { transform: rotate(-12deg); }
@media (prefers-reduced-motion: reduce) {
  #theme-toggle .xy-icon { transition: none; }
}

/* Sidebar-free masthead. A generated linen photograph is softened for legibility. */
body:not([data-page="home"]) {
  background:
    linear-gradient(rgba(252,249,243,.77),rgba(252,249,243,.77)),
    url('/static/brand/linen-texture-v1.webp') center top / 768px 768px repeat,
    #eee7da !important;
  background-attachment: scroll !important;
}
body[data-page="home"] {
  background:
    radial-gradient(circle at 14% 11%, rgba(255,255,255,.52), transparent 28%),
    linear-gradient(rgba(243,234,218,.52),rgba(243,234,218,.52)),
    url('/static/brand/linen-texture-v1.webp') center top / 768px 768px repeat,
    #ece3d2 !important;
  background-attachment: scroll !important;
}
html.dark body:not([data-page="home"]) {
  background:
    linear-gradient(rgba(27,27,30,.92),rgba(27,27,30,.92)),
    url('/static/brand/linen-texture-v1.webp') center top / 768px 768px repeat,
    #201f20 !important;
}
html.dark body[data-page="home"] {
  background:
    linear-gradient(rgba(31,29,29,.87),rgba(31,29,29,.87)),
    url('/static/brand/linen-texture-v1.webp') center top / 768px 768px repeat,
    #211f1b !important;
}
.shell,
body[data-page="home"] .shell { margin-left: 0 !important; width: 100%; background: transparent !important; }
.topbar,
body[data-page="home"] .topbar {
  position: sticky; top: 0; z-index: 25;
  display: grid !important;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center; gap: 14px;
  height: 66px; padding: 0 clamp(16px,2.5vw,36px);
  border-bottom: 1px solid rgba(112,97,82,.16) !important;
  background: rgba(252,249,242,.82) !important;
  -webkit-backdrop-filter: blur(18px) saturate(105%);
  backdrop-filter: blur(18px) saturate(105%);
  box-shadow: 0 2px 14px rgba(65,55,43,.035) !important;
}
html.dark .topbar,
html.dark body[data-page="home"] .topbar {
  border-bottom-color: rgba(227,218,207,.12) !important;
  background: rgba(36,36,39,.86) !important;
}
.topbar .brand {
  display: inline-flex; align-items: center; gap: 9px;
  min-width: 102px; margin: 0; padding: 0;
  color: var(--ink) !important; font-size: 15px; line-height: 1.1;
}
body[data-page="home"] .topbar .brand { display: inline-flex !important; }
.topbar .brand .seal { width: 31px; height: 31px; border-radius: 9px; }
.topbar .brand small { margin-top: 3px; font-size: 8px; letter-spacing: 1px; }
.topbar #navigation,
body[data-page="home"] .topbar #navigation {
  display: flex !important; flex-direction: row !important; align-items: center;
  gap: 4px; min-width: 0; margin: 0; padding: 0;
  overflow-x: auto !important; overflow-y: hidden !important; scrollbar-width: none;
}
.topbar #navigation::-webkit-scrollbar { display: none; }
.topbar .nav-project-label,
.topbar .nav-project-divider,
.topbar .breadcrumb,
.topbar .nav-project > span,
.topbar .nav-project > small { display: none !important; }
.topbar .nav-project,
.topbar .nav-link,
body[data-page="home"] .topbar .nav-project,
body[data-page="home"] .topbar .nav-link {
  display: inline-flex !important; flex: none; align-items: center; flex-direction: row;
  gap: 7px; width: auto; height: 38px; min-height: 38px;
  margin: 0; padding: 0 12px; border: 1px solid transparent;
  border-radius: 10px; background: transparent !important;
  color: var(--xy-text-secondary) !important; font-size: 12px; font-weight: 550;
  white-space: nowrap; transform: none;
}
.topbar .nav-project > svg,
.topbar .nav-link > svg,
body[data-page="home"] .topbar .nav-project > svg,
body[data-page="home"] .topbar .nav-link > svg {
  display: block !important; width: 17px; height: 17px; opacity: .82;
}
.topbar .nav-project-short { display: inline !important; font-size: inherit; font-weight: inherit; }
.topbar .nav-project:hover,
.topbar .nav-link:hover { background: rgba(107,124,167,.09) !important; color: var(--xy-text-primary) !important; }
.topbar .nav-project.active,
.topbar .nav-link.active,
body[data-page="home"] .topbar .nav-project.active,
body[data-page="home"] .topbar .nav-link.active {
  border-color: var(--xy-brand-border) !important;
  background: var(--xy-brand-subtle) !important;
  color: var(--xy-brand-action) !important;
}
.topbar .nav-project.active::before,
.topbar .nav-link.active::before { display: none !important; }
.topbar .topbar-meta { flex: none; gap: 9px; }
.topbar .account-pill { display: none; }
body[data-page="home"] #workspace { padding-top: 10px; }
body[data-page="home"] .hub-hero h1 { max-width: 3.35em; }
@media (max-width: 820px) {
  .topbar, body[data-page="home"] .topbar {
    position: sticky !important; top: 0;
    grid-template-columns: auto minmax(0,1fr);
    grid-template-rows: 43px 44px; gap: 0 8px;
    height: 88px !important; padding: 0 12px !important;
  }
  .topbar .brand { grid-column: 1; grid-row: 1; }
  .topbar .topbar-meta { grid-column: 2; grid-row: 1; justify-self: end; width: auto !important; }
  .topbar #navigation { grid-column: 1 / -1; grid-row: 2; width: 100%; }
  .topbar .nav-project, .topbar .nav-link,
  body[data-page="home"] .topbar .nav-project,
  body[data-page="home"] .topbar .nav-link { min-height: 36px; height: 36px; padding: 0 10px; }
  .topbar #mode-label, .topbar #connection { display: none !important; }
  body[data-page="home"] .shell { padding-bottom: 0 !important; }
}
@media (prefers-reduced-transparency: reduce) {
  .topbar, body[data-page="home"] .topbar { background: var(--xy-surface-content) !important; -webkit-backdrop-filter: none; backdrop-filter: none; }
}

/* Tactile blue keys; navigation remains flat typography, not a row of pills. */
:root {
  --xy-key-top: #f5faff;
  --xy-key-base: #e0edf9;
  --xy-key-edge: #b5cbe2;
  --xy-key-shadow: #9bb6d3;
  --xy-key-ink: #3a5274;
  --xy-key-primary-top: #f7fbff;
  --xy-key-primary-base: #c9def5;
  --xy-key-primary-edge: #98b6d9;
  --xy-key-primary-shadow: #82a2c9;
  --xy-key-primary-ink: #2d4d78;
  --xy-key-danger-top: #fff9f6;
  --xy-key-danger-base: #f3ddd5;
  --xy-key-danger-edge: #d8b3a7;
  --xy-key-danger-shadow: #c49a8e;
  --xy-key-danger-ink: #70473d;
}
:root.dark {
  --xy-key-top: #dbe9fb;
  --xy-key-base: #b8d0ec;
  --xy-key-edge: #829dc1;
  --xy-key-shadow: #617b9e;
  --xy-key-ink: #1f3553;
  --xy-key-primary-top: #e7f1fc;
  --xy-key-primary-base: #b7d0ee;
  --xy-key-primary-edge: #7f9fc8;
  --xy-key-primary-shadow: #5e789e;
  --xy-key-primary-ink: #1f3553;
  --xy-key-danger-top: #fff2ed;
  --xy-key-danger-base: #edcfc4;
  --xy-key-danger-edge: #c99383;
  --xy-key-danger-shadow: #9b7065;
  --xy-key-danger-ink: #59382f;
}
.button,
.button.primary,
.button.danger,
.mission-bay .button.primary,
.text-button,
.mode-pill,
.project-continue,
.hub-focus__action,
.button.herness-send,
.lg-quick,
.lg-icon-btn,
.lg-fab {
  border: 1px solid var(--xy-key-edge) !important;
  border-radius: 13px !important;
  background: linear-gradient(180deg,var(--xy-key-top),var(--xy-key-base)) !important;
  color: var(--xy-key-ink) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.98), inset 0 -1px 0 rgba(75,103,139,.1), 0 4px 0 var(--xy-key-shadow), 0 7px 13px rgba(78,105,139,.14) !important;
  transform: translateY(0);
  transform-origin: center;
  touch-action: manipulation;
  transition: transform 150ms cubic-bezier(.22,.8,.2,1), box-shadow 150ms cubic-bezier(.22,.8,.2,1), filter 150ms ease !important;
}
@media (hover: hover) and (pointer: fine) {
  .button:not(:disabled):hover,
  .button.primary:not(:disabled):hover,
  .mission-bay .button.primary:not(:disabled):hover,
  .text-button:not(:disabled):hover,
  .mode-pill:not(:disabled):hover,
  .project-continue:hover,
  .hub-focus__action:hover,
  .button.herness-send:not(:disabled):hover,
  .lg-quick:hover,
  .lg-icon-btn:hover,
  .lg-fab:hover {
    filter: brightness(1.018);
    transform: translateY(-1.5px) !important;
    box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(75,103,139,.1), 0 5px 0 var(--xy-key-shadow), 0 9px 16px rgba(78,105,139,.18) !important;
  }
  .button.primary:not(:disabled):hover,
  .mission-bay .button.primary:not(:disabled):hover,
  .button.herness-send:not(:disabled):hover,
  .project-continue:hover,
  .hub-focus__action:hover,
  .lg-quick:hover,
  .lg-fab:hover {
    box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(54,82,119,.12), 0 6px 0 var(--xy-key-primary-shadow), 0 10px 18px rgba(72,104,148,.21) !important;
  }
  .button.danger:not(:disabled):hover,
  .lg-icon-btn.danger:hover,
  button.danger:hover {
    box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(113,67,54,.1), 0 5px 0 var(--xy-key-danger-shadow), 0 9px 16px rgba(122,73,58,.18) !important;
  }
}
.button.primary,
.mission-bay .button.primary,
.button.herness-send,
.project-continue,
.hub-focus__action,
.lg-quick,
.lg-fab {
  border-color: var(--xy-key-primary-edge) !important;
  background: linear-gradient(180deg,var(--xy-key-primary-top),var(--xy-key-primary-base)) !important;
  color: var(--xy-key-primary-ink) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.99), inset 0 -1px 0 rgba(54,82,119,.12), 0 5px 0 var(--xy-key-primary-shadow), 0 8px 15px rgba(72,104,148,.18) !important;
}
.button.danger,
.lg-icon-btn.danger,
button.danger {
  border-color: var(--xy-key-danger-edge) !important;
  background: linear-gradient(180deg,var(--xy-key-danger-top),var(--xy-key-danger-base)) !important;
  color: var(--xy-key-danger-ink) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.98), inset 0 -1px 0 rgba(113,67,54,.1), 0 4px 0 var(--xy-key-danger-shadow), 0 7px 13px rgba(122,73,58,.14) !important;
}
.button:focus-visible { border-radius: 13px !important; }
.button:not(:disabled):active,
.button.primary:not(:disabled):active,
.mission-bay .button.primary:not(:disabled):active,
.text-button:not(:disabled):active,
.mode-pill:not(:disabled):active,
.project-continue:active,
.hub-focus__action:active,
.button.herness-send:not(:disabled):active,
.lg-quick:active,
.lg-icon-btn:active,
.lg-fab:active { transform: translateY(2px) !important; box-shadow: inset 0 2px 5px rgba(69,94,130,.16),0 1px 0 var(--xy-key-shadow) !important; }
.button.primary:not(:disabled):active,
.mission-bay .button.primary:not(:disabled):active,
.button.herness-send:not(:disabled):active,
.project-continue:active,
.hub-focus__action:active,
.lg-quick:active,
.lg-fab:active { transform: translateY(3px) !important; box-shadow: inset 0 2px 5px rgba(52,81,121,.2),0 1px 0 var(--xy-key-primary-shadow) !important; }
.button.danger:not(:disabled):active,
.lg-icon-btn.danger:active,
button.danger:active { transform: translateY(2px) !important; box-shadow: inset 0 2px 5px rgba(113,67,54,.16),0 1px 0 var(--xy-key-danger-shadow) !important; }
.button:disabled,.text-button:disabled,.mode-pill:disabled { filter: saturate(.55); box-shadow: inset 0 1px rgba(255,255,255,.7),0 1px 0 var(--xy-key-shadow) !important; }
.lg-quick-icon { background: var(--xy-key-base) !important; color: var(--xy-key-ink) !important; border: 1px solid var(--xy-key-edge); box-shadow: inset 0 1px white; }
.lg-quick-icon .xy-icon { color: var(--xy-key-ink) !important; background: transparent !important; }

/* A quiet masthead: an embossed mark, editorial wordmark, flat section rail. */
.topbar, body[data-page="home"] .topbar {
  top: 10px; width: calc(100% - 32px); margin: 10px 16px 0;
  border: 1px solid rgba(153, 139, 116, .28) !important;
  border-radius: 17px;
  background: linear-gradient(rgba(255, 255, 251, .92), rgba(251, 249, 243, .92)),
    url('/static/brand/linen-texture-v1.webp') center / 768px repeat !important;
  box-shadow: 0 7px 22px rgba(64, 59, 53, .09), inset 0 1px rgba(255,255,255,.96) !important;
}
html.dark .topbar, html.dark body[data-page="home"] .topbar {
  background: linear-gradient(rgba(36, 42, 42, .94), rgba(31, 37, 38, .94)),
    url('/static/brand/linen-texture-v1.webp') center / 768px repeat !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.2), inset 0 1px rgba(255,255,255,.06) !important;
}
.topbar .brand {
  gap: 11px; min-width: 130px; padding-right: 18px;
  border-right: 1px solid var(--xy-brand-border);
  font-family: 'STSong','Songti SC','SimSun',serif;
  font-size: 19px; font-weight: 650; letter-spacing: .08em;
}
.topbar .brand .seal {
  width: 39px; height: 39px; border: 1px solid #a5bfdb;
  border-radius: 50%; background: radial-gradient(circle at 30% 22%,#f8fcff,#dceafa 74%) !important;
  color: #4c6997; box-shadow: inset 0 1px white,0 3px 0 #a5bcd5,0 5px 9px rgba(74,98,137,.15) !important;
}
.topbar .brand .seal::after { inset: 9px; }
.topbar .brand small { font-family: Georgia,serif; font-size: 7px; letter-spacing: .28em; font-weight: 600; }
.topbar #navigation { height: 100%; gap: 1px; }
.topbar .nav-project,
.topbar .nav-link,
body[data-page="home"] .topbar .nav-project,
body[data-page="home"] .topbar .nav-link {
  height: 100%; min-height: 0; padding: 0 12px;
  border: 0 !important; border-radius: 0;
  background: transparent !important; box-shadow: none !important;
  font-family: 'KaiTi', 'STKaiti', 'Kaiti SC', serif;
  font-size: 14px; font-weight: 500; letter-spacing: .035em;
}
.topbar .nav-project.active,
.topbar .nav-link.active,
body[data-page="home"] .topbar .nav-project.active,
body[data-page="home"] .topbar .nav-link.active {
  border: 0 !important; background: transparent !important;
  color: #49433d !important;
  font-weight: 700;
  box-shadow: none !important;
}
.topbar .nav-project:hover,
.topbar .nav-link:hover {
  background: transparent !important;
  color: #745d47 !important;
  box-shadow: none !important;
}
html.dark .topbar :is(.nav-project, .nav-link).active { color: #d8e9e4 !important; }
html.dark .topbar :is(.nav-project, .nav-link):hover { color: #efd3af !important; }
html body[data-page] .topbar :is(.nav-project, .nav-link).active {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}
body:not([data-page="home"]) .topbar .nav-project.active { box-shadow: none !important; }
.topbar .topbar-meta #connection { border: 0; background: transparent; }
body[data-page="home"] .topbar #connection { display: none; }

/* Felt belongs to work surfaces, not the two approved memory-box compositions. */
body[data-page="operations"] .ops-board {
  background: linear-gradient(rgba(240,250,249,.83),rgba(240,250,249,.83)),url('/static/brand/teal-felt-v1.webp') center / 768px repeat !important;
  border-color: #b9d6d0 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.7),0 10px 22px rgba(42,91,88,.09) !important;
}
body[data-page="herness"] .herness-history,
body[data-page="herness"] .herness-status {
  background: linear-gradient(rgba(238,249,247,.83),rgba(238,249,247,.83)),url('/static/brand/teal-felt-v1.webp') center / 768px repeat !important;
}
html:not(.dark) body[data-page="mission"] .mission-deck {
  background: linear-gradient(rgba(235,248,246,.79),rgba(235,248,246,.79)),url('/static/brand/teal-felt-v1.webp') center / 768px repeat !important;
  border-color: rgba(126,184,177,.42);
}
html.dark body[data-page="mission"] .mission-deck {
  background: linear-gradient(rgba(18,33,39,.82),rgba(18,33,39,.82)),url('/static/brand/teal-felt-v1.webp') center / 768px repeat !important;
  border-color: rgba(126,184,177,.42);
}
html.dark body[data-page="operations"] .ops-board,
html.dark body[data-page="herness"] .herness-history,
html.dark body[data-page="herness"] .herness-status {
  background: linear-gradient(rgba(23,36,41,.82),rgba(23,36,41,.82)),url('/static/brand/teal-felt-v1.webp') center / 768px repeat !important;
  border-color: #3b5a5e !important;
}
@media (max-width: 820px) {
  .topbar, body[data-page="home"] .topbar { top: 6px; width: calc(100% - 16px); margin: 6px 8px 0; }
  .topbar .brand { min-width: 100px; padding-right: 10px; font-size: 16px; }
  .topbar .brand .seal { width: 30px; height: 30px; }
  .topbar .brand .seal::after { inset: 7px; }
  .topbar #navigation { height: 44px; }
  .topbar .nav-project, .topbar .nav-link,
  body[data-page="home"] .topbar .nav-project,
  body[data-page="home"] .topbar .nav-link { height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  .button,.text-button,.mode-pill,.project-continue,.hub-focus__action,.button.herness-send,.lg-quick,.lg-icon-btn,.lg-fab { transition: none !important; }
}

/* Non-home workspaces become a shared felt pinboard; the memory-box home stays intact. */
body[data-page]:not([data-page="home"]) #workspace {
  margin: 0 0 24px;
  padding: clamp(20px, 3vw, 38px) !important;
  border: 1px solid rgba(114, 157, 151, .42);
  border-radius: 26px;
  background:
    linear-gradient(rgba(211, 233, 228, .68), rgba(198, 223, 217, .68)),
    url('/static/brand/teal-felt-v1.webp') center / 768px repeat;
  box-shadow: inset 0 1px rgba(255, 255, 255, .62), 0 14px 34px rgba(44, 82, 77, .12);
}
html.dark body[data-page]:not([data-page="home"]) #workspace {
  border-color: rgba(126, 164, 157, .34);
  background:
    linear-gradient(rgba(29, 48, 49, .89), rgba(26, 43, 45, .91)),
    url('/static/brand/teal-felt-v1.webp') center / 768px repeat;
  box-shadow: inset 0 1px rgba(231, 246, 241, .07), 0 14px 34px rgba(0, 0, 0, .22);
}

/* Empty task work benefits from a quiet white-felt field, not a green slab. */
body[data-page="mission"] #workspace {
  border: 0 !important;
  background: linear-gradient(rgba(253, 252, 247, .88), rgba(247, 247, 242, .9)),
    url('/static/brand/teal-felt-v1.webp') center / 768px repeat !important;
  box-shadow: 0 14px 32px rgba(63, 76, 73, .1) !important;
}
html.dark body[data-page="mission"] #workspace {
  background: linear-gradient(rgba(39, 44, 46, .93), rgba(34, 40, 42, .94)),
    url('/static/brand/teal-felt-v1.webp') center / 768px repeat !important;
}
body[data-page="mission"] #workspace .mz-empty {
  background: linear-gradient(rgba(250, 242, 223, .89), rgba(245, 233, 207, .91)),
    url('/static/brand/aged-straw-paper-v1.png') center / 640px repeat !important;
  box-shadow: 0 15px 28px rgba(75, 66, 51, .16), 0 3px 6px rgba(75, 66, 51, .08) !important;
}
html.dark body[data-page="mission"] #workspace .mz-empty {
  background: linear-gradient(rgba(55, 52, 48, .94), rgba(49, 47, 45, .95)),
    url('/static/brand/aged-straw-paper-v1.png') center / 640px repeat !important;
}
body[data-page="mission"] #workspace :is(.mz-bar, .mz-empty) {
  border-top: 0 !important;
  border-bottom: 0 !important;
}

body[data-page="ledger"] #workspace {
  margin: 0 auto 24px !important;
  border: 0 !important;
  background: linear-gradient(rgba(252, 252, 247, .87), rgba(247, 248, 244, .89)),
    url('/static/brand/teal-felt-v1.webp') center / 768px repeat !important;
}
html.dark body[data-page="ledger"] #workspace {
  background: linear-gradient(rgba(38, 44, 46, .93), rgba(35, 41, 43, .94)),
    url('/static/brand/teal-felt-v1.webp') center / 768px repeat !important;
}

/* Utility workspaces use white felt so long lists do not become one green sheet. */
body[data-page]:not(:is([data-page="home"], [data-page="operations"], [data-page="herness"], [data-page="competition"], [data-page="simulation"], [data-page="mission"], [data-page="ledger"])) #workspace {
  border: 0 !important;
  background: linear-gradient(rgba(252, 252, 248, .88), rgba(248, 248, 244, .9)),
    url('/static/brand/teal-felt-v1.webp') center / 768px repeat !important;
  box-shadow: 0 14px 32px rgba(63, 76, 73, .1) !important;
}
html.dark body[data-page]:not(:is([data-page="home"], [data-page="operations"], [data-page="herness"], [data-page="competition"], [data-page="simulation"], [data-page="mission"], [data-page="ledger"])) #workspace {
  background: linear-gradient(rgba(39, 44, 46, .93), rgba(34, 40, 42, .94)),
    url('/static/brand/teal-felt-v1.webp') center / 768px repeat !important;
}
body[data-page="tools"] #workspace > details {
  margin: 9px 0 !important;
  padding: 6px 16px !important;
  border: 0 !important;
  border-radius: 12px;
  background: linear-gradient(rgba(255, 253, 247, .91), rgba(250, 247, 240, .93)),
    url('/static/brand/aged-straw-paper-v1.png') center / 640px repeat;
  box-shadow: 0 5px 11px rgba(58, 65, 60, .07);
}
body[data-page="tools"] #workspace > details > summary {
  min-height: 44px;
  display: flex;
  align-items: center;
  color: var(--ink);
  font-size: 13px;
}
html.dark body[data-page="tools"] #workspace > details {
  background: linear-gradient(rgba(49, 49, 47, .94), rgba(44, 45, 45, .95)),
    url('/static/brand/aged-straw-paper-v1.png') center / 640px repeat;
}
body[data-page]:not([data-page="home"]) #evidence-rail .rail-section,
body[data-page]:not([data-page="home"]) #workspace > .section-heading,
body[data-page]:not([data-page="home"]) #workspace > .result {
  border: 0 !important;
}

/* Felt is the desk, not the paper pinned onto it. */
body[data-page]:not([data-page="home"]) #workspace :is(
  .ops-board,
  .ops-conveyor,
  .ops-alert-panel,
  .ops-flow,
  .herness-history,
  .herness-main,
  .herness-status,
  .mz-cartridge,
  .mz-panel,
  .race-hero,
  .race-panel,
  .sim-panel,
  .lg-card,
  .lg-chart-card,
  .lg-feed-card,
  .lg-sheet-panel,
  .form-card,
  .composer,
  .board-role,
  .drop-zone,
  .data-table-wrap
) {
  border: 0 !important;
  border-radius: 13px !important;
  background:
    linear-gradient(rgba(255, 253, 246, .91), rgba(250, 247, 239, .93)),
    url('/static/brand/aged-straw-paper-v1.png') center / 640px repeat !important;
  box-shadow: 0 11px 23px rgba(38, 67, 66, .14), 0 2px 4px rgba(38, 67, 66, .07) !important;
}
html.dark body[data-page]:not([data-page="home"]) #workspace :is(
  .ops-board,
  .ops-conveyor,
  .ops-alert-panel,
  .ops-flow,
  .herness-history,
  .herness-main,
  .herness-status,
  .mz-cartridge,
  .mz-panel,
  .race-hero,
  .race-panel,
  .sim-panel,
  .lg-card,
  .lg-chart-card,
  .lg-feed-card,
  .lg-sheet-panel,
  .form-card,
  .composer,
  .board-role,
  .drop-zone,
  .data-table-wrap
) {
  border: 0 !important;
  background:
    linear-gradient(rgba(47, 50, 53, .94), rgba(42, 46, 49, .95)),
    url('/static/brand/aged-straw-paper-v1.png') center / 640px repeat !important;
  box-shadow: 0 11px 23px rgba(0, 0, 0, .24), 0 2px 4px rgba(0, 0, 0, .11) !important;
}

/* A restrained tack marks a few pinned surfaces without making every item a card. */
body[data-page]:not([data-page="home"]) #workspace :is(
  .ops-board,
  .mz-cartridge,
  .race-hero,
  .race-panel
) {
  position: relative;
}
body[data-page]:not([data-page="home"]) #workspace :is(
  .ops-board,
  .mz-cartridge,
  .race-hero,
  .race-panel
)::before {
  content: "";
  position: absolute;
  z-index: 3;
  top: -7px;
  left: 24px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: radial-gradient(circle at 31% 27%, #fff 0 8%, #d7e8f5 22%, #95b9d8 58%, #5b7898 100%);
  box-shadow: 0 2px 3px rgba(37, 54, 68, .28), inset 0 1px 1px rgba(255, 255, 255, .86);
  pointer-events: none;
}

/* The felt board is the outer surface now; retain canvas and input surfaces as they are. */
body[data-page="mission"] #workspace .mission-deck {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body[data-page="mission"] #workspace .mz-empty {
  width: min(100%, 560px);
  margin: 52px auto 20px;
  padding: 43px 36px 35px;
  border: 0 !important;
  border-radius: 16px;
  background: url('/static/brand/felt-memory-doodles.svg') right 17px bottom 13px / 118px auto no-repeat,
    linear-gradient(rgba(255, 254, 248, .93), rgba(250, 247, 238, .93)),
    url('/static/brand/linen-texture-v1.webp') center / 768px repeat;
  box-shadow: 0 10px 24px rgba(44, 77, 71, .12);
  transform: rotate(-.25deg);
}
body[data-page="mission"] #workspace .mz-empty::before {
  content: "";
  position: absolute;
  top: -7px;
  left: calc(50% - 7px);
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: radial-gradient(circle at 31% 27%, #fff 0 8%, #d7e8f5 22%, #95b9d8 58%, #5b7898 100%);
  box-shadow: 0 2px 3px rgba(37, 54, 68, .28), inset 0 1px 1px rgba(255, 255, 255, .86);
  pointer-events: none;
}
body[data-page="mission"] #workspace .mz-empty strong { font-size: 21px; font-weight: 650; }
body[data-page="mission"] #workspace .mz-empty p { color: var(--ink-2); font-size: 13px; line-height: 1.7; }
body[data-page="mission"] #workspace .mz-note { font-size: 12px; line-height: 1.7; }
body[data-page="mission"] #workspace .mz-filter button {
  border: 0 !important;
  border-radius: 8px;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ink-2) !important;
  font-family: "KaiTi", "STKaiti", "Kaiti SC", serif;
  font-size: 15px;
  min-height: 42px;
}
body[data-page="mission"] #workspace .mz-filter button:hover { color: #775b43 !important; }
body[data-page="mission"] #workspace .mz-filter button[aria-pressed="true"] {
  color: var(--ink) !important;
  font-weight: 700;
}
body[data-page="mission"] #workspace .mz-filter {
  scrollbar-width: thin;
  scrollbar-color: rgba(118, 105, 86, .38) transparent;
}
html.dark body[data-page="mission"] #workspace .mz-filter {
  scrollbar-color: rgba(206, 187, 157, .48) transparent;
}
html.dark body[data-page="mission"] #workspace .mz-empty {
  border-color: rgba(177, 195, 187, .26) !important;
  background: url('/static/brand/felt-memory-doodles.svg') right 17px bottom 13px / 118px auto no-repeat,
    linear-gradient(rgba(40, 49, 49, .95), rgba(36, 44, 45, .95)),
    url('/static/brand/linen-texture-v1.webp') center / 768px repeat;
}
body[data-page="simulation"] #workspace :is(.sim-canvas-wrap, .sim-canvas) {
  border-radius: 12px;
}
body[data-page]:not([data-page="home"]) #workspace :is(.button, .text-button, .mode-pill, .lg-tab) {
  border-radius: 14px !important;
}

/* Settings and the evidence rail share the same board material as the work panels. */
body[data-page]:not([data-page="home"]) #workspace :is(.provider-quick, .card, .panel, .stat-card, .week-card),
body[data-page]:not([data-page="home"]) #evidence-rail {
  border: 0 !important;
  border-radius: 16px !important;
  background: linear-gradient(rgba(252, 251, 246, .94), rgba(247, 244, 236, .95)),
    url('/static/brand/linen-texture-v1.webp') center / 768px repeat !important;
  box-shadow: 0 11px 23px rgba(38, 67, 66, .14), 0 2px 4px rgba(38, 67, 66, .07) !important;
}
html.dark body[data-page]:not([data-page="home"]) #workspace :is(.provider-quick, .card, .panel, .stat-card, .week-card),
html.dark body[data-page]:not([data-page="home"]) #evidence-rail {
  border: 0 !important;
  background: linear-gradient(rgba(47, 50, 53, .94), rgba(42, 46, 49, .95)),
    url('/static/brand/linen-texture-v1.webp') center / 768px repeat !important;
  box-shadow: 0 11px 23px rgba(0, 0, 0, .24), 0 2px 4px rgba(0, 0, 0, .11) !important;
}
body[data-page]:not([data-page="home"]) #evidence-rail { margin: 0 16px 24px 10px; }
body[data-page]:not([data-page="home"]) #evidence-rail .rail-section h2 {
  color: var(--ink);
  font-family: var(--display);
  font-size: 13px;
  letter-spacing: .015em;
}
body[data-page]:not([data-page="home"]) #evidence-rail :is(.rail-note, .rail-meta) {
  font-size: 12px;
  line-height: 1.7;
}

/* Quiet secondary controls read like ink on the board; important actions stay raised. */
body[data-page="operations"] #workspace .ops-pager button,
body[data-page="operations"] #workspace :is(.ops-tab, .ops-station),
body[data-page="herness"] #workspace .herness-quick button,
body[data-page="herness"] #workspace .herness-composer-foot :is(button, a):not(.primary):not(.danger):not(.herness-send),
body[data-page]:not([data-page="home"]) #workspace :is(.text-button, .lg-tab) {
  min-height: 44px;
  padding-inline: 9px;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ink-2) !important;
  font-family: "KaiTi", "STKaiti", "Kaiti SC", serif !important;
  font-size: 15px;
  text-decoration: none !important;
  transform: none !important;
}
body[data-page="operations"] #workspace .ops-pager button:hover,
body[data-page="operations"] #workspace :is(.ops-tab, .ops-station):hover,
body[data-page="herness"] #workspace .herness-quick button:hover,
body[data-page="herness"] #workspace .herness-composer-foot :is(button, a):not(.primary):not(.danger):not(.herness-send):hover,
body[data-page]:not([data-page="home"]) #workspace :is(.text-button, .lg-tab):hover {
  background: transparent !important;
  color: #775b43 !important;
  text-decoration: none !important;
}
html.dark body[data-page]:not([data-page="home"]) #workspace :is(.text-button, .lg-tab):hover,
html.dark body[data-page="operations"] #workspace :is(.ops-tab, .ops-station):hover { color: #efd3af !important; }

/* Selection is expressed through ink weight. Focus remains visible for keyboard use. */
body[data-page="operations"] #workspace :is(.ops-tab.active, .ops-station.active),
body[data-page="ledger"] #workspace .lg-tab.active,
body[data-page="herness"] #workspace .herness-history-item.active {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ink) !important;
  font-weight: 700;
}
body[data-page="operations"] #workspace .ops-stat.selected {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}
body[data-page="operations"] #workspace .ops-stat.selected span,
body[data-page="operations"] #workspace .ops-stat.selected strong { color: var(--ink) !important; }
body[data-page="operations"] #workspace .ops-summary {
  margin-block: 18px 24px;
  padding: 7px 12px;
  border: 1px solid rgba(90, 135, 128, .32) !important;
  border-radius: 16px;
  background: linear-gradient(rgba(228, 243, 238, .5), rgba(211, 233, 226, .5)),
    url('/static/brand/teal-felt-v1.webp') center / 768px repeat;
}
html.dark body[data-page="operations"] #workspace .ops-summary {
  border-color: rgba(150, 188, 178, .25) !important;
  background: linear-gradient(rgba(30, 52, 50, .72), rgba(27, 47, 46, .72)),
    url('/static/brand/teal-felt-v1.webp') center / 768px repeat;
}
body[data-page="herness"] #workspace .herness-history-item:hover {
  background: transparent !important;
  color: var(--ink) !important;
}
:is(.topbar, body[data-page]:not([data-page="home"]) #workspace) :where(button, a, input, textarea, select, summary):focus-visible {
  outline: 2px solid #9b754d !important;
  outline-offset: 3px !important;
  border-radius: 8px;
}
html.dark :is(.topbar, body[data-page]:not([data-page="home"]) #workspace) :where(button, a, input, textarea, select, summary):focus-visible {
  outline-color: #d0af84 !important;
}
body[data-page]:not([data-page="home"]) #workspace :is(input, select, textarea):not(.herness-input):focus {
  border-color: #b69a78 !important;
  box-shadow: 0 0 0 1px #b69a78, 0 0 0 3px rgba(182, 154, 120, .18) !important;
}
body[data-page]:not([data-page="home"]) #workspace .field label { font-size: 12px; }
body[data-page]:not([data-page="home"]) #workspace :is(.field small, .help) {
  font-size: 11.5px;
  line-height: 1.6;
}
body[data-page]:not([data-page="home"]) #workspace .field :is(input, select, textarea) { font-size: 13.5px; }
body[data-page="herness"] #workspace .herness-composer:focus-within {
  border-color: #b69a78 !important;
  box-shadow: 0 3px 14px rgba(73, 69, 59, .1), 0 0 0 2px rgba(182, 154, 120, .24) !important;
}

/* Title, body, and annotation type stay in three clear tiers on the felt. */
body[data-page]:not([data-page="home"]) #workspace { font-family: var(--body); }
body[data-page]:not([data-page="home"]) #workspace :is(h1, h2, h3) {
  font-family: var(--display);
  font-weight: 650;
  letter-spacing: .015em;
  line-height: 1.35;
}
body[data-page="operations"] #workspace :is(.ops-table, .ops-aside .subtle) { font-size: 12.5px; line-height: 1.6; }
body[data-page="operations"] #workspace .ops-table :is(th, td small) { font-size: 11.5px; line-height: 1.55; }
body[data-page="operations"] #workspace .ops-flow :is(h2, strong) { color: var(--ink); }
body[data-page="operations"] #workspace .ops-flow :is(p, small) { color: var(--ink-2); }
body[data-page="operations"] #workspace .ops-flow > div > b { color: var(--ink); border-color: rgba(86, 122, 116, .38); }
body[data-page="operations"] #workspace :is(.ops-alert-panel p, .ops-source-note) {
  font-size: 12.5px;
  line-height: 1.7;
}
body[data-page="operations"] #workspace :is(.ops-tabs, .ops-table-scroll) {
  scrollbar-width: thin;
  scrollbar-color: rgba(118, 105, 86, .38) transparent;
}
body[data-page="operations"] #workspace :is(.ops-tabs, .ops-table-scroll)::-webkit-scrollbar { height: 4px; }
body[data-page="operations"] #workspace :is(.ops-tabs, .ops-table-scroll)::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background: rgba(118, 105, 86, .38);
}
html.dark body[data-page="operations"] #workspace :is(.ops-tabs, .ops-table-scroll) {
  scrollbar-color: rgba(206, 187, 157, .48) transparent;
}
body[data-page="herness"] #workspace .herness-message.user {
  background: rgba(255, 254, 248, .78);
  border-color: rgba(108, 137, 129, .3);
}
html.dark body[data-page="herness"] #workspace .herness-message.user {
  background: rgba(29, 39, 40, .76);
  border-color: rgba(155, 188, 179, .26);
}
body[data-page="herness"] #workspace .herness-composer {
  border-color: rgba(133, 143, 128, .42);
  background: #fffdf7;
}
html.dark body[data-page="herness"] #workspace .herness-composer { background: #273030; }
body[data-page="herness"] #workspace .herness-header {
  border-color: rgba(158, 143, 119, .3);
  background: linear-gradient(rgba(255, 254, 250, .94), rgba(250, 248, 242, .94)),
    url('/static/brand/linen-texture-v1.webp') center / 768px repeat;
}
html.dark body[data-page="herness"] #workspace .herness-header {
  border-color: rgba(146, 168, 160, .26);
  background: linear-gradient(rgba(39, 46, 46, .94), rgba(35, 42, 43, .94)),
    url('/static/brand/linen-texture-v1.webp') center / 768px repeat;
}
body[data-page="herness"] #workspace .herness-pane-title { font-size: 13px; }
body[data-page="herness"] #workspace .herness-header p,
body[data-page="herness"] #workspace .herness-trust,
body[data-page="herness"] #workspace .herness-history-empty,
body[data-page="herness"] #workspace .herness-local-note,
body[data-page="herness"] #workspace .herness-fact,
body[data-page="herness"] #workspace :is(.herness-boundary, .herness-evidence) p { font-size: 11.5px; line-height: 1.65; }
body[data-page="herness"] #workspace :is(.herness-boundary, .herness-evidence) span { font-size: 11.5px; }

/* The memory-box doodles live only in intentionally empty work areas. */
body[data-page="herness"] #workspace .herness-empty {
  border-radius: 15px;
  background:
    url('/static/brand/felt-memory-doodles.svg') right 18px top 18px / 130px auto no-repeat,
    linear-gradient(rgba(255, 254, 248, .94), rgba(250, 247, 238, .94)),
    url('/static/brand/linen-texture-v1.webp') center / 768px repeat;
}
html.dark body[data-page="herness"] #workspace .herness-empty {
  border-color: rgba(177, 195, 187, .26);
  background:
    url('/static/brand/felt-memory-doodles.svg') right 18px top 18px / 130px auto no-repeat,
    linear-gradient(rgba(40, 49, 49, .95), rgba(36, 44, 45, .95)),
    url('/static/brand/linen-texture-v1.webp') center / 768px repeat;
}
body[data-page="operations"] #workspace .ops-empty {
  background-image: url('/static/brand/felt-memory-doodles.svg') !important;
  background-repeat: no-repeat !important;
  background-position: right 24px bottom 17px !important;
  background-size: 150px auto !important;
}

/* Operations: paper-on-felt hierarchy and quiet ink controls. */
body[data-page="operations"] .topbar #refresh { display: none !important; }
body[data-page="operations"] .topbar .nav-project-divider {
  display: block !important;
  align-self: center;
  width: 1px;
  height: 19px;
  margin-inline: 10px;
  background: rgba(93, 116, 112, .28);
}
body[data-page="operations"] #workspace .ops-heading-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin-top: 14px;
  color: var(--ink-2);
  font-size: 12px;
}
body[data-page="operations"] #workspace .ops-heading-meta strong {
  color: var(--ink);
  font-size: 15px;
  font-variant-numeric: tabular-nums;
}
body[data-page="operations"] #workspace .ops-local-proof {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
body[data-page="operations"] #workspace .ops-local-proof .ui-icon { width: 14px; height: 14px; }
body[data-page="operations"] #workspace .ops-board-tools {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
body[data-page="operations"] #workspace .ops-refresh {
  flex: none;
  min-height: 38px;
  padding: 0 7px;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ink-2) !important;
  font-family: "KaiTi", "STKaiti", "Kaiti SC", serif;
  font-size: 14px;
}
body[data-page="operations"] #workspace .ops-refresh:hover { color: #775b43 !important; transform: translateY(-1px); }
body[data-page="operations"] #workspace .ops-refresh:active { transform: translateY(1px); }
body[data-page="operations"] #workspace .ops-board {
  border-color: rgba(72, 116, 107, .55) !important;
  box-shadow: 0 10px 22px rgba(41, 82, 73, .12), inset 0 1px rgba(255, 255, 255, .5) !important;
}
body[data-page="operations"] #workspace .ops-alert-panel {
  background: linear-gradient(rgba(230, 244, 238, .77), rgba(216, 234, 226, .79)),
    url('/static/brand/teal-felt-v1.webp') center / 768px repeat !important;
  border-color: rgba(86, 129, 115, .43) !important;
}
body[data-page="operations"] #workspace .ops-flow {
  background: linear-gradient(rgba(198, 225, 215, .77), rgba(187, 214, 205, .79)),
    url('/static/brand/teal-felt-v1.webp') center / 768px repeat !important;
  border-color: rgba(75, 119, 110, .48) !important;
}
body[data-page="operations"] #workspace .ops-aside-title h2 { font-size: 14px; line-height: 1.4; }
body[data-page="operations"] #workspace .ops-alert-clear {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: start;
  gap: 4px 10px;
  margin: 20px 0 15px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
body[data-page="operations"] #workspace .ops-alert-clear > .ui-icon {
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
  color: #5e7d73;
}
body[data-page="operations"] #workspace .ops-alert-clear strong {
  font-size: 14px;
  line-height: 1.45;
}
body[data-page="operations"] #workspace .ops-alert-clear p {
  grid-column: 2;
  margin: 0;
  font-size: 12.5px;
  line-height: 1.75;
}
body[data-page="operations"] #workspace .ops-source-note {
  padding: 16px 18px;
  border: 1px solid rgba(92, 139, 132, .34);
  border-radius: 15px;
  background: linear-gradient(rgba(224, 239, 232, .73), rgba(209, 228, 219, .75)),
    url('/static/brand/teal-felt-v1.webp') center / 768px repeat;
}
body[data-page="operations"] #workspace .ops-source-note > strong { font-size: 13px; }
body[data-page="operations"] #workspace .ops-source-note p { margin: 7px 0 0; }
body[data-page="operations"] #workspace .ops-source-help {
  padding-top: 9px;
  border-top: 1px dashed rgba(97, 130, 119, .42);
  font-size: 12px;
}
body[data-page="operations"] #workspace .ops-source-note .actions { align-items: center; }
body[data-page="operations"] #workspace .ops-source-note .actions .button:last-child {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ink-2) !important;
  font-family: "KaiTi", "STKaiti", "Kaiti SC", serif;
  font-size: 14px;
}
body[data-page="operations"] #workspace .ops-source-note .actions .button:last-child:hover { color: #775b43 !important; transform: translateY(-1px); }
body[data-page="operations"] #workspace .ops-source-note .actions .button:last-child:active { transform: translateY(1px); }
body[data-page="operations"] #workspace .ops-empty > .ui-icon {
  background: rgba(255, 253, 245, .48);
  color: #627c76;
}
body[data-page="operations"] #workspace .ops-empty .button { white-space: nowrap; }
html.dark body[data-page="operations"] #workspace .ops-alert-panel,
html.dark body[data-page="operations"] #workspace .ops-source-note {
  background: linear-gradient(rgba(32, 53, 49, .87), rgba(28, 48, 47, .89)),
    url('/static/brand/teal-felt-v1.webp') center / 768px repeat !important;
}
html.dark body[data-page="operations"] #workspace .ops-flow {
  background: linear-gradient(rgba(24, 43, 42, .89), rgba(23, 40, 42, .91)),
    url('/static/brand/teal-felt-v1.webp') center / 768px repeat !important;
}
html.dark body[data-page="operations"] #workspace .ops-alert-clear { background: transparent; }
html.dark body[data-page="operations"] #workspace .ops-source-note .actions .button:last-child:hover { color: #efd3af !important; }
@media (max-width: 600px) {
  body[data-page="mission"] #workspace .mz-empty {
    margin-block: 26px;
    padding: 38px 20px 30px;
    background: linear-gradient(rgba(255, 254, 248, .93), rgba(250, 247, 238, .93)),
      url('/static/brand/linen-texture-v1.webp') center / 768px repeat;
  }
  html.dark body[data-page="mission"] #workspace .mz-empty {
    background: linear-gradient(rgba(40, 49, 49, .95), rgba(36, 44, 45, .95)),
      url('/static/brand/linen-texture-v1.webp') center / 768px repeat;
  }
  body[data-page="herness"] #workspace .herness-empty {
    background: linear-gradient(rgba(255, 254, 248, .94), rgba(250, 247, 238, .94)),
      url('/static/brand/linen-texture-v1.webp') center / 768px repeat !important;
  }
  html.dark body[data-page="herness"] #workspace .herness-empty {
    background: linear-gradient(rgba(40, 49, 49, .95), rgba(36, 44, 45, .95)),
      url('/static/brand/linen-texture-v1.webp') center / 768px repeat !important;
  }
  body[data-page="herness"] #workspace .herness-quick {
    flex-wrap: wrap;
    gap: 2px 10px;
    overflow: visible;
    padding-block: 4px 12px;
  }
  body[data-page="herness"] #workspace .herness-quick button {
    flex: 1 1 calc(50% - 10px);
    min-width: 0;
  }
  body[data-page="operations"] #workspace .ops-empty { background-image: none !important; }
  body[data-page="operations"] #workspace .ops-heading > .actions { flex-wrap: wrap; }
  body[data-page="operations"] #workspace .ops-heading > .actions .button { min-width: 0; white-space: nowrap; }
  body[data-page="operations"] #workspace .ops-heading > .actions .button:first-child { flex-basis: 100%; }
  body[data-page="operations"] #workspace .ops-board-tools { width: 100%; }
  body[data-page="operations"] #workspace .ops-search-wrap { flex: 1; min-width: 0; }
  body[data-page="operations"] #workspace .ops-board-heading input { width: 100%; }
  body[data-page="operations"] #workspace .ops-alert-panel { padding: 18px; }
  body[data-page="operations"] #workspace .ops-empty { min-height: 250px; padding: 35px 16px; }
}

@media (max-width: 600px) {
  body[data-page]:not([data-page="home"]) #workspace {
    margin-bottom: 16px;
    padding: 18px 14px !important;
    border-radius: 19px;
  }
}

/* The operations board groups by material and whitespace, never by outlines. */
body[data-page="operations"] .topbar,
body[data-page="operations"] #workspace,
body[data-page="operations"] .footer {
  border: 0 !important;
}
html:has(body[data-page="operations"]) { scrollbar-width: none; }
html:has(body[data-page="operations"])::-webkit-scrollbar { display: none; }
body[data-page="operations"] .topbar .brand { border-right: 0 !important; }
body[data-page="operations"] .topbar .nav-project-divider {
  width: 16px;
  height: 1px;
  margin-inline: 0;
  background: transparent !important;
}
body[data-page="operations"]:not([data-page="home"]) #workspace :is(
  .ops-conveyor,
  .ops-summary,
  .ops-board,
  .ops-alert-panel,
  .ops-flow,
  .ops-source-note
) {
  border: 0 !important;
  border-width: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}
html.dark body[data-page="operations"]:not([data-page="home"]) #workspace :is(
  .ops-conveyor,
  .ops-summary,
  .ops-board,
  .ops-alert-panel,
  .ops-flow,
  .ops-source-note
) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
body[data-page="operations"] #workspace .ops-board::before { display: none !important; }
body[data-page="operations"] #workspace .ops-empty { min-height: 215px; }
body[data-page="operations"] #workspace .ops-conveyor {
  justify-content: space-between;
  gap: 10px;
}
body[data-page="operations"] #workspace .ops-belt { display: none !important; }
body[data-page="operations"] #workspace .ops-summary { padding-inline: 8px; }
body[data-page="operations"] #workspace .ops-summary .ops-stat:nth-child(n),
body[data-page="operations"] #workspace .ops-summary .ops-stat.selected {
  border: 0 !important;
  border-right: 0 !important;
  box-shadow: none !important;
}
body[data-page="operations"] #workspace .ops-tabs,
body[data-page="operations"] #workspace .ops-alert,
body[data-page="operations"] #workspace .ops-alert.high,
body[data-page="operations"] #workspace .ops-source-help,
body[data-page="operations"] #workspace .ops-table :is(th, td) {
  border: 0 !important;
}
body[data-page="operations"] #workspace .ops-tabs { padding-bottom: 5px; }
body[data-page="operations"] #workspace :is(.ops-tabs, .ops-table-scroll) {
  scrollbar-width: none;
}
body[data-page="operations"] #workspace :is(.ops-tabs, .ops-table-scroll)::-webkit-scrollbar {
  display: none;
}
body[data-page="operations"] #workspace .ops-table tbody tr + tr td { padding-top: 22px; }
body[data-page="operations"] #workspace .ops-flow > div > b { border: 0 !important; }
body[data-page="operations"] #workspace .ops-source-note { padding-inline: 0; }
body[data-page="operations"] #workspace .ops-source-help { padding-top: 3px; }
body[data-page="operations"] :is(
  .ops-dialog-head,
  .ops-dialog-footer,
  .ops-watch-row,
  .ops-detail-meta > div,
  .ops-timeline > li
) { border: 0 !important; }

/* Reduced motion keeps a tactile light/shadow response without spatial jumps. */
@media (prefers-reduced-motion: reduce) {
  .button:not(:disabled):hover,
  .button.primary:not(:disabled):hover,
  .mission-bay .button.primary:not(:disabled):hover,
  .text-button:not(:disabled):hover,
  .mode-pill:not(:disabled):hover,
  .project-continue:hover,
  .hub-focus__action:hover,
  .button.herness-send:not(:disabled):hover,
  .lg-quick:hover,
  .lg-icon-btn:hover,
  .lg-fab:hover { transform: none !important; }
  .button:not(:disabled):active,
  .button.primary:not(:disabled):active,
  .mission-bay .button.primary:not(:disabled):active,
  .text-button:not(:disabled):active,
  .mode-pill:not(:disabled):active,
  .project-continue:active,
  .hub-focus__action:active,
  .button.herness-send:not(:disabled):active,
  .lg-quick:active,
  .lg-icon-btn:active,
  .lg-fab:active { transform: none !important; }
}
@media (max-width: 600px) {
  body[data-page="operations"] #workspace .ops-conveyor { gap: 2px; }
  body[data-page="operations"] #workspace .ops-empty {
    min-height: 175px;
    padding-block: 18px;
  }
}