/* Analysis report. Layout only: every colour, radius and typeface comes from the site's
   own tokens in styles.css. Mobile first: one column; from 900px the photo moves into a
   left column beside the verdict. */
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.button:disabled{cursor:not-allowed;opacity:.45}
/* Several blocks below set display:flex/grid, which would otherwise beat [hidden]. */
.results [hidden]{display:none!important}
.workflow .done{color:var(--text)}
.workflow .done b{background:var(--coral-tint);color:var(--coral-dark)}

/* File line */
.file-line{display:flex;align-items:center;gap:var(--space-3)}
.file-thumb{flex:none;display:grid;place-items:center;width:56px;height:56px;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface-muted)}
.file-thumb img{width:100%;height:100%;object-fit:cover}
.file-line-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.file-line-text strong{color:var(--text-strong);font-size:var(--text-base);overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}
.file-line-text span{color:var(--muted);font-size:var(--text-sm)}
.file-line .button{flex:none}

/* Photo beside the verdict (desktop only; phones get the thumbnail above) */
.result-layout{display:grid;gap:var(--space-4);margin-top:var(--space-4)}
.result-media{display:none;margin:0}
.result-main{display:flex;flex-direction:column;gap:var(--space-4);min-width:0}

/* Verdict */
.verdict{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-4) var(--space-5);border:1px solid var(--coral-tint-border);border-radius:var(--radius-lg);background:var(--coral-tint)}
.verdict[data-state="clean"]{border-color:color-mix(in srgb,var(--success) 35%,var(--surface));background:color-mix(in srgb,var(--success) 9%,var(--surface))}
.verdict-label{display:flex;align-items:center;gap:var(--space-2);margin:0;color:var(--coral-dark);font-size:var(--text-sm);font-weight:800}
.verdict[data-state="clean"] .verdict-label,.download-done .verdict-label{color:var(--success)}
.verdict h2,.verdict .panel-title{margin:0;color:var(--text-strong);font-size:var(--text-2xl);line-height:1.25;letter-spacing:-.02em}
.verdict h2:focus,.verdict .panel-title:focus{outline:none}
.verdict h2:focus-visible,.verdict .panel-title:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}
.verdict>p:not(.verdict-label){margin:0;color:var(--text);font-size:var(--text-base);line-height:1.5}
.verdict-facts{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:var(--space-1) 0 0;padding:0;list-style:none}
.verdict-facts:empty{display:none}
.verdict-facts li{display:inline-flex;align-items:center;gap:var(--space-2);min-height:36px;max-width:100%;padding:var(--space-2) var(--space-3);border:1px solid var(--coral-tint-border);border-radius:99px;background:var(--surface);font-size:var(--text-md)}
.verdict-facts svg{flex:none;color:var(--coral-dark)}
.verdict-facts strong{color:var(--text-strong);font-weight:700;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.findings-title{margin:var(--space-2) 0 calc(var(--space-2) * -1);color:var(--text-strong);font-size:var(--text-base)}

/* Findings */
.findings{margin:0;padding:0;list-style:none;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface)}
.finding{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-4) var(--space-4);border-bottom:1px solid var(--line-soft)}
.finding:last-child{border-bottom:0}
.finding>svg{flex:none;margin-top:1px;color:var(--muted)}
.finding-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.finding-label{color:var(--muted);font-size:var(--text-sm)}
.finding-body strong{color:var(--text-strong);font-size:var(--text-base);overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.finding-sub{color:var(--muted);font-size:var(--text-sm);font-variant-numeric:tabular-nums}
.finding-map{width:100%;height:170px;margin-top:var(--space-2);border:1px solid var(--line);border-radius:var(--radius-md)}
.finding-link{align-self:flex-start;display:inline-flex;align-items:center;min-height:44px;margin-top:2px;color:var(--coral-dark);font-weight:700;font-size:var(--text-md)}

/* Safe copy */
.safe-copy{display:flex;flex-direction:column;gap:var(--space-2)}
.safe-copy .button{display:flex;align-items:center;justify-content:center;gap:var(--space-2);width:100%;min-height:54px;font-size:var(--text-base)}
.safe-copy-hint{margin:0;color:var(--muted);font-size:var(--text-md);line-height:1.45;text-align:center}
.download-done{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-4) var(--space-5);border:1px solid color-mix(in srgb,var(--success) 35%,var(--surface));border-radius:var(--radius-lg);background:color-mix(in srgb,var(--success) 9%,var(--surface))}
.download-done h3,.download-done .panel-title{margin:0;color:var(--text-strong);font-size:var(--text-xl)}
.download-done p{margin:0;color:var(--text);font-size:var(--text-md);line-height:1.5}
.download-done .download-name{padding:var(--space-2) var(--space-3);border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface);color:var(--text-strong);font-weight:700;overflow-wrap:anywhere}
.download-done .download-summary{color:var(--muted);font-size:var(--text-md)}
.export-status{margin:0;color:var(--muted);font-size:var(--text-md)}
.export-status:empty{display:none}
.export-status.error{color:var(--error)}
.check-another{width:100%;min-height:50px}

