/* Lightweight CSS geometry. Data counts always come from the server ledger. */
.server-overview-grid{grid-template-columns:minmax(0,1.6fr) minmax(320px,1fr);align-items:start}
.server-estate{grid-row:auto}.server-room-grid{padding:22px;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}
.server-estate>.panel-title{align-items:center}.server-estate>.panel-title>.text-btn{margin-left:auto}
.room-card{position:relative;isolation:isolate;display:grid;grid-template-columns:104px minmax(0,1fr);grid-template-rows:22px 122px auto;text-align:left;padding:18px;border:1px solid #52748c55;border-radius:13px;background:radial-gradient(ellipse at 20% 40%,#27667b30,transparent 65%),linear-gradient(120deg,#112e40,#101f33);color:#d9edf6;transition:border-color .2s,box-shadow .2s;overflow:hidden;min-width:0}
.room-card:hover,.room-card.selected{border-color:#5dd9c6;box-shadow:0 0 0 1px #5dd9c630,inset 0 0 35px #53bbaa0a}.room-index{grid-column:1/-1;font:8px var(--mono);letter-spacing:.13em;color:#749bae}
.room-copy{display:flex;flex-direction:column;justify-content:center;gap:9px;min-width:0}.room-copy>strong{font:600 18px var(--font);overflow-wrap:anywhere}.room-value{font:28px var(--mono);color:#e8fbff}.room-value small{font:10px var(--font);color:#8eacbf}.room-stats{display:flex;flex-wrap:wrap;gap:5px 12px;font-size:10px;color:#97bbc8}
.room-card-foot{grid-column:1/-1;border-top:1px solid #a4ddeb19;padding-top:13px;display:flex;justify-content:space-between;gap:8px;font-size:10px;color:#8caec0}.room-card-foot b{color:#71dfc9;font-weight:500}
.room-sculpture{position:relative;display:block;align-self:center;width:98px;height:108px;perspective:600px;transform-style:preserve-3d}
.room-base{position:absolute;width:86px;height:69px;left:0;bottom:4px;border:1px solid #4fbaad70;border-radius:5px;background:repeating-linear-gradient(0deg,transparent 0 14px,#55d3bf20 15px),repeating-linear-gradient(90deg,transparent 0 14px,#55d3bf20 15px),#163e4b;transform:rotateX(60deg) rotateZ(-27deg);box-shadow:0 6px 0 #113541,0 8px 18px #0004}
.room-tower{position:absolute;left:14px;bottom:27px;width:27px;height:56px;background:linear-gradient(90deg,#266276,#194154);border:1px solid #65b8c4aa;transform:skewY(12deg);box-shadow:7px 5px 14px #0004;display:flex;flex-direction:column;justify-content:space-evenly;padding:4px 3px;animation:towerHover 6s ease-in-out infinite}
.room-tower::before{content:'';position:absolute;left:-1px;right:-1px;top:-9px;height:8px;transform:skewX(-44deg);transform-origin:bottom;background:#388495;border:1px solid #88d0cf88}
.room-tower::after{content:'';position:absolute;right:-9px;top:-5px;bottom:3px;width:8px;transform:skewY(-46deg);background:#103747;border:1px solid #41889a;transform-origin:left}
.room-tower i{height:5px;border:1px solid #081f3866;background:#163547;position:relative}
.room-tower i::after{content:'';position:absolute;right:2px;top:1px;width:2px;height:2px;background:#85efc9;box-shadow:0 0 4px #72ffc5;animation:serverLed 3.5s infinite}
.room-tower.tower-1{left:43px;bottom:37px;height:69px;animation-delay:-2s}.room-tower.tower-2{left:62px;bottom:15px;height:52px;animation-delay:-4s}.tower-2 i:nth-child(2)::after{background:#f5c473}
.room-orbit{position:absolute;inset:60px -3px -3px;border:1px solid #57dcc544;border-radius:50%;transform:rotateX(65deg);box-shadow:0 0 12px #45b9a933}
@keyframes towerHover{0%,100%{translate:0 0}50%{translate:0 -4px}}@keyframes serverLed{0%,80%,100%{opacity:1}84%,90%{opacity:.25}}
.room-detail{margin:0 22px 22px;padding:20px;border:1px solid #47728766;background:#0b1b2c;border-radius:12px;animation:roomExpand .24s ease-out}
@keyframes roomExpand{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.room-detail-head{display:flex;justify-content:space-between;align-items:center;gap:14px}.room-detail-head h3{font-size:20px;margin:8px 0;color:#deeff9}.room-detail-head h3 small{font-size:11px;font-weight:400;color:#96b3c5;margin-left:6px}.room-detail-head p{font-size:10px;color:#8aaabd;margin:0;line-height:1.7}.room-detail-head>div:last-child{display:flex;align-items:center;gap:15px}
.rack-legend{display:flex;flex-wrap:wrap;gap:10px 16px;margin:20px 0 26px;font-size:10px;color:#a0bbc9}.rack-legend span{display:flex;align-items:center;gap:6px}.rack-legend span:last-child{margin-left:auto;color:#7593a8}
.rack-legend i,.visual-rack-head>i{display:inline-block;width:6px;height:6px;border-radius:50%;flex-shrink:0}.led-online{background:#4dd9bd;box-shadow:0 0 6px #4dd9bd50}.led-offline{background:#f4ba63}.led-empty{background:#7396b9}
.room-rack-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:26px 18px;padding:4px 9px 0 0}
.visual-rack{position:relative;display:block;text-align:left;min-width:0;padding:12px 11px 10px;border:1px solid #4e7e94;border-radius:4px;background:linear-gradient(110deg,#204356,#142f43);color:#dfedf7;box-shadow:6px 6px 0 #071622,9px 12px 15px #0003;transition:transform .2s,border-color .2s;overflow:visible}
.visual-rack:before{content:'';position:absolute;left:5px;right:-7px;height:8px;top:-9px;background:#326176;transform:skewX(-40deg);border:1px solid #578699;transform-origin:bottom;border-radius:2px 2px 0 0}
.visual-rack:after{content:'';position:absolute;right:-8px;top:-5px;bottom:4px;width:6px;background:#153749;border-right:1px solid #477284;transform:skewY(-46deg)}
.visual-rack:hover,.visual-rack:focus-visible{transform:translateY(-4px);border-color:#68ddc9}
.visual-rack-head{display:flex;justify-content:space-between;align-items:center;gap:5px;min-height:21px}.visual-rack-head strong{font:600 13px var(--mono);overflow-wrap:anywhere}
.rack-volume{height:54px;display:flex;flex-direction:column;gap:0;overflow:hidden;margin:12px 0;background:#0c1e2c;border:1px solid #39576a;border-radius:3px}
.rack-volume>i{display:block;flex:0 0 var(--segment);background:repeating-linear-gradient(to bottom,transparent 0 6px,#07202cbb 6px 9px),linear-gradient(90deg,#173548,var(--led));opacity:.85}
.visual-rack-numbers>b{display:block;font:22px var(--mono);color:#82e4d2}.visual-rack-numbers>b small{font:9px var(--font);margin-left:5px;color:#b0c6d4}.visual-rack-numbers>span{display:block;font-size:9px;line-height:1.7;color:#96b2c5;margin-top:7px}.visual-rack-link{display:block;font-size:9px;color:#a6c9db;margin-top:12px;border-top:1px solid #bdd5e217;padding-top:8px}.rack-layout-note{font-size:10px;color:#86a0b4;margin:22px 0 0;line-height:1.8}
#serverStatusChart{padding:0 22px 22px;display:block}#serverModelChart,#serverTypeChart{display:block;padding:20px 22px 23px}
.status-orbit-stage{height:233px;position:relative;display:grid;place-items:center;perspective:700px;overflow:hidden}
.status-orbit-disc{width:238px;height:238px;border-radius:50%;position:absolute;background:var(--ring);transform:rotateX(52deg) rotateZ(-12deg);box-shadow:0 3px #233f55,0 6px #21394f,0 9px #1a3146,0 12px #152b40,0 18px 25px #0006;animation:ringFloat 9s ease-in-out infinite}
.status-orbit-disc::after{content:'';position:absolute;inset:7px;border:1px solid #ffffff30;border-radius:50%}.status-orbit-disc>span{position:absolute;inset:45px;border-radius:50%;background:#102336;box-shadow:inset 0 9px 10px #0005}
.status-orbit-label{position:relative;display:flex;flex-direction:column;text-align:center;gap:6px;pointer-events:none;margin-top:-5px;text-shadow:0 1px 4px #102336}
.status-orbit-label small{font-size:10px;color:#a5c3d4}.status-orbit-label strong{font:32px var(--mono);color:#ecfaff}.status-orbit-label span{font:7px var(--mono);letter-spacing:.1em;color:#83aabd}
@keyframes ringFloat{0%,100%{transform:rotateX(52deg) rotateZ(-12deg) translateZ(0)}50%{transform:rotateX(48deg) rotateZ(-8deg) translateZ(8px)}}
.status-legend{display:grid;gap:3px}.status-legend button{display:flex;gap:10px;align-items:center;padding:13px 9px;border-bottom:1px solid var(--line);width:100%;background:transparent;text-align:left;color:#b9d1e1}.status-legend button:hover{background:#5dd9c610;border-radius:6px}.status-legend button i{width:7px;height:7px;border-radius:50%}.status-legend button span{font-size:12px}.status-legend button strong{font:14px var(--mono);margin-left:auto}.status-legend button small{min-width:44px;text-align:right;font:10px var(--mono);color:#92adbf}.status-legend button b{font-size:12px;font-weight:400;color:#6992aa}
.volume-chart{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(64px,1fr);gap:18px;overflow-x:auto;align-items:end;padding:12px 14px 6px 4px;scrollbar-width:thin;scrollbar-color:#456b82 transparent}
.volume-column{background:transparent;padding:0;text-align:center;min-width:0;color:#b6d1e3}.volume-column>strong{display:block;font:12px var(--mono);margin-bottom:8px;color:#d3e8f4}.column-space{display:flex;height:151px;align-items:flex-end;justify-content:center;border-bottom:1px solid #7199ad40;background:repeating-linear-gradient(to top,transparent 0 36px,#90aabc09 37px 38px)}
.column-prism{position:relative;display:block;width:28px;height:var(--bar-height);background:linear-gradient(90deg,var(--bar-color),color-mix(in srgb,var(--bar-color),#0c233d 50%));border:1px solid #ffffff25;animation:columnGrow .8s ease-out both;animation-delay:calc(var(--column-order)*45ms);transform-origin:bottom}
.column-prism::before{content:'';position:absolute;left:-1px;right:-1px;top:-9px;height:8px;background:var(--bar-color);transform:skewX(-42deg);transform-origin:bottom;filter:brightness(1.12);border:1px solid #ffffff20}
.column-prism::after{content:'';position:absolute;top:-5px;bottom:3px;right:-9px;width:8px;transform:skewY(-48deg);background:var(--bar-color);filter:brightness(.6);transform-origin:left}
.column-label{display:block;overflow-wrap:anywhere;font-size:10px;line-height:1.6;min-height:38px;margin-top:13px}.volume-column>small{font:9px var(--mono);color:#91aebe}.volume-column:hover .column-prism{filter:brightness(1.2)}
@keyframes columnGrow{from{transform:scaleY(.05);opacity:.3}to{transform:scaleY(1);opacity:1}}
.motion-paused :is(.room-tower,.room-tower i::after,.status-orbit-disc,.column-prism){animation-play-state:paused!important}
body[data-theme="light"] .room-card{background:radial-gradient(ellipse at 20% 40%,#cfeef055,transparent 70%),linear-gradient(120deg,#f6fdff,#edf5fb);color:#233f54;border-color:#bdcfdd}
body[data-theme="light"] .room-card.selected,body[data-theme="light"] .room-card:hover{border-color:#008d80;box-shadow:0 0 0 1px #008d8033}
body[data-theme="light"] :is(.room-copy>strong,.room-value,.room-detail-head h3){color:#1b4056}body[data-theme="light"] :is(.room-index,.room-value small,.room-stats,.room-card-foot,.room-detail-head p,.room-detail-head h3 small,.rack-legend,.rack-legend span:last-child,.rack-layout-note){color:#536f84}
body[data-theme="light"] .room-card-foot{border-color:#bacfdd88}body[data-theme="light"] .room-card-foot b{color:#007b70}
body[data-theme="light"] .room-detail{background:#edf4f9;border-color:#bacfdd}body[data-theme="light"] .visual-rack{box-shadow:6px 6px 0 #96afc0,9px 12px 15px #25425b22}
body[data-theme="light"] .status-orbit-disc{box-shadow:0 3px #c1d6de,0 6px #b1c9d2,0 9px #a0bac8,0 12px #91aebb,0 20px 30px #345d7525}
body[data-theme="light"] .status-orbit-disc>span{background:#f8fcff;box-shadow:inset 0 9px 10px #567a8c33}
body[data-theme="light"] .status-orbit-label{text-shadow:none}body[data-theme="light"] .status-orbit-label strong{color:#234758}body[data-theme="light"] :is(.status-orbit-label small,.status-orbit-label span,.status-legend button,.status-legend button small,.volume-column,.volume-column>small){color:#4b6b7e}
body[data-theme="light"] .volume-column>strong{color:#254459}body[data-theme="light"] .column-space{background:repeating-linear-gradient(to top,transparent 0 36px,#325c7610 37px 38px);border-color:#9db9c9}
@media(min-width:1500px){.server-room-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1150px){.server-overview-grid{grid-template-columns:1fr}.server-room-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.room-card{grid-template-columns:85px minmax(0,1fr);padding:15px}.room-sculpture{transform:scale(.85);transform-origin:left center}.room-copy>strong{font-size:17px}.room-value{font-size:25px}}
@media(max-width:800px){.server-room-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.room-detail{padding:16px}.room-detail-head{align-items:flex-start;flex-direction:column}}
@media(max-width:600px){.server-room-grid{padding:16px;gap:12px}.room-card{display:flex;flex-direction:column;padding:13px;align-items:stretch}.room-index{font-size:7px}.room-sculpture{width:102px;height:100px;transform:scale(.9);margin:0 auto;transform-origin:center}.room-copy{gap:7px}.room-copy>strong{font-size:17px}.room-value{font-size:27px}.room-stats{font-size:10px;gap:5px}.room-card-foot{margin-top:13px;flex-direction:column;gap:8px;font-size:10px}.room-detail{margin:0 12px 16px;padding:14px}.room-rack-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 17px}.rack-legend{font-size:10px;gap:10px}.rack-legend span:last-child{margin-left:0}.room-detail-head h3{font-size:19px}.room-detail-head>div:last-child{width:100%;justify-content:space-between}.status-orbit-stage{height:223px}.volume-chart{grid-auto-columns:72px;gap:18px}.server-estate>.panel-title{flex-wrap:wrap}.server-estate>.panel-title>.text-btn{font-size:10px}.server-toolbar{flex-wrap:wrap}.server-toolbar select{min-width:120px;flex:1}}
@media(prefers-reduced-motion:reduce){.room-tower,.room-tower i::after,.status-orbit-disc,.column-prism,.room-detail{animation:none!important}.room-card,.visual-rack{transition:none!important}}
