/* Edge Config Lab 0.8.8 — compact, progressive-disclosure layout.
   Existing app behavior/themes stay intact; secondary explanations move into i-buttons. */
:root { --radius:16px }
body { background:var(--bg); }
.main { max-width:1220px; padding-top:29px; }
.side { padding:22px 14px; gap:10px; }
.brand { padding-bottom:18px; }
.side-note { font-size:12px; line-height:1.55; padding:11px 12px; border:1px solid var(--border); background:transparent; }
.card { box-shadow:none; background:var(--surface); padding:21px; }
.card.soft { background:var(--surface); }
h1 { letter-spacing:-1.25px; font-size:clamp(29px,3.2vw,38px); margin:6px 0 8px; }
h2 { margin-bottom:12px; }
.topbar { margin-bottom:23px; }
.lead { font-size:14px; max-width:700px; margin:0 0 22px; line-height:1.5; }
.card .lead { font-size:13px; line-height:1.5; }
.grid, .features, .module-grid { gap:13px; }
.column { gap:14px; margin-top:14px; }
.metric-note { line-height:1.4; }
.actionrow { margin-top:15px; gap:8px; }
.button { padding:10px 13px; font-size:13px; }
.kicker { color:var(--muted); letter-spacing:.8px; font-size:10px; }
.feature { padding:17px 18px; transition:border-color .15s ease, background .15s ease; }
.feature:hover { transform:none; background:color-mix(in srgb,var(--accent) 3%,var(--surface)); }
.feature p { display:none; } /* Details are in the feature modal */
.feature .feature-foot { margin-top:10px; }
.feature .match-text { margin-top:10px; }
.feature .feature-top { flex-wrap:wrap; }
.feature .feature-top h3 { flex:1 1 60%; }
.feature .feature-top .badge { margin-left:auto; }
.feature .feature-foot span:last-child { white-space:nowrap; }
.notice { padding:11px 14px; line-height:1.5; font-size:12px; }
.notice.notice-compact { display:flex; gap:9px; align-items:center; flex-wrap:wrap; border-left-color:var(--accent); }
.notice.notice-compact strong { color:inherit; }
.section-heading { display:flex; align-items:center; gap:11px; }
.section-heading h1 { flex:none; }
.info-wrap { display:inline-flex; align-items:center; position:relative; vertical-align:middle; flex:none; white-space:normal; }
.info-trigger { width:25px; height:25px; min-width:25px; padding:0; border-radius:50%; border:1px solid color-mix(in srgb,var(--muted) 65%,var(--border)); color:var(--muted); background:var(--surface); font-size:13px; font-family:Georgia,serif; font-weight:800; line-height:1; display:grid; place-items:center; cursor:help; }
.info-trigger:hover, .info-wrap.is-open .info-trigger { color:var(--text); border-color:var(--accent); background:var(--elevated); }
.info-trigger:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.info-popover { display:none; position:absolute; z-index:100; top:calc(100% + 8px); right:0; width:min(360px,calc(100vw - 35px)); min-width:245px; max-height:260px; overflow:auto; padding:15px 17px; border:1px solid var(--border); box-shadow:0 16px 50px #0009; border-radius:12px; background:var(--elevated); color:var(--text); text-align:left; font-size:13px; line-height:1.55; font-weight:400; letter-spacing:0; text-transform:none; }
.info-popover strong { display:block; color:var(--text); font-weight:800; margin-bottom:7px; }
.info-popover > span { display:block; color:var(--muted); }
@media (hover:hover) and (pointer:fine) { .info-wrap:hover .info-popover { display:block; } }
.info-wrap:focus-within .info-popover, .info-wrap.is-open .info-popover { display:block; }
.quiet-disclosure { border:1px solid var(--border); border-radius:13px; margin:14px 0; padding:0; background:var(--surface); }
.quiet-disclosure > summary { padding:13px 17px; cursor:pointer; font-size:13px; color:var(--text); font-weight:750; list-style-position:inside; }
.quiet-disclosure > summary:focus-visible {outline:2px solid var(--accent);outline-offset:2px}
.quiet-disclosure[open] > summary {border-bottom:1px solid var(--border)}
.quiet-disclosure > .setup-progress, .quiet-disclosure > .card, .quiet-disclosure > .split { margin:14px; }
.quiet-disclosure > .card { background:var(--surface); border:0; box-shadow:none; padding:12px; }
.quiet-disclosure > .card .notice { margin-bottom:12px; }
.quiet-disclosure > .card.install-card { margin:8px; }
.quiet-disclosure .setup-progress { margin-top:12px; }
.setup-progress { gap:8px; }
.setup-progress > div { padding:11px 12px; }
.setup-progress p { font-size:12px; }
.pathlist p { font-size:12px; }
.connection-title-row h2 { margin-bottom:8px; }
#module-scan-card > .kicker, #verified-topology > .eyebrow { letter-spacing:.6px; }
#ford-results .module { padding:14px; }
#ford-results .module p { margin:8px 0; }
.route-plan { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; margin:14px 0 7px; }
.route-item { border:1px solid var(--border); border-radius:10px; padding:10px; background:var(--elevated); min-width:0; }
.route-item strong { font-size:12px; display:block; margin-bottom:5px; }
.route-item span {font-size:11px; color:var(--muted); display:block; line-height:1.3; }
.route-item .route-state { margin-top:7px; font-weight:800; font-size:10px; color:var(--warning); text-transform:uppercase; }
.route-item .route-state.ready { color:var(--success); }
.route-caption { margin:0 0 4px; line-height:1.4; }
.topology-metrics { margin:15px 0; }
.reference-groups { margin:12px 0; }
.reference-network[open] {border-color:color-mix(in srgb,var(--accent) 30%,var(--border));}
.telemetry { margin-top:12px; }
.config-checklist > div {padding:10px 11px}
.config-top-grid { grid-template-columns:1fr 1fr; gap:13px; }
.config-scroll { max-height:330px; }
.footer {margin-top:30px;padding-top:14px;}
@media(max-width:1100px){ .route-plan{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media(max-width:730px){
 .main {padding:18px 14px 100px}
 .card {padding:16px}
 .grid {gap:9px}
 .section-heading h1 {font-size:30px}
 .topbar {margin-bottom:12px}
 .route-plan {grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
 .info-popover {position:fixed; bottom:76px; top:auto; left:12px; right:12px; width:auto; max-height:38vh; min-width:0; padding:15px 17px; font-size:13px;}
 .quiet-disclosure > .split {margin:9px}
 .quiet-disclosure .card {padding:9px}
 .feature .feature-top .badge {font-size:9px}
 .mobile-nav {background:var(--surface)}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.compact-module .badge { margin:3px 0 3px; }
.compact-module p { margin:8px 0; font-size:12px; color:var(--muted); }
.scan-tech { border-top:1px solid var(--border); margin-top:12px; padding-top:10px; }
.scan-tech summary {cursor:pointer; font-size:12px; font-weight:750; color:var(--muted);}
.scan-tech p {font-size:12px; line-height:1.5; color:var(--muted);}

/* v0.8.8 compact communications check; descriptions available via info buttons */
.channel-panel{border:1px solid var(--line,#283544);border-radius:14px;padding:14px;margin:13px 0;background:rgba(115,139,172,.045)}
.channel-head{display:flex;align-items:center;gap:9px;margin-bottom:8px;font-size:14px}
.channel-results{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.channel-result{border:1px solid rgba(148,163,184,.23);padding:9px 12px;border-radius:10px;min-width:150px;font-size:12px}
.channel-result strong{display:block;font-size:12px}
.channel-result span{display:block;margin-top:4px;opacity:.77}

/* v0.8.9: compact route audit; preserved v0.8.8.3 double pinstripe styling. */
.route-overview{display:flex;gap:8px;flex-wrap:wrap;padding:10px 0}
.route-pill{font-size:.78rem;padding:6px 9px;border-radius:999px;border:1px solid var(--border, #394452);background:rgba(255,255,255,.025);color:var(--text, #eff3f8)}
.route-audit-details{display:grid;gap:8px;margin-top:10px}
.route-audit-row{display:grid;grid-template-columns:minmax(90px,1fr) minmax(125px,2fr);gap:6px 14px;padding:9px 10px;border-radius:9px;background:rgba(255,255,255,.03)}
.route-audit-row strong,.route-audit-row span{font-size:.83rem}
.route-audit-note{font-size:.78rem;opacity:.78;grid-column:1/-1}
@media(max-width:560px){.route-audit-row{grid-template-columns:1fr}.route-audit-note{grid-column:auto}}

/* v0.9.0 - compact progressive disclosure; existing theme stripe unchanged. */
.route-guidance{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 12px;border:1px solid var(--border);border-radius:10px;margin:10px 0;background:rgba(148,163,184,.045)}
.route-guidance strong{font-size:12px;color:var(--text)}
.route-guidance span{font-size:12px;color:var(--muted);line-height:1.4}
.route-help{flex-basis:100%;font-size:12px;line-height:1.5;color:var(--muted);max-height:180px;overflow:auto;padding:8px;border-top:1px solid var(--border)}
.inline-info{border:1px solid var(--border);background:transparent;color:var(--accent);border-radius:50%;width:23px;height:23px;cursor:pointer}
#door-consent-wrap{font-size:13px}
#door-consent-wrap[hidden],#route-help[hidden]{display:none!important}

/* v0.9.5: live vs historical session evidence */
.session-evidence-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin:17px 0}
.session-evidence-item{display:flex;flex-direction:column;gap:8px;padding:14px;background:var(--elevated);border:1px solid var(--border);border-radius:12px;min-width:0}
.session-evidence-item span{font-size:12px;color:var(--muted)}
.session-evidence-item strong{font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.session-evidence-item[data-state="good"]{border-color:color-mix(in srgb,var(--accent) 55%,var(--border))}
.session-evidence-item[data-state="warn"]{border-color:#df9242}

/* v0.9.6 - connection reliability surface */
.connection-reliability-panel{margin-top:15px;padding:14px 16px;border:1px solid var(--border);border-radius:13px;background:var(--elevated);display:grid;gap:9px}
.connection-reliability-panel>div:first-child{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:10px}
.connection-reliability-panel p{margin:0;line-height:1.45}
.connection-reliability-panel strong[data-state="warn"]{color:var(--warning)}
.connection-reliability-panel strong[data-state="good"]{color:var(--success)}

/* v0.9.7: operational evidence and low-voltage presentation */
.power-safety{padding:12px 15px;margin:15px 0 8px;border-radius:12px;background:rgba(125,145,165,.09);border:1px solid rgba(125,145,165,.35);display:grid;gap:5px}
.power-safety strong{font-size:14px}.power-safety span{font-size:12px;line-height:1.5}
.power-safety[data-level="low"]{background:rgba(230,67,72,.13);border-color:rgba(230,67,72,.56)}
.power-safety[data-level="caution"]{background:rgba(245,173,38,.12);border-color:rgba(245,173,38,.5)}
.power-safety[data-level="ok"]{background:rgba(30,172,127,.1);border-color:rgba(30,172,127,.45)}
.session-marker{border:1px solid var(--border);border-radius:10px;padding:10px 13px;margin:12px 0;font-size:12px;line-height:1.65;opacity:.85}

/* Support button appears only when a verified recipient link is set. */
#ecl-support-card[hidden]{display:none!important}
