:root{--bg:#fbfaf7;--fg:#222;--muted:#666;--card:#fff;--line:#ddd;--accent:#0f6e5f;--warn:#9a3412}
@media (prefers-color-scheme:dark){:root{--bg:#16171a;--fg:#e8e8e8;--muted:#a0a0a0;--card:#1f2024;--line:#33353a;--accent:#5ec8b4;--warn:#fdba74}}
*{box-sizing:border-box}
body{margin:0 auto;max-width:44rem;padding:0 1rem 3rem;background:var(--bg);color:var(--fg);
font:17px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--accent)}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
header{display:flex;flex-wrap:wrap;gap:.5rem 1rem;justify-content:space-between;align-items:baseline;padding:1rem 0 0}
.site{font-weight:700;font-size:1.25rem;text-decoration:none;color:var(--fg)}
header nav a{margin-left:.8rem}
.muted,.meta,footer{color:var(--muted);font-size:.9rem}
.paths{display:grid;gap:1rem;margin:1.5rem 0}
@media (min-width:36rem){.paths{grid-template-columns:1fr 1fr}}
.path{display:block;background:var(--card);border:2px solid var(--accent);border-radius:10px;padding:1rem 1.2rem;text-decoration:none;color:var(--fg)}
.path strong{display:block;font-size:1.25rem;color:var(--accent)}
.card{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:1rem;margin:1rem 0}
.card h3{margin:0 0 .3rem;font-size:1.15rem}
.tag{display:inline-block;border:1px solid var(--line);border-radius:4px;padding:0 .4rem;font-size:.8rem;margin-right:.3rem}
.tag.sponsored{border-color:var(--warn);color:var(--warn);font-weight:700}
.notice{background:var(--card);border-left:4px solid var(--warn);padding:.5rem .8rem;font-size:.95rem}
.cta{display:flex;flex-wrap:wrap;gap:.6rem;margin:1rem 0}
.cta a{display:inline-block;background:var(--accent);color:var(--bg);border-radius:6px;padding:.5rem 1rem;text-decoration:none;font-weight:700}
dl{display:grid;grid-template-columns:max-content 1fr;gap:.3rem 1rem}dt{color:var(--muted)}dd{margin:0;overflow-wrap:anywhere}
.video{aspect-ratio:16/9;width:100%;border:0;border-radius:8px}
footer{margin-top:2.5rem;border-top:1px solid var(--line);padding-top:1rem}
.contact{display:grid;gap:.6rem;max-width:32rem;margin-top:1rem}.contact label{display:grid;gap:.2rem}
.contact input,.contact textarea,.contact button{font:inherit;padding:.4rem}.contact button{justify-self:start}
.contact .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
header nav.langs{flex-basis:100%;text-align:right;font-size:.85rem}
