@layer base {
  @keyframes growWidth {
    from {
      width: 0%;
    }
    to {
      width: 100%;
    }
  }

  .grow-full-width {
    animation: growWidth 0.4s linear forwards;
  }

  @keyframes shimmer-signature {
    0% {
      transform: translateX(-100%);
    }
    17% {
      transform: translateX(100%);
    }
    100% {
      transform: translateX(100%);
    }
  }

  .shimmer-signature {
    position: relative;
    overflow: hidden;
  }

  .shimmer-signature::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
      20deg,
      transparent 0%,
      transparent 35%,
      rgba(255, 255, 255, 0.8) 50%,
      transparent 65%,
      transparent 100%
    );
    animation: shimmer-signature 3s linear infinite;
    pointer-events: none;
  }
}
/* =============================================================================
   IMPORTS & TAILWIND DIRECTIVES
   ============================================================================= */
@tailwind base;
@tailwind components;
@tailwind utilities;
@import "_animations" layer(base);
@import "inter";

/* =============================================================================
   CSS CUSTOM PROPERTIES (Design Tokens)
   ============================================================================= */
:root {
  --color-blue-500: theme('colors.blue.500');
  --font-family-display: InterDisplay, "Inter var", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-family-body: "Inter Variable", "Inter var", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* =============================================================================
   GLOBAL RESETS
   ============================================================================= */
* {
  -ms-overflow-style: none;
  font-feature-settings: 'liga' 1, 'calt' 1;
}

/* =============================================================================
   KEYFRAMES & ANIMATIONS
   ============================================================================= */

/* --- Sparkle / Fade --- */
@keyframes sparkle {
  0% { opacity: 0 }
  39% { opacity: 0 }
  50% { opacity: 100 }
  88% { opacity: 100 }
  100% {  opacity: 0 }
}
@keyframes fadeIn {
  0% { opacity: 0 }
  100% {  opacity: 100 }
}

/* --- Transaction row animations --- */
@keyframes uncategorizedTransactionExit {
  0% {
    transform: translateX(0) scale(1);
    opacity: 1;
    max-height: 2.75rem;
  }
  40% {
    transform: translateX(-0.5rem) scale(0.98);
    opacity: 0;
    max-height: 2.75rem;
  }
  100% {
    transform: translateX(-0.5rem) scale(0.98);
    opacity: 0;
    max-height: 0;
    border-bottom-width: 0px;
  }
}
/* --- Tax row animations --- */
@keyframes taxRowExit {
  0% {
    transform: translateX(0) scale(1);
    opacity: 1;
    max-height: 3.5rem;
  }
  40% {
    transform: translateX(0.5rem) scale(0.98);
    opacity: 0;
    max-height: 3.5rem;
  }
  100% {
    transform: translateX(0.5rem) scale(0.98);
    opacity: 0;
    max-height: 0;
    padding-top: 0;
    padding-bottom: 0;
  }
}
/* --- Editable table row animations (GPU accelerated) --- */
@keyframes editableRowEntrance {
  0% {
    opacity: 0;
    transform: translateY(-0.25rem) scale(0.97);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@keyframes editableRowExit {
  0% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  100% {
    opacity: 0;
    transform: translateY(-0.25rem) scale(0.97);
  }
}
.editable-row-enter {
  animation: editableRowEntrance 200ms cubic-bezier(0.23, 1, 0.32, 1) forwards;
  will-change: transform, opacity;
}
.editable-row-exit {
  animation: editableRowExit 200ms cubic-bezier(0.23, 1, 0.32, 1) forwards;
  will-change: transform, opacity;
  pointer-events: none;
}
.editable-row-exit .editable-table__row-action {
  opacity: 0 !important;
  transition: none !important;
}
/* Remove rounded corners from exiting rows */
.editable-row-exit .editable-table__cell {
  border-radius: 0 !important;
}
.editable-row-exit .editable-table__focused-edit,
.editable-row-exit input,
.editable-row-exit [contenteditable='plaintext-only'] {
  border-radius: 0 !important;
}
@media (prefers-reduced-motion: reduce) {
  .editable-row-enter {
    animation: none;
    opacity: 1;
    transform: none;
  }
  .editable-row-exit {
    animation: none;
    opacity: 0;
  }
}
@keyframes taxTableExit {
  0% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(0.98);
  }
}
.tax-table-exit {
  animation: taxTableExit 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  .tax-table-exit {
    animation: none;
    opacity: 0;
  }
}
/* --- Action notification animations --- */
@keyframes uncategorizedTransactionUndo {
  0% {
    transform: translateX(-0.5rem) scale(0.98);
    opacity: 0;
    max-height: 0;
    border-bottom-width: 0px;
  }
  60% {
    max-height: 2.75rem;
    opacity: 0.5;
  }
  100% {
    transform: translateX(0) scale(1);
    opacity: 1;
    max-height: 2.75rem;
  }
}
/* --- Tooltip animations --- */
@keyframes hotkeyTooltipEnter {
  0% {
    opacity: 0;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y))
  }
  75% {
    opacity: 0.9;
  }
  100% {
    opacity: 1;
    transform: translate(var(--tw-translate-x), calc(var(--tw-translate-y) + (0.9rem * var(--tw-translate-modifier, 1))))
  }
}
@keyframes hotkeyTooltipLeave {
  0% {
    opacity: 1;
    transform: translate(var(--tw-translate-x), calc(var(--tw-translate-y) + (0.9rem * var(--tw-translate-modifier, 1))))
  }
  25% {
    opacity: 0.9;
  }
  100% {
    opacity: 0;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y))
  }
}
/* --- Onboarding / Shimmer --- */
ninja-keys {
  --ninja-accent-color: theme('colors.blue.500');
}
@keyframes actionNotificationEnter {
  0% {
    opacity: 0;
    margin-top: -2.75rem;
    margin-bottom: 0rem;
    transform: translateY(150%);
  }

  33% {
    margin-top: -2.75rem;
  }

  100% {
    opacity: 1;
    margin-top: 0rem;
    margin-bottom: 0.5rem;
    transform: translateY(0%);
  }
}
@keyframes actionNotificationExit {
  0% {
    opacity: 1;
    margin-top: 0rem;
    margin-bottom: 0.5rem;
  }
  50% {
    opacity: 0;
    margin-top: 0rem;
    margin-bottom: 0.5rem;
  }
  100% {
    opacity: 0;
    margin-bottom: 0rem;
    margin-top: -2.75rem;
  }
}
@keyframes onboardingBreath {
  0% {
    opacity: 1;
  }
  83.333% {
    opacity: 0.2;
  }
  100% {
    opacity: 0.2;
  }
}
@keyframes shimmer {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(100%);
  }
}
.animate-onboarding-breath {
  animation: onboardingBreath 1.2s linear infinite;
}
.animate-shimmer {
  animation: shimmer 1s linear infinite;
}
/* =============================================================================
   THIRD-PARTY OVERRIDES
   ============================================================================= */
#atlas-chat {
  #atlas-back-button {
    display: none !important;
  }
  div[aria-label="atlas-window"]:not(:has([aria-label="atlas-ticket"])) {
    display: none;
  }
}

/* =============================================================================
   FEATURE: Forms & Inputs
   ============================================================================= */
.segmented-control-easing {
  transition-timing-function: cubic-bezier(0.4,0,0.2,1);
  transition-duration: 150ms;
}


/* =============================================================================
   FEATURE: Modals
   ============================================================================= */
.connected {
  .modal-bg-blur {
    filter: blur(2px);
  }
}
.modal-bg-blur {
  filter: blur(1px);
  background: transparent;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(20px);
  z-index: 100;
  mask-image: linear-gradient(to top, black 60%, transparent 100%);
  -webkit-mask-image: linear-gradient(to top, black 60%, transparent 100%);
}

/* =============================================================================
   FEATURE: Overview / Dashboard Tables
   ============================================================================= */
  /* Round bottom of last top-level dashboard-row */
.overview-table > .overview-row:last-child .child-rows > div:last-child > .dashboard-row {
  @apply rounded-b-md;
}

  /* Round bottom of the deepest dashboard-row */
.overview-table > .overview-row:last-child .child-rows > div:last-child > .dashboard-row > .child-rows > div:last-child > .dashboard-row {
  @apply rounded-b-md;
}
.overview-table > .overview-row:last-child .child-rows {
  @apply rounded-b-md;
}

.overview-table > .overview-row:last-of-type > .dashboard-row:first-of-type {
  @apply rounded-b-md;
}
.overview-table > .overview-row:first-of-type > div > .dashboard-row:first-of-type {
  @apply rounded-t-md;
}
.overview-table > .overview-row:last-of-type > div > .dashboard-row:first-of-type {
  @apply rounded-b-md;
}
.v2-wrapper {
  label {
    @apply text-[0.8125rem] font-medium text-primary tracking-[-0.00813rem];
  }
}
.v2-input {
  @apply error:border-error-subtle mt-1 appearance-none shadow-input rounded-lg border-0 w-full py-1.5 px-3 bg-primary focus:outline-none focus:ring-0 focus:border-brand text-primary leading-6 transition-colors duration-200 ease-in-out !mt-0;
}
input.boolean {
  @apply cursor-pointer;
}

.v2-label, .v2-radio {
  @apply pb-2 font-medium u-body-sm text-tertiary;
}
.v2-label.boolean {
  @apply pb-0 cursor-pointer;
}
.v2-radio {
  @apply pb-2;
}
.v2-input.radio_buttons {
  & > div {
    @apply gap-x-2
  }
  fill: linear-gradient(180deg, theme('colors.blue.400') 0%, theme('colors.blue.500') 83.65%), theme('colors.white');
  box-shadow: 0px 1px 0.5px 0px rgba(255, 255, 255, 0.15) inset;
  filter: drop-shadow(0px 0px 0px theme('colors.blue.500')) drop-shadow(0px 1px 4px rgba(15, 12, 12, 0.20)) drop-shadow(0px 1px 2px rgba(0, 0, 0, 0.16)) drop-shadow(0px 2px 4px rgba(38, 121, 243, 0.20));
}

.overview-change-metric {
  @apply absolute left-2 top-0 translate-y-0 opacity-0 flex items-center gap-x-1 bg-primary rounded shadow-cash-change px-1.5 transition-all z-[49];
}

