*{box-sizing:border-box;margin:0;padding:0}body{color:#e0e0e0;background:#0f0f0f;font-family:Inter,-apple-system,sans-serif;font-size:13px}.app{width:100%;max-width:1400px;margin:0 auto;padding:12px}.header{border-bottom:1px solid #222;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-bottom:12px;padding:8px 0;display:flex}.header-left{align-items:center;gap:10px;display:flex}.header-left h1{white-space:nowrap;font-size:16px;font-weight:600}.status-dot{border-radius:50%;width:8px;height:8px}.status-dot.on{background:#22c55e;box-shadow:0 0 6px #22c55e}.status-dot.off{background:#ef4444}.status-text{color:#888;font-size:11px}.header-right{flex-wrap:wrap;gap:4px;display:flex}.preset-btn{color:#aaa;cursor:pointer;background:#1e1e1e;border:1px solid #333;border-radius:4px;padding:4px 10px;font-size:11px}.preset-btn.active{color:#fff;background:#3b82f6;border-color:#3b82f6}.status-panel{background:#1a1a1a;border-radius:6px;flex-wrap:wrap;justify-content:center;gap:12px;margin-bottom:12px;padding:10px 12px;display:flex}.stat{flex-direction:column;flex:none;align-items:center;min-width:50px;display:flex}.stat-label{color:#888;margin-bottom:2px;font-size:10px}.stat-value{font-variant-numeric:tabular-nums;font-size:15px;font-weight:600}.stat.warn .stat-value{color:#eab308}.chart-panel{background:#1a1a1a;border-radius:6px;margin-bottom:12px;padding:10px}.chart-tabs{flex-wrap:wrap;gap:4px;margin-bottom:8px;display:flex}.tab-btn{color:#888;cursor:pointer;background:#252525;border:none;border-radius:4px;padding:4px 12px;font-size:11px}.tab-btn.active{color:#fff;background:#333}.filter-bar{flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:8px;padding:8px 0;display:flex}.filter-group{flex-wrap:wrap;align-items:center;gap:4px;display:flex}.filter-label{color:#666;margin-right:4px;font-size:11px}.filter-btn{color:#888;cursor:pointer;background:#1e1e1e;border:1px solid #333;border-radius:3px;padding:3px 8px;font-size:11px}.filter-btn.active{background:var(--btn-color,#3b82f6);color:#fff;border-color:var(--btn-color,#3b82f6)}.filter-input{color:#e0e0e0;background:#1e1e1e;border:1px solid #333;border-radius:3px;width:140px;padding:3px 8px;font-size:11px}.timeline{background:#1a1a1a;border-radius:6px;flex:1;overflow:hidden}.timeline-list{min-height:200px;max-height:calc(100vh - 520px);padding:4px 0;overflow:auto}.tl-row{border-bottom:1px solid #1e1e1e;align-items:center;gap:8px;min-width:fit-content;padding:3px 10px;font-family:SF Mono,Consolas,monospace;font-size:11.5px;display:flex}.tl-row:hover{background:#222}.tl-row.tl-error{background:#ef444414}.tl-row.tl-warn{background:#eab3080f}.tl-ts{color:#666;flex-shrink:0;min-width:90px}.tl-device{flex-shrink:0;min-width:55px;font-weight:600}.tl-badge{text-align:center;border-radius:3px;flex-shrink:0;min-width:38px;padding:1px 5px;font-size:9px}.badge-error{color:#fca5a5;background:#7f1d1d}.badge-warn{color:#fde047;background:#713f12}.badge-info{color:#93c5fd;background:#1e3a5f}.badge-debug{color:#666;background:#1e1e1e}.tl-cat{color:#a78bfa;flex-shrink:0;min-width:85px}.tl-msg{color:#ccc;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.timeline-list::-webkit-scrollbar{width:6px}.timeline-list::-webkit-scrollbar-track{background:#1a1a1a}.timeline-list::-webkit-scrollbar-thumb{background:#333;border-radius:3px}@media (width<=768px){.app{padding:8px}.header{flex-direction:column;align-items:flex-start}.header-right{width:100%}.preset-btn{text-align:center;flex:1}.status-panel{gap:8px;padding:8px}.stat-value{font-size:13px}.filter-bar{gap:8px}.filter-input{width:100px}.tl-row{gap:4px;padding:3px 6px;font-size:10px}.tl-ts{min-width:70px}.tl-device{min-width:45px}.tl-cat{min-width:65px}.timeline-list{max-height:calc(100vh - 480px)}}@media (width<=480px){.header-left h1{font-size:14px}.preset-btn{padding:4px 6px;font-size:10px}.stat{min-width:45px}.stat-label{font-size:9px}.stat-value{font-size:12px}.tl-row{font-size:9px}.tl-badge{min-width:30px;font-size:8px}}