:root{--bg-dark: #0a0c10;--bg-card: rgba(255, 255, 255, .05);--bg-sidebar: #0d1117;--accent-red: #ff3e3e;--accent-green: #00ff88;--accent-blue: #00a2ff;--text-primary: #ffffff;--text-secondary: #8b949e;--glass-border: rgba(255, 255, 255, .1);--font-main: "Outfit", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-dark);color:var(--text-primary);font-family:var(--font-main);overflow:hidden;height:100vh}.app-container{display:flex;height:100vh}.sidebar{width:280px;background-color:var(--bg-sidebar);border-right:1px solid var(--glass-border);padding:2rem;display:flex;flex-direction:column;gap:2rem}.logo{display:flex;align-items:center;gap:1rem}.logo-icon{font-size:2.5rem}.logo-text h1{font-size:1.5rem;font-weight:800;letter-spacing:-.5px}.logo-text p{font-size:.8rem;color:var(--text-secondary)}.filters h3{font-size:.9rem;text-transform:uppercase;color:var(--text-secondary);margin-bottom:1rem}.filter-group{display:flex;flex-direction:column;gap:.8rem}.cb-container{display:block;position:relative;padding-left:35px;cursor:pointer;font-size:.9rem;-webkit-user-select:none;user-select:none}.cb-container input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.checkmark{position:absolute;top:0;left:0;height:20px;width:20px;background-color:var(--bg-card);border:1px solid var(--glass-border);border-radius:4px}.cb-container:hover input~.checkmark{background-color:#ffffff1a}.cb-container input:checked~.checkmark{background-color:var(--accent-blue)}.main-content{flex:1;display:flex;flex-direction:column;padding:2rem;overflow-y:auto}.top-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.search-bar input{background:var(--bg-card);border:1px solid var(--glass-border);padding:.8rem 1.5rem;border-radius:30px;color:#fff;width:300px;outline:none}.user-meta{text-align:right}.time{display:block;font-size:1.2rem;font-weight:600}.region{font-size:.8rem;color:var(--text-secondary)}.dashboard-grid{display:flex;flex-direction:column;gap:2rem}.stats-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem}.stat-box{background:var(--bg-card);border:1px solid var(--glass-border);border-radius:16px;padding:1.5rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.stat-box h3{font-size:.8rem;color:var(--text-secondary);margin-bottom:.5rem}.stat-name{font-size:1.5rem;font-weight:800}.stat-desc{font-size:.8rem;color:var(--accent-red);margin-top:.3rem}.charts-row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.chart-container{background:var(--bg-card);border:1px solid var(--glass-border);border-radius:16px;padding:1.5rem;height:300px}.chart-container h3{margin-bottom:1rem;font-size:1rem}.live-feed-section h3{margin-bottom:1rem}.feed-container{display:flex;flex-direction:column;gap:1rem;max-height:400px;overflow-y:auto;padding-right:1rem}.delay-item{background:var(--bg-card);border:1px solid var(--glass-border);border-radius:12px;padding:1rem;display:flex;align-items:center;gap:1.5rem;animation:slideIn .3s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.delay-time{display:flex;flex-direction:column;align-items:center;min-width:60px}.t-delayed{color:var(--accent-red);font-weight:800;font-size:1.2rem}.t-planned{color:var(--text-secondary);font-size:.8rem;text-decoration:line-through}.line-tag{background:var(--accent-blue);padding:.3rem .8rem;border-radius:6px;font-weight:800;min-width:50px;text-align:center}.info-main{flex:1}.info-main h4{margin-bottom:.2rem}.info-main p{font-size:.8rem;color:var(--text-secondary)}.reason{font-size:.8rem;background:#ff3e3e1a;color:var(--accent-red);padding:.3rem .6rem;border-radius:4px}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--glass-border);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.stat-box,.chart-container,.delay-item{transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.stat-box:hover,.chart-container:hover,.delay-item:hover{transform:translateY(-2px);border-color:#fff3;box-shadow:0 8px 24px #0003}.line-tag{transition:filter .2s ease}.delay-item:hover .line-tag{filter:brightness(1.2)}@media(max-width:1024px){.charts-row{grid-template-columns:1fr}.chart-container{height:250px}}@media(max-width:768px){.sidebar{width:80px;padding:1rem}.logo-text,.filters,.status-summary{display:none}.logo-icon{font-size:2rem}}
