/* COA Check (/coa/, 13). The page's own layer; street-lab.css (tokens, the slip, stamps, the
   primary button, copy rows) loads after it and wins where both speak. Paper stays reserved for
   the slip and the primary button; Anton for the H1 alone. */

.coa .coa-top{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:-12px}
.coa .coa-top .sl-h1{min-width:0}
.coa .coa-top .sl-h1:focus{outline:0}
.coa .coa-karl{display:block;width:72px;height:auto;flex-shrink:0}
.coa .coa-for{margin:-8px 0 0;font-family:var(--f-mono);font-size:11px;line-height:1.6;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-muted)}
.coa .coa-for a{color:var(--ink);font-weight:500;text-decoration:underline;text-underline-offset:3px}

/* Empty state: the explainer, the two inputs, the privacy line */
.coa .coa-start{display:flex;flex-direction:column;gap:14px}
.coa .coa-inputs{display:flex;flex-direction:column;gap:10px}
.coa .coa-camera{width:100%;border:0;cursor:pointer;font-family:var(--f-sans);text-align:left}
.coa .coa-upload,.coa .coa-ghost{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:54px;padding:12px 18px;border:1px solid var(--line-strong);border-radius:var(--radius);background:transparent;color:var(--ink);font:600 15px var(--f-sans);text-align:left;cursor:pointer}
.coa .coa-upload:hover,.coa .coa-ghost:hover{border-color:var(--ink)}
.coa .coa-upload svg{flex-shrink:0}
.coa .coa-drop-hint{display:none;margin:0;font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted)}
.coa .coa-file{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.coa .coa-privacy{margin:0;font-size:13px;line-height:1.5;color:var(--ink-body)}
.coa .coa-noscript{margin:0;padding:12px 14px;border:1px solid var(--line-strong);border-radius:var(--radius);font-size:14px;line-height:1.5}
/* Desktop: the two inputs weigh the same, inside a drop zone */
@media (min-width:1024px){
  .coa .coa-inputs{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:18px;border:1px dashed var(--line-strong);border-radius:var(--radius)}
  .coa .coa-inputs.is-over{border-color:var(--ink);background:rgba(245,245,245,.04)}
  .coa .coa-camera{background:transparent;color:var(--ink) !important;border:1px solid var(--line-strong)}
  .coa .coa-camera:hover{background:transparent;border-color:var(--ink)}
  .coa .coa-camera,.coa .coa-upload{min-height:58px;font-size:16px;font-weight:700}
  .coa .coa-drop-hint{display:block;grid-column:1 / -1;text-align:center}
}

/* Pages to read, and pages being read */
.coa .coa-stage,.coa .coa-busy{display:flex;flex-direction:column;gap:12px}
.coa .coa-thumbs{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none}
.coa .coa-thumbs li{position:relative;width:84px;margin:0;padding:0}
.coa .coa-thumbs img{display:block;width:84px;height:108px;object-fit:cover;object-position:top;border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--paper)}
.coa .coa-thumb-n{display:block;margin-top:4px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted)}
.coa .coa-thumb-x{position:absolute;top:-10px;right:-10px;width:44px;height:44px;padding:0;display:flex;align-items:center;justify-content:center;background:transparent;border:0;cursor:pointer;color:var(--ink)}
.coa .coa-thumb-x span{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:var(--bg);border:1px solid var(--line-strong);font:600 14px/1 var(--f-sans)}
.coa .coa-thumb-x:hover span{border-color:var(--ink)}
.coa .coa-thumbs--sent li{width:56px}
.coa .coa-thumbs--sent img{width:56px;height:72px}
.coa .coa-stage-actions{display:flex;flex-direction:column;gap:10px}
.coa .coa-go{width:100%;border:0;cursor:pointer;font-family:var(--f-sans);text-align:left}
.coa .coa-go:disabled{opacity:.55;cursor:progress}
.coa .coa-note{margin:0;font-family:var(--f-mono);font-size:11px;line-height:1.6;letter-spacing:.04em;color:var(--ink-muted)}
.coa .coa-note:empty{display:none}
.coa .coa-turnstile:empty{display:none}
@media (min-width:640px){
  .coa .coa-stage-actions{flex-direction:row;flex-wrap:wrap}
  .coa .coa-stage-actions .coa-go{flex:1 1 100%}
  .coa .coa-stage-actions .coa-ghost{flex:1 1 160px}
}
.coa .coa-bar{position:relative;height:3px;overflow:hidden;background:var(--line);border-radius:2px}
.coa .coa-bar i{position:absolute;top:0;bottom:0;left:-40%;width:40%;background:var(--ink);animation:coa-bar 1.4s ease-in-out infinite}
@keyframes coa-bar{0%{left:-40%}100%{left:100%}}
@media (prefers-reduced-motion:reduce){.coa .coa-bar i{animation:none;left:0;width:100%;opacity:.5}}
.coa .coa-busy-t{margin:0;font-size:14px;line-height:1.5;color:var(--ink-body)}

