:root{--fg:#1d1b20;--muted:#5d5a63;--bg:#faf9f7;--card:#fff;--line:#e4e1dc;--accent:#3b3a8f}
@media(prefers-color-scheme:dark){:root{--fg:#ece9f1;--muted:#a9a5b3;--bg:#17161a;--card:#201f25;--line:#34323b;--accent:#a5a3ff}}
*{box-sizing:border-box}
body{margin:0;font:17px/1.6 system-ui,sans-serif;color:var(--fg);background:var(--bg)}
a{color:var(--accent)}
header,main,footer{max-width:46rem;margin:0 auto;padding:1rem 1.25rem}
header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem}
header .brand{font-weight:700;font-size:1.25rem;text-decoration:none;color:var(--fg)}
nav a{margin-left:1rem}
h1{font-size:2.4rem;line-height:1.15}
h2{margin-top:2.25rem}
.sub{font-size:1.2rem;color:var(--muted)}
.btn{display:inline-block;padding:.6rem 1.2rem;border-radius:.5rem;background:var(--accent);color:var(--bg);text-decoration:none;font-weight:600}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:.75rem;padding:1rem 1.25rem}
table{border-collapse:collapse;width:100%;font-size:.95rem;display:block;overflow-x:auto}
td,th{border:1px solid var(--line);padding:.4rem .6rem;text-align:left;vertical-align:top}
form.feedback{margin-top:2rem;border-top:1px solid var(--line);padding-top:1rem}
form.feedback label{display:block;margin:.6rem 0 .2rem;font-size:.9rem}
form.feedback select,form.feedback textarea,form.feedback input[type=email]{width:100%;font:inherit;padding:.4rem;color:var(--fg);background:var(--card);border:1px solid var(--line);border-radius:.4rem}
.hp{position:absolute;left:-9999px}
footer{color:var(--muted);font-size:.9rem;border-top:1px solid var(--line);margin-top:3rem}
footer a{margin-right:1rem}
