/* Verification report styling. Shared by the public standalone page and
   the signed-in view, so the two cannot drift apart. */
:root{
      --primary:#e04502; --primary-dark:#b53700;
      --ink:#0a0a0a; --ink-2:#171717; --muted:#525252; --muted-2:#6b7280;
      --bg:#fafafa; --border:#ededed; --border-2:#e5e5e5;
      --pass:#15803d; --pass-bg:#f0fdf4; --pass-line:#bbf7d0;
      --fail:#b91c1c; --fail-bg:#fef2f2; --fail-line:#fecaca;
      --warn:#92400e; --warn-bg:#fffbeb; --warn-line:#fde68a;
    }
    *{box-sizing:border-box; margin:0; padding:0}
    body{
      font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
      background:var(--bg); color:var(--ink); line-height:1.6;
      -webkit-font-smoothing:antialiased;
    }
    a{color:var(--primary); font-weight:600; text-decoration:none}
    a:hover{text-decoration:underline}
    .wrap{max-width:780px; margin:0 auto; padding:0 24px}

    header{background:#fff; border-bottom:1px solid var(--border); padding:16px 0}
    header .row{display:flex; align-items:center; justify-content:space-between; gap:16px}
    .brand{display:flex; align-items:center; gap:10px; font-weight:800; font-size:17px; letter-spacing:-.4px; color:var(--ink)}
    .brand .mark{width:28px; height:28px; border-radius:8px; background:var(--primary); overflow:hidden; flex-shrink:0}
    .brand .mark img{width:100%; height:100%; object-fit:cover; display:block}
    header .row > a{font-size:13.5px; color:var(--muted)}

    .intro{padding:44px 0 30px}
    .intro h1{font-size:clamp(26px,4vw,34px); font-weight:800; letter-spacing:-1px; line-height:1.15; margin-bottom:10px}
    .intro p{color:var(--muted); font-size:15.5px; max-width:60ch}

    .card{
      background:#fff; border:1px solid var(--border); border-radius:14px;
      padding:24px; margin-bottom:20px;
    }
    .card h2{font-size:15px; font-weight:700; margin-bottom:14px; letter-spacing:-.2px}

    label.fl{display:block; font-size:12px; font-weight:600; color:var(--ink-2); margin-bottom:6px}
    input[type=text], input[type=file]{
      width:100%; padding:12px 13px; border:1px solid var(--border-2);
      border-radius:10px; font-size:14px; font-family:inherit; background:#fff;
    }
    input[type=text]:focus{outline:none; border-color:var(--ink); box-shadow:0 0 0 3px rgba(0,0,0,.06)}
    .hint{font-size:12px; color:var(--muted-2); margin-top:6px; line-height:1.5}
    .or{display:flex; align-items:center; gap:12px; margin:18px 0; color:var(--muted-2); font-size:12px}
    .or::before,.or::after{content:''; flex:1; height:1px; background:var(--border)}
    button.go{
      margin-top:18px; width:100%; padding:13px; border:none; border-radius:10px;
      background:var(--primary); color:#fff; font-weight:600; font-size:14.5px;
      font-family:inherit; cursor:pointer;
    }
    button.go:hover{background:var(--primary-dark)}

    /* ── Verdict ─────────────────────────────────────────── */
    .verdict{
      border-radius:14px; padding:22px 24px; margin-bottom:20px;
      border:1px solid; display:flex; gap:16px; align-items:flex-start;
    }
    .verdict.pass{background:var(--pass-bg); border-color:var(--pass-line)}
    .verdict.fail{background:var(--fail-bg); border-color:var(--fail-line)}
    .verdict.warn{background:var(--warn-bg); border-color:var(--warn-line)}
    .verdict .icon{width:34px; height:34px; border-radius:50%; flex-shrink:0; display:grid; place-items:center; color:#fff}
    .verdict.pass .icon{background:var(--pass)}
    .verdict.fail .icon{background:var(--fail)}
    .verdict.warn .icon{background:var(--warn)}
    .verdict h2{font-size:17px; font-weight:700; letter-spacing:-.3px; margin-bottom:5px}
    .verdict.pass h2{color:var(--pass)}
    .verdict.fail h2{color:var(--fail)}
    .verdict.warn h2{color:var(--warn)}
    .verdict p{font-size:14px; line-height:1.6; color:var(--ink-2)}
    .verdict p + p{margin-top:8px}

    /* ── Detail rows ─────────────────────────────────────── */
    .rows{display:grid; gap:0}
    .row{
      display:grid; grid-template-columns:minmax(0,150px) minmax(0,1fr);
      gap:6px 18px; padding:11px 0; border-top:1px solid var(--border);
      font-size:13.5px; align-items:baseline;
    }
    .row:first-child{border-top:none}
    .row .k{color:var(--muted-2); font-weight:500}
    .row .v{color:var(--ink-2); min-width:0; overflow-wrap:anywhere}
    .mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12px}

    .signer{padding:14px 0; border-top:1px solid var(--border)}
    .signer:first-of-type{border-top:none}
    .signer .top{display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; align-items:baseline}
    .signer .nm{font-weight:600; font-size:14px}
    .signer .st{font-size:12px; font-weight:600; display:inline-flex; align-items:center; gap:6px; color:var(--muted)}
    .signer .st::before{content:''; width:7px; height:7px; border-radius:50%; background:var(--muted-2)}
    .signer .st.signed{color:var(--pass)}
    .signer .st.signed::before{background:var(--pass)}
    .signer .meta{font-size:12.5px; color:var(--muted); margin-top:3px}
    .signer .assurance{
      display:inline-block; margin-top:7px; font-size:11.5px; font-weight:600;
      padding:2px 8px; border-radius:5px; background:var(--bg);
      border:1px solid var(--border-2); color:var(--muted);
    }
    .signer .assurance.strong{background:var(--pass-bg); border-color:var(--pass-line); color:var(--pass)}

    .timeline{list-style:none; margin:0; padding:0}
    .timeline li{
      display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 16px;
      padding:9px 0; border-top:1px solid var(--border); font-size:13.5px;
      align-items:baseline;
    }
    .timeline li:first-child{border-top:none}
    .timeline .when{color:var(--muted-2); font-size:12.5px; white-space:nowrap; font-variant-numeric:tabular-nums}
    .timeline .who{color:var(--muted-2); font-size:12.5px}

    details.raw{margin-top:16px}
    details.raw summary{cursor:pointer; font-size:13px; font-weight:600; color:var(--muted)}
    details.raw summary:hover{color:var(--ink)}
    details.raw pre{
      margin-top:12px; padding:14px; background:var(--bg); border:1px solid var(--border);
      border-radius:9px; overflow-x:auto; font-size:11.5px; line-height:1.7;
      font-family:ui-monospace,SFMono-Regular,Menlo,monospace; color:var(--ink-2);
    }
    .alert{
      padding:12px 15px; border-radius:10px; font-size:13.5px; margin-bottom:18px;
      background:var(--fail-bg); color:var(--fail); border:1px solid var(--fail-line);
    }
    footer{border-top:1px solid var(--border); background:#fff; margin-top:40px; padding:22px 0 34px}
    footer p{font-size:12.5px; color:var(--muted-2)}
    @media (max-width:560px){
      .row{grid-template-columns:1fr; gap:2px}
      .timeline li{grid-template-columns:1fr}
    }

/* Shown only in the signed-in view: the page's whole point is that it works
   without an account, so the shareable URL belongs where the sender can see
   and copy it. */
.verify-share{
  margin-top:26px; padding-top:18px; border-top:1px solid var(--line, #e8e9ed);
  font-size:13px; color:var(--text-2, #6b7280);
}
.verify-share a{font-weight:600}