@import"https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700&display=swap";:root{font-family:Noto Sans KR,system-ui,sans-serif;color:#203a36;background:#f3f5f1;font-synthesis:none;font-weight:400;font-size:14px}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,.button{cursor:pointer;border:1px solid #d5dfd9;border-radius:9px;padding:10px 16px;background:#fff;color:inherit;text-decoration:none;transition:background .15s}button:hover:not(:disabled){background:#ecf3ec}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #40a78a;outline-offset:3px}input,select{border:1px solid #cbd8d0;padding:10px;border-radius:8px;background:#fff;max-width:100%}label{display:flex;flex-direction:column;gap:8px}small{display:block;color:#71817a;font-size:12px;line-height:1.7}h1{font-size:30px;font-weight:600;letter-spacing:-1px;margin:3px 0}h2{font-size:20px;font-weight:600;margin:4px 0 22px}p{line-height:1.8}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:#7a8c83}.brand{font-size:24px;letter-spacing:1px;font-weight:700;text-decoration:none;color:inherit}.brand b{font-weight:400;color:#a2c9b1}.shell{display:grid;grid-template-columns:244px minmax(0,1fr);min-height:100vh}aside{background:#153e36;color:#e6efe8;padding:36px 24px;display:flex;flex-direction:column;gap:20px}aside .eyebrow{margin:36px 0 -14px;color:#98b6a6}aside select{background:#1d4b40;color:#edf6ee;border-color:#376351}nav{display:flex;flex-direction:column;gap:8px;margin-top:16px}nav button{border:0;background:transparent;text-align:left;color:#b7ccc0;padding:14px 12px}nav button.active{background:#e0eac8;color:#244638}nav button:hover:not(:disabled){background:#305d4b}aside footer{margin-top:auto;font-size:11px;overflow-wrap:anywhere;display:grid;gap:12px}aside footer small{color:#a3bcad}aside footer button{background:transparent;color:#c2d6c8;border-color:#3b6551}main{padding:36px clamp(20px,4vw,64px)}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:36px;gap:16px}.connection{border:1px solid #d0d9d2;border-radius:30px;padding:8px 13px;font-size:11px;color:#7b857d;background:#fff}.connection.ok:before{content:"● ";color:#51a177}.device{margin-bottom:40px}.device-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.device-head h2{margin:0 0 4px;font-size:16px}.device-head p{margin:0;font-size:11px;color:#7a897f}.badge{border-radius:30px;padding:6px 12px;font-size:11px;background:#e4e8e2}.badge.online{background:#e2edce;color:#3a603b}.badge.offline{background:#ece2df;color:#965848}.badge.unknown{background:#eee9d8;color:#807138}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.card{border:1px solid #e1e7de;border-radius:18px;background:#fff;padding:28px;box-shadow:0 4px 14px #253c2904;margin-bottom:20px}.grid .card{margin:0}.card .eyebrow{margin:0 0 10px}.vent{grid-column:1/-1}.vent .segmented{display:inline-flex;margin-right:20px}.vent small{margin-top:24px}.row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 0;border-top:1px solid #eff2eb;flex-wrap:wrap}.row b{font-weight:500}.segmented{display:flex;border:1px solid #dfe6da;border-radius:10px;overflow:hidden;flex-shrink:0}.segmented button{border:0;border-radius:0;font-size:12px;padding:9px 14px}.segmented .chosen{background:#e3edce;color:#3e6136}.zone-control{display:flex;align-items:center;gap:5px}.zone-control button{padding:8px;font-size:11px}.zone-control form{display:flex;gap:3px}.zone-control input{width:54px;padding:8px;font-size:12px}.big-state{font-size:26px;color:#2a5746}.primary{background:#204f3e;color:#fff;border-color:#204f3e}button.primary:hover:not(:disabled){background:#32674d}.message{padding:14px 18px;border:1px solid #cddfc9;background:#eaf0df;border-radius:10px;margin:0 0 20px;overflow-wrap:anywhere;display:flex;justify-content:space-between;gap:12px}.message button{padding:0 6px;background:none;border:0}.message.error{background:#f5e9e3;border-color:#ebd3c7;color:#8d4a38}.stale{font-size:12px;color:#9c7a3e}.actions{display:flex;gap:8px}.card form{display:flex;gap:12px;align-items:end;flex-wrap:wrap}.page-note{font-size:11px;color:#9aa69b;margin-top:40px}.welcome{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:10vw;background:linear-gradient(135deg,#e6efdb,#f8f7ed 70%)}.welcome h1{font-size:clamp(36px,5vw,70px);line-height:1.4;margin:14px 0}.welcome .brand{margin-bottom:60px}.welcome .button{margin:30px 0 18px}.welcome small{max-width:340px}@media(max-width:1100px){.grid{grid-template-columns:1fr}.vent{grid-column:auto}.shell{grid-template-columns:210px minmax(0,1fr)}.card{padding:22px}}@media(max-width:720px){.shell{display:block}aside{padding:18px;gap:12px}aside .brand{font-size:19px}aside .eyebrow,aside footer{display:none}aside select{margin:0}nav{flex-direction:row;overflow:auto;margin:0;gap:4px}nav button{white-space:nowrap;font-size:12px;padding:10px}main{padding:24px 16px}header{align-items:flex-start;margin-bottom:24px}h1{font-size:25px}.connection{font-size:10px;white-space:nowrap}.card{padding:20px;border-radius:14px}.device-head p{font-size:10px}.zone-control{flex-wrap:wrap}.welcome{padding:9vw}}
