/* Broker Portal's current visual language, with a Pricing yellow accent.
   Presentation only: no hidden business content or altered workflow controls. */
:root {
  --portal-ink: #251c19;
  --portal-muted: #615b52;
  --portal-canvas: #f5f5f7;
  --portal-paper: #ffffff;
  --portal-line: #deded9;
  --portal-control: #85858d;
  --portal-yellow: #f4ce34;
  --portal-yellow-hover: #e7bd1b;
  --portal-yellow-soft: #fff8da;
  /* Match the Portal's three radial layers, translated to Pricing yellow. */
  --portal-introduction-gradient:
    radial-gradient(70% 65% at 40% 85%, #efdf9b, transparent 100%),
    radial-gradient(80% 70% at 90% 70%, #ffdd38, transparent 100%),
    radial-gradient(85% 70% at 45% 15%, #fff1c4, transparent 100%);
  --portal-canvas-gradient:
    radial-gradient(80% 65% at 100% 0%, #fff1c466, transparent 100%),
    radial-gradient(70% 60% at 0% 85%, #efdf9b33, transparent 100%);
  --portal-accent-ink: #795600;
  --portal-focus: #8a6500;
  --portal-error: #a32929;
  --ink: var(--portal-ink);
  --brand: var(--portal-accent-ink);
  --canvas: var(--portal-canvas);
  --paper: var(--portal-paper);
  --line: var(--portal-line);
  --muted: var(--portal-muted);
  --warn: #855413;
  --cloud-ink: var(--portal-ink);
  --cloud-brand: var(--portal-accent-ink);
  --cloud-line: var(--portal-line);
  --chat-ink: var(--portal-ink);
  --chat-muted: var(--portal-muted);
  --chat-border: var(--portal-line);
  --chat-paper: var(--portal-paper);
  --chat-wash: var(--portal-canvas);
  --chat-accent: var(--portal-accent-ink);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang TC", "Microsoft JhengHei", sans-serif;
  color: var(--portal-ink);
  background: transparent;
  font-size: 16px;
  line-height: 1.6;
}

body {
  min-height: 100vh;
  color: var(--portal-ink);
  background: var(--portal-canvas-gradient) var(--portal-canvas);
}
/* Let the embedded workspace share the outer canvas, not restart its gradient. */
body.embedded { background: transparent; }
button, input, select, textarea { font-family: inherit; }
p, label, .eyebrow, .metric span { color: var(--portal-muted); }
a { color: var(--portal-accent-ink); text-underline-offset: 4px; }
h1, h2, h3, legend, .owner, .large-label { color: var(--portal-ink); }
h1 { font-size: 32px; font-weight: 600; line-height: 1.25; letter-spacing: -.035em; }
h2 { font-size: 21px; font-weight: 600; line-height: 1.4; }
button {
  min-height: 44px;
  border: 1px solid var(--portal-line);
  border-radius: 8px;
  background: var(--portal-paper);
  color: var(--portal-ink);
  font-size: 15px;
  font-weight: 600;
  padding: 10px 18px;
}
/* Legacy first-child styling must not turn every secondary action into a CTA. */
button:first-child { background: var(--portal-paper); color: var(--portal-ink); border-color: var(--portal-line); }
button:hover:not(:disabled) { background: #f0f0ed; border-color: var(--portal-control); }
button.primary, #vita-open, #login-submit, #research-ask, #query {
  background: var(--portal-yellow);
  color: var(--portal-ink);
  border-color: var(--portal-yellow);
}
button.primary:hover:not(:disabled), #vita-open:hover, #login-submit:hover:not(:disabled),
#research-ask:hover:not(:disabled), #query:hover:not(:disabled) {
  background: var(--portal-yellow-hover);
  border-color: var(--portal-yellow-hover);
  color: var(--portal-ink);
}
button:disabled { opacity: .55; cursor: not-allowed; }
input, select, textarea, .review-form textarea, .vita-composer textarea {
  border: 1px solid var(--portal-control);
  border-radius: 8px;
  background: var(--portal-paper);
  color: var(--portal-ink);
  font-size: 16px;
  min-height: 44px;
}
input::placeholder, textarea::placeholder { color: #736d66; }
:focus-visible, .chat-workspace :focus-visible, #panel-import :focus-visible,
.login-card :focus-visible, .cloud-account :focus-visible {
  outline: 3px solid var(--portal-focus);
  outline-offset: 3px;
}
input[type=checkbox] { accent-color: var(--portal-accent-ink); }

/* One calm application shell; the yellow rail identifies the active workspace. */
body > .cloud-account {
  padding: 16px max(24px, calc((100vw - 1280px) / 2));
  min-height: 68px;
  background: var(--portal-paper);
  border-bottom: 1px solid var(--portal-line);
  letter-spacing: 0;
  font-size: 16px;
  font-weight: 600;
}
.cloud-account > span { border-left: 4px solid var(--portal-yellow); padding-left: 12px; }
.cloud-account button { color: var(--portal-ink); min-height: 44px; font-size: 14px; }
.cloud-account-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:12px; min-width:0; }
.cloud-identity { color:var(--portal-muted); font-size:14px; overflow-wrap:anywhere; }
#google-login:not([hidden]) { display:flex; align-items:center; justify-content:center; gap:12px; margin-top:24px; min-height:48px; padding:10px 16px; border:1px solid var(--portal-control); border-radius:8px; background:var(--portal-paper); color:var(--portal-ink); text-decoration:none; font-weight:600; box-sizing:border-box; }
#google-login:hover { background:var(--portal-canvas); }
#google-error { color:var(--portal-error); font-size:14px; }
#cloud-users-dialog { width:min(600px,calc(100% - 32px)); box-sizing:border-box; padding:28px; max-height:85dvh; overflow:auto; }
.cloud-users-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:16px; }
.cloud-users-heading h2 { margin:0; }
#cloud-users-form label { display:block; margin-bottom:8px; font-weight:600; }
.cloud-users-entry { display:flex; gap:12px; }
.cloud-users-entry input { flex:1; min-width:0; padding:10px 12px; }
#cloud-users-status { min-height:24px; font-size:14px; }
#cloud-users-list { padding:0; list-style:none; }
#cloud-users-list li { display:flex; align-items:baseline; justify-content:space-between; gap:16px; padding:14px 0; border-bottom:1px solid var(--portal-line); overflow-wrap:anywhere; }
.cloud-user-role { flex-shrink:0; color:var(--portal-muted); font-size:14px; }
.cloud-users-note { font-size:14px; margin-bottom:0; }
@media(max-width:600px) {
  .cloud-account { flex-wrap:wrap; }
  .cloud-account-actions { width:100%; justify-content:flex-start; }
  .cloud-identity { flex-basis:100%; }
  #cloud-users-dialog { padding:20px; }
  .cloud-users-entry { flex-direction:column; }
  #cloud-users-list li { flex-direction:column; gap:4px; }
}
body > main { max-width: 1328px; padding: 24px 24px 32px; }
body > main > h1 { font-size: 26px; margin: 0 0 20px; font-weight: 600; }
.workspace-tabs { gap: 6px; margin: 0 0 20px; padding-bottom: 12px; border-color: var(--portal-line); }
.workspace-tabs [role=tab] { color: var(--portal-muted); border-color: transparent; background: transparent; }
.workspace-tabs [aria-selected=true] { color: var(--portal-ink); background: var(--portal-yellow); border-color: var(--portal-yellow); }
.workspace-tabs [aria-selected=true]:hover:not(:disabled) { color: var(--portal-ink); background: var(--portal-yellow-hover); border-color: var(--portal-yellow-hover); }
#pricing-workspace-frame { background: transparent; border-radius: 0; }
.masthead { background: var(--portal-paper); border-color: var(--portal-line); }
.brand, .brand strong { color: var(--portal-ink); font-family: inherit; }
.brand span { color: var(--portal-muted); }
.shell { max-width: 1280px; padding: 0 24px 48px; }
.embedded .shell { padding: 0 8px 32px; }
.embedded main { padding: 0; }
.embedded nav { margin-bottom: 32px; }
.embedded h1 { font-size: 30px; }
nav[aria-label="主要功能"] { gap: 32px; border-color: var(--portal-line); }
nav[aria-label="主要功能"] a { color: var(--portal-muted); border-bottom-width: 3px; padding: 18px 0; }
nav[aria-label="主要功能"] a[aria-current=page] { border-color: var(--portal-yellow); color: var(--portal-ink); }
nav[aria-label="主要功能"] span { border-color: var(--portal-control); color: var(--portal-muted); }
nav[aria-label="主要功能"] a[aria-current=page] span { background: var(--portal-yellow); border-color: var(--portal-yellow); color: var(--portal-ink); }
#vita-open { padding-inline: 18px; }
.heading { margin-bottom: 28px; }
.heading h1 { margin: 0 0 10px; }
.subtitle { font-size: 15px; color: var(--portal-muted); }
.small, .local, .footnote { color: var(--portal-muted); }
.toolbar { margin-bottom: 24px; }

/* Sources, saved versions and quote forms share the same restrained surfaces. */
.panel, .metric, .investor-group, .bundle-panel, .batch-results, .work-layout,
.quote-conditions, .quote-row-details, .empty, .table-wrap, .quote-table,
.import-details, .chat-workspace {
  border-color: var(--portal-line);
  background: var(--portal-paper);
  border-radius: 12px;
  box-shadow: none;
}
.investor-group { padding: 28px; margin-bottom: 20px; }
.investor-group h2 { font-size: 22px; }
.investor-group header, .source-files li { border-color: var(--portal-line); }
.source-files .filename { max-width: 620px; font-size: 14px; color: var(--portal-muted); }
.source-files li { padding: 18px 0; }
.source-files li:last-child { padding-bottom: 0; }
.source-files button { font-size: 14px; }
.bundle-panel, .batch-results { padding: 28px; }
th { color: var(--portal-muted); background: #f7f7f5; }
th, td { border-color: var(--portal-line); }
.quote-empty { background: #fafaf8; border-color: var(--portal-control); }
.quote-conditions { padding: 28px; }
.quote-conditions input, .quote-conditions select { font-size: 16px; }
.quote-fact-section { border-color: var(--portal-line); }
.quote-credit { color: var(--portal-accent-ink); }
.quote-issue, .quote-stale { background: var(--portal-yellow-soft); }
.file-zone { background: #fafaf8; border-color: var(--portal-control); }
dialog { border-radius: 16px; color: var(--portal-ink); border-color: var(--portal-line); box-shadow: 0 16px 56px #251c1924; }
dialog::backdrop { background: #251c1966; }
#notice:not(:empty), #upload-status:not(:empty), #loan-result:not(:empty),
#check-result:not(:empty), .vita-approval {
  background: var(--portal-yellow-soft);
  border-left-color: var(--portal-yellow);
}
.error, .vita-error, #login-error { color: var(--portal-error); }

/* The assistant uses the same task accent, not an independent product palette. */
#vita-panel { border-color: var(--portal-line); box-shadow: 0 16px 56px #251c1924; }
.vita-head { background: var(--portal-yellow-soft); border-color: var(--portal-line); }
.vita-head h2 { color: var(--portal-ink); }
#vita-close { background: transparent; border: 0; }
#vita-prompts button { border-color: var(--portal-line); color: var(--portal-ink); }
.vita-user > p, .chat-question { background: var(--portal-yellow-soft); color: var(--portal-ink); }
.vita-answer code { background: #f2f2ee; }
.vita-working::before, .vita-bar-fill { background: var(--portal-accent-ink); }
.chat-sidebar .chat-session:hover { background: #f0f0ed; }
.chat-sidebar .chat-session[aria-current=true] { background: var(--portal-yellow-soft); border-color: #b28b18; }
.chat-sidebar-heading button { color: var(--portal-ink); border-color: var(--portal-line); background: var(--portal-paper); }
.chat-heading, .chat-composer, .chat-sidebar { border-color: var(--portal-line); }
.chat-chart { background: #fafaf8; border-color: var(--portal-line); }
.chat-chart figcaption { color: var(--portal-ink); }
.chart-row svg { fill: var(--portal-accent-ink); }

/* Portal-like two-panel entry. No extra account flows or auth behavior added. */
.login-page { background: var(--portal-canvas-gradient) var(--portal-canvas); color: var(--portal-ink); padding: 40px 24px; }
.login-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: min(100%, 1120px);
  margin: auto;
  padding: 8px;
  border-radius: 20px;
  background: var(--portal-paper);
}
.login-introduction {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 56px;
  padding: 48px;
  min-height: 520px;
  background: var(--portal-introduction-gradient) var(--portal-paper);
  border-radius: 14px;
}
.login-wordmark { margin: 0; color: var(--portal-ink); font-size: 30px; font-weight: 800; letter-spacing: -.04em; }
.login-wordmark span { margin-left: 10px; font-size: 13px; font-weight: 600; letter-spacing: .14em; }
.login-introduction h1 { font-size: 20px; letter-spacing: 0; margin: 0 0 18px; }
.login-statement { color: var(--portal-ink); font-size: clamp(30px, 3.3vw, 44px); line-height: 1.35; font-weight: 600; letter-spacing: -.035em; margin: 0; }
.login-caption { color: var(--portal-muted); font-size: 15px; margin: 0; }
.login-card { width: 100%; max-width: 460px; align-self: center; justify-self: center; padding: 40px; border: 0; box-shadow: none; background: transparent; }
.login-card h2 { font-size: 30px; letter-spacing: -.035em; margin: 0 0 32px; }
.login-card label { color: var(--portal-ink); font-weight: 500; margin: 22px 0 8px; }
.login-card input { border-color: var(--portal-control); border-radius: 8px; min-height: 48px; }
.login-card button { min-height: 48px; margin-top: 18px; border-radius: 8px; }

@media (max-width: 820px) {
  .login-layout { grid-template-columns: 1fr; max-width: 560px; }
  .login-introduction { min-height: 0; gap: 28px; padding: 28px; }
  .login-statement { font-size: 30px; }
  .login-caption { display: none; }
  .login-card { max-width: none; padding: 32px 28px; }
  .login-card h2 { font-size: 26px; margin-bottom: 20px; }
}
@media (max-width: 760px) {
  body > .cloud-account { padding: 12px 16px; }
  body > main { padding: 20px 16px; }
  body > main > h1 { font-size: 23px; margin-bottom: 16px; }
  .workspace-tabs { gap: 4px; }
  .workspace-tabs [role=tab] { min-width: 0; padding: 10px 8px; font-size: 14px; }
  .embedded .shell { padding: 0 0 24px; }
  .embedded h1 { font-size: 26px; }
  nav[aria-label="主要功能"] { gap: 20px; flex-wrap: wrap; }
  nav[aria-label="主要功能"] a { padding: 14px 0; font-size: 14px; }
  nav[aria-label="主要功能"] #vita-open { padding: 8px 12px; }
  .investor-group, .bundle-panel, .batch-results, .quote-conditions { padding: 20px; }
  .source-files .filename { max-width: 100%; }
  .heading { gap: 18px; }
}
@media (max-width: 480px) {
  .login-page { padding: 16px; }
  .login-layout { padding: 6px; border-radius: 16px; }
  .login-introduction { padding: 24px; gap: 24px; }
  .login-wordmark { font-size: 26px; }
  .login-statement { font-size: 27px; }
  .login-card { padding: 28px 24px; }
}
@media (forced-colors: active) {
  .chart-row svg { fill: CanvasText; }
  :focus-visible { outline-color: Highlight; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; scroll-behavior: auto !important; }
}