.action-notification {
  margin-bottom: 0.5rem;
}
.action-notification.in {
  animation: actionNotificationEnter 300ms forwards;
  animation-timing-function: linear;
}
.action-notification.out {
  animation: actionNotificationExit 500ms forwards;
  animation-timing-function: linear;
}
.undo-row {
  animation: uncategorizedTransactionUndo 280ms cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  @apply pointer-events-auto;
}
.remove-row {
  animation: uncategorizedTransactionExit 280ms cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  overflow: hidden;
  @apply pointer-events-none;
}
turbo-frame:has(.remove-row) {
  @apply overflow-x-hidden;
}
@media (prefers-reduced-motion: reduce) {
  .remove-row {
    animation: none;
    opacity: 0;
  }
  .undo-row {
    animation: none;
    opacity: 1;
    transform: translateX(0) scale(1);
  }
}
.tax-remove-row {
  animation: taxRowExit 280ms cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  overflow: hidden;
  @apply pointer-events-none;
}
turbo-frame:has(.tax-remove-row) {
  @apply overflow-x-hidden;
}
@media (prefers-reduced-motion: reduce) {
  .tax-remove-row {
    animation: none;
    opacity: 0;
  }
}
.hotkey-tooltip {
  pointer-events: none;
  transform: translate(var(--tw-translate-x), calc(var(--tw-translate-y) + (0.9rem * var(--tw-translate-modifier, 1))))
}
.hotkey-tooltip.leave {
  pointer-events: none;
}
.sparkle-1 {
  animation: sparkle 2600ms infinite;
  animation-delay: 0ms;
  opacity: 0;
}
.sparkle-2 {
  animation: sparkle 2600ms infinite;
  animation-delay: 150ms;
  opacity: 0;
}
.sparkle-3 {
  animation: sparkle 2600ms infinite;
  animation-delay: 300ms;
  opacity: 0;
}
.fade-in {
  animation: fadeIn 300ms forwards;
  animation-delay: 1000ms;
  opacity: 0;
}
.overview-field:has(input:placeholder-shown) {
  .overview-icon {
    color: theme('colors.gray.400');
  }
}
.overview-field:has(input:focus) {
  .overview-icon {
    color: inherit;
  }
}
/* =============================================================================
   FEATURE: Taxes / 1099
   ============================================================================= */
.common-shares:has(input[type="checkbox"]:checked) + .preferred-shares:has(input[type="checkbox"]:checked) + .total-row {
  display: grid;
}
.edit_taxes_irs1099_required_vendor:has(input[type='radio'][value='request_w9']:checked) {
  #email-vendor {
    display: block !important;
  }
}
.edit_taxes_irs1099_required_vendor:has(input[type='radio'][value='upload_w9']:checked) {
  #upload-vendor-w9 {
    display: block !important;
  }
}
.founder-irs-amount:has(input[type='radio'][value="true"]:checked) {
  .founder-irs-field-container {
    display: block !important;
  }
}
div.row:has(div.remove-row) {
  @apply border-b-0;
}

.row:has(div.row-content.remove-row) {
  @apply overflow-x-hidden;
}

/* =============================================================================
   FEATURE: Google Places Autocomplete
   ============================================================================= */
.hdpi.pac-logo:after {
  background-image: url("data:image/svg+xml,%3Csvg fill='%23707070' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 15' aria-label='Powered by Google' class='Llh19'%3E%3Cpath d='M4.025 3.572c1.612 0 2.655 1.283 2.655 3.27 0 1.974-1.05 3.27-2.655 3.27-.902 0-1.63-.393-1.974-1.06h-.09v3.057H.95V3.68h.96v1.054h.094c.404-.726 1.16-1.166 2.02-1.166zm-.24 5.63c1.16 0 1.852-.884 1.852-2.36 0-1.477-.692-2.362-1.846-2.362-1.14 0-1.86.91-1.86 2.362 0 1.447.72 2.36 1.858 2.36zm7.072.91c-1.798 0-2.912-1.243-2.912-3.27 0-2.033 1.114-3.27 2.912-3.27 1.8 0 2.913 1.237 2.913 3.27 0 2.027-1.114 3.27-2.913 3.27m0-.91c1.196 0 1.87-.866 1.87-2.36 0-1.5-.674-2.362-1.87-2.362-1.195 0-1.87.862-1.87 2.362 0 1.494.675 2.36 1.87 2.36m12.206-5.518H22.05l-1.244 5.05h-.094L19.3 3.684h-.966l-1.412 5.05h-.094l-1.242-5.05h-1.02L16.336 10h1.02l1.406-4.887h.093L20.268 10h1.025zm3.632.78c-1.008 0-1.71.737-1.787 1.856h3.48c-.023-1.12-.69-1.857-1.693-1.857zm1.664 3.9h1.004c-.305 1.085-1.277 1.747-2.66 1.747-1.752 0-2.848-1.26-2.848-3.26 0-1.986 1.113-3.275 2.847-3.275 1.705 0 2.742 1.213 2.742 3.176v.387h-4.542v.047c.053 1.248.75 2.04 1.822 2.04.815 0 1.366-.3 1.63-.857zM31.03 10h1.01V6.086c0-.89.696-1.535 1.657-1.535.2 0 .563.04.645.06V3.6c-.13-.018-.34-.03-.504-.03-.838 0-1.565.434-1.752 1.05h-.094v-.938h-.96V10zm6.915-5.537c-1.008 0-1.71.738-1.787 1.857h3.48c-.023-1.12-.69-1.857-1.693-1.857m1.664 3.902h1.004c-.304 1.084-1.277 1.746-2.66 1.746-1.752 0-2.848-1.26-2.848-3.26 0-1.986 1.113-3.275 2.847-3.275 1.705 0 2.742 1.213 2.742 3.176v.387h-4.542v.047c.053 1.248.75 2.04 1.822 2.04.815 0 1.366-.3 1.63-.857zm5.01 1.746c-1.62 0-2.658-1.28-2.658-3.265 0-1.98 1.05-3.27 2.654-3.27.878 0 1.622.416 1.98 1.108h.087V1.177h1.008V10h-.96V8.992h-.093c-.4.703-1.15 1.12-2.02 1.12zm.23-5.63c-1.15 0-1.845.89-1.845 2.365s.69 2.36 1.846 2.36c1.15 0 1.858-.9 1.858-2.36 0-1.447-.715-2.362-1.857-2.362zm7.876-3.114h1.024V4.49q.346-.45.827-.69.48-.239 1.043-.237 1.172.001 1.9.806c.49.536.73 1.33.73 2.375q0 1.489-.72 2.473t-1.997.984q-.715 0-1.207-.344-.293-.206-.627-.657v.8h-.97V1.364zm4.02 7.225q.426-.679.426-1.793 0-.99-.425-1.64t-1.25-.65q-.719 0-1.264.532-.541.532-.542 1.757.001.885.224 1.435.416 1.04 1.553 1.04.856 0 1.28-.68zM63.4 3.727h1.167q-.222.603-.99 2.754a145 145 0 0 1-.96 2.635q-.915 2.402-1.29 2.93-.375.526-1.29.527-.221 0-.342-.017a3 3 0 0 1-.296-.065v-.96q.273.074.4.093.119.018.214.018.292 0 .43-.093a.9.9 0 0 0 .232-.237q.03-.05.21-.48.183-.436.264-.646l-2.32-6.457h1.196l1.68 5.11 1.694-5.11zm10.594 1.556V6.87h3.814c-.117.89-.416 1.54-.87 1.998-.557.555-1.427 1.16-2.944 1.16-2.35 0-4.184-1.882-4.184-4.217 0-2.33 1.835-4.214 4.184-4.214a4.07 4.07 0 0 1 2.873 1.135l1.122-1.116C77.04.697 75.77 0 73.99 0c-3.218 0-5.923 2.606-5.923 5.805 0 3.2 2.705 5.804 5.923 5.804 1.738 0 3.048-.57 4.073-1.63 1.05-1.044 1.382-2.52 1.382-3.71 0-.365-.028-.707-.087-.99h-5.37zm10.222-1.29c-2.082 0-3.78 1.574-3.78 3.748 0 2.154 1.698 3.747 3.78 3.747S87.998 9.9 87.998 7.74c0-2.174-1.7-3.748-3.782-3.748zm0 6.018c-1.14 0-2.127-.935-2.127-2.27 0-1.348.982-2.27 2.123-2.27s2.128.922 2.128 2.27c0 1.335-.985 2.27-2.127 2.27zm18.54-5.18h-.06c-.37-.438-1.083-.838-1.985-.838-1.88 0-3.52 1.632-3.52 3.748 0 2.102 1.64 3.747 3.52 3.747.906 0 1.62-.4 1.99-.852h.06v.523c0 1.432-.774 2.2-2.013 2.2-1.012 0-1.64-.723-1.9-1.336l-1.44.593c.414.994 1.51 2.213 3.34 2.213 1.94 0 3.58-1.135 3.58-3.902v-6.74h-1.57v.645zm-1.9 5.18c-1.144 0-2.013-.968-2.013-2.27 0-1.323.87-2.27 2.01-2.27 1.13 0 2.012.967 2.012 2.282.006 1.31-.882 2.258-2.01 2.258zM92.65 3.992c-2.084 0-3.783 1.574-3.783 3.748 0 2.154 1.7 3.747 3.782 3.747 2.08 0 3.78-1.587 3.78-3.747 0-2.174-1.7-3.748-3.78-3.748zm0 6.018c-1.143 0-2.13-.935-2.13-2.27 0-1.348.987-2.27 2.13-2.27 1.14 0 2.126.922 2.126 2.27 0 1.335-.986 2.27-2.127 2.27zM105.622.155h1.628v11.332h-1.628m6.655-1.477c-.843 0-1.44-.38-1.83-1.135l5.04-2.07-.168-.426c-.315-.84-1.275-2.39-3.228-2.39-1.94 0-3.554 1.515-3.554 3.75 0 2.1 1.595 3.744 3.736 3.744 1.725 0 2.724-1.05 3.14-1.658l-1.285-.852c-.428.62-1.01 1.032-1.855 1.032zm-.117-4.612c.668 0 1.24.342 1.427.826l-3.405 1.4c0-1.574 1.122-2.226 1.978-2.226'%3E%3C/path%3E%3C/svg%3E");
}

