/* [project]/app/globals.css [app-client] (css) */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after, ::backdrop {
      --tw-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
    }
  }
}

@layer theme {
  :root, :host {
    --font-sans: var(--font-sans);
    --font-mono: var(--font-mono);
    --spacing: .25rem;
    --tracking-tight: -.025em;
    --radius-sm: var(--radius-sm);
    --radius-md: var(--radius-md);
    --radius-lg: var(--radius-lg);
    --shadow-lg: 0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;
    --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --radius: var(--radius);
    --text-secondary: var(--fs-secondary);
    --radius-tag: var(--radius-tag);
    --radius-pill: var(--radius-pill);
  }
}

@layer base {
  *, :after, :before, ::backdrop {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

  ::file-selector-button {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

  html, :host {
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    line-height: 1.5;
    font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }

  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }

  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }

  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }

  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }

  b, strong {
    font-weight: bolder;
  }

  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }

  small {
    font-size: 80%;
  }

  sub, sup {
    vertical-align: baseline;
    font-size: 75%;
    line-height: 0;
    position: relative;
  }

  sub {
    bottom: -.25em;
  }

  sup {
    top: -.5em;
  }

  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }

  :-moz-focusring:where(:not(iframe)) {
    outline: auto;
  }

  progress {
    vertical-align: baseline;
  }

  summary {
    display: list-item;
  }

  ol, ul, menu {
    list-style: none;
  }

  img, svg, video, canvas, audio, iframe, embed, object {
    vertical-align: middle;
    display: block;
  }

  img, video {
    max-width: 100%;
    height: auto;
  }

  button, input, select, optgroup, textarea {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }

  ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }

  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }

  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }

  ::file-selector-button {
    margin-inline-end: 4px;
  }

  ::placeholder {
    opacity: 1;
  }

  @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentColor;
    }

    @supports (color: color-mix(in lab, red, red)) {
      ::placeholder {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }

  textarea {
    resize: vertical;
  }

  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }

  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }

  ::-webkit-datetime-edit {
    display: inline-flex;
  }

  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }

  ::-webkit-datetime-edit {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-year-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-month-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-day-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-hour-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-minute-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-second-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-millisecond-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }

  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }

  :-moz-ui-invalid {
    box-shadow: none;
  }

  button, input:where([type="button"], [type="reset"], [type="submit"]) {
    appearance: button;
  }

  ::file-selector-button {
    appearance: button;
  }

  ::-webkit-inner-spin-button {
    height: auto;
  }

  ::-webkit-outer-spin-button {
    height: auto;
  }

  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }

  *, :before, :after {
    box-sizing: border-box;
  }

  html {
    background: var(--surface);
  }

  body {
    background: var(--surface);
    color: var(--text-primary);
    font-family: var(--font-sans);
    font-size: var(--fs-body);
    line-height: var(--lh-tight);
    -webkit-font-smoothing: antialiased;
    margin: 0;
    overflow-x: hidden;
  }

  :focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
  }

  code, kbd, samp, pre {
    font-family: var(--font-mono);
    font-size: var(--fs-support);
  }

  .prose, .reading-copy {
    line-height: var(--lh-reading);
  }
}

