@charset "UTF-8";/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@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-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-ordinal: initial;
      --tw-slashed-zero: initial;
      --tw-numeric-figure: initial;
      --tw-numeric-spacing: initial;
      --tw-numeric-fraction: 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;
      --tw-outline-style: solid;
      --tw-duration: initial;
    }
  }
}

@layer theme;

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

  :where([data-slot], [data-slot] *) {
    border: 0 solid;
    margin: 0;
  }

  :where(button[data-slot], input[data-slot]) {
    background-color: #0000;
    border-radius: 0;
    padding: 0;
  }
}

@layer components;

@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;
  }

  .sticky {
    position: sticky;
  }

  .inset-0 {
    inset: 0;
  }

  .inset-x-0 {
    inset-inline: 0;
  }

  .inset-x-4 {
    inset-inline: 16px;
  }

  .top-0 {
    top: 0;
  }

  .top-1 {
    top: 4px;
  }

  .top-1\.5 {
    top: 6px;
  }

  .top-1\/2 {
    top: 50%;
  }

  .top-2 {
    top: 8px;
  }

  .top-3 {
    top: 12px;
  }

  .top-4 {
    top: 16px;
  }

  .top-\[calc\(12px\+env\(safe-area-inset-top\,0px\)\)\] {
    top: calc(12px + env(safe-area-inset-top, 0px));
  }

  .right-1 {
    right: 4px;
  }

  .right-2 {
    right: 8px;
  }

  .right-2\.5 {
    right: 10px;
  }

  .right-3 {
    right: 12px;
  }

  .right-4 {
    right: 16px;
  }

  .-bottom-4 {
    bottom: -16px;
  }

  .bottom-0 {
    bottom: 0;
  }

  .bottom-1\.5 {
    bottom: 6px;
  }

  .bottom-3 {
    bottom: 12px;
  }

  .bottom-4 {
    bottom: 16px;
  }

  .bottom-\[var\(--toast-bottom\,24px\)\] {
    bottom: var(--toast-bottom, 24px);
  }

  .-left-0\.75 {
    left: -3px;
  }

  .left-1\.5 {
    left: 6px;
  }

  .left-1\/2 {
    left: 50%;
  }

  .left-2\.5 {
    left: 10px;
  }

  .z-2 {
    z-index: 2;
  }

  .z-40 {
    z-index: 40;
  }

  .z-50 {
    z-index: 50;
  }

  .col-span-full {
    grid-column: 1 / -1;
  }

  .container {
    width: 100%;
  }

  @media (min-width: 700px) {
    .container {
      max-width: 700px;
    }
  }

  @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;
    }
  }

  .m-0 {
    margin: 0;
  }

  .-mx-1 {
    margin-inline: -4px;
  }

  .-mx-4 {
    margin-inline: -16px;
  }

  .mx-0\.5 {
    margin-inline: 2px;
  }

  .mx-1 {
    margin-inline: 4px;
  }

  .mx-4 {
    margin-inline: 16px;
  }

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

  .my-1 {
    margin-block: 4px;
  }

  .mt-1 {
    margin-top: 4px;
  }

  .mt-1\.5 {
    margin-top: 6px;
  }

  .mt-2 {
    margin-top: 8px;
  }

  .mt-3 {
    margin-top: 12px;
  }

  .mt-auto {
    margin-top: auto;
  }

  .mr-1 {
    margin-right: 4px;
  }

  .-mb-4 {
    margin-bottom: -16px;
  }

  .mb-1 {
    margin-bottom: 4px;
  }

  .mb-2 {
    margin-bottom: 8px;
  }

  .ml-1 {
    margin-left: 4px;
  }

  .ml-1\.5 {
    margin-left: 6px;
  }

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

  .block {
    display: block;
  }

  .flex {
    display: flex;
  }

  .grid {
    display: grid;
  }

  .hidden {
    display: none;
  }

  .inline {
    display: inline;
  }

  .inline-block {
    display: inline-block;
  }

  .inline-flex {
    display: inline-flex;
  }

  .list-item {
    display: list-item;
  }

  .table {
    display: table;
  }

  .table-cell {
    display: table-cell;
  }

  .table-row {
    display: table-row;
  }

  .aspect-4\/3 {
    aspect-ratio: 4 / 3;
  }

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

  .size-\(--condition-size\) {
    width: var(--condition-size);
    height: var(--condition-size);
  }

  .size-\(--swatch-size\) {
    width: var(--swatch-size);
    height: var(--swatch-size);
  }

  .size-\(--touch\) {
    width: var(--touch);
    height: var(--touch);
  }

  .size-1\.75 {
    width: 7px;
    height: 7px;
  }

  .size-3 {
    width: 12px;
    height: 12px;
  }

  .size-3\.5 {
    width: 14px;
    height: 14px;
  }

  .size-4 {
    width: 16px;
    height: 16px;
  }

  .size-4\.5 {
    width: 18px;
    height: 18px;
  }

  .size-5 {
    width: 20px;
    height: 20px;
  }

  .size-5\.5 {
    width: 22px;
    height: 22px;
  }

  .size-6 {
    width: 24px;
    height: 24px;
  }

  .size-7 {
    width: 28px;
    height: 28px;
  }

  .size-8 {
    width: 32px;
    height: 32px;
  }

  .size-10 {
    width: 40px;
    height: 40px;
  }

  .size-11 {
    width: 44px;
    height: 44px;
  }

  .size-12 {
    width: 48px;
    height: 48px;
  }

  .size-50 {
    width: 200px;
    height: 200px;
  }

  .size-\[65\%\] {
    width: 65%;
    height: 65%;
  }

  .size-full {
    width: 100%;
    height: 100%;
  }

  .size-px {
    width: 1px;
    height: 1px;
  }

  .h-1\.5 {
    height: 6px;
  }

  .h-3 {
    height: 12px;
  }

  .h-4\.5 {
    height: 18px;
  }

  .h-5 {
    height: 20px;
  }

  .h-5\.5 {
    height: 22px;
  }

  .h-6\.5 {
    height: 26px;
  }

  .h-14 {
    height: 56px;
  }

  .h-\[min\(60vh\,480px\)\] {
    height: min(60vh, 480px);
  }

  .h-auto {
    height: auto;
  }

  .h-full {
    height: 100%;
  }

  .h-px {
    height: 1px;
  }

  .max-h-\(--reka-dropdown-menu-content-available-height\) {
    max-height: var(--reka-dropdown-menu-content-available-height);
  }

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

  .max-h-\[calc\(100\%-32px\)\] {
    max-height: calc(100% - 32px);
  }

  .max-h-\[calc\(100dvh-32px\)\] {
    max-height: calc(100dvh - 32px);
  }

  .min-h-\(--touch\) {
    min-height: var(--touch);
  }

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

  .min-h-6 {
    min-height: 24px;
  }

  .min-h-6\.5 {
    min-height: 26px;
  }

  .min-h-8 {
    min-height: 32px;
  }

  .min-h-8\.5 {
    min-height: 34px;
  }

  .min-h-9 {
    min-height: 36px;
  }

  .min-h-10 {
    min-height: 40px;
  }

  .min-h-16 {
    min-height: 64px;
  }

  .min-h-45 {
    min-height: 180px;
  }

  .min-h-full {
    min-height: 100%;
  }

  .w-1\.5 {
    width: 6px;
  }

  .w-7 {
    width: 28px;
  }

  .w-8 {
    width: 32px;
  }

  .w-10 {
    width: 40px;
  }

  .w-13 {
    width: 52px;
  }

  .w-14 {
    width: 56px;
  }

  .w-15 {
    width: 60px;
  }

  .w-16 {
    width: 64px;
  }

  .w-18 {
    width: 72px;
  }

  .w-20 {
    width: 80px;
  }

  .w-24 {
    width: 96px;
  }

  .w-28 {
    width: 112px;
  }

  .w-32 {
    width: 128px;
  }

  .w-45 {
    width: 180px;
  }

  .w-72 {
    width: 288px;
  }

  .w-90 {
    width: 360px;
  }

  .w-120 {
    width: 480px;
  }

  .w-\[min\(420px\,calc\(100vw-32px\)\)\] {
    width: min(420px, 100vw - 32px);
  }

  .w-\[min\(640px\,calc\(100vw-32px\)\)\] {
    width: min(640px, 100vw - 32px);
  }

  .w-\[min\(680px\,calc\(100vw-32px\)\)\] {
    width: min(680px, 100vw - 32px);
  }

  .w-\[min\(760px\,calc\(100vw-32px\)\)\] {
    width: min(760px, 100vw - 32px);
  }

  .w-fit {
    width: fit-content;
  }

  .w-full {
    width: 100%;
  }

  .w-px {
    width: 1px;
  }

  .max-w-60 {
    max-width: 240px;
  }

  .max-w-80 {
    max-width: 320px;
  }

  .max-w-90 {
    max-width: 360px;
  }

  .max-w-120 {
    max-width: 480px;
  }

  .max-w-160 {
    max-width: 640px;
  }

  .max-w-200 {
    max-width: 800px;
  }

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

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

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

  .max-w-\[calc\(100\%-32px\)\] {
    max-width: calc(100% - 32px);
  }

  .max-w-\[min\(528px\,calc\(100\%-32px\)\)\] {
    max-width: min(528px, 100% - 32px);
  }

  .max-w-\[min\(640px\,calc\(100\%-32px\)\)\] {
    max-width: min(640px, 100% - 32px);
  }

  .max-w-full {
    max-width: 100%;
  }

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

  .min-w-7 {
    min-width: 28px;
  }

  .min-w-40 {
    min-width: 160px;
  }

  .min-w-80 {
    min-width: 320px;
  }

  .min-w-\[1\.4em\] {
    min-width: 1.4em;
  }

  .min-w-\[2\.5ch\] {
    min-width: 2.5ch;
  }

  .min-w-\[3ch\] {
    min-width: 3ch;
  }

  .min-w-\[180px\] {
    min-width: 180px;
  }

  .flex-1 {
    flex: 1;
  }

  .flex-\[1_0_180px\] {
    flex: 1 0 180px;
  }

  .flex-none {
    flex: none;
  }

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

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

  .grow {
    flex-grow: 1;
  }

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

  .basis-full {
    flex-basis: 100%;
  }

  .border-collapse {
    border-collapse: collapse;
  }

  .-translate-x-1\/2 {
    --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .-translate-y-1\/2 {
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .-translate-y-full {
    --tw-translate-y: -100%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .transform {
    transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
  }

  .animate-fade-in {
    animation: .15s ease-out fade-in;
  }

  .animate-spin {
    animation: 1s linear infinite spin;
  }

  .animate-turn {
    animation: 1.2s ease-in-out infinite turn-pulse;
  }

  .cursor-col-resize {
    cursor: col-resize;
  }

  .cursor-grab {
    cursor: grab;
  }

  .cursor-pointer {
    cursor: pointer;
  }

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

  .resize {
    resize: both;
  }

  .list-none {
    list-style-type: none;
  }

  .appearance-none {
    appearance: none;
  }

  .grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .grid-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .grid-cols-\[280px_minmax\(0\,1fr\)\] {
    grid-template-columns: 280px minmax(0, 1fr);
  }

  .grid-cols-\[300px_minmax\(0\,1fr\)\] {
    grid-template-columns: 300px minmax(0, 1fr);
  }

  .grid-cols-\[auto_minmax\(0\,1fr\)_var\(--aside\)\] {
    grid-template-columns: auto minmax(0,1fr) var(--aside);
  }

  .grid-cols-\[minmax\(280px\,380px\)_minmax\(280px\,480px\)\] {
    grid-template-columns: minmax(280px, 380px) minmax(280px, 480px);
  }

  .grid-cols-\[repeat\(3\,52px\)\] {
    grid-template-columns: repeat(3, 52px);
  }

  .grid-cols-\[repeat\(auto-fill\,minmax\(3\.5rem\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fill, minmax(3.5rem, 1fr));
  }

  .grid-cols-\[repeat\(auto-fill\,minmax\(44px\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fill, minmax(44px, 1fr));
  }

  .grid-cols-\[repeat\(auto-fill\,minmax\(200px\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  }

  .grid-cols-\[repeat\(auto-fill\,minmax\(300px\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  }

  .grid-cols-\[repeat\(auto-fill\,minmax\(320px\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  }

  .grid-cols-\[repeat\(auto-fill\,minmax\(340px\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  }

  .grid-cols-\[…\] {
    grid-template-columns: …;
  }

  .grid-rows-\[repeat\(3\,52px\)\] {
    grid-template-rows: repeat(3, 52px);
  }

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

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

  .flex-wrap {
    flex-wrap: wrap;
  }

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

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

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

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

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

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

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

  .justify-between {
    justify-content: space-between;
  }

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

  .justify-end {
    justify-content: flex-end;
  }

  .justify-start {
    justify-content: flex-start;
  }

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

  .gap-0 {
    gap: 0;
  }

  .gap-0\.5 {
    gap: 2px;
  }

  .gap-1 {
    gap: 4px;
  }

  .gap-1\.5 {
    gap: 6px;
  }

  .gap-2 {
    gap: 8px;
  }

  .gap-2\.5 {
    gap: 10px;
  }

  .gap-3 {
    gap: 12px;
  }

  .gap-4 {
    gap: 16px;
  }

  .gap-x-2 {
    column-gap: 8px;
  }

  .gap-x-2\.5 {
    column-gap: 10px;
  }

  .gap-x-3 {
    column-gap: 12px;
  }

  .gap-x-4 {
    column-gap: 16px;
  }

  .gap-y-0\.5 {
    row-gap: 2px;
  }

  .gap-y-1 {
    row-gap: 4px;
  }

  .gap-y-2 {
    row-gap: 8px;
  }

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

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

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

  .justify-self-start {
    justify-self: flex-start;
  }

  .truncate {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }

  .overflow-hidden {
    overflow: hidden;
  }

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

  .rounded-full {
    border-radius: 9999px;
  }

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

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

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

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

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

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

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

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

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

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

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

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

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

  .border-l-3 {
    border-left-style: var(--tw-border-style);
    border-left-width: 3px;
  }

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

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

  .border-current {
    border-color: currentColor;
  }

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

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

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

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

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

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

  .border-transparent {
    border-color: #0000;
  }

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

  .border-t-border {
    border-top-color: var(--line);
  }

  .border-t-primary {
    border-top-color: var(--accent);
  }

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

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

  .bg-border {
    background-color: var(--line);
  }

  .bg-border-strong {
    background-color: var(--line-strong);
  }

  .bg-card {
    background-color: var(--bg-2);
  }

  .bg-danger-bg, .bg-danger-bg\/92 {
    background-color: var(--danger-bg);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-danger-bg\/92 {
      background-color: color-mix(in oklab, var(--danger-bg) 92%, transparent);
    }
  }

  .bg-destructive {
    background-color: var(--danger);
  }

  .bg-foreground {
    background-color: var(--text);
  }

  .bg-hp-track {
    background-color: var(--hp-track);
  }

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

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

  .bg-muted {
    background-color: var(--bg-3);
  }

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

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

  .bg-popover {
    background-color: var(--bg-2);
  }

  .bg-primary, .bg-primary\/85 {
    background-color: var(--accent);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-primary\/85 {
      background-color: color-mix(in oklab, var(--accent) 85%, transparent);
    }
  }

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

  .bg-secondary, .bg-secondary\/85 {
    background-color: var(--bg-3);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-secondary\/85 {
      background-color: color-mix(in oklab, var(--bg-3) 85%, transparent);
    }
  }

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

  .bg-success {
    background-color: var(--ok);
  }

  .bg-transparent {
    background-color: #0000;
  }

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

  .fill-current {
    fill: currentColor;
  }

  .object-contain {
    object-fit: contain;
  }

  .object-cover {
    object-fit: cover;
  }

  .p-0 {
    padding: 0;
  }

  .p-0\.5 {
    padding: 2px;
  }

  .p-1 {
    padding: 4px;
  }

  .p-1\.5 {
    padding: 6px;
  }

  .p-2 {
    padding: 8px;
  }

  .p-3 {
    padding: 12px;
  }

  .p-3\.5 {
    padding: 14px;
  }

  .p-4 {
    padding: 16px;
  }

  .p-4\.5 {
    padding: 18px;
  }

  .p-6 {
    padding: 24px;
  }

  .p-8 {
    padding: 32px;
  }

  .px-0 {
    padding-inline: 0;
  }

  .px-0\.75 {
    padding-inline: 3px;
  }

  .px-1 {
    padding-inline: 4px;
  }

  .px-1\.25 {
    padding-inline: 5px;
  }

  .px-2 {
    padding-inline: 8px;
  }

  .px-2\.5 {
    padding-inline: 10px;
  }

  .px-3 {
    padding-inline: 12px;
  }

  .px-3\.5 {
    padding-inline: 14px;
  }

  .px-4 {
    padding-inline: 16px;
  }

  .py-0\.5 {
    padding-block: 2px;
  }

  .py-0\.75 {
    padding-block: 3px;
  }

  .py-1 {
    padding-block: 4px;
  }

  .py-1\.5 {
    padding-block: 6px;
  }

  .py-1\.75 {
    padding-block: 7px;
  }

  .py-2 {
    padding-block: 8px;
  }

  .py-2\.5 {
    padding-block: 10px;
  }

  .py-3 {
    padding-block: 12px;
  }

  .py-px {
    padding-block: 1px;
  }

  .pt-1\.5 {
    padding-top: 6px;
  }

  .pt-2 {
    padding-top: 8px;
  }

  .pt-4 {
    padding-top: 16px;
  }

  .pt-\[calc\(10px\+env\(safe-area-inset-top\,0px\)\)\] {
    padding-top: calc(10px + env(safe-area-inset-top, 0px));
  }

  .pt-\[calc\(32px\+env\(safe-area-inset-top\,0px\)\)\] {
    padding-top: calc(32px + env(safe-area-inset-top, 0px));
  }

  .pr-1 {
    padding-right: 4px;
  }

  .pr-1\.5 {
    padding-right: 6px;
  }

  .pr-7 {
    padding-right: 28px;
  }

  .pr-8 {
    padding-right: 32px;
  }

  .pb-1 {
    padding-bottom: 4px;
  }

  .pb-2 {
    padding-bottom: 8px;
  }

  .pb-2\.5 {
    padding-bottom: 10px;
  }

  .pb-3 {
    padding-bottom: 12px;
  }

  .pb-24 {
    padding-bottom: 96px;
  }

  .pb-\[calc\(32px\+env\(safe-area-inset-bottom\,0px\)\)\] {
    padding-bottom: calc(32px + env(safe-area-inset-bottom, 0px));
  }

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

  .pl-1\.5 {
    padding-left: 6px;
  }

  .pl-2 {
    padding-left: 8px;
  }

  .pl-3 {
    padding-left: 12px;
  }

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

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

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

  .align-middle {
    vertical-align: middle;
  }

  .\[font-family\:inherit\] {
    font-family: inherit;
  }

  .font-mono {
    font-family: var(--font-mono);
  }

  .text-2xl {
    font-size: var(--text-2xl);
  }

  .text-3xl {
    font-size: var(--text-3xl);
  }

  .text-4xl {
    font-size: var(--text-4xl);
  }

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

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

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

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

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

  .leading-\[1\.35\] {
    --tw-leading: 1.35;
    line-height: 1.35;
  }

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

  .leading-snug {
    --tw-leading: 1.375;
    line-height: 1.375;
  }

  .font-bold {
    --tw-font-weight: 700;
    font-weight: 700;
  }

  .font-normal {
    --tw-font-weight: 400;
    font-weight: 400;
  }

  .font-semibold {
    --tw-font-weight: 600;
    font-weight: 600;
  }

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

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

  .tracking-caps {
    --tw-tracking: .06em;
    letter-spacing: .06em;
  }

  .wrap-anywhere {
    overflow-wrap: anywhere;
  }

  .break-all {
    word-break: break-all;
  }

  .whitespace-normal {
    white-space: normal;
  }

  .whitespace-nowrap {
    white-space: nowrap;
  }

  .text-accent-foreground, .text-card-foreground {
    color: var(--text);
  }

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

  .text-destructive {
    color: var(--danger);
  }

  .text-destructive-foreground {
    color: var(--on-danger);
  }

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

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

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

  .text-inherit {
    color: inherit;
  }

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

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

  .text-popover-foreground {
    color: var(--text);
  }

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

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

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

  .text-selected-foreground {
    color: var(--accent-2);
  }

  .text-success {
    color: var(--ok);
  }

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

  .uppercase {
    text-transform: uppercase;
  }

  .italic {
    font-style: italic;
  }

  .tabular-nums {
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal, ) var(--tw-slashed-zero, ) var(--tw-numeric-figure, ) var(--tw-numeric-spacing, ) var(--tw-numeric-fraction, );
  }

  .line-through {
    text-decoration-line: line-through;
  }

  .underline-offset-2 {
    text-underline-offset: 2px;
  }

  .opacity-50 {
    opacity: .5;
  }

  .opacity-70 {
    opacity: .7;
  }

  .opacity-85 {
    opacity: .85;
  }

  .shadow-\[0_0_0_1px_var\(--letterbox\)\] {
    --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--letterbox));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-md {
    --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);
  }

  .ring, .ring-1 {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .ring-2 {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .ring-destructive {
    --tw-ring-color: var(--danger);
  }

  .ring-primary, .ring-ring {
    --tw-ring-color: var(--accent);
  }

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

  .outline-2 {
    outline-style: var(--tw-outline-style);
    outline-width: 2px;
  }

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

  .transition-\[width\] {
    transition-property: width;
    transition-timing-function: var(--tw-ease, cubic-bezier(.4, 0, .2, 1));
    transition-duration: var(--tw-duration, .15s);
  }

  .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, cubic-bezier(.4, 0, .2, 1));
    transition-duration: var(--tw-duration, .15s);
  }

  .transition-transform {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, cubic-bezier(.4, 0, .2, 1));
    transition-duration: var(--tw-duration, .15s);
  }

  .duration-250 {
    --tw-duration: .25s;
    transition-duration: .25s;
  }

  .outline-none {
    --tw-outline-style: none;
    outline-style: none;
  }

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

  .\[--toast-bottom\:calc\(80px\+env\(safe-area-inset-bottom\,0px\)\)\] {
    --toast-bottom: calc(80px + env(safe-area-inset-bottom, 0px));
  }

  .\[text-shadow\:0_1px_2px_var\(--letterbox\)\] {
    text-shadow: 0 1px 2px var(--letterbox);
  }

  :is(.\*\:pointer-events-auto > *) {
    pointer-events: auto;
  }

  @media (hover: hover) {
    .group-hover\:opacity-100:is(:where(.group):hover *) {
      opacity: 1;
    }
  }

  .group-data-\[state\=open\]\:rotate-90:is(:where(.group)[data-state="open"] *) {
    rotate: 90deg;
  }

  .placeholder\:text-faint::placeholder {
    color: var(--faint);
  }

  .last\:border-b-0:last-child {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 0;
  }

  @media (hover: hover) {
    .hover\:border-border:hover {
      border-color: var(--line);
    }

    .hover\:border-border-strong:hover {
      border-color: var(--line-strong);
    }

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

    .hover\:bg-danger-bg:hover {
      background-color: var(--danger-bg);
    }

    .hover\:bg-primary:hover {
      background-color: var(--accent);
    }

    .hover\:bg-primary-hover:hover {
      background-color: var(--accent-2);
    }

    .hover\:bg-primary\/40:hover {
      background-color: var(--accent);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-primary\/40:hover {
        background-color: color-mix(in oklab, var(--accent) 40%, transparent);
      }
    }

    .hover\:bg-secondary:hover {
      background-color: var(--bg-3);
    }

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

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

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

    .hover\:underline:hover {
      text-decoration-line: underline;
    }
  }

  .focus-visible\:border-ring:focus-visible {
    border-color: var(--accent);
  }

  .focus-visible\:bg-background:focus-visible {
    background-color: var(--bg);
  }

  .focus-visible\:opacity-100:focus-visible {
    opacity: 1;
  }

  .focus-visible\:ring-2:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .focus-visible\:ring-ring:focus-visible {
    --tw-ring-color: var(--accent);
  }

  .focus-visible\:outline-none:focus-visible {
    --tw-outline-style: none;
    outline-style: none;
  }

  .focus-visible\:ring-inset:focus-visible {
    --tw-ring-inset: inset;
  }

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

  .active\:text-primary-foreground:active {
    color: var(--on-accent);
  }

  .disabled\:pointer-events-none:disabled {
    pointer-events: none;
  }

  .disabled\:cursor-default:disabled {
    cursor: default;
  }

  .disabled\:cursor-not-allowed:disabled {
    cursor: not-allowed;
  }

  .disabled\:opacity-45:disabled {
    opacity: .45;
  }

  .disabled\:opacity-50:disabled {
    opacity: .5;
  }

  .data-disabled\:pointer-events-none[data-disabled] {
    pointer-events: none;
  }

  .data-disabled\:opacity-45[data-disabled] {
    opacity: .45;
  }

  .data-highlighted\:bg-accent[data-highlighted] {
    background-color: var(--bg-hover);
  }

  .data-highlighted\:bg-danger-bg[data-highlighted] {
    background-color: var(--danger-bg);
  }

  .data-selected\:border-primary[data-selected] {
    border-color: var(--accent);
  }

  .data-selected\:bg-selected-soft[data-selected] {
    background-color: var(--accent-soft);
  }

  @media (hover: hover) {
    .data-selected\:hover\:bg-selected-soft[data-selected]:hover {
      background-color: var(--accent-soft);
    }
  }

  .data-\[state\=active\]\:border-primary[data-state="active"] {
    border-color: var(--accent);
  }

  .data-\[state\=active\]\:text-foreground[data-state="active"] {
    color: var(--text);
  }

  .data-\[state\=active\]\:text-primary-foreground[data-state="active"] {
    color: var(--on-accent);
  }

  .data-\[state\=active\]\:text-selected-foreground[data-state="active"] {
    color: var(--accent-2);
  }

  .data-\[state\=checked\]\:translate-x-3\.5[data-state="checked"] {
    --tw-translate-x: calc(4px * 3.5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .data-\[state\=checked\]\:border-primary[data-state="checked"] {
    border-color: var(--accent);
  }

  .data-\[state\=checked\]\:bg-primary[data-state="checked"] {
    background-color: var(--accent);
  }

  .data-\[state\=checked\]\:bg-primary-foreground[data-state="checked"] {
    background-color: var(--on-accent);
  }

  .data-\[state\=closed\]\:animate-dialog-out[data-state="closed"] {
    animation: .12s ease-in forwards dialog-out;
  }

  .data-\[state\=closed\]\:animate-fade-out[data-state="closed"] {
    animation: .12s ease-in forwards fade-out;
  }

  .data-\[state\=on\]\:border-primary[data-state="on"] {
    border-color: var(--accent);
  }

  .data-\[state\=on\]\:bg-selected[data-state="on"] {
    background-color: var(--accent-bg);
  }

  .data-\[state\=on\]\:bg-transparent[data-state="on"] {
    background-color: #0000;
  }

  .data-\[state\=on\]\:font-semibold[data-state="on"] {
    --tw-font-weight: 600;
    font-weight: 600;
  }

  .data-\[state\=on\]\:text-selected-foreground[data-state="on"] {
    color: var(--accent-2);
  }

  .data-\[state\=on\]\:ring-2[data-state="on"] {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .data-\[state\=on\]\:ring-primary[data-state="on"] {
    --tw-ring-color: var(--accent);
  }

  .data-\[state\=open\]\:animate-dialog-in[data-state="open"] {
    animation: .15s ease-out dialog-in;
  }

  .data-\[state\=open\]\:animate-fade-in[data-state="open"] {
    animation: .15s ease-out fade-in;
  }

  .data-\[state\=open\]\:border[data-state="open"] {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }

  .data-\[state\=open\]\:border-primary[data-state="open"] {
    border-color: var(--accent);
  }

  .data-\[state\=open\]\:bg-selected[data-state="open"] {
    background-color: var(--accent-bg);
  }

  .data-\[state\=open\]\:text-selected-foreground[data-state="open"] {
    color: var(--accent-2);
  }

  .data-\[state\=open\]\:opacity-100[data-state="open"] {
    opacity: 1;
  }

  :is(.data-\[state\=selected\]\:\*\:bg-selected-soft[data-state="selected"] > *) {
    background-color: var(--accent-soft);
  }

  :is(.data-\[state\=selected\]\:\*\:first\:shadow-row-selected[data-state="selected"] > *):first-child {
    --tw-shadow: var(--row-selected-shadow);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  @media (min-width: 700px) {
    .tablet\:col-span-full {
      grid-column: 1 / -1;
    }

    .tablet\:mx-6 {
      margin-inline: 24px;
    }

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

    .tablet\:mt-4 {
      margin-top: 16px;
    }

    .tablet\:grid {
      display: grid;
    }

    .tablet\:aspect-auto {
      aspect-ratio: auto;
    }

    .tablet\:size-5 {
      width: 20px;
      height: 20px;
    }

    .tablet\:h-\[max\(360px\,calc\(100dvh-470px\)\)\] {
      height: max(360px, 100dvh - 470px);
    }

    .tablet\:max-h-none {
      max-height: none;
    }

    .tablet\:w-full {
      width: 100%;
    }

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

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

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

    .tablet\:flex-\[0_1_200px\] {
      flex: 0 200px;
    }

    .tablet\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tablet\:grid-cols-6 {
      grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .tablet\:grid-cols-\[repeat\(3\,60px\)\] {
      grid-template-columns: repeat(3, 60px);
    }

    .tablet\:grid-cols-\[repeat\(auto-fill\,minmax\(320px\,1fr\)\)\] {
      grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    }

    .tablet\:grid-rows-\[repeat\(3\,60px\)\] {
      grid-template-rows: repeat(3, 60px);
    }

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

    .tablet\:content-start {
      align-content: flex-start;
    }

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

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

    .tablet\:gap-2 {
      gap: 8px;
    }

    .tablet\:gap-2\.5 {
      gap: 10px;
    }

    .tablet\:gap-3\.5 {
      gap: 14px;
    }

    .tablet\:gap-4 {
      gap: 16px;
    }

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

    .tablet\:bg-primary {
      background-color: var(--accent);
    }

    .tablet\:px-4 {
      padding-inline: 16px;
    }

    .tablet\:px-5 {
      padding-inline: 20px;
    }

    .tablet\:px-6 {
      padding-inline: 24px;
    }

    .tablet\:py-3 {
      padding-block: 12px;
    }

    .tablet\:py-3\.5 {
      padding-block: 14px;
    }

    .tablet\:py-4 {
      padding-block: 16px;
    }

    .tablet\:pt-2 {
      padding-top: 8px;
    }

    .tablet\:pt-6 {
      padding-top: 24px;
    }

    .tablet\:pt-\[calc\(14px\+env\(safe-area-inset-top\,0px\)\)\] {
      padding-top: calc(14px + env(safe-area-inset-top, 0px));
    }

    .tablet\:pt-\[calc\(48px\+env\(safe-area-inset-top\,0px\)\)\] {
      padding-top: calc(48px + env(safe-area-inset-top, 0px));
    }

    .tablet\:pb-3\.5 {
      padding-bottom: 14px;
    }

    .tablet\:pb-28 {
      padding-bottom: 112px;
    }

    .tablet\:pb-\[calc\(8px\+env\(safe-area-inset-bottom\,0px\)\)\] {
      padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));
    }

    .tablet\:pb-\[calc\(48px\+env\(safe-area-inset-bottom\,0px\)\)\] {
      padding-bottom: calc(48px + env(safe-area-inset-bottom, 0px));
    }

    .tablet\:text-base {
      font-size: var(--text-base);
    }

    .tablet\:text-xl {
      font-size: var(--text-xl);
    }

    .tablet\:font-semibold {
      --tw-font-weight: 600;
      font-weight: 600;
    }

    .tablet\:\[--toast-bottom\:calc\(88px\+env\(safe-area-inset-bottom\,0px\)\)\] {
      --toast-bottom: calc(88px + env(safe-area-inset-bottom, 0px));
    }

    .tablet\:data-\[state\=active\]\:bg-primary[data-state="active"] {
      background-color: var(--accent);
    }

    .tablet\:data-\[state\=active\]\:bg-secondary[data-state="active"] {
      background-color: var(--bg-3);
    }
  }

  @media (pointer: coarse) {
    .pointer-coarse\:size-4 {
      width: 16px;
      height: 16px;
    }

    .pointer-coarse\:min-h-8 {
      min-height: 32px;
    }

    .pointer-coarse\:min-h-11 {
      min-height: 44px;
    }

    .pointer-coarse\:min-w-8 {
      min-width: 32px;
    }

    .pointer-coarse\:py-0\.5 {
      padding-block: 2px;
    }

    .pointer-coarse\:pr-0\.5 {
      padding-right: 2px;
    }

    .pointer-coarse\:pl-2 {
      padding-left: 8px;
    }

    .pointer-coarse\:text-sm {
      font-size: var(--text-sm);
    }
  }

  @media (min-width: 900px) and (orientation: landscape) {
    .tablet-landscape\:col-start-2 {
      grid-column-start: 2;
    }

    .tablet-landscape\:grid {
      display: grid;
    }

    .tablet-landscape\:h-\[max\(360px\,calc\(100dvh-250px\)\)\] {
      height: max(360px, 100dvh - 250px);
    }

    .tablet-landscape\:grid-cols-\[minmax\(0\,1fr\)_260px\] {
      grid-template-columns: minmax(0, 1fr) 260px;
    }

    .tablet-landscape\:flex-col {
      flex-direction: column;
    }

    .tablet-landscape\:items-start {
      align-items: flex-start;
    }

    .tablet-landscape\:items-stretch {
      align-items: stretch;
    }

    .tablet-landscape\:justify-start {
      justify-content: flex-start;
    }

    .tablet-landscape\:gap-4 {
      gap: 16px;
    }

    .tablet-landscape\:self-center {
      align-self: center;
    }
  }

  .\[\&_\[data-slot\=input\]\]\:text-base [data-slot="input"] {
    font-size: var(--text-base);
  }

  .\[\&_\[data-slot\=input\]\]\:text-xl [data-slot="input"] {
    font-size: var(--text-xl);
  }

  .\[\&_svg\]\:pointer-events-none svg {
    pointer-events: none;
  }

  .\[\&_svg\]\:shrink-0 svg {
    flex-shrink: 0;
  }

  .\[\&_svg\:not\(\[class\*\=size-\]\)\]\:size-3 svg:not([class*="size-"]) {
    width: 12px;
    height: 12px;
  }

  .\[\&_svg\:not\(\[class\*\=size-\]\)\]\:size-3\.5 svg:not([class*="size-"]) {
    width: 14px;
    height: 14px;
  }

  .\[\&_svg\:not\(\[class\*\=size-\]\)\]\:size-4 svg:not([class*="size-"]) {
    width: 16px;
    height: 16px;
  }

  .\[\&_svg\:not\(\[class\*\=size-\]\)\]\:size-5 svg:not([class*="size-"]) {
    width: 20px;
    height: 20px;
  }

  .\[\&_svg\:not\(\[class\*\=size-\]\)\]\:size-6 svg:not([class*="size-"]) {
    width: 24px;
    height: 24px;
  }

  .\[\&\:\:-webkit-inner-spin-button\]\:appearance-none::-webkit-inner-spin-button {
    appearance: none;
  }

  .\[\&\:\:-webkit-outer-spin-button\]\:appearance-none::-webkit-outer-spin-button {
    appearance: none;
  }
}

@keyframes turn-pulse {
  50% {
    opacity: .75;
  }
}

@keyframes fade-in {
  from {
    opacity: 0;
  }
}

@keyframes dialog-in {
  from {
    opacity: 0;
    scale: .96;
  }
}

@keyframes fade-out {
  to {
    opacity: 0;
  }
}

@keyframes dialog-out {
  to {
    opacity: 0;
    scale: .96;
  }
}

@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

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

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

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

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

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

@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-ordinal {
  syntax: "*";
  inherits: false
}

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

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

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

@property --tw-numeric-fraction {
  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;
}

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

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

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

@layer base {
  :root {
    /* Sfondi e linee */
    --bg: #14161c;
    --bg-2: #1c1f27;
    --bg-3: #252935;
    --bg-hover: #2e3341;
    --line: #333847;
    --line-strong: #4a5063;
    /* Testo */
    --text: #e8e6e1;
    --muted: #9aa0ad;
    --faint: #6b6f7a;
    /* Accento (oro): pieno, chiaro, testo sopra l'accento, sfondi per attivo e selezionato */
    --accent: #d9a441;
    --accent-2: #f0c060;
    --on-accent: #1b1405;
    --accent-bg: #3b3420;
    --accent-soft: #2c2718;
    /* Stati */
    --danger: #e05252;
    --on-danger: #fff;
    --danger-text: #ffb4b4;
    --danger-line: #6b2f2f;
    --danger-bg: #5a1d1d;
    --ok: #4caf50;
    --ok-text: #8fd694;
    --ok-bg: #1e3a21;
    --warn: #e0a030;
    --info: #3fa7d6;
    --hp-track: #3a2626;
    /* Monete: oro, argento, rame */
    --coin-mo: #e8b923;
    --coin-ma: #b8bec9;
    --coin-mr: #c27a44;
    /* Sfondo del QR (deve restare chiaro per essere letto) e delle immagini contenute (bande ai lati) */
    --qr-bg: #fff;
    --letterbox: #000;
    /* Velo sotto le finestre modali */
    --overlay: rgb(0 0 0 / 55%);
    /* Sfondo più scuro della proiezione e dello stage della mappa */
    --bg-deep: #0b0c10;
    /* Caratteri */
    --font: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --font-title: Georgia, 'Times New Roman', serif;
    --font-mono: ui-monospace, Consolas, monospace;
    /* Scala tipografica (1rem = 14px): le dimensioni assolute usano solo questi valori.
       Gli em restano per i ritocchi relativi al contenitore, i cqh per la proiezione */
    --text-xs: 0.78rem;
    --text-sm: 0.86rem;
    --text-base: 1rem;
    --text-lg: 1.15rem;
    --text-xl: 1.3rem;
    --text-2xl: 1.6rem;
    --text-3xl: 2.2rem;
    --text-4xl: 3.2rem;
    /* Forme e misure */
    --radius-sm: 6px;
    --radius: 8px;
    --radius-lg: 10px;
    --shadow: 0 4px 16px rgb(0 0 0 / 40%);
    /* Barra dell'accento a sinistra della riga selezionata di una tabella */
    --row-selected-shadow: inset 4px 0 0 var(--accent);
    /* Altezza minima dei controlli da toccare sullo smartphone */
    --touch: 48px;
    color-scheme: dark;
    font-family: var(--font);
    font-size: 14px;
    color: var(--text);
    background: var(--bg);
  }
  * {
    box-sizing: border-box;
  }
  html,
  body,
  #app {
    margin: 0;
    height: 100%;
  }
  /* Sugli smartphone niente zoom con il doppio tocco (scatta toccando in fretta i pulsanti);
     scorrimento e zoom con due dita restano disponibili */
  html,
  body {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  h1,
  h2,
  h3 {
    margin: 0;
    font-weight: 650;
  }
  h2 {
    font-size: var(--text-lg);
  }
  h3 {
    font-size: var(--text-base);
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
  }
  button,
  input,
  select {
    font: inherit;
    color: inherit;
  }
  ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
  }
  ::-webkit-scrollbar-thumb {
    background: var(--line);
    border-radius: 5px;
  }
}