/* "More options" and "Technical details": one level of disclosure each */
.result-details{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface)}
.result-details>summary{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);min-height:52px;padding:0 var(--space-4);color:var(--text-strong);font-weight:700;font-size:var(--text-base);cursor:pointer;list-style:none}
.result-details>summary::-webkit-details-marker{display:none}
.result-details>summary::after{content:"";flex:none;width:8px;height:8px;margin-top:calc(var(--space-1) * -1);border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .15s}
.result-details[open]>summary::after{margin-top:var(--space-1);transform:rotate(-135deg)}
.result-details[open]>summary{border-bottom:1px solid var(--line-soft)}
.result-details-body{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-4)}
.more-options-intro{margin:0;color:var(--muted);font-size:var(--text-md);line-height:1.5}
.option-button{display:flex;align-items:center;gap:var(--space-3);width:100%;min-height:64px;padding:var(--space-3) var(--space-4);border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface);color:var(--text);text-align:left;cursor:pointer;transition:border-color .15s,background .15s}
@media(hover:hover){.option-button:hover{border-color:var(--coral);background:var(--coral-tint-2)}}
.option-button span{flex:1;display:flex;flex-direction:column;gap:2px}
.option-button strong{color:var(--text-strong);font-size:var(--text-base)}
.option-button small{color:var(--muted);font-size:var(--text-md);line-height:1.4}
.option-button svg{flex:none;color:var(--muted)}
.help-tip{margin:0;padding:var(--space-4) var(--space-4);border-radius:var(--radius-md);background:var(--surface-muted);color:var(--text);font-size:var(--text-md);line-height:1.5}
.help-tip strong{color:var(--text-strong)}

