@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";.app-shell{display:flex;height:100vh;overflow:hidden;background:var(--surface-bg)}.sidebar{width:220px;flex-shrink:0;background:var(--surface-sidebar);border-right:1px solid var(--surface-border);display:flex;flex-direction:column;padding:0;overflow-y:auto}.sidebar-logo{display:flex;align-items:center;gap:10px;padding:20px 18px 16px;border-bottom:1px solid var(--surface-border)}.sidebar-logo-icon{width:32px;height:32px;background:var(--brand-500);border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;font-weight:700;flex-shrink:0}.sidebar-logo-text{font-size:14px;font-weight:700;color:var(--text-primary);line-height:1.2}.sidebar-logo-sub{font-size:11px;color:var(--text-muted);font-weight:400}.sidebar-nav{flex:1;padding:12px 8px;display:flex;flex-direction:column;gap:2px}.sidebar-label{font-size:11px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;padding:10px 10px 4px}.nav-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--radius-sm);font-size:14px;font-weight:500;color:var(--text-secondary);transition:background var(--transition),color var(--transition);cursor:pointer;border:none;background:transparent;width:100%;text-align:left}.nav-item:hover{background:var(--surface-hover);color:var(--text-primary)}.nav-item.active{background:#5865f21a;color:var(--brand-500);font-weight:600}.nav-item svg{width:17px;height:17px;opacity:.8;flex-shrink:0}.sidebar-footer{border-top:1px solid var(--surface-border);padding:12px 8px}.user-chip{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--radius-sm);width:100%}.user-chip img{width:30px;height:30px;border-radius:50%;object-fit:cover;flex-shrink:0}.user-chip-info{flex:1;min-width:0}.user-chip-name{font-size:13px;font-weight:600;color:var(--text-primary);truncate:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-chip-role{font-size:11px;color:var(--text-muted);text-transform:capitalize}.main-content{flex:1;overflow-y:auto;display:flex;flex-direction:column}.topbar{height:56px;flex-shrink:0;background:var(--surface-card);border-bottom:1px solid var(--surface-border);display:flex;align-items:center;padding:0 24px;gap:12px}.topbar-title{font-size:16px;font-weight:600;color:var(--text-primary);flex:1}.page-content{flex:1;padding:24px;overflow-y:auto}.search-wrap{position:relative;display:flex;align-items:center}.search-input{background:var(--surface-input);border:1px solid var(--surface-border);border-radius:8px;color:var(--text-primary);font-family:inherit;font-size:13px;padding:7px 12px 7px 34px;width:240px;transition:border-color var(--transition)}.search-input:focus{outline:none;border-color:var(--brand-500)}.search-icon{position:absolute;left:10px;color:var(--text-muted);width:15px;height:15px}@media(max-width:768px){.sidebar{display:none}.page-content{padding:16px}}:root{--brand-500: #5865F2;--brand-600: #4752c4;--brand-700: #3c45a5;--surface-bg: #F8F9FB;--surface-card: #FFFFFF;--surface-sidebar: #FFFFFF;--surface-input: #F3F4F6;--surface-hover: #F0F1F5;--surface-border: #E5E7EB;--text-primary: #111827;--text-secondary: #6B7280;--text-muted: #9CA3AF;--text-inverse: #FFFFFF;--status-open: #10B981;--status-open-bg: #D1FAE5;--status-pending: #F59E0B;--status-pending-bg: #FEF3C7;--status-closed: #6B7280;--status-closed-bg: #F3F4F6;--priority-low: #6B7280;--priority-low-bg: #F3F4F6;--priority-medium: #3B82F6;--priority-medium-bg: #EFF6FF;--priority-high: #F59E0B;--priority-high-bg: #FEF3C7;--priority-urgent: #EF4444;--priority-urgent-bg: #FEE2E2;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .06);--shadow-md: 0 4px 6px rgba(0, 0, 0, .07), 0 2px 4px rgba(0, 0, 0, .05);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .08), 0 4px 6px rgba(0, 0, 0, .04);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-xl: 20px;--transition: .15s ease}[data-theme=dark]{--surface-bg: #0F1117;--surface-card: #1A1D27;--surface-sidebar: #13151f;--surface-input: #22273a;--surface-hover: #1e2235;--surface-border: #2a2f47;--text-primary: #F9FAFB;--text-secondary: #9CA3AF;--text-muted: #6B7280;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);--shadow-md: 0 4px 6px rgba(0, 0, 0, .4), 0 2px 4px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .5), 0 4px 6px rgba(0, 0, 0, .3)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth}body{font-family:Inter,system-ui,sans-serif;background:var(--surface-bg);color:var(--text-primary);line-height:1.6;-webkit-font-smoothing:antialiased;transition:background var(--transition),color var(--transition)}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}button{cursor:pointer;font-family:inherit}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--surface-border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.btn{display:inline-flex;align-items:center;gap:8px;padding:9px 18px;border-radius:var(--radius-sm);font-size:14px;font-weight:500;border:none;transition:background var(--transition),opacity var(--transition),transform var(--transition);white-space:nowrap}.btn:active{transform:scale(.97)}.btn-primary{background:var(--brand-500);color:#fff}.btn-primary:hover{background:var(--brand-600)}.btn-secondary{background:var(--surface-input);color:var(--text-primary);border:1px solid var(--surface-border)}.btn-secondary:hover{background:var(--surface-hover)}.btn-ghost{background:transparent;color:var(--text-secondary)}.btn-ghost:hover{background:var(--surface-hover);color:var(--text-primary)}.btn-danger{background:#fee2e2;color:#dc2626}.btn-danger:hover{background:#fecaca}.btn-sm{padding:6px 12px;font-size:13px}.btn-full{width:100%;justify-content:center}.btn:disabled{opacity:.5;pointer-events:none}.form-group{display:flex;flex-direction:column;gap:6px}.form-label{font-size:13px;font-weight:500;color:var(--text-secondary)}.form-input,.form-select,.form-textarea{background:var(--surface-input);border:1px solid var(--surface-border);border-radius:var(--radius-sm);color:var(--text-primary);font-family:inherit;font-size:14px;padding:9px 12px;transition:border-color var(--transition),box-shadow var(--transition);width:100%}.form-input:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:var(--brand-500);box-shadow:0 0 0 3px #5865f226}.form-textarea{resize:vertical;min-height:120px}.form-select{appearance:none;cursor:pointer}.form-hint{font-size:12px;color:var(--text-muted)}.form-error{font-size:12px;color:#ef4444}.card{background:var(--surface-card);border:1px solid var(--surface-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm)}.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:20px;font-size:12px;font-weight:500;white-space:nowrap}.badge-open{background:var(--status-open-bg);color:var(--status-open)}.badge-pending{background:var(--status-pending-bg);color:var(--status-pending)}.badge-closed{background:var(--status-closed-bg);color:var(--status-closed)}.badge-low{background:var(--priority-low-bg);color:var(--priority-low)}.badge-medium{background:var(--priority-medium-bg);color:var(--priority-medium)}.badge-high{background:var(--priority-high-bg);color:var(--priority-high)}.badge-urgent{background:var(--priority-urgent-bg);color:var(--priority-urgent)}.badge-internal{background:#ede9fe;color:#7c3aed}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton{background:linear-gradient(90deg,var(--surface-input) 25%,var(--surface-hover) 50%,var(--surface-input) 75%);background-size:200% 100%;animation:shimmer 1.4s infinite;border-radius:var(--radius-sm)}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .2s ease forwards}.divider{border:none;border-top:1px solid var(--surface-border);margin:16px 0}.msg-img-preview{max-width:100%;max-height:320px;border-radius:var(--radius-md);margin-top:8px;display:block;cursor:pointer;transition:transform var(--transition),box-shadow var(--transition);border:1px solid var(--surface-border);object-fit:contain;background:var(--surface-bg)}.msg-img-preview:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}