*{box-sizing:border-box}body{margin:0;font-family:Inter,Arial,sans-serif;background:#eef2f7;color:#0f172a;display:flex;min-height:100vh}.sidebar{width:270px;background:#07111f;color:white;padding:22px;display:flex;flex-direction:column;gap:20px;position:sticky;top:0;height:100vh}.brand{display:flex;gap:12px;align-items:center}.brand-icon{width:46px;height:46px;border-radius:16px;background:#10b981;display:grid;place-items:center;font-size:22px}.brand span{display:block;color:#94a3b8;font-size:12px}.role-switch{display:grid;grid-template-columns:1fr 1fr;background:#111c2d;border-radius:16px;padding:4px}.role-switch button,.sidebar nav button,.reset{border:0;color:#cbd5e1;background:transparent;padding:12px;border-radius:12px;cursor:pointer;text-align:left;font-weight:700}.role-switch button{text-align:center}.role-switch .active,.sidebar nav .active{background:#10b981;color:white}.sidebar nav{display:flex;flex-direction:column;gap:6px}.reset{margin-top:auto;background:#111c2d}.main{flex:1;padding:28px;overflow:auto}.page{display:none}.page.active{display:block}.header{margin-bottom:22px}.header small{color:#10b981;font-weight:900;letter-spacing:.18em;text-transform:uppercase}.header h1{font-size:34px;margin:6px 0}.header p{color:#64748b;margin:0}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px}.card,.panel{background:#fff;border:1px solid #e2e8f0;border-radius:24px;box-shadow:0 12px 40px rgba(15,23,42,.06)}.card{padding:20px;display:flex;justify-content:space-between;align-items:center}.card span{color:#64748b;font-size:14px}.card b{display:block;margin-top:8px;font-size:28px}.green{color:#059669}.red{color:#dc2626}.grid{display:grid;grid-template-columns:1.45fr .75fr;gap:20px}.panel{padding:20px}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}.panel h3{margin:0 0 12px}.panel-head h3{margin:0}.panel-head p{margin:4px 0 0;color:#64748b;font-size:13px}.ghost,.primary{border:0;border-radius:14px;padding:11px 14px;font-weight:900;cursor:pointer;display:inline-flex;align-items:center;gap:8px}.ghost{background:#f1f5f9;color:#334155}.primary{background:#10b981;color:#fff}.primary.redbtn{background:#dc2626}.map{height:620px;position:relative;overflow:hidden;border-radius:22px;border:1px solid #cbd5e1;background-color:#f8fafc;background-image:linear-gradient(90deg,#e2e8f0 1px,transparent 1px),linear-gradient(#e2e8f0 1px,transparent 1px);background-size:28px 28px}.map.has-image{background-size:100% 100%;background-position:center;background-repeat:no-repeat;background-image:var(--denah-img);background-color:#fff}.room{position:absolute;border:2px solid #cbd5e1;background:rgba(255,255,255,.75);border-radius:18px;padding:14px;color:#64748b;font-weight:900}.room-a{left:8%;top:12%;width:34%;height:30%}.room-b{left:48%;top:14%;width:39%;height:28%}.room-c{left:18%;top:54%;width:68%;height:32%}.dot{position:absolute;transform:translate(-50%,-50%);width:32px;height:32px;border-radius:50%;border:4px solid #fff;color:white;box-shadow:0 10px 25px rgba(0,0,0,.22);display:grid;place-items:center;cursor:pointer;font-weight:900}.dot.safe{background:#10b981}.dot.alert{background:#dc2626;animation:pulse 1.3s infinite}.dot.selected{outline:4px solid #f59e0b}@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(220,38,38,.45)}70%{box-shadow:0 0 0 14px rgba(220,38,38,0)}100%{box-shadow:0 0 0 0 rgba(220,38,38,0)}}.side{display:flex;flex-direction:column;gap:20px}.status{border-radius:999px;padding:5px 10px;font-size:12px;font-weight:900}.status.safe{background:#dcfce7;color:#047857}.status.alert{background:#fee2e2;color:#dc2626}.point-card{border-radius:18px;padding:16px;background:#f8fafc}.point-card.alert{background:#fef2f2}.point-title,.list-item{display:flex;justify-content:space-between;align-items:center;gap:10px}.list{display:flex;flex-direction:column;gap:10px}.list-item{border:1px solid #e2e8f0;background:#fff;border-radius:16px;padding:13px;text-align:left;cursor:pointer}.list-item span{display:block;color:#64748b;font-size:13px}.form-layout{display:grid;grid-template-columns:1fr 1fr;gap:20px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}label{font-size:13px;font-weight:900;color:#475569}input,select,textarea{width:100%;margin-top:7px;border:1px solid #cbd5e1;border-radius:14px;padding:12px;font:inherit;background:white}input:disabled{background:#f1f5f9;color:#64748b}textarea{min-height:90px}.wide{grid-column:1/-1}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:14px}th,td{text-align:left;padding:12px;border-bottom:1px solid #e2e8f0}th{color:#64748b;background:#f8fafc}.empty{color:#64748b}.toast{position:fixed;right:20px;bottom:20px;background:#07111f;color:white;padding:14px 18px;border-radius:16px;box-shadow:0 12px 40px rgba(0,0,0,.25);z-index:99}@media(max-width:1000px){body{flex-direction:column}.sidebar{width:100%;height:auto;position:relative}.stats,.grid,.form-layout{grid-template-columns:1fr}.main{padding:18px}.map{height:360px}.form-grid{grid-template-columns:1fr}}