:root { color-scheme: light dark; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #20252b; background: #fff; line-height: 1.65; }
* { box-sizing: border-box; letter-spacing: 0; }
body { margin: 0; }
header, main, footer { width: min(100% - 40px, 820px); margin: auto; }
header { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; padding: 24px 0; border-bottom: 1px solid #d9dfe2; }
header a { font-weight: 600; text-decoration: none; }
nav { display: flex; flex-wrap: wrap; gap: 24px; margin-left: auto; }
main { padding: 36px 0 56px; }
h1 { font-size: 36px; line-height: 1.2; margin: 0 0 16px; }
h2 { font-size: 23px; line-height: 1.3; margin-top: 36px; }
h3 { font-size: 18px; }
p, li { max-width: 72ch; overflow-wrap: anywhere; }
a { color: #007174; text-underline-offset: 3px; overflow-wrap: anywhere; }
a:focus-visible { outline: 3px solid #0b797b; outline-offset: 4px; }
.icon { width: 80px; height: 80px; display: block; margin-bottom: 20px; }
.status { color: #555b63; font-size: 14px; }
.notice { border-left: 3px solid #007174; padding-left: 18px; }
li { margin: 8px 0; }
footer { border-top: 1px solid #d9dfe2; padding: 24px 0 40px; font-size: 14px; color: #555b63; }
@media (max-width: 480px) { h1 { font-size: 30px; } nav { margin-left: 0; width: 100%; } }
@media (prefers-color-scheme: dark) { :root { background: #17191c; color: #e7e9ed; } a { color: #6ed3c4; } .status, footer { color: #b5bbc2; } header, footer { border-color: #3a4046; } }