.stockledger-app {
    /* Unified with app design system (variables.css) — was a standalone
       earthy/stone palette + IBM Plex Sans/Space Grotesk, now maps onto
       the same tokens every other page uses so this section matches the
       app's blue theme instead of looking like a separate product. */
    --ink:var(--text);
    --ink-soft:var(--muted);
    --paper:var(--bg);
    --panel:var(--surface);
    --line:var(--border);
    --teal:var(--accent);
    --teal-dark:var(--accent-dk);
    --rust:var(--red);
    --amber:var(--amber);
    --indigo:var(--accent);
    --rust-bg:var(--rlt);
    --amber-bg:var(--alt2);
    --indigo-bg:var(--alt);
    --slate:var(--t2);
    --slate-bg:var(--s3);
    --stone:var(--muted);
    --stone-bg:var(--s2);
    /* --mono/--sans inherit directly from :root (variables.css) now;
       --display collapses onto --sans since there's no separate display
       face in the app's type system. */
    --display:var(--sans);
  }
.stockledger-app * {box-sizing:border-box;}
.stockledger-app {
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:var(--sans);
    -webkit-font-smoothing:antialiased;
  }
.stockledger-app ::selection {background:var(--teal); color:#fff;}
.stockledger-app header {
    background:var(--ink);
    color:#EFEFEA;
    padding:28px clamp(16px,4vw,48px) 24px;
    position:relative;
    overflow:hidden;
  }
.stockledger-app header::after {
    content:"";
    position:absolute; top:0; right:0; bottom:0; width:260px;
    background:
      repeating-linear-gradient(135deg, rgba(255,255,255,0.035) 0 2px, transparent 2px 14px);
    pointer-events:none;
  }
.stockledger-app .eyebrow {
    font-family:var(--mono);
    font-size:11px;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#8FB8B0;
    margin:0 0 6px;
  }
.stockledger-app h1 {
    font-family:var(--display);
    font-weight:700;
    font-size:clamp(26px,3.4vw,38px);
    margin:0 0 6px;
    letter-spacing:-0.01em;
  }
.stockledger-app .sub {
    color:#B9C0BE;
    font-size:14px;
    max-width:640px;
    line-height:1.5;
    margin:0;
  }
.stockledger-app .asof {
    font-family:var(--mono);
    font-size:12px;
    color:#8FB8B0;
    margin-top:14px;
  }
.stockledger-app .uploadwrap {
    padding:20px clamp(16px,4vw,48px);
  }
.stockledger-app .dropzone {
    background:var(--panel);
    border:1.5px dashed var(--line);
    border-radius:6px;
    padding:22px;
    display:flex;
    align-items:center;
    gap:18px;
    flex-wrap:wrap;
    transition:border-color .15s ease, background .15s ease;
  }
.stockledger-app .dropzone.drag {
    border-color:var(--teal);
    background:var(--indigo-bg);
  }
.stockledger-app .dropzone .icon {
    width:38px; height:38px; flex:none;
    border-radius:50%;
    background:var(--teal-dark);
    color:#fff;
    display:flex; align-items:center; justify-content:center;
    font-family:var(--mono);
    font-size:16px;
  }
.stockledger-app .dropzone .text strong {display:block; font-size:14.5px; margin-bottom:2px;}
.stockledger-app .dropzone .text span {font-size:12.5px; color:var(--ink-soft);}
.stockledger-app .filebtn {
    margin-left:auto;
    background:var(--teal);
    color:#fff;
    border:none;
    padding:10px 18px;
    border-radius:5px;
    font-family:var(--sans);
    font-weight:600;
    font-size:13.5px;
    cursor:pointer;
    transition:background .15s ease;
  }
.stockledger-app .filebtn:hover {background:var(--teal-dark);}
.stockledger-app #sl-fileInput {display:none;}
.stockledger-app .filename {font-family:var(--mono); font-size:12px; color:var(--ink-soft);}
.stockledger-app .loaderr {color:var(--rust); font-size:13px; font-family:var(--mono); margin-top:10px; display:none;}
.stockledger-app .dbxpanel {
    margin-top:14px;
    border:1px solid var(--line);
    border-radius:6px;
    background:var(--panel);
    overflow:hidden;
  }
.stockledger-app .dbxtoggle {
    width:100%;
    background:none;
    border:none;
    padding:13px 16px;
    display:flex;
    align-items:center;
    gap:8px;
    font-family:var(--display);
    font-weight:600;
    font-size:14px;
    color:var(--ink);
    cursor:pointer;
  }
.stockledger-app .dbxicon {color:var(--indigo); font-size:15px;}
.stockledger-app .dbxtoggle .chev {margin-left:auto; color:var(--ink-soft); font-size:11px; transition:transform .15s ease;}
.stockledger-app .dbxtoggle.open .chev {transform:rotate(180deg);}
.stockledger-app .dbxbody {
    display:none;
    padding:4px 16px 18px;
    border-top:1px solid var(--paper);
  }
.stockledger-app .dbxbody.open {display:block;}
.stockledger-app .dbxstep {margin-top:14px;}
.stockledger-app .dbxlabel {
    font-size:12.5px;
    font-weight:600;
    color:var(--ink);
    margin:0 0 6px;
  }
.stockledger-app .dbxhint {
    font-weight:400;
    color:var(--ink-soft);
    font-size:11.5px;
  }
.stockledger-app .dbxrow {display:flex; gap:8px; flex-wrap:wrap;}
.stockledger-app .dbxrow input {
    flex:1; min-width:180px;
    padding:9px 11px;
    border:1px solid var(--line);
    border-radius:5px;
    font-family:var(--mono);
    font-size:12.5px;
    background:var(--panel);
  }
.stockledger-app .dbxrow .btn-ghost, .stockledger-app .dbxrow .filebtn {white-space:nowrap;}
.stockledger-app .dbxstatus {
    font-family:var(--mono);
    font-size:12px;
    color:var(--ink-soft);
    margin:14px 0 0;
    min-height:16px;
  }
.stockledger-app .dbxstatus.err {color:var(--rust);}
.stockledger-app .dbxstatus.ok {color:var(--teal-dark);}
.stockledger-app .dbxlabel.ok {color:var(--teal-dark);}
.stockledger-app .srctag {
  font-family:var(--mono); font-size:9.5px; letter-spacing:.06em; text-transform:uppercase;
  background:var(--indigo-bg); color:var(--indigo); padding:2px 7px; border-radius:20px;
  font-weight:600; margin-left:2px;
}
.stockledger-app .fallbacklabel {
  font-family:var(--mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase;
  color:var(--ink-soft); margin:16px 0 8px;
}
.stockledger-app .exportbar {
    display:flex; align-items:center; gap:12px;
    margin-bottom:18px;
  }
.stockledger-app .exportbar .filebtn {background:var(--indigo); margin-left:0;}
.stockledger-app .exportbar .filebtn:hover {background:var(--teal-dark);}
.stockledger-app main {padding:0 clamp(16px,4vw,48px) 60px; display:none;}
.stockledger-app .empty {
    padding:60px clamp(16px,4vw,48px);
    text-align:center;
    color:var(--ink-soft);
    font-size:14px;
  }
.stockledger-app .empty strong {display:block; color:var(--ink); font-family:var(--display); font-size:19px; margin-bottom:6px; font-weight:600;}
.stockledger-app .cards {
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
    gap:14px;
    margin:22px 0 26px;
  }
.stockledger-app .card {
    background:var(--panel);
    border:1px solid var(--line);
    border-radius:6px;
    padding:18px 18px 16px;
    position:relative;
    overflow:hidden;
  }
.stockledger-app .card .tag {
    font-family:var(--mono);
    font-size:10.5px;
    letter-spacing:.1em;
    text-transform:uppercase;
    padding:3px 8px;
    border-radius:20px;
    display:inline-block;
    margin-bottom:12px;
    font-weight:600;
  }
.stockledger-app .card.rust .tag {background:var(--rust-bg); color:var(--rust);}
.stockledger-app .card.amber .tag {background:var(--amber-bg); color:var(--amber);}
.stockledger-app .card.indigo .tag {background:var(--indigo-bg); color:var(--indigo);}
.stockledger-app .card.slate .tag {background:var(--slate-bg); color:var(--slate);}
.stockledger-app .card.stone .tag {background:var(--stone-bg); color:var(--stone);}
.stockledger-app .card .num {
    font-family:var(--display);
    font-size:30px;
    font-weight:700;
    line-height:1;
    margin-bottom:6px;
  }
.stockledger-app .card .lbl {font-size:12.5px; color:var(--ink-soft);}
.stockledger-app .stamp {
    position:absolute; top:14px; right:-10px;
    font-family:var(--mono); font-size:10px; letter-spacing:.08em;
    color:currentColor; opacity:.35;
    border:1.5px solid currentColor; border-radius:4px;
    padding:3px 8px;
    transform:rotate(9deg);
  }
.stockledger-app .card.rust .stamp {color:var(--rust);}
.stockledger-app .card.amber .stamp {color:var(--amber);}
.stockledger-app .card.indigo .stamp {color:var(--indigo);}
.stockledger-app .card.slate .stamp {color:var(--slate);}
.stockledger-app .card.stone .stamp {color:var(--stone);}
.stockledger-app .tabs {
    display:flex;
    gap:4px;
    border-bottom:2px solid var(--line);
    margin-bottom:18px;
    flex-wrap:wrap;
  }
.stockledger-app .tab {
    font-family:var(--display);
    font-weight:600;
    font-size:14.5px;
    background:none;
    border:none;
    padding:12px 16px 11px;
    cursor:pointer;
    color:var(--ink-soft);
    border-bottom:3px solid transparent;
    margin-bottom:-2px;
    display:flex; align-items:center; gap:8px;
  }
.stockledger-app .tab .count {
    font-family:var(--mono);
    font-size:11px;
    background:var(--paper);
    color:var(--ink-soft);
    padding:1px 7px;
    border-radius:20px;
  }
.stockledger-app .tab.active {color:var(--ink);}
.stockledger-app .tab.active.rust {border-color:var(--rust);}
.stockledger-app .tab.active.amber {border-color:var(--amber);}
.stockledger-app .tab.active.indigo {border-color:var(--indigo);}
.stockledger-app .tab.active.slate {border-color:var(--slate);}
.stockledger-app .tab.active.stone {border-color:var(--stone);}
.stockledger-app .tab.active .count {background:var(--ink); color:#fff;}
.stockledger-app .panel {display:none;}
.stockledger-app .panel.active {display:block;}
.stockledger-app .controls {
    display:flex;
    align-items:center;
    gap:14px;
    flex-wrap:wrap;
    margin-bottom:14px;
  }
.stockledger-app .search {
    flex:1; min-width:200px;
    position:relative;
  }
.stockledger-app .search input {
    width:100%;
    padding:9px 12px 9px 30px;
    border:1px solid var(--line);
    border-radius:5px;
    font-size:13.5px;
    font-family:var(--sans);
    background:var(--panel);
  }
.stockledger-app .search::before {
    content:"⌕";
    position:absolute; left:10px; top:50%; transform:translateY(-50%);
    color:var(--ink-soft); font-size:14px;
  }
.stockledger-app .toggle-group {
    display:flex;
    background:var(--panel);
    border:1px solid var(--line);
    border-radius:5px;
    overflow:hidden;
  }
.stockledger-app .toggle-group button {
    border:none; background:none; padding:8px 14px;
    font-family:var(--mono); font-size:12.5px; cursor:pointer;
    color:var(--ink-soft);
  }
.stockledger-app .toggle-group button.active {background:var(--ink); color:#fff;}
.stockledger-app .btn-ghost {
    border:1px solid var(--line);
    background:var(--panel);
    padding:8px 14px;
    border-radius:5px;
    font-size:12.5px;
    font-family:var(--mono);
    cursor:pointer;
    color:var(--ink-soft);
  }
.stockledger-app .btn-ghost:hover {border-color:var(--ink); color:var(--ink);}
.stockledger-app .note {
    font-size:12.5px;
    color:var(--ink-soft);
    margin:0 0 14px;
    line-height:1.5;
    background:var(--panel);
    border-left:3px solid var(--line);
    padding:10px 14px;
    border-radius:0 4px 4px 0;
  }
.stockledger-app .tablewrap {
    background:var(--panel);
    border:1px solid var(--line);
    border-radius:6px;
    overflow:auto;
    max-height:64vh;
  }
.stockledger-app table {border-collapse:collapse; width:100%; font-size:12.8px;}
/* Table shell (thead/tbody/tfoot/hover/num/name-cell/sub/val/
   noresults/footer + the 640px padding media query) now lives in
   css/components.css, shared with .excessworking-app/.reorder-app —
   see that file's "SHARED REPORT TABLE SHELL" comment. Kept out of
   here to kill the 3x-duplicated-block drift risk; nothing about how
   this page looks changed. */