:root { --bg: #000; --surface: #121212; --line: #262626; --text: #eee; --muted: #9a9a9a; --accent: #FF4FA8; color-scheme: dark; }
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--text); }
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; line-height: 1.6; font-size: 15px; }
.wrap { max-width: 720px; margin: 0 auto; padding: 24px 18px 60px; }
header { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
header img { width: 44px; height: 44px; object-fit: contain; }
header a.back { margin-left: auto; color: var(--accent); text-decoration: none; font-weight: 600; font-size: 14px; }
h1 { font-size: 28px; line-height: 1.2; margin: 18px 0 4px; }
h2 { font-size: 18px; margin: 32px 0 8px; color: #fff; padding-top: 12px; border-top: 1px solid var(--line); }
h3 { font-size: 15px; margin: 18px 0 4px; }
p, li { color: var(--text); }
ul, ol { padding-left: 22px; }
li { margin: 4px 0; }
a { color: var(--accent); }
.muted { color: var(--muted); font-size: 13px; }
.box { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; margin: 14px 0; }
.box.pink { border-color: rgba(255, 79, 168, .45); background: rgba(255, 79, 168, .07); }
nav.toc { columns: 2; column-gap: 24px; font-size: 14px; }
nav.toc a { display: block; text-decoration: none; padding: 2px 0; }
@media (max-width: 520px) { nav.toc { columns: 1; } }
table { width: 100%; border-collapse: collapse; font-size: 14px; margin: 10px 0; }
th, td { text-align: left; vertical-align: top; padding: 8px; border-bottom: 1px solid var(--line); }
th { color: #fff; }
.in-app header a.back { display: none; }
.in-app .wrap { padding-top: 12px; }