/* =========================================================
   KUANTUM – shared design system
   Dark, red-accent brand from the approved mockups.
   ========================================================= */
@font-face{font-family:'Outfit';font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/outfit.woff2) format('woff2')}
:root{
  --bg:#07080c;--bg-2:#0a0b10;--panel:#0e1016;--card:#10121a;--card-2:#141620;
  --line:rgba(255,255,255,.1);--line-2:rgba(255,255,255,.16);--line-3:rgba(255,255,255,.24);
  --red:#e42a1f;--red-2:#ff3b2f;--red-soft:rgba(228,42,31,.12);
  --violet:#5a45e4;--violet-2:#6d5af0;--violet-soft:#9d8cff;
  --gold:#e8b64c;--gold-2:#f7d88a;
  --green:#2fd96b;--amber:#fab219;--orange:#ec835a;--crit:#d03b3b;
  --text:#fff;--text-2:#d6d9df;--muted:#a9adb7;--faint:#7c808b;
  /* chart categorical slots (dark, validated reference palette) */
  --s1:#3987e5;--s2:#d95926;--s3:#199e70;--s4:#c98500;--s5:#d55181;--s6:#008300;--s7:#9085e9;--s8:#e66767;
  --radius:10px;--shadow:0 20px 50px rgba(0,0,0,.5);
  color-scheme:dark;
}
*{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:clip}
html,body{background:var(--bg);color:var(--text);font-family:'Outfit',system-ui,-apple-system,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased}
body{min-height:100vh;overflow-x:clip;background:radial-gradient(1000px 520px at 62% 18%,rgba(40,50,110,.14),transparent 70%),var(--bg)}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
button{cursor:pointer}
svg{display:block}
img{max-width:100%}
::selection{background:rgba(228,42,31,.45)}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#23252f;border-radius:10px;border:2px solid var(--bg)}::-webkit-scrollbar-track{background:transparent}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.hidden{display:none!important}
.muted{color:var(--muted)}.faint{color:var(--faint)}.red{color:var(--red-2)}.gold{color:var(--gold-2)}.green{color:var(--green)}
.nowrap{white-space:nowrap}
.row{display:flex;align-items:center;gap:10px}.row.wrap{flex-wrap:wrap}.grow{flex:1}.ml-auto{margin-left:auto}
.mt8{margin-top:8px}.mt12{margin-top:12px}.mt16{margin-top:16px}.mt20{margin-top:20px}.mt24{margin-top:24px}.mb16{margin-bottom:16px}

