@font-face{font-family:"IBM Plex Sans";src:local("IBM Plex Sans")}@font-face{font-family:"IBM Plex Mono";src:local("IBM Plex Mono")}
:root{color-scheme:dark;--bg:#101518;--surface:#182025;--surface-2:#202a30;--line:#35434a;--text:#f2f5f6;--muted:#b4c0c5;--accent:#ef6c35;--accent-strong:#ff8150;--safe:#55b89a;--danger:#ff766f;--radius:5px;--max:1180px;font-family:"IBM Plex Sans","Segoe UI",sans-serif}
:root[data-theme="light"]{color-scheme:light;--bg:#eef2f2;--surface:#fff;--surface-2:#e5ebec;--line:#b9c5c9;--text:#151b1e;--muted:#4e5c62;--accent:#b84114;--accent-strong:#96340f;--safe:#13775e;--danger:#b52323}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);min-width:300px}button,input,select{font:inherit}button{min-height:48px}a{color:inherit}.topbar{min-height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:12px max(24px,calc((100vw - var(--max))/2));background:var(--surface)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none}.brand-mark{width:42px;height:42px;border:1px solid var(--line);display:grid;place-items:center;background:var(--surface-2);border-radius:var(--radius)}.brand-mark img{width:24px;height:24px}.brand strong,.brand small{display:block}.brand strong{font-size:20px}.brand small{font-family:"IBM Plex Mono",monospace;color:var(--muted);font-size:12px}.top-actions{display:flex;align-items:center;gap:14px}.browser-hint{color:var(--danger);font-size:14px}main{max-width:var(--max);margin:auto;padding:64px 24px 96px}.intro{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(260px,.7fr);gap:64px;align-items:end;margin-bottom:56px}.section-label{font-family:"IBM Plex Mono",monospace;color:var(--accent-strong);margin:0 0 10px;font-size:13px}.intro h1{font-size:clamp(42px,7vw,82px);line-height:.96;letter-spacing:-.045em;margin:0 0 24px;max-width:760px}.intro>div>p:last-child{font-size:18px;line-height:1.55;color:var(--muted);max-width:700px}.scope-note{border-top:1px solid var(--line)}.scope-note span,.scope-note b{display:inline-block;padding:12px 0;border-bottom:1px solid var(--line)}.scope-note span{width:42px;font-family:"IBM Plex Mono",monospace;color:var(--accent-strong)}.scope-note b{width:calc(100% - 46px);font-weight:600}.workbench{display:grid;grid-template-columns:minmax(280px,.72fr) minmax(0,1.4fr);gap:20px;align-items:start}.module{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:28px}.module h2{font-size:28px;line-height:1.1;margin:0 0 12px}.module header>p:last-child,.module>header>p:last-child{color:var(--muted);line-height:1.5}.firmware-record{margin:28px 0 20px;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:16px}.firmware-record b,.firmware-record small{display:block}.firmware-record small{color:var(--muted);margin-top:5px}.hardware-tag{font-family:"IBM Plex Mono",monospace;font-size:12px;white-space:nowrap}.button{appearance:none;border:1px solid var(--line);border-radius:var(--radius);padding:11px 16px;background:transparent;color:var(--text);font-weight:650;cursor:pointer}.button:hover{border-color:var(--accent-strong)}.button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 45%,transparent);outline-offset:2px}.button:disabled{opacity:.45;cursor:not-allowed}.button.primary{background:var(--accent);border-color:var(--accent);color:#fff}.button.primary:hover{background:var(--accent-strong)}.button.secondary{background:var(--surface-2)}.button.quiet{min-height:44px;padding:9px 13px}.firmware-action{width:100%}.message{display:block;color:var(--muted);font-size:14px;line-height:1.45;margin:14px 0 0}.message.success{color:var(--safe)}.message.error{color:var(--danger)}.config-heading{display:flex;justify-content:space-between;gap:24px}.connection-actions{display:flex;flex-direction:column;align-items:flex-end;gap:10px;min-width:190px}.connection-state{font-family:"IBM Plex Mono",monospace;font-size:13px;color:var(--muted)}.connection-state.connected{color:var(--safe)}.empty-state{min-height:330px;border-top:1px solid var(--line);margin-top:24px;display:grid;place-content:center;text-align:center}.empty-state h3{margin:18px 0 8px}.empty-state p{color:var(--muted);margin:0;max-width:420px}.port-glyph{width:90px;height:55px;margin:auto;border:2px solid var(--line);display:flex;align-items:flex-end;justify-content:center;gap:8px;padding-bottom:11px}.port-glyph i{width:10px;height:17px;background:var(--line)}#configForm{border-top:1px solid var(--line);margin-top:24px;padding-top:24px}.config-groups{display:grid;gap:18px}.config-group{border:1px solid var(--line);padding:20px;border-radius:var(--radius)}.config-group h3{font-size:20px;margin:0 0 16px}.field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.field{display:grid;gap:7px}.field label{font-size:14px;font-weight:650}.field small{color:var(--muted)}.field input,.field select{width:100%;min-height:48px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface-2);color:var(--text);padding:10px 12px;font-size:16px}.esc-inspector{margin-top:18px;border:1px solid var(--line);padding:20px;display:grid;grid-template-columns:1fr auto;gap:12px 20px;align-items:start;border-radius:var(--radius)}.esc-inspector h3{margin:0 0 7px}.esc-inspector p{margin:0;color:var(--muted);line-height:1.45}.esc-inspector output{grid-column:1/-1;margin:0}.form-actions{display:flex;justify-content:space-between;gap:16px;margin-top:24px}.form-actions>div{display:flex;gap:10px;flex-wrap:wrap}.toast{position:fixed;right:20px;bottom:20px;max-width:min(420px,calc(100vw - 40px));background:var(--text);color:var(--bg);padding:14px 18px;border-radius:var(--radius);font-weight:650}footer{border-top:1px solid var(--line);padding:24px max(24px,calc((100vw - var(--max))/2));display:flex;justify-content:space-between;color:var(--muted);font-size:13px}
@media(max-width:860px){main{padding-top:40px}.intro,.workbench{grid-template-columns:1fr}.intro{gap:28px}.firmware-module{order:1}.config-module{order:2}.field-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.topbar{align-items:flex-start}.brand small{display:none}.top-actions{flex-direction:column;align-items:flex-end}.browser-hint{max-width:170px;text-align:right}.intro h1{font-size:44px}.module{padding:20px}.config-heading{display:block}.connection-actions{align-items:stretch;margin-top:20px}.field-grid{grid-template-columns:1fr}.esc-inspector{grid-template-columns:1fr}.esc-inspector output{grid-column:auto}.form-actions,.form-actions>div{display:grid;grid-template-columns:1fr}.form-actions{gap:10px}.firmware-record{display:block}.hardware-tag{display:block;margin-top:14px}.topbar,main,footer{padding-left:16px;padding-right:16px}footer{display:block}footer span{display:block;margin:5px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.wifi-module{grid-column:1/-1}.wifi-actions{display:grid;grid-template-columns:minmax(180px,.45fr) minmax(240px,1fr);gap:14px;align-items:end;margin:24px 0}.wifi-actions label,.wifi-module .field label{display:grid;gap:8px;font-weight:600}.wifi-actions select,.wifi-module input{width:100%;min-height:48px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface-2);color:var(--text);padding:10px 12px}.wifi-save-actions{align-items:center}.wifi-save-actions .message{margin:0}
.wifi-reachability{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:20px 0 4px;padding:16px 18px;border:1px solid color-mix(in srgb,var(--safe) 60%,var(--line));border-radius:var(--radius);background:color-mix(in srgb,var(--safe) 12%,var(--surface));font-weight:600}.wifi-reachability[hidden]{display:none}.wifi-reachability span{color:var(--muted)}.wifi-reachability a{color:var(--safe);font-family:"IBM Plex Mono",monospace;font-weight:700;overflow-wrap:anywhere}.wifi-reachability a::after{content:" ↗"}@media(max-width:600px){.wifi-reachability{align-items:flex-start;flex-direction:column;gap:6px}}.wifi-save-actions .button{justify-self:end}@media(max-width:600px){.wifi-actions{grid-template-columns:1fr}.wifi-save-actions .button{justify-self:stretch}}