:root{--bg: #070c18;--panel: #0e1626;--panel-2: #13203a;--panel-3: #19294a;--line: rgba(255, 255, 255, .07);--line-2: rgba(255, 255, 255, .12);--txt: #e7edfa;--muted: #8a99b5;--muted-2: #5e6e8c;--brand: #2e6be6;--brand-2: #4d8bff;--vacant: #16c784;--occupied: #ff4d5e;--ev: #7c5cff;--disabled: #2e93fb;--scan: #15c7e8;--amber: #ffb020}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Pretendard Variable,Pretendard,system-ui,sans-serif;background:var(--bg);color:var(--txt);-webkit-font-smoothing:antialiased}.mono{font-family:Space Mono,monospace}.disp{font-family:Space Grotesk,sans-serif;letter-spacing:-.01em}::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-thumb{background:var(--panel-3);border-radius:5px}::-webkit-scrollbar-track{background:transparent}button{font-family:inherit}.app{display:grid;grid-template-columns:230px 1fr;grid-template-rows:56px 1fr;height:100vh;grid-template-areas:"side top" "side main"}.side{grid-area:side;background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:16px 12px;gap:4px;overflow-y:auto}.brand{display:flex;align-items:center;gap:10px;padding:6px 8px 16px;margin-bottom:6px;border-bottom:1px solid var(--line)}.logo-grid{width:30px;height:30px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:2px;flex-shrink:0}.logo-grid i{border-radius:2px;background:var(--panel-3)}.logo-grid i.v{background:var(--vacant)}.logo-grid i.o{background:var(--occupied)}.brand b{font-size:1.1rem;font-weight:700;letter-spacing:.03em;font-family:Space Grotesk}.brand span{display:block;font-size:.64rem;color:var(--muted-2);letter-spacing:.05em;margin-top:1px}.nav-label{font-size:.66rem;color:var(--muted-2);text-transform:uppercase;letter-spacing:.1em;padding:12px 10px 6px;font-weight:600}.nav-item{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:9px;color:var(--muted);font-size:.86rem;font-weight:500;cursor:pointer;transition:.14s;border:1px solid transparent;text-decoration:none}.nav-item .ic{width:18px;text-align:center;font-size:.95rem;flex-shrink:0}.nav-item:hover{background:var(--panel-2);color:var(--txt)}.nav-item.active{background:linear-gradient(90deg,#2e6be62e,#2e6be60a);color:#fff;border-color:#2e6be64d}.nav-item.active .ic{color:var(--brand-2)}.nav-item .fid{margin-left:auto;font-size:.6rem;color:var(--muted-2);font-family:Space Mono}.side-foot{margin-top:auto;padding:12px 10px 4px;border-top:1px solid var(--line);font-size:.68rem;color:var(--muted-2)}.side-foot b{color:var(--muted)}.logout-btn{margin-top:8px;background:var(--panel-2);border:1px solid var(--line);color:var(--muted);padding:8px;border-radius:8px;font-size:.74rem;font-weight:600;cursor:pointer;width:100%}.logout-btn:hover{border-color:var(--line-2);color:var(--txt)}.top{grid-area:top;background:var(--panel);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 22px;gap:16px}.top .ttl{font-size:.98rem;font-weight:700;display:flex;align-items:center;gap:10px}.top .ttl .sub{font-size:.74rem;color:var(--muted);font-weight:400}.top .right{display:flex;align-items:center;gap:14px}.live-badge{display:flex;align-items:center;gap:7px;font-size:.74rem;color:var(--vacant);font-weight:600;background:#16c7841a;padding:5px 11px;border-radius:20px}.live-badge.off{color:var(--muted-2);background:var(--panel-2)}.live-dot{width:7px;height:7px;border-radius:50%;background:var(--vacant);animation:pulse 1.6s infinite}.live-badge.off .live-dot{background:var(--muted-2);animation:none}@keyframes pulse{0%,to{opacity:1;box-shadow:0 0 #16c78480}50%{opacity:.5;box-shadow:0 0 0 5px #16c78400}}.clock{font-family:Space Mono;font-size:.82rem;color:var(--muted)}.sim-tag{display:flex;align-items:center;gap:6px;background:var(--panel-2);border:1px solid var(--line);border-radius:9px;padding:5px 11px;font-size:.74rem;color:var(--muted);font-weight:600}.main{grid-area:main;overflow-y:auto;padding:22px;position:relative}.row{display:flex;gap:16px;flex-wrap:wrap}.grid{display:grid;gap:16px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px}.panel h3{font-size:.92rem;font-weight:700;margin-bottom:3px;display:flex;align-items:center;gap:8px;justify-content:space-between}.panel h3 .l{display:flex;align-items:center;gap:8px}.panel .psub{font-size:.74rem;color:var(--muted-2);margin-bottom:14px}.chip{font-size:.68rem;font-weight:600;padding:3px 9px;border-radius:20px;background:var(--panel-2);color:var(--muted)}.kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}@media (max-width: 1300px){.kpis{grid-template-columns:repeat(3,1fr)}}@media (max-width: 680px){.kpis{grid-template-columns:repeat(2,1fr)}}.kpi{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 16px;position:relative;overflow:hidden}.kpi .k{font-size:.72rem;color:var(--muted);margin-bottom:8px;display:flex;align-items:center;gap:6px}.kpi .v{font-family:Space Grotesk;font-size:1.7rem;font-weight:700;line-height:1;letter-spacing:-.02em}.kpi .v small{font-size:.8rem;color:var(--muted);font-weight:600}.kpi .d{font-size:.68rem;margin-top:6px;color:var(--muted-2)}.kpi .accent{position:absolute;left:0;top:0;bottom:0;width:3px}.kpi.green .v{color:var(--vacant)}.kpi.green .accent{background:var(--vacant)}.kpi.red .v{color:var(--occupied)}.kpi.red .accent{background:var(--occupied)}.kpi.blue .v{color:var(--brand-2)}.kpi.blue .accent{background:var(--brand)}.kpi.cyan .v{color:var(--scan)}.kpi.cyan .accent{background:var(--scan)}.kpi.amber .v{color:var(--amber)}.kpi.amber .accent{background:var(--amber)}.floor-tabs{display:flex;gap:6px;margin-bottom:14px}.floor-tabs button{background:var(--panel-2);border:1px solid var(--line);color:var(--muted);padding:6px 14px;border-radius:8px;font-size:.8rem;font-weight:600;cursor:pointer}.floor-tabs button.active{background:var(--brand);color:#fff;border-color:var(--brand)}.pmap-wrap{position:relative;background:var(--panel-2);border:1px solid var(--line);border-radius:12px;padding:18px;overflow:hidden}.pmap-scan{position:absolute;left:0;right:0;height:60px;top:-60px;background:linear-gradient(180deg,transparent,rgba(21,199,232,.12),transparent);animation:mapscan 3.5s linear infinite;pointer-events:none}@keyframes mapscan{0%{top:-60px}to{top:100%}}.pmap{display:grid;gap:7px;position:relative}.slot{aspect-ratio:1.5 / 1;border-radius:6px;border:1.5px solid var(--line-2);display:flex;align-items:center;justify-content:center;font-size:.6rem;font-weight:700;color:#ffffff8c;cursor:pointer;transition:.25s;position:relative;font-family:Space Mono}.slot.aisle{background:none;border:none;cursor:default}.slot.vacant{background:#16c78429;border-color:var(--vacant);color:#7ef0bd}.slot.occupied{background:#ff4d5e24;border-color:#ff4d5e73;color:#ff8c96cc}.slot.unknown{background:#5e6e8c24;border-color:var(--muted-2);color:var(--muted)}.slot.vacant.ev{background:#7c5cff29;border-color:var(--ev);color:#b9a8ff}.slot.vacant.disabled{background:#2e93fb29;border-color:var(--disabled);color:#9fccff}.slot:hover:not(.aisle){transform:scale(1.08);z-index:3;box-shadow:0 4px 16px #0006}.slot .typeic{position:absolute;top:2px;right:3px;font-size:.5rem;opacity:.85}.slot.flip{animation:flip .5s}@keyframes flip{0%{transform:scale(1)}40%{transform:scale(1.18);filter:brightness(1.6)}to{transform:scale(1)}}.legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:14px;font-size:.74rem;color:var(--muted)}.legend span{display:flex;align-items:center;gap:6px}.legend i{width:12px;height:12px;border-radius:3px;border:1.5px solid}.lg-v{background:#16c78429;border-color:var(--vacant)}.lg-o{background:#ff4d5e24;border-color:var(--occupied)}.lg-e{background:#7c5cff29;border-color:var(--ev)}.lg-d{background:#2e93fb29;border-color:var(--disabled)}.log{display:flex;flex-direction:column;gap:0;max-height:360px;overflow-y:auto}.log-item{display:flex;align-items:center;gap:10px;padding:9px 4px;border-bottom:1px solid var(--line);font-size:.78rem;animation:slidein .3s}@keyframes slidein{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:none}}.log-item .t{font-family:Space Mono;font-size:.68rem;color:var(--muted-2);flex-shrink:0}.log-item .ld{width:7px;height:7px;border-radius:50%;flex-shrink:0}.log-item .msg{color:var(--muted);flex:1}.log-item .msg b{color:var(--txt);font-family:Space Mono}.log-item .cam{font-size:.66rem;color:var(--muted-2);font-family:Space Mono}.empty{color:var(--muted-2);font-size:.78rem;padding:8px}.phone-stage{display:flex;justify-content:center;gap:40px;flex-wrap:wrap;align-items:flex-start}.phone{width:330px;height:680px;background:#05080f;border:10px solid #1a2438;border-radius:42px;overflow:hidden;position:relative;box-shadow:0 24px 60px #00000080;flex-shrink:0}.phone .notch{position:absolute;top:0;left:50%;transform:translate(-50%);width:130px;height:26px;background:#1a2438;border-radius:0 0 16px 16px;z-index:10}.pscreen{height:100%;overflow-y:auto;background:linear-gradient(180deg,#0a1120,#070c18)}.papp-head{padding:38px 20px 16px;background:linear-gradient(135deg,#13203a,#0e1626)}.papp-head .loc{font-size:.7rem;color:var(--muted);display:flex;align-items:center;gap:5px}.papp-head h2{font-size:1.05rem;font-weight:700;margin:3px 0 14px}.avail-big{display:flex;align-items:baseline;gap:8px}.avail-big .n{font-family:Space Grotesk;font-size:3rem;font-weight:700;color:var(--vacant);line-height:1}.avail-big .of{font-size:.95rem;color:var(--muted)}.avail-big .lab{font-size:.8rem;color:var(--muted);margin-left:4px}.bar-occ{height:7px;border-radius:5px;background:var(--panel-3);margin-top:12px;overflow:hidden}.bar-occ i{display:block;height:100%;background:linear-gradient(90deg,var(--vacant),var(--amber));transition:.6s}.ptabs{display:flex;gap:6px;padding:14px 20px 6px}.ptabs button{flex:1;background:var(--panel-2);border:1px solid var(--line);color:var(--muted);padding:7px;border-radius:8px;font-size:.78rem;font-weight:600;cursor:pointer}.ptabs button.active{background:var(--brand);color:#fff;border-color:var(--brand)}.pmap-mini{padding:6px 20px}.pmap-mini .pmap{gap:5px}.pmap-mini .slot{font-size:.5rem}.rec-card{margin:8px 20px 16px;background:linear-gradient(135deg,#16c78424,#16c78408);border:1px solid rgba(22,199,132,.3);border-radius:12px;padding:14px}.rec-card.full{border-color:#ff4d5e4d;background:#ff4d5e0f}.rec-card .rl{font-size:.68rem;color:var(--vacant);font-weight:700;letter-spacing:.04em;text-transform:uppercase}.rec-card.full .rl{color:var(--occupied)}.rec-card .rc{font-family:Space Grotesk;font-size:1.4rem;font-weight:700;margin:4px 0}.rec-card .rd{font-size:.74rem;color:var(--muted)}.plegend{padding:0 20px 24px;display:flex;gap:12px;flex-wrap:wrap;font-size:.68rem;color:var(--muted)}.plegend span{display:flex;align-items:center;gap:5px}.plegend i{width:10px;height:10px;border-radius:3px;border:1.5px solid}.phone-note{max-width:300px}.phone-note h4{font-size:.92rem;margin-bottom:10px;color:var(--brand-2)}.phone-note p{font-size:.84rem;color:var(--muted);margin-bottom:12px;line-height:1.6}.phone-note ul{list-style:none;font-size:.82rem;color:var(--muted)}.phone-note li{padding:6px 0 6px 20px;position:relative;border-bottom:1px solid var(--line)}.phone-note li:before{content:"✓";position:absolute;left:0;color:var(--vacant);font-weight:700}.cctv-frame{position:relative;background:#0a0f1a;border:1px solid var(--line);border-radius:12px;overflow:hidden;aspect-ratio:16 / 10}.cctv-frame svg{width:100%;height:100%;display:block}.cctv-hud{position:absolute;top:10px;left:12px;font-family:Space Mono;font-size:.7rem;color:var(--scan);text-shadow:0 0 8px rgba(21,199,232,.5)}.cctv-hud .rec{display:inline-flex;align-items:center;gap:5px;color:var(--occupied)}.cctv-hud .rec:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--occupied);animation:pulse 1.4s infinite}.cctv-time{position:absolute;top:10px;right:12px;font-family:Space Mono;font-size:.7rem;color:#fff9}.cctv-scanline{position:absolute;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--scan),transparent);box-shadow:0 0 12px var(--scan);top:8%;animation:cctvscan 2.6s linear infinite;pointer-events:none}@keyframes cctvscan{0%{top:8%}50%{top:92%}to{top:8%}}.cam-list{display:flex;flex-direction:column;gap:8px}.cam-btn{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:9px;background:var(--panel-2);border:1px solid var(--line);cursor:pointer;font-size:.8rem;transition:.14s;color:var(--txt);text-align:left;width:100%}.cam-btn:hover{border-color:var(--line-2)}.cam-btn.active{background:#2e6be626;border-color:#2e6be666}.cam-btn .cst{width:8px;height:8px;border-radius:50%;background:var(--vacant);flex-shrink:0}.cam-btn .cst.off{background:var(--muted-2)}.cam-btn .cst.degraded{background:var(--amber)}.cam-btn .meta{margin-left:auto;font-size:.66rem;color:var(--muted-2);font-family:Space Mono}.det-list{display:flex;flex-direction:column;gap:7px;font-size:.76rem}.det{display:flex;align-items:center;gap:9px;padding:8px 10px;background:var(--panel-2);border-radius:8px;border:1px solid var(--line)}.det .cls{font-weight:600}.det .conf{margin-left:auto;font-family:Space Mono;color:var(--scan)}.det .bx{width:9px;height:9px;border-radius:2px;border:2px solid var(--scan)}.roi-grid{display:grid;gap:5px;background:var(--panel-2);padding:14px;border-radius:12px;border:1px solid var(--line);-webkit-user-select:none;user-select:none}.roi-cell{aspect-ratio:1.5 / 1;border-radius:5px;border:1.5px dashed var(--line-2);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.56rem;font-family:Space Mono;color:var(--muted-2);transition:.12s}.roi-cell:hover{border-color:var(--brand)}.roi-cell.set{border-style:solid;background:#16c7841f;border-color:var(--vacant);color:#7ef0bd}.roi-cell.set.ev{background:#7c5cff24;border-color:var(--ev);color:#b9a8ff}.roi-cell.set.disabled{background:#2e93fb24;border-color:var(--disabled);color:#9fccff}.tool-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.tool-btn{background:var(--panel-2);border:1px solid var(--line);color:var(--muted);padding:8px 13px;border-radius:8px;font-size:.78rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px}.tool-btn.active{background:var(--brand);color:#fff;border-color:var(--brand)}.tool-btn i{width:11px;height:11px;border-radius:3px;display:inline-block}.tool-btn:disabled{opacity:.5;cursor:not-allowed}.diag{display:flex;flex-direction:column;gap:12px}.diag-cam{background:var(--panel-2);border:1px solid var(--line);border-radius:12px;padding:16px}.diag-cam .dh{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.diag-cam .dh b{font-size:.88rem}.diag-cam .dh .verdict{font-size:.72rem;font-weight:700;padding:4px 11px;border-radius:20px}.v-ok{background:#16c78424;color:var(--vacant)}.v-warn{background:#ffb02024;color:var(--amber)}.v-bad{background:#ff4d5e24;color:var(--occupied)}.metric{margin-bottom:9px}.metric .ml{display:flex;justify-content:space-between;font-size:.74rem;color:var(--muted);margin-bottom:4px}.metric .mbar{height:6px;border-radius:4px;background:var(--panel-3);overflow:hidden}.metric .mbar i{display:block;height:100%;border-radius:4px;transition:1s}.pl-flow{display:flex;align-items:stretch;gap:0;overflow-x:auto;padding:6px 0}.pl-node{flex:1;min-width:140px;background:var(--panel-2);border:1px solid var(--line);border-radius:12px;padding:16px;text-align:center;position:relative}.pl-node.down{border-color:#ff4d5e66}.pl-node .ic{font-size:1.3rem;margin-bottom:8px}.pl-node h5{font-size:.82rem;font-weight:700;margin-bottom:8px}.pl-node .stt{font-family:Space Mono;font-size:.68rem;color:var(--muted);line-height:1.7}.pl-node .stt b{color:var(--scan)}.pl-node .hb{position:absolute;top:10px;right:10px;width:7px;height:7px;border-radius:50%;background:var(--vacant);animation:pulse 1.6s infinite}.pl-node.down .hb{background:var(--occupied)}.pl-arrow{display:flex;align-items:center;color:var(--brand-2);font-size:1.3rem;padding:0 6px;flex-shrink:0;animation:flow 1.4s linear infinite}@keyframes flow{0%{opacity:.25}50%{opacity:1}to{opacity:.25}}.fb-list{display:flex;flex-direction:column;gap:10px}.fb-item{display:flex;align-items:center;gap:12px;background:var(--panel-2);border:1px solid var(--line);border-radius:10px;padding:12px 14px;font-size:.82rem}.fb-item .ty{font-size:.68rem;font-weight:700;padding:3px 9px;border-radius:6px;flex-shrink:0}.ty-fv{background:#ffb02024;color:var(--amber)}.ty-fo{background:#ff4d5e24;color:var(--occupied)}.fb-item .sl{font-family:Space Mono;color:var(--txt)}.fb-item .cam{margin-left:auto;font-size:.68rem;color:var(--muted-2);font-family:Space Mono}.btn-primary{background:var(--brand);color:#fff;border:none;padding:9px 16px;border-radius:9px;font-size:.82rem;font-weight:600;cursor:pointer}.btn-primary:hover{background:var(--brand-2)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.mininote{font-size:.72rem;color:var(--muted-2);margin-top:10px;line-height:1.6;border-top:1px solid var(--line);padding-top:10px}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%);background:var(--panel-3);border:1px solid var(--line-2);color:var(--txt);padding:12px 20px;border-radius:10px;font-size:.84rem;z-index:50;box-shadow:0 8px 30px #00000080;opacity:0;transition:.3s;pointer-events:none}.toast.show{opacity:1;bottom:34px}.state-msg{padding:40px;text-align:center;color:var(--muted);font-size:.9rem}.login-wrap{height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 30% 20%,#0e1626,#070c18)}.login-card{width:380px;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:32px;box-shadow:0 24px 60px #00000080}.login-card .brand{border:none;padding:0 0 18px;margin-bottom:18px;border-bottom:1px solid var(--line)}.login-card label{display:block;font-size:.74rem;color:var(--muted);margin:14px 0 6px;font-weight:600}.login-card input{width:100%;background:var(--panel-2);border:1px solid var(--line);border-radius:9px;padding:11px 13px;color:var(--txt);font-size:.88rem;font-family:inherit}.login-card input:focus{outline:none;border-color:var(--brand)}.login-card .btn-primary{width:100%;margin-top:20px;padding:12px}.login-demo{margin-top:16px;font-size:.74rem;color:var(--muted-2);background:var(--panel-2);border:1px solid var(--line);border-radius:9px;padding:11px 13px;line-height:1.7}.login-demo b{color:var(--brand-2);font-family:Space Mono}.login-err{margin-top:14px;color:var(--occupied);font-size:.78rem}@media (max-width: 880px){.app{grid-template-columns:1fr;grid-template-areas:"top" "main"}.side{display:none}}