:root{color:#1f2937;font-synthesis:none;background:#f5f7fb;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}.topbar{background:#fff;border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;gap:24px;min-height:74px;padding:14px max(24px,50vw - 560px);display:flex}.brand{align-items:center;gap:10px;display:flex}.brand>span{color:#fff;background:#2563eb;border-radius:10px;place-items:center;width:38px;height:38px;font-weight:800;display:grid}.brand strong,.brand small{display:block}.brand small{color:#64748b;margin-top:2px;font-size:.75rem}nav{align-items:center;gap:6px;display:flex}.nav-button,.secondary-button{color:#334155;background:#fff;border:1px solid #d9e0ea;border-radius:8px;padding:9px 12px}.nav-button.active{color:#1d4ed8;background:#eff6ff;border-color:#bfdbfe;font-weight:600}.nav-role-tag{color:#fff;text-transform:uppercase;background:#2563eb;border-radius:4px;margin-left:6px;padding:2px 6px;font-size:.68rem;font-weight:700}.topbar-actions{align-items:center;gap:12px;display:flex}.connection-badge{color:#475569;background:#f8fafc;border:1px solid #e2e8f0;border-radius:999px;align-items:center;gap:6px;padding:4px 10px;font-size:.76rem;font-weight:600;display:inline-flex}.status-dot{border-radius:50%;width:8px;height:8px;display:inline-block}.status-dot.connected{background:#16a34a;box-shadow:0 0 0 2px #bbf7d0}.status-dot.connecting{background:#ca8a04;box-shadow:0 0 0 2px #fef08a}.status-dot.offline{background:#dc2626;box-shadow:0 0 0 2px #fecaca}.auth-status{align-items:center;gap:10px;display:flex}.user-name{color:#1e293b;background:#f1f5f9;border:1px solid #e2e8f0;border-radius:6px;padding:6px 10px;font-size:.9rem;font-weight:600}.page-container{max-width:1120px;margin:0 auto;padding:44px 24px 64px}.content-grid{grid-template-columns:minmax(250px,.85fr) minmax(360px,1.15fr);align-items:start;gap:28px;display:grid}.intro-card{padding:26px 8px}.intro-card h2,.card h2,.admin-heading h2{margin:5px 0 10px;font-size:1.65rem}.intro-card p{color:#526176;line-height:1.6}.eyebrow{letter-spacing:.08em;text-transform:uppercase;margin:0;font-size:.78rem;font-weight:700;color:#2563eb!important}.support-note{color:#36506f;background:#eef5ff;border-left:3px solid #2563eb;border-radius:0 8px 8px 0;margin-top:24px;padding:16px;line-height:1.5}.card,.ticket-card,.summary-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 8px 24px #1f29370a}.ticket-form,.login-card{padding:28px}label{color:#334155;gap:7px;font-size:.9rem;font-weight:650;display:grid}input,select,textarea{color:#1e293b;background:#fff;border:1px solid #cbd5e1;border-radius:7px;width:100%;padding:10px 11px;font-weight:400}input:focus,select:focus,textarea:focus{border-color:#60a5fa;outline:3px solid #dbeafe}textarea{resize:vertical;min-height:112px;line-height:1.45}.ticket-form{gap:17px;display:grid}.form-row{grid-template-columns:1fr 1fr;gap:15px;display:grid}.primary-button,.danger-button{border:0;border-radius:7px;padding:10px 15px;font-weight:700}.primary-button{color:#fff;background:#2563eb}.primary-button:hover{background:#1d4ed8}.primary-button:disabled{cursor:not-allowed;opacity:.65}.message{border-radius:7px;margin:0;padding:10px 12px;font-size:.9rem}.success{color:#166534;background:#dcfce7}.error{color:#b42318;background:#fef2f2}.muted{color:#64748b;font-size:.9rem}.admin-section{gap:20px;display:grid}.admin-heading{justify-content:space-between;align-items:center;gap:20px;display:flex}.user-badge-group{align-items:center;gap:10px;display:flex}.user-role-badge{color:#1e40af;background:#eff6ff;border:1px solid #bfdbfe;border-radius:6px;padding:6px 12px;font-size:.85rem}.summary-grid{grid-template-columns:repeat(4,1fr);gap:12px;display:grid}.summary-card{padding:17px}.summary-card span{color:#64748b;font-size:.82rem;display:block}.summary-card strong{color:#1e3a8a;margin-top:7px;font-size:1.55rem;display:block}.department-workload{padding:16px 20px}.department-workload h4{color:#475569;margin:0 0 10px;font-size:.92rem}.dept-tags{flex-wrap:wrap;gap:10px;display:flex}.dept-tag{color:#334155;background:#f1f5f9;border:1px solid #e2e8f0;border-radius:6px;padding:5px 10px;font-size:.85rem}.filters{flex-wrap:wrap;align-items:end;gap:14px;padding:16px;display:flex}.filters label{min-width:170px}.ticket-list{gap:14px;display:grid}.ticket-card{grid-template-columns:minmax(0,1fr) 300px;gap:24px;padding:20px;display:grid}.ticket-main h3{margin:12px 0 2px;font-size:1.05rem}.ticket-main p{line-height:1.5}.ticket-meta{flex-wrap:wrap;align-items:center;gap:7px;display:flex}.badge{border-radius:999px;padding:4px 8px;font-size:.72rem;font-weight:700}.badge.high{color:#b42318;background:#fee4e2}.badge.medium{color:#a15c00;background:#fef3c7}.badge.low{color:#17603a;background:#dcfce7}.badge.neutral{color:#475569;background:#e2e8f0}.badge.status-open{color:#1e40af;background:#dbeafe}.badge.status-in_progress{color:#854d0e;background:#fef08a}.badge.status-resolved{color:#166534;background:#bbf7d0}.badge.sla-ok{color:#166534;background:#dcfce7}.badge.sla-warn{color:#854d0e;background:#fef08a}.badge.sla-bad{color:#b42318;background:#fee4e2}.summary-card.alert{background:#fff7f7;border-color:#fecaca}.summary-card.alert strong{color:#b42318}.filters .checkbox-filter{flex-direction:row;align-items:center;gap:8px;min-width:0;font-weight:600;display:flex}.filters .checkbox-filter input{width:auto;margin:0}.ticket-actions{align-content:start;gap:11px;display:grid}.ticket-actions textarea{min-height:68px}.action-row{gap:8px;display:flex}.small{padding:8px 12px}.danger-button{color:#b42318;background:#fff1f0;border:1px solid #fecaca}.empty-state{text-align:center;color:#64748b;background:#fff;border:1px dashed #cbd5e1;border-radius:10px;padding:32px}.text-link{color:#2563eb;text-align:left;background:0 0;border:none;margin-top:8px;padding:0;font-size:.85rem;font-weight:600;text-decoration:underline}.text-link:hover{color:#1d4ed8}.track-section{gap:24px;max-width:800px;margin:0 auto;display:grid}.track-header{text-align:center}.track-header h2{margin:6px 0 8px;font-size:1.8rem}.track-form{gap:12px;padding:20px;display:flex}.track-form input{flex:1;padding:12px 14px;font-size:1rem}.track-result{gap:20px;padding:24px;display:grid}.result-header{border-bottom:1px solid #e2e8f0;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:16px;display:flex}.result-header h3{margin:6px 0 4px;font-size:1.25rem}.timeline-section h4{color:#334155;margin:0 0 14px;font-size:1.05rem}.timeline{border-left:2px solid #e2e8f0;gap:16px;margin-left:8px;padding-left:18px;display:grid;position:relative}.timeline-item{position:relative}.timeline-marker{background:#2563eb;border:2px solid #fff;border-radius:50%;width:12px;height:12px;position:absolute;top:3px;left:-25px;box-shadow:0 0 0 2px #bfdbfe}.timeline-content{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:10px 14px}.timeline-title{justify-content:space-between;align-items:center;gap:10px;margin-bottom:4px;display:flex}.timeline-note{color:#1e293b;background:#fff;border-left:2px solid #3b82f6;border-radius:4px;margin:6px 0 0;padding:6px 10px;font-size:.88rem}.highlight-status{color:#1d4ed8;font-weight:700}.modal-overlay{z-index:50;background:#0f172a80;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal-content{background:#fff;border-radius:12px;width:min(100%,580px);max-height:85vh;padding:24px;overflow-y:auto;box-shadow:0 20px 25px -5px #0000001a}.login-modal{width:min(100%,420px)}.modal-header{border-bottom:1px solid #e2e8f0;justify-content:space-between;align-items:center;padding-bottom:12px;display:flex}.modal-header h3{margin:0;font-size:1.2rem}.close-btn{color:#64748b;cursor:pointer;background:0 0;border:none;padding:0 4px;font-size:1.5rem;line-height:1}.close-btn:hover{color:#0f172a}.demo-roles{gap:8px;margin-bottom:14px;display:flex}.role-tab{color:#475569;background:#f8fafc;border:1px solid #d9e0ea;border-radius:6px;flex:1;padding:8px;font-size:.82rem;font-weight:600}.role-tab.active{color:#1d4ed8;background:#eff6ff;border-color:#93c5fd}@media (width<=850px){.content-grid,.ticket-card{grid-template-columns:1fr}.summary-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=620px){.topbar{flex-direction:column;align-items:flex-start}nav{width:100%}.nav-button{flex:1}.page-container{padding:28px 16px 48px}.form-row,.summary-grid{grid-template-columns:1fr}.filters,.admin-heading{flex-direction:column;align-items:stretch}.filters label{min-width:0}.track-form{flex-direction:column}}
