@font-face{font-family:Inter;font-weight:900;src:url(assets/inter-black-v1.woff2) format("woff2");font-display:optional}
@font-face{font-family:Inter;font-weight:700;src:url(assets/inter-bold-v1.woff2) format("woff2");font-display:optional}
@font-face{font-family:Inter;font-weight:400;src:url(assets/inter-regular-v1.woff2) format("woff2");font-display:optional}
/* Fonts are preloaded and "optional": if Inter isn't ready by first paint (slow connection), the page keeps the stand-in
   below for that visit instead of swapping mid-read, so nothing jumps. The stand-in is sized to Inter's measurements. */
@font-face{font-family:"Inter Fallback";font-weight:400;src:local("Arial"),local("ArialMT"),local("Liberation Sans"),local("Arimo");size-adjust:106.37%;ascent-override:91.08%;descent-override:22.68%;line-gap-override:0%}
@font-face{font-family:"Inter Fallback";font-weight:700;src:local("Arial Bold"),local("Arial-BoldMT"),local("Liberation Sans Bold"),local("Arimo Bold");size-adjust:100.51%;ascent-override:96.38%;descent-override:24%;line-gap-override:0%}
@font-face{font-family:"Inter Fallback";font-weight:900;src:local("Arial Bold"),local("Arial-BoldMT"),local("Liberation Sans Bold"),local("Arimo Bold");size-adjust:101.49%;ascent-override:95.45%;descent-override:23.77%;line-gap-override:0%}
:root{--ink:#0d0d0d;--muted:#5b5b5b;--soft:#8a8a8a;--line:#ececec;--panel:#f7f7f8;--navy:#0a1222;--cyan:#5ae6ff;--red:#ff3b3b;--red2:#d32f2f;--green:#34c759;--link:#0a7ea0}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,"Inter Fallback",system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased;line-height:1.55}
a{color:inherit;text-decoration:none}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
/* logo: the same wordmark as the channel banner */
.logo{font-weight:900;font-size:20px;letter-spacing:.5px;line-height:1}.logo span{color:var(--red)}
.nav{display:flex;align-items:center;padding:22px 0}
.nav .links{margin-left:auto;display:flex;gap:28px;font-size:15px;color:var(--muted)}
.nav .links a:hover{color:var(--ink)}
.pill{display:inline-block;padding:12px 22px;border-radius:999px;font-weight:700;font-size:15px}
.pill.dark{background:var(--ink);color:#fff}.pill.line{border:1px solid #d6d6d6}
.btns{display:flex;flex-wrap:wrap;gap:12px}
/* hero */
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;padding:56px 0 80px}
h1{font-size:clamp(38px,5.5vw,60px);line-height:1.04;letter-spacing:-1.6px;margin:0 0 18px;font-weight:900}
.sub{font-size:19px;color:var(--muted);margin:0 0 30px;max-width:520px}
.phone{width:290px;aspect-ratio:9/19;border-radius:42px;border:10px solid #111;background:#f8f9fb url(assets/phone-bg-white-2.jpg) center top/cover;position:relative;overflow:hidden;box-shadow:0 30px 60px rgba(0,0,0,.18);justify-self:center}
.phone .flag{position:absolute;left:50%;transform:translateX(-50%);top:22%;background:var(--red2);color:#fff;border-radius:999px;padding:7px 14px;font-weight:900;font-size:12px;white-space:nowrap}
.phone .bubble{position:absolute;left:16px;right:16px;top:36%;background:#fff;color:#111;border:2px solid var(--red2);border-radius:18px;padding:12px 14px;font-size:13px;line-height:1.4;box-shadow:0 10px 24px rgba(211,47,47,.16)}
.phone .cap{position:absolute;bottom:22%;left:0;right:0;text-align:center;color:var(--ink);font-weight:900;font-size:21px}.phone .cap i{font-style:normal;text-decoration:underline;text-decoration-color:var(--red2);text-decoration-thickness:3px;text-underline-offset:5px}
/* sections */
.band{background:var(--panel)}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:32px;padding:64px 24px}
.steps h3{margin:0 0 6px;font-size:18px}.steps p{margin:0;color:var(--muted)}
.dot{width:10px;height:10px;border-radius:50%;display:inline-block;margin-right:10px;vertical-align:1px}
section{padding:72px 0 0}
h2{font-size:28px;letter-spacing:-.5px;margin:0 0 6px;font-weight:900}
.lead{color:var(--muted);margin:0 0 24px}
.row{display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-top:1px solid var(--line);font-size:17px}
.row span{color:var(--soft);white-space:nowrap}
.about p{max-width:720px}.fine{color:var(--soft);font-size:14px}
footer{margin-top:80px;border-top:1px solid var(--line);padding:28px 0 48px;color:var(--soft);font-size:14px;display:flex;flex-wrap:wrap;gap:20px}
footer a:hover{color:var(--ink)}
/* policy pages */
.doc{max-width:720px;padding:40px 0 0}
.doc h1{font-size:clamp(26px,3.4vw,34px);letter-spacing:-.6px;margin-bottom:4px}
.doc h2{font-size:21px;margin-top:32px}
.doc a{color:var(--link);text-decoration:underline}
.muted{color:var(--soft);font-size:15px}
@media(max-width:800px){.hero{grid-template-columns:1fr;text-align:center;padding-top:32px}.sub{margin-left:auto;margin-right:auto}.btns{justify-content:center}.nav .links{gap:18px}}

/* Watch on menu */
.nav .links{align-items:center}
details.watch{position:relative}
details.watch summary{list-style:none;cursor:pointer;padding:8px 16px;border-radius:999px;background:var(--ink);color:#fff;font-weight:700;font-size:14px}
details.watch summary::-webkit-details-marker{display:none}
details.watch summary::after{content:" ▾";font-size:11px}
details.watch .menu{position:absolute;right:0;top:calc(100% + 8px);background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,.1);padding:6px;min-width:180px;z-index:10}
details.watch .menu a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;color:var(--ink)}
details.watch .menu a:hover{background:var(--panel)}
svg{width:18px;height:18px;fill:currentColor;flex:none}
[aria-current=page]{color:var(--ink);font-weight:700}
/* cards */
.sechead{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.more{font-weight:700;font-size:15px;margin-bottom:24px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:24px}
.vcard{display:block}
.vcard .thumb{aspect-ratio:1/1;border-radius:16px;background:var(--panel) center/cover;border:1px solid var(--line);transition:transform .15s}
.vcard:hover .thumb{transform:translateY(-3px)}
.vcard h3{font-size:17px;margin:14px 0 4px;line-height:1.3}
.vcard p{margin:12px 0 0;color:var(--muted);font-size:15px}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.tags span{font-size:12px;color:var(--muted);background:var(--panel);border-radius:999px;padding:3px 10px}
.fine a{text-decoration:underline}
/* scams + about pages */
.top{padding-top:32px}
.pageh{font-size:clamp(26px,3.4vw,34px);letter-spacing:-.6px;margin:0 0 8px}
.filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:8px 0 12px}
.filters label{font-size:13px;color:var(--soft);font-weight:700;display:flex;flex-direction:column;gap:6px}
.filters select{font:inherit;font-size:15px;color:var(--ink);font-weight:400;padding:10px 12px;border:1px solid #d6d6d6;border-radius:12px;background:#fff}
.count{color:var(--soft);font-size:14px;margin:0 0 16px}
.about{max-width:720px}.about p{font-size:18px}.about .big{font-size:20px;font-weight:700;line-height:1.4}@media(max-width:800px){.about p{font-size:17px}.about .big{font-size:18px}}
.about h2{font-size:22px;margin-top:40px}.about a{color:var(--link);text-decoration:underline}
/* footer */
footer{flex-direction:column;gap:14px}
.social{display:flex;gap:16px}.social a{color:var(--muted)}.social a:hover{color:var(--ink)}.social svg{width:22px;height:22px}
.flinks{display:flex;flex-wrap:wrap;gap:20px}
@media(max-width:480px){.nav .links{gap:14px;font-size:14px}details.watch summary{padding:7px 12px}}

#latest{grid-template-columns:repeat(3,1fr)}#latest>p{grid-column:1/-1}
@media(max-width:800px){#latest{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:24px;gap:16px;margin:0 -24px;padding:0 24px 8px}#latest .vcard{flex:0 0 68%;scroll-snap-align:start}}

/* Scams page: sticky tap-to-pick filter sidebar */
.cards>p{grid-column:1/-1}
.browse{display:grid;grid-template-columns:240px 1fr;gap:40px;align-items:start}
.side{position:sticky;top:24px}
.side h3{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--soft);margin:0 0 10px}
.pills{display:flex;flex-direction:column;gap:2px;margin:0 0 22px}
.pills button{font:inherit;font-size:15px;text-align:left;border:0;background:none;padding:7px 12px;border-radius:10px;color:var(--ink);cursor:pointer}
.pills button:hover{background:var(--panel)}
.pills button[aria-pressed=true]{background:var(--ink);color:#fff;font-weight:700}
.side .reset{font:inherit;font-size:14px;border:0;background:none;color:var(--link);padding:0;cursor:pointer}
.browse .cards{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
@media(max-width:800px){.browse{grid-template-columns:1fr;gap:16px}.side{position:static}
.pills{flex-direction:row;overflow-x:auto;gap:6px;margin:0 -24px 12px;padding:0 24px}.pills button{flex:none;border:1px solid var(--line);border-radius:99px;padding:7px 14px}.side h3{margin:0 0 8px}}
.browse>*{min-width:0}

/* Sticky header: stays at the top while you scroll; a hairline and soft shadow appear once the page moves */
.site-head{position:sticky;top:0;z-index:50;background:#fff;transition:box-shadow .2s,border-color .2s;border-bottom:1px solid transparent}
.site-head.scrolled{border-bottom-color:var(--line);box-shadow:0 4px 18px rgba(15,15,20,.06)}
.site-head .nav{padding:16px 0}
.side{top:100px}
@media(max-width:600px){.cards,.browse .cards{grid-template-columns:1fr 1fr;gap:14px}.vcard h3{font-size:15px}.vcard p{font-size:13px}}

/* Home on phones: a lone Short sits in the middle; more than one still starts at the left so the swipe row reads */
@media(max-width:800px){#latest .vcard:first-child{margin-left:auto}#latest .vcard:last-child{margin-right:auto}}

/* Scams page on phones: slim sticky bar under the header; choices open in a bottom sheet */
.mbar,.sheet,.sheet-bg{display:none}
@media(max-width:800px){
.browse .side{display:none}
.mbar{display:flex;align-items:center;gap:8px;position:sticky;top:var(--headh,64px);z-index:20;background:#fff;margin:0 -24px 14px;padding:10px 24px;border-bottom:1px solid var(--line)}
.mcount{margin-right:auto;font-size:15px;color:var(--muted)}
.mbar .chip{display:inline-flex;align-items:center;gap:6px;flex:none;font:inherit;font-size:15px;font-weight:600;color:var(--ink);background:#fff;border:1px solid #dcdcdf;border-radius:99px;padding:8px 14px;cursor:pointer}
.mbar .chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.browse .count{display:none}
.sheet-bg:not([hidden]){display:block;position:fixed;inset:0;background:rgba(10,10,15,.38);z-index:90}
.sheet:not([hidden]){display:block;position:fixed;left:0;right:0;bottom:0;z-index:91;background:#fff;border-radius:20px 20px 0 0;padding:8px 20px calc(20px + env(safe-area-inset-bottom));max-height:85vh;overflow:auto;box-shadow:0 -10px 40px rgba(0,0,0,.15)}
.sheet .grab{width:40px;height:5px;border-radius:9px;background:#ddd;margin:4px auto 14px}
.sheet h2{font-size:20px;margin:0 0 10px}
.sheet h3{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--soft);margin:18px 0 10px}
.sh-head{display:flex;justify-content:space-between;align-items:baseline}
.sheet .link{font:inherit;font-size:15px;border:0;background:none;color:var(--link);padding:0;cursor:pointer}
.rows{display:flex;flex-direction:column}
.rows button{display:flex;justify-content:space-between;align-items:center;font:inherit;font-size:17px;text-align:left;border:0;border-bottom:1px solid var(--line);background:none;padding:15px 2px;color:var(--ink);cursor:pointer}
.rows button[aria-pressed=true]{font-weight:700}
.wrapchips{display:flex;flex-wrap:wrap;gap:8px}
.wrapchips button{font:inherit;font-size:15px;border:1px solid #dcdcdf;background:#fff;border-radius:99px;padding:8px 14px;color:var(--ink);cursor:pointer}
.wrapchips button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff;font-weight:700}
.sheet .show{display:block;width:100%;margin:24px 0 0;font:inherit;font-size:16px;font-weight:700;border:0;border-radius:14px;padding:15px;background:var(--ink);color:#fff;cursor:pointer}
body.noscroll{overflow:hidden}}

/* Selected filter choices: soft gray highlight instead of solid black (picked 2026-10-05) */
.pills button[aria-pressed=true],.wrapchips button[aria-pressed=true],.mbar .chip.on{background:#eef0f3;border-color:#eef0f3;color:var(--ink);font-weight:600}.sheet .show{background:#2b2d31}