:root { --bg: #09090c; --surface: #15151c; --line: rgba(255, 255, 255, .08); --text: #f6f6f8; --muted: #9a9aa8; --accent: #ff4d6d; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--text); font: 16px/1.65 Manrope, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
a { color: var(--accent); text-underline-offset: 3px; }
.top { position: sticky; top: 0; z-index: 2; padding: calc(12px + env(safe-area-inset-top)) 16px 12px; background: rgba(9, 9, 12, .86); backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: 9px; color: var(--text); text-decoration: none; font-weight: 800; font-size: 19px; letter-spacing: -.02em; }
.brand b { background: linear-gradient(90deg, #ff2e63, #ff8a3d); -webkit-background-clip: text; background-clip: text; color: transparent; }
.doc { max-width: 720px; margin: 0 auto; padding: 24px 16px calc(48px + env(safe-area-inset-bottom)); }
h1 { margin: 8px 0 4px; font-size: 28px; line-height: 1.2; letter-spacing: -.02em; }
h2 { margin: 30px 0 8px; font-size: 18px; }
.meta { margin: 0 0 20px; color: var(--muted); font-size: 14px; }
p, li { color: #dcdce4; }
ul { padding-left: 20px; }
li { margin: 6px 0; }
.links { margin-top: 36px; padding-top: 18px; border-top: 1px solid var(--line); font-size: 14px; }
