:root{font-family:Inter,"Pretendard","Noto Sans KR","Malgun Gothic",sans-serif;color:#17242d;background:#eef2f3;font-synthesis:none;--ink:#17242d;--muted:#687781;--line:#d7e0e2;--paper:#fff;--nav:#12232c;--cyan:#18a8bf;--green:#149e85;--amber:#e49a35;--coral:#e65f68;--soft:#f5f8f8}*{box-sizing:border-box}body{margin:0;min-width:1120px;background:#eef2f3;color:var(--ink)}button,select{font:inherit}.topbar{height:72px;background:var(--nav);color:#fff;display:grid;grid-template-columns:270px 1fr auto;align-items:center;padding:0 22px;border-bottom:3px solid #1e3a46}.brand{display:grid;grid-template-columns:auto auto;align-items:end;gap:7px;text-decoration:none;color:#fff;width:max-content}.brand b{font-size:21px;color:#4ed7e8}.brand span{font-size:21px;font-weight:800}.brand small{grid-column:1/3;color:#8fa7b2;font-size:10px;text-transform:uppercase;margin-top:2px}.primary-nav{height:100%;display:flex;align-items:stretch;gap:2px}.primary-nav button,.primary-nav a{border:0;background:transparent;color:#a9bbc3;text-decoration:none;padding:0 22px;font-weight:700;cursor:pointer;display:flex;align-items:center;border-bottom:3px solid transparent}.primary-nav button:hover,.primary-nav a:hover,.primary-nav button.active{color:#fff;background:#19313c;border-color:#43c9db}.top-actions{display:flex;align-items:center;gap:12px}.platform-state{display:flex;align-items:center;gap:8px;color:#a9bbc3;font-size:13px}.platform-state i{width:9px;height:9px;border-radius:50%;background:#e65f68}.platform-state.online i{background:#32c997}.platform-state.online b{color:#d9eeea}.icon-button{width:38px;height:38px;border:1px solid #3d5965;background:#18313d;color:#bfe9ef;font-size:21px;cursor:pointer}.app-shell{display:grid;grid-template-columns:240px 1fr;min-height:calc(100vh - 72px)}.sidebar{background:#f9fbfb;border-right:1px solid var(--line);padding:22px 16px;display:flex;flex-direction:column;gap:24px}.sidebar label,.sidebar section>span,.sidebar footer>span{display:block;color:#77858d;font-size:11px;font-weight:800;text-transform:uppercase;margin-bottom:9px}.sidebar select{width:100%;height:39px;border:1px solid #c9d4d7;background:#fff;padding:0 10px;color:var(--ink);font-weight:700}.segmented{display:flex;border:1px solid #c9d4d7;background:#fff}.segmented button{height:34px;flex:1;border:0;border-right:1px solid #dbe3e5;background:#fff;color:#66757d;font-size:12px;font-weight:700;cursor:pointer}.segmented button:last-child{border-right:0}.segmented button.active{background:#173d49;color:#fff}.site-list-section{min-height:240px}.side-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:12px;color:#65737b}.side-heading b{background:#e3ecee;color:#33515d;padding:2px 7px}.device-list{display:flex;flex-direction:column;gap:4px}.device-row{border:1px solid transparent;background:transparent;display:grid;grid-template-columns:9px 1fr auto;gap:9px;align-items:center;text-align:left;padding:10px 8px;cursor:pointer;min-width:0}.device-row:hover{background:#eef5f5}.device-row.selected{background:#e7f5f4;border-color:#8dcfc7}.device-row>i{width:8px;height:8px;border-radius:50%;background:#aab5ba}.device-row>i.configured{background:#22b58c}.device-row span{min-width:0}.device-row b,.device-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.device-row b{font-size:13px}.device-row small{font-size:10px;color:#77868d;margin-top:3px}.device-row em{font-style:normal;font-size:9px;color:#168974;font-weight:800}.empty-text{color:#8b999f;font-size:13px;text-align:center;padding:22px}.sidebar footer{margin-top:auto;border-top:1px solid var(--line);padding-top:18px;display:grid;gap:6px}.sidebar footer a{padding:8px 9px;text-decoration:none;color:#52626b;font-size:12px;font-weight:700}.sidebar footer a:hover{background:#eaf1f2}.content{padding:28px;min-width:0}.view{display:none}.view.active{display:block}.page-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:22px}.page-heading>div>span,.panel header>div>span{display:block;color:var(--cyan);font-size:10px;font-weight:900;letter-spacing:.08em}.page-heading h1{font-size:28px;margin:4px 0 5px;letter-spacing:0}.page-heading p{margin:0;color:#6e7c84;font-size:13px}.heading-badge{display:grid;grid-template-columns:10px auto;align-items:center;gap:3px 8px;border-left:3px solid var(--green);padding:8px 12px;background:#fff}.heading-badge i{width:8px;height:8px;border-radius:50%;background:#25b98f;grid-row:1/3}.heading-badge span{font-size:10px;color:#77868e}.heading-badge b{font-size:13px}.metric-strip{display:grid;grid-template-columns:repeat(5,1fr);background:#fff;border:1px solid var(--line);margin-bottom:18px}.metric-strip article{position:relative;padding:17px 19px;border-right:1px solid var(--line);min-height:112px}.metric-strip article:last-child{border-right:0}.metric-strip span{display:block;color:#68777f;font-size:12px;font-weight:700}.metric-strip strong{font-size:34px;line-height:1.3}.metric-strip small{font-size:13px;margin-left:3px;color:#708087}.metric-strip em{position:absolute;right:15px;bottom:14px;font-size:10px;color:#149e85;font-style:normal;font-weight:800}.metric-strip .entry strong{color:var(--cyan)}.metric-strip .exit strong{color:var(--amber)}.metric-strip .warning strong{color:var(--coral)}.overview-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(360px,.9fr);gap:18px;margin-bottom:18px}.panel{background:#fff;border:1px solid var(--line);min-width:0}.panel>header{height:62px;padding:14px 17px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.panel h2{font-size:16px;margin:3px 0 0;letter-spacing:0}.panel>header>b{font-size:11px;color:#64737b}.panel>header button{border:0;background:transparent;color:#148da1;font-size:11px;font-weight:800;cursor:pointer}.legend{font-size:10px;color:#738189;display:flex;align-items:center;gap:5px}.legend i{width:9px;height:9px;margin-left:8px}.legend i.in{background:var(--cyan)}.legend i.out{background:var(--amber)}.bar-chart{height:230px;padding:24px 18px 14px;display:flex;align-items:stretch;justify-content:space-between;background:repeating-linear-gradient(to bottom,#fff 0,#fff 45px,#edf1f2 46px)}.hour-column{display:grid;grid-template-rows:1fr 20px;width:6.8%;height:100%}.bars{display:flex;align-items:end;justify-content:center;gap:3px;height:100%}.bars i,.bars b{display:block;width:9px;min-height:3px}.bars i{background:var(--cyan)}.bars b{background:var(--amber)}.hour-column>span{text-align:center;color:#849198;font-size:9px;padding-top:6px}.live-panel{grid-row:span 2}.live-state{padding:4px 7px;background:#e8eff0;color:#68767d!important}.live-state.streaming{background:#dff3eb;color:#16886f!important}.live-stage{height:284px;background:#15262f;display:flex;align-items:center;justify-content:center;color:#91a6af;font-size:12px;overflow:hidden}.live-stage iframe{width:100%;height:100%;border:0;background:#000}.live-panel>footer{height:48px;display:flex;justify-content:space-between;align-items:center;padding:0 14px;border-top:1px solid var(--line)}.live-panel>footer span{font-size:10px;color:#6c7b82}.live-panel>footer button{height:30px;border:0;background:#163b47;color:#fff;padding:0 14px;font-weight:700;cursor:pointer}.live-panel>footer button:disabled{opacity:.4;cursor:not-allowed}.occupancy-panel{min-height:208px}.line-chart{height:145px;position:relative;padding:12px 14px 24px;background:repeating-linear-gradient(to bottom,#fff 0,#fff 35px,#edf1f2 36px)}.line-chart svg{width:100%;height:100%;overflow:visible}.chart-axis{position:absolute;left:14px;right:14px;bottom:6px;display:flex;justify-content:space-between;color:#87949a;font-size:9px}.zone-list{padding:8px 15px}.zone-row{display:grid;grid-template-columns:8px 1fr auto;align-items:center;gap:10px;padding:11px 2px;border-bottom:1px solid #edf1f2}.zone-row:last-child{border-bottom:0}.zone-row>i{width:7px;height:7px;border-radius:50%}.zone-row>i.good{background:#21b58b}.zone-row>i.warn{background:#e9a33f}.zone-row>i.danger{background:#ed646d}.zone-row>i.muted{background:#a3afb4}.zone-row b,.zone-row small{display:block}.zone-row b{font-size:12px}.zone-row small{font-size:10px;color:#7c8990;margin-top:2px}.zone-row em{font-size:11px;font-style:normal;font-weight:800}.recent-panel{margin-bottom:20px}.event-list{display:grid;grid-template-columns:1fr 1fr}.activity-row{min-height:70px;display:grid;grid-template-columns:5px 1fr auto;gap:12px;padding:14px 17px;border-bottom:1px solid #e8edef}.activity-row:nth-child(odd){border-right:1px solid #e8edef}.activity-row>i{width:4px;background:#829099}.activity-row>i.in{background:var(--cyan)}.activity-row>i.out{background:var(--amber)}.activity-row>i.danger{background:var(--coral)}.activity-row>i.warn{background:#bd8a37}.activity-row b,.activity-row small{display:block}.activity-row b{font-size:12px}.activity-row small{font-size:10px;color:#7b8990;margin-top:4px}.activity-row>em{text-align:right;font-style:normal;font-size:10px;color:#51626a}.site-summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:18px}.site-summary{background:#fff;border:1px solid var(--line);text-align:left;padding:0;cursor:pointer}.site-summary:hover{border-color:#55b6c3}.site-summary header{height:50px;border-bottom:1px solid var(--line);padding:0 15px;display:flex;align-items:center;justify-content:space-between}.site-summary header span{display:flex;align-items:center;gap:8px}.site-summary header i{width:8px;height:8px;border-radius:50%;background:#1bb48b}.site-summary header em{font-size:10px;color:#76858c;font-style:normal}.site-summary>strong{display:block;font-size:32px;padding:18px 17px 10px}.site-summary>strong small{font-size:11px;color:#7a888f;margin-left:5px}.site-summary dl{display:grid;grid-template-columns:repeat(3,1fr);margin:0;border-top:1px solid var(--line)}.site-summary dl div{padding:10px 13px;border-right:1px solid var(--line)}.site-summary dl div:last-child{border-right:0}.site-summary dt{font-size:9px;color:#7c898f}.site-summary dd{margin:3px 0 0;font-weight:800}.map-panel{min-height:480px}.flow-map{height:410px;position:relative;overflow:hidden;background-color:#f6f8f5;background-image:linear-gradient(90deg,transparent 49%,#dce5e4 50%,transparent 51%),linear-gradient(0deg,transparent 49%,#dce5e4 50%,transparent 51%);background-size:190px 150px}.flow-map:before,.flow-map:after{content:"";position:absolute;border:24px solid #e3e9e7;background:#f9fbfa}.flow-map:before{left:8%;top:15%;width:30%;height:45%}.flow-map:after{right:8%;bottom:12%;width:36%;height:36%}.map-label{position:absolute;left:18px;top:16px;color:#819099;font-size:10px;font-weight:800;z-index:1}.flow-pin{position:absolute;transform:translate(-50%,-50%);z-index:2;border:1px solid #c9d6d5;background:#fff;padding:8px 10px;text-align:left;box-shadow:0 3px 10px #1a34351c;cursor:pointer}.flow-pin i{display:inline-block;width:8px;height:8px;border-radius:50%;background:#a8b3b6;margin-right:5px}.flow-pin.ready i{background:#1bb48b}.flow-pin span,.flow-pin small{display:block}.flow-pin span{font-size:11px;font-weight:800}.flow-pin small{font-size:9px;color:#7b898f;margin-top:2px}.analytics-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:18px}.analytics-grid .wide{grid-row:span 2}.heat-grid{height:310px;padding:24px;display:grid;grid-template-columns:repeat(8,1fr);gap:8px}.heat-grid div{background:color-mix(in srgb,var(--cyan) calc(var(--level)*100%),#edf3f4);display:flex;align-items:flex-end;padding:8px;min-height:68px}.heat-grid span{font-size:10px;color:#45616b;font-weight:800}.donut-wrap{display:grid;grid-template-columns:145px 1fr;align-items:center;padding:26px}.donut{--ratio:0deg;width:130px;height:130px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--cyan) 0 var(--ratio),var(--amber) var(--ratio) 360deg);position:relative}.donut:after{content:"";position:absolute;width:78px;height:78px;border-radius:50%;background:#fff}.donut span{z-index:1;font-size:20px;font-weight:900}.donut-wrap dl div{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid #e8edef}.donut-wrap dt{font-size:11px;color:#77858c}.donut-wrap dd{margin:0;font-size:12px;font-weight:800}.insight-list{padding:12px 17px}.insight-list div{display:grid;grid-template-columns:1fr auto;padding:13px 0;border-bottom:1px solid #e8edef}.insight-list span{font-size:11px;color:#77858c}.insight-list b{font-size:16px}.insight-list small{grid-column:1/3;margin-top:3px;color:#8a969b;font-size:9px}.alert-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.alert-toolbar .segmented{width:300px}.alert-toolbar>b{font-size:13px}.alert-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.alert-item{background:#fff;border:1px solid var(--line)}.alert-image{height:175px;background:#15262f;display:grid;place-items:center;color:#ff98a0;font-weight:900;overflow:hidden}.alert-image img{width:100%;height:100%;object-fit:cover}.alert-item>div:last-child{padding:16px}.alert-item>div>span{color:var(--coral);font-size:10px;font-weight:900}.alert-item h2{font-size:16px;margin:5px 0}.alert-item p{font-size:11px;color:#697880;min-height:34px}.alert-item footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:10px;font-size:9px;color:#7a888f}.alert-item footer b{color:#465860}.toast{position:fixed;right:22px;bottom:22px;background:#17323d;color:#fff;padding:12px 16px;font-size:12px;opacity:0;transform:translateY(8px);pointer-events:none;transition:.18s}.toast.visible{opacity:1;transform:none}.toast.error{background:#a53d45}[hidden]{display:none!important}@media(max-width:1280px){.overview-grid{grid-template-columns:minmax(0,1.45fr) 340px}.metric-strip article{padding:14px}.site-summary-grid,.alert-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:900px){body{min-width:0}.topbar{height:auto;min-height:68px;grid-template-columns:1fr auto;padding:12px 14px}.primary-nav{grid-column:1/3;order:3;overflow-x:auto}.primary-nav button,.primary-nav a{height:40px;padding:0 14px;white-space:nowrap}.app-shell{display:block}.sidebar{display:none}.content{padding:16px}.overview-grid,.analytics-grid{grid-template-columns:1fr}.live-panel{grid-row:auto}.metric-strip{grid-template-columns:repeat(2,1fr)}.metric-strip article{border-bottom:1px solid var(--line)}.site-summary-grid,.alert-grid{grid-template-columns:1fr}.event-list{grid-template-columns:1fr}.activity-row:nth-child(odd){border-right:0}.page-heading{align-items:flex-start}.heading-badge{display:none}}
/* Responsive people-flow controls */
.mobile-controls{display:none}
@media(max-width:900px){
  .brand b,.brand span{font-size:18px}.top-actions .platform-state b{display:none}
  .content{padding:14px}.mobile-controls{display:grid;grid-template-columns:1fr 1.35fr;gap:8px;margin-bottom:16px;padding:10px;background:#fff;border:1px solid var(--line)}
  .mobile-controls label{font-size:9px;color:#708087;font-weight:800}.mobile-controls select{display:block;width:100%;height:38px;margin-top:5px;border:1px solid #c9d4d7;background:#fff;padding:0 8px;color:var(--ink);font-size:12px;font-weight:700}
  .live-panel{grid-column:1;grid-row:1}.live-stage{height:auto;aspect-ratio:16/9}.flow-chart-panel{grid-row:2}
  .metric-strip article{min-height:96px}.metric-strip article:last-child{grid-column:1/3}.metric-strip strong{font-size:29px}.page-heading h1{font-size:23px}
}
@media(max-width:520px){
  .topbar{padding:10px 12px}.brand small{display:none}.primary-nav button,.primary-nav a{padding:0 11px;font-size:12px}.content{padding:10px}.mobile-controls{grid-template-columns:1fr}
  .metric-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.metric-strip article{padding:12px}.metric-strip em{position:static;display:block;margin-top:4px}
  .panel>header{padding:12px;height:58px}.panel h2{font-size:14px}.live-panel>footer span{max-width:55%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .activity-row{grid-template-columns:4px minmax(0,1fr)}.activity-row>em{grid-column:2;text-align:left}.alert-toolbar{display:block}.alert-toolbar>b{display:block;margin-top:9px}
  .heat-grid{grid-template-columns:repeat(4,1fr);height:auto;padding:14px}.donut-wrap{grid-template-columns:1fr;justify-items:center}.donut-wrap dl{width:100%;margin-top:14px}.flow-map{height:320px}
}
/* Viewer-provisioned temporary portal login. */
#ccamPortalLogin { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; padding: 24px; background: rgba(4, 13, 19, .94); }
#ccamPortalLogin form { width: min(100%, 380px); display: grid; gap: 14px; padding: 30px; border: 1px solid #285166; border-radius: 8px; background: #0d202b; box-shadow: 0 18px 60px #0008; }
#ccamPortalLogin span { color: #27c7e4; font-size: 12px; font-weight: 800; letter-spacing: 1.2px; }
#ccamPortalLogin h1 { margin: 0; font-size: 25px; color: #f1f8fb; }
#ccamPortalLogin p { margin: 0; color: #9eb3c1; line-height: 1.55; }
#ccamPortalLogin label { display: grid; gap: 7px; color: #bdd0dc; font-size: 14px; }
#ccamPortalLogin input { height: 42px; box-sizing: border-box; border: 1px solid #31586b; border-radius: 4px; background: #08151d; color: #f4fbff; padding: 0 11px; font: inherit; }
#ccamPortalLogin small { min-height: 18px; color: #ff8d98; }
#ccamPortalLogin button { height: 44px; border: 0; border-radius: 4px; background: #24b9d4; color: #04232b; font-weight: 800; font-size: 15px; cursor: pointer; }