@charset "UTF-8";
@layer nimble.reset, nimble.base, nimble.utilities;
@layer nimble.reset {
  :where(*:not(progress)),
  :where(*::before),
  :where(*::after) {
    box-sizing: border-box;
    background-repeat: no-repeat;
  }
  :where(html) {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
  }
  :where(body) {
    margin: 0;
  }
  :where(h1) {
    font-size: 2em;
    margin-block: 0.67em;
  }
  :where(hr) {
    height: 0;
    color: inherit;
  }
  :where(nav) :where(ol, ul) {
    list-style-type: none;
    padding: 0;
  }
  :where(pre) {
    font-family: monospace, monospace;
    font-size: 1em;
  }
  :where(abbr[title]) {
    text-decoration: underline dotted;
  }
  :where(b, strong) {
    font-weight: bolder;
  }
  :where(code, kbd, samp) {
    font-family: monospace, monospace;
    font-size: 1em;
  }
  :where(small) {
    font-size: 80%;
  }
  :where(sub, sup) {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  :where(sub) {
    bottom: -0.25em;
  }
  :where(sup) {
    top: -0.5em;
  }
  :where(iframe) {
    border-style: none;
  }
  :where(table) {
    border-collapse: collapse;
    border-color: currentColor;
    text-indent: 0;
  }
  :where(button, input, select, textarea) {
    font: inherit;
    letter-spacing: inherit;
  }
  :where(button, [type=button], [type=reset], [type=submit]) {
    -webkit-appearance: button;
  }
  :where(fieldset) {
    border: 1px solid #a0a0a0;
  }
  :where(progress) {
    vertical-align: baseline;
  }
  :where(textarea) {
    resize: vertical;
    overflow: auto;
  }
  :where([type=search]) {
    -webkit-appearance: textfield;
    outline-offset: -2px;
  }
  :where(::-webkit-search-decoration) {
    -webkit-appearance: none;
  }
  :where(::-webkit-inner-spin-button),
  :where(::-webkit-outer-spin-button) {
    height: auto;
  }
  :where(::-webkit-file-upload-button) {
    -webkit-appearance: button;
    font: inherit;
  }
  :where(summary) {
    display: list-item;
  }
  :where(a, area, button, input, label, select, summary, textarea, [tabindex]) {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  :where([aria-busy=true]) {
    cursor: progress;
  }
  :where([aria-disabled=true], [disabled]) {
    cursor: not-allowed;
  }
  @media (prefers-reduced-motion: reduce) {
    :where(*),
    :where(*::before),
    :where(*::after) {
      animation-duration: 0.01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 0.01ms !important;
      scroll-behavior: auto !important;
    }
  }
}
@layer nimble.base {
  :root {
    color-scheme: light dark;
    --nc-surface-hue: 250;
    --nc-surface-1: light-dark(oklch(0.985 0.002 var(--nc-surface-hue)), oklch(0.17 0.005 calc(var(--nc-surface-hue) + 10)));
    --nc-surface-2: light-dark(oklch(0.955 0.002 var(--nc-surface-hue)), oklch(0.2 0.005 calc(var(--nc-surface-hue) + 10)));
    --nc-surface-3: light-dark(oklch(0.925 0.002 var(--nc-surface-hue)), oklch(0.23 0.005 calc(var(--nc-surface-hue) + 10)));
    --nc-surface-4: light-dark(oklch(0.885 0.002 var(--nc-surface-hue)), oklch(0.27 0.005 calc(var(--nc-surface-hue) + 10)));
    --nc-text: light-dark(oklch(0.28 0.005 var(--nc-surface-hue)), oklch(0.86 0.005 var(--nc-surface-hue)));
    --nc-border: light-dark(oklch(0.83 0.005 var(--nc-surface-hue)), oklch(0.28 0.005 calc(var(--nc-surface-hue) + 10)));
    --nc-primary: light-dark(oklch(0.5 0.2 250), oklch(0.6 0.2 250));
    --nc-primary-hover: light-dark(oklch(from var(--nc-primary) calc(l - 0.1) c h), oklch(from var(--nc-primary) calc(l + 0.1) c h));
    --nc-primary-focus: oklch(from var(--nc-primary) l c h / 0.4);
    --nc-primary-contrast: light-dark(#fff, oklch(0.15 0.005 250));
    --nc-secondary: light-dark(oklch(0.45 0.05 250), oklch(0.6 0.05 250));
    --nc-secondary-hover: light-dark(oklch(from var(--nc-secondary) calc(l - 0.1) c h), oklch(from var(--nc-secondary) calc(l + 0.1) c h));
    --nc-secondary-focus: oklch(from var(--nc-secondary) l c h / 0.3);
    --nc-secondary-contrast: light-dark(#fff, oklch(0.15 0.005 250));
    --nc-valid: light-dark(oklch(0.52 0.17 145), oklch(0.65 0.2 145));
    --nc-invalid: light-dark(oklch(0.55 0.22 25), oklch(0.65 0.22 25));
    --nc-font-sans: system-ui, sans-serif;
    --nc-font-mono: ui-monospace, Cascadia Code, Source Code Pro, Menlo, Consolas, DejaVu Sans Mono, monospace;
    --nc-spacing: 1rem;
    --nc-radius: 0.25rem;
    --nc-content-width: 60ch;
    --nc-content-shadow-gap: 1rem;
    --nc-content-shadow: 0 0 0.15rem 0 light-dark(oklch(0.55 0.01 var(--nc-surface-hue) / 0.02), oklch(0.85 0.01 calc(var(--nc-surface-hue) + 10) / 0.015)), 0 0 0.3rem 0 light-dark(oklch(0.55 0.01 var(--nc-surface-hue) / 0.03), oklch(0.85 0.01 calc(var(--nc-surface-hue) + 10) / 0.02)), 0 0 0.75rem 0 light-dark(oklch(0.55 0.01 var(--nc-surface-hue) / 0.04), oklch(0.85 0.01 calc(var(--nc-surface-hue) + 10) / 0.025)), 0 0 1.35rem 0 light-dark(oklch(0.55 0.01 var(--nc-surface-hue) / 0.04), oklch(0.85 0.01 calc(var(--nc-surface-hue) + 10) / 0.03)), 0 0 2.5rem 0 light-dark(oklch(0.55 0.01 var(--nc-surface-hue) / 0.05), oklch(0.85 0.01 calc(var(--nc-surface-hue) + 10) / 0.035)), 0 0 6rem 0 light-dark(oklch(0.55 0.01 var(--nc-surface-hue) / 0.06), oklch(0.85 0.01 calc(var(--nc-surface-hue) + 10) / 0.04)), 0 0 0rem 0.0625rem light-dark(oklch(0.55 0.01 var(--nc-surface-hue) / 0.015), oklch(0.85 0.01 calc(var(--nc-surface-hue) + 10) / 0.01));
  }
  [data-theme=dark] {
    color-scheme: dark;
  }
  [data-theme=light] {
    color-scheme: light;
  }
}
@layer nimble.base {
  html {
    font-family: var(--nc-font-sans);
    font-size: 100%;
    line-height: 1.5;
    color: var(--nc-text);
    background-color: var(--nc-surface-1);
    scrollbar-gutter: stable;
  }
  body {
    display: grid;
    grid-template-columns: 1fr min(var(--nc-content-width), calc(100% - 2 * var(--nc-spacing))) 1fr;
    min-height: 100dvh;
    padding-block: var(--nc-spacing);
    position: relative;
  }
  ::selection {
    background-color: var(--nc-primary-focus);
    color: var(--nc-text);
  }
}
@layer nimble.base {
  body > * {
    grid-column: 2;
    min-width: 0;
  }
  body > [style*="display: contents"] > * {
    grid-column: 2;
    min-width: 0;
  }
  body::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: clamp(0px, calc((100% - 2 * var(--nc-spacing) - var(--nc-content-width) - 4 * var(--nc-content-shadow-gap)) * 9999), calc(var(--nc-content-width) + 2 * var(--nc-content-shadow-gap)));
    box-shadow: var(--nc-content-shadow);
    pointer-events: none;
    z-index: -1;
  }
}
@layer nimble.utilities {
  .container {
    max-width: var(--nc-content-width);
    margin-inline: auto;
    padding-inline: var(--nc-spacing);
  }
  .fluid {
    display: block;
    max-width: none;
    padding-inline: var(--nc-spacing);
  }
  .bleed-edge {
    grid-column: 1/-1;
    width: 100%;
    max-width: clamp(calc(var(--nc-content-width) + 2 * var(--nc-content-shadow-gap)), calc((100% - 2 * var(--nc-spacing) - var(--nc-content-width) - 4 * var(--nc-content-shadow-gap)) * -9999), 100%);
    margin-inline: auto;
    box-shadow: none;
    position: relative;
  }
  .bleed-wide {
    grid-column: 1/-1;
    box-shadow: none;
    width: 100%;
    max-width: 1200px;
    margin-inline: auto;
    padding-inline: var(--nc-spacing);
  }
  .bleed-full {
    grid-column: 1/-1;
    box-shadow: none;
    position: relative;
  }
  .grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--nc-spacing);
    margin-bottom: var(--nc-spacing);
  }
  @media (min-width: 720px) {
    .grid {
      grid-template-columns: repeat(auto-fit, minmax(0%, 1fr));
    }
  }
}
@media print {
  body {
    background: #fff;
    color: #000;
  }
  a[href]::after {
    content: " (" attr(href) ")";
    font-size: 0.85em;
    color: #555;
  }
  a[href^="#"]::after,
  a[href^="javascript:"]::after {
    content: none;
  }
  pre, blockquote {
    page-break-inside: avoid;
  }
  h2, h3, h4 {
    page-break-after: avoid;
  }
  img {
    max-width: 100% !important;
  }
  @page {
    margin: 2cm;
  }
}
@layer nimble.base {
  :root {
    --nimble-scope-start: 1 ;
  }
}
@layer nimble.utilities {
  :root {
    --nimble-scope-start: 1 ;
  }
}
@layer nimble.base {
  h1 {
    font-size: 2rem;
    line-height: 1.1;
    margin-top: 0;
    margin-bottom: var(--nc-spacing);
    font-weight: 700;
    text-wrap: balance;
  }
  h2 {
    font-size: 1.75rem;
    line-height: 1.15;
    margin-top: 2rem;
    margin-bottom: var(--nc-spacing);
    font-weight: 700;
    text-wrap: balance;
  }
  h3 {
    font-size: 1.5rem;
    line-height: 1.2;
    margin-top: 1.5rem;
    margin-bottom: var(--nc-spacing);
    font-weight: 700;
    text-wrap: balance;
  }
  h4 {
    font-size: 1.25rem;
    line-height: 1.3;
    margin-top: 1.5rem;
    margin-bottom: var(--nc-spacing);
    font-weight: 700;
    text-wrap: balance;
  }
  h5 {
    font-size: 1.125rem;
    line-height: 1.4;
    margin-top: 1.5rem;
    margin-bottom: var(--nc-spacing);
    font-weight: 700;
    text-wrap: balance;
  }
  h6 {
    font-size: 1rem;
    line-height: 1.5;
    margin-top: 1.5rem;
    margin-bottom: var(--nc-spacing);
    font-weight: 700;
    text-wrap: balance;
  }
  p, ul, ol, dl, blockquote, pre, table, figure, form, fieldset {
    margin-top: 0;
    margin-bottom: var(--nc-spacing);
  }
  body > :first-child,
  body > :first-child > :first-child {
    margin-top: 0;
  }
  body > :nth-last-child(1 of :not(script, style, dialog)),
  body > :nth-last-child(1 of :not(script, style, dialog)) > :last-child {
    margin-bottom: 0;
  }
  ul, ol {
    padding-inline-start: 1.5em;
  }
  :where(li) {
    margin-bottom: 0.25em;
  }
  :where(li) > :where(ul, ol) {
    margin-bottom: 0;
  }
  dt {
    font-weight: 600;
  }
  dd {
    margin-inline-start: 1.5em;
    margin-bottom: 0.5em;
  }
  blockquote {
    margin-block: var(--nc-spacing);
    margin-inline: 0;
    padding: 0.25em var(--nc-spacing);
    border-inline-start: 0.25rem solid var(--nc-border);
    font-style: italic;
  }
  :where(blockquote) footer,
  :where(blockquote) cite {
    font-style: normal;
    font-size: 0.9em;
    color: color-mix(in oklch, var(--nc-text), transparent 40%);
  }
  hr {
    border: none;
    height: 1px;
    background-color: color-mix(in oklch, var(--nc-border), transparent 40%);
    margin: var(--nc-spacing) 0;
  }
  mark {
    padding: 0.1em 0.25em;
    background-color: light-dark(#fde68a, oklch(0.55 0.12 85));
    color: light-dark(inherit, oklch(0.95 0.01 85));
    border-radius: 2px;
  }
  address {
    font-style: normal;
  }
}
@layer nimble.base {
  :where(a:not([role=button])) {
    color: var(--nc-primary);
    text-decoration: underline;
    text-underline-offset: 0.15em;
    text-decoration-color: color-mix(in oklch, var(--nc-primary), transparent 50%);
    transition: color 0.2s, text-decoration-color 0.2s;
  }
  :where(a:not([role=button])):visited {
    color: color-mix(in oklch, var(--nc-primary) 40%, oklch(0.38 0.15 310));
    text-decoration-color: color-mix(in oklch, var(--nc-primary) 40%, oklch(0.38 0.15 310) 30%);
  }
  :where(a:not([role=button])):hover {
    color: var(--nc-primary-hover);
    text-decoration-color: var(--nc-primary-hover);
  }
}
@layer nimble.base {
  :where(button, [type=submit], [type=reset], [type=button], [role=button]) {
    --_btn-padding-v: 0.5em;
    --_btn-padding-h: 1em;
    padding: var(--_btn-padding-v) var(--_btn-padding-h);
    background-color: var(--nc-primary);
    color: var(--nc-primary-contrast);
    border: 1px solid var(--nc-primary);
    border-radius: var(--nc-radius);
    font: inherit;
    font-size: 1rem;
    line-height: 1.5;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    text-align: center;
    margin: 0;
    transition: background-color 0.2s, border-color 0.2s;
  }
  :where(button, [type=submit], [type=reset], [type=button], [role=button]) {
    margin-block-end: 0.25em;
  }
  :where(button, [type=submit], [type=reset], [type=button], [role=button]):hover {
    background-color: var(--nc-primary-hover);
    border-color: var(--nc-primary-hover);
  }
  :where(button, [type=submit], [type=reset], [type=button], [role=button]):focus-visible {
    box-shadow: 0 0 0 2px var(--nc-primary-focus);
    outline: none;
  }
  :where([type=reset]) {
    background-color: var(--nc-secondary);
    border-color: var(--nc-secondary);
    color: var(--nc-secondary-contrast);
  }
  :where([type=reset]):hover {
    background-color: var(--nc-secondary-hover);
    border-color: var(--nc-secondary-hover);
  }
  :where([type=reset]):focus-visible {
    box-shadow: 0 0 0 2px var(--nc-secondary-focus);
  }
  :where(button, [type=submit], [type=reset], [type=button], [role=button]).inline {
    --_btn-padding-v: 0.05em;
    --_btn-padding-h: 0.4em;
    margin: 0.1em 0.15em;
    font-size: 0.875em;
    vertical-align: baseline;
  }
  :where(button, [type=submit], [type=reset], [type=button], [role=button]):disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
  }
  :where([role=group]) {
    display: inline-flex;
    margin-bottom: 0.25em;
  }
  [role=group] > * {
    border-radius: 0;
    margin: 0;
    position: relative;
  }
  [role=group] > * + * {
    --_divider: "";
  }
  [role=group] > * + *::before {
    content: var(--_divider);
    position: absolute;
    inset-inline-start: 0;
    top: 20%;
    bottom: 20%;
    width: 1px;
    background: rgba(255, 255, 255, 0.3);
    pointer-events: none;
  }
  [role=group] > :not(.secondary):not(.outline) + .secondary,
  [role=group] > .secondary + :not(.secondary):not(.outline) {
    --_divider: none;
  }
  [role=group] > :not(.secondary):not(.outline) + .outline,
  [role=group] > .outline + :not(.secondary):not(.outline) {
    --_divider: none;
  }
  [role=group] > .secondary + .outline,
  [role=group] > .outline + .secondary {
    --_divider: none;
  }
  [role=group] > input + *,
  [role=group] > select + * {
    --_divider: none;
  }
  [role=group] > :first-child {
    border-start-start-radius: var(--nc-radius);
    border-end-start-radius: var(--nc-radius);
  }
  [role=group] > :last-child {
    border-start-end-radius: var(--nc-radius);
    border-end-end-radius: var(--nc-radius);
  }
  [role=group]:has(.outline):not(:has(> :not(.outline))) {
    border: 1px solid var(--nc-primary);
    border-radius: var(--nc-radius);
  }
  [role=group]:has(.outline):not(:has(> :not(.outline))) > .outline {
    border: none;
  }
  [role=group] > .outline + .outline::before {
    background: var(--nc-primary);
  }
  [role=search] [role=group] > :first-child {
    border-start-start-radius: 5rem;
    border-end-start-radius: 5rem;
    padding-inline-start: 1.25em;
  }
  [role=search] [role=group] > :last-child {
    border-start-end-radius: 5rem;
    border-end-end-radius: 5rem;
    padding-inline-end: 1.25em;
  }
}
@layer nimble.utilities {
  .secondary:not(a:not([role=button])) {
    background-color: var(--nc-secondary);
    border-color: var(--nc-secondary);
    color: var(--nc-secondary-contrast);
  }
  .secondary:not(a:not([role=button])):hover {
    background-color: var(--nc-secondary-hover);
    border-color: var(--nc-secondary-hover);
  }
  .secondary:not(a:not([role=button])):focus-visible {
    box-shadow: 0 0 0 2px var(--nc-secondary-focus);
  }
  a:not([role=button]).secondary {
    color: var(--nc-secondary);
    text-decoration-color: color-mix(in oklch, var(--nc-secondary), transparent 50%);
  }
  a:not([role=button]).secondary:hover {
    color: var(--nc-secondary-hover);
    text-decoration-color: var(--nc-secondary-hover);
  }
  .outline:not(a:not([role=button])) {
    background-color: transparent;
    color: var(--nc-primary);
  }
  .outline:not(a:not([role=button])):hover {
    background-color: var(--nc-primary-focus);
    color: var(--nc-primary-hover);
    border-color: var(--nc-primary-hover);
  }
}
@layer nimble.base {
  :where(input:not([type=checkbox], [type=radio], [type=range], [type=file], [type=color], [type=submit], [type=button], [type=reset]),
  select, textarea) {
    --_input-bg: color-mix(in oklch, var(--nc-surface-1), var(--nc-surface-2) 20%);
    padding: 0.5em 0.75em;
    min-height: calc(2.5em + 2px);
    background-color: var(--_input-bg);
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius);
    color: var(--nc-text);
    font: inherit;
    font-size: 1rem;
    transition: border-color 0.2s, box-shadow 0.2s;
  }
  :where(input:not([type=checkbox], [type=radio], [type=range], [type=file], [type=color], [type=submit], [type=button], [type=reset], [type=date], [type=month], [type=week], [type=time], [type=datetime-local]),
  select, textarea) {
    width: 100%;
    margin-bottom: var(--nc-spacing);
  }
  :where(p, div) > :where(input, select, textarea):nth-last-child(1 of :not(datalist, script, style)) {
    margin-bottom: 0;
  }
  :where(input, select, textarea):focus-visible {
    border-color: var(--nc-primary);
    box-shadow: 0 0 0 2px var(--nc-primary-focus);
    outline: none;
  }
  :where(input:not([type=submit], [type=button], [type=reset]), select, textarea) + :where(small) {
    display: block;
    margin-top: calc(var(--nc-spacing) * -0.75);
    margin-bottom: var(--nc-spacing);
    font-size: 0.875em;
    color: color-mix(in oklch, var(--nc-text), transparent 40%);
  }
  :where(input, select, textarea)[aria-invalid=false] {
    border-color: var(--nc-valid);
  }
  :where(input, select, textarea)[aria-invalid=true] {
    border-color: var(--nc-invalid);
  }
  :where(input:not([type=submit], [type=button], [type=reset]), select, textarea)[aria-invalid=false] + :where(small) {
    color: var(--nc-valid);
  }
  :where(input:not([type=submit], [type=button], [type=reset]), select, textarea)[aria-invalid=true] + :where(small) {
    color: var(--nc-invalid);
  }
  :where(label) {
    display: block;
    margin-bottom: 0.25em;
  }
  :where(label:has(+ input, + select, + textarea)) {
    font-weight: 600;
  }
  :where(label:has(+ [type=file], + [type=range])) {
    margin-bottom: 0.5em;
  }
  :where(fieldset) {
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius);
    padding: var(--nc-spacing);
    min-width: 0;
    max-width: 100%;
  }
  :where(fieldset) > :nth-last-child(1 of :not(datalist, script, style)),
  :where(fieldset) > :nth-last-child(1 of :not(datalist, script, style)) > :nth-last-child(1 of :not(datalist, script, style)) {
    margin-bottom: 0;
  }
  :where(legend) {
    font-weight: 600;
    padding-inline: 0.25em;
  }
  :where([type=checkbox], [type=radio]) {
    accent-color: var(--nc-primary);
    width: 1.125em;
    height: 1.125em;
    margin: 0;
  }
  :where(label:has([type=checkbox], [type=radio])) {
    display: flex;
    align-items: center;
    gap: 0.35em;
    margin-bottom: 0.5em;
  }
  :where(label:has([type=checkbox], [type=radio]):last-child) {
    margin-bottom: 0;
  }
  :where([type=search]) {
    border-radius: 5rem;
    padding-inline: 1.25em;
  }
  :where([type=range]) {
    accent-color: var(--nc-primary);
    width: 100%;
    margin-bottom: var(--nc-spacing);
  }
  :where(input[list]) {
    width: auto;
  }
  :where([type=file]) {
    color: var(--nc-text);
    font: inherit;
    cursor: pointer;
    max-width: 100%;
    margin-bottom: var(--nc-spacing);
  }
  :where([type=file])::file-selector-button {
    padding: 0.5em 1em;
    margin-right: 0.75em;
    margin-inline-end: 0.75em;
    background-color: var(--nc-primary);
    color: var(--nc-primary-contrast);
    border: 1px solid var(--nc-primary);
    border-radius: var(--nc-radius);
    font: inherit;
    cursor: pointer;
    transition: background-color 0.2s, border-color 0.2s;
  }
  :where([type=file])::file-selector-button:hover {
    background-color: var(--nc-primary-hover);
    border-color: var(--nc-primary-hover);
  }
  :where([type=date], [type=month], [type=week], [type=time], [type=datetime-local]) {
    min-width: 10em;
    margin-bottom: var(--nc-spacing);
  }
  :where([type=color]) {
    --_color-size: calc(1em * 1.5 + 1em + 2px);
    margin-bottom: var(--nc-spacing);
    --_color-pad: 0.25em;
    height: var(--_color-size);
    width: calc((var(--_color-size) - 2 * var(--_color-pad)) * 1.618 + 2 * var(--_color-pad));
    padding: var(--_color-pad);
    background-color: color-mix(in oklch, var(--nc-surface-1), var(--nc-surface-2) 20%);
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius);
    cursor: pointer;
  }
  :where([type=color])::-webkit-color-swatch-wrapper {
    padding: 0;
  }
  :where([type=color])::-webkit-color-swatch {
    border: none;
    border-radius: calc(var(--nc-radius) * 0.5);
  }
  :where(label:has([type=checkbox][role=switch])) {
    display: flex;
    align-items: center;
    gap: 0.5em;
  }
  :where([type=checkbox][role=switch]) {
    appearance: none;
    width: 2.5em;
    height: 1.25em;
    border-radius: 1em;
    background-color: var(--nc-border);
    position: relative;
    cursor: pointer;
    flex-shrink: 0;
    margin: 0;
    transition: background-color 0.2s;
  }
  :where([type=checkbox][role=switch])::before {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: calc(1.25em - 4px);
    height: calc(1.25em - 4px);
    border-radius: 50%;
    background-color: #fff;
    transition: transform 0.2s;
  }
  :where([type=checkbox][role=switch]):checked {
    background-color: var(--nc-primary);
  }
  :where([type=checkbox][role=switch]):checked::before {
    transform: translateX(1.25em);
  }
}
[type=date],
[type=month],
[type=week],
[type=time],
[type=datetime-local] {
  -webkit-appearance: none;
  appearance: none;
}

