:root{color:#17211d;background:#eef2ef;font-family:Inter,Noto Sans TC,PingFang TC,Microsoft JhengHei,system-ui,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,select{font:inherit}.app-shell{min-height:100vh;padding:20px}.topbar,.workspace{margin:0 auto;max-width:1840px}.topbar{align-items:center;display:flex;gap:16px;justify-content:space-between;margin-bottom:14px}.topbar h1,.panel-heading h2{letter-spacing:0;margin:0}.topbar h1{font-size:28px}.topbar p,.panel-heading p{color:#65746d;margin:4px 0 0}.topbar-actions,.control-actions{display:flex;gap:10px}.button{align-items:center;background:#f8faf8;border:1px solid #cdd8d1;border-radius:8px;color:#1b2a24;cursor:pointer;display:inline-flex;font-weight:700;gap:8px;min-height:42px;padding:0 14px}.button:hover{border-color:#789185}.button:disabled{cursor:wait;opacity:.65}.button.primary{background:#187f60;border-color:#187f60;color:#fff}.button.secondary{background:#243a33;border-color:#243a33;color:#fff}.button.danger{background:#fff6f4;border-color:#e6aba0;color:#a23a2b}.workspace{align-items:start;display:grid;gap:16px;grid-template-columns:minmax(0,1fr) 360px}.toast-stack{display:grid;gap:10px;left:50%;position:fixed;top:20px;width:min(360px,calc(100vw - 40px));transform:translate(-50%);z-index:20}.toast{align-items:center;background:#fff;border:1px solid #cfd9d4;border-radius:8px;box-shadow:0 14px 36px #12231c33;color:#20322b;display:flex;gap:10px;min-height:48px;padding:11px 12px}.toast.success{border-color:#9bc9b5}.toast.success svg{color:#157151}.toast.error{border-color:#efb6aa}.toast.error svg{color:#b44332}.map-stage{min-width:0;overflow:auto}.floor-map{aspect-ratio:1491 / 801;background:#fff;border:1px solid #cfd8d4;border-radius:8px;min-width:1491px;overflow:hidden;position:relative}.floor-map.selecting{cursor:crosshair;-webkit-user-select:none;user-select:none}.floor-map img{display:block;height:100%;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;width:100%}.selection-box{background:#176fca1f;border:2px solid rgba(23,111,202,.9);border-radius:6px;box-shadow:0 0 0 1px #ffffffbf inset;pointer-events:none;position:absolute;z-index:4}.door-controls{display:flex;gap:8px;margin-top:20px}.door-pin{align-items:center;background:#243a33;border:2px solid #000;border-radius:10px;box-shadow:0 5px 12px #12231c4d;color:#fff;cursor:pointer;display:flex;gap:6px;justify-content:center;min-height:44px;padding:8px 10px;position:absolute;transform:translate(-50%,-50%);z-index:4}.door-pin.selected{outline:3px solid rgba(15,112,201,.4);outline-offset:2px}.door-panel-icon{color:#187f60;flex-shrink:0}.door-panel-note{color:#65746d;font-size:13px;line-height:1.6;margin:18px 0 0}.door-controls .button{flex:1;min-height:48px}.door-controls .button{box-shadow:0 0 0 2px #000,0 5px 12px #12231c61;color:#fff;justify-content:center;white-space:nowrap}.door-controls .door-open{background:#187f60;border-color:#187f60}.door-controls .door-close{background:#b83b32;border-color:#b83b32}.door-controls .button:hover:not(:disabled){filter:brightness(.9)}.ac-pin{background:#ffffffe6;border:2px solid #8d9a94;border-radius:8px;box-shadow:0 5px 14px #15221c29;color:#1e2b26;cursor:pointer;display:grid;gap:2px;min-height:46px;padding:5px 7px;position:absolute;text-align:left;touch-action:none;transform:translate(-50%,-50%);width:118px}.ac-pin.selected{box-shadow:0 0 0 3px #0f70c938,0 10px 26px #15221c33;z-index:3}.ac-pin.cool{background:#e8f8fceb;border-color:#079ac7}.ac-pin.active{background:#e8f7efeb;border-color:#1c8c63}.ac-pin.off{background:#f2f5f3eb;border-color:#9aa6a0}.ac-pin.unknown{background:#fff1eeeb;border-color:#9aa6a0}.pin-code{color:#57706d;font-size:12px;font-weight:800}.pin-label{font-size:12px;font-weight:800;line-height:1.2}.pin-state{color:#49625c;font-size:11px}.pin-fan{align-items:center;color:#49625c;display:inline-flex;font-size:11px;gap:4px;line-height:1}.pin-fan svg{color:#187f60;flex:0 0 auto}.pin-check{align-items:center;background:#176fca;border-radius:999px;color:#fff;display:flex;font-size:12px;font-weight:900;height:20px;justify-content:center;position:absolute;right:-8px;top:-8px;width:20px}.control-panel{background:#fff;border:1px solid #d3ded8;border-radius:8px;padding:18px;position:sticky;top:20px}.panel-heading{align-items:start;display:flex;gap:12px;justify-content:space-between}.panel-heading h2{font-size:22px}.eyebrow{color:#187f60;font-size:13px;font-weight:800}.state-badge{border-radius:999px;display:inline-flex;font-size:13px;font-weight:900;padding:7px 10px;white-space:nowrap}.state-badge.cool{background:#e6f8fb;color:#00779b}.state-badge.active{background:#e7f7ef;color:#147050}.state-badge.off{background:#eef1ef;color:#52605b}.state-badge.unknown{background:#fff0ed;color:#a23a2b}.mini-button{background:#eef5f2;border:1px solid #bfd1c8;border-radius:8px;color:#26443a;cursor:pointer;font-size:13px;font-weight:900;min-height:34px;padding:0 10px;white-space:nowrap}.batch-summary{background:#f2f8f5;border:1px solid #cce0d6;border-radius:8px;color:#365249;display:grid;gap:6px;margin:18px 0;padding:12px}.batch-summary strong{color:#17382f}.batch-summary span{color:#62776e;font-size:13px}.metric-grid{display:grid;gap:8px;grid-template-columns:repeat(3,minmax(0,1fr));margin:18px 0}.metric{background:#f5f8f6;border:1px solid #d9e3de;border-radius:8px;display:grid;gap:6px;min-height:96px;padding:10px}.metric svg{color:#187f60}.metric span{color:#65746d;font-size:13px}.metric strong{font-size:18px}.field{display:grid;gap:8px;margin-bottom:14px}.field label,.toggle{color:#384941;font-weight:800}.field select,.field input{background:#fff;border:1px solid #cbd7d1;border-radius:8px;min-height:42px;padding:0 11px;width:100%}.stepper{display:grid;grid-template-columns:42px 1fr 42px}.stepper button{align-items:center;background:#f4f7f5;border:1px solid #cbd7d1;cursor:pointer;display:flex;justify-content:center}.stepper button:first-child{border-radius:8px 0 0 8px}.stepper button:last-child{border-radius:0 8px 8px 0}.stepper input{border-left:0;border-radius:0;border-right:0;text-align:center}.toggle{align-items:center;display:flex;gap:10px;margin:4px 0 18px}.toggle input{accent-color:#187f60;height:20px;width:20px}.control-actions{justify-content:space-between}.control-actions .button{justify-content:center;width:100%}.edit-readout{background:#f7faf8;border:1px dashed #a8b8b0;border-radius:8px;display:grid;gap:6px;margin-top:14px;padding:10px}.edit-readout code{color:#35544b}.spin{animation:spin .9s linear infinite}.mobile-pin-state,.mobile-map-hint,.mobile-sheet-header{display:none}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:1180px){.workspace{grid-template-columns:1fr}.control-panel{position:static}}@media(max-width:760px){.app-shell{padding:16px 12px calc(24px + env(safe-area-inset-bottom))}.topbar{align-items:center;flex-direction:row;gap:8px}.topbar h1{font-size:22px}.topbar p{font-size:12px}.refresh-label{display:none}.topbar-actions{flex-direction:row}.topbar-actions .button{padding:0 12px}.mobile-map-hint{align-items:center;color:#65746d;display:flex;font-size:11px;justify-content:space-between;margin:0 0 10px;left:0;position:sticky}.mobile-map-hint i{background:#079ac7;border-radius:50%;display:inline-block;height:7px;margin-right:4px;width:7px}.floor-map{min-width:820px}.ac-pin{gap:0;min-height:44px;padding:4px;text-align:center;touch-action:pan-x pan-y;width:56px}.ac-pin .pin-label,.ac-pin .pin-state,.ac-pin .pin-fan{display:none}.pin-code{font-size:12px}.mobile-pin-state{display:block;font-size:11px;color:#49625c}.door-pin{flex-direction:column;font-size:11px;gap:2px;padding:5px;width:56px;touch-action:pan-x pan-y}.door-controls{gap:12px;margin-bottom:4px}.control-panel{border-radius:20px 20px 0 0;bottom:0;box-shadow:0 -12px 36px #12231c2e;display:none;left:0;max-height:calc(100dvh - 170px - env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;padding:0 18px calc(18px + env(safe-area-inset-bottom));position:fixed;right:0;top:auto;z-index:25}.control-panel.mobile-open{display:block}.mobile-sheet-header{align-items:center;background:#fff;color:#65746d;display:flex;font-size:12px;justify-content:space-between;padding:12px 0;position:sticky;top:0;z-index:1}.mobile-sheet-header .mini-button{display:flex;align-items:center;padding:0 7px}.panel-heading h2{font-size:20px}.panel-heading p{font-size:11px;overflow-wrap:anywhere}.metric-grid{margin:14px 0}.metric{min-height:76px;gap:3px}.field{margin-bottom:12px}.control-actions{position:sticky;bottom:-18px;background:#fff;padding:10px 0}.toast-stack{top:12px;z-index:40}@media(prefers-reduced-motion:no-preference){.control-panel.mobile-open{animation:sheet-in .2s ease-out}}@keyframes sheet-in{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}}
