@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Syne:wght@400;600;700;800&display=swap');

  /* ==========================================================================
     DESIGN TOKENS
     ========================================================================== */
  :root {
    --bg:       #0e0e10;
    --surface:  #1a1a1f;
    --surface2: #242429;
    --border:   #2e2e38;
    --accent:   #7fff6e;   /* green  — success, active, primary CTA */
    --accent2:  #6ec8ff;   /* blue   — info, links */
    --accent3:  #ffd06e;   /* amber  — warnings, pending, unclassified */
    --danger:   #ff6e6e;   /* red    — errors, reject */
    --text:     #e8e8f0;
    --muted:    #888896;
    --radius:   10px;
  }

  * { box-sizing: border-box; margin: 0; padding: 0; }

  body {
    background: var(--bg);
    color: var(--text);
    font-family: 'Syne', sans-serif;
    min-height: 100vh;
    padding: 28px 20px;
  }

  /* ==========================================================================
     LAYOUT
     ========================================================================== */
  .container { max-width: 1000px; margin: 0 auto; }

  header { text-align: center; margin-bottom: 28px; }
  header h1 {
    font-size: 2rem; font-weight: 800; letter-spacing: -1px;
    background: linear-gradient(135deg, var(--accent), var(--accent2));
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  }
  header p { color: var(--muted); margin-top: 6px; font-size: 0.85rem; font-family: 'DM Mono', monospace; }

  /* ==========================================================================
     CARDS
     ========================================================================== */
  .card {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 20px; margin-bottom: 16px;
  }
  .card-title {
    font-size: 0.7rem; font-weight: 600; letter-spacing: 2px;
    text-transform: uppercase; color: var(--accent);
    margin-bottom: 14px; font-family: 'DM Mono', monospace;
  }
  .card-header {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 14px;
  }
  .card-header .card-title { margin-bottom: 0; }

  /* ==========================================================================
     TOP BAR
     ========================================================================== */
  #top-bar {
    display: flex; align-items: center; justify-content: space-between;
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 10px 15px; margin-bottom: 10px;
  }
  #top-bar .left { display: flex; align-items: center; gap: 12px; }
  #top-bar .right { display: flex; gap: 8px; align-items: center; }
  .app-title { font-size: 15px; font-weight: 700; }

  /* ==========================================================================
     SYNC STATUS BAR
     ========================================================================== */
  #sync-bar {
    display: flex; align-items: center; justify-content: space-between;
    background: var(--surface2); border: 1px solid var(--border);
    border-radius: 8px; padding: 7px 14px; margin-bottom: 10px;
    font-family: 'DM Mono', monospace; font-size: 0.75rem; color: var(--muted);
  }
  #sync-bar .sync-left  { display: flex; align-items: center; gap: 14px; }
  @keyframes progress-indeterminate {
    0%   { transform: translateX(-100%); width: 40%; }
    50%  { width: 60%; }
    100% { transform: translateX(260%); width: 40%; }
  }
  .progress-indeterminate {
    animation: progress-indeterminate 1.4s ease infinite !important;
    width: 40% !important;
    background: var(--accent2) !important;
  }
  .sync-dot {
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--muted); transition: background 0.3s; flex-shrink: 0;
  }
  .sync-dot.connected { background: var(--accent); }
  .sync-dot.syncing   { background: var(--accent3); animation: pulse 1s infinite; }
  .sync-dot.error     { background: var(--danger); }
  @keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.3} }
  @keyframes pulse-bar { 0%{opacity:0.4} 100%{opacity:1} }

  /* ==========================================================================
     STAT CARDS
     ========================================================================== */
  .stats-grid {
    display: grid; grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 10px; margin-bottom: 14px;
  }
  .stat-card {
    background: var(--surface2); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 13px;
  }
  .stat-card .value { font-size: 1.4rem; font-weight: 800; }
  .stat-card .label {
    font-size: 0.68rem; color: var(--muted); font-family: 'DM Mono', monospace;
    text-transform: uppercase; letter-spacing: 1px; margin-top: 2px;
  }
  .stat-card.warn .value { color: var(--accent3); }

  /* ==========================================================================
     BUTTONS
     ========================================================================== */
  .btn {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 9px 18px; border-radius: 8px; border: none;
    font-family: 'Syne', sans-serif; font-weight: 600; font-size: 0.85rem;
    cursor: pointer; transition: all 0.15s;
  }
  .btn:disabled { opacity: 0.4; cursor: not-allowed; }
  .btn-primary  { background: var(--accent); color: #0e0e10; }
  .btn-primary:hover:not(:disabled) { background: #a0ffb0; }
  .btn-secondary { background: var(--surface2); color: var(--text); border: 1px solid var(--border); }
  .btn-secondary:hover:not(:disabled) { border-color: var(--muted); }
  .btn-warn   { background: #2a2010; color: var(--accent3); border: 1px solid #4a3820; }
  .btn-warn:hover:not(:disabled) { background: #3a2e14; }
  .btn-danger { background: #2a1010; color: var(--danger); border: 1px solid #4a2020; }
  .btn-danger:hover:not(:disabled) { background: #3a1818; }
  .btn-sm { padding: 5px 12px; font-size: 0.76rem; }
  .btn-xs { padding: 3px 9px; font-size: 0.7rem; }

  /* ==========================================================================
     SETTINGS CARD
     ========================================================================== */
  .settings-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
  .field-label {
    display: block; font-size: 0.7rem; color: var(--muted);
    font-family: 'DM Mono', monospace; text-transform: uppercase;
    letter-spacing: 1px; margin-bottom: 6px;
  }
  .field-input {
    width: 100%; background: var(--surface2); border: 1px solid var(--border);
    border-radius: 6px; color: var(--text); padding: 8px 12px;
    font-family: 'DM Mono', monospace; font-size: 0.78rem; outline: none;
  }
  .field-input:focus { border-color: var(--accent2); }
  .field-input::placeholder { color: var(--muted); }
  .field-hint { font-size: 0.7rem; color: var(--muted); font-family: 'DM Mono', monospace; margin-top: 5px; }
  .field-hint a { color: var(--accent2); }

  /* ==========================================================================
     UPLOAD
     ========================================================================== */
  .upload-zone {
    border: 2px dashed var(--border); border-radius: var(--radius);
    padding: 32px 20px; text-align: center; cursor: pointer;
    transition: all 0.2s; background: var(--surface2);
  }
  .upload-zone:hover, .upload-zone.drag-over { border-color: var(--accent); background: #1a2a1a; }
  .upload-zone .icon { font-size: 2rem; margin-bottom: 8px; }
  .upload-zone h3 { font-size: 0.95rem; margin-bottom: 4px; }
  .upload-zone p { color: var(--muted); font-size: 0.78rem; font-family: 'DM Mono', monospace; }
  #file-input { display: none; }

  .file-list { display: flex; flex-direction: column; gap: 6px; margin-top: 12px; }
  .file-item {
    display: flex; align-items: center; justify-content: space-between;
    background: var(--surface2); border: 1px solid var(--border);
    border-radius: 6px; padding: 8px 12px;
    font-family: 'DM Mono', monospace; font-size: 0.76rem;
  }
  .file-item .fname { color: var(--accent2); }
  .file-item .fsize { color: var(--muted); }
  .file-item .fremove { cursor: pointer; color: var(--danger); }

  /* Format selector */
  .format-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px,1fr)); gap: 8px; }
  .format-btn {
    background: var(--surface2); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 12px 14px; cursor: pointer; transition: all 0.15s;
  }
  .format-btn:hover  { border-color: var(--muted); }
  .format-btn.active { border-color: var(--accent); background: #1a2a1a; }
  .format-btn .label { font-size: 0.85rem; font-weight: 600; }
  .format-btn .desc  { font-size: 0.7rem; color: var(--muted); font-family: 'DM Mono', monospace; margin-top: 3px; }

  /* Connections row — Settings → Connections */
  .conn-row {
    display: flex; align-items: center; justify-content: space-between;
    gap: 16px; padding: 12px 14px; background: var(--surface2);
    border: 1px solid var(--border); border-radius: var(--radius);
  }
  .conn-provider { display: flex; align-items: center; gap: 12px; min-width: 0; }
  .conn-icon     { font-size: 1.5rem; line-height: 1; }
  .conn-title    { font-size: 0.9rem; font-weight: 600; }
  .conn-sub      { font-size: 0.72rem; color: var(--muted); font-family: 'DM Mono', monospace; margin-top: 2px; }
  .conn-actions  { display: flex; gap: 6px; flex-shrink: 0; }
  .conn-error    { color: var(--danger); font-size: 0.78rem; padding: 8px 0; }

  /* Scan controls — inline form under the connected Gmail row. */
  .conn-scan-controls {
    display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end;
    padding: 10px 14px; margin-top: 8px;
    background: var(--surface2); border: 1px solid var(--border); border-radius: var(--radius);
  }
  .conn-scan-field { display: flex; flex-direction: column; gap: 4px; font-size: 0.72rem; color: var(--muted); }
  .conn-scan-field span { font-family: 'DM Mono', monospace; }
  .conn-scan-field input, .conn-scan-field select {
    background: var(--surface); border: 1px solid var(--border); border-radius: 6px;
    color: var(--text); padding: 6px 8px; font-family: 'DM Mono', monospace; font-size: 0.78rem;
  }
  .conn-scan-field input { color-scheme: dark; }
  .conn-vendor-checks { display: flex; flex-direction: column; gap: 4px; }
  .conn-vendor-checks label { display: flex; align-items: center; gap: 5px; font-size: 0.78rem;
    color: var(--text); font-family: 'DM Mono', monospace; cursor: pointer; }
  .conn-vendor-checks input[type="checkbox"] { accent-color: var(--accent); }

  /* Progress / log */
  .progress-bar  { height: 4px; background: var(--border); border-radius: 2px; overflow: hidden; margin: 10px 0; }
  .progress-fill { height: 100%; background: linear-gradient(90deg, var(--accent), var(--accent2)); border-radius: 2px; transition: width 0.4s; }
  .progress-text { font-family: 'DM Mono', monospace; font-size: 0.74rem; color: var(--muted); }
  .log {
    font-family: 'DM Mono', monospace; font-size: 0.72rem; color: var(--muted);
    max-height: 120px; overflow-y: auto; background: var(--surface2);
    border-radius: 8px; padding: 10px 12px; border: 1px solid var(--border); margin-top: 8px;
  }
  .log .ok   { color: var(--accent); }
  .log .err  { color: var(--danger); }
  .log .info { color: var(--accent2); }
  .log .warn { color: var(--accent3); }

  /* ==========================================================================
     PENDING RULES BANNER
     ========================================================================== */
  #pending-banner {
    background: #1e1a0e; border: 1px solid #4a3820;
    border-radius: var(--radius); padding: 16px; margin-bottom: 16px;
  }
  #pending-banner .banner-header {
    display: flex; align-items: flex-start; justify-content: space-between;
    margin-bottom: 14px;
  }
  #pending-banner .banner-title { font-size: 0.9rem; font-weight: 700; color: var(--accent3); }
  #pending-banner .banner-sub   { font-size: 0.75rem; color: var(--muted); margin-top: 3px; font-family: 'DM Mono', monospace; }

  /* Individual pending rule rows */
  .pending-rule {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: 8px; padding: 12px 14px; margin-bottom: 8px;
  }
  .pending-rule:last-child { margin-bottom: 0; }
  .pending-rule-top {
    display: grid; grid-template-columns: 1fr auto auto;
    align-items: start; gap: 12px; margin-bottom: 6px;
  }
  .pending-rule-pattern {
    font-family: 'DM Mono', monospace; font-size: 0.85rem; font-weight: 500;
  }
  .pending-rule-pattern .wc { color: var(--accent2); } /* wildcard * chars */
  .pending-rule-meta {
    display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 4px;
  }
  .pending-rule-rationale { font-size: 0.75rem; color: var(--muted); font-family: 'DM Mono', monospace; }\n  .pending-rule-examples  { font-size: 0.72rem; color: var(--muted); font-family: 'DM Mono', monospace; margin-top: 2px; }

  /* Edit mode for pending rules */
  .pending-rule-edit { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 8px; }
  .inline-input {
    background: var(--surface2); border: 1px solid var(--accent2);
    border-radius: 6px; color: var(--text); padding: 5px 10px;
    font-family: 'DM Mono', monospace; font-size: 0.78rem; outline: none;
  }
  .inline-select {
    background: var(--surface2); border: 1px solid var(--accent2);
    border-radius: 6px; color: var(--text); padding: 5px 10px;
    font-family: 'DM Mono', monospace; font-size: 0.78rem; outline: none;
  }

  /* ==========================================================================
     ACTIVE RULES TABLE
     ========================================================================== */
  /* ── Shared table: sort indicators + column resize ──────────────────────── */
  .col-resize-handle {
    position: absolute; top: 0; right: 0; bottom: 0; width: 6px;
    cursor: col-resize; background: transparent; z-index: 1;
  }
  .col-resize-handle:hover { background: var(--accent)44; }
  .sort-ind {
    font-size: 0.6rem; color: var(--muted); pointer-events: none;
  }
  th[data-sort-dir="asc"]  .sort-ind,
  th[data-sort-dir="desc"] .sort-ind { color: var(--accent); }
  th[data-sortable] { user-select: none; }
  /* ─────────────────────────────────────────────────────────────────────── */

  .rules-table-wrap { overflow-x: auto; }
  .rules-table { width: 100%; border-collapse: collapse; font-size: 0.78rem; table-layout: fixed; }
  .rules-table th {
    text-align: left; padding: 6px 6px;
    border-bottom: 1px solid var(--border);
    font-family: 'DM Mono', monospace; font-size: 0.68rem;
    color: var(--muted); text-transform: uppercase; letter-spacing: 1px;
  }
  .rules-table td { padding: 6px 6px; border-bottom: 1px solid #1e1e24; vertical-align: middle; overflow:hidden; text-overflow:ellipsis; }
  .rules-table tr:hover td { background: var(--surface2); }
  .drag-handle { color: var(--muted); cursor: grab; font-size: 0.9rem; user-select: none; }
  .drag-handle:active { cursor: grabbing; }
  tr.dragging { opacity: 0.4; }
  tr.drag-over-top    { border-top: 2px solid var(--accent2) !important; }
  tr.drag-over-bottom { border-bottom: 2px solid var(--accent2) !important; }

  /* Add rule inline form */
  #add-rule-row td { background: #1a1f1a; }
  #add-rule-row input, #add-rule-row select {
    background: var(--surface2); border: 1px solid var(--accent);
    border-radius: 6px; color: var(--text); padding: 5px 9px;
    font-family: 'DM Mono', monospace; font-size: 0.76rem; outline: none; width: 100%;
  }

  /* ==========================================================================
     BADGES / PILLS
     ========================================================================== */
  .pill {
    display: inline-block; padding: 2px 8px; border-radius: 20px;
    font-size: 0.68rem; font-family: 'DM Mono', monospace; font-weight: 500;
  }
  .pill-wildcard { background: var(--surface2); color: var(--muted);       border: 1px solid var(--border); }
  .pill-regex    { background: #0e1a2a;          color: var(--accent2);     border: 1px solid #1a3a5a; }
  .pill-active   { background: #1a2a1a;          color: var(--accent);      border: 1px solid #2a4a2a; }
  .pill-pending  { background: #2a2010;          color: var(--accent3);     border: 1px solid #4a3820; }
  .pill-disabled { background: var(--surface2);  color: var(--muted);       border: 1px solid var(--border); }
  .pill-cat      { background: var(--surface2);  color: var(--text);        border: 1px solid var(--border); }

  /* Category color tag in items table */
  .cat-tag {
    display: inline-block; padding: 2px 8px; border-radius: 20px;
    font-size: 0.68rem; font-family: 'DM Mono', monospace; font-weight: 500;
  }
  .unclassified-tag {
    display: inline-block; padding: 2px 8px; border-radius: 20px;
    font-size: 0.68rem; font-family: 'DM Mono', monospace;
    color: var(--accent3); border: 1px solid #4a3820; background: #2a2010;
  }

  /* ==========================================================================
     CATEGORY CHART
     ========================================================================== */
  .cat-chart { display: flex; flex-direction: column; gap: 8px; }
  .cat-row {
    display: grid; grid-template-columns: 26px 180px 1fr 90px 60px;
    align-items: center; gap: 10px;
  }
  .cat-icon   { font-size: 1rem; text-align: center; }
  .cat-name   { font-size: 0.85rem; font-weight: 600; }
  .cat-name.unclassified { color: var(--accent3); }
  .cat-bar-wrap { height: 6px; background: var(--border); border-radius: 3px; }
  .cat-bar    { height: 6px; border-radius: 3px; transition: width 0.5s ease; }
  .cat-amount { font-family: 'DM Mono', monospace; font-size: 0.8rem; text-align: right; }\n  .cat-count  { font-family: 'DM Mono', monospace; font-size: 0.7rem; color: var(--muted); text-align: right; }

  /* ==========================================================================
     YEAR / DATE FILTER BAR
     ========================================================================== */
  .filter-toolbar {
    display: flex; align-items: center; gap: 7px; flex-wrap: wrap; margin-bottom: 14px;
  }
  .tlabel {
    font-size: 0.68rem; color: var(--muted); font-family: 'DM Mono', monospace;
    text-transform: uppercase; letter-spacing: 1px; white-space: nowrap;
  }
  .toolbar-divider { width: 1px; height: 14px; background: var(--border); margin: 0 3px; }
  .year-chip {
    padding: 3px 10px; border-radius: 20px; border: 1px solid var(--border);
    background: var(--surface2); font-size: 0.72rem; font-family: 'DM Mono', monospace;
    cursor: pointer; transition: all 0.15s; color: var(--muted);
  }
  .year-chip:hover  { border-color: var(--muted); color: var(--text); }
  .year-chip.active { border-color: var(--accent); color: var(--accent); background: #1a2a1a; }
  .date-input {
    background: var(--surface2); border: 1px solid var(--border); border-radius: 6px;
    color: var(--text); padding: 4px 8px; font-family: 'DM Mono', monospace;
    font-size: 0.72rem; outline: none; width: 108px; color-scheme: dark;
  }
  .date-input:focus { border-color: var(--accent2); }

  /* ==========================================================================
     ITEMS TABLE
     ========================================================================== */
  .items-toolbar {
    display: flex; align-items: center; gap: 7px; flex-wrap: wrap; margin-bottom: 12px;
  }
  .search-input {
    background: var(--surface2); border: 1px solid var(--border); border-radius: 8px;
    color: var(--text); padding: 7px 12px; font-family: 'DM Mono', monospace;
    font-size: 0.78rem; outline: none; width: 200px;
  }
  .search-input:focus { border-color: var(--accent2); }
  .cat-chip {
    padding: 3px 10px; border-radius: 20px; border: 1px solid var(--border);
    background: var(--surface2); font-size: 0.7rem; font-family: 'DM Mono', monospace;
    cursor: pointer; transition: all 0.15s; color: var(--muted);
  }
  .cat-chip:hover  { border-color: var(--muted); color: var(--text); }
  .cat-chip.active { border-color: var(--accent); color: var(--accent); background: #1a2a1a; }
  .cat-chip.unclass-chip { border-color: #4a3820; color: var(--accent3); background: #2a2010; }

  .items-table-wrap { overflow-x: auto; }
  table { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
  /* Items table: fixed layout with explicit column widths. Total of all
     fixed cols = 948px + Title 200px = 1148px. Setting width: 1148px
     explicitly overrides the general `table { width: 100% }` rule so
     Chrome's table-layout algorithm doesn't collapse the Title column when
     the container is narrower than 1148px — the overflow wrapper scrolls.
     (min-width alone is unreliable on tables with table-layout:fixed in
     some Chrome builds; an explicit width is the safe approach.) */
  .items-table { table-layout: fixed; width: 1148px; min-width: 1148px; }
  .items-table td { word-break: break-word; overflow-wrap: anywhere; }
  thead th {
    text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--border);
    font-family: 'DM Mono', monospace; font-size: 0.68rem;
    color: var(--muted); text-transform: uppercase; letter-spacing: 1px;
    cursor: pointer; user-select: none; white-space: nowrap;
  }
  thead th:hover { color: var(--text); }
  tbody tr:hover td { background: var(--surface2); }
  tbody td { padding: 8px 10px; border-bottom: 1px solid #1e1e24; vertical-align: middle; }
  .rule-ref {
    font-family: 'DM Mono', monospace; font-size: 0.68rem;
    color: var(--muted); white-space: nowrap;
  }
  .rule-ref.no-match { color: var(--accent3); }

  /* ==========================================================================
     TAB BAR
     ========================================================================== */
  .tab-bar {
    display: flex; gap: 2px; margin-bottom: 16px; border-bottom: 1px solid var(--border);
  }
  .tab {
    padding: 8px 16px; cursor: pointer; font-size: 0.82rem; font-weight: 600;
    border-bottom: 2px solid transparent; transition: all 0.15s; color: var(--muted);
  }
  .tab:hover  { color: var(--text); }
  .tab.active { border-bottom-color: var(--accent); color: var(--accent); }

  /* Top-level section nav — larger, heavier than sub-tab bar */
  .section-nav {
    display: flex; gap: 4px; margin-bottom: 14px; border-bottom: 2px solid var(--border);
  }
  .section-nav-btn {
    padding: 10px 22px; cursor: pointer; font-size: 0.95rem; font-weight: 700;
    letter-spacing: 0.3px;
    border-bottom: 3px solid transparent; margin-bottom: -2px;
    transition: all 0.15s; color: var(--muted); background: none; border-left: 0; border-right: 0; border-top: 0;
    font-family: inherit;
  }
  .section-nav-btn:hover  { color: var(--text); }
  .section-nav-btn.active { border-bottom-color: var(--accent2); color: var(--accent2); }
  .app-title { cursor: pointer; }
  .app-title:hover { color: var(--accent2); }

  /* ==========================================================================
     DASHBOARD
     ========================================================================== */
  .dash-card {
    background: var(--surface); border: 1px solid var(--border); border-radius: 10px;
    padding: 16px 18px;
  }
  .dash-card-head {
    display: flex; justify-content: space-between; align-items: baseline;
    margin-bottom: 14px; gap: 12px; flex-wrap: wrap;
  }
  .dash-card-title {
    font-size: 0.78rem; font-weight: 500; color: var(--accent2);
    font-family: 'DM Mono', monospace;
    text-transform: uppercase; letter-spacing: 1px;
  }
  .dash-card-sub {
    font-size: 0.68rem; color: var(--muted); font-family: 'DM Mono', monospace;
  }
  .dash-month-picker {
    background: var(--surface2); border: 1px solid var(--border); border-radius: 6px;
    color: var(--text); padding: 4px 10px; font-size: 0.8rem;
    font-family: 'DM Mono', monospace;
  }
  .dash-card1-body { display: flex; flex-direction: column; gap: 14px; }
  .dash-stats-row {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 18px; align-items: start;
  }
  .dash-stat-label {
    font-size: 0.68rem; color: var(--muted); font-family: 'DM Mono', monospace;
    text-transform: uppercase; letter-spacing: 0.8px; margin-bottom: 4px;
  }
  .dash-stat-value {
    font-size: 1.5rem; font-weight: 600; color: var(--text); line-height: 1.15;
  }
  .dash-stat-delta {
    font-size: 0.72rem; font-family: 'DM Mono', monospace; margin-top: 4px;
  }
  .dash-delta-up   { color: var(--danger); }
  .dash-delta-down { color: var(--accent); }
  .dash-delta-flat { color: var(--muted); }
  .dash-footer-row {
    display: flex; flex-wrap: wrap; gap: 18px; padding-top: 10px;
    border-top: 1px solid var(--border);
    font-size: 0.78rem; font-family: 'DM Mono', monospace; color: var(--muted);
  }
  .dash-footer-row strong { color: var(--text); font-weight: 600; }
  .dash-footer-row a.dash-link {
    color: var(--accent2); text-decoration: none; cursor: pointer;
  }
  .dash-footer-row a.dash-link:hover { text-decoration: underline; }
  .dash-empty {
    color: var(--muted); font-size: 0.82rem; font-style: italic;
    padding: 12px 0;
  }
  .dash-pair {
    display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
  }
  @media (max-width: 900px) {
    .dash-pair { grid-template-columns: 1fr; }
  }
  .dash-digest-excerpt {
    font-size: 0.85rem; line-height: 1.65; color: var(--text);
  }
  .dash-digest-excerpt p { margin: 0 0 10px; }
  .dash-digest-full { margin-top: 10px; }
  .dash-attention-row {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 10px; border: 1px solid var(--border); border-radius: 6px;
    font-size: 0.82rem;
  }
  .dash-attention-row.warn { border-color: #4a3010; background: #1a1208; }
  .dash-attention-row .icon { font-size: 0.95rem; flex-shrink: 0; }
  .dash-attention-row .msg  { flex: 1; }
  .dash-attention-row .msg strong { font-weight: 600; }
  .dash-attention-row.warn { color: var(--accent3); }
  .dash-activity-row {
    display: grid; grid-template-columns: 110px 1fr; gap: 10px;
    padding: 4px 0; border-bottom: 1px solid var(--border);
    font-size: 0.8rem;
  }
  .dash-activity-row:last-child { border-bottom: 0; }
  .dash-activity-row .ts {
    color: var(--muted); font-family: 'DM Mono', monospace; font-size: 0.72rem;
  }
  /* Dashboard: summary strip & window filter */
  .dash-summary-strip {
    display: flex; align-items: center; gap: 12px; padding: 6px 0 10px; flex-wrap: wrap;
  }
  .dash-window-btns { display: flex; gap: 4px; }
  .dash-window-btn {
    background: var(--surface2); border: 1px solid var(--border); border-radius: 5px;
    color: var(--muted); padding: 2px 8px;
    font-size: 0.72rem; font-family: 'DM Mono', monospace; cursor: pointer; line-height: 1.6;
  }
  .dash-window-btn:hover { color: var(--text); border-color: var(--accent2); }
  .dash-window-btn.active { background: var(--accent2); color: #fff; border-color: var(--accent2); }
  /* Dashboard: KPI grid (8 cards) */
  .dash-kpi-grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px;
  }
  @media (max-width: 1100px) { .dash-kpi-grid { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 640px)  { .dash-kpi-grid { grid-template-columns: 1fr 1fr; } }
  .dash-kpi-card {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: 8px; padding: 12px 14px; display: flex; flex-direction: column;
  }
  .dash-kpi-label {
    font-size: 0.68rem; color: var(--muted); font-family: 'DM Mono', monospace;
    text-transform: uppercase; letter-spacing: 0.8px; margin-bottom: 6px;
  }
  .dash-kpi-value { font-size: 1.5rem; font-weight: 700; color: var(--text); line-height: 1.1; flex: 1; }
  .dash-kpi-footer {
    display: flex; align-items: center; justify-content: space-between; margin-top: 8px; gap: 6px;
  }
  .dash-kpi-spark { line-height: 0; }
  .kpi-delta {
    font-size: 0.7rem; font-family: 'DM Mono', monospace; padding: 1px 5px;
    border-radius: 3px; background: var(--surface2);
  }
  .kpi-delta-good  { color: var(--accent); }
  .kpi-delta-bad   { color: var(--danger); }
  .kpi-delta-flat  { color: var(--muted); }
  .kpi-value-danger { color: var(--danger); }
  .kpi-value-warn   { color: var(--accent3); }
  .kpi-value-good   { color: var(--accent); }
  .dash-link { color: var(--accent2); text-decoration: none; cursor: pointer; font-size: 0.78rem; }
  .dash-link:hover { text-decoration: underline; }
  /* Admin AI Cost sections */
  .ai-cost-section {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: 10px; margin-bottom: 14px; overflow: hidden;
  }
  .ai-cost-section-head {
    display: flex; justify-content: space-between; align-items: center;
    padding: 9px 16px; border-bottom: 1px solid var(--border);
    font-size: 0.7rem; font-family: 'DM Mono', monospace;
    text-transform: uppercase; letter-spacing: 0.8px; color: var(--muted);
  }
  .ai-cost-section-head .refresh-btn {
    background: none; border: none; color: var(--accent2); cursor: pointer;
    font-size: 0.78rem; padding: 0; font-family: inherit; letter-spacing: 0; text-transform: none;
  }
  .ai-cost-section-head .refresh-btn:hover { text-decoration: underline; }
  .ai-cost-kpi-tile {
    border-right: 1px solid var(--border); padding: 12px 16px; text-align: center;
  }
  .ai-cost-kpi-tile:last-child { border-right: 0; }
  .ai-cost-kpi-tile .tile-label {
    font-size: 0.65rem; font-family: 'DM Mono', monospace;
    text-transform: uppercase; letter-spacing: 0.8px; color: var(--muted); margin-bottom: 4px;
  }
  .ai-cost-kpi-tile .tile-value {
    font-size: 1.3rem; font-weight: 700; font-family: 'DM Mono', monospace; color: var(--text);
  }

  /* ==========================================================================
     EXPORT ROW
     ========================================================================== */
  .export-row { display: flex; gap: 8px; justify-content: flex-end; margin-top: 12px; }

  /* Advisor card */
  .advisor-badge {
    font-size: 0.68rem; font-family: 'DM Mono', monospace;
    padding: 2px 8px; border-radius: 10px; flex-shrink: 0;
  }
  .advisor-badge-warn { background: #4a3010; color: var(--accent3); }
  .advisor-badge-ok   { background: var(--surface2); color: var(--success); }
  .advisor-body {
    padding-top: 12px; border-top: 1px solid var(--border); margin-top: 6px;
    display: flex; flex-direction: column; gap: 10px;
  }
  .advisor-digest { font-size: 0.85rem; line-height: 1.65; color: var(--text); margin: 0; }
  .advisor-meta-line { font-size: 0.7rem; color: var(--muted); font-family: 'DM Mono', monospace; }
  .advisor-chips-row { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
  .advisor-chip {
    background: var(--surface2); border: 1px solid var(--border); border-radius: 20px;
    color: var(--accent2); padding: 3px 10px; font-size: 0.75rem; cursor: pointer;
  }
  .advisor-chip:hover { background: var(--accent2); color: #fff; border-color: var(--accent2); }
  .advisor-anomaly-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 10px;
  }
  .advisor-anomaly-card {
    background: var(--surface2); border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px;
  }
  .advisor-anomaly-cat { font-weight: 600; font-size: 0.78rem; margin-bottom: 4px; }
  .advisor-anomaly-pct {
    font-size: 1.1rem; font-weight: 700; margin-bottom: 4px; font-family: 'DM Mono', monospace;
  }
  .advisor-sev-high { color: var(--danger); }
  .advisor-sev-med  { color: var(--accent3); }
  .advisor-sev-low  { color: var(--muted); }
  .advisor-anomaly-meta { font-size: 0.7rem; color: var(--muted); margin-bottom: 4px; }
  .advisor-anomaly-explain { font-size: 0.72rem; color: var(--muted); line-height: 1.4; }
  /* Ask AI panel */
  .ask-ai-section {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: 10px; padding: 16px 18px; display: flex; flex-direction: column; gap: 12px;
  }
  .ask-ai-header {
    display: flex; align-items: center; justify-content: space-between;
    border-bottom: 1px solid var(--border); padding-bottom: 12px;
  }
  .ask-ai-header-label {
    font-size: 0.72rem; font-family: 'DM Mono', monospace;
    text-transform: uppercase; letter-spacing: 1px; color: var(--accent2);
    display: flex; align-items: center; gap: 8px;
  }
  .ask-ai-chips-row { display: flex; flex-wrap: wrap; gap: 6px; }
  .ask-ai-starter-chip {
    background: var(--surface2); border: 1px solid var(--border); border-radius: 20px;
    color: var(--text); padding: 5px 14px; font-size: 0.78rem; cursor: pointer;
  }
  .ask-ai-starter-chip:hover { background: var(--accent2); color: #fff; border-color: var(--accent2); }
  .ask-ai-thread {
    display: flex; flex-direction: column; gap: 8px; min-height: 0;
    max-height: 520px; overflow-y: auto;
  }
  .ask-ai-preload {
    font-size: 0.82rem; color: var(--accent2); padding: 6px 10px;
    background: var(--surface2); border-radius: 6px; border-left: 3px solid var(--accent2);
  }
  .ask-ai-bubble { max-width: 72%; }
  .ask-ai-bubble-user { align-self: flex-end; }
  .ask-ai-bubble-ai   { align-self: flex-start; max-width: 100%; width: 100%; display: flex; flex-direction: column; }
  .ask-ai-bubble-text {
    padding: 8px 12px; border-radius: 10px; font-size: 0.82rem;
    line-height: 1.5; word-break: break-word;
  }
  .ask-ai-bubble-user .ask-ai-bubble-text { background: var(--accent2); color: #fff; border-radius: 10px 10px 2px 10px; white-space: pre-wrap; }
  .ask-ai-bubble-ai .ask-ai-bubble-text   { background: var(--surface2); border-radius: 10px 10px 10px 2px; }
  .ask-ai-bubble-ai .ask-ai-bubble-text table { color: var(--text); }
  .ask-ai-bubble-ai .ask-ai-bubble-text ul { color: var(--text); }
  .ask-ai-copy-btn {
    background: none; border: none; color: var(--muted); cursor: pointer;
    font-size: 0.68rem; font-family: 'DM Mono', monospace; padding: 2px 6px;
    letter-spacing: 0.3px; align-self: flex-start;
  }
  .ask-ai-copy-btn:hover { color: var(--accent2); }
  .ask-ai-thinking { color: var(--muted); font-style: italic; }
  .ask-ai-error    { color: var(--danger); }
  .ask-ai-input-bar {
    display: flex; align-items: flex-end; gap: 8px;
    background: var(--surface2); border: 1px solid var(--border);
    border-radius: 10px; padding: 8px 10px 8px 14px;
  }
  .ask-ai-input-bar textarea {
    flex: 1; background: none; border: none; outline: none; resize: none;
    color: var(--text); font-family: inherit; font-size: 0.85rem;
    line-height: 1.4; max-height: 80px; overflow-y: auto;
  }
  .ask-ai-input-bar textarea::placeholder { color: var(--muted); }
  .ask-ai-new-btn {
    background: none; border: none; color: var(--muted); cursor: pointer;
    font-size: 0.78rem; padding: 4px 2px; white-space: nowrap; font-family: inherit;
  }
  .ask-ai-new-btn:hover { color: var(--accent2); }
  .ask-ai-send-btn {
    background: var(--accent2); color: #fff; border: none; border-radius: 8px;
    padding: 6px 14px; font-size: 0.82rem; cursor: pointer; white-space: nowrap; flex-shrink: 0;
  }
  .ask-ai-send-btn:disabled { opacity: 0.5; cursor: default; }
  .ask-ai-send-btn:not(:disabled):hover { filter: brightness(1.2); }
  .ask-ai-recent-section { display: flex; flex-direction: column; gap: 6px; }
  .ask-ai-recent-title {
    font-size: 0.68rem; font-family: 'DM Mono', monospace;
    text-transform: uppercase; letter-spacing: 0.8px; color: var(--muted);
  }
  .ask-ai-thread-row {
    display: flex; justify-content: space-between; align-items: center;
    padding: 10px 12px; background: var(--surface2); border: 1px solid var(--border);
    border-radius: 8px; cursor: pointer; gap: 8px;
  }
  .ask-ai-thread-row:hover { border-color: var(--accent2); }
  .ask-ai-thread-row.active { border-color: var(--accent2); }
  .ask-ai-thread-title {
    font-size: 0.82rem; font-weight: 500; flex: 1; min-width: 0;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .ask-ai-thread-meta {
    font-size: 0.7rem; color: var(--muted); font-family: 'DM Mono', monospace; white-space: nowrap; flex-shrink: 0;
  }
  .ask-ai-threads-empty { font-size: 0.82rem; color: var(--muted); }

  /* ==========================================================================
     UTILITY
     ========================================================================== */
  /* Coverage badges for transactions */
  .tx-covered td  { opacity:0.45; }
  .tx-partial td  { opacity:0.75; }
  /* ── Slide-in edit panel ── */
  .edit-panel {
    position: fixed; top: 0; right: -360px; width: 340px; height: 100vh;
    background: var(--surface); border-left: 1px solid var(--border);
    padding: 24px 20px; transition: right 0.25s ease;
    z-index: 1000; overflow-y: auto; display: flex; flex-direction: column; gap: 14px;
  }
  .edit-panel.open { right: 0; }
  /* Rule conflict panel is wider than the default 340px — use a bigger
     offscreen offset so it fully hides when .open isn't set. */
  #rule-conflict-panel { right: -100vw; }
  #rule-conflict-panel.open { right: 0; }
  .edit-panel-title { font-size: 0.78rem; font-weight: 700; color: var(--accent); font-family: 'DM Mono', monospace; text-transform: uppercase; letter-spacing: 1px; }\n  .edit-panel-item  { font-size: 0.82rem; color: var(--muted); font-family: 'DM Mono', monospace; line-height: 1.4; word-break: break-word; }
  .edit-panel-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 999; display: none; }
  .edit-panel-overlay.open { display: block; }
  .panel-field label { display: block; font-size: 0.7rem; color: var(--muted); font-family: 'DM Mono', monospace; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 5px; }
  .panel-select {
    width: 100%; background: var(--surface2); border: 1px solid var(--border);
    border-radius: 6px; color: var(--text); padding: 8px 10px;
    font-family: 'DM Mono', monospace; font-size: 0.8rem; outline: none;
  }
  .panel-select:focus { border-color: var(--accent2); }
  .panel-divider { height: 1px; background: var(--border); margin: 4px 0; }
  /* Searchable category picker — used in forms where a native <select>
     can't show 150+ subcategories efficiently. */
  .cat-picker-btn {
    width: 100%; background: var(--surface2); border: 1px solid var(--border);
    border-radius: 6px; color: var(--text); padding: 8px 10px;
    font-family: 'DM Mono', monospace; font-size: 0.8rem; text-align: left;
    display: flex; align-items: center; gap: 10px; cursor: pointer; outline: none;
  }
  .cat-picker-btn:hover,
  .cat-picker-btn:focus { border-color: var(--accent2); }
  .cat-picker-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .cat-picker-label.placeholder { color: var(--muted); font-style: italic; }
  .cat-picker-caret { color: var(--muted); font-size: 0.7rem; }

  /* ── Rule builder modal ── */
  .modal-backdrop {
    position: fixed; inset: 0; background: rgba(0,0,0,0.6);
    z-index: 1100; display: flex; align-items: center; justify-content: center;
  }
  .modal-box {
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
    padding: 24px; width: 520px; max-width: 95vw; max-height: 90vh; overflow-y: auto;
    display: flex; flex-direction: column; gap: 14px;
  }
  .modal-title { font-size: 0.85rem; font-weight: 700; color: var(--accent); font-family: 'DM Mono', monospace; text-transform: uppercase; letter-spacing: 1px; }\n  .modal-field label { display: block; font-size: 0.7rem; color: var(--muted); font-family: 'DM Mono', monospace; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 5px; }
  .modal-input {
    width: 100%; background: var(--surface2); border: 1px solid var(--border);
    border-radius: 6px; color: var(--text); padding: 8px 10px;
    font-family: 'DM Mono', monospace; font-size: 0.82rem; outline: none;
  }
  .modal-input:focus { border-color: var(--accent2); }
  .modal-select {
    width: 100%; background: var(--surface2); border: 1px solid var(--border);
    border-radius: 6px; color: var(--text); padding: 8px 10px;
    font-family: 'DM Mono', monospace; font-size: 0.8rem; outline: none;
  }
  .modal-select:focus { border-color: var(--accent2); }
  .pattern-type-toggle { display: flex; gap: 6px; }
  .type-btn { padding: 5px 14px; border-radius: 6px; border: 1px solid var(--border); background: var(--surface2); color: var(--muted); font-family: 'DM Mono', monospace; font-size: 0.75rem; cursor: pointer; transition: all 0.15s; }
  .type-btn.active { border-color: var(--accent2); color: var(--accent2); background: #0e1a2a; }
  .match-preview { font-family: 'DM Mono', monospace; font-size: 0.75rem; color: var(--muted); padding: 8px 10px; background: var(--surface2); border-radius: 6px; border: 1px solid var(--border); min-height: 32px; }
  .match-preview .match-count { color: var(--accent); font-weight: 600; }

  .edit-row-btn { font-size: 0.68rem; color: var(--muted); cursor: pointer; padding: 2px 5px; border-radius: 4px; margin-left: 3px; border: 1px solid transparent; transition: all 0.12s; }
  .edit-row-btn:hover { background: var(--surface2); border-color: var(--border); color: var(--text); }
  .rule-row-btn { font-size: 0.68rem; color: var(--accent2); cursor: pointer; padding: 2px 5px; border-radius: 4px; margin-left: 2px; border: 1px solid transparent; transition: all 0.12s; }
  .rule-row-btn:hover { background: #0e1a2a; border-color: var(--accent2); }

  /* ── Category Manager ── */
  .cat-mgr-row {
    display: grid;
    grid-template-columns: 36px 44px 1fr 120px 80px auto;
    align-items: center; gap: 10px;
    padding: 10px 12px; border-radius: 8px;
    border: 1px solid var(--border); background: var(--surface2);
    margin-bottom: 8px;
  }
  .cat-mgr-row:hover { border-color: var(--muted); }
  .cat-swatch { width: 28px; height: 28px; border-radius: 6px; border: 1px solid var(--border); cursor: pointer; flex-shrink: 0; }
  .cat-icon-input { width: 38px; text-align: center; font-size: 1.2rem; background: var(--surface); border: 1px solid var(--border); border-radius: 6px; padding: 3px; }
  .cat-name-input { background: var(--surface); border: 1px solid var(--border); border-radius: 6px; color: var(--text); padding: 6px 10px; font-size: 0.82rem; font-family: inherit; width: 100%; }
  .cat-name-input:focus { outline: none; border-color: var(--accent2); }
  .cat-color-input { width: 100px; height: 30px; border: 1px solid var(--border); border-radius: 6px; cursor: pointer; background: none; padding: 0 2px; }
  .subcat-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; align-items: center; }
  .subcat-chip {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 2px 8px; border-radius: 12px;
    font-size: 0.68rem; font-family: 'DM Mono', monospace;
    background: var(--surface); border: 1px solid var(--border); color: var(--muted);
  }
  .subcat-chip .rm { cursor: pointer; color: var(--muted); font-size: 0.65rem; margin-left: 2px; }
  .subcat-chip .rm:hover { color: var(--danger); }
  .add-subcat-btn { font-size: 0.68rem; font-family: 'DM Mono', monospace; color: var(--accent2); cursor: pointer; padding: 2px 7px; border-radius: 12px; border: 1px dashed var(--accent2); background: none; }
  .add-subcat-btn:hover { background: #0e1a2a; }
  .cat-delete-btn { font-size: 0.75rem; color: var(--muted); cursor: pointer; padding: 4px 8px; border-radius: 6px; border: 1px solid transparent; background: none; }
  .cat-delete-btn:hover { color: var(--danger); border-color: var(--danger); background: #1a0a0a; }
  .cat-drag-handle { cursor: grab; color: var(--border); font-size: 1rem; user-select: none; }
  .cat-drag-handle:active { cursor: grabbing; }
  .cat-mgr-row.drag-over { border-color: var(--accent2); background: #0e1a2a; }

  /* Inline add-category / add-subcategory mini-forms */
  .inline-add-form {
    display:flex; gap:6px; align-items:center; margin-top:6px;
    padding: 6px 8px; background: var(--surface2); border-radius:6px;
    border: 1px solid var(--border);
  }
  .inline-add-form input {
    flex:1; background: var(--surface); border:1px solid var(--border);
    border-radius:5px; color:var(--text); padding:4px 8px;
    font-size:0.78rem; font-family:inherit; outline:none;
  }
  .inline-add-form input:focus { border-color: var(--accent2); }
  .add-inline-btn {
    font-size:0.68rem; font-family:'DM Mono',monospace;
    color:var(--accent2); cursor:pointer; padding:2px 7px;
    border-radius:5px; border:1px dashed var(--accent2); background:none;
    margin-top:4px;
  }
  .add-inline-btn:hover { background:#0e1a2a; }

  /* Audit log */
  .audit-action-pill {
    display:inline-block; padding:1px 7px; border-radius:12px;
    font-size:0.62rem; font-family:'DM Mono',monospace; font-weight:600;
    text-transform:uppercase; letter-spacing:0.5px;
  }
  .audit-IMPORT            { background:#1a2a1a; color:var(--accent); border:1px solid #2a4a2a; }
  .audit-APPLY_RULES       { background:#0e1a2a; color:var(--accent2); border:1px solid #1a3a4a; }
  .audit-RECONCILE         { background:#1a1a2a; color:#a0a0ff; border:1px solid #2a2a4a; }
  .audit-PROPOSE_RULES     { background:#2a1a2a; color:#d0a0ff; border:1px solid #4a2a4a; }
  .audit-RULE_APPROVED     { background:#1a2a1a; color:var(--accent); border:1px solid #2a4a2a; }
  .audit-RULE_REJECTED     { background:#2a1a1a; color:var(--danger); border:1px solid #4a2a2a; }
  .audit-RULE_ADDED        { background:#1a2a1a; color:var(--accent); border:1px solid #2a4a2a; }
  .audit-RULE_EDITED       { background:#2a2010; color:var(--accent3); border:1px solid #4a3820; }
  .audit-APPROVE_ALL       { background:#1a2a1a; color:var(--accent); border:1px solid #2a4a2a; }
  .audit-REJECT_ALL        { background:#2a1a1a; color:var(--danger); border:1px solid #4a2a2a; }
  .audit-ITEM_OVERRIDDEN   { background:#2a2010; color:var(--accent3); border:1px solid #4a3820; }
  .audit-TX_OVERRIDDEN     { background:#2a2010; color:var(--accent3); border:1px solid #4a3820; }
  .audit-CATEGORY_SAVED    { background:#0e1a2a; color:var(--accent2); border:1px solid #1a3a4a; }
  .audit-detail {
    background:var(--surface2); border-radius:6px; padding:8px 12px;
    font-family:'DM Mono',monospace; font-size:0.72rem; color:var(--muted);
    margin-top:4px; white-space:pre-wrap; word-break:break-all;
  }
  .audit-expand { cursor:pointer; color:var(--muted); font-size:0.75rem; user-select:none; }
  .audit-expand:hover { color:var(--text); }

  /* Direct classification cards */
  .class-card {
    background: var(--surface); border: 1px solid #2a2a4a;
    border-radius: 8px; padding: 10px 14px; margin-bottom: 8px;
  }
  .class-card-top { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
  .class-title { font-size:0.82rem; color:var(--text); flex:1; min-width:200px; }
  .class-actions { display:flex; gap:6px; align-items:center; }

  /* Bulk selection */
  .bulk-action-bar {
    display:flex; align-items:center; gap:10px; flex-wrap:wrap;
    padding:8px 14px; border-radius:8px; margin-bottom:8px;
    background:#0e1a2a; border:1px solid var(--accent2);
    font-family:'DM Mono',monospace; font-size:0.78rem;
  }
  .bulk-count { color:var(--accent2); font-weight:600; }
  .bulk-sep   { color:var(--border); }
  .row-checkbox { width:14px; height:14px; cursor:pointer; accent-color:var(--accent2); }
  tr.selected-row td { background:#0e1a2a !important; }

  /* Master/detail transaction rows */
  tr.tx-primary-row:hover td { background:var(--surface2); }
  tr.tx-detail-row td {
    border-top: none;
    font-size: 0.78rem;
  }
  tr.tx-detail-row:hover td { background:#1a1a2a; }
  tr.tx-gap-row td { border-top: 1px dashed var(--border); }

  /* Association panel */
  .assoc-item {
    padding: 7px 10px;
    margin: 3px 0;
    border-radius: 6px;
    border: 1px solid var(--border);
    background: var(--surface2);
    cursor: grab;
    font-size: 0.78rem;
    user-select: none;
    transition: border-color 0.15s, background 0.15s;
  }
  .assoc-item:hover        { border-color: var(--muted); }
  .assoc-item.selected     { border-color: var(--accent); background: var(--accent)11; }
  .assoc-item.dragging     { opacity: 0.4; }
  .assoc-tx-item           { cursor: pointer; }
  .assoc-tx-item.active    { border-color: var(--accent2); background: var(--accent2)11; }
  .assoc-tx-item:hover     { border-color: var(--accent2); }
  .assoc-pending-badge {
    font-size: 0.62rem; font-family: 'DM Mono', monospace;
    padding: 1px 5px; border-radius: 8px;
    background: var(--accent)22; color: var(--accent);
    border: 1px solid var(--accent)44;
  }

  /* Tags */
  .tag-chip {
    display:inline-flex; align-items:center; gap:3px;
    padding:2px 8px; border-radius:12px;
    font-size:0.65rem; font-family:'DM Mono',monospace; font-weight:500;
    border:1px solid transparent; cursor:default;
  }
  .tag-chip .tag-rm { cursor:pointer; opacity:0.6; font-size:0.6rem; margin-left:2px; }
  .tag-chip .tag-rm:hover { opacity:1; }
  .tag-filter-chip {
    padding:2px 9px; border-radius:12px;
    font-size:0.68rem; font-family:'DM Mono',monospace;
    cursor:pointer; border:1px solid var(--border);
    background:var(--surface2); color:var(--muted); transition:all 0.12s;
  }
  .tag-filter-chip:hover  { border-color:var(--muted); color:var(--text); }
  .tag-filter-chip.active { border-color:var(--accent2); color:var(--accent2); background:#0e1a2a; }
  /* Tag manager */
  .tag-mgr-row {
    display:flex; align-items:center; gap:10px;
    padding:8px 12px; border-radius:8px;
    border:1px solid var(--border); background:var(--surface2);
    margin-bottom:7px;
  }
  .tag-color-swatch { width:22px; height:22px; border-radius:5px; border:1px solid var(--border); cursor:pointer; flex-shrink:0; }
  .tag-name-input { flex:1; background:var(--surface); border:1px solid var(--border); border-radius:6px; color:var(--text); padding:5px 9px; font-size:0.8rem; font-family:'DM Mono',monospace; }
  .tag-name-input:focus { outline:none; border-color:var(--accent2); }
  .tag-desc-input { flex:2; background:var(--surface); border:1px solid var(--border); border-radius:6px; color:var(--text); padding:5px 9px; font-size:0.78rem; font-family:inherit; }
  .tag-desc-input:focus { outline:none; border-color:var(--accent2); }
  /* Tag selector in panels */
  .tag-selector { display:flex; flex-wrap:wrap; gap:4px; margin-top:5px; }
  .tag-option {
    padding:2px 9px; border-radius:12px; cursor:pointer;
    font-size:0.68rem; font-family:'DM Mono',monospace;
    border:1px solid var(--border); background:var(--surface2); color:var(--muted);
    transition:all 0.12s;
  }
  .tag-option:hover   { border-color:var(--muted); color:var(--text); }
  .tag-option.selected { color:#111; font-weight:600; }

  /* Misc tab */
  .misc-section {
    background: var(--surface2); border: 1px solid var(--border);
    border-radius: 10px; padding: 18px 20px; margin-bottom: 18px;
  }
  .misc-section-title {
    font-size: 0.7rem; font-family: 'DM Mono', monospace; font-weight: 700;
    letter-spacing: 1px; text-transform: uppercase; color: var(--accent2);
    margin-bottom: 12px;
  }
  .prompt-box {
    background: var(--surface); border: 1px solid var(--border); border-radius: 8px;
    padding: 12px 14px; font-family: 'DM Mono', monospace; font-size: 0.72rem;
    color: var(--muted); white-space: pre-wrap; word-break: break-word;
    max-height: 280px; overflow-y: auto; line-height: 1.5; margin-top: 10px;
  }
  .csv-preview-table { width: 100%; border-collapse: collapse; font-size: 0.76rem; margin-top: 10px; }
  .csv-preview-table th { padding: 6px 10px; text-align: left; color: var(--muted); font-weight: 600; border-bottom: 1px solid var(--border); font-family: 'DM Mono', monospace; font-size: 0.68rem; }
  .csv-preview-table td { padding: 6px 10px; border-bottom: 1px solid #1e1e24; }
  .csv-preview-table tr.row-bad td { color: var(--danger); }
  .csv-preview-table tr.row-ok  td { color: var(--text); }

  /* Inline category editor */
  .inline-cat-editor {
    position: absolute; z-index: 2000;
    background: var(--surface); border: 1px solid var(--accent2);
    border-radius: 8px; padding: 8px;
    min-width: 240px; max-width: 360px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.5);
  }
  .inline-cat-search {
    width: 100%; background: var(--surface2); border: 1px solid var(--border);
    border-radius: 6px; color: var(--text); padding: 6px 10px;
    font-family: 'DM Mono', monospace; font-size: 0.76rem; outline: none;
    margin-bottom: 6px;
  }
  .inline-cat-search:focus { border-color: var(--accent2); }
  .inline-cat-list { max-height: 180px; overflow-y: auto; margin-bottom: 4px; }
  .inline-cat-item {
    padding: 5px 9px; border-radius: 5px; cursor: pointer;
    font-size: 0.78rem; display: flex; align-items: center; gap: 6px;
  }
  .inline-cat-item:hover, .inline-cat-item.selected { background: var(--surface2); }
  .inline-cat-item.selected { border-left: 2px solid var(--accent2); }
  .inline-subcat-list {
    border-top: 1px solid var(--border); padding-top: 6px; margin-top: 4px;
    max-height: 140px; overflow-y: auto;
  }
  .inline-subcat-item {
    padding: 4px 9px 4px 20px; border-radius: 5px; cursor: pointer;
    font-size: 0.74rem; color: var(--muted);
  }
  .inline-subcat-item:hover { background: var(--surface2); color: var(--text); }
  .inline-subcat-item.active { color: var(--accent); font-weight: 600; }
  .inline-cat-create-btn {
    display: block; width: 100%; margin-top: 4px;
    background: transparent; color: var(--muted);
    border: 1px dashed var(--border); border-radius: 5px;
    padding: 5px 9px; font-size: 0.73rem; font-family: 'DM Mono', monospace;
    cursor: pointer; letter-spacing: 0.3px; text-align: left;
  }
  .inline-cat-create-btn:hover { color: var(--accent2); border-color: var(--accent2); }
  /* Subcategory pill */
  .subcat-pill {
    display: inline-block; padding: 1px 7px; border-radius: 20px;
    font-size: 0.62rem; font-family: 'DM Mono', monospace; font-weight: 500;
    opacity: 0.75; margin-left: 3px;
  }

  .hidden { display: none !important; }
  .mn { font-family: 'DM Mono', monospace; }

  @media (max-width: 640px) {
    .stats-grid  { grid-template-columns: repeat(2, 1fr); }
    .settings-row { grid-template-columns: 1fr; }
    .cat-row { grid-template-columns: 26px 1fr 80px; }
    .cat-bar-wrap, .cat-count { display: none; }
  }

  /* ==========================================================================
     REPORTS V2
     ========================================================================== */

  /* Filter bar */
  .rpt-filter-bar {
    display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
    padding: 10px 12px;
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--radius);
  }
  .rpt-filter-group {
    display: flex; flex-wrap: wrap; gap: 4px; align-items: center;
  }
  .rpt-filter-label {
    font-size: 0.68rem; font-family: 'DM Mono', monospace;
    color: var(--muted); text-transform: uppercase; letter-spacing: 0.8px;
    margin-right: 2px; white-space: nowrap;
  }
  .rpt-chip {
    padding: 3px 9px; border-radius: 20px; font-size: 0.72rem;
    border: 1px solid var(--border); background: var(--surface2);
    color: var(--muted); cursor: pointer; transition: all 0.12s;
    font-family: 'DM Mono', monospace;
  }
  .rpt-chip:hover  { border-color: var(--accent2); color: var(--accent2); }
  .rpt-chip.active { border-color: var(--accent2); background: color-mix(in srgb, var(--accent2) 15%, transparent); color: var(--accent2); }
  .rpt-date-input {
    background: var(--surface2); border: 1px solid var(--border); border-radius: 6px;
    color: var(--text); padding: 3px 7px; font-size: 0.72rem;
    font-family: 'DM Mono', monospace;
  }
  .rpt-run-btn { margin-left: auto; }
  .rpt-filter-cadences .rpt-chip { font-size: 0.65rem; }

  /* Scope bars */
  .rpt-scope-bar {
    display: flex; align-items: center; gap: 12px;
    padding: 8px 14px; border-radius: 7px; margin-bottom: 8px;
    font-size: 0.78rem; font-family: 'DM Mono', monospace;
  }
  .rpt-in-scope {
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
  }
  .rpt-out-scope {
    background: color-mix(in srgb, var(--border) 40%, transparent);
    border: 1px solid var(--border);
  }
  .rpt-out-scope > summary { cursor: pointer; display: flex; gap: 12px; align-items: center; list-style: none; }
  .rpt-out-scope > summary::marker,
  .rpt-out-scope > summary::-webkit-details-marker { display: none; }
  .rpt-out-scope[open] > summary::before { content: '▲ '; font-size: 0.6rem; }
  .rpt-out-scope:not([open]) > summary::before { content: '▼ '; font-size: 0.6rem; }
  .rpt-scope-label { color: var(--muted); min-width: 70px; }
  .rpt-scope-count { color: var(--text); }
  .rpt-scope-total { margin-left: auto; font-weight: 500; color: var(--text); }
  .rpt-out-scope-body { padding: 8px 14px 4px; }
  .rpt-reason { font-size: 0.72rem; color: var(--muted); padding: 2px 0; }

  /* Report header */
  .rpt-header { margin-bottom: 12px; }
  .rpt-title  { font-size: 1rem; font-weight: 500; color: var(--accent2); margin: 0 0 4px; }
  .rpt-meta   { font-size: 0.72rem; }

  /* Report body & body states */
  .rpt-body        { margin-bottom: 8px; }
  .rpt-loading,
  .rpt-placeholder { padding: 20px; font-size: 0.82rem; text-align: center; }
  .rpt-error       { padding: 12px; font-size: 0.82rem; color: var(--danger); }
  .rpt-empty       { padding: 16px; font-size: 0.82rem; }
  .rpt-muted       { color: var(--muted); }

  /* Horizontal bar chart (spend-by-category) */
  .rpt-bars      { display: flex; flex-direction: column; gap: 6px; }
  .rpt-bar-row   {
    display: grid;
    grid-template-columns: 180px 1fr 90px 44px;
    gap: 8px; align-items: center;
    padding: 3px 4px; border-radius: 4px;
  }
  .rpt-bar-row:hover         { background: var(--surface2); }
  .rpt-bar-drillable         { cursor: pointer; }
  .rpt-bar-sub               { opacity: 0.8; }
  .rpt-bar-sub .rpt-bar-track { height: 6px; }
  .rpt-bar-label { font-size: 0.78rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .rpt-bar-track { background: var(--surface2); border-radius: 3px; height: 8px; overflow: hidden; }
  .rpt-bar-fill  { height: 100%; border-radius: 3px; transition: width 0.2s; }
  .rpt-bar-value { font-size: 0.78rem; text-align: right; font-family: 'DM Mono', monospace; }
  .rpt-bar-count { font-size: 0.7rem; text-align: right; }

  /* Tables (spend-by-vendor, transaction-browser, reimbursable-tracker) */
  .rpt-table-wrap { overflow-x: auto; }
  .rpt-table {
    width: 100%; border-collapse: collapse; font-size: 0.78rem;
    font-family: 'DM Mono', monospace;
  }
  .rpt-table th {
    text-align: left; padding: 6px 10px; font-size: 0.68rem;
    color: var(--muted); text-transform: uppercase; letter-spacing: 0.6px;
    border-bottom: 1px solid var(--border);
  }
  .rpt-table td { padding: 5px 10px; border-bottom: 1px solid color-mix(in srgb, var(--border) 50%, transparent); }
  .rpt-table tr:hover td { background: var(--surface2); }
  .rpt-num { text-align: right; }

  /* Pagination */
  .rpt-pagination { display: flex; gap: 10px; align-items: center; margin-top: 10px; }

  /* Reimbursable tracker */
  .rpt-section-header {
    display: flex; justify-content: space-between; align-items: baseline;
    margin-bottom: 8px;
  }
  .rpt-section-title { font-size: 0.82rem; font-weight: 500; }
  .rpt-section-total { font-size: 0.78rem; font-family: 'DM Mono', monospace; }

  /* Cash flow */
  .rpt-cashflow-legend { font-size: 0.72rem; margin-bottom: 10px; display: flex; gap: 12px; }
  .rpt-legend-swatch {
    display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 3px;
    vertical-align: middle;
  }
  .rpt-cashflow-rows  { display: flex; flex-direction: column; gap: 10px; }
  .rpt-cashflow-row   { display: grid; grid-template-columns: 56px 1fr 200px; gap: 12px; align-items: center; }
  .rpt-cashflow-ym    { font-size: 0.72rem; font-family: 'DM Mono', monospace; }
  .rpt-cashflow-bars  { flex: 1; }
  .rpt-cashflow-vals  { display: flex; gap: 10px; font-size: 0.72rem; font-family: 'DM Mono', monospace; }

  @media (max-width: 640px) {
    .rpt-bar-row   { grid-template-columns: 120px 1fr 70px 0; }
    .rpt-bar-count { display: none; }
    .rpt-cashflow-row { grid-template-columns: 50px 1fr; }
    .rpt-cashflow-vals { display: none; }
  }

  /* ── Phase 2: prompt preview modal ─────────────────────────────────────── */
  .rpt-prompt-modal-backdrop {
    position: fixed; inset: 0; background: rgba(0,0,0,0.5);
    display: flex; align-items: center; justify-content: center;
    z-index: 1100;
  }
  .rpt-prompt-modal {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: 8px; padding: 20px; width: min(700px, 92vw);
    max-height: 85vh; overflow-y: auto;
    display: flex; flex-direction: column; gap: 12px;
  }
  .rpt-prompt-header { display: flex; flex-direction: column; gap: 4px; }
  .rpt-prompt-title  { font-size: 0.95rem; font-weight: 500; margin: 0; }
  .rpt-prompt-meta   { font-size: 0.72rem; }
  .rpt-applied-excl  { font-size: 0.75rem; }
  .rpt-applied-excl summary { cursor: pointer; color: var(--muted); }
  .rpt-excl-list     { margin: 6px 0 0 16px; padding: 0; list-style: disc; }
  .rpt-excl-list li  { margin: 2px 0; }
  .rpt-prompt-edit   {
    width: 100%; box-sizing: border-box;
    font-family: 'DM Mono', monospace; font-size: 0.75rem;
    background: var(--surface2); border: 1px solid var(--border);
    border-radius: 4px; padding: 10px; resize: vertical;
    color: var(--text); line-height: 1.5;
  }
  .rpt-prompt-footer  {
    display: flex; justify-content: space-between; align-items: center;
    flex-wrap: wrap; gap: 10px;
  }
  .rpt-prompt-skip-label { font-size: 0.78rem; display: flex; gap: 6px; align-items: center; }
  .rpt-prompt-actions { display: flex; gap: 8px; }

  /* ── Phase 2: exclusions manager panel ─────────────────────────────────── */
  .excl-panel {
    position: fixed; top: 0; right: -400px; width: 380px; height: 100vh;
    background: var(--surface); border-left: 1px solid var(--border);
    z-index: 900; display: flex; flex-direction: column;
    transition: right 0.2s ease; overflow: hidden;
  }
  .excl-panel.open { right: 0; }
  .excl-panel-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 14px 16px; border-bottom: 1px solid var(--border);
    flex-shrink: 0;
  }
  .excl-panel-title  { font-size: 0.9rem; font-weight: 500; margin: 0; }
  .excl-close-btn    { background: none; border: none; cursor: pointer; font-size: 1.1rem; color: var(--muted); padding: 2px 6px; }
  .excl-close-btn:hover { color: var(--text); }
  .excl-panel-toolbar{
    display: flex; justify-content: space-between; align-items: center;
    padding: 8px 12px; border-bottom: 1px solid var(--border); flex-shrink: 0;
  }
  .excl-filter-chips { display: flex; gap: 4px; flex-wrap: wrap; }
  .excl-chip {
    font-size: 0.72rem; padding: 2px 8px; border-radius: 12px;
    border: 1px solid var(--border); background: none; cursor: pointer; color: var(--muted);
  }
  .excl-chip:hover  { border-color: var(--accent2); color: var(--accent2); }
  .excl-chip.active { border-color: var(--accent2); background: color-mix(in srgb, var(--accent2) 15%, transparent); color: var(--accent2); }
  .excl-stale-banner {
    font-size: 0.75rem; padding: 6px 12px;
    background: color-mix(in srgb, var(--warning, #c8a87e) 15%, transparent);
    border-bottom: 1px solid var(--border); flex-shrink: 0;
  }
  .excl-list { flex: 1; overflow-y: auto; padding: 8px 0; }
  .excl-row {
    padding: 8px 14px; border-bottom: 1px solid color-mix(in srgb, var(--border) 40%, transparent);
  }
  .excl-row-main   { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
  .excl-pattern    { font-size: 0.78rem; font-family: 'DM Mono', monospace; }
  .excl-scope-badge{
    font-size: 0.65rem; padding: 1px 6px; border-radius: 10px;
    background: var(--surface2); color: var(--muted);
  }
  .excl-scope-global   { background: color-mix(in srgb, var(--accent2) 15%, transparent); }
  .excl-scope-report   { background: color-mix(in srgb, var(--accent)  12%, transparent); }
  .excl-scope-category { background: color-mix(in srgb, var(--muted)   12%, transparent); }
  .excl-match-count  { font-size: 0.68rem; margin-left: auto; }
  .excl-row-meta     { font-size: 0.7rem; margin-top: 2px; }
  .excl-row-actions  { margin-top: 4px; }
  .excl-loading, .excl-empty, .excl-error { padding: 20px 16px; font-size: 0.82rem; }
  .excl-add-form     { width: min(520px, 92vw); }
  .excl-form-body    { display: flex; flex-direction: column; gap: 10px; }
  .excl-form-body label { display: flex; flex-direction: column; gap: 4px; font-size: 0.82rem; }
  .excl-form-body input, .excl-form-body select {
    font-size: 0.82rem; padding: 5px 8px;
    background: var(--surface2); border: 1px solid var(--border);
    border-radius: 4px; color: var(--text);
  }
  .excl-form-error { font-size: 0.78rem; }

  /* ── Phase 2: leak-analysis renderer ───────────────────────────────────── */
  .leak-preview-notice  { font-size: 0.82rem; color: var(--muted); }
  .leak-preview-actions { margin: 8px 0; }
  .leak-signals         { display: flex; flex-direction: column; gap: 12px; margin-top: 12px; }
  .leak-signals-title   { font-size: 0.82rem; font-weight: 500; margin: 0 0 6px; }
  .leak-signal-list     { display: flex; flex-direction: column; gap: 4px; }
  .leak-signal-row      { display: flex; gap: 10px; align-items: baseline; font-size: 0.8rem; }
  .leak-signal-payee    { font-weight: 500; min-width: 120px; }
  .leak-signal-meta     { font-size: 0.72rem; }
  .leak-ai-meta         { font-size: 0.72rem; margin-bottom: 10px; }
  .leak-cards           { display: flex; flex-direction: column; gap: 10px; }
  .leak-card {
    border: 1px solid var(--border); border-radius: 6px; padding: 12px 14px;
    display: flex; flex-direction: column; gap: 6px;
  }
  .leak-card-header     { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
  .leak-card-type       { font-size: 0.7rem; padding: 2px 8px; border-radius: 10px; font-weight: 500; }
  .leak-type-recurring  { background: color-mix(in srgb, var(--accent2) 15%, transparent); color: var(--accent2); }
  .leak-type-anomaly    { background: color-mix(in srgb, var(--danger)  12%, transparent); color: var(--danger); }
  .leak-card-payee      { font-weight: 500; font-size: 0.88rem; }
  .leak-card-conf       { margin-left: auto; font-size: 0.72rem; }
  .leak-card-explanation{ font-size: 0.82rem; line-height: 1.5; }
  .leak-card-evidence   { font-size: 0.72rem; font-family: 'DM Mono', monospace; }
  .leak-card-actions    { margin-top: 4px; }
  .leak-suppress-btn    { font-size: 0.72rem; }
  .leak-empty           { padding: 20px; font-size: 0.82rem; text-align: center; }