:root { color-scheme: light dark; --bg:#f8f6ff; --panel:#ffffff; --text:#231936; --muted:#6f6482; --line:#d8cfee; --accent:#7c3cff; --shadow:0 14px 44px rgba(30,20,60,.08); }
    @media (prefers-color-scheme: dark) { :root { --bg:#100c18; --panel:#171020; --text:#f1ecff; --muted:#bbb0cf; --line:#332944; --accent:#b99cff; --shadow:0 18px 52px rgba(0,0,0,.28); } }
    * { box-sizing:border-box; }
    html { scroll-behavior:smooth; }
    body { margin:0; background:var(--bg); color:var(--text); font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
    .skip-link { position:absolute; left:16px; top:-80px; z-index:10; color:var(--bg); background:var(--accent); padding:9px 13px; border-radius:999px; font-weight:800; text-decoration:none; }
    .skip-link:focus { top:14px; }
    header { position:sticky; top:0; z-index:2; backdrop-filter:blur(16px); background:color-mix(in srgb,var(--bg) 88%,transparent); border-bottom:1px solid var(--line); }
    .bar { max-width:1120px; margin:0 auto; padding:14px 22px; display:flex; flex-wrap:wrap; gap:14px; align-items:center; justify-content:space-between; }
    .links,.lang { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
    .lang-label { color:var(--muted); font-size:13px; font-weight:750; margin-right:2px; }
    a.button,.lang a { color:var(--accent); text-decoration:none; font-weight:750; border:1px solid var(--line); border-radius:999px; padding:8px 12px; }
    a.button:hover,.lang a:hover { border-color:color-mix(in srgb,var(--accent) 55%,var(--line)); color:var(--text); }
    a.button:focus-visible,.lang a:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
    .lang a[aria-current="true"] { background:color-mix(in srgb,var(--accent) 18%,transparent); color:var(--text); border-color:color-mix(in srgb,var(--accent) 45%,var(--line)); }
    main { max-width:840px; margin:0 auto; padding:34px 22px 64px; }
    h1 { font-size:clamp(30px,5vw,58px); letter-spacing:-.04em; line-height:1.08; margin:0 0 12px; }
    .lead,.note { color:var(--muted); font-size:18px; line-height:1.6; max-width:720px; margin:0 0 24px; }
    pre { box-sizing:border-box; max-width:100%; margin:0 0 18px; font:14px/1.72 ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace; border:1px solid var(--line); border-radius:20px; padding:clamp(18px,3vw,24px); background:color-mix(in srgb,var(--panel) 84%,var(--text) 2%); box-shadow:var(--shadow); }
    .source-text { white-space:pre-wrap; overflow-x:hidden; overflow-wrap:break-word; word-break:normal; hyphens:none; tab-size:2; }
    .source-table { white-space:pre; overflow-x:auto; overflow-y:visible; overflow-wrap:normal; word-break:normal; hyphens:none; tab-size:2; -webkit-overflow-scrolling:touch; }
    .source-table::-webkit-scrollbar { height:12px; }
    .source-table::-webkit-scrollbar-thumb { background:color-mix(in srgb,var(--accent) 38%,var(--line)); border-radius:999px; }
    pre[dir="rtl"] { direction:rtl; text-align:right; }
    .source-end-nav { margin-top:38px; padding-top:24px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:10px; }
    @media (max-width:760px) { main { max-width:100%; padding:28px 16px 52px; } .bar { padding-inline:16px; align-items:flex-start; } .links,.lang { width:100%; } pre { font-size:13px; } a.button,.lang a { padding:8px 10px; } }