@layer components {
  .bt-app {
    background: var(--surface);
    flex-direction: column;
    height: 100%;
    display: flex;
  }

  .bt-topbar {
    height: var(--topbar-height);
    background: var(--surface-chrome);
    border-bottom: 1px solid var(--border);
    align-items: center;
    gap: var(--space-5);
    padding: 0 var(--space-6);
    z-index: 5;
    flex: none;
    display: flex;
  }

  .bt-brand {
    font-weight: var(--fw-black);
    letter-spacing: -.02em;
    background: linear-gradient(90deg, var(--accent), var(--accent-2));
    color: #0000;
    -webkit-background-clip: text;
    background-clip: text;
    font-size: 20px;
  }

  .bt-main {
    gap: var(--space-5);
    min-height: 0;
    padding: var(--space-5);
    flex: 1;
    display: flex;
  }

  .bt-sidebar {
    width: var(--sidebar-width);
    background: var(--sidebar);
    flex-direction: column;
    flex: none;
    display: flex;
    overflow-y: auto;
  }

  .bt-rail {
    width: var(--rail-width);
    align-items: center;
    gap: var(--space-2);
    flex-direction: column;
    flex: none;
    display: flex;
  }

  @media (max-width: 768px) {
    .bt-sidebar {
      inset: var(--topbar-height) auto 0 0;
      z-index: 30;
      box-shadow: var(--shadow-lg);
      transition: transform .18s;
      position: fixed;
      transform: translateX(-100%);
    }

    .bt-sidebar.bt-open {
      transform: none;
    }

    .bt-main {
      padding: var(--space-4);
    }
  }

  .bt-panel {
    background: var(--surface-raised);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    flex-direction: column;
    min-width: 0;
    display: flex;
    overflow: hidden;
  }

  .bt-panel-head {
    padding: var(--space-7) var(--space-8) var(--space-4);
    border-bottom: 1px solid var(--border);
  }

  .bt-panel-head h2 {
    font-size: var(--fs-heading);
    font-weight: var(--fw-bold);
    margin: 0;
  }

  .bt-panel-head p {
    margin: var(--space-2) 0 0;
    font-size: var(--fs-support);
    color: var(--text-muted);
  }

  .bt-panel-body {
    padding: var(--space-7) var(--space-8);
    flex: 1;
    overflow-y: auto;
  }

  .bt-card {
    background: var(--surface-raised);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow);
    padding: var(--space-6) var(--space-7);
  }

  .bt-btn {
    height: 34px;
    min-height: 34px;
    padding: 0 var(--space-7);
    border-radius: var(--radius);
    border: 1px solid var(--border);
    background: var(--surface-sunken);
    color: var(--text-primary);
    font: var(--fw-medium) var(--fs-secondary)/1 var(--font-sans);
    cursor: pointer;
    justify-content: center;
    align-items: center;
    gap: var(--space-3);
    display: inline-flex;
  }

  .bt-btn:hover:not(:disabled) {
    background: var(--surface-hover);
  }

  .bt-btn:disabled {
    opacity: .45;
    cursor: not-allowed;
  }

  .bt-btn[aria-busy="true"] {
    opacity: .7;
    cursor: progress;
  }

  .bt-btn-primary {
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    color: var(--accent-text);
    font-weight: var(--fw-active);
    border: none;
  }

  .bt-btn-primary:hover:not(:disabled) {
    filter: brightness(1.07);
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
  }

  .bt-btn-danger {
    color: var(--danger);
    background: var(--danger-subtle);
    border-color: var(--danger-border);
  }

  .bt-btn-ghost {
    color: var(--text-muted);
    background: none;
    border-color: #0000;
  }

  .bt-btn-ghost:hover:not(:disabled) {
    background: var(--surface-hover);
    color: var(--text-primary);
  }

  .bt-iconbtn {
    border-radius: var(--radius);
    width: 36px;
    height: 36px;
    color: var(--text-secondary);
    cursor: pointer;
    background: none;
    border: none;
    justify-content: center;
    align-items: center;
    font-size: 17px;
    display: inline-flex;
  }

  .bt-iconbtn:hover {
    background: var(--surface-hover);
    color: var(--text-primary);
  }

  @media (pointer: coarse) {
    .bt-iconbtn {
      width: 44px;
      height: 44px;
    }
  }

  .bt-nav {
    align-items: center;
    gap: var(--space-5);
    padding: var(--space-4) var(--space-6);
    border-radius: var(--radius);
    color: var(--sidebar-text);
    font-size: var(--fs-secondary);
    cursor: pointer;
    text-decoration: none;
    display: flex;
  }

  .bt-nav:hover {
    background: var(--sidebar-hover);
  }

  .bt-nav.bt-on, .bt-nav[aria-current="page"] {
    background: var(--sidebar-active);
    color: var(--sidebar-active-text);
    font-weight: var(--fw-active);
  }

  .bt-nav .bt-count {
    font-size: var(--fs-support);
    color: var(--text-muted);
    font-weight: var(--fw-medium);
    margin-left: auto;
  }

  .bt-navgroup {
    font-size: 10.5px;
    font-weight: var(--fw-bold);
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--text-muted);
    padding: var(--space-6) var(--space-6) var(--space-2);
  }

  .bt-row {
    gap: var(--space-5);
    padding: var(--space-6) var(--space-7);
    border-bottom: 1px solid var(--border);
    cursor: pointer;
    align-items: flex-start;
    display: flex;
    position: relative;
  }

  .bt-row:hover {
    background: var(--surface-hover);
  }

  .bt-row.bt-on {
    background: var(--accent-subtle);
  }

  .bt-row.bt-on:before {
    content: "";
    background: var(--accent);
    width: 3px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
  }

  .bt-pill {
    font-size: 11.5px;
    font-weight: var(--fw-medium);
    padding: 4px var(--space-6);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border);
    background: var(--surface-raised);
    color: var(--text-secondary);
    cursor: pointer;
    align-items: center;
    gap: var(--space-3);
    white-space: nowrap;
    display: inline-flex;
  }

  .bt-pill:hover {
    background: var(--surface-hover);
  }

  .bt-pill.bt-on {
    background: var(--accent-subtle);
    color: var(--accent-subtle-text);
    border-color: #0000;
  }

  .bt-tag {
    font-size: var(--fs-meta);
    font-weight: var(--fw-active);
    padding: 2px var(--space-4);
    border-radius: var(--radius-tag);
    background: var(--surface-sunken);
    color: var(--text-secondary);
    border: 1px solid var(--border);
  }

  .bt-status {
    border-radius: var(--radius);
    padding: var(--space-4) var(--space-6);
    font-size: 12.5px;
    font-weight: var(--fw-medium);
  }

  .bt-status-success {
    color: var(--success);
    background: var(--success-subtle);
    border: 1px solid var(--success-border);
  }

  .bt-status-warning {
    color: var(--warning);
    background: var(--warning-subtle);
    border: 1px solid var(--warning-border);
  }

  .bt-status-danger {
    color: var(--danger);
    background: var(--danger-subtle);
    border: 1px solid var(--danger-border);
  }

  .bt-status-neutral {
    color: var(--neutral);
    background: var(--neutral-subtle);
    border: 1px solid var(--neutral-border);
  }

  .bt-field {
    gap: var(--space-3);
    flex-direction: column;
    display: flex;
  }

  .bt-label {
    font-size: var(--fs-support);
    font-weight: var(--fw-active);
    color: var(--text-secondary);
  }

  .bt-input {
    border-radius: var(--radius);
    border: 1px solid var(--border);
    background: var(--surface-sunken);
    height: 36px;
    color: var(--text-primary);
    padding: 0 var(--space-6);
    font: var(--fs-secondary)/1 var(--font-sans);
    outline: none;
    width: 100%;
  }

  .bt-input:focus {
    border-color: var(--accent);
    background: var(--surface-raised);
  }

  .bt-input[aria-invalid="true"] {
    border-color: var(--danger);
  }

  .bt-fielderror {
    font-size: var(--fs-support);
    color: var(--danger);
  }

  .bt-stats {
    gap: var(--space-4);
    display: flex;
  }

  .bt-stat {
    background: var(--surface-sunken);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: var(--space-4) var(--space-5);
    flex: 1;
  }

  .bt-stat .bt-n {
    font-size: 17px;
    font-weight: var(--fw-heavy);
  }

  .bt-stat .bt-l {
    color: var(--text-muted);
    margin-top: 1px;
    font-size: 10.5px;
  }

  .bt-avatar {
    border-radius: var(--radius-round);
    width: 34px;
    height: 34px;
    font-weight: var(--fw-bold);
    font-size: var(--fs-body);
    color: var(--accent-text);
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    flex: none;
    justify-content: center;
    align-items: center;
    display: inline-flex;
  }

  .bt-dot {
    border-radius: var(--radius-round);
    flex: none;
    width: 9px;
    height: 9px;
    display: inline-block;
  }

  .bt-empty {
    padding: 56px var(--space-10);
    text-align: center;
    color: var(--text-muted);
    font-size: var(--fs-secondary);
    max-width: 430px;
    margin: auto;
  }

  .bt-empty .bt-big {
    margin-bottom: var(--space-4);
    font-size: 32px;
  }

  .bt-empty strong {
    color: var(--text-primary);
    margin-bottom: var(--space-3);
    display: block;
  }

  .bt-error {
    padding: 40px var(--space-10);
    text-align: center;
    max-width: 430px;
    color: var(--danger);
    font-size: var(--fs-secondary);
    margin: auto;
  }

  .bt-skeleton {
    background: linear-gradient(90deg, var(--surface-sunken) 25%, var(--surface-hover) 37%, var(--surface-sunken) 63%);
    border-radius: var(--radius);
    background-size: 400% 100%;
    animation: 1.4s infinite bt-shimmer;
  }

  .bt-skeleton-line {
    height: 12px;
    margin-bottom: var(--space-4);
  }

  @keyframes bt-shimmer {
    0% {
      background-position: 100%;
    }

    100% {
      background-position: 0;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .bt-skeleton {
      animation: none;
    }
  }

  .bt-menu {
    background: var(--surface-raised);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    padding: var(--space-3);
    min-width: 150px;
  }

  .bt-menuitem {
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4) var(--space-5);
    border-radius: var(--radius-sm);
    font-size: var(--fs-secondary);
    font-weight: var(--fw-medium);
    cursor: pointer;
    color: var(--text-primary);
    display: flex;
  }

  .bt-menuitem:hover {
    background: var(--surface-hover);
  }

  .bt-modal {
    z-index: 40;
    padding: var(--space-8);
    background: #0a0f1980;
    justify-content: center;
    align-items: center;
    display: flex;
    position: fixed;
    inset: 0;
  }

  .bt-sheet {
    background: var(--surface-raised);
    border: 1px solid var(--border);
    width: 860px;
    max-width: 100%;
    max-height: 92vh;
    box-shadow: var(--shadow-lg);
    border-radius: 16px;
    flex-direction: column;
    display: flex;
    overflow: hidden;
  }

  .bt-tablewrap {
    max-width: 100%;
    overflow-x: auto;
  }

  .bt-table {
    border-collapse: collapse;
    width: 100%;
    font-size: var(--fs-secondary);
  }

  .bt-table th {
    text-align: left;
    font-size: var(--fs-meta);
    font-weight: var(--fw-bold);
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--text-muted);
    padding: var(--space-4) var(--space-6);
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
  }

  .bt-table td {
    padding: var(--space-6);
    border-bottom: 1px solid var(--border);
  }

  .bt-table tbody tr:hover {
    background: var(--surface-hover);
  }

  .bt-cat-1 {
    background: var(--cat-blue);
  }

  .bt-cat-2 {
    background: var(--cat-green);
  }

  .bt-cat-3 {
    background: var(--cat-violet);
  }

  .bt-cat-4 {
    background: var(--cat-amber);
  }

  .bt-cat-5 {
    background: var(--cat-teal);
  }

  .bt-cat-6 {
    background: var(--cat-pink);
  }

  .bt-cat-7 {
    background: var(--cat-indigo);
  }

  .bt-cat-8 {
    background: var(--cat-orange);
  }

  .bt-cat-9 {
    background: var(--cat-slate);
  }
}

