:root {
--np-accent:        var(--np-brand-primary, #00baa7);
--np-accent-soft:   #00d3bd;
--np-heading:       var(--np-brand-navy,    #27272a);
--np-heading-strong:#18181b;
--np-body:          #52525c;
--np-body-strong:   #3f3f46;
--np-muted:         #71717b;
--np-soft:          #9f9fa9;
--np-ring:          #e4e4e7;
--np-ring-soft:     #f4f4f5;
--np-surface:       var(--np-brand-light-green, #fafafa);
--np-card:          #ffffff;
}
.np-public {
background: var(--np-surface);
color: var(--np-body);
--font-display: var(--font-barlow), ui-sans-serif, system-ui, sans-serif;
font-family: var(--font-barlow), ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
"Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif,
"Apple Color Emoji", "Segoe UI Emoji";
-webkit-font-smoothing: antialiased;
font-feature-settings: "kern", "liga", "calt";
line-height: 1.7;
}
:where(.np-public .prose, .np-public article) :is(h1, h2, h3, h4, h5, h6):not(:is(.not-prose, .not-prose *)) {
color: var(--np-heading);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.15;
}
.np-public .prose h1:not(:is(.not-prose, .not-prose *)),
.np-public article h1:not(:is(.not-prose, .not-prose *)) {
font-size: clamp(2.25rem, 4vw, 3rem);
}
.np-public .prose h2:not(:is(.not-prose, .not-prose *)),
.np-public article h2:not(:is(.not-prose, .not-prose *)) {
font-size: clamp(1.5rem, 3vw, 1.875rem);
}
.np-public .prose h3:not(:is(.not-prose, .not-prose *)),
.np-public article h3:not(:is(.not-prose, .not-prose *)) {
font-size: clamp(1.25rem, 2vw, 1.5rem);
}
.np-public .prose h4:not(:is(.not-prose, .not-prose *)),
.np-public article h4:not(:is(.not-prose, .not-prose *)) {
font-size: 1.125rem;
}
.np-public .prose h5:not(:is(.not-prose, .not-prose *)),
.np-public article h5:not(:is(.not-prose, .not-prose *)) {
font-size: 1rem;
font-weight: 600;
}
.np-public .prose h6:not(:is(.not-prose, .not-prose *)),
.np-public article h6:not(:is(.not-prose, .not-prose *)) {
font-size: 0.875rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.06em;
color: var(--np-muted);
}
.np-public p:not(:is(.not-prose, .not-prose *)) {
color: var(--np-body);
}
.np-public .prose a:not(:is(.not-prose, .not-prose *)),
.np-public .np-main article a:not(:is(.not-prose, .not-prose *)),
.np-public .np-main p a:not(:is(.not-prose, .not-prose *)) {
color: var(--np-heading);
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 3px;
transition: color 150ms ease;
}
.np-public .prose a:not(:is(.not-prose, .not-prose *)):hover,
.np-public .np-main article a:not(:is(.not-prose, .not-prose *)):hover,
.np-public .np-main p a:not(:is(.not-prose, .not-prose *)):hover {
color: var(--np-accent);
}
.np-public .prose {
--tw-prose-body:        var(--np-body);
--tw-prose-headings:    var(--np-heading);
--tw-prose-lead:        var(--np-body-strong);
--tw-prose-links:       var(--np-heading);
--tw-prose-bold:        var(--np-heading);
--tw-prose-counters:    var(--np-muted);
--tw-prose-bullets:     var(--np-soft);
--tw-prose-hr:          var(--np-ring-soft);
--tw-prose-quotes:      var(--np-heading-strong);
--tw-prose-quote-borders: var(--np-ring);
--tw-prose-captions:    var(--np-muted);
--tw-prose-kbd:         var(--np-heading);
--tw-prose-kbd-shadows: 39 39 42;
--tw-prose-code:        var(--np-heading);
--tw-prose-pre-code:    #f4f4f5;
--tw-prose-pre-bg:      var(--np-heading);
--tw-prose-th-borders:  var(--np-ring);
--tw-prose-td-borders:  var(--np-ring-soft);
}
.np-public .prose table:not(:is(.not-prose, .not-prose *)),
.np-public article table:not(:is(.not-prose, .not-prose *)) {
width: 100%;
margin-block: 1rem;
border-collapse: separate;
border-spacing: 0;
border: 1px solid var(--np-ring);
border-radius: 0.5rem;
overflow: hidden;
font-size: 0.875rem;
color: var(--np-body);
}
.np-public .prose table:not(:is(.not-prose, .not-prose *)) thead,
.np-public article table:not(:is(.not-prose, .not-prose *)) thead {
background: var(--np-surface);
}
.np-public .prose table:not(:is(.not-prose, .not-prose *)) tr,
.np-public article table:not(:is(.not-prose, .not-prose *)) tr {
border: 0;
}
.np-public .prose table:not(:is(.not-prose, .not-prose *)) th,
.np-public article table:not(:is(.not-prose, .not-prose *)) th {
padding: 0.625rem 1rem;
text-align: left;
font-weight: 600;
color: var(--np-heading);
border: 0;
border-top: 1px solid var(--np-ring);
border-left: 1px solid var(--np-ring);
}
.np-public .prose table:not(:is(.not-prose, .not-prose *)) td,
.np-public article table:not(:is(.not-prose, .not-prose *)) td {
padding: 0.625rem 1rem;
vertical-align: top;
border: 0;
border-top: 1px solid var(--np-ring);
border-left: 1px solid var(--np-ring);
}
.np-public .prose table:not(:is(.not-prose, .not-prose *)) thead th,
.np-public article table:not(:is(.not-prose, .not-prose *)) thead th {
border-top: 0;
border-bottom: 0;
}
.np-public .prose table:not(:is(.not-prose, .not-prose *)) th:first-child,
.np-public .prose table:not(:is(.not-prose, .not-prose *)) td:first-child,
.np-public article table:not(:is(.not-prose, .not-prose *)) th:first-child,
.np-public article table:not(:is(.not-prose, .not-prose *)) td:first-child {
border-left: 0;
}
.np-public .prose table:not(:is(.not-prose, .not-prose *)) > tbody:first-child tr:first-child td,
.np-public .prose table:not(:is(.not-prose, .not-prose *)) > tbody:first-child tr:first-child th,
.np-public article table:not(:is(.not-prose, .not-prose *)) > tbody:first-child tr:first-child td,
.np-public article table:not(:is(.not-prose, .not-prose *)) > tbody:first-child tr:first-child th {
border-top: 0;
}
.np-site-header {
border-bottom: 1px solid var(--np-ring-soft);
background: transparent;
border-bottom-left-radius: 0.75rem;
border-bottom-right-radius: 0.75rem;
}
.np-site-header,
.np-site-header * {
letter-spacing: -0.01em;
}
.np-site-footer {
border-top: 1px solid var(--np-ring-soft);
background: transparent;
color: var(--np-muted);
font-size: 0.875rem;
border-top-left-radius: 0.75rem;
border-top-right-radius: 0.75rem;
}
.np-site-footer a {
color: var(--np-body-strong);
transition: color 150ms ease;
}
.np-site-footer a:hover {
color: var(--np-accent);
}
.np-site-footer .np-text-widget {
margin: 0;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
.np-sidebar {
background: var(--np-card);
border-radius: 0.75rem;
box-shadow: 0 0 0 1px var(--np-ring-soft);
padding: 1.25rem;
}
.np-sidebar > * + * {
margin-top: 1rem;
}
.np-public nav[aria-label^="Menu"] a {
color: var(--np-body-strong);
font-weight: 500;
transition: color 150ms ease, background-color 150ms ease;
}
.np-public nav[aria-label^="Menu"] a:hover {
color: var(--np-accent);
}
.np-public nav[aria-label^="Menu"] ul[role="menu"] {
background: var(--np-card);
border-color: var(--np-ring);
box-shadow: 0 10px 24px -8px rgba(24, 24, 27, 0.12);
}
.np-sidebar h3,
.np-sidebar [data-np-toc-skip] > h3 {
color: var(--np-heading);
font-size: 0.75rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.08em;
margin-bottom: 0.75rem;
}
.np-public input[type="search"],
.np-public input[type="text"][placeholder*="Search"] {
border-color: var(--np-ring);
background: var(--np-card);
border-radius: 0.5rem;
transition: border-color 150ms ease, box-shadow 150ms ease;
}
.np-public input[type="search"]:focus,
.np-public input[type="text"][placeholder*="Search"]:focus {
border-color: var(--np-accent);
box-shadow: 0 0 0 3px rgba(0, 186, 167, 0.15);
outline: none;
}
.np-public a[aria-label][rel*="noopener"] svg {
transition: color 150ms ease;
}
.np-site-footer a[aria-label] {
color: var(--np-soft);
}
.np-site-footer a[aria-label]:hover {
color: var(--np-accent);
}
.np-public .np-main .prose a.flex.items-start,
.np-public .np-main a.flex.items-start.gap-4.p-4 {
border-bottom: 1px solid var(--np-ring-soft);
border-radius: 0;
transition: background-color 150ms ease;
}
.np-public a.flex.items-start:hover {
background-color: var(--np-surface) !important;
}
.np-public a.flex.items-start.gap-3:hover {
background-color: var(--np-surface) !important;
}
.np-public .text-xs.text-slate-500,
.np-public .text-sm.text-slate-600 {
color: var(--np-muted) !important;
}
.np-public .text-base.font-medium.text-slate-900,
.np-public .text-sm.font-medium.text-slate-900 {
color: var(--np-heading) !important;
letter-spacing: -0.01em;
}
.np-public .bg-brand-light-green {
background: var(--np-ring-soft) !important;
color: var(--np-heading) !important;
}
.np-public section.not-prose.bg-slate-100 {
background: var(--np-surface) !important;
}
.np-public section.not-prose .max-w-3xl.text-3xl,
.np-public section.not-prose .max-w-3xl.md\:text-5xl {
letter-spacing: -0.025em;
line-height: 1.1;
}
.np-newspaper-widget.np-newspaper-section,
.np-newspaper-widget.np-newspaper-section-featured,
.np-newspaper-widget.np-newspaper-hero:not(:first-child) {
content-visibility: auto;
contain-intrinsic-size: auto 900px;
}