:root { --bg:#FBF6EF; --fg:#2E1F33; --muted:#6B5A6E; --accent:#D9533B; --ok:#2E8B57; --warn:#C98A12; --card:#fff; --line:#eadfd3; }
@media (prefers-color-scheme: dark) { :root { --bg:#1d1520; --fg:#f3ebf4; --muted:#b9a9bb; --card:#2a2030; --line:#3b2f42; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:16px/1.5 system-ui,-apple-system,sans-serif; }
a { color:inherit; }
header.top { display:flex; align-items:center; gap:20px; padding:14px 20px; border-bottom:1px solid var(--line); }
header.top .brand { font-weight:800; font-size:20px; text-decoration:none; }
header.top .brand span { color:var(--accent); }
header.top nav { display:flex; gap:16px; font-size:15px; }
header.top nav a { text-decoration:none; color:var(--muted); }
header.top nav a.on, header.top nav a:hover { color:var(--fg); }
main { max-width:1200px; margin:0 auto; padding:24px 16px 64px; }
h1 { margin:0 0 4px; font-size:30px; }
.lead { color:var(--muted); margin:0 0 24px; max-width:760px; }
.card { background:var(--card); border-radius:16px; box-shadow:0 6px 24px rgba(0,0,0,.08); overflow:hidden; }
.grid { display:grid; gap:18px; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); }
.wcard { text-decoration:none; display:block; }
.wcard img { width:100%; aspect-ratio:16/9; object-fit:cover; display:block; background:#000; }
.wcard .body { padding:14px 16px 16px; }
.wcard h2 { margin:0 0 2px; font-size:20px; }
.meta { color:var(--muted); font-size:14px; }
.pill { display:inline-block; font-size:12px; font-weight:700; padding:2px 9px; border-radius:99px; background:var(--line); color:var(--fg); }
.btn { font:inherit; font-size:14px; border:1px solid var(--line); background:var(--card); color:var(--fg); border-radius:9px; padding:6px 11px; cursor:pointer; }
.btn:hover { border-color:var(--muted); }
.btn.on { background:var(--fg); color:var(--bg); border-color:var(--fg); }
select, input[type=search], textarea { font:inherit; font-size:14px; border:1px solid var(--line); background:var(--card); color:var(--fg); border-radius:9px; padding:6px 10px; }
video { display:block; width:100%; background:#000; }