/* =============================================================================
   @layer base
   ============================================================================= */
@layer base {
  /* --- Onboarding --- */
#onboarding {
  .radio-option {
    @apply error:shadow-v2-input-error tracking-sm  error:hover:border-transparent hover:border-brand/40 expanded:!border-brand cursor-pointer rounded-md flex items-center gap-x-2 px-[0.62rem] py-[0.38rem] border border-primary text-tertiary u-body-sm transition-all expanded:text-primary;
  }
  .radio-indicator {
    @apply w-3 h-3 rounded-full shadow-control-off flex items-center justify-center expanded:shadow-control-on;
  }
  .expanded .radio-indicator {
    background-image: linear-gradient(180deg, theme('colors.blue.400') 0%, theme('colors.blue.500') 83.65%);
  }
}
  /* --- Tax forms --- */
  #draft-form:has(input#company_income_tax_filing_draft_package_use_draft_pdf:checked), #esign-form:has(input#docusign_envelope_use_esign_pdf:checked) {
    #file-wrapper {
      @apply hidden;
    }
  }
  /* --- Rules engine --- */
  .rule-amount-input-start, .rule-amount-input-end {
    &:has(input:placeholder-shown) {
      &::before {
        @apply absolute font-semibold ml-0.5 left-3 top-1/2 -translate-y-1/2 text-xs text-placeholder;
      }
    }
  }
  .rule-amount-input-start {
    &:has(input:placeholder-shown) {
      &::before {
        content: '-∞';
      }
    }
  }
  .rule-amount-input-end {
    &:has(input:placeholder-shown) {
      &::before {
        content: '∞';
      }
    }
  }
  /* --- Reports & overview tables --- */
  .overview-row:first-of-type > div > .dashboard-row:first-of-type {
    @apply !rounded-t-md;
  }
  #reports {
    .generic-cell {
      @apply text-right leading-[1.25rem] pr-1.5 flex items-center justify-end relative [font-variant-numeric:lining-nums_tabular-nums];
    }
    .overview-row::after {
      content: '';
      @apply h-px w-[calc(100%-1.5rem)] left-3 bg-primary-solid opacity-[0.08] absolute bottom-0 mr-3 z-[45];
    }
    .overview-row:last-of-type::after {
      content: '';
      @apply hidden h-0;
    }
    .dashboard-row:first-of-type .cell:first-of-type {
      @apply rounded-tl-md;
    }
    .dashboard-row:first-of-type .cell:last-of-type {
      @apply rounded-tr-md;
    }
    .overview-row:last-of-type {
      .name-cell {
        @apply rounded-b-md;
      }
    }
    .name-cell:has(.dropdown-toggle:focus) {
      z-index: 47;
    }
    .overview-row {
      @apply relative;
    }
    .vendor-cell {
      @apply text-xs hover:outline outline-offset-[-1px] outline-brand rounded hover:text-brand;
    }
    .negative::before {
      content: '(';
      position: absolute;
      left: -0.3rem;
      font-variant-numeric: lining-nums tabular-nums;
    }
    .negative::after {
      content: ')';
      position: absolute;
      @apply [font-variant-numeric:lining-nums_tabular-nums];
    }
    .negative {
      @apply relative;
    }
  }
  #table {
    .generic-cell {
      @apply text-right leading-[1.25rem] pr-1.5 flex items-center justify-end relative [font-variant-numeric:lining-nums_tabular-nums];
    }
    .metric-option {
      @apply font-normal active-selection:font-medium w-full flex items-center justify-between gap-x-4 p-2 text-secondary hover:text-primary active-selection:text-primary active-selection:bg-secondary-subtle hover:bg-secondary-subtle rounded-md;
    }
    .metric-tooltip {
      @apply relative opacity-0 transition-all pointer-events-none group-hover/metric:opacity-100 group-hover/metric:pointer-events-auto;
    }
    .row-cell {
      @apply [font-variant-numeric:lining-nums_tabular-nums] group-data-[expanded=true]/row:font-semibold;
    }
    .vendor-cell {
      @apply text-xs hover:outline outline-offset-[-1px] outline-brand rounded hover:text-brand;
    }
    .table-cell {
      @apply text-right text-primary py-3.5 leading-[1.25rem] pr-1.5 relative flex items-center justify-end;
    }
    .dashboard-row {
      @apply grid grid-cols-[28%_12%_12%_12%_12%_12%_12%] relative;
    }
    .table-row {
      @apply data-[expanded='true']:!rounded-b-none col-span-7;
    }
    .vendor-row {
      @apply mt-px
    }
    .vendor-row:first-of-type {
      @apply mt-0;
    }
    .vendor-row::after {
      content: '';
      @apply h-px w-full bg-primary-solid opacity-[0.08] absolute bottom-[-1px] mr-3 z-20;
    }
    .vendor-row:last-of-type::after {
      content: '';
      @apply hidden h-0;
    }
    .overview-row::after {
      content: '';
      @apply h-px w-[calc(100%-1.5rem)] left-3 bg-primary-solid opacity-[0.08] absolute bottom-0 mr-3 z-20;
    }
    .overview-row:last-of-type::after {
      content: '';
      @apply hidden h-0;
    }
    .overview-row {
      @apply relative;
    }
    .vendor-row {
      @apply relative;
    }
    .vendor-row-2::after {
      @apply ml-[4rem] w-[calc(100%-4.75rem)]
    }
    .vendor-row-3::after {
      @apply ml-[5rem] w-[calc(100%-5.75rem)]
    }
    .negative::before {
      content: '(';
      position: absolute;
      left: -0.3rem;
      font-variant-numeric: lining-nums tabular-nums;
    }
    .negative::after {
      content: ')';
      position: absolute;
      @apply [font-variant-numeric:lining-nums_tabular-nums];
    }
    .negative {
      @apply relative;
    }
  }
  .metric-text {
    @apply cursor-pointer inline-block hover:underline underline-offset-4 font-semibold text-[1.75rem] leading-[2.25rem] tracking-[-0.02188rem] [font-variant-numeric:lining-nums_tabular-nums] [font-feature-settings:'cv01'_on] font-display;
  }
  .font-display {
    @apply [font-variation-settings:'opsz'_48] font-inter-display;
  }
  /* --- Category keyboard --- */
  .category-keyboard-key {
    @apply h-[1.625rem] px-[0.62rem] py-[0.56rem] leading-3 bg-primary rounded font-medium shadow-keyboard-item hover:bg-brand-subtle hover:text-brand cursor-pointer active:bg-brand active:text-inverse-primary;
  }
  .category-keyboard-key:active {
    @apply text-inverse-primary bg-brand;
  }
  .transaction-date-label {
    @apply text-right text-[0.75rem] leading-[1.25rem] text-primary [font-variant-numeric:lining-nums_tabular-nums] [font-feature-settings:'cv02'_on] font-normal;
  }
  .hdpi.pac-logo:after {
    @apply grayscale;
  }
  /* --- Global typography & rendering --- */
  * {
    @apply antialiased;
  }
  body {
    font-synthesis-weight: none;
    text-rendering: optimizeLegibility;
    counter-reset: payroll-counter;
  }
  /* --- Accordion --- */
  .accordion-item.has-error {
    .accordion-error-text {
      @apply !text-error;
    }
  }
  /* Reduced motion: disable accordion animations for accessibility */
  @media (prefers-reduced-motion: reduce) {
    .accordion-item [data-content-wrapper] {
      transition: none !important;
    }
    .accordion-item .transition-transform {
      transition: none !important;
    }
  }
  /* --- Radio buttons & form controls --- */
  .styled-radio-container {
    @apply flex gap-x-2 items-center;
  }
  input.styled-radio-input[type='radio'] {
    @apply h-4 w-4 border-0 bg-primary text-brand shadow-control-off transition-all focus-visible:shadow-active;
  }
  input.styled-radio-input[type='radio']:checked {
    @apply bg-brand shadow-control-on;
  }
  input.styled-radio-input[type='radio']:focus,
  input.styled-radio-input[type='radio']:focus-visible {
    --tw-ring-offset-shadow: 0 0 transparent;
    --tw-ring-shadow: 0 0 transparent;
    --tw-ring-offset-width: 0px;
    box-shadow: var(--tw-shadow);
  }
  .radio-item {
    @apply flex gap-x-2 items-center px-4 py-2 text-sm rounded-md border error:border-error border-primary text-secondary bg-primary;
  }
  .radio-item:has(input[type='radio']:checked) {
    @apply bg-primary border-brand text-primary;
  }

  /* --- Counters & submitting --- */
  .counter::before {
    counter-increment: payroll-counter;
    content: counter(payroll-counter)
  }
  button.submitting:before {
    content: url('data:image/svg+xml,<svg class="animate-spin" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="#2679F3" stroke-width="4"></circle><path class="opacity-75" fill="#D9D9D9" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path></svg>');
  }
}

/* =============================================================================
   STANDALONE UTILITIES (outside layers)
   These sit outside @layer intentionally for specificity reasons.
   ============================================================================= */
.monospaced {
  font-variant-numeric: lining-nums tabular-nums;
}

.badge-indicator {
  @apply inline-flex justify-center items-center rounded;
  height: 1rem;
  min-height: 1rem;
  min-width: 1rem;
  padding-left: 0.1875rem;
  padding-right: 0.1875rem;
}

.text-disabled {
  @apply text-quaternary;
}

