@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@500;600&family=Syne:wght@600;700;800&display=swap";
:root{--primary:#7c3aed;--secondary:#22d3ee;--bg:#080b18;--surface:#11162a;--text:#f8fafc;--muted:#94a3b8;--border:#27304a;--display:"Syne", Inter, system-ui, sans-serif;--body:"Inter", Inter, system-ui, sans-serif;--data:"JetBrains Mono", monospace;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--bg);min-height:100%;color:var(--text);font-family:var(--body);margin:0}body{background:radial-gradient(circle at 80% -10%, #211446 0, transparent 32%), var(--bg)}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}.app-shell{grid-template-columns:240px minmax(0,1fr);min-height:100vh;display:grid}.sidebar{background:color-mix(in srgb, var(--surface) 96%, var(--primary));border-right:1px solid var(--border);z-index:30;flex-direction:column;height:100vh;padding:22px 16px;display:flex;position:sticky;top:0}.brand{align-items:center;gap:12px;padding:0 8px 24px;display:flex}.brand-mark{background:var(--primary);color:#fff;width:42px;height:42px;font:800 20px var(--display);border-radius:13px;place-items:center;display:grid;box-shadow:0 10px 24px #7c3aed47}.brand strong,.brand small,.sidebar-foot strong,.sidebar-foot small{display:block}.brand strong{font:800 15px var(--display)}.brand small,.sidebar-foot small{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;max-width:155px;margin-top:3px;font-size:10px;overflow:hidden}.sidebar nav{gap:5px;display:grid}.nav-item{color:var(--muted);text-align:left;background:0 0;border:0;border-radius:10px;align-items:center;gap:11px;padding:11px 12px;font-weight:650;display:flex}.nav-item:hover{color:var(--text);background:#7c3aed12}.nav-item.active{color:var(--text);box-shadow:inset 3px 0 var(--primary);background:#7c3aed22}.nav-item svg{width:18px;height:18px}.sidebar-foot{border-top:1px solid var(--border);align-items:center;gap:10px;margin-top:auto;padding:16px 8px 2px;display:flex}.avatar{color:#c4b5fd;background:#7c3aed2e;border-radius:50%;place-items:center;width:34px;height:34px;font-weight:800;display:grid}.sidebar-foot strong{font-size:12px}.main-content{min-width:0}.topbar{border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:20;background:#11162ae8;justify-content:space-between;align-items:center;height:66px;padding:0 30px;display:flex;position:sticky;top:0}.breadcrumb{color:var(--muted);font-size:12px}.breadcrumb b{color:var(--text)}.status-dot{color:var(--muted);align-items:center;gap:7px;font-size:11px;display:flex}.status-dot i{background:#10b981;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 4px #10b98122}.menu-button{color:var(--text);background:0 0;border:0;font-size:22px;display:none}.page-content{max-width:1500px;margin:0 auto;padding:34px}.page-hero{justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:24px;display:flex}.eyebrow{color:var(--secondary);text-transform:uppercase;letter-spacing:.12em;font-size:10px;font-weight:850}.page-hero h1{font:800 clamp(26px, 3vw, 38px) var(--display);letter-spacing:-.04em;margin:7px 0 6px}.page-hero p{color:var(--muted);max-width:760px;margin:0;font-size:13px;line-height:1.6}.primary-button{background:var(--primary);color:#fff;border:0;border-radius:10px;padding:12px 16px;font-weight:800;box-shadow:0 10px 25px #7c3aed40}.primary-button:disabled{cursor:wait;opacity:.65}.secondary-button{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:10px;padding:11px 15px;font-weight:700}.filter-bar{flex-wrap:wrap;justify-content:flex-end;gap:12px;margin-bottom:18px;display:flex}.filter-bar label{color:var(--muted);align-items:center;gap:8px;font-size:11px;font-weight:700;display:flex}.filter-bar select,.field input,.field select{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:9px;padding:9px 30px 9px 10px}.panel{background:var(--surface);border:1px solid var(--border);border-radius:15px;box-shadow:0 8px 28px #f8fafc0d}.metrics-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px;display:grid}.metric-card{min-height:145px;padding:19px}.metric-top{justify-content:space-between;align-items:center;display:flex}.metric-icon{color:#c4b5fd;background:#7c3aed25;border-radius:10px;place-items:center;width:34px;height:34px;display:grid}.metric-label{color:var(--muted);margin:17px 0 7px;font-size:12px}.metric-value{font:800 25px var(--display);letter-spacing:-.03em}.metric-change{color:#34d399;margin-top:8px;font-size:11px}.tone-warning .metric-icon{color:#fbbf24;background:#f59e0b1c}.tone-warning .metric-change{color:#fbbf24}.tone-positive .metric-icon{color:#22d3ee;background:#22d3ee1c}.section-grid{grid-template-columns:1.25fr .95fr;gap:18px;margin-top:18px;display:grid}.panel-heading{padding:20px 20px 0}.panel-heading h2{font:700 17px var(--display);margin:0}.panel-heading p{color:var(--muted);margin:7px 0 18px;font-size:12px;line-height:1.5}.chart{align-items:flex-end;gap:10px;height:220px;padding:12px 20px 20px;display:flex}.bar{background:linear-gradient(180deg, var(--secondary), var(--primary));border-radius:6px 6px 2px 2px;flex:1;min-width:20px;position:relative}.bar small{color:var(--muted);font-size:10px;position:absolute;top:calc(100% + 8px);left:50%;transform:translate(-50%)}.table-wrap{overflow-x:auto}.data-table{border-collapse:collapse;width:100%;font-size:12px}.data-table th,.data-table td{text-align:left;border-top:1px solid var(--border);white-space:nowrap;padding:14px 20px}.data-table th{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:10px}.data-table td{color:#dbe4f0}.data-table td:first-child{color:var(--text);font-weight:700}.list{gap:10px;padding:0 20px 20px;display:grid}.list-item{border:1px solid var(--border);background:#080b1838;border-radius:11px;padding:14px}.list-item strong{font-size:13px;display:block}.list-item p{color:var(--muted);margin:6px 0;font-size:11px;line-height:1.5}.pill{color:#c4b5fd;background:#7c3aed25;border-radius:999px;align-items:center;padding:4px 8px;font-size:10px;font-weight:800;display:inline-flex}.pill.success{color:#6ee7b7;background:#10b98120}.pill.warning{color:#fbbf24;background:#f59e0b20}.page-stack{gap:18px;display:grid}.empty-state,.error-state,.loading-state{text-align:center;color:var(--muted);padding:48px 24px}.empty-state h3,.error-state h3{color:var(--text);font-family:var(--display);margin:12px 0 6px}.skeleton{background:linear-gradient(90deg,#1b2440,#27304a,#1b2440) 0 0/200% 100%;border-radius:6px;height:16px;animation:1.2s infinite shimmer}@keyframes shimmer{to{background-position:-200% 0}}.form-grid{grid-template-columns:repeat(2,1fr);gap:16px;padding:20px;display:grid}.upload{text-align:center;color:var(--muted);background:#7c3aed0b;border:1px dashed #7c3aed80;border-radius:12px;padding:35px}button,.primary-button,.secondary-button{justify-content:center;align-items:center;gap:8px;display:inline-flex}.three{grid-template-columns:repeat(3,minmax(0,1fr))}.section-panel{margin-top:18px}.status-badge{border-radius:999px;align-items:center;gap:5px;padding:5px 9px;font-size:11px;font-weight:700;display:inline-flex}.status-badge.positive{color:#34d399;background:#10b9811c}.status-badge.warning{color:#fbbf24;background:#f59e0b1c}.state-message{text-align:center;margin-top:20px;padding:28px}.state-message p,.form-message{color:var(--muted);font-size:13px}.form-panel,.settings-form{gap:18px;padding:24px;display:grid}.field,.login-form label{color:var(--muted);gap:7px;font-size:12px;font-weight:700;display:grid}.field input,.field select,.login-form input{border:1px solid var(--border);width:100%;color:var(--text);background:#080b1838;border-radius:9px;padding:12px}.upload-box{border:1px dashed var(--secondary);color:var(--secondary);background:#22d3ee08;border-radius:14px;place-items:center;gap:10px;padding:30px;display:grid}.upload-box label{color:var(--text);font-weight:800}.upload-box input{max-width:260px}.preview-grid,.result-cards{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.preview-grid span,.result-cards div{border:1px solid var(--border);color:var(--muted);border-radius:10px;padding:14px;font-size:12px}.preview-grid b{color:#34d399;margin-top:7px;display:block}.result-cards{grid-template-columns:repeat(3,1fr)}.result-cards strong,.result-cards small{display:block}.result-cards strong{font:800 24px var(--display);color:var(--text)}.result-cards small{color:var(--muted);margin-top:5px}.recommendation{gap:9px;display:grid}.recommendation p{margin:0}.recommendation .secondary-button{justify-self:start}.login-page{background:radial-gradient(circle at 50% 0,#211446 0,transparent 45%),var(--bg);place-items:center;min-height:100vh;padding:24px;display:grid}.login-card{background:var(--surface);border:1px solid var(--border);border-radius:20px;width:min(460px,100%);padding:36px;box-shadow:0 20px 80px #0008}.login-card h1{font:800 32px var(--display);margin:24px 0 8px}.login-card>p{color:var(--muted);font-size:13px;line-height:1.6}.login-form{gap:16px;margin-top:26px;display:grid}.login-form a{color:var(--secondary);text-align:center;font-size:12px}.error-message{color:#fca5a5;background:#ef44441a;border-radius:8px;padding:10px;font-size:12px}.security-note{border-top:1px solid var(--border);color:var(--secondary);align-items:center;gap:10px;margin-top:28px;padding-top:20px;display:flex}.security-note b,.security-note small{display:block}.security-note b{color:var(--text);font-size:12px}.security-note small{color:var(--muted);margin-top:4px;font-size:11px}.mobile-menu{display:none}@media (max-width:900px){.app-shell{display:block}.sidebar{transition:left .2s;position:fixed;left:-260px}.sidebar-open{left:0}.mobile-menu{display:inline-flex}.topbar{padding:0 18px}.page-content{padding:24px 18px}.metrics-grid,.three{grid-template-columns:repeat(2,1fr)}.section-grid{grid-template-columns:1fr}.preview-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:560px){.metrics-grid,.three,.result-cards,.preview-grid{grid-template-columns:1fr}.page-hero{display:block}.page-hero .primary-button,.page-hero .secondary-button{margin-top:18px}.status-dot{display:none}}
