/* Footprint scan, "Exit Signs" design. Uses the tokens of site.css (loaded first).
   The browser-extension card is the green road sign (fastest route), the five manual steps are numbered with
   small exit signs, the counters are sign plates, the account priorities use an amber diamond for priority 1
   (amber always carries ink text). Wide screens: inputs in a sticky column on the left, the exit plan on the
   right, so the plan updates beside what you add. Class contract in CLASSES.md. */

.scan { display: grid; gap: 1.5rem 2.5rem; align-items: start; margin: 0; font-size: var(--fs-sm); }
.scan *, .scan *::before, .scan *::after { box-sizing: border-box; }
.scan [hidden] { display: none !important; }
.scan .icon { width: 1.1em; height: 1.1em; margin-top: -.15em; }
.scan-intro, .scan-noscript, .scan-banner { grid-column: 1 / -1; }
.scan-inputs, .scan-results { min-width: 0; }
@media (min-width: 72rem) {
  .scan { grid-template-columns: minmax(23rem, 28rem) minmax(0, 1fr); }
  .scan-inputs { position: sticky; top: calc(var(--head-h) + 1rem); max-height: calc(100vh - var(--head-h) - 2rem); overflow: auto; padding: .25rem .6rem .5rem .25rem; scrollbar-width: thin; }
}

.scan-visually-hidden { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.scan-intro { display: flex; flex-wrap: wrap; gap: .6rem 1rem; align-items: center; }
.scan-intro .scan-lede { display: none; }
.scan-proof { margin: 0; display: inline-flex; align-items: center; gap: .55rem; min-height: 36px; padding: .25rem 1rem 0; border-radius: 999px; background: var(--green-tint); color: var(--green-ink); font-weight: 800; line-height: 1.3; }
.scan-proof .icon { color: var(--green); }
.scan-jump { display: inline-flex; align-items: center; gap: .4rem; min-height: 36px; padding: .25rem 1rem 0; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1.5px var(--green); color: var(--green); font-weight: 800; font-size: var(--fs-xs); text-decoration: none; }
.scan-jump::after { content: ""; width: .9rem; height: .9rem; margin-top: -.2em; background: currentColor; -webkit-mask: var(--mask-chev) center / contain no-repeat; mask: var(--mask-chev) center / contain no-repeat; }
@media (min-width: 72rem) { .scan-jump { display: none; } }
.scan-noscript { padding: 1rem 1.1rem; border-radius: var(--r); background: var(--paint); }

.scan-h2 { font-size: 1.5rem; font-weight: 800; letter-spacing: -.015em; line-height: 1.2; margin: 0; color: var(--ink); }
.scan-h3 { font-size: var(--fs-base); font-weight: 800; margin: 0 0 .4rem; }
.scan-hint, .scan-status, .scan-other, .scan-attribution { color: var(--muted); font-size: var(--fs-xs); line-height: 1.55; margin: .45rem 0 0; }
.scan-status:empty { display: none; }
.scan-status { display: inline-flex; align-items: center; flex-wrap: wrap; gap: .2rem .4rem; color: var(--green-ink); background: var(--green-tint); font-weight: 700; padding: .4rem .8rem .3rem; border-radius: 10px; }
.scan-status--error { color: var(--ink); background: var(--amber-tint); box-shadow: inset 0 0 0 1.5px var(--amber-line); }
.scan-warning { position: relative; margin: .7rem 0 0; padding: .75rem .9rem .7rem 2.6rem; background: var(--amber-tint); border-radius: var(--r-sm); box-shadow: inset 4px 0 0 var(--amber); font-size: var(--fs-xs); line-height: 1.55; color: var(--ink); }
.scan-warning::before { content: ""; position: absolute; left: .95rem; top: .8rem; width: 1.1rem; height: 1.1rem; background: var(--ink); -webkit-mask: var(--mask-alert) center / contain no-repeat; mask: var(--mask-alert) center / contain no-repeat; }
.scan-link { color: var(--green); font-weight: 700; }
.scan-links { display: flex; flex-wrap: wrap; gap: .4rem; margin: .7rem 0 0; font-size: var(--fs-xs); }
.scan-links .scan-link { display: inline-flex; align-items: center; gap: .35rem; min-height: 34px; padding: .25rem .85rem 0; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1.5px var(--line-2); color: var(--ink); text-decoration: none; }
.scan-links .scan-link:hover { box-shadow: inset 0 0 0 1.5px var(--green); color: var(--green); }
.scan-links .scan-link[target="_blank"]::after { content: ""; width: .8rem; height: .8rem; margin-top: -.2em; background: currentColor; -webkit-mask: var(--mask-ext) center / contain no-repeat; mask: var(--mask-ext) center / contain no-repeat; }

.scan-banner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; padding: .8rem 1rem .8rem 3rem; position: relative; border-radius: var(--r); background: var(--paint); color: var(--ink); }
.scan-banner::before { content: ""; position: absolute; left: 1rem; top: 50%; width: 1.25rem; height: 1.25rem; margin-top: -.62rem; background: var(--green); -webkit-mask: var(--mask-info) center / contain no-repeat; mask: var(--mask-info) center / contain no-repeat; }
.scan-banner__text { margin: 0; }

