@font-face{font-family:"DM Sans";src:url(/fonts/DMSans-Variable.ttf) format("truetype");font-weight:100 1000;font-display:swap}
@font-face{font-family:Manrope;src:url(/fonts/Manrope-Variable.ttf) format("truetype");font-weight:200 800;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(/fonts/IBMPlexMono-Regular.ttf) format("truetype");font-display:swap}
:root{--ink:#14273B;--panel:#1E3550;--cream:#F7F3EA;--mint:#ACDDCD;--lav:#C5BDDF;--amber:#E9C6A6;--grey:#9AA6B8}
*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--cream);font:16px/1.55 "DM Sans",system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
.wrap{max-width:1100px;margin:0 auto;padding:0 20px}
header{background:linear-gradient(180deg,#0f1f30,var(--ink));border-bottom:1px solid #2a4566}
.hd{display:flex;align-items:center;gap:20px;padding:28px 20px}.mark{width:64px}.pip{width:150px;margin-left:auto}
.kicker{font:600 13px/1 "IBM Plex Mono",monospace;letter-spacing:.18em;color:var(--mint);margin:0 0 6px}
h1{font:800 clamp(30px,5vw,48px)/1.05 Manrope,system-ui,sans-serif;margin:0 0 8px}.lede{margin:0;color:#dfe6ee;max-width:560px}
.tools{position:sticky;top:0;z-index:2;background:var(--ink);padding:16px 0;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
#q{flex:1 1 300px;padding:13px 16px;border-radius:12px;border:2px solid #2f4e72;background:var(--panel);color:var(--cream);font-size:16px}
#q:focus{outline:none;border-color:var(--mint)}
select{padding:12px;border-radius:12px;background:var(--panel);color:var(--cream);border:2px solid #2f4e72;font-size:15px}
.chips{display:flex;flex-wrap:wrap;gap:6px}.chips button{background:transparent;color:var(--lav);border:1.5px solid #3a5a80;border-radius:999px;padding:8px 13px;cursor:pointer;font:inherit;font-size:14px}
.chips button.on{background:var(--mint);color:var(--ink);border-color:var(--mint);font-weight:700}
.count{color:var(--grey);font:13px "IBM Plex Mono",monospace;margin:4px 0 14px}
#list{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:16px}
.card{background:var(--panel);border-radius:18px;padding:18px 18px 14px;border:1px solid #2a4566;display:flex;flex-direction:column}
.row{display:flex;justify-content:space-between;align-items:center;gap:8px}
.badge{font:700 12px/1 "IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.06em;padding:7px 10px;border-radius:8px}
.badge.myth{background:#F2B8B0;color:#4a1410}.badge.mixed{background:var(--amber);color:#3d2610}.badge.untested{background:var(--lav);color:#241c45}.badge.true{background:var(--mint);color:#0d3328}
.topic{color:var(--grey);font-size:13px}
.card h2{font:700 19px/1.3 Manrope,system-ui,sans-serif;margin:12px 0 8px}.ex{margin:0 0 10px;color:#e3e9ef}
.safety{margin:0 0 10px;padding:8px 10px;border-left:3px solid var(--amber);background:#26405e;border-radius:6px;font-size:14px}
.meta{margin-top:auto;border-top:1px dashed #3a5a80;padding-top:10px;font:12.5px/1.5 "IBM Plex Mono",monospace;color:var(--lav)}
.src{margin:4px 0 0;padding-left:16px;color:var(--grey)}
.none{text-align:center;color:var(--grey);padding:40px}
.how{margin:40px 0;background:#18304a;border-radius:18px;padding:20px 22px}.how h2{font:700 20px Manrope,sans-serif;margin:0 0 6px}
footer{border-top:1px solid #2a4566;margin-top:30px}.ft{display:flex;gap:18px;align-items:center;padding:24px 20px}
.soc a{color:var(--mint);margin-right:16px;text-decoration:none;font-weight:600;display:inline-block;margin-bottom:4px}.small{color:var(--grey);font-size:13px}
@media(max-width:600px){.pip{width:90px}.mark{display:none}}
.card[hidden]{display:none}