/* Technical details */
.tech-details{margin-top:var(--space-4)}
.tech-details .search-wrap{max-width:none}
.tech-legend,.filter-count{margin:0;color:var(--muted);font-size:var(--text-sm);line-height:1.5}
.tech-details .metadata{grid-template-columns:1fr}
.metadata-group dl>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:var(--space-1) var(--space-4);align-items:baseline;padding:var(--space-2) var(--space-4)}
.metadata-group dl>div[data-sensitive]{background:color-mix(in srgb,var(--coral) 5%,var(--surface))}
.metadata dt{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:var(--space-2);color:var(--text);font-size:var(--text-md);font-weight:500}
.metadata dt small{flex-basis:100%;color:var(--muted);font-size:var(--text-xs);font-weight:400}
.metadata dd{margin:0;font-weight:600}
.sensitive-dot{flex:none;display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--coral)}
.metadata-actions{display:flex;gap:var(--space-2);margin-top:var(--space-2)}
.metadata-edit,.metadata-delete{min-height:44px;min-width:44px;padding:0 var(--space-3);border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);font-size:var(--text-xs);font-weight:700;cursor:pointer}
.metadata-delete{border-color:color-mix(in srgb,var(--error) 45%,var(--surface));color:var(--error)}
.thumbnail-block h3,.thumbnail-block .panel-title{margin:0 0 var(--space-2);color:var(--text-strong);font-size:var(--text-base)}
.thumbnail-block img{display:block;max-width:100%;max-height:160px;border:1px solid var(--line);border-radius:var(--radius-md)}
.thumbnail-note{margin:var(--space-2) 0;color:var(--muted);font-size:var(--text-sm);line-height:1.4}
.data-exports{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.data-exports .button{min-height:44px}

.results .rating-card{margin:var(--space-4) 0 0}
.trust-line{margin:var(--space-4) 0 0;color:var(--muted);font-size:var(--text-sm);line-height:1.5}
.trust-line a{color:var(--muted)}

/* Phone-only copy of the safe-copy button while the real one is below the fold. */
.sticky-safe-copy{position:fixed;left:0;right:0;bottom:0;z-index:25;padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:color-mix(in srgb,var(--paper) 94%,transparent);backdrop-filter:blur(6px)}
.sticky-safe-copy .button{display:flex;align-items:center;justify-content:center;gap:var(--space-2);width:100%;min-height:52px;font-size:var(--text-base)}
/* The privacy note under the drop target touched the dashed border on narrow screens. */
.dropzone{padding:var(--space-4);text-align:center}
/* Upload errors read as a message to act on, not a faint line of text. */
.status.error{padding:var(--space-3) var(--space-4);border:1px solid color-mix(in srgb,var(--error) 35%,var(--surface));border-radius:var(--radius-md);background:color-mix(in srgb,var(--error) 7%,var(--surface));color:var(--text-strong);line-height:1.5}

@media(min-width:900px){
  .sticky-safe-copy{display:none!important}
  .file-line .file-thumb{display:none}
  .result-layout{grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:var(--space-7);align-items:start}
  .result-media{display:grid;place-items:center;min-height:240px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface-muted);overflow:hidden;position:sticky;top:64px}
  .result-media img{display:block;width:100%;max-height:520px;object-fit:contain}
  .result-media p{padding:var(--space-4);color:var(--muted);font-size:var(--text-md);text-align:center}
  .verdict{padding:var(--space-6) var(--space-6)}
  .verdict h2,.verdict .panel-title{font-size:var(--text-3xl)}
}
@media(max-width:560px){
  .finding-map{height:140px}
  .metadata-group dl>div{grid-template-columns:1fr}
  .file-line .button{min-height:44px;padding:0 var(--space-3)}
}
@media print{.safe-copy,.result-details>summary::after,.data-exports,.metadata-actions,.check-another{display:none!important}}
.results .rating-status:empty{min-height:0;margin:0}

/* Hide faces and license plates: the box editor (redact.js). Full width under the report;
   from 900px the photo and the side panel sit next to each other. */
.redact-entry .option-button svg{color:var(--text)}
.redact{display:flex;flex-direction:column;gap:var(--space-4);margin-top:var(--space-6);padding-top:var(--space-6);border-top:1px solid var(--line)}
.redact-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3)}
.redact-head .kicker{margin:0 0 var(--space-1)}
.redact-head h2,.redact-head .panel-title{margin:0;color:var(--text-strong);font-size:var(--text-2xl);letter-spacing:-.02em}
.redact-head h2:focus,.redact-head .panel-title:focus{outline:none}
.redact-head h2:focus-visible,.redact-head .panel-title:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}
.redact-head .button{flex:none}
.redact-intro{margin:0;max-width:72ch;color:var(--text);font-size:var(--text-base);line-height:1.55}
.redact-layout{display:grid;gap:var(--space-5)}
.redact-canvas{display:grid;place-items:center;min-height:200px;padding:var(--space-2);border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface-muted)}
/* touch-action:none: a finger on the photo draws instead of scrolling the page. */
.redact-stage{position:relative;max-width:100%;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;cursor:crosshair;line-height:0}
.redact-stage img{display:block;max-width:100%;max-height:min(72vh,760px);width:auto;height:auto;pointer-events:none}
.redact-boxes{position:absolute;inset:0}
/* The boxes stand for the solid black the download gets, so their colours are deliberately
   theme-independent (black fill, white edge) rather than tokens. */