@layer utilities {
  .pointer-events-none {
    pointer-events: none;
  }

  .visible {
    visibility: visible;
  }

  .sr-only {
    clip-path: inset(50%);
    white-space: nowrap;
    border-width: 0;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    position: absolute;
    overflow: hidden;
  }

  .absolute {
    position: absolute;
  }

  .fixed {
    position: fixed;
  }

  .relative {
    position: relative;
  }

  .inset-0 {
    inset: 0;
  }

  .top-\[2\%\] {
    top: 2%;
  }

  .left-\[6\%\] {
    left: 6%;
  }

  .container {
    width: 100%;
  }

  @media (min-width: 40rem) {
    .container {
      max-width: 40rem;
    }
  }

  @media (min-width: 48rem) {
    .container {
      max-width: 48rem;
    }
  }

  @media (min-width: 64rem) {
    .container {
      max-width: 64rem;
    }
  }

  @media (min-width: 80rem) {
    .container {
      max-width: 80rem;
    }
  }

  @media (min-width: 96rem) {
    .container {
      max-width: 96rem;
    }
  }

  .mx-auto {
    margin-inline: auto;
  }

  .mb-1 {
    margin-bottom: var(--spacing);
  }

  .ml-auto {
    margin-left: auto;
  }

  .block {
    display: block;
  }

  .flex {
    display: flex;
  }

  .grid {
    display: grid;
  }

  .hidden {
    display: none;
  }

  .table {
    display: table;
  }

  .aspect-square {
    aspect-ratio: 1;
  }

  .h-4 {
    height: calc(var(--spacing) * 4);
  }

  .h-5 {
    height: calc(var(--spacing) * 5);
  }

  .h-11 {
    height: calc(var(--spacing) * 11);
  }

  .h-\[54px\] {
    height: 54px;
  }

  .h-\[100dvh\] {
    height: 100dvh;
  }

  .h-full {
    height: 100%;
  }

  .min-h-0 {
    min-height: 0;
  }

  .min-h-\[54px\] {
    min-height: 54px;
  }

  .min-h-\[100dvh\] {
    min-height: 100dvh;
  }

  .w-5 {
    width: calc(var(--spacing) * 5);
  }

  .w-6 {
    width: calc(var(--spacing) * 6);
  }

  .w-\[6\%\] {
    width: 6%;
  }

  .w-full {
    width: 100%;
  }

  .max-w-\[10\.5\%\] {
    max-width: 10.5%;
  }

  .max-w-\[16\%\] {
    max-width: 16%;
  }

  .max-w-\[46ch\] {
    max-width: 46ch;
  }

  .max-w-\[1100px\] {
    max-width: 1100px;
  }

  .min-w-0 {
    min-width: 0;
  }

  .flex-1 {
    flex: 1;
  }

  .flex-\[1\.6\] {
    flex: 1.6;
  }

  .shrink-0 {
    flex-shrink: 0;
  }

  .grow {
    flex-grow: 1;
  }

  .animate-pulse {
    animation: var(--animate-pulse);
  }

  .cursor-pointer {
    cursor: pointer;
  }

  .touch-manipulation {
    touch-action: manipulation;
  }

  .flex-col {
    flex-direction: column;
  }

  .items-baseline {
    align-items: baseline;
  }

  .items-center {
    align-items: center;
  }

  .items-end {
    align-items: flex-end;
  }

  .items-start {
    align-items: flex-start;
  }

  .justify-center {
    justify-content: center;
  }

  .gap-1 {
    gap: var(--spacing);
  }

  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }

  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }

  .gap-\[10px\] {
    gap: 10px;
  }

  .gap-px {
    gap: 1px;
  }

  .overflow-hidden {
    overflow: hidden;
  }

  .overflow-y-auto {
    overflow-y: auto;
  }

  .overscroll-contain {
    overscroll-behavior: contain;
  }

  .rounded {
    border-radius: var(--radius);
  }

  .rounded-lg {
    border-radius: var(--radius-lg);
  }

  .rounded-sm {
    border-radius: var(--radius-sm);
  }

  .rounded-tag {
    border-radius: var(--radius-tag);
  }

  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }

  .border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }

  .border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }

  .border-border {
    border-color: var(--border);
  }

  .bg-\[var\(--grid-block\)\] {
    background-color: var(--grid-block);
  }

  .bg-\[var\(--grid-cell\)\] {
    background-color: var(--grid-cell);
  }

  .bg-\[var\(--grid-line\)\] {
    background-color: var(--grid-line);
  }

  .bg-accent-subtle {
    background-color: var(--accent-subtle);
  }

  .bg-surface-chrome {
    background-color: var(--surface-chrome);
  }

  .bg-surface-raised {
    background-color: var(--surface-raised);
  }

  .bg-surface-sunken {
    background-color: var(--surface-sunken);
  }

  .p-2 {
    padding: calc(var(--spacing) * 2);
  }

  .p-3 {
    padding: calc(var(--spacing) * 3);
  }

  .p-6 {
    padding: calc(var(--spacing) * 6);
  }

  .p-\[10px\] {
    padding: 10px;
  }

  .px-1 {
    padding-inline: var(--spacing);
  }

  .px-2 {
    padding-inline: calc(var(--spacing) * 2);
  }

  .px-3 {
    padding-inline: calc(var(--spacing) * 3);
  }

  .px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }

  .px-\[10px\] {
    padding-inline: 10px;
  }

  .py-1 {
    padding-block: var(--spacing);
  }

  .py-2 {
    padding-block: calc(var(--spacing) * 2);
  }

  .pt-2 {
    padding-top: calc(var(--spacing) * 2);
  }

  .pt-\[10px\] {
    padding-top: 10px;
  }

  .pb-\[6\%\] {
    padding-bottom: 6%;
  }

  .pb-\[max\(6px\,env\(safe-area-inset-bottom\)\)\] {
    padding-bottom: max(6px, env(safe-area-inset-bottom));
  }

  .text-left {
    text-align: left;
  }

  .text-right {
    text-align: right;
  }

  .text-body {
    font-size: var(--fs-body);
  }

  .text-heading {
    font-size: var(--fs-heading);
  }

  .text-meta {
    font-size: var(--fs-meta);
  }

  .text-secondary {
    font-size: var(--fs-secondary);
  }

  .text-support {
    font-size: var(--fs-support);
  }

  .text-title {
    font-size: var(--fs-title);
  }

  .leading-none {
    --tw-leading: 1;
    line-height: 1;
  }

  .font-\[600\] {
    --tw-font-weight: 600;
    font-weight: 600;
  }

  .font-\[650\] {
    --tw-font-weight: 650;
    font-weight: 650;
  }

  .font-\[700\] {
    --tw-font-weight: 700;
    font-weight: 700;
  }

  .font-\[750\] {
    --tw-font-weight: 750;
    font-weight: 750;
  }

  .tracking-\[\.06em\] {
    --tw-tracking: .06em;
    letter-spacing: .06em;
  }

  .tracking-\[\.07em\] {
    --tw-tracking: .07em;
    letter-spacing: .07em;
  }

  .tracking-tight {
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }

  .text-\[var\(--accent-text\)\] {
    color: var(--accent-text);
  }

  .text-\[var\(--grid-number\)\] {
    color: var(--grid-number);
  }

  .text-accent-subtle-text {
    color: var(--accent-subtle-text);
  }

  .text-text-muted {
    color: var(--text-muted);
  }

  .text-text-primary {
    color: var(--text-primary);
  }

  .text-text-secondary {
    color: var(--text-secondary);
  }

  .uppercase {
    text-transform: uppercase;
  }

  .shadow-panel {
    --tw-shadow: var(--shadow);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .outline-offset-\[-2px\] {
    outline-offset: -2px;
  }

  .transition-colors {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .transition-opacity {
    transition-property: opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .select-none {
    -webkit-user-select: none;
    user-select: none;
  }

  @media (hover: hover) {
    .hover\:bg-surface-hover:hover {
      background-color: var(--surface-hover);
    }

    .hover\:text-text-primary:hover {
      color: var(--text-primary);
    }

    .hover\:opacity-90:hover {
      opacity: .9;
    }
  }

  .active\:bg-accent-subtle:active {
    background-color: var(--accent-subtle);
  }

  .active\:text-accent-subtle-text:active {
    color: var(--accent-subtle-text);
  }

  .disabled\:opacity-60:disabled {
    opacity: .6;
  }

  @media (min-width: 40rem) {
    .sm\:block {
      display: block;
    }

    .sm\:flex-row {
      flex-direction: row;
    }

    .sm\:p-3 {
      padding: calc(var(--spacing) * 3);
    }

    .sm\:px-4 {
      padding-inline: calc(var(--spacing) * 4);
    }

    .sm\:text-title {
      font-size: var(--fs-title);
    }
  }

  @media (min-width: 64rem) {
    .lg\:sticky {
      position: sticky;
    }

    .lg\:top-\[10px\] {
      top: 10px;
    }

    .lg\:h-auto {
      height: auto;
    }

    .lg\:max-h-\[60vh\] {
      max-height: 60vh;
    }

    .lg\:min-h-\[100dvh\] {
      min-height: 100dvh;
    }

    .lg\:w-\[min\(56vw\,560px\)\] {
      width: min(56vw, 560px);
    }

    .lg\:flex-1 {
      flex: 1;
    }

    .lg\:flex-col {
      flex-direction: column;
    }

    .lg\:flex-row {
      flex-direction: row;
    }

    .lg\:items-start {
      align-items: flex-start;
    }

    .lg\:overflow-visible {
      overflow: visible;
    }

    .lg\:overflow-y-auto {
      overflow-y: auto;
    }
  }

  @media (min-width: 80rem) {
    .xl\:flex-row {
      flex-direction: row;
    }
  }

  .tap-target {
    min-width: 2.75rem;
    min-height: 2.75rem;
  }

  .bg-brand-gradient {
    background-image: linear-gradient(135deg, var(--accent), var(--accent-2));
  }

  .text-brand-gradient {
    background-image: linear-gradient(90deg, var(--accent), var(--accent-2));
    color: #0000;
    -webkit-background-clip: text;
    background-clip: text;
  }
}

:root {
  --lightningcss-light: initial;
  --lightningcss-dark: ;
  color-scheme: light;
  --surface: #e6eaf0;
  --surface-raised: #fff;
  --surface-chrome: #fff;
  --surface-sunken: #f1f4f8;
  --surface-hover: #eef2f8;
  --sidebar: #eef1f6;
  --border: #dfe4ec;
  --border-strong: #c5cdd9;
  --text-primary: #1e2732;
  --text-secondary: #5a6673;
  --text-muted: #8894a1;
  --text-inverse: #fff;
  --accent: #3b6fe0;
  --accent-2: #6d4de0;
  --accent-hover: #2f5fc8;
  --accent-text: #fff;
  --accent-subtle: #e5eeff;
  --accent-subtle-text: #1b4fd0;
  --success: #12a678;
  --warning: #c98a10;
  --danger: #e5484d;
  --neutral: #8894a1;
  --success-subtle: var(--success);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --success-subtle: color-mix(in srgb, var(--success) 12%, transparent);
  }
}

:root {
  --success-border: var(--success);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --success-border: color-mix(in srgb, var(--success) 28%, transparent);
  }
}