@layer nimble.base {
  :where(table) {
    width: 100%;
    border-collapse: collapse;
  }
  :where(th, td) {
    padding: 0.5em 0.75em;
    border-bottom: 1px solid color-mix(in oklch, var(--nc-border), transparent 40%);
    text-align: start;
  }
  :where(thead th, thead td) {
    font-weight: 600;
    border-bottom-width: 2px;
    background-color: var(--nc-surface-2);
    text-wrap: balance;
  }
  :where(figure:has(table)) {
    overflow-x: auto;
  }
}
@layer nimble.base {
  :where(code, kbd, samp) {
    font-family: var(--nc-font-mono);
    font-size: 0.875em;
    background-color: var(--nc-surface-2);
    border-radius: var(--nc-radius);
    padding: 0.15em 0.35em;
  }
  :where(pre) {
    background-color: var(--nc-surface-2);
    border-radius: var(--nc-radius);
    padding: var(--nc-spacing);
    overflow-x: auto;
  }
  :where(pre code) {
    background: none;
    padding: 0;
    font-size: inherit;
  }
  :where(kbd) {
    border: 1px solid var(--nc-border);
    border-bottom-width: 2px;
  }
}
@layer nimble.base {
  :where(img, video, canvas, svg) {
    max-width: 100%;
    height: auto;
  }
  :where(figure) {
    margin: 0;
  }
  :where(figcaption) {
    font-size: 0.9em;
    color: color-mix(in oklch, var(--nc-text), transparent 40%);
    margin-top: 0.5em;
  }
}
@layer nimble.base {
  :where(article) {
    background-color: var(--nc-surface-1);
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius);
    padding: var(--nc-spacing);
    margin-bottom: var(--nc-spacing);
  }
  :where(article > header),
  :where(article > footer) {
    background-color: color-mix(in oklch, var(--nc-surface-1), var(--nc-surface-2) 20%);
    padding: var(--nc-spacing);
  }
  :where(article > header) {
    margin: calc(var(--nc-spacing) * -1) calc(var(--nc-spacing) * -1) var(--nc-spacing);
    border-bottom: 1px solid var(--nc-border);
    border-radius: var(--nc-radius) var(--nc-radius) 0 0;
  }
  :where(article > footer) {
    margin: var(--nc-spacing) calc(var(--nc-spacing) * -1) calc(var(--nc-spacing) * -1);
    border-top: 1px solid var(--nc-border);
    border-radius: 0 0 var(--nc-radius) var(--nc-radius);
  }
  :where(article) > :last-child:not(footer) {
    margin-bottom: 0;
  }
  :where(article > header, article > footer) > :last-child {
    margin-bottom: 0;
  }
  :where(article > header, article > footer) > h1,
  :where(article > header, article > footer) > h2,
  :where(article > header, article > footer) > h3,
  :where(article > header, article > footer) > h4,
  :where(article > header, article > footer) > h5,
  :where(article > header, article > footer) > h6 {
    margin-top: 0;
    margin-bottom: 0;
  }
}
@layer nimble.base {
  :where(details) {
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius);
    padding: 0 1em;
  }
  :where(details) {
    margin-bottom: 0.5em;
  }
  :where(summary) {
    cursor: pointer;
    font-weight: 600;
    margin: 0 -1em;
    padding: 0.5em 1em;
    list-style-type: "▶ ";
  }
  :where(details[open] > summary) {
    list-style-type: "▼ ";
  }
  :where(summary[role=button]) {
    display: block;
    width: auto;
    margin: 0 -1em;
    list-style: none;
  }
  :where(summary[role=button])::before {
    content: "▶ ";
    display: inline-block;
    transition: transform 0.2s ease;
    font-size: 0.75em;
    vertical-align: middle;
  }
  :where(details[open] > summary[role=button])::before {
    transform: rotate(90deg);
  }
  :where(details[open]) {
    padding-bottom: 0.5em;
  }
}
details :last-child:last-child {
  margin-bottom: 0;
}

