@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  body { margin: 0; }
  button, input, select, textarea { font: inherit; }
}

@layer base {
  /* Inter 4.1: https://github.com/rsms/inter/releases/tag/v4.1
     The bundled font license is in static/fonts/inter/LICENSE.txt. */
  @font-face {
    font-family: Inter;
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../fonts/inter/InterVariable.woff2") format("woff2");
  }
  @font-face {
    font-family: Inter;
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url("../fonts/inter/InterVariable-Italic.woff2") format("woff2");
  }
  html { background: var(--color-background); }
  body { min-width: 20rem; background: var(--color-background); color: var(--color-text); font-family: Inter, "Segoe UI", Arial, sans-serif; font-size: .9375rem; line-height: 1.5; }
  a { color: var(--color-blue); text-underline-offset: .18em; }
  a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 2px solid transparent; outline-offset: 2px; box-shadow: var(--focus-ring); }
  h1, h2, h3, h4, h5, p { margin-top: 0; }
  h1, h2, h3, h4, h5 { color: var(--color-navy); line-height: 1.22; }
  h1 { margin-bottom: .45rem; font-size: clamp(2rem, 3vw, 2.55rem); font-weight: 780; letter-spacing: -.035em; }
  h2 { margin-bottom: .75rem; font-size: 1.35rem; letter-spacing: -.015em; } h3 { font-size: 1.02rem; }
  .icon { display: inline-block; width: var(--icon-size-md); height: var(--icon-size-md); flex: 0 0 auto; fill: currentColor; }
  .skip-link { position: fixed; z-index: 100; top: -5rem; left: 1rem; padding: .6rem .9rem; background: #fff; border: 1px solid var(--color-blue); border-radius: var(--radius-sm); } .skip-link:focus { top: .75rem; }
  .app-shell { min-height: 100vh; }
  .site-header { position: fixed; z-index: 40; inset: 0 auto 0 0; width: var(--sidebar-width); height: 100vh; overflow-y: auto; background: var(--color-surface); border-right: 1px solid var(--color-border); transition: width 180ms ease; }
  .site-header__inner { display: flex; flex-direction: column; min-height: 100%; padding: 1.5rem .9rem 1rem; }
  .brand { display: inline-flex; align-items: center; gap: .75rem; align-self: flex-start; min-height: var(--control-min-height); margin: 0 .75rem 2rem; color: var(--color-navy); font-size: 1rem; font-weight: 800; letter-spacing: .02em; text-decoration: none; }
  .brand__mark { display: grid; place-items: center; width: 2.35rem; height: 2.35rem; background: var(--color-blue); border-radius: var(--radius-md); color: #fff; }
  .brand__mark .icon { width: 1.35rem; height: 1.35rem; }
  .account-mode-badge { margin: -1.35rem .75rem 1.25rem; padding: .4rem .65rem; border: 1px solid var(--color-border); border-radius: 999px; color: var(--color-text-muted); font-size: .68rem; font-weight: 800; letter-spacing: .06em; text-align: center; text-transform: uppercase; }
  .account-mode-badge--central { background: #fff7df; border-color: #ecd49a; color: #805400; } .account-mode-badge--personal { background: var(--color-blue-soft); border-color: #c6d8f6; color: var(--color-blue); }
  .sidebar-toggle { position: absolute; z-index: 2; top: 1.6rem; right: .6rem; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; padding: 0; background: transparent; border: 1px solid transparent; border-radius: var(--radius-md); color: var(--color-text-muted); cursor: pointer; }
  .sidebar-toggle:hover { background: var(--color-surface-alt); border-color: var(--color-border); color: var(--color-navy); }
  .sidebar-toggle .icon { width: 1rem; height: 1rem; }
  .sidebar-toggle__collapse, .sidebar-toggle__expand { align-items: center; justify-content: center; width: 100%; height: 100%; line-height: 0; }
  .sidebar-toggle__collapse { display: flex; }
  .sidebar-toggle__expand { display: none; }
  .primary-nav { display: grid; gap: .25rem; } .primary-nav a, .nav-form button { display: flex; align-items: center; gap: .8rem; width: 100%; min-height: 2.85rem; padding: .72rem .95rem; background: transparent; border: 1px solid transparent; border-radius: var(--radius-md); color: var(--color-text-muted); font-size: .9rem; font-weight: 650; text-align: left; text-decoration: none; cursor: pointer; } .primary-nav a > span, .nav-form button > span { min-width: 0; overflow-wrap: anywhere; }
  .primary-nav a:hover, .nav-form button:hover { background: var(--color-surface-alt); border-color: var(--color-border); color: var(--color-navy); } .primary-nav a[aria-current="page"] { background: var(--color-blue-soft); border-color: #c6d8f6; box-shadow: inset 3px 0 var(--color-blue); color: var(--color-blue); }
  .sidebar-spacer { flex: 1; min-height: 2rem; }
  .sidebar-user { display: flex; align-items: center; gap: .7rem; margin: .65rem; padding: 1rem .3rem .85rem; border-top: 1px solid var(--color-border); }
  .sidebar-user__avatar { display: grid; place-items: center; width: 2.2rem; height: 2.2rem; flex: 0 0 auto; background: var(--color-blue-soft); border-radius: 50%; color: var(--color-blue); font-weight: 800; }
  .sidebar-user strong, .sidebar-user small { display: block; max-width: 10rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sidebar-user strong { color: var(--color-navy); font-size: .8rem; }
  .sidebar-user small { color: var(--color-text-muted); font-size: .7rem; }
  .nav-form { margin: 0; }
  .app-frame { display: flex; flex-direction: column; min-height: 100vh; margin-left: var(--sidebar-width); transition: margin-left 180ms ease; } .sidebar-collapsed .site-header { width: 4.75rem; } .sidebar-collapsed .app-frame { margin-left: 4.75rem; }
  .sidebar-collapsed .site-header__inner { padding-inline: .55rem; }
  .sidebar-collapsed .brand { margin: 0 auto .5rem; }
  .sidebar-collapsed .brand__name, .sidebar-collapsed .sidebar-user > span:last-child { display: none; }
  .sidebar-collapsed .account-mode-badge, .sidebar-collapsed .primary-nav a > span, .sidebar-collapsed .nav-form button > span { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
  .sidebar-collapsed .primary-nav a, .sidebar-collapsed .nav-form button { justify-content: center; padding-inline: .6rem; }
  .sidebar-collapsed .sidebar-user { justify-content: center; margin-inline: 0; padding-inline: 0; }
  .sidebar-collapsed .sidebar-toggle { position: static; align-self: stretch; width: 100%; min-height: 2.85rem; margin-bottom: .25rem; background: transparent; border-color: transparent; border-radius: var(--radius-md); }
  .sidebar-collapsed .sidebar-toggle__collapse { display: none; }
  .sidebar-collapsed .sidebar-toggle__expand { display: flex; }
  .page-shell { width: min(100%, var(--content-max)); min-height: calc(100vh - 4rem); margin: 0 auto; padding: var(--page-block-start) var(--page-gutter) var(--page-block-end); }
  .guest-header { min-height: 4.5rem; padding: .85rem var(--page-gutter); background: #fff; border-bottom: 1px solid var(--color-border); } .guest-header .brand { margin: 0; } .is-guest .app-frame { margin-left: 0; } .is-guest .page-shell { display: grid; place-items: center; width: 100%; min-height: calc(100vh - 8rem); }
  .site-footer { display: flex; justify-content: space-between; gap: 1rem; width: min(100%, var(--content-max)); margin: auto auto 0; padding: 1rem var(--page-gutter); border-top: 1px solid var(--color-border); color: var(--color-text-muted); font-size: .7rem; } .site-footer p { margin: 0; }
  @media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; } }
}