:root{color-scheme:light;font-family:Inter,"Segoe UI",Arial,sans-serif;color:#272b32;background:#f5f6f8;font-size:13px;font-synthesis:none;--border:#e1e5e9;--muted:#65717c;--accent:#315fbd;--row-height:20px;--header-height:24px}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{border:1px solid var(--border);background:white;color:#343d48;border-radius:5px;padding:6px 10px;cursor:pointer;white-space:nowrap}button:hover:not(:disabled){background:#f2f4f6;border-color:#a4afb9}button:disabled{opacity:.48;cursor:default}button[aria-pressed=true]{background:#e0effa;border-color:#88b1ce;color:#164e74}input,select{border:1px solid var(--border);border-radius:5px;padding:7px 9px;background:#fff;color:#343d48;min-width:0}input:focus-visible,select:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:2px solid #2d85bd;outline-offset:2px}input[type=checkbox]{accent-color:#176699}h1,h2,h3,p{margin:0}[hidden]{display:none!important}.muted{color:var(--muted)}.error{color:#a61d24;overflow-wrap:anywhere}.brand-mark{background:#245b7d;color:#fff;font-size:21px;font-weight:700;border-radius:11px;width:48px;height:48px;display:grid;place-items:center;letter-spacing:-1px}.brand-mark.small{width:36px;height:36px;font-size:16px;border-radius:8px;flex:none}.login-shell{min-height:100dvh;display:grid;place-items:center;padding:24px}.login-card{width:370px;max-width:100%;padding:30px;background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 8px 28px #244f6410;display:flex;flex-direction:column;gap:10px}.login-card .brand-mark{margin-bottom:7px}.login-card h1{font-size:26px;font-weight:650}.login-card .subtitle{font-size:16px;color:var(--muted);margin-bottom:10px}.login-card p{line-height:1.5}.login-card label{font-weight:600;margin-top:8px}.login-card .primary{margin-top:12px;background:#245b7d;color:#fff;border-color:#245b7d;padding:10px}.login-note{font-size:12px;text-align:center;color:var(--muted);margin-top:12px}.workspace{height:100dvh;min-height:430px;display:flex;flex-direction:column;padding:0 14px 12px;gap:10px}.app-header{display:flex;align-items:center;gap:10px;min-height:70px}.app-title{flex:1}.app-title h1{font-size:18px;font-weight:650}.app-title h1 span{font-size:12px;font-weight:400;color:var(--muted);margin-left:8px}.app-title p{font-size:11px;color:var(--muted);margin-top:4px}.connection{font-size:12px;color:#457c64;white-space:nowrap}.connection::before{content:"";width:7px;height:7px;display:inline-block;border-radius:50%;background:currentColor;margin-right:6px}.connection.warning{color:#98611b}.account{font-size:12px;color:var(--muted);max-width:150px;overflow:hidden;text-overflow:ellipsis}.counters{display:flex;gap:0;background:#f8fbfd;border:1px solid var(--border);border-radius:8px;flex:none;overflow:auto}.counters>div{padding:11px 20px;min-width:128px;border-right:1px solid var(--border)}.counters span{display:block;font-size:11px;color:var(--muted);margin-bottom:4px}.counters strong{font-size:21px;font-weight:600;font-variant-numeric:tabular-nums}.counters .has-drops strong{color:#9b5b15}.counters p{color:var(--muted);font-size:11px;line-height:1.5;padding:13px 18px}.notice{font-size:12px;background:#fff6df;border:1px solid #e9d49e;color:#745413;border-radius:5px;padding:8px 11px}.toolbar{display:flex;gap:8px;align-items:center;flex:none}.search-label{font-weight:600;font-size:12px}.toolbar>input{flex:1;max-width:560px}.check{display:flex;align-items:center;gap:5px;white-space:nowrap;font-size:12px}.panes{display:flex;flex:1;min-height:0;gap:8px}.requests{min-width:0;flex:1;display:flex;flex-direction:column;background:#fff;border:1px solid var(--border);border-radius:7px;overflow:hidden}.request-grid{flex:1;min-height:0;position:relative;overflow:auto;background:#fff;outline-offset:-2px!important}.grid-canvas{position:relative;min-height:100%}.grid-header,.request-row{display:grid;width:max-content}.grid-header{height:var(--header-height);position:sticky;top:0;z-index:3;background:#eaf1f6;color:#36566a;font-size:11px;font-weight:600;border-bottom:1px solid #c3d5e1}.grid-header>div{padding:8px 6px;border-right:1px solid #d9e3eb;overflow:hidden;white-space:nowrap}.request-row{position:absolute;left:0;height:var(--row-height);font-size:11px;line-height:var(--row-height);color:#172d3a;cursor:default;border-bottom:1px solid #00000012}.request-row>div{padding:0 6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-right:1px solid #0000000b}.request-row:hover{filter:brightness(.97)}.request-row[aria-selected=true]{outline:2px solid #2b78ad;outline-offset:-2px;z-index:1}.request-row[aria-selected=true]>div{background:#267dc524}.health{color:#20473f;font-weight:650;border:1px solid #00000015;border-radius:3px;padding:0 3px;background:#ffffff85;line-height:17px;display:inline-block}.health.failed{color:#72151d}.sent-later{display:inline-block;width:6px;height:6px;border-radius:50%;background:#c74ecf;margin-left:4px;vertical-align:middle}.table-footer{min-height:30px;padding:6px 9px;border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:10px;font-size:11px;color:var(--muted);background:#f8fbfd}.empty{position:sticky;left:0;top:35%;width:100%;text-align:center;color:var(--muted);padding:45px 25px;margin-top:-180px;pointer-events:none}.empty strong,.empty span{display:block}.empty strong{font-size:17px;font-weight:500;margin-bottom:10px}.empty span{font-size:12px;line-height:1.5}.inspector{width:420px;max-width:46%;min-width:330px;display:flex;flex-direction:column;background:#fff;border:1px solid var(--border);border-radius:7px;overflow:hidden;resize:horizontal}.inspector-heading{display:flex;align-items:center;padding:12px 12px 8px;gap:8px}.inspector-heading h2{font-size:14px;font-weight:600;flex:1}.badge{font-size:11px;background:#e5f0f8;color:#245b7d;border-radius:4px;padding:4px 7px}.selection-summary{padding:0 12px 8px;font-size:11px;line-height:1.5;flex:none}.selected-url{overflow-wrap:anywhere;max-height:64px;overflow:auto;margin-bottom:6px;user-select:text}.local-response{margin-top:8px;border-radius:4px;background:#e8f3fa;color:#245b7d;padding:5px 7px;font-weight:600}.selected-state:not(:empty){margin-top:8px;color:#98611b}.selection-summary .error{margin-top:8px;max-height:85px;overflow:auto}.inspector-tabs{display:flex;border-bottom:1px solid var(--border);padding:0 8px;gap:4px;flex:none}.inspector-tabs button{border:0;border-radius:0;background:none;font-size:12px;padding:9px 8px;color:var(--muted);border-bottom:2px solid transparent}.inspector-tabs button[aria-selected=true]{border-bottom-color:#287bae;color:#245b7d;font-weight:600}.inspector-tabs span{background:#e7f1f8;padding:1px 5px;border-radius:3px;margin-left:3px}.parameter-panel{display:flex;flex-direction:column;flex:1;min-height:0}.parameter-search{padding:9px}.parameter-search input{width:100%;font-size:12px}.parameter-scroll{flex:1;overflow:auto;min-height:0}.parameter-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:11px}.parameter-table thead{position:sticky;top:0;background:#f4f8fb;z-index:1}.parameter-table th{text-align:left;font-weight:600;color:#587285;font-size:10px;letter-spacing:.02em;padding:6px 10px}.parameter-table th:first-child{width:38%}.parameter-table td{padding:7px 10px;border-bottom:1px solid #e9eff3;vertical-align:top;overflow-wrap:anywhere}.parameter-table td:first-child{font-weight:500}.parameter-table td:last-child{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.parameter-table tbody tr{cursor:pointer}.parameter-table tbody tr:hover{background:#f1f7fb}.parameter-table tbody tr[aria-selected=true]{background:#e1effa;outline:1px solid #8bb6d4;outline-offset:-1px}.parameter-empty{text-align:center;font-size:12px;color:var(--muted);line-height:1.5;margin:35px 24px}.parameter-footer{display:flex;align-items:center;padding:6px 8px;gap:6px;font-size:11px;background:#f8fbfd;border-top:1px solid var(--border)}.parameter-footer>span{flex:1;color:var(--muted)}.parameter-footer button{font-size:11px;padding:5px 7px}.raw-panel{display:flex;flex-direction:column;gap:7px;min-height:0;flex:1;padding:9px 12px 12px;overflow:auto}.raw-heading{display:flex;align-items:center;gap:8px;flex:none;font-size:11px}.raw-heading h3{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.raw-heading span{color:#96620c}.raw-heading button{margin-left:auto;font-size:11px;padding:3px 8px}.raw-panel pre{flex:1;min-height:85px;overflow:auto;border:1px solid #dce6ed;border-radius:4px;background:#fbfdfe;padding:8px;margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font:11px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;color:#263f50;tab-size:4}.response-note{font-size:11px;line-height:1.5;color:var(--muted)}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#254d68;color:white;border-radius:6px;padding:9px 16px;font-size:12px;box-shadow:0 3px 15px #0002;z-index:10}
@media(max-width:1000px){.counters>div{min-width:105px;padding:10px 12px}.counters p{display:none}.account{display:none}.app-title h1 span{display:block;margin:3px 0 0}.app-title p{display:none}.inspector{width:360px;min-width:300px}.toolbar{gap:5px}.search-label{display:none}.check{font-size:11px}.table-footer{flex-wrap:wrap}.table-footer span:last-child{font-size:10px}}
@media(max-width:700px){.workspace{padding:0 7px 7px;gap:7px}.app-header{min-height:60px}.app-title h1{font-size:15px}.app-title h1 span{font-size:10px}.connection{font-size:10px}.app-header>button{padding:5px 7px;font-size:11px}.counters>div{min-width:100px}.counters strong{font-size:18px}.toolbar{flex-wrap:wrap}.toolbar>input{flex-basis:65%;max-width:none}.toolbar select{flex:1;font-size:11px}.toolbar button{font-size:11px}.panes{flex-direction:column}.requests{min-height:150px}.inspector{width:100%;max-width:none;min-width:0;flex:1.15;min-height:200px;resize:none}.inspector-heading{padding:8px 10px 5px}.selection-summary{padding-bottom:4px}.inspector-tabs button{padding:6px}.local-response{display:inline-block}.parameter-search{padding:5px}.parameter-search input{padding:5px 7px}}

/* One shared capture surface, with compact service diagnostics. */
.workspace{padding:0 16px 14px;gap:10px;min-height:560px;background:#f5f6f8}
.app-header{margin:0 -16px;padding:0 20px;min-height:60px;background:#ffffffed;border-bottom:1px solid #dce4f0;color:#263851;gap:12px}.app-header .brand-mark{background:linear-gradient(135deg,#496ce3,#7856ca);border:1px solid #8196ef;box-shadow:0 0 18px #5673d42b}.app-title h1{font-size:17px;letter-spacing:-.3px}.app-title h1 span{font-size:9px;letter-spacing:.6px;color:#65758d;margin-left:12px}.app-title p{color:#65758d;font-size:10px}.app-header button{background:#f5f8ff;border-color:#d7e1f2;color:#365888;padding:7px 11px}.app-header button:hover:not(:disabled){background:#eaf1ff;border-color:#98b3e2}.app-header .connection{color:#267750}.app-header .connection.warning{color:#946014}.account{color:#65758d}.eyebrow{display:block;font-size:10px;letter-spacing:.7px;text-transform:uppercase;font-weight:500;color:var(--muted)}
.health-strip{display:flex;align-items:center;flex-wrap:wrap;gap:7px 22px;padding:2px 3px;font-size:11px;line-height:1.7;flex:none}.health-name{color:#657d8d;margin-right:4px}.health-strip strong{font-size:11px;font-weight:600;color:#365d70}.health-strip .healthy{color:#2d795b}.health-strip .warning{color:#9a641b}.health-strip .certificate-health{margin-left:auto}.counters{border-radius:7px;background:#fff;min-height:59px}.counters>div{min-width:111px;padding:8px 16px}.counters strong{font-size:20px;letter-spacing:-.4px}.counters span{margin-bottom:3px}.counters p{padding:9px 16px;margin-left:auto}.counters .counter-scope{min-width:155px;background:#f7fafc;display:flex;flex-direction:column;justify-content:center}.counter-scope strong{font-size:13px;letter-spacing:0;font-weight:500;color:#38566b}.counter-scope .eyebrow{font-size:9px;letter-spacing:.7px}
.capture-workspace{display:flex;flex:1;min-height:0}.capture-content{display:flex;flex-direction:column;min-width:0;flex:1;gap:9px}.capture-heading{display:flex;align-items:center;gap:15px;flex:none;min-height:39px;border-bottom:1px solid var(--border)}.capture-tabs{display:flex;gap:8px;align-self:stretch}.capture-tabs button{border:0;border-radius:0;background:none;border-bottom:2px solid transparent;padding:8px 12px;font-size:13px;color:#6b7f8d}.capture-tabs button[aria-selected=true]{color:#235c7d;border-bottom-color:#277ca7;font-weight:600}.shared-caption{font-size:11px;color:var(--muted)}#clear-all{margin-left:auto;margin-bottom:5px;font-size:11px;color:#845258}#clear-all:hover:not(:disabled){background:#fff0ef;border-color:#c18a89}.toolbar{gap:7px;flex-wrap:wrap}.toolbar>input{min-width:170px;max-width:none}.toolbar button,.toolbar select{font-size:11px}.toolbar button{padding:6px 9px}.toolbar .check{font-size:11px}.search-label{display:none}.inspector{width:420px;min-width:320px;max-width:43%;resize:none}.selected-network{font-size:10px;line-height:1.6;margin-top:5px;overflow-wrap:anywhere}.empty{max-width:min(650px,100%);margin-inline:auto}.empty strong{color:#3c6077;font-size:19px}.empty span{line-height:1.7}.table-footer{font-size:10px}
.dns-pane{flex:1;min-height:0;display:flex;flex-direction:column;background:white;border:1px solid var(--border);border-radius:7px;overflow:hidden}.dns-notice{padding:8px 11px;background:#f5f9fc;border-bottom:1px solid var(--border);color:#637e8f;font-size:11px;line-height:1.5}.dns-notice.warning{background:#fff6df;color:#8a6125}.dns-table-scroll{min-height:0;flex:1;overflow:auto}.dns-table{width:100%;border-collapse:collapse;text-align:left;font-size:11px}.dns-table th{position:sticky;top:0;background:#eaf1f6;color:#36566a;padding:8px 10px;border-bottom:1px solid #c3d5e1;font-weight:600;white-space:nowrap}.dns-table td{padding:7px 10px;border-bottom:1px solid #e8eef3;white-space:nowrap;vertical-align:top}.dns-table td:nth-child(3),.dns-table td:nth-child(6){white-space:normal;overflow-wrap:anywhere;min-width:180px;max-width:460px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.dns-table tr[data-kind=query]{background:#f4f9ff}.dns-table tr[data-kind=reply]{background:#f5fcf8}.dns-table tr[data-kind=error]{background:#fff4ef}
.device-setup{display:grid;grid-template-columns:minmax(200px,.7fr) 1.4fr 1fr;gap:15px 23px;padding:16px 19px;background:#fff;border:1px solid var(--border);border-radius:8px;max-height:48vh;overflow:auto;flex:none}.device-setup h2{font-size:12px;font-weight:600;margin-bottom:6px}.device-setup p,.device-setup li{font-size:11px;line-height:1.7;color:var(--muted)}.device-setup ol{margin:0 0 7px;padding-left:17px}.setup-address>div{display:flex;align-items:center;gap:10px;margin:10px 0}.setup-address code{font-size:19px;letter-spacing:-.6px;color:#17496a}.setup-address button{font-size:11px}.setup-routes code{font-size:10px;color:#264e68}.setup-routes p{margin-bottom:6px}.device-check{grid-column:1/-1;border-top:1px solid var(--border);padding-top:12px}.check-heading{display:flex;align-items:center;gap:14px;margin-bottom:5px}.check-heading h2{margin:0}.check-heading button{font-size:11px;padding:5px 9px}.device-check>p{margin-bottom:6px}#probe-links{display:flex;flex-direction:column;gap:8px;margin:10px 0}#probe-links label{display:grid;grid-template-columns:116px minmax(0,1fr) auto;align-items:center;gap:7px;min-width:0;font-size:10px;font-weight:600}#probe-links input{flex:1;font:10px ui-monospace,SFMono-Regular,Consolas,monospace;padding:6px;min-width:0}#probe-links button{font-size:10px;padding:5px 8px}.check-results{display:flex;gap:12px;flex-wrap:wrap}.check-results span{font-size:11px;color:#547485;background:#f2f6f9;padding:5px 8px;border-radius:4px}.check-results .observed{color:#2a7354;background:#edf7f1}.device-check #check-state{color:#56758a}
@media(max-width:1150px){.app-title h1 span{display:block;margin:4px 0 0}.app-title p{display:none}.counters>div{padding:8px 11px;min-width:98px}.counters .counter-scope{min-width:140px}.counters p{display:none}.account{display:none}.health-strip{gap:4px 16px}.health-strip .certificate-health{margin-left:0}.inspector{min-width:285px;width:330px}.toolbar>input{flex-basis:40%}.device-setup{grid-template-columns:1fr 1.7fr}.setup-routes{grid-column:1/-1;display:flex;gap:15px;flex-wrap:wrap}.setup-routes h2{margin-bottom:0}.setup-routes p{margin:0}}
@media(max-width:850px){.workspace{padding:0 10px 10px;gap:8px}.app-header{margin:0 -10px;padding:0 13px;min-height:66px}.counters .counter-scope{display:none}.counters>div{flex:1}.panes{flex-direction:column}.requests{min-height:180px}.inspector{width:100%;min-width:0;max-width:none;flex:1;min-height:230px}.inspector-heading{padding:8px 12px 5px}.selection-summary{padding-bottom:5px}.inspector-tabs button{padding:6px 8px}.parameter-search{padding:6px 9px}.parameter-search input{padding:6px 9px}.shared-caption{font-size:10px}.app-header .connection{font-size:10px}.toolbar .check{font-size:10px}.device-setup{max-height:42vh}.health-strip{font-size:10px;gap:2px 12px}.health-strip strong{font-size:10px}}
@media(max-width:600px){.workspace{min-height:700px;height:100dvh;padding:0 7px 7px;gap:7px}.app-header{margin:0 -7px;padding:9px 10px;flex-wrap:wrap;gap:8px;min-height:77px}.app-header .connection{order:5;flex-basis:100%;text-align:center}.app-header .brand-mark{width:30px;height:30px;font-size:13px}.app-title h1{font-size:15px}.app-title h1 span{font-size:8px;letter-spacing:.4px}.app-header button{font-size:10px;padding:6px}.counters>div{min-width:82px;padding:6px 9px}.counters strong{font-size:17px}.counters span{font-size:9px}.capture-content{gap:7px}.capture-heading{gap:7px}.shared-caption{display:none}.capture-tabs{gap:0}.capture-tabs button{font-size:12px;padding:7px 9px}.toolbar{gap:5px}.toolbar>input{flex-basis:60%;min-width:90px}.toolbar input{padding:6px 7px}.toolbar button{font-size:10px;padding:5px 7px}.panes{gap:6px}.requests{min-height:160px}.inspector{min-height:220px}.device-setup{grid-template-columns:1fr;padding:12px;gap:12px;max-height:44vh}.setup-routes{display:block;grid-column:auto}.setup-routes h2{margin-bottom:7px}#probe-links{flex-direction:column}.empty{padding:25px 15px;margin-top:-145px}.empty strong{font-size:16px}.empty span{font-size:11px}.dns-table td,.dns-table th{padding:6px 8px}}

/* POC4 self-service setup is a page, separate from the shared capture. */
.device-setup{display:flex;flex-direction:column;flex:1;min-height:0;max-height:none;overflow:auto;gap:18px;padding:25px 30px}.setup-page-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:15px}.setup-page-heading h2{font-size:25px;letter-spacing:-.5px;margin:6px 0}.device-setup h3{font-size:14px;margin-bottom:7px}.device-setup p,.device-setup li{font-size:12px;line-height:1.65}.device-setup .error{color:#a61d24}.device-setup .error:empty{display:none}.enrollment-options{display:grid;grid-template-columns:1fr 1fr;gap:16px}.enrollment-choice{position:relative;border:1px solid var(--border);border-radius:9px;padding:20px 20px 18px 60px;background:#fbfdfe}.enrollment-choice p{max-width:500px;margin:8px 0 13px}.enrollment-choice .network-address{font-size:11px}.step-number{position:absolute;left:18px;top:19px;display:grid;place-items:center;width:27px;height:27px;color:#245b7d;background:#e6f1f8;border-radius:50%;font-weight:650}.primary{background:#303944;color:white;border-color:#303944}.primary:hover:not(:disabled){background:#1f2832;color:white}.enrollment-qr{display:grid;grid-template-columns:190px minmax(0,1fr);align-items:center;gap:24px;background:#f2f7fb;border:1px solid var(--border);border-radius:9px;padding:20px}.enrollment-qr svg{display:block;width:190px;height:190px}.enrollment-qr p{margin:8px 0}.enrollment-qr label{display:block;font-size:11px;margin:12px 0 5px}.copy-line{display:flex;gap:8px;align-items:center;min-width:0}.copy-line input{min-width:0;flex:1;font-size:11px}.registered-networks>p{margin-bottom:12px}.network-row{display:flex;gap:10px;align-items:center;margin-top:8px}.network-select{flex:1;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;padding:11px 13px;white-space:normal}.network-select strong{font:600 13px ui-monospace,SFMono-Regular,Consolas,monospace}.network-select span{font-size:11px;color:var(--muted)}.network-actions{display:flex;gap:6px}.network-actions button{font-size:11px}.setup-next{display:grid;grid-template-columns:minmax(260px,1fr) 1.5fr;gap:24px;border-top:1px solid var(--border);padding-top:20px}.setup-address code{font-size:22px;overflow-wrap:anywhere}.network-evidence{padding:10px 13px;background:#f2f7fb;border-radius:5px}.network-evidence:empty{display:none}.network-evidence.warning,.connect-card .warning{background:#fff5db;color:#805918}.device-setup .setup-routes{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center}.device-setup .setup-routes h3,.device-setup .setup-routes p{margin:0}.device-setup .device-check{padding-top:18px}.connect-body{background-color:#f2f5fc;background-image:radial-gradient(#728ccb40 1px,transparent 1px);background-size:22px 22px;padding:28px 16px}.connect-card{max-width:600px;margin:0 auto;background:#fff;border:1px solid var(--border);border-radius:10px;box-shadow:none;padding:28px;display:flex;flex-direction:column;gap:14px}.connect-card h1{font-size:25px;font-weight:600;letter-spacing:-.6px}.connect-card h2{font-size:19px;margin:0 0 10px}.connect-card p,.connect-card li{font-size:13px;line-height:1.65}.connect-card>button{padding:12px}.connect-card .eyebrow{font-size:9px;letter-spacing:.7px}.connect-card section>p{margin:8px 0}.phone-dns{background:#f5f6f8;padding:14px;border-radius:7px;margin:16px 0}.phone-dns code{flex:1;font:600 23px ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere}.phone-dns .copy-line{margin-top:7px}.setup-progress{list-style:none;padding:10px 0;margin:0}.setup-progress li{padding:6px 0;color:var(--muted)}.setup-progress li.observed{color:#2a7354;font-weight:600}.phone-check-links{margin:15px 0;display:flex;flex-direction:column;gap:9px}.phone-check-links>div{display:flex;align-items:center;justify-content:space-between;gap:8px}.phone-check-links a{color:#176699;line-height:1.4}.phone-check-links button{font-size:11px}.connect-footer{border-top:1px solid var(--border);padding-top:16px;color:var(--muted)}.connect-card .warning{padding:10px;border-radius:5px}
@media(max-width:850px){.device-setup{padding:20px;max-height:none}.setup-next{grid-template-columns:1fr;gap:15px}.network-select{align-items:flex-start;flex-direction:column;gap:5px}}
@media(max-width:600px){.device-setup{padding:15px;gap:17px}.setup-page-heading h2{font-size:21px}.setup-page-heading button{font-size:10px;padding:7px}.enrollment-options{grid-template-columns:1fr}.enrollment-choice{padding-left:54px}.enrollment-qr{grid-template-columns:1fr;padding:15px;gap:14px}.enrollment-qr svg{margin:0 auto;width:210px;height:210px}.network-row{align-items:stretch;gap:6px}.network-actions{flex-direction:column;justify-content:center}.network-select{padding:10px}.setup-address code{font-size:20px}.device-setup .setup-routes{display:block}.device-setup .setup-routes p{margin-top:6px}.connect-body{padding:12px}.connect-card{padding:21px;gap:12px}.connect-card h1{font-size:25px}.phone-dns code{font-size:19px}#probe-links label{grid-template-columns:1fr auto}#probe-links label span{grid-column:1/-1}}

.grid-header>div{position:relative;padding-right:10px}.column-resize{position:absolute;right:0;top:0;width:8px;height:100%;cursor:col-resize;touch-action:none;border-right:1px solid #b5c6d1}.column-resize:hover,.column-resize:focus{background:#17669955;outline:1px solid #176699}.request-row{font-size:11px}.wizard-confirm{display:flex;gap:12px;align-items:flex-start;margin:20px 0;line-height:1.6}.wizard-confirm input{margin-top:4px;flex:none;width:18px;height:18px}.connect-card section>button{padding:12px 18px}.computed-fields{padding:10px 12px;border-bottom:1px solid var(--border);font-size:11px}.computed-fields dl{display:grid;grid-template-columns:110px 1fr;gap:7px;margin:10px 0 0}.computed-fields dd{margin:0;overflow-wrap:anywhere}#analysis-warning{font-size:11px;padding:8px 12px}

.button{display:inline-block;text-decoration:none;border:1px solid #c5d5df;background:white;color:#294c61;border-radius:5px;padding:6px 10px;cursor:pointer;white-space:nowrap;font-size:11px}.button:hover{background:#edf3f7}

.capture-heading{flex-wrap:wrap}.source-ip-label{font-size:11px;white-space:nowrap}#source-ip{max-width:245px;min-width:110px;padding:5px 8px;font-size:11px;border:1px solid var(--border);border-radius:5px;background:white;color:#294c61}@media(max-width:600px){.source-ip-label{margin-left:0}#source-ip{max-width:calc(100% - 70px)}.capture-tabs{flex-basis:100%}}

.auto-ip-row { margin-top: 16px; padding: 14px; border: 1px solid var(--border); border-radius: 10px; background: #fff; }
.auto-ip-row > .slot-heading { margin: -14px -14px 10px; padding: 12px 14px; border-bottom: 1px solid var(--border); border-radius: 10px 10px 0 0; background: linear-gradient(110deg, var(--card-soft), #fff); }
.device-identity { min-width: 0; }
.device-kind { display: block; font-size: 10px; color: var(--card-color); margin-bottom: 4px; }
.device-identity h4 { margin: 0; font-size: 15px; font-weight: 600; overflow-wrap: anywhere; }
.auto-ip-row .slot-heading > button { flex: none; }
.auto-ip-row .qr-owner { color: var(--card-color); font-size: 13px; overflow-wrap: anywhere; }
.auto-ip-row .qr-actions p { margin: 0; }

.ip-update-rejected td { background: #fff3e8; }

#ip-updates-pane .dns-table td:nth-child(5){white-space:pre-wrap;overflow-wrap:anywhere;min-width:180px;max-width:360px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
#ip-updates-pane .dns-table td:nth-child(6){min-width:0;max-width:none;white-space:nowrap;font-family:inherit}
#ip-updates-pane .dns-table td:nth-child(9){white-space:normal;min-width:200px}

.auto-ip-row > p { margin: 8px 0 5px; }

.profile-option { margin-top: 10px; }
.profile-option summary { cursor: pointer; color: var(--card-color, #245b7d); font-size: 12px; font-weight: 600; padding: 8px 0; overflow-wrap: anywhere; }
.profile-option .enrollment-qr { margin-top: 8px; }
.profile-steps { padding-left: 22px; margin: 0 0 22px; }
.profile-steps li { padding-left: 4px; margin-bottom: 18px; }
.profile-steps .button { display: inline-block; margin-top: 8px; padding: 12px 18px; }

/* Light workspace shell. The request grid's geometry and Classic colors stay unchanged. */
.health-strip { gap: 6px; padding: 0; }
.health-strip > span { padding: 3px 9px; border: 1px solid #dde6f2; border-radius: 7px; background: #ffffffed; }
.counters { gap: 8px; border: 0; border-radius: 0; background: transparent; }
.counters > div { position: relative; flex: 1; padding: 9px 14px; border: 1px solid #dce5f2; border-radius: 10px; background: #fff; }
.counters > div::before { content: ""; position: absolute; top: 12px; right: 12px; width: 5px; height: 5px; border-radius: 50%; background: #7596d9; }
.counters > div:nth-child(3)::before { background: #43a590; }
.counters > .drop::before { background: #b29bd7; }
.counters > .has-drops::before { background: #d28b38; }
.counters .counter-scope { flex: none; background: #eef4ff; border-color: #d1dff4; }
.counters .counter-scope::before { display: none; }
.counters p { background: #ffffffbf; border-radius: 8px; }
.capture-heading { min-height: 44px; padding: 5px 8px; border: 1px solid #dce5f2; border-radius: 10px; background: #ffffffed; gap: 12px; }
.capture-tabs { align-self: center; gap: 3px; }
.capture-tabs button { padding: 7px 11px; border: 0; border-radius: 7px; color: #5f7087; font-size: 12px; }
.capture-tabs button[aria-selected=true] { background: #eaf0ff; color: #315cba; box-shadow: inset 0 0 0 1px #d8e3fc; }
#clear-all { margin-bottom: 0; }
.toolbar { padding: 8px; background: #ffffffed; border: 1px solid #dce5f2; border-radius: 10px; }
.toolbar > input { background: #f7f9fd; border-color: #d6e0f0; }
.toolbar :is(button, select, .button) { border-color: #d6e0f0; border-radius: 6px; }
.toolbar button[aria-pressed=true] { background: #edf1ff; color: #405fbc; border-color: #bdcef3; }
#export-har { color: #315fb5; background: #f0f5ff; }
.inspector { border-color: #d6e0f0; border-radius: 10px; box-shadow: 0 4px 16px #46638908; }
.inspector-heading { background: linear-gradient(110deg, #eef1ff, #f7faff); border-bottom: 1px solid #e0e6f4; margin-bottom: 8px; padding-bottom: 10px; }
.inspector-heading h2 { color: #3c4f7a; }
.inspector-heading h2::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 8px; border-radius: 2px; background: #9475d9; vertical-align: 2px; }
.selected-url { padding: 7px 8px; background: #f6f8fc; border-radius: 6px; }
.local-response { color: #287567; background: #eaf7f2; font-weight: 500; }
.inspector-tabs { gap: 3px; padding: 4px 8px 7px; }
.inspector-tabs button { padding: 6px 8px; border: 0; border-radius: 6px; }
.inspector-tabs button[aria-selected=true] { color: #6648a8; background: #f0eafd; }
.inspector-tabs span { color: #66558c; background: #e6def6; }
@media(max-width:850px) { .counters > div { padding: 8px 11px; } .counters > div::before { right: 8px; } }
@media(max-width:600px) { .health-strip > span { padding: 2px 6px; } .counters { gap: 5px; } .counters > div { min-width: 86px; padding: 7px 9px; } .capture-heading { gap: 7px; } .capture-tabs { width: 100%; } .capture-tabs button { flex: 1; padding: 7px 5px; font-size: 11px; } }

/* Four setup paths, with their own slots and optional details. */
.workspace {
  background-color: #f5f8fd;
  background-image: radial-gradient(ellipse at 15% 10%, #b8c9ff2e, transparent 50%), radial-gradient(ellipse at 90% 65%, #a4e8e42b, transparent 48%), radial-gradient(#8aa1c333 1px, transparent 1px);
  background-size: auto, auto, 22px 22px;
}
.setup-recent { padding: 8px 12px; border: 1px solid var(--border); border-radius: 8px; background: #fff; }
.setup-recent-heading { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.device-setup .setup-recent h3 { margin: 0; font-size: 12px; }
.setup-recent h3 span { margin-left: 8px; font-size: 10px; font-weight: 400; }
.setup-recent-heading button { flex: none; padding: 3px 7px; font-size: 10px; }
.device-setup .setup-recent p { margin: 3px 0 0; font-size: 10px; line-height: 14px; }
.setup-recent-scroll { max-height: 76px; overflow: auto; margin-top: 4px; }
.setup-recent table { width: 100%; min-width: 420px; border-collapse: collapse; margin: 0; font-size: 10px; line-height: 14px; text-align: left; }
.setup-recent th, .setup-recent td { padding: 2px 6px; border-bottom: 1px solid var(--border); }
.setup-recent th { position: sticky; top: 0; background: #fff; color: var(--muted); font-weight: 500; }
.setup-recent td:first-child, .setup-recent td:last-child { white-space: nowrap; }
.setup-recent td:nth-child(3) { max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.setup-recent .warning { color: #8a5b16; }
@media(max-width:600px) { .setup-recent { padding: 8px; } .setup-recent h3 span { display: block; margin-left: 0; } }
.device-setup { --border: #d7e1ef; --muted: #5c6e86; width: 100%; max-width: 1120px; margin: 0 auto; padding: 24px 16px; gap: 18px; border: 0; border-radius: 0; background: transparent; color: #273b58; color-scheme: light; }
.device-setup button, .device-setup input, .device-setup select { color: #36537a; background: #fff; border-color: #cad8eb; }
.device-setup input::placeholder { color: #647890; }
.device-setup button:hover:not(:disabled) { background: #edf4ff; border-color: #8faedf; }
.device-setup :is(button, input, select, summary):focus-visible { outline-color: #426dde; }
.device-setup .error { color: #ab263a; }
.setup-page-heading h2 { display: flex; align-items: center; gap: 12px; margin: 0 0 5px; font-size: 26px; letter-spacing: -.7px; font-weight: 600; }
.setup-page-heading h2::before { content: ""; width: 10px; height: 10px; border-radius: 3px; background: #8297ff; box-shadow: 0 0 22px #7493ff80; }
.setup-page-heading .network-actions button { background: #ffffffd9; }
.setup-options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; align-items: start; }
.setup-card { --card-accent: #3869d5; --card-color: #315fbc; --card-soft: #e8efff; position: relative; min-width: 0; padding: 18px; border: 1px solid var(--border); border-radius: 12px; background: linear-gradient(135deg, var(--card-soft), #fff 70%); box-shadow: 0 4px 16px #46638908; }
.setup-card:nth-child(2) { --card-accent: #7850d3; --card-color: #7650bc; --card-soft: #f0eaff; }
.setup-card:nth-child(3) { --card-accent: #087c78; --card-color: #087c78; --card-soft: #e3f7f4; }
.setup-card:nth-child(4) { --card-accent: #986010; --card-color: #986010; --card-soft: #fff4dd; }
.setup-card::before { content: ""; position: absolute; top: -1px; left: 18px; width: 44px; height: 2px; border-radius: 2px; background: var(--card-color); }
.setup-card .primary { color: #fff; background: var(--card-accent); border-color: var(--card-accent); }
.setup-card .primary:hover:not(:disabled) { color: #fff; background: var(--card-accent); border-color: var(--card-color); }
.setup-card-title { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.setup-card-title .step-number { position: static; flex: none; width: 26px; height: 26px; border-radius: 7px; color: var(--card-color); background: var(--card-soft); border: 1px solid var(--card-accent); font-size: 11px; font-weight: 600; }
.setup-card-title h3 { margin: 0 0 3px; font-size: 15px; font-weight: 600; letter-spacing: -.2px; }
.setup-card-title .muted { font-size: 11px; }
.setup-card > p { margin: 12px 0; }
.setup-card .setup-hint { color: var(--muted); font-size: 11px; }
.dns-banner { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 18px; background: linear-gradient(110deg, #edf4ff, #f4fcff); border: 1px solid #c7dbf3; border-radius: 10px; }
.dns-banner .eyebrow { color: #476f9e; }
.dns-banner code { color: #147286; font: 500 22px ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing: -.5px; }
.dns-banner .copy-line { margin: 6px 0; }
.dns-banner > p { color: var(--muted); }
.setup-slots { margin-top: 14px; }
.slot-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.slot-heading strong { font-size: 13px; overflow-wrap: anywhere; }
.slot-heading button { font-size: 11px; }
.slot-contact { color: var(--muted); font-size: 11px !important; margin: 7px 0; }
.network-qr-slot { margin-top: 12px; padding: 12px 0 0; border-top: 1px solid var(--border); }
.setup-card .network-row { flex-wrap: wrap; padding: 12px 0; border-top: 1px solid var(--border); }
.setup-card .network-select { padding: 0; border: 0; background: transparent; display: block; }
.setup-card .network-select span { display: block; margin-top: 6px; }
.setup-card .network-actions { flex-wrap: wrap; }
.setup-details { margin-top: 16px; font-size: 11px; }
.setup-details summary { color: var(--muted); cursor: pointer; padding: 6px 0; }
.setup-details[open] > p { margin: 10px 0 6px; }
.setup-card .enrollment-qr { grid-template-columns: 144px minmax(0,1fr); gap: 14px; padding: 12px; margin-top: 14px; background: #f7f9ff; border-radius: 8px; }
.setup-card .enrollment-qr svg { width: 144px; height: 144px; }
.device-setup .network-evidence { background: #eef7ff; color: #336482; }
.device-setup .network-evidence.warning { background: #fff4df; color: #875818; }
.qr-actions { display: flex; flex-direction: column; align-items: start; gap: 8px; min-width: 0; }
.qr-actions p { color: var(--muted); }
.setup-feed { border-top: 1px solid var(--border); padding-top: 20px; }
.setup-feed > p { margin: 8px 0 12px; }
#auto-ip-state:empty, #setup-error:empty { display: none; }
.button.primary { background: #303944; color: white; border-color: #303944; }
@media(max-width:900px) { .setup-options { grid-template-columns: 1fr; } .dns-banner { align-items: start; } }
@media(max-width:600px) { .device-setup { padding: 16px 8px; gap: 14px; } .setup-card { padding: 16px; } .dns-banner { flex-direction: column; padding: 12px; gap: 6px; } .dns-banner code { font-size: 22px; } .setup-page-heading { flex-wrap: wrap; } .setup-page-heading .network-actions { flex-direction: row; flex-wrap: wrap; } .setup-card .enrollment-qr { grid-template-columns: 1fr; } .setup-feed .copy-line { flex-wrap: wrap; } .setup-feed input { flex-basis: 100%; } }