/* "Prove it's yours" (public/js/prove.js): the four ways to prove a site, used on the deep check page and in the report's
   certificate panel. prove.js adds this stylesheet itself when a page has not linked it. */

.prove-lead{margin:0 0 12px;color:var(--text-2)}
.prove > .notice:first-child{margin:0 0 12px}
.ways{display:grid;gap:8px}
.way{border:1px solid var(--line);border-radius:14px;background:#F7F9FB;min-width:0}
.way[open]{background:#fff;border:1.5px solid var(--ink)}
.way > summary{list-style:none;display:flex;align-items:center;gap:12px;min-height:58px;padding:10px 14px;cursor:pointer;border-radius:14px}
.way > summary::-webkit-details-marker{display:none}
.way > summary::after{content:"";flex:none;margin-inline-start:auto;width:9px;height:9px;border-right:2px solid var(--text-2);border-bottom:2px solid var(--text-2);transform:rotate(45deg) translate(-2px,-2px);transition:transform .15s}
.way[open] > summary::after{transform:rotate(-135deg) translate(-2px,-2px)}
.way > summary:focus-visible{box-shadow:var(--focus);outline:none}
.way-n{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;font:700 13px/1 var(--font-sans)}
.way-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.way-name{font:700 16.5px/1.25 var(--font-sans);color:var(--ink)}
.way-effort{font:500 12.5px/1.35 var(--font-mono);color:var(--muted)}
.way-body{padding:2px 16px 16px;min-width:0}
.way-body > p{margin:0 0 10px;color:var(--text-2)}
.way-body > .fine{font-size:14px}
.way-k{margin:14px 0 8px !important;font:500 12px/1.3 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted) !important}
.way-note{margin:10px 0 0}
.jp .way .prove-ai{margin:0;padding:2px 16px 16px;border:0;border-radius:0;background:transparent}
.way .prove-steps li{font-size:16px}
.addr-list{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.addr{min-height:46px;padding:0 16px;border:1px solid #C9D1DC;border-radius:999px;background:#fff;color:var(--ink);font:600 14.5px/1 var(--font-mono);cursor:pointer;max-width:100%;overflow-wrap:anywhere;text-align:start;display:inline-flex;align-items:center;gap:8px}
.addr:hover{border-color:var(--ink)}
.addr:focus-visible{box-shadow:var(--focus);outline:none}
.addr:disabled{opacity:.6;cursor:default}
.email-sent p{margin:0}
.email-sent p + p{margin-top:4px}
.email-sent b{color:var(--ink);overflow-wrap:anywhere}
.dns-rec{display:grid;gap:6px;margin:4px 0 8px}
.dns-row{display:grid;grid-template-columns:72px minmax(0,1fr);gap:10px;align-items:center}
.dns-k{font-weight:600;font-size:15px;color:var(--ink)}
.dns-row .copybox{margin:0;align-items:center}
.dns-row .copybox pre{padding:9px 12px}
.dns-row .copybox .btn{align-self:center}
.dns-how{margin:6px 0 8px}
.dns-how > summary,.dns-provider > summary{cursor:pointer;min-height:44px;display:inline-flex;align-items:center;font-weight:600;color:var(--text-2);text-decoration:underline;text-underline-offset:4px}
.dns-providers{display:grid;gap:2px;padding-inline-start:4px;border-inline-start:2px solid var(--line);margin:2px 0 6px}
.dns-provider{padding-inline-start:10px}
.dns-provider > summary{text-decoration:none;color:var(--ink)}
.dns-provider[open] > summary{text-decoration:underline}
.dns-provider ol{margin:0 0 10px;padding-inline-start:22px;display:grid;gap:4px;font-size:15px;color:var(--text-2)}
.prove .verify-row{margin-top:14px}
.prove-seen:empty{display:none}
.prove-seen{margin-top:12px;padding:12px 14px;border-radius:12px;background:#F7F9FB;border:1px solid var(--line)}
.prove-seen-k{margin:0 0 6px;font:500 12px/1.3 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.prove-seen-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.prove-seen-list li{display:flex;flex-wrap:wrap;gap:2px 10px;font-size:15px}
.prove-seen-w{font-weight:600;color:var(--ink)}
.prove-seen-s{color:var(--text-2)}
.prove-seen-list li[data-ok="true"] .prove-seen-s{color:var(--go-btn);font-weight:600}
.prove-seen-n{flex-basis:100%;font:400 12.5px/1.45 var(--font-mono);color:var(--muted);overflow-wrap:anywhere}
.proven{display:grid;gap:4px}
.proven p{margin:0}
.proven-t{display:flex;align-items:center;gap:10px;font-size:17px;color:var(--ink)}
.proven-t b{overflow-wrap:anywhere}
.proven-tick{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--pass-bg);border:1px solid var(--pass-line);color:var(--go-btn);font-weight:800;font-size:14px}
.proven-how{padding-inline-start:34px;font:500 13.5px/1.4 var(--font-mono);color:var(--muted)}
.proven .fine{padding-inline-start:34px;font-size:14px}

@media (max-width:560px){
  .way-body,.jp .way .prove-ai{padding:2px 12px 14px}
  .way > summary{padding:10px 12px}
  .dns-row{grid-template-columns:minmax(0,1fr);gap:2px}
  .dns-row .copybox{flex-direction:row}
  .addr{width:100%;justify-content:flex-start}
  .proven-how,.proven .fine{padding-inline-start:0}
}

@media screen{
html[data-theme="night"] .way{background:#0E1626;border-color:#2A3854}
html[data-theme="night"] .way[open]{background:#15213A;border-color:#F4F6F9}
html[data-theme="night"] .way-n{background:#F4F6F9;color:#121A2A}
html[data-theme="night"] .addr{background:transparent;border-color:#4A5C80;color:#F4F6F9}
html[data-theme="night"] .addr:hover{border-color:#F4F6F9}
html[data-theme="night"] .prove-seen{background:#0E1626;border-color:#2A3854}
html[data-theme="night"] .prove-seen-list li[data-ok="true"] .prove-seen-s{color:#3DD68C}
html[data-theme="night"] .dns-row .copybox pre{background:#0B1220;border-color:#2A3854}
html[data-theme="night"] .proven-tick{color:#3DD68C}
html[data-theme="night"] .jp .way .prove-ai{background:transparent;border:0}
}
