:root { --bg:#0d1117; --panel:#161b22; --panel2:#1c2330; --line:#2b3544; --fg:#e6edf3; --mut:#9aa7b4; --acc:#3fb950; --acc2:#58a6ff; --warn:#d29922; --radius:12px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--fg); font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; }
a { color:var(--acc2); text-decoration:none; }
a:hover { text-decoration:underline; }
.wrap { max-width:1120px; margin:0 auto; padding:0 18px; }
.site-header { position:sticky; top:0; z-index:20; background:rgba(13,17,23,.92); backdrop-filter:blur(8px); border-bottom:1px solid var(--line); }
.site-header .wrap { display:flex; align-items:center; gap:16px; height:62px; }
.brand { font-weight:700; color:var(--fg); font-size:18px; white-space:nowrap; }
.mainnav { display:flex; gap:16px; margin-left:8px; }
.mainnav a { color:var(--mut); }
.langswitch { margin-left:auto; display:flex; gap:4px; align-items:center; }
.langswitch a,.langswitch .active { padding:4px 8px; border-radius:8px; font-size:18px; }
.langswitch a:hover { background:var(--panel2); text-decoration:none; }
.langswitch .active { background:var(--panel2); cursor:default; }
main { padding:26px 0 40px; }
h1 { font-size:30px; line-height:1.25; margin:.4em 0; }
h2 { font-size:22px; margin:1.6em 0 .6em; padding-bottom:.3em; border-bottom:1px solid var(--line); }
h3 { font-size:17px; margin:1.2em 0 .4em; }
.lead { color:var(--mut); font-size:18px; max-width:820px; }
.intro { max-width:820px; }
.hero { padding:14px 0 6px; }
.hero .cta { display:inline-flex; gap:8px; margin-top:10px; }
.btn { display:inline-block; background:var(--acc); color:#06210e; font-weight:600; padding:9px 16px; border-radius:10px; border:0; cursor:pointer; }
.btn.alt { background:var(--panel2); color:var(--fg); }
.searchbar { margin:18px 0; }
.searchbar input { width:100%; max-width:420px; padding:11px 14px; border-radius:10px; border:1px solid var(--line); background:var(--panel); color:var(--fg); font-size:16px; }
.chips { display:flex; flex-wrap:wrap; gap:8px; margin:14px 0 24px; }
.chips a { background:var(--panel); border:1px solid var(--line); padding:6px 12px; border-radius:999px; color:var(--fg); font-size:14px; }
.chips a:hover { border-color:var(--acc2); text-decoration:none; }
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:18px; }
.card { background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:18px; }
.card .brandtag { color:var(--warn); font-weight:600; font-size:13px; text-transform:uppercase; letter-spacing:.5px; }
.card h3 { margin:.2em 0 .4em; }
.card .cat { display:inline-block; font-size:12px; color:var(--mut); border:1px solid var(--line); padding:1px 8px; border-radius:999px; }
.card .more { display:inline-block; margin-top:10px; font-weight:600; }
.brandblock { scroll-margin-top:80px; }
.code { position:relative; background:#0b1727; border:1px solid var(--line); border-radius:10px; padding:12px 14px; margin:8px 0; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:14px; overflow-x:auto; }
.code pre { margin:0; white-space:pre; }
.copy { position:absolute; top:8px; right:8px; background:var(--panel2); color:var(--mut); border:1px solid var(--line); border-radius:8px; padding:3px 9px; font-size:12px; cursor:pointer; }
.copy:hover { color:var(--fg); }
.codelist { list-style:none; padding:0; margin:10px 0; }
.codelist li { margin:10px 0; }
.codelabel { font-size:13px; color:var(--mut); margin-bottom:2px; }
.model-head { display:grid; grid-template-columns:minmax(0,420px) minmax(0,1fr); gap:26px; align-items:start; }
.gallery-main { background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:10px; }
.gallery-main img { width:100%; height:auto; border-radius:8px; display:block; }
.thumbs { display:flex; gap:8px; margin-top:8px; flex-wrap:wrap; }
.thumbs img { width:64px; height:64px; object-fit:contain; background:#fff; border:1px solid var(--line); border-radius:8px; cursor:pointer; }
.spec-table { width:100%; border-collapse:collapse; margin:14px 0; }
.spec-table th,.spec-table td { text-align:left; padding:9px 12px; border-bottom:1px solid var(--line); vertical-align:top; }
.spec-table th { color:var(--mut); font-weight:600; width:38%; }
.procon { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:14px 0; }
.procon ul { margin:6px 0; padding-left:20px; }
.procon .pro h3 { color:var(--acc); }
.procon .con h3 { color:#f85149; }
.featurelist { padding-left:20px; }
.badges { display:flex; gap:8px; flex-wrap:wrap; margin:10px 0; }
.badge { font-size:12px; border:1px solid var(--line); background:var(--panel); padding:3px 9px; border-radius:999px; color:var(--mut); }
.badge.on { color:var(--acc); border-color:#1d3b25; }
.badge.price { color:#f0b429; border-color:#4a3a12; font-weight:600; }
.card .price { color:#f0b429; font-weight:700; margin:.2em 0; }
.pricenote { color:#6e7b89; font-size:12px; max-width:520px; }
.btn.amazon { background:#ff9900; color:#111; }
.btn.amazon:hover { background:#f08804; }
.card-links { display:flex; flex-wrap:wrap; gap:10px; margin-top:auto; }
.card-links .more { margin-top:0; }
.more.amazon { color:#f0b429; }
.comments { margin-top:40px; border-top:1px solid var(--line); padding-top:10px; }
.comments .cinfo,.comments .cnote { color:var(--mut); font-size:14px; }
.clist { list-style:none; padding:0; }
.clist li { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:12px 14px; margin:10px 0; }
.clist .cmeta { font-size:13px; color:var(--mut); margin-bottom:4px; }
.cform { display:grid; gap:10px; max-width:640px; margin-top:12px; }
.cform label { display:grid; gap:4px; font-size:14px; color:var(--mut); }
.cform input,.cform textarea { padding:10px 12px; border-radius:10px; border:1px solid var(--line); background:var(--panel); color:var(--fg); font:inherit; }
.cform .hp { position:absolute; left:-9999px; }
.cform button { justify-self:start; background:var(--acc); color:#06210e; font-weight:600; padding:9px 18px; border:0; border-radius:10px; cursor:pointer; }
.site-footer { border-top:1px solid var(--line); margin-top:40px; padding:26px 0 40px; color:var(--mut); font-size:14px; }
.site-footer .about { max-width:820px; }
.siblings { display:flex; flex-wrap:wrap; gap:6px 14px; margin:14px 0; }
.siblings strong { color:var(--fg); }
.legal { display:flex; gap:18px; margin:14px 0; }
.disclaimer { color:#6e7b89; font-size:13px; }
.breadcrumb { font-size:14px; color:var(--mut); margin-bottom:8px; }
.breadcrumb a { color:var(--mut); }
.note-box { background:var(--panel2); border-left:3px solid var(--warn); border-radius:8px; padding:10px 14px; margin:16px 0; color:var(--fg); }
.legal-page main { max-width:820px; }
@media (max-width:760px) { .model-head { grid-template-columns:1fr; } .procon { grid-template-columns:1fr; } h1 { font-size:24px; } .mainnav { display:none; } }