:root{--paper:#faf8f3;--card:#fffefa;--ink:#263b35;--muted:#5f6a61;--line:#dcded3;--green:#365c49;--pale:#edf1e8;--amber:#785c2b;--amber-bg:#f5efdf;--error:#8b3d2e}
*{box-sizing:border-box}html{background:var(--paper)}body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button,a,input{touch-action:manipulation}a{color:var(--green);text-underline-offset:4px}button{cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--green);outline-offset:4px}[hidden]{display:none!important}.shell{width:min(calc(100% - 36px),560px);margin:0 auto;padding-bottom:env(safe-area-inset-bottom)}.skip{position:absolute;left:16px;top:-100px;padding:12px;background:var(--card);z-index:2}.skip:focus{top:12px}.masthead{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:79px;border-bottom:1px solid var(--line)}.brand,.eyebrow{font-size:11px;letter-spacing:.13em;text-transform:uppercase;font-weight:700;color:var(--green)}.guide-top{font-size:13px;min-height:44px;display:inline-flex;gap:6px;align-items:center;font-weight:600;white-space:nowrap}.eyebrow{margin:28px 0 9px;font-size:10px;letter-spacing:.16em;color:var(--muted)}h1{font:400 clamp(39px,9vw,54px)/1.08 Georgia,"Times New Roman",serif;letter-spacing:-.045em;margin:0 0 19px}.connection{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);min-height:23px;margin-bottom:25px}.status-dot{width:7px;height:7px;background:#9b956f;border-radius:50%;flex-shrink:0}.connection[data-status="fresh"] .status-dot{background:var(--green);box-shadow:0 0 0 4px #e7ede2}.connection[data-status="unavailable"] .status-dot{background:var(--amber)}.network-note{background:var(--amber-bg);border:1px solid #dfd3b4;border-radius:14px;padding:18px;margin-bottom:18px;color:#625337}.network-note h2{font-size:17px;margin:0 0 7px}.network-note p{font-size:14px;margin:0}.note-actions{display:flex;align-items:center;flex-wrap:wrap;gap:4px 20px;margin-top:10px}.note-actions a{font-size:14px;min-height:44px;display:inline-flex;align-items:center}.text-button{border:0;background:transparent;padding:10px 0;color:var(--green);font-size:14px;font-weight:650;min-height:44px;text-align:left;text-decoration:underline;text-underline-offset:4px}.text-button:disabled{color:var(--muted);opacity:.65}.control-card{background:var(--card);border:1px solid var(--line);border-radius:19px;padding:23px 22px;margin-bottom:16px;box-shadow:0 3px 14px #263b3504}.card-heading{display:flex;align-items:center;gap:14px;margin-bottom:21px}.device-icon{width:49px;height:49px;display:grid;place-items:center;border-radius:14px;background:#f1f0e8;flex-shrink:0;transition:background .15s}.device-icon svg{width:30px;height:30px;stroke:var(--green);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.card-heading h2{font-size:20px;line-height:1.25;margin:0 0 3px;font-weight:650;letter-spacing:-.02em}.device-state{font-size:13px;color:var(--muted);margin:0}.state-mark{margin-left:auto;width:8px;height:8px;border-radius:50%;background:var(--line)}.control-card[data-on="true"] .device-icon{background:#ecebda}.control-card[data-on="true"] .state-mark{background:var(--green)}.switch-buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px}.power-button{border:1px solid #b8c3b5;background:var(--card);border-radius:10px;min-height:55px;color:var(--green);font-size:17px;font-weight:650;transition:background .15s,color .15s}.power-button[aria-pressed="true"]{background:var(--green);border-color:var(--green);color:var(--card);box-shadow:0 2px 3px #263b3510}.power-button:not(:disabled):hover{background:var(--pale)}.power-button[aria-pressed="true"]:not(:disabled):hover{background:#2b4c3c}.power-button:disabled{color:#72796c;border-color:#dde0d6;background:#f4f4ee;opacity:.8}.power-button[aria-pressed="true"]:disabled{background:#e5e9df;color:#4e5d50;border-color:#cdd5c7}.brightness{border-top:1px solid var(--line);margin-top:23px;padding-top:20px}.brightness-label{display:flex;justify-content:space-between;gap:15px;align-items:baseline;font-size:14px;font-weight:600}.brightness-label output{color:var(--green);font-variant-numeric:tabular-nums;font-weight:650}.brightness input{display:block;width:100%;height:44px;margin:8px 0 0;accent-color:var(--green);cursor:pointer}.brightness input:disabled{opacity:.45;cursor:default}.range-labels{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-top:-2px}.control-help{font-size:12px;line-height:1.5;margin:13px 0 0;color:var(--muted)}.automatic{margin-top:13px;border-top:1px solid var(--line);padding-top:6px}.automatic .control-help{margin:0}.fan-card{padding-bottom:22px}.command-message{font-size:14px;line-height:1.45;color:var(--muted);margin:0 2px 17px;min-height:0}.command-message:empty{display:none}.command-message[data-error="true"]{color:var(--error);background:#f7eee8;border-radius:10px;padding:13px 15px}.door-note{display:flex;align-items:flex-start;gap:12px;padding:11px 5px 22px;color:var(--muted)}.door-note svg{width:23px;height:23px;flex-shrink:0;stroke:#7e896f;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-top:1px}.door-note p{margin:0;max-width:350px;font-size:14px;line-height:1.5}.guide-card{display:flex;justify-content:space-between;align-items:center;gap:18px;background:var(--pale);border:1px solid #dce3d5;padding:19px 20px;border-radius:14px;text-decoration:none;min-height:88px}.guide-title{display:block;font-size:15px;font-weight:650;margin-bottom:4px}.guide-description{display:block;font-size:12px;color:var(--muted)}.guide-card svg{width:23px;height:23px;flex-shrink:0;stroke:var(--green);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}footer{border-top:1px solid var(--line);padding:20px 2px 27px;margin-top:28px;font-size:11px;line-height:1.8;color:var(--muted);display:flex;flex-direction:column}@media(min-width:650px){.shell{padding-top:15px}.masthead{min-height:81px}.eyebrow{margin-top:35px}.control-card{padding:25px 26px}.connection{margin-bottom:28px}}@media(max-width:350px){.shell{width:calc(100% - 28px)}.brand{max-width:125px;font-size:10px}.control-card{padding:20px 17px}.guide-description{font-size:11px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
