/* ClickCrooks inner pages: sign-up and the report. Same tokens as the front page
   and as CopycatCheck, so the family reads as one hand. */
:root{
  --paper:#ffffff; --paper-2:#f4f7f9; --ink:#0b0c0e; --ink-muted:#4b5158; --hairline:#e2e7ea;
  --good:#0f6b39; --good-soft:#e8f3ec; --ok:#8a6100; --ok-soft:#fbf1dc; --bad:#ad2216; --bad-soft:#fbeae7; --focus:#1a63d8;
  --serif:"Source Serif 4","Iowan Old Style",Georgia,serif; --sans:"Source Sans 3","Segoe UI",Helvetica,Arial,sans-serif; --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;--s9:96px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--paper:#0e1113;--paper-2:#151a1d;--ink:#eef2f4;--ink-muted:#a4adb4;--hairline:#2a3135;--good:#74d29a;--good-soft:#12291d;--ok:#e0bb5c;--ok-soft:#2b2412;--bad:#f0907f;--bad-soft:#2e1512;--focus:#8fb8ff}}
:root[data-theme="dark"]{--paper:#0e1113;--paper-2:#151a1d;--ink:#eef2f4;--ink-muted:#a4adb4;--hairline:#2a3135;--good:#74d29a;--good-soft:#12291d;--ok:#e0bb5c;--ok-soft:#2b2412;--bad:#f0907f;--bad-soft:#2e1512;--focus:#8fb8ff}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper-2);color:var(--ink);font:17px/27px var(--sans);overflow-x:hidden}
a{color:inherit}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.top{background:#0b0c0e;color:#fff}
.top .in{max-width:1000px;margin:0 auto;padding:0 var(--s4);min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:var(--s4)}
.wordmark{font-family:var(--serif);font-size:26px;font-weight:600;letter-spacing:-.01em;text-decoration:none;color:#fff}
.wordmark em{font-style:italic;font-weight:400;color:rgba(255,255,255,.78)}
.top a.ghost{font-size:15px;color:rgba(255,255,255,.85);text-decoration:none;border:1px solid rgba(255,255,255,.5);padding:8px 14px;min-height:44px;display:inline-flex;align-items:center}
.wrap{max-width:1000px;margin:0 auto;padding:var(--s7) var(--s4) var(--s9)}
.eyebrow{font-size:15px;line-height:22px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-muted);margin:0 0 var(--s3)}
h1{font-family:var(--serif);font-weight:600;letter-spacing:-.015em;font-size:clamp(32px,5vw,52px);line-height:1.06;margin:0 0 var(--s4);max-width:20ch}
h2{font-family:var(--serif);font-weight:600;font-size:26px;line-height:1.2;margin:0 0 var(--s3)}
h3{font-family:var(--serif);font-weight:600;font-size:21px;line-height:1.3;margin:0 0 var(--s2)}
p{margin:0 0 var(--s3)}
.lede{font-size:19px;line-height:1.5;color:var(--ink-muted);max-width:60ch;margin:0 0 var(--s6)}
.note{color:var(--ink-muted);font-size:16px;line-height:25px}
.panel{background:var(--paper);border:1px solid var(--hairline);padding:var(--s5);margin-bottom:var(--s4)}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4)}
.fields .full{grid-column:1 / -1}
label{display:block;font-size:15px;line-height:22px;color:var(--ink-muted);margin-bottom:6px}
input[type=text],input[type=email],input[type=number],select,textarea{width:100%;min-height:50px;padding:12px var(--s4);border:1px solid var(--hairline);background:var(--paper);color:var(--ink);font:400 17px/26px var(--sans)}
.check{display:flex;gap:var(--s3);align-items:flex-start;min-height:48px;padding:var(--s2) 0;cursor:pointer;color:var(--ink);font-size:17px}
.check input{width:22px;height:22px;flex:none;margin-top:3px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:12px 24px;font:600 17px/24px var(--sans);text-decoration:none;border:1px solid var(--ink);background:var(--ink);color:var(--paper);cursor:pointer}
.btn:hover{opacity:.88}
.btn.ghost{background:transparent;color:var(--ink)}
.btn:disabled{opacity:.5;cursor:default}
.err{color:var(--bad);font-weight:600}
.code{font-family:var(--mono);font-size:15px;line-height:23px;background:var(--paper-2);border:1px solid var(--hairline);padding:var(--s4);word-break:break-all;margin:var(--s3) 0}
.line{font-family:var(--serif);font-size:clamp(24px,3.4vw,34px);line-height:1.2;font-weight:600;margin:0 0 var(--s3)}
.figs{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:var(--s3);margin:var(--s4) 0}
.fig{border:1px solid var(--hairline);border-top:3px solid var(--ink);padding:var(--s4);background:var(--paper)}
.fig b{display:block;font-family:var(--serif);font-size:34px;line-height:1.05;font-variant-numeric:tabular-nums}
.fig span{color:var(--ink-muted);font-size:15px;line-height:21px}
.fig.good{border-top-color:var(--good)} .fig.good b{color:var(--good)}
.fig.bad{border-top-color:var(--bad)} .fig.bad b{color:var(--bad)}
table{width:100%;border-collapse:collapse;font-size:16px;line-height:24px}
th{text-align:left;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted);padding:8px 12px 8px 0;border-bottom:1px solid var(--ink);font-weight:600}
td{padding:9px 12px 9px 0;border-bottom:1px solid var(--hairline);vertical-align:top;font-variant-numeric:tabular-nums}
.tablewrap{overflow-x:auto}
/* Fourteen days, as bars. Black is real, grey is the rest of the paid visits. No
   colour is needed to read it, and every bar says its numbers in words too. */
.bars{display:grid;grid-template-columns:repeat(14,1fr);gap:4px;align-items:end;height:150px;margin:var(--s4) 0 var(--s2)}
.bars .day{display:flex;flex-direction:column;justify-content:flex-end;height:100%}
.bars .noise{background:var(--hairline)} .bars .real{background:var(--ink)}
.barsx{display:grid;grid-template-columns:repeat(14,1fr);gap:4px;font-size:12px;color:var(--ink-muted);text-align:center}
.foot{color:var(--ink-muted);font-size:15px;line-height:23px;margin-top:var(--s6)}
@media(max-width:640px){.fields{grid-template-columns:1fr}.panel{padding:var(--s4)}.bars{height:110px}}