:root{color-scheme:light dark;--bg: #ffffff;--fg: #1a1a1a;--muted: #5e6470;--border: #d8dce5;--panel: #f7f8fa;--accent: #2563eb;--accent-fg: #ffffff;--warn: #b45309;--warn-bg: #fef3c7;--error: #b91c1c;--error-bg: #fee2e2;--ok: #047857;--ok-bg: #d1fae5;--pending: #6b7280;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:15px;line-height:1.45}@media (prefers-color-scheme: dark){:root{--bg: #0b0d10;--fg: #e6e8ec;--muted: #8a93a3;--border: #2a2f3a;--panel: #131822;--accent: #3b82f6;--accent-fg: #ffffff;--warn: #fbbf24;--warn-bg: #3b2f10;--error: #f87171;--error-bg: #3a1414;--ok: #34d399;--ok-bg: #0e2a22;--pending: #9ca3af}}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg)}a{color:var(--accent)}button{font:inherit;padding:.45rem .9rem;border:1px solid var(--border);border-radius:6px;background:var(--panel);color:var(--fg);cursor:pointer}button.primary{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}button:disabled{opacity:.55;cursor:not-allowed}input,select,textarea{font:inherit;padding:.45rem .6rem;border:1px solid var(--border);border-radius:6px;background:var(--bg);color:var(--fg);width:100%}label{display:block;font-weight:600;margin-bottom:.25rem}.app{display:flex;flex-direction:column;min-height:100vh}.header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;border-bottom:1px solid var(--border);background:var(--panel)}.header h1{font-size:1.05rem;margin:0}.header-nav{display:flex;gap:.5rem}.mode-pill{display:inline-block;font-size:.78rem;padding:.1rem .5rem;border-radius:999px;background:var(--bg);border:1px solid var(--border);color:var(--muted);margin-left:.5rem}.main{flex:1;padding:1rem;max-width:960px;margin:0 auto;width:100%}.section{margin:0 0 1.5rem;padding:1rem;border:1px solid var(--border);border-radius:8px;background:var(--panel)}.section h2{margin-top:0;font-size:1.1rem}.row{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}.row>*{flex:0 0 auto}.field{margin-bottom:.75rem}.kv{display:grid;grid-template-columns:max-content 1fr;gap:.25rem 1rem}.kv dt{font-weight:600;color:var(--muted)}.kv dd{margin:0;word-break:break-all}.banner{padding:.75rem 1rem;border-radius:6px;border:1px solid var(--border);background:var(--warn-bg);color:var(--warn);margin-bottom:1rem}.banner.error{background:var(--error-bg);color:var(--error)}.banner.ok{background:var(--ok-bg);color:var(--ok)}.timeline{list-style:none;margin:0;padding:0}.timeline li{display:grid;grid-template-columns:6rem 1fr auto;gap:.75rem;padding:.35rem 0;border-bottom:1px dashed var(--border);font-variant-numeric:tabular-nums}.timeline li:last-child{border-bottom:none}.label-pill{display:inline-block;padding:.05rem .45rem;border-radius:4px;font-size:.82rem;background:var(--bg);border:1px solid var(--border)}.label-CONNECTED,.label-ON_INTERNET,.label-ON_NETWORK{background:var(--ok-bg);color:var(--ok);border-color:transparent}.label-CANNOT_CONNECT{background:var(--error-bg);color:var(--error);border-color:transparent}.label-NOT_CONFIGURED,.label-NOT_CONNECTED,.label-OFF,.label-UNKNOWN{background:var(--bg);color:var(--muted)}.muted{color:var(--muted)}.status-dot{display:inline-block;width:.6rem;height:.6rem;border-radius:50%;margin-right:.4rem;background:var(--pending)}.status-dot.ok{background:var(--ok)}.status-dot.down{background:var(--error)}.password-row{display:grid;grid-template-columns:1fr auto;gap:.5rem}.scenario-desc{margin:.5rem 0 0;color:var(--muted);font-size:.9rem}.toggle-group{display:inline-flex;border:1px solid var(--border);border-radius:6px;overflow:hidden}.toggle-group button{border-radius:0;border:none;border-right:1px solid var(--border);background:var(--bg)}.toggle-group button:last-child{border-right:none}.toggle-group button.active{background:var(--accent);color:var(--accent-fg)}