/* Shared visual foundation for all valuation-system pages. */
body.workspace-page {
  --page: #f4f3ef;
  --surface: #fff;
  --surface-raised: #f8f8f5;
  --text: #203244;
  --muted: #5b6874;
  --line: #e0e3e1;
  --line-strong: #a0acb2;
  --accent: #a88742;
  --accent-text: #244761;
  --navy: #173b57;
  --navy-hover: #224d6c;
  --focus: #176a9c;
  --control-hover: #f0f4f5;
  --row-hover: #f5f7f6;
  --warning-bg: #faf6e9;
  --danger: #943f41;
  --danger-soft: #fcf1ef;
  --success: #28644f;
  --success-soft: #edf5ef;
  --shadow: 0 3px 14px rgb(32 50 68 / 4%);
  --workspace-primary-text: #fff;
  --workspace-radius: 12px;
  --workspace-inset: clamp(16px, 2.4vw, 32px);
  --workspace-scroll-offset: 88px;
  min-height: 100dvh;
  background: var(--page);
  color: var(--text);
  font-family: "Segoe UI Variable", "Segoe UI", "PingFang TC", "Microsoft JhengHei", "Noto Sans TC", sans-serif;
  font-size: 16px;
  line-height: 1.6;
}
html[data-theme="dark"] body.workspace-page {
  --page: #121c25;
  --surface: #1b2833;
  --surface-raised: #21313e;
  --text: #ecf0f2;
  --muted: #b6c1c8;
  --line: #35434d;
  --line-strong: #7e8e99;
  --accent: #c6a666;
  --accent-text: #c5dcec;
  --navy: #345f7a;
  --navy-hover: #41718d;
  --focus: #87c7eb;
  --control-hover: #293b48;
  --row-hover: #23333f;
  --warning-bg: #343022;
  --danger: #f3aaa5;
  --danger-soft: #38282b;
  --success: #94cbb3;
  --success-soft: #21392f;
  --shadow: 0 3px 14px rgb(0 0 0 / 10%);
}
body.workspace-page [hidden] { display: none !important; }
body.workspace-page :where(main, section, article, aside, details, fieldset, form, .field) { min-width: 0; }
body.workspace-page :where(p, small, label, legend, dd, h1, h2, h3) { overflow-wrap: anywhere; text-wrap: pretty; }
body.workspace-page :where(h1, h2, h3) { color: var(--text); }
body.workspace-page :where(input, select, textarea, button) { max-width: 100%; }
body.workspace-page :where(.numeric-cell, .numeric-copy, time, dd, input[type="number"]) { font-variant-numeric: tabular-nums; }
body.workspace-page :where(section[id], details[id], [tabindex="-1"]) { scroll-margin-top: var(--workspace-scroll-offset); }

