:root{
 --bg:#ffffff; --surface:#f7f8fa; --surface-warm:rgba(29,112,184,.06);
 --fg:#0b0c0c; --fg-2:#2b3138; --meta:#505a63;
 --accent:#0b4c8c; --accent-hover:#093a6b; --accent-on:#ffffff;
 --link:#1d70b8; --line:#dfe3e8;
 --focus-ring:0 0 0 2px #ffdd00,0 0 0 5px rgba(255,221,0,.25);
 --elev-ring:0 0 0 1px #dfe3e8; --elev-raised:0 2px 8px rgba(11,12,12,.10);
 --gutter:24px; --space-2:8px; --space-4:16px; --space-6:24px; --space-10:40px; --space-16:64px;
}
@media(max-width:900px){:root{--gutter:20px}}
@media(max-width:620px){:root{--gutter:16px}}