/* Vybe CRM — self-contained tokens (shadcn neutral) + components, dark-first. */
:root{
  --background:0 0% 100%; --foreground:0 0% 3.9%; --card:0 0% 100%; --muted:0 0% 96.1%;
  --muted-foreground:0 0% 45.1%; --accent:0 0% 96.1%; --border:0 0% 89.8%; --input:0 0% 89.8%;
  --primary:0 0% 9%; --primary-foreground:0 0% 98%; --secondary:0 0% 96.1%; --ring:0 0% 3.9%; --popover:0 0% 100%;
  --radius:8px; --radius-md:6px;
  --bid-blue:#4B9BFF; --buy:#2563eb; --buy-hover:#1d4ed8;
  --price-up:#60a5fa; --price-down:#f87171;
  --status-ok:#22c55e; --status-warn:#eab308; --status-err:#ef4444; --orange-500:#FF6B35;
  --font-sans:Inter,Roboto,ui-sans-serif,system-ui,sans-serif;
  --font-mono:Roboto,ui-monospace,"SF Mono",Menlo,monospace;
  --shadow-sm:0 1px 2px 0 rgb(0 0 0 / .05);
  --shadow-md:0 4px 6px -1px rgb(0 0 0 / .1),0 2px 4px -2px rgb(0 0 0 / .1);
  color-scheme:light;
}
.dark{
  --background:0 0% 3.9%; --foreground:0 0% 98%; --card:0 0% 3.9%; --muted:0 0% 14.9%;
  --muted-foreground:0 0% 63.9%; --accent:0 0% 14.9%; --border:0 0% 14.9%; --input:0 0% 14.9%;
  --primary:0 0% 98%; --primary-foreground:0 0% 9%; --secondary:0 0% 14.9%; --ring:0 0% 83.1%; --popover:0 0% 3.9%;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:var(--font-sans);background:hsl(var(--background));color:hsl(var(--foreground));font-size:13px;overflow:hidden}
a{color:inherit;text-decoration:none}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.muted{color:hsl(var(--muted-foreground))}.up{color:var(--price-up)}.link{color:var(--bid-blue)}
.ico{width:16px;height:16px;flex:none}.ico.big{width:34px;height:34px;color:var(--bid-blue);margin:0 auto}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:hsl(var(--border));border-radius:6px;border:3px solid hsl(var(--background))}

/* shell */
.app{display:flex;height:100vh;min-height:0}
.side{width:236px;flex-shrink:0;display:flex;flex-direction:column;min-height:0;border-right:1px solid hsl(var(--border));background:hsl(var(--card));transition:width .18s}
body.crm-collapsed .side{width:52px}
.side .shd{display:flex;align-items:center;gap:9px;height:52px;padding:0 12px;flex-shrink:0;border-bottom:1px solid hsl(var(--border))}
.side .shd .vmark{width:22px;height:22px;color:hsl(var(--foreground));flex:none}
.side .shd .info{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.side .shd .info b{font-size:13px;font-weight:600}.side .shd .info span{font-size:11px;color:hsl(var(--muted-foreground))}
body.crm-collapsed .side .shd .info{display:none}
.side .scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:8px}
.grp{font-size:9px;text-transform:uppercase;letter-spacing:.7px;color:hsl(var(--muted-foreground));font-family:var(--font-mono);padding:12px 8px 5px}
body.crm-collapsed .grp{opacity:0;height:12px;padding:6px 0 0}
.navg{display:flex;flex-direction:column;gap:1px}
a.nav{display:flex;align-items:center;gap:10px;height:32px;padding:0 9px;border-radius:var(--radius-md);color:hsl(var(--muted-foreground));font-size:13px;font-weight:500;white-space:nowrap;position:relative}
a.nav:hover{background:hsl(var(--accent));color:hsl(var(--foreground))}
a.nav.active{background:hsl(var(--accent));color:hsl(var(--foreground));font-weight:600}
a.nav.active::before{content:"";position:absolute;left:-8px;top:6px;bottom:6px;width:2px;border-radius:2px;background:hsl(var(--primary))}
body.crm-collapsed a.nav .lbl{display:none}
body.crm-collapsed a.nav{justify-content:center;padding:0}
.side .sft{flex-shrink:0;border-top:1px solid hsl(var(--border));padding:8px}
.userbtn-form{margin:0}
.userbtn{display:flex;align-items:center;gap:9px;padding:4px 6px;border-radius:var(--radius-md)}
.userbtn:hover{background:hsl(var(--accent))}
.userbtn .av{width:26px;height:26px;border-radius:999px;background:hsl(var(--muted));display:grid;place-items:center;font-size:11px;font-weight:600;flex:none}
.userbtn .u{flex:1;min-width:0;line-height:1.2}.userbtn .u b{font-size:12.5px;font-weight:500;display:block;overflow:hidden;text-overflow:ellipsis}.userbtn .u span{font-size:11px;color:hsl(var(--muted-foreground));overflow:hidden;text-overflow:ellipsis;display:block}
body.crm-collapsed .userbtn .u{display:none}

