body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.home-automation-app.loading{display:flex;align-items:center;justify-content:center;min-height:100vh;background:#f5f5f5}.app-loading-message{text-align:center;padding:40px;background:#fff;border-radius:12px;box-shadow:0 4px 20px #0000001a;max-width:400px}.app-loading-message h2{margin:0 0 16px;color:#333;font-size:24px}.app-loading-message p{margin:0;color:#666;font-size:16px}.home-automation-app.configuration-required{display:flex;align-items:center;justify-content:center;min-height:100vh;background:#f5f5f5;padding:20px}.configuration-message{text-align:center;padding:40px;background:#fff;border-radius:12px;box-shadow:0 4px 20px #0000001a;max-width:500px}.configuration-message h2{margin:0 0 16px;color:#333;font-size:28px}.configuration-message>p{margin:0 0 24px;color:#666;font-size:16px;line-height:1.5}.configure-button{background:#1976d2;color:#fff;border:none;padding:14px 28px;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:background-color .2s ease;margin-bottom:32px}.configure-button:hover{background:#1565c0}.help-text{text-align:left;background:#f8f9fa;padding:20px;border-radius:8px;border:1px solid #e9ecef}.help-text h3{margin:0 0 12px;color:#495057;font-size:18px}.help-text ul{margin:0;padding-left:20px}.help-text li{margin:8px 0;color:#6c757d;line-height:1.4}.settings-gear{position:absolute;top:20px;right:20px;z-index:100}*,*:before,*:after{box-sizing:border-box;scrollbar-width:none;-ms-overflow-style:none}*::-webkit-scrollbar{display:none}.home-automation-app{height:100vh;background:linear-gradient(180deg,#1a2f4a,#0f1e30,#000);color:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden;position:relative}.main-dashboard{display:flex;flex-direction:column;height:100vh;padding:20px 20px 70px;box-sizing:border-box;justify-content:space-between}.time-date-header{display:flex;flex-direction:column;align-items:center;position:relative;margin-top:40px}.time-display{font-size:72px;font-weight:700;color:#fff;margin-bottom:8px;letter-spacing:3px}.date-display{font-size:28px;color:#fff;font-weight:300}.battery-indicator{position:absolute;top:0;right:-100px;font-size:18px;color:#fff;opacity:.8}.category-row{display:flex;justify-content:center;align-items:center;gap:40px;flex:1;max-width:800px;margin:0 auto;padding:40px 0}.category-item{display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:all .3s ease;padding:15px;border-radius:15px}.category-item:hover{background:#ffffff1a;transform:scale(1.05)}.category-icon-wrapper{width:95px;height:95px;display:flex;align-items:center;justify-content:center;background:#ffffff1a;border-radius:12px;border:2px solid rgba(255,255,255,.3);margin-bottom:15px;position:relative}.category-icon-image{width:65px;height:65px;filter:brightness(0) invert(1)}.category-label-caps{font-size:18px;font-weight:500;text-align:center;color:#fff;letter-spacing:1px}.quick-scenes-section{margin:30px 0}.section-title{font-size:22px;font-weight:500;color:#fff;text-align:center;margin-bottom:20px;letter-spacing:1px}.quick-scenes-row{display:flex;justify-content:center;gap:25px;flex-wrap:wrap}.quick-scene-button{display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:all .3s ease;padding:15px;border-radius:15px;position:relative}.quick-scene-button.executing{background:#4a9eff33}.scene-icon-wrapper{width:75px;height:75px;display:flex;align-items:center;justify-content:center;background:#ffffff1a;border-radius:12px;border:2px solid rgba(255,255,255,.3);margin-bottom:12px;position:relative}.scene-icon-image{width:52px;height:52px;filter:brightness(0) invert(1)}.scene-progress-ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.progress-ring-circle{transition:stroke-dashoffset .35s;transform:rotate(-90deg);transform-origin:50% 50%}.scene-label{font-size:16px;font-weight:500;text-align:center;color:#fff;letter-spacing:.5px}.executing-indicator{display:flex;align-items:center;gap:5px;margin-top:5px;font-size:12px;color:#4a9eff}.pulse-dot{width:6px;height:6px;border-radius:50%;background:#4a9eff;animation:pulse 1.5s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.device-categories-section{margin:30px 0}.zone-indicator{display:flex;justify-content:center;margin-bottom:20px}.zone-name{font-size:30px;font-weight:300;color:#fff;border-bottom:2px solid #4a9eff;padding-bottom:5px}.room-indicator{display:flex;justify-content:center;margin-bottom:20px}.room-name{font-size:20px;font-weight:300;color:#fff;border-bottom:2px solid #4a9eff;padding-bottom:5px}.dashboard-title{text-align:center;font-size:24px;font-weight:300;margin-bottom:40px;border-bottom:2px solid transparent}.dashboard-title.selected{border-bottom-color:#4a9eff}.category-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:30px;flex:1;max-width:600px;margin:0 auto}.category-icon{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#ffffff1a;border-radius:15px;padding:20px;cursor:pointer;transition:all .3s ease;border:2px solid transparent;min-height:120px}.category-icon:hover{background:#fff3;transform:scale(1.05)}.category-icon.selected{border-color:#4a9eff;background:#4a9eff33}.category-icon img{width:55px;height:55px;margin-bottom:12px;filter:brightness(0) invert(1)}.category-label{font-size:18px;font-weight:500;text-align:center}.bottom-navigation{position:fixed;bottom:0;left:0;right:0;background:#000000e6;display:flex;justify-content:space-around;padding:12px 20px;border-top:1px solid rgba(255,255,255,.1)}.nav-icon{display:flex;flex-direction:column;align-items:center;cursor:pointer;padding:5px;border-radius:8px;transition:all .3s ease;min-width:60px}.nav-icon:hover{background:#ffffff1a}.nav-icon.active{background:#4a9eff4d}.nav-emoji{font-size:24px;margin-bottom:6px;display:block}.nav-icon img{width:28px;height:28px;margin-bottom:6px;filter:brightness(0) invert(1)}.nav-label{display:none}.control-page{display:flex;flex-direction:column;height:100vh;padding:20px 20px 80px;box-sizing:border-box}.control-title{text-align:center;font-size:36px;font-weight:600;margin-bottom:15px}.control-grid{display:grid;gap:15px;flex:1;max-width:600px;margin:0 auto;width:100%}.grid-2x3{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr)}.grid-3x3{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr)}.grid-3x5{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(5,1fr)}.control-button{background:#ffffff1a;border:2px solid rgba(255,255,255,.2);border-radius:15px;color:#fff;font-size:18px;font-weight:500;cursor:pointer;transition:all .3s ease;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px;min-height:90px}.control-button:hover{background:#fff3;transform:scale(1.02)}.control-button.active{background:#4a9eff66;border-color:#4a9eff}.control-button.power-on{background:#ff00004d;border-color:#f44}.control-button img{width:75px;height:75px;margin-bottom:8px;filter:brightness(0) invert(1)}.control-icon{width:105px;margin-bottom:0;filter:brightness(0) invert(1)}.control-name{font-size:33px;font-weight:500;margin-bottom:4px}.control-status{font-size:14px;opacity:.7}.device-controls{display:flex;gap:5px;margin-top:10px}.control-button-small{background:#ffffff1a;border:1px solid rgba(255,255,255,.3);color:#fff;padding:8px 6px;width:70px;height:58px;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;font-size:12px;transition:all .3s ease;gap:0px}.control-button-small:hover{background:#fff3;transform:scale(1.05)}.control-button-small .control-icon{font-size:36px;margin-bottom:0;width:auto;height:auto}.control-button-small .control-label{font-size:19px;text-align:center;white-space:nowrap;margin-top:2px;overflow:hidden;text-overflow:ellipsis;max-width:100%}.quick-scenes-section{margin-bottom:30px}.quick-scenes-row{display:flex;justify-content:center;gap:20px;flex-wrap:wrap}.quick-scene-button{display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:all .3s ease;padding:15px;border-radius:15px;background:#ffffff0d;border:2px solid transparent;min-width:100px;position:relative}.quick-scene-button:hover{background:#ffffff1a;transform:scale(1.05)}.quick-scene-button.executing{border-color:#4a9eff;background:#4a9eff33;cursor:not-allowed}.scene-icon-wrapper{width:70px;height:70px;display:flex;align-items:center;justify-content:center;background:#ffffff1a;border-radius:12px;border:2px solid rgba(255,255,255,.2);margin-bottom:10px;position:relative}.scene-icon-image{width:48px;height:48px;filter:brightness(0) invert(1)}.scene-progress-ring{position:absolute;top:0;left:0;width:70px;height:70px}.progress-ring{transform:rotate(-90deg)}.progress-ring-circle{transition:stroke-dashoffset .3s ease}.scene-label{font-size:14px;font-weight:500;text-align:center;color:#fff;letter-spacing:.5px}.executing-indicator{display:flex;align-items:center;gap:5px;margin-top:5px;font-size:10px;color:#4a9eff}.pulse-dot{width:6px;height:6px;background:#4a9eff;border-radius:50%;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.2)}}.device-categories-section{margin-bottom:20px}.status-display{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1}.status-icon{width:120px;height:120px;margin-bottom:20px;filter:brightness(0) invert(1)}.status-text{font-size:24px;font-weight:300}.control-header{display:flex;justify-content:center;align-items:center;margin-bottom:30px;position:relative}.cross-button{position:absolute;top:0;right:0;background:#ffffff1a;border:1px solid rgba(255,255,255,.3);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;color:#fff;font-size:18px;font-weight:700}.cross-button:hover{background:#fff3;transform:scale(1.1)}@media (max-width: 768px){.category-row{gap:20px;flex-wrap:wrap}.category-item{min-width:80px}.category-icon-wrapper{width:65px;height:65px}.category-icon-image{width:40px;height:40px}.time-display{font-size:36px}.control-grid{gap:12px}.control-button{min-height:70px;padding:12px;font-size:14px}}.config-error-container{display:flex;justify-content:center;align-items:center;min-height:calc(100vh - 120px);padding:20px}.config-error-content{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:40px 30px;text-align:center;max-width:500px;border:1px solid rgba(255,255,255,.2);box-shadow:0 8px 32px #0000004d}.error-icon{font-size:4rem;margin-bottom:20px;display:block}.error-title{color:#ff6b6b;font-size:1.8rem;font-weight:600;margin-bottom:20px;text-shadow:0 2px 4px rgba(0,0,0,.3)}.loading-title{color:#4caf50;font-size:1.8rem;font-weight:600;margin-bottom:20px;text-shadow:0 2px 4px rgba(0,0,0,.3)}.error-message{color:#ffffffe6;font-size:1.1rem;line-height:1.6;margin-bottom:20px;text-shadow:0 1px 2px rgba(0,0,0,.5)}.error-instructions{color:#fffc;font-size:1rem;line-height:1.5;margin-bottom:30px;text-shadow:0 1px 2px rgba(0,0,0,.5)}.error-details{background:#0003;border-radius:10px;padding:15px;margin-top:20px}.error-details p{color:#ffffffb3;font-size:.9rem;margin:5px 0;text-shadow:0 1px 2px rgba(0,0,0,.5)}.error-details strong{color:#ffffffe6;font-weight:600}.loading-message{color:#ffffffe6;font-size:1.1rem;line-height:1.6;margin-bottom:20px;text-shadow:0 1px 2px rgba(0,0,0,.3)}.loading-details{color:#ffffffb3;font-size:1rem;line-height:1.5;margin-bottom:20px;text-shadow:0 1px 2px rgba(0,0,0,.3)}.error-contact{color:#fffc;font-size:1rem;line-height:1.5;margin-bottom:20px;font-weight:500;text-shadow:0 1px 2px rgba(0,0,0,.3)}.loading-progress{margin-top:20px;width:100%}.progress-bar{width:100%;height:8px;background:#fff3;border-radius:4px;overflow:hidden;margin-bottom:10px;box-shadow:inset 0 2px 4px #0003}.progress-fill{height:100%;background:linear-gradient(90deg,#4caf50,#45a049);border-radius:4px;transition:width .3s ease;box-shadow:0 2px 8px #4caf504d}.progress-text{color:#fffc;font-size:.9rem;text-align:center;margin:0;text-shadow:0 1px 2px rgba(0,0,0,.3)}.lights-control{height:100vh;display:flex;flex-direction:column;padding-bottom:120px;box-sizing:border-box;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.lights-control::-webkit-scrollbar{display:none}.lights-main-content{display:flex;flex:1;height:calc(100% - 80px);padding:0 20px 20px;gap:20px;scrollbar-width:none;-ms-overflow-style:none}.lights-main-content::-webkit-scrollbar{display:none}.lights-sidebar{width:200px;background:#ffffff0d;border-radius:10px;border:1px solid rgba(255,255,255,.1);padding:15px 0}.lights-mobile-dropdown{display:none}.device-selector{width:calc(100% - 20px);max-width:400px;margin:0 10px;background:#ffffff1a;border:1px solid rgba(255,255,255,.3);border-radius:8px;color:#fff;padding:12px 40px 12px 15px;font-size:14px;font-weight:500;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 12px center;background-size:16px;box-sizing:border-box}.device-selector:focus{outline:none;border-color:#4a9eff;background:#ffffff26}.device-selector option{background:#1a2f4a;color:#fff;padding:10px}.lights-room-list{display:flex;flex-direction:column;gap:8px}.lights-room-item{display:flex;align-items:center;justify-content:space-between;padding:12px 15px;margin:0 8px;border-radius:8px;cursor:pointer;transition:all .3s ease;border:1px solid transparent}.lights-room-item:hover{background:#ffffff1a}.lights-room-item.selected{background:#4a9eff33;border-color:#4a9eff}.lights-room-item.device-on .room-name{color:#4a9eff}.room-name{font-size:14px;font-weight:500;color:#fff!important}.room-status{display:flex;align-items:center}.status-indicator{width:8px;height:8px;border-radius:50%;background:#666;transition:all .3s ease}.status-indicator.on{background:#4a9eff;box-shadow:0 0 10px #4a9eff80}.no-devices-message{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;color:#fff9;font-size:14px}.no-devices-message div:first-child{font-size:40px;margin-bottom:10px}.lights-scenes{flex:1;display:flex;flex-direction:column;background:#ffffff08;border-radius:10px;border:1px solid rgba(255,255,255,.1);padding:20px;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.lights-scenes::-webkit-scrollbar{display:none}.scenes-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr);gap:15px;flex:1;margin-bottom:20px}.scene-button{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#ffffff14;border:2px solid rgba(255,255,255,.1);border-radius:12px;padding:20px 10px;cursor:pointer;transition:all .3s ease;position:relative;min-height:80px}.scene-button:hover{background:#ffffff1f;transform:scale(1.02)}.scene-button.active{background:#4a9eff33;border-color:#4a9eff;color:#4a9eff}.scene-button.off-button{background:#ff32321a;border-color:#ff32324d}.scene-button.off-button.active{background:#ff323233;border-color:#ff3232;color:#ff3232}.scene-button.disabled{background:#ffffff05;border-color:#ffffff0d;cursor:not-allowed;opacity:.3}.scene-button.disabled:hover{background:#ffffff05;transform:none}.scene-icon{font-size:28px;margin-bottom:8px;opacity:.6;transition:all .3s ease;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",Segoe UI,Tahoma,Arial,sans-serif}.scene-button.active .scene-icon{opacity:1;text-shadow:0 0 15px currentColor}.scene-name{font-size:12px;font-weight:500;text-align:center;color:#fff;letter-spacing:.5px}.scene-button.active .scene-name{color:inherit}.active-glow{position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:12px;background:linear-gradient(45deg,transparent,rgba(74,158,255,.3),transparent);animation:glow-pulse 2s ease-in-out infinite;pointer-events:none}@keyframes glow-pulse{0%,to{opacity:.5}50%{opacity:1}}.device-info{text-align:center;color:#fffc;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:10px;margin-bottom:15px}.additional-controls{margin-top:15px;padding-top:15px;border-top:1px solid rgba(255,255,255,.1)}.control-buttons-row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.no-selection-message{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#ffffff80;font-size:16px}.no-selection-message div:first-child{font-size:60px;margin-bottom:15px;opacity:.7}@media (max-width: 768px){.lights-control{height:auto;min-height:100vh;overflow-y:auto;padding-bottom:220px}.lights-main-content{flex-direction:column;padding:0 10px 15px;overflow-y:auto;min-height:auto}.lights-sidebar{width:100%;max-height:none;background:#ffffff0d;border-radius:10px;border:1px solid rgba(255,255,255,.1);padding:15px;margin-bottom:20px}.lights-mobile-dropdown{display:block}.lights-room-list{display:none}.scenes-grid{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:10px}.scene-button{min-height:70px;padding:15px 8px}.scene-icon{font-size:24px;margin-bottom:5px}.scene-name{font-size:11px}.lights-scenes{overflow-y:auto;min-height:auto;flex:none;max-height:calc(100vh - 250px)}.additional-controls{margin-bottom:100px;padding-bottom:20px}.device-selector{width:calc(100% - 20px);margin:0 10px;font-size:16px}}.shades-main-content{display:flex;flex:1;height:calc(100% - 80px);padding:0 20px 20px;gap:20px;scrollbar-width:none;-ms-overflow-style:none}.shades-main-content::-webkit-scrollbar{display:none}.shades-sidebar{width:200px;background:#ffffff0d;border-radius:10px;border:1px solid rgba(255,255,255,.1);padding:15px 0}.shades-mobile-dropdown{display:none}.shades-device-list{display:flex;flex-direction:column;gap:8px}.shades-device-item{display:flex;align-items:center;justify-content:space-between;padding:12px 15px;margin:0 8px;border-radius:8px;cursor:pointer;transition:all .3s ease;border:1px solid transparent}.shades-device-item:hover{background:#ffffff1a}.shades-device-item.selected{background:#4a9eff33;border-color:#4a9eff}.shades-device-item.device-on .device-name{color:#4a9eff}.device-name{font-size:16px;font-weight:500;color:#fff!important}.device-status{display:flex;align-items:center}.shades-commands{flex:1;display:flex;flex-direction:column;background:#ffffff08;border-radius:10px;border:1px solid rgba(255,255,255,.1);padding:20px;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.shades-commands::-webkit-scrollbar{display:none}.commands-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:20px}.command-button{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#ffffff14;border:2px solid rgba(255,255,255,.1);border-radius:12px;cursor:pointer;transition:all .3s ease;padding:20px;min-height:100px;position:relative;overflow:hidden}.command-button:hover{background:#ffffff1f;border-color:#fff3;transform:translateY(-2px)}.command-button:active{transform:translateY(0)}.command-icon{margin-bottom:8px;display:flex;align-items:center;justify-content:center}.command-name{font-size:12px;font-weight:500;color:#fff;text-align:center;word-wrap:break-word;line-height:1.2}.no-selection-message{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;color:#fff9;font-size:14px;text-align:center}.no-selection-message div:first-child{font-size:40px;margin-bottom:10px}@media (max-width: 768px){.shades-main-content{flex-direction:column;padding:0 10px 15px;gap:15px}.shades-sidebar{width:100%;height:auto;padding:10px 0}.shades-device-list{display:none}.shades-mobile-dropdown{display:block}.shades-commands{padding:15px}.commands-grid{grid-template-columns:repeat(2,1fr);gap:12px}.command-button{min-height:95px;padding:18px 15px}}.tv-remote{flex:1;display:flex;flex-direction:column;background:#ffffff08;border-radius:10px;border:1px solid rgba(255,255,255,.1);padding:20px;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.tv-remote::-webkit-scrollbar{display:none}.remote-sections{display:flex;flex-direction:column;gap:20px}.remote-section{display:flex;flex-direction:column;gap:10px}.section-title{font-size:14px;font-weight:600;color:#fffc;margin-bottom:5px;text-transform:uppercase;letter-spacing:1px}.remote-buttons-row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.remote-buttons-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:10px;justify-items:center}.navigation-pad{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:8px;max-width:200px;margin:0 auto}.nav-up{grid-column:2;grid-row:1}.nav-left{grid-column:1;grid-row:2}.nav-center{grid-column:2;grid-row:2}.nav-right{grid-column:3;grid-row:2}.nav-down{grid-column:2;grid-row:3}.nav-other{grid-column:1 / -1;grid-row:4}.remote-button{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#c8c8c81a;border:2px solid rgba(180,180,180,.2);border-radius:12px;cursor:pointer;transition:all .3s ease;padding:12px 8px;min-height:60px;min-width:60px;position:relative;overflow:hidden;color:#e0e0e0}.remote-button:hover{background:#dcdcdc26;border-color:#c8c8c84d;transform:translateY(-2px)}.remote-button:active{transform:translateY(0);background:#a0a0a033}.button-icon{margin-bottom:4px;display:flex;align-items:center;justify-content:center}.button-label{font-size:10px;font-weight:500;color:#e0e0e0;text-align:center;word-wrap:break-word;line-height:1.2}.power-button{background:#6464644d;border-color:#78787866;color:#f44}.power-button:hover{background:#78787866;border-color:#8c8c8c80}.volume-button{background:#8c8c8c33;border-color:#a0a0a04d}.volume-button:hover{background:#a0a0a04d;border-color:#b4b4b466}.nav-button{background:#78787840;border-color:#8c8c8c59}.nav-button:hover{background:#8c8c8c59;border-color:#a0a0a073}.nav-center{background:#64646466;border-color:#78787880;border-radius:50%}.media-button{background:#82828233;border-color:#9696964d}.media-button:hover{background:#9696964d;border-color:#aaa6}.other-button{background:#6e6e6e33;border-color:#8282824d}.other-button:hover{background:#8282824d;border-color:#96969666}.numpad-button{background:#5a5a5a4d;border-color:#6e6e6e66;min-width:60px;min-height:60px;border-radius:8px}.numpad-button:hover{background:#6e6e6e66;border-color:#82828280}.numpad-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;justify-items:center;max-width:216px;margin:0 auto}.numpad-text{font-size:29px;font-weight:700;color:#fff;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.numpad-zero{grid-column:2 / 3}.disc-button{background:#5050504d;border-color:#64646466}.disc-button:hover{background:#64646466;border-color:#78787880}.tv-source-selection{display:flex;flex-direction:column;width:220px;padding:20px;background:#1e1e1ef2;border-radius:15px;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);gap:15px;max-height:600px;overflow-y:auto}.source-title{font-size:14px;font-weight:600;color:#fff;text-align:center;opacity:.9;margin-bottom:10px;letter-spacing:1px}.current-source-display{display:flex;flex-direction:column;gap:8px;padding:12px;background:#32323299;border-radius:10px;border:1px solid rgba(255,255,255,.1)}.current-source-label{font-size:11px;color:#aaa;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.current-source-info{display:flex;align-items:center;gap:8px}.current-source-icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px}.current-source-name{font-size:13px;color:#fff;font-weight:500}.source-buttons{display:flex;flex-direction:column;gap:8px}.source-button{display:flex;align-items:center;gap:10px;padding:12px;background:#5050504d;border:1px solid rgba(120,120,120,.3);border-radius:10px;cursor:pointer;transition:all .3s ease;color:#e0e0e0;text-align:left;width:100%}.source-button:hover{background:#64646466;border-color:#8c8c8c66;transform:translateY(-1px)}.source-button.active{background:#4a9eff4d;border-color:#4a9eff80;color:#fff}.source-button.active:hover{background:#4a9eff66;border-color:#4a9eff99}.source-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0}.source-name{font-size:12px;font-weight:500;color:inherit}.off-mode-message,.no-mode-message{display:flex;flex-direction:column;align-items:center;justify-content:center;height:300px;color:#aaa;text-align:center;gap:10px}.off-mode-message div:first-child,.no-mode-message div:first-child{font-size:60px;margin-bottom:10px}.off-mode-message div:nth-child(2),.no-mode-message div:nth-child(2){font-size:18px;font-weight:500;color:#ccc}.tv-scenes{flex:1;display:flex;flex-direction:column;background:#ffffff08;border-radius:10px;border:1px solid rgba(255,255,255,.1);padding:20px;overflow-y:auto;transition:all .3s ease;scrollbar-width:none;-ms-overflow-style:none}.tv-scenes::-webkit-scrollbar{display:none}.tv-remote-panel{width:0;background:#141414f2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-left:1px solid rgba(255,255,255,.1);padding:0;overflow-y:auto;transition:all .4s cubic-bezier(.4,0,.2,1);scrollbar-width:none;-ms-overflow-style:none}@media (max-width: 768px){.tv-control{height:auto;min-height:100vh;overflow-y:auto;padding-bottom:120px}}.aircon-control{height:100vh;display:flex;flex-direction:column;padding-bottom:120px;box-sizing:border-box;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.aircon-control::-webkit-scrollbar{display:none}.aircon-main-content{display:flex;flex:1;height:calc(100% - 80px);padding:0 20px 20px;gap:20px;scrollbar-width:none;-ms-overflow-style:none}.aircon-main-content::-webkit-scrollbar{display:none}.aircon-sidebar{width:200px;background:#ffffff0d;border-radius:10px;border:1px solid rgba(255,255,255,.1);padding:15px 0}.aircon-mobile-dropdown{display:none}.aircon-device-list{display:flex;flex-direction:column;gap:8px}.aircon-device-item{display:flex;align-items:center;justify-content:space-between;padding:12px 15px;margin:0 8px;border-radius:8px;cursor:pointer;transition:all .3s ease;border:1px solid transparent}.aircon-device-item:hover{background:#ffffff1a}.aircon-device-item.selected{background:#4a9eff33;border-color:#4a9eff}.aircon-device-item.device-on .device-name{color:#4a9eff}.aircon-modes{flex:1;display:flex;flex-direction:column;background:#ffffff08;border-radius:10px;border:1px solid rgba(255,255,255,.1);padding:20px;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.aircon-modes::-webkit-scrollbar{display:none}.modes-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:15px;margin-bottom:20px;max-width:600px}.mode-button{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#ffffff14;border:2px solid rgba(255,255,255,.1);border-radius:12px;cursor:pointer;transition:all .3s ease;padding:20px;min-height:100px;position:relative;overflow:hidden}.mode-button:hover{background:#ffffff1f;border-color:#fff3;transform:translateY(-2px)}.mode-button:active{transform:translateY(0)}.mode-button.active{background:#4a9eff33;border-color:#4a9eff;box-shadow:0 0 20px #4a9eff4d}.mode-button.off-button{background:#ff57221a;border-color:#ff57224d}.mode-button.off-button:hover{background:#ff572233;border-color:#ff572280}.mode-button.disabled{opacity:.3;cursor:not-allowed}.mode-button.disabled:hover{transform:none;background:#ffffff14;border-color:#ffffff1a}.mode-icon{margin-bottom:8px;display:flex;align-items:center;justify-content:center}.mode-name{font-size:12px;font-weight:500;color:#fff;text-align:center;word-wrap:break-word;line-height:1.2}.active-glow{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(45deg,transparent,rgba(74,158,255,.1),transparent);border-radius:10px;animation:glow 2s ease-in-out infinite}@keyframes glow{0%,to{opacity:0}50%{opacity:1}}.temperature-controls{margin-top:20px;padding-top:15px;border-top:1px solid rgba(255,255,255,.1)}.control-button-small{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#ffffff0d;border:1px solid rgba(255,255,255,.15);border-radius:8px;cursor:pointer;transition:all .3s ease;padding:15px 20px;min-width:100px;min-height:70px;color:#fff}.control-button-small:hover{background:#ffffff1a;border-color:#ffffff4d;transform:translateY(-1px)}.control-button-small:active{transform:translateY(0)}.control-icon{margin-bottom:4px;display:flex;align-items:center;justify-content:center}.control-label{font-size:10px;font-weight:500;text-align:center}@media (max-width: 768px){.aircon-main-content{flex-direction:column;padding:0 10px 15px;gap:15px}.aircon-sidebar{width:100%;height:auto;padding:10px 0}.aircon-device-list{display:none}.aircon-mobile-dropdown{display:block}.aircon-modes{padding:15px}.modes-grid{grid-template-columns:repeat(2,1fr);gap:12px}.mode-button{min-height:80px;padding:15px}.control-buttons-row{gap:8px}.control-button-small{min-width:90px;min-height:75px;padding:15px}}.current-temperature-display{margin:20px 0;padding:15px;border-radius:15px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.temperature-display-container{display:flex;flex-direction:column;align-items:center;gap:8px}.temperature-icon{color:#4fc3f7;margin-bottom:5px}.temperature-value{display:flex;align-items:baseline;gap:5px;margin-bottom:5px}.temperature-number{font-size:36px;font-weight:700;color:#fff;line-height:1}.temperature-unit{font-size:20px;color:#b0bec5;font-weight:500}.temperature-label{font-size:14px;color:#90a4ae;text-align:center;font-weight:500;letter-spacing:.5px}.temperature-number:has-text("N/A"),.temperature-number[data-na=true]{color:#90a4ae;font-style:italic;opacity:.7}.temperature-number.unavailable{color:#90a4ae;font-style:italic;opacity:.7}@media (max-width: 480px){.temperature-number{font-size:28px}.temperature-unit{font-size:16px}.temperature-label{font-size:12px}}.control-main-content{display:flex;flex:1;height:calc(100% - 80px);padding:0 20px 20px;gap:20px;scrollbar-width:none;-ms-overflow-style:none}.control-main-content::-webkit-scrollbar{display:none}.control-sidebar{width:200px;background:#ffffff0d;border-radius:10px;border:1px solid rgba(255,255,255,.1);padding:15px 0}.control-mobile-dropdown{display:none}@media (max-width: 768px){.control-mobile-dropdown{display:block;margin-bottom:15px}}.zone-list{display:flex;flex-direction:column;gap:8px;padding:0 15px}@media (max-width: 768px){.zone-list{flex-direction:row;flex-wrap:wrap;padding:0;gap:10px}}.zone-item{display:flex;align-items:center;justify-content:space-between;padding:12px 15px;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#ffffff08;border:1px solid rgba(255,255,255,.05)}.zone-item:hover{background:#ffffff14;border-color:#ffffff26}.zone-item.selected{background:#4a9eff26;border-color:#4a9eff4d}.zone-name{font-size:16px;font-weight:500;color:#fff}@media (max-width: 768px){.zone-item{flex:0 1 auto;min-width:fit-content;padding:10px 20px;justify-content:center}.zone-name{font-size:14px;white-space:nowrap}}.zone-device-count{font-size:12px;color:#fff9;background:#ffffff1a;padding:2px 6px;border-radius:10px;min-width:18px;text-align:center}.control-devices{flex:1;display:flex;flex-direction:column;background:#ffffff08;border-radius:10px;border:1px solid rgba(255,255,255,.1);padding:20px;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.control-devices::-webkit-scrollbar{display:none}.device-section{margin-bottom:30px;padding:20px;background:#ffffff05;border-radius:10px;border:1px solid rgba(255,255,255,.08)}.device-section:last-child{margin-bottom:0}.device-header{display:flex;align-items:center;gap:12px;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.1)}.device-icon{width:32px;height:32px;background:#4a9eff26;border-radius:8px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(74,158,255,.3)}.device-name{font-size:18px;font-weight:600;color:#fff;flex:1}.device-status-indicator{width:8px;height:8px;border-radius:50%;background:#f44}.device-status-indicator.on{background:#4f4;box-shadow:0 0 8px #44ff4480}.device-modes{margin-bottom:20px}.device-modes-title{font-size:14px;font-weight:500;color:#ffffffb3;margin-bottom:12px;text-transform:uppercase;letter-spacing:.5px}.control-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px}.control-button{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 12px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:10px;cursor:pointer;transition:all .2s ease;position:relative;overflow:hidden}.control-button:hover{background:#ffffff1a;border-color:#fff3;transform:translateY(-1px)}.control-button:active{transform:translateY(0)}.control-button.active{background:#4a9eff33;border-color:#4a9eff66;color:#4a9eff}.control-button.off-button{background:#ff44441a;border-color:#f443}.control-button.off-button.active{background:#f443;border-color:#f446}.control-button.disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.control-icon{font-size:42px;color:#4a9eff}.control-name{font-size:22px;font-weight:500;color:#fff;margin-bottom:4px;text-align:center;line-height:1.2}.control-button.active .control-icon,.control-button.active .control-name{color:#4a9eff}.active-glow{position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at center,rgba(74,158,255,.1) 0%,transparent 70%);pointer-events:none;border-radius:10px}.device-additional-controls{margin-top:15px}.device-controls-title{font-size:13px;font-weight:500;color:#fff9;margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px}.control-buttons-row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.control-button-small{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 16px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;cursor:pointer;transition:all .2s ease;color:#fff;font-size:12px}.control-button-small:hover{background:#ffffff1a;border-color:#fff3}.control-button-small .control-icon{font-size:33px;color:#4a9eff}.control-label{font-size:11px;font-weight:500;color:#fffc}@media (max-width: 768px){.control-main-content{flex-direction:column;gap:15px;padding:0 10px 15px;overflow-y:auto;min-height:auto}.control-main-content.remote-visible{flex-direction:column!important;gap:8px!important;padding:0 8px 15px!important;display:grid!important;grid-template-columns:1fr 45%!important;grid-template-rows:auto auto!important;grid-template-areas:"sidebar remote" "devices remote"!important}.control-sidebar{order:1;width:100%;max-height:none;background:#ffffff0d;border-radius:10px;border:1px solid rgba(255,255,255,.1);padding:15px;margin-bottom:20px}.control-main-content.remote-visible .control-sidebar{grid-area:sidebar!important;width:100%!important;margin-bottom:10px!important;margin-right:0}.control-devices{order:2;width:100%;padding:15px}.control-main-content.remote-visible .control-devices{grid-area:devices!important;width:100%!important;padding:15px!important}.control-grid{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:10px}.control-button{padding:8px 6px}.control-icon{font-size:36px}.control-name{font-size:21px}}.no-zones-message,.no-devices-message,.no-selection-message{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;color:#fff9;text-align:center;font-size:16px}.no-zones-message div:first-child,.no-devices-message div:first-child,.no-selection-message div:first-child{font-size:48px;margin-bottom:15px}.tv-remote-panel{width:0;background:#141414f2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-left:1px solid rgba(255,255,255,.1);padding:0;overflow-y:auto;transition:all .4s cubic-bezier(.4,0,.2,1);z-index:1000;scrollbar-width:none;-ms-overflow-style:none}.tv-remote-panel::-webkit-scrollbar{display:none}.tv-remote-panel.visible{width:30%;padding:20px}.remote-section{margin-bottom:20px}.remote-section:last-child{margin-bottom:0}.remote-commands-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:15px}.remote-command-button{display:flex;flex-direction:column;align-items:center;gap:8px;padding:18px 14px;background:#ffffff14;border:1px solid rgba(255,255,255,.15);border-radius:12px;cursor:pointer;transition:all .2s ease;color:#fff;font-size:14px}.remote-command-button:hover{background:#ffffff26;border-color:#ffffff4d;transform:translateY(-1px)}.remote-command-button:active{transform:translateY(0)}.remote-command-icon{font-size:24px;color:#4a9eff}.remote-command-name{font-size:12px;font-weight:500;color:#ffffffe6;text-align:center;line-height:1.2}.remote-button.channel-button{background:#4a9eff1a;border-color:#4a9eff4d}.remote-button.channel-button:hover{background:#4a9eff33;border-color:#4a9eff80}@media (max-width: 768px){.tv-remote-panel.visible{grid-area:remote!important;width:100%!important;padding:15px}.remote-commands-grid{grid-template-columns:repeat(3,1fr);gap:8px}.remote-command-button{padding:15px 8px;min-height:80px}.remote-command-icon{font-size:20px}.remote-command-name{font-size:10px}.category-icon-wrapper{width:75px;height:75px}.category-icon-image{width:50px;height:50px}.category-label-caps{font-size:16px}.scene-icon-wrapper{width:65px;height:65px}.scene-icon-image{width:45px;height:45px}.time-display{font-size:60px}.date-display{font-size:24px}}.current-temperature-display{display:flex;justify-content:center;align-items:center;margin:12px 0;padding:12px;background:#ffffff0d;border-radius:10px;border:1px solid rgba(255,255,255,.1);flex:1;min-width:0}.temperature-display-container{display:flex;align-items:center;gap:8px;justify-content:center}.device-additional-controls{display:flex;flex-direction:column;gap:15px}.device-additional-controls .device-controls-title{margin-bottom:10px}.temperature-controls-row{display:flex;align-items:center;gap:15px;justify-content:center}.control-buttons-row{display:flex;gap:8px;justify-content:center}.device-custom-content.temperature-display-moved{margin:0;flex:0 0 auto;width:200px}.temperature-icon{color:#4a9eff}.temperature-value{display:flex;align-items:baseline;gap:4px}.temperature-number{font-size:64px;font-weight:600;color:#fff}.temperature-number.unavailable{color:#ffffff80;font-style:italic}.temperature-unit{font-size:32px;color:#ffffffb3}.temperature-label{font-size:0px;color:#fff9;margin-left:8px;display:none}.temperature-display-moved .current-temperature-display{margin:6px 0;padding:6px;background:#ffffff08}.temperature-display-moved .temperature-icon{transform:scale(.65)}.temperature-display-moved .temperature-number{font-size:48px}.temperature-display-moved .temperature-unit{font-size:24px}.temperature-display-moved .temperature-label{font-size:8px}.loading-spinner{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;padding:2rem}.spinner{width:40px;height:40px;border:4px solid rgba(26,54,93,.1);border-left:4px solid #1a365d;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}.loading-spinner p{color:#1a365d;font-size:.9rem;margin:0;opacity:.8}.app-loading{display:flex;align-items:center;justify-content:center;min-height:50vh}@media (display-mode: standalone){.home-automation-app{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}}.home-automation-app{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;cursor:default}.control-button,.control-button-small,button[class*=control]{user-select:none!important;-webkit-user-select:none!important;-moz-user-select:none!important;-ms-user-select:none!important;touch-action:none!important;-webkit-touch-callout:none!important;-webkit-tap-highlight-color:transparent!important;-webkit-user-drag:none!important;-khtml-user-drag:none!important;-moz-user-drag:none!important;-o-user-drag:none!important;cursor:pointer!important;outline:none!important}.control-button img,.control-button-small img,button[class*=control] img{-webkit-user-drag:none!important;-khtml-user-drag:none!important;-moz-user-drag:none!important;-o-user-drag:none!important;pointer-events:none}.device-section{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.control-button-small.pressed{background:#4a9eff4d!important;transform:scale(.95)!important;box-shadow:inset 0 2px 8px #4a9eff66!important;border-color:#4a9eff!important}.control-button.pressed{background:#4a9eff33!important;transform:scale(.98)!important;box-shadow:inset 0 2px 12px #4a9eff4d!important}@media (hover: none) and (pointer: coarse){.control-button,.control-button-small{-webkit-touch-callout:none!important;user-select:none!important;-webkit-user-select:none!important;-webkit-tap-highlight-color:rgba(0,0,0,0)!important}}@media (hover: hover) and (pointer: fine){.control-button,.control-button-small{user-select:none!important;-webkit-user-select:none!important;-moz-user-select:none!important;-webkit-user-drag:none!important}}.preset-channel-button{background:#d0d0d0!important;color:#333!important;border:2px solid #d0d0d0!important;box-shadow:0 2px 4px #0000001a!important;padding:4px!important;width:65px!important;height:65px!important}.preset-channel-button:hover{background:#d8d8d8!important;border-color:#4a9eff!important;box-shadow:0 4px 8px #00000026!important}.preset-channel-button:active{background:#c8c8c8!important;transform:translateY(1px)!important}.preset-channel-button .button-icon{width:100%!important;height:100%!important;display:flex!important;align-items:center!important;justify-content:center!important;margin:0!important;padding:0!important}.preset-channel-button .button-icon img{width:95%!important;height:95%!important;object-fit:contain!important;margin:0!important;padding:0!important}.preset-channel-button .button-label{color:#333!important;font-weight:600!important;font-size:11px!important;margin-top:2px!important;text-align:center!important}.icon-power-on:before{content:"⏻";color:#166534}.icon-power-off:before{content:"⭘";color:#991b1b}.icon-restart:before{content:"↻";color:#92400e}.icon-command:before{content:"⚙";color:#4b5563}.status-normal:before{content:"✓ ";color:#10b981}.status-attention:before{content:"⚠ ";color:#f59e0b}.status-error:before{content:"✗ ";color:#ef4444}.status-unknown:before{content:"? ";color:#6b7280}.crestron-settings{max-width:800px;margin:0 auto;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#fff;border-radius:8px;box-shadow:0 2px 10px #0000001a}.crestron-settings.loading,.crestron-settings.error{text-align:center;padding:40px;color:#666}.settings-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:16px;border-bottom:2px solid #f0f0f0}.settings-header h3{margin:0;color:#333;font-size:24px}.close-button{background:none;border:none;font-size:24px;cursor:pointer;color:#999;padding:4px 8px;border-radius:4px}.close-button:hover{background:#f0f0f0;color:#666}.status-section{margin-bottom:32px}.status-section h4{margin:0 0 16px;color:#444;font-size:18px}.status-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;margin-bottom:20px}.status-item{display:flex;flex-direction:column;gap:4px}.status-item label{font-weight:600;color:#555;font-size:14px}.status-value{padding:8px 12px;border-radius:6px;font-weight:500;font-size:14px}.status-value.url{background:#e3f2fd;color:#1976d2}.status-value.hardware{background:#f3e5f5;color:#7b1fa2}.status-value.user{background:#e8f5e8;color:#388e3c}.status-value.env{background:#fff3e0;color:#f57c00}.status-value.configured{background:#e8f5e8;color:#2e7d32}.status-value.incomplete,.status-value.missing{background:#ffebee;color:#c62828}.status-value.crcomlib{background:#f3e5f5;color:#7b1fa2}.status-value.webxpanel{background:#e3f2fd;color:#1976d2}.status-value.unknown{background:#fff3e0;color:#f57c00}.connection-explanation{margin:16px 0;padding:12px;background:#e3f2fd;border-left:4px solid #2196f3;border-radius:4px}.connection-explanation h5{margin:0 0 8px;color:#1976d2;font-size:14px}.explanation-text{margin:0;color:#424242;font-size:13px;line-height:1.4}.missing-env-vars{background:#fff3cd;border:1px solid #ffeaa7;border-radius:6px;padding:16px;margin-top:16px}.missing-env-vars h5{margin:0 0 12px;color:#856404}.missing-env-vars ul{margin:8px 0;padding-left:20px}.missing-env-vars li{margin:4px 0}.missing-env-vars code{background:#f8f9fa;padding:2px 6px;border-radius:3px;font-family:Courier New,monospace;font-size:13px}.env-help{margin:12px 0 0;font-size:14px;color:#856404;font-style:italic}.settings-form{margin-bottom:32px}.settings-form h4{margin:0 0 8px;color:#444;font-size:18px}.form-description{margin:0 0 20px;color:#666;font-size:14px;line-height:1.5}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:6px;font-weight:600;color:#333;font-size:14px}.form-group input{width:100%;padding:10px 12px;border:2px solid #e0e0e0;border-radius:6px;font-size:14px;transition:border-color .2s ease}.form-group input:focus{outline:none;border-color:#1976d2;box-shadow:0 0 0 3px #1976d21a}.form-group input:disabled{background:#f5f5f5;color:#999;cursor:not-allowed}.form-group small{display:block;margin-top:4px;color:#666;font-size:12px;line-height:1.4}.form-actions{display:flex;gap:12px;margin-top:24px}.save-button{background:#1976d2;color:#fff;border:none;padding:12px 24px;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:background-color .2s ease}.save-button:hover:not(:disabled){background:#1565c0}.save-button:disabled{background:#ccc;cursor:not-allowed}.reset-button{background:#f5f5f5;color:#666;border:1px solid #ddd;padding:12px 24px;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease}.reset-button:hover:not(:disabled){background:#e0e0e0;border-color:#bbb}.reset-button:disabled{opacity:.5;cursor:not-allowed}.system-section{background:#f8f9fa;border:1px solid #e9ecef;border-radius:8px;padding:16px;margin:20px 0}.system-section h4{margin:0 0 16px;color:#495057}.system-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}.system-info-item{display:flex;flex-direction:column;gap:4px}.system-info-item label{font-weight:600;color:#6c757d;font-size:12px;text-transform:uppercase;letter-spacing:.5px}.system-info-item span{color:#495057;font-size:14px;font-weight:500}.debug-section{border-top:1px solid #e0e0e0;padding-top:20px}.debug-section details{background:#f8f9fa;border:1px solid #e9ecef;border-radius:6px;padding:12px}.debug-section summary{cursor:pointer;font-weight:600;color:#495057;margin-bottom:8px;font-size:16px}.debug-content{margin-top:16px}.debug-content h5{margin:16px 0 8px;color:#495057;font-size:14px;font-weight:600;border-bottom:1px solid #dee2e6;padding-bottom:4px}.debug-content h5:first-child{margin-top:0}.debug-section pre{background:#fff;border:1px solid #dee2e6;border-radius:4px;padding:12px;margin:8px 0 0;font-size:11px;font-family:Courier New,monospace;overflow-x:auto;white-space:pre-wrap;word-wrap:break-word;max-height:300px;overflow-y:auto}@media (max-width: 768px){.crestron-settings{margin:0;padding:16px;border-radius:0}.status-grid{grid-template-columns:1fr}.form-actions{flex-direction:column}.save-button,.reset-button{width:100%}}.settings-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.settings-modal-overlay .crestron-settings{max-height:90vh;overflow-y:auto;margin:0}.offline-indicator{position:fixed;top:0;left:0;right:0;z-index:9999}.offline-banner,.online-banner{color:#fff;padding:.5rem 1rem;text-align:center;font-size:.875rem;font-weight:500;display:flex;align-items:center;justify-content:center;gap:.5rem;animation:slideDown .3s ease-out}.offline-banner{background:#dc2626}.online-banner{background:#059669}.offline-icon,.online-icon{font-size:1rem}@keyframes slideDown{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}@media (max-width: 768px){.offline-banner,.online-banner{font-size:.75rem;padding:.375rem .75rem}}.offline-queue-indicator{position:fixed;bottom:1rem;right:1rem;z-index:1000;pointer-events:auto}.queue-status{background:#000c;color:#fff;padding:.5rem .75rem;border-radius:20px;font-size:.75rem;display:flex;align-items:center;gap:.5rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);transition:all .2s ease}.queue-status.online{background:#059669e6}.queue-status.offline{background:#dc2626e6}.queue-status.syncing{background:#3b82f6e6}.queue-status:hover{transform:translateY(-1px);box-shadow:0 4px 12px #0003}.queue-icon{font-size:.9rem}.queue-status.syncing .queue-icon{animation:spin 1s linear infinite}.queue-text{font-weight:500}.sync-hint{font-size:.65rem;opacity:.8;margin-left:.25rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 768px){.offline-queue-indicator{bottom:.5rem;right:.5rem}.queue-status{font-size:.7rem;padding:.375rem .5rem}.sync-hint{display:none}}