*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-canvas: #111217;--bg-primary: #181b1f;--bg-secondary: #212428;--bg-hover: #2a2d32;--border-weak: #2c3235;--border-medium: #44484d;--text-primary: #d8d9da;--text-secondary: #8e8e8e;--text-muted: #6e6e6e;--green: #73bf69;--green-bg: rgba(115, 191, 105, .15);--orange: #ff9830;--orange-bg: rgba(255, 152, 48, .15);--red: #f2495c;--red-bg: rgba(242, 73, 92, .15);--blue: #5794f2;--blue-bg: rgba(87, 148, 242, .15);--purple: #b877d9;--radius: 4px;--font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", "Roboto Mono", "SF Mono", "Menlo", monospace;--font-size-xs: 11px;--font-size-sm: 12px;--font-size-base: 13px;--font-size-md: 14px;--font-size-lg: 18px;--font-size-xl: 24px;--font-size-xxl: 32px}html{color-scheme:dark}body{font-family:var(--font);font-size:var(--font-size-base);color:var(--text-primary);background:var(--bg-canvas);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.topbar{display:flex;align-items:center;height:48px;padding:0 16px;background:var(--bg-primary);border-bottom:1px solid var(--border-weak);position:sticky;top:0;z-index:100;gap:4px}.topbar-logo{font-size:var(--font-size-md);font-weight:700;color:var(--text-primary);margin-right:20px;letter-spacing:-.3px;white-space:nowrap;display:flex;align-items:center;gap:8px}.topbar-logo-dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 6px var(--green);flex-shrink:0}.topbar-nav{display:flex;gap:2px}.topbar-tab{padding:6px 16px;font-size:var(--font-size-sm);color:var(--text-secondary);text-decoration:none;border:none;background:none;cursor:pointer;border-radius:var(--radius);font-weight:500;font-family:var(--font);transition:color .15s,background .15s}.topbar-tab:hover,.topbar-tab.active{color:var(--text-primary);background:var(--bg-secondary)}.topbar-spacer{flex:1}.topbar-actions{display:flex;align-items:center;gap:8px}.topbar-meta{font-size:var(--font-size-xs);color:var(--text-muted);font-family:var(--font-mono)}.topbar-user{font-size:var(--font-size-xs);color:var(--text-secondary)}.page{max-width:1440px;margin:0 auto;padding:12px 16px 32px}.panel{background:var(--bg-primary);border:1px solid var(--border-weak);border-radius:var(--radius);margin-bottom:8px}.panel-header{padding:8px 12px;border-bottom:1px solid var(--border-weak);display:flex;align-items:center;justify-content:space-between;min-height:36px;gap:8px;flex-wrap:wrap}.panel-title{font-size:var(--font-size-sm);font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.panel-body{padding:12px}.panel-body-flush{padding:0}.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:8px}.stat-panel{background:var(--bg-primary);border:1px solid var(--border-weak);border-radius:var(--radius);padding:12px 16px;text-align:center;position:relative}.stat-panel:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;border-radius:0 0 var(--radius) var(--radius)}.stat-panel[data-tone=green]:after{background:var(--green)}.stat-panel[data-tone=orange]:after{background:var(--orange)}.stat-panel[data-tone=red]:after{background:var(--red)}.stat-panel[data-tone=blue]:after{background:var(--blue)}.stat-panel[data-tone=muted]:after{background:var(--text-muted)}.stat-value{font-family:var(--font-mono);font-size:var(--font-size-xxl);font-weight:600;line-height:1.2}.stat-value.green{color:var(--green)}.stat-value.orange{color:var(--orange)}.stat-value.red{color:var(--red)}.stat-value.blue{color:var(--blue)}.stat-value.muted{color:var(--text-muted)}.stat-label{font-size:var(--font-size-xs);color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-top:2px}.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;flex-shrink:0}.status-dot.up{background:var(--green);box-shadow:0 0 4px var(--green)}.status-dot.suspect{background:var(--orange);box-shadow:0 0 4px var(--orange)}.status-dot.down{background:var(--red);box-shadow:0 0 4px var(--red)}.status-dot.unknown{background:var(--text-muted)}.status-dot.removed{background:var(--text-muted);opacity:.5}.status-dots{display:flex;gap:3px;align-items:center;flex-wrap:wrap}.tag{display:inline-flex;align-items:center;padding:1px 6px;font-size:var(--font-size-xs);font-weight:600;border-radius:var(--radius);text-transform:uppercase;letter-spacing:.3px;white-space:nowrap}.tag-green{background:var(--green-bg);color:var(--green)}.tag-orange{background:var(--orange-bg);color:var(--orange)}.tag-red{background:var(--red-bg);color:var(--red)}.tag-blue{background:var(--blue-bg);color:var(--blue)}.tag-default{background:var(--bg-secondary);color:var(--text-secondary)}.tag-removed{background:var(--bg-secondary);color:var(--text-muted);text-decoration:line-through}.progress-container{height:4px;background:var(--bg-secondary);border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:var(--blue);border-radius:2px;transition:width .3s ease}.progress-fill.done{background:var(--green)}.progress-fill.error{background:var(--red)}.probe-row{display:flex;align-items:center;gap:12px;padding:8px 12px;background:var(--bg-primary);border:1px solid var(--border-weak);border-radius:var(--radius);margin-bottom:8px;font-size:var(--font-size-sm);flex-wrap:wrap}.probe-row-label{color:var(--text-secondary);white-space:nowrap}.probe-row-progress{flex:1;min-width:120px}.probe-row-stat{font-family:var(--font-mono);color:var(--text-primary);white-space:nowrap}.probe-row-stat .success{color:var(--green)}.probe-row-stat .failed{color:var(--red)}.node-table-wrapper{overflow-x:auto}.node-table{width:100%;border-collapse:collapse;font-size:var(--font-size-sm)}.node-table th{text-align:left;padding:8px 12px;font-weight:600;color:var(--text-secondary);font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border-weak);background:var(--bg-secondary);white-space:nowrap;position:sticky;top:0}.node-table td{padding:6px 12px;border-bottom:1px solid rgba(44,50,53,.5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.node-table tbody tr{cursor:pointer;transition:background .1s}.node-table tbody tr:hover{background:var(--bg-hover)}.node-table .col-status{width:32px;text-align:center;padding-right:4px}.node-table .col-name{max-width:280px;font-weight:500}.node-table .col-type{width:64px;color:var(--text-secondary);font-size:var(--font-size-xs);text-transform:uppercase}.node-table .col-latency{width:76px;font-family:var(--font-mono);text-align:right}.node-table .col-avail{width:64px;font-family:var(--font-mono);text-align:right}.node-table .col-time{width:88px;color:var(--text-secondary);text-align:right;font-size:var(--font-size-xs)}.node-table .col-error{max-width:240px;color:var(--text-muted);font-size:var(--font-size-xs)}.node-table .col-run-status{width:72px}.node-cards{display:none;gap:6px}.node-card{background:var(--bg-primary);border:1px solid var(--border-weak);border-radius:var(--radius);padding:10px 12px;cursor:pointer;transition:background .1s;border-left:3px solid var(--border-weak)}.node-card:active{background:var(--bg-hover)}.node-card.up{border-left-color:var(--green)}.node-card.suspect{border-left-color:var(--orange)}.node-card.down{border-left-color:var(--red)}.node-card.removed{border-left-color:var(--text-muted);border-left-style:dashed;opacity:.6}.node-card-header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}.node-card-name{font-weight:600;font-size:var(--font-size-sm);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.node-card-type{font-size:var(--font-size-xs);color:var(--text-muted);text-transform:uppercase;flex-shrink:0}.node-card-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}.node-card-metric{font-size:var(--font-size-xs)}.node-card-metric-label{color:var(--text-muted)}.node-card-metric-value{font-family:var(--font-mono);color:var(--text-primary)}.toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.filter-group{display:flex;gap:2px}.filter-chip{padding:4px 12px;font-size:var(--font-size-xs);font-weight:500;border:1px solid var(--border-weak);border-radius:var(--radius);background:none;color:var(--text-secondary);cursor:pointer;transition:all .15s;font-family:var(--font)}.filter-chip:hover{border-color:var(--border-medium);color:var(--text-primary)}.filter-chip.active{background:var(--blue-bg);border-color:var(--blue);color:var(--blue)}.search-input{padding:4px 10px;font-size:var(--font-size-sm);background:var(--bg-secondary);border:1px solid var(--border-weak);border-radius:var(--radius);color:var(--text-primary);font-family:var(--font);outline:none;width:180px;transition:border-color .15s}.search-input:focus{border-color:var(--blue)}.search-input::placeholder{color:var(--text-muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:6px 14px;font-size:var(--font-size-sm);font-weight:500;border-radius:var(--radius);border:1px solid var(--border-weak);background:var(--bg-secondary);color:var(--text-primary);cursor:pointer;transition:background .15s,border-color .15s;font-family:var(--font);line-height:1.5;white-space:nowrap}.btn:hover{background:var(--bg-hover);border-color:var(--border-medium)}.btn-primary{background:var(--blue);border-color:var(--blue);color:#fff}.btn-primary:hover{background:#4a85e0;border-color:#4a85e0}.btn-danger{color:var(--red);border-color:#f2495c4d}.btn-danger:hover{background:var(--red-bg);border-color:var(--red)}.btn-sm{padding:3px 10px;font-size:var(--font-size-xs)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-icon{padding:4px 8px;border:none;background:none;color:var(--text-secondary);cursor:pointer;border-radius:var(--radius);font-size:var(--font-size-md);display:inline-flex;align-items:center;transition:color .15s,background .15s}.btn-icon:hover{color:var(--text-primary);background:var(--bg-secondary)}.form-group{margin-bottom:12px}.form-label{display:block;font-size:var(--font-size-xs);color:var(--text-secondary);margin-bottom:4px;font-weight:500}.form-input{width:100%;padding:7px 10px;font-size:var(--font-size-sm);background:var(--bg-secondary);border:1px solid var(--border-weak);border-radius:var(--radius);color:var(--text-primary);font-family:var(--font);outline:none;transition:border-color .15s}.form-input:focus{border-color:var(--blue)}.form-input::placeholder{color:var(--text-muted)}.form-row{display:grid;gap:8px}.form-row-2{grid-template-columns:repeat(2,1fr)}.form-row-3{grid-template-columns:repeat(3,1fr)}.form-row-4{grid-template-columns:repeat(4,1fr)}.form-row-7-5{grid-template-columns:7fr 5fr}.toggle{position:relative;width:36px;height:20px;display:inline-block;flex-shrink:0}.toggle input{opacity:0;width:0;height:0;position:absolute}.toggle-slider{position:absolute;inset:0;background:var(--bg-secondary);border:1px solid var(--border-weak);border-radius:10px;cursor:pointer;transition:background .2s,border-color .2s}.toggle-slider:after{content:"";position:absolute;width:14px;height:14px;border-radius:50%;background:var(--text-secondary);top:2px;left:2px;transition:transform .2s,background .2s}.toggle input:checked+.toggle-slider{background:var(--blue-bg);border-color:var(--blue)}.toggle input:checked+.toggle-slider:after{transform:translate(16px);background:var(--blue)}.dialog-overlay{position:fixed;inset:0;background:#000000b3;z-index:200;display:flex;align-items:center;justify-content:center;padding:16px}.dialog{background:var(--bg-primary);border:1px solid var(--border-weak);border-radius:var(--radius);max-width:680px;width:100%;max-height:80vh;display:flex;flex-direction:column}.dialog-header{padding:10px 16px;border-bottom:1px solid var(--border-weak);display:flex;align-items:center;justify-content:space-between}.dialog-title{font-size:var(--font-size-md);font-weight:600}.dialog-close{background:none;border:none;color:var(--text-secondary);cursor:pointer;font-size:18px;padding:4px 8px;line-height:1;border-radius:var(--radius);transition:color .15s,background .15s}.dialog-close:hover{color:var(--text-primary);background:var(--bg-secondary)}.dialog-body{padding:12px 16px;overflow-y:auto;flex:1}.history-entry{display:flex;align-items:flex-start;gap:10px;padding:8px 0;border-bottom:1px solid var(--border-weak);font-size:var(--font-size-sm)}.history-entry:last-child{border-bottom:none}.history-time{color:var(--text-muted);font-family:var(--font-mono);font-size:var(--font-size-xs);white-space:nowrap;min-width:70px;padding-top:1px}.history-detail{flex:1;min-width:0}.history-meta{font-family:var(--font-mono);font-size:var(--font-size-xs);color:var(--text-secondary);margin-top:2px}.history-error{font-size:var(--font-size-xs);color:var(--text-muted);margin-top:2px;word-break:break-word}.alert{padding:8px 12px;border-radius:var(--radius);font-size:var(--font-size-sm);margin-bottom:8px;display:flex;align-items:center;gap:8px}.alert-error{background:var(--red-bg);border:1px solid rgba(242,73,92,.3);color:var(--red)}.alert-success{background:var(--green-bg);border:1px solid rgba(115,191,105,.3);color:var(--green)}.alert-info{background:var(--blue-bg);border:1px solid rgba(87,148,242,.3);color:var(--blue)}.alert-warning{background:var(--orange-bg);border:1px solid rgba(255,152,48,.3);color:var(--orange)}.event-log{max-height:360px;overflow-y:auto}.event-row{display:flex;align-items:flex-start;gap:8px;padding:3px 0;border-bottom:1px solid rgba(44,50,53,.4);font-size:var(--font-size-xs)}.event-time{color:var(--text-muted);font-family:var(--font-mono);white-space:nowrap;min-width:64px}.event-level{font-weight:600;min-width:36px;text-transform:uppercase}.event-level.info{color:var(--blue)}.event-level.warn{color:var(--orange)}.event-level.error{color:var(--red)}.event-message{color:var(--text-secondary);word-break:break-word;min-width:0}.auth-container{display:flex;align-items:center;justify-content:center;min-height:calc(100vh - 48px);padding:16px}.auth-card{background:var(--bg-primary);border:1px solid var(--border-weak);border-radius:var(--radius);padding:28px 24px;width:100%;max-width:380px}.auth-title{font-size:var(--font-size-lg);font-weight:700;margin-bottom:4px}.auth-subtitle{font-size:var(--font-size-sm);color:var(--text-secondary);margin-bottom:20px;line-height:1.5}.admin-layout{display:grid;grid-template-columns:1fr 380px;gap:8px;align-items:start}.admin-sidebar{display:flex;flex-direction:column;gap:8px}.metrics-grid{display:grid;gap:6px}.metrics-grid-2{grid-template-columns:repeat(2,1fr)}.metrics-grid-3{grid-template-columns:repeat(3,1fr)}.metric-box{padding:8px 10px;background:var(--bg-secondary);border-radius:var(--radius)}.metric-label{font-size:var(--font-size-xs);color:var(--text-muted)}.metric-value{font-family:var(--font-mono);font-size:var(--font-size-sm);font-weight:500;margin-top:1px}.empty-state{text-align:center;padding:24px 16px;color:var(--text-muted);font-size:var(--font-size-sm)}.spinner{width:20px;height:20px;border:2px solid var(--border-weak);border-top-color:var(--blue);border-radius:50%;animation:spin .8s linear infinite;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.loading-screen{display:flex;align-items:center;justify-content:center;min-height:100vh;flex-direction:column;gap:12px;color:var(--text-muted);font-size:var(--font-size-sm)}.section-toggle{display:flex;align-items:center;gap:6px;cursor:pointer;background:none;border:none;color:var(--text-secondary);font-family:var(--font);font-size:var(--font-size-sm);font-weight:600;text-transform:uppercase;letter-spacing:.5px;padding:0;transition:color .15s}.section-toggle:hover{color:var(--text-primary)}.section-toggle-arrow{display:inline-block;transition:transform .15s;font-size:10px}.section-toggle-arrow.open{transform:rotate(90deg)}@media(max-width:900px){.admin-layout{grid-template-columns:1fr}}@media(max-width:768px){.stat-row{grid-template-columns:repeat(2,1fr)}.node-table-wrapper{display:none}.node-cards{display:flex;flex-direction:column}.form-row-2,.form-row-3,.form-row-4,.form-row-7-5{grid-template-columns:1fr}.search-input{width:100%}.dialog{max-height:100vh;max-width:100%;border-radius:0}.topbar-meta{display:none}.probe-row{font-size:var(--font-size-xs);gap:6px;padding:6px 10px}}@media(max-width:480px){.page,.panel-body{padding:8px}.topbar{padding:0 10px}.topbar-logo{margin-right:8px}.topbar-tab{padding:6px 10px}}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-weak);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--border-medium)}.agent-select{padding:4px 24px 4px 10px;font-size:var(--font-size-sm);background:var(--bg-secondary);border:1px solid var(--border-weak);border-radius:var(--radius);color:var(--text-primary);font-family:var(--font);outline:none;cursor:pointer;transition:border-color .15s;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%238e8e8e' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;min-width:140px}.agent-select:focus{border-color:var(--blue)}.agent-select option{background:var(--bg-primary);color:var(--text-primary)}.agent-list-item{display:flex;justify-content:space-between;align-items:center;padding:6px 4px;border-radius:var(--radius);cursor:pointer;transition:background .1s;border-bottom:1px solid rgba(44,50,53,.4)}.agent-list-item:last-child{border-bottom:none}.agent-list-item:hover{background:var(--bg-hover)}.agent-list-item.selected{background:var(--blue-bg);border-color:transparent}.agent-list-info{min-width:0;flex:1}.agent-list-name{font-weight:600;font-size:var(--font-size-sm);display:flex;align-items:center;gap:6px}.agent-list-meta{font-size:var(--font-size-xs);color:var(--text-muted);margin-top:1px;padding-left:14px}.agent-status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;flex-shrink:0}.agent-status-dot.online{background:var(--green);box-shadow:0 0 4px var(--green)}.agent-status-dot.offline{background:var(--text-muted)}.node-table .col-agent{width:100px;color:var(--text-secondary);font-size:var(--font-size-xs)}.text-secondary{color:var(--text-secondary)}.text-muted{color:var(--text-muted)}.text-mono{font-family:var(--font-mono)}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.no-wrap{white-space:nowrap}
