@import "https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;600&family=Fira+Sans:wght@400;500;600;700&display=swap";
:root{--primary:#0f172a;--secondary:#334155;--accent:#0369a1;--bg:#f8fafc;--surface:#fff;--text:#020617;--muted:#64748b;--soft:#e8ecf1;--border:#e2e8f0;--success:#15803d;--warn:#b45309;--radius:12px;--shadow:0 1px 2px #0f172a0d}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);margin:0;font:16px/1.5 Fira Sans,system-ui,sans-serif}button,input,select{font:inherit}.shell{min-height:100dvh}.skip{z-index:1000;background:var(--primary);color:#fff;border-radius:8px;padding:10px 14px;position:fixed;top:-60px;left:8px}.skip:focus{top:8px}.sidebar{background:var(--primary);color:#cbd5e1;z-index:40;flex-direction:column;width:248px;padding:20px 14px;display:flex;position:fixed;inset:0 auto 0 0}.brand{color:#fff;align-items:center;gap:12px;padding:4px 8px 24px;display:flex}.brandmark{background:#0ea5e9;border-radius:10px;place-items:center;width:36px;height:36px;font-weight:700;display:grid}.brand strong,.brand small{display:block}.brand small{color:#94a3b8;font-size:12px}.sidebar nav{gap:4px;display:grid}.sidebar a{color:#cbd5e1;border-radius:8px;align-items:center;gap:12px;min-height:44px;padding:9px 12px;text-decoration:none;transition:background .2s,color .2s;display:flex}.sidebar a:hover,.sidebar a:focus-visible,.sidebar a.active{color:#fff;background:#1e293b;outline:none}.sidebar svg{width:19px}.sidebar-bottom{margin-top:auto}.health{border:1px solid #334155;border-radius:10px;align-items:flex-start;gap:10px;margin-bottom:10px;padding:12px;display:flex}.health b,.health small{font-size:12px;display:block}.health small{color:#94a3b8}.dot{border-radius:50%;width:8px;height:8px;margin-top:5px;display:inline-block}.good{background:#22c55e}.warn{background:#f59e0b}main{min-width:0;margin-left:248px}header{border-bottom:1px solid var(--border);z-index:20;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#fffffff0;align-items:center;gap:12px;height:64px;padding:0 24px;display:flex;position:sticky;top:0}.search{border:1px solid var(--border);background:var(--bg);border-radius:9px;flex:1;align-items:center;gap:8px;max-width:540px;height:40px;padding:0 12px;display:flex}.search svg{width:18px;color:var(--muted)}.search input{width:100%;color:var(--text);background:0 0;border:0;outline:0}.icon{cursor:pointer;background:0 0;border:0;border-radius:8px;place-items:center;width:44px;height:44px;display:grid}.icon:hover{background:var(--soft)}.icon:focus-visible,.primary:focus-visible,select:focus-visible{outline-offset:2px;outline:3px solid #0369a14d}.avatar{color:#1e40af;background:#dbeafe;border-radius:50%;place-items:center;width:36px;height:36px;font-size:12px;font-weight:700;display:grid}.content{max-width:1600px;margin:auto;padding:28px 24px}.eyebrow{text-transform:uppercase;letter-spacing:.08em;color:var(--accent);align-items:center;gap:7px;font-size:11px;font-weight:700;display:flex}.eyebrow svg{width:15px}.title-row{justify-content:space-between;align-items:end;gap:20px;margin:6px 0 22px;display:flex}.title-row h1{margin:0;font-size:30px;line-height:1.2}.title-row p,.section-title p{color:var(--muted);margin:5px 0 0}.primary{background:var(--accent);color:#fff;cursor:pointer;border:0;border-radius:9px;align-items:center;gap:8px;min-height:44px;padding:0 15px;font-weight:600;display:flex}.primary svg{width:18px}.metrics{grid-template-columns:repeat(4,1fr);gap:12px;display:grid}.metric{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}.metric span,.metric small{color:var(--muted);display:block}.metric span{font-size:13px;font-weight:600}.metric strong{margin:5px 0;font:600 27px/1.3 Fira Code,monospace;display:block}.metric small{font-size:12px}.flow-card{border-radius:var(--radius);background:#eef6ff;border:1px solid #bfdbfe;grid-template-columns:1fr 32px 1fr 32px 1fr 32px 1fr;align-items:center;margin:12px 0 24px;padding:13px 16px;display:grid}.flow-card div{text-align:center}.flow-card span,.flow-card small{display:block}.flow-card span{font-size:13px;font-weight:600}.flow-card small{color:var(--muted);font-size:11px}.flow-card i{background:#93c5fd;height:1px;position:relative}.flow-card i:after{content:"";border-left:5px solid #60a5fa;border-block:3px solid #0000;position:absolute;top:-3px;right:0}.learning{color:#075985}.pipeline-section{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.section-title{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:18px 20px;display:flex}.section-title h2{margin:0;font-size:18px}.section-title p{font-size:13px}.live{align-items:center;gap:7px;font-size:12px;font-weight:600;display:flex}.live .dot{margin:0}.pipeline{background:var(--border);grid-template-columns:repeat(7,minmax(220px,1fr));gap:1px;display:grid;overflow-x:auto}.column{background:#f8fafc;min-height:460px}.column-head{border-bottom:1px solid var(--border);text-transform:uppercase;letter-spacing:.04em;justify-content:space-between;align-items:center;height:48px;padding:0 12px;font-size:12px;font-weight:700;display:flex}.column-head b{background:var(--soft);border-radius:99px;padding:2px 7px}.cards{gap:8px;padding:8px;display:grid}.lead{border:1px solid var(--border);box-shadow:var(--shadow);background:#fff;border-radius:10px;padding:12px}.lead-top{align-items:center;gap:9px;display:flex}.initials{color:#075985;background:#e0f2fe;border-radius:9px;flex:0 0 34px;place-items:center;height:34px;font-size:11px;font-weight:700;display:grid}.lead h3{margin:0;font-size:14px}.lead p{color:var(--muted);margin:2px 0;font-size:11px}.lead dl{border-top:1px solid var(--border);margin:12px 0 10px;padding-top:8px}.lead dl div{justify-content:space-between;gap:8px;margin:4px 0;display:flex}.lead dt,.lead dd{margin:0;font-size:10px}.lead dt{color:var(--muted)}.lead dd{text-align:right;text-overflow:ellipsis;white-space:nowrap;max-width:120px;overflow:hidden}.mono{font-family:Fira Code,monospace}.lead label{color:var(--muted);gap:4px;font-size:10px;display:grid}.lead select{border:1px solid var(--border);height:36px;color:var(--text);cursor:pointer;background:#fff;border-radius:7px;padding:0 8px}.menu,.mobile-close,.scrim{display:none}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (max-width:900px){.sidebar{transition:transform .2s;transform:translate(-100%)}.sidebar.open{transform:translate(0)}.mobile-close{color:#fff;margin-left:auto;display:grid}.scrim{z-index:30;background:#0206178c;border:0;display:block;position:fixed;inset:0}main{margin:0}.menu{display:grid}.metrics{grid-template-columns:repeat(2,1fr)}.flow-card{grid-template-columns:1fr 18px 1fr 18px 1fr 18px 1fr}}@media (max-width:560px){header{padding:0 10px}.content{padding:20px 12px}.title-row{align-items:start}.title-row .primary{display:none}.title-row h1{font-size:25px}.metrics{grid-template-columns:1fr 1fr}.metric{padding:13px}.metric strong{font-size:22px}.flow-card{grid-template-columns:1fr;gap:6px}.flow-card i{width:1px;height:10px;margin:auto}.flow-card i:after{border-top:5px solid #60a5fa;border-inline:3px solid #0000;border-bottom:0;top:auto;bottom:0;right:-3px}.section-title{align-items:start}.section-title p{max-width:270px}.pipeline{grid-template-columns:repeat(7,85vw)}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}.auth-page{background:radial-gradient(circle at 20% 10%,#e0f2fe 0,transparent 32%),var(--bg);place-items:center;min-height:100dvh;padding:24px;display:grid}.auth-card{border:1px solid var(--border);background:#fff;border-radius:16px;width:min(100%,420px);padding:28px;box-shadow:0 20px 50px #0f172a1a}.auth-brand{align-items:center;gap:10px;margin-bottom:30px;display:flex}.auth-brand strong,.auth-brand small{display:block}.auth-brand small{color:var(--muted);font-size:12px}.auth-heading svg{width:24px;color:var(--accent)}.auth-heading h1{margin:10px 0 3px;font-size:26px}.auth-heading p{color:var(--muted);margin:0 0 24px}.auth-card label{gap:6px;margin:14px 0;font-size:13px;font-weight:600;display:grid}.auth-card label input{border:1px solid var(--border);border-radius:9px;outline:0;min-height:46px;padding:0 12px}.auth-card label input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #0369a126}.auth-card label small{color:var(--muted);font-weight:400}.auth-submit{justify-content:center;width:100%;margin-top:18px}.auth-submit:disabled{opacity:.55;cursor:not-allowed}.form-error{color:#b91c1c;background:#fef2f2;border-radius:8px;padding:10px 12px;font-size:13px}.secure-note{text-align:center;color:var(--muted);margin-top:16px;display:block}.loading-card{text-align:center}.loading-card .brandmark{margin:auto}.role-chip{color:#075985;background:#e0f2fe;border-radius:99px;padding:5px 8px;font:600 10px Fira Code,monospace}.team-section{border:1px solid var(--border);border-radius:var(--radius);background:#fff;margin-top:16px;overflow:hidden}.team-grid{grid-template-columns:repeat(4,1fr);gap:12px;padding:16px;display:grid}.team-card{border:1px solid var(--border);border-radius:10px;grid-template-columns:36px 1fr auto;align-items:center;gap:10px;padding:14px;display:grid}.team-card h3,.team-card p{margin:0}.team-card h3{font-size:14px}.team-card p,.team-card small{color:var(--muted);font-size:11px}.team-card small{grid-column:2/-1}.role{border-radius:99px;padding:4px 6px;font:600 9px Fira Code,monospace}.role-admin{color:#6d28d9;background:#ede9fe}.role-buh{color:#075985;background:#e0f2fe}.role-sales_executive{color:#166534;background:#dcfce7}@media (max-width:900px){.team-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:560px){.auth-page{padding:12px}.auth-card{padding:22px}.team-grid{grid-template-columns:1fr}.role-chip{display:none}}