/* ---------- inputs ---------- */
.scan-section-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; }
.scan-inputs > .scan-hint { margin: .5rem 0 1rem; }
.scan-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: .8rem; }
.scan-step { min-width: 0; padding: 1.15rem 1.15rem 1.2rem; border-radius: var(--r-lg); background: #fff; box-shadow: inset 0 0 0 1.5px var(--line); }
.scan-step__title { margin: 0; display: flex; gap: .7rem; align-items: center; font-size: var(--fs-base); font-weight: 800; line-height: 1.3; }
/* small exit sign: green plate, white inset border */
.scan-step__num { flex: none; display: grid; place-items: center; width: 2rem; height: 2rem; padding-top: .15em; border-radius: 8px; background: var(--green); color: #fff; box-shadow: inset 0 0 0 2.5px var(--green), inset 0 0 0 4px #fff; font-size: .9rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.scan-step__pills { display: flex; flex-wrap: wrap; gap: .35rem; margin: .7rem 0 0; }
.scan-pill { display: inline-flex; align-items: center; gap: .4rem; min-height: 26px; font-size: .78rem; font-weight: 700; line-height: 1.25; padding: .2rem .65rem 0; border-radius: 999px; background: var(--paint); color: var(--ink-2); white-space: nowrap; }
.scan-pill .icon { width: 1em; height: 1em; }
.scan-pill--accent { background: var(--green-tint); color: var(--green-ink); }
.scan-pill--accent .icon { color: var(--green); }
.scan-checklist { display: grid; gap: .8rem; margin-top: .85rem; }
.scan-fieldset { margin: 0; padding: 0; border: 0; min-width: 0; min-inline-size: 0; display: flex; flex-wrap: wrap; gap: .35rem; }
.scan-fieldset--phone { margin-top: .9rem; }
.scan-legend { font-weight: 800; font-size: .78rem; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); padding: 0; margin-bottom: .45rem; float: left; width: 100%; }
.scan-checklist .scan-check, .scan-fieldset--phone .scan-check { display: inline-flex; align-items: center; gap: .45rem; min-height: 36px; padding: .2rem .8rem 0 .55rem; border-radius: 10px; font-size: var(--fs-xs); font-weight: 700; color: var(--ink); background: #fff; box-shadow: inset 0 0 0 1.5px var(--line-2); cursor: pointer; line-height: 1.3; transition: box-shadow .15s, background-color .15s, color .15s; }
.scan-checklist .scan-check:hover, .scan-fieldset--phone .scan-check:hover { box-shadow: inset 0 0 0 1.5px var(--green); }
.scan-checklist .scan-check:has(input:checked), .scan-fieldset--phone .scan-check:has(input:checked) { background: var(--green); color: #fff; box-shadow: inset 0 0 0 2px var(--green), inset 0 0 0 3.5px #fff; }
.scan-checklist .scan-check:has(input:focus-visible), .scan-fieldset--phone .scan-check:has(input:focus-visible) { outline: 3px solid var(--focus); outline-offset: 2px; }
.scan-check { display: flex; gap: .5rem; align-items: flex-start; cursor: pointer; }
.scan-check__input { margin: .2rem 0 0; flex: none; accent-color: var(--green); width: 1.05rem; height: 1.05rem; }
.scan-checklist .scan-check__input, .scan-fieldset--phone .scan-check__input { margin: -.15em 0 0; width: .95rem; height: .95rem; accent-color: #fff; }

.scan-label { display: block; font-weight: 800; font-size: var(--fs-xs); margin: .9rem 0 .35rem; }
.scan-textarea, .scan-input, .scan-select { font: inherit; font-size: var(--fs-xs); max-width: 100%; color: var(--ink); background: #fff; border: 1.5px solid var(--line-2); border-radius: var(--r-sm); }
.scan-textarea { width: 100%; padding: .65rem .75rem; resize: vertical; min-height: 6rem; }
.scan-textarea:focus, .scan-input:focus, .scan-select:focus { border-color: var(--green); outline: none; box-shadow: 0 0 0 3px var(--green-tint); }
.scan-textarea--copy { font-family: var(--mono); }
.scan-input { width: 100%; min-width: 8rem; padding: .45rem .6rem .35rem; }
.scan-select { min-height: 36px; padding: .3rem 1.8rem .2rem .7rem; border-radius: 10px; font-weight: 700; accent-color: var(--green); }
.scan-file { display: flex; flex-direction: column; gap: .45rem; margin: .9rem 0 0; padding: 1rem; border: 2px dashed var(--line-2); border-radius: var(--r); background: var(--stone); cursor: pointer; transition: border-color .15s, background-color .15s; }
.scan-file:hover { border-color: var(--green); background: var(--green-tint); }
.scan-file:has(input:focus-visible) { outline: 3px solid var(--focus); outline-offset: 2px; }
.scan-file--inline { margin: 0; padding: .55rem .75rem; max-width: 100%; min-width: 0; }
.scan-file__label { font-weight: 800; font-size: var(--fs-xs); }
.scan-file__input { font: inherit; font-size: var(--fs-xs); color: var(--muted); width: 100%; max-width: 100%; min-width: 0; }
.scan-file__input::file-selector-button { font: 800 var(--fs-xs) var(--font); margin-right: .75rem; padding: .55rem 1rem .4rem; border: 0; border-radius: 10px; background: var(--green); color: #fff; cursor: pointer; }
.scan-actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: .8rem 0 0; }

/* buttons, the same family as .button in site.css */
.scan-button { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 42px; font: 800 var(--fs-xs)/1.2 var(--font); padding: .2em 1.1rem 0; border: 0; border-radius: 10px; background: var(--green); color: #fff; box-shadow: inset 0 0 0 3px var(--green), inset 0 0 0 4.5px rgba(255, 255, 255, .92); cursor: pointer; transition: background-color .15s, box-shadow .15s, color .15s; }
.scan-button:hover { background: var(--green-deep); box-shadow: inset 0 0 0 3px var(--green-deep), inset 0 0 0 4.5px rgba(255, 255, 255, .92); }
.scan-button--secondary { background: #fff; color: var(--green); box-shadow: inset 0 0 0 2px var(--green); }
.scan-button--secondary:hover { background: var(--green-tint); color: var(--green-deep); box-shadow: inset 0 0 0 2px var(--green-deep); }
.scan-button--danger { background: #fff; color: var(--hard); box-shadow: inset 0 0 0 2px var(--hard); }
.scan-button--danger:hover { background: var(--hard-soft); color: var(--hard); box-shadow: inset 0 0 0 2px var(--hard); }
.scan-button--link { min-height: 0; padding: 0; border-radius: 0; background: none; box-shadow: none; color: var(--ink-2); text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: .2em; font-weight: 700; }
.scan-button--link:hover { background: none; box-shadow: none; color: var(--ink); text-decoration-color: currentColor; }
.scan-button:disabled, .scan-file__input:disabled { opacity: .5; cursor: not-allowed; }
.scan-tab:focus-visible, .scan-panel:focus-visible, .scan-table-wrap:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }

.scan-progress { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin: 1rem 0 0; padding: .8rem .95rem; border-radius: var(--r); background: #fff; box-shadow: inset 0 0 0 1.5px var(--line); }
.scan-progress__bar { flex: 1 1 10rem; height: .6rem; accent-color: var(--green); }
.scan-progress__text { flex: 2 1 12rem; font-variant-numeric: tabular-nums; font-size: var(--fs-xs); }

/* ---------- "Analyze my account" (browser extension): the green sign, fastest route ---------- */
.scan-auto.gsign { background: var(--sb); margin-top: 2.2rem; padding: 1.5rem 1.35rem 1.35rem; box-shadow: inset 0 0 0 5px var(--sb), inset 0 0 0 7px #fff, var(--shadow); }
.scan-auto__tab { right: 18px; }
.scan-auto .scan-step__title { color: #fff; font-size: var(--fs-lg); }
.scan-step__num--auto { background: #fff; color: var(--green); box-shadow: none; }
.scan-step__num--auto .icon { width: 1.1rem; height: 1.1rem; margin: 0; }
.scan-auto .scan-pill { background: rgba(255, 255, 255, .14); color: #fff; }
.scan-auto .scan-pill--accent { background: #fff; color: var(--green-ink); }
.scan-auto .scan-pill--accent .icon { color: var(--green); }
.gsign.scan-auto p.scan-hint { color: var(--sign-text); }
.scan-auto .scan-actions { margin-top: .9rem; }
.scan-auto .scan-button--big { background: #fff; color: var(--green); box-shadow: inset 0 0 0 4px #fff, inset 0 0 0 5.5px var(--green); }
.scan-auto .scan-button--big:hover { background: var(--green-tint); color: var(--green-deep); box-shadow: inset 0 0 0 4px var(--green-tint), inset 0 0 0 5.5px var(--green-deep); }
.scan-auto .scan-button--secondary { background: transparent; color: #fff; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .8); }
.scan-auto .scan-button--secondary:hover { background: rgba(255, 255, 255, .1); }
.scan-button--big { min-height: 52px; font-size: var(--fs-sm); padding: .2em 1.4rem 0; }
.scan-button--big::after { content: ""; width: 1.05rem; height: 1.05rem; margin-top: -.15em; background: currentColor; -webkit-mask: var(--mask-arrow) center / contain no-repeat; mask: var(--mask-arrow) center / contain no-repeat; }
.gsign.scan-auto p.scan-soon { display: inline-flex; align-items: center; gap: .5rem; margin: .9rem 0 0; padding: .35rem .9rem .25rem; border-radius: 999px; background: rgba(255, 255, 255, .14); color: #fff; font-size: var(--fs-xs); font-weight: 700; line-height: 1.35; }
.scan-soon::before { content: ""; flex: none; width: 1rem; height: 1rem; margin-top: -.15em; background: currentColor; -webkit-mask: var(--mask-clock) center / contain no-repeat; mask: var(--mask-clock) center / contain no-repeat; }
.scan-stores { margin-top: .9rem; }
.gsign.scan-auto .scan-stores .scan-link { background: #fff; box-shadow: none; color: var(--green); text-decoration: none; }
.gsign.scan-auto .scan-stores .scan-link:hover { background: var(--green-tint); color: var(--green-deep); }
.scan-autosteps { list-style: none; margin: .8rem 0 0; padding: 0; display: grid; gap: .35rem; }
.scan-autostep { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name state" "detail state"; align-items: center; column-gap: .75rem; padding: .55rem .55rem .45rem .85rem; border-radius: var(--r-sm); background: #fff; font-size: var(--fs-xs); font-weight: 700; line-height: 1.35; color: var(--ink); }
.scan-autostep__name { grid-area: name; min-width: 0; }
.scan-autostep__detail { grid-area: detail; color: var(--muted); font-size: .78rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.scan-autostep__detail:empty { display: none; }
.scan-auto .scan-autostep__state { grid-area: state; white-space: nowrap; background: var(--paint); color: var(--ink-2); }
.scan-autostep__state::before { content: ""; flex: none; width: .5rem; height: .5rem; margin-top: -.15em; border-radius: 50%; background: currentColor; opacity: .55; }
.scan-auto .scan-autostep__state--running { background: var(--paint); color: var(--ink); }
.scan-autostep__state--running::before { opacity: 1; animation: scan-pulse 1.1s ease-in-out infinite; }
.scan-auto .scan-autostep__state--done { background: var(--green-tint); color: var(--green-ink); }
.scan-autostep__state--done::before, .scan-autostep__state--error::before { width: .85rem; height: .85rem; border-radius: 0; opacity: 1; -webkit-mask: var(--mask-check) center / contain no-repeat; mask: var(--mask-check) center / contain no-repeat; }
.scan-auto .scan-autostep__state--error { background: var(--amber); color: var(--ink); }
.scan-autostep__state--error::before { -webkit-mask-image: var(--mask-alert); mask-image: var(--mask-alert); }
.scan-auto .scan-autostep__state--skipped { background: var(--paint); color: var(--muted); }
.scan-autostep[data-state="skipped"] .scan-autostep__name { color: var(--muted); }
@keyframes scan-pulse { 50% { opacity: .2; } }
@media (prefers-reduced-motion: reduce) { .scan-autostep__state--running::before { animation: none; } }
.gsign.scan-auto p.scan-status { display: block; margin-top: .8rem; padding: .65rem .9rem .55rem; border-radius: var(--r-sm); line-height: 1.5; background: #fff; color: var(--green-ink); }
.gsign.scan-auto p.scan-status--error { background: var(--amber-tint); color: var(--ink); box-shadow: inset 4px 0 0 var(--amber); }
.scan-auto .scan-status .scan-button--link { margin-left: .2rem; color: inherit; }
.gsign.scan-auto p.scan-status:empty { display: none; }
.scan-or { display: flex; align-items: center; gap: .8rem; margin: 1.2rem 0 1rem; color: var(--muted); font-size: .78rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.scan-or::before, .scan-or::after { content: ""; flex: 1 1 0; height: 0; border-top: 3px dashed var(--line-2); }

/* ---------- results ---------- */
.scan-results { padding: 1.5rem; border-radius: calc(var(--r-lg) + 4px); background: #fff; box-shadow: inset 0 0 0 1.5px var(--line), var(--shadow); }
.scan-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr)); gap: .65rem; margin: 1.1rem 0 1.5rem; }
/* counters as sign plates: the first two green, the risky two amber-edged */
.scan-stat { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: .25rem; margin: 0; padding: 1rem 1rem .9rem; border-radius: 12px; background: var(--green); box-shadow: inset 0 0 0 4px var(--green), inset 0 0 0 5.5px #fff; }
.scan-stat__label { font-size: var(--fs-xs); font-weight: 700; color: var(--sign-text); line-height: 1.35; }
.scan-stat__value { margin: 0; font-weight: 800; font-size: 2.1rem; line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums lining-nums; color: #fff; }
.scan-stat:nth-child(n+3) { background: #fff; box-shadow: inset 0 0 0 2px var(--line-2); }
.scan-stat:nth-child(n+3) .scan-stat__label { color: var(--ink-2); }
.scan-stat:nth-child(n+3) .scan-stat__value { color: var(--ink); }
.scan-stat:nth-child(3) { box-shadow: inset 0 0 0 2px var(--amber-line), inset 0 5px 0 var(--amber); }

.scan-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .3rem; padding: .3rem; border-radius: var(--r); background: var(--paint); }
.scan-tab { min-height: 46px; font: 800 var(--fs-sm)/1.25 var(--font); padding: .5rem .6rem .35rem; border: 0; border-radius: calc(var(--r) - 4px); background: none; cursor: pointer; color: var(--ink-2); text-align: center; }
.scan-tab:hover { color: var(--ink); background: rgba(255, 255, 255, .6); }
.scan-tab[aria-selected="true"] { background: var(--green); color: #fff; box-shadow: inset 0 0 0 3px var(--green), inset 0 0 0 4.5px #fff; }
.scan-tab__count { font-weight: 700; font-variant-numeric: tabular-nums; }
.scan-panel { padding: 1.25rem 0 0; }
.scan-panel > .scan-hint:first-child { margin: 0 0 1rem; }
.scan-empty { padding: 1.25rem; border: 2px dashed var(--line-2); border-radius: var(--r); color: var(--muted); background: var(--stone); }

/* footprint: each product is an exit on the way out */
.scan-products { list-style: none; padding: 0; margin: 0; display: grid; gap: .75rem; counter-reset: scan-step; }
.scan-product { padding: 1.05rem 1.15rem 1rem; border-radius: var(--r); background: #fff; box-shadow: inset 0 0 0 1.5px var(--line); counter-increment: scan-step; display: grid; gap: .6rem; }
.scan-product[data-status="moved"], .scan-product[data-status="keep"] { background: var(--stone); }
.scan-product[data-status="moved"] .scan-product__name, .scan-product[data-status="keep"] .scan-product__name { color: var(--muted); }
.scan-product[data-status="moved"] .scan-product__name::before { content: ""; background: var(--green) var(--check-white) center / 70% no-repeat; }
.scan-product__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .45rem .75rem; align-items: center; }
.scan-product__name { margin: 0; font-size: var(--fs-base); font-weight: 800; display: flex; align-items: center; }
.scan-product__name::before { content: counter(scan-step); display: inline-grid; place-items: center; width: 1.75rem; height: 1.75rem; padding-top: .15em; margin-right: .65rem; border-radius: 7px; background: var(--green-tint); color: var(--green-ink); font-size: .8rem; font-weight: 800; font-variant-numeric: tabular-nums; flex: none; }
.scan-product__meta { margin: 0; display: flex; flex-wrap: wrap; gap: .35rem; }
.scan-product__meta .scan-pill { white-space: normal; text-align: left; border-radius: 10px; }
.scan-products > li, .scan-product > * { min-width: 0; }
.scan-level { white-space: normal; text-align: left; word-spacing: .12em; }
.scan-pill--diff { gap: .5rem; }
.scan-pill--diff .lanes { margin-top: -.2em; }
.scan-pill--easy { background: var(--green-tint); color: var(--green-ink); }
.scan-pill--medium { background: #ECE8E2; color: var(--ink); }
.scan-pill--hard { background: var(--amber); color: var(--ink); }
.scan-product__alts { margin: .1rem 0 0; }
/* "Level 3 · Move your email" as a small exit tab */
.scan-level { display: inline-flex; align-items: center; min-height: 26px; font-size: .75rem; font-weight: 800; padding: .2rem .7rem 0; border-radius: 7px; background: var(--green); color: #fff; box-shadow: inset 0 0 0 2px var(--green), inset 0 0 0 3.5px #fff; }
.scan-alts__label { font-weight: 800; font-size: .78rem; letter-spacing: .04em; text-transform: uppercase; margin: 0; color: var(--muted); }
.scan-alts { list-style: none; margin: .35rem 0 0; padding: 0; display: grid; gap: .3rem; }
.scan-alt { position: relative; padding-left: 1.1rem; font-size: var(--fs-xs); line-height: 1.5; }
.scan-alt::before { content: ""; position: absolute; left: 0; top: .45em; width: .7rem; height: .7rem; background: var(--green); -webkit-mask: var(--mask-exit) center / contain no-repeat; mask: var(--mask-exit) center / contain no-repeat; }
.scan-alt__name { font-weight: 800; margin-right: .35rem; color: var(--green); }
.scan-alt__tagline { color: var(--ink-2); }
.scan-product__actions { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; justify-content: space-between; padding-top: .7rem; border-top: 1.5px solid var(--line); font-size: var(--fs-xs); }
.scan-product__actions a { font-weight: 700; }

.scan-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .3rem; }
.scan-chip { display: inline-flex; align-items: center; min-height: 24px; max-width: 100%; font-size: .75rem; font-weight: 700; line-height: 1.25; padding: .2rem .6rem .1rem; border-radius: 7px; background: var(--paint); color: var(--ink-2); }
@media (min-width: 40.01rem) { .scan-table .scan-chip { white-space: nowrap; } }
.scan-chip--checklist, .scan-chip--takeout, .scan-chip--activity, .scan-chip--dashboard { background: #ECE8E2; color: var(--ink); }
.scan-chip--access, .scan-chip--date { background: var(--paint); color: var(--ink-2); }
.scan-chip--sso { background: var(--amber-tint); color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--amber-line); }
.scan-chip--gmail { background: var(--amber-tint); color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--amber-line); }
.scan-chip--passwords, .scan-chip--login { background: var(--green-tint); color: var(--green-ink); }
.scan-chip--mail, .scan-chip--app, .scan-chip--play { background: var(--paint); color: var(--ink-2); }
.scan-chip--example { background: #fff; color: var(--muted); box-shadow: inset 0 0 0 1.5px var(--line-2); }
.scan-chip--manual { background: #fff; color: var(--muted); box-shadow: inset 0 0 0 1.5px var(--line); }

/* accounts */
.scan-toolbar { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; justify-content: space-between; font-size: var(--fs-xs); }
.scan-group { margin: 1.5rem 0 0; }
.scan-group__title { margin: 0; font-size: var(--fs-base); font-weight: 800; display: flex; align-items: center; gap: .65rem; }
/* priority markers: 1 amber diamond (warning sign), 2 green square, 3 grey square */
.scan-group__title::before { content: ""; flex: none; width: .95rem; height: .95rem; border-radius: 3px; background: var(--post); }
.scan-group--p1 .scan-group__title::before { background: var(--amber); transform: rotate(45deg) scale(.9); box-shadow: 0 0 0 1.5px var(--ink); }
.scan-group--p2 .scan-group__title::before { background: var(--green); box-shadow: inset 0 0 0 2px var(--green), inset 0 0 0 3px #fff; }
.scan-group--p3 .scan-group__title::before { background: var(--post); }
.scan-group__count { color: var(--muted); font-weight: 700; font-variant-numeric: tabular-nums; }
.scan-group__desc { margin: .3rem 0 .75rem; color: var(--muted); font-size: var(--fs-xs); }
.scan-table-wrap { overflow-x: auto; border-radius: var(--r); background: #fff; box-shadow: inset 0 0 0 1.5px var(--line); }
.scan-group--p1 .scan-table-wrap { box-shadow: inset 0 0 0 1.5px var(--amber-line), inset 4px 0 0 var(--amber); }
.scan-table { width: 100%; border-collapse: collapse; font-size: var(--fs-xs); line-height: 1.5; }
.scan-th, .scan-cell { text-align: left; vertical-align: top; padding: .75rem .8rem .65rem; border-bottom: 1.5px solid var(--line); }
.scan-th { font-weight: 800; font-size: .78rem; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-2); background: var(--stone); white-space: nowrap; }
.scan-row:last-child .scan-cell { border-bottom: 0; }
.scan-service__name { display: block; font-weight: 800; font-size: var(--fs-sm); color: var(--ink); }
.scan-service__domain { display: block; color: var(--muted); font-weight: 400; }
.scan-row[data-status="changed"], .scan-row[data-status="deleted"], .scan-row[data-status="keep"] { background: var(--stone); }
.scan-row[data-status="changed"] .scan-service__name, .scan-row[data-status="deleted"] .scan-service__name, .scan-row[data-status="keep"] .scan-service__name { color: var(--muted); text-decoration: line-through; text-decoration-color: var(--green); text-decoration-thickness: 2px; }
.scan-row[data-status="keep"] .scan-service__name { text-decoration: none; }
.scan-panel--hide-done .scan-row:not([data-status="todo"]) { display: none; }
.scan-cell--evidence { min-width: 10.5rem; }
.scan-cell--status { min-width: 8.5rem; }
.scan-cell--notes { min-width: 8rem; }
.scan-hide { display: block; margin-top: .5rem; font-size: .75rem; }
.scan-delete { display: flex; flex-wrap: wrap; gap: .35rem .6rem; align-items: center; }
.scan-delete__link { color: var(--green); font-weight: 700; }
.scan-delete__email, .scan-firstmail { font-size: .75rem; color: var(--muted); margin: 0; width: 100%; }
.scan-notes { width: 100%; }
.scan-notes__summary { cursor: pointer; color: var(--ink-2); font-weight: 700; }
.scan-notes__text { margin: .3rem 0; color: var(--ink-2); overflow-wrap: anywhere; }

.scan-badge { display: inline-flex; align-items: center; min-height: 24px; font-size: .74rem; font-weight: 800; padding: .15rem .6rem 0; border-radius: 999px; }
.scan-badge--easy { background: var(--green-tint); color: var(--green-ink); }
.scan-badge--medium { background: #ECE8E2; color: var(--ink); }
.scan-badge--hard { background: var(--amber); color: var(--ink); }
.scan-badge--limited { background: var(--amber-tint); color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--amber-line); }
.scan-badge--impossible { background: var(--ink); color: #fff; }
.scan-badge--unknown { background: var(--paint); color: var(--muted); }

/* before you delete */
.scan-tasks { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.scan-task { display: flex; gap: .8rem; align-items: flex-start; padding: .9rem 1rem .85rem; border-radius: var(--r); background: #fff; box-shadow: inset 0 0 0 1.5px var(--line); }
.scan-task--done { background: var(--stone); }
.scan-task--done .scan-task__title { color: var(--muted); text-decoration: line-through; text-decoration-color: var(--green); text-decoration-thickness: 2px; }
.scan-task__check { width: 1.2rem; height: 1.2rem; margin-top: .1rem; accent-color: var(--green); flex: none; }
.scan-task__title { font-weight: 800; cursor: pointer; }
.scan-task__detail, .scan-task__progress { margin: .25rem 0 0; color: var(--muted); font-size: var(--fs-xs); }
.scan-task__progress { display: inline-flex; font-weight: 800; color: var(--green-ink); background: var(--green-tint); padding: .2rem .6rem .1rem; border-radius: 999px; }
.scan-task__guide { font-size: var(--fs-xs); font-weight: 700; }
.scan-task--p1 { box-shadow: inset 0 0 0 1.5px var(--amber-line), inset 4px 0 0 var(--amber); }
.scan-task__pri { display: block; width: fit-content; margin: 0 0 .35rem; padding: .18rem .6rem .08rem; border-radius: 6px; background: var(--amber); color: var(--ink); font-size: .72rem; font-weight: 800; }
.scan-task__note { margin: .3rem 0 0; color: var(--ink-2); font-size: var(--fs-xs); line-height: 1.5; }
.scan-task__links { display: flex; flex-wrap: wrap; gap: .3rem 1rem; margin: .45rem 0 0; font-size: var(--fs-xs); }
.scan-task__ext, .scan-task__links .scan-task__guide { font-weight: 700; }

/* export + storage */
.scan-export, .scan-storage { margin-top: 1.75rem; padding-top: 1.25rem; border-top: 1.5px solid var(--line); }
.scan-storage { display: flex; flex-wrap: wrap; gap: .75rem 1rem; align-items: center; justify-content: space-between; font-size: var(--fs-xs); }
.scan-copybox { margin-top: .75rem; }
.scan-version { white-space: nowrap; }

/* account actions (Google page, change-password address, deletion letter), calendar reminders,
   and the slot that "My plan" fills (static/js/plan.js) */
.scan-plan { margin: 1rem 0 0; }
.scan-plan:empty { display: none; }
.scan-accounts-hint { margin: .9rem 0 0; }
.scan-acts { display: flex; flex-wrap: wrap; gap: .35rem; width: 100%; margin: .25rem 0 0; }
.scan-act { display: inline-flex; align-items: center; max-width: 100%; min-height: 30px; font: 700 .75rem/1.3 var(--font); padding: .2rem .75rem 0; border: 0; border-radius: 8px; background: #fff; box-shadow: inset 0 0 0 1.5px var(--line-2); color: var(--ink); text-decoration: none; cursor: pointer; white-space: normal; text-align: left; }
.scan-act:hover { box-shadow: inset 0 0 0 1.5px var(--green); background: var(--green-tint); color: var(--green-ink); }
.scan-act:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.scan-act--google { background: var(--amber-tint); box-shadow: inset 0 0 0 1.5px var(--amber-line); color: var(--ink); }
.scan-act--google:hover { background: var(--amber); box-shadow: none; color: var(--ink); }
.scan-letter { width: 100%; }
.scan-letter__status { margin: .4rem 0 0; font-size: .75rem; font-weight: 700; color: var(--green-ink); }
.scan-letter__text { margin-top: .4rem; min-height: 10rem; font-family: var(--mono); font-size: .75rem; }
.scan-remind { margin-top: 1.1rem; padding: 1rem 1.1rem; border: 2px dashed var(--line-2); border-radius: var(--r); background: var(--stone); }
.scan-remind .scan-h3 { margin: 0; }
.scan-remind .scan-actions { margin-top: .6rem; }
.scan-remind .scan-status { margin-top: .6rem; }

@media (max-width: 40rem) {
  .scan-results { padding: 1rem; }
  .scan-step { padding: 1rem .95rem 1.05rem; }
  .scan-auto.gsign { padding: 1.35rem 1rem 1.1rem; }
  .scan-tab { font-size: var(--fs-xs); padding: .45rem .35rem .3rem; }
  .scan-table, .scan-table tbody, .scan-table tr, .scan-cell { display: block; width: 100%; }
  .scan-table thead { display: block; position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); }
  .scan-row { padding: .75rem .85rem; border-bottom: 1.5px solid var(--line); }
  .scan-cell { border: 0; padding: .2rem 0; }
  .scan-cell--evidence, .scan-cell--status, .scan-cell--notes { min-width: 0; }
}

@media print {
  .scan-auto.gsign, .scan-stat, .scan-tab[aria-selected="true"], .scan-level { background: #fff; color: var(--ink); box-shadow: none; border: 2px solid var(--green); }
  .scan-stat__label, .scan-stat__value, .scan-auto .scan-step__title { color: var(--ink); }
}