:root {
    --curato-nav-width: 300px;
    --curato-nav-min: 220;
    --curato-nav-max: 600;
    --curato-content-min: 360;
    --curato-nav-handle: 8px;
    --curato-count-color: #b42318;
}
html[data-theme="dark"] { --curato-count-color: #ff8a80; }
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] { --curato-count-color: #ff8a80; }
}
.curato-object-count { color: var(--curato-count-color); white-space: nowrap; }
#nav-sidebar {
    flex-basis: var(--curato-nav-width);
    left: calc(-1 * var(--curato-nav-width) - 1px);
    margin-left: calc(-1 * var(--curato-nav-width) - 1px);
}
.main.shifted > #nav-sidebar + .content {
    max-width: calc(100% - var(--curato-nav-width) - 24px);
}
#curato-nav-resizer {
    position: fixed;
    width: var(--curato-nav-handle);
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    cursor: col-resize;
    touch-action: none;
    z-index: 18;
}
#curato-nav-resizer:hover,
#curato-nav-resizer:focus-visible,
#curato-nav-resizer.dragging { background: var(--link-fg); }
#curato-nav-resizer:focus-visible { outline: 2px solid var(--body-fg); outline-offset: 1px; }
.main:not(.shifted) #curato-nav-resizer { display: none; }
html.curato-resizing, html.curato-resizing * { cursor: col-resize; user-select: none; }
@media (max-width: 767px) {
    #curato-nav-resizer { display: none; }
    .main.shifted > #nav-sidebar + .content { max-width: 100%; }
}