.docs-layout { display:grid; grid-template-columns:230px minmax(0,1fr); gap:clamp(28px,5vw,72px); padding-top:48px; padding-bottom:100px; align-items:start; }
.docs-sidebar { position:sticky; top:24px; max-height:calc(100vh - 48px); overflow:auto; padding-right:14px; font-size:14px; }
.docs-sidebar a { display:block; padding:8px 10px; text-decoration:none; line-height:1.35; }
.docs-sidebar a[aria-current] { background:#b8e986; font-weight:800; border-left:3px solid #141521; }
.docs-sidebar details { margin:20px 0; }
.docs-sidebar summary { font-weight:800; cursor:pointer; }
.docs-home { font-weight:800; }
.docs-article { min-width:0; max-width:850px; overflow-wrap:anywhere; }
.docs-article h1 { font-size:clamp(36px,5vw,60px); line-height:1.08; margin:32px 0; letter-spacing:-.035em; }
.docs-article h2 { font-size:30px; margin:52px 0 20px; line-height:1.2; letter-spacing:-.025em; }
.docs-article h3 { font-size:23px; margin-top:32px; }
.docs-article p,.docs-article li { font-size:17px; line-height:1.75; }
.docs-article li { margin-bottom:8px; }
.docs-article a { text-underline-offset:4px; }
.docs-article pre { background:#141521; color:#fff8e7; border-radius:4px; padding:24px; overflow:auto; font-size:14px; line-height:1.65; }
.docs-article pre code { white-space:pre; background:none; color:inherit; padding:0; }
.docs-article code { font-size:.86em; background:#e9e1fa; padding:2px 4px; }
.docs-table { overflow:auto; margin:28px 0; border:1px solid #c9c1b4; }
.docs-table table { border-collapse:collapse; width:100%; min-width:540px; font-size:15px; }
.docs-table td,.docs-table th { padding:14px; border:1px solid #d4cdbd; vertical-align:top; text-align:left; }
.docs-table th { background:#e7f4d6; }
.docs-source { border-left:5px solid #ff696b; padding:14px 20px; background:#fff0d5; font-size:13px; }
.docs-source p { font-size:13px; line-height:1.5; margin:8px 0 0; }
.docs-toc { padding:20px 24px; background:#eee8ff; margin-bottom:36px; }
.docs-toc summary { cursor:pointer; font-weight:800; }
.docs-toc li { font-size:14px; margin-bottom:5px; }
.docs-toc > .toc > ul { padding-left:20px; }
.docs-toc > .toc > ul > li { list-style:none; }
.docs-categories { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; margin-top:48px; }
.docs-category { padding:28px; border:2px solid #141521; box-shadow:5px 5px 0 #141521; background:#eee8ff; }
.docs-category:nth-child(even) { background:#e7f4d6; }
.docs-category h2 { font-size:26px; line-height:1.2; margin:0 0 20px; }
.docs-category li { margin:12px 0; }
.docs-index h1 { font-size:clamp(42px,6vw,72px); line-height:1.05; }
@media(max-width:800px) { .docs-layout { grid-template-columns:1fr; } .docs-sidebar { position:static; max-height:240px; border:2px solid #141521; padding:16px; } .docs-categories { grid-template-columns:1fr; } .docs-article pre { padding:16px; } }
/* Override the marketing navigation's horizontal flex layout. */
.documentation-page .docs-sidebar { display:block; width:100%; min-width:0; }
.documentation-page .docs-sidebar details { display:block; }

/* The docs entrance carries the brand; guide layouts remain unchanged. */
.docs-welcome { display:grid; grid-template-columns:1fr 1fr; gap:32px; align-items:center; padding-top:76px; padding-bottom:78px; }
.docs-welcome h1 { font-size:clamp(44px,5.5vw,76px); line-height:1.03; letter-spacing:-.045em; margin:24px 0; }
.docs-welcome-copy > p:not(.eyebrow) { max-width:42ch; }
.docs-welcome-art { position:relative; min-width:0; }
.docs-welcome-art img { display:block; width:100%; height:auto; }
.docs-sticker { display:inline-block; position:absolute; top:-14px; right:12px; background:#ffd75e; border:2px solid #141521; box-shadow:4px 4px 0 #141521; padding:14px 18px; transform:rotate(7deg); font-weight:900; font-size:14px; line-height:1.2; }
.docs-ribbon { display:flex; justify-content:center; flex-wrap:wrap; gap:20px 60px; background:#b8e986; border-block:2px solid #141521; padding:22px; font-size:14px; font-weight:900; letter-spacing:.09em; }
.docs-browse-heading { display:flex; justify-content:space-between; align-items:end; gap:30px; }
.docs-browse-heading h2 { font-size:clamp(36px,4.5vw,58px); line-height:1.07; margin:18px 0 0; letter-spacing:-.035em; }
.docs-browse-heading > p { max-width:32ch; }
.docs-index .docs-category { padding:clamp(24px,3vw,38px); position:relative; }
.docs-index .docs-category h3 { font-size:30px; line-height:1.1; margin:18px 0 14px; }
.docs-category-number { font-size:44px; font-weight:900; line-height:1; opacity:.6; }
.docs-index .docs-category p { max-width:42ch; margin-bottom:24px; }
.docs-index .docs-category ul { list-style:none; padding:0; margin:0; }
.docs-index .docs-category li { margin:0; border-top:1px solid #14152135; }
.docs-index .docs-category li a { display:block; padding:13px 0; text-decoration:none; line-height:1.4; }
.docs-index .docs-category li a:hover { text-decoration:underline; text-underline-offset:4px; }
.docs-index .docs-category:nth-child(3) { background:#ffe198; }
.docs-index .docs-category:nth-child(4) { background:#ffc0ba; }
.docs-index .docs-category:nth-child(5) { background:#c6eced; grid-column:1 / -1; }
.docs-help { padding:64px 0 80px; background:#eee8ff; border-top:2px solid #141521; }
.docs-help h2 { font-size:clamp(32px,4vw,48px); line-height:1.1; letter-spacing:-.03em; }
.docs-help p { max-width:58ch; }
@media(max-width:800px) { .docs-welcome { grid-template-columns:1fr; padding-top:40px; gap:48px; } .docs-welcome-art { max-width:560px; margin:auto; } .docs-browse-heading { display:block; } .docs-sticker { right:10px; top:0; font-size:12px; } }

.docs-topics { position:sticky; top:24px; min-width:0; }
.docs-topics > summary { cursor:pointer; font-weight:800; padding:12px 10px; border-bottom:2px solid #141521; margin-bottom:12px; }
.documentation-page .docs-topics .docs-sidebar { position:static; max-height:calc(100vh - 110px); }
@media(max-width:800px) {
  .docs-topics { position:static; border:2px solid #141521; padding:8px 14px; }
  .docs-topics > summary { border:0; margin:0; }
  .documentation-page .docs-topics .docs-sidebar { border:0; padding:8px 0; max-height:320px; }
}
