:root {
  --bg: #faf7f5; --panel: #ffffff; --text: #1f1c1b; --muted: #6e6764;
  --accent: #d9553e; --rule: #ebe4e0;
}
@media (prefers-color-scheme: dark) {
  :root { --bg: #121110; --panel: #1c1a19; --text: #f2eeeb; --muted: #a59d99; --accent: #f08670; --rule: #2e2a28; }
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--bg); color: var(--text);
  font: 18px/1.7 -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  -webkit-text-size-adjust: 100%;
}
main { max-width: 640px; margin: 0 auto; padding: 56px 20px 96px; }
header { margin-bottom: 32px; }
.app { color: var(--accent); font-weight: 600; font-size: 15px; letter-spacing: .02em; margin: 0 0 6px; }
h1 { font-size: 36px; line-height: 1.15; letter-spacing: -.02em; margin: 0 0 8px; }
h2 { font-size: 21px; line-height: 1.3; margin: 48px 0 12px; padding-top: 24px; border-top: 1px solid var(--rule); }
h3 { font-size: 17px; margin: 24px 0 4px; }
p { margin: 0 0 14px; }
ul { margin: 0 0 14px; padding-left: 22px; }
li { margin: 0 0 10px; padding-left: 4px; }
li::marker { color: var(--accent); }
strong { font-weight: 600; }
a { color: var(--accent); text-underline-offset: 3px; }
.muted { color: var(--muted); font-size: 15px; }
.summary { background: var(--panel); border: 1px solid var(--rule); border-radius: 16px; padding: 20px 24px; }
.summary h2 { margin: 0 0 10px; padding: 0; border: 0; font-size: 17px; }
.summary ul { margin: 0; }
.summary li:last-child { margin-bottom: 0; }
.steps { background: var(--panel); border: 1px solid var(--rule); border-radius: 10px; padding: 2px 8px; font-size: 16px; white-space: nowrap; }
footer { margin-top: 64px; padding-top: 20px; border-top: 1px solid var(--rule); }
@media (max-width: 480px) { body { font-size: 17px; } h1 { font-size: 30px; } main { padding-top: 40px; } }
