/* Website Trust Checker (tools/website-trust-checker.html). */

/* One column for this tool: the report is long, so it sits under the form at full
   width instead of in the shared sticky, scrolling side pane. */
.tool-widget[data-tool="website-trust-checker"] .tool-workspace{grid-template-columns:minmax(0,1fr)!important}
.tool-widget[data-tool="website-trust-checker"] .tool-workspace>.tool-calc-result{grid-column:1!important;grid-row:2!important;position:static!important;
    max-height:none!important;overflow:visible!important;padding:0!important;border:0!important;background:transparent!important;margin-top:0!important}
.tool-widget[data-tool="website-trust-checker"] .tool-workspace>.tool-output{grid-column:1!important;grid-row:3!important}
/* Even card rhythm: the form sits flush with the card padding, and the empty
   result pane / status line take no space until there is something to show. */
.tool-widget[data-tool="website-trust-checker"] .tool-workspace{row-gap:16px!important}
.tool-widget[data-tool="website-trust-checker"] .tool-calc-controls>.tool-controls-grid{margin-top:0}
.tool-widget[data-tool="website-trust-checker"] .tool-calc-controls>.tool-buttons{margin-top:12px}
.tool-widget[data-tool="website-trust-checker"] .tool-workspace>.tool-calc-result:has(> #tcOut[hidden]){display:none!important}
.tool-widget[data-tool="website-trust-checker"] .tool-workspace>.tool-output{margin-top:0!important}
.tool-widget[data-tool="website-trust-checker"] .tool-workspace>.tool-output:not(:has(.tool-status:not(:empty))){display:none!important}
.tool-widget[data-tool="website-trust-checker"] .tool-status{margin-top:0}
/* The badge is hidden on this page because the reCAPTCHA notice is shown in the form
   (allowed by Google's reCAPTCHA FAQ); it otherwise covers the bottom-right corner on phones. */
.grecaptcha-badge{visibility:hidden!important}

.tc-hint{font-size:0.8rem;color:var(--ink-muted);margin:var(--s-3,12px) 0 0}
.tc-hint a{color:inherit}
.tc-covers{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0;padding:0;list-style:none}
.tc-covers li{font-size:0.75rem;padding:3px 9px;border-radius:999px;background:var(--surface-sunk);color:var(--ink-soft)}

/* Recent checks */
.tc-recent{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:var(--s-3,12px) 0 0;font-size:0.8rem;color:var(--ink-muted)}
.tc-recent[hidden]{display:none}
.tc-recent button{font:inherit;border:0;cursor:pointer;padding:4px 10px;border-radius:999px;background:var(--surface-sunk);color:var(--ink-soft);display:inline-flex;gap:6px;align-items:center}
.tc-recent button:hover{color:var(--ink)}
.tc-recent .tc-dot{width:7px;height:7px;border-radius:50%;background:var(--c,var(--ink-muted))}
.tc-recent .tc-clear{background:transparent;text-decoration:underline;padding:4px 2px}

/* Report card */
#tcOut{margin-top:var(--s-3,12px)}
.tc-band-low-risk{--c:var(--success)} .tc-band-uncertain{--c:var(--warn)}
.tc-band-suspicious{--c:color-mix(in srgb,var(--warn) 45%,var(--danger))} .tc-band-high-risk{--c:var(--danger)} .tc-band-unknown{--c:var(--ink-muted)}
.tc-card{padding:22px;border-radius:var(--r-card,16px);background:var(--surface-sunk)}
.tc-top{display:flex;align-items:center;gap:20px}
.tc-host{margin:0;color:var(--ink);font-weight:700;font-size:1.05rem;word-break:break-all}
.tc-meta{margin:2px 0 0;font-size:0.8rem;color:var(--ink-muted)}
.tc-level{margin:8px 0 0;font-size:1.6rem;font-weight:800;line-height:1.1;color:var(--c)}
.tc-ring{--p:0;flex:0 0 112px;width:112px;height:112px;border-radius:50%;display:grid;place-items:center;
    background:conic-gradient(var(--c) calc(var(--p)*1%),color-mix(in srgb,var(--c) 16%,transparent) 0)}
.tc-ring>span{width:88px;height:88px;border-radius:50%;background:var(--surface-sunk);display:grid;place-content:center;text-align:center;line-height:1}
.tc-ring strong{font-size:2rem;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
.tc-ring small{display:block;font-size:0.72rem;color:var(--ink-muted);margin-top:3px}
.tc-top .tc-sum{min-width:0;flex:1 1 auto}
.tc-chips{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 0}
.tc-chip{padding:4px 10px;border-radius:999px;font-size:0.78rem;font-weight:600;background:color-mix(in srgb,var(--ink-muted) 14%,transparent);color:var(--ink-soft)}
.tc-chip.risky{background:color-mix(in srgb,var(--danger) 14%,transparent);color:var(--danger)}
.tc-chip.warn{background:color-mix(in srgb,var(--warn) 16%,transparent);color:color-mix(in srgb,var(--warn) 70%,var(--ink))}
.tc-chip.good{background:color-mix(in srgb,var(--success) 14%,transparent);color:color-mix(in srgb,var(--success) 75%,var(--ink))}
.tc-rec{display:flex;align-items:center;gap:10px;margin:16px 0 0;padding:12px 14px;border-radius:var(--r-ctl,10px);background:color-mix(in srgb,var(--c) 12%,transparent);color:var(--ink);font-weight:700}
.tc-rec::before{content:"";flex:0 0 10px;height:10px;border-radius:50%;background:var(--c)}
.tc-factors{margin:14px 0 0}
.tc-factors h3{margin:0 0 6px;font-size:0.9rem;color:var(--ink)}
.tc-factors ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.tc-factors li{position:relative;padding-left:18px;font-size:0.88rem;color:var(--ink-soft)}
.tc-factors li::before{content:"";position:absolute;left:2px;top:.5em;width:8px;height:8px;border-radius:50%;background:var(--warn)}
.tc-factors li.strong::before{background:var(--danger)}
.tc-notes li::before{background:var(--ink-muted)}

/* Scorecard */
.tc-h2{margin:var(--s-5,28px) 0 8px;font-size:1rem;color:var(--ink)}
.tc-h2 small{font-weight:500;color:var(--ink-muted);font-size:0.8rem;margin-left:6px}
.tc-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.tc-tile{font:inherit;text-align:left;border:0;cursor:pointer;padding:12px;border-radius:var(--r-ctl,10px);background:var(--surface-sunk);color:var(--ink);min-width:0;display:flex;flex-direction:column;gap:4px}
.tc-tile:hover{background:color-mix(in srgb,var(--k,var(--ink-muted)) 10%,var(--surface-sunk))}
.tc-tile small{font-size:0.75rem;color:var(--ink-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tc-tile strong{font-size:1.35rem;font-weight:800;font-variant-numeric:tabular-nums;color:var(--k,var(--ink))}
.tc-tile strong span{font-size:0.75rem;color:var(--ink-muted);font-weight:600;margin-left:2px}
.tc-tile .tc-bar{height:5px;border-radius:9px;background:color-mix(in srgb,var(--ink-muted) 16%,transparent);overflow:hidden}
.tc-tile .tc-bar i{display:block;height:100%;border-radius:9px;background:var(--k,var(--ink-muted))}
.tc-tile em{font-style:normal;font-size:0.72rem;color:var(--ink-muted)}
.tc-g-good{--k:var(--success)} .tc-g-ok{--k:var(--warn)} .tc-g-bad{--k:var(--danger)} .tc-g-none{--k:var(--ink-muted)}
.tc-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:8px 0 0}
.tc-fact{padding:12px;border-radius:var(--r-ctl,10px);background:var(--surface-sunk);min-width:0}
.tc-fact small{display:block;font-size:0.72rem;color:var(--ink-muted)}
.tc-fact span{display:block;margin-top:2px;font-weight:600;color:var(--ink);font-size:0.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Panels: reviews, privacy, speed */
.tc-box{margin:8px 0 0;padding:16px;border-radius:var(--r-ctl,10px);background:var(--surface-sunk)}
.tc-box h3{margin:0 0 6px;font-size:0.92rem;color:var(--ink)}
.tc-box p{margin:6px 0 0;font-size:0.86rem;color:var(--ink-soft)}
.tc-stars{color:var(--warn);letter-spacing:1px}
.tc-reviews{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px}
.tc-reviews li{font-size:0.84rem;color:var(--ink-soft);padding:8px 10px;border-radius:8px;background:color-mix(in srgb,var(--danger) 7%,transparent)}
.tc-reviews li b{color:var(--ink);font-weight:600;margin-right:6px}
.tc-links{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0}
.tc-links a{font-size:0.8rem;padding:5px 10px;border-radius:999px;background:var(--surface,#fff);color:var(--ink-soft);text-decoration:none;border:1px solid color-mix(in srgb,var(--ink-muted) 22%,transparent)}
.tc-links a:hover{color:var(--ink);border-color:var(--accent)}
.tc-kv{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 0}
.tc-kv .tc-chip{font-weight:500}
.tc-chip.cat-advertising,.tc-chip.cat-replay,.tc-chip.cat-fingerprint{background:color-mix(in srgb,var(--danger) 11%,transparent);color:color-mix(in srgb,var(--danger) 80%,var(--ink))}
.tc-chip.cat-analytics,.tc-chip.cat-social,.tc-chip.cat-marketing{background:color-mix(in srgb,var(--warn) 14%,transparent);color:color-mix(in srgb,var(--warn) 65%,var(--ink))}
.tc-chip.cat-privacy{background:color-mix(in srgb,var(--success) 13%,transparent);color:color-mix(in srgb,var(--success) 75%,var(--ink))}

/* Sections */
.tc-sec{margin:8px 0 0;border-radius:var(--r-ctl,10px);background:var(--surface-sunk);scroll-margin-top:80px}
.tc-sec>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:10px;padding:12px 14px;font-weight:700;color:var(--ink);font-size:0.95rem}
.tc-sec>summary::-webkit-details-marker{display:none}
.tc-sec>summary::after{content:"";margin-left:8px;width:8px;height:8px;border-right:2px solid var(--ink-muted);border-bottom:2px solid var(--ink-muted);transform:rotate(45deg);transition:transform .15s}
.tc-sec[open]>summary::after{transform:rotate(225deg)}
.tc-sec>summary .tc-sscore{font-size:0.78rem;font-weight:700;color:var(--k);padding:2px 8px;border-radius:999px;background:color-mix(in srgb,var(--k) 14%,transparent)}
.tc-sec>summary .tc-tally{margin-left:auto;display:flex;gap:6px;font-size:0.75rem;font-weight:600}
.tc-tally b{padding:2px 8px;border-radius:999px;background:color-mix(in srgb,var(--k) 16%,transparent);color:var(--k);font-weight:700}
.tc-checks,.tc-recs{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.tc-checks{padding:0 8px 8px}
.tc-checks li{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:start;padding:10px 8px;border-radius:var(--r-ctl,10px)}
.tc-checks li+li{border-top:1px solid color-mix(in srgb,var(--ink-muted) 12%,transparent)}
.tc-ic{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:0.8rem;font-weight:700;background:color-mix(in srgb,var(--k) 16%,transparent);color:var(--k)}
.tc-s-pass{--k:var(--success)} .tc-s-warn{--k:var(--warn)} .tc-s-fail{--k:var(--danger)} .tc-s-unknown,.tc-s-info{--k:var(--ink-muted)}
.tc-name{margin:0;font-weight:600;color:var(--ink);font-size:0.92rem}
.tc-why{margin:2px 0 0;font-size:0.85rem;color:var(--ink-soft);word-break:break-word}
.tc-pts{font-size:0.8rem;color:var(--ink-muted);white-space:nowrap;font-variant-numeric:tabular-nums;padding-top:2px}

/* Google PageSpeed */
.tc-speed-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px;justify-content:space-between}
.tc-seg{display:inline-flex;gap:2px;padding:3px;border-radius:999px;background:var(--surface,#fff)}
.tc-seg button{font:inherit;font-size:0.8rem;font-weight:600;border:0;cursor:pointer;padding:5px 12px;border-radius:999px;background:transparent;color:var(--ink-soft)}
.tc-seg button[aria-pressed="true"]{background:var(--accent);color:#fff}
.tc-gauges{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0 0}
.tc-gauge{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;font-size:0.78rem;color:var(--ink-soft)}
.tc-gauge .tc-ring{--c:var(--k);flex-basis:64px;width:64px;height:64px}
.tc-gauge .tc-ring>span{width:50px;height:50px;background:var(--surface-sunk)}
.tc-gauge .tc-ring strong{font-size:1.1rem}
.tc-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:12px 0 0}
.tc-metric{padding:8px 10px;border-radius:8px;background:var(--surface,#fff);font-size:0.78rem;color:var(--ink-muted);border-left:3px solid var(--k,var(--ink-muted))}
.tc-metric b{display:block;font-size:0.95rem;color:var(--ink);margin-top:2px}
.tc-speed-body{display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:14px;align-items:start}
.tc-shot{width:150px;border-radius:12px;border:1px solid color-mix(in srgb,var(--ink-muted) 25%,transparent);display:block}
.tc-list{margin:8px 0 0;padding-left:18px;font-size:0.84rem;color:var(--ink-soft)}
.tc-list li{margin:2px 0}

.tc-recs{gap:6px;margin:var(--s-4,20px) 0 0}
.tc-recs li{padding:8px 12px 8px 30px;position:relative;font-size:0.88rem;color:var(--ink-soft);border-radius:var(--r-ctl,10px);background:var(--accent-tint)}
.tc-recs li::before{content:"→";position:absolute;left:12px;color:var(--accent)}
.tc-how{margin:8px 0 0;font-size:0.82rem;color:var(--ink-muted)}
.tc-how ul{margin:6px 0 0;padding-left:18px}
.tc-actions{display:flex;flex-wrap:wrap;gap:8px;margin:var(--s-4,20px) 0 0}
.tc-disc{margin:var(--s-3,12px) 0 0;font-size:0.78rem;color:var(--ink-muted)}
.tc-disc a{color:inherit}
.tc-loading{display:flex;align-items:center;gap:12px;padding:20px;border-radius:var(--r-card,16px);background:var(--surface-sunk);color:var(--ink-soft)}
.tc-box .tc-loading{padding:6px 0;background:transparent}
.tc-spin{width:22px;height:22px;flex:0 0 22px;border-radius:50%;border:3px solid color-mix(in srgb,var(--accent) 22%,transparent);border-top-color:var(--accent);animation:tcspin .8s linear infinite}
@keyframes tcspin{to{transform:rotate(360deg)}}

@media (prefers-reduced-motion:reduce){.tc-spin{animation:none}.tc-sec>summary::after{transition:none}}
@media (max-width:760px){
    .tc-facts,.tc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .tc-gauges{grid-template-columns:repeat(2,minmax(0,1fr))}
    .tc-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
    .tc-speed-body{grid-template-columns:minmax(0,1fr)}
    .tc-shot{width:130px}
}
@media (max-width:560px){
    .tc-card{padding:18px}
    .tc-level{font-size:1.35rem}
    .tc-top{gap:16px}
    .tc-top>.tc-ring{flex-basis:92px;width:92px;height:92px}
    .tc-top>.tc-ring>span{width:72px;height:72px}
    .tc-top>.tc-ring strong{font-size:1.65rem}
    .tc-checks li{grid-template-columns:24px 1fr;}
    .tc-pts{grid-column:2;padding:0}
    .tc-sec>summary .tc-tally b:not(.tc-s-fail):not(.tc-s-warn){display:none}
    .tc-actions .tool-btn{flex:1 1 calc(50% - 8px);min-height:44px}
}