:root { --brand:#e8590c; --bg:#fffaf5; --ink:#2b2320; --muted:#8a7a70; --card:#ffffff; }
* { box-sizing:border-box; }
body { margin:0; font-family:Georgia,'Times New Roman',serif; background:var(--bg); color:var(--ink); }
a { color:var(--brand); text-decoration:none; }
main { max-width:1000px; margin:0 auto; padding:1rem; }
.top { display:flex; justify-content:space-between; align-items:center; padding:.8rem 1.2rem; background:#fff; border-bottom:3px solid var(--brand); flex-wrap:wrap; gap:.5rem; }
.logo { font-size:1.5rem; font-weight:bold; color:var(--ink); }
.top nav { display:flex; gap:1rem; align-items:center; flex-wrap:wrap; }
.btn { background:var(--brand); color:#fff !important; padding:.45rem .9rem; border-radius:6px; border:0; font-size:1rem; cursor:pointer; display:inline-block; }
.hero { text-align:center; padding:2rem 1rem; }
.hero h1 { font-size:2rem; margin:.2rem 0; }
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:1rem; }
.card { background:var(--card); border:1px solid #eee0d5; border-radius:10px; padding:1rem; color:var(--ink); position:relative; box-shadow:0 1px 3px rgba(0,0,0,.06); }
.card:hover { border-color:var(--brand); }
.card h3 { margin:.2rem 0; }
.card-flag { font-size:1.6rem; }
.score { position:absolute; top:.7rem; right:.7rem; color:var(--brand); font-weight:bold; }
.muted { color:var(--muted); }
.nations { display:flex; flex-wrap:wrap; gap:.5rem; }
.continent { width:100%; margin:.8rem 0 .2rem; }
.nation { background:#fff; border:1px solid #eee0d5; border-radius:20px; padding:.35rem .8rem; color:var(--ink); }
.crumbs { color:var(--muted); }
.votebar { display:flex; gap:.5rem; align-items:center; margin:1rem 0; flex-wrap:wrap; }
.votebar button { background:#fff; border:1px solid #ddc9ba; border-radius:6px; padding:.4rem .8rem; font-size:1rem; cursor:pointer; }
.video iframe { width:100%; aspect-ratio:16/9; border:0; border-radius:10px; }
.cols { display:grid; grid-template-columns:1fr 2fr; gap:1.5rem; }
@media (max-width:700px){ .cols { grid-template-columns:1fr; } }
.cols ul, .cols ol { padding-left:1.2rem; } .cols li { margin:.4rem 0; }
.history { background:#fff4e8; border-radius:10px; padding:1rem 1.2rem; }
.variant { background:#fff; border:1px solid #eee0d5; border-left:4px solid var(--brand); border-radius:8px; padding:.8rem 1rem; margin:.8rem 0; }
.comment { border-bottom:1px solid #eee0d5; padding:.6rem 0; }
.commentform textarea, .bigform input, .bigform textarea { width:100%; padding:.6rem; border:1px solid #ddc9ba; border-radius:6px; font:inherit; margin:.25rem 0 .8rem; }
.bigform label { display:block; font-weight:bold; }
.err { background:#ffe3e3; border:1px solid #ffb3b3; padding:.6rem 1rem; border-radius:6px; }
.ad-slot { max-width:1000px; margin:1rem auto; padding:1.2rem; text-align:center; background:#f4ece4; border:1px dashed #ccb8a8; border-radius:8px; color:var(--muted); }
.card-img { width:100%; height:150px; object-fit:cover; border-radius:8px; margin-bottom:.4rem; }
.hero-img { width:100%; max-height:380px; object-fit:cover; border-radius:10px; margin:.5rem 0; }
.langsel { border:1px solid #ddc9ba; border-radius:6px; padding:.3rem; font:inherit; background:#fff; }
.langpill { border:1px solid #ddc9ba; border-radius:10px; padding:0 .5rem; font-size:.85rem; }
.langpill.on { background:var(--brand); color:#fff; border-color:var(--brand); }
footer { text-align:center; padding:1.5rem; color:var(--muted); border-top:1px solid #eee0d5; margin-top:1rem; }
