
  :root{
    --navy:#0B1F3A;--navy2:#13294B;--navy3:#1C3A63;--blue:#2563EB;--teal:#0D9488;--red:#C8102E;
    --ink:#1E293B;--muted:#64748B;--faint:#94A3B8;--line:#E6EBF2;--line2:#D8E0EA;
    --bg:#F4F7FB;--card:#FFFFFF;--ice:#EAF0F7;
    --okbg:#DCFCE7;--okfg:#15803D;--infobg:#E6F0FE;--infofg:#1D4ED8;--warnbg:#FEF3C7;--warnfg:#92580B;--dngbg:#FCE9EC;--dngfg:#B11226;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--ink);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
  .app{display:flex;min-height:100vh}
  .sidebar{width:236px;background:var(--navy);color:#CADCFC;flex-shrink:0;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow:auto}
  .brand{display:flex;align-items:center;gap:10px;padding:18px 18px 12px}
  .brand .mark{width:32px;height:32px;border-radius:8px;background:var(--teal);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px}
  .brand .nm{color:#fff;font-weight:600;font-size:15px}
  .brand .sub{font-size:10px;color:#7F9AC4;letter-spacing:1.4px;text-transform:uppercase}
  .navsec{font-size:10px;letter-spacing:1.3px;text-transform:uppercase;color:#5C77A3;padding:13px 20px 5px}
  .nav-item{display:flex;align-items:center;gap:11px;padding:8px 18px;margin:1px 10px;border-radius:9px;color:#AFC4E6;cursor:pointer;font-size:13px;border:none;background:none;width:calc(100% - 20px);text-align:left}
  .nav-item i{font-size:18px;width:19px}
  .nav-item:hover{background:var(--navy2);color:#fff}
  .nav-item.active{background:var(--blue);color:#fff}
  .nav-item .badge{margin-left:auto;background:var(--red);color:#fff;font-size:10px;font-weight:700;border-radius:999px;padding:1px 7px}
  .side-foot{margin-top:auto;padding:13px 16px;border-top:1px solid var(--navy3);display:flex;align-items:center;gap:10px}
  .side-foot .av{width:32px;height:32px;border-radius:50%;background:var(--navy3);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600}
  .side-foot .nm{color:#fff;font-size:13px}.side-foot .rl{color:#7F9AC4;font-size:11px}
  .content{flex:1;min-width:0;display:flex;flex-direction:column}
  .topbar{height:58px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:0 22px;position:sticky;top:0;z-index:5}
  .search{flex:1;max-width:420px;display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:8px 12px;color:var(--muted);font-size:13px}
  .search input{border:none;background:none;outline:none;flex:1;font-size:13px;color:var(--ink)}
  .pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:5px 11px;border-radius:999px;background:var(--okbg);color:var(--okfg)}
  .dot{width:7px;height:7px;border-radius:50%;background:var(--teal);display:inline-block;animation:pulse 1.8s infinite}
  @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(13,148,136,.5)}70%{box-shadow:0 0 0 6px rgba(13,148,136,0)}100%{box-shadow:0 0 0 0 rgba(13,148,136,0)}}
  .tb-icon{width:36px;height:36px;border-radius:9px;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:19px;cursor:pointer}
  .tb-icon:hover{background:var(--bg)}
  .av-sm{width:33px;height:33px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600}
  main{padding:22px 24px;flex:1}
  .view{display:none}.view.active{display:block}
  .vh{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:16px;flex-wrap:wrap;gap:10px}
  .vh h1{font-size:21px;font-weight:600;color:var(--navy)}.vh p{color:var(--muted);font-size:13px;margin-top:3px}
  .btn{display:inline-flex;align-items:center;gap:7px;background:var(--blue);color:#fff;border:none;border-radius:9px;padding:9px 14px;font-size:13px;font-weight:600;cursor:pointer}
  .btn:hover{background:#1d4ed8}
  .card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px}
  .card h3{font-size:15px;font-weight:600;margin-bottom:10px}
  .muted{color:var(--muted)}.tiny{font-size:12px}.mono{font-family:ui-monospace,Menlo,monospace}
  .ini{width:38px;height:38px;border-radius:50%;background:var(--infobg);color:var(--infofg);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;flex-shrink:0}
  .chip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:999px;background:var(--ice);color:var(--navy)}
  .chip-info{background:var(--infobg);color:var(--infofg)}.chip-ok{background:var(--okbg);color:var(--okfg)}.chip-warn{background:var(--warnbg);color:var(--warnfg)}.chip-dng{background:var(--dngbg);color:var(--dngfg)}
  .tg-chip{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:600;padding:3px 8px;border-radius:7px;margin:0 5px 5px 0}
  .tg-chip .ti-x{font-size:13px;cursor:pointer;opacity:.6}.tg-chip .ti-x:hover{opacity:1}
  .t-red{background:#FCE9EC;color:#B11226}.t-blue{background:#E6F0FE;color:#1D4ED8}.t-teal{background:#DBF5EE;color:#0B7A6F}
  .t-amber{background:#FEF3C7;color:#92580B}.t-purple{background:#EEEDFE;color:#4A3FB0}.t-green{background:#DCFCE7;color:#15803D}
  .t-gray{background:#EEF1F6;color:#5B6577}.t-navy{background:#E2E8F2;color:#1B3357}
  table{width:100%;border-collapse:collapse;font-size:13px}
  th{text-align:left;color:var(--muted);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.4px;padding:9px 11px;border-bottom:1px solid var(--line);white-space:nowrap}
  td{padding:10px 11px;border-bottom:1px solid var(--line);vertical-align:middle}
  tr:last-child td{border-bottom:none}
  tbody tr.clk{cursor:pointer}tbody tr.clk:hover{background:var(--bg)}
  .num{font-variant-numeric:tabular-nums}
  .filterbar{display:flex;gap:8px;margin-bottom:13px;flex-wrap:wrap;align-items:center}
  .fbtn{border:1px solid var(--line2);background:#fff;border-radius:999px;padding:6px 12px;font-size:12px;cursor:pointer;color:var(--muted)}
  .fbtn.on{background:var(--navy);color:#fff;border-color:var(--navy)}
  select.sel{border:1px solid var(--line2);border-radius:8px;padding:7px 10px;font-size:12.5px;background:#fff;color:var(--ink);cursor:pointer}
  .metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:16px}
  .metric{background:#fff;border:1px solid var(--line);border-radius:13px;padding:14px}
  .metric .l{font-size:11.5px;color:var(--muted)}.metric .v{font-size:23px;font-weight:700;color:var(--navy);margin-top:3px}.metric .t{font-size:11px;color:var(--teal);font-weight:600;margin-top:2px}
  .split{display:grid;grid-template-columns:330px 1fr;gap:16px}.split.split-r{grid-template-columns:minmax(0,1fr) 330px}
  .calllist{display:flex;flex-direction:column;gap:8px;max-height:78vh;overflow:auto}
  .callrow{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 12px;cursor:pointer;display:flex;gap:10px;align-items:center}
  .callrow:hover{border-color:var(--line2)}.callrow.sel{border-color:var(--blue);box-shadow:0 0 0 2px rgba(37,99,235,.12)}
  .callrow .nm{font-weight:600;font-size:13px}.callrow .meta{font-size:11px;color:var(--muted)}
  .dt-sec{border-top:1px solid var(--line);padding-top:13px;margin-top:14px}
  .dt-sec .h{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--faint);font-weight:600;margin-bottom:9px;display:flex;align-items:center;gap:6px}
  .attr-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px}
  .attr-grid .k{color:var(--muted);font-size:12px}.attr-grid .v{font-size:12.5px;font-weight:500;text-align:right}
  .attr-row{display:flex;justify-content:space-between;gap:10px}
  .bub{font-size:12.5px;padding:7px 11px;border-radius:11px;margin-bottom:7px;max-width:92%;line-height:1.45}
  .bub.caller{background:var(--bg)}.bub.ai{background:var(--infobg);color:var(--infofg);margin-left:auto}
  mark{background:#FEF3C7;color:#92580B;border-radius:3px;padding:0 2px;font-weight:600}
  .ck{display:flex;align-items:center;gap:8px;font-size:12.5px;margin-bottom:6px}.ck i{color:var(--teal);font-size:17px}
  .score{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;width:54px;height:54px;border-radius:12px;flex-shrink:0}
  .score .n{font-size:19px;font-weight:700;line-height:1}.score .x{font-size:9px;text-transform:uppercase;letter-spacing:.5px}
  .sc-hi{background:var(--okbg);color:var(--okfg)}.sc-md{background:var(--warnbg);color:var(--warnfg)}.sc-lo{background:#EEF1F6;color:#5B6577}.sc-spam{background:var(--dngbg);color:var(--dngfg)}
  .tl{position:relative;padding-left:22px}
  .tl::before{content:"";position:absolute;left:7px;top:4px;bottom:4px;width:2px;background:var(--line2)}
  .tl-item{position:relative;padding-bottom:13px}.tl-item:last-child{padding-bottom:0}
  .tl-item .dotc{position:absolute;left:-22px;top:1px;width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid var(--line2);display:flex;align-items:center;justify-content:center;font-size:9px;color:var(--muted)}
  .tl-item.first .dotc{border-color:var(--blue);color:var(--blue)}.tl-item.last .dotc{border-color:var(--teal);background:var(--teal);color:#fff}
  .tl-item .ch{font-weight:600;font-size:12.5px}.tl-item .dd{font-size:11.5px;color:var(--muted)}
  .funnel{display:flex;flex-direction:column;gap:9px}
  .fn-row{display:flex;align-items:center;gap:12px}
  .fn-bar{height:30px;background:var(--blue);border-radius:7px;display:flex;align-items:center;padding:0 11px;color:#fff;font-weight:600;font-size:12.5px;min-width:60px}
  .fn-row .l{width:130px;font-size:12.5px;color:var(--muted);flex-shrink:0}.fn-row .pc{font-size:11.5px;color:var(--faint);margin-left:8px}
  .srow{margin-bottom:12px}.srow .top{display:flex;justify-content:space-between;font-size:13px;margin-bottom:5px}
  .bar-track{height:8px;background:var(--ice);border-radius:6px;overflow:hidden}.bar-fill{height:100%;background:var(--blue);border-radius:6px}
  .kwbar .bar-fill{background:var(--teal)}
  .senti{display:flex;height:14px;border-radius:7px;overflow:hidden;margin:8px 0}.senti span{display:block}
  .board{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
  .col-h{font-weight:600;font-size:13px;margin-bottom:10px;display:flex;align-items:center;gap:8px}
  .job{background:#fff;border:1px solid var(--line);border-left:3px solid var(--blue);border-radius:0 10px 10px 0;padding:10px 12px;margin-bottom:10px}
  .job.ai{border-left-color:var(--teal)}.job.open{border-left-color:var(--line2);text-align:center;color:var(--muted)}
  .job .t{font-weight:600;font-size:12.5px}.job .d{font-size:12px;color:var(--muted)}
  .tg{width:38px;height:22px;border-radius:999px;background:var(--teal);position:relative;display:inline-block;cursor:pointer;flex-shrink:0}
  .tg::after{content:"";position:absolute;width:16px;height:16px;border-radius:50%;background:#fff;top:3px;right:3px}
  .tg.off{background:var(--line2)}.tg.off::after{right:auto;left:3px}
  .cfg-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-top:1px solid var(--line);gap:14px}.cfg-row:first-child{border-top:none}
  .cfg-row .lbl{font-weight:600;font-size:13px}.cfg-row .ds{font-size:12px;color:var(--muted);margin-top:2px}
  .two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.three{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}
  .kv{display:flex;justify-content:space-between;font-size:13px;padding:7px 0;border-top:1px solid var(--line)}.kv .k{color:var(--muted)}
  .codeblk{background:var(--navy);color:#CADCFC;border-radius:10px;padding:13px 15px;font-family:ui-monospace,Menlo,monospace;font-size:12px;line-height:1.7;white-space:pre-wrap}.codeblk .hl{color:#5EEAD4}
  .overlay{position:fixed;inset:0;background:rgba(11,31,58,.4);opacity:0;pointer-events:none;transition:.18s;z-index:40}.overlay.open{opacity:1;pointer-events:auto}
  .drawer{position:fixed;top:0;right:0;height:100vh;width:480px;max-width:92vw;background:#fff;z-index:41;transform:translateX(100%);transition:.22s;overflow:auto;box-shadow:-8px 0 30px rgba(11,31,58,.12)}.drawer.open{transform:translateX(0)}
  .drawer .dh{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff}.drawer .db{padding:16px 18px}
  .x-btn{width:32px;height:32px;border-radius:8px;border:none;background:var(--bg);cursor:pointer;font-size:18px;color:var(--muted)}
  .src-ico{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}
  .ch-mini{width:26px;height:26px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}
  @media(max-width:1024px){.split,.split.split-r{grid-template-columns:minmax(0,1fr)}.metrics{grid-template-columns:repeat(2,1fr)}.board,.two,.three{grid-template-columns:1fr}}

  /* ================= v4 additions ================= */
  :root{--violet:#7E22CE;--violetbg:#F3E8FF}
  button{font-family:inherit}
  .t-violet{background:#F3E8FF;color:#7E22CE}.t-orange{background:#FFEDD5;color:#C2410C}
  .chip-violet{background:#F3E8FF;color:#7E22CE}
  .brand .ver{font-size:9.5px;background:rgba(94,234,212,.16);color:#5EEAD4;border-radius:5px;padding:1px 6px;margin-left:6px;font-weight:700;letter-spacing:.5px;vertical-align:2px}
  .nav-item .badge.new{background:var(--teal);font-size:9px;letter-spacing:.5px;text-transform:uppercase;padding:2px 6px}
  .role-sel{margin-top:6px;width:100%;background:var(--navy2);color:#CADCFC;border:1px solid var(--navy3);border-radius:8px;padding:5px 7px;font-size:11.5px;cursor:pointer}
  .side-foot{align-items:flex-start}
  .search{cursor:pointer;text-align:left;font-size:13px}
  .search{min-width:0}
  .search .ph{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #view-invoices td:first-child{white-space:nowrap}
  kbd{font-family:inherit;font-size:11px;background:#fff;border:1px solid var(--line2);border-radius:5px;padding:1px 6px;color:var(--muted)}
  .btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--line2)}
  .btn.ghost:hover{background:var(--bg)}
  .btn.danger{background:#fff;color:var(--dngfg);border:1px solid #F3C4CC}
  .btn.danger:hover{background:var(--dngbg)}
  .btn.done-btn,.fbtn.done-btn{background:var(--teal)!important;color:#fff!important;border-color:var(--teal)!important}
  .btn:disabled{cursor:default}
  .sm{font-size:12px!important;padding:6px 11px!important}

  /* command palette */
  .pal-ov{position:fixed;inset:0;background:rgba(11,31,58,.45);z-index:60;display:none;align-items:flex-start;justify-content:center;padding-top:10vh}
  .pal-ov.open{display:flex}
  .pal{width:620px;max-width:94vw;background:#fff;border-radius:14px;box-shadow:0 20px 60px rgba(11,31,58,.3);overflow:hidden}
  .pal-in{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line)}
  .pal-in input{flex:1;border:none;outline:none;font-size:15px;color:var(--ink);background:none;font-family:inherit}
  .pal-res{max-height:56vh;overflow:auto;padding:6px}
  .pal-grp{font-size:10.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--faint);font-weight:600;padding:8px 10px 4px}
  .pal-it{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:9px;cursor:pointer;font-size:13px}
  .pal-it.on,.pal-it:hover{background:var(--infobg)}
  .pal-it .sub{font-size:11.5px;color:var(--muted);margin-left:auto;white-space:nowrap}
  .pal-foot{display:flex;gap:14px;padding:8px 14px;border-top:1px solid var(--line);font-size:11px;color:var(--muted);flex-wrap:wrap}

  /* notifications + toasts */
  .tb-icon{position:relative}
  .bell-badge{position:absolute;top:3px;right:2px;min-width:16px;height:16px;border-radius:999px;background:var(--red);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 4px}
  .np{position:absolute;top:54px;right:58px;width:370px;max-width:92vw;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 16px 40px rgba(11,31,58,.16);z-index:30;display:none;overflow:hidden}
  .np.open{display:block}
  .np-h{display:flex;justify-content:space-between;align-items:center;padding:11px 14px;border-bottom:1px solid var(--line);font-weight:600}
  .np-list{max-height:390px;overflow:auto}
  .np-it{display:flex;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line);font-size:12.5px;line-height:1.45}
  .np-it:last-child{border-bottom:none}
  .np-it .tm{font-size:11px;color:var(--faint);margin-top:2px}
  .np-it.new{background:#F5F9FF}
  .toasts{position:fixed;right:18px;bottom:18px;z-index:70;display:flex;flex-direction:column;gap:8px;max-width:92vw}
  .toast{display:flex;align-items:center;gap:10px;background:var(--navy);color:#fff;border-radius:11px;padding:10px 14px;font-size:13px;box-shadow:0 10px 30px rgba(11,31,58,.25);animation:tin .25s ease-out;max-width:420px}
  .toast i{color:#5EEAD4;font-size:18px;flex-shrink:0}
  @keyframes tin{from{transform:translateY(10px);opacity:0}to{transform:none;opacity:1}}

  /* AI morning brief */
  .brief{background:linear-gradient(135deg,#0B1F3A,#13294B 58%,#0E3D38);color:#fff;border-radius:16px;padding:16px;margin-bottom:16px}
  .brief-h{display:flex;gap:12px;align-items:flex-start;margin-bottom:12px;flex-wrap:wrap}
  .brief-ico{width:38px;height:38px;border-radius:10px;background:rgba(94,234,212,.16);color:#5EEAD4;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
  .brief-t{font-weight:600;font-size:16px}.brief-s{color:#AFC4E6;font-size:12.5px;margin-top:2px}
  .brief .chip{background:rgba(255,255,255,.1);color:#CADCFC}
  .brief-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
  .brief-item{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:12px;display:flex;flex-direction:column}
  .bi-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
  .bi-ico{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:16px}
  .bi-tag{font-size:10.5px;text-transform:uppercase;letter-spacing:.6px;color:#7F9AC4;font-weight:600}
  .bi-t{font-weight:600;font-size:13.5px}.bi-d{color:#AFC4E6;font-size:12px;margin-top:3px;flex:1}
  .bi-btn{margin-top:10px;align-self:flex-start;background:#5EEAD4;color:#0B1F3A;border:none;border-radius:8px;padding:6px 10px;font-size:12px;font-weight:700;cursor:pointer}
  .bi-btn:hover{background:#99F6E4}

  /* live call assist */
  .assist{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:12px}
  .as-col{background:#fff;border:1px solid var(--line);border-radius:14px;display:flex;flex-direction:column;min-height:290px}
  .as-h{display:flex;align-items:center;gap:7px;padding:11px 13px;border-bottom:1px solid var(--line);font-weight:600;font-size:12.5px}
  .as-h i{font-size:16px;color:var(--blue)}
  .as-body{padding:11px 13px;overflow:auto;max-height:310px;flex:1}
  .live-dot{width:8px;height:8px;border-radius:50%;background:var(--red);margin-left:auto;animation:pulse 1.4s infinite}
  .wh{border-radius:10px;padding:8px 10px;margin-bottom:8px;font-size:12.5px;display:flex;gap:8px;animation:tin .3s ease-out;line-height:1.45}
  .wh i{font-size:16px;flex-shrink:0;margin-top:1px}
  .wh-alert{background:var(--dngbg);color:var(--dngfg)}.wh-info{background:var(--infobg);color:var(--infofg)}.wh-diag{background:#F3E8FF;color:#7E22CE}.wh-price{background:var(--okbg);color:var(--okfg)}.wh-slot{background:#DBF5EE;color:#0B7A6F}.wh-upsell{background:var(--warnbg);color:var(--warnfg)}
  .ff{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px dashed var(--line);font-size:12.5px}
  .ff .k{color:var(--muted)}.ff .v{font-weight:600;text-align:right}.ff .v.empty{color:var(--faint);font-weight:400}
  .ff.fresh .v{animation:fl 1.2s ease-out}
  @keyframes fl{from{background:#FEF3C7}to{background:transparent}}
  .bub.rep{background:#EEEDFE;color:#4A3FB0;margin-left:auto}
  .typing{display:inline-flex;gap:3px;padding:8px 11px;background:var(--bg);border-radius:11px}
  .typing span{width:6px;height:6px;border-radius:50%;background:var(--faint);animation:blink 1s infinite}
  .typing span:nth-child(2){animation-delay:.15s}.typing span:nth-child(3){animation-delay:.3s}
  @keyframes blink{0%,100%{opacity:.25}50%{opacity:1}}

  /* jobs / dispatch */
  .board{grid-template-columns:repeat(4,1fr)}
  .job.hot{border-left-color:var(--red)}.job.done{opacity:.68}
  .map-wrap{background:#EEF3F9}
  .map-wrap svg{width:100%;aspect-ratio:3/1;height:auto;display:block;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
  .mdot{width:8px;height:8px;border-radius:50%;display:inline-block}
  .cost-bar{display:flex;height:16px;border-radius:8px;overflow:hidden;margin:12px 0 10px}
  .cost-bar span{display:block;height:100%}
  .legend{display:flex;gap:12px;flex-wrap:wrap;font-size:11.5px;color:var(--muted)}
  .legend span{display:inline-flex;align-items:center;gap:5px}
  .legend i.sw{width:10px;height:10px;border-radius:3px;display:inline-block}
  .why-row{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-top:1px solid var(--line);font-size:12.5px}
  .why-row:first-of-type{border-top:none}

  /* forecast chart */
  .fc-chart{display:flex;height:250px;padding-top:4px}
  .fc-col{flex:1;display:flex;flex-direction:column;align-items:center;min-width:0}
  .fc-w{font-size:16px;color:var(--muted)}.fc-t{font-size:10px;color:var(--muted);margin:2px 0 4px;white-space:nowrap}
  .fc-barwrap{position:relative;flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center}
  .fc-bar{width:62%;border-radius:6px 6px 0 0;background:var(--blue);display:flex;align-items:flex-start;justify-content:center;color:#fff;font-size:11px;font-weight:700;padding-top:3px;position:relative;z-index:1}
  .fc-bar.warm{background:#F59E0B}.fc-bar.hot{background:var(--red)}
  .fc-cap{position:absolute;left:0;right:0;border-top:2px dashed #94A3B8;z-index:2}
  .fc-cap span{position:absolute;right:2px;top:-19px;font-size:10.5px;color:var(--muted);background:#fff;padding:0 4px;white-space:nowrap}
  .fc-day{font-size:10.5px;color:var(--muted);margin-top:5px;white-space:nowrap}
  .fc-day.wk{font-weight:600;color:var(--ink)}

  /* action rows */
  .act-row{display:flex;gap:12px;align-items:center;padding:11px 0;border-top:1px solid var(--line)}
  .act-row:first-of-type{border-top:none}
  .act-row .t{font-weight:600;font-size:13px}.act-row .d{font-size:12px;color:var(--muted);margin-top:1px}

  /* AI workforce */
  .agents{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}
  .agent{background:#fff;border:1px solid var(--line);border-radius:14px;padding:13px;display:flex;flex-direction:column;gap:9px;transition:opacity .2s}
  .agent .ah{display:flex;align-items:center;gap:9px}
  .agent .an{font-weight:600;font-size:13.5px}.agent .ar{font-size:11.5px;color:var(--muted)}
  .agent .kp{display:flex;gap:8px}.agent .kp>div{flex:1;background:var(--bg);border-radius:8px;padding:6px 9px}
  .agent .kp .v{font-weight:700;font-size:14.5px;color:var(--navy)}.agent .kp .l{font-size:10.5px;color:var(--muted)}
  .agent .gr{font-size:11.5px;color:var(--muted);border-top:1px dashed var(--line);padding-top:8px;line-height:1.45}
  .agent.paused{opacity:.5}
  .seg{display:flex;background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:2px}
  .seg button{flex:1;border:none;background:none;font-size:11.5px;font-weight:600;color:var(--muted);padding:5px 4px;border-radius:7px;cursor:pointer}
  .seg button.on{background:#fff;color:var(--navy);box-shadow:0 1px 3px rgba(11,31,58,.14)}

  /* approvals */
  .appr{background:#fff;border:1px solid var(--line);border-radius:14px;padding:15px;margin-bottom:12px;display:grid;grid-template-columns:1fr 260px;gap:16px}
  .appr .why{font-size:12.5px;color:var(--ink);background:var(--bg);border-radius:9px;padding:9px 11px;margin-top:9px;line-height:1.5}
  .appr .side{display:flex;flex-direction:column;gap:9px;border-left:1px solid var(--line);padding-left:16px}
  .appr.closed{opacity:.72}
  .conf{height:6px;background:var(--ice);border-radius:4px;overflow:hidden;margin-top:4px}.conf>div{height:100%;background:var(--teal)}
  .draft{font-size:12.5px;border-left:3px solid #C4B5FD;padding:6px 10px;margin-top:9px;color:#4C1D95;background:#FAF5FF;border-radius:0 8px 8px 0}

  /* scenario planner */
  .sc-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
  .lever{margin-bottom:15px;display:block}
  .lever .top{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px}
  .lever .top b{color:var(--navy)}
  .lever input[type=range]{width:100%;accent-color:var(--blue)}
  .sc-out .row{display:flex;justify-content:space-between;align-items:baseline;padding:9px 0;border-bottom:1px solid var(--line);gap:10px}
  .sc-out .row .k{color:var(--muted);font-size:12.5px}.sc-out .row .v{font-size:19px;font-weight:700;color:var(--navy);text-align:right}
  .delta{font-size:11.5px;font-weight:600;margin-left:6px}
  .up{color:var(--okfg)}.down{color:var(--dngfg)}.flat{color:var(--faint)}
  .insight{background:var(--infobg);color:var(--infofg);border-radius:10px;padding:10px 12px;font-size:12.5px;margin-top:12px;line-height:1.5}

  /* AI search */
  .rk{display:inline-block;min-width:44px;text-align:center;font-size:11.5px;font-weight:700;border-radius:6px;padding:2px 6px}
  .rk-top{background:var(--okbg);color:var(--okfg)}.rk-mid{background:#DBF5EE;color:#0B7A6F}.rk-cite{background:var(--infobg);color:var(--infofg)}.rk-no{background:#F1F4F8;color:var(--faint)}

  /* phones & AI cards */
  .phone{width:320px;max-width:100%;border:1px solid var(--line2);border-radius:26px;padding:14px;background:#fff}
  .ph-top{text-align:center;font-size:11px;color:var(--muted);margin-bottom:8px}
  .scan{background:linear-gradient(135deg,#1C3A63,#0B1F3A);border-radius:12px;height:96px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;color:#5EEAD4;font-size:12px;gap:6px}
  .scan::after{content:"";position:absolute;left:8%;right:8%;height:2px;background:#5EEAD4;box-shadow:0 0 12px #5EEAD4;animation:scan 2.4s ease-in-out infinite}
  @keyframes scan{0%{top:14%}50%{top:84%}100%{top:14%}}
  .photo-ph{width:58px;height:44px;border-radius:7px;background:linear-gradient(135deg,#94A3B8,#64748B);display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;flex-shrink:0}
  .ai-card{background:#F3E8FF;border-radius:10px;padding:10px 12px;margin-top:8px}
  .ai-card .h2{font-weight:600;font-size:12.5px;color:#7E22CE;display:flex;align-items:center;gap:6px;margin-bottom:6px}
  .ai-card .attr-row{padding:2px 0}.ai-card .k{color:#6B21A8;font-size:12px}.ai-card .v{font-size:12.5px;font-weight:600;text-align:right}
  .coach{background:var(--warnbg);color:var(--warnfg);border-radius:10px;padding:9px 11px;font-size:12px;margin-top:10px;line-height:1.5}
  .nba{display:flex;gap:9px;align-items:flex-start;background:#F3E8FF;color:#5B21B6;border-radius:10px;padding:10px 12px;font-size:12.5px;margin:10px 0;line-height:1.45}
  .nba i{font-size:17px;color:#7E22CE;flex-shrink:0}
  .mini3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0}
  .mini3>div{background:var(--bg);border-radius:9px;padding:8px 10px}
  .mini3 .l{font-size:10.5px;color:var(--muted)}.mini3 .v{font-weight:700;color:var(--navy);font-size:14px}
  .idchip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;background:#fff;border:1px solid var(--line2);border-radius:7px;padding:3px 8px;margin:0 5px 5px 0}

  /* risk + misc */
  .risk{display:flex;align-items:center;gap:8px}
  .risk .bar-track{width:70px;height:6px}
  .alert-row{display:flex;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
  .alert-row:first-of-type{border-top:none}
  .cp-in{margin-top:16px;display:flex;gap:8px;align-items:center;border:1px solid var(--line2);border-radius:10px;padding:6px 6px 6px 12px;color:var(--muted)}
  .cp-in input{flex:1;border:none;outline:none;font-size:13.5px;color:var(--ink);background:none;font-family:inherit}
  .cp-q{align-self:flex-end;max-width:74%;background:var(--infobg);color:var(--infofg);padding:9px 13px;border-radius:13px;font-size:13px}
  .cp-a{max-width:88%;background:var(--bg);padding:11px 14px;border-radius:13px;font-size:13px;line-height:1.55}
  .cp-src{margin-top:8px;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
  .cp-src span{font-size:11px;background:#fff;border:1px solid var(--line);border-radius:6px;padding:2px 7px;color:var(--muted)}
  .chip.clk{cursor:pointer}.chip.clk:hover{background:var(--infobg);color:var(--infofg)}
  .side-scrim{display:none}
  .menu-btn{display:none;border:none;background:none}

  @media(max-width:1180px){.agents{grid-template-columns:repeat(2,1fr)}.brief-grid{grid-template-columns:repeat(2,1fr)}.assist{grid-template-columns:1fr}.board{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:1024px){.metrics{grid-template-columns:repeat(2,1fr)!important}.sc-grid{grid-template-columns:1fr}.appr{grid-template-columns:1fr}.appr .side{border-left:none;padding-left:0;border-top:1px solid var(--line);padding-top:10px}}
  @media(max-width:860px){
    .sidebar{position:fixed;left:0;top:0;z-index:55;transform:translateX(-100%);transition:transform .2s}
    .sidebar.open{transform:none}
    .side-scrim.open{display:block;position:fixed;inset:0;background:rgba(11,31,58,.4);z-index:54}
    .menu-btn{display:flex}
    .hide-sm{display:none!important}
    main{padding:16px}
    .topbar{padding:0 12px;gap:8px}
    .search kbd{display:none}
    .board,.brief-grid,.agents,.mini3{grid-template-columns:1fr!important}
    .card{overflow-x:auto!important}
    .np{right:8px}
    .vh h1{font-size:19px}
    .fc-t{display:none}
    .map-wrap svg{aspect-ratio:auto;height:230px}
    .fc-chart{min-width:620px}
    .search .ph{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .brief-h .chip{display:none}
  }

  /* ================= v5 additions ================= */
  .fa-grid{display:grid;grid-template-columns:290px minmax(0,1fr) 320px;gap:14px;margin-bottom:16px;align-items:stretch}
  .fa-device{background:linear-gradient(165deg,#0B1F3A,#13294B 55%,#0E3D38);color:#fff;border-radius:18px;padding:16px;display:flex;flex-direction:column;align-items:center;gap:10px;min-height:470px}
  .fa-top{width:100%;display:flex;justify-content:space-between;font-size:11.5px;color:#AFC4E6}
  .fa-orb{width:128px;height:128px;border-radius:50%;background:radial-gradient(circle at 50% 45%,rgba(94,234,212,.32),rgba(94,234,212,.04) 70%);display:flex;align-items:center;justify-content:center;margin-top:8px}
  .fa-orb .in{width:78px;height:78px;border-radius:50%;background:#5EEAD4;color:#0B1F3A;display:flex;align-items:center;justify-content:center;font-size:32px;transition:background .2s}
  .fa-orb.talk-ai .in{animation:orb 1s ease-in-out infinite}
  .fa-orb.talk-tech .in{background:#93C5FD}.fa-orb.talk-cust .in{background:#FCD34D}.fa-orb.talk-ext .in{background:#D8B4FE}
  .fa-orb.talk-tech,.fa-orb.talk-cust,.fa-orb.talk-ext{animation:orbring 1.4s ease-out infinite}
  @keyframes orb{50%{transform:scale(1.09)}}
  @keyframes orbring{0%{box-shadow:0 0 0 0 rgba(255,255,255,.18)}100%{box-shadow:0 0 0 22px rgba(255,255,255,0)}}
  .fa-name{font-weight:700;font-size:17px;letter-spacing:.3px}
  .fa-state{font-size:12.5px;color:#AFC4E6;text-align:center;min-height:34px}
  .fa-wave{display:flex;gap:3px;align-items:center;height:36px}
  .fa-wave span{width:4px;border-radius:2px;background:rgba(255,255,255,.22);height:5px}
  .fa-wave.on span{background:var(--wc);animation:wv .8s ease-in-out infinite}
  @keyframes wv{0%,100%{height:5px}50%{height:30px}}
  .fa-ctrls{display:flex;gap:6px;width:100%}
  .fa-ctrls button{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:5px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:#fff;border-radius:9px;padding:9px 8px;font-size:12.5px;font-weight:600;cursor:pointer}
  .fa-ctrls button:hover{background:rgba(255,255,255,.16)}
  .fa-ctrls .fa-play{background:#5EEAD4;color:#0B1F3A;border-color:#5EEAD4;flex:1.4}
  .fa-ctrls button:last-child{flex:0 0 40px}
  .fa-voice{font-size:12px;color:#CADCFC;display:flex;align-items:center;gap:7px;cursor:pointer;margin-top:2px}
  .fa-step{font-size:11px;color:#7F9AC4;margin-top:auto}
  .fa-hints{width:100%;margin-top:4px}
  .fa-hints .h{font-size:10px;letter-spacing:.6px;text-transform:uppercase;color:#7F9AC4;margin-bottom:6px}
  .fa-hints span{display:inline-block;font-size:11.5px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);border-radius:8px;padding:4px 8px;margin:0 5px 5px 0;color:#CADCFC;cursor:pointer}
  .fa-hints span:hover{background:rgba(94,234,212,.16);border-color:#5EEAD4}
  .fa-conv{padding:0;display:flex;flex-direction:column;min-height:470px}
  .fa-conv-h{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;padding:13px 16px;border-bottom:1px solid var(--line)}
  .fa-conv-b{padding:14px 16px;overflow:auto;max-height:520px;flex:1}
  .fa-turn{display:flex;gap:10px;margin-bottom:12px;animation:tin .3s ease-out}
  .fa-av{width:30px;height:30px;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0}
  .fa-turn .who{font-size:11.5px;font-weight:600;color:var(--muted);margin-bottom:3px}
  .fa-turn .txt{background:var(--bg);border-radius:4px 12px 12px 12px;padding:9px 12px;font-size:13px;line-height:1.5;display:inline-block;max-width:100%}
  .fa-turn.ai .txt{background:#E6F7F4;color:#0B4F47}
  .fa-turn.cust .txt{background:#FEF3C7;color:#78350F}
  .fa-turn.ext .txt{background:#F3E8FF;color:#4C1D95;border:1px dashed #C4B5FD}
  .fa-turn.now .txt{box-shadow:0 0 0 2px rgba(13,148,136,.25)}
  .fa-turn .tr{font-size:11.5px;color:var(--muted);margin-top:4px;font-style:italic}
  .a2a-badge{font-size:9.5px;background:#7E22CE;color:#fff;border-radius:5px;padding:1px 5px;margin-left:6px;letter-spacing:.4px;vertical-align:1px}
  .lang-badge{font-size:10px;background:#FEF3C7;color:#92580B;border-radius:5px;padding:1px 5px;margin-left:6px}
  .fa-empty{text-align:center;color:var(--muted);padding:60px 10px}
  .fa-empty i{font-size:34px;color:var(--teal)}
  .fa-side{display:flex;flex-direction:column;gap:12px;min-width:0}
  .fa-side-h{display:flex;align-items:center;gap:7px;font-weight:600;font-size:12.5px;margin-bottom:6px}
  .fa-side-h i{color:var(--teal);font-size:16px}
  .fa-act{display:flex;gap:8px;align-items:flex-start;padding:6px 0;border-bottom:1px dashed var(--line);font-size:12.5px;animation:tin .3s ease-out}
  .fa-act:last-child{border-bottom:none}
  .fa-act i{color:var(--teal);font-size:16px;flex-shrink:0;margin-top:1px}
  #fa-acts{max-height:230px;overflow:auto}
  .fq-thread{max-height:240px;overflow:auto;margin-bottom:4px}
  .mic-btn.rec{background:var(--red)!important;color:#fff!important;border-color:var(--red)!important;animation:pulse 1.2s infinite}
  .cp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
  .cp-card{border:1px solid var(--line);border-radius:12px;padding:12px}
  .an-two{display:grid;grid-template-columns:1.35fr 1fr;gap:16px}
  .ax-row{display:grid;grid-template-columns:62px minmax(0,1fr);gap:10px;padding:11px 16px;border-top:1px solid var(--line)}
  .ax-row:first-child{border-top:none}
  .ax-row:hover{background:var(--bg)}
  .ax-reply{display:inline-flex;gap:6px;align-items:flex-start;font-size:12px;margin-top:5px;border-radius:8px;padding:4px 8px}
  .ax-ok{background:var(--okbg);color:var(--okfg)}.ax-warn{background:var(--warnbg);color:var(--warnfg)}.ax-dng{background:var(--dngbg);color:var(--dngfg)}
  .roadmap{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
  .rm-h{margin-bottom:8px}
  .cos{background:linear-gradient(135deg,#0B1F3A,#1C3A63);color:#fff;border-radius:16px;padding:16px;margin-bottom:16px}
  .cos .chip{background:rgba(255,255,255,.1);color:#CADCFC}
  .flow{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
  .fl-step{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:7px 10px}
  .fl-step i{font-size:17px;color:#5EEAD4}
  .fl-step b{display:block;font-size:12px}.fl-step span{display:block;font-size:11px;color:#AFC4E6}
  .fl-step.you{background:#5EEAD4;border-color:#5EEAD4}.fl-step.you i,.fl-step.you b,.fl-step.you span{color:#0B1F3A}
  .fl-arr{color:#5C77A3;font-size:15px}
  @media(max-width:1280px){.fa-grid{grid-template-columns:270px minmax(0,1fr)}.fa-side{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr)}}
  @media(max-width:1180px){.cp-grid{grid-template-columns:repeat(2,1fr)}.an-two{grid-template-columns:1fr}}
  @media(max-width:860px){.fa-grid,.fa-side{grid-template-columns:1fr!important}.fa-device,.fa-conv{min-height:0}.roadmap{grid-template-columns:1fr}.cp-grid{grid-template-columns:1fr}.fl-arr{display:none}}

/* ================= production app additions ================= */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0B1F3A,#13294B 58%,#0E3D38);padding:20px}
.auth-card{background:#fff;border-radius:18px;padding:28px;width:420px;max-width:100%;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.auth-card h1{font-size:22px;color:var(--navy);margin:14px 0 4px}
.fld{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
.fld label{font-size:12px;font-weight:600;color:var(--muted)}
.fld input,.fld select,.fld textarea{border:1px solid var(--line2);border-radius:9px;padding:9px 11px;font-size:13.5px;font-family:inherit;color:var(--ink);background:#fff;outline:none}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(37,99,235,.12)}
.fld textarea{min-height:80px;resize:vertical}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.err{background:var(--dngbg);color:var(--dngfg);border-radius:9px;padding:9px 11px;font-size:12.5px;margin-bottom:12px}
.ok-box{background:var(--okbg);color:var(--okfg);border-radius:9px;padding:9px 11px;font-size:12.5px;margin-bottom:12px}
.link{color:var(--blue);cursor:pointer;text-decoration:none;font-weight:600}
.empty{text-align:center;color:var(--muted);padding:34px 10px}
.empty i{font-size:30px;color:var(--teal);display:block;margin-bottom:6px}
.modal-ov{position:fixed;inset:0;background:rgba(11,31,58,.45);z-index:80;display:flex;align-items:flex-start;justify-content:center;padding:8vh 14px;overflow:auto}
.modal{background:#fff;border-radius:16px;width:560px;max-width:100%;box-shadow:0 20px 60px rgba(11,31,58,.3)}
.modal .mh{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line);font-weight:600}
.modal .mb{padding:16px 18px}
.modal .mf{display:flex;justify-content:flex-end;gap:8px;padding:12px 18px;border-top:1px solid var(--line)}
.thread{display:flex;flex-direction:column;gap:2px;max-height:56vh;overflow:auto;padding:4px}
.bub.user{background:#EEEDFE;color:#4A3FB0;margin-left:auto}
.bub.out-ai{background:var(--infobg);color:var(--infofg);margin-left:auto}
.bub .meta{display:block;font-size:10.5px;opacity:.7;margin-top:3px}
.loading{padding:40px;text-align:center;color:var(--muted)}
.banner{display:flex;gap:10px;align-items:center;border-radius:12px;padding:11px 14px;margin-bottom:14px;font-size:13px}
.banner.warn{background:var(--warnbg);color:var(--warnfg)}.banner.info{background:var(--infobg);color:var(--infofg)}
.item-row{display:grid;grid-template-columns:1fr 70px 100px 30px;gap:6px;margin-bottom:6px}
.item-row input{border:1px solid var(--line2);border-radius:8px;padding:7px 9px;font-size:13px;font-family:inherit}
.pill-btn{border:none;background:none;cursor:pointer;color:var(--muted);font-size:17px}
.code{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-family:ui-monospace,Menlo,monospace;font-size:11.5px;word-break:break-all}
.pubwrap{max-width:720px;margin:0 auto;padding:24px 16px}
a.nav-item,a.chip,a.fbtn,a.btn,a.bi-btn{text-decoration:none}
