:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR",sans-serif;color:#202a38;background:#f3f5f8;font-synthesis:none;--muted:#647185;--accent:#ef593e;--line:#e4e8ed;--green:#087c61}*{box-sizing:border-box}body{margin:0}button,a,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{opacity:.4;cursor:default}a{color:inherit}button:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid #3976db;outline-offset:4px}header{background:#171d26;color:#fff;border-bottom:3px solid var(--accent)}.header-inner{max-width:1312px;padding:19px 36px;margin:auto;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;font-size:21px;font-weight:850;letter-spacing:.03em}.brand-light{font-weight:350}.brand small{display:block;font-size:10px;color:#bac2ce;letter-spacing:.2em;margin-top:2px}.header-right{display:flex;gap:22px;align-items:center}.public-label{font-size:13px;color:#b7c1cd}.share{border:1px solid #4a525e;background:transparent;color:#eef1f7;padding:10px 16px;border-radius:7px;font-size:14px}.share span{margin-left:16px}main{max-width:1312px;margin:auto;padding:36px}.page-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.eyebrow,.section-label{font-size:12px;letter-spacing:.1em;font-weight:700;color:var(--muted);margin:0 0 8px}.eyebrow{color:#d74e35}h1{font-size:30px;letter-spacing:-.04em;margin:0;font-weight:750}.subtitle{font-size:15px;color:var(--muted);margin:10px 0 0}.clock{display:flex;flex-direction:column;align-items:flex-end;gap:5px}.clock strong{font-size:23px;font-variant-numeric:tabular-nums;font-weight:600}.clock span{font-size:12px;color:var(--muted)}.status-panel{display:flex;align-items:center;gap:22px;padding:25px 30px;background:#e9edf3;border:1px solid #d6dde6;border-left:5px solid #8895a8;border-radius:10px;margin-bottom:22px;transition:background .3s}.status-panel.safe{background:#e8f5ef;border-color:#c5e4d8;border-left-color:#138965}.status-panel.alert{background:#fff0eb;border-color:#facbc0;border-left-color:#e04628}.status-symbol{width:58px;height:58px;flex-shrink:0;display:grid;place-items:center;border:1px solid currentColor;border-radius:50%;font-size:31px;color:#7a8799}.safe .status-symbol{color:var(--green)}.alert .status-symbol{color:#d14128}.status-copy{flex:1}.status-copy .section-label{letter-spacing:0;font-weight:500}.status-copy h2{font-size:25px;margin:5px 0 7px;letter-spacing:-.035em}.status-copy p{font-size:14px;color:#566779;margin:0;line-height:1.6}.status-meta{display:flex;flex-direction:column;align-items:flex-end;gap:10px;font-size:12px;color:var(--muted)}.connection{display:inline-flex;align-items:center;gap:7px;font-size:13px;border-radius:20px;padding:7px 12px;background:#fff9}.connection:before{content:"";width:6px;height:6px;background:#8b96a4;border-radius:50%}.safe .connection:before,.alert .connection:before{background:#168262}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}.metric{background:#fff;border:1px solid var(--line);border-radius:10px;padding:21px 21px 18px;min-width:0}.metric-head{display:flex;align-items:center;justify-content:space-between;gap:5px}.metric h2{font-size:15px;margin:0;font-weight:650}.sensor-name{font-size:11px;letter-spacing:.035em;color:#758297;background:#f3f5f8;border-radius:4px;padding:4px 6px}.metric-value{display:flex;align-items:baseline;gap:9px;margin:23px 0 19px;min-height:52px}.metric-value strong{font-size:47px;line-height:1;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.055em}.metric-value>span{font-size:16px;color:#8b96a4}.flame-value strong{font-size:33px;letter-spacing:-.04em}.flame-value>span{font-size:13px}.meter{height:5px;background:#edf0f5;border-radius:2px;position:relative;margin:0 0 16px}.meter>div{height:100%;width:0;border-radius:2px;background:#537bba;transition:width .5s}.meter i{height:11px;width:2px;background:#eea793;position:absolute;top:-3px}.temp-threshold{left:66.666%}.gas-threshold{left:24.44%}.metric-bottom{display:flex;gap:8px;justify-content:space-between;font-size:11px;color:#7c8797}.metric-bottom span:first-child{color:#526277}.flame-track{display:flex;gap:4px;margin-bottom:16px;height:5px}.flame-track span{flex:1;background:#e5e9ef;border-radius:2px}.flame-track.safe span{background:#72bca2}.flame-track.alert span{background:#ef684a}.humidity>p{font-size:12px;color:#8290a3;margin:-4px 0 12px;line-height:1.5;min-height:18px}.humidity .metric-value{margin-bottom:18px}.workspace-grid{display:grid;grid-template-columns:minmax(0,1.72fr) minmax(300px,1fr);gap:24px;margin-bottom:24px}.chart-panel,.device-panel,.events-panel{border:1px solid var(--line);border-radius:10px;background:white;padding:24px;min-width:0}.chart-panel{background:#1b2533;color:#f8f9fb;border-color:#1b2533;display:flex;flex-direction:column}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}.panel-heading .section-label{font-size:10px;display:block;color:#8491a2;margin:0 0 7px}.panel-heading h2{font-size:19px;letter-spacing:-.025em;margin:0}.segmented{display:flex;background:#2b3544;border:1px solid #414b59;padding:3px;border-radius:7px}.segmented button{background:transparent;border:0;border-radius:4px;color:#aab5c5;font-size:12px;padding:7px 12px}.segmented button[aria-pressed=true]{background:#ecf0f5;color:#202b3a}.chart-wrap{margin:8px -9px 0;flex:1;display:flex;align-items:center;min-height:240px}#chart{width:100%;overflow:visible;font-size:12px}.chart-foot{border-top:1px solid #35404e;padding-top:18px;display:flex;justify-content:space-between;align-items:center;color:#aab6c7;font-size:12px;gap:8px}.chart-foot i{display:inline-block;width:7px;height:7px;border-radius:2px;background:#79b4ec;margin-right:8px}.text-button{border:0;background:transparent;color:#c4d0df;font-size:12px;padding:5px}.device-count{font-size:30px;font-weight:300;color:#c2cad4}.device-row{display:flex;align-items:center;gap:12px;padding:0 0 18px;margin-bottom:18px;border-bottom:1px solid #edf0f4}.device-icon{background:#edf2f8;width:34px;height:37px;display:grid;place-items:center;border-radius:7px;font-weight:700;color:#637994;font-size:13px}.device-row>div:nth-child(2){flex:1}.device-row h3{margin:0 0 5px;font-size:14px}.device-row p{margin:0;font-size:12px;color:#758297}.pill{font-size:11px;background:#edf0f5;color:#758093;padding:5px 8px;border-radius:4px;white-space:nowrap}.pill.online{background:#e6f4ed;color:#128066}.camera-placeholder{background:repeating-linear-gradient(135deg,#f5f7fa,#f5f7fa 6px,#f1f3f7 6px,#f1f3f7 7px);border:1px dashed #d6dde7;border-radius:6px;padding:17px 18px;text-align:center;color:#748297}.camera-mark{display:block;font-size:24px;margin-bottom:5px}.camera-placeholder strong{font-size:13px;font-weight:600}.camera-placeholder p{font-size:12px;margin:7px 0 0;line-height:1.6}.device-note{font-size:12px;line-height:1.65;margin:16px 0 0;color:#7a8596}.events-panel{margin-bottom:24px}.events-panel .panel-heading{margin-bottom:16px}.secondary{font-size:12px;color:#8190a3}.events-empty{padding:16px 0;font-size:14px;color:#8490a1}.event{display:grid;grid-template-columns:170px 80px 1fr;align-items:center;gap:20px;padding:13px 0;border-top:1px solid #edf0f4;font-size:13px}.event time{font-variant-numeric:tabular-nums;color:#7b8798}.event span{color:#147b60}.event.alert span{color:#d74b30}.event p{margin:0;color:#526176}.wiring{background:#fff;border:1px solid var(--line);border-radius:9px;margin:0 0 30px}.wiring summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;padding:20px 24px;font-size:14px;font-weight:600}.wiring summary::-webkit-details-marker{display:none}.wiring summary span{font-size:19px;color:#8c99aa}.wiring-content{padding:0 24px 20px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left;font-size:13px;min-width:520px}td,th{padding:12px;border-bottom:1px solid #edf0f4}th{color:#637189;background:#f5f7fa;font-weight:500}.wiring-content p{font-size:13px;color:#748092;line-height:1.8}footer{display:flex;justify-content:space-between;gap:15px;color:#8a96a5;font-size:11px}footer b{font-weight:700;color:#657287;letter-spacing:.025em}#toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);padding:12px 20px;background:#202b39;color:white;border-radius:8px;font-size:14px;opacity:0;pointer-events:none;transition:opacity .2s;max-width:90%;text-align:center}#toast.show{opacity:1}.stale .metric-value{color:#9ba4b1}
@media(min-width:1450px){main{padding-top:42px}.metric{padding:24px}.metric-value{margin-top:28px}}@media(max-width:1050px){.metrics{grid-template-columns:repeat(2,1fr)}.workspace-grid{grid-template-columns:minmax(0,1.4fr) minmax(280px,1fr)}main{padding:26px}.header-inner{padding:17px 26px}}@media(max-width:720px){main{padding:24px 16px}.header-inner{padding:15px 17px}.brand{font-size:18px;gap:8px}.brand img{width:33px;height:33px}.public-label{display:none}.header-right{gap:0}.share{padding:8px 10px;font-size:12px}.share span{margin-left:6px}.page-heading{margin-bottom:22px}.clock{display:none}h1{font-size:26px}.subtitle{font-size:14px}.status-panel{padding:20px 18px;gap:14px;flex-wrap:wrap;border-radius:8px}.status-symbol{width:43px;height:43px;font-size:24px}.status-copy h2{font-size:22px}.status-copy p{font-size:13px}.status-meta{width:100%;flex-direction:row;align-items:center;justify-content:space-between;padding-top:13px;border-top:1px solid #cddad750}.metrics{gap:10px;margin-bottom:18px}.metric{padding:18px 14px}.metric-value{gap:5px;margin:22px 0 18px}.metric-value strong{font-size:39px}.metric-value>span{font-size:13px}.flame-value{flex-wrap:wrap;gap:4px}.flame-value strong{font-size:27px}.flame-value>span{font-size:11px}.metric-head{flex-wrap:wrap}.sensor-name{font-size:10px}.metric-bottom{font-size:10px;flex-direction:column;gap:4px}.humidity>p{font-size:11px;margin-bottom:12px}.workspace-grid{grid-template-columns:1fr;gap:18px;margin-bottom:18px}.chart-panel,.device-panel,.events-panel{padding:20px}.chart-wrap{min-height:190px}.panel-heading h2{font-size:18px}.device-panel .panel-heading{margin-bottom:20px}.device-row{margin-bottom:14px;padding-bottom:14px}.camera-placeholder{padding:18px}.event{grid-template-columns:1fr 70px;gap:8px;font-size:12px}.event p{grid-column:1/-1}.event span{text-align:right}.wiring summary{padding:18px 20px}.wiring-content{padding:0 16px 16px}footer{flex-direction:column;gap:8px;line-height:1.6}.eyebrow{font-size:10px}.chart-foot{font-size:11px}.text-button{font-size:11px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.metric-bottom{font-size:12px}.sensor-name,.brand small{font-size:12px}.device-row p,.device-note,.camera-placeholder p,.secondary,.chart-foot,.text-button,.humidity>p{font-size:13px}.panel-heading .section-label,.eyebrow{font-size:12px}.metric h2{font-size:16px}@media(max-width:720px){.metric-bottom{font-size:12px}.sensor-name{font-size:11px}.metric-value strong{font-size:38px}.flame-value strong{font-size:27px}.chart-wrap{min-height:220px}}

#camera-image{display:block;width:100%;max-height:260px;object-fit:contain;border-radius:8px;margin-bottom:14px}#camera-image[hidden]{display:none}.camera-placeholder:has(#camera-image:not([hidden])) .camera-mark{display:none}