:root,
.dark-surface {
  --canvas: var(--k-bg, #f8fafc);
  --surface: var(--k-surface, #fff);
  --ink: var(--k-text, #172033);
  --muted: var(--k-muted, #475569);
  --line: var(--k-border, #cbd5e1);
  --control: var(--k-control-border, #64748b);
  --accent: var(--k-primary, var(--installation-accent, #334155));
  --accent-hover: var(--k-primary-hover, color-mix(in srgb, var(--accent), black 14%));
  --accent-active: var(--k-primary-active, color-mix(in srgb, var(--accent), black 24%));
  --link: var(--k-link, var(--accent));
  --focus: var(--k-focus, var(--accent));
  --info: var(--k-info, #1e40af);
  --info-bg: var(--k-info-bg, #eff6ff);
  --success: var(--k-success, #166534);
  --success-bg: var(--k-success-bg, #f0fdf4);
  --warning: var(--k-warning, #854d0e);
  --warning-bg: var(--k-warning-bg, #fefce8);
  --error: var(--k-error, #991b1b);
  --error-bg: var(--k-error-bg, #fef2f2);
  --disabled: var(--k-disabled-text, #475569);
  --disabled-bg: var(--k-disabled-bg, #e2e8f0);
  --s4: var(--k-space-4, 4px);
  --s8: var(--k-space-8, 8px);
  --s12: var(--k-space-12, 12px);
  --s16: var(--k-space-16, 16px);
  --s24: var(--k-space-24, 24px);
  --s32: var(--k-space-32, 32px);
  --s48: var(--k-space-48, 48px);
  --s64: var(--k-space-64, 64px);
  --radius: var(--k-radius-control, 8px);
  --panel-radius: var(--k-radius-card, 12px);
  --target: var(--k-target, 44px);
}

:root {
  background: var(--canvas);
  color: var(--ink);
  font-family: var(--k-font, system-ui, sans-serif);
  font-synthesis: none;
  line-height: 1.5;
  color-scheme: light;
}
* { box-sizing: border-box; }
body { margin: 0; overflow-wrap: anywhere; }
button, input, textarea, select { font: inherit; }
button, input, textarea, select, a[href] { scroll-margin-block: 16px; }
a, .kuraka a { color: var(--link); text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible, .kuraka :where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}
[hidden] { display: none !important; }

button, .button, .kuraka a.button {
  min-height: var(--target);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--s8);
  padding: var(--s8) var(--s16);
  border: 1px solid transparent;
  border-radius: var(--radius);
  background: var(--accent);
  color: #fff;
  font-size: .875rem;
  font-weight: 500;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
button:hover, .button:hover, .kuraka a.button:hover { background: var(--accent-hover); }
button:active, .button:active, .kuraka a.button:active { background: var(--accent-active); }
button.secondary, .button.secondary, .kuraka a.button.secondary {
  background: var(--surface);
  color: var(--ink);
  border-color: var(--control);
}
button.secondary:hover, .button.secondary:hover, .kuraka a.button.secondary:hover { background: var(--canvas); }
button.quiet { background: transparent; color: var(--link); }
button.quiet:hover { background: var(--info-bg); text-decoration: underline; }
button:disabled, button:disabled:hover, fieldset:disabled :is(input, select, textarea) {
  background: var(--disabled-bg);
  color: var(--disabled);
  border-color: var(--control);
  cursor: not-allowed;
}
.skip {
  position: fixed;
  top: var(--s12);
  left: var(--s16);
  z-index: 30;
  background: var(--surface);
  padding: var(--s12) var(--s16);
  border-radius: var(--radius);
  transform: translateY(calc(-100% - 24px));
}
.skip:focus { transform: none; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.dark-surface {
  --canvas: var(--k-bg, #172033);
  --surface: var(--k-surface, #253249);
  --ink: var(--k-text, #f8fafc);
  --muted: var(--k-muted, #cbd5e1);
  --control: var(--k-control-border, #94a3b8);
  --link: var(--k-link, #d6e5fa);
  --focus: var(--k-focus, #d6e5fa);
  background: var(--canvas);
  color: var(--ink);
}
.topbar-inner, .public-header-inner {
  max-width: 1440px;
  margin-inline: auto;
  padding-inline: var(--s32);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s24);
}
.topbar-inner { min-height: 76px; justify-content: flex-start; }
.brand, .kuraka a.brand { color: var(--ink); }
.brand {
  min-height: var(--target);
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: var(--s8);
  text-decoration: none;
  font-weight: 600;
  letter-spacing: .012em;
}
.brand img { display: block; width: auto; height: 64px; }
.brand.has-mark { padding: 16px; }
.brand.compact { padding: 8px; }
.brand.compact img { height: 32px; }
.brand .compact-name { display: none; }
.brand.compact .compact-name { display: inline; }
.brand-text { display: grid; font-size: 1.25rem; }
.brand-text small { font-size: .75rem; letter-spacing: .08em; color: var(--muted); font-weight: 500; }
.nav { display: flex; gap: var(--s8); }
.nav a, .kuraka .nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--target);
  padding: var(--s8) var(--s16);
  border-radius: var(--radius);
  color: var(--ink);
  font-size: .875rem;
  font-weight: 500;
  text-decoration: none;
}
.nav a:hover, .kuraka .nav a:hover { background: var(--surface); text-decoration: underline; }
.nav a[aria-current], .kuraka .nav a[aria-current] { background: var(--surface); box-shadow: inset 0 -3px 0 var(--link); font-weight: 700; }
.account { margin-left: auto; display: flex; align-items: center; gap: var(--s12); font-size: .875rem; }
.account button { background: transparent; border-color: var(--control); color: var(--ink); }
.account button:hover { background: var(--surface); }
.avatar {
  width: 32px; height: 32px; flex: none; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--surface); color: var(--link); font-weight: 700;
}

main { max-width: 1440px; margin-inline: auto; padding: var(--s32); }
h1, h2, h3 { margin: 0 0 var(--s12); font-weight: 600; }
h1, h2 { line-height: 1.15; letter-spacing: -.02em; }
h1 { font-size: clamp(2.25rem, 5vw, 3.5rem); }
h2 { font-size: clamp(1.875rem, 3vw, 2.5rem); }
h3 { font-size: clamp(1.5rem, 2.5vw, 2rem); line-height: 1.2; }
p { margin: var(--s8) 0 var(--s16); }
.eyebrow {
  margin: 0 0 var(--s8);
  color: var(--muted);
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.page-head { display: flex; justify-content: space-between; align-items: center; gap: var(--s24); margin-bottom: var(--s32); }
.page-head p:last-child { margin-bottom: 0; }
.page-head > .button { flex: none; }
.muted, .help { color: var(--muted); }
.small, .help { font-size: .875rem; }
.help { margin: var(--s8) 0 0; }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s12); }
.card {
  min-width: 0;
  margin-bottom: var(--s24);
  padding: var(--s24);
  border: 1px solid var(--line);
  border-radius: var(--panel-radius);
  background: var(--surface);
}
.card > :last-child { margin-bottom: 0; }
.empty { padding: var(--s24); color: var(--muted); }
.empty strong { display: block; color: var(--ink); font-size: 1.125rem; }
.empty p { margin-bottom: 0; }
.badge {
  display: inline-flex;
  max-width: 100%;
  padding: var(--s4) var(--s8);
  border-radius: 6px;
  background: var(--info-bg);
  color: var(--info);
  font-size: .75rem;
  font-weight: 600;
  line-height: 1.4;
}
.badge.warning { background: var(--warning-bg); color: var(--warning); }
.badge.success { background: var(--success-bg); color: var(--success); }
.badge.neutral { background: var(--disabled-bg); color: var(--muted); }
.pill-row { display: flex; flex-wrap: wrap; gap: var(--s8); margin: var(--s12) 0 0; }
.counts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s16); margin-bottom: var(--s32); }
.count, .kuraka a.count {
  display: flex; align-items: center; justify-content: space-between; gap: var(--s12);
  padding: var(--s16) var(--s24);
  border: 1px solid var(--line); border-radius: var(--panel-radius);
  background: var(--surface); color: var(--ink); text-decoration: none;
}
.count:hover, .kuraka a.count:hover { border-color: var(--control); text-decoration: underline; }
.count strong { font-size: clamp(1.5rem, 3vw, 2rem); line-height: 1.2; }
.count.overdue, .kuraka a.count.overdue { background: var(--warning-bg); color: var(--warning); }
.count strong, .date, time, .amount { font-variant-numeric: tabular-nums; }
.section-title { display: flex; align-items: center; flex-wrap: wrap; gap: var(--s12); margin-bottom: var(--s16); }
.section-title h2 { margin: 0; }
.list { padding: 0; list-style: none; margin: 0; }
.row-card { padding: 0; }
.inbox-row {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1.3fr) minmax(0, .8fr) minmax(0, .7fr);
  gap: var(--s16);
  padding: var(--s16) var(--s24);
  border-bottom: 1px solid var(--line);
  align-items: center;
  font-size: .875rem;
}
.inbox-row:last-child { border-bottom: 0; }
.inbox-row p { margin: 0; }
.inbox-row a, .opportunity > a, .back, .public-header a.small, .card > a:not(.button), .version > a, .read-block > a {
  display: inline-flex; align-items: center; min-height: var(--target);
}
.inbox-row a, .opportunity > a { font-size: 1rem; font-weight: 600; }

.searchbar { display: flex; gap: var(--s12); align-items: end; flex-wrap: wrap; margin-bottom: var(--s16); }
.searchbar .field { flex: 1; margin: 0; max-width: 540px; }
.searchbar [role=alert] { flex-basis: 100%; color: var(--error); }
.board-help { margin-bottom: var(--s16); }
.board {
  display: grid; grid-auto-columns: minmax(240px, 1fr); grid-auto-flow: column; align-items: start;
  gap: var(--s16); padding: var(--s8) var(--s8) var(--s16);
  overflow: auto;
}
.column {
  min-width: 0; min-height: 256px; padding: var(--s12);
  border: 1px solid var(--line); border-radius: var(--panel-radius); background: #f1f5f9;
}
.column h2 { display: flex; justify-content: space-between; align-items: start; gap: var(--s8); }
.column h2, .kuraka .column h2 { font-size: 1rem; line-height: 1.3; }
.column h2 span { min-width: 24px; text-align: center; border-radius: 6px; background: var(--disabled-bg); }
.opportunity { margin: var(--s12) 0 0; padding: var(--s16); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.opportunity p { font-size: .875rem; margin: var(--s4) 0 var(--s8); }
.opportunity button { width: 100%; margin-top: var(--s12); }
.mobile-stage { display: none; }

fieldset { border: 0; padding: 0; margin: 0; min-inline-size: 0; }
.field { margin-bottom: var(--s16); min-width: 0; }
.field label, .field legend { display: block; margin-bottom: var(--s8); font-size: .875rem; font-weight: 500; }
.field input, .field textarea, .field select {
  display: block; width: 100%; max-width: 100%; min-width: 0; min-height: var(--target);
  padding: var(--s8) var(--s12);
  border: 1px solid var(--control); border-radius: var(--radius);
  color: var(--ink); background: var(--surface);
}
.field textarea { min-height: 88px; resize: vertical; }
.field [aria-invalid=true] { border: 2px solid var(--error); }
.field-error { color: var(--error); font-size: .875rem; margin: var(--s8) 0 0; }
.help:empty, .field-error:empty, .form-status:empty { display: none; }
#contact-help { margin: 0 0 var(--s12); }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--s16); }
.required::after { content: " *"; }
.form-status, .inline-notice {
  margin-bottom: var(--s16); padding: var(--s12) var(--s16);
  border-radius: var(--radius); border: 1px solid currentColor;
  color: var(--info); background: var(--info-bg);
}
.form-status.success, .inline-notice.success { color: var(--success); background: var(--success-bg); }
.form-status.error { color: var(--error); background: var(--error-bg); }
.form-status ul { padding-left: var(--s24); margin: var(--s8) 0 0; }
.form-status:focus, #received:focus { outline: 3px solid var(--focus); outline-offset: 3px; }

.auth-layout { display: grid; grid-template-columns: 1fr 1fr; min-height: 100svh; max-width: none; padding: 0; }
.auth-story {
  display: flex; flex-direction: column; justify-content: space-between; align-items: start; gap: var(--s48);
  padding: var(--s48) clamp(32px, 5vw, 80px);
  background-image: radial-gradient(ellipse at 0 100%, color-mix(in srgb, var(--accent) 24%, var(--canvas)), transparent 58%);
}
.auth-story .brand.has-mark { margin-inline-start: -16px; }
.auth-story .story-body { max-width: 520px; }
.auth-story h2, .kuraka .auth-story h2 { font-size: clamp(1.875rem, 4vw, 2.5rem); }
.story-body > p:not(.eyebrow) { color: var(--muted); max-width: 36ch; }
.story-index { display: flex; gap: var(--s12); align-items: center; font-size: .875rem; margin: var(--s12) 0; }
.story-index span { color: var(--link); border: 1px solid var(--control); border-radius: 6px; padding: 3px var(--s8); }
.story-footer { margin: 0; color: var(--muted); }
.auth-form { width: 100%; max-width: 576px; margin: auto; padding: var(--s48); }
.auth-form .card { margin: 0; padding: var(--s32); }
.auth-form .actions button { width: 100%; }

.public-header { background: var(--surface); border-bottom: 1px solid var(--line); }
.public-header-inner { max-width: 1200px; min-height: 112px; }
.public-header .brand.has-mark { margin-inline-start: -16px; }
.public-layout { max-width: 1200px; display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: var(--s64); padding-top: var(--s48); align-items: start; }
.public-copy { padding-top: var(--s24); }
.public-copy .public-detail { border-top: 1px solid var(--line); padding-top: var(--s16); margin-top: var(--s32); }
.public-detail .number { color: var(--accent); font-size: .875rem; font-weight: 700; }
.public-copy p { max-width: 37ch; }
.public-layout .card { padding: var(--s32); }
.success-mark {
  width: 48px; height: 48px; border-radius: var(--radius);
  display: grid; place-items: center; color: var(--success); background: var(--success-bg);
  font-size: 1.5rem; margin-bottom: var(--s16);
}

.narrow { max-width: 820px; margin-inline: auto; }
.back { margin-bottom: var(--s16); font-size: .875rem; }
.detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, 320px); gap: var(--s24); align-items: start; }
.summary-card .page-head { margin-bottom: var(--s16); }
.summary-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--s16); padding-top: var(--s16); border-top: 1px solid var(--line);
}
.summary-grid dt { font-size: .875rem; color: var(--muted); margin-bottom: var(--s4); }
.summary-grid dd { margin: 0; font-weight: 600; }
.tabs { display: flex; flex-wrap: wrap; gap: var(--s8); border-bottom: 1px solid var(--line); margin-bottom: var(--s24); padding-bottom: var(--s8); }
.tabs button { background: transparent; color: var(--muted); }
.tabs button:hover { background: var(--info-bg); color: var(--info); }
.tabs button[aria-selected=true] { background: var(--info-bg); color: var(--info); box-shadow: inset 0 -3px 0 var(--accent); font-weight: 700; }
.timeline { list-style: none; margin: 0; padding: 0; }
.timeline li { border-left: 2px solid var(--line); padding: 0 0 var(--s16) var(--s16); position: relative; }
.timeline li::before { content: ""; position: absolute; left: -5px; top: 6px; width: 8px; height: 8px; background: var(--accent); border-radius: 50%; }
.timeline h3, .kuraka .timeline h3 { font-size: .875rem; margin-bottom: var(--s4); }
.timeline p { font-size: .875rem; margin: var(--s4) 0 0; white-space: pre-wrap; }
.timeline small { display: block; color: var(--muted); font-size: .75rem; }
.history-list { max-height: 55rem; overflow: auto; padding: var(--s4) var(--s8); }
.preserve { white-space: pre-wrap; }
.capture-receipt dt { font-weight: 600; }
.capture-receipt dd { margin: 0 0 var(--s4); overflow-wrap: anywhere; }
.version { padding: var(--s16) 0; border-top: 1px solid var(--line); }
.version:first-child { border-top: 0; padding-top: 0; }
.version:last-child { padding-bottom: 0; }
.version-head { display: flex; align-items: start; flex-wrap: wrap; gap: var(--s8) var(--s12); }
.version-head h3 { margin: 0; }
.amount { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 600; }
.version p { margin: var(--s8) 0 0; }
.check-group { display: flex; gap: var(--s8) var(--s16); flex-wrap: wrap; }
.check-group label { display: flex; align-items: center; gap: var(--s8); margin: 0; min-height: var(--target); }
.check-group input { width: 20px; height: 20px; min-height: 20px; accent-color: var(--accent); }
.read-block { margin: var(--s16) 0; padding: var(--s16); border-radius: var(--radius); background: var(--canvas); }
.read-block p { margin: var(--s4) 0; }
#meeting-options { margin-bottom: var(--s16); }
#meeting-options > .help:first-child { margin-top: 0; }

dialog {
  width: min(600px, calc(100% - 32px)); max-height: calc(100dvh - 32px);
  padding: var(--s24); overflow: auto;
  border: 1px solid var(--line); border-radius: var(--panel-radius);
  color: var(--ink); background: var(--surface);
  box-shadow: 0 24px 64px #0b122033;
}
dialog::backdrop { background: #0b1220ad; }
.dialog-head { display: flex; justify-content: space-between; align-items: start; gap: var(--s12); margin-bottom: var(--s16); }
.dialog-head h2 { margin: 0; }
.close-dialog { scroll-padding-block: 12px 136px; }
.close-dialog #close .actions {
  position: sticky;
  bottom: -24px;
  margin: 0 -24px -24px;
  padding: var(--s16) var(--s24);
  background: var(--surface);
  border-top: 1px solid var(--line);
}
#accepted-scope { margin-top: 0; }
#accepted-scope h3 { font-size: 1.25rem; }
@media (max-width: 700px) {
  .close-dialog #close .actions {
    bottom: -16px;
    margin-inline: -16px;
    margin-bottom: -16px;
    padding: var(--s8) var(--s16);
  }
}
.dialog-head button { padding-inline: var(--s12); min-width: var(--target); }
.footer-note { margin: var(--s32) 0 0; font-size: .875rem; color: var(--muted); }
.loading { padding: var(--s64) var(--s24); text-align: center; }

/* Workspace: the same brand tokens support the expanded commercial workflow. */
.workspace { display: grid; grid-template-columns: 224px minmax(0,1fr); max-width: 1760px; margin: auto; }
.workspace main { width: 100%; min-width: 0; }
.workspace h1 { font-size: clamp(2.25rem,3.4vw,3rem); }
.workspace h2 { font-size: clamp(1.5rem,2.2vw,1.875rem); }
.workspace h3 { font-size: 1.125rem; line-height: 1.4; }
.workspace-nav { background: var(--surface); border-right: 1px solid var(--line); padding: var(--s24) var(--s12); }
.nav-group { margin-bottom: var(--s24); }
.nav-group p { padding-inline: var(--s12); margin-bottom: var(--s8); color: var(--muted); font-size: .75rem; font-weight: 600; }
.nav-group a, .kuraka .nav-group a { min-height: 44px; display: flex; align-items: center; padding: var(--s8) var(--s12); border-radius: 8px; color: var(--ink); text-decoration: none; font-size: .875rem; }
.nav-group a:hover { background: var(--canvas); text-decoration: underline; }
.nav-group a[aria-current], .kuraka .nav-group a[aria-current] { background: var(--info-bg); color: var(--info); box-shadow: inset 3px 0 var(--accent); font-weight: 600; }
.current-location { font-size: .875rem; color: var(--muted); }
#menu-toggle { display: none; }
.entity-layout { display: grid; grid-template-columns: minmax(0,1fr) 240px; gap: var(--s24); align-items: start; }
.audit h2 { font-size: 1.25rem; }
dt { color: var(--muted); font-size: .875rem; }
dd { margin: 0 0 var(--s16); }
.top-scrollbar { max-width: 100%; overflow-x: auto; overflow-y: hidden; height: 14px; margin-bottom: 4px; }
.top-scrollbar-dummy { height: 1px; }
.top-scrollbar::-webkit-scrollbar { height: 8px; }
.top-scrollbar::-webkit-scrollbar-track { background: var(--canvas); border-radius: 4px; }
.top-scrollbar::-webkit-scrollbar-thumb { background: var(--line); border-radius: 4px; }
.top-scrollbar::-webkit-scrollbar-thumb:hover { background: var(--muted); }
.pagination-bar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: var(--s12); padding: var(--s8) 0; margin: var(--s8) 0; font-size: .875rem; }
.pagination-info { display: flex; align-items: center; flex-wrap: wrap; gap: var(--s8); color: var(--muted); }
.pagination-size { display: inline-flex; align-items: center; }
.pagination-select { min-height: 32px; padding: 2px var(--s8); border-radius: var(--radius); border: 1px solid var(--line); font-size: .8125rem; background: var(--surface); color: var(--ink); cursor: pointer; }
.pagination-select:focus { border-color: var(--focus); outline: none; }
.pagination-controls { display: flex; align-items: center; gap: var(--s8); }
.pagination-page { padding: 0 var(--s8); font-variant-numeric: tabular-nums; }
.pagination-btn { min-height: 36px; padding: var(--s4) var(--s12); display: inline-flex; align-items: center; text-decoration: none; }
.data-scroll { max-width: 100%; overflow-x: auto; padding: 4px; }
.data-table { width: 100%; border-collapse: collapse; font-size: .875rem; font-variant-numeric: tabular-nums; overflow-wrap: normal; }
.data-table th { white-space: nowrap; }
.table-hint { display: none; }
.data-table caption { text-align: left; font-weight: 500; padding: var(--s12); color: var(--muted); }
.data-table th, .data-table td { text-align: left; border-bottom: 1px solid var(--line); padding: var(--s12); vertical-align: top; min-width: 100px; }
.data-table th { background: var(--canvas); font-weight: 600; }
.data-table .last-column { text-align: right; }
.data-table .money-cell { white-space: nowrap; text-align: right; }
.data-table a { min-height: 44px; display: inline-flex; align-items: center; }
.line-row { border: 1px solid var(--line); border-radius: 8px; padding: var(--s16); margin-bottom: var(--s16); }
.line-row .section-title { justify-content: space-between; }
.line-row .section-title h3 { margin: 0; }
.line-subtotal { align-self: center; font-variant-numeric: tabular-nums; }
.money-summary { padding: var(--s16); margin: var(--s16) 0; background: var(--canvas); border-radius: 8px; }
.money-summary dl { margin: 0; }
.money-summary dl > div { display: flex; justify-content: space-between; gap: var(--s16); }
.money-summary dd { font-variant-numeric: tabular-nums; margin: 0; }
.money-summary .total { border-top: 1px solid var(--line); margin-top: var(--s8); padding-top: var(--s8); font-size: 1.25rem; font-weight: 600; }
.finance-metrics, .dashboard-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--s16); margin: var(--s16) 0; }
.finance-metrics > div { border-right: 1px solid var(--line); padding-right: var(--s12); }
.finance-metrics span { display: block; color: var(--muted); font-size: .875rem; }
.finance-metrics strong { font-size: clamp(1rem,1.6vw,1.5rem); font-variant-numeric: tabular-nums; }
.balance-strip { display: flex; justify-content: space-between; gap: var(--s16); padding: var(--s16); background: var(--info-bg); color: var(--info); margin-top: var(--s16); border-radius: 8px; }
.balance-strip strong { font-variant-numeric: tabular-nums; }
.application-row { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: var(--s16); border-bottom: 1px solid var(--line); padding: var(--s16) 0; }
.application-row a { display: inline-flex; min-height: 44px; align-items: center; }
.application-row .field { margin: 0; }
.filter-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--s16); }
button.metric { display: block; text-align: left; color: var(--ink); background: var(--surface); border-color: var(--line); padding: var(--s24); }
button.metric:hover { border-color: var(--control); background: var(--canvas); }
.metric span, .metric strong, .metric small { display: block; }
.metric span { font-size: 1rem; }
.metric strong { font-variant-numeric: tabular-nums; font-size: clamp(1.5rem,2.4vw,2rem); margin-block: var(--s8); }
.metric small { color: var(--muted); font-size: .75rem; }
.currency-report { margin-top: var(--s32); }
.funnel-links { display: flex; flex-wrap: wrap; gap: var(--s8); }
.milestone-row { padding: var(--s16); margin-bottom: var(--s16); border: 1px solid var(--line); border-radius: 8px; }
.close-dialog #close .actions { position: static; margin: var(--s16) 0 0; padding: var(--s16) 0 0; }
@media(max-width:1100px) {
  .entity-layout { grid-template-columns: minmax(0,1fr); }
  .filter-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .workspace { grid-template-columns: 192px minmax(0,1fr); }
}
@media(max-width:760px) {
  .workspace { display: block; }
  .workspace-nav { display: none; border: 0; border-bottom: 1px solid var(--line); }
  .workspace-nav.open { display: block; }
  #menu-toggle { display: inline-flex; background: transparent; color: var(--ink); border-color: var(--control); }
  .topbar-inner { flex-wrap: wrap; gap: var(--s8); padding: var(--s8) var(--s16); }
  .current-location { flex-basis: 100%; order: 4; color: var(--muted); }
  .account .name { max-width: 9em; }
  .account .avatar { display: none; }
  .account { margin-left: auto; }
  .entity-layout, .filter-grid, .application-row { display: block; }
  .finance-metrics, .dashboard-metrics { grid-template-columns: 1fr; gap: var(--s12); }
  .finance-metrics > div { display: flex; align-items: center; justify-content: space-between; border-right: 0; border-bottom: 1px solid var(--line); padding: var(--s12) 0; }
  .metric strong { font-size: 1.75rem; }
  .line-row { padding: var(--s12); }
  .line-row .form-grid { display: block; }
  .data-table { min-width: 460px; }
  .table-hint { display: block; padding: var(--s12) var(--s16) 0; font-size: .75rem; color: var(--muted); margin: 0; }
  .balance-strip { flex-wrap: wrap; }
  .workspace main { padding: var(--s24) var(--s16); }
}
@media(min-width:380px) and (max-width:760px) {
  .filter-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 var(--s16); }
}

@media (max-width: 1000px) {
  .topbar-inner, .public-header-inner { padding-inline: var(--s24); gap: var(--s16); }
  .avatar { display: none; }
  .detail-layout { grid-template-columns: minmax(0, 1fr) 260px; }
  .public-layout { gap: var(--s32); }
}

@media (max-width: 700px) {
  main { padding: var(--s24) var(--s16); }
  .topbar-inner { padding: var(--s8) var(--s16) var(--s12); gap: var(--s8); flex-wrap: wrap; }
  .nav { order: 3; flex-basis: 100%; }
  .nav a { flex: 1; }
  .account { font-size: .75rem; gap: var(--s8); }
  .account .name { max-width: 6em; }
  .account button { padding-inline: var(--s8); }
  .topbar .brand-text small { display: none; }
  .brand.has-mark { padding: 8px; }
  .brand img { height: 32px; }
  .brand .compact-name { display: inline; }
  .page-head { align-items: start; flex-wrap: wrap; gap: var(--s16); margin-bottom: var(--s24); }
  .page-head > .button { width: 100%; }
  .counts { gap: var(--s8); margin-bottom: var(--s24); }
  .count, .kuraka a.count { display: block; padding: var(--s12) var(--s8); font-size: .75rem; }
  .count strong { display: block; margin-top: var(--s4); }
  .card { padding: var(--s16); }
  .row-card { padding: 0; }
  .inbox-row { grid-template-columns: 1fr 1fr; gap: var(--s8) var(--s12); padding: var(--s12) var(--s16); }
  .inbox-row > div:first-child, .inbox-row > div:nth-child(2) { grid-column: 1 / -1; }
  .section-title { gap: var(--s8); }
  .searchbar .field { flex-basis: 100%; max-width: none; }
  .searchbar button { flex: 1; }
  .board-help { display: none; }
  .board { display: block; overflow: visible; padding: var(--s4); }
  .column { display: none; min-height: 180px; }
  .column.selected, .mobile-stage { display: block; }
  .form-grid, .detail-layout { display: block; }
  .summary-grid { grid-template-columns: 1fr; }
  .tabs button { flex: 1; padding-inline: var(--s8); }
  .history-list { max-height: none; }
  .auth-layout, .public-layout { display: block; }
  .auth-story { padding: var(--s12) var(--s16); background-image: none; }
  .auth-story .brand.has-mark, .public-header .brand.has-mark { margin-inline-start: -8px; }
  .auth-story .story-body, .auth-story .story-footer, .public-detail { display: none; }
  .auth-form { padding: var(--s24) var(--s16); }
  .auth-form .card, .public-layout .card { padding: var(--s16); }
  .public-header-inner { min-height: 64px; padding-inline: var(--s16); }
  .public-layout { padding-top: var(--s24); }
  .public-copy { padding-top: 0; }
  .check-group { display: block; }
  .actions { gap: var(--s8); }
  .actions > :is(button, .button) { flex-grow: 1; }
  dialog { padding: var(--s16); }
}

/* Administration and company scope */
.topbar-inner .current-location, .account-id {
  min-width: 0;
  display: grid;
  line-height: 1.3;
}
.topbar-inner .current-location { padding-inline-start: var(--s16); border-inline-start: 1px solid var(--line); }
.current-location span, .account-id span { font-size: .75rem; color: var(--muted); }
.current-location strong, .account-id strong { font-size: .9375rem; color: var(--ink); font-weight: 600; }
.scope-nav { padding-top: var(--s16); border-top: 1px solid var(--line); }
.scope-nav button { width: 100%; margin-top: var(--s8); }
.route-error { margin: var(--s48) auto; }
.auth-story .brand.has-mark:not(.compact), .public-header .brand.has-mark:not(.compact) { padding: 16px; }
.auth-story .brand.has-mark:not(.compact) img, .public-header .brand.has-mark:not(.compact) img { height: 64px; }
.activation-facts, .record-facts { display: flex; flex-wrap: wrap; gap: var(--s12) var(--s24); }
.activation-facts { background: var(--canvas); border-radius: var(--radius); padding: var(--s16); margin: 0 0 var(--s24); }
.activation-facts > div, .record-facts > div { min-width: 0; }
.activation-facts dt, .record-facts dt, .admin-row-data dt, .activity-changes dt { font-size: .8125rem; color: var(--muted); }
.activation-facts dd, .record-facts dd, .admin-row-data dd, .activity-changes dd { margin: var(--s4) 0 0; font-weight: 500; }
.password-toggle { margin-bottom: var(--s12); }
.admin-overview { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--s16); }
.admin-overview .card { margin: 0; }
.admin-overview h2 a { display: inline-flex; align-items: center; min-height: var(--target); }
.admin-filter-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%, 210px),1fr)); gap: 0 var(--s16); }
.admin-filters .actions { margin-top: 0; }
.admin-results .result-count { padding: var(--s12) var(--s24); margin: 0; color: var(--muted); font-size: .875rem; }
.admin-row, .activity-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1.65fr);
  gap: var(--s16);
  align-items: start;
  padding: var(--s16) var(--s24);
  border-top: 1px solid var(--line);
}
.admin-row h3, .activity-row h3 { margin: 0; }
.admin-row h3 a { display: inline-flex; align-items: center; min-height: var(--target); }
.admin-row p, .activity-row p { margin: var(--s4) 0 0; }
.admin-row-data, .activity-changes { display: flex; flex-wrap: wrap; gap: var(--s12) var(--s24); margin: 0; }
.admin-row-data > div { min-width: 0; flex: 1 1 100px; }
.activity-row > :nth-child(3) { grid-column: 1 / -1; }
.activity-changes { padding: var(--s12) var(--s16); background: var(--canvas); border-radius: var(--radius); }
.admin-history .activity-row { padding-inline: 0; }
.admin-editor .record-facts { margin-top: 0; }
.state-actions { border-inline-start: 3px solid var(--control); }
.invitation { border-inline-start: 3px solid var(--accent); }
.invitation input { font-size: .875rem; }
@media(max-width:760px) {
  .topbar-inner .current-location { padding: var(--s8) 0 0; border-inline-start: 0; border-top: 1px solid var(--line); }
  .topbar-inner .account-id { max-width: 12ch; }
  .admin-overview, .admin-row, .activity-row { grid-template-columns: minmax(0,1fr); }
  .admin-row, .activity-row { padding: var(--s12) var(--s16); gap: var(--s8); }
  .admin-results .result-count { padding-inline: var(--s16); }
  .admin-row-data > div { flex-basis: 115px; }
}
@media(max-width:700px) {
  .auth-story .brand.has-mark:not(.compact), .public-header .brand.has-mark:not(.compact) { margin-inline-start: -16px; }
  .public-header-inner { flex-wrap: wrap; gap: 0 var(--s8); padding-bottom: var(--s8); }
}
h1[tabindex="-1"] { width: fit-content; max-width: 100%; }
#capture-recovery { border-top: 1px solid var(--line); padding-top: var(--s12); }
.admin-editor.narrow, .state-actions.narrow, .invitation.narrow { margin-inline: 0; }
.consultation-admin { margin-top: var(--s16); padding-top: var(--s16); border-top: 1px solid var(--line); }
@media(max-width:760px) {
  #dashboard-filter .filter-grid > .field:has(select) { grid-column: 1 / -1; }
}
.module-picker {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 12px;
  margin: 24px 0;
  padding: 0;
  border: 0;
}
.module-picker legend { padding: 0 0 16px; font-weight: 600; }
.module-option {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px;
  margin: 0;
  background: #f8fafc;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
}
.module-option input[type=checkbox] { width: 20px; height: 20px; flex-shrink: 0; margin: 2px 0; }
.module-option small { display: block; color: #475569; font-size: 12px; margin-top: 4px; }
.access-editor { max-width: 1000px; }
.quotation-editor { max-width: 1050px; }
.quotation-line { background: #f8fafc; margin: 16px 0; padding: 24px; }
.quotation-line .field:last-child { margin-bottom: 0; }
.quote-money { max-width: 360px; margin: 24px 0 24px auto; font-variant-numeric: tabular-nums; }
.quote-money > div { display: flex; justify-content: space-between; gap: 24px; padding: 8px 0; border-bottom: 1px solid #cbd5e1; }
.quote-money dd { margin: 0; white-space: nowrap; }
.quote-money > div:last-child { color: #0b1220; font-size: 20px; border-bottom: 0; }
.pdf-dialog { width: min(1150px, 95vw); max-width: 95vw; }
.pdf-dialog iframe { width: 100%; height: 72vh; border: 1px solid #cbd5e1; border-radius: 8px; background: #f8fafc; }
.template-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 390px); gap: 24px; align-items: start; }
.template-editor { min-width: 0; }
.template-aside { min-width: 0; }
.template-aside > .card { margin-bottom: 24px; }
.template-paper { position: relative; aspect-ratio: 595 / 842; background: white; border: 1px solid #cbd5e1; overflow: hidden; color: #0b1220; }
#template-background { position: absolute; inset: 0; pointer-events: none; }
#template-background iframe, #template-background img { width: 100%; height: 100%; border: 0; object-fit: contain; }
.template-paper-body { position: relative; font-size: 11px; }
.template-paper-body h3 { color: var(--template-accent, #087f8c); font-size: 16px; }
.template-paper-body p { font-size: 10px; }
.template-paper-body #template-company { font-size: 12px; font-weight: 600; }
.template-example-row { display: flex; justify-content: space-between; gap: 5px; padding: 7px 0; border-bottom: 1px solid #cbd5e1; font-size: 9px; }
.template-example-total { display: block; margin: 16px 0; text-align: right; }
.template-paper-logo { max-width: 75px; max-height: 45px; object-fit: contain; }
.template-paper-footer { position: absolute; left: 15px; bottom: 20px; right: 15px; font-size: 9px; }
@media (max-width: 1000px) {
  .template-layout { grid-template-columns: minmax(0, 1fr); }
  .template-aside { width: min(100%, 460px); }
}
@media (max-width: 560px) {
  .module-picker { grid-template-columns: 1fr; }
  .quotation-line { padding: 16px; }
  .quotation-line .section-title { align-items: start; }
  .pdf-dialog { padding: 16px; }
  .quote-money { max-width: 100%; }
}