/* --- Buttons (outside layers) --- */
.button {
  @apply px-3 py-2 shadow-input rounded-md font-semibold u-body-sm h-8 inline-flex items-center justify-center min-w-[4rem];
}
.button__primary {
  background: linear-gradient(180deg, theme('colors.blue.400') 0%, theme('colors.blue.500') 83.65%);
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.13);
  @apply h-8 shadow-primary-button relative isolate overflow-hidden text-left font-semibold transition duration-300 rounded-md u-body-sm px-3 text-inverse-primary border-brand before:pointer-events-none before:absolute before:inset-0 before:-z-10 before:rounded-md before:bg-gradient-to-b before:from-surface-primary/20 before:opacity-50 hover:before:opacity-100 after:pointer-events-none after:absolute after:inset-0 after:-z-10 after:rounded-md after:bg-gradient-to-b after:from-surface-primary/10 after:from-[0%] after:to-[0%] after:mix-blend-overlay before:duration-300 before:transition-opacity;
  &:hover {
    background: linear-gradient(0deg, rgba(20, 20, 20, 0.20) 0%, rgba(20, 20, 20, 0.20) 100%), linear-gradient(180deg, theme('colors.blue.400') 0%, theme('colors.blue.500') 83.65%);;
  }
  &.disabled {
    background: linear-gradient(180deg, theme('colors.blue.400') 0%, theme('colors.blue.500') 83.65%);
    @apply opacity-50 cursor-not-allowed;
  }
}
.button_destroy {
  background: linear-gradient(180deg, theme('colors.red.700') 0%, theme('colors.red.800') 100%);
  @apply text-inverse-primary transition-all;
  &:hover {
    background: linear-gradient(0deg, rgba(255, 255, 255, 0.20) 0%, rgba(255, 255, 255, 0.20) 100%), linear-gradient(180deg, theme('colors.red.700') 0%, theme('colors.red.800') 100%);
  }
}

.button__ghost {
  @apply !shadow-none;

  &:hover {
    @apply !bg-tertiary;
  }
  &.disabled {
    @apply text-disabled;
  }
}


/* --- Password --- */
.password-group .eyeball-container {
  @apply text-primary;
}

.password-group:has(input:placeholder-shown) .eyeball-container {
  @apply text-placeholder;
}

/* --- Notifications / Inbox --- */
#inbox {
  .notifications:has(div) {
    @apply block

  }
  .notifications:not(div) {
    @apply hidden

  }
  .notifications:not(div)~.empty-notifications {
    @apply block
  }
  .notifications:has(div)~.empty-notifications {
    @apply hidden
  }
}
.opacity-15  {
  opacity: 0.15;
}

/* --- Notification logos --- */
.notification-logo {
  position: relative;
  width: 1.75rem;
  height: 1.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 4px;
}

.notification-logo__image {
  display: block;
  width: 100%;
  height: 100%;
}

.completed .notification-logo--stripe::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 4px;
  pointer-events: none;
}

/* =============================================================================
   @layer components
   ============================================================================= */
