/* Documentation website only */
:root { --docs-sidebar: 272px; }
.docs-body { background: var(--nina-cream); }
.docs-shell { min-height: 100vh; display: grid; grid-template-columns: var(--docs-sidebar) minmax(0, 1fr); }
.docs-sidebar { position: sticky; top: 0; height: 100vh; overflow: auto; padding: 28px 20px; border-right: 1px solid rgba(31,31,31,.10); background: #F8F6F2; }
.docs-brand { display: flex; align-items: center; gap: 10px; margin-bottom: 30px; text-decoration: none; }
.docs-brand__mark { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--nina-blue); color: white; font-weight: 700; }
.docs-brand__text strong { display:block; line-height:1.1; }
.docs-brand__text span { font-size: 12px; color: var(--text-secondary); }
.docs-nav { display: grid; gap: 6px; }
.docs-nav__label { margin: 18px 10px 6px; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: #777; }
.docs-nav a { padding: 9px 10px; border-radius: 10px; text-decoration: none; font-size: 14px; color: #3A3A3A; }
.docs-nav a:hover, .docs-nav a[aria-current="page"] { background: white; color: #1F1F1F; }
.docs-main { min-width: 0; padding: 54px 6vw 90px; }
.docs-page { max-width: 1180px; margin-inline: auto; }
.docs-kicker { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--nina-blue); }
.docs-title { margin-top: 8px; font-size: clamp(36px,5vw,64px); line-height: 1.04; }
.docs-lead { max-width: 760px; margin-top: 18px; font-size: 19px; color: var(--text-secondary); }
.docs-section { margin-top: 72px; }
.docs-section h2 { font-size: 30px; }
.docs-section > p { max-width: 760px; margin-top: 10px; color: var(--text-secondary); }
.docs-preview { margin-top: 24px; padding: 28px; border: 1px solid rgba(31,31,31,.10); border-radius: 18px; background: white; }
.docs-token-grid { display:grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin-top: 24px; }
.docs-token { padding: 18px; border: 1px solid rgba(31,31,31,.10); border-radius: 14px; background:white; }
.docs-token small { color: var(--text-secondary); }
.docs-table { width:100%; border-collapse: collapse; margin-top: 22px; overflow:hidden; border-radius:14px; background:white; }
.docs-table th,.docs-table td { padding: 14px 16px; border-bottom:1px solid rgba(31,31,31,.10); text-align:left; vertical-align:top; }
.docs-table th { background:#ECE9E2; font-size:13px; }
.docs-callout { margin-top: 26px; padding: 18px 20px; border-left: 4px solid var(--nina-blue); border-radius: 0 14px 14px 0; background:#EBF6FA; }
.docs-code { margin-top: 18px; padding: 18px; overflow:auto; border-radius:14px; background:#1F1F1F; color:#F7F7F7; font: 13px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace; white-space:pre; }
.docs-list { margin-top: 16px; padding-left: 20px; color: var(--text-secondary); }
.docs-list li + li { margin-top: 7px; }
.docs-mobile-top { display:none; }

@media (max-width: 900px) {
  .docs-shell { grid-template-columns: 1fr; }
  .docs-sidebar { position: static; height:auto; border-right:0; border-bottom:1px solid rgba(31,31,31,.10); }
  .docs-nav { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .docs-main { padding: 36px 20px 72px; }
  .docs-token-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 520px) {
  .docs-nav { grid-template-columns:1fr; }
  .docs-token-grid { grid-template-columns:1fr; }
  .docs-preview { padding: 18px; }
}