*{box-sizing:border-box}body{margin:0;padding:20px;background:#edf2f4;color:#354756;font:12px Manrope,Arial,sans-serif}button,input,select{font:inherit}button{cursor:pointer;border:0;border-radius:9px;padding:10px 14px;background:#e4edf2;color:#345b73;transition:background .25s,transform .25s}button:hover{background:#d7e5ed}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #557d96;outline-offset:2px}input,select{padding:10px;border:1px solid #dce5e9;border-radius:8px;background:#fff;color:#354756;min-width:0}button[aria-pressed=true],.primary{background:#688e9e;color:#fff}small{display:block;font-size:9px;line-height:1.6;letter-spacing:.07em;opacity:.7;margin-top:5px}.lab-top{display:flex;align-items:center;justify-content:space-between}.lab-top b{font-size:17px;font-weight:500}.platform-switch{display:flex;width:max-content;background:#fff9;border-radius:30px;padding:5px;gap:5px;margin:18px auto 10px}.platform-switch button{border-radius:24px;background:none}.platform-switch button[aria-pressed=true]{background:#688e9e;color:white}.guide{text-align:center;font-size:11px;line-height:1.7;margin-bottom:18px}.web-shell{display:grid;grid-template-columns:158px minmax(0,1fr);height:530px;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 10px 40px #2d465011}.sidebar{background:#f3f7f8;padding:18px 10px;border-right:1px solid #e4ebee}.brand{font-weight:600;font-size:15px;margin:4px 8px 28px;color:#557b88}.sidebar button{display:block;width:100%;text-align:left;background:none;margin:4px 0;font-size:11px;padding:12px 10px}.sidebar button[aria-pressed=true]{background:#e0eeeb;color:#3f7368}.sidebar small{margin:20px 10px 8px}.web-main{min-width:0;overflow:auto}.web-bar{padding:16px 20px;display:flex;justify-content:space-between;border-bottom:1px solid #edf1f3;font-size:11px}.crumb{padding:10px 20px;background:#fafcfc;font-size:10px;border-bottom:1px solid #edf1f3}.content{padding:18px}.toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}.toolbar input{flex:1;min-width:110px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:11px;white-space:nowrap}th{text-align:left;font-size:10px;color:#82919b;font-weight:500}td,th{padding:15px 10px;border-bottom:1px solid #edf1f3}td button{font-size:10px;padding:7px 10px}.pill{padding:5px 9px;border-radius:6px;background:#e7f2ee;color:#527f73;font-size:10px}.pill.warn{background:#f8eee0;color:#947545}.map{height:310px;position:relative;border-radius:12px;overflow:hidden;background:linear-gradient(30deg,transparent 45%,#fff 46%,#fff 49%,transparent 50%),linear-gradient(110deg,#eaf0df 30%,#f4f1e6 31%,#f4f1e6 62%,#dceaf0 63%);background-size:120px 160px,100% 100%}.map:before{content:'DEMONSTRATION CAMPUS · SCHEMATIC MAP';position:absolute;bottom:15px;left:15px;font-size:9px;letter-spacing:.1em;color:#819298}.pin{position:absolute;border-radius:30px;background:#779b9c;color:white;box-shadow:0 0 0 6px #fff8;font-size:11px}.map-label{position:absolute;top:18px;left:16px;background:#fffc;padding:10px;border-radius:8px;font-size:10px}.device-list{display:grid;grid-template-columns:180px minmax(0,1fr);gap:18px}.device-list aside button{width:100%;text-align:left;display:block;margin-bottom:6px;font-size:10px;background:#f1f6f7}.device-list aside button[aria-pressed=true]{background:#dfede9;color:#426d61}.info{padding:16px;border-radius:12px;background:#f8fafb;line-height:1.9}.metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:14px}.metric{border:1px solid #e8edf0;background:white;border-radius:14px;padding:16px;text-align:left;color:#455c6b;cursor:pointer;display:flex;align-items:center;gap:13px;width:100%}.metric strong{font-size:21px;display:block;font-weight:600;margin:6px 0}.metric small{font-size:9px;letter-spacing:0}.metric-icon{width:36px;height:36px;flex:none;display:grid;place-items:center;border-radius:12px;background:#f5e5e6;color:#b97e85;font-size:21px}.metric:nth-child(2n) .metric-icon{background:#e3eef2;color:#7d9baa}.metric:nth-child(3n) .metric-icon{background:#e7efe4;color:#8b9f7e}.phone-shell{width:340px;margin:auto;padding:8px;background:#d5e0e5;border-radius:34px;box-shadow:0 20px 45px #3c596215}.phone-screen{background:#f6f8fa;border-radius:27px;overflow:hidden;position:relative;height:540px;display:flex;flex-direction:column}.status-bar{padding:11px 20px 6px;font-size:9px;display:flex;justify-content:space-between;background:#f5eee7}.phone-header{background:linear-gradient(#f4eee7,#dfecef);padding:12px 17px;display:flex;justify-content:space-between;align-items:center;font-size:18px;font-weight:600}.phone-header button{background:#fff6;padding:8px;font-size:12px}.phone-content{overflow:auto;padding:16px;flex:1;background:linear-gradient(#dfecef 0,#f6f8fa 110px)}.phone-content .metrics{grid-template-columns:1fr;margin-top:16px;gap:12px}.phone-content .metric{min-height:92px;box-shadow:0 3px 7px #324e5c05}.phone-content .metric strong{font-size:21px}.phone-content .identity{font-size:11px;margin-bottom:18px;line-height:1.8}.phone-nav{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border-top:1px solid #e8edf1;padding:9px 4px}.phone-nav button{background:none;font-size:9px;padding:5px;color:#8b929e}.phone-nav button span{display:block;font-size:18px;margin-bottom:5px}.phone-nav button[aria-pressed=true]{color:#8271a5;background:#f1edf7}.phone-title{display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:16px;font-weight:600}.phone-title button{font-size:10px}.event-card{background:#fff;border-radius:13px;padding:15px;margin:12px 0;line-height:1.8;box-shadow:0 3px 10px #273f4c05}.event-card button{margin-top:12px}.settings button{display:flex;justify-content:space-between;width:100%;background:white;border-bottom:1px solid #edf0f2;border-radius:0;padding:16px;font-size:12px}.avatar{width:58px;height:58px;border-radius:50%;background:#e6dfef;color:#8b7ba5;display:grid;place-items:center;font-size:24px;margin:10px auto}.profile{text-align:center;margin-bottom:22px}.detail-tabs{display:flex;gap:5px;background:#edf0f4;border-radius:20px;padding:4px;margin:16px 0}.detail-tabs button{padding:7px 10px;border-radius:20px;font-size:10px;background:none;flex:1}.detail-tabs button[aria-pressed=true]{background:#fff;color:#4f6478}.rings{display:flex;justify-content:space-around;gap:16px;margin:22px 0}.ring{text-align:center}.ring strong{display:grid;place-items:center;width:100px;height:100px;border:10px solid #e8d5da;border-top-color:#b78992;border-radius:50%;font-size:25px;color:#a87e88}.ring:nth-child(2) strong{border-color:#dbe7ee;border-top-color:#789eb8;color:#789eb8}.ring small{margin-top:10px}.chart{width:100%;height:85px;background:repeating-linear-gradient(to bottom,#fff,#fff 20px,#edf1f3 21px)}.split-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.split-title h3{margin:0;font-size:16px}.empty{padding:25px;line-height:1.8;text-align:center}.quiet{font-size:11px;line-height:1.8;color:#7b8992}#feedback{padding:13px 16px;background:#e1eaf0;border-radius:12px;font-size:11px;line-height:1.7}footer{font-size:9px;line-height:1.7;opacity:.65}dialog{border:1px solid white;border-radius:20px;padding:24px;background:#f5f8fa;color:#354756;width:min(430px,90vw);max-height:85vh;overflow:auto;box-shadow:0 25px 70px #172e4a30}dialog::backdrop{background:#263c5260;backdrop-filter:blur(5px)}dialog h2{font-size:19px;font-weight:500}dialog p{line-height:1.8}dialog button{margin:8px 4px 0 0}dialog select{width:100%;margin:10px 0}.camera{background:#dfe6eb;height:130px;border-radius:12px;display:grid;place-items:center;text-align:center;margin:12px 0;color:#718593}.slider{display:block;margin:15px 0}.slider input{width:100%}.screen-enter{animation:enter .35s ease both}@keyframes enter{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}html{scrollbar-width:none}::-webkit-scrollbar{width:0}@media(max-width:600px){body{padding:12px}.web-shell{grid-template-columns:1fr;height:610px}.sidebar{display:flex;overflow:auto;padding:7px;gap:4px;border-bottom:1px solid #e1e9ed}.sidebar .brand,.sidebar small{display:none}.sidebar button{white-space:nowrap;width:auto;margin:0;font-size:9px;padding:9px}.web-main{height:550px}.content{padding:10px}.device-list{grid-template-columns:1fr}.device-list aside{display:flex;overflow:auto;gap:5px}.device-list aside button{min-width:110px}.metrics{grid-template-columns:1fr}.phone-shell{width:min(340px,100%)}.phone-screen{height:580px}.toolbar{gap:5px}.toolbar button{font-size:10px}.web-bar{padding:12px}.guide{font-size:10px}}@media(prefers-reduced-motion:reduce){.screen-enter{animation:none}}