/* R2: semantic identity tokens. Loaded in the head after the legacy layers.
   Operational success/warning/error colors remain independent of brand blue. */
/* Event stock: preserve contrast on pointer and keyboard interaction. */
html .view-shell .ei-panel-head {
  background: var(--r2-deep-blue);
  color: var(--r2-white);
}
html .view-shell .ei-stock-table thead th,
html .view-shell .ei-split--open .ei-panel--right .ed-itens-table thead th {
  background: var(--surface-muted);
  color: var(--text);
  border-bottom-color: var(--line);
}
html .view-shell .ei-srow td { border-bottom-color: var(--line); }
html .view-shell .ei-srow:hover td,
html .view-shell .ei-srow:focus-within td { background: var(--surface-hover); }
html .view-shell .ei-srow-name { color: var(--text); }
html .view-shell .ei-srow-brand { color: var(--muted); }
html .view-shell .ei-add-arrow:hover {
  background: var(--action);
  color: var(--on-action);
  border-color: var(--action);
}
:root {
  --r2-graphite: #222831;
  --r2-deep-blue: #1f3a5f;
  --r2-blue: #5aa9e6;
  --r2-white: #eaf4f4;
  --action: var(--r2-blue);
  --action-hover: #7cbbeb;
  --action-pressed: #4797d4;
  --on-action: var(--r2-graphite);
  --bg: #f0f4f7;
  --panel: #ffffff;
  --panel-soft: #f5f8fa;
  --surface-muted: #e7eef4;
  --surface-hover: #dde8f1;
  --text: #222831;
  --text-soft: #374957;
  --muted: #526575;
  --ink: var(--text);
  --graphite: var(--text-soft);
  --line: #cbd6df;
  --line-strong: #718595;
  --control-border: #718595;
  --sidebar: #e7eef4;
  --sidebar-dark: #dce6ee;
  --sidebar-hover: #d7e3ed;
  --link-accent: #205e90;
  --brand-soft: #dcebf7;
  --selection: var(--r2-deep-blue);
  --on-selection: var(--r2-white);
  --focus: #205e90;
  --orange: var(--action);
  --orange-deep: var(--action-pressed);
  --cyan: var(--link-accent);
  --blue: var(--link-accent);
  --brand: var(--link-accent);
  --surface: var(--panel);
  --border: var(--line);
  --info-soft: var(--brand-soft);
  --neutral-soft: var(--surface-muted);
  --shadow: 0 12px 32px rgb(31 58 95 / 8%);
  --shadow-soft: 0 4px 14px rgb(31 58 95 / 6%);
}
html[data-theme="dark"] {
  /* Reference: deep stage-like backdrop with restrained graphite surfaces. */
  --bg: #0b141c;
  --panel: #14212d;
  --panel-soft: #101c27;
  --surface-muted: #233547;
  --surface-hover: #33465a;
  --text: var(--r2-white);
  --text-soft: #d0dde5;
  --muted: #acbdca;
  --ink: var(--text);
  --graphite: var(--text-soft);
  --line: #293b4c;
  --line-strong: #8395a5;
  --control-border: #8395a5;
  --sidebar: #0c1720;
  --sidebar-dark: #0e161e;
  --sidebar-hover: #243344;
  --link-accent: var(--r2-blue);
  --brand-soft: var(--r2-deep-blue);
  --focus: var(--r2-blue);
  --blue: var(--r2-blue);
  --info-soft: var(--brand-soft);
  --neutral-soft: var(--surface-muted);
  --shadow: 0 12px 32px rgb(0 0 0 / 24%);
  --shadow-soft: 0 4px 14px rgb(0 0 0 / 18%);
}
html[data-theme="dark"] .view-shell :is(.summary-card,.kpi-card,.chart-card,.fin-kpi) {
  background: var(--panel);
  border-color: var(--line);
  box-shadow: var(--shadow-soft);
}
html[data-theme="dark"] .platform-header,
html[data-theme="dark"] .brand-strip { background: var(--sidebar); }
/* Solid layers keep text readable independently of content behind them. */
html .platform-header { background: var(--panel); backdrop-filter: none; }
html[data-theme] .brand-strip { background: var(--r2-graphite); }
html .brand-strip .brand-name { color: var(--r2-white); }
html .brand-strip strong img,
html[data-theme] .brand-strip strong img,
html[data-theme] .profile-avatar img,
#loginOverlay .login-badge img { filter: none; opacity: 1; object-fit: contain; }
html .profile-avatar:has(img), #loginOverlay .login-badge { background: var(--r2-graphite); }
html[data-theme] .nav-button.is-active,
html[data-theme] .nav-sub-item.is-active { background: var(--selection); color: var(--on-selection); box-shadow: inset 3px 0 var(--r2-blue); }
html .nav-button.is-active :is(.nav-count,.nav-chevron) { color: var(--on-selection); background: transparent; }
html[data-theme] .nav-button.is-active .nav-icon img { filter: brightness(0) invert(1); opacity: 1; }
html .view-shell :is(.inv-tab,.evt-secao-tab,.evt-tab,.ed-cron-tab,.inv-novo-tab-btn).is-active,
html .fin-module .fin-tabs button.is-active,
html .fin-module .fin-tabs button[aria-current=page] { background: var(--selection) !important; color: var(--on-selection) !important; border-color: var(--focus) !important; }
html .view-shell .inv-tab.is-active .inv-badge { background: var(--selection); color: var(--on-selection); }
html :is(input:not([type=checkbox]):not([type=radio]),select,textarea) { border-color: var(--control-border); }
html :is(input,select,textarea)::placeholder { color: var(--muted); opacity: 1; }
html :is(input[type=checkbox],input[type=radio]) { accent-color: var(--brand); }
html :is(button,a,input,select,textarea,summary,[tabindex]):focus-visible { outline: 3px solid var(--focus) !important; outline-offset: 3px; }
html :is(button,.btn):disabled { cursor: not-allowed; opacity: .55; box-shadow: none; }
html :is(.btn--primary,.btn--add,.me-btn--submit):not(:disabled):active { background: var(--action-pressed); color: var(--on-action); }
html :is(td,time,.summary-value,.kpi-value) { font-variant-numeric: tabular-nums; }
html .dchart-line, html .chart-line { stroke: var(--link-accent); }
html .dchart-dot, html .chart-dot { fill: var(--link-accent); }
html .view-shell .inv-btn-add { background: var(--action); color: var(--on-action); }
html .view-shell .inv-btn-add:hover { background: var(--action-hover); }
html .view-shell :is(.tab-btn,.filter-chip,.perf-month-btn).is-active,
html .view-shell .cal-btn--today { background: var(--selection); color: var(--on-selection); border-color: var(--focus); }
html .view-shell :is(.cal-cell,.calendar-day).is-today { background: var(--brand-soft); }
html .view-shell .cal-cell.is-today .cal-day-num { background: var(--action); color: var(--on-action); }
html .view-shell :is(.status--success,.inv-status-chip--ok) { color: var(--green) !important; }
html .profile-avatar { background: var(--brand-soft); border-color: var(--line); }
html .view-shell .inv-tab.is-active .inv-badge { color: var(--on-selection) !important; }
html .view-shell .cal-event-date span { color: var(--muted); opacity: 1; }
html .view-shell .tab-count--blue { background: var(--surface-muted) !important; color: var(--text-soft) !important; }
html .view-shell .evt-tab.is-active .evt-badge,
html .view-shell .tab-btn.is-active .tab-count { background: var(--selection) !important; color: var(--on-selection) !important; }
/* Access screen follows the selected theme; the official logo keeps its dark backing. */
#loginOverlay { --login-ink: var(--text); --login-muted: var(--muted); --login-mint: var(--link-accent); background: var(--bg); color-scheme: inherit; }
#loginOverlay .login-panel { background: var(--panel); border-color: var(--line); box-shadow: var(--shadow); backdrop-filter: none; -webkit-backdrop-filter: none; }
#loginOverlay .login-badge { border-color: var(--line-strong); box-shadow: none; }
#loginOverlay .login-panel__form .login-kicker { color: var(--link-accent) !important; }
#loginOverlay input:not([type=checkbox]) { background: var(--panel-soft); border-color: var(--control-border); color: var(--text); box-shadow: none; }
#loginOverlay input::placeholder { color: var(--muted); }
#loginOverlay input:focus { border-color: var(--focus); outline-color: var(--focus); box-shadow: none; }
#loginOverlay input:-webkit-autofill { -webkit-text-fill-color: var(--text); box-shadow: 0 0 0 1000px var(--panel-soft) inset; caret-color: var(--text); }
#loginOverlay :is(.login-eye,.login-field>svg) { color: var(--text-soft); }
#loginOverlay .login-submit { background: var(--action); color: var(--on-action); border-color: var(--action); box-shadow: none; }
#loginOverlay .login-submit:hover { background: var(--action-hover); border-color: var(--action-hover); transform: none; }
#loginOverlay .login-submit:active { background: var(--action-pressed); }
#loginOverlay :is([data-mobile-install],.login-recovery) { background: var(--panel-soft); border-color: var(--control-border); }
#loginOverlay .login-corner { color: var(--muted); }
#loginOverlay .login-feedback { color: var(--danger-text); }
#loginOverlay .login-server-note { color: var(--warning-text); }
@media (prefers-reduced-motion: reduce) { html *, html *::before, html *::after { scroll-behavior: auto; transition-duration: 0s; } }