:root {
  --warning-subtle: var(--warning);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --warning-subtle: color-mix(in srgb, var(--warning) 12%, transparent);
  }
}

:root {
  --warning-border: var(--warning);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --warning-border: color-mix(in srgb, var(--warning) 28%, transparent);
  }
}

:root {
  --danger-subtle: var(--danger);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --danger-subtle: color-mix(in srgb, var(--danger) 12%, transparent);
  }
}

:root {
  --danger-border: var(--danger);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --danger-border: color-mix(in srgb, var(--danger) 28%, transparent);
  }
}

:root {
  --neutral-subtle: var(--neutral);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --neutral-subtle: color-mix(in srgb, var(--neutral) 14%, transparent);
  }
}

:root {
  --neutral-border: var(--neutral);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --neutral-border: color-mix(in srgb, var(--neutral) 28%, transparent);
  }
}

:root {
  --sidebar-raised: var(--surface-raised);
  --sidebar-hover: var(--surface-hover);
  --sidebar-border: var(--border);
  --sidebar-text: var(--text-secondary);
  --sidebar-text-muted: var(--text-muted);
  --sidebar-active: var(--accent-subtle);
  --sidebar-active-text: var(--accent-subtle-text);
  --focus-ring: var(--accent);
  --cat-blue: #3b6fe0;
  --cat-green: #12a678;
  --cat-violet: #8b5cf6;
  --cat-amber: #c98a10;
  --cat-teal: #0d9aa0;
  --cat-pink: #d6428a;
  --cat-indigo: #5a4bd6;
  --cat-orange: #e0730f;
  --cat-slate: #8894a1;
  --shadow: 0 1px 2px #141e320f, 0 4px 14px #141e320d;
  --shadow-lg: 0 8px 28px #141e3224;
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --fs-display: 26px;
  --fs-title: 19px;
  --fs-heading: 16px;
  --fs-body: 14px;
  --fs-secondary: 13px;
  --fs-support: 12px;
  --fs-meta: 11px;
  --lh-tight: 1.45;
  --lh-reading: 1.6;
  --fw-medium: 600;
  --fw-active: 650;
  --fw-bold: 700;
  --fw-heavy: 750;
  --fw-black: 800;
  --radius-tag: 6px;
  --radius-sm: 8px;
  --radius: 9px;
  --radius-md: 12px;
  --radius-lg: 14px;
  --radius-pill: 20px;
  --radius-round: 50%;
  --space-1: 2px;
  --space-2: 4px;
  --space-3: 6px;
  --space-4: 8px;
  --space-5: 10px;
  --space-6: 12px;
  --space-7: 14px;
  --space-8: 16px;
  --space-9: 20px;
  --space-10: 24px;
  --topbar-height: 54px;
  --sidebar-width: 212px;
  --rail-width: 52px;
}

