/* The reference uses the shared Syidax color, typography and spacing tokens. */
.chart-reference-site { --sidebar-w:292px; --toc-w:190px; }
.reference-layout { display:grid; grid-template-columns:var(--sidebar-w) minmax(0,1fr) var(--toc-w); align-items:start; }
.reference-layout main { padding-top:32px; }
.reference-layout .sidebar { padding:22px 16px 48px; }
.reference-search > label { display:block; margin-bottom:8px; font-size:12px; font-weight:600; }
.reference-search .sidebar-search { height:36px; margin-bottom:22px; }
.reference-nav-label { margin:24px 10px 9px; color:var(--faint); font-size:10px; font-weight:600; letter-spacing:.07em; }
.reference-tree > .reference-nav-label:first-child { margin-top:0; }
.reference-tree a, .reference-tree summary { display:block; padding:6px 10px; border-radius:var(--radius-s); font-size:13px; line-height:1.5; overflow-wrap:anywhere; color:var(--muted); }
.reference-tree summary { display:list-item; list-style-position:inside; cursor:pointer; color:var(--text); }
.reference-tree summary small { color:var(--faint); margin-left:5px; }
.reference-tree details > div { margin:4px 0 8px 15px; padding-left:7px; border-left:1px solid var(--line); }
.reference-tree details a { font-family:var(--font-mono); font-size:11.5px; }
.grid-reference-site .reference-tree .reference-feature-group a {font-family:var(--font-sans);font-size:12.5px}
.reference-tree a:hover, .reference-tree summary:hover { background:var(--hover); color:var(--text); }
.reference-tree a[aria-current="page"] { background:var(--accent-soft); color:var(--accent-ink); font-weight:600; }
.reference-article { max-width:1120px; }
.reference-breadcrumb { display:flex; gap:9px; flex-wrap:wrap; font-size:12px; color:var(--faint); margin-bottom:25px; }
.reference-breadcrumb a:hover { color:var(--accent-ink); }
.reference-eyebrow { font-size:10px; font-weight:600; letter-spacing:.09em; color:var(--faint); margin:0 0 10px; }
.reference-title h1 { font-size:32px; overflow-wrap:anywhere; letter-spacing:-.035em; }
.reference-lead { color:var(--muted); font-size:16px; line-height:1.8; max-width:850px; margin:16px 0 22px; }
.reference-tools { display:flex; align-items:center; flex-wrap:wrap; gap:12px 22px; padding-bottom:24px; border-bottom:1px solid var(--line); font-size:12px; color:var(--muted); }
.reference-tools a, .reference-tools button { display:inline-flex; align-items:center; gap:6px; }
.reference-tools a:hover, .reference-tools button:hover { color:var(--accent-ink); }
.reference-section { padding:32px 0; border-bottom:1px solid var(--line); scroll-margin-top:calc(var(--header-h) + 20px); }
.reference-section h2 { font-size:21px; margin-bottom:18px; }
.reference-section h2 a:hover::after, .reference-member h3 a:hover::after { content:' #'; color:var(--faint); }
.reference-section p { margin:12px 0; color:var(--muted); line-height:1.9; font-size:14px; }
.reference-links { list-style:none; padding:0; margin:8px 0; }
.reference-links li { padding:13px 0; border-bottom:1px solid var(--line); }
.reference-links li:last-child { border:0; }
.reference-links a { font-size:14px; font-weight:600; color:var(--accent-ink); overflow-wrap:anywhere; }
.reference-links a:hover { text-decoration:underline; text-underline-offset:3px; }
.reference-links p { margin:5px 0 0; font-size:13px; }
.reference-links-compact { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr)); gap:6px 20px; }
.reference-links-compact li { border:0; padding:3px 0; }
.reference-links-compact a { font-size:12.5px; font-weight:500; }
.reference-code { border:1px solid var(--line); border-radius:var(--radius-m); background:var(--code-bg); margin:18px 0; overflow:hidden; }
.reference-code-bar { display:flex; justify-content:space-between; align-items:center; padding:8px 14px; border-bottom:1px solid var(--line); color:var(--faint); font-size:11px; }
.reference-code-bar button { display:flex; align-items:center; gap:5px; color:var(--muted); }
.reference-code pre { overflow:auto; margin:0; padding:18px 20px; font:12.5px/1.85 var(--font-mono); tab-size:2; }
.reference-code code { font:inherit; }
.reference-table { overflow-x:auto; margin:18px 0; border:1px solid var(--line); border-radius:var(--radius-m); }
.reference-table table { width:100%; border-collapse:collapse; text-align:left; font-size:13px; }
.reference-table th, .reference-table td { padding:12px 16px; border-bottom:1px solid var(--line); vertical-align:top; }
.reference-table th { color:var(--faint); background:var(--surface); font-size:11px; font-weight:500; }
.reference-table tr:last-child td { border:0; }
.reference-table td:first-child { min-width:110px; }
.reference-table code { white-space:normal; overflow-wrap:anywhere; line-height:1.9; }
.reference-section code a { color:var(--accent-ink); text-decoration:underline; text-underline-offset:3px; }
.reference-member { padding:24px 0; border-top:1px solid var(--line); scroll-margin-top:calc(var(--header-h) + 20px); }
.reference-member h3 { font:600 17px/1.5 var(--font-mono); color:var(--accent-ink); overflow-wrap:anywhere; }
.reference-member .reference-links { display:flex; flex-wrap:wrap; gap:6px 18px; }
.reference-member .reference-links li { border:0; padding:2px 0; }
.reference-member .reference-links a { font-size:12px; font-weight:400; }
.reference-member .reference-links p { display:none; }
.reference-footer { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; color:var(--faint); font-size:12px; padding-top:28px; }
.reference-layout .page-outline { padding-top:36px; }
.reference-layout .page-outline > a { display:block; }
.reference-layout .page-outline a[aria-current="location"] { color:var(--accent-ink); border-left-color:var(--accent); }
.reference-mobile-toc { display:none; }
#reference-search-status { color:var(--faint); font-size:12px; }
#reference-search-results { list-style:none; margin:0; padding:0; }
#reference-search-results a { display:block; padding:12px 6px; border-bottom:1px solid var(--line); }
#reference-search-results a:hover { background:var(--hover); }
#reference-search-results strong { display:block; font:500 12px/1.6 var(--font-mono); color:var(--accent-ink); overflow-wrap:anywhere; }
#reference-search-results span { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; color:var(--muted); font-size:12px; margin-top:5px; }
#reference-search-clear { margin:16px 6px; color:var(--accent-ink); font-size:12px; text-decoration:underline; }
@media (max-width:1240px) {
  .reference-layout { grid-template-columns:var(--sidebar-w) minmax(0,1fr); }
  .reference-mobile-toc { display:block; margin-top:20px; font-size:13px; color:var(--muted); }
  .reference-mobile-toc summary { cursor:pointer; }
  .reference-mobile-toc a { display:block; padding:5px 0; color:var(--accent-ink); }
}
@media (max-width:800px) {
  .reference-layout { display:block; }
  .reference-title h1 { font-size:27px; }
  .reference-layout main { padding-top:24px; }
  .chart-reference-site .reference-layout .sidebar { width:min(340px,90vw); }
  .reference-section { padding:26px 0; }
  .reference-section h2 { font-size:19px; }
  .reference-code pre { padding:14px; font-size:12px; }
}