.topbar { position:sticky; top:0; z-index:30; height:68px; padding:0 24px; display:flex; align-items:center; gap:24px; background:color-mix(in srgb,var(--bg-base) 94%,transparent); border-bottom:1px solid var(--border); backdrop-filter:blur(10px) }
.brand { display:flex; align-items:center; gap:10px; font-weight:800; letter-spacing:.03em; min-width:212px }
.brand__mark { display:grid; place-items:center; width:34px; height:34px; border:1px solid color-mix(in srgb,var(--accent) 65%,var(--border)); border-radius:50%; color:#fff; background:var(--accent); box-shadow:0 0 24px var(--accent-soft) }
.search-link { margin:auto; width:min(480px,40vw); min-height:42px; padding:0 12px; display:flex; align-items:center; justify-content:space-between; color:var(--text-secondary); border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--bg-elevated); cursor:pointer }
kbd { padding:1px 7px; color:var(--text-muted); border:1px solid var(--border); border-radius:5px; font:12px var(--font-mono) }
.topbar__actions { display:flex; align-items:center; gap:20px; font-size:.9rem }
.topbar__actions a:hover { color:var(--text-primary) }
.menu-toggle { display:none }
.page-shell { min-height:calc(100vh - 68px); display:grid; grid-template-columns:clamp(260px,20vw,340px) minmax(0,1fr) clamp(220px,16vw,280px) }
.sidebar { position:sticky; top:68px; height:calc(100vh - 68px); overflow-y:auto; padding:28px 18px 60px; border-right:1px solid var(--border); background:var(--bg-elevated) }
.sidebar__heading { padding:0 10px 12px; color:var(--text-muted); font-size:.72rem; font-weight:750; letter-spacing:.12em; text-transform:uppercase }
.sidebar ul { list-style:none; margin:0; padding:0 }
.sidebar ul ul { margin-left:14px; padding-left:9px; border-left:1px solid var(--border) }
.sidebar a { min-height:38px; padding:6px 9px; display:flex; gap:8px; align-items:center; border-radius:7px; color:var(--text-secondary); font-size:.86rem; line-height:1.3 }
.sidebar a:hover { color:var(--text-primary); background:var(--bg-overlay) }
.sidebar a[aria-current="page"] { color:var(--text-primary); background:var(--accent-soft); box-shadow:inset 2px 0 var(--accent) }
main { min-width:0; padding:44px clamp(24px,3vw,48px) 80px }
.article { width:100%; max-width:60rem; margin:0 auto }
.content-link { overflow-wrap:anywhere }
.breadcrumbs { display:flex; flex-wrap:wrap; gap:7px; color:var(--text-muted); font-size:.82rem }
.breadcrumbs a:hover { color:var(--text-primary) }
.article__header { padding:34px 0 22px; border-bottom:1px solid var(--border) }
.article__icon { display:inline-grid; place-items:center; width:50px; height:50px; font-size:1.45rem; background:var(--accent-soft); border:1px solid color-mix(in srgb,var(--accent) 35%,var(--border)); border-radius:var(--radius-md) }
.lead,.hero__subtitle { color:var(--text-secondary); font-size:1.12rem; max-width:58ch }
.prose { padding-top:15px }
.prose p,.prose li { color:var(--text-secondary) }
.prose strong { color:var(--text-primary) }
.prose a { color:#ef526a; text-decoration:underline; text-underline-offset:3px }
.prose li+li { margin-top:.45rem }
.prose hr { margin:2.5rem 0; border:0; border-top:1px solid var(--border) }
.prose blockquote { margin:1.5rem 0; padding:14px 18px; color:var(--text-primary); background:var(--bg-elevated); border-left:3px solid var(--accent); border-radius:0 var(--radius-sm) var(--radius-sm) 0 }
.anchor { opacity:0; color:var(--text-muted); font-weight:400 }
h2:hover .anchor,h3:hover .anchor,.anchor:focus { opacity:1 }
.callout { display:block; margin:1.35rem 0; padding:16px 18px; border-left:3px solid var(--info); border-radius:0 var(--radius-md) var(--radius-md) 0; background:color-mix(in srgb,var(--info) 8%,var(--bg-elevated)) }
.callout--danger { border-color:var(--danger); background:color-mix(in srgb,var(--danger) 8%,var(--bg-elevated)) }
.callout--warning { border-color:var(--warning); background:color-mix(in srgb,var(--warning) 8%,var(--bg-elevated)) }
.callout--success { border-color:var(--success); background:color-mix(in srgb,var(--success) 8%,var(--bg-elevated)) }
.callout--rp { border-color:var(--rp); background:color-mix(in srgb,var(--rp) 8%,var(--bg-elevated)) }
.image-placeholder,.empty-state { margin:28px 0; padding:38px 24px; text-align:center; color:var(--text-secondary); border:1px dashed var(--border-strong); border-radius:var(--radius-md); background:var(--bg-elevated) }
.image-placeholder span,.empty-state>span { display:block; font-size:2rem }
.empty-state h2 { margin:.5rem 0 }
.card-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px }
.nav-card { min-height:116px; padding:17px; display:grid; grid-template-columns:auto 1fr; gap:5px 12px; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--bg-elevated); transition:transform 180ms cubic-bezier(.16,1,.3,1),border-color 180ms }
.nav-card:hover { transform:translateY(-2px); border-color:var(--border-strong) }
.nav-card small { grid-column:2; color:var(--text-muted) }
.page-nav { margin-top:50px; padding-top:24px; display:grid; grid-template-columns:1fr 1fr; gap:16px; border-top:1px solid var(--border) }
.page-nav a { padding:14px; display:flex; flex-direction:column; border:1px solid var(--border); border-radius:var(--radius-sm) }
.page-nav small { color:var(--text-muted) }
.page-nav__next { text-align:right }
.toc { position:sticky; top:68px; height:calc(100vh - 68px); padding:42px 24px; border-left:1px solid var(--border); color:var(--text-muted); font-size:.8rem }
.toc>strong { color:var(--text-primary) }
.toc nav { display:flex; flex-direction:column; margin-top:12px; gap:8px }
.toc a:hover { color:var(--text-primary) }
.toc__level-3 { padding-left:10px }
.hero { position:relative; margin-top:26px; padding:clamp(38px,8vw,76px) clamp(24px,6vw,52px); overflow:hidden; border:1px solid var(--border); border-radius:var(--radius-lg); background:radial-gradient(circle at 25% 20%,rgba(200,16,46,.2),transparent 42%),var(--bg-elevated) }
.hero::after { content:""; position:absolute; inset:0; opacity:.025; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.7' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E") }
.server-code { position:relative; z-index:1; margin-top:26px; padding:7px 7px 7px 16px; display:inline-flex; align-items:center; gap:20px; border:1px solid var(--border-strong); border-radius:var(--radius-sm); background:var(--bg-base) }
.server-code code { font-family:var(--font-mono); color:var(--text-primary) }
.server-code button { min-height:40px; padding:0 17px; color:#fff; background:var(--accent); border:0; border-radius:6px; cursor:pointer }
.article--home { max-width:920px }.quick-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px }.quick-grid a { min-height:100px; padding:18px; display:flex; flex-direction:column; justify-content:center; gap:8px; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--bg-elevated) }.quick-grid span { color:var(--accent-hover); font-size:1.4rem }.updates-list { border:1px solid var(--border); border-radius:var(--radius-md); overflow:hidden }.updates-list a { min-height:52px; padding:8px 16px; display:flex; align-items:center; justify-content:space-between; gap:16px; border-bottom:1px solid var(--border) }.updates-list a:last-child { border:0 }.updates-list time { color:var(--text-muted); font-size:.85rem }
.search-page-form { margin:28px 0 }.search-page-form label,.table-filter { display:block; margin-bottom:8px; color:var(--text-secondary); font-weight:650 }.search-page-form div { display:flex; gap:8px }.search-page-form input,.table-filter input { width:100%; min-height:48px; padding:0 14px; color:var(--text-primary); background:var(--bg-elevated); border:1px solid var(--border-strong); border-radius:var(--radius-sm) }.search-page-form button,.button-link { min-height:48px; padding:0 18px; display:inline-grid; place-items:center; color:#fff; background:var(--accent); border:0; border-radius:var(--radius-sm); cursor:pointer }.result-count,.result-group { color:var(--text-muted) }.search-results article { padding:22px 0; border-bottom:1px solid var(--border) }.search-results h2 { margin:.2rem 0 .4rem; font-size:1.25rem }.search-results p { margin:.3rem 0; color:var(--text-secondary) }.search-results mark,.command-palette mark { padding:0 2px; color:var(--text-primary); background:color-mix(in srgb,var(--warning) 28%,transparent); border-radius:2px }.pagination { display:flex; flex-wrap:wrap; gap:8px; margin-top:28px }.pagination a { min-width:44px; min-height:44px; display:grid; place-items:center; border:1px solid var(--border); border-radius:var(--radius-sm) }.pagination a[aria-current] { color:#fff; background:var(--accent); border-color:var(--accent) }.empty-suggestions { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:18px }.empty-suggestions a { min-height:44px; padding:8px 13px; display:grid; place-items:center; border:1px solid var(--border); border-radius:var(--radius-sm) }
.faq-group details { margin:10px 0; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--bg-elevated) }.faq-group summary { min-height:52px; padding:12px 16px; display:flex; align-items:center; justify-content:space-between; gap:12px; cursor:pointer; font-weight:700 }.faq-group details>.prose { padding:0 18px 18px; border-top:1px solid var(--border) }
.page-shell--wide { grid-template-columns:260px minmax(0,1fr) }.article--wide { max-width:1400px }.table-filter { max-width:480px; margin:28px 0 12px }.table-filter input { display:block; margin-top:7px }.table-wrap { max-width:100%; overflow-x:auto; border:1px solid var(--border); border-radius:var(--radius-md) }table { width:100%; border-collapse:collapse; white-space:nowrap }th { position:sticky; top:0; z-index:1; background:var(--bg-overlay) }th button { width:100%; min-height:48px; padding:8px 14px; display:flex; justify-content:space-between; color:var(--text-primary); background:none; border:0; font-weight:750; cursor:pointer }td { padding:12px 14px; border-top:1px solid var(--border) }tbody tr:nth-child(even) { background:color-mix(in srgb,var(--bg-overlay) 55%,transparent) }.row--header { font-weight:750; background:var(--bg-overlay)!important }.row--separator td { height:10px; padding:0; background:var(--row-color,var(--accent)) }
.not-found { padding:8vh 0; text-align:center }.not-found .search-page-form { max-width:600px; margin:32px auto }
.command-palette { position:fixed; z-index:100; inset:0; display:grid; place-items:start center; padding:10vh 18px 18px }.command-palette[hidden] { display:none }.command-palette__backdrop { position:absolute; inset:0; background:rgba(0,0,0,.7) }.command-palette__panel { position:relative; width:min(720px,100%); max-height:78vh; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--border-strong); border-radius:var(--radius-lg); background:var(--bg-overlay); box-shadow:var(--shadow) }.command-palette__input { min-height:64px; padding:8px 16px; display:flex; align-items:center; gap:12px; border-bottom:1px solid var(--border) }.command-palette__input input { min-width:0; flex:1; color:var(--text-primary); background:transparent; border:0; outline:0; font-size:1.05rem }.command-palette__results { overflow-y:auto; padding:10px }.palette-help { padding:26px; text-align:center; color:var(--text-muted) }.palette-group { margin:8px 0 14px }.palette-group>strong { display:block; padding:4px 10px; color:var(--text-muted); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase }.palette-result { width:100%; padding:10px; display:block; text-align:left; color:var(--text-primary); border:0; border-radius:var(--radius-sm); background:transparent; cursor:pointer }.palette-result[aria-selected="true"] { background:var(--accent-soft) }.palette-result small,.palette-result span { display:block }.palette-result small { color:var(--text-muted) }.palette-result span { margin-top:3px; overflow:hidden; color:var(--text-secondary); white-space:nowrap; text-overflow:ellipsis }.command-palette footer { min-height:44px; padding:8px 14px; display:flex; gap:16px; align-items:center; color:var(--text-muted); border-top:1px solid var(--border); font-size:.75rem }.command-palette footer a { margin-left:auto; color:var(--text-primary) }.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0 }
@media (max-width:1279px) { .page-shell { grid-template-columns:260px minmax(0,1fr) }.toc { display:none } }
@media (max-width:1023px) {
  .topbar { padding:0 14px; gap:12px }.menu-toggle { display:block }.brand { min-width:0 }.brand span:last-child { display:none }.search-link { width:auto; flex:1 }.search-link span { overflow:hidden; white-space:nowrap }.topbar__actions>a { display:none }
  .page-shell { display:block }.sidebar { position:fixed; z-index:50; top:68px; bottom:0; left:0; width:min(86vw,320px); height:auto; transform:translateX(-105%); transition:transform 180ms cubic-bezier(.16,1,.3,1); box-shadow:var(--shadow) }.sidebar.is-open { transform:none }
  .sidebar-backdrop { position:fixed; z-index:40; inset:68px 0 0; background:rgba(0,0,0,.55) }.sidebar-backdrop:not([hidden]) { display:block }
  .sidebar a { min-height:44px }
  main { padding:30px 20px 65px }
}
@media (max-width:620px) { .card-grid,.quick-grid { grid-template-columns:1fr }.quick-grid a { min-height:72px }.page-nav { grid-template-columns:1fr }.search-link kbd { display:none }.topbar__actions { gap:4px }.search-page-form div { flex-direction:column }.command-palette { padding:0 }.command-palette__panel { width:100%; max-height:100vh; height:100vh; border:0; border-radius:0 } }
.disclosure { margin:.8rem 0; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--bg-elevated); overflow:hidden }
.disclosure > summary { padding:13px 16px; display:flex; align-items:center; gap:10px; color:var(--text-primary); font-weight:600; font-size:.95rem; cursor:pointer; list-style:none; min-height:44px }
.disclosure > summary::-webkit-details-marker { display:none }
.disclosure > summary::before { content:"›"; flex:0 0 auto; color:var(--accent); font-size:1.15rem; line-height:1; transition:transform 160ms cubic-bezier(.16,1,.3,1) }
.disclosure[open] > summary::before { transform:rotate(90deg) }
.disclosure > summary:hover { background:var(--bg-overlay) }
.disclosure > *:not(summary) { padding:0 16px }
.disclosure > *:not(summary):last-child { padding-bottom:14px }
.content-image { display:block; width:auto; max-width:100%; height:auto; margin:1.4rem auto; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--bg-elevated) }
.nav-card--cover { padding:0; grid-template-columns:1fr; align-content:start; overflow:hidden }
.nav-card__cover { grid-column:1; width:100%; aspect-ratio:16/9; object-fit:cover; border-bottom:1px solid var(--border); background:var(--bg-overlay) }
.nav-card--cover > span { padding:14px 16px 0 }
.nav-card--cover > strong { padding:0 16px }
.nav-card--cover > small { grid-column:1; padding:0 16px 15px }



.prose > p, .prose > ul, .prose > ol, .lead { max-width:76ch }
.callout > p, .callout > ul, .callout > ol, .disclosure > p, .disclosure > ul { max-width:70ch }