/* Glass finish: CSS only, with opaque fallback. Data surfaces stay solid.
   No animated filters or pointer tracking: stable during daily operation. */
:root {
  --glass-fill: rgb(247 250 253 / 92%);
  --glass-edge: rgb(113 133 149 / 48%);
  --glass-reflection: rgb(255 255 255 / 70%);
  --glass-tint: rgb(90 169 230 / 8%);
  --glass-shadow: 0 10px 30px rgb(31 58 95 / 10%);
}
html[data-theme="dark"] {
  --glass-fill: rgb(25 35 46 / 92%);
  --glass-edge: rgb(172 189 202 / 26%);
  --glass-reflection: rgb(234 244 244 / 14%);
  --glass-tint: rgb(90 169 230 / 7%);
  --glass-shadow: 0 12px 32px rgb(0 0 0 / 25%);
}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  html[data-theme] .view-shell :is(.modal-box,.ed-modal-box,.inv-qr-modal) {
    background: linear-gradient(135deg, var(--glass-tint), transparent 55%), var(--glass-fill) !important;
    backdrop-filter: blur(18px) saturate(115%);
    -webkit-backdrop-filter: blur(18px) saturate(115%);
    border-color: var(--glass-edge) !important;
    box-shadow: inset 0 1px 0 var(--glass-reflection), var(--glass-shadow) !important;
  }
  html[data-theme] .view-shell :is(.modal-box,.ed-modal-box,.inv-qr-modal) {
    border-radius: 20px;
  }
  html[data-theme] .nav-button,
  html[data-theme] .nav-sub-item { border-radius: 12px; }
  html[data-theme] .nav-button:hover,
  html[data-theme] .nav-sub-item:hover {
    box-shadow: inset 0 1px 0 var(--glass-reflection);
  }
  html[data-theme] .nav-button.is-active,
  html[data-theme] .nav-sub-item.is-active {
    box-shadow: inset 3px 0 var(--r2-blue), inset 0 1px 0 var(--glass-reflection);
  }
}
/* Honor OS accessibility preferences and preserve low-cost opaque surfaces. */
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more), (forced-colors: active) {
  html[data-theme] .view-shell :is(.modal-box,.ed-modal-box,.inv-qr-modal) {
    background: var(--panel) !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    box-shadow: none !important;
    border-color: var(--control-border) !important;
  }
}