@layer components {
  /* --- Typography: u-* migration helpers (delete after migration) --- */
  /*
  Temporary typography utilities.
  Prefix `u-` indicates legacy migration helpers.
  Delete these once the new semantic typography system is fully adopted.
  */

  .u-display-3xl {
    font-family: var(--font-family-display);
    font-size: 28px;
    font-weight: 600;
    line-height: 2.25rem;
    @apply text-primary;
  }

  .u-display-2xl {
    font-family: var(--font-family-display);
    font-size: 24px;
    font-weight: 600;
    line-height: 2rem;
    @apply text-primary;
  }

  .u-display-xl {
    font-family: var(--font-family-display);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.75rem;
    @apply text-primary;
  }

  .u-body-lg {
    font-family: var(--font-family-body);
    font-size: 16px;
    line-height: 1.625rem;
    @apply text-primary;
  }

  .u-body-md {
    font-family: var(--font-family-body);
    font-size: 14px;
    line-height: 1.375rem;
    @apply text-primary;
  }

  .u-body-sm {
    font-family: var(--font-family-body);
    font-size: 13px;
    line-height: 1.25rem;
    @apply text-primary;
  }

  .u-body-xs {
    font-family: var(--font-family-body);
    font-size: 12px;
    line-height: 1.25rem;
    @apply text-primary;
  }

  .u-body-xxs {
    font-family: var(--font-family-body);
    font-size: 11px;
    line-height: 1.125rem;
    @apply text-primary;
  }

  .u-mono-display-3xl {
    font-family: var(--font-family-display);
    font-size: 28px;
    font-weight: 600;
    line-height: 2.25rem;
    font-variant-numeric: lining-nums tabular-nums;
    @apply text-primary;
  }

  .u-mono-display-2xl {
    font-family: var(--font-family-display);
    font-size: 24px;
    font-weight: 600;
    line-height: 2rem;
    font-variant-numeric: lining-nums tabular-nums;
    @apply text-primary;
  }

  .u-mono-display-xl {
    font-family: var(--font-family-display);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.75rem;
    font-variant-numeric: lining-nums tabular-nums;
    @apply text-primary;
  }

  .u-mono-body-lg {
    font-family: var(--font-family-body);
    font-size: 16px;
    line-height: 1.625rem;
    font-variant-numeric: lining-nums tabular-nums;
    @apply text-primary;
  }

  .u-mono-body-md {
    font-family: var(--font-family-body);
    font-size: 14px;
    line-height: 1.375rem;
    font-variant-numeric: lining-nums tabular-nums;
    @apply text-primary;
  }

  .u-mono-body-sm {
    font-family: var(--font-family-body);
    font-size: 13px;
    line-height: 1.25rem;
    font-variant-numeric: lining-nums tabular-nums;
    @apply text-primary;
  }

  .u-mono-body-xs {
    font-family: var(--font-family-body);
    font-size: 12px;
    line-height: 1.25rem;
    font-variant-numeric: lining-nums tabular-nums;
    @apply text-primary;
  }

  .u-mono-body-xxs {
    font-family: var(--font-family-body);
    font-size: 11px;
    line-height: 1.125rem;
    font-variant-numeric: lining-nums tabular-nums;
    @apply text-primary;
  }

  /* Usage: size (role) and weight should be composed separately; these are transitional only. */

  /* --- Logo sizing --- */
  .logo-sm {
    @apply w-4 h-4;
  }

  .logo-md {
    @apply w-5 h-5;
  }

  .logo-lg {
    @apply w-6 h-6;
  }

  .logo-xl {
    @apply w-8 h-8;
  }

  .logo-2xl {
    @apply w-9 h-9;
  }

  .logo-sm img,
  .logo-md img,
  .logo-lg img,
  .logo-xl img,
  .logo-2xl img {
    @apply block object-contain w-full h-full;
  }

  /* --- Numerical inputs --- */
  .input-numerical {
    @apply u-body-sm text-right flex-1 !mt-0 border-0 !p-0 outline-none !shadow-none focus:ring-0 bg-transparent !rounded-none font-inter-variable [font-variant-numeric:lining-nums_tabular-nums] placeholder:text-quaternary focus:placeholder:text-transparent;
  }

  .input-hint-container:has(.error) {
    @apply shadow-v2-input-error;
  }

  /* --- Page layout --- */
  .page-component {
    @apply px-16 pt-12 pb-8 mx-auto max-w-page-component;
  }

  .irs1099-page-component {
    @apply pt-16 pb-16 mx-auto max-w-3xl;
  }

  .info-term {
    text-decoration: underline;
    text-decoration-style: dotted;
    text-decoration-thickness: 12%;
    text-underline-offset: 25%;
    text-decoration-color: theme('colors.gray.500');
    @apply font-inter-variable [font-variant-numeric:lining-nums_tabular-nums];
  }

  /* --- Button system --- */
  .elements-button-primary {
    @apply inline-flex overflow-hidden relative gap-2 justify-center items-center font-semibold text-inverse-primary transition-colors duration-150 focus:outline-none focus-visible:outline-none shadow-primary-button;
    background-image: linear-gradient(180deg, theme('colors.blue.400') 0%, theme('colors.blue.500') 83.65%);
    border-radius: 0.375rem;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.13);
  }

  .elements-button-primary:hover:not(.disabled):not(:disabled) {
    background-image:
      linear-gradient(0deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.2) 100%),
      linear-gradient(180deg, theme('colors.blue.400') 0%, theme('colors.blue.500') 83.65%);
  }

  .elements-button-primary:focus-visible {
    box-shadow:
      0px 1px 0.5px 0px rgba(255, 255, 255, 0.15) inset,
      0px 2px 4px 1px rgba(38, 121, 243, 0.20),
      0px 1px 2px 0px rgba(0, 0, 0, 0.16),
      0px 1px 4px 0px rgba(15, 12, 12, 0.20),
      0px 0px 0px 1px rgba(55, 130, 241, 1),
      0px 0px 0px 2.5px rgba(255, 255, 255, 1),
      0px 0px 0px 4.5px rgba(38, 121, 243, 0.5);
  }

  .elements-button-primary:disabled,
  .elements-button-primary.disabled {
    background-image: linear-gradient(180deg, theme('colors.blue.400') 0%, theme('colors.blue.500') 83.65%);
    opacity: 0.5;
    cursor: not-allowed;
    box-shadow: none;
  }

  .elements-button-primary.loading {
    pointer-events: none;
  }

  .elements-button-primary.loading .button-text {
    opacity: 0;
  }

  .elements-button-primary.loading .button-spinner {
    display: flex;
  }

  .elements-button-primary-sm {
    border-radius: 0.25rem;
    padding: 0.125rem 0.5rem;
    height: 1.5rem;
    font-size: 0.75rem;
    line-height: 1.25rem;
  }

  .elements-button-primary-md {
    border-radius: 0.375rem;
    padding: 0.5rem;
    height: 2rem;
    font-size: 0.8125rem;
    line-height: 1.25rem;
  }

  .elements-button-primary-lg {
    border-radius: 0.5rem;
    padding: 0.5rem 1.25rem;
    height: 2.75rem;
    font-size: 0.9375rem;
    line-height: 1.5rem;
  }

  .elements-button-primary-icon {
    @apply flex overflow-hidden relative justify-center items-center text-inverse-primary cursor-pointer;
    background-image: linear-gradient(180deg, theme('colors.blue.400') 0%, theme('colors.blue.500') 83.65%);
    border-radius: 0.25rem;
  }

  .elements-button-primary-icon:hover {
    background-image:
      linear-gradient(0deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.2) 100%),
      linear-gradient(180deg, theme('colors.blue.400') 0%, theme('colors.blue.500') 83.65%);
  }


  .elements-button-tertiary {
    @apply font-semibold text-tertiary bg-transparent transition-colors duration-150;
    border-radius: 0.375rem;
  }

  .elements-button-tertiary svg {
    @apply text-tertiary;
  }

  .elements-button-tertiary-md {
    padding: 0.5rem;
    height: 2rem;
    font-size: 0.8125rem;
    line-height: 1.25rem;
  }

  .elements-button-tertiary:hover:not(.disabled):not(:disabled) {
    @apply text-secondary bg-tertiary;
  }

  .elements-button-tertiary:hover:not(.disabled):not(:disabled) svg {
    @apply text-secondary;
  }

  .expanded .elements-button-tertiary {
    @apply text-primary bg-tertiary;
  }

  .expanded .elements-button-tertiary svg {
    @apply text-primary;
  }

  .elements-button-secondary {
    @apply inline-flex items-center justify-center font-semibold transition-colors duration-150 text-[0.8125rem] leading-5 text-primary bg-gradient-elevated;
    border-radius: 0.375rem;
    padding: 0.5rem 0.5rem;
    height: 2rem;
    box-shadow:
      0px 0px 0px 1px rgba(15, 12, 12, 0.06),
      0px 3px 1px -2px rgba(15, 12, 12, 0.06),
      0px 1px 3px 1px rgba(15, 12, 12, 0.05);
  }

  .elements-button-secondary:hover:not(.disabled):not(:disabled) {
    @apply bg-primary_hover;
    background-image: none;
  }

  .elements-button-secondary:focus-visible {
    box-shadow:
      0px 0px 0px 1px rgba(38, 121, 243, 0.35),
      0px 0px 0px 3px rgba(255, 255, 255, 0.8),
      0px 1px 3px 1px rgba(15, 12, 12, 0.12);
  }

  .elements-button-secondary:disabled,
  .elements-button-secondary.disabled {
    @apply shadow-secondary-button-disabled;
    background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, rgba(250, 250, 250, 0.7) 83.65%);
    color: rgba(22, 27, 38, 0.45);
    cursor: not-allowed;
  }

  .elements-button-tertiary:focus-visible {
    @apply ring-2 ring-inverse-primary ring-offset-2 text-primary ring-offset-brand;
  }

  .elements-button-tertiary:disabled,
  .elements-button-tertiary.disabled {
    @apply text-disabled cursor-not-allowed;
  }

  .elements-v2-button {
    @apply inline-flex items-center justify-center relative overflow-hidden transition-colors duration-150 focus:outline-none focus-visible:outline-none;
  }

  .elements-v2-button.loading {
    pointer-events: none;
  }

  .elements-v2-button.loading .elements-v2-button__content {
    opacity: 0;
  }

  .elements-v2-button.loading .elements-v2-button__spinner {
    display: flex;
  }

  .elements-button-secondary-md {
    border-radius: 0.375rem;
    padding: 0.5rem;
    height: 2rem;
    font-size: 0.8125rem;
    line-height: 1.25rem;
  }

  .elements-button-secondary-sm {
    border-radius: 0.25rem;
    padding: 0.125rem 0.5rem;
    height: 1.5rem;
    font-size: 0.75rem;
    line-height: 1.25rem;
  }

  .elements-button-tertiary-sm {
    border-radius: 0.25rem;
    padding: 0.125rem 0.5rem;
    height: 1.5rem;
    font-size: 0.75rem;
    line-height: 1.25rem;
  }

  .elements-v2-button.elements-button-primary.danger {
    @apply shadow-danger-button;
    background-image: linear-gradient(180deg, theme('colors.red.700') 0%, theme('colors.red.800') 100%);
  }

  .elements-v2-button.elements-button-primary.danger:hover:not(.disabled):not(:disabled) {
    background-image:
      linear-gradient(90deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.2) 100%),
      linear-gradient(180deg, theme('colors.red.700') 0%, theme('colors.red.800') 100%);
  }

  .elements-v2-button.elements-button-primary.danger:focus-visible {
    @apply shadow-danger-button-focus;
  }

  .elements-v2-button.elements-button-primary.danger:disabled,
  .elements-v2-button.elements-button-primary.danger.disabled {
    background-image: linear-gradient(180deg, theme('colors.red.700') 0%, theme('colors.red.800') 100%);
    opacity: 0.5;
    cursor: not-allowed;
    box-shadow: none;
  }

  .elements-v2-button.elements-button-primary.loading:disabled,
  .elements-v2-button.elements-button-primary.loading.disabled {
    @apply shadow-primary-button;
    background-image: linear-gradient(180deg, theme('colors.blue.400') 0%, theme('colors.blue.500') 83.65%);
    opacity: 1;
    cursor: default;
  }

  .elements-v2-button.elements-button-primary.danger.loading:disabled,
  .elements-v2-button.elements-button-primary.danger.loading.disabled {
    @apply shadow-danger-button;
    background-image: linear-gradient(180deg, theme('colors.red.700') 0%, theme('colors.red.800') 100%);
    opacity: 1;
    cursor: default;
  }

  .elements-v2-button.elements-button-secondary:disabled,
  .elements-v2-button.elements-button-secondary.disabled {
    @apply bg-tertiary shadow-secondary-button-disabled text-quaternary;
    background-image: none;
    cursor: not-allowed;
  }

  .elements-v2-button.elements-button-tertiary.danger {
    @apply text-error;
  }

  .elements-v2-button.elements-button-tertiary.danger svg {
    @apply text-error;
  }

  .elements-v2-button.elements-button-tertiary.danger:hover:not(.disabled):not(:disabled) {
    @apply bg-error-subtle text-error;
  }

  .elements-v2-button.elements-button-tertiary.danger:hover:not(.disabled):not(:disabled) svg {
    @apply text-error;
  }

  .elements-v2-button.elements-button-tertiary:focus-visible {
    @apply ring-2 ring-inverse-primary ring-offset-2 ring-offset-brand text-tertiary;
  }

  .elements-v2-button.elements-button-tertiary.danger:focus-visible {
    @apply text-error;
  }

  .elements-v2-button.elements-button-tertiary:disabled,
  .elements-v2-button.elements-button-tertiary.disabled {
    @apply text-quaternary cursor-not-allowed;
  }

  .elements-v2-button.elements-button-tertiary:disabled svg,
  .elements-v2-button.elements-button-tertiary.disabled svg {
    @apply text-quaternary;
  }

  /* --- Link styles --- */
  .elements-link-secondary {
    @apply font-medium border-b border-transparent transition-colors duration-150 text-tertiary;
  }

  .elements-link-secondary:hover {
    @apply border-current text-secondary;
  }

  .elements-link-secondary-sm {
    @apply u-body-sm;
  }

  /* --- Payroll --- */
  .payroll-software-grant {
    @apply flex justify-center items-center px-1 py-1 text-center u-body-md font-medium tracking-sm text-brand hover:text-brand;
  }

  /* --- Google Places Autocomplete --- */
  .pac-item {
    @apply px-2 rounded-md border-t-0 hover:bg-secondary;
  }
  .pac-item > .pac-item-query {
    @apply u-body-md tracking-sm text-secondary;
  }
  .pac-item > span {
    @apply text-xs text-secondary leading-body-default tracking-sm;
  }

  .pac-icon.pac-icon-marker {
    @apply hidden;
  }
  .pac-item.pac-item-selected {
    @apply bg-secondary;
  }
  .pac-container {
    @apply p-1;
  }

  /* --- Floating labels --- */
  .floating-label-input {
    @apply error:border-error-subtle mt-1 appearance-none border border-tertiary rounded-lg w-full py-2 px-3 bg-primary focus:outline-none focus:ring-0 focus:border-brand text-primary leading-6 transition-colors duration-200 ease-in-out !mt-0 h-14 pt-7;
  }
  .floating-label-label {
    @apply absolute px-3 top-1/2 -translate-y-full pointer-events-none font-normal text-xs leading-body-default transition-all peer-data-[styled-select-selection-value='']/styled-select:-translate-y-1/2 peer-data-[styled-select-selection-value='']/styled-select:text-base peer-placeholder-shown:-translate-y-1/2 peer-placeholder-shown:text-base group-focus-within/hover-label:!-translate-y-full group-focus-within/hover-label:!text-xs group-focus-within/hover-label:!leading-body-default text-tertiary;
  }
  .floating-label-label-sm {
    @apply absolute px-3 top-1/2 -translate-y-full pointer-events-none font-normal text-xs leading-body-default transition-all peer-data-[styled-select-selection-value='']/styled-select:-translate-y-1/2 peer-data-[styled-select-selection-value='']/styled-select:text-sm peer-placeholder-shown:-translate-y-1/2 peer-placeholder-shown:text-sm group-focus-within/hover-label:!-translate-y-full group-focus-within/hover-label:!text-xs group-focus-within/hover-label:!leading-body-default text-tertiary;
  }
  /* --- Editable table --- */
  .outline-solid {
    outline-style: solid;
  }
  .shareholder-table-grid {
    @apply grid-cols-[8.4rem_8.4rem_8.4rem_8.4rem_6rem_8.4rem_2rem];
  }
  .editable-table__shareholder-grid {
    @apply grid-cols-[8.4rem_8.4rem_8.4rem_8.4rem_6rem_8.4rem];
  }
  .editable-table__payroll-grid {
    @apply grid-cols-[8.6rem_8.6rem_8.6rem_8.6rem_8.6rem_5rem];
  }
  .editable-table__shell {
    @apply relative;
  }
  .editable-table__add-row:hover .editable-table__add-row-trigger {
    @apply opacity-100 pointer-events-auto;
  }
  .editable-table:has(.editable-table__body > .editable-table__row:last-child:hover):not(:has(:focus-within)) .editable-table__add-row-trigger,
  .editable-table:has(.editable-table__body > *:last-child > .editable-table__row:hover):not(:has(:focus-within)) .editable-table__add-row-trigger {
    @apply opacity-100 pointer-events-auto;
  }
  .editable-table__add-row-button {
    @apply w-full justify-center gap-0 h-4 box-border rounded px-0 py-0.5;
  }
  .editable-table__add-row-button .button-text {
    @apply hidden;
  }
  .editable-table__dropdown-options:not(:has(.option:not(.hidden))) .editable-table__dropdown-empty {
    @apply flex;
  }
  /* Cell indicator (e.g., percent owned) - sits above cell content but below focused inputs and tooltips */
  .editable-table__cell-indicator {
    @apply z-[45];
  }
  /* Bottom-left corner rounding for last row */
  .editable-table__body > .editable-table__row:last-child .editable-table__cell:first-child,
  .editable-table__body > *:last-child > .editable-table__row .editable-table__cell:first-child {
    @apply rounded-bl-md;
  }
  /* Bottom-right corner rounding for last row */
  .editable-table__body > .editable-table__row:last-child .editable-table__cell:last-child,
  .editable-table__body > *:last-child > .editable-table__row .editable-table__cell:last-child {
    @apply rounded-br-md;
  }
  /* Bottom-right corner when row has action (action cell is last, so second-to-last is the visual last) */
  .editable-table__body > .editable-table__row:last-child:has(.editable-table__row-action) .editable-table__cell:nth-last-child(2),
  .editable-table__body > *:last-child > .editable-table__row:has(.editable-table__row-action) .editable-table__cell:nth-last-child(2) {
    @apply rounded-br-md;
  }
  /* Bottom-left focused-edit rounding */
  .editable-table__body > .editable-table__row:last-child .editable-table__cell:first-child .editable-table__focused-edit,
  .editable-table__body > *:last-child > .editable-table__row .editable-table__cell:first-child .editable-table__focused-edit {
    @apply rounded-bl-md;
  }
  /* Bottom-left input rounding */
  .editable-table__body > .editable-table__row:last-child .editable-table__cell:first-child input,
  .editable-table__body > *:last-child > .editable-table__row .editable-table__cell:first-child input {
    @apply rounded-bl-md;
  }
  /* Bottom-left contenteditable rounding */
  .editable-table__body > .editable-table__row:last-child .editable-table__cell:first-child [contenteditable='plaintext-only'],
  .editable-table__body > *:last-child > .editable-table__row .editable-table__cell:first-child [contenteditable='plaintext-only'] {
    @apply rounded-bl-md;
  }
  /* Bottom-right input rounding */
  .editable-table__body > .editable-table__row:last-child .editable-table__cell:last-child input,
  .editable-table__body > *:last-child > .editable-table__row .editable-table__cell:last-child input {
    @apply rounded-br-md;
  }
  /* Bottom-right input rounding with row action */
  .editable-table__body > .editable-table__row:last-child:has(.editable-table__row-action) .editable-table__cell:nth-last-child(2) input,
  .editable-table__body > *:last-child > .editable-table__row:has(.editable-table__row-action) .editable-table__cell:nth-last-child(2) input {
    @apply rounded-br-md;
  }
  /* Bottom-right focused-edit rounding */
  .editable-table__body > .editable-table__row:last-child .editable-table__cell:last-child .editable-table__focused-edit,
  .editable-table__body > *:last-child > .editable-table__row .editable-table__cell:last-child .editable-table__focused-edit {
    @apply rounded-br-md;
  }
  /* Bottom-right focused-edit rounding with row action */
  .editable-table__body > .editable-table__row:last-child:has(.editable-table__row-action) .editable-table__cell:nth-last-child(2) .editable-table__focused-edit,
  .editable-table__body > *:last-child > .editable-table__row:has(.editable-table__row-action) .editable-table__cell:nth-last-child(2) .editable-table__focused-edit {
    @apply rounded-br-md;
  }
  /* Bottom-right contenteditable rounding */
  .editable-table__body > .editable-table__row:last-child .editable-table__cell:last-child [contenteditable='plaintext-only'],
  .editable-table__body > *:last-child > .editable-table__row .editable-table__cell:last-child [contenteditable='plaintext-only'] {
    @apply rounded-br-md;
  }
  /* Bottom-right contenteditable rounding with row action */
  .editable-table__body > .editable-table__row:last-child:has(.editable-table__row-action) .editable-table__cell:nth-last-child(2) [contenteditable='plaintext-only'],
  .editable-table__body > *:last-child > .editable-table__row:has(.editable-table__row-action) .editable-table__cell:nth-last-child(2) [contenteditable='plaintext-only'] {
    @apply rounded-br-md;
  }

  /* ═══════════════════════════════════════════════════════════════════════════
     Corner rounding for second-to-last row when last row is exiting
     ═══════════════════════════════════════════════════════════════════════════ */
  /* Bottom-left corner - direct rows */
  .editable-table__body:has(> .editable-table__row.editable-row-exit:last-child) > .editable-table__row:nth-last-child(2):not(.editable-row-exit) .editable-table__cell:first-child {
    @apply rounded-bl-md;
  }
  /* Bottom-left corner - wrapped rows */
  .editable-table__body:has(> *:last-child .editable-row-exit) > *:nth-last-child(2) .editable-table__row:not(.editable-row-exit) .editable-table__cell:first-child {
    @apply rounded-bl-md;
  }
  /* Bottom-right corner - direct rows */
  .editable-table__body:has(> .editable-table__row.editable-row-exit:last-child) > .editable-table__row:nth-last-child(2):not(.editable-row-exit):has(.editable-table__row-action) .editable-table__cell:nth-last-child(2) {
    @apply rounded-br-md;
  }
  /* Bottom-right corner - wrapped rows */
  .editable-table__body:has(> *:last-child .editable-row-exit) > *:nth-last-child(2) .editable-table__row:not(.editable-row-exit):has(.editable-table__row-action) .editable-table__cell:nth-last-child(2) {
    @apply rounded-br-md;
  }
  /* Bottom-left focused-edit - direct rows */
  .editable-table__body:has(> .editable-table__row.editable-row-exit:last-child) > .editable-table__row:nth-last-child(2):not(.editable-row-exit) .editable-table__cell:first-child .editable-table__focused-edit {
    @apply rounded-bl-md;
  }
  /* Bottom-left focused-edit - wrapped rows */
  .editable-table__body:has(> *:last-child .editable-row-exit) > *:nth-last-child(2) .editable-table__row:not(.editable-row-exit) .editable-table__cell:first-child .editable-table__focused-edit {
    @apply rounded-bl-md;
  }
  /* Bottom-left input - direct rows */
  .editable-table__body:has(> .editable-table__row.editable-row-exit:last-child) > .editable-table__row:nth-last-child(2):not(.editable-row-exit) .editable-table__cell:first-child input {
    @apply rounded-bl-md;
  }
  /* Bottom-left input - wrapped rows */
  .editable-table__body:has(> *:last-child .editable-row-exit) > *:nth-last-child(2) .editable-table__row:not(.editable-row-exit) .editable-table__cell:first-child input {
    @apply rounded-bl-md;
  }
  /* Bottom-left contenteditable - direct rows */
  .editable-table__body:has(> .editable-table__row.editable-row-exit:last-child) > .editable-table__row:nth-last-child(2):not(.editable-row-exit) .editable-table__cell:first-child [contenteditable='plaintext-only'] {
    @apply rounded-bl-md;
  }
  /* Bottom-left contenteditable - wrapped rows */
  .editable-table__body:has(> *:last-child .editable-row-exit) > *:nth-last-child(2) .editable-table__row:not(.editable-row-exit) .editable-table__cell:first-child [contenteditable='plaintext-only'] {
    @apply rounded-bl-md;
  }
  /* Bottom-right input - direct rows */
  .editable-table__body:has(> .editable-table__row.editable-row-exit:last-child) > .editable-table__row:nth-last-child(2):not(.editable-row-exit):has(.editable-table__row-action) .editable-table__cell:nth-last-child(2) input {
    @apply rounded-br-md;
  }
  /* Bottom-right input - wrapped rows */
  .editable-table__body:has(> *:last-child .editable-row-exit) > *:nth-last-child(2) .editable-table__row:not(.editable-row-exit):has(.editable-table__row-action) .editable-table__cell:nth-last-child(2) input {
    @apply rounded-br-md;
  }
  /* Bottom-right focused-edit - direct rows */
  .editable-table__body:has(> .editable-table__row.editable-row-exit:last-child) > .editable-table__row:nth-last-child(2):not(.editable-row-exit):has(.editable-table__row-action) .editable-table__cell:nth-last-child(2) .editable-table__focused-edit {
    @apply rounded-br-md;
  }
  /* Bottom-right focused-edit - wrapped rows */
  .editable-table__body:has(> *:last-child .editable-row-exit) > *:nth-last-child(2) .editable-table__row:not(.editable-row-exit):has(.editable-table__row-action) .editable-table__cell:nth-last-child(2) .editable-table__focused-edit {
    @apply rounded-br-md;
  }
  /* Bottom-right contenteditable - direct rows */
  .editable-table__body:has(> .editable-table__row.editable-row-exit:last-child) > .editable-table__row:nth-last-child(2):not(.editable-row-exit):has(.editable-table__row-action) .editable-table__cell:nth-last-child(2) [contenteditable='plaintext-only'] {
    @apply rounded-br-md;
  }
  /* Bottom-right contenteditable - wrapped rows */
  .editable-table__body:has(> *:last-child .editable-row-exit) > *:nth-last-child(2) .editable-table__row:not(.editable-row-exit):has(.editable-table__row-action) .editable-table__cell:nth-last-child(2) [contenteditable='plaintext-only'] {
    @apply rounded-br-md;
  }

  .editable-table__focused-edit:focus {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    width: max-content;
    max-width: 13.75rem;
    overflow-x: auto;
    overflow-y: hidden;
    text-overflow: clip;
  }
  /* --- Data table & payroll placeholders --- */
  .data-table-cell-content:before {
    @apply text-sm pointer-events-none text-disabled;
  }
  p.error-message.with-icon:before {
    content: url("data:image/svg+xml,%3Csvg width='14' height='12' viewBox='0 0 14 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.48408 1.75195C6.15754 0.584636 7.84228 0.584636 8.51573 1.75195L12.8058 9.18799C13.4788 10.3547 12.6368 11.8125 11.2899 11.8125H2.70988C1.36298 11.8125 0.520983 10.3547 1.19406 9.18799L5.48408 1.75195ZM7.00003 4.81247C7.24166 4.81247 7.43753 5.00835 7.43753 5.24997V7.43747C7.43753 7.67909 7.24166 7.87497 7.00003 7.87497C6.75841 7.87497 6.56253 7.67909 6.56253 7.43747V5.24997C6.56253 5.00835 6.75841 4.81247 7.00003 4.81247ZM7.00003 9.62497C7.24166 9.62497 7.43753 9.42909 7.43753 9.18747C7.43753 8.94585 7.24166 8.74997 7.00003 8.74997C6.75841 8.74997 6.56253 8.94585 6.56253 9.18747C6.56253 9.42909 6.75841 9.62497 7.00003 9.62497Z' fill='#D9175B'/%3E%3C/svg%3E%0A");
    @apply flex justify-center items-center leading-3 text-error;
  }
  #payroll-table .editable-table__body > .payroll-table:first-child > .payroll-name div[contenteditable]:empty:before {
    content: 'Brian Chesky';
    @apply text-sm pointer-events-none text-disabled;
  }
  #payroll-table .payroll-cell:focus-within {
    z-index: 100;
  }
  #payroll-table .editable-table__body > .payroll-table:first-child > .payroll-role div.select:empty:before {
    content: 'Product';
    @apply text-sm pointer-events-none text-disabled;
  }
  #payroll-table .editable-table__body > .payroll-table:first-child > .payroll-type div.select:empty:before {
    content: 'Salary';
    @apply text-sm pointer-events-none text-disabled;
  }
  #payroll-table .editable-table__body > .payroll-table:first-child .payroll-location:not(.has-selection) div.search-field[contenteditable]:empty:before {
    content: 'US - CA';
    @apply text-sm pointer-events-none text-disabled;
  }

  #payroll-table .editable-table__body > .payroll-table:first-child > .payroll-comp {
    div.comp-amount-input[contenteditable]:empty:before {
      content: '$100,000';
      @apply text-sm text-right tabular-nums pointer-events-none text-disabled;
    }
  }
  #payroll-table .editable-table__body > .payroll-table > .payroll-comp {
    div.comp-amount-input[contenteditable]:empty:focus-within:before {
      content: '';
    }
  }
  #payroll-table .editable-table__body > .payroll-table:first-child > .payroll-comp div.comp-currency-input[contenteditable]:empty:before {
    content: 'USD';
    @apply text-xs pointer-events-none text-disabled;
  }

  #payroll-table .editable-table__body > .payroll-table:first-child > .payroll-rdp {
    div[contenteditable]:empty:before {
      content: '80%';
      @apply text-sm text-right tabular-nums pointer-events-none text-disabled;
    }
  }
  #payroll-table .editable-table__body > .payroll-table > .payroll-rdp {
    div[contenteditable]:empty:focus-within:before {
      content: '';
    }
  }

  /* --- Tooltips --- */
  .tt-container {
    @apply relative;
  }

  .tt {
    text-wrap: wrap;
    @apply pointer-events-none z-[100] absolute left-1/2 -translate-x-1/2 bottom-full mb-1 max-w-[24rem] w-max px-2 py-1 bg-secondary-solid tracking-wide  text-inverse-primary text-xs rounded-md opacity-0 transition-opacity group-hover/tt:opacity-100 leading-tt;
  }

  /* --- Checkboxes --- */
  input[type="checkbox"]:checked, input[type="checkbox"]:checked:hover, input[type="checkbox"]:checked:focus  {
    background: linear-gradient(180deg, theme('colors.blue.400') 0%, theme('colors.blue.500') 83.65%), theme('colors.blue.500');
    @apply relative border-brand;
  }
  input[type="checkbox"]:checked:hover {
    background: linear-gradient(180deg, theme('colors.blue.400') 0%, theme('colors.blue.500') 83.65%), theme('colors.blue.500');
    @apply border-brand;
  }
  input[type="checkbox"]:checked::before {
    content: url("data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 10 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 4.45L4.77273 6.25L7.5 1.75' stroke='%230F0C0C' stroke-opacity='0.1' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M3 5.45L4.77273 7.25L7.5 2.75' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    @apply flex absolute top-0 left-0 justify-center items-center w-full h-full;
  }

  .tt.tt-bottom {
    @apply top-full bottom-auto mb-0 translate-y-1.5;
  }
  .tt.tt-bottom::before {
    content: url("data:image/svg+xml,%3Csvg width='21' height='9' viewBox='0 0 21 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.3 1.06667L15.3 6.4C16.0554 7.40722 17.241 8 18.5 8H20.5V9H0.5V8H2.5C3.75903 8 4.94458 7.40722 5.7 6.4L9.7 1.06667C10.1 0.533333 10.9 0.533333 11.3 1.06667Z' fill='%2341415A'/%3E%3C/svg%3E%0A");
    @apply absolute top-[-2px] w-auto h-[9px] -translate-y-full left-1/2 -translate-x-1/2 border-0 bg-transparent;
  }
  .tt.tt-right {
    @apply translate-x-full top-0 bottom-auto left-auto -right-2
  }
  .tt.tt-right::before {
    content: url("data:image/svg+xml,%3Csvg width='8' height='18' viewBox='0 0 8 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M-3.71547e-07 9L7.11111 14.1L7.11111 17.5L8 17.5L8 0.5L7.11111 0.5L7.11111 3.9L-3.71547e-07 9Z' fill='%2341415A'/%3E%3C/svg%3E%0A");
    @apply absolute top-1/2 w-auto h-[9px] -translate-y-full left-[2px] -translate-x-full border-0 bg-transparent;
  }
  /* --- Submitting buttons --- */
  button.submitting:before {
    @apply w-4 h-4 animate-spin text-brand;
  }
  button.submitting {
    @apply gap-x-2 pointer-events-none;
  }
  body {
    counter-increment: step 0;
  }
  .step {
    counter-increment: step;
  }
  .step-content:before {
    content: counter(step);
  }
  /* --- Pagination --- */
  .page.active {
    @apply inline-flex relative z-10 items-center px-4 py-2 text-sm font-semibold text-inverse-primary bg-brand focus:z-20 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-brand;
  }
  .page {
    @apply inline-flex relative items-center px-4 py-2 text-sm font-semibold text-primary ring-1 ring-inset ring-tertiary hover:bg-secondary-subtle focus:z-20 focus:outline-offset-0;
  }
  .pagy-nav.pagination {
    @apply inline-flex isolate -space-x-px rounded-md shadow-sm;
  }
  .pagy-info {
    @apply text-sm text-secondary;
  }
  .pagy-info > b {
    @apply font-medium;
  }
  /* --- Drag & drop --- */
  .draggable-source--is-dragging {
    @apply border border-info-subtle bg-brand-subtle rounded
  }
  input[type="date"]::-webkit-inner-spin-button,
  input[type="date"]::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
  }
          .remove-arrow::-webkit-inner-spin-button,
        .remove-arrow::-webkit-outer-spin-button {
            -webkit-appearance: none;
            margin: 0;
        }
  /* --- Table data grid --- */
  .table-data {
    @apply grid grid-cols-[auto,130px,130px,130px,130px,130px] auto-cols-max col-span-6 gap-x-2 w-full overflow-visible
  }
}

