@font-face{font-family:Roboto;src:url('./assets/roboto-400.woff2') format('woff2');font-weight:400;font-display:swap}@font-face{font-family:Roboto;src:url('./assets/roboto-500.woff2') format('woff2');font-weight:500;font-display:swap}@font-face{font-family:Roboto;src:url('./assets/roboto-700.woff2') format('woff2');font-weight:700;font-display:swap}@font-face{font-family:'Material Design Icons';src:url('./assets/mdi.woff2') format('woff2');font-weight:normal;font-style:normal;font-display:block}
:root{--primary-color:#20b5a5;--accent-color:#20b5a5;--primary-background-color:#eee8de;--card-background-color:#fcfaf7;--secondary-background-color:#f5f1e9;--primary-text-color:#202833;--secondary-text-color:#65707b;--divider-color:#dfdad1;--disabled-text-color:#9ba0a3;--success-color:#43a047;--warning-color:#d97706;--error-color:#d32f2f;--ha-card-border-radius:12px;--ha-card-border-width:1px;--ha-card-border-color:var(--divider-color);--paper-font-body1_-_font-family:Roboto,Arial,sans-serif;--sidebar-width:204px;color-scheme:light}
:root[data-theme=light]{--primary-color:#03a9f4;--accent-color:#03a9f4;--primary-background-color:#fafafa;--card-background-color:#fff;--secondary-background-color:#f5f5f5;--primary-text-color:#212121;--secondary-text-color:#727272;--divider-color:#e0e0e0;--success-color:#43a047;--warning-color:#ffa600;--error-color:#db4437}
:root[data-theme=dark]{--primary-color:#03a9f4;--accent-color:#03a9f4;--primary-background-color:#111;--card-background-color:#1c1c1c;--secondary-background-color:#282828;--primary-text-color:#e1e1e1;--secondary-text-color:#9b9b9b;--divider-color:#333;--success-color:#66bb6a;--warning-color:#ffa726;--error-color:#ef5350;color-scheme:dark}
*{box-sizing:border-box}body{margin:0;font:14px Roboto,Arial,sans-serif;color:var(--primary-text-color);background:var(--primary-background-color);height:100dvh;overflow:hidden}button,input,select{font:inherit}button{cursor:pointer;color:inherit}button:disabled{opacity:.45;cursor:default}a{color:var(--primary-color)}button:focus-visible,a:focus-visible,select:focus-visible{outline:2px solid var(--primary-color);outline-offset:3px}button{border:0;background:none}[hidden]{display:none!important}.ha-sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar-width);background:var(--card-background-color);border-right:1px solid var(--divider-color);display:flex;flex-direction:column;z-index:4}.ha-brand{height:64px;display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--divider-color);padding:0 12px;font-size:16px;font-weight:500;white-space:nowrap}.icon-btn{width:36px;height:36px;border:0;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:var(--secondary-text-color);flex-shrink:0}.icon-btn:hover{background:color-mix(in srgb,var(--primary-text-color) 7%,transparent)}ha-icon{--mdc-icon-size:23px}.ha-sidebar nav{display:flex;flex-direction:column;gap:5px;padding:14px 6px}.ha-sidebar nav>button{height:48px;border-radius:5px;text-align:left;display:flex;gap:17px;align-items:center;padding:0 15px;font-weight:500;font-size:14px;white-space:nowrap}.ha-sidebar nav>button ha-icon{color:var(--secondary-text-color)}.ha-sidebar nav>button:hover{background:color-mix(in srgb,var(--primary-color) 6%,transparent)}.ha-sidebar nav>button.active{color:var(--primary-color);background:color-mix(in srgb,var(--primary-color) 13%,transparent)}.ha-sidebar nav>button.active ha-icon{color:var(--primary-color)}.sidebar-bottom{margin-top:auto;padding:18px 13px 16px}.demo-badge{display:flex;gap:7px;align-items:center;font-size:11px;color:var(--secondary-text-color)}.demo-badge i{height:6px;width:6px;border-radius:50%;background:var(--primary-color)}.sidebar-note{font-size:10px;line-height:1.6;color:var(--secondary-text-color);margin:8px 0 17px}.theme-select{display:flex;gap:8px;align-items:center;padding:10px 0;border-top:1px solid var(--divider-color)}.theme-select ha-icon{--mdc-icon-size:18px;color:var(--secondary-text-color)}.theme-select select{border:0;background:transparent;color:var(--secondary-text-color);width:145px;outline:none;font-size:11px;cursor:pointer}.theme-select option{background:var(--card-background-color);color:var(--primary-text-color)}.demo-control-btn{display:flex;align-items:center;gap:9px;width:100%;background:color-mix(in srgb,var(--primary-color) 9%,var(--card-background-color));border-radius:6px;padding:10px;color:var(--primary-color);font-size:12px;margin-bottom:17px}.demo-control-btn ha-icon{--mdc-icon-size:18px}.source-link{display:flex;gap:7px;align-items:center;text-decoration:none;font-size:10px;color:var(--secondary-text-color)}.source-link ha-icon{--mdc-icon-size:16px}.ha-main{margin-left:var(--sidebar-width);height:100dvh;min-width:0}#editor-view{height:100%;min-width:0}device-floorplan-panel{height:100%;display:block}#dashboard-view{height:100%;overflow:auto}.dash-header{height:65px;background:var(--card-background-color);border-bottom:1px solid var(--divider-color);display:flex;align-items:center;justify-content:space-between;padding:0 24px}.dash-header>div:first-child{display:flex;align-items:center;gap:16px}.dash-header h1{font-size:20px;font-weight:400;margin:0}.dash-header span{font-size:12px;color:var(--secondary-text-color)}#dashboard-content{padding:14px;max-width:1800px;margin:auto}.dash-card-wrap{position:relative}.dash-card-wrap>device-floorplan-card{display:block;width:100%;--dfc-chrome:155px}.dash-card-edit{display:none;position:absolute;top:8px;right:8px;z-index:4;background:var(--card-background-color);border:1px solid var(--divider-color);border-radius:7px;padding:7px 12px;align-items:center;gap:6px;color:var(--primary-color);box-shadow:0 2px 8px #0002}.editing .dash-card-edit{display:flex}.editing .dash-card-wrap{outline:2px dashed color-mix(in srgb,var(--primary-color) 45%,transparent);outline-offset:3px;border-radius:12px}.ha-button{border:1px solid var(--divider-color);border-radius:7px;padding:9px 14px;display:inline-flex;align-items:center;gap:7px;background:var(--card-background-color);color:var(--primary-color);font-size:13px}.ha-button ha-icon{--mdc-icon-size:18px}.ha-button:hover{background:color-mix(in srgb,var(--primary-color) 8%,var(--card-background-color))}.ha-button.primary{background:var(--primary-color);color:white;border-color:var(--primary-color)}.ha-button.danger{color:var(--error-color)}.empty-dashboard{max-width:520px;margin:12vh auto;padding:36px;text-align:center;background:var(--card-background-color);border:1px solid var(--divider-color);border-radius:14px}.empty-dashboard>ha-icon{--mdc-icon-size:48px;color:var(--primary-color)}.empty-dashboard h2{font-size:24px;font-weight:400;line-height:1.3;margin:18px 0 12px}.empty-dashboard p{font-size:14px;color:var(--secondary-text-color);line-height:1.7;margin:0 0 22px}.empty-dashboard .small-note{font-size:11px;margin-top:19px}.eyebrow{font-size:9px;letter-spacing:1.5px;font-weight:500;color:var(--primary-color)}#drawer-backdrop{position:fixed;inset:0;z-index:19;background:#0005}#demo-drawer{position:fixed;inset:0 0 0 auto;width:370px;max-width:100%;background:var(--card-background-color);z-index:20;box-shadow:-8px 0 40px #0002;padding:22px;overflow:auto}#demo-drawer header,dialog header{display:flex;align-items:center;justify-content:space-between;gap:12px}#demo-drawer h2{margin:5px 0 0;font-size:23px;font-weight:400}.drawer-intro{font-size:12px;line-height:1.7;color:var(--secondary-text-color);margin:17px 0 23px}.demo-section-title{font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:1px;color:var(--secondary-text-color);margin:25px 0 9px}.demo-field{display:flex;flex-direction:column;gap:7px;padding:12px 0;border-bottom:1px solid var(--divider-color)}.demo-field>span{font-size:12px}.demo-field select{padding:8px;border:1px solid var(--divider-color);border-radius:6px;background:var(--card-background-color);color:var(--primary-text-color);width:100%;font-size:12px}.demo-field input[type=range]{width:100%;accent-color:var(--primary-color)}.demo-field output{font-size:11px;color:var(--secondary-text-color)}.demo-field.switch{flex-direction:row;align-items:center;justify-content:space-between}.demo-field.switch input{width:17px;height:17px;accent-color:var(--primary-color);cursor:pointer}.demo-field .ha-button{align-self:flex-start;padding:6px 11px;font-size:12px}.reset-block{margin-top:28px}.reset-block p{font-size:10px;line-height:1.7;color:var(--secondary-text-color)}dialog{background:var(--card-background-color);color:var(--primary-text-color);border:1px solid var(--divider-color);border-radius:16px;padding:24px;width:510px;max-width:calc(100% - 28px);max-height:90dvh;box-shadow:0 20px 70px #0004}dialog::backdrop{background:#0007}.detail-header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.detail-header h2{font-size:21px;font-weight:400;margin:0 0 5px}.detail-header p{color:var(--secondary-text-color);font-size:12px;margin:0}.detail-state{font-size:30px;font-weight:400;margin:23px 0}.detail-table{width:100%;border-collapse:collapse;font-size:12px;margin:20px 0}.detail-table td{padding:10px 4px;border-bottom:1px solid var(--divider-color);word-break:break-word}.detail-table td:last-child{text-align:right;color:var(--secondary-text-color)}.detail-note{font-size:11px;line-height:1.7;color:var(--secondary-text-color);margin:15px 0 0}.detail-controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:20px 0}.detail-controls select,.detail-controls input{font:14px Roboto;padding:8px;border:1px solid var(--divider-color);border-radius:6px;background:var(--card-background-color);color:var(--primary-text-color);accent-color:var(--primary-color)}#card-editor-dialog{width:1150px;padding:0;max-width:calc(100vw - 28px)}#card-editor-dialog header{padding:15px 22px;border-bottom:1px solid var(--divider-color)}#card-editor-dialog h2{margin:0;font-size:21px;font-weight:400}.card-edit-layout{display:grid;grid-template-columns:minmax(320px,1fr) minmax(300px,1fr);gap:20px;padding:20px;max-height:70vh;overflow:auto}#card-editor-preview{position:sticky;top:0;align-self:start;background:var(--primary-background-color);border-radius:12px;padding:10px;min-height:300px}#card-editor-dialog footer{display:flex;align-items:center;justify-content:space-between;padding:15px 22px;border-top:1px solid var(--divider-color);gap:20px}#card-editor-dialog footer span{font-size:11px;color:var(--secondary-text-color)}#shell-toast{position:fixed;left:calc(50% + var(--sidebar-width)/2);bottom:24px;transform:translateX(-50%);background:#252525;color:#fff;padding:11px 18px;border-radius:7px;box-shadow:0 3px 16px #0003;font-size:13px;z-index:40;opacity:0;pointer-events:none;transition:opacity .2s;max-width:90vw;text-align:center}#shell-toast.show{opacity:1}.collapsed{--sidebar-width:64px}.collapsed .ha-brand{padding:0 13px}.collapsed .ha-brand>span,.collapsed nav>button span,.collapsed .sidebar-note,.collapsed .demo-badge,.collapsed .source-link span,.collapsed .theme-select,.collapsed .demo-control-btn span{display:none}.collapsed nav>button{padding:0;justify-content:center}.collapsed .sidebar-bottom{padding:12px 10px}.collapsed .demo-control-btn{padding:10px;justify-content:center}.collapsed .source-link{justify-content:center}ha-card{display:block}
@media(max-width:1000px){:root{--sidebar-width:64px}.ha-brand{padding:0 13px}.ha-brand>span,.ha-sidebar nav>button span,.sidebar-note,.demo-badge,.source-link span,.theme-select,.demo-control-btn span{display:none}.ha-sidebar nav>button{padding:0;justify-content:center}.sidebar-bottom{padding:12px 10px}.demo-control-btn{padding:10px;justify-content:center}.source-link{justify-content:center}.dash-header{padding:0 15px}.dash-header span{display:none}.card-edit-layout{grid-template-columns:1fr}#card-editor-preview{position:static;min-height:240px}.expanded-mobile{--sidebar-width:204px}.expanded-mobile .ha-brand>span,.expanded-mobile .ha-sidebar nav>button span,.expanded-mobile .demo-control-btn span,.expanded-mobile .theme-select,.expanded-mobile .demo-badge,.expanded-mobile .sidebar-note{display:initial}.expanded-mobile .ha-sidebar nav>button{justify-content:flex-start;padding:0 15px}.expanded-mobile .demo-control-btn{justify-content:flex-start}.expanded-mobile .sidebar-bottom{padding:18px 13px}.expanded-mobile .ha-main{margin-left:64px}.expanded-mobile .ha-sidebar{box-shadow:8px 0 30px #0004}}
@media(max-width:600px){.dash-header{height:58px}.dash-header h1{font-size:18px}.dash-header .ha-button{font-size:11px;padding:7px 9px}.dash-header .ha-button span{display:initial}#dashboard-content{padding:8px}.empty-dashboard{padding:24px 18px;margin:8vh 4px}.empty-dashboard h2{font-size:21px}.empty-dashboard p{font-size:12px}#shell-toast{left:50%;font-size:11px}.card-edit-layout{padding:12px}dialog{padding:18px}.detail-table{font-size:11px}.ha-sidebar nav>button{height:44px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

.dash-header{height:auto;min-height:65px;gap:20px;padding-top:10px;padding-bottom:10px}.dash-header>div:first-child{flex-wrap:wrap;gap:6px 16px;min-width:0}.dashboard-help{flex-basis:100%;margin:0;max-width:850px;font-size:12px;line-height:1.55;color:var(--secondary-text-color)}.dashboard-help strong{font-weight:500;color:var(--primary-text-color)}.dash-header>div:last-child{flex-shrink:0}@media(max-width:600px){.dash-header{align-items:flex-start;gap:10px}.dashboard-help{font-size:11px}.dash-header .ha-button{white-space:nowrap}}
:root{--simulation-accent:#805008;--simulation-edge:#d7ae69;--simulation-surface:#fff6e6}
:root[data-theme="dark"]{--simulation-accent:#ffcb78;--simulation-edge:#79572d;--simulation-surface:#2d2418}
.sidebar-bottom{border-top:1px solid var(--divider-color);margin-top:clamp(24px,22vh,210px)}
.ha-sidebar{overflow-y:auto}
.demo-group-title{color:var(--simulation-accent);font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;margin-bottom:8px}
.demo-intro-link{color:var(--simulation-accent);text-decoration:underline;text-underline-offset:3px;font-weight:500}
.simulation-dock{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 16px 16px;padding:10px 12px;border:1px solid var(--simulation-edge);border-radius:12px;background:var(--simulation-surface);color:var(--simulation-accent)}
.simulation-dock strong{display:flex;align-items:center;gap:8px;margin-right:8px}
.simulation-dock small{text-transform:uppercase;font-size:9px;letter-spacing:.08em}
.simulation-dock button{border:1px solid var(--simulation-edge);border-radius:8px;padding:7px 11px;background:var(--card-background-color);color:var(--primary-text-color)}
.simulation-dock button[aria-pressed="true"]{background:var(--simulation-accent);color:var(--simulation-surface)}
.simulation-dock button:focus-visible{outline-color:var(--simulation-accent)}
#demo-drawer .eyebrow{color:var(--simulation-accent)}
.collapsed .demo-group-title{display:none}
#dashboard-view{display:flex;flex-direction:column;overflow:hidden}
#dashboard-view[hidden]{display:none}
#dashboard-content{flex:1;min-height:0;width:100%;overflow:auto;margin:0 auto}
#dashboard-content{container-type:size}
/* Reserve space for the overlay picker and overlay-specific controls. */
#dashboard-content device-floorplan-card{--dfc-chrome:calc(100vh - max(120px, 100cqh - 112px))}
.simulation-dock{flex-shrink:0}

:root{--simulation-accent:#594593;--simulation-edge:#d1cae2;--simulation-surface:#f0eff7;--simulation-active:#e4daf9}
:root[data-theme="dark"]{--simulation-accent:#d7c5ff;--simulation-edge:#56496f;--simulation-surface:#252432;--simulation-active:#463464}
.simulation-dock{flex-wrap:nowrap;overflow-x:auto;white-space:nowrap;gap:10px;padding:8px 10px}
.simulation-dock strong{gap:6px;margin-right:0}
.simulation-dock small{border-radius:20px;background:var(--simulation-active);padding:3px 6px}
.dock-group{display:flex;align-items:center;gap:4px;border-inline-start:1px solid var(--simulation-edge);padding-inline-start:8px}
.simulation-dock button,.simulation-dock select{padding:6px 8px;font-size:12px}
.simulation-dock select{border:1px solid var(--simulation-edge);border-radius:8px;background:var(--card-background-color);color:var(--primary-text-color)}
.simulation-dock button[aria-pressed="true"]{background:var(--simulation-active);color:var(--simulation-accent)}
#open-demo{margin-inline-start:auto}
.dock-popover{position:fixed;inset:auto 22px 74px auto;margin:0;padding:14px;border:1px solid var(--simulation-edge);border-radius:10px;background:var(--simulation-surface);color:var(--primary-text-color);box-shadow:0 4px 18px #0002}
.dock-popover input{display:block;margin-top:8px;width:220px;accent-color:var(--simulation-accent)}

.demo-brand{white-space:nowrap}
.demo-brand img{width:28px;height:28px;vertical-align:middle;margin-right:6px}
.demo-brand>span{display:inline-grid;vertical-align:middle;gap:3px}
.demo-brand b{font-size:13px}
.demo-brand small{font-size:8px;letter-spacing:.03em;color:var(--secondary-text-color)}
.demo-reset{margin:0 12px 12px;align-self:flex-start;font-size:12px}
.dock-group:has(> :only-child[hidden]),.dock-context:not(:has(> :not([hidden]))){display:none}
.dock-popover label{display:block}
.dock-popover label+label{margin-top:10px}
.dock-popover input[type="checkbox"]{display:inline-block;width:auto;margin:0 5px 0 0}

#editor-view.editor-touring{display:flex;flex-direction:column;gap:8px}
#editor-view.editor-touring>[hidden]{display:none}
.tour-preview{display:block;flex:1;min-height:0}
.editor-tour{align-self:center;width:min(660px,100%);flex:none;margin:0 0 8px;padding:10px 14px;border:1px solid var(--divider-color);border-radius:14px;color:var(--primary-text-color);background:var(--card-background-color);box-shadow:0 5px 22px #06101c22}
.editor-tour header h2{margin:3px 0;font-size:17px}
.editor-tour header p{margin:0 0 8px;line-height:1.4}
.editor-tour header small{color:var(--primary-color);font-weight:700}
.editor-tour footer,.editor-tour footer div{display:flex;gap:6px;justify-content:space-between;flex-wrap:wrap}
.tour-cursor{position:fixed;z-index:10;pointer-events:none;width:18px;height:18px;border-radius:50%;background:#fff;border:3px solid #00a6ce;box-shadow:0 0 0 4px #00a6ce45;transform:translate(-50%,-50%);transition:top .8s ease,left .8s ease}