@supports selector(details::details-content) {
  details::details-content {
    transition: opacity 0.3s ease, content-visibility 0.3s ease allow-discrete;
    opacity: 0;
  }
  details[open]::details-content {
    opacity: 1;
  }
  @supports (interpolate-size: allow-keywords) {
    details {
      interpolate-size: allow-keywords;
    }
    details::details-content {
      transition: height 0.3s ease, opacity 0.3s ease, content-visibility 0.3s ease allow-discrete;
      height: 0;
      overflow: clip;
    }
    details[open]::details-content {
      height: auto;
    }
  }
}
@layer nimble.base {
  :where(dialog) {
    background-color: var(--nc-surface-4);
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius);
    max-width: min(90vw, 40rem);
    max-height: 85vh;
    padding: var(--nc-spacing);
  }
  :where(dialog[open]) {
    position: fixed;
    inset: 0;
    margin: auto;
  }
  :where(dialog:has(> article)) {
    background: none;
    border: none;
    padding: 0;
  }
  :where(dialog > article) {
    margin-bottom: 0;
  }
  dialog::backdrop {
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    animation: nc-backdrop-in 0.2s ease;
  }
  @keyframes nc-backdrop-in {
    from {
      opacity: 0;
    }
  }
}
@layer nimble.utilities {
  .striped :where(tbody tr:nth-child(even)) {
    background-color: var(--nc-surface-2);
  }
  .visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }
  .overflow-auto {
    overflow: auto;
  }
}
@layer nimble.base {
  :where(progress) {
    width: 100%;
  }
}
@layer nimble.base {
  :where(meter) {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    height: 0.5rem;
    overflow: hidden;
    border: 0;
    border-radius: var(--nc-radius);
    background-color: var(--nc-surface-3);
  }
  :where(meter)::-webkit-meter-bar {
    border-radius: var(--nc-radius);
    background-color: var(--nc-surface-3);
    border: 0;
    height: 0.5rem;
  }
  :where(meter)::-webkit-meter-optimum-value {
    background-color: var(--nc-valid);
    border-radius: var(--nc-radius);
  }
  :where(meter)::-webkit-meter-suboptimum-value {
    background-color: var(--nc-primary);
    border-radius: var(--nc-radius);
  }
  :where(meter)::-webkit-meter-even-less-good-value {
    background-color: var(--nc-invalid);
    border-radius: var(--nc-radius);
  }
  :where(meter)::-moz-meter-bar {
    background-color: var(--nc-primary);
    border-radius: var(--nc-radius);
  }
  :where(meter):-moz-meter-optimum::-moz-meter-bar {
    background-color: var(--nc-valid);
  }
  :where(meter):-moz-meter-sub-optimum::-moz-meter-bar {
    background-color: var(--nc-primary);
  }
  :where(meter):-moz-meter-sub-sub-optimum::-moz-meter-bar {
    background-color: var(--nc-invalid);
  }
}
@layer nimble.base {
  @supports (appearance: base-select) {
    :where(select),
    :where(select)::picker(select) {
      appearance: base-select;
    }
    :where(select)::picker-icon {
      content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 2l6 6 6-6'/%3E%3C/svg%3E");
      transition: rotate 0.4s;
    }
    :where(select):open::picker-icon {
      rotate: 180deg;
    }
    :where(select)::picker(select) {
      position-area: block-end;
      position-try-order: normal;
      position-try-fallbacks: flip-block;
      border: 1px solid var(--nc-border);
      border-radius: var(--nc-radius);
      background-color: var(--nc-surface-1);
      padding: 0.25em;
      opacity: 0;
      transition: opacity 0.2s, overlay 0.2s allow-discrete, display 0.2s allow-discrete;
    }
    :where(select):open::picker(select) {
      opacity: 1;
    }
    @starting-style {
      :where(select):open::picker(select) {
        opacity: 0;
      }
    }
    :where(select) option {
      padding: 0.5em 0.75em;
      border-radius: var(--nc-radius);
      transition: background-color 0.15s;
    }
    :where(select) option:hover {
      background-color: var(--nc-surface-2);
    }
    :where(select) option:checked {
      font-weight: 600;
    }
  }
}