.dark, :root[data-theme="dark"] {
  --lightningcss-light: ;
  --lightningcss-dark: initial;
  color-scheme: dark;
  --surface: #0b0e13;
  --surface-raised: #161b23;
  --surface-chrome: #11151c;
  --surface-sunken: #1a2029;
  --surface-hover: #1d2530;
  --sidebar: #0f131a;
  --border: #252d38;
  --border-strong: #35404f;
  --text-primary: #e9edf3;
  --text-secondary: #9aa7b5;
  --text-muted: #6b7784;
  --text-inverse: #0b0e13;
  --accent: #5b8cff;
  --accent-2: #8b6dff;
  --accent-hover: #7ba3ff;
  --accent-subtle: #22314a;
  --accent-subtle-text: #a9c6ff;
  --success: #34d399;
  --warning: #fbbf24;
  --danger: #f87171;
  --neutral: #94a3b8;
  --cat-blue: #5b8cff;
  --cat-green: #34d399;
  --cat-violet: #a78bfa;
  --cat-amber: #fbbf24;
  --cat-teal: #22d3ee;
  --cat-pink: #f472b6;
  --cat-indigo: #a5b4fc;
  --cat-orange: #fb923c;
  --cat-slate: #94a3b8;
  --shadow: 0 1px 2px #0000004d, 0 6px 20px #00000047;
  --shadow-lg: 0 12px 36px #00000073;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not(.light) {
    --lightningcss-light: ;
    --lightningcss-dark: initial;
    color-scheme: dark;
    --surface: #0b0e13;
    --surface-raised: #161b23;
    --surface-chrome: #11151c;
    --surface-sunken: #1a2029;
    --surface-hover: #1d2530;
    --sidebar: #0f131a;
    --border: #252d38;
    --border-strong: #35404f;
    --text-primary: #e9edf3;
    --text-secondary: #9aa7b5;
    --text-muted: #6b7784;
    --text-inverse: #0b0e13;
    --accent: #5b8cff;
    --accent-2: #8b6dff;
    --accent-hover: #7ba3ff;
    --accent-subtle: #22314a;
    --accent-subtle-text: #a9c6ff;
    --success: #34d399;
    --warning: #fbbf24;
    --danger: #f87171;
    --neutral: #94a3b8;
    --cat-blue: #5b8cff;
    --cat-green: #34d399;
    --cat-violet: #a78bfa;
    --cat-amber: #fbbf24;
    --cat-teal: #22d3ee;
    --cat-pink: #f472b6;
    --cat-indigo: #a5b4fc;
    --cat-orange: #fb923c;
    --cat-slate: #94a3b8;
    --shadow: 0 1px 2px #0000004d, 0 6px 20px #00000047;
    --shadow-lg: 0 12px 36px #00000073;
  }
}