.inset{flex:1;min-width:0;display:flex;flex-direction:column;min-height:0}
.top{display:flex;align-items:center;gap:8px;height:37px;flex-shrink:0;padding:0 10px;border-bottom:1px solid hsl(var(--border));background:hsl(var(--background))}
.iconbtn{height:26px;width:26px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-md);color:hsl(var(--muted-foreground));cursor:pointer;border:0;background:transparent}
.iconbtn:hover{background:hsl(var(--accent));color:hsl(var(--foreground))}
.vsep{width:1px;height:14px;background:hsl(var(--border))}
.crumb{flex:1;min-width:0;font-size:12px;color:hsl(var(--muted-foreground))}
.env{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-family:var(--font-mono);border:1px solid hsl(var(--input));border-radius:var(--radius-md);height:22px;padding:0 8px;color:hsl(var(--muted-foreground))}
.env .dot,.dot{width:7px;height:7px;border-radius:50%;background:var(--status-ok);display:inline-block}
.body,.pagepad{flex:1;min-height:0;overflow-y:auto;padding:18px 22px 60px}
.body{max-width:100%}

/* page bits */
.ph{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px;flex-wrap:wrap;max-width:1100px}
.ph h1{font-size:22px;font-weight:700;letter-spacing:-.3px;margin:0}.ph p{font-size:12.5px;color:hsl(var(--muted-foreground));margin:3px 0 0}
.phact{display:flex;gap:8px;flex-wrap:wrap}
.grid{display:grid;gap:14px;max-width:1100px}.g2{grid-template-columns:1fr 1fr}.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1000px){.g4{grid-template-columns:repeat(2,1fr)}.g2{grid-template-columns:1fr}}
.kpi{border:1px solid hsl(var(--border));border-radius:var(--radius);background:hsl(var(--card));padding:12px 14px}
.kpi .l{font-size:11px;color:hsl(var(--muted-foreground));display:flex;align-items:center;gap:6px}.kpi .l .ico{width:13px;height:13px}
.kpi .v{font-size:24px;font-weight:300;font-family:var(--font-mono);letter-spacing:-.03em;margin-top:9px}
.kpi .d{font-size:11px;margin-top:5px;font-family:var(--font-mono);display:flex;align-items:center;gap:5px}.kpi .d .ico{width:12px;height:12px}
.card{border:1px solid hsl(var(--border));border-radius:var(--radius);background:hsl(var(--card));max-width:1100px}
.card .ch{padding:13px 15px 0;display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.card .ct{font-size:14px;font-weight:600}.card .cd{font-size:11.5px;color:hsl(var(--muted-foreground));margin-top:2px}
.card .cc{padding:14px 15px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:7px 16px;font-size:12.5px}.kv .k{color:hsl(var(--muted-foreground))}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap;border-radius:var(--radius-md);font-size:13px;font-weight:500;border:1px solid transparent;cursor:pointer;height:32px;padding:0 12px}
.btn .ico{width:14px;height:14px}
.btn-default{background:hsl(var(--primary));color:hsl(var(--primary-foreground))}
.btn-outline{border-color:hsl(var(--input));background:transparent;color:hsl(var(--foreground))}.btn-outline:hover{background:hsl(var(--accent))}
.btn-ghost{background:transparent;color:hsl(var(--foreground))}.btn-ghost:hover{background:hsl(var(--accent))}
.btn-blue{background:var(--buy);color:#fff}.btn-blue:hover{background:var(--buy-hover)}
.btn-xs{height:26px;padding:0 9px;font-size:12px}
.btn:disabled{opacity:.5;cursor:default}

.badge{display:inline-flex;align-items:center;gap:5px;border:1px solid transparent;border-radius:var(--radius-md);padding:1px 8px;font-size:11px;font-weight:600;margin-right:4px}
.b-ok{color:var(--status-ok);background:color-mix(in srgb,var(--status-ok) 14%,transparent);border-color:color-mix(in srgb,var(--status-ok) 32%,transparent)}
.b-warn{color:var(--status-warn);background:color-mix(in srgb,var(--status-warn) 14%,transparent);border-color:color-mix(in srgb,var(--status-warn) 32%,transparent)}
.b-err{color:var(--status-err);background:color-mix(in srgb,var(--status-err) 14%,transparent);border-color:color-mix(in srgb,var(--status-err) 32%,transparent)}
.b-blue{color:var(--bid-blue);background:color-mix(in srgb,var(--bid-blue) 14%,transparent);border-color:color-mix(in srgb,var(--bid-blue) 32%,transparent)}
.b-violet{color:#c4b5fd;background:color-mix(in srgb,#8b5cf6 16%,transparent);border-color:color-mix(in srgb,#8b5cf6 34%,transparent)}
.b-out{border-color:hsl(var(--border));color:hsl(var(--muted-foreground))}

.input{display:flex;height:32px;width:100%;border-radius:var(--radius-md);border:1px solid hsl(var(--input));background:transparent;padding:0 11px;font-size:13px;color:hsl(var(--foreground));align-items:center;outline:none}
.input:focus{box-shadow:0 0 0 1px hsl(var(--ring))}
select.input{padding:0 6px}
label.lbl{font-size:12px;font-weight:500;margin-bottom:6px;display:block}

.tblwrap{border:1px solid hsl(var(--border));border-radius:var(--radius);overflow:auto;background:hsl(var(--card));max-width:1100px}
table.tbl{width:100%;border-collapse:collapse;font-family:var(--font-mono);font-size:11.5px;font-variant-numeric:tabular-nums}
table.tbl th{height:30px;padding:0 10px;text-align:left;font-weight:500;color:hsl(var(--muted-foreground));font-size:11px;border-bottom:1px solid hsl(var(--border));white-space:nowrap}
table.tbl th.r,table.tbl td.r{text-align:right}
table.tbl td{height:32px;padding:3px 10px;border-bottom:1px solid color-mix(in srgb,hsl(var(--border)) 45%,transparent)}
table.tbl tr:hover td{background:hsl(var(--accent))}
table.tbl td.sym{font-family:var(--font-sans);font-weight:600}
.av.sm{width:24px;height:24px;border-radius:999px;background:hsl(var(--muted));display:grid;place-items:center;font-size:10px;font-weight:600}
.progress{height:8px;border-radius:999px;background:color-mix(in srgb,hsl(var(--primary)) 20%,transparent);overflow:hidden}
.progress i{display:block;height:100%;background:var(--bid-blue)}
.progress.warn i{background:var(--orange-500)}

.callout{border:1px solid hsl(var(--border));border-left:2px solid var(--bid-blue);background:color-mix(in srgb,var(--bid-blue) 5%,transparent);border-radius:var(--radius-md);padding:12px 14px;font-size:12.5px;color:hsl(var(--muted-foreground));line-height:1.6;max-width:1100px}
.callout b{color:hsl(var(--foreground))}
.alert{display:flex;gap:10px;border:1px solid hsl(var(--border));border-radius:var(--radius);padding:11px 13px;font-size:12.5px}
.alert .ico{width:16px;height:16px;margin-top:1px}
.alert.warn{border-color:color-mix(in srgb,var(--orange-500) 45%,transparent);color:var(--orange-500)}
.alert .t{font-weight:600}.alert .d{color:hsl(var(--muted-foreground))}

/* auth */
.authwrap{display:grid;place-items:center;min-height:100vh;padding:22px;background:radial-gradient(520px 260px at 50% -10%,color-mix(in srgb,var(--bid-blue) 10%,transparent),transparent 70%),hsl(var(--background))}
.authcard{width:360px;border:1px solid hsl(var(--border));border-radius:var(--radius);background:hsl(var(--card));box-shadow:var(--shadow-md);padding:26px 24px}
.authcard .mk{display:flex;flex-direction:column;align-items:center;gap:9px;margin-bottom:16px}
.authcard .mk .vmark{width:40px;height:40px;color:hsl(var(--foreground))}.authcard .mk b{font-size:16px;font-weight:500}
.authcard h4{text-align:center;font-size:17px;font-weight:600;margin:0}
.authcard .s{text-align:center;font-size:12.5px;color:hsl(var(--muted-foreground));margin:5px 0 18px}
.fine{font-size:11px;color:hsl(var(--muted-foreground));text-align:center;margin-top:13px;line-height:1.6}.fine a{color:var(--bid-blue)}

/* connections map + chart */
.worldwrap{position:relative;border:1px solid hsl(var(--border));border-radius:var(--radius-md);overflow:hidden;background:radial-gradient(120% 90% at 50% 0%,color-mix(in srgb,var(--bid-blue) 6%,transparent),transparent 60%),hsl(var(--card))}
.worldwrap svg{width:100%;height:auto;display:block}
.worldwrap .land{color:hsl(var(--muted-foreground))}
.mk-city .glow{animation:glowp 2.6s ease-in-out infinite}
@keyframes glowp{50%{opacity:.4}}
.conchart{position:relative;height:140px;border:1px solid hsl(var(--border));border-radius:var(--radius-md);overflow:hidden;background:hsl(var(--card))}
.conchart svg{width:100%;height:100%}
.conaxis{display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:10px;color:hsl(var(--muted-foreground));margin-top:4px}
@media(max-width:1000px){.grid[style*="1.55fr"]{grid-template-columns:1fr !important}}