img{margin-bottom:1.5rem}img:hover{filter:drop-shadow(0 0 2em #673ab8aa)}.home{width:100%}.home section{margin-top:5rem;display:grid;grid-template-columns:repeat(2,1fr);column-gap:1.5rem}.resource{padding:.75rem 1.5rem;border-radius:.5rem;text-align:left;text-decoration:none;color:#222;background-color:#f1f1f1;border:1px solid transparent}.resource:hover{border:1px solid #000;box-shadow:0 25px 50px -12px #673ab888}.device-card{padding:.75rem 1.5rem;border-radius:.5rem;text-decoration:none;color:#222;background-color:#f1f1f1;border:1px solid transparent;display:block;transition:all .3s ease;cursor:pointer;margin-bottom:40px;border-style:solid;border-width:1px;border-color:#333}.device-controls-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.device-card:hover{border:1px solid #000;box-shadow:0 25px 50px -12px #673ab888}.device-card-header{background-color:transparent;display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.device-name{margin:0;font-size:1.25rem}.device-type{color:#fff;padding:.25rem .75rem;font-size:.875rem;font-weight:600}.device-progress{width:100%;height:8px;background-color:#ddd;border-radius:4px;overflow:hidden;margin-bottom:1rem}.device-progress-bar{height:100%;background-color:#673ab8;transition:width .3s ease}.device-meta{list-style:none;margin:0;padding:0;font-size:.875rem;color:#555}.device-meta li{padding:.25rem 0}.device-controls{margin-bottom:.75rem}.device-slider{width:100%;appearance:none;height:10px;border-radius:10px;background:transparent;outline:none;margin:.5rem 0}.device-slider::-webkit-slider-runnable-track{height:10px;background:transparent;border-radius:10px}.device-slider::-moz-range-track{height:10px;background:transparent;border-radius:10px}.device-slider::-webkit-slider-thumb{appearance:none;width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid rgba(103,58,184,.95);box-shadow:0 2px 6px #0003;cursor:pointer;margin-top:-4px}.device-slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid rgba(103,58,184,.95);cursor:pointer}.requested-marker{position:absolute;top:-6px;width:2px;height:calc(100% + 12px);background:#00ff51f2;transform:translate(-50%);pointer-events:none;box-shadow:0 0 6px #ff980040}@media(max-width:639px){.home section{margin-top:5rem;grid-template-columns:1fr;row-gap:1rem}}@media(prefers-color-scheme:dark){.resource{color:#ccc;background-color:#161616}.resource:hover{border:1px solid #bbb}.device-card{color:#ccc;background-color:#161616}.device-card:hover{border:1px solid #bbb}.device-meta{color:#aaa}}.device-card{position:relative;padding-top:1rem}.device-card-header{min-height:64px;padding-right:148px}.device-ico{position:absolute;top:8px;right:8px;width:64px;height:64px;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;border-radius:8px;background:transparent;box-shadow:0 6px 18px #0000001f;pointer-events:none}.device-ico svg,.device-ico img{width:100%;height:100%;display:block;object-fit:contain}@media(max-width:640px){.device-ico{width:64px;height:64px;top:8px;right:8px}.device-card-header{padding-right:80px}}.ds18-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.5rem}.ds18-item{display:flex;justify-content:space-between;align-items:center;padding:.45rem .6rem;border-radius:8px;border:1px solid #eaeaea;box-shadow:0 2px 6px #00000008;transition:transform .12s ease,box-shadow .12s ease,background .12s ease}.ds18-item input:hover{box-shadow:0 0 0 3px #673ab814;border-color:#864eee}.ds18-name{font-weight:600;color:#222;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.ds18-temp{font-weight:700;color:#fff;background:linear-gradient(90deg,#673ab8,#9c27b0);padding:.35rem .55rem;border-radius:999px;min-width:48px;text-align:center}@media(prefers-color-scheme:dark){.ds18-item{background:#fff3}.ds18-name{color:#ddd}.ds18-temp{color:#c8a9ff}}.dc-relay-container{margin-top:.75rem;padding:.75rem 0;display:flex;align-items:center}.toggle-btn{position:relative;width:64px;height:36px;background:#e0e0e0;border:none;border-radius:18px;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;padding:0;font-weight:600;font-size:.85rem;color:#666;overflow:hidden}.toggle-btn.active{background:#673ab8;color:#fff}.toggle-btn:disabled{opacity:.6;cursor:not-allowed}.toggle-state{position:absolute;z-index:1;transition:opacity .2s ease}.toggle-indicator{position:absolute;width:30px;height:30px;background:#fff;border-radius:50%;box-shadow:0 2px 4px #0003;transition:transform .3s ease;left:3px}.toggle-btn.active .toggle-indicator{transform:translate(28px)}.relay-toggle{position:relative;width:80px;height:44px;background:#e8e8e8;border:none;border-radius:22px;cursor:pointer;transition:all .35s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;padding:2px;box-shadow:inset 0 1px 3px #00000014}.relay-toggle.on{background:linear-gradient(135deg,#673ab8,#7e57c2);box-shadow:0 4px 12px #673ab84d}.relay-toggle.off{background:linear-gradient(135deg,#d0d0d0,#e0e0e0)}.relay-toggle:hover:not(:disabled){box-shadow:0 6px 16px #00000026;transform:translateY(-1px)}.relay-toggle:disabled{opacity:.6;cursor:not-allowed}.relay-ball{position:absolute;width:38px;height:38px;background:#fff;border-radius:50%;box-shadow:0 2px 8px #00000026;transition:transform .35s cubic-bezier(.4,0,.2,1);left:3px}.relay-toggle.on .relay-ball{transform:translate(36px)}.relay-label{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:.75rem;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.5px;z-index:0;opacity:.85;transition:opacity .25s ease}.relay-toggle.saving .relay-label{opacity:0}@media(prefers-color-scheme:dark){.relay-toggle{background:linear-gradient(135deg,#2a2a2a,#333);box-shadow:inset 0 1px 3px #0000004d}.relay-toggle.on{background:linear-gradient(135deg,#7e57c2,#9575cd);box-shadow:0 4px 12px #673ab866}.relay-ball{background:#1a1a1a;box-shadow:0 2px 8px #0006}}.device-page{width:100%;margin:0 auto;padding:2rem 1rem}.device-not-found{text-align:center;padding:2rem;background:#f5f5f5;border-radius:8px}.device-page-header{display:flex;gap:2rem;align-items:center;margin-bottom:2rem;padding-bottom:2rem;border-bottom:2px solid #e0e0e0}.device-page-ico{width:120px;height:120px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:#f5f5f5;border-radius:12px;box-shadow:0 4px 12px #00000014}.device-page-ico svg,.device-page-ico img{width:100%;height:100%;object-fit:contain}.device-page-info{flex:1}.device-page-title{margin:0 0 .5rem;font-size:2rem;color:#222}.device-page-type{margin:0;color:#666;font-size:1rem}.device-section{margin-bottom:2rem;padding:1.5rem;background:#f9f9f9;border-radius:8px;border:1px solid #e0e0e0}.device-section h2{margin:0 0 1rem;font-size:1.25rem;color:#333}.device-progress-large{width:100%;height:24px;background:#e0e0e0;border-radius:12px;overflow:hidden;margin-bottom:.5rem}.device-progress-bar-large{height:100%;background:linear-gradient(90deg,#673ab8,#9c27b0);transition:width .3s ease;border-radius:12px}.device-progress-text{display:flex;justify-content:space-between;font-size:.9rem;color:#555;font-weight:600}.device-progress-percent{color:#673ab8}.device-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem}.detail-row{display:flex;flex-direction:column;gap:.25rem;padding:1rem;background:#fff;border-radius:6px;border:1px solid #eee}.detail-label{font-size:.85rem;color:#999;text-transform:uppercase;font-weight:600;letter-spacing:.5px}.detail-value{font-size:1.25rem;font-weight:700;color:#673ab8}.device-pins{display:flex;flex-wrap:wrap;gap:.5rem}.pin-badge{display:inline-block;padding:.5rem 1rem;background:#673ab8;color:#fff;border-radius:20px;font-size:.9rem;font-weight:600}.device-actions{display:flex;gap:1rem;margin-top:2rem;padding-top:2rem;border-top:1px solid #e0e0e0}.btn{padding:.75rem 1.5rem;background:#673ab8;color:#fff;text-decoration:none;border:none;border-radius:6px;cursor:pointer;font-weight:600;transition:background .3s ease;display:inline-block}.btn:hover{background:#5e35b1}.btn-primary{background:#673ab8}@media(prefers-color-scheme:dark){.device-page{color:#ddd}.device-page-header{border-bottom-color:#333}.device-page-title{color:#fff}.device-page-type{color:#aaa}.device-section{background:#1a1a1a;border-color:#333}.device-section h2{color:#fff}.device-progress-large{background:#333}.detail-row{background:#0f0f0f;border-color:#333}.detail-label{color:#888}.device-not-found{background:#1a1a1a}}@media(max-width:640px){.device-page-header{flex-direction:column;gap:1rem}.device-page-ico{width:100px;height:100px}.device-page-title{font-size:1.5rem}.device-details{grid-template-columns:1fr}}.ds18-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.75rem}.ds18-item{display:flex;justify-content:space-between;align-items:center;gap:.75rem;padding:.6rem .75rem;background:#fff;border:1px solid #eee;border-radius:8px;box-shadow:0 2px 6px #0a0a0a08;transition:transform .12s ease,box-shadow .12s ease,background .12s ease}.ds18-left{display:flex;flex-direction:column;gap:.35rem;min-width:0}.ds18-name{font-size:.9rem;font-weight:600;color:#333}.ds18-label{font-size:.95rem;padding:.45rem .6rem;border-radius:6px;border:1px solid #e6e6e6;background:#fafafa;color:#222;outline:none}.ds18-label:focus{box-shadow:0 0 0 3px #673ab814;border-color:#673ab8}.ds18-addr{font-size:.8rem;color:#888;text-align:left}.ds18-temp{font-weight:700;color:#fff;background:linear-gradient(90deg,#673ab8,#9c27b0);padding:.45rem .7rem;border-radius:999px;min-width:64px;text-align:center;white-space:nowrap}@media(prefers-color-scheme:dark){.ds18-item{background:#ffffff05;border-color:#ffffff0a}.ds18-name,.ds18-addr{color:#ddd}.ds18-label{background:#ffffff08;color:#ddd;border-color:#ffffff0d}.ds18-temp{color:#fff}}@media(max-width:640px){.ds18-list{grid-template-columns:1fr}.ds18-temp{min-width:56px;padding:.3rem .6rem}}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#222;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}body{margin:0}#app{display:flex;flex-direction:column;min-height:100vh}header{display:flex;justify-content:flex-end}header nav{display:flex}header a{color:#fff;padding:.75rem;text-decoration:none}header a.active{background-color:#0005}header a:hover{background-color:#0008}main{flex:auto;display:flex;align-items:center;max-width:1280px;margin:2rem;text-align:center}@media(max-width:639px){main{margin:2rem}}@media(prefers-color-scheme:dark){:root{color:#ccc;background-color:#1a1a1a}}.navbar{background-color:#333;padding:1rem;box-shadow:0 2px 4px #0000001a;position:fixed;top:0;width:100%;z-index:100}.navbar-container{max-width:1200px;margin:0 auto;display:flex;justify-content:flex-start;align-items:center;gap:2rem}.navbar-logo{font-size:1.5rem;font-weight:700;color:#fff;text-decoration:none}.hamburger{display:flex;flex-direction:column;background:none;border:none;cursor:pointer;padding:0;gap:5px}.hamburger span{width:25px;height:3px;background-color:#fff;transition:.3s}.hamburger:hover span{background-color:#673ab8}.sidenav{position:fixed;left:0;top:0;width:250px;height:100vh;background-color:#222;overflow-x:hidden;transition:transform .3s ease-in-out;transform:translate(-100%);z-index:200;padding-top:60px}.sidenav.open{transform:translate(0)}.close-btn{position:absolute;top:20px;right:20px;background:none;border:none;color:#fff;font-size:2rem;cursor:pointer;transition:color .3s}.close-btn:hover{color:#673ab8}.nav-menu{list-style:none;display:flex;flex-direction:column;gap:0;margin:0;padding:0}.nav-item{margin:0}.nav-link,.nav-lang{display:block;color:#fff;text-decoration:none;padding:1rem 2rem;transition:all .3s ease;border-left:4px solid transparent;position:relative}.nav-link:hover{border-left-color:#673ab8;padding-left:2.5rem}.nav-link.active{background-color:#673ab8;color:#c8a9ff;border-left-color:#222;padding-left:2.5rem;font-weight:600}.nav-link.active:hover{background-color:#815ac9;color:#222}.overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:150}@media(min-width:800px){.hamburger{display:none}.sidenav{transform:translate(0);width:200px}.close-btn,.overlay{display:none}body{margin-left:200px}}@media(max-width:800px){body{padding-top:60px}}.language-switcher{position:relative;display:inline-block}.language-switcher select{padding:.5rem 1rem;border:1px solid #ccc;border-radius:4px;background-color:#fff;color:#333;font-size:1rem;cursor:pointer;transition:border-color .3s,background-color .3s}.language-switcher select:hover{border-color:#61dafb;background-color:#f0f8ff}.language-switcher select:focus{outline:none;border-color:#61dafb;box-shadow:0 0 5px #61dafb80}