/* Errors: plain words, one next step */
.coa .coa-error{display:flex;flex-direction:column;gap:10px;padding:16px;border:1px solid var(--line-strong);border-radius:var(--radius)}
.coa .coa-error-title{margin:0;font-size:18px;font-weight:700;line-height:1.3}
.coa .coa-error-title:focus{outline:0}
.coa .coa-error-body{margin:0;font-size:14.5px;line-height:1.5;color:var(--ink-body)}
.coa .coa-error-actions{display:flex;flex-direction:column;gap:10px;margin-top:4px}
.coa .coa-retry{width:100%;border:0;cursor:pointer;font-family:var(--f-sans);text-align:left}

/* The result */
.coa .coa-result{display:flex;flex-direction:column;gap:18px}
.coa .coa-declared{margin:0;font-family:var(--f-mono);font-size:11px;line-height:1.7;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted)}
.coa .coa-declared b{color:var(--ink);font-weight:500}
.coa .coa-declared a{color:var(--ink);text-underline-offset:3px}
.coa .coa-rows{margin:0;list-style:none}
.coa .coa-rows li{margin:0}
.coa .coa-row-text{display:flex;flex-direction:column;gap:2px;min-width:0}
.coa .coa-row-text small{overflow-wrap:anywhere}
.coa .coa-explain{margin:4px 0 0;font-size:12px;line-height:1.45;color:rgba(10,10,10,.62)}
.coa .coa-rows .sl-stamp{align-self:center}
.coa .coa-verify-label{font-family:var(--f-mono);font-size:10.5px !important;letter-spacing:.1em;text-transform:uppercase;color:rgba(10,10,10,.7)}
.coa .coa-id-k{color:rgba(10,10,10,.6);text-transform:uppercase;letter-spacing:.08em}
.coa #coa-id{overflow-wrap:anywhere}
.coa .sl-copy-row > span{min-width:0}
.coa .sl-slip :focus-visible{outline-color:var(--paper-ink)}
.coa .coa-things{display:flex;flex-direction:column}
.coa .coa-things-h{margin:0 0 2px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--caution)}
.coa .coa-things ul{margin:0;padding:0;list-style:none}
.coa .coa-things li{margin:0;padding:10px 0;border-bottom:1px dotted var(--line-strong);font-size:13.5px;line-height:1.45}
.coa .coa-cannot{display:flex;flex-direction:column;gap:6px}
.coa .coa-cannot p:last-child{margin:0;font-size:13px;line-height:1.5;color:rgba(245,245,245,.85)}
.coa .coa-actions{display:flex;gap:8px}
.coa .coa-share,.coa .coa-again{flex:1;min-height:48px;padding:0 12px;border-radius:var(--radius);font:700 14px var(--f-sans);cursor:pointer}
.coa .coa-share{background:var(--ink);color:var(--bg);border:0}
.coa .coa-share:disabled{opacity:.6;cursor:progress}
.coa .coa-again{background:transparent;color:var(--ink);border:1px solid rgba(245,245,245,.35);font-weight:600}
.coa .coa-again:hover{border-color:var(--ink)}

/* Below the tool: documentation only */
.coa .coa-doc{display:flex;flex-direction:column;gap:10px;margin-top:18px;padding-top:22px;border-top:1px solid var(--line)}
.coa .coa-doc-h,.coa .coa-faq-h{margin:0;font-size:20px;font-weight:700;line-height:1.25}
.coa .coa-doc p{margin:0;font-size:14.5px;line-height:1.55;color:var(--ink-body)}
.coa .coa-doc b{color:var(--ink)}
.coa .coa-faq{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.coa .coa-faq-q{border:1px solid var(--line);border-radius:var(--radius);padding:0 12px}
.coa .coa-faq-q summary{display:flex;align-items:center;gap:12px;min-height:48px;padding:8px 0;font-size:14.5px;font-weight:600;line-height:1.35;cursor:pointer;list-style:none}
.coa .coa-faq-q summary::-webkit-details-marker{display:none}
.coa .coa-faq-q summary::after{content:"+";margin-left:auto;font:500 18px var(--f-mono);color:var(--ink-muted)}
.coa .coa-faq-q[open] summary::after{content:"\2212"}
.coa .coa-faq-q p{margin:0 0 12px;font-size:14px;line-height:1.55;color:var(--ink-body)}
@media (min-width:1024px){
  .coa .coa-doc p,.coa .coa-faq-q p{font-size:16px}
  .coa .coa-doc-h,.coa .coa-faq-h{font-size:23px}
  .coa .coa-karl{width:96px}
}

.coa .coa-toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:30;max-width:calc(100% - 40px);margin:0;padding:12px 16px;transform:translateX(-50%);background:var(--bg);color:var(--ink);border:1px solid var(--ink);border-radius:var(--radius);font:600 14px var(--f-sans);box-shadow:0 10px 30px rgba(0,0,0,.6)}
.coa [hidden]{display:none !important}
@media print{
  .coa .coa-start,.coa .coa-stage,.coa .coa-actions,.coa .coa-karl{display:none !important}
}
