:root {
  --bg: #eef3f8; --surface: #ffffff; --line: #d5e1ee; --ink: #142338; --ink-dim: #4d6180; --ink-faint: #7c8fab;
  --green: #1a9c52; --green-deep: #0f7a41; --green-ink: #ffffff; --green-soft: #e7f6ed; --blue: #1f7cc4;
  --shadow: 0 20px 42px -24px rgba(20,35,56,0.38);
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0b1420; --surface: #142338; --line: #293d59; --ink: #edf3fb; --ink-dim: #9fb4cf; --ink-faint: #6e86a4;
    --green: #37c86f; --green-deep: #1c8c46; --green-ink: #06240f; --green-soft: #123b29; --blue: #45b8ff;
    --shadow: 0 26px 52px -22px rgba(0,0,0,0.6);
  }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: "Golos Text", system-ui, sans-serif; line-height: 1.65; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
a { color: var(--blue); }
img { max-width: 100%; height: auto; display: block; }
.top { border-bottom: 1px solid var(--line); background: var(--surface); }
.top .in { max-width: 860px; margin: 0 auto; padding: 14px 18px; display: flex; align-items: center; gap: 12px; }
.top img { width: 40px; height: 40px; border-radius: 21%; }
.top a { text-decoration: none; color: var(--ink); font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: 17px; }
.doc { max-width: 860px; margin: 32px auto 60px; padding: 0 18px; }
.sheet { background: var(--surface); border: 1px solid var(--line); border-radius: 20px; box-shadow: var(--shadow); padding: 38px 42px; }
h1 { font-family: "Comfortaa", sans-serif; font-size: clamp(24px, 4vw, 32px); line-height: 1.2; margin: 0 0 6px; }
h2 { font-family: "Comfortaa", sans-serif; font-size: 18px; margin: 28px 0 8px; }
p, li { color: var(--ink-dim); }
.meta { color: var(--ink-faint); font-size: 14px; margin: 0 0 22px; }
ul, ol { padding-left: 22px; }
.req { border-top: 1px dashed var(--line); margin-top: 28px; padding-top: 16px; }
.req p { margin: 4px 0; }
.back { display: inline-block; margin-top: 22px; font-weight: 700; }
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; margin-top: 20px;
  font-weight: 700; font-size: 16px; text-decoration: none; padding: 14px 24px; border-radius: 13px;
  background: var(--green); color: var(--green-ink); box-shadow: 0 4px 0 var(--green-deep);
}
.btn svg { width: 20px; height: 20px; }
@media (max-width: 560px) { .sheet { padding: 26px 20px; } }