/* =============================================================================
   @layer utilities
   ============================================================================= */
@layer utilities {
  /* Subtle elevated surface gradient (white to gray-25) */
  .bg-gradient-elevated {
    background-image: linear-gradient(180deg, theme('colors.white') 0%, theme('colors.gray.25') 83.65%);
  }

  input.custom-check {
    @apply relative appearance-none inline-flex h-4 w-4 shrink-0 items-center justify-center rounded bg-primary shadow-v2-input border-0 cursor-pointer focus:ring-0 focus:ring-offset-0;
  }

  input.custom-check:checked {
    @apply bg-brand shadow-control-on bg-none;
  }

  input.custom-check:checked::before {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4.75 8.65L7.31061 11.25L11.25 4.75' stroke='white' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    @apply flex absolute inset-0 items-center justify-center;
  }

  input.custom-check:indeterminate {
    @apply bg-brand shadow-control-on bg-none;
  }

  input.custom-check:indeterminate::before {
    content: '';
    @apply absolute left-1/2 top-1/2 h-0.5 w-2 -translate-x-1/2 -translate-y-1/2 rounded-full bg-primary;
  }

  input.custom-check:disabled,
  input.custom-check.disabled {
    @apply opacity-50 cursor-not-allowed;
  }
}

/* =============================================================================
   SCROLLBAR STYLES (outside layers for browser compat)
   ============================================================================= */
