:root { --bg:#1f1f2f; --fg:#c8cbd5; --dim:#868ca0; --yel:#f7dfaf; --wht:#f4f6ff; --aqua:#97e0d7; --rule:#333949; --panel:#27273a; }
* { box-sizing:border-box; }
html { background:var(--bg); -webkit-text-size-adjust:100%; }
body { margin:0; color:var(--fg); background:var(--bg); min-height:100vh;
       font:15px/1.6 ui-monospace,"DejaVu Sans Mono",Menlo,Consolas,monospace; }
::selection { background:var(--yel); color:#000; }
a { color:var(--aqua); text-decoration:none; border-bottom:1px solid #3b6a64; }
a:hover, a:focus-visible { color:var(--wht); border-bottom-color:var(--wht); }
a:focus-visible { outline:2px solid var(--yel); outline-offset:2px; }
b { color:var(--wht); font-weight:bold; }
code { color:var(--yel); }
p { margin:0 0 1em; }
.sr { position:absolute; left:-9999px; }

.page { display:grid; grid-template-columns:230px minmax(0,76ch); gap:0 56px; max-width:1000px; margin:0 auto; padding:36px 22px 64px; }
aside { position:sticky; top:36px; align-self:start; }
aside .mark { display:block; border:0; width:200px; margin:0 0 22px; }
aside .mark img { display:block; width:200px; height:200px; image-rendering:pixelated; }
aside .tag { color:var(--dim); font-size:13px; margin:-8px 0 22px; line-height:1.4; }
aside ul { list-style:none; margin:0 0 20px; padding:0; }
aside li { margin:0 0 .15em; padding:0; text-indent:0; }
aside li::before { content:none; }
aside .group { color:var(--dim); font-size:12px; margin:0 0 .4em; letter-spacing:.04em; }
aside li a { display:block; border:0; color:var(--fg); padding:1px 8px; margin-left:-8px; }
aside li a:hover, aside li a:focus-visible { background:#2a2f3c; color:var(--wht); }
aside li a[aria-current] { background:var(--yel); color:#000; font-weight:bold; }

main { min-width:0; }
h1 { font-size:1.15em; font-weight:bold; color:var(--wht); margin:0 0 1em; }
h2 { font-size:1em; font-weight:bold; color:var(--yel); margin:2.4em 0 .7em; }
h1 + h2, main > h2:first-child { margin-top:0; }
h2::before { content:"\00bb\00a0"; color:var(--dim); }
.lead { color:var(--wht); }
main ul { list-style:none; margin:0 0 1em; padding:0; }
main li { margin:0 0 .6em; padding-left:2ch; text-indent:-2ch; }
main li::before { content:"-\00a0"; color:var(--dim); }
main ul.links li { margin-bottom:.3em; }
pre.cmd { background:var(--panel); border:1px solid var(--rule); border-left:3px solid var(--yel); padding:10px 14px; margin:0 0 1em; overflow-x:auto; color:var(--wht); font:inherit; }
pre.cmd .p { color:var(--dim); user-select:none; }
.warn { border:1px solid var(--yel); color:var(--wht); padding:8px 14px; margin:0 0 1em; }
figure { margin:0 0 1em; }
figure img { display:block; width:100%; height:auto; border:1px solid var(--rule); image-rendering:pixelated; background:#0a0a0a; }
figure a { border:0; display:block; }
figure a:hover img, figure a:focus-visible img { border-color:var(--yel); }
figcaption { color:var(--dim); font-size:13px; margin-top:4px; }
.rule { border:0; border-top:1px solid var(--rule); margin:2.4em 0 .8em; }
footer { color:var(--dim); font-size:13px; }

@media (max-width:760px) {
  body { font-size:14px; }
  .page { display:block; padding:20px 16px 48px; }
  aside { position:static; margin:0 0 28px; padding:0 0 18px; border-bottom:1px solid var(--rule); }
  aside .mark { float:left; width:96px; margin:0 14px 10px 0; }
  aside .mark img { width:96px; height:96px; }
  aside .tag { margin:0 0 14px; }
  aside .links-wrap { clear:both; padding-top:14px; }
  aside ul { display:flex; flex-wrap:wrap; gap:3px; margin-bottom:12px; }
  aside li a { margin-left:0; padding:1px 10px; background:#2a2f3c; }
  aside li a[aria-current] { background:var(--yel); }
}

main > pre, main pre { background:var(--panel); border:1px solid var(--rule); border-left:3px solid var(--yel); padding:10px 14px; margin:0 0 1em; overflow-x:auto; color:var(--wht); font:inherit; }
main pre code { color:inherit; background:none; }
h3 { font-size:1em; color:var(--wht); margin:1.8em 0 .6em; }
h3::before { content:"\00bb\00a0\00bb\00a0"; color:var(--dim); }
main li p { margin:0; }
main ul ul { margin:.4em 0 0; }
#contents { display:inline-block; min-width:30ch; max-width:100%; border:1px solid var(--rule); background:var(--panel); padding:8px 16px 4px; margin:0 0 1.6em; }
#contents p { margin:0 0 .4em; color:var(--dim); }
#contents ul { margin:0 0 .6em; }
#contents li { margin:0 0 .15em; }
#contents li::before { content:none; }
#contents li { padding-left:0; text-indent:0; }
.alert { border:1px solid var(--rule); border-left:3px solid var(--aqua); background:var(--panel); padding:8px 14px 2px; margin:0 0 1em; }
.alert.warning { border-left-color:#e8806a; }
.alert p:first-child { margin:0 0 .3em; }
.alert.warning p:first-child b { color:#e8806a; }
.alert.note p:first-child b { color:var(--aqua); }
table { border-collapse:collapse; margin:0 0 1.2em; width:100%; font-size:14px; }
th, td { text-align:left; vertical-align:top; padding:4px 12px 4px 0; border-bottom:1px solid var(--rule); }
th { color:var(--wht); }
figure img { max-width:100%; }