/* ---------- logo ---------- */
.logo{font-size:40px;font-weight:600;letter-spacing:-1.5px;line-height:1;display:inline-flex;align-items:baseline;white-space:nowrap}
.logo .dot{display:inline-block;width:.19em;height:.19em;background:var(--red);margin-left:.07em}
.logo small{font-size:12px;letter-spacing:1.5px;color:var(--muted);font-weight:500;margin-left:10px;text-transform:uppercase}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:42px;padding:0 18px;border-radius:6px;font-size:14.5px;font-weight:500;border:1px solid transparent;background:none;color:#fff;transition:.2s;white-space:nowrap;cursor:pointer;text-align:center}
.btn svg{width:17px;height:17px;flex:0 0 auto}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn-red{background:var(--red);border-color:var(--red)}
.btn-red:hover:not(:disabled){background:var(--red-2);box-shadow:0 0 22px rgba(228,42,31,.4)}
.btn-violet{background:linear-gradient(180deg,#5d48e8,#4a36d0);border-color:rgba(157,140,255,.35)}
.btn-violet:hover{box-shadow:0 8px 26px rgba(90,69,228,.45)}
.btn-gold{background:linear-gradient(180deg,#f3d27a,#c8921f);color:#1b1305;border:0}
.btn-gold:hover{box-shadow:0 0 24px rgba(232,182,76,.4)}
.btn-line{border-color:var(--line-2);background:rgba(255,255,255,.02)}
.btn-line:hover{border-color:var(--line-3);background:rgba(255,255,255,.05)}
.btn-outline{border-color:var(--red);color:var(--red-2)}
.btn-outline:hover{background:var(--red);color:#fff}
.btn-ghost{color:var(--text-2)}.btn-ghost:hover{background:rgba(255,255,255,.06);color:#fff}
.btn-danger{border-color:rgba(208,59,59,.6);color:#ff8a85}.btn-danger:hover{background:var(--crit);color:#fff}
.btn-sm{height:34px;padding:0 13px;font-size:13px;border-radius:5px}
.btn-xs{height:28px;padding:0 10px;font-size:12px;border-radius:5px;gap:6px}
.btn-xs svg{width:13px;height:13px}
.btn-lg{height:52px;padding:0 28px;font-size:16px}
.btn-block{width:100%}
.icon-btn{position:relative;width:40px;height:40px;border:0;background:none;color:#e9ebef;display:inline-grid;place-items:center;border-radius:8px;transition:.15s}
.icon-btn:hover{background:rgba(255,255,255,.07)}
.icon-btn svg{width:22px;height:22px}
.icon-btn.sm{width:32px;height:32px}.icon-btn.sm svg{width:17px;height:17px}

/* ---------- badges / chips / pills ---------- */
.badge{position:absolute;top:2px;right:3px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--red);color:#fff;font-size:10.5px;font-weight:600;display:grid;place-items:center;border:2px solid var(--bg);line-height:1}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:#cfd2d8;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:5px;padding:3px 9px;white-space:nowrap}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.pill{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:20px;font-size:12px;font-weight:500;white-space:nowrap;border:1px solid transparent}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.pill.nodot::before{display:none}
.pill-green{color:var(--green);background:rgba(47,217,107,.1);border-color:rgba(47,217,107,.3)}
.pill-live{color:var(--green);background:rgba(47,217,107,.1);border-color:rgba(47,217,107,.3)}
.pill-live::before{box-shadow:0 0 8px var(--green);animation:kqpulse 1.5s infinite}
.pill-red{color:#ff8a85;background:rgba(228,42,31,.12);border-color:rgba(228,42,31,.35)}
.pill-amber{color:var(--amber);background:rgba(250,178,25,.1);border-color:rgba(250,178,25,.3)}
.pill-gray{color:#b9bdc6;background:rgba(255,255,255,.06);border-color:var(--line)}
.pill-violet{color:var(--violet-soft);background:rgba(90,69,228,.14);border-color:rgba(157,140,255,.35)}
.pill-gold{color:var(--gold-2);background:rgba(232,182,76,.12);border-color:rgba(232,182,76,.4)}
.pill-blue{color:#7fb6ff;background:rgba(57,135,229,.12);border-color:rgba(57,135,229,.35)}
@keyframes kqpulse{50%{opacity:.3}}
.tag-prem{display:inline-flex;align-items:center;gap:6px;padding:4px 9px 4px 7px;border-radius:5px;background:linear-gradient(180deg,#f3d27a,#c8921f);color:#1b1305;font-size:11px;font-weight:600;letter-spacing:.8px}
.tag-prem svg{width:12px;height:12px}

/* ---------- forms ---------- */
.field{margin-bottom:14px}
.field>label,.lbl{display:block;font-size:13px;color:#c9ccd3;margin-bottom:7px}
.input,.select,.textarea{width:100%;height:44px;background:#12141a;border:1px solid var(--line-2);border-radius:7px;color:#fff;font-size:14.5px;padding:0 14px;outline:0;transition:border-color .2s,box-shadow .2s}
.textarea{height:auto;min-height:90px;padding:11px 14px;resize:vertical;line-height:1.5}
.select{appearance:none;-webkit-appearance:none;padding-right:36px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23aab' stroke-width='1.6'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center}
.select option{background:#12141a}
.input::placeholder,.textarea::placeholder{color:#6f7480}
.input:focus,.select:focus,.textarea:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(228,42,31,.18)}
.input.err,.select.err{border-color:#ff5147}
.help{font-size:12px;color:var(--faint);margin-top:6px}
.err-msg{font-size:12px;color:#ff6a61;margin-top:6px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.check{display:inline-flex;align-items:center;gap:9px;cursor:pointer;color:#d4d7dd;font-size:14px;line-height:1.4}
.check input{appearance:none;-webkit-appearance:none;width:17px;height:17px;border:1px solid rgba(255,255,255,.3);border-radius:4px;flex:0 0 auto;display:grid;place-items:center;cursor:pointer;transition:.15s}
.check input[type=radio]{border-radius:50%}
.check input:checked{background:var(--red);border-color:var(--red)}
.check input:checked::after{content:"";width:9px;height:5px;border:2px solid #fff;border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px)}
.check input[type=radio]:checked::after{width:7px;height:7px;border:0;border-radius:50%;background:#fff;transform:none}
.switch{position:relative;display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-size:14px}
.switch input{appearance:none;-webkit-appearance:none;width:40px;height:22px;border-radius:12px;background:rgba(255,255,255,.16);position:relative;cursor:pointer;transition:.2s;flex:0 0 auto}
.switch input::after{content:"";position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:.2s}
.switch input:checked{background:var(--green)}
.switch input:checked::after{left:21px}
.searchbox{height:44px;display:flex;align-items:center;gap:10px;background:#0e1016;border:1px solid var(--line);border-radius:8px;padding:0 14px;transition:.2s}
.searchbox:focus-within{border-color:var(--red);box-shadow:0 0 0 3px rgba(228,42,31,.15)}
.searchbox svg{width:18px;height:18px;color:#9ea2ac;flex:0 0 auto}
.searchbox input{flex:1;min-width:0;background:none;border:0;outline:0;color:#fff;font-size:14px}
.searchbox input::placeholder{color:#7c808b}
.color-in{width:44px;height:44px;border-radius:7px;border:1px solid var(--line-2);background:none;padding:3px;cursor:pointer}

/* ---------- cards ---------- */
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);min-width:0}
.card-pad{padding:20px}
.card-head{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line)}
.card-head h3{font-size:16.5px;font-weight:500}
.card-head .sub{font-size:12.5px;color:var(--muted)}
.card-body{padding:18px 20px}
.sec-title{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:500;margin-bottom:18px}
.sec-title::before{content:"";width:14px;height:2px;background:var(--red)}
.sec-title .more{margin-left:auto;font-size:14px;color:var(--red-2);display:flex;align-items:center;gap:6px}
.sec-title .more svg{width:14px;height:14px}
.eyebrow{color:var(--red-2);font-size:13px;letter-spacing:2.5px;text-transform:uppercase;font-weight:500}
.avatar{width:40px;height:40px;border-radius:50%;object-fit:cover;flex:0 0 auto;display:inline-grid;place-items:center;font-weight:600;font-size:14px;color:#fff;background:linear-gradient(135deg,#5a45e4,#2d2481);overflow:hidden}
.avatar.sm{width:30px;height:30px;font-size:11px}.avatar.lg{width:64px;height:64px;font-size:22px}.avatar.xl{width:96px;height:96px;font-size:32px}
.avatar img{width:100%;height:100%;object-fit:cover}
.logo-tile{display:inline-grid;place-items:center;border-radius:10px;font-weight:700;color:#fff;flex:0 0 auto;letter-spacing:-.5px}
.stack{display:flex}.stack>*{margin-left:-8px;border:2px solid var(--panel)}.stack>*:first-child{margin-left:0}
.divider{height:1px;background:var(--line);margin:16px 0}
.empty{text-align:center;padding:48px 20px;color:var(--muted);border:1px dashed var(--line-2);border-radius:10px}
.empty b{display:block;color:#fff;font-size:17px;font-weight:500;margin-bottom:6px}
.empty svg{width:40px;height:40px;margin:0 auto 12px;color:var(--faint)}

/* ---------- tabs ---------- */
.tabs{display:inline-flex;background:#0c0e14;border:1px solid var(--line);border-radius:8px;padding:4px;gap:2px;flex-wrap:wrap}
.tab{border:0;background:none;color:#b9bdc6;font-size:14px;padding:0 15px;height:36px;border-radius:5px;display:inline-flex;align-items:center;gap:8px;transition:.2s;white-space:nowrap}
.tab .n{font-size:11.5px;background:rgba(255,255,255,.08);padding:1px 7px;border-radius:9px}
.tab:hover{color:#fff}
.tab.on{background:var(--red);color:#fff}
.tab.on .n{background:rgba(0,0,0,.25)}
.utabs{display:flex;gap:26px;border-bottom:1px solid var(--line);margin-bottom:22px;overflow-x:auto}
.utab{border:0;background:none;color:var(--muted);font-size:15px;padding:12px 0;position:relative;white-space:nowrap}
.utab.on{color:#fff}
.utab.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--red)}

/* ---------- tables ---------- */
.table-wrap{overflow-x:auto}
.table{width:100%;border-collapse:collapse;font-size:13.5px}
.table th{text-align:left;font-weight:500;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.6px;padding:11px 14px;border-bottom:1px solid var(--line);white-space:nowrap;background:rgba(255,255,255,.015)}
.table td{padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.06);vertical-align:middle}
.table tr:hover td{background:rgba(255,255,255,.02)}
.table .who{display:flex;align-items:center;gap:10px}
.table .who b{display:block;font-weight:500}
.table .who small{color:var(--muted);font-size:12px}
.table .actions{display:flex;gap:6px;justify-content:flex-end}
.th-sort{cursor:pointer}

/* ---------- header / shell ---------- */
.kq-header{position:sticky;top:0;z-index:50;background:rgba(7,8,12,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.kq-header-in{max-width:1672px;margin:0 auto;height:76px;display:flex;align-items:center;padding:0 28px 0 34px;gap:18px}
.kq-nav{display:flex;gap:6px;list-style:none;margin:0 auto}
.kq-nav a{display:block;font-size:15.5px;color:#e8eaee;padding:8px 14px;position:relative;transition:color .2s;border-radius:6px}
.kq-nav a:hover{color:var(--red-2)}
.kq-nav a.on{color:var(--red-2)}
.kq-nav a.on::after{content:"";position:absolute;left:14px;right:14px;bottom:-1px;height:2px;background:var(--red)}
.kq-tools{display:flex;align-items:center;gap:6px}
.kq-user{display:flex;align-items:center;gap:11px;margin-left:10px;padding:6px 14px 6px 8px;border:1px solid var(--line);border-radius:10px;background:#0e1016;cursor:pointer;position:relative}
.kq-user b{display:block;font-size:14px;font-weight:500;white-space:nowrap}
.kq-user small{font-size:12px;color:var(--muted)}
.kq-user .chev{margin-left:14px;width:13px;height:13px;color:#ccc;transition:transform .2s}
.kq-user.open .chev{transform:rotate(180deg)}
.pop{position:relative}
.dropdown{position:absolute;top:calc(100% + 10px);right:0;min-width:240px;background:#10121a;border:1px solid var(--line-2);border-radius:10px;padding:8px;box-shadow:var(--shadow);opacity:0;visibility:hidden;transform:translateY(-6px);transition:.18s;z-index:60;cursor:default}
.open>.dropdown{opacity:1;visibility:visible;transform:none}
.dropdown a,.dropdown button.dd{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border-radius:7px;font-size:14px;color:#dfe2e8;border:0;background:none;text-align:left}
.dropdown a:hover,.dropdown button.dd:hover{background:rgba(255,255,255,.06);color:#fff}
.dropdown a svg,.dropdown button.dd svg{width:17px;height:17px;color:var(--muted)}
.dropdown hr{border:0;border-top:1px solid var(--line);margin:6px 0}
.dropdown .dd-head{padding:8px 12px 10px;font-size:12px;color:var(--faint);text-transform:uppercase;letter-spacing:1px}
.notif-dd{width:360px;padding:0}
.notif-dd .nd-head{display:flex;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line)}
.notif-dd .nd-head b{font-weight:500}
.notif-dd .nd-head button{margin-left:auto;border:0;background:none;color:var(--red-2);font-size:12.5px}
.notif-list{max-height:380px;overflow-y:auto}
.notif-item{display:flex;gap:12px;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.05);position:relative;cursor:pointer}
.notif-item:hover{background:rgba(255,255,255,.03)}
.notif-item .ni-ic{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(228,42,31,.12);color:var(--red-2);flex:0 0 auto}
.notif-item .ni-ic svg{width:16px;height:16px}
.notif-item b{display:block;font-size:13.5px;font-weight:500;line-height:1.35}
.notif-item p{font-size:12.5px;color:var(--muted);margin-top:2px;line-height:1.4}
.notif-item small{font-size:11px;color:var(--faint)}
.notif-item.unread::after{content:"";position:absolute;right:14px;top:18px;width:7px;height:7px;border-radius:50%;background:var(--red)}
.menu-toggle{display:none}

/* role switch banner */
.demo-bar{background:linear-gradient(90deg,rgba(228,42,31,.18),rgba(90,69,228,.18));border-bottom:1px solid var(--line);font-size:12.5px;color:#e5e7eb}
.demo-bar-in{max-width:1672px;margin:0 auto;padding:7px 34px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.demo-bar b{font-weight:600}
.demo-bar button{border:1px solid var(--line-2);background:rgba(0,0,0,.25);color:#fff;border-radius:5px;padding:3px 10px;font-size:12px}
.demo-bar button:hover{border-color:#fff}
.demo-bar button.on{background:#fff;color:#000}
.demo-bar .x{margin-left:auto;border:0;background:none;opacity:.7}

/* right dock */
.kq-dock{position:fixed;right:6px;top:150px;width:68px;background:rgba(12,13,18,.94);border:1px solid var(--line);border-radius:10px;padding:10px 0;z-index:40;backdrop-filter:blur(8px)}
.kq-dock a{display:flex;flex-direction:column;align-items:center;gap:5px;padding:9px 2px 10px;font-size:10.5px;color:#d7dae0;white-space:nowrap;transition:.2s;position:relative;text-align:center}
.kq-dock a svg{width:23px;height:23px}
.kq-dock a.on,.kq-dock a:hover{color:var(--red-2)}
.kq-dock .badge{top:3px;right:12px}

/* page containers */
.page{max-width:1672px;margin:0 auto;padding:26px 92px 60px 34px}
.page.narrow{max-width:1240px;padding-right:92px}
.crumbs{display:flex;align-items:center;gap:12px;font-size:14px;color:#b9bdc6;margin-bottom:18px;flex-wrap:wrap}
.crumbs a{display:flex;align-items:center;gap:8px;transition:color .2s}
.crumbs a:hover{color:#fff}
.crumbs svg{width:15px;height:15px}
.crumbs .sep{color:#5d616c}
.crumbs .cur{color:#fff}
.page-head{display:flex;align-items:flex-end;gap:20px;margin-bottom:24px;flex-wrap:wrap}
.page-head h1{font-size:40px;font-weight:600;letter-spacing:-.8px;line-height:1.1}
.page-head h1 span{color:var(--red)}
.page-head p{color:var(--text-2);font-weight:300;font-size:16px;margin-top:8px;max-width:640px;line-height:1.5}
.page-head .actions{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap}

/* ---------- modal / drawer / toast ---------- */
.overlay{position:fixed;inset:0;z-index:200;background:rgba(3,4,7,.74);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;visibility:hidden;transition:.22s}
.overlay.open{opacity:1;visibility:visible}
.modal{position:relative;width:100%;max-width:560px;max-height:calc(100vh - 40px);overflow-y:auto;background:#0e1016;border:1px solid var(--line-2);border-radius:14px;box-shadow:0 30px 80px rgba(0,0,0,.6);transform:translateY(14px) scale(.99);transition:.25s}
.overlay.open .modal{transform:none}
.modal.wide{max-width:820px}.modal.xl{max-width:1040px}.modal.sm{max-width:440px}
.modal-head{display:flex;align-items:flex-start;gap:14px;padding:24px 26px 6px}
.modal-head h3{font-size:21px;font-weight:600;line-height:1.25}
.modal-head p{font-size:13.5px;color:var(--muted);margin-top:4px}
.modal-body{padding:16px 26px 8px}
.modal-foot{display:flex;gap:10px;justify-content:flex-end;padding:16px 26px 24px}
.x-btn{margin-left:auto;width:34px;height:34px;border-radius:50%;border:1px solid var(--line-2);background:none;color:#fff;display:grid;place-items:center;flex:0 0 auto}
.x-btn:hover{border-color:var(--red)}
.x-btn svg{width:14px;height:14px}
.drawer{position:fixed;top:0;right:0;bottom:0;z-index:190;width:420px;max-width:100%;background:#0e1016;border-left:1px solid var(--line-2);box-shadow:-20px 0 60px rgba(0,0,0,.5);transform:translateX(100%);transition:transform .3s;display:flex;flex-direction:column}
.drawer.open{transform:none}
.drawer-head{display:flex;align-items:center;gap:12px;padding:18px 20px;border-bottom:1px solid var(--line)}
.drawer-head h3{font-size:17px;font-weight:500}
.drawer-body{flex:1;overflow-y:auto;padding:18px 20px}
.toasts{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:300;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
.toast{background:#171826;border:1px solid var(--line-2);border-radius:9px;padding:12px 18px;font-size:13.5px;box-shadow:0 12px 30px rgba(0,0,0,.5);display:flex;gap:10px;align-items:center;animation:toastIn .3s;pointer-events:auto;max-width:92vw}
.toast svg{width:18px;height:18px;flex:0 0 auto}
.toast.ok svg{color:var(--green)}.toast.info svg{color:#7fb6ff}.toast.warn svg{color:var(--amber)}.toast.pts svg{color:var(--gold)}
@keyframes toastIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* chat bubbles (shared) */
.msgs{display:flex;flex-direction:column;gap:10px}
.msg{max-width:78%;padding:9px 13px;border-radius:13px;font-size:13.5px;line-height:1.45;word-wrap:break-word}
.msg small{display:block;font-size:10.5px;opacity:.6;margin-top:3px}
.msg.them{background:#1a1b25;border-bottom-left-radius:3px;align-self:flex-start}
.msg.me{background:var(--red);border-bottom-right-radius:3px;align-self:flex-end}
.typing{align-self:flex-start;display:none;gap:4px;padding:12px 14px;background:#1a1b25;border-radius:12px}
.typing.on{display:flex}
.typing i{width:6px;height:6px;border-radius:50%;background:#999;animation:blink 1.2s infinite}
.typing i:nth-child(2){animation-delay:.2s}.typing i:nth-child(3){animation-delay:.4s}
@keyframes blink{50%{opacity:.2}}

/* global search overlay */
.gsearch .modal{max-width:720px;align-self:flex-start;margin-top:8vh}
.gsearch .searchbox{height:56px;border:0;border-bottom:1px solid var(--line);border-radius:14px 14px 0 0;background:transparent;font-size:16px}
.gsearch .searchbox input{font-size:16px}
.gs-results{max-height:60vh;overflow-y:auto;padding:8px}
.gs-group{font-size:11.5px;letter-spacing:1px;text-transform:uppercase;color:var(--faint);padding:12px 12px 6px}
.gs-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:8px;cursor:pointer}
.gs-item:hover,.gs-item.sel{background:rgba(255,255,255,.06)}
.gs-item b{font-weight:500;font-size:14px;display:block}
.gs-item small{color:var(--muted);font-size:12px}
.gs-item .k{margin-left:auto;font-size:11px;color:var(--faint)}

/* ---------- KPI + charts ---------- */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px;position:relative;overflow:hidden}
.kpi .k-label{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:8px}
.kpi .k-label svg{width:16px;height:16px}
.kpi .k-val{font-size:30px;font-weight:600;margin-top:8px;letter-spacing:-.5px}
.kpi .k-delta{font-size:12.5px;margin-top:4px;display:flex;align-items:center;gap:5px;color:var(--muted)}
.kpi .k-delta .up{color:var(--green)}.kpi .k-delta .down{color:#ff8a85}
.kpi .spark{position:absolute;right:14px;bottom:14px;width:90px;height:34px;opacity:.9}
.chart{position:relative;width:100%}
.chart svg{width:100%;height:auto;overflow:visible}
.chart .grid-l{stroke:rgba(255,255,255,.07);stroke-width:1}
.chart .axis-t{fill:#8e93a0;font-size:11px;font-family:Outfit,sans-serif}
.chart-tip{position:absolute;pointer-events:none;background:#171826;border:1px solid var(--line-2);border-radius:8px;padding:8px 11px;font-size:12.5px;box-shadow:0 10px 24px rgba(0,0,0,.5);opacity:0;transition:opacity .12s;white-space:nowrap;z-index:5}
.chart-tip b{display:block;font-weight:500;margin-bottom:3px}
.chart-tip .r{display:flex;align-items:center;gap:7px;color:#d6d9df}
.chart-tip .r i{width:9px;height:9px;border-radius:2px;display:inline-block}
.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12.5px;color:#c9ccd3}
.legend span{display:inline-flex;align-items:center;gap:7px}
.legend i{width:10px;height:10px;border-radius:2px;display:inline-block}
.bar-list{display:flex;flex-direction:column;gap:12px}
.bar-row{display:grid;grid-template-columns:140px 1fr 56px;align-items:center;gap:12px;font-size:13px}
.bar-row .bt{height:10px;background:rgba(255,255,255,.06);border-radius:4px;overflow:hidden}
.bar-row .bf{height:100%;border-radius:4px;background:var(--s1)}
.bar-row .bv{text-align:right;color:#e5e7eb}
.bar-row .bl{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#d6d9df}
.progress{height:8px;background:rgba(255,255,255,.07);border-radius:4px;overflow:hidden}
.progress>i{display:block;height:100%;background:var(--red);border-radius:4px}

/* ---------- dashboard shell (exhibitor + admin) ---------- */
.dash{display:grid;grid-template-columns:262px minmax(0,1fr);min-height:100vh}
.dash-side{position:sticky;top:0;height:100vh;overflow-y:auto;background:#0a0b10;border-right:1px solid var(--line);padding:22px 14px;display:flex;flex-direction:column}
.dash-side .logo{font-size:32px;padding:0 10px}
.dash-role{margin:18px 6px 18px;padding:12px;border-radius:10px;border:1px solid var(--line);background:#0e1016;display:flex;align-items:center;gap:11px}
.dash-role b{display:block;font-size:14px;font-weight:500;line-height:1.2}
.dash-role small{font-size:11.5px;color:var(--muted)}
.dash-nav{display:flex;flex-direction:column;gap:2px}
.dash-nav .grp{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--faint);padding:16px 12px 6px}
.dash-nav a{display:flex;align-items:center;gap:12px;padding:0 12px;height:40px;border-radius:7px;font-size:14.5px;color:#d3d6dc;transition:.15s;position:relative}
.dash-nav a svg{width:18px;height:18px;color:#9ea2ac}
.dash-nav a:hover{background:rgba(255,255,255,.04);color:#fff}
.dash-nav a.on{background:linear-gradient(90deg,rgba(228,42,31,.2),rgba(228,42,31,.05));color:#fff}
.dash-nav a.on::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:2px;background:var(--red)}
.dash-nav a.on svg{color:var(--red-2)}
.dash-nav a .n{margin-left:auto;font-size:11px;background:var(--red);color:#fff;border-radius:9px;padding:1px 7px}
.dash-side .foot{margin-top:auto;padding-top:18px}
.dash-main{min-width:0}
.dash-top{position:sticky;top:0;z-index:40;height:68px;display:flex;align-items:center;gap:14px;padding:0 30px;background:rgba(7,8,12,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.dash-top h2{font-size:20px;font-weight:500}
.dash-top .crumb{font-size:13px;color:var(--muted)}
.dash-body{padding:26px 30px 60px;max-width:1500px}
.dash-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.c3{grid-column:span 3}.c4{grid-column:span 4}.c5{grid-column:span 5}.c6{grid-column:span 6}.c7{grid-column:span 7}.c8{grid-column:span 8}.c12{grid-column:span 12}
.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.list-item{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.06)}
.list-item:last-child{border-bottom:0}
.list-item b{font-weight:500;font-size:14px;display:block}
.list-item small{font-size:12px;color:var(--muted)}
.stat-mini{display:flex;flex-direction:column}
.stat-mini b{font-size:20px;font-weight:600}
.stat-mini small{font-size:12px;color:var(--muted)}
.setting-row{display:flex;align-items:center;gap:20px;padding:16px 0;border-bottom:1px solid var(--line)}
.setting-row:last-child{border-bottom:0}
.setting-row b{display:block;font-weight:500;font-size:14.5px}
.setting-row small{color:var(--muted);font-size:12.5px}
.setting-row>div:first-child{flex:1}
.dash-mtoggle{display:none}

/* score dots */
.score{display:inline-flex;align-items:center;gap:6px;font-weight:500}
.score i{width:8px;height:8px;border-radius:50%}
.hot{color:#ff8a85}.hot i{background:var(--red-2)}
.warm{color:var(--amber)}.warm i{background:var(--amber)}
.cold{color:#7fb6ff}.cold i{background:var(--s1)}

/* ---------- responsive ---------- */
@media (max-width:1400px){.kq-nav a{padding:8px 10px;font-size:15px}}
@media (max-width:1200px){
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .c3,.c4,.c5{grid-column:span 6}.c6,.c7,.c8{grid-column:span 12}
}
@media (max-width:1100px){
  .kq-nav{display:none;position:absolute;top:76px;left:0;right:0;flex-direction:column;background:#0a0b10;border-bottom:1px solid var(--line);padding:10px 16px 16px}
  .kq-nav.open{display:flex}
  .menu-toggle{display:inline-grid}
  .kq-tools{margin-left:auto}
  .kq-dock{top:auto;bottom:0;left:0;right:0;width:auto;display:flex;justify-content:space-around;border-radius:0;padding:4px 0;border-width:1px 0 0}
  .kq-dock a{flex:1;font-size:9.5px}
  .kq-dock a:nth-child(n+6){display:none}
  .page,.page.narrow{padding:20px 16px 100px}
  .dash{grid-template-columns:1fr}
  .dash-side{position:fixed;left:0;top:0;z-index:120;width:270px;transform:translateX(-100%);transition:transform .3s;box-shadow:20px 0 60px rgba(0,0,0,.6)}
  .dash-side.open{transform:none}
  .dash-mtoggle{display:inline-grid}
  .dash-top{padding:0 16px}
  .dash-body{padding:20px 16px 60px}
}
@media (max-width:640px){
  .kq-header-in{padding:0 12px;height:66px;gap:8px}
  .kq-nav{top:66px}
  .logo{font-size:30px}
  .kq-user{padding:4px;margin-left:2px}.kq-user .u-txt,.kq-user .chev{display:none}
  .kq-tools .icon-btn{width:36px}
  .notif-dd{width:300px;right:-80px}
  .grid2,.grid3{grid-template-columns:1fr;gap:0}
  .kpis{grid-template-columns:1fr 1fr;gap:10px}
  .kpi{padding:14px}.kpi .k-val{font-size:24px}.kpi .spark{display:none}
  .c3,.c4,.c5,.c6{grid-column:span 12}
  .page-head h1{font-size:30px}
  .modal-head,.modal-body,.modal-foot{padding-left:18px;padding-right:18px}
  .demo-bar-in{padding:7px 12px}
  .bar-row{grid-template-columns:96px 1fr 44px}
  .utabs{gap:18px}
  .dash-top{height:60px;gap:8px}.dash-top .crumb{display:none}.dash-top h2{font-size:17px}.dash-top .btn{display:none}
  .chart svg{min-height:180px}
}