*{margin:0;padding:0;box-sizing:border-box}body{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;background-color:#111827;color:#fff}.auth-container{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1rem;background-color:#111827}.auth-card{background-color:#1f2937;padding:2rem;border-radius:.5rem;box-shadow:0 25px 50px -12px #00000040;width:100%;max-width:28rem}.auth-header{display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:1.5rem}.auth-logo{height:2.5rem;width:auto}.auth-title{font-size:1.5rem;font-weight:700;color:#fff;margin:0}.form-group{margin-bottom:1rem}.form-label{display:block;font-size:.875rem;font-weight:500;color:#d1d5db;margin-bottom:.5rem}.form-input,.form-textarea,.form-select{width:100%;padding:.75rem;border:1px solid #4b5563;border-radius:.375rem;background-color:#374151;color:#fff;font-size:1rem;transition:all .2s}.form-input::placeholder,.form-textarea::placeholder{color:#9ca3af}.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.form-select option{background-color:#374151;color:#fff}.form-textarea{resize:vertical;min-height:100px}.error-message{color:#f87171;font-size:.875rem;margin-top:.5rem}.btn-primary{width:100%;background-color:#3b82f6;color:#fff;font-weight:500;padding:.75rem 1rem;border-radius:.375rem;border:none;cursor:pointer;transition:background-color .2s;font-size:1rem}.btn-primary:hover{background-color:#2563eb}.btn-primary:focus{outline:none;box-shadow:0 0 0 3px #3b82f680}.btn-disabled{background-color:#6b7280;cursor:not-allowed}.btn-disabled:hover{background-color:#6b7280}.btn-secondary{background-color:#6b7280;color:#fff;font-weight:500;padding:.75rem 1rem;border-radius:.375rem;border:none;cursor:pointer;transition:background-color .2s;font-size:1rem}.btn-secondary:hover{background-color:#4b5563}.wizard-steps{display:flex;align-items:center;justify-content:center;margin:1.5rem 0;gap:1rem}.step-indicator{width:2.5rem;height:2.5rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:1rem;transition:all .3s}.step-indicator.active{background-color:#3b82f6;color:#fff}.step-indicator.completed{background-color:#10b981;color:#fff}.step-indicator:not(.active):not(.completed){background-color:#374151;color:#9ca3af}.step-line{width:3rem;height:2px;background-color:#374151}.step-title{font-size:1.125rem;font-weight:600;color:#fff;margin-bottom:1rem;text-align:center}.wizard-buttons{display:flex;gap:1rem;margin-top:1rem}.wizard-buttons button{flex:1}.dashboard-container{min-height:100vh;background-color:#111827;color:#fff}.dashboard-header{background-color:#1f2937;padding:1rem;box-shadow:0 4px 6px -1px #0000001a}.header-content{max-width:80rem;margin:0 auto;display:flex;justify-content:space-between;align-items:center}.header-left{display:flex;align-items:center;gap:1rem}.logo{height:2rem;width:auto}.header-right{display:flex;align-items:center;gap:1rem}.theme-toggle{background:none;border:1px solid #4b5563;border-radius:.375rem;width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;font-size:1.125rem;cursor:pointer;transition:all .2s}.theme-toggle:hover{border-color:#3b82f6;background-color:#3b82f61a}.device-selector{padding:.5rem;border:1px solid #4b5563;border-radius:.375rem;background-color:#374151;color:#fff;font-size:.875rem;min-width:200px;transition:all .2s}.device-selector:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.device-selector option{background-color:#374151;color:#fff}.dashboard-title{font-size:1.5rem;font-weight:700}.connection-status{display:flex;align-items:center;gap:.5rem}.status-dot{width:.75rem;height:.75rem;border-radius:50%}.status-dot.connected{background-color:#10b981}.status-dot.disconnected{background-color:#ef4444}.status-text{font-size:.875rem}.status-text.connected{color:#10b981}.status-text.disconnected{color:#ef4444}.btn-logout{background-color:#dc2626;color:#fff;padding:.5rem 1rem;border-radius:.375rem;border:none;cursor:pointer;font-size:.875rem;font-weight:500;transition:background-color .2s}.btn-logout:hover{background-color:#b91c1c}.dashboard-main{max-width:80rem;margin:0 auto;padding:1.5rem}.devices-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem}.device-data-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.75rem}.data-card{background-color:#1f2937;border-radius:.375rem;padding:.75rem;box-shadow:0 2px 4px #0000001a;border-left:3px solid #3b82f6}.data-key{font-size:.75rem;font-weight:600;color:#9ca3af;margin-bottom:.375rem;text-transform:uppercase;letter-spacing:.05em;line-height:1.2;word-break:break-word;overflow-wrap:break-word}.data-key.small{font-size:.625rem}.data-value{font-size:.875rem;color:#fff;word-break:break-word;white-space:pre-wrap;font-family:Courier New,monospace;background-color:#374151;padding:.375rem;border-radius:.25rem;border:1px solid #4b5563}.data-value.status-active{background-color:#059669;border-color:#10b981;color:#fff;font-weight:600}.device-card{background-color:#1f2937;border-radius:.5rem;padding:1.5rem;box-shadow:0 4px 6px -1px #0000001a}.device-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.device-name{font-size:1.125rem;font-weight:600}.device-status{display:flex;align-items:center;gap:.5rem}.device-status-dot{width:.75rem;height:.75rem;border-radius:50%}.device-status-dot.online{background-color:#10b981}.device-status-dot.offline{background-color:#ef4444}.device-status-text{font-size:.875rem;color:#d1d5db;text-transform:capitalize}.device-metrics{display:flex;flex-direction:column;gap:.75rem}.metric-row{display:flex;justify-content:space-between;align-items:center}.metric-label{color:#9ca3af}.metric-value{font-weight:500}.metric-value.temperature{color:#60a5fa}.metric-value.humidity{color:#34d399}.metric-value.timestamp{color:#d1d5db;font-size:.875rem}.no-devices{text-align:center;padding:3rem 0}.no-devices-title{color:#9ca3af;font-size:1.125rem;margin-bottom:.5rem}.no-devices-subtitle{color:#6b7280;font-size:.875rem}.loading-container{min-height:100vh;background-color:#111827;display:flex;align-items:center;justify-content:center}.loading-text{color:#fff;font-size:1.125rem}.section{margin-bottom:2rem}.section-title{display:flex;align-items:center;gap:.75rem;font-size:1.25rem;font-weight:600;color:#fff;margin-bottom:1.5rem;padding:1rem;background:linear-gradient(135deg,#4b5563,#6b7280);border-radius:.5rem;border-left:4px solid #f59e0b;box-shadow:0 4px 6px #0003}.section-icon{font-size:1.5rem}.preset-actions-card{background-color:#1f2937;border-radius:.5rem;padding:1.5rem;margin-top:1rem;box-shadow:0 4px 6px -1px #0000001a;border-left:4px solid #10b981}.preset-actions-header{margin-bottom:1.5rem}.preset-actions-title{font-size:1.125rem;font-weight:600;color:#fff;margin-bottom:.5rem}.preset-actions-subtitle{font-size:.875rem;color:#9ca3af}.preset-buttons{display:flex;gap:1rem;flex-wrap:wrap}.preset-btn{flex:1;min-width:120px;padding:.75rem 1.5rem;border:none;border-radius:.5rem;font-weight:600;font-size:1rem;cursor:pointer;transition:all .2s;box-shadow:0 2px 4px #0003}.preset-btn:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000004d}.preset-btn:active{transform:translateY(0)}.preset-btn-active{opacity:.7;pointer-events:none;transform:scale(.95)}.preset-btn-away{background:linear-gradient(135deg,#6b7280,#9ca3af);color:#fff}.preset-btn-away:hover{background:linear-gradient(135deg,#4b5563,#6b7280)}.preset-btn-numbered{background:linear-gradient(135deg,#3b82f6,#60a5fa);color:#fff}.preset-btn-numbered:hover{background:linear-gradient(135deg,#2563eb,#3b82f6)}.preset-btn-boost{background:linear-gradient(135deg,#ef4444,#f87171);color:#fff}.preset-btn-boost:hover{background:linear-gradient(135deg,#dc2626,#ef4444)}@media (max-width: 768px){.preset-buttons{flex-direction:column}.preset-btn{min-width:auto}}.dashboard-container.light{background-color:#f9fafb;color:#111827}.dashboard-container.light .dashboard-header{background-color:#fff;box-shadow:0 1px 3px #0000001a}.dashboard-container.light .dashboard-title,.dashboard-container.light .section-title{color:#111827}.dashboard-container.light .section-title{background:linear-gradient(135deg,#374151,#4b5563);color:#fff;border-left-color:#f59e0b;box-shadow:0 4px 6px #0000001a}.dashboard-container.light .data-card{background-color:#fff;border-left-color:#3b82f6;box-shadow:0 1px 3px #0000001a}.dashboard-container.light .data-key{color:#6b7280}.dashboard-container.light .data-value{background-color:#f9fafb;color:#111827;border-color:#e5e7eb}.dashboard-container.light .data-value.status-active{background-color:#10b981;border-color:#059669;color:#fff}.dashboard-container.light .preset-actions-card{background-color:#fff;border-left-color:#10b981}.dashboard-container.light .preset-actions-title{color:#111827}.dashboard-container.light .preset-actions-subtitle{color:#6b7280}.dashboard-container.light .device-selector{background-color:#fff;color:#111827;border-color:#d1d5db}.dashboard-container.light .device-selector option{background-color:#fff;color:#111827}.dashboard-container.light .theme-toggle{border-color:#d1d5db}.dashboard-container.light .theme-toggle:hover{border-color:#3b82f6;background-color:#3b82f61a}.dashboard-container.light .loading-text,.dashboard-container.light .no-devices-title{color:#111827}.dashboard-container.light .no-devices-subtitle{color:#6b7280}.auth-container.light{background-color:#f9fafb}.auth-container.light .auth-card{background-color:#fff;box-shadow:0 10px 25px #0000001a}.auth-container.light .auth-title{color:#111827}.auth-container.light .form-label{color:#374151}.auth-container.light .form-input,.auth-container.light .form-textarea,.auth-container.light .form-select{background-color:#fff;color:#111827;border-color:#d1d5db}.auth-container.light .form-input:focus,.auth-container.light .form-textarea:focus,.auth-container.light .form-select:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.auth-container.light .form-select option{background-color:#fff;color:#111827}.auth-container.light .error-message{color:#dc2626}.auth-container.light .loading-text,.auth-container.light .step-title{color:#111827}.auth-container.light .step-indicator:not(.active):not(.completed){background-color:#e5e7eb;color:#6b7280}.auth-container.light .step-line{background-color:#e5e7eb}
