:root {
--enterprise-credits-banner-height: 0px;
--shell-surround-bg: #171b22;
--shell-frame-border: #ffffff1a;
--shell-frame-radius: 8px;
--prepaint-skeleton-bar: rgba(255, 255, 255, 0.12);
--prepaint-skeleton-lookup-top: 50px;
--prepaint-skeleton-lookup-h: 32px;
--prepaint-skeleton-top: 94px;
--prepaint-skeleton-head-h: 32px;
--prepaint-skeleton-row-h: 32px;
--prepaint-skeleton-bar-h: 10px;
--prepaint-skeleton-icon: 16px;
--prepaint-skeleton-icon-inset: 8px;
--prepaint-skeleton-head-inset: 11px;
--prepaint-skeleton-s2: calc(var(--prepaint-skeleton-top) + var(--prepaint-skeleton-head-h) + var(--prepaint-skeleton-row-h) * 6 + 16px);
--prepaint-skeleton-lookup: linear-gradient(var(--prepaint-skeleton-bar), var(--prepaint-skeleton-bar));
--prepaint-skeleton-head: linear-gradient(var(--prepaint-skeleton-bar), var(--prepaint-skeleton-bar));
--prepaint-skeleton-icons: repeating-linear-gradient(to bottom, var(--prepaint-skeleton-bar) 0, var(--prepaint-skeleton-bar) var(--prepaint-skeleton-icon), transparent var(--prepaint-skeleton-icon), transparent var(--prepaint-skeleton-row-h));
}
:root[data-enterprise-credits-banner] {
--enterprise-credits-banner-height: 56px;
}
enterprise-shell {
view-transition-name: enterprise-shell;
background: var(--shell-surround-bg);
}
::view-transition-group(enterprise-shell) {
overflow: clip;
}
::view-transition-old(enterprise-shell),
::view-transition-new(enterprise-shell) {
inline-size: auto;
block-size: auto;
}
:root[data-enterprise-nav-peek-carried]::view-transition-group(enterprise-shell) {
overflow: visible;
}
html.shell-framed[data-enterprise-credits-banner] > body {
box-sizing: border-box;
padding-block-start: var(--enterprise-credits-banner-height, 0px);
}
html[data-enterprise-credits-banner] > body > .enterprise-credits-banner {
position: fixed;
z-index: calc(var(--enterprise-nav-z, 1000) + 3);
inset-block-start: 0;
inset-inline: 0;
box-sizing: border-box;
display: flex;
align-items: flex-start;
gap: 12px;
block-size: auto;
padding: 12px 16px;
background: var(--enterprise-credits-banner-bg, #fef2f2);
color: var(--enterprise-credits-banner-fg, #111827);
border-block-end: 1px solid var(--enterprise-credits-banner-border, #ef444466);
font-family: var(--shell-font, Figtree, sans-serif);
font-size: 13px;
line-height: 1.4;
}
html[data-enterprise-credits-banner] > body > .enterprise-credits-banner .enterprise-credits-banner-icon {
flex: 0 0 20px;
display: inline-flex;
align-items: center;
justify-content: center;
inline-size: 20px;
block-size: 20px;
overflow: hidden;
margin-block-start: 2px;
color: var(--enterprise-credits-banner-accent, #b91c1c);
}
html[data-enterprise-credits-banner] > body > .enterprise-credits-banner .enterprise-credits-banner-icon svg {
inline-size: 100%;
block-size: 100%;
}
html[data-enterprise-credits-banner] > body > .enterprise-credits-banner .enterprise-credits-banner-body {
flex: 1 1 auto;
min-inline-size: 0;
}
html[data-enterprise-credits-banner] > body > .enterprise-credits-banner .enterprise-credits-banner-title {
margin: 0 0 2px;
font-weight: 600;
}
html[data-enterprise-credits-banner] > body > .enterprise-credits-banner .enterprise-credits-banner-description {
margin: 0;
}
html[data-enterprise-credits-banner] > body > .enterprise-credits-banner .enterprise-credits-banner-link {
color: var(--enterprise-credits-banner-accent, #b91c1c);
font-weight: 600;
text-decoration: underline;
}
html[data-enterprise-credits-banner] > body > .enterprise-credits-banner .enterprise-credits-banner-dismiss {
flex: 0 0 auto;
inline-size: 24px;
block-size: 24px;
margin-block-start: -2px;
padding: 0;
border: 0;
background: transparent;
color: inherit;
font-size: 18px;
line-height: 1;
cursor: pointer;
border-radius: 6px;
}
html[data-enterprise-credits-banner] > body > .enterprise-credits-banner .enterprise-credits-banner-dismiss:hover {
background: rgba(17, 24, 39, 0.08);
}
enterprise-shell:not(:defined) {
display: block;
flex: 0 0 auto;
inline-size: 192px;
block-size: var(--enterprise-shell-block-size, calc(100dvh - var(--enterprise-credits-banner-height)));
}
:root[data-enterprise-nav-collapsed] enterprise-shell:not(:defined) {
inline-size: 63px;
}
enterprise-shell:not(:defined) {
background-repeat: no-repeat;
background-image: var(--prepaint-skeleton-lookup), var(--prepaint-skeleton-head), var(--prepaint-skeleton-icons), var(--prepaint-skeleton-head), var(--prepaint-skeleton-icons);
background-position: 14px var(--prepaint-skeleton-lookup-top), 22px calc(var(--prepaint-skeleton-top) + var(--prepaint-skeleton-head-inset)), 22px calc(var(--prepaint-skeleton-top) + var(--prepaint-skeleton-head-h) + var(--prepaint-skeleton-icon-inset)), 22px calc(var(--prepaint-skeleton-s2) + var(--prepaint-skeleton-head-inset)), 22px calc(var(--prepaint-skeleton-s2) + var(--prepaint-skeleton-head-h) + var(--prepaint-skeleton-icon-inset));
background-size: calc(100% - 28px) var(--prepaint-skeleton-lookup-h), 120px var(--prepaint-skeleton-bar-h), calc(100% - 44px) calc(var(--prepaint-skeleton-row-h) * 6), 96px var(--prepaint-skeleton-bar-h), calc(100% - 44px) var(--prepaint-skeleton-row-h);
}
:root[data-enterprise-nav-collapsed] enterprise-shell:not(:defined) {
background-size: 32px var(--prepaint-skeleton-lookup-h), 16px var(--prepaint-skeleton-bar-h), var(--prepaint-skeleton-icon) calc(var(--prepaint-skeleton-row-h) * 6), 16px var(--prepaint-skeleton-bar-h), var(--prepaint-skeleton-icon) var(--prepaint-skeleton-row-h);
}
@media (prefers-color-scheme: light) {
:root:not([data-color-scheme='dark']) {
--shell-surround-bg: #f9fafb;
--shell-frame-border: #ebedf1;
--prepaint-skeleton-bar: rgba(11, 16, 48, 0.08);
}
}
:root[data-color-scheme='light'] {
--shell-surround-bg: #f9fafb;
--shell-frame-border: #ebedf1;
--prepaint-skeleton-bar: rgba(11, 16, 48, 0.08);
}
html.shell-framed {
--shell-frame-pad: 8px;
--shell-frame-gap: 0px;
--enterprise-shell-block-size: auto;
}
html.shell-framed[data-enterprise-nav-collapsed]:has(enterprise-shell:not(:defined)),
html.shell-framed:has(enterprise-shell[data-collapsed]) {
--shell-frame-gap: var(--shell-frame-pad);
}
html.shell-framed,
html.shell-framed > body {
background: var(--shell-surround-bg);
}
html.shell-framed > body {
margin: 0;
overflow: hidden;
}
html.shell-framed > body > .shell-row {
display: flex;
box-sizing: border-box;
min-block-size: 0;
overflow: visible;
padding: var(--shell-frame-pad) var(--shell-frame-pad) var(--shell-frame-pad) 0;
gap: var(--shell-frame-gap);
transition: gap var(--enterprise-nav-collapse-ms, 200ms) linear;
block-size: calc(100dvh - var(--enterprise-credits-banner-height));
}
@media (prefers-reduced-motion: reduce) {
html.shell-framed > body > .shell-row {
transition: none;
}
}
html.shell-framed > body > .shell-row > .shell-panel {
flex: 1 1 0%;
min-inline-size: 0;
border: 1px solid var(--shell-frame-border);
border-radius: var(--shell-frame-radius);
}