/* Sitewide theme: loaded last on every page so tool pages match the home page. Added to pages by scripts/apply_site_theme.py. */
:root { --bg: #0c0c10; --panel: #121319; --panel-2: #0b0b0f; --border: #262833; --text: #e9e9ef; }
body { background: radial-gradient(ellipse 90% 700px at 50% 0, #15131f 0%, rgba(21,19,31,0) 100%) no-repeat #0c0c10; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; letter-spacing: -.01em; }
.site { padding-top: 26px; }
.brandLogo { width: min(300px, 70vw); }
.crumbs { font-family: inherit; font-size: 13px; letter-spacing: 0; }
.crumbs a, .crumbs a:visited { color: var(--muted, #8b90a0); }
.crumbs a:hover { color: #95d600; }
.wrap { padding-top: 26px; }
.head h1 { font-size: 28px; font-weight: 700; letter-spacing: -.02em; }
.head h1::before, .panel h2::before, .how h2::before { content: none; }
.head .intro { font-size: 15px; }
.panel { border-radius: 14px; }
.panel h2 { font-size: 16px; }

/* family tabs, folder style: a row of tabs on top of the page sheet; the current tab is part of the sheet. One real page per tab. */
.wrap:has(> .famtabs) { padding-top: 0; padding-left: 0; padding-right: 0; margin-top: 22px; --sheet: #111219; --panel: #171820;
  background: linear-gradient(#262833, #262833) 0 39px / 100% 1px no-repeat, linear-gradient(var(--sheet), var(--sheet)) 0 40px / 100% calc(100% - 40px) no-repeat; border-radius: 0 0 14px 14px; }
.wrap:has(> .famtabs) > :not(.famtabs) { margin-left: 20px; margin-right: 20px; }
.famtabs { height: 40px; margin-bottom: 24px; }
.famtabs ul { display: flex; align-items: flex-end; gap: 3px; height: 40px; list-style: none; margin: 0; padding: 0 10px; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
.famtabs ul::-webkit-scrollbar { display: none; }
.famtabs a, .famtabs a:visited { display: block; height: 34px; line-height: 33px; padding: 0 12px; border: 1px solid #262833; border-radius: 9px 9px 0 0; color: #9a9fb0; background: #0b0b0f; text-decoration: none; font-size: 13px; white-space: nowrap; }
.famtabs a:hover { color: #e9e9ef; background: #14151c; }
.famtabs a[aria-current="page"] { height: 40px; line-height: 38px; color: #95d600; background: var(--sheet); border-bottom-color: var(--sheet); font-weight: 600; }
.famtabs ul.more-r { -webkit-mask-image: linear-gradient(to left, transparent, #000 56px); mask-image: linear-gradient(to left, transparent, #000 56px); }
.famtabs ul.more-l { -webkit-mask-image: linear-gradient(to right, transparent, #000 56px); mask-image: linear-gradient(to right, transparent, #000 56px); }
.famtabs ul.more-l.more-r { -webkit-mask-image: linear-gradient(to right, transparent, #000 56px, #000 calc(100% - 56px), transparent); mask-image: linear-gradient(to right, transparent, #000 56px, #000 calc(100% - 56px), transparent); }