/* Shared banking interface. Semantic colors never inherit tenant branding. */
:root {
  color-scheme: light;
  --ui-action: #003247;
  --product-accent: #00866e;
  --ui-ink: #172b3a;
  --ui-muted: #526577;
  --ui-line: #d7e0e8;
  --ui-input-line: #899cab;
  --ui-surface: #ffffff;
  --ui-canvas: #f4f6f8;
  --ui-info-bg: #edf4fb;
  --ui-success: #17634e;
  --ui-success-bg: #edf7f1;
  --ui-warning: #805b0b;
  --ui-warning-bg: #fff8e8;
  --ui-danger: #ad292f;
  --ui-danger-bg: #fff1f2;
  --ui-focus: #005eb8;
  --ui-radius: 8px;
  --ui-shadow: 0 20px 64px #102a4329;
  --brand: var(--ui-action);
  --accent: var(--brand);
  --ink: var(--ui-ink);
  --muted: var(--ui-muted);
  --line: var(--ui-line);
  --success: var(--ui-success);
  --green: var(--ui-success);
  --pending: var(--ui-warning);
  --error: var(--ui-danger);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  font-size: 14px;
  font-synthesis: none;
  color: var(--ink);
  background: var(--ui-canvas);
}
body { background: var(--ui-canvas); color: var(--ink); }
h1, h2, h3, strong { color: var(--ink); }
h1 { font-size: 30px; font-weight: 650; line-height: 1.2; letter-spacing: -.03em; }
h2 { font-size: 20px; font-weight: 650; line-height: 1.3; letter-spacing: -.02em; }
p { font-size: 14px; line-height: 1.55; color: var(--muted); }
label { font-size: 13px; line-height: 1.4; color: var(--ui-ink); }
input, select, textarea { font-size: 14px; line-height: 1.4; color: var(--ink); border-color: var(--ui-line); }
button, .button { font-size: 14px; line-height: 1.3; font-weight: 650; background: var(--brand); border-radius: 8px; }
button.subtle, .button.subtle, button.secondary { background: var(--ui-surface); color: var(--ink); border-color: var(--ui-line); }
.text-button { background: transparent; color: var(--brand); font-size: 12px; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--ui-focus);
  outline-offset: 3px;
}
.eyebrow, th { font-size: 11px; line-height: 1.4; letter-spacing: .06em; color: var(--ui-muted); }
.card, .panel { background: var(--ui-surface); border-color: var(--line); border-radius: 12px; box-shadow: 0 2px 10px #142f4504; }
header, .workspace-sidebar { background: var(--ui-surface); border-color: var(--line); }
.mark, .logo { background: var(--brand); color: var(--ui-surface); }
.mark strong, .logo strong { color: var(--ui-surface); }
.brand small, .workspace-brand small { color: var(--muted); }
.company-name { font-size: 17px; }
:where(#identity, #status, #updated) { font-size: 12px; color: var(--muted); }
.connection-state { color: var(--success); font-size: 12px; }
.environment, .badge { background: var(--ui-warning-bg); border-color: #e7d8af; color: var(--ui-warning); }
#workspace-nav button { color: var(--ui-muted); font-size: 13px; }
#workspace-nav button[aria-current=page] { background: var(--ui-info-bg); color: var(--brand); }
.next-task { border-left-color: var(--brand); }
.next-task h2 { font-size: 22px; }
.quick-actions strong { color: var(--ink); }
.quick-actions span { font-size: 12px; }
.notice { background: var(--ui-info-bg); border-color: var(--ui-line); }
.notice strong { color: var(--brand); }
.warning { background: var(--ui-warning-bg); border-color: #e7d8af; }
.warning strong { color: var(--pending); }
.error, [data-state=error] { color: var(--error); }
[data-state=success] { color: var(--success); }
[data-state=pending] { color: var(--pending); }
.trade-modes button { color: var(--ui-muted); background: var(--ui-surface); border-color: var(--ui-line); }
.trade-modes button[aria-pressed=true] { color: var(--brand); border-color: var(--ui-action); box-shadow: inset 0 0 0 1px var(--ui-action); background: var(--ui-info-bg); }
.trade-modes small { font-size: 12px; }
.trade-steps { font-size: 12px; }
.trade-steps [aria-current=step] { color: var(--brand); }
.trade-summary { background: var(--ui-info-bg); border-color: var(--ui-line); }
.money-direction strong { color: var(--brand); font-variant-numeric: tabular-nums; }
.money-direction span, #summary-help, #trade-quote { font-size: 12px; color: var(--muted); }
.summary-rate { border-color: var(--ui-line); }
#trade-quote { color: var(--ui-muted); }
.grid .eyebrow { font-size: 11px; }
.count-group summary, .count-total { color: var(--brand); }
.count-head, .count-line strong, .count-line output { font-size: 12px; color: var(--ui-muted); }
.sidebar-note, .sidebar-note small, input::placeholder { color: var(--muted); }
.required-marker { color: var(--error); font-weight: 700; }
.finance-tabs [aria-pressed=true] { background: var(--ui-info-bg); border-color: var(--ui-action); color: var(--brand); }
.finance-metrics .card { background: var(--ui-canvas); }
.finance-metrics [data-state=success] strong { color: var(--success); }
.finance-metrics [data-state=error] strong { color: var(--error); }
.bank-dialog {
  width: min(520px, calc(100% - 32px));
  max-height: calc(100dvh - 40px);
  padding: 0;
  border: 1px solid var(--ui-line);
  border-radius: 14px;
  background: var(--ui-surface);
  color: var(--ink);
  box-shadow: 0 24px 80px #102f4933;
}
.bank-dialog::backdrop { background: #0c233968; backdrop-filter: blur(2px); }
.bank-dialog-header { padding: 25px 26px 12px; }
.bank-dialog-header h2 { margin: 8px 0 12px; font-size: 22px; }
.bank-dialog-header p { margin: 0; }
.bank-dialog-details { display: grid; grid-template-columns: minmax(90px, .75fr) minmax(0, 1.25fr); gap: 0; margin: 8px 26px 24px; }
.bank-dialog-details dt, .bank-dialog-details dd { padding: 11px 0; margin: 0; border-bottom: 1px solid var(--ui-line); font-size: 14px; }
.bank-dialog-details dt { color: var(--muted); }
.bank-dialog-details dd { text-align: right; font-weight: 650; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.bank-dialog-actions { display: flex; justify-content: flex-end; gap: 10px; padding: 17px 26px; background: var(--ui-canvas); border-top: 1px solid var(--ui-line); }
.bank-dialog[data-tone=warning] .bank-dialog-header { border-top: 4px solid var(--ui-warning); }
@media (max-width: 760px) {
  h1 { font-size: 27px; }
  .bank-dialog-header { padding: 22px 20px 12px; }
  .bank-dialog-details { margin: 7px 20px 22px; }
  .bank-dialog-actions { padding: 15px 20px; }
  .bank-dialog-actions button { flex: 1; }
  .trade-modes small, .count-line output { font-size: 12px; }
}
@media (prefers-reduced-motion: no-preference) {
  .bank-dialog[open] { animation: bank-dialog-in .13s ease-out; }
  @keyframes bank-dialog-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
}

/* Common sizes, interaction states and copy hierarchy across every workspace. */
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; background: var(--ui-canvas); }
button, input, select, textarea { font-family: inherit; }
h1, h2, h3 { text-wrap: balance; }
h1 { font-size: 28px; font-weight: 600; letter-spacing: -.025em; }
h2 { font-size: 20px; font-weight: 600; }
h3 { font-size: 16px; font-weight: 600; }
small, .eyebrow, th, .field-note { font-size: 12px; line-height: 1.5; }
label { font-size: 13px; font-weight: 600; color: var(--ink); }
a { color: var(--brand); text-underline-offset: 3px; }
input, select, textarea { background: var(--ui-surface); border: 1px solid var(--ui-input-line); border-radius: var(--ui-radius); padding: 10px 12px; min-height: 44px; max-width: 100%; font-size: 14px; }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
input[type=checkbox], input[type=radio] { min-height: auto; width: 18px; height: 18px; accent-color: var(--brand); }
input[readonly] { background: var(--ui-canvas); }
input[aria-invalid=true], select[aria-invalid=true], textarea[aria-invalid=true] { border-color: var(--ui-danger); }
button, .button { min-height: 44px !important; padding: 10px 16px; border: 1px solid transparent; border-radius: var(--ui-radius); font-size: 14px; font-weight: 600; color: var(--ui-surface); background: var(--brand); box-shadow: none; cursor: pointer; white-space: normal; }
button:hover:not(:disabled), .button:hover { filter: brightness(.95); box-shadow: none; }
button:disabled { opacity: .5; cursor: not-allowed; }
button.subtle, button.secondary, .button.subtle { background: var(--ui-surface); color: var(--brand); border-color: var(--ui-input-line); }
button.text-button { color: var(--brand); background: transparent; border-color: transparent; text-align: left; font-size: 13px; }
button[data-variant=danger] { color: var(--ui-surface); background: var(--ui-danger); }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 3px solid var(--ui-focus); outline-offset: 3px; }
.card, .panel, .balance, .treasury-metric { border-radius: 10px; border-color: var(--line); background: var(--ui-surface); box-shadow: none; }
.card h2, .panel h2 { line-height: 1.3; }
header, .sidebar, .workspace-sidebar { background: var(--ui-surface); }
.workspace-sidebar, .sidebar { border-right-color: var(--line); }
#workspace-nav button, .sidebar nav button { color: var(--muted); font-size: 13px; border-radius: var(--ui-radius); }
#workspace-nav button[aria-current=page], .sidebar nav button[aria-current=page], .treasury-tabs button[aria-current=page], .finance-tabs button[aria-pressed=true] { background: var(--ui-info-bg); color: var(--brand); border-color: var(--brand); box-shadow: inset 3px 0 0 var(--brand); }
.trade-modes button[aria-pressed=true], .mode-switch button[aria-pressed=true] { color: var(--brand); border-color: var(--brand); background: var(--ui-info-bg); }
.trade-modes small, .mode-switch small, .brand small, .workspace-brand small, .owner-app .business small, .owner-app .agent-card-footer small, .owner-app .agent-card-stats span, .owner-app .detail label, .owner-app .owner-update, .sidebar-bottom small, .brand-preview small, .desk-note, .fx-rate-tile>small, .fx-rate-status, .count-head, .count-line strong, .count-line output { font-size: 12px !important; line-height: 1.5; }
.environment, .demo-banner, .badge, .receipt-stamp { color: var(--ui-warning); background: var(--ui-warning-bg); border-color: #dfc481; font-size: 11px; line-height: 1.5; letter-spacing: .025em; }
.notice, .guide, .trade-summary { background: var(--ui-info-bg); border-color: var(--line); }
.warning { background: var(--ui-warning-bg); border-color: #dfc481; color: var(--ui-warning); }
.error, [data-state=error] { color: var(--ui-danger); }
[data-state=success] { color: var(--ui-success); }
[data-state=pending] { color: var(--ui-warning); }
[data-state=info] { color: var(--ink); }
[role=status]:empty, [role=alert]:empty { display: none; }
[role=status][data-state], [role=alert][data-state] { padding: 12px 14px; border-left: 3px solid currentColor; border-radius: 4px; line-height: 1.5; }
[data-state=success][role=status] { background: var(--ui-success-bg); }
[data-state=pending][role=status] { background: var(--ui-warning-bg); }
[data-state=info][role=status] { background: var(--ui-info-bg); }
[data-state=error][role=alert] { background: var(--ui-danger-bg); }
#feedback { background: var(--ui-info-bg); border-color: var(--line); color: var(--ink); }
#feedback[data-state=error] { color: var(--ui-danger); background: var(--ui-danger-bg); }
#feedback[data-state=success] { color: var(--ui-success); background: var(--ui-success-bg); }
.owner-app .business.active { background: var(--ui-info-bg); border-color: var(--brand); }
.owner-app .tag, .owner-app .tag.pilot, .tag, .mini-tag { color: var(--brand); background: var(--ui-info-bg); border-color: var(--line); font-size: 12px; }
.owner-app .tag.paused, .tag.paused, .detail-stats .blocked strong { color: var(--ui-warning); }
.detail-stats .safe strong, .status.open { color: var(--ui-success); }
table { font-size: 13px; }
th { font-weight: 600; color: var(--muted); background: var(--ui-canvas); text-transform: none; letter-spacing: 0; }
th, td { padding: 12px; border-bottom-color: var(--line); vertical-align: middle; }
td { overflow-wrap: anywhere; }
td button, #treasury-root td button, .launch-task button { font-size: 13px; min-height: 44px; }
.money-direction strong, .flow strong, .balance strong, .finance-metrics strong, .treasury-metric strong, .metrics strong, .summary-list dd, .receipt-lines dd { font-variant-numeric: tabular-nums; }
.bank-dialog { border-radius: 12px; border-color: var(--line); box-shadow: var(--ui-shadow); overflow: auto; overscroll-behavior: contain; }
.bank-dialog-header { border-top: 4px solid var(--brand); padding: 24px 24px 12px; }
.bank-dialog-header h2 { font-size: 22px; margin: 8px 0 12px; }
.bank-dialog-header p { white-space: pre-line; }
.bank-dialog-details { margin: 8px 24px 24px; }
.bank-dialog-details:empty { display: none; }
.bank-dialog-details dt, .bank-dialog-details dd { min-width: 0; overflow-wrap: anywhere; }
.bank-dialog-actions { position: sticky; bottom: 0; flex-wrap: wrap; padding: 16px 24px; background: var(--ui-surface); border-top-color: var(--line); }
.bank-dialog-actions button { flex: 0 1 auto; min-width: 110px; max-width: 100%; }
.bank-dialog[data-tone=warning] .bank-dialog-header { border-top-color: var(--ui-warning); }
.bank-dialog[data-tone=danger] .bank-dialog-header { border-top-color: var(--ui-danger); }
.bank-dialog[data-tone=warning] .eyebrow { color: var(--ui-warning); }
.bank-dialog[data-tone=danger] .eyebrow { color: var(--ui-danger); }
#receipt-dialog { padding: 24px; }
#receipt-dialog .dialog-actions { display: flex; gap: 8px; flex-wrap: wrap; padding-top: 16px; border-top: 1px solid var(--line); }
#receipt-dialog .icon-button { min-width: 44px; min-height: 44px; background: var(--ui-surface); color: var(--muted); }
.footer-console-link { margin-left: 16px; }
.ui-guide { max-width: 1040px; margin: auto; padding: 32px 24px; }
.ui-guide-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.ui-guide .panel { padding: 20px; margin: 16px 0; }
.ui-guide-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.ui-swatch { height: 6px; border-radius: 3px; background: var(--sample); margin-bottom: 16px; }
@media (max-width: 760px) {
  h1, .owner-app .heading h1, .page-heading h1 { font-size: 26px; }
  input, select, textarea, .count-line input { font-size: 16px; }
  .bank-dialog { max-height: calc(100dvh - 24px); width: calc(100% - 24px); }
  .bank-dialog-header { padding: 20px 20px 12px; }
  .bank-dialog-details { margin: 8px 20px 20px; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); }
  .bank-dialog-actions { padding: 14px 20px; }
  .bank-dialog-actions button { flex: 1 1 120px; }
  .ui-guide-grid { grid-template-columns: 1fr; gap: 0; }
  .environment, .badge { font-size: 11px; max-width: 220px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }
@media print {
  :root, body { background: white; color: black; }
  .bank-dialog-actions { display: none; }
  th, td { color: black; }
}


/* DivisaOS identity: original logo, navy actions and teal signature. */
.product-logo {display:block;width:220px;max-width:100%;height:auto;object-fit:contain;flex-shrink:0;}
.operations-app>header,.owner-app>header{border-top:4px solid var(--product-accent);min-height:100px;}
.operations-app>header .brand,.owner-app>header .brand{min-width:0;}
.branded-access{position:relative;border-top:3px solid var(--product-accent);}
.branded-access>.product-logo{width:240px;margin:0 0 4px;}
.brand-promise{font-size:13px;color:var(--ink);margin:0 0 28px;font-weight:500;}
.branded-access h1{font-size:27px;}
.product-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid var(--line);background:white;}
.product-endorsement{display:flex;align-items:center;gap:14px;flex:none;}
.product-endorsement img{width:124px;height:auto;}
.product-endorsement>span{font-size:12px;color:var(--muted);max-width:190px;}
.product-footer>span:last-child{font-size:12px;line-height:1.7;}
.sidebar>.brand{border-bottom:1px solid var(--line);padding-bottom:24px;}
.sidebar .product-logo{width:190px;}
body[data-brand-scope=product] .sidebar{border-top:4px solid var(--product-accent);}
.bank-dialog-header{display:flex;flex-direction:column;}
.dialog-brand{order:-1;display:flex;align-items:center;gap:12px;min-height:48px;margin:-4px 0 20px;padding-bottom:14px;border-bottom:1px solid var(--line);}
.dialog-brand>img{width:170px;height:auto;max-width:70%;object-fit:contain;}
.dialog-brand>.dialog-tenant-logo{width:48px;height:48px;max-width:48px;}
.dialog-brand>strong{font-size:18px;overflow-wrap:anywhere;}
.bank-dialog-header>.eyebrow{font-size:11px;letter-spacing:.06em;}
.brand-gallery{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px;align-items:center;}
.brand-gallery-logo{width:380px;max-width:100%;height:auto;}
.brand-gallery p{max-width:520px;}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
@media(max-width:760px){.operations-app>header,.owner-app>header{min-height:88px;gap:12px;flex-wrap:wrap;}.operations-app>header .product-logo,.owner-app>header .product-logo{width:190px;}.branded-access>.product-logo{width:220px;}.product-footer{flex-direction:column;align-items:flex-start;gap:12px;}.product-endorsement{gap:12px;}.product-endorsement>span{font-size:12px;}.brand-gallery{grid-template-columns:1fr;}.dialog-brand{margin-bottom:16px;}.dialog-brand>img{width:160px;}}