/* ===========================================================================
   POMS UI — one stylesheet for every workbench screen.

   Built entirely on the site's own --ka-* design tokens, so POMS tracks the
   platform theme instead of carrying a private palette that drifts. Each var()
   keeps the current value as a fallback for any page that renders before the
   theme sheet lands.
   ======================================================================== */

.poms-wrap { padding:10px 0 40px; color:var(--ka-text-primary,#e1e3e8);
             font-family:var(--ka-font-sans,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif); }

/* ── workbench bar ─────────────────────────────────────────────────────── */
.poms-screens { display:flex; gap:2px; border-bottom:1px solid var(--ka-border,#1e2025);
                margin-bottom:10px; overflow-x:auto; }
.poms-screens a { padding:9px 16px; font-size:12px; font-weight:600; letter-spacing:.04em;
                  text-transform:uppercase; color:var(--ka-text-secondary,#9ea3ae);
                  text-decoration:none; white-space:nowrap; border-bottom:2px solid transparent; }
.poms-screens a:hover { color:var(--ka-text-primary,#e1e3e8); text-decoration:none; }
.poms-screens a.on { color:var(--ka-accent,#fb8b1e); border-bottom-color:var(--ka-accent,#fb8b1e); }

/* ── toolbar ───────────────────────────────────────────────────────────── */
.poms-toolbar { display:flex; flex-wrap:wrap; align-items:flex-end; gap:10px;
                padding:8px 10px; background:var(--ka-bg-nav,#141518);
                border:1px solid var(--ka-border,#1e2025); border-radius:var(--ka-radius,5px);
                margin-bottom:10px; }
.poms-field { display:flex; flex-direction:column; gap:3px; margin:0; }
.poms-field > span { font-size:9.5px; letter-spacing:.08em; text-transform:uppercase;
                     color:var(--ka-text-muted,#5f6470); font-weight:600; }
.poms-field select, .poms-wrap select.form-control {
    background:var(--ka-bg-input,#0e0f12); color:var(--ka-text-primary,#e1e3e8);
    border:1px solid var(--ka-border,#1e2025); border-radius:var(--ka-radius-sm,3px);
    padding:5px 8px; font-size:12.5px; min-width:130px; }
.poms-toggle { display:flex; align-items:center; gap:6px; font-size:12.5px; margin:0 0 4px;
               color:var(--ka-text-secondary,#9ea3ae); cursor:pointer; }
.poms-toolbar-right { margin-left:auto; display:flex; align-items:center; gap:10px; padding-bottom:4px; }

.poms-env { font-size:10px; letter-spacing:.06em; text-transform:uppercase;
            padding:2px 7px; border-radius:var(--ka-radius-sm,3px); border:1px solid; }
.poms-env-sandbox { color:var(--ka-warning,#f59e0b); border-color:rgba(245,158,11,.4);
                    background:rgba(245,158,11,.08); }
.poms-env-prod { color:var(--ka-negative,#ef4444); border-color:rgba(239,68,68,.45);
                 background:rgba(239,68,68,.08); }

/* ── summary strip ─────────────────────────────────────────────────────── */
.poms-strip { display:flex; flex-wrap:wrap; gap:0; border:1px solid var(--ka-border,#1e2025);
              border-radius:var(--ka-radius,5px); background:var(--ka-bg-surface,#111215);
              margin-bottom:10px; }
.poms-strip > div { padding:9px 16px; border-right:1px solid var(--ka-border,#1e2025); min-width:150px; }
.poms-strip > div:last-child { border-right:none; }
.poms-strip span { display:block; font-size:9.5px; letter-spacing:.07em; text-transform:uppercase;
                   color:var(--ka-text-muted,#5f6470); font-weight:600; margin-bottom:3px; }
.poms-strip b { font-size:15px; font-weight:600;
                font-family:var(--ka-font-mono,ui-monospace,Menlo,monospace);
                font-variant-numeric:tabular-nums; }
.poms-strip b i { font-style:normal; font-size:11px; color:var(--ka-text-muted,#5f6470); }

/* ── the grid ──────────────────────────────────────────────────────────── */
.poms-gridwrap { border:1px solid var(--ka-border,#1e2025); border-radius:var(--ka-radius,5px);
                 overflow:auto; max-height:calc(100vh - 320px); background:var(--ka-bg-surface,#111215); }
.poms-grid { width:100%; border-collapse:separate; border-spacing:0; font-size:12.5px; }
.poms-grid thead th { position:sticky; top:0; z-index:2; text-align:left;
    background:var(--ka-bg-nav,#141518); color:var(--ka-text-secondary,#9ea3ae);
    font-weight:600; font-size:10.5px; letter-spacing:.05em; text-transform:uppercase;
    padding:8px 10px; border-bottom:1px solid var(--ka-border,#1e2025); white-space:nowrap; }
.poms-grid th.n, .poms-grid td.n { text-align:right;
    font-family:var(--ka-font-mono,ui-monospace,Menlo,monospace); font-variant-numeric:tabular-nums; }
.poms-grid td { padding:5px 10px; border-bottom:1px solid var(--ka-border,#1e2025); white-space:nowrap; }
.poms-grid .w-name { min-width:260px; }

/* Group rows read as structure, not data: heavier, tinted, and clickable. */
.poms-grouprow { cursor:pointer; background:rgba(255,255,255,.022); }
.poms-grouprow:hover { background:rgba(255,255,255,.045); }
.poms-grouprow td { font-weight:600; border-bottom:1px solid var(--ka-border-light,#2a2d35); }
.poms-caret { display:inline-block; width:14px; color:var(--ka-text-muted,#5f6470); }
.poms-count { margin-left:8px; font-size:10px; font-weight:500; padding:0 6px;
              border-radius:var(--ka-radius-full,9999px); background:var(--ka-bg-hover,#1e2025);
              color:var(--ka-text-muted,#5f6470); }
.poms-leafrow:hover { background:rgba(255,255,255,.03); }
.poms-indent { display:inline-block; width:22px; }

/* Row origin: the distinction between a real holding and a synthetic
   look-through line has to be readable at a glance, or the grid looks like it
   is double-counting. */
.poms-origin { font-size:10px; padding:1px 6px; border-radius:var(--ka-radius-full,9999px);
               border:1px solid var(--ka-border-light,#2a2d35); }
.poms-origin-portfolio { color:var(--ka-text-secondary,#9ea3ae); }
.poms-origin-lookthrough { color:var(--ka-info,#06b6d4); border-color:rgba(6,182,212,.4);
                           background:rgba(6,182,212,.08); }
.poms-origin-residual { color:var(--ka-warning,#f59e0b); border-color:rgba(245,158,11,.4);
                        background:rgba(245,158,11,.08); }

.poms-pos { color:var(--ka-positive,#22c55e); }
.poms-neg { color:var(--ka-negative,#ef4444); }

/* ── cards (dashboard) ─────────────────────────────────────────────────── */
.poms-head { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:14px; }
.poms-head h1 { font-size:20px; margin:0; font-weight:600; }
.poms-grid-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(340px,1fr)); gap:14px; }
.poms-card { border:1px solid var(--ka-border,#1e2025); border-radius:var(--ka-radius,5px);
             background:var(--ka-bg-surface,#111215); }
.poms-card h2 { font-size:12px; letter-spacing:.06em; text-transform:uppercase;
                color:var(--ka-text-secondary,#9ea3ae); margin:0; padding:10px 14px;
                border-bottom:1px solid var(--ka-border,#1e2025); font-weight:600; }
.poms-card .poms-body { padding:12px 14px; }
.poms-status { font-size:22px; font-weight:600; line-height:1.2; }
.poms-ok { color:var(--ka-positive,#22c55e); }
.poms-warn { color:var(--ka-warning,#f59e0b); }
.poms-block { color:var(--ka-negative,#ef4444); }
.poms-muted { color:var(--ka-text-secondary,#9ea3ae); font-size:12px; }
.poms-kv { display:flex; justify-content:space-between; padding:4px 0; font-size:13px;
           border-bottom:1px solid var(--ka-border,#1e2025); }
.poms-kv:last-child { border-bottom:none; }
.poms-kv .v { font-variant-numeric:tabular-nums; font-weight:500;
              font-family:var(--ka-font-mono,ui-monospace,Menlo,monospace); }
.poms-tbl { width:100%; font-size:12.5px; border-collapse:collapse; }
.poms-tbl th { text-align:left; color:var(--ka-text-secondary,#9ea3ae); font-weight:600;
               padding:5px 6px; border-bottom:1px solid var(--ka-border,#1e2025); white-space:nowrap; }
.poms-tbl td { padding:5px 6px; border-bottom:1px solid var(--ka-border,#1e2025); white-space:nowrap; }
.poms-tbl tr:last-child td { border-bottom:none; }
.poms-tbl td.n, .poms-tbl th.n { text-align:right; font-variant-numeric:tabular-nums;
                                 font-family:var(--ka-font-mono,ui-monospace,Menlo,monospace); }
.poms-pill { font-size:10.5px; padding:1px 6px; border-radius:var(--ka-radius-full,9999px);
             border:1px solid var(--ka-border-light,#2a2d35); color:var(--ka-text-secondary,#9ea3ae); }
.poms-pill-block { background:var(--ka-negative-bg,rgba(239,68,68,.08));
                   border-color:rgba(239,68,68,.45); color:var(--ka-negative,#ef4444); }
.poms-pill-warn { background:rgba(245,158,11,.08); border-color:rgba(245,158,11,.4);
                  color:var(--ka-warning,#f59e0b); }
.poms-pill-ok { background:var(--ka-positive-bg,rgba(34,197,94,.08));
                border-color:rgba(34,197,94,.4); color:var(--ka-positive,#22c55e); }
.poms-note { font-size:12px; color:var(--ka-text-secondary,#9ea3ae); margin-top:8px; }
.poms-empty { color:var(--ka-text-muted,#5f6470); font-size:12.5px; padding:6px 0; }
.poms-bar { height:5px; background:var(--ka-bg-hover,#1e2025); border-radius:3px;
            overflow:hidden; margin-top:3px; }
.poms-bar > span { display:block; height:100%; background:var(--ka-positive,#22c55e); }
.poms-bar.near > span { background:var(--ka-warning,#f59e0b); }
.poms-bar.over > span { background:var(--ka-negative,#ef4444); }

/* ── product page ──────────────────────────────────────────────────────── */
.poms-sell { max-width:1080px; margin:0 auto; padding:8px 0 48px; }
.poms-sell-hero { text-align:center; padding:44px 16px 34px; }
.poms-sell-eyebrow { font-size:11px; letter-spacing:.16em; text-transform:uppercase;
                     color:var(--ka-accent,#fb8b1e); margin-bottom:12px; font-weight:600; }
.poms-sell-hero h1 { font-size:46px; font-weight:700; letter-spacing:-.02em; margin:0 0 16px; }
.poms-sell-lead { font-size:20px; line-height:1.45; max-width:720px; margin:0 auto 16px; font-weight:500; }
.poms-sell-sub { font-size:14.5px; line-height:1.65; max-width:700px; margin:0 auto 26px;
                 color:var(--ka-text-secondary,#9ea3ae); }
.poms-sell-btn { display:inline-block; background:var(--ka-accent,#fb8b1e);
                 color:var(--ka-text-inverse,#0b0b0c); text-decoration:none; font-size:14px;
                 font-weight:600; padding:11px 26px; border-radius:var(--ka-radius,5px); }
.poms-sell-btn:hover { background:var(--ka-accent-hover,#f59e0b);
                       color:var(--ka-text-inverse,#0b0b0c); text-decoration:none; }
.poms-sell-mail { margin-top:12px; font-size:13px; color:var(--ka-link,#FFA028);
                  font-family:var(--ka-font-mono,ui-monospace,Menlo,monospace); }
.poms-sell-note { margin-top:8px; font-size:12.5px; color:var(--ka-text-muted,#5f6470);
                  max-width:520px; margin-left:auto; margin-right:auto; }
.poms-sell-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
                  gap:16px; margin-top:16px; }
.poms-sell-card { border:1px solid var(--ka-border,#1e2025); border-radius:var(--ka-radius-lg,8px);
                  padding:20px 22px; background:var(--ka-bg-surface,#111215); }
.poms-sell-card h3 { font-size:15px; font-weight:600; margin:0 0 8px; }
.poms-sell-card p { font-size:13.5px; line-height:1.6; color:var(--ka-text-secondary,#9ea3ae); margin:0; }
.poms-sell-honest { margin-top:26px; border:1px solid var(--ka-border,#1e2025);
                    border-left:3px solid var(--ka-accent,#fb8b1e);
                    border-radius:var(--ka-radius-lg,8px); padding:20px 24px;
                    background:var(--ka-bg-nav,#141518); }
.poms-sell-honest h3 { font-size:14px; font-weight:600; margin:0 0 8px; }
.poms-sell-honest p { font-size:13.5px; line-height:1.6; color:var(--ka-text-secondary,#9ea3ae); margin:0; }
.poms-sell-foot { text-align:center; margin-top:34px; }
@media (max-width:640px){ .poms-sell-hero h1 { font-size:32px; } .poms-sell-lead { font-size:17px; } }

/* ── buttons, wide fields, side pills, docked panel, modal ─────────────── */
.poms-field-wide { flex:1 1 320px; min-width:260px; }
.poms-field input[type=text] { background:var(--ka-bg-input,#0e0f12);
    color:var(--ka-text-primary,#e1e3e8); border:1px solid var(--ka-border,#1e2025);
    border-radius:var(--ka-radius-sm,3px); padding:5px 8px; font-size:12.5px; width:100%;
    font-family:var(--ka-font-mono,ui-monospace,Menlo,monospace); }
.poms-btn { background:var(--ka-bg-hover,#1e2025); color:var(--ka-text-primary,#e1e3e8);
    border:1px solid var(--ka-border-light,#2a2d35); border-radius:var(--ka-radius-sm,3px);
    padding:6px 14px; font-size:12.5px; font-weight:600; cursor:pointer; margin-bottom:1px; }
.poms-btn:hover { border-color:var(--ka-border-focus,#3d4150); }
.poms-btn-primary { background:var(--ka-accent,#fb8b1e); color:var(--ka-text-inverse,#0b0b0c);
                    border-color:var(--ka-accent,#fb8b1e); }
.poms-btn-primary:hover { background:var(--ka-accent-hover,#f59e0b); }

/* Buy/Sell read as actions, so they get solid colour rather than an outline. */
.poms-side { display:inline-block; min-width:44px; text-align:center; font-size:10.5px;
    font-weight:700; padding:2px 8px; border-radius:var(--ka-radius-sm,3px); }
.poms-side-buy { background:rgba(34,197,94,.16); color:var(--ka-positive,#22c55e);
                 border:1px solid rgba(34,197,94,.45); }
.poms-side-sell { background:rgba(239,68,68,.16); color:var(--ka-negative,#ef4444);
                  border:1px solid rgba(239,68,68,.45); }

.poms-dock { margin-top:12px; border:1px solid var(--ka-border,#1e2025);
             border-radius:var(--ka-radius,5px); background:var(--ka-bg-surface,#111215); }
.poms-dock h2 { font-size:12px; letter-spacing:.06em; text-transform:uppercase;
    color:var(--ka-text-secondary,#9ea3ae); margin:0; padding:9px 14px;
    border-bottom:1px solid var(--ka-border,#1e2025); font-weight:600; }
.poms-dock h2 .poms-muted { text-transform:none; letter-spacing:0; font-weight:400; }
.poms-gridwrap-short { max-height:260px; border:none; border-radius:0; }

.poms-modal-back { position:fixed; inset:0; background:rgba(0,0,0,.62); z-index:1050;
                   display:flex; align-items:center; justify-content:center; padding:24px; }
.poms-modal { background:var(--ka-bg-surface,#111215); border:1px solid var(--ka-border,#1e2025);
    border-radius:var(--ka-radius-lg,8px); box-shadow:var(--ka-shadow-lg,0 4px 16px rgba(0,0,0,.4));
    width:min(1100px,100%); max-height:86vh; display:flex; flex-direction:column; }
.poms-modal-head { display:flex; align-items:center; justify-content:space-between;
    padding:14px 18px; border-bottom:1px solid var(--ka-border,#1e2025); }
.poms-modal-head h3 { margin:0; font-size:16px; font-weight:600; }
.poms-modal-x { color:var(--ka-text-secondary,#9ea3ae); font-size:22px; line-height:1;
                text-decoration:none; }
.poms-modal-x:hover { color:var(--ka-text-primary,#e1e3e8); text-decoration:none; }
.poms-modal-body { padding:14px 18px; overflow:auto; }