:root{--primary: #1976d2;--primary-hover: #1565c0;--danger: #e53935;--danger-hover: #c62828;--bg: #f5f7fb;--border: #ddd;--error-color: #d32f2f;--error-bg: #fdecea}body{background-color:var(--bg);font-family:system-ui,Segoe UI,Roboto,sans-serif;color:#222;margin:0;padding:2rem}.wrapper{max-width:800px;margin:auto}h1{text-align:center;font-size:1.8rem;margin-bottom:1.5rem}.form-card{background:#fff;border-radius:12px;padding:1.5rem;box-shadow:0 2px 8px #0000000d;margin-bottom:2rem}label{font-weight:600;margin-bottom:.3rem}input{border:1px solid var(--border);border-radius:6px;padding:.5rem .75rem;font-size:.95rem;transition:border-color .2s,box-shadow .2s}input:focus{border-color:var(--primary);box-shadow:0 0 0 3px #1976d226;outline:none}.error{display:flex;align-items:center;background:var(--error-bg);color:var(--error-color);font-size:.85rem;padding:.3rem .5rem;border-radius:5px;margin-top:.25rem;max-width:96%}.error:before{content:"\26a0";margin-right:.3rem}.btn-primary{background-color:var(--primary);color:#fff;border:none;border-radius:6px;padding:.6rem 1.2rem;font-weight:500;cursor:pointer;transition:background-color .2s,transform .1s}.btn-primary:hover{background-color:var(--primary-hover);transform:scale(1.02)}.btn-danger{background-color:var(--danger);color:#fff;border:none;border-radius:6px;padding:.4rem .8rem;cursor:pointer;transition:background-color .2s,transform .1s}.btn-danger:hover{background-color:var(--danger-hover);transform:scale(1.05)}.modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background:#0006;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-card{background:#fff;padding:1.5rem 2rem;border-radius:12px;box-shadow:0 4px 20px #0003;max-width:400px;text-align:center}.modal-buttons{display:flex;justify-content:space-around;margin-top:1.2rem}.btn-secondary{background-color:#888;color:#fff;border:none;border-radius:6px;padding:.5rem 1rem;cursor:pointer}.btn-secondary:hover{background-color:#555}.device-list ul{list-style:none;padding:0;margin:0}.device-list li{display:flex;justify-content:space-between;align-items:flex-start;background:#fff;border-radius:10px;padding:1rem;margin-bottom:.8rem;border:1px solid var(--border);transition:background-color .2s}.device-list li:hover{background:#f9fbff}.device-title{font-weight:600;font-size:1.1rem}.device-subtitle{font-size:.9rem;color:#666}p{margin:.3rem 0;color:#444}time{font-size:.8rem;color:#999}.empty-state{text-align:center;color:#666;font-style:italic}.list-buttons,.edit-buttons{margin-top:.5rem;display:flex;gap:.5rem}input[type=text],input[type=number]{padding:.4rem .6rem;border-radius:5px;border:1px solid var(--border);margin-top:.25rem;margin-bottom:.5rem;width:95%}input[type=text]:focus,input[type=number]:focus{border-color:var(--primary);box-shadow:0 0 0 3px #1976d226;outline:none}.form-toggle-container{display:flex;justify-content:center;margin-bottom:1rem}.btn-primary{background-color:#0078d7;color:#fff;border:none;border-radius:6px;padding:.6rem 1.2rem;font-weight:500;cursor:pointer;transition:.2s ease}.btn-primary:hover{background-color:#005fa3}.form-container{background-color:#f7f7f7;padding:1.5rem;border-radius:10px;box-shadow:0 2px 8px #0000001a;margin-bottom:1.5rem}.form-field{display:flex;flex-direction:column;margin-bottom:1rem}.form-field input{padding:.5rem;border:1px solid #ccc;border-radius:4px}.error{color:#d9534f;font-size:.85rem;margin-top:.25rem}.navbar{display:flex;gap:.5rem;margin-bottom:1rem;align-items:center}.search-input{flex:1;padding:.4rem .6rem;border-radius:4px;border:1px solid #ccc}.btn-secondary{padding:.4rem .8rem;cursor:pointer}
