:root{font-family:Arial,Helvetica,sans-serif;color:#edeef2;background:#101114;font-synthesis:none;color-scheme:dark}*{box-sizing:border-box}body{margin:0}button{font:inherit;cursor:pointer}button:focus-visible{outline:3px solid #fff;outline-offset:4px}.console{display:flex;height:100dvh;min-height:520px;padding:0;overflow:hidden}.floor-area{flex:1;min-width:0;padding:26px 26px 20px;display:flex;flex-direction:column}.map-header{display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:1.7px;color:#9c9da6;height:25px}.map-header span:first-child{color:#e1e2e7}.map-header i{display:inline-block;width:6px;height:6px;border:1px solid #979aa5;margin-right:10px}.map-header b{margin:0 12px;color:#464850}.map-space{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;container-type:size}.map{position:relative;width:min(100cqw,160.328cqh);aspect-ratio:7622/4754;isolation:isolate;box-shadow:0 12px 45px #0005;overflow:hidden;border-radius:3px;background:#252628}.map img{width:100%;height:100%;display:block;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.table{position:absolute;margin:0;padding:0;border:1px solid #79b8ff;background:#0966c6bb;box-shadow:0 0 10px #238cff70,inset 0 0 12px #0b57c466;border-radius:5px;color:#fff;touch-action:pan-x pan-y;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;overflow:hidden;container-type:size}.table.occupied{background:#dc2431c9;border-color:#ff959c;box-shadow:0 0 10px #ff263d60,inset 0 0 12px #df243366}.table.round{border-radius:50%}.table.unloaded{background:#50545c99;border-color:#959ba7;box-shadow:none}.table:disabled{cursor:default}.table-label{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative;z-index:1;text-shadow:0 1px 4px #0008}.table small{font-size:clamp(6px,15cqh,10px);letter-spacing:1px;line-height:1.15;font-weight:600}.table strong{font-size:clamp(13px,44cqh,31px);font-weight:600;line-height:1.05}.table.silver small{display:none}.table.silver strong{font-size:clamp(13px,55cqh,25px)}.table.holding:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#fff5;transform-origin:left;animation:hold .6s linear forwards}@keyframes hold{0%{transform:scaleX(0)}to{transform:scaleX(1)}}footer{min-height:30px;display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:10px;color:#898c98}.instruction{display:flex;gap:9px;align-items:center}.instruction>b{font-size:18px}.instruction b{font-weight:400;color:#bfc2cc}.legend{display:flex;gap:17px}.legend>span{display:flex;align-items:center;gap:7px}i.blue,i.red{display:inline-block;width:6px;height:6px;border-radius:50%;flex-shrink:0}.blue{background:#328cff;box-shadow:0 0 7px #328cff40}.red{background:#f44d5d;box-shadow:0 0 7px #f44d5d40}aside{width:210px;flex-shrink:0;background:#17181c;border-left:1px solid #ffffff0b;padding:30px 23px 22px;display:flex;flex-direction:column}.brand{padding-bottom:30px;border-bottom:1px solid #ffffff12}.brand-mark{display:block;color:#e33c47;font-size:27px;line-height:28px;transform:skew(-14deg);font-weight:900;margin-bottom:12px}h1{font-size:25px;letter-spacing:2.4px;font-weight:500;margin:0}.brand p{font-size:9px;letter-spacing:3px;color:#93959e;margin:8px 0 0}.counts{padding-top:7px}.count{padding:20px 0;border-bottom:1px solid #ffffff10}.count h2{font-size:10px;letter-spacing:1.9px;font-weight:500;margin:0 0 17px;text-transform:uppercase;color:#b7b9c2;display:flex;justify-content:space-between}.count h2>span{color:#636670;font-size:9px;letter-spacing:0}.count p{display:flex;justify-content:space-between;align-items:center;margin:11px 0 0;font-size:11px;color:#9396a0}.count p>span{display:flex;align-items:center;gap:9px}.count strong{font-size:21px;font-weight:400;letter-spacing:-.5px;font-variant-numeric:tabular-nums;color:#e2e4e9}.count.total strong{font-size:28px}.connection{margin-top:auto;padding:24px 0}.connection>span{font-size:10px;letter-spacing:1.8px}.live{color:#68d8a5}.offline{color:#b4b6c2}.connection p{font-size:9px;color:#777b87;line-height:1.6;margin:9px 0 0}.reset{border:1px solid #ffffff21;border-radius:4px;min-height:44px;background:transparent;color:#a5a7b2;display:flex;align-items:center;justify-content:center;gap:12px}.reset span{font-size:10px;letter-spacing:1.5px}.reset:hover{background:#ffffff08}.reset:disabled{opacity:.4}dialog{width:min(440px,90vw);background:#1b1d23;border:1px solid #414450;border-radius:12px;padding:28px;color:#edeef2;box-shadow:0 20px 90px #0009}dialog::backdrop{background:#000a;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}dialog h2{font-size:20px;line-height:1.4;margin:0 0 12px}dialog p{font-size:13px;line-height:1.7;color:#a6a9b5}dialog>div{display:flex;gap:10px;justify-content:flex-end;margin-top:26px}dialog button{padding:13px 15px;border:1px solid #4b4e59;border-radius:5px;background:transparent}dialog .confirm{background:#176ccc;border-color:#3e90ef}@media(max-height:700px){aside{padding-top:18px;padding-bottom:16px}.brand{padding-bottom:18px}.brand-mark{margin-bottom:5px;font-size:22px;line-height:22px}.count{padding:13px 0}.count h2{margin-bottom:10px}.connection{padding:14px 0}.floor-area{padding:16px}}@media(max-width:900px){aside{width:172px;padding-left:17px;padding-right:17px}h1{font-size:21px}.map-header{font-size:8px}.map-header span:last-child{display:none}footer{font-size:9px;flex-wrap:wrap}.floor-area{padding:12px}}@media(orientation:portrait){.console{min-height:650px}.map-space{align-items:center}.floor-area{padding:10px}aside{width:155px;padding:20px 14px}h1{font-size:19px}.brand p{letter-spacing:2px}.legend{gap:9px}}.table,.table.occupied{background:transparent;border:0;box-shadow:none;overflow:visible}.table-label{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:auto;height:auto;min-width:28px;padding:4px 6px;border:1px solid #8ac4ff;border-radius:5px;background:#0966c6;box-shadow:0 1px 5px #0008,0 0 6px #238cff40}.table.occupied .table-label{background:#cd2535;border-color:#ffa0aa;box-shadow:0 1px 5px #0008,0 0 6px #ff263d40}.table.unloaded{background:transparent;border:0;box-shadow:none}.table.unloaded .table-label{background:#50545c;border-color:#959ba7}.table small{font-size:6px;letter-spacing:.6px}.table strong,.table.silver strong{font-size:15px;line-height:1.05}.table.holding:after{inset:auto;left:50%;top:50%;width:32px;height:32px;margin:-16px;border-radius:5px;pointer-events:none}.table-label{min-width:0;max-width:100%;padding:min(4px,8cqh) min(6px,10cqw);border-radius:min(5px,10cqh);white-space:nowrap}.table small{font-size:min(8px,14cqh);letter-spacing:.04em}.table strong,.table.silver strong{font-size:min(20px,42cqh);line-height:1.05}.table.silver .table-label{padding:min(4px,8cqh)}.table.holding:after{top:0;right:0;bottom:0;left:0;width:auto;height:auto;margin:0;background:#fff2}@media(max-width:760px){.console{height:100dvh;min-height:0;flex-direction:column;overflow:auto}.floor-area{flex:1;min-height:260px;padding:12px 10px 8px}.map-header{height:22px;flex-shrink:0}.map-space{min-height:180px}footer{min-height:36px;flex-shrink:0;gap:5px;padding-top:8px}.instruction{font-size:8px}aside{width:100%;padding:12px 14px;flex-shrink:0;border-left:0;border-top:1px solid #ffffff12;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}.brand{padding:0;border:0;display:flex;gap:9px;align-items:baseline}.brand-mark{display:none}h1{font-size:17px;letter-spacing:1.8px}.brand p{font-size:7px;letter-spacing:1.2px;margin:0}.counts{grid-column:1/-1;grid-row:2;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.count{padding:0;border:0}.count h2{margin:0 0 7px;font-size:9px;letter-spacing:1px}.count p{margin:5px 0 0;font-size:9px}.count p>span{gap:5px}.count strong,.count.total strong{font-size:19px}.connection{grid-column:2;grid-row:1;padding:0;margin:0;text-align:right}.connection>span{font-size:8px;letter-spacing:1px}.connection p{display:none}.reset{grid-column:1/-1;min-height:34px}.reset span{font-size:9px}}.table .table-label,.table.silver .table-label{width:min(10px,28cqw);height:min(10px,28cqw);padding:0;min-width:0;border-radius:50%;border-width:1px}.count p{font-size:14px}.count strong{font-size:26px}@media(max-width:760px){.counts{grid-template-columns:repeat(2,1fr);gap:28px}.count p{font-size:13px}.count strong{font-size:23px}}
