:root { --ink:#151A22; --muted:#5A6573; --line:#DDE3EA; --ground:#F4F6F9; --surface:#FFFFFF; --accent:#0A8A94; }
@media (prefers-color-scheme: dark) { :root { --ink:#E5EAF1; --muted:#9AA5B3; --line:#26303C; --ground:#0A0E14; --surface:#121821; --accent:#22D0D7; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--ground); color:var(--ink); font:16px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
main { max-width: 720px; margin: 0 auto; padding: 48px 22px 72px; }
header { display:flex; gap:14px; align-items:center; margin-bottom: 28px; }
.logo { width: 72px; height: 72px; border-radius: 16px; flex: none; box-shadow: 0 6px 18px rgba(10,14,20,.28); }
.store { display:inline-block; margin-top: 6px; font-size: 14px; }
h1 { font-size: 30px; line-height:1.2; margin:0; }
.sub { color:var(--muted); margin:2px 0 0; font-size:15px; }
h2 { font-size: 19px; margin: 32px 0 8px; }
section { background:var(--surface); border:1px solid var(--line); border-radius:14px; padding: 4px 22px 18px; margin-top: 18px; }
a { color: var(--accent); }
.muted { color: var(--muted); font-size: 14px; }

.langs { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:22px; }
.langs button { font:inherit; font-size:14px; padding:5px 12px; border-radius:999px; cursor:pointer;
  border:1px solid var(--line); background:var(--surface); color:var(--ink); }
.langs button[aria-pressed="true"] { background:var(--accent); border-color:var(--accent); color:#fff; }
.langs button:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }