/* The production shell and Page screen, built on the approved kit. */
.kit-account { display:flex; flex-wrap:wrap; gap:12px; padding:12px; font-size:13px; }
.kit-account button { border:0; padding:0; background:none; color:inherit; font:inherit; text-decoration:underline; cursor:pointer; }
.pf-side:has(.side-toggle:checked) .kit-account { display:none; }
.pf-side .map-row { grid-template-columns:16px 52px minmax(0,1fr); text-decoration:none; color:inherit; }
.map-row.is-selected,.page-row.is-selected { background:var(--yellow); font-weight:700; }
.map-row.is-selected .map-mark { background:var(--yellow); box-shadow:0 0 0 3px var(--yellow); }
.page-bar { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:18px; }
.page-bar h1 { font:700 17px/1.2 var(--font-display); }
.page-tabs { display:flex; gap:3px; padding:3px; border-radius:var(--r-pill); background:var(--gray-wash); }
.page-tabs a { padding:6px 12px; border-radius:var(--r-pill); text-decoration:none; font-size:14px; font-weight:600; }
.page-tabs .is-active { background:var(--paper); box-shadow:var(--shadow-1); }
.page-filters { position:relative; margin-left:auto; font-size:14px; }
.page-filters summary,.page-extra summary,.idea summary { cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.page-filters[open] { width:100%; }
.filters { display:flex; flex-wrap:wrap; align-items:end; gap:12px; margin-top:12px; }
.filters label,.correct label,.whole-details label { display:grid; gap:4px; font-size:14px; }
input,select,textarea { max-width:100%; padding:8px; border:1px solid var(--edge); border-radius:8px; background:var(--paper); color:var(--ink); font:inherit; }
.section-path { display:flex; flex-wrap:wrap; align-items:center; gap:16px; margin-bottom:16px; font-size:14px; font-weight:600; }
.section-path nav { display:flex; flex:1 1 300px; justify-content:space-between; max-width:580px; min-width:0; }
.section-path nav a { display:grid; place-items:center; width:38px; height:38px; border-radius:50%; }
.section-path nav a[aria-current] { background:var(--yellow); }
.page-step { display:grid; grid-template-columns:minmax(0,1fr) 390px; gap:32px; padding:24px; }
.page-copy { min-width:0; }
.verdict { display:flex; align-items:flex-start; gap:10px; font:700 32px/1.1 var(--font-display); letter-spacing:-.03em; }
.verdict .mark { margin-top:4px; }
.figures { margin-top:18px; }
.step-line { margin-top:12px; max-width:38em; }
.idea { margin-top:18px; padding:16px; border-radius:var(--r-m); background:var(--canvas); }
.idea.is-first { background:var(--yellow-wash); }
.idea h3 { margin-top:8px; font:700 20px/1.25 var(--font-display); }
.idea p,.idea details { margin-top:8px; }
.idea .btn { margin-top:4px; }
.eyebrow { color:var(--ink-500); font-size:13px; font-weight:700; }
.device-shot { max-height:620px; overflow:auto; background:var(--paper); }
.crop-placeholder { min-height:150px; padding:20px; color:var(--ink-500); }
.page-extra { display:flex; gap:20px; flex-wrap:wrap; margin-top:18px; font-size:14px; }
.page-extra details[open] { flex-basis:100%; }
.correct { display:grid; justify-items:start; gap:10px; padding:12px 0; }
.correct form { display:flex; flex-wrap:wrap; align-items:end; gap:8px; }
button.quiet,.whole-details button,.filters button { padding:8px 12px; border:1px solid var(--edge); border-radius:var(--r-m); background:var(--paper); color:var(--ink); font:600 14px var(--font-text); cursor:pointer; }
.walk { display:flex; justify-content:space-between; gap:8px; margin-top:18px; }
.walk .btn { min-width:0; max-width:75%; white-space:normal; text-align:left; }
.whole-view { max-width:780px; }
.whole-lead { padding:24px; }
.whole-lead .btn { margin-top:18px; }
.whole-group,.whole-details { display:grid; gap:10px; margin-top:18px; }
.row-body { padding-left:0; }
.record { display:flex; flex-wrap:wrap; gap:16px; }
.record div { display:grid; gap:3px; }
.record dd { font-weight:700; }
.table-wrap { overflow-x:auto; max-width:100%; }
.compact { border-collapse:collapse; font-size:14px; }
.compact td,.compact th { padding:6px 10px; text-align:left; }
.num { text-align:right!important; }
.plain { padding:0; list-style:none; }
.fine,.hint { color:var(--ink-500); font-size:13px; }
.is-computer { grid-template-columns:minmax(0,1fr); }
.is-computer .page-copy { display:contents; }
.is-computer .step-top { order:1; }.is-computer .device { order:2; }.is-computer .idea { order:3; }.is-computer .page-extra { order:4; }.is-computer .walk { order:5; }
@media(max-width:860px) { .page-step { grid-template-columns:minmax(0,1fr); gap:16px; padding:18px; } .page-copy { display:contents; } .step-top { order:1; }.device { order:2; }.idea { order:3; }.page-extra { order:4; }.walk { order:5; } .verdict { font-size:26px; } .page-bar h1 { width:100%; } .page-filters { margin-left:0; } }

.selected-action { margin-top:18px; }
.selected-action .first-action h2 { font:700 15px var(--font-text); }
.selected-action .first-action p { margin-top:6px; }
.is-computer .selected-action { order:3; }
@media(max-width:860px) { .selected-action { order:3; } }

.step-confirm { margin-top:16px; }
.is-computer .step-confirm { order:4; }
@media(max-width:860px) { .step-confirm { order:4; } }

.step-meter { width:min(300px,100%); height:6px; margin-top:14px; }
.waiting-check { margin-top:22px; }
.waiting-check h3 { margin-top:6px; font:700 18px var(--font-display); }
.waiting-check p:not(.eyebrow):not(.step-confirm) { margin-top:5px; }
.waiting-hypothesis { margin-top:14px; }
.is-computer .waiting-check,.is-computer .waiting-hypothesis { order:3; }
@media(max-width:860px) { .waiting-check,.waiting-hypothesis { order:3; } }

.page-picker { max-width:780px; display:grid; gap:16px; }
.page-picker h1 { font:700 26px var(--font-display); }
.page-picker-group { display:grid; gap:10px; }
.page-picker-group h2 { font:700 19px var(--font-display); }
.page-picker-group li { padding:6px 0; }
@media(min-width:1180px) { .pf-side:has(.side-toggle:checked) .map-row { grid-template-columns:auto; } }
.now-view { max-width:980px; display:grid; gap:16px; }
.now-view > h1 { font:700 17px var(--font-display); }
.now-alerts { display:grid; gap:8px; }
.now-alert { display:flex; align-items:start; gap:14px; padding:14px 18px; border-radius:var(--r-l); background:var(--paper); box-shadow:var(--shadow-1); text-decoration:none; }
.now-alert span,.now-row span:first-child { display:grid; gap:2px; min-width:0; }
.now-alert small,.now-row small { color:var(--ink-700); font-size:13px; }
.now-lead { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,300px); gap:32px; padding:26px; overflow:hidden; }
.now-lead:not(:has(.now-device)) { display:block; }
.now-lead h2 { margin:8px 0; font:700 28px/1.15 var(--font-display); }
.now-lead p,.now-lead details { margin-top:10px; }
.now-lead .btn { margin:16px 8px 0 0; }
.now-lead summary,.now-admin summary { cursor:pointer; }
.now-context { font-weight:600; }
.now-device { max-height:360px; overflow:hidden; align-self:end; }
.now-device .device-shot { overflow:hidden; }
.now-group h2 { margin:0 0 10px; font:700 18px var(--font-display); }
.now-list { padding:8px 18px; }
.now-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,160px) auto; align-items:center; gap:10px; padding:12px 0; text-decoration:none; }
.now-row:hover strong { text-decoration:underline; }
.now-row small { overflow-wrap:anywhere; }
.now-row .meter,.now-meter { width:100%; }
.now-meter { display:block; max-width:300px; height:6px; margin-top:14px; }
.now-admin { font-size:14px; }
.now-admin[open] { display:grid; gap:12px; }
.now-admin form,.now-empty form { display:flex; flex-wrap:wrap; align-items:end; gap:10px; }
.now-admin label,.now-empty label { display:grid; gap:4px; }
.now-admin button,.now-empty button { padding:10px 14px; border:1px solid var(--edge); border-radius:var(--r-m); background:var(--paper); color:var(--ink); font:700 14px var(--font-text); cursor:pointer; }
.now-empty button { border-color:var(--yellow-edge); background:var(--yellow); }
@media(max-width:860px) { .now-lead { grid-template-columns:minmax(0,1fr); gap:16px; padding:18px; } .now-device { max-width:320px; justify-self:center; } .now-row { grid-template-columns:minmax(0,1fr) auto; } .now-row .meter { grid-column:1; max-width:180px; } }

