/* ============================================================
   APP UI LANGUAGE — shared by every product visual on the site
   (.pui wrappers, .ui-frame windows, hero .appwin). Same system as
   the hero: Geist only, 400/500/600, 11.5/12.5/13.5/15/20 scale,
   hairline borders, ruled KPI strips, soft status pills.
   Tokens + chat rules live in hero-ui.css; this file covers the
   rest of the component library. Load after all other CSS.
   ============================================================ */
.pui,.ui-frame{--font-head:"Geist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;--font-body:"Geist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;--pui-border:#E2E4E9;--pui-muted:#656B77;font-synthesis-weight:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"ss01","cv11";letter-spacing:-.006em}
.pui,.ui-frame{font-family:var(--font-body)}
.pui :is(.amt,.acl-kpi-n,.opk-n,.orh-val,.orr-val,.sdc-amt,.tn-val,.tl-val,.init-val,.kpi-big,.sd-total b){font-feature-settings:"tnum"}

/* ---- window chrome ---- */
.ui-frame{border-radius:12px;border-color:var(--ui-line)}
.ui-bar{height:40px;box-sizing:border-box;padding:0 14px;gap:6px;background:#FAFAFB;border-bottom-color:var(--ui-line)}
.ui-bar i{width:10px;height:10px}
.ui-bar .ui-url{font-size:12px;color:var(--ui-muted);border-color:var(--ui-line);border-radius:6px;padding:3px 10px}
.pui .prod-panel .pp-head{min-height:48px;box-sizing:border-box;padding-top:0;padding-bottom:0;border-bottom-color:var(--ui-line)}
.pui .prod-panel .pp-title{font-size:14px;font-weight:600;letter-spacing:-.012em;color:var(--ui-ink)}
.pui .prod-panel .pp-sub{font-size:12.5px;color:var(--ui-muted)}

/* ---- hairlines everywhere ---- */
.pui :is(.rev-item,.opp-rr,.opp-cols,.sd-head,.sd-foot,.tm-head,.init-row,.acl-toolbar,.atlas-foot,.opp-rank-hd,.tax-leaves,.tax-leaves-hd,.ba-side,.ba-tag),.pui .tbl-cat tbody td{border-color:var(--ui-line)}

/* ---- KPI strips (one ruled strip, no filled boxes) ---- */
.pui .acl-kpis,.pui .opp-rank .opp-kpis{gap:1px;background:var(--ui-line);border:1px solid var(--ui-line);border-radius:10px;overflow:hidden;padding:0;margin:16px 20px 14px}
.pui .acl-kpi,.pui .opp-kpis .opk-card{background:#fff;border-radius:0;padding:12px 16px}
.pui .acl-kpi-l,.pui .opp-kpis .opk-l{font-size:12px;font-weight:500;color:var(--ui-muted);margin-bottom:0}
.pui .acl-kpi-n,.pui .opp-kpis .opk-n{margin-top:4px;font-size:20px;font-weight:600;letter-spacing:-.025em;color:var(--ui-ink)}
.pui .opp-kpis .opk-n{display:block}

/* ---- toolbars + buttons ---- */
.pui .acl-toolbar{min-height:40px;box-sizing:border-box;padding-top:0;padding-bottom:0;font-size:12.5px;font-weight:500;color:var(--ui-muted)}
.pui .acl-grp{color:var(--ui-ink)}
.pui .acl-toggle{background:var(--ui-ink)}
.pui .acl-rerun,.pui .tax-btn{height:30px;box-sizing:border-box;padding:0 11px;font-size:12.5px;font-weight:500;border-radius:7px;border-color:var(--ui-line-2);color:var(--ui-ink);gap:6px}
.pui .acl-rerun{border-color:var(--ui-ink)}
.pui .tax-btn svg,.pui .acl-rerun .acl-rerun-ic{width:14px;height:14px}
.pui .tax-btn:hover{border-color:#C9CCD3;color:var(--ui-ink);background:var(--ui-fill)}
.pui .tax-btn.danger{color:var(--ui-red)}
.pui .rev-actions .tax-btn.go{border-color:#CDE8D6;color:var(--ui-green)}
.pui .tax-search{border-color:var(--ui-line-2);border-radius:8px;padding:7px 11px}
.pui .tax-search span{font-size:13px;color:var(--ui-faint)}

/* ---- tables ---- */
.pui .tbl-cat{font-size:13.5px}
.pui .tbl-cat thead th{background:var(--ui-fill);font-size:12px;font-weight:500;color:var(--ui-muted);border-bottom:1px solid var(--ui-line)}
.pui .tbl-cat tbody td{color:var(--ui-text)}
.pui .tbl-cat .sup{font-weight:500;color:var(--ui-ink)}
.pui .tbl-cat .amt{color:var(--ui-ink)}
.pui .tbl-cat .reason{font-size:12.5px;color:var(--ui-muted)}
.pui .opp-cols{background:var(--ui-fill)}
.pui .opp-cols span{font-size:12px;font-weight:500;letter-spacing:0;color:var(--ui-muted)}
.pui .opp-rr .orr-opp b{font-size:13.5px;font-weight:500;letter-spacing:-.01em;color:var(--ui-ink)}
.pui .opp-rr .orr-desc{font-size:12px;color:var(--ui-muted)}
.pui .opp-rr .orr-sit{font-size:11.5px;font-weight:500;color:var(--ui-text);background:var(--ui-fill-2);border-color:transparent;border-radius:5px;padding:2px 7px}
.pui .opp-rr .orr-src{font-size:12.5px;font-weight:500}
.pui .opp-rr .orr-conf,.pui .opp-rr .orr-owner{font-size:13px;color:var(--ui-text)}
.pui .opp-rr .cdot{width:7px;height:7px}
.pui .opp-rr .orr-val{font-size:13.5px;font-weight:600;color:var(--ui-ink)}

/* ---- pills / chips ---- */
.pui .opp-rr .orr-stage{height:22px;box-sizing:border-box;padding:0 9px;font-size:12px;font-weight:500;white-space:nowrap;flex:0 0 auto}
.pui .opp-rr .st-exec{background:var(--ui-amber-bg);color:var(--ui-amber)}
.pui .opp-rr .st-accepted{background:var(--ui-accent-bg);color:#1F4FC4}
.pui .opp-rr .st-detected{background:#F1EDFB;color:#5B3CB8}
.pui .opp-rr .st-review{background:var(--ui-fill-2);color:var(--ui-text)}
.pui .cat-chip{font-size:12px;font-weight:500;padding:2px 8px;border-radius:6px;border-color:var(--ui-line-2);color:var(--ui-text)}
.pui .cat-chip.leaf-green{border-color:#CDE8D6;color:var(--ui-green)}
.pui .cat-chip.leaf-red{border-color:#F3CFCC;color:var(--ui-red)}
.pui .cat-sep{color:var(--ui-faint)}
.pui .conf{height:22px;box-sizing:border-box;padding:0 9px;font-size:12px;font-weight:500;white-space:nowrap;flex:0 0 auto}
.pui .conf-hi{background:var(--ui-green-bg);color:var(--ui-green)}
.pui .conf-med{background:var(--ui-amber-bg);color:var(--ui-amber)}
.pui .conf-low{background:var(--ui-red-bg);color:var(--ui-red)}
.pui .health{font-size:12px;font-weight:500;padding:2px 8px;border-radius:6px;white-space:nowrap;flex:0 0 auto}
.pui .health-crit{background:var(--ui-red-bg);color:var(--ui-red)}
.pui .health-rev{background:var(--ui-amber-bg);color:var(--ui-amber)}
.pui .health-info{background:var(--ui-accent-bg);color:#1F4FC4}
.pui .sd-child .sdc-src{font-size:11px;font-weight:500;color:var(--ui-text);background:var(--ui-fill-2);border-color:transparent;border-radius:5px;padding:2px 7px}

/* ---- section labels: sentence case, no tracking ---- */
.pui :is(.rev-label,.sd-childhd,.tax-leaves-hd,.ba-tag),.pui .opp-rank-hd .orh-label{text-transform:none;letter-spacing:0;font-size:12px;font-weight:500;color:var(--ui-muted)}
.pui .ba-before .ba-tag{color:var(--ui-red)}
.pui .ba-after .ba-tag{color:var(--ui-green)}

/* ---- headers + titles ---- */
.pui .opp-rank-hd{padding:16px 20px}
.pui .opp-rank-hd .orh-val{font-size:22px;font-weight:600;letter-spacing:-.025em}
.pui .opp-rank-hd .orh-side{font-size:12px;color:var(--ui-muted)}
.pui .rev-item{padding:14px 20px}
.pui .rev-head b{font-size:13.5px;font-weight:600;letter-spacing:-.01em;color:var(--ui-ink)}
.pui .rev-head .rev-meta,.pui .rev-why{font-size:12.5px;color:var(--ui-muted)}
.pui .rev-why b{font-weight:500;color:var(--ui-ink)}
.pui .sd-head{padding:16px 20px}
.pui .sd-head .sd-name{font-size:15px;font-weight:600;letter-spacing:-.015em;color:var(--ui-ink)}
.pui .sd-head .sd-sub{font-size:12.5px;color:var(--ui-muted)}
.pui .sd-head .sd-total b{font-size:18px;font-weight:600;color:var(--ui-ink)}
.pui .sd-head .sd-total span,.pui .sd-foot{font-size:12px;color:var(--ui-muted)}
.pui .sd-child{padding:8px 12px;border-radius:7px}
.pui .sd-child .sdc-name{font-size:13px;color:var(--ui-faint)}
.pui .sd-child .sdc-amt{font-size:13px;font-weight:500;color:var(--ui-ink)}
.pui .tax-title{font-size:15px;font-weight:600;letter-spacing:-.015em;color:var(--ui-ink)}
.pui .tax-title .tax-count{font-size:11.5px;font-weight:500;color:var(--ui-text);background:var(--ui-fill-2);border-color:transparent;border-radius:5px;padding:2px 7px}
.pui .tax-node{border-radius:10px}
.pui .tax-node .tn-name{font-size:14px;font-weight:600;letter-spacing:-.012em}
.pui .tax-node .tn-val{font-size:12.5px;font-weight:500}
.pui .tax-leaf .tl-name{font-size:12.5px;color:var(--ui-text)}
.pui .tax-leaf .tl-track{height:6px;background:var(--ui-fill-2)}
.pui .tax-leaf .tl-val{font-size:12px;color:var(--ui-muted)}
.pui .tm-head{padding:16px 20px}
.pui .tm-head .tm-all{font-size:15px;font-weight:600;letter-spacing:-.015em;color:var(--ui-ink)}
.pui .tm-head .tm-total{font-size:12.5px;color:var(--ui-muted)}
.pui .tm-cell b{font-weight:600}
.pui .init-row{padding:12px 16px}
.pui .init-row b{font-size:13.5px;font-weight:500;color:var(--ui-ink)}
.pui .init-row span:not(.pill):not(.dot){font-size:12.5px;color:var(--ui-muted)}
.pui .init-row .init-val{font-size:15px;font-weight:600;color:var(--ui-ink)}
.pui .kpi-chip .kpi-title{font-size:14px;font-weight:500;color:var(--ui-ink)}
.pui .kpi-chip .kpi-big{font-size:36px;font-weight:600;letter-spacing:-.03em}
.pui .kpi-chip .kpi-delta{font-size:13px;font-weight:500;color:var(--ui-green)}
.pui .kpi-bar{height:6px;background:var(--ui-fill-2)}
.pui .ba-line{font-size:13px}
.pui .ba-line .ba-name{color:var(--ui-ink);font-weight:500}
.pui .atlas-foot{font-size:12.5px;color:var(--ui-muted)}
.pui .atlas-foot b{color:var(--ui-ink);font-weight:600}
.pui .atlas-classify .cl-result .conf{font-size:12.5px;color:var(--ui-text);height:auto;padding:0;background:transparent}

/* ---- phones: keep every product visual inside the column ---- */
@media (max-width:760px){
  .pui,.split>*,.grid>*{min-width:0}
  .pui,.pui .ui-frame,.pui .prod-panel,.pui .opp-card{max-width:100%;box-sizing:border-box}
  .pui .opp-top{flex-wrap:wrap;row-gap:8px}
  .pui .opp-actions{flex-wrap:wrap}
  .pui .opp-top>*{min-width:0}
  .pui .pp-head{flex-wrap:wrap;row-gap:4px}
  .pui .ac-head{flex-wrap:wrap;gap:8px}
  .pui .ac-head>*{min-width:0}
  .pui .acat-top{flex-wrap:wrap;row-gap:10px}
  .pui .acat-actions{flex-wrap:wrap}
  .pui.feat-visual .auto-cat .acat-tablewrap{overflow-x:auto}
  .pui .tbl-cat{width:100%;font-size:12.5px}
  .pui .tbl-cat thead th,.pui .tbl-cat tbody td{padding-left:10px;padding-right:10px}
  .pui .tbl-cat .reason{display:none}
  .pui .tbl-cat .conf{font-size:0;gap:0;padding:0;width:22px;justify-content:center}
  .pui .tbl-cat .conf .dot{margin:0}
  .pui .tbl-cat .cat-chip{white-space:normal}
  .pui .sd-head{flex-wrap:wrap;row-gap:8px}
  .pui .ui-bar .ui-url{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}