/* Reference finish: depth belongs to the surfaces, not to neon outlines. */
:root {
  --metric-top: var(--panel);
  --metric-base: var(--panel-soft);
  --metric-icon-bg: var(--brand-soft);
  --surface-reflection: rgb(255 255 255 / 65%);
}
html[data-theme="dark"] {
  --metric-top: #1e3347;
  --metric-base: #13202b;
  --metric-icon-bg: #294154;
  --surface-reflection: rgb(182 213 236 / 12%);
}
html[data-theme="dark"] .platform-header,
html[data-theme="dark"] .brand-strip,
html[data-theme="dark"] .sidebar {
  background: var(--sidebar);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
}
html[data-theme="dark"] .workspace {
  background: radial-gradient(ellipse 85% 440px at 70% 0, rgb(31 58 95 / 38%), transparent), var(--bg);
}
html .view-shell .kpi-grid { gap: 16px; }
html .view-shell .kpi-grid > .kpi-card {
  min-height: 188px;
  padding: 22px;
  border-radius: 16px;
  background: linear-gradient(155deg, var(--metric-top), var(--metric-base));
  border: 1px solid var(--line);
  box-shadow: inset 0 1px 0 var(--surface-reflection), 0 8px 22px rgb(0 0 0 / 12%);
}
html .view-shell .kpi-grid > .kpi-card::after { display: none; }
.r2-metric-icon {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  margin-bottom: 15px;
  border-radius: 9px;
  background: var(--metric-icon-bg);
  color: var(--text);
  box-shadow: inset 0 1px 0 var(--surface-reflection);
}
.r2-metric-icon .app-icon { width: 21px; height: 21px; }
html .view-shell .kpi-grid .kpi-label { color: var(--text-soft); font-size: 13px; }
html .view-shell .kpi-grid .kpi-value {
  color: var(--text) !important;
  font-size: clamp(30px, 2.6vw, 38px);
  font-weight: 650;
  line-height: 1.2;
  margin: 8px 0 12px;
}
html .view-shell :is(.section-card,.chart-card,.fin-kpi) {
  border-radius: 16px;
  box-shadow: inset 0 1px 0 var(--surface-reflection), var(--shadow-soft);
}
html .view-shell .section-card__head {
  padding: 20px 22px;
  color: var(--text);
  font-size: 12px;
  letter-spacing: .035em;
  border-bottom-color: var(--line);
}
html .view-shell .task-link { color: var(--link-accent); }
html .view-shell .alert-count--primary { background: var(--action); color: var(--on-action); }
html .view-shell .alert-count--warning { color: var(--warning-text); background: var(--warning-soft); }
html .view-shell :is([data-pending-refresh],[data-pending-open],[data-pending-purchase]) {
  background: var(--panel-soft);
  color: var(--text);
  border: 1px solid var(--control-border);
}
@media (max-width: 600px) {
  html .view-shell .kpi-grid > .kpi-card { padding: 18px; min-height: 168px; }
  html .view-shell .dash-bottom { grid-template-columns: minmax(0, 1fr); }
}