.search-results-list {
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
}
.search-results-list.mouse-over {
  scrollbar-color: theme('colors.gray.300') transparent;
}
.search-results-list::-webkit-scrollbar {
  width: 8px;
}
.search-results-list::-webkit-scrollbar-track {
  background: transparent;
}
.search-results-list::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: 9999px;
  border: 2px solid transparent;
  border-right-width: 3px;
  background-clip: content-box;
}
.search-results-list.mouse-over::-webkit-scrollbar-thumb {
  background: theme('colors.gray.300');
  border: 2px solid transparent;
  border-right-width: 3px;
  background-clip: content-box;
}
/* Variable fonts usage:
:root { font-family: "Inter", sans-serif; }
@supports (font-variation-settings: normal) {
  :root { font-family: "InterVariable", sans-serif; font-optical-sizing: auto; }
} */
@font-face {
  font-family: InterVariable;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/InterVariable-5db5a521938db7aaba812b5ef28f057725d3622a1e81c0a6ecd3ca6efd0a04ad.woff2) format("woff2");
}
@font-face {
  font-family: InterVariable;
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/InterVariable-Italic-635017f7110876734b249b2917840fc9ca2e4af3b066d5b326d4aaf071c05eaf.woff2) format("woff2");
}

/* static fonts */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100; font-display: swap; src: url(/assets/Inter-Thin-8861f06fe791a1913f1665bf4351a2063ce78a714380b8926daf120bfb2cc415.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 100; font-display: swap; src: url(/assets/Inter-ThinItalic-5d155acf67f9ec89584416879704983db06e061d72960d63555e9ed9e6b241c2.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 200; font-display: swap; src: url(/assets/Inter-ExtraLight-617dd36cc733d20cb9e623f080a57a0b14a297beffefcd8423aa781ea00c6dfb.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 200; font-display: swap; src: url(/assets/Inter-ExtraLightItalic-dd3b2dc162e0573d740cf41e06791b1bd1962afe784ddababe18d99400392e68.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 300; font-display: swap; src: url(/assets/Inter-Light-dfa7e89569b7f7ca04886d9cb5fd8134edc102665c13d9bd48e2d1e71f259f68.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 300; font-display: swap; src: url(/assets/Inter-LightItalic-8108bd691de06e316c975e6efc5dc1813ebc0b81d4fdf3f919c99bb7d36532e4.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/Inter-Regular-5ff914dcc4f17d16b53a50999fa201bd71eff430101aa255cd2e2c4b3b9ca8f5.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 400; font-display: swap; src: url(/assets/Inter-Italic-8f4411341b759b8021378a00d7f2d9c8bc0cb393e7158345077147d57225eba6.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url(/assets/Inter-Medium-6a5412fa515d59e84c9dac4f01f6de2b4b6e355a37ed1a585cc31cbde296dc4c.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 500; font-display: swap; src: url(/assets/Inter-MediumItalic-494ccf97ddb0143f4105a90f52a22be0208a65b71cef8ba58148eb622ccf2d3e.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/Inter-SemiBold-97fc520ab935d5b172431674e4968af12db7e5a6d07330c0a054bf6b7864f938.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 600; font-display: swap; src: url(/assets/Inter-SemiBoldItalic-c3cac38cbc97de04d0577e448b20f3c424c2726136771abbd7caff49d8a0e843.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/Inter-Bold-8b879e329596393ae87ea8776e1e1f3aa6ccd95da26927ed7108c25c5425d33e.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 700; font-display: swap; src: url(/assets/Inter-BoldItalic-b35668c2a100a8b142d3462136e019393ae66c7f2af75b8ed8427ee91e49a8d1.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 800; font-display: swap; src: url(/assets/Inter-ExtraBold-8c48ede6c7c3c67c3a6be7567926694e5cd1eb798b7ff73d29bbccb751c89703.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 800; font-display: swap; src: url(/assets/Inter-ExtraBoldItalic-14b7a2758074062d7a48e43324e7f4723d230426f5261f705a88c8fa51e3bb1b.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 900; font-display: swap; src: url(/assets/Inter-Black-1bcb48b7543ca20ae21321dad362bc32f525c2e836444a84712ee9b6f9392fbb.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 900; font-display: swap; src: url(/assets/Inter-BlackItalic-911904f1cae10e27cc9c2521f6e385ff2be13b4a2a242da3270f165bf95e7c0c.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 100; font-display: swap; src: url(/assets/InterDisplay-Thin-ea12b81865e990076f05ce21778ff2d7ba3002353e019ecdb28abd70c128ef66.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 100; font-display: swap; src: url(/assets/InterDisplay-ThinItalic-867dc625851de3f5efb29345f5459896b41fa016a6e0550a243b75d2459a900b.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 200; font-display: swap; src: url(/assets/InterDisplay-ExtraLight-48cbaf521acc083dc515ef959aaba5f00439dc4968ade1b9d28be4e4139cb0cc.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 200; font-display: swap; src: url(/assets/InterDisplay-ExtraLightItalic-e149c8ff7e578f23c63b928b385f1d44ff09e74c673f8a404a079938184f011f.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 300; font-display: swap; src: url(/assets/InterDisplay-Light-6065f9c63d0f23d7a466f69c80e0635f3146c18abc823102b9915bdea8c58319.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 300; font-display: swap; src: url(/assets/InterDisplay-LightItalic-94cc598b2e3a5643757362c7c70ff14cb2e92e422efdd2d7bb99490e843aced2.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/InterDisplay-Regular-bcf5b6ad4c8f3413e444d1a57f59cda799bae37a1caf39c8b6382f79403449ed.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 400; font-display: swap; src: url(/assets/InterDisplay-Italic-a02bf14920dbd2ff2d80846b3da3ea9b68fdaccab2b03f17649b9681a67b96ac.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 500; font-display: swap; src: url(/assets/InterDisplay-Medium-3a8b9c4cd4b8458ebdb4f648558e56be542ea80eaaf3ee2768d487a12a967c5c.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 500; font-display: swap; src: url(/assets/InterDisplay-MediumItalic-9b22eaabdac4ad5fd8da25f015b6d6b3daf64f627fcd5f3d62575b34df99c6e0.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/InterDisplay-SemiBold-5942e5d7eaf37b5c5d589484d8d4160f2c0c392a83408b35ebbac08c56956c12.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 600; font-display: swap; src: url(/assets/InterDisplay-SemiBoldItalic-2f7bcdd7c20989dd60f88b59b4a28c5481e7b5ca246d9aac0ed34820586f9c87.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/InterDisplay-Bold-4fa6e65712642460c076ea4d6cbb3dcc729c9f60895409e0cb1a9199dc8e6aa0.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 700; font-display: swap; src: url(/assets/InterDisplay-BoldItalic-6c2dbe958c200c93d29b0c7005ea7535343b42a73772a26e7a027d835c314717.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 800; font-display: swap; src: url(/assets/InterDisplay-ExtraBold-0adfa52a4cfd8abf77aedecc763d8e62edd76dbff0eb4a48d1892cded15549bf.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 800; font-display: swap; src: url(/assets/InterDisplay-ExtraBoldItalic-5d993de7d2b3ddcaa69a11d4502a4532078c17f3070c77a572cfe11fab52bddd.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 900; font-display: swap; src: url(/assets/InterDisplay-Black-91c25f91be1c383f8cd8cbc80b2242e94aa11ad8958e9a54f5bfcbfed510e05d.woff2) format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 900; font-display: swap; src: url(/assets/InterDisplay-BlackItalic-0b4c26dd2d33852659126b466567e65f9011715081f3b7f2d06229871fcfcc5a.woff2) format("woff2"); }

@font-feature-values InterVariable {
    @character-variant {
        cv01: 1; cv02: 2; cv03: 3; cv04: 4; cv05: 5; cv06: 6; cv07: 7; cv08: 8;
        cv09: 9; cv10: 10; cv11: 11; cv12: 12; cv13: 13;
        alt-1:            1; /* Alternate one */
        alt-3:            9; /* Flat-top three */
        open-4:           2; /* Open four */
        open-6:           3; /* Open six */
        open-9:           4; /* Open nine */
        lc-l-with-tail:   5; /* Lower-case L with tail */
        simplified-u:     6; /* Simplified u */
        alt-double-s:     7; /* Alternate German double s */
        uc-i-with-serif:  8; /* Upper-case i with serif */
        uc-g-with-spur:  10; /* Capital G with spur */
        single-story-a:  11; /* Single-story a */
        compact-lc-f:    12; /* Compact f */
        compact-lc-t:    13; /* Compact t */
    }
    @styleset {
        ss01: 1; ss02: 2; ss03: 3; ss04: 4; ss05: 5; ss06: 6; ss07: 7; ss08: 8;
        open-digits: 1;                /* Open digits */
        disambiguation: 2;             /* Disambiguation (with zero) */
        disambiguation-except-zero: 4; /* Disambiguation (no zero) */
        round-quotes-and-commas: 3;    /* Round quotes &amp; commas */
        square-punctuation: 7;         /* Square punctuation */
        square-quotes: 8;              /* Square quotes */
        circled-characters: 5;         /* Circled characters */
        squared-characters: 6;         /* Squared characters */
    }
}
@font-feature-values Inter {
    @character-variant {
        cv01: 1; cv02: 2; cv03: 3; cv04: 4; cv05: 5; cv06: 6; cv07: 7; cv08: 8;
        cv09: 9; cv10: 10; cv11: 11; cv12: 12; cv13: 13;
        alt-1:            1; /* Alternate one */
        alt-3:            9; /* Flat-top three */
        open-4:           2; /* Open four */
        open-6:           3; /* Open six */
        open-9:           4; /* Open nine */
        lc-l-with-tail:   5; /* Lower-case L with tail */
        simplified-u:     6; /* Simplified u */
        alt-double-s:     7; /* Alternate German double s */
        uc-i-with-serif:  8; /* Upper-case i with serif */
        uc-g-with-spur:  10; /* Capital G with spur */
        single-story-a:  11; /* Single-story a */
        compact-lc-f:    12; /* Compact f */
        compact-lc-t:    13; /* Compact t */
    }
    @styleset {
        ss01: 1; ss02: 2; ss03: 3; ss04: 4; ss05: 5; ss06: 6; ss07: 7; ss08: 8;
        open-digits: 1;                /* Open digits */
        disambiguation: 2;             /* Disambiguation (with zero) */
        disambiguation-except-zero: 4; /* Disambiguation (no zero) */
        round-quotes-and-commas: 3;    /* Round quotes &amp; commas */
        square-punctuation: 7;         /* Square punctuation */
        square-quotes: 8;              /* Square quotes */
        circled-characters: 5;         /* Circled characters */
        squared-characters: 6;         /* Squared characters */
    }
}
@font-feature-values InterDisplay {
    @character-variant {
        cv01: 1; cv02: 2; cv03: 3; cv04: 4; cv05: 5; cv06: 6; cv07: 7; cv08: 8;
        cv09: 9; cv10: 10; cv11: 11; cv12: 12; cv13: 13;
        alt-1:            1; /* Alternate one */
        alt-3:            9; /* Flat-top three */
        open-4:           2; /* Open four */
        open-6:           3; /* Open six */
        open-9:           4; /* Open nine */
        lc-l-with-tail:   5; /* Lower-case L with tail */
        simplified-u:     6; /* Simplified u */
        alt-double-s:     7; /* Alternate German double s */
        uc-i-with-serif:  8; /* Upper-case i with serif */
        uc-g-with-spur:  10; /* Capital G with spur */
        single-story-a:  11; /* Single-story a */
        compact-lc-f:    12; /* Compact f */
        compact-lc-t:    13; /* Compact t */
    }
    @styleset {
        ss01: 1; ss02: 2; ss03: 3; ss04: 4; ss05: 5; ss06: 6; ss07: 7; ss08: 8;
        open-digits: 1;                /* Open digits */
        disambiguation: 2;             /* Disambiguation (with zero) */
        disambiguation-except-zero: 4; /* Disambiguation (no zero) */
        round-quotes-and-commas: 3;    /* Round quotes &amp; commas */
        square-punctuation: 7;         /* Square punctuation */
        square-quotes: 8;              /* Square quotes */
        circled-characters: 5;         /* Circled characters */
        squared-characters: 6;         /* Squared characters */
    }
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */