/* Документы Кошелька (src/legal.js): токены «Иней», шрифты свои (отдаёт сервер из web/src/assets/fonts), обе темы. */
@font-face { font-family: 'Geologica'; font-display: swap; font-weight: 100 900; src: url('/legal/fonts/geologica-cyrillic-wght-normal.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Geologica'; font-display: swap; font-weight: 100 900; src: url('/legal/fonts/geologica-latin-wght-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+2122, U+2212; }
@font-face { font-family: 'Golos Text'; font-display: swap; font-weight: 400 900; src: url('/legal/fonts/golos-text-cyrillic-wght-normal.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Golos Text'; font-display: swap; font-weight: 400 900; src: url('/legal/fonts/golos-text-latin-wght-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+2122, U+2212; }

:root {
  --bg: #F2F6FE; --ink: #13213D; --ink2: #5A6B8C; --ink3: #8E9CB8; --p: #3E7BFA; --p-soft: #E3EDFF;
  --line: rgba(62, 110, 190, .13); --glass: rgba(255, 255, 255, .72); --glass-border: rgba(255, 255, 255, .85);
  --shadow: 0 14px 36px -24px rgba(40, 80, 160, .5); --logo-grad: linear-gradient(145deg, #7CC0FF 0%, #3E7BFA 100%);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --bg: #0A1122; --ink: #E8EEFB; --ink2: #9AABCB; --ink3: #66789B; --p: #6E9BFF; --p-soft: rgba(110, 155, 255, .15); --line: rgba(140, 170, 230, .12); --glass: rgba(20, 31, 58, .66); --glass-border: rgba(140, 170, 230, .12); --shadow: 0 18px 40px -24px rgba(0, 0, 0, .75); color-scheme: dark; }
}
:root[data-theme="dark"] { --bg: #0A1122; --ink: #E8EEFB; --ink2: #9AABCB; --ink3: #66789B; --p: #6E9BFF; --p-soft: rgba(110, 155, 255, .15); --line: rgba(140, 170, 230, .12); --glass: rgba(20, 31, 58, .66); --glass-border: rgba(140, 170, 230, .12); --shadow: 0 18px 40px -24px rgba(0, 0, 0, .75); color-scheme: dark; }

* { box-sizing: border-box; margin: 0; }
body { background: var(--bg); color: var(--ink); font: 16px/1.6 'Golos Text', system-ui, sans-serif; padding: 0 16px 40px; -webkit-text-size-adjust: 100%; }
a { color: var(--p); }
.top, .docs, .doc, .foot { max-width: 820px; margin-left: auto; margin-right: auto; }
.top { padding: calc(18px + env(safe-area-inset-top)) 0 12px; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); text-decoration: none; font: 600 17px 'Geologica', system-ui, sans-serif; }
.logo { width: 34px; height: 34px; border-radius: 11px; background: var(--logo-grad); color: #fff; display: grid; place-items: center; font-size: 17px; }
.docs { display: flex; gap: 8px; overflow-x: auto; padding: 6px 0 14px; scrollbar-width: none; }
.docs a { flex: none; height: 36px; padding: 0 14px; border-radius: 99px; display: inline-flex; align-items: center; font-size: 14px; font-weight: 500; text-decoration: none; color: var(--ink2); background: var(--glass); border: 1px solid var(--glass-border); }
.docs a[aria-current="page"] { background: var(--p-soft); color: var(--p); border-color: transparent; }
.doc { background: var(--glass); border: 1px solid var(--glass-border); border-radius: 28px; box-shadow: var(--shadow); padding: 32px 36px; }
h1 { font: 600 32px/1.15 'Geologica', system-ui, sans-serif; letter-spacing: -.02em; }
h2 { font: 600 19px/1.3 'Geologica', system-ui, sans-serif; margin: 28px 0 8px; }
.lead { color: var(--ink2); font-size: 17px; margin-top: 8px; }
.upd { color: var(--ink3); font-size: 13.5px; margin-top: 6px; }
p + p { margin-top: 10px; }
ul { padding-left: 22px; margin-top: 6px; }
li + li { margin-top: 6px; }
.req { display: grid; grid-template-columns: 140px 1fr; gap: 8px 16px; margin-top: 10px; }
.req dt { color: var(--ink2); }
.req dd { overflow-wrap: anywhere; }
.foot { color: var(--ink3); font-size: 13px; text-align: center; padding-top: 20px; }
@media (max-width: 640px) {
  .doc { padding: 22px 18px; border-radius: 22px; }
  h1 { font-size: 26px; }
  .req { grid-template-columns: 1fr; gap: 2px; }
  .req dd { margin-bottom: 8px; }
}