@import"https://fonts.googleapis.com/css2?family=Red+Hat+Display:wght@500;600;700&family=Atkinson+Hyperlegible:wght@400;400;700&family=DM+Mono:wght@400;500&display=swap";:root{--background: oklch(.97 .005 250);--foreground: oklch(.15 .02 250);--card: oklch(1 0 0);--card-foreground: oklch(.15 .02 250);--popover: oklch(1 0 0);--popover-foreground: oklch(.15 .02 250);--primary: oklch(.72 .19 150);--primary-foreground: oklch(.15 .02 250);--secondary: oklch(.62 .17 250);--secondary-foreground: oklch(1 0 0);--muted: oklch(.93 .01 250);--muted-foreground: oklch(.55 .02 250);--accent: oklch(.82 .19 95);--accent-foreground: oklch(.15 .02 250);--destructive: oklch(.628 .258 29.23);--destructive-foreground: oklch(.98 0 0);--border: oklch(.85 .01 250);--input: oklch(.85 .01 250);--ring: oklch(.72 .25 150);--font-sans: "Atkinson Hyperlegible", system-ui, sans-serif;--font-display: "Red Hat Display", system-ui, sans-serif;--font-mono: "DM Mono", monospace;--radius: .25rem}.dark{--background: oklch(.15 .02 250);--foreground: oklch(.9 .01 250);--card: oklch(.2 .02 250);--card-foreground: oklch(.9 .01 250);--popover: oklch(.2 .02 250);--popover-foreground: oklch(.9 .01 250);--primary: oklch(.72 .19 150);--primary-foreground: oklch(.15 .02 250);--secondary: oklch(.62 .17 250);--secondary-foreground: oklch(1 0 0);--muted: oklch(.2 .02 250);--muted-foreground: oklch(.6 .02 250);--accent: oklch(.82 .19 95);--accent-foreground: oklch(.15 .02 250);--destructive: oklch(.628 .258 29.23);--destructive-foreground: oklch(.98 0 0);--border: oklch(.28 .03 250);--input: oklch(.28 .03 250);--ring: oklch(.72 .25 150)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%}body{font-family:var(--font-sans);background:var(--background);color:var(--foreground);font-size:13px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--muted-foreground)}.app-shell{display:flex;height:100vh;overflow:hidden}.sidebar{width:56px;flex-shrink:0;background:var(--card);border-right:1px solid var(--border);display:flex;flex-direction:column;align-items:center;padding:12px 0;gap:4px;transition:width .2s ease}.sidebar:hover{width:220px}.sidebar:hover .nav-label{opacity:1;max-width:160px}.sidebar-logo{width:32px;height:32px;margin-bottom:16px;flex-shrink:0}.sidebar-spacer{flex:1}.nav-item{display:flex;align-items:center;gap:12px;width:calc(100% - 8px);padding:10px 14px;margin:0 4px;border-radius:var(--radius);cursor:pointer;color:var(--muted-foreground);border:none;background:transparent;font-family:var(--font-sans);font-size:13px;transition:background .15s,color .15s;white-space:nowrap;overflow:hidden}.nav-item:hover{background:var(--muted);color:var(--foreground)}.nav-item.active{background:var(--muted);color:var(--primary)}.nav-item svg{width:20px;height:20px;flex-shrink:0}.nav-label{opacity:0;max-width:0;overflow:hidden;transition:opacity .2s,max-width .2s;white-space:nowrap}.main-content{flex:1;overflow-y:auto;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid var(--border);background:var(--background);position:sticky;top:0;z-index:10}.topbar-left{display:flex;flex-direction:column;gap:2px}.topbar-title{font-family:var(--font-display);font-size:20px;font-weight:600;letter-spacing:-.01em}.topbar-subtitle{font-family:var(--font-mono);font-size:11px;color:var(--muted-foreground)}.topbar-actions{display:flex;gap:8px;align-items:center}.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:var(--radius);font-family:var(--font-sans);font-size:12.5px;font-weight:500;cursor:pointer;border:1px solid var(--border);background:var(--card);color:var(--foreground);transition:background .15s,border-color .15s}.btn:hover{background:var(--muted)}.btn-primary{background:var(--primary);color:var(--primary-foreground);border-color:var(--primary)}.btn-primary:hover{background:color-mix(in oklch,var(--primary),white 12%)}.btn svg{width:14px;height:14px}.dashboard-body{padding:20px 24px;display:flex;flex-direction:column;gap:20px}.metric-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.metric-card{background:var(--card);border:1px solid var(--border);border-radius:8px;padding:18px 20px;position:relative;overflow:hidden;display:flex;flex-direction:column;gap:8px}.metric-header{display:flex;align-items:center;justify-content:space-between}.metric-label{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-foreground);font-weight:500}.metric-icon{width:28px;height:28px;border-radius:6px;display:flex;align-items:center;justify-content:center;background:var(--muted)}.metric-icon svg{width:16px;height:16px}.metric-value{font-family:var(--font-display);font-size:32px;font-weight:700;line-height:1.1;letter-spacing:-.02em}.metric-delta{font-family:var(--font-mono);font-size:11px;display:flex;align-items:center;gap:4px}.metric-delta.up{color:var(--primary)}.metric-delta.down{color:var(--destructive)}.metric-arc{position:absolute;bottom:0;left:0;width:100%;height:4px;background:var(--muted)}.metric-arc-fill{height:100%;border-radius:0 4px 4px 0;transition:width .8s cubic-bezier(.22,1,.36,1)}.chart-row{display:grid;grid-template-columns:38fr 62fr;gap:16px}.chart-card{background:var(--card);border:1px solid var(--border);border-radius:8px;padding:18px 20px;display:flex;flex-direction:column}.chart-title{font-family:var(--font-display);font-size:14px;font-weight:600;margin-bottom:4px}.chart-subtitle{font-size:11px;color:var(--muted-foreground);margin-bottom:16px}.chart-body{flex:1;position:relative}.donut-container{display:flex;align-items:center;gap:24px}.donut-legend{display:flex;flex-direction:column;gap:10px;flex:1}.legend-item{display:flex;align-items:center;gap:8px;font-size:12px}.legend-dot{width:10px;height:10px;border-radius:3px;flex-shrink:0}.legend-label{flex:1;color:var(--muted-foreground)}.legend-value{font-family:var(--font-mono);font-weight:500}.hbar-list{display:flex;flex-direction:column;gap:12px}.hbar-item{display:flex;flex-direction:column;gap:4px}.hbar-row{display:flex;align-items:center;justify-content:space-between;font-size:12px}.hbar-label{color:var(--muted-foreground)}.hbar-value{font-family:var(--font-mono);font-weight:500}.hbar-track{height:8px;background:var(--muted);border-radius:4px;overflow:hidden}.hbar-fill{height:100%;border-radius:4px;transition:width .8s cubic-bezier(.22,1,.36,1)}.csat-chart{width:100%}.table-card{background:var(--card);border:1px solid var(--border);border-radius:8px;overflow:hidden}.table-toolbar{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--border);flex-wrap:wrap}.search-input{flex:1;min-width:200px;position:relative}.search-input input{width:100%;padding:8px 12px 8px 34px;border-radius:var(--radius);border:1px solid var(--input);background:var(--background);color:var(--foreground);font-family:var(--font-sans);font-size:12.5px;outline:none;transition:border-color .15s}.search-input input:focus{border-color:var(--primary)}.search-input svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--muted-foreground)}.filter-group{display:flex;gap:8px}.select-wrap{position:relative}.select-wrap select{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:8px 28px 8px 12px;border-radius:var(--radius);border:1px solid var(--input);background:var(--background);color:var(--foreground);font-family:var(--font-sans);font-size:12.5px;cursor:pointer;outline:none;transition:border-color .15s}.select-wrap select:focus{border-color:var(--primary)}.select-wrap:after{content:"";position:absolute;right:10px;top:50%;transform:translateY(-50%);width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid var(--muted-foreground);pointer-events:none}.filter-chips{display:flex;gap:6px;flex-wrap:wrap;padding:0 20px 12px}.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:20px;font-size:11px;font-weight:500;background:var(--muted);color:var(--muted-foreground);cursor:pointer;border:1px solid transparent;transition:all .15s}.chip:hover{border-color:var(--border)}.chip.active{background:color-mix(in oklch,var(--primary),transparent 85%);color:var(--primary);border-color:color-mix(in oklch,var(--primary),transparent 60%)}.table-wrap{overflow-x:auto;max-height:480px;overflow-y:auto}table{width:100%;border-collapse:collapse;font-size:12.5px}thead{position:sticky;top:0;z-index:1;background:var(--card)}th{text-align:left;padding:10px 16px;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted-foreground);font-weight:500;border-bottom:1px solid var(--border);white-space:nowrap}td{padding:12px 16px;border-bottom:1px solid var(--border);white-space:nowrap}tr:hover td{background:var(--muted)}tr:last-child td{border-bottom:none}.ticket-id{font-family:var(--font-mono);font-size:11.5px;color:var(--secondary);font-weight:500}.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:4px;font-size:11px;font-weight:500}.badge-dot{width:6px;height:6px;border-radius:50%}.badge-open{background:color-mix(in oklch,var(--secondary),transparent 85%);color:var(--secondary)}.badge-in-progress{background:color-mix(in oklch,var(--accent),transparent 80%);color:var(--accent-foreground)}.badge-resolved{background:color-mix(in oklch,var(--primary),transparent 85%);color:var(--primary)}.badge-escalated{background:color-mix(in oklch,var(--destructive),transparent 85%);color:var(--destructive)}.badge-open .badge-dot{background:var(--secondary)}.badge-in-progress .badge-dot{background:var(--accent)}.badge-resolved .badge-dot{background:var(--primary)}.badge-escalated .badge-dot{background:var(--destructive)}.priority-high{color:var(--destructive);font-weight:600}.priority-medium{color:var(--accent);font-weight:500}.priority-low{color:var(--muted-foreground)}.csat-stars{display:inline-flex;gap:1px}.csat-stars svg{width:12px;height:12px}.sla-ok{color:var(--primary);font-family:var(--font-mono);font-size:11.5px}.sla-breach{color:var(--destructive);font-family:var(--font-mono);font-size:11.5px}.sla-warning{color:var(--accent);font-family:var(--font-mono);font-size:11.5px}.empty-state{padding:48px 20px;text-align:center;color:var(--muted-foreground);font-size:13px}.table-footer{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;border-top:1px solid var(--border);font-size:12px;color:var(--muted-foreground)}@media (max-width: 1024px){.metric-row{grid-template-columns:repeat(2,1fr)}.chart-row{grid-template-columns:1fr}}@media (max-width: 640px){.metric-row{grid-template-columns:1fr}.sidebar{display:none}.dashboard-body{padding:12px}.topbar{padding:12px 16px}}@keyframes pulse-arc{0%{opacity:.4}50%{opacity:1}to{opacity:1}}.metric-arc-fill{animation:pulse-arc .6s ease-out}@keyframes fade-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.dashboard-body>*{animation:fade-in .4s ease-out}