.login-container{display:flex;align-items:center;justify-content:center;height:100vh}.login-form{background:var(--surface-raised);border:1px solid var(--border);border-radius:16px;padding:40px 36px;width:100%;max-width:400px;display:flex;flex-direction:column;gap:16px;box-shadow:0 0 60px #cf49950f,0 24px 48px #000000b3}.login-logo{display:flex;justify-content:center;margin-bottom:8px}.login-logo img{height:64px;width:64px;object-fit:contain;animation:float 3.5s ease-in-out infinite}.login-form h1{font-family:var(--font-heading);font-size:1.6rem;font-weight:700;text-align:center;color:var(--brand);animation:fadeIn .3s ease-out both;animation-delay:75ms}.login-form h1 span{color:var(--text-primary);font-weight:400;font-size:.85rem;display:block;margin-top:4px;color:var(--text-faint)}.login-form input{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:12px 16px;color:var(--text-primary);font-family:var(--font-body);font-size:.9rem;outline:none;transition:border-color .2s,box-shadow .2s;animation:slideInUp .25s ease-out both}.login-form input:nth-child(3){animation-delay:.15s}.login-form input:nth-child(4){animation-delay:225ms}.login-form input:focus{border-color:var(--brand);box-shadow:0 0 0 2px #cf499533}.login-form input::placeholder{color:var(--text-faint)}.login-form button{background:linear-gradient(135deg,#cf4995,#a8326f);border:none;border-radius:9999px;padding:12px;color:#fff;font-family:var(--font-body);font-size:.9rem;font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,opacity .2s ease;box-shadow:0 2px 14px #cf499559;animation:slideInUp .25s ease-out both;animation-delay:.3s}.login-form button:hover{transform:translateY(-1px);box-shadow:0 6px 28px #cf49958c}.login-form button:active{transform:translateY(0)}.login-form button:disabled{opacity:.5;cursor:not-allowed}.login-error{background:#ef444426;border:1px solid rgba(239,68,68,.3);border-radius:12px;padding:10px 14px;color:#f87171;font-size:.85rem;text-align:center}.popup-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;align-items:center;justify-content:center;cursor:pointer;animation:strobeBackground .15s linear infinite}@keyframes strobeBackground{0%{background:#cf4995f2}25%{background:#000000e6}50%{background:#fffffff2}75%{background:#000000e6}to{background:#cf4995f2}}.popup-ticket .popup-overlay,.popup-overlay.popup-overlay--ticket{animation-name:strobeBackgroundBlue}@keyframes strobeBackgroundBlue{0%{background:#3b82f6f2}25%{background:#000000e6}50%{background:#fffffff2}75%{background:#000000e6}to{background:#3b82f6f2}}.popup-card{background:var(--surface-raised);border:3px solid var(--brand);border-radius:24px;padding:48px 64px;text-align:center;min-width:420px;max-width:640px;animation:popBounce .4s cubic-bezier(.34,1.56,.64,1) both,cardFlash .3s linear infinite .4s;box-shadow:0 0 120px #cf499580,0 24px 48px #00000080}@keyframes popBounce{0%{transform:scale(.3);opacity:0}to{transform:scale(1);opacity:1}}@keyframes cardFlash{0%,to{box-shadow:0 0 120px #cf499580,0 0 60px #cf49954d;border-color:var(--brand)}50%{box-shadow:0 0 200px #fffc,0 0 100px #cf499599;border-color:#fff}}.popup-label{font-size:.9rem;font-weight:700;text-transform:uppercase;letter-spacing:.15em;color:var(--brand);margin-bottom:16px;animation:labelBlink .5s steps(2) infinite}@keyframes labelBlink{0%{opacity:1}50%{opacity:0}}.popup-onboarding .popup-label{color:var(--brand)}.popup-ticket .popup-label{color:#60a5fa}.popup-ticket{border-color:#3b82f6;box-shadow:0 0 120px #3b82f680,0 24px 48px #00000080;animation:popBounce .4s cubic-bezier(.34,1.56,.64,1) both,cardFlashBlue .3s linear infinite .4s}@keyframes cardFlashBlue{0%,to{box-shadow:0 0 120px #3b82f680,0 0 60px #3b82f64d;border-color:#3b82f6}50%{box-shadow:0 0 200px #fffc,0 0 100px #3b82f699;border-color:#fff}}.popup-title{font-family:var(--font-heading);font-size:2.8rem;font-weight:700;color:var(--text-primary);margin-bottom:8px;animation:textPulse .2s ease-in-out infinite alternate}@keyframes textPulse{0%{transform:scale(1)}to{transform:scale(1.03)}}.popup-sub{font-size:1.2rem;color:var(--text-secondary);margin-bottom:12px}.popup-details{display:flex;justify-content:center;gap:8px;margin-bottom:12px}.popup-details span{font-size:.9rem;padding:4px 14px;border-radius:9999px;background:var(--surface-hover);color:var(--text-secondary)}.popup-priority{font-weight:700}.popup-meta{font-size:.85rem;color:var(--text-faint);margin-top:4px}.dashboard{display:flex;flex-direction:column;height:100vh}.dashboard-header{display:flex;align-items:center;justify-content:space-between;padding:14px 24px;border-bottom:1px solid var(--border);background:var(--surface-raised)}.header-left{display:flex;align-items:center;gap:12px}.header-left img{height:32px;width:32px;object-fit:contain;margin-left:4px}.header-left h1{font-family:var(--font-heading);font-size:1.1rem;font-weight:700;color:var(--text-primary)}.header-left h1 span{font-weight:400;color:var(--text-faint);font-size:.8rem;margin-left:8px}.header-right{display:flex;align-items:center;gap:12px}.status-indicator{display:flex;align-items:center;gap:8px;font-size:.8rem;font-weight:500;color:var(--text-muted)}.status-dot{width:8px;height:8px;border-radius:50%;transition:background .3s,box-shadow .3s}.status-dot.connected{background:#34d399;box-shadow:0 0 8px #34d39980}.status-dot.disconnected{background:#f87171;box-shadow:0 0 8px #f8717180}.btn-fullscreen{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--text-muted);cursor:pointer;transition:background .2s,color .2s,border-color .2s}.btn-fullscreen:hover{background:var(--surface-hover);color:var(--text-secondary);border-color:var(--border)}.dashboard-panels{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);flex:1;overflow:hidden}.panel{display:flex;flex-direction:column;background:var(--surface);overflow:hidden}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--border);background:var(--surface-raised)}.panel-header h2{font-family:var(--font-heading);font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted)}.panel-count{background:var(--brand);color:#fff;padding:2px 10px;border-radius:9999px;font-size:.75rem;font-weight:600}.panel-body{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px}.panel-empty{display:flex;align-items:center;justify-content:center;height:100%;color:var(--text-faint);font-size:.85rem}.event-card{background:var(--surface-raised);border:1px solid var(--border);border-radius:12px;padding:14px 16px;transition:border-color .25s ease,box-shadow .25s ease;animation:fadeIn .3s ease-out both}.event-card:hover{border-color:#cf49954d;box-shadow:0 4px 32px #cf499514,0 1px 10px #00000080}.event-card.flash{animation:flashHighlight 2.5s ease-out}.card-time{font-size:.7rem;color:var(--text-faint);margin-bottom:4px}.card-title{font-family:var(--font-heading);font-size:.9rem;font-weight:600;color:var(--text-primary);margin-bottom:2px}.card-subtitle{font-size:.75rem;color:var(--text-muted);margin-bottom:6px}.card-detail-line{font-size:.75rem;color:var(--text-secondary);margin-bottom:6px}.card-details{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}.card-details span{font-size:.75rem;color:var(--text-secondary);background:var(--surface-hover);padding:2px 8px;border-radius:9999px}.card-status{display:flex;gap:8px;margin-bottom:6px}.badge{display:inline-flex;align-items:center;gap:4px;font-size:.7rem;padding:2px 8px;border-radius:9999px;font-weight:500}.badge-dot{width:5px;height:5px;border-radius:50%;background:currentColor}.badge-ok{background:#10b98126;color:#34d399}.badge-err{background:#ef444426;color:#f87171}.priority{font-weight:600;font-size:.7rem;padding:2px 8px;border-radius:9999px}.priority-low{background:#94a3b826;color:#cbd5e1}.priority-normal{background:#3b82f626;color:#60a5fa}.priority-high{background:#f59e0b26;color:#fbbf24}.priority-critical{background:#ef444426;color:#f87171}.card-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}.btn-deploy{font-family:var(--font-body);font-size:.7rem;font-weight:600;padding:4px 14px;border-radius:9999px;border:1.5px solid var(--brand);background:transparent;color:var(--brand);cursor:pointer;transition:background .2s,transform .2s,box-shadow .2s;white-space:nowrap}.btn-deploy:hover{background:#cf49951f;transform:translateY(-1px);box-shadow:0 0 0 1px #cf49954d}.btn-deploy:active{transform:translateY(0)}.header-clock{font-size:.8rem;font-weight:500;color:var(--text-muted);font-variant-numeric:tabular-nums}.card-footer{font-size:.7rem;color:var(--text-faint)}.card-priority-low{border-left:3px solid rgb(148,163,184)}.card-priority-normal{border-left:3px solid rgb(96,165,250)}.card-priority-high{border-left:3px solid rgb(251,191,36)}.card-priority-critical{border-left:3px solid rgb(248,113,113);animation:criticalPulse 1.5s ease-in-out infinite}@keyframes criticalPulse{0%,to{box-shadow:0 0 #f8717100}50%{box-shadow:0 0 16px #f871714d}}.history-page{display:flex;flex-direction:column;height:100vh}.history-header{display:flex;align-items:center;justify-content:space-between;padding:14px 24px;border-bottom:1px solid var(--border);background:var(--surface-raised)}.history-header .header-left{display:flex;align-items:center;gap:12px}.history-header .header-left img{height:28px;width:28px;object-fit:contain;margin-left:4px}.history-header h1{font-family:var(--font-heading);font-size:1.1rem;font-weight:700;color:var(--text-primary)}.btn-back{display:flex;align-items:center;gap:4px;font-family:var(--font-body);font-size:.8rem;font-weight:500;padding:6px 12px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--text-muted);cursor:pointer;transition:background .2s,color .2s}.btn-back:hover{background:var(--surface-hover);color:var(--text-secondary)}.history-filters{display:flex;gap:6px}.filter-btn{font-family:var(--font-body);font-size:.75rem;font-weight:500;padding:6px 14px;border-radius:9999px;border:1px solid var(--border);background:transparent;color:var(--text-muted);cursor:pointer;transition:all .2s}.filter-btn:hover{background:var(--surface-hover);color:var(--text-secondary)}.filter-btn.active{background:var(--brand-light);color:var(--brand);border-color:#cf49954d}.history-body{flex:1;overflow-y:auto;padding:16px 24px}.history-empty{display:flex;align-items:center;justify-content:center;height:200px;color:var(--text-faint);font-size:.9rem}.history-row{display:flex;align-items:center;gap:16px;padding:14px 16px;background:var(--surface-raised);border:1px solid var(--border);border-radius:12px;margin-bottom:8px;transition:border-color .25s}.history-row:hover{border-color:#cf499533}.history-type{flex-shrink:0}.history-badge{font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;padding:4px 10px;border-radius:9999px}.badge-onboarding{background:#cf499526;color:#cf4995}.badge-ticket{background:#3b82f626;color:#60a5fa}.history-info{flex:1;min-width:0}.history-title{font-family:var(--font-heading);font-size:.85rem;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history-sub{font-size:.75rem;color:var(--text-muted);margin-top:2px}.history-dates{flex-shrink:0;text-align:right}.history-date{font-size:.7rem;color:var(--text-faint);font-variant-numeric:tabular-nums}.history-cleared-by{flex-shrink:0}.cleared-badge{font-size:.65rem;font-weight:600;padding:4px 10px;border-radius:9999px}.cleared-deployed{background:#10b98126;color:#34d399}.cleared-resolved{background:#3b82f626;color:#60a5fa}:root{--brand: #CF4995;--brand-hover: #b83d82;--brand-light: rgba(207, 73, 149, .15);--brand-subtle: rgba(207, 73, 149, .08);--surface: #f7f7f7;--surface-raised: #ffffff;--surface-overlay: #ffffff;--surface-hover: #f0f0f0;--border: #e0e0e0;--border-light: #efefef;--text-primary: #111111;--text-secondary: #333333;--text-muted: #666666;--text-faint: #999999;--scrollbar-track: #f7f7f7;--scrollbar-thumb: #cccccc;--flash-bg: rgba(207, 73, 149, .08);--flash-border: rgba(207, 73, 149, .25);--font-heading: "Poppins", sans-serif;--font-body: "Poppins", sans-serif}.dark{--surface: #000000;--surface-raised: #111111;--surface-overlay: #1a1a1a;--surface-hover: #222222;--border: #2a2a2a;--border-light: #1a1a1a;--text-primary: #FFFFFF;--text-secondary: #E3E3E2;--text-muted: #999999;--text-faint: #666666;--scrollbar-track: #000000;--scrollbar-thumb: #333333;--flash-bg: rgba(207, 73, 149, .12);--flash-border: rgba(207, 73, 149, .35)}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-body);background-color:var(--surface);background-image:url(/dashboard/assets/darkbackground.png);background-size:cover;background-attachment:fixed;background-position:center;color:var(--text-primary);overflow:hidden;height:100vh}:root:not(.dark) body{background-image:url(/dashboard/assets/lightbackground.png)}#app{height:100vh;display:flex;flex-direction:column}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--scrollbar-track)}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:3px}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-16px)}to{opacity:1;transform:translate(0)}}@keyframes slideInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes scorePop{0%{transform:scale(.6);opacity:0}50%{transform:scale(1.12)}to{transform:scale(1);opacity:1}}@keyframes flashHighlight{0%{background:var(--flash-bg);border-color:var(--flash-border)}to{background:var(--surface-raised);border-color:var(--border)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.animate-fade-in{animation:fadeIn .3s ease-out both}.animate-slide-left{animation:slideInLeft .3s ease-out both}.animate-slide-up{animation:slideInUp .25s ease-out both}.animate-score-pop{animation:scorePop .5s cubic-bezier(.34,1.56,.64,1) both}.animate-float{animation:float 3.5s ease-in-out infinite}.delay-75{animation-delay:75ms}.delay-150{animation-delay:.15s}.delay-225{animation-delay:225ms}.delay-300{animation-delay:.3s}.loading{display:flex;align-items:center;justify-content:center;height:100vh;font-size:1.2rem;color:var(--text-muted)}