:root { color-scheme: dark; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #e8e8ed; background: #0a0a0f; line-height: 1.75; }
* { box-sizing: border-box; }
body { margin: 0; }
a { color: #b8adff; text-underline-offset: .2em; }
a:hover { color: #fff; }
a:focus-visible, summary:focus-visible { outline: 3px solid #b8adff; outline-offset: 5px; }
.skip-link { position: absolute; top: -80px; left: 16px; padding: 8px 16px; background: #15151f; z-index: 2; }
.skip-link:focus { top: 12px; }
.site-header, .site-footer { border-bottom: 1px solid #292936; padding: 22px max(24px, calc((100% - 1120px) / 2)); }
.site-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px; }
.brand { display: flex; align-items: center; gap: 12px; color: #e8e8ed; text-decoration: none; font-weight: 700; }
.brand img { width: 46px; height: 46px; object-fit: contain; }
nav { display: flex; gap: 20px; flex-wrap: wrap; }
nav a[aria-current] { color: #fff; text-decoration-thickness: 3px; }
.lang-switch { display: inline-flex; flex-wrap: nowrap; gap: 0; align-items: center; padding: 3px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; background: rgba(10,10,15,.42); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
.lang-switch .lang-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 46px; height: 32px; padding: 0 12px; border-radius: 999px; color: #9898a6; font-size: .82rem; font-weight: 600; line-height: 1; text-decoration: none; transition: .3s cubic-bezier(.25,.46,.45,.94); }
.lang-switch .lang-btn:hover { color: #fff; }
.lang-switch .lang-btn[aria-current] { color: #fff; background: linear-gradient(135deg, #6c5ce7, #00cec9); box-shadow: 0 4px 14px rgba(108,92,231,.28); }
.lang-switch .lang-btn:focus-visible { outline: 2px solid #00cec9; outline-offset: 2px; }
.page { max-width: 1120px; margin: 0 auto; padding: 54px 24px 80px; }
.eyebrow { color: #b8adff; text-transform: uppercase; font-size: .8rem; letter-spacing: .15em; margin: 0 0 8px; }
h1 { font-size: clamp(2rem, 5vw, 3.3rem); line-height: 1.15; letter-spacing: -.04em; margin: 0 0 20px; }
h2 { font-size: 1.35rem; line-height: 1.4; margin-top: 2.5em; color: #fff; scroll-margin-top: 24px; }
p, li { overflow-wrap: anywhere; }
li + li { margin-top: .45em; }
ul, ol { padding-left: 1.4em; }
.document-layout { display: grid; grid-template-columns: 235px minmax(0, 1fr); gap: 56px; align-items: start; margin-top: 30px; }
.contents { position: sticky; top: 24px; border: 1px solid #292936; border-radius: 16px; padding: 20px; font-size: .87rem; }
.contents summary { cursor: pointer; font-weight: 700; color: #fff; }
.contents ol { margin-bottom: 0; }
.contents a { text-decoration: none; color: #bdbdc9; }
article { max-width: 760px; min-width: 0; color: #c6c6d2; }
article > :first-child { margin-top: 0; }
strong { color: #f0f0f5; }
blockquote { border-left: 3px solid #7c6bf0; padding-left: 18px; margin-left: 0; }
.notice { border: 1px solid #a27632; background: #272016; border-radius: 12px; padding: 16px 20px; color: #ffdb9a; }
.action { display: inline-block; padding: 11px 22px; border-radius: 10px; background: #6c5ce7; color: white; font-weight: 650; text-decoration: none; }
.site-footer { border-top: 1px solid #292936; border-bottom: 0; font-size: .88rem; color: #a6a6b6; }
.site-footer p { margin-bottom: 0; }
@media (max-width: 760px) {
  .page { padding-top: 32px; }
  .document-layout { grid-template-columns: 1fr; gap: 28px; }
  .contents { position: static; }
  .contents ol { columns: 2; column-gap: 28px; }
  .contents li { break-inside: avoid; }
  .site-footer nav { gap: 16px; }
}
@media print {
  :root { color-scheme: light; background: white; color: black; }
  .site-header, .site-footer, .contents, .skip-link { display: none; }
  .page { max-width: none; padding: 0; }
  .document-layout { display: block; }
  article, h2, strong, a { color: black; }
}