.redact-box{position:absolute;margin:0;padding:0;border:2px solid #FFFFFF;border-radius:0;background:rgba(0,0,0,.82);box-shadow:0 0 0 1px #000000;cursor:move;overflow:hidden;touch-action:none}
.redact-box[aria-pressed="true"]{border-color:var(--coral);box-shadow:0 0 0 1px #000000,0 0 0 3px #FFFFFF}
.redact-box:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px;border-radius:0}
.redact-box-number{position:absolute;top:2px;left:4px;color:#FFFFFF;font-size:var(--text-xs);font-weight:700;line-height:1.2;font-variant-numeric:tabular-nums;pointer-events:none}
.redact-handle{position:absolute;z-index:2;width:44px;height:44px;touch-action:none}
.redact-handle[data-corner="nw"],.redact-handle[data-corner="se"]{cursor:nwse-resize}
.redact-handle[data-corner="ne"],.redact-handle[data-corner="sw"]{cursor:nesw-resize}
.redact-handle i{position:absolute;width:14px;height:14px;margin:-7px 0 0 -7px;border:2px solid var(--coral);border-radius:3px;background:#FFFFFF;box-shadow:0 0 0 1px #000000;pointer-events:none}
.redact-unavailable{margin:0;padding:var(--space-4);color:var(--muted);font-size:var(--text-md);line-height:1.5;text-align:center}
.redact-side{display:flex;flex-direction:column;gap:var(--space-3);min-width:0}
.redact-tools{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.redact-tools .button{flex:1}
.redact-help{color:var(--muted);font-size:var(--text-sm);line-height:1.5}
.redact-help p{margin:0 0 var(--space-2)}
.redact-help p:last-child{margin:0}
.redact-help strong{color:var(--text)}
.redact-list-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-2);margin-top:var(--space-1)}
.redact-list-head h3,.redact-list-head .panel-title{margin:0;color:var(--text-strong);font-size:var(--text-base)}
.redact-count{color:var(--muted);font-size:var(--text-sm);font-variant-numeric:tabular-nums}
.redact-empty{margin:0;color:var(--muted);font-size:var(--text-sm);line-height:1.5}
.redact-list{display:grid;gap:var(--space-2);margin:0;padding:0;list-style:none;max-height:320px;overflow-y:auto}
.redact-list li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:0 var(--space-2);padding:var(--space-2) var(--space-3);border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface)}
.redact-list li.selected{border-color:var(--coral)}
.redact-item-name{color:var(--text-strong);font-weight:700;font-size:var(--text-md)}
.redact-item-dims{grid-column:1;color:var(--muted);font-size:var(--text-xs);font-variant-numeric:tabular-nums}
.redact-item-actions{grid-column:2;grid-row:1 / span 2;display:flex;gap:var(--space-2)}
.redact-item-actions .button{flex:none;min-height:44px;min-width:44px;padding:0 var(--space-3)}
.redact-list .redact-delete{border-color:color-mix(in srgb,var(--error) 45%,var(--surface));color:var(--error)}
.redact-modes{display:grid;gap:var(--space-2);margin:var(--space-1) 0 0;padding:0;border:0}
.redact-modes legend{margin-bottom:var(--space-2);padding:0;color:var(--text-strong);font-weight:700;font-size:var(--text-base)}
.redact-modes label{display:flex;align-items:flex-start;gap:var(--space-3);min-height:44px;padding:var(--space-3);border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface);cursor:pointer}
.redact-modes label:has(input:checked){border-color:var(--coral);background:var(--coral-tint-2)}
.redact-modes input{flex:none;width:20px;height:20px;margin:2px 0 0;accent-color:var(--coral)}
.redact-modes span{display:flex;flex-direction:column;gap:2px}
.redact-modes strong{color:var(--text-strong);font-size:var(--text-md)}
.redact-modes small{color:var(--muted);font-size:var(--text-sm);line-height:1.4}
.redact-note,.redact-flow{margin:0;color:var(--muted);font-size:var(--text-sm);line-height:1.5}
.redact-apply{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;font-size:var(--text-base)}
@media(min-width:900px){
  .redact-layout{grid-template-columns:minmax(0,1fr) 340px;align-items:start}
  .redact-canvas{position:sticky;top:64px}
}
/* Phones: the photo uses the full width of the card for a bigger drawing area. */
@media(max-width:560px){
  .redact-canvas{margin:0 calc(var(--space-5) * -1);padding:var(--space-2) 0;border-left:0;border-right:0;border-radius:0}
  .redact-head h2,.redact-head .panel-title{font-size:var(--text-xl)}
}
@media print{.redact,.redact-entry{display:none!important}}
