:root{color-scheme:dark;--bg:#11131b;--panel:#1c1f2a;--ink:#f4f3f7;--muted:#a5a8b9;--gold:#ffd074}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 system-ui,sans-serif}main{max-width:1100px;margin:auto;padding:35px 32px}header,footer,.heading,.master,.dialog-head,.card-head,.range-label{display:flex;justify-content:space-between;align-items:center;gap:20px}header{padding-bottom:45px}.brand{color:var(--gold);text-decoration:none;font-size:28px;display:flex;align-items:center;gap:12px}.brand span{font-size:14px;letter-spacing:.16em;font-weight:700}.eyebrow{letter-spacing:.15em;color:var(--gold);font-size:12px;font-weight:700}h1{font-weight:550;font-size:clamp(36px,6vw,58px);letter-spacing:-.045em;line-height:1.15;margin:10px 0 15px}h2{font-size:22px;font-weight:550;margin:0}p{color:var(--muted);margin:5px 0}button{font:inherit;color:var(--ink);background:#2a2e3d;border:1px solid #3a3e4e;border-radius:12px;padding:10px 18px;cursor:pointer}button:hover:not(:disabled){background:#383d50}button:disabled{opacity:.4;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:4px}.notice{padding:14px 18px;background:#222330;border:1px solid #393b4a;border-radius:12px;margin:28px 0;color:#cecfe0;font-size:14px}.notice.error{border-color:#b16666;color:#ffbbbb}.master{margin:24px 0 26px;padding:22px 26px;background:#20232e;border-radius:18px}.actions{display:flex;gap:10px}.actions button:first-child,.primary{background:var(--gold);border-color:var(--gold);color:#24202b}.lights{display:grid;grid-template-columns:1fr 1fr;gap:24px}.card{background:var(--panel);border:1px solid #303442;border-radius:24px;padding:28px}.bulb{height:170px;display:grid;place-items:center;margin:10px 0 24px}.bulb svg{width:90px;height:130px;fill:#565b6e;transition:fill .3s,filter .3s}.card.on .bulb svg{fill:var(--gold);filter:drop-shadow(0 0 32px #ffd07470)}.card small{font-size:14px;color:var(--muted)}.power{min-width:78px}.card.on .power{background:var(--gold);color:#24202b;border-color:var(--gold)}.range-label{margin:20px 0 10px}.range-label output{color:var(--gold)}input[type=range]{width:100%;accent-color:var(--gold);min-height:28px}.range-ends{display:flex;justify-content:space-between;color:var(--muted);font-size:14px}.temperature{background:linear-gradient(90deg,#ffd074,#d4e6ff);height:6px;border-radius:10px}footer{margin:36px 0 10px;color:var(--muted);font-size:14px}a{color:var(--gold)}dialog{background:var(--panel);color:var(--ink);border:1px solid #484d60;border-radius:22px;padding:28px;max-width:480px;width:calc(100% - 32px)}dialog::backdrop{background:#000b}dialog p{margin:16px 0}label{display:block;margin:16px 0}input:not([type=range]){display:block;width:100%;font:inherit;padding:12px;background:#12141d;border:1px solid #45495b;border-radius:8px;color:white;margin-top:6px}.small{font-size:14px}form>.primary{width:100%;margin-bottom:12px}form>a{display:block;margin-top:16px}.setup{max-width:760px}.setup h2{margin-top:32px}.setup pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#202330;padding:18px;border-radius:12px}.setup li{margin-bottom:16px}@media(max-width:650px){main{padding:24px 18px}header{padding-bottom:30px}.heading{align-items:flex-start}.heading>button{font-size:14px;padding:8px 12px}.lights{grid-template-columns:1fr}.master{padding:18px}.master p{font-size:14px}footer{align-items:flex-start;flex-direction:column}.card{padding:24px}.bulb{height:120px}.bulb svg{height:100px}.actions button{padding:9px 13px}}

.colour-controls{display:flex;align-items:center;gap:14px;margin-top:24px}.colour-controls[hidden]{display:none}.colour-controls label{flex:1}.colour-controls input[type=color]{width:54px;height:40px;border:1px solid #555;border-radius:8px;background:transparent;padding:3px;cursor:pointer}

.brand-cat{display:inline-block;vertical-align:middle;flex-shrink:0}
