:root {
  --ink: #151515;
  --ink-soft: #272622;
  --paper: #f7f6f2;
  --surface: #ffffff;
  --line: #e3e0d8;
  --muted: #6f6b61;
  --gold: #d5a83e;
  --gold-soft: #fff6db;
  --success: #20734a;
  --success-soft: #e8f6ed;
  --warning: #a86c00;
  --warning-soft: #fff2cf;
  --risk: #b5382f;
  --risk-soft: #fdeceb;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { background: var(--paper); }
body { margin: 0; color: var(--ink); background: var(--paper); font-size: 14px; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }

.app-shell { min-height: 100vh; }
.app-header { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 32px; padding: 14px max(24px, calc((100vw - 1440px) / 2)); background: rgba(255, 255, 255, .94); border-bottom: 1px solid var(--line); backdrop-filter: blur(16px); }
.brand { display: inline-flex; align-items: center; gap: 10px; min-width: max-content; border: 0; padding: 0; background: transparent; color: var(--ink); text-align: left; }
.brand-mark { display: grid; width: 38px; height: 38px; place-items: center; color: var(--gold); background: var(--ink); border-radius: 10px; }
.brand-mark svg { width: 30px; height: 30px; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 14px; letter-spacing: -.01em; }
.brand small { margin-top: 1px; color: var(--muted); font-size: 11px; }
.app-nav { display: flex; align-items: center; gap: 2px; overflow-x: auto; scrollbar-width: none; }
.app-nav::-webkit-scrollbar { display: none; }
.nav-btn { border: 0; padding: 9px 11px; background: transparent; color: var(--muted); border-radius: 7px; white-space: nowrap; font-size: 12px; font-weight: 600; }
.nav-btn:hover { color: var(--ink); background: #f1f0eb; }
.nav-btn.active { color: var(--ink); background: var(--gold-soft); box-shadow: inset 0 0 0 1px #f0d58e; }

.app-main { width: min(1360px, calc(100% - 48px)); margin: 0 auto; padding: 38px 0 72px; }
.view-panel { display: none; animation: fade .18s ease-out; }
.view-panel.active { display: block; }
@keyframes fade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.view-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 26px; }
.view-heading h1 { margin: 3px 0 7px; font-size: clamp(25px, 3vw, 35px); letter-spacing: -.055em; line-height: 1; }
.view-heading p:not(.eyebrow) { max-width: 760px; margin: 0; color: var(--muted); line-height: 1.55; }
.heading-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.eyebrow { margin: 0; color: #8b702c; font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }

.btn-primary, .btn-secondary, .small-button, .text-button { border-radius: 8px; font-weight: 700; transition: .15s ease; }
.btn-primary { padding: 10px 14px; color: #17130a; border: 1px solid #c99520; background: linear-gradient(135deg, #e3ba57, #c89625); box-shadow: 0 4px 12px rgba(180, 127, 15, .14); }
.btn-primary:hover { transform: translateY(-1px); filter: brightness(1.03); }
.btn-secondary { padding: 10px 14px; color: var(--ink); border: 1px solid var(--line); background: var(--surface); }
.btn-secondary:hover { border-color: #c7bd9e; background: #faf9f5; }
.text-button { padding: 0; border: 0; color: #85671c; background: none; font-size: 12px; }
.text-button:hover { color: var(--ink); text-decoration: underline; }
.small-button { padding: 7px 9px; border: 1px solid var(--line); color: var(--ink); background: var(--surface); font-size: 11px; white-space: nowrap; }
.small-button:hover { border-color: var(--gold); background: var(--gold-soft); }
.small-button.accent { border-color: #e7c56e; background: var(--gold-soft); }

.metric-grid, .crm-summary { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-bottom: 24px; }
.metric-card { min-height: 118px; display: flex; flex-direction: column; justify-content: space-between; padding: 15px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.metric-card span { color: var(--muted); font-size: 11px; font-weight: 700; }
.metric-card strong { font-size: 23px; letter-spacing: -.045em; line-height: 1; }
.metric-card small { color: var(--muted); font-size: 11px; line-height: 1.35; }
.metric-card.gold { background: var(--gold-soft); border-color: #f0d78f; }
.metric-card.risk { background: var(--risk-soft); border-color: #f1c4c0; }

.two-column { display: grid; grid-template-columns: 1.1fr .9fr; gap: 16px; }
.surface { border: 1px solid var(--line); border-radius: 13px; background: var(--surface); box-shadow: 0 7px 21px rgba(33, 27, 12, .025); }
.overview-grid .surface { padding: 20px; }
.surface-heading { display: flex; align-items: start; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.surface-heading h2 { margin: 3px 0 0; font-size: 16px; letter-spacing: -.025em; }
.attention-list { display: grid; gap: 7px; }
.attention-item { display: grid; grid-template-columns: 130px 1fr; gap: 3px 14px; padding: 11px 0; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--ink); text-align: left; }
.attention-item:last-child { border-bottom: 0; }
.attention-item span { grid-row: 1 / span 2; align-self: center; color: var(--warning); font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.attention-item.risk span { color: var(--risk); }
.attention-item strong { font-size: 13px; }
.attention-item small { overflow: hidden; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.attention-item:hover strong { text-decoration: underline; }
.process-list { display: grid; gap: 13px; margin: 0; padding: 0; list-style: none; }
.process-list li { display: grid; grid-template-columns: 28px 1fr; gap: 11px; }
.process-list li > span { display: grid; width: 25px; height: 25px; place-items: center; color: #735718; background: var(--gold-soft); border-radius: 50%; font-size: 9px; font-weight: 800; }
.process-list strong { font-size: 13px; }
.process-list p { margin: 2px 0 0; color: var(--muted); font-size: 12px; line-height: 1.35; }
.empty-state { display: grid; gap: 5px; padding: 20px 4px; color: var(--muted); text-align: center; }
.empty-state strong { color: var(--ink); font-size: 13px; }
.empty-state span { font-size: 12px; }

.crm-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.crm-summary .metric-card { min-height: 91px; }
.compact-surface { padding: 13px 15px; }
.toolbar { display: flex; align-items: end; gap: 10px; margin-bottom: 12px; }
.search-field { flex: 1; }
.select-field { display: grid; gap: 4px; color: var(--muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.search-field input, .select-field select, .field input, .field select, .field textarea, .inline-input { width: 100%; border: 1px solid var(--line); outline: none; background: #fcfcfa; color: var(--ink); border-radius: 7px; transition: border-color .15s, box-shadow .15s; }
.search-field input { padding: 10px 12px; }
.select-field select { min-width: 160px; padding: 9px 10px; }
.search-field input:focus, .select-field select:focus, .field input:focus, .field select:focus, .field textarea:focus, .inline-input:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(213, 168, 62, .14); }
.table-wrap { overflow-x: auto; }
.crm-table-wrap { min-height: 310px; }
.data-table { width: 100%; border-collapse: collapse; min-width: 840px; }
.data-table th { padding: 11px 14px; color: var(--muted); border-bottom: 1px solid var(--line); font-size: 10px; font-weight: 800; letter-spacing: .06em; text-align: left; text-transform: uppercase; white-space: nowrap; }
.data-table td { padding: 12px 14px; border-bottom: 1px solid #efede8; vertical-align: middle; }
.data-table tr:last-child td { border-bottom: 0; }
.data-table td > strong, .data-table td > span { display: block; }
.data-table td > strong { font-size: 12px; line-height: 1.35; }
.data-table td > span { margin-top: 3px; color: var(--muted); font-size: 11px; }
.data-table .wrap-text { max-width: 210px; color: #464238; font-weight: 600; }
.table-select { width: 148px; padding: 7px 8px; color: var(--ink); border: 1px solid var(--line); border-radius: 7px; background: #fff; font-size: 11px; }
.row-actions { display: flex; align-items: center; gap: 6px; justify-content: end; }
.text-risk { color: var(--risk) !important; font-weight: 800; }

.wms-gates { display: flex; gap: 18px; flex-wrap: wrap; margin: -8px 0 16px; color: var(--muted); font-size: 11px; }
.dot { display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 50%; }
.dot-gold { background: var(--gold); }
.wms-board { display: grid; grid-template-columns: repeat(6, minmax(208px, 1fr)); gap: 12px; overflow-x: auto; padding-bottom: 4px; }
.wms-column { min-height: 440px; padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: #efeee9; }
.wms-column header { display: flex; align-items: center; justify-content: space-between; padding: 2px 2px 10px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.wms-column header strong { display: grid; width: 21px; height: 21px; place-items: center; color: #5d4a14; background: var(--gold-soft); border-radius: 50%; font-size: 10px; }
.wms-cards { display: grid; gap: 9px; }
.wms-empty { padding: 18px 5px; color: #989387; font-size: 11px; text-align: center; }
.project-card { padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: 0 2px 7px rgba(36, 30, 10, .04); }
.project-card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 10px; }
.risk-badge { padding: 3px 6px; border-radius: 999px; font-size: 9px; font-weight: 800; }
.risk-baixo { color: var(--success); background: var(--success-soft); }
.risk-médio { color: var(--warning); background: var(--warning-soft); }
.risk-alto { color: var(--risk); background: var(--risk-soft); }
.project-card h3 { margin: 11px 0 4px; font-size: 13px; line-height: 1.25; }
.project-card p { min-height: 16px; margin: 0; color: var(--muted); font-size: 11px; }
.project-meta { display: flex; justify-content: space-between; gap: 8px; margin: 10px 0; color: var(--muted); font-size: 10px; }
.project-gate { padding: 6px 7px; margin-bottom: 8px; color: #75520a; border-radius: 5px; background: var(--gold-soft); font-size: 10px; font-weight: 700; }
.project-card .table-select { width: 100%; margin-bottom: 7px; }
.project-card .small-button { width: 100%; }

.pricing-layout { display: grid; grid-template-columns: 1.1fr .9fr; gap: 16px; align-items: start; }
.pricing-form, .pricing-result, .history-surface { padding: 20px; }
.form-grid { display: grid; gap: 12px; }
.two-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.field { display: grid; gap: 5px; color: var(--muted); font-size: 11px; font-weight: 700; }
.field input, .field select, .field textarea { padding: 9px 10px; font-weight: 500; }
.field textarea { min-height: 74px; resize: vertical; line-height: 1.45; }
.field-wide { grid-column: 1 / -1; }
.check-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin: 18px 0; padding: 14px; border: 1px solid var(--line); border-radius: 9px; }
.check-grid legend { padding: 0 5px; color: var(--muted); font-size: 11px; font-weight: 800; }
.check-grid label, .check-line { display: flex; align-items: start; gap: 8px; color: #48443b; font-size: 11px; line-height: 1.35; }
.check-grid input, .check-line input { margin: 1px 0 0; accent-color: var(--gold); }
.status-chip { display: inline-flex; align-items: center; width: max-content; padding: 4px 7px; border-radius: 999px; font-size: 10px; font-weight: 800; }
.status-chip.local { color: var(--success); background: var(--success-soft); }
.status-chip.active { color: #70520b; background: var(--gold-soft); }
.status-chip.pending { color: var(--warning); background: var(--warning-soft); }
.price-rows { display: grid; gap: 1px; margin: 6px 0 15px; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; }
.price-rows > div { display: flex; justify-content: space-between; gap: 12px; padding: 13px; background: #fcfcfa; }
.price-rows > div + div { border-top: 1px solid var(--line); }
.price-rows span { color: var(--muted); font-size: 12px; }
.price-rows strong { font-size: 13px; }
.price-rows .price-highlight { background: var(--gold-soft); }
.small-note { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.history-surface { margin-top: 16px; }

.kpi-domains { display: grid; gap: 10px; }
.kpi-domain { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: var(--surface); }
.kpi-heading { display: grid; grid-template-columns: 1fr minmax(170px, auto) 20px; align-items: center; gap: 12px; width: 100%; padding: 16px 18px; border: 0; background: var(--surface); color: var(--ink); text-align: left; }
.kpi-heading span { display: grid; gap: 3px; }
.kpi-heading strong { font-size: 14px; }
.kpi-heading small { color: var(--muted); font-size: 11px; line-height: 1.35; }
.kpi-heading em { color: #7d611c; font-size: 10px; font-style: normal; font-weight: 800; text-align: right; }
.kpi-heading b { color: var(--muted); font-size: 18px; font-weight: 400; }
.kpi-body { display: none; padding: 0 18px 18px; }
.kpi-domain.open .kpi-body { display: block; }
.kpi-domain.open .kpi-heading { border-bottom: 1px solid var(--line); }
.kpi-domain.open .kpi-heading b { transform: rotate(45deg); }
.inline-input { min-width: 130px; padding: 7px 8px; font-size: 12px; }

.integration-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.integration-card { display: flex; flex-direction: column; align-items: start; min-height: 230px; padding: 20px; }
.integration-card h2 { margin: 13px 0 8px; font-size: 16px; letter-spacing: -.025em; }
.integration-card p { margin: 0 0 16px; color: var(--muted); line-height: 1.55; }
.integration-card code { margin: auto 0 14px; padding: 7px 9px; color: #754f07; background: var(--gold-soft); border-radius: 5px; font-size: 11px; }

.modal { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; padding: 22px; background: rgba(22, 20, 15, .54); backdrop-filter: blur(3px); }
.modal.hidden { display: none; }
.modal-card { width: min(840px, 100%); max-height: min(860px, 92vh); overflow-y: auto; padding: 20px; border: 1px solid #d5d1c8; border-radius: 14px; background: #fff; box-shadow: 0 24px 80px rgba(0,0,0,.27); }
.modal-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 15px; border-bottom: 1px solid var(--line); }
.modal-top h2 { margin: 0; font-size: 19px; letter-spacing: -.03em; }
.icon-button { display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: var(--muted); font-size: 22px; line-height: 1; }
.modal-form { padding-top: 16px; }
.modal-note { padding: 9px 11px; margin-bottom: 14px; color: #765d1b; border-radius: 7px; background: var(--gold-soft); font-size: 11px; line-height: 1.4; }
.form-section { padding: 15px 0; border-top: 1px solid var(--line); }
.form-section:first-of-type { border-top: 0; padding-top: 0; }
.form-section h3 { margin: 0 0 11px; font-size: 13px; }
.publication-state { display: grid; gap: 4px; margin: 0 0 12px; padding: 10px 11px; border: 1px solid var(--line); border-radius: 8px; background: #faf9f5; }
.publication-state strong { font-size: 11px; }
.publication-state span,.publication-state small { color: var(--muted); font-size: 10px; line-height: 1.4; }
.publication-state.published { border-color: #cbe3d2; background: #f4fbf6; }
.publication-state.published strong { color: var(--success); }
.publication-state.empty { border-style: dashed; }
.publication-row { align-items: flex-start; }
.portal-item-actions { display: flex; align-items: center; gap: 7px; flex: 0 0 auto; }
.ticket-row small { max-width: 520px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ticket-thread { display: grid; gap: 8px; max-height: 330px; margin: 14px 0; padding: 2px; overflow: auto; }
.ticket-message { display: grid; gap: 4px; max-width: 82%; padding: 9px 10px; border: 1px solid #e6e2d7; border-radius: 8px; background: #faf9f5; }
.ticket-message.from-team { justify-self: end; border-color: #c9e0d0; background: #f3faf5; }
.ticket-message strong { font-size: 10px; }
.ticket-message p { margin: 0; font-size: 11px; line-height: 1.45; white-space: pre-wrap; }
.ticket-message small { color: var(--muted); font-size: 9px; }
.button-spinner { display: inline-block; width: 12px; height: 12px; margin-right: 7px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: spin .7s linear infinite; vertical-align: -2px; }
.is-loading { display: inline-flex !important; align-items: center; justify-content: center; cursor: wait; opacity: .82; }
@keyframes spin { to { transform: rotate(360deg); } }
.check-list { display: grid; gap: 9px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; }
.modal-actions { display: flex; justify-content: end; gap: 8px; padding-top: 16px; }
.toast { position: fixed; right: 24px; bottom: 24px; z-index: 60; max-width: min(380px, calc(100vw - 48px)); padding: 12px 15px; color: #fff; border-radius: 9px; background: var(--ink); box-shadow: 0 10px 30px rgba(0,0,0,.18); font-size: 12px; font-weight: 600; opacity: 0; pointer-events: none; transform: translateY(8px); transition: .2s ease; }
.toast.show { opacity: 1; transform: none; }
.toast.risk { background: var(--risk); }
.toast.success { background: var(--success); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

@media (max-width: 1100px) {
  .app-header { gap: 18px; }
  .metric-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .wms-board { grid-template-columns: repeat(3, minmax(230px, 1fr)); }
}

@media (max-width: 760px) {
  .app-header { align-items: flex-start; padding: 12px 18px; }
  .app-nav { width: 100%; padding-top: 1px; }
  .app-header { flex-wrap: wrap; }
  .app-main { width: min(100% - 28px, 1360px); padding-top: 26px; }
  .view-heading { align-items: start; flex-direction: column; gap: 14px; }
  .metric-grid, .crm-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metric-card { min-height: 96px; }
  .metric-card strong { font-size: 19px; }
  .two-column, .pricing-layout, .integration-grid { grid-template-columns: 1fr; }
  .toolbar { align-items: stretch; flex-direction: column; }
  .select-field select { min-width: 0; }
  .wms-board { grid-template-columns: repeat(6, minmax(230px, 1fr)); }
  .two-fields, .check-grid { grid-template-columns: 1fr; }
  .attention-item { grid-template-columns: 1fr; gap: 4px; }
  .attention-item span { grid-row: auto; }
  .kpi-heading { grid-template-columns: 1fr 18px; }
  .kpi-heading em { display: none; }
  .modal { padding: 10px; }
  .modal-card { padding: 16px; }
}

/* EffexAI OS product shell */
.hidden { display: none !important; }
.auth-screen { min-height: 100vh; display: grid; grid-template-columns: minmax(440px, .94fr) minmax(480px, 1.06fr); background: #11110f; }
.auth-panel { display: flex; min-height: 100vh; flex-direction: column; padding: 34px clamp(34px, 7vw, 116px); color: #f7f5ef; background: #11110f; }
.auth-brand { display: inline-flex; align-items: center; gap: 10px; width: max-content; color: #fff; text-decoration: none; }
.auth-brand .brand-mark { width: 38px; height: 38px; background: var(--gold); color: #17140c; }
.auth-brand strong, .auth-brand small { display: block; }
.auth-brand strong { font-size: 14px; letter-spacing: -.01em; }
.auth-brand small { color: #aaa69b; font-size: 10px; }
.auth-content { width: min(100%, 404px); margin: auto 0; padding: 54px 0; }
.auth-copy h1 { max-width: 380px; margin: 8px 0 11px; color: #fff; font-size: clamp(30px, 3.1vw, 44px); letter-spacing: -.06em; line-height: .98; }
.auth-copy > p:not(.eyebrow) { margin: 0 0 31px; color: #b2afa5; font-size: 14px; line-height: 1.55; }
.auth-screen .eyebrow { color: #dcb85e; }
.auth-tabs { display: flex; gap: 18px; margin-bottom: 23px; border-bottom: 1px solid #36342e; }
.auth-tab { padding: 0 1px 10px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: #949087; font-size: 12px; font-weight: 700; }
.auth-tab.active { color: #fff; border-color: var(--gold); }
.auth-form { display: grid; gap: 14px; }
.auth-form .field { color: #d0ccc2; }
.auth-form .field input, .auth-form .field select { padding: 11px 12px; border-color: #3d3a33; background: #1c1b18; color: #fff; }
.auth-form .field small { color: #8e8a80; font-size: 10px; font-weight: 500; line-height: 1.4; }
.auth-form .field input::placeholder { color: #817d73; }
.wide { display: flex; align-items: center; justify-content: space-between; width: 100%; margin-top: 5px; padding: 12px 14px; }
.wide span { font-size: 18px; line-height: 1; }
.auth-footnote { margin: 19px 0 0; color: #77736b; font-size: 10px; line-height: 1.45; }
.auth-visual { position: relative; min-height: 100vh; overflow: hidden; }
.auth-visual img { width: 100%; height: 100%; object-fit: cover; }
.visual-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(17,17,15,.8), transparent 40%), linear-gradient(0deg, rgba(10,10,8,.7), transparent 45%); }
.visual-caption { position: absolute; right: clamp(32px, 6vw, 90px); bottom: 54px; max-width: 340px; color: #fff; text-align: right; }
.visual-caption span { display: block; margin-bottom: 10px; color: #dfc474; font-size: 10px; font-weight: 800; letter-spacing: .15em; }
.visual-caption strong { display: block; font-size: clamp(21px, 2.3vw, 33px); letter-spacing: -.045em; line-height: 1.05; }
.visual-caption p { margin: 11px 0 0; color: #d1cbc0; font-size: 11px; }

.product-shell { display: grid; min-height: 100vh; grid-template-columns: 246px minmax(0, 1fr); background: #f7f6f2; }
.sidebar { position: sticky; top: 0; display: flex; height: 100vh; flex-direction: column; padding: 21px 13px 15px; color: #e9e6dc; background: #151513; }
.sidebar-brand { padding: 0 9px; color: #f4f3ef; }
.sidebar-brand .brand-mark { width: 34px; height: 34px; border-radius: 9px; background: var(--gold); color: #17140c; }
.sidebar-brand .brand-mark svg { width: 27px; height: 27px; }
.sidebar-brand small { color: #979389; }
.workspace-switcher { display: grid; grid-template-columns: 28px 1fr 12px; align-items: center; gap: 9px; margin: 31px 3px 20px; padding: 9px; border: 1px solid #34332e; border-radius: 9px; background: #20201d; }
.workspace-switcher small { display: block; color: #979389; font-size: 8px; font-weight: 800; letter-spacing: .1em; }
.workspace-switcher strong { display: block; max-width: 140px; overflow: hidden; color: #f3f2ec; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.workspace-avatar { display: grid; width: 28px; height: 28px; place-items: center; color: #1a1710; border-radius: 7px; background: #d3af58; font-size: 11px; font-weight: 800; }
.chevron { color: #979389; font-size: 15px; }
.sidebar .app-nav { display: grid; align-items: stretch; gap: 3px; overflow: visible; }
.nav-label { margin: 16px 9px 5px; color: #77746c; font-size: 9px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.sidebar .nav-btn { display: flex; align-items: center; gap: 9px; width: 100%; padding: 9px; color: #b5b1a8; border-radius: 7px; text-align: left; }
.sidebar .nav-btn:hover { color: #fff; background: #262521; }
.sidebar .nav-btn.active { color: #fff7df; background: #393323; box-shadow: inset 0 0 0 1px #5b4f31; }
.nav-icon { display: inline-grid; width: 16px; place-items: center; color: #d9b45b; font-size: 15px; }
.sidebar-footer { display: flex; align-items: center; gap: 7px; margin: auto 9px 2px; color: #969287; font-size: 10px; }
.security-dot { width: 6px; height: 6px; border-radius: 50%; background: #6dc18f; box-shadow: 0 0 0 3px rgba(109,193,143,.12); }
.product-content { min-width: 0; }
.product-topbar { position: sticky; top: 0; z-index: 15; display: flex; align-items: center; justify-content: space-between; gap: 20px; height: 66px; padding: 0 38px; border-bottom: 1px solid var(--line); background: rgba(247,246,242,.91); backdrop-filter: blur(16px); color: var(--muted); font-size: 11px; font-weight: 600; }
#breadcrumb span { margin: 0 7px; color: #b1ada2; }
.topbar-actions { display: flex; align-items: center; gap: 14px; }
.local-status { color: var(--success); font-size: 10px; }
.user-menu { display: flex; align-items: center; gap: 7px; padding: 4px; border: 0; background: transparent; color: var(--ink); text-align: left; }
.user-menu > span { display: grid; width: 29px; height: 29px; place-items: center; color: #1e1a0f; border-radius: 50%; background: #e9d69d; font-size: 11px; font-weight: 800; }
.user-menu strong, .user-menu small { display: block; }
.user-menu strong { max-width: 130px; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.user-menu small { color: var(--muted); font-size: 9px; }
.logout-button { display: grid; width: 29px; height: 29px; place-items: center; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: var(--muted); transform: rotate(180deg); }
.logout-button:hover { color: var(--risk); border-color: #e2b7b2; }
.product-shell .app-main { width: min(100% - 64px, 1440px); padding-top: 34px; }
.organization-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 16px; margin-bottom: 16px; }
.organization-card { min-height: 184px; padding: 20px; }
.organization-card h2 { margin: 6px 0 17px; font-size: 19px; letter-spacing: -.035em; }
.key-value { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 13px; margin: 0; }
.key-value div { display: grid; gap: 4px; }
.key-value dt { color: var(--muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.key-value dd { margin: 0; font-size: 12px; font-weight: 700; }
.secret-row { display: flex; align-items: center; gap: 8px; margin-top: 15px; }
.secret-row code { display: block; flex: 1; overflow: hidden; padding: 9px; color: #72560e; border-radius: 6px; background: var(--gold-soft); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.team-surface { padding: 20px; }
.team-count { padding: 5px 8px; color: var(--muted); border-radius: 999px; background: #f1f0eb; font-size: 10px; font-weight: 800; }
.role-badge { display: inline-flex; padding: 4px 7px; color: #66501a; border-radius: 999px; background: var(--gold-soft); font-size: 10px; font-weight: 800; }
.client-portals-surface { margin-bottom: 16px; padding: 20px; }
.client-portals-surface .surface-heading > div { max-width: 620px; }
.client-portal-list { display: grid; gap: 10px; }
.client-portal-card { display: grid; grid-template-columns: minmax(180px, 1.15fr) minmax(145px, .65fr) minmax(180px, 1fr) auto; gap: 18px; align-items: center; padding: 15px; border: 1px solid #e6e1d2; border-radius: 10px; background: linear-gradient(100deg, #fffdfa, #fbfaf5); }
.client-portal-card h3 { margin: 9px 0 3px; font-size: 14px; }
.client-portal-card p, .portal-latest small { display: block; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.portal-card-stats { display: grid; gap: 8px; }
.portal-card-stats span { display: flex; align-items: center; justify-content: space-between; gap: 7px; color: var(--muted); font-size: 10px; }
.portal-card-stats strong { color: #5e4914; font-size: 13px; }
.portal-card-stats .portal-alert strong { color: var(--risk); }
.portal-latest { display: grid; gap: 3px; min-width: 0; }
.portal-latest > span { color: #8c7b4d; font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.portal-latest strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.portal-card-actions { display: grid; gap: 6px; }
.portal-signal { display: grid; width: 100%; gap: 2px; margin: 0 0 8px; padding: 7px; color: #4f4c43; border: 1px solid #dfe5db; border-radius: 6px; background: #f5faf6; font-size: 9px; text-align: left; }
button.portal-signal:hover { border-color: #8fc19f; background: #eef7f0; }
.portal-signal span { color: var(--success); font-weight: 800; }
.portal-signal strong { color: #4a554c; font-size: 10px; }
.portal-signal.pending { border-color: #ecd792; background: #fffaf0; }
.portal-signal.pending span, .portal-signal.pending strong { color: #8a6919; }
.access-detail { display: grid; gap: 6px; margin: 13px 0; padding: 12px; border: 1px solid #e8e1cf; border-radius: 8px; background: #fffdf6; }
.access-detail > span { color: #8e7a46; font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.access-detail code { overflow: hidden; padding: 8px; color: #624c18; border-radius: 5px; background: #f7f0d9; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.portal-overview { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px; border: 1px solid #ebe5d7; border-radius: 8px; background: #fcfbf7; }
.portal-overview div { display: grid; gap: 4px; }
.portal-overview .eyebrow { font-size: 8px; }
.portal-overview strong { font-size: 13px; }
.portal-overview small { color: var(--muted); font-size: 11px; }
.portal-items, .activity-list { display: grid; gap: 7px; }
.portal-item { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px; border: 1px solid #ece9e0; border-radius: 7px; background: #fff; }
.portal-item > div { display: grid; gap: 2px; min-width: 0; }
.portal-item strong { font-size: 11px; }
.portal-item span, .portal-item small { color: var(--muted); font-size: 10px; line-height: 1.4; }
.report-history { margin-top: 12px; }
.activity-row { display: grid; grid-template-columns: 9px minmax(0, 1fr) auto; gap: 9px; align-items: start; padding: 9px 0; border-bottom: 1px solid #eeece6; }
.activity-row:last-child { border-bottom: 0; }
.activity-dot { width: 8px; height: 8px; margin-top: 4px; border-radius: 50%; background: #ccb46d; }
.activity-dot.meeting { background: #5c9c76; }
.activity-dot.approval { background: #d4933d; }
.activity-dot.email { background: #5c8ea7; }
.activity-dot.report { background: #8870ad; }
.activity-row div { display: grid; gap: 2px; }
.activity-row strong { font-size: 11px; }
.activity-row small, .activity-row time { color: var(--muted); font-size: 10px; line-height: 1.4; }
.activity-row time { text-align: right; white-space: nowrap; }
.product-shell.read-only .write-action, .product-shell.read-only .inline-input, .product-shell.read-only .table-select, .product-shell.read-only .criterion { opacity: .48; pointer-events: none; }
.ceo-brief { display: flex; align-items: center; justify-content: space-between; gap: 22px; margin: -4px 0 22px; padding: 17px 19px; color: #f4f1e9; border: 1px solid #413a28; border-radius: 13px; background: linear-gradient(105deg, #1c1b17, #28251e); box-shadow: 0 10px 25px rgba(30, 26, 15, .13); }
.ceo-brief-main { display: flex; align-items: center; gap: 13px; min-width: 0; }
.ceo-signal { display: grid; flex: 0 0 auto; width: 33px; height: 33px; place-items: center; color: #31260f; border-radius: 10px; background: #d4af56; font-size: 16px; }
.ceo-signal.attention { color: #fff; background: #b65b3e; }
.ceo-brief p { margin: 0 0 3px; color: #cbb77a; font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.ceo-brief-main strong { display: block; overflow: hidden; max-width: 620px; font-size: 13px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.ceo-brief-main span:not(.ceo-signal) { display: block; margin-top: 3px; color: #b8b3a5; font-size: 10px; }
.ceo-brief-metrics { display: flex; align-items: center; gap: 16px; flex: 0 0 auto; }
.ceo-brief-metrics div { display: grid; gap: 2px; }
.ceo-brief-metrics span { color: #aaa496; font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.ceo-brief-metrics strong { color: #fff; font-size: 12px; }
.ceo-brief .small-button { color: #2d2615; border-color: #d4af56; background: #d4af56; }
.agent-count { display: inline-flex; width: max-content; padding: 7px 9px; color: #735718; border: 1px solid #e4cd8d; border-radius: 999px; background: var(--gold-soft); font-size: 10px; font-weight: 800; }
.agent-workforce { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.agent-card { display: flex; min-height: 235px; flex-direction: column; padding: 18px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); box-shadow: 0 7px 21px rgba(33, 27, 12, .025); }
.agent-card-top { display: grid; grid-template-columns: 38px 1fr auto; align-items: center; gap: 10px; }
.agent-orb { display: grid; width: 38px; height: 38px; place-items: center; color: #2b230f; border-radius: 11px; background: #dec16e; box-shadow: inset 0 0 0 1px rgba(76, 57, 16, .15); font-size: 14px; font-weight: 900; }
.agent-orb.growth { background: #c7dbc1; color: #1f472f; }
.agent-orb.flow { background: #c6d7e7; color: #27465c; }
.agent-orb.nexus { background: #e6d19d; color: #684d0e; }
.agent-orb.atlas { background: #d8cce8; color: #513a71; }
.agent-orb.bridge { background: #c7dfdb; color: #1d514b; }
.agent-state { display: block; color: #92762f; font-size: 8px; font-weight: 900; letter-spacing: .11em; }
.agent-card h2 { margin: 2px 0 0; font-size: 15px; letter-spacing: -.035em; }
.agent-card h2 small { color: var(--muted); font-size: 11px; font-weight: 600; }
.agent-presence { display: inline-flex; align-items: center; gap: 5px; color: var(--success); font-size: 9px; font-weight: 700; white-space: nowrap; }
.agent-presence i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.agent-card > p { margin: 18px 0 15px; color: var(--muted); line-height: 1.5; }
.agent-pulse { display: grid; gap: 5px; padding: 10px; border: 1px solid #ece8db; border-radius: 8px; background: #faf9f5; }
.agent-pulse span { color: #8a8579; font-size: 9px; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
.agent-pulse strong { font-size: 11px; line-height: 1.4; }
.agent-card-footer { display: flex; align-items: end; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 14px; }
.agent-card-footer > span { display: grid; gap: 3px; color: #514d43; font-size: 10px; font-weight: 700; }
.agent-card-footer small { color: #918d82; font-size: 8px; font-weight: 900; letter-spacing: .08em; }
.agent-principles { display: grid; grid-template-columns: .7fr 1.3fr; gap: 24px; align-items: start; margin-top: 16px; padding: 20px; }
.agent-principles h2 { margin: 4px 0 0; font-size: 17px; letter-spacing: -.03em; }
.agent-principles ol { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; margin: 0; padding: 0; list-style: none; }
.agent-principles li { display: grid; gap: 5px; }
.agent-principles li strong { font-size: 11px; }
.agent-principles li span { color: var(--muted); font-size: 11px; line-height: 1.45; }
.agent-room { display: grid; grid-template-columns: 39px minmax(0, 1fr) minmax(185px, .6fr); gap: 13px; align-items: center; margin: -4px 0 20px; padding: 14px 16px; border: 1px solid #e7dfca; border-radius: 11px; background: linear-gradient(110deg, #fffdf7, #f8f3e7); }
.agent-room .agent-orb { width: 39px; height: 39px; }
.agent-room h2 { margin: 3px 0; font-size: 14px; letter-spacing: -.025em; }
.agent-room p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.agent-room-rule { display: grid; gap: 4px; padding-left: 15px; border-left: 1px solid #e1d8c1; }
.agent-room-rule span { color: #8e7a46; font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.agent-room-rule strong { color: #413a29; font-size: 11px; line-height: 1.35; }
.ticket-command-surface { padding: 20px; }
.ticket-inbox-list { display: grid; gap: 9px; }
.ticket-inbox-row { display: grid; gap: 9px; padding: 14px; border: 1px solid #e9e4d8; border-radius: 10px; background: #fffdfa; }
.ticket-inbox-row.needs-action { border-left: 4px solid #d5a83e; }
.ticket-inbox-top { display: flex; align-items: center; gap: 7px; min-width: 0; }
.ticket-code { color: #8c7437; font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.ticket-company { overflow: hidden; color: var(--muted); font-size: 10px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.ticket-inbox-body { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: end; }
.ticket-inbox-body h3 { margin: 0 0 4px; font-size: 13px; letter-spacing: -.015em; }
.ticket-inbox-body p, .ticket-inbox-body small { display: block; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.45; }
.ticket-inbox-body small { max-width: 760px; margin-top: 6px; color: #504c43; }
.ticket-inbox-meta { display: grid; justify-items: end; gap: 6px; min-width: 125px; }
.ticket-inbox-meta time { color: var(--muted); font-size: 9px; }
.ticket-state, .contract-state { display: inline-flex; width: max-content; padding: 4px 7px; border-radius: 999px; color: #765a14; background: #fff2cb; font-size: 9px; font-weight: 850; }
.ticket-state.answered, .contract-state.signed { color: var(--success); background: var(--success-soft); }
.ticket-state.closed, .contract-state.expired, .contract-state.cancelled { color: #77736a; background: #f0efeb; }
.ticket-state.in_progress, .contract-state.review { color: #70520b; background: var(--gold-soft); }
.contract-state.sent { color: #35617a; background: #e9f3f8; }
.contract-state.draft { color: #77736a; background: #f0efeb; }
.contract-command-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(330px, .85fr); gap: 16px; align-items: start; }
.contract-library, .contract-form { padding: 20px; }
.contract-list { display: grid; gap: 10px; }
.contract-row { display: grid; gap: 10px; padding: 14px; border: 1px solid #e7e2d5; border-radius: 10px; background: #fffdfa; }
.contract-row-head { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.contract-row h3 { margin: 4px 0 3px; font-size: 14px; letter-spacing: -.02em; }
.contract-row p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.45; }
.contract-summary { color: #4f4a40 !important; font-size: 11px !important; }
.contract-row-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.contract-row-meta span { padding: 5px 7px; color: #706957; border-radius: 6px; background: #f5f3ed; font-size: 9px; font-weight: 750; }
.contract-feedback { display: grid; gap: 2px; padding: 9px 10px; border-left: 3px solid #6aa982; border-radius: 6px; background: #f3faf5; }
.contract-feedback strong { color: #276040; font-size: 10px; }
.contract-feedback span, .contract-feedback small { color: #576558; font-size: 9px; line-height: 1.4; }
.contract-row-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.form-muted { opacity: .58; }

@media (max-width: 980px) {
  .auth-screen { grid-template-columns: 1fr; }
  .auth-visual { display: none; }
  .auth-panel { min-height: 100vh; }
  .product-shell { grid-template-columns: 205px minmax(0, 1fr); }
  .product-topbar { padding: 0 24px; }
  .product-shell .app-main { width: min(100% - 42px, 1440px); }
  .ceo-brief { align-items: start; flex-direction: column; }
  .agent-room { grid-template-columns: 39px 1fr; }
  .agent-room-rule { grid-column: 2; padding: 9px 0 0; border-top: 1px solid #e1d8c1; border-left: 0; }
  .contract-command-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .auth-panel { padding: 24px; }
  .auth-content { margin: auto; }
  .product-shell { display: block; }
  .sidebar { position: static; height: auto; padding: 14px; }
  .workspace-switcher, .sidebar-footer, .nav-label { display: none; }
  .sidebar .app-nav { display: flex; flex-flow: row nowrap; overflow-x: auto; margin-top: 15px; }
  .sidebar .nav-btn { width: max-content; padding: 8px; }
  .sidebar .nav-btn .nav-icon { display: none; }
  .product-topbar { height: 57px; padding: 0 14px; }
  #breadcrumb, .local-status, .logout-button { display: none; }
  .topbar-actions { margin-left: auto; }
  .product-shell .app-main { width: min(100% - 28px, 1440px); padding-top: 26px; }
  .organization-grid { grid-template-columns: 1fr; }
  .organization-card { min-height: auto; }
  .ceo-brief-metrics { align-items: start; flex-wrap: wrap; }
  .ceo-brief-main strong { white-space: normal; }
  .agent-workforce { grid-template-columns: 1fr; }
  .agent-card-top { grid-template-columns: 38px 1fr; }
  .agent-presence { grid-column: 2; }
  .agent-principles { grid-template-columns: 1fr; }
  .agent-principles ol { grid-template-columns: 1fr; }
  .agent-room { grid-template-columns: 36px 1fr; padding: 13px; }
  .agent-room .agent-orb { width: 36px; height: 36px; }
  .ticket-inbox-body { grid-template-columns: 1fr; }
  .ticket-inbox-meta { justify-items: start; grid-template-columns: auto auto; align-items: center; }
  .contract-row-head { align-items: start; flex-direction: column; }
}