/* Tokens (colores, tipografía, pesos): tokens.css, cargado antes que este archivo. */
:root { padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px); }
*,*::before,*::after { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font:400 1rem/1.65 var(--body); -webkit-font-smoothing:antialiased; }
.wrap { max-width:760px; margin-inline:auto; padding-left:max(16px, env(safe-area-inset-left, 0px)); padding-right:max(16px, env(safe-area-inset-right, 0px)); }
header { border-bottom:1px solid var(--line); }
header .wrap { max-width:1120px; padding-block:14px; display:flex; justify-content:space-between; align-items:center; gap:16px; }
header a { color:var(--ink); text-decoration:none; }
.logo { height:40px; width:auto; display:block; }
@media (max-width: 560px) { .logo { height:32px; } }
.back { font-size:.9rem; color:var(--muted); }
main .wrap { padding-block:48px 72px; display:grid; gap:20px; }
h1 { font:600 clamp(2rem,4.4vw,2.8rem)/1.05 var(--display); letter-spacing:var(--display-tracking); margin:0; text-wrap:balance; }
h2 { font:600 1.3rem/1.15 var(--display); letter-spacing:var(--display-tracking); margin:16px 0 0; }
p, ul, dl { margin:0; }
ul { padding-left:1.2em; display:grid; gap:6px; }
.label { font:500 .75rem/1.2 var(--mono); text-transform:uppercase; letter-spacing:var(--label-tracking); color:var(--muted); }
dl { display:grid; grid-template-columns:minmax(0,200px) minmax(0,1fr); border-top:1px solid var(--line); }
dt, dd { padding:10px 0; border-bottom:1px solid var(--line); margin:0; }
dt { color:var(--muted); padding-right:16px; }
@media (max-width:520px) { dl { grid-template-columns:minmax(0,1fr); } dt { border-bottom:0; padding-bottom:0; } }
.pending { color:var(--warn); background:var(--warn-bg); padding:1px 6px; font-weight:600; }
a { color:var(--accent); }
a:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
footer .wrap { max-width:1120px; border-top:1px solid var(--line); padding-block:24px; font-size:.85rem; color:var(--muted); display:flex; flex-wrap:wrap; gap:12px 20px; justify-content:space-between; }
footer nav { display:flex; gap:16px; flex-wrap:wrap; }
footer a { color:var(--muted); text-decoration:none; }

.header-right { display:flex; align-items:center; gap:16px; }
.lang { display:flex; border:1px solid var(--line); }
.lang a, .lang span { font:500 .75rem/1 var(--mono); letter-spacing:var(--label-tracking); padding:7px 9px; text-decoration:none; color:var(--muted); }
.lang [aria-current="true"] { background:var(--ink); color:var(--paper); }