/* Generated by node www/tools/sync-design.cjs — edit www/design/foundation.css */
/* Gem public theme: BotFather-derived tokens and Noto Sans (gem.bot/style, approved 2026-10-21). Dark from BotFather, light is Gem's adaptation. */
@font-face{font-family:'Noto Sans';src:url('https://gem.bot/assets/fonts/NotoSans.woff2?v=20261021') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
:root{color-scheme:light;--bg:#f5f7fa;--surface:#ffffff;--bg2:#eaf0f6;--text:#182533;--hint:#647586;--link:#177cbf;--accent:#248bda;--button:#248bda;--button-text:#ffffff;--line:#dce5ed;--soft:#e7f2fc;--hover:#eaf0f6;--button-hover:#207cc2;--button-disabled-text:#a6d8ff;--placeholder:#647586;--dropdown:#ffffff;--dropdown-hover:#eaf0f6;--footer-bg:#eaf0f6;--footer-text:#647586;--good:#287c35;--warning:#9c510b;--danger:#b92f3d;--good-bg:rgba(40,124,53,.10);--warning-bg:rgba(156,81,11,.10);--danger-bg:rgba(185,47,61,.10);--header:var(--bg);--radius:8px;--popup-radius:12px;--transition:.2s ease;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px)}
@media(prefers-color-scheme:dark){:root{color-scheme:dark;--bg:#1a2026;--surface:#212a33;--bg2:#293440;--text:#ffffff;--hint:#8794a1;--link:#4cb2ff;--accent:#4cb2ff;--button:#248bda;--button-text:#ffffff;--line:#354352;--soft:rgba(77,178,255,.1);--hover:#293440;--button-hover:#207cc2;--button-disabled-text:#a6d8ff;--placeholder:#8a98a6;--dropdown:#2e3a47;--dropdown-hover:#384553;--footer-bg:#111417;--footer-text:#6d8394;--good:#7ed176;--warning:#ff9953;--danger:#ff5863;--good-bg:rgba(126,209,118,.14);--warning-bg:rgba(255,153,83,.14);--danger-bg:rgba(255,88,99,.14)}}
:root[data-theme=light]{color-scheme:light;--bg:#f5f7fa;--surface:#ffffff;--bg2:#eaf0f6;--text:#182533;--hint:#647586;--link:#177cbf;--accent:#248bda;--button:#248bda;--button-text:#ffffff;--line:#dce5ed;--soft:#e7f2fc;--hover:#eaf0f6;--button-hover:#207cc2;--button-disabled-text:#a6d8ff;--placeholder:#647586;--dropdown:#ffffff;--dropdown-hover:#eaf0f6;--footer-bg:#eaf0f6;--footer-text:#647586;--good:#287c35;--warning:#9c510b;--danger:#b92f3d;--good-bg:rgba(40,124,53,.10);--warning-bg:rgba(156,81,11,.10);--danger-bg:rgba(185,47,61,.10)}
:root[data-theme=dark]{color-scheme:dark;--bg:#1a2026;--surface:#212a33;--bg2:#293440;--text:#ffffff;--hint:#8794a1;--link:#4cb2ff;--accent:#4cb2ff;--button:#248bda;--button-text:#ffffff;--line:#354352;--soft:rgba(77,178,255,.1);--hover:#293440;--button-hover:#207cc2;--button-disabled-text:#a6d8ff;--placeholder:#8a98a6;--dropdown:#2e3a47;--dropdown-hover:#384553;--footer-bg:#111417;--footer-text:#6d8394;--good:#7ed176;--warning:#ff9953;--danger:#ff5863;--good-bg:rgba(126,209,118,.14);--warning-bg:rgba(255,153,83,.14);--danger-bg:rgba(255,88,99,.14)}

/* One scale for Gem. Mobile is the default; layout files must not shrink it. */
:root{
 --font-sans:'Noto Sans',Arial,sans-serif;
 --text-xs:.8125rem; --text-sm:.875rem; --text-base:1rem; --text-lg:1.125rem;
 --text-title:2.25rem; --text-section:1.75rem; --text-card:1.125rem;
 --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
 --space-5:20px; --space-6:24px; --space-8:32px; --space-12:48px; --space-16:64px;
 --gutter:20px; --section-space:56px; --content-width:1160px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:var(--text-base)/1.6 var(--font-sans);overflow-wrap:break-word}
h1,h2,h3,h4,p{margin:0}
h1,h2,h3{font-weight:700;text-wrap:balance;letter-spacing:-.025em}
h1{font-size:var(--text-title);line-height:1.15}
h2{font-size:var(--text-section);line-height:1.25}
h3{font-size:var(--text-card);line-height:1.4}
p{max-width:65ch;text-wrap:pretty}
small{font-size:var(--text-xs);line-height:1.5}
button,input,select,textarea{font:inherit}
input,select,textarea{font-size:1rem;max-width:100%}
button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button{cursor:pointer}button:disabled{cursor:default;opacity:.55}
a{color:inherit;text-decoration:none}a:hover{color:var(--link)}
:where(button,a,input,select,textarea,summary):focus-visible{outline:2px solid var(--link);outline-offset:4px}
svg{flex-shrink:0;max-width:100%}img{max-width:100%;height:auto}
.icon{width:24px;height:24px;fill:none;color:var(--link);flex-shrink:0}
.brand{display:inline-flex;align-items:center;gap:8px;font-size:26px;line-height:1.2;letter-spacing:-.04em;font-weight:750;white-space:nowrap}
.brand .icon{width:30px;height:30px}.brand small{font-size:var(--text-sm);letter-spacing:0;color:var(--hint);font-weight:500}
.btn{display:inline-flex;justify-content:center;align-items:center;gap:10px;min-height:48px;border:1px solid transparent;background:var(--button);color:var(--button-text);padding:12px 20px;border-radius:var(--radius);font-size:var(--text-sm);line-height:1.5;font-weight:650;transition:background-color var(--transition);text-align:center}
.btn:hover{color:var(--button-text);background:var(--button-hover)}
.btn.secondary{background:var(--surface);border-color:var(--line);color:var(--text)}
.btn.secondary:hover{background:var(--hover)}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.pill{display:inline-flex;align-items:center;gap:6px;font-size:var(--text-xs);line-height:1.4;padding:5px 9px;border:1px solid var(--line);border-radius:6px;color:var(--hint)}
.muted,.fine{color:var(--hint)}.fine{font-size:var(--text-sm)}
.text-link,.quiet-link{display:inline-flex;align-items:center;min-height:44px;color:var(--link);font-size:var(--text-sm);font-weight:600;line-height:1.5}
em{font-style:normal;color:var(--link)}
.symbol{width:44px;height:44px;display:grid;place-items:center;background:var(--soft);border-radius:var(--radius)}
.symbol .icon{width:24px;height:24px}
.actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.skip{position:absolute;top:-100px;left:16px;z-index:100}.skip:focus{top:10px}
code,pre{font:var(--text-sm)/1.65 var(--font-sans);font-variant-numeric:tabular-nums}
code{overflow-wrap:anywhere}pre{white-space:pre-wrap;overflow-wrap:anywhere;margin:0}
dialog{background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:var(--popup-radius);width:min(520px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:auto;padding:24px}
dialog::backdrop{background:#0a101a99}dialog h2{font-size:24px}dialog p{color:var(--hint);margin:12px 0 20px}
[hidden]{display:none!important}
@media(min-width:768px){:root{--text-title:3rem;--text-section:2rem;--gutter:32px;--section-space:72px}}
@media(min-width:1100px){:root{--text-title:3.5rem;--text-section:2.25rem;--gutter:40px;--section-space:88px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
