:root{--color-bg: #0f172a;--color-bg-card: #1e293b;--color-bg-hover: #334155;--color-text: #f8fafc;--color-text-muted: #94a3b8;--color-border: #334155;--color-primary: #3b82f6;--color-primary-hover: #2563eb;--color-green: #22c55e;--color-green-bg: rgba(34, 197, 94, .15);--color-yellow: #eab308;--color-yellow-bg: rgba(234, 179, 8, .15);--color-red: #ef4444;--color-red-bg: rgba(239, 68, 68, .15);--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background:var(--color-bg);color:var(--color-text);line-height:1.6;min-height:100vh}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.3}h1{font-size:1.875rem}h2{font-size:1.5rem}h3{font-size:1.25rem}a{color:var(--color-primary);text-decoration:none;transition:color .2s}a:hover{color:var(--color-primary-hover);text-decoration:underline}.container{max-width:1200px;margin:0 auto;padding:var(--space-lg)}.card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-lg)}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-md)}.nav{background:var(--color-bg-card);border-bottom:1px solid var(--color-border);padding:var(--space-md) var(--space-lg);position:sticky;top:0;z-index:100}.nav-content{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center}.nav-brand{font-size:1.25rem;font-weight:700;color:var(--color-text);display:flex;align-items:center;gap:var(--space-sm)}.nav-links{display:flex;gap:var(--space-lg);list-style:none}.nav-links a{color:var(--color-text-muted);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);transition:all .2s}.nav-links a:hover,.nav-links a.active{color:var(--color-text);background:var(--color-bg-hover);text-decoration:none}.nav-user{display:flex;align-items:center;gap:var(--space-md)}.nav-user .role{background:var(--color-primary);color:#fff;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);font-size:.75rem;font-weight:600;text-transform:uppercase}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border:none;border-radius:var(--radius-md);font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover{background:var(--color-primary-hover)}.btn-ghost{background:transparent;color:var(--color-text-muted);border:1px solid var(--color-border)}.btn-ghost:hover{background:var(--color-bg-hover);color:var(--color-text)}.btn:disabled{opacity:.5;cursor:not-allowed}input,select,textarea{width:100%;padding:var(--space-sm) var(--space-md);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);font-size:.875rem;transition:border-color .2s}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--color-primary)}input::placeholder{color:var(--color-text-muted)}label{display:block;font-size:.875rem;color:var(--color-text-muted);margin-bottom:var(--space-xs)}.table-wrapper{overflow-x:auto;border-radius:var(--radius-lg);border:1px solid var(--color-border)}table{width:100%;border-collapse:collapse}thead{background:var(--color-bg-card)}th{text-align:left;padding:var(--space-md);font-size:.75rem;font-weight:600;text-transform:uppercase;color:var(--color-text-muted);border-bottom:1px solid var(--color-border)}td{padding:var(--space-md);border-bottom:1px solid var(--color-border)}tbody tr:hover{background:var(--color-bg-hover)}tbody tr:last-child td{border-bottom:none}.badge{display:inline-flex;align-items:center;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);font-size:.75rem;font-weight:600}.badge-green{background:var(--color-green-bg);color:var(--color-green)}.badge-yellow{background:var(--color-yellow-bg);color:var(--color-yellow)}.badge-red{background:var(--color-red-bg);color:var(--color-red)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-md);margin-bottom:var(--space-xl)}.stat-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-lg);text-align:center}.stat-value{font-size:2.5rem;font-weight:700;line-height:1;margin-bottom:var(--space-xs)}.stat-label{color:var(--color-text-muted);font-size:.875rem}.stat-value.green{color:var(--color-green)}.stat-value.yellow{color:var(--color-yellow)}.stat-value.red{color:var(--color-red)}.chat-container{display:flex;height:calc(100vh - 60px)}.chat-sidebar{width:280px;background:var(--color-bg-card);border-right:1px solid var(--color-border);padding:var(--space-lg);display:flex;flex-direction:column}.chat-main{flex:1;display:flex;flex-direction:column}.chat-messages{flex:1;overflow-y:auto;padding:var(--space-lg);display:flex;flex-direction:column;gap:var(--space-md)}.chat-message{max-width:80%;padding:var(--space-md);border-radius:var(--radius-lg)}.chat-message.user{align-self:flex-end;background:var(--color-primary);color:#fff}.chat-message.assistant{align-self:flex-start;background:var(--color-bg-card);border:1px solid var(--color-border)}.chat-input-area{padding:var(--space-lg);background:var(--color-bg-card);border-top:1px solid var(--color-border)}.chat-input-form{display:flex;gap:var(--space-md)}.chat-input-form input{flex:1}.text-muted{color:var(--color-text-muted)}.text-sm{font-size:.875rem}.text-xs{font-size:.75rem}.font-mono{font-family:var(--font-mono)}.font-bold{font-weight:600}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-sm{gap:var(--space-sm)}.gap-md{gap:var(--space-md)}.mt-md{margin-top:var(--space-md)}.mb-md{margin-bottom:var(--space-md)}.mb-lg{margin-bottom:var(--space-lg)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.loading{display:flex;align-items:center;justify-content:center;gap:var(--space-sm);color:var(--color-text-muted)}.loading:before{content:"";width:1rem;height:1rem;border:2px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
