:root { color-scheme: dark; --ink:#f7f1df; --muted:#aac0bb; --mint:#82ddcf; --line:#2e5056; }
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: #07171c; color: var(--ink); font-family: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", sans-serif; }
body { padding: max(26px, var(--safe-area-inset-top, env(safe-area-inset-top, 0px))) 18px max(30px, var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px))); }
main { width: min(100%, 680px); margin: 0 auto; }
a { color: var(--mint); }
.back { min-height: 44px; display: inline-flex; align-items: center; text-decoration: none; font-size: 13px; font-weight: 800; }
header { margin: 16px 0 28px; padding: 22px; border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(145deg, #214148, #10282f); }
header small { color: var(--mint); font-weight: 800; }
h1 { margin: 6px 0 0; font-size: 28px; letter-spacing: -1px; }
h2 { margin: 28px 0 8px; color: #ffe2a0; font-size: 18px; }
h3 { margin: 21px 0 7px; font-size: 15px; }
p, li { color: #c4d2cf; font-size: 14px; line-height: 1.75; }
ul, ol { padding-left: 21px; }
.note { padding: 13px 15px; border-left: 3px solid var(--mint); border-radius: 4px 13px 13px 4px; background: #82ddcf0d; }