.now-row:not(:has(progress)) { grid-template-columns:minmax(0,1fr) auto; }
.wait-row { grid-template-columns:minmax(0,1fr); }
.wait-row .meter { width:100%; height:5px; }

.wait-row .meter { grid-column:1; }
.tests-view { max-width:980px; display:grid; gap:16px; }
.tests-view > h1 { font:700 17px var(--font-display); }
.test-card { padding:26px; }
.test-card h2 { margin:8px 0; font:700 27px/1.15 var(--font-display); }
.test-card h3 { font:700 16px var(--font-display); }
.test-card .track { max-width:520px; margin-top:16px; }
.test-card p,.test-card details { margin-top:10px; }
.test-lead.has-image { display:grid; grid-template-columns:minmax(0,1fr) 300px; align-items:start; gap:32px; }
.test-device { max-height:360px; overflow:hidden; }
.test-device .device-shot { overflow:hidden; }
.test-location { font-weight:600; }
.test-action,.test-form { display:grid; gap:12px; justify-items:start; margin-top:18px; }
.test-action label,.test-form label { display:grid; gap:4px; width:min(100%,420px); font-size:14px; font-weight:600; }
.test-action input,.test-action textarea,.test-form input,.test-form select { width:100%; }
.test-meter { width:min(300px,100%); margin-top:12px; }
.test-comparison { margin-top:18px; }
.test-comparison p { margin-top:8px; }
.test-details summary { cursor:pointer; font-weight:600; }
.test-details .table-wrap { margin-top:10px; }
.test-record { padding:12px 0; }
.test-record summary { display:grid; gap:3px; cursor:pointer; }
.test-record summary span { font-size:13px; color:var(--ink-500); }
.test-record > p { margin-top:10px; }
.test-back { display:inline-block; margin-top:16px; }
@media(max-width:860px) { .test-card { padding:18px; } .test-lead.has-image { grid-template-columns:minmax(0,1fr); gap:16px; } .test-device { max-width:320px; justify-self:center; } }
.settings-view { max-width:980px; display:grid; gap:16px; }
.settings-view > h1 { font:700 17px var(--font-display); }
.settings-org { display:grid; gap:10px; }
.settings-org > h2 { font:700 22px var(--font-display); margin-top:8px; }
.settings-org > h3 { font:700 18px var(--font-display); margin-top:12px; }
.settings-card { display:grid; gap:14px; padding:20px; min-width:0; }
.settings-card > *, .settings-plans, .settings-form { min-width:0; max-width:100%; }
.settings-site,.settings-person { display:grid; grid-template-columns:36px minmax(0,1fr) auto; align-items:center; gap:12px; min-width:0; }
.settings-site .who span,.settings-person .who span { white-space:normal; overflow-wrap:anywhere; }
.settings-person > span:last-child { font-size:13px; color:var(--ink-500); }
.settings-form { display:flex; flex-wrap:wrap; align-items:end; gap:10px; }
.settings-form summary,.settings-plans summary { cursor:pointer; font-size:14px; font-weight:600; }
.settings-form form { display:flex; flex-wrap:wrap; align-items:end; gap:10px; width:100%; margin-top:10px; }
.settings-form label { display:grid; gap:4px; min-width:0; font-size:14px; }
.settings-form button { padding:9px 14px; border:1px solid var(--edge); border-radius:var(--r-m); background:var(--paper); color:var(--ink); font:600 14px var(--font-text); cursor:pointer; }
.settings-notice { display:flex; align-items:start; gap:8px; font-size:14px; }
.settings-notice .ico { width:18px; height:18px; }
.settings-plans .table-wrap { width:100%; margin-top:12px; overflow-x:auto; }
@media(max-width:640px) { .settings-site { grid-template-columns:36px minmax(0,1fr); } .settings-site > a { grid-column:2; justify-self:start; white-space:normal; text-align:left; } .settings-person { grid-template-columns:36px minmax(0,1fr); } .settings-person > span:last-child { grid-column:2; } }
.onboard-header { max-width:1080px; margin:0 auto; padding:22px 24px 8px; display:flex; align-items:center; gap:18px; font-size:14px; font-weight:600; }
.onboard-header-spacer { flex:1; }
.onboard-header > a:last-child { margin-left:auto; }
.onboard-main { max-width:1080px; margin:0 auto; padding:8px 24px 48px; }
.onboard-track { max-width:430px; margin:8px 0 20px; }
.onboard-card { max-width:760px; padding:28px 32px; }
.onboard-card h1 { font:700 32px/1.1 var(--font-display); letter-spacing:-.02em; }
.onboard-card h2 { font:700 18px/1.25 var(--font-display); }
.onboard-card h3 { font:700 16px/1.25 var(--font-display); }
.onboard-card p,.onboard-card section,.onboard-card details { margin-top:14px; }
.onboard-card form { display:grid; justify-items:start; gap:14px; max-width:520px; margin-top:20px; }
.onboard-card form label { display:grid; gap:5px; width:100%; font-size:14px; font-weight:600; }
.onboard-card input { width:100%; }
.onboard-card small { color:var(--ink-500); font-weight:400; }
.onboard-card .inline-form button { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:0 20px; border:1px solid var(--yellow-edge); border-radius:var(--r-m); background:var(--yellow); color:var(--ink); font:700 15px var(--font-text); cursor:pointer; }
.onboard-card pre { max-width:100%; margin:14px 0; padding:14px; overflow:auto; white-space:pre-wrap; overflow-wrap:anywhere; border-radius:var(--r-m); background:var(--gray-wash); font-size:13px; }
.onboard-card summary { cursor:pointer; font-weight:600; }
.onboard-card .btn { margin-top:8px; }
.onboard-card .error { color:var(--ink); font-weight:600; }
.onboard-save { margin-top:24px; }
.onboard-save .actions { display:flex; flex-wrap:wrap; gap:8px; }
.analysis-result .onboard-card { max-width:900px; }
.analysis-result .url-line { overflow-wrap:anywhere; color:var(--ink-500); }
.analysis-result .device-view { margin-top:18px; }
.analysis-result .device-view > input { position:absolute; width:1px; height:1px; opacity:0; }
.analysis-result .device-view > label { display:inline-flex; padding:6px 12px; border-radius:var(--r-pill); background:var(--gray-wash); cursor:pointer; font-weight:600; font-size:14px; }
.analysis-result .device-view > input:checked + label { background:var(--paper); box-shadow:var(--shadow-1); }
.analysis-result .device-view > input:focus-visible + label { outline:3px solid var(--focus); }
.analysis-path { display:flex; justify-content:space-between; max-width:420px; margin-top:18px; gap:5px; }
.analysis-mark { display:block; width:14px; height:14px; border:3px dashed var(--gray); border-radius:50%; }
.analysis-summary { display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:24px; margin-top:16px; }
.analysis-ideas { display:grid; gap:8px; }
.analysis-ideas li { display:grid; gap:3px; padding:10px 12px; border-radius:var(--r-m); background:var(--canvas); }
.analysis-result .device-shot { max-height:200px; }
.analysis-result .for-desktop { display:none; }
.analysis-result .device-view:has(#device-desktop:checked) .for-phone { display:none; }
.analysis-result .device-view:has(#device-desktop:checked) .for-desktop { display:block; }
.analysis-sections .section-list { display:grid; gap:18px; margin-top:16px; }
.analysis-sections .section-row { display:grid; grid-template-columns:150px minmax(0,1fr); gap:18px; }
.analysis-sections .crop img { height:auto; }
.analysis-sections .hypothesis { margin-top:12px; }
.visually-hidden { position:absolute; width:1px; height:1px; margin:-1px; overflow:hidden; clip-path:inset(50%); }
@media(max-width:640px) { .onboard-header { padding:16px 16px 8px; } .onboard-main { padding:8px 16px 32px; } .onboard-card { padding:20px 18px; } .onboard-card h1 { font-size:26px; } .analysis-summary { grid-template-columns:minmax(0,1fr); } .analysis-summary .device { max-width:300px; } .analysis-sections .section-row { grid-template-columns:minmax(0,1fr); } }
.report { min-height:100vh; background:var(--canvas); }
.report-inner { max-width:820px; margin:0 auto; padding-left:24px; padding-right:24px; }
.report-header { padding-top:28px; }
.report-header > p { color:var(--ink-700); font-size:14px; overflow-wrap:anywhere; }
.report-header h1 { margin:6px 0; font:700 34px/1.1 var(--font-display); }
.report-main { display:grid; gap:24px; padding-top:24px; padding-bottom:40px; }
.report-main > section > h2 { margin-bottom:10px; font:700 19px var(--font-display); }
.report-first { padding:24px; }
.report-first h2 { margin-top:6px; font:700 24px/1.2 var(--font-display); }
.report-first .pair { margin-top:16px; }
.report-first > p:not(.eyebrow),.report-first details { margin-top:14px; }
.report-first summary { cursor:pointer; font-weight:600; }
.report-first .why { margin-top:12px; }
.report-tests { display:grid; gap:10px; }
.report-test { padding:18px; }
.report-test h3 { font:700 19px var(--font-display); }
.report-test p { margin-top:5px; }
.report-tests + .fine { margin-top:10px; }
.report-record { padding:20px; }
.report-record .record { gap:14px 32px; }
.report-record .record dt { font-size:13px; color:var(--ink-700); }
.report-record .record dd { font:700 24px var(--font-display); }
.report-sections { display:grid; gap:8px; padding:12px; }
.report-section { display:grid; grid-template-columns:72px minmax(0,1fr); gap:16px; padding:10px; }
.report-thumb { height:90px; overflow:hidden; border-radius:var(--r-s); background:var(--gray-wash); }
.report-thumb img { width:100%; height:auto; }
.report-section h3 { font:700 16px var(--font-display); }
.report-section p { margin-top:4px; color:var(--ink-700); font-size:14px; }
.report-state { display:flex; align-items:center; gap:7px; color:var(--ink)!important; font-weight:600; }
.report-footer { display:flex; align-items:flex-start; gap:12px; margin-top:10px; }
.report-footer img { flex:none; }
@media(max-width:640px) { .report-inner { padding-left:16px; padding-right:16px; } .report-header h1 { font-size:28px; } .report-first { padding:18px; } .report-section { grid-template-columns:58px minmax(0,1fr); gap:12px; padding:6px; } .report-thumb { height:75px; } }

.onboard-goal { border: 0; padding: 0; margin: 24px 0; display: flex; flex-wrap: wrap; gap: 12px 20px; }
.onboard-goal legend { font-weight: 600; margin-bottom: 10px; }
.onboard-goal label { display: inline-flex; align-items: center; gap: 6px; }
.onboard-goal input { width: auto; }