/* Keep identity and primary navigation together; mobile headers remain in normal flow. */
body.workspace-page .site-header { background: #172f44; border-bottom: 1px solid #365065; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
html[data-theme="dark"] body.workspace-page .site-header { background: #142330; border-color: var(--line); }
body.workspace-page .site-header .header-inner { max-width: 1440px; min-height: 64px; padding: 0 28px; display: flex; align-items: stretch; gap: 24px; flex-wrap: nowrap; }
body.workspace-page .brand { min-width: 0; min-height: 64px; height: auto; display: flex; gap: 12px; flex-shrink: 0; }
body.workspace-page .brand-logo-panel { width: 144px; min-height: 44px; flex: 0 0 auto; }
body.workspace-page .brand img { width: 100%; max-width: none; max-height: none; }
body.workspace-page .brand > span:last-child { font-size: 15px; padding-left: 12px; font-weight: 600; }
body.workspace-page .primary-nav { width: auto; order: initial; min-height: 44px; gap: 4px; flex-shrink: 0; }
body.workspace-page .primary-nav a { padding-inline: 12px; font-size: 14px; border-radius: 0; }
body.workspace-page .primary-nav .active { border-bottom-width: 2px; color: #fff; }
body.workspace-page .header-actions { gap: 10px; margin-left: auto; min-width: 0; }
body.workspace-page .header-actions .user-name { overflow: hidden; text-overflow: ellipsis; max-width: 14rem; }
body.workspace-page .mobile-account-context { display: none; }
body.workspace-page .site-header :where(.quiet-button, .account-link) { border-radius: 6px; }
body.workspace-page .site-header .quiet-button { border-color: #526b7e; font-size: 13px; }
body.workspace-page .site-header .account-link { color: #d5dfe7; opacity: 1; }
body.workspace-page .site-header :focus-visible { outline-color: #e6c788; }
body.workspace-page .primary-nav a { white-space: nowrap; }
body.workspace-page :where(.text-link, .footer-admin-link) { display: inline-flex; align-items: center; min-height: 44px; text-underline-offset: 4px; }
body.workspace-page .site-header .account-link { display: inline-flex; align-items: center; min-height: 44px; }

body.workspace-page .page-shell { width: min(1280px, calc(100% - 48px)); margin: 28px auto 48px; }
body.workspace-page .page-heading { align-items: center; gap: 24px; margin-bottom: 24px; }
body.workspace-page .page-heading h1 { margin: 0 0 6px; font-size: clamp(28px, 2.6vw, 34px); font-weight: 700; line-height: 1.3; letter-spacing: -.025em; }
body.workspace-page .page-heading p:not(.eyebrow) { max-width: 48rem; font-size: 14px; }
body.workspace-page :where(.eyebrow, .step-label) { font-size: 12px; font-weight: 650; letter-spacing: .06em; }
body.workspace-page .notice { max-width: 25rem; padding: 4px 0 4px 14px; border-left: 2px solid var(--accent); background: transparent; font-size: 13px; }
body.workspace-page .panel { padding: var(--workspace-inset); margin-bottom: 24px; border-color: var(--line); border-radius: var(--workspace-radius); box-shadow: var(--shadow); }
body.workspace-page .panel-heading { flex-direction: row; flex-wrap: wrap; align-items: center; margin-bottom: 22px; padding-bottom: 16px; gap: 12px; }
body.workspace-page .panel-heading h2 { font-size: 22px; font-weight: 650; line-height: 1.4; }
body.workspace-page .panel-heading > p { margin: 0; font-size: 13px; }
body.workspace-page .field :where(label, legend) { font-weight: 600; margin-bottom: 6px; font-size: 14px; }
body.workspace-page .field small { font-size: 13px; line-height: 1.55; }
body.workspace-page :where(input, select, textarea) { min-height: 46px; border-radius: 6px; border-color: var(--line-strong); background-color: var(--surface); }
body.workspace-page :where(input, textarea)::placeholder { color: var(--muted); opacity: .85; }
body.workspace-page :where(input, select, textarea):focus-visible { border-color: var(--focus); }
body.workspace-page :where(input, select, textarea)[aria-invalid="true"] { border-color: var(--danger); }
body.workspace-page :where(input[type="checkbox"], input[type="radio"]) { width: 18px; min-height: 18px; height: 18px; flex: 0 0 auto; accent-color: var(--navy); }
body.workspace-page :where(.primary-button, .secondary-button, .compact-button, .text-button, .button-link) { min-height: 44px; border-radius: 6px; font-weight: 600; font-size: 14px; line-height: 1.4; transition: background-color 160ms, border-color 160ms, color 160ms, transform 120ms; }
body.workspace-page :where(.primary-button, .secondary-button) { padding: 11px 18px; }
body.workspace-page .primary-button { color: var(--workspace-primary-text); }
body.workspace-page .button-as-link { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
body.workspace-page :where(button, a):active { transform: none; }
body.workspace-page button:active:not(:disabled) { transform: translateY(1px); }
body.workspace-page button:disabled { cursor: not-allowed; opacity: .5; }
body.workspace-page :where(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
body.workspace-page .password-visibility { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-size: 14px; cursor: pointer; }
body.workspace-page :where(.form-error, .success-message, .empty-state) { border-radius: 6px; line-height: 1.6; overflow-wrap: anywhere; }
body.workspace-page .form-error { border-color: var(--danger); background: var(--danger-soft); color: var(--danger); }
body.workspace-page .success-message { border-color: var(--success); background: var(--success-soft); color: var(--success); }
body.workspace-page .session-feedback { max-width: 48rem; margin: 0 0 20px; padding: 12px 16px; }
body.workspace-page :where(.status-chip, .status-badge) { border-radius: 4px; font-weight: 600; line-height: 1.5; }
body.workspace-page details > summary { cursor: pointer; }
body.workspace-page details > summary::marker { color: var(--accent); }
body.workspace-page dialog { max-width: min(560px, calc(100% - 32px)); max-height: calc(100dvh - 32px); overflow: auto; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); color: var(--text); padding: 28px; box-shadow: 0 24px 80px rgb(15 31 44 / 22%); }
body.workspace-page dialog::backdrop { background: rgb(15 31 44 / 48%); }
body.workspace-page > footer { min-height: 64px; padding: 16px 24px; display: flex; flex-wrap: wrap; flex-direction: row; justify-content: center; gap: 8px 24px; border-color: var(--line); font-size: 12px; }
body.workspace-page > footer p { margin: 0; }
body.workspace-page .footer-admin-link { position: static; min-height: 44px; opacity: 1; }

/* Give navigation its own row before account controls become crowded. */
@media (min-width: 801px) and (max-width: 1200px) {
  body.workspace-page .site-header .header-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: 'brand actions' 'nav nav'; gap: 0 20px; }
  body.workspace-page .brand { grid-area: brand; min-height: 56px; }
  body.workspace-page .header-actions { grid-area: actions; }
  body.workspace-page .primary-nav { grid-area: nav; min-width: 0; min-height: 44px; overflow-x: auto; }
  body.workspace-page { --workspace-scroll-offset: 120px; }
}

@media (max-width: 1100px) {
  body.workspace-page .site-header .header-inner { gap: 16px; padding-inline: 20px; }
  body.workspace-page .brand > span:last-child { display: none; }
  body.workspace-page .header-actions { gap: 6px; }
}
@media (max-width: 800px) {
  body.workspace-page { --workspace-scroll-offset: calc(16px + env(safe-area-inset-top, 0px)); --workspace-inset: 20px; }
  body.workspace-page .site-header { position: relative; top: auto; }
  body.workspace-page .site-header .header-inner { min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: 'brand actions' 'nav nav' 'identity identity'; padding: 4px 20px 0; gap: 0 12px; }
  body.workspace-page .brand { grid-area: brand; min-height: 48px; align-self: center; }
  body.workspace-page .header-actions { grid-area: actions; margin-left: 0; height: auto; align-self: center; }
  body.workspace-page .header-actions .user-name { display: none; }
  body.workspace-page .mobile-account-context { grid-area: identity; display: block; width: 100%; margin: 0; padding: 6px 0 8px; border-top: 1px solid #526b7e; color: #e2eaf0; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
  body.workspace-page .primary-nav { grid-area: nav; min-height: 44px; width: 100%; gap: 8px; overflow-x: auto; padding: 0; }
  body.workspace-page .primary-nav a { min-height: 44px; padding-inline: 10px; }
  body.workspace-page .page-shell { width: calc(100% - 32px); margin-top: 24px; }
  body.workspace-page .page-heading { align-items: flex-start; flex-direction: column; gap: 12px; }
  body.workspace-page .notice { max-width: none; }
}
@media (max-width: 620px) {
  body.workspace-page { --workspace-inset: 12px; }
  body.workspace-page .site-header .header-inner { padding-inline: 12px; gap: 0 8px; }
  body.workspace-page .brand-logo-panel { width: 118px; }
  body.workspace-page .header-actions { gap: 4px; }
  body.workspace-page .header-actions .quiet-button:not(.theme-toggle) { padding-inline: 10px; }
  body.workspace-page .account-link { font-size: 12px; padding-inline: 2px; }
  body.workspace-page .page-shell { width: calc(100% - 16px); margin-top: 16px; }
  body.workspace-page .page-heading { margin-bottom: 16px; }
  body.workspace-page .page-heading h1 { font-size: 26px; }
  body.workspace-page .panel { margin-bottom: 16px; }
  body.workspace-page .panel-heading { margin-bottom: 16px; padding-bottom: 12px; }
  body.workspace-page .panel-heading h2 { font-size: 20px; }
  body.workspace-page .panel-heading-actions { width: auto; }
  body.workspace-page dialog { padding: 20px; }
}
@media (prefers-contrast: more) {
  body.workspace-page { --line: #70838d; --line-strong: #405965; }
  html[data-theme="dark"] body.workspace-page { --line: #96aab8; --line-strong: #c5d4dc; }
}
@media (forced-colors: active) {
  body.workspace-page { --focus: Highlight; --workspace-primary-text: ButtonText; }
  body.workspace-page :where(.site-header, .panel, .primary-button, .secondary-button, .status-chip, input, select, textarea, dialog) { forced-color-adjust: auto; border-color: CanvasText; box-shadow: none; }
}
@media (prefers-reduced-motion: reduce) {
  body.workspace-page *, body.workspace-page *::before, body.workspace-page *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
@media print {
  body.workspace-page, html[data-theme="dark"] body.workspace-page { --page: #fff; --surface: #fff; --surface-raised: #fff; --text: #111; --muted: #444; --line: #bbb; background: #fff; }
  body.workspace-page .page-shell { width: 100%; margin: 0; }
}