:root{--black:#000;--white:#fff;--shadow:#000;--bg:#f5f5f5;--card-bg:#fff;--text:#000;--text-muted:#666;--accent-yellow:#ffe600;--accent-red:#f33;--accent-blue:#06f;--accent-green:#0c6;--accent-purple:#9b5de5;--accent:var(--accent-yellow);--border-width:4px;--shadow-offset:6px}.komari-cost-card{background:var(--white);border:var(--border-width) solid var(--black);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--black);flex-wrap:wrap;align-items:center;gap:24px;margin:0 0 24px;padding:20px;display:flex;position:relative}.komari-cost-card__title{color:var(--black);letter-spacing:.1em;text-transform:uppercase;margin-bottom:6px;font-family:Archivo Black,sans-serif;font-size:.75rem;display:block}.komari-cost-card__total{color:var(--black);font-family:Archivo Black,sans-serif;font-size:1.8rem;line-height:1}.komari-cost-card__divider{background:var(--black);flex-shrink:0;width:4px;height:48px}.komari-cost-card__details{flex-wrap:wrap;flex:1;align-items:center;gap:10px;display:flex}.komari-cost-card__tag{background:var(--accent-blue);border:2px solid var(--black);box-shadow:3px 3px 0 var(--black);color:var(--black);white-space:nowrap;align-items:center;padding:5px 12px;font-family:SF Mono,Consolas,Monaco,monospace;font-size:12px;font-weight:900;display:inline-flex}.komari-cost-card__tag.is-warning{background:var(--accent-red)}.komari-cost-card__status{text-transform:uppercase;font-size:12px;font-weight:700}@media (max-width:768px){.komari-cost-card{gap:16px;padding:15px}.komari-cost-card__divider{display:none}.komari-cost-card__total{font-size:1.4rem}}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg);color:var(--text);flex-direction:column;min-height:100vh;font-family:Space Grotesk,-apple-system,BlinkMacSystemFont,sans-serif;display:flex}#app{flex-direction:column;min-height:100vh;display:flex}h1,h2,h3,h4,h5,h6{text-transform:uppercase;letter-spacing:-.02em;font-family:Archivo Black,sans-serif}.header{background-color:var(--accent);border-bottom:var(--border-width) solid var(--black);z-index:100;transition:transform .2s ease-out;position:fixed;top:0;left:0;right:0}.main{padding-top:calc(var(--header-height,120px) + 1.5rem)}.header-content{border-bottom:3px solid var(--black);justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex}.logo{align-items:center;gap:.75rem;display:flex}.logo-icon,.logo h1{color:var(--black);font-size:1.5rem}.header-controls{gap:.5rem;display:flex}.btn-view{background:var(--white);border:3px solid var(--black);cursor:pointer;width:44px;height:44px;box-shadow:3px 3px 0 var(--black);justify-content:center;align-items:center;transition:transform .1s,box-shadow .1s;display:flex}.btn-view:hover{box-shadow:5px 5px 0 var(--black);transform:translate(-2px,-2px)}.btn-view:active,.btn-view.active{box-shadow:none;background:var(--accent);transform:translate(3px,3px)}.btn-view svg{color:var(--black)}.btn-admin{background:var(--black);height:44px;color:var(--white);border:3px solid var(--black);text-transform:uppercase;letter-spacing:.05em;box-shadow:3px 3px 0 var(--shadow);align-items:center;gap:.5rem;padding:0 1rem;font-family:Space Grotesk,sans-serif;font-size:.8rem;font-weight:700;text-decoration:none;transition:transform .1s,box-shadow .1s;display:flex}.btn-admin:hover{box-shadow:5px 5px 0 var(--black);color:var(--white);transform:translate(-2px,-2px)}.btn-admin:active{box-shadow:none;transform:translate(3px,3px)}.btn-admin svg{color:var(--accent)}.stats-bar{gap:0;display:flex;overflow-x:auto}.header.hidden{transform:translateY(-100%)}.stat-item{border-right:3px solid var(--black);text-align:center;flex-direction:column;flex:1;justify-content:center;min-width:80px;padding:1rem 1.5rem;display:flex}.stat-item:last-child{border-right:none}.stat-value{color:var(--black);font-family:Archivo Black,sans-serif;font-size:1.5rem;display:block}.stat-label{letter-spacing:.1em;color:var(--text-muted);font-size:.7rem;font-weight:700}#stat-net-in,#stat-net-out{white-space:pre-line;line-height:1}.main{flex:1;padding:1.5rem}.nodes-container{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem;display:grid}.nodes-container.list-view{background:var(--card-bg);border:var(--border-width) solid var(--black);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--shadow);overscroll-behavior-x:none;flex-direction:column;gap:0;padding:0;display:flex;position:relative;overflow-x:auto}.node-card{background:var(--card-bg);border:var(--border-width) solid var(--black);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--shadow);padding:1.25rem;transition:transform .1s,box-shadow .1s;position:relative}.node-card:hover{box-shadow:calc(var(--shadow-offset) + 3px) calc(var(--shadow-offset) + 3px) 0 var(--shadow);transform:translate(-3px,-3px)}.node-card.offline{opacity:.9;background-image:radial-gradient(circle,#6666664d 1px,#0000 1px);background-size:4px 4px}.node-header{border-bottom:3px solid var(--black);justify-content:space-between;align-items:flex-start;margin-bottom:1rem;padding-bottom:.75rem;display:flex}.node-name{word-break:break-word;font-family:Archivo Black,sans-serif;font-size:1.1rem}.node-status{background:var(--accent-green);border:2px solid var(--black);flex-shrink:0;width:12px;height:12px;margin-left:.5rem}.node-status.offline{animation:1s step-end infinite pulse}@keyframes pulse{0%,to{background:var(--accent-red)}50%{background:var(--black)}}.node-info{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-top:.25rem;font-size:.75rem}.metrics{flex-direction:column;gap:.75rem;display:flex}.metric{flex-direction:column;gap:.25rem;display:flex}.metric-header{text-transform:uppercase;letter-spacing:.05em;justify-content:space-between;font-size:.75rem;font-weight:700;display:flex}.metric-value{font-variant-numeric:tabular-nums;text-align:right;min-width:3.5ch;font-family:SF Mono,Consolas,Monaco,Space Mono,monospace;font-size:.85rem;display:inline-block}.metric-bar{background:var(--bg);border:2px solid var(--black);height:16px;overflow:hidden}.metric-bar.net-bar{position:relative}.metric-bar.net-bar .metric-fill{height:100%;position:absolute;top:0}.metric-bar.net-bar .metric-fill.net-in{left:0}.metric-bar.net-bar .metric-fill.net-out{z-index:1;left:0}.metric-bar.net-bar .metric-fill.net-in{z-index:2}.net-bar.unlimited{background-image:repeating-linear-gradient(45deg,#0000,#0000 4px,#00000026 4px 8px);background-color:var(--bg);border:2px solid var(--black)}.net-totals{justify-content:space-between;margin-top:.25rem;font-size:.7rem;font-weight:700;display:flex}.net-total-item{color:var(--text-muted);font-variant-numeric:tabular-nums;font-family:Space Grotesk,SF Mono,Consolas,Monaco,monospace}.net-total-item:first-child{color:var(--accent-green)}.net-total-item:last-child{color:var(--accent-blue)}.metric-fill.net-in{background:var(--accent-green)}.metric-fill.net-out{background:var(--accent-blue)}.metric-fill.dimmed{opacity:.3}.metric-fill.hidden{display:none}.metric-fill{background:var(--accent);height:100%;transition:width .5s cubic-bezier(.4,0,.2,1)}.metric-fill:after,.metric-fill:before{content:none!important;animation:none!important;display:none!important}.metric-fill.high{background:var(--accent-red)}.metric-fill.medium{background:var(--accent-yellow)}.metric-fill.low{background:var(--accent-green)}.network-quality{display:contents}.quality-metric{--quality-color:var(--text-muted)}.quality-metric.good{--quality-color:var(--accent-green)}.quality-metric.warning{--quality-color:var(--accent-yellow)}.quality-metric.bad{--quality-color:var(--accent-red)}.quality-metric .quality-fill{background:var(--quality-color)}.node-footer{border-top:3px solid var(--black);text-transform:uppercase;letter-spacing:.1em;justify-content:space-between;margin-top:1.5rem;padding-top:1.25rem;font-size:.75rem;display:flex}.footer-stat{text-align:center;flex:none;width:33.333%}.footer-stat:not(:last-child){border-right:2px solid var(--black)}.footer-stat span{font-variant-numeric:tabular-nums;color:var(--black);white-space:nowrap;margin-bottom:.25rem;font-family:Space Grotesk,SF Mono,Consolas,Monaco,monospace;font-size:.75rem;font-weight:700;display:block}.loading{grid-column:1/-1;justify-content:center;align-items:center;padding:4rem 2rem;display:flex}.loading-panel{background:var(--white);border:3px solid var(--black);box-shadow:4px 4px 0 var(--black);flex-direction:column;align-items:center;gap:.75rem;padding:1rem 1.25rem;display:flex}.empty-state{text-align:center;border:4px dashed var(--black);background:var(--card-bg);grid-column:1/-1;padding:4rem 2rem}.empty-state h2{margin-bottom:.5rem;font-size:1.5rem}.empty-state p{color:var(--text-muted)}.footer{background:var(--black);color:var(--white);border-top:var(--border-width) solid var(--black);margin-top:auto;padding:1.25rem 1.5rem}.footer-content{justify-content:space-between;align-items:center;gap:1.5rem;width:100%;max-width:1400px;margin:0 auto;display:flex}.footer-powered{white-space:nowrap;font-size:.85rem}.footer-powered strong{color:var(--accent)}.footer-signature{background:var(--white);min-height:34px;color:var(--black);border:2px solid var(--white);box-shadow:4px 4px 0 var(--accent);letter-spacing:.08em;text-transform:uppercase;align-items:center;gap:.55rem;padding:.4rem .65rem;font-size:.65rem;font-weight:700;text-decoration:none;transition:transform .12s,box-shadow .12s;display:inline-flex;transform:rotate(-1deg)}.footer-signature:hover{box-shadow:6px 6px 0 var(--accent);color:var(--black);transform:translate(-2px,-2px)rotate(0)}.footer-signature:focus-visible{outline:3px solid var(--accent);outline-offset:4px;transform:rotate(0)}.footer-signature-github{width:18px;height:18px;color:var(--black);flex:none;transition:color .12s,transform .12s}.footer-signature:hover .footer-signature-github{color:var(--accent);transform:rotate(-8deg)scale(1.08)}.footer-signature:focus-visible .footer-signature-github{color:var(--accent);transform:rotate(-8deg)scale(1.08)}.footer-signature-build{font-variant-numeric:tabular-nums;font-family:SF Mono,Consolas,monospace}.footer-signature-divider{background:var(--black);width:2px;height:18px}.footer-signature-label{color:var(--text-muted)}.footer-signature-author{color:var(--black);letter-spacing:.02em;font-family:Archivo Black,sans-serif;font-size:.7rem}@media (max-width:680px){.footer-content{flex-direction:column;justify-content:center;gap:1rem}.footer-signature{flex-wrap:wrap;justify-content:center}}.node-row{background:var(--card-bg);border-top:2px solid var(--black);grid-template-columns:[status]24px[name]minmax(140px,1.4fr)[cpu]minmax(95px,1fr)[ram]minmax(95px,1fr)[disk]minmax(95px,1fr)[net]minmax(110px,1.1fr)[up]minmax(82px,.85fr)[down]minmax(82px,.85fr)[uptime]minmax(68px,.7fr);grid-template-areas:"status name cpu ram disk net up down uptime";align-items:stretch;gap:0;min-width:820px;padding:.55rem .85rem;transition:background-color .1s;display:grid;position:relative}.node-row:first-child{border-top:0}.nodes-container.list-view{background-color:var(--card-bg)}.nodes-container.list-view:after{content:none}.node-row:hover{background-color:#ffe60014}.node-row.offline{opacity:.9;background-image:radial-gradient(circle,#6666664d 1px,#0000 1px);background-size:4px 4px}.row-head,.row-metrics,.row-speeds{display:contents}.row-status{background:var(--accent-green);border:2px solid var(--black);grid-area:status;place-self:center;width:12px;height:12px}.row-status.offline{animation:1s step-end infinite pulse}.row-name{border-right:2px solid var(--black);flex-direction:column;grid-area:name;justify-content:center;gap:1px;min-width:0;padding:0 .65rem;display:flex}.row-node-name{text-transform:uppercase;letter-spacing:-.01em;white-space:nowrap;text-overflow:ellipsis;font-family:Archivo Black,sans-serif;font-size:.78rem;line-height:1.15;overflow:hidden}.row-node-info{color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;text-overflow:ellipsis;font-size:.58rem;line-height:1.15;overflow:hidden}.network-quality.is-compact{border:0;align-items:center;gap:.45rem;margin:.25rem 0 0;padding:0;display:flex;overflow:hidden}.row-quality-item{--quality-color:var(--text-muted);font-variant-numeric:tabular-nums;white-space:nowrap;align-items:baseline;gap:.16rem;min-width:0;font-family:SF Mono,Consolas,Monaco,monospace;font-size:.5rem;line-height:1;display:flex}.row-quality-item.good{--quality-color:var(--accent-green)}.row-quality-item.warning{--quality-color:#b69d00}.row-quality-item.bad{--quality-color:var(--accent-red)}.row-quality-item>span{color:var(--text-muted);font-weight:700}.row-quality-item strong{color:var(--quality-color);font-size:.62rem}.row-quality-item small{color:var(--text-muted);font-size:.45rem}.row-metric{border-right:2px solid var(--black);grid-template-rows:auto 8px;align-content:center;gap:5px;min-width:0;padding:0 .6rem;display:grid}.row-cpu{grid-area:cpu}.row-ram{grid-area:ram}.row-disk{grid-area:disk}.row-net{grid-area:net}.row-metric-header{justify-content:space-between;align-items:baseline;gap:.4rem;min-width:0;line-height:1;display:flex}.row-metric-label{letter-spacing:.05em;color:var(--text);white-space:nowrap;flex-shrink:0;font-size:.6rem;font-weight:700;line-height:1}.row-metric-bar{background:var(--bg);border:2px solid var(--black);min-width:0;height:8px;position:relative;overflow:hidden}.row-metric-bar.net-bar{position:relative}.row-metric-bar .row-fill{height:100%;position:absolute;top:0}.row-metric-bar .row-fill.net-in{z-index:2;left:0}.row-metric-bar .row-fill.net-out{z-index:1;left:0}.row-metric-value{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap;text-overflow:ellipsis;min-width:0;font-family:SF Mono,Consolas,Monaco,Space Mono,monospace;font-size:.7rem;font-weight:700;line-height:1;overflow:hidden}.row-speed{border-right:2px solid var(--black);grid-template-rows:auto 1fr;align-content:center;row-gap:4px;min-width:0;padding:0 .55rem;display:grid}.row-up{grid-area:up}.row-down{grid-area:down}.row-arrow{font-family:Archivo Black,sans-serif;font-size:.78rem;line-height:1}.row-speed-label{letter-spacing:.05em;white-space:nowrap;text-overflow:ellipsis;align-items:center;gap:.2rem;font-size:.6rem;font-weight:700;line-height:1;display:flex;overflow:hidden}.row-speed-value{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap;text-overflow:ellipsis;font-family:SF Mono,Consolas,Monaco,Space Mono,monospace;font-size:.7rem;font-weight:700;line-height:1;overflow:hidden}.row-down{border-right:2px solid var(--black)}.row-up .row-arrow{color:var(--accent-green)}.row-down .row-arrow{color:var(--accent-blue)}.row-uptime{grid-area:uptime;grid-template-rows:auto 1fr;align-content:center;row-gap:4px;min-width:0;padding:0 .4rem;display:grid}.row-uptime-label{letter-spacing:.05em;text-align:left;white-space:nowrap;text-overflow:ellipsis;justify-self:start;font-size:.6rem;font-weight:700;line-height:1;overflow:hidden}.row-uptime-value{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap;text-overflow:ellipsis;place-self:end;font-family:SF Mono,Consolas,Monaco,Space Mono,monospace;font-size:.7rem;font-weight:700;line-height:1;overflow:hidden}.row-fill{background:var(--accent);height:100%;transition:width .5s cubic-bezier(.4,0,.2,1)}.row-fill.net-in{background:var(--accent-green)}.row-fill.net-out{background:var(--accent-blue)}.row-fill.dimmed{opacity:.3}.row-fill.hidden{display:none}.row-fill.high{background:var(--accent-red)}.row-fill.medium{background:var(--accent-yellow)}.row-fill.low{background:var(--accent-green)}.row-metric-bar.net-bar.unlimited{background-image:repeating-linear-gradient(45deg,#0000,#0000 4px,#00000026 4px 8px);background-color:var(--bg);border:2px solid var(--black)}@media (max-width:768px){.header-content{gap:.75rem;padding:.65rem .75rem}.logo{gap:.4rem;min-width:0}.logo-icon{flex-shrink:0;font-size:1rem}.logo h1{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:1rem;line-height:1.1;overflow:hidden}.header-controls{flex-shrink:0;gap:.3rem}.btn-view,.btn-admin{width:34px;height:34px;box-shadow:2px 2px 0 var(--black);border-width:2px}.btn-view svg,.btn-admin svg{width:16px;height:16px}.btn-admin{justify-content:center;padding:0}.btn-admin span{display:none}.stats-bar{grid-template-columns:repeat(4,minmax(0,1fr));display:grid;overflow:visible}.stat-item{border-right:3px solid var(--black);min-width:0;padding:.55rem .25rem}.stat-item:nth-child(-n+4){border-bottom:3px solid var(--black)}.stat-item:nth-child(4),.stat-item:nth-child(6){border-right:0}.stat-item:nth-child(5){grid-column:1/3}.stat-item:nth-child(6){grid-column:3/5}.stat-value{font-size:1rem}#stat-net-in,#stat-net-out{white-space:normal}.stat-label{font-size:.6rem}.nodes-container:not(.list-view){grid-template-columns:1fr;gap:1.5rem}}.card-style-thin .node-card,.card-style-thin .nodes-container.list-view{box-shadow:4px 4px 0 var(--shadow);border-width:2px}.card-style-double .node-card,.card-style-double .nodes-container.list-view{box-shadow:8px 8px 0 var(--shadow);border-width:6px}.card-style-double .node-card:before,.card-style-double .nodes-container.list-view:before{content:"";border:2px solid var(--black);pointer-events:none;position:absolute;top:6px;bottom:6px;left:6px;right:6px}.modal-overlay{z-index:1000;opacity:0;visibility:hidden;background:#0009;justify-content:center;align-items:center;transition:opacity .18s ease-out,visibility 0s linear .28s;display:flex;position:fixed;top:0;bottom:0;left:0;right:0}.modal-overlay.active{opacity:1;visibility:visible;transition-delay:0s}.modal-container{background:var(--white);border:var(--border-width) solid var(--black);box-shadow:12px 12px 0 var(--black);opacity:0;transform-origin:50%;will-change:transform, opacity;width:min(96vw,1400px);max-width:1400px;max-height:90vh;padding:2rem;transition:transform .26s cubic-bezier(.2,.85,.25,1),opacity .16s ease-out;position:relative;overflow-y:auto;transform:translateY(16px)scale(.98)}.modal-overlay.active .modal-container{opacity:1;transform:translate(0,0)scale(1)}.modal-close{background:var(--black);width:44px;height:44px;color:var(--white);border:3px solid var(--black);cursor:pointer;box-shadow:3px 3px 0 var(--shadow);z-index:1010;justify-content:center;align-items:center;padding:0;font-family:Space Grotesk,sans-serif;font-size:24px;font-weight:700;line-height:1;transition:transform .1s,box-shadow .1s;display:flex;position:absolute;top:1rem;right:1rem}.modal-close:hover{box-shadow:5px 5px 0 var(--black);color:var(--accent);transform:translate(-2px,-2px)}.modal-close:active{box-shadow:none;transform:translate(3px,3px)}.modal-content{font-family:Space Grotesk,-apple-system,BlinkMacSystemFont,sans-serif}.modal-content h2,.modal-content h3{text-transform:uppercase;letter-spacing:-.02em;font-family:Archivo Black,sans-serif}.modal-content .info-value,.modal-content .storage-meter-value,.modal-content .storage-meter-percent,.modal-content .network-channel-speed,.modal-content .network-channel-total strong,.modal-content .network-connections strong,.modal-content .load-chart-value{font-variant-numeric:tabular-nums;font-family:Space Grotesk,SF Mono,Consolas,Monaco,monospace}.modal-node-header{border-bottom:6px solid var(--black);margin-bottom:2rem;padding-bottom:1.5rem}.modal-node-title{align-items:center;gap:1rem;margin-bottom:.5rem;display:flex}.modal-node-name{margin:0;font-size:2rem}.modal-node-status-tag{border:2px solid var(--black);text-transform:uppercase;padding:.25rem .75rem;font-family:Archivo Black,sans-serif;font-size:.75rem}.modal-node-status-tag.online{background:var(--accent-green)}.modal-node-status-tag.offline{background:var(--accent-red)}.modal-node-meta{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.85rem;font-weight:700}.modal-section-title{border-bottom:3px solid var(--black);margin-bottom:1.5rem;font-size:1.2rem;display:inline-block}.chart-container{background:var(--white);border:2px solid var(--black);min-height:250px;margin-top:1rem}.modal-info-grid{grid-template-columns:repeat(2,1fr);gap:1rem;display:grid}.info-item{flex-direction:column;display:flex}.info-label{color:var(--text-muted);text-transform:uppercase;font-size:.7rem;font-weight:700}.info-value{font-variant-numeric:tabular-nums;word-break:break-all;font-family:Space Grotesk,SF Mono,Consolas,Monaco,monospace;font-size:.85rem;font-weight:700}.modal-info-row{grid-template-columns:repeat(2,1fr);gap:1.5rem;margin-bottom:2rem;display:grid}@media (max-width:900px){.modal-info-row{grid-template-columns:1fr;gap:1rem}}.modal-info-section{border:3px solid var(--black);background:var(--bg);box-shadow:4px 4px 0 var(--black);padding:1rem 1.25rem}.modal-info-section-title{border-bottom:2px solid var(--black);margin-bottom:1rem;padding-bottom:.5rem;font-size:.85rem;display:inline-block}.storage-stack{flex-direction:column;gap:.9rem;display:flex}.storage-meter{grid-template-columns:1fr auto;align-items:center;gap:.35rem .75rem;display:grid}.storage-meter-header{grid-column:1/-1;justify-content:space-between;align-items:baseline;gap:1rem;display:flex}.storage-meter-label,.storage-meter-percent{letter-spacing:.08em;font-size:.65rem;font-weight:700}.storage-meter-value{text-align:right;font-size:.75rem;font-weight:700}.storage-meter-track{background:var(--white);border:2px solid var(--black);height:14px;overflow:hidden}.storage-meter-fill{background:var(--accent-green);height:100%;display:block}.storage-meter-fill.medium{background:var(--accent-yellow)}.storage-meter-fill.high{background:var(--accent-red)}.storage-meter.unlimited .storage-meter-track{background-color:var(--bg);background-image:repeating-linear-gradient(45deg,#0000,#0000 4px,#00000026 4px 8px)}.storage-meter.unlimited .storage-meter-value,.storage-meter.unlimited .storage-meter-percent{color:var(--text-muted)}.storage-meter-percent{text-align:right;min-width:6.5ch;color:var(--text-muted);white-space:nowrap}.network-channels{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;display:grid}.network-channel{background:var(--white);border:2px solid var(--black);box-shadow:3px 3px 0 var(--black);min-width:0;padding:.75rem}.network-channel.up{border-top:6px solid var(--accent-green)}.network-channel.down{border-top:6px solid var(--accent-blue)}.network-channel-direction{letter-spacing:.08em;align-items:center;gap:.35rem;font-size:.65rem;font-weight:700;display:flex}.network-channel-arrow{font-size:1rem;line-height:1}.network-channel.up .network-channel-arrow{color:var(--accent-green)}.network-channel.down .network-channel-arrow{color:var(--accent-blue)}.network-channel-speed{overflow-wrap:anywhere;margin:.5rem 0 .65rem;font-size:1rem;font-weight:700;display:block}.network-channel-total{border-top:2px solid var(--black);color:var(--text-muted);justify-content:space-between;gap:.75rem;padding-top:.5rem;font-size:.6rem;font-weight:700;display:flex}.network-channel-total strong{color:var(--black);text-align:right}.network-connections{border-top:2px solid var(--black);letter-spacing:.06em;justify-content:space-between;gap:1rem;margin-top:.9rem;padding-top:.65rem;font-size:.65rem;font-weight:700;display:flex}.network-connections strong{color:var(--black);text-align:right}.modal-load-title-container{border-bottom:2px solid var(--black);justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.5rem;display:flex}.modal-load-title{border-bottom:none;margin-bottom:0;font-size:1.2rem;display:inline-block}.modal-load-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-bottom:0;display:grid}@media (min-width:1050px){.modal-load-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:700px){.modal-load-grid{grid-template-columns:1fr}}.load-chart-card{border:3px solid var(--black);background:var(--bg);box-shadow:4px 4px 0 var(--black);min-width:0;padding:.75rem}.load-chart-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.25rem;font-size:.65rem;font-weight:700}.load-chart-value{white-space:normal;word-break:keep-all;min-height:1.4em;margin-bottom:.5rem;font-family:SF Mono,monospace;font-size:.95rem;font-weight:700;line-height:1.25}.load-network-value{flex-wrap:wrap;align-items:center;gap:.35rem;display:flex}.load-network-up{color:var(--accent-green)}.load-network-down{color:var(--accent-blue)}.load-network-separator{color:var(--black)}.load-chart-container{background:var(--bg);min-width:0;height:180px;overflow:hidden}.modal-chart-section{border:3px solid var(--black);background:var(--bg);box-shadow:4px 4px 0 var(--black);margin-bottom:2rem;padding:1rem 1.25rem;position:relative}.chart-loading-overlay{z-index:30;background:var(--bg);opacity:0;pointer-events:none;justify-content:center;align-items:center;transition:opacity .25s;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}.chart-loading-overlay.is-visible{opacity:1;pointer-events:auto}.chart-loading-overlay.is-leaving{opacity:0}.chart-loading-panel{background:var(--white);border:3px solid var(--black);box-shadow:4px 4px 0 var(--black);flex-direction:column;align-items:center;gap:.75rem;padding:1rem 1.25rem;display:flex}.chart-loading-pixels{background:0 0;border:none;grid-template-rows:repeat(5,8px);grid-template-columns:repeat(5,8px);gap:3px;padding:5px;display:grid}.chart-loading-pixel{background:var(--accent);opacity:0;width:8px;height:8px;animation:1.6s step-end infinite chart-pixel-resolution;animation-delay:calc(var(--pixel-index) * 22ms);transform:scale(0)}.chart-loading-text{letter-spacing:.12em;font-family:SF Mono,monospace;font-size:.7rem;font-weight:700}.modal-chart-section .load-chart-container,.modal-chart-section .chart-container{opacity:1;transition:opacity .25s,transform .25s;transform:translateY(0)}.modal-chart-section.is-loading .load-chart-container,.modal-chart-section.is-loading .chart-container{opacity:0;transform:translateY(4px)}.modal-chart-section.is-loading .btn-timescale{pointer-events:none;opacity:.45}@keyframes chart-pixel-resolution{0%,12.5%,87.5%,to{opacity:0;transform:scale(0)}25%,75%{opacity:.35;transform:scale(1)}37.5%,62.5%{opacity:.7;transform:scale(1)}50%{opacity:1;transform:scale(1)}}@media (prefers-reduced-motion:reduce){.modal-overlay,.modal-container{transition:none}.modal-container{filter:none;transform:none}.chart-loading-pixel{opacity:1;animation:none;transform:none}.chart-loading-overlay,.modal-chart-section .load-chart-container,.modal-chart-section .chart-container{transition:none}}.modal-latency-header{border-bottom:2px solid var(--black);justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.5rem;display:flex}.modal-latency-section .chart-container{background:var(--bg);border:none;margin-top:0}.modal-latency-tasks{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));align-items:start;gap:.75rem;margin-bottom:1rem;display:grid}.latency-task-card{background:var(--bg);border:3px solid var(--black);box-shadow:3px 3px 0 var(--black);cursor:pointer;flex-direction:column;min-width:0;transition:opacity .18s,transform .18s,box-shadow .18s;display:flex;position:relative}.modal-latency-tasks.has-active .latency-task-card:not(.is-active){opacity:.3}.latency-task-card.is-active{box-shadow:5px 5px 0 var(--black);transform:translate(-2px,-2px)}.latency-task-row{flex:none;transition:opacity .18s;display:flex}.latency-task-strip{background:var(--task-color,var(--accent-yellow));flex-shrink:0;width:6px}.latency-task-body{flex:1;min-width:0;padding:.5rem .75rem 0}.latency-task-header{align-items:center;gap:.4rem;margin-bottom:.25rem;display:flex}.latency-task-name{text-transform:uppercase;letter-spacing:.05em;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:.78rem;font-weight:700;overflow:hidden}.latency-task-stats{flex-wrap:wrap;align-items:baseline;gap:.4rem;font-size:.85rem;display:flex}.latency-task-latest{font-family:SF Mono,monospace;font-size:.95rem;font-weight:700}.latency-task-sep{color:var(--text-muted)}.latency-task-loss{color:var(--text-muted);font-family:SF Mono,monospace;font-weight:700}.latency-task-loss.has-loss{color:var(--accent-red)}.latency-task-detail-wrap{display:none}.latency-task-detail{background:var(--black);color:var(--white);grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem .75rem;padding:.5rem .75rem;font-size:.85rem;display:grid}.latency-task-detail .info-label,.latency-task-detail .info-value{color:var(--white)}.modal-latency-header .modal-section-title{border-bottom:none;margin-bottom:0}.modal-timescale-selector{background:var(--bg);box-shadow:4px 4px 0 var(--black);border:none;gap:.25rem;padding:.25rem;display:flex}.btn-timescale{background:var(--white);border:2px solid var(--black);text-transform:uppercase;cursor:pointer;padding:.25rem .6rem;font-family:Space Grotesk,sans-serif;font-size:.7rem;font-weight:700;transition:all .1s}.btn-timescale:hover{background:var(--accent-yellow)}.btn-timescale.active{background:var(--black);color:var(--white)}@media (max-width:520px){.storage-meter-header,.network-connections{flex-direction:column;align-items:flex-start;gap:.25rem}.storage-meter-value,.network-connections strong{text-align:left}.network-channels{grid-template-columns:1fr}}@media (max-width:600px){.modal-node-header{padding-right:3.5rem}.modal-node-title{flex-wrap:wrap;align-items:flex-start}.modal-load-title-container,.modal-latency-header{flex-direction:column;align-items:flex-start;gap:1rem}.modal-timescale-selector{flex-wrap:wrap;max-width:100%}}#app>.main{padding-top:calc(var(--header-height,120px) + 1.5rem)}.auth-overlay{z-index:2000;opacity:0;visibility:hidden;background:#000000ad;justify-content:center;align-items:center;padding:1.25rem;transition:opacity .18s,visibility 0s linear .18s;display:flex;position:fixed;top:0;bottom:0;left:0;right:0}.auth-overlay.active{opacity:1;visibility:visible;transition-delay:0s}.auth-dialog{background:var(--card-bg);border:var(--border-width) solid var(--black);width:min(100%,460px);box-shadow:12px 12px 0 var(--black);opacity:0;padding:2rem;transition:opacity .16s,transform .24s cubic-bezier(.2,.85,.25,1);position:relative;transform:translateY(16px)scale(.98)}.auth-overlay.active .auth-dialog{opacity:1;transform:translateY(0)scale(1)}.auth-close{border:3px solid var(--black);background:var(--black);width:38px;height:38px;color:var(--white);box-shadow:3px 3px 0 var(--accent);cursor:pointer;font:700 1.4rem/1 Space Grotesk,sans-serif;position:absolute;top:.75rem;right:.75rem}.auth-heading{border-bottom:5px solid var(--black);margin-bottom:1.5rem;padding-bottom:1rem;padding-right:2.5rem}.auth-kicker{color:var(--text-muted);letter-spacing:.14em;margin-bottom:.35rem;font-size:.65rem;font-weight:700;display:block}.auth-heading h2{font-size:2rem;line-height:1}.auth-heading p{color:var(--text-muted);margin-top:.65rem;font-size:.82rem}.auth-field{gap:.4rem;margin-bottom:1rem;display:grid}.auth-field span{letter-spacing:.1em;font-size:.68rem;font-weight:700}.auth-field input{border:3px solid var(--black);background:var(--bg);width:100%;height:46px;color:var(--text);box-shadow:3px 3px 0 var(--black);border-radius:0;outline:none;padding:0 .75rem;font:700 .95rem Space Grotesk,sans-serif}.auth-field input:focus{background:var(--white);box-shadow:5px 5px 0 var(--accent);transform:translate(-2px,-2px)}.auth-message{min-height:1.1rem;color:var(--accent-red);letter-spacing:.04em;margin:.25rem 0 .65rem;font-size:.7rem;font-weight:700}.auth-submit,.auth-back,.auth-oauth a{border:3px solid var(--black);letter-spacing:.08em;cursor:pointer;border-radius:0;font-family:Space Grotesk,sans-serif;font-weight:700;text-decoration:none}.auth-submit{background:var(--accent);width:100%;min-height:46px;color:var(--black);box-shadow:4px 4px 0 var(--black);padding:.7rem 1rem}.auth-submit:hover:not(:disabled),.auth-oauth a:hover{box-shadow:6px 6px 0 var(--black);transform:translate(-2px,-2px)}.auth-submit:disabled{cursor:wait;opacity:.65}.auth-back{background:var(--white);color:var(--black);box-shadow:2px 2px 0 var(--black);margin-bottom:1rem;padding:.35rem .6rem;font-size:.68rem}.auth-oauth{grid-template-columns:1fr auto 1fr;align-items:center;gap:.75rem;margin-top:1.25rem;display:grid}.auth-oauth[hidden]{display:none}.auth-oauth:before,.auth-oauth:after{content:"";background:var(--black);height:3px}.auth-oauth span{font-size:.65rem;font-weight:700}.auth-oauth a{background:var(--black);color:var(--white);box-shadow:4px 4px 0 var(--accent);text-align:center;grid-column:1/-1;padding:.65rem;font-size:.72rem}@media (max-width:520px){.auth-dialog{box-shadow:8px 8px 0 var(--black);padding:1.35rem}.auth-heading h2{font-size:1.6rem}}.auth-oauth:before{grid-area:1/1}.auth-oauth>span{grid-area:1/2}.auth-oauth:after{grid-area:1/3}.auth-oauth>a{grid-row:2}