:root {
  --grid-block: var(--text-primary);
  --grid-cell: var(--surface-raised);
  --grid-line: var(--border-strong);
  --grid-number: var(--text-muted);
  --grid-letter: var(--text-primary);
  --grid-word: var(--accent-subtle);
  --grid-cursor: var(--accent);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --grid-cursor: color-mix(in srgb, var(--accent) 34%, transparent);
  }
}

:root {
  --grid-wrong: var(--danger);
  --grid-revealed: var(--accent-2);
}

.dark {
  --grid-block: var(--surface);
}

@supports (color: color-mix(in lab, red, red)) {
  .dark {
    --grid-block: color-mix(in srgb, var(--surface) 45%, black);
  }
}

.dark {
  --grid-cell: var(--surface-hover);
  --grid-line: var(--border-strong);
  --grid-cursor: var(--accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .dark {
    --grid-cursor: color-mix(in srgb, var(--accent) 46%, transparent);
  }
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-leading {
  syntax: "*";
  inherits: false
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

@property --tw-tracking {
  syntax: "*";
  inherits: false
}

@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-ring-inset {
  syntax: "*";
  inherits: false
}

@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}

@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}

@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@keyframes pulse {
  50% {
    opacity: .5;
  }
}

/*# sourceMappingURL=app_globals_0yg4wg8.css.map*/