/*! Ansar Alhoda UI • Tailwind CSS v4 • build 9.10.10 */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: "IRANSansApp", Tahoma, Arial, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --color-amber-50: oklch(98.7% 0.022 95.277);
    --color-amber-100: oklch(96.2% 0.059 95.617);
    --color-amber-200: oklch(92.4% 0.12 95.746);
    --color-amber-700: oklch(55.5% 0.163 48.998);
    --color-amber-800: oklch(47.3% 0.137 46.201);
    --color-emerald-50: oklch(97.9% 0.021 166.113);
    --color-emerald-100: oklch(95% 0.052 163.051);
    --color-emerald-200: oklch(90.5% 0.093 164.15);
    --color-emerald-400: oklch(76.5% 0.177 163.223);
    --color-emerald-700: oklch(50.8% 0.118 165.612);
    --color-emerald-800: oklch(43.2% 0.095 166.913);
    --color-sky-50: oklch(97.7% 0.013 236.62);
    --color-sky-100: oklch(95.1% 0.026 236.824);
    --color-sky-700: oklch(50% 0.134 242.749);
    --color-sky-800: oklch(44.3% 0.11 240.79);
    --color-violet-50: oklch(96.9% 0.016 293.756);
    --color-violet-700: oklch(49.1% 0.27 292.581);
    --color-rose-50: oklch(96.9% 0.015 12.422);
    --color-rose-100: oklch(94.1% 0.03 12.58);
    --color-rose-200: oklch(89.2% 0.058 10.001);
    --color-rose-600: oklch(58.6% 0.253 17.585);
    --color-rose-700: oklch(51.4% 0.222 16.935);
    --color-slate-50: oklch(98.4% 0.003 247.858);
    --color-slate-100: oklch(96.8% 0.007 247.896);
    --color-slate-200: oklch(92.9% 0.013 255.508);
    --color-slate-400: oklch(70.4% 0.04 256.788);
    --color-slate-500: oklch(55.4% 0.046 257.417);
    --color-slate-600: oklch(44.6% 0.043 257.281);
    --color-slate-700: oklch(37.2% 0.044 257.287);
    --color-slate-900: oklch(20.8% 0.042 265.755);
    --color-slate-950: oklch(12.9% 0.042 264.695);
    --color-white: #fff;
    --spacing: 0.25rem;
    --container-lg: 32rem;
    --text-xs: 0.75rem;
    --text-xs--line-height: calc(1 / 0.75);
    --text-sm: 0.875rem;
    --text-sm--line-height: calc(1.25 / 0.875);
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --font-weight-medium: 500;
    --font-weight-bold: 700;
    --font-weight-black: 900;
    --tracking-tight: -0.025em;
    --radius-lg: 0.5rem;
    --radius-xl: 0.75rem;
    --radius-2xl: 1rem;
    --animate-spin: spin 1s linear infinite;
    --blur-sm: 8px;
    --blur-xl: 24px;
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --color-brand-50: #eef8f6;
    --color-brand-100: #d9f0ec;
    --color-brand-200: #b6dfd8;
    --color-brand-400: #4ba69b;
    --color-brand-500: #27867c;
    --color-brand-700: #0f554f;
    --color-brand-800: #0a3f3a;
    --color-brand-900: #07332f;
    --color-surface: #f4f6f6;
    --color-line: #e5eaea;
  }
}
@layer base {
  *, ::after, ::before, ::backdrop, ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }
  html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }
  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }
  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }
  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }
  b, strong {
    font-weight: bolder;
  }
  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }
  small {
    font-size: 80%;
  }
  sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }
  :-moz-focusring {
    outline: auto;
  }
  progress {
    vertical-align: baseline;
  }
  summary {
    display: list-item;
  }
  ol, ul, menu {
    list-style: none;
  }
  img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    vertical-align: middle;
  }
  img, video {
    max-width: 100%;
    height: auto;
  }
  button, input, select, optgroup, textarea, ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    border-radius: 0;
    background-color: transparent;
    opacity: 1;
  }
  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }
  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }
  ::file-selector-button {
    margin-inline-end: 4px;
  }
  ::placeholder {
    opacity: 1;
  }
  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentcolor;
      @supports (color: color-mix(in lab, red, red)) {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }
  textarea {
    resize: vertical;
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }
  ::-webkit-datetime-edit {
    display: inline-flex;
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }
  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }
  :-moz-ui-invalid {
    box-shadow: none;
  }
  button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
    appearance: button;
  }
  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto;
  }
  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }
}
@layer utilities {
  .hidden {
    display: none;
  }
  .size-4 {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }
  .size-5 {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }
  .size-6 {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }
  .animate-spin {
    animation: var(--animate-spin);
  }
  .bg-brand-800 {
    background-color: var(--color-brand-800);
  }
  .text-white {
    color: var(--color-white);
  }
  .hover\:bg-brand-50 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-brand-50);
      }
    }
  }
  .focus\:ring-4 {
    &:focus {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(4px + 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);
    }
  }
  .sm\:p-5 {
    @media (width >= 40rem) {
      padding: calc(var(--spacing) * 5);
    }
  }
  .lg\:hidden {
    @media (width >= 64rem) {
      display: none;
    }
  }
}
@font-face {
  font-family: "IRANSansApp";
  src: url("../../IRANSans.ttf?v=8.0.0") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@layer base {
  :root {
    color-scheme: light;
  }
  * {
    -webkit-tap-highlight-color: transparent;
  }
  html {
    scroll-behavior: smooth;
    background-color: var(--color-surface);
  }
  body {
    margin: calc(var(--spacing) * 0);
    min-height: 100vh;
    background-color: var(--color-surface);
    font-family: var(--font-sans);
    color: var(--color-slate-900);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: "ss01" 1, "tnum" 1;
  }
  button, input, select, textarea, option {
    font: inherit;
  }
  button, a {
    -webkit-touch-callout: none;
  }
  a {
    color: inherit;
    text-decoration-line: none;
  }
  button {
    cursor: pointer;
  }
  input, select, textarea {
    min-width: calc(var(--spacing) * 0);
  }
  ::selection {
    background-color: var(--color-brand-200);
    color: var(--color-brand-900);
  }
}
@layer components {
  .app-body {
    min-height: 100vh;
    overflow-x: hidden;
    background-color: var(--color-surface);
  }
  .app-shell {
    margin-inline: auto;
    min-height: 100vh;
    max-width: 1180px;
    padding-bottom: calc(var(--spacing) * 20);
    @media (width >= 64rem) {
      padding-bottom: calc(var(--spacing) * 6);
    }
  }
  .page-content {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
    }
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 3);
    @media (width >= 40rem) {
      padding-inline: calc(var(--spacing) * 5);
    }
    @media (width >= 40rem) {
      padding-block: calc(var(--spacing) * 4);
    }
    @media (width >= 64rem) {
      padding-inline: calc(var(--spacing) * 6);
    }
  }
  .safe-top {
    padding-top: env(safe-area-inset-top);
  }
  .safe-bottom {
    padding-bottom: max(.35rem, env(safe-area-inset-bottom));
  }
  .hidden {
    display: none !important;
  }
  .num {
    font-variant-numeric: tabular-nums;
  }
  .no-scrollbar {
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  .no-scrollbar::-webkit-scrollbar {
    display: none;
  }
  .icon-xs {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    flex-shrink: 0;
  }
  .icon-sm {
    width: 19px;
    height: 19px;
    flex-shrink: 0;
  }
  .icon-md {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
    flex-shrink: 0;
  }
  .icon-lg {
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
    flex-shrink: 0;
  }
  .brand-mark {
    display: grid;
    width: calc(var(--spacing) * 12);
    height: calc(var(--spacing) * 12);
    flex-shrink: 0;
    place-items: center;
    border-radius: var(--radius-2xl);
    background-color: var(--color-brand-800);
    color: var(--color-white);
    --tw-shadow: 0 10px 28px var(--tw-shadow-color, rgba(10,63,58,.22));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .brand-mark-sm {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
    border-radius: 14px;
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .badge {
    display: inline-flex;
    height: calc(var(--spacing) * 5);
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    border-radius: calc(infinity * 1px);
    padding-inline: calc(var(--spacing) * 2);
    font-size: 9px;
    --tw-leading: 1;
    line-height: 1;
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .badge-warning {
    background-color: var(--color-amber-100);
    color: var(--color-amber-800);
  }
  .badge-success {
    background-color: var(--color-emerald-100);
    color: var(--color-emerald-800);
  }
  .badge-info {
    background-color: var(--color-sky-100);
    color: var(--color-sky-800);
  }
  .badge-danger {
    background-color: var(--color-rose-100);
    color: var(--color-rose-700);
  }
  .badge-neutral {
    background-color: var(--color-slate-100);
    color: var(--color-slate-600);
  }
  .button {
    display: inline-flex;
    height: calc(var(--spacing) * 12);
    align-items: center;
    justify-content: center;
    gap: calc(var(--spacing) * 2);
    border-radius: 15px;
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding-inline: calc(var(--spacing) * 4);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: 200ms;
    transition-duration: 200ms;
    &:disabled {
      pointer-events: none;
    }
    &:disabled {
      opacity: 60%;
    }
  }
  .button:hover {
    transform: translateY(-1px);
  }
  .button-block {
    width: 100%;
  }
  .button-sm {
    height: calc(var(--spacing) * 9);
    border-radius: var(--radius-xl);
    padding-inline: calc(var(--spacing) * 3);
    font-size: 10px;
  }
  .button-primary {
    border-color: var(--color-brand-800);
    background-color: var(--color-brand-800);
    color: var(--color-white);
    --tw-shadow: 0 9px 24px var(--tw-shadow-color, rgba(10,63,58,.18));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .button-primary:hover {
    background-color: var(--color-brand-700);
  }
  .button-secondary {
    border-color: var(--color-slate-200);
    background-color: var(--color-white);
    color: var(--color-slate-600);
  }
  .button-soft {
    border-color: var(--color-brand-100);
    background-color: var(--color-brand-50);
    color: var(--color-brand-700);
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .text-button {
    display: inline-flex;
    align-items: center;
    gap: calc(var(--spacing) * 1);
    border-radius: var(--radius-lg);
    padding-inline: calc(var(--spacing) * 1);
    padding-block: calc(var(--spacing) * 1);
    font-size: 10px;
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: var(--color-brand-700);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-brand-50);
      }
    }
  }
  .icon-button {
    display: grid;
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
    flex-shrink: 0;
    place-items: center;
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-slate-200);
    background-color: var(--color-white);
    color: var(--color-slate-500);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    &:hover {
      @media (hover: hover) {
        border-color: var(--color-brand-200);
      }
    }
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-brand-50);
      }
    }
    &:hover {
      @media (hover: hover) {
        color: var(--color-brand-700);
      }
    }
  }
  .notice {
    display: flex;
    align-items: flex-start;
    gap: calc(var(--spacing) * 2);
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 2.5);
    font-size: 10px;
    --tw-leading: calc(var(--spacing) * 5);
    line-height: calc(var(--spacing) * 5);
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .notice-warning {
    border-color: var(--color-amber-200);
    background-color: var(--color-amber-50);
    color: var(--color-amber-800);
  }
  .alert-box {
    margin-bottom: calc(var(--spacing) * 3);
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 2.5);
    font-size: 11px;
    --tw-leading: calc(var(--spacing) * 5);
    line-height: calc(var(--spacing) * 5);
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .alert-error {
    border-color: var(--color-rose-200);
    background-color: var(--color-rose-50);
    color: var(--color-rose-700);
  }
  .alert-success {
    border-color: var(--color-emerald-200);
    background-color: var(--color-emerald-50);
    color: var(--color-emerald-700);
  }
  .field-group {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .field-label {
    display: block;
    font-size: 11px;
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: var(--color-slate-600);
  }
  .field-wrap {
    position: relative;
    display: block;
  }
  .field-icon {
    pointer-events: none;
    position: absolute;
    inset-block: calc(var(--spacing) * 0);
    right: calc(var(--spacing) * 3.5);
    display: grid;
    place-items: center;
    color: var(--color-slate-400);
  }
  .field-action {
    position: absolute;
    inset-block: calc(var(--spacing) * 0);
    left: calc(var(--spacing) * 2);
    display: grid;
    width: calc(var(--spacing) * 10);
    place-items: center;
    border-radius: var(--radius-xl);
    color: var(--color-slate-400);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    &:hover {
      @media (hover: hover) {
        color: var(--color-brand-700);
      }
    }
  }
  .field-input {
    height: 50px;
    width: 100%;
    border-radius: 15px;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-slate-200);
    background-color: color-mix(in srgb, oklch(98.4% 0.003 247.858) 80%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-slate-50) 80%, transparent);
    }
    padding-right: calc(var(--spacing) * 11);
    padding-left: calc(var(--spacing) * 3);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: var(--color-slate-900);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-outline-style: none;
    outline-style: none;
    &::placeholder {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
    &::placeholder {
      color: var(--color-slate-400);
    }
    &:focus {
      border-color: var(--color-brand-500);
    }
    &:focus {
      background-color: var(--color-white);
    }
    &:focus {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(4px + 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 {
      --tw-ring-color: var(--color-brand-100);
    }
  }
  .field-input-password {
    padding-left: calc(var(--spacing) * 12);
  }
  .field-input-plain {
    padding-inline: calc(var(--spacing) * 3);
  }
  .field-wrap-suffix .field-input {
    padding-left: calc(var(--spacing) * 16);
  }
  .field-suffix {
    pointer-events: none;
    position: absolute;
    inset-block: calc(var(--spacing) * 0);
    left: calc(var(--spacing) * 3);
    display: flex;
    align-items: center;
    font-size: 10px;
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: var(--color-slate-400);
  }
  .details-card {
    border-radius: 15px;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-slate-200);
    background-color: color-mix(in srgb, oklch(98.4% 0.003 247.858) 70%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-slate-50) 70%, transparent);
    }
  }
  .details-card summary {
    display: flex;
    height: calc(var(--spacing) * 11);
    cursor: pointer;
    list-style-type: none;
    align-items: center;
    justify-content: space-between;
    padding-inline: calc(var(--spacing) * 3);
    font-size: 11px;
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: var(--color-slate-500);
  }
  .details-card summary::-webkit-details-marker {
    display: none;
  }
  .details-arrow {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .details-card[open] .details-arrow {
    transform: rotate(180deg);
  }
  .details-content {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: var(--color-slate-200);
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 3);
  }
  .login-page {
    background-color: radial-gradient(circle at 90% 10%,rgba(217,240,236,.9),transparent 38%),radial-gradient(circle at 5% 90%,rgba(224,242,254,.65),transparent 35%),#f4f6f6;
  }
  .login-shell {
    display: flex;
    min-height: 100dvh;
    align-items: center;
    justify-content: center;
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 6);
  }
  .login-panel {
    width: 100%;
    max-width: 390px;
  }
  .login-brand {
    margin-bottom: calc(var(--spacing) * 4);
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 3);
    padding-inline: calc(var(--spacing) * 1);
  }
  .login-brand-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: calc(var(--spacing) * 2);
  }
  .login-title {
    font-size: 17px;
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }
  .login-subtitle {
    margin-top: calc(var(--spacing) * 1);
    font-size: 11px;
    color: var(--color-slate-500);
  }
  .login-card {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
    }
    border-radius: 22px;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-white);
    background-color: color-mix(in srgb, #fff 95%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-white) 95%, transparent);
    }
    padding: calc(var(--spacing) * 4);
    --tw-shadow: 0 14px 42px var(--tw-shadow-color, rgba(15, 23, 42, .075));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-backdrop-blur: blur(var(--blur-xl));
    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    @media (width >= 40rem) {
      padding: calc(var(--spacing) * 5);
    }
  }
  .login-footnote {
    margin-top: calc(var(--spacing) * 3);
    text-align: center;
    font-size: 9px;
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-slate-400);
  }
  .spinner {
    width: 18px;
    height: 18px;
    animation: var(--animate-spin);
    border-radius: calc(infinity * 1px);
    border-style: var(--tw-border-style);
    border-width: 2px;
    border-color: color-mix(in srgb, #fff 30%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-white) 30%, transparent);
    }
    border-top-color: var(--color-white);
  }
  .app-header {
    position: sticky;
    top: calc(var(--spacing) * 0);
    z-index: 40;
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: color-mix(in srgb, oklch(92.9% 0.013 255.508) 70%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-slate-200) 70%, transparent);
    }
    background-color: color-mix(in srgb, #f4f6f6 90%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-surface) 90%, transparent);
    }
    --tw-backdrop-blur: blur(var(--blur-xl));
    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
  }
  .app-header-inner {
    display: flex;
    height: calc(var(--spacing) * 14);
    align-items: center;
    gap: calc(var(--spacing) * 2.5);
    padding-inline: calc(var(--spacing) * 3);
    @media (width >= 40rem) {
      padding-inline: calc(var(--spacing) * 5);
    }
    @media (width >= 64rem) {
      padding-inline: calc(var(--spacing) * 6);
    }
  }
  .app-header-copy {
    min-width: calc(var(--spacing) * 0);
    flex: 1;
  }
  .app-kicker-row {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
  }
  .app-kicker {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 9px;
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-slate-400);
  }
  .app-title {
    margin-top: calc(var(--spacing) * 0.5);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
  }
  .app-header-actions {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
  }
  .balance-card {
    overflow: hidden;
    border-radius: 21px;
    background-color: var(--color-brand-800);
    padding: calc(var(--spacing) * 4);
    color: var(--color-white);
    --tw-shadow: 0 12px 34px var(--tw-shadow-color, rgba(10,63,58,.18));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    @media (width >= 40rem) {
      padding: calc(var(--spacing) * 5);
    }
  }
  .balance-card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: calc(var(--spacing) * 3);
  }
  .balance-label {
    font-size: 10px;
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: color-mix(in srgb, #fff 55%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-white) 55%, transparent);
    }
  }
  .balance-amount-row {
    margin-top: calc(var(--spacing) * 2);
    display: flex;
    align-items: flex-end;
    gap: calc(var(--spacing) * 1.5);
  }
  .balance-amount {
    font-size: 24px;
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
    @media (width >= 40rem) {
      font-size: 30px;
    }
  }
  .balance-amount-row > span {
    padding-bottom: calc(var(--spacing) * 0.5);
    font-size: 9px;
    color: color-mix(in srgb, #fff 50%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-white) 50%, transparent);
    }
  }
  .status-pill {
    display: inline-flex;
    height: calc(var(--spacing) * 6);
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    border-radius: calc(infinity * 1px);
    padding-inline: calc(var(--spacing) * 2.5);
    font-size: 9px;
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .status-active {
    background-color: color-mix(in srgb, #fff 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
    }
    color: var(--color-emerald-100);
  }
  .status-pill i {
    width: calc(var(--spacing) * 1.5);
    height: calc(var(--spacing) * 1.5);
    border-radius: calc(infinity * 1px);
    background-color: var(--color-emerald-400);
  }
  .balance-stats {
    margin-top: calc(var(--spacing) * 4);
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    :where(& > :not(:last-child)) {
      --tw-divide-x-reverse: 0;
      border-inline-style: var(--tw-border-style);
      border-inline-start-width: calc(1px * var(--tw-divide-x-reverse));
      border-inline-end-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
    }
    :where(& > :not(:last-child)) {
      border-color: color-mix(in srgb, #fff 10%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        border-color: color-mix(in oklab, var(--color-white) 10%, transparent);
      }
    }
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: color-mix(in srgb, #fff 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-white) 10%, transparent);
    }
    padding-top: calc(var(--spacing) * 3);
    :where(& > :not(:last-child)) {
      --tw-divide-x-reverse: 1;
    }
  }
  .balance-stat {
    min-width: calc(var(--spacing) * 0);
    padding-inline: calc(var(--spacing) * 2);
    &:first-child {
      padding-right: calc(var(--spacing) * 0);
    }
    &:last-child {
      padding-left: calc(var(--spacing) * 0);
    }
  }
  .balance-stat span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 8px;
    color: color-mix(in srgb, #fff 45%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-white) 45%, transparent);
    }
  }
  .balance-stat strong {
    margin-top: calc(var(--spacing) * 1);
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 10px;
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
    color: color-mix(in srgb, #fff 90%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-white) 90%, transparent);
    }
    @media (width >= 40rem) {
      font-size: var(--text-xs);
      line-height: var(--tw-leading, var(--text-xs--line-height));
    }
  }
  .quick-actions {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow: hidden;
    border-radius: 18px;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-line);
    background-color: var(--color-white);
    --tw-shadow: 0 8px 26px var(--tw-shadow-color, rgba(15, 23, 42, .055));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .quick-action {
    display: flex;
    min-height: 66px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: calc(var(--spacing) * 1.5);
    border-left-style: var(--tw-border-style);
    border-left-width: 1px;
    border-color: var(--color-line);
    padding-inline: calc(var(--spacing) * 1.5);
    padding-block: calc(var(--spacing) * 2);
    text-align: center;
    font-size: 9px;
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
    color: var(--color-slate-700);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    &:last-child {
      border-left-style: var(--tw-border-style);
      border-left-width: 0px;
    }
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-slate-50);
      }
    }
  }
  .quick-action-icon {
    display: grid;
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
    place-items: center;
    border-radius: 11px;
  }
  .tone-emerald {
    background-color: var(--color-emerald-50);
    color: var(--color-emerald-700);
  }
  .tone-sky {
    background-color: var(--color-sky-50);
    color: var(--color-sky-700);
  }
  .tone-amber {
    background-color: var(--color-amber-50);
    color: var(--color-amber-700);
  }
  .tone-violet {
    background-color: var(--color-violet-50);
    color: var(--color-violet-700);
  }
  .dashboard-grid {
    display: grid;
    gap: calc(var(--spacing) * 3);
    @media (width >= 64rem) {
      grid-template-columns: 1.12fr .88fr;
    }
  }
  .dashboard-column {
    min-width: calc(var(--spacing) * 0);
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .panel {
    overflow: hidden;
    border-radius: 20px;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-line);
    background-color: var(--color-white);
    --tw-shadow: 0 8px 26px var(--tw-shadow-color, rgba(15, 23, 42, .055));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .panel-header {
    display: flex;
    min-height: 55px;
    align-items: center;
    justify-content: space-between;
    gap: calc(var(--spacing) * 3);
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--color-line);
    padding-inline: calc(var(--spacing) * 3.5);
    padding-block: calc(var(--spacing) * 2.5);
  }
  .panel-header h2 {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
  }
  .panel-header p {
    margin-top: calc(var(--spacing) * 0.5);
    font-size: 9px;
    color: var(--color-slate-400);
  }
  .panel-count {
    display: grid;
    width: calc(var(--spacing) * 7);
    height: calc(var(--spacing) * 7);
    place-items: center;
    border-radius: var(--radius-lg);
    background-color: var(--color-slate-100);
    font-size: 10px;
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
    color: var(--color-slate-600);
  }
  .account-strip {
    display: flex;
    scroll-snap-type: x var(--tw-scroll-snap-strictness);
    gap: calc(var(--spacing) * 2);
    overflow-x: auto;
    padding: calc(var(--spacing) * 3);
  }
  .account-card {
    min-width: 218px;
    scroll-snap-align: start;
    border-radius: 16px;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-slate-200);
    background-color: color-mix(in srgb, oklch(98.4% 0.003 247.858) 70%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-slate-50) 70%, transparent);
    }
    padding: calc(var(--spacing) * 3);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    &:hover {
      @media (hover: hover) {
        border-color: var(--color-brand-200);
      }
    }
    &:hover {
      @media (hover: hover) {
        background-color: color-mix(in srgb, #eef8f6 30%, transparent);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--color-brand-50) 30%, transparent);
        }
      }
    }
  }
  .account-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: calc(var(--spacing) * 2);
  }
  .account-card-icon {
    display: grid;
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
    place-items: center;
    border-radius: 10px;
    background-color: var(--color-white);
    color: var(--color-brand-700);
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .account-card h3 {
    margin-top: calc(var(--spacing) * 3);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
  }
  .account-card p {
    margin-top: calc(var(--spacing) * 1);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 9px;
    color: var(--color-slate-400);
  }
  .account-balance {
    margin-top: calc(var(--spacing) * 3);
    display: flex;
    align-items: flex-end;
    gap: calc(var(--spacing) * 1);
  }
  .account-balance strong {
    font-size: 15px;
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
  }
  .account-balance span {
    padding-bottom: calc(var(--spacing) * 0.5);
    font-size: 8px;
    color: var(--color-slate-400);
  }
  .loan-list {
    :where(& > :not(:last-child)) {
      --tw-divide-y-reverse: 0;
      border-bottom-style: var(--tw-border-style);
      border-top-style: var(--tw-border-style);
      border-top-width: calc(1px * var(--tw-divide-y-reverse));
      border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
    }
    :where(& > :not(:last-child)) {
      border-color: var(--color-line);
    }
  }
  .loan-card {
    padding: calc(var(--spacing) * 3.5);
  }
  .loan-card-main {
    display: flex;
    gap: calc(var(--spacing) * 2.5);
  }
  .loan-icon {
    display: grid;
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
    flex-shrink: 0;
    place-items: center;
    border-radius: var(--radius-xl);
    background-color: var(--color-brand-50);
    color: var(--color-brand-700);
  }
  .loan-copy {
    min-width: calc(var(--spacing) * 0);
    flex: 1;
  }
  .loan-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: calc(var(--spacing) * 2);
  }
  .loan-title-row h3 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 10px;
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
  }
  .loan-metrics {
    margin-top: calc(var(--spacing) * 2);
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: calc(var(--spacing) * 1.5);
  }
  .loan-metrics div {
    min-width: calc(var(--spacing) * 0);
    border-radius: var(--radius-lg);
    background-color: var(--color-slate-50);
    padding-inline: calc(var(--spacing) * 2);
    padding-block: calc(var(--spacing) * 1.5);
  }
  .loan-metrics span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 8px;
    color: var(--color-slate-400);
  }
  .loan-metrics strong {
    margin-top: calc(var(--spacing) * 0.5);
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 9px;
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
  }
  .loan-progress-row {
    margin-top: calc(var(--spacing) * 2.5);
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 2);
  }
  .loan-progress-row > span {
    flex-shrink: 0;
    font-size: 8px;
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: var(--color-slate-400);
  }
  .progress-track {
    height: calc(var(--spacing) * 1.5);
    flex: 1;
    overflow: hidden;
    border-radius: calc(infinity * 1px);
    background-color: var(--color-slate-100);
  }
  .progress-track i {
    display: block;
    height: 100%;
    border-radius: calc(infinity * 1px);
    background-color: var(--color-brand-500);
  }
  .transaction-list {
    :where(& > :not(:last-child)) {
      --tw-divide-y-reverse: 0;
      border-bottom-style: var(--tw-border-style);
      border-top-style: var(--tw-border-style);
      border-top-width: calc(1px * var(--tw-divide-y-reverse));
      border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
    }
    :where(& > :not(:last-child)) {
      border-color: var(--color-line);
    }
  }
  .transaction-row {
    display: grid;
    min-height: 53px;
    grid-template-columns: 34px 1fr auto;
    align-items: center;
    gap: calc(var(--spacing) * 2.5);
    padding-inline: calc(var(--spacing) * 3.5);
    padding-block: calc(var(--spacing) * 2);
  }
  .transaction-icon {
    display: grid;
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
    place-items: center;
    border-radius: 10px;
  }
  .transaction-credit {
    background-color: var(--color-emerald-50);
    color: var(--color-emerald-700);
  }
  .transaction-debit {
    background-color: var(--color-rose-50);
    color: var(--color-rose-600);
  }
  .transaction-copy {
    min-width: calc(var(--spacing) * 0);
  }
  .transaction-copy strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 10px;
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
  }
  .transaction-copy small {
    margin-top: calc(var(--spacing) * 0.5);
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 8px;
    color: var(--color-slate-400);
  }
  .transaction-amount {
    font-size: 9px;
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
    white-space: nowrap;
    direction: ltr;
  }
  .transaction-amount-credit {
    color: var(--color-emerald-700);
  }
  .transaction-amount-debit {
    color: var(--color-slate-700);
  }
  .withdrawal-list {
    :where(& > :not(:last-child)) {
      --tw-divide-y-reverse: 0;
      border-bottom-style: var(--tw-border-style);
      border-top-style: var(--tw-border-style);
      border-top-width: calc(1px * var(--tw-divide-y-reverse));
      border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
    }
    :where(& > :not(:last-child)) {
      border-color: var(--color-line);
    }
  }
  .withdrawal-row {
    display: flex;
    min-height: 50px;
    align-items: center;
    justify-content: space-between;
    gap: calc(var(--spacing) * 2);
    padding-inline: calc(var(--spacing) * 3.5);
    padding-block: calc(var(--spacing) * 2);
  }
  .withdrawal-main {
    display: flex;
    min-width: calc(var(--spacing) * 0);
    align-items: center;
    gap: calc(var(--spacing) * 2.5);
  }
  .withdrawal-icon {
    display: grid;
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
    flex-shrink: 0;
    place-items: center;
    border-radius: 10px;
    background-color: var(--color-slate-100);
    color: var(--color-slate-500);
  }
  .withdrawal-main strong {
    display: block;
    font-size: 10px;
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
  }
  .withdrawal-main small {
    margin-top: calc(var(--spacing) * 0.5);
    display: block;
    font-size: 8px;
    color: var(--color-slate-400);
  }
  .profile-card {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 3);
    border-radius: 20px;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-line);
    background-color: var(--color-white);
    padding: calc(var(--spacing) * 3.5);
    --tw-shadow: 0 8px 26px var(--tw-shadow-color, rgba(15, 23, 42, .055));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .profile-avatar {
    display: grid;
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
    flex-shrink: 0;
    place-items: center;
    border-radius: 13px;
    background-color: var(--color-brand-50);
    color: var(--color-brand-700);
  }
  .profile-copy {
    min-width: calc(var(--spacing) * 0);
    flex: 1;
  }
  .profile-copy h2 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
  }
  .profile-copy p {
    margin-top: calc(var(--spacing) * 0.5);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 8px;
    color: var(--color-slate-400);
  }
  .profile-score {
    text-align: left;
  }
  .profile-score span {
    display: block;
    font-size: 7px;
    color: var(--color-slate-400);
  }
  .profile-score strong {
    margin-top: calc(var(--spacing) * 0.5);
    display: block;
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
    color: var(--color-brand-700);
  }
  .bottom-nav {
    position: fixed;
    inset-inline: calc(var(--spacing) * 0);
    bottom: calc(var(--spacing) * 0);
    z-index: 40;
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: color-mix(in srgb, oklch(92.9% 0.013 255.508) 80%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-slate-200) 80%, transparent);
    }
    background-color: color-mix(in srgb, #fff 95%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-white) 95%, transparent);
    }
    --tw-backdrop-blur: blur(var(--blur-xl));
    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    @media (width >= 64rem) {
      display: none;
    }
  }
  .bottom-nav-inner {
    margin-inline: auto;
    display: grid;
    height: 58px;
    max-width: var(--container-lg);
    grid-template-columns: repeat(5, minmax(0, 1fr));
    padding-inline: calc(var(--spacing) * 1);
  }
  .bottom-nav-item {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: calc(var(--spacing) * 0.5);
    border-style: var(--tw-border-style);
    border-width: 0px;
    background-color: transparent;
    font-size: 8px;
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: var(--color-slate-400);
  }
  .bottom-nav-item.is-active {
    color: var(--color-brand-700);
  }
  .bottom-nav-icon {
    display: grid;
    width: calc(var(--spacing) * 7);
    height: calc(var(--spacing) * 7);
    place-items: center;
    border-radius: 10px;
  }
  .bottom-nav-item.is-active .bottom-nav-icon {
    background-color: var(--color-brand-50);
  }
  .bottom-nav-action .bottom-nav-icon {
    margin-top: calc(var(--spacing) * -5);
    width: calc(var(--spacing) * 11);
    height: calc(var(--spacing) * 11);
    border-radius: 15px;
    background-color: var(--color-brand-800);
    color: var(--color-white);
    --tw-shadow: 0 8px 22px var(--tw-shadow-color, rgba(10,63,58,.24));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .modal {
    pointer-events: none;
    visibility: hidden;
    position: fixed;
    inset: calc(var(--spacing) * 0);
    z-index: 50;
    opacity: 0%;
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .modal.is-open {
    pointer-events: auto;
    visibility: visible;
    opacity: 100%;
  }
  .modal-backdrop {
    position: absolute;
    inset: calc(var(--spacing) * 0);
    background-color: color-mix(in srgb, oklch(12.9% 0.042 264.695) 40%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-slate-950) 40%, transparent);
    }
    --tw-backdrop-blur: blur(var(--blur-sm));
    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
  }
  .modal-sheet {
    position: absolute;
    inset-inline: calc(var(--spacing) * 0);
    bottom: calc(var(--spacing) * 0);
    max-height: 90dvh;
    --tw-translate-y: 100%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
    overflow-y: auto;
    border-top-left-radius: 24px;
    border-top-right-radius: 24px;
    background-color: var(--color-white);
    padding: calc(var(--spacing) * 4);
    --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color, rgb(0 0 0 / 0.25));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    @media (width >= 40rem) {
      inset: auto;
    }
    @media (width >= 40rem) {
      top: calc(1/2 * 100%);
    }
    @media (width >= 40rem) {
      left: calc(1/2 * 100%);
    }
    @media (width >= 40rem) {
      width: 430px;
    }
    @media (width >= 40rem) {
      --tw-translate-x: calc(calc(1/2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    @media (width >= 40rem) {
      --tw-translate-y: calc(45% * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    @media (width >= 40rem) {
      border-radius: 22px;
    }
  }
  .modal.is-open .modal-sheet {
    --tw-translate-y: calc(var(--spacing) * 0);
    translate: var(--tw-translate-x) var(--tw-translate-y);
    @media (width >= 40rem) {
      --tw-translate-x: calc(calc(1/2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    @media (width >= 40rem) {
      --tw-translate-y: calc(calc(1/2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  }
  .modal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: calc(var(--spacing) * 3);
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--color-line);
    padding-bottom: calc(var(--spacing) * 3);
  }
  .modal-header h2 {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
  }
  .modal-header p {
    margin-top: calc(var(--spacing) * 1);
    font-size: 9px;
    color: var(--color-slate-400);
  }
  .modal-form {
    margin-top: calc(var(--spacing) * 3);
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .modal-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: calc(var(--spacing) * 2);
    padding-top: calc(var(--spacing) * 1);
  }
  .modal-open {
    overflow: hidden;
  }
  .toast {
    position: fixed;
    bottom: calc(var(--spacing) * 20);
    left: calc(1/2 * 100%);
    z-index: 60;
    --tw-translate-x: calc(calc(1/2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
    border-radius: var(--radius-xl);
    background-color: var(--color-slate-900);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2.5);
    font-size: 10px;
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    white-space: nowrap;
    color: var(--color-white);
    --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    @media (width >= 64rem) {
      bottom: calc(var(--spacing) * 6);
    }
  }
  .updater-page {
    background-color: radial-gradient(circle at 80% 0%,rgba(217,240,236,.75),transparent 35%),#f4f6f6;
  }
  .updater-shell {
    display: flex;
    min-height: 100dvh;
    align-items: center;
    justify-content: center;
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 6);
  }
  .updater-card {
    width: 100%;
    max-width: 420px;
    border-radius: 22px;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-white);
    background-color: var(--color-white);
    padding: calc(var(--spacing) * 4);
    --tw-shadow: 0 14px 42px var(--tw-shadow-color, rgba(15, 23, 42, .075));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    @media (width >= 40rem) {
      padding: calc(var(--spacing) * 5);
    }
  }
  .updater-header {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 3);
  }
  .updater-header h1 {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
  }
  .updater-header p {
    margin-top: calc(var(--spacing) * 0.5);
    font-size: 9px;
    color: var(--color-slate-400);
  }
  .updater-form {
    margin-top: calc(var(--spacing) * 4);
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .updater-message {
    margin-top: calc(var(--spacing) * 4);
    margin-bottom: calc(var(--spacing) * 0);
  }
  .updater-spinner {
    border-color: var(--color-brand-200);
    border-top-color: var(--color-brand-700);
  }
  .dropzone {
    display: grid;
    min-height: 116px;
    cursor: pointer;
    place-items: center;
    border-radius: 16px;
    border-style: var(--tw-border-style);
    border-width: 2px;
    --tw-border-style: dashed;
    border-style: dashed;
    border-color: var(--color-slate-200);
    background-color: var(--color-slate-50);
    padding-inline: calc(var(--spacing) * 4);
    text-align: center;
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    &:hover {
      @media (hover: hover) {
        border-color: var(--color-brand-400);
      }
    }
    &:hover {
      @media (hover: hover) {
        background-color: color-mix(in srgb, #eef8f6 40%, transparent);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--color-brand-50) 40%, transparent);
        }
      }
    }
  }
  .dropzone-icon {
    margin-inline: auto;
    display: grid;
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
    place-items: center;
    border-radius: 13px;
    background-color: var(--color-white);
    color: var(--color-brand-700);
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .dropzone strong {
    margin-top: calc(var(--spacing) * 2);
    display: block;
    font-size: 10px;
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
  }
  .dropzone small {
    margin-top: calc(var(--spacing) * 1);
    display: block;
    font-size: 8px;
    color: var(--color-slate-400);
  }
  .updater-links {
    margin-top: calc(var(--spacing) * 3);
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 9px;
  }
  .updater-links a:first-child {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: var(--color-brand-700);
  }
  .updater-links a:last-child {
    color: var(--color-slate-400);
  }
  .update-progress {
    display: none;
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-brand-100);
    background-color: var(--color-brand-50);
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 2);
    font-size: 10px;
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: var(--color-brand-700);
  }
  .update-progress.is-visible {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 2);
  }
}
@media (min-width: 1024px) {
  .panel-transactions {
    position: sticky;
    top: 4.25rem;
  }
}
@media (max-width: 420px) {
  .balance-amount {
    font-size: 1.35rem;
  }
  .quick-action {
    min-height: 62px;
    font-size: .5rem;
  }
  .account-card {
    min-width: 205px;
  }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}
@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: 0px;
}
@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-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-duration {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-divide-x-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-scroll-snap-strictness {
  syntax: "*";
  inherits: false;
  initial-value: proximity;
}
@property --tw-divide-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@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;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@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-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-space-y-reverse: 0;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-border-style: solid;
      --tw-duration: initial;
      --tw-tracking: initial;
      --tw-backdrop-blur: initial;
      --tw-backdrop-brightness: initial;
      --tw-backdrop-contrast: initial;
      --tw-backdrop-grayscale: initial;
      --tw-backdrop-hue-rotate: initial;
      --tw-backdrop-invert: initial;
      --tw-backdrop-opacity: initial;
      --tw-backdrop-saturate: initial;
      --tw-backdrop-sepia: initial;
      --tw-divide-x-reverse: 0;
      --tw-scroll-snap-strictness: proximity;
      --tw-divide-y-reverse: 0;
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
    }
  }
}

/* Accounts section — minimal white compact design */
.accounts-panel {
  overflow: hidden;
  background: #fff;
}

.accounts-panel-header {
  min-height: 48px;
  padding: 8px 10px;
  border-bottom-color: #eef0f2;
}

.accounts-heading {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
}

.accounts-heading-icon {
  display: grid;
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid #e7e9ec;
  border-radius: 9px;
  background: #fff;
  color: #4b5563;
}

.accounts-heading-copy {
  min-width: 0;
}

.accounts-title-row {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 6px;
}

.accounts-heading h2 {
  font-size: 11.5px;
  line-height: 1.25;
  color: #17191c;
}

.accounts-heading p {
  margin-top: 1px;
  overflow: hidden;
  color: #989da5;
  font-size: 8px;
  line-height: 1.4;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.accounts-active-count {
  display: inline-flex;
  min-height: 17px;
  flex: 0 0 auto;
  align-items: center;
  border: 1px solid #e8eaed;
  border-radius: 999px;
  background: #fafafa;
  padding: 1px 6px;
  color: #737982;
  font-size: 7px;
  font-weight: 800;
}

.accounts-all-button {
  display: inline-flex;
  min-height: 28px;
  flex: 0 0 auto;
  align-items: center;
  gap: 2px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  padding: 0 5px;
  color: #5f6670;
  font: inherit;
  font-size: 8.5px;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
}

.accounts-all-button:hover {
  background: #f7f7f8;
  color: #202327;
}

.accounts-panel .account-strip {
  gap: 7px;
  padding: 8px;
}

.accounts-panel .account-card {
  position: relative;
  min-width: 224px;
  scroll-snap-align: start;
  overflow: hidden;
  border: 1px solid #e8eaed;
  border-radius: 12px;
  background: #fff;
  padding: 0;
  color: #1d2024;
  box-shadow: 0 1px 2px rgba(17, 24, 39, .025);
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.accounts-panel .account-card::after {
  display: none;
}

.accounts-panel .account-card-link {
  display: block;
  min-width: 0;
  padding: 9px;
  color: inherit;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  cursor: pointer;
}

.accounts-panel .account-card-link:focus-visible {
  outline: 2px solid rgba(24, 139, 120, .36);
  outline-offset: 3px;
  border-radius: 10px;
}

.accounts-panel .account-card:active {
  transform: scale(.992);
}

.accounts-panel .account-card--emerald,
.accounts-panel .account-card--violet,
.accounts-panel .account-card--sky {
  background: #fff;
}

.accounts-panel .account-card:hover {
  border-color: #d6d9de;
  box-shadow: 0 3px 10px rgba(17, 24, 39, .045);
  transform: translateY(-1px);
}

.account-card-topline {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 7px;
}

.account-card-identity {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  align-items: center;
  gap: 7px;
}

.accounts-panel .account-card-icon {
  display: grid;
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid #e8eaed;
  border-radius: 9px;
  background: #f8f8f9;
  color: #545b65;
  box-shadow: none;
  backdrop-filter: none;
}

.account-card-copy {
  min-width: 0;
  flex: 1 1 auto;
}

.account-card-title-row {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 5px;
}

.accounts-panel .account-card h3 {
  min-width: 0;
  max-width: 125px;
  margin: 0;
  overflow: hidden;
  color: #202327;
  font-size: 9.5px;
  font-weight: 900;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.accounts-panel .account-card p {
  max-width: 150px;
  margin: 1px 0 0;
  overflow: hidden;
  color: #989da5;
  font-size: 7.5px;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-type-pill {
  display: inline-flex;
  min-height: 16px;
  flex: 0 0 auto;
  align-items: center;
  border: 1px solid #e8eaed;
  border-radius: 999px;
  background: #fafafa;
  padding: 1px 5px;
  color: #737982;
  font-size: 6.7px;
  font-weight: 800;
}

.account-open-button {
  display: grid;
  width: 25px;
  height: 25px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: #8a9098;
  cursor: pointer;
  transition: border-color .18s ease, background-color .18s ease, color .18s ease;
}

.account-open-button:hover {
  border-color: #e5e7eb;
  background: #f7f7f8;
  color: #2c3137;
}

.account-card-bottom {
  display: flex;
  margin-top: 9px;
  align-items: flex-end;
  justify-content: space-between;
  gap: 7px;
  border-top: 1px solid #f0f1f2;
  padding-top: 7px;
}

.account-balance-label {
  padding-bottom: 1px;
  color: #a0a5ac;
  font-size: 7px;
  white-space: nowrap;
}

.accounts-panel .account-balance {
  display: flex;
  margin: 0;
  align-items: baseline;
  gap: 3px;
}

.accounts-panel .account-balance strong {
  color: #17191c;
  font-size: 13.5px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -.2px;
}

.accounts-panel .account-balance small {
  color: #8d939b;
  font-size: 6.8px;
}

@media (min-width: 700px) {
  .accounts-panel .account-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    overflow: visible;
  }

  .accounts-panel .account-card {
    min-width: 0;
  }
}

@media (max-width: 420px) {
  .accounts-panel .account-card {
    min-width: min(224px, calc(100vw - 54px));
  }
}

@media (prefers-reduced-motion: reduce) {
  .accounts-panel .account-card,
  .account-open-button {
    transition: none;
  }
}

/* Active loans • minimal white redesign • v9.0.2 */
.loans-panel .loan-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  padding: 8px;
}

.loans-panel .loan-list > .loan-card {
  min-width: 0;
  border: 1px solid #e8eaed !important;
  border-radius: 14px;
  background: #fff;
  padding: 10px;
  box-shadow: none;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.loans-panel .loan-card:hover {
  border-color: #d7dade !important;
  box-shadow: 0 3px 10px rgba(17, 24, 39, .04);
  transform: translateY(-1px);
}

.loan-card-header,
.loan-identity,
.loan-title-row,
.loan-remaining > div,
.loan-metrics p,
.loan-progress-meta {
  display: flex;
  align-items: center;
}

.loan-card-header {
  min-width: 0;
  justify-content: space-between;
  gap: 8px;
}

.loan-identity {
  min-width: 0;
  flex: 1 1 auto;
  gap: 7px;
}

.loans-panel .loan-icon {
  display: grid;
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid #e8eaed;
  border-radius: 9px;
  background: #f8f8f9;
  color: #555c65;
}

.loan-heading {
  min-width: 0;
  flex: 1 1 auto;
}

.loan-title-row {
  min-width: 0;
  justify-content: flex-start;
  gap: 5px;
}

.loans-panel .loan-title-row h3 {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  color: #202327;
  font-size: 9.5px;
  font-weight: 900;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.loan-status {
  display: inline-flex;
  min-height: 16px;
  flex: 0 0 auto;
  align-items: center;
  gap: 4px;
  border: 1px solid #e6e8ea;
  border-radius: 999px;
  background: #fafafa;
  padding: 1px 5px;
  color: #6f757d;
  font-size: 6.7px;
  font-weight: 800;
}

.loan-status i {
  width: 4px;
  height: 4px;
  border-radius: 999px;
  background: #718a7c;
}

.loan-subtitle {
  display: block;
  margin-top: 1px;
  color: #9ba0a7;
  font-size: 7px;
  line-height: 1.45;
}

.loan-open-button {
  display: grid;
  width: 25px;
  height: 25px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: #8a9098;
  cursor: pointer;
  transition: border-color .18s ease, background-color .18s ease, color .18s ease;
}

.loan-open-button:hover {
  border-color: #e5e7eb;
  background: #f7f7f8;
  color: #2c3137;
}

.loan-remaining {
  margin-top: 9px;
  border-top: 1px solid #f0f1f2;
  padding-top: 8px;
}

.loan-remaining > span {
  display: block;
  color: #9da2a9;
  font-size: 7px;
  line-height: 1.4;
}

.loan-remaining > div {
  margin-top: 2px;
  align-items: baseline;
  gap: 3px;
}

.loan-remaining strong {
  color: #17191c;
  font-size: 15px;
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: -.2px;
}

.loan-remaining small,
.loan-metrics small {
  color: #8e949c;
  font-size: 6.8px;
}

.loans-panel .loan-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-top: 8px;
}

.loans-panel .loan-metrics > div {
  min-width: 0;
  border: 1px solid #eef0f1;
  border-radius: 10px;
  background: #fafafa;
  padding: 6px 7px;
}

.loans-panel .loan-metrics span {
  display: block;
  overflow: hidden;
  color: #9aa0a7;
  font-size: 6.8px;
  line-height: 1.4;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.loans-panel .loan-metrics p {
  min-width: 0;
  margin-top: 2px;
  align-items: baseline;
  gap: 3px;
}

.loans-panel .loan-metrics strong {
  display: block;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  color: #34383e;
  font-size: 8.5px;
  font-weight: 900;
  line-height: 1.4;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.loans-panel .loan-progress-row {
  display: block;
  margin-top: 8px;
}

.loan-progress-meta {
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 5px;
}

.loan-progress-meta span {
  color: #9ca1a8;
  font-size: 6.8px;
}

.loan-progress-meta strong {
  color: #666c74;
  font-size: 7px;
  font-weight: 800;
}

.loans-panel .progress-track {
  width: 100%;
  height: 3px;
  overflow: hidden;
  border-radius: 999px;
  background: #eceeef;
}

.loans-panel .progress-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #626a73;
}

@media (min-width: 700px) {
  .loans-panel .loan-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 360px) {
  .loans-panel .loan-metrics {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (prefers-reduced-motion: reduce) {
  .loans-panel .loan-card,
  .loan-open-button {
    transition: none;
  }
}

/* Active loans compatibility + cache hotfix • v9.0.3
   این بلوک هم ساختار جدید و هم ساختار قدیمی کارت وام را پوشش می‌دهد. */
#loans,
#loans * {
  box-sizing: border-box;
}

#loans .loan-list {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 8px !important;
  border: 0 !important;
  padding: 8px !important;
  background: #fff !important;
}

#loans .loan-list > .loan-card {
  min-width: 0 !important;
  border: 1px solid #e6e8eb !important;
  border-radius: 14px !important;
  background: #fff !important;
  background-image: none !important;
  padding: 10px !important;
  box-shadow: 0 1px 2px rgba(17, 24, 39, .025) !important;
  overflow: hidden !important;
}

#loans .loan-card-main {
  display: flex !important;
  min-width: 0 !important;
  align-items: flex-start !important;
  gap: 8px !important;
}

#loans .loan-copy {
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

#loans .loan-icon {
  display: grid !important;
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  flex: 0 0 28px !important;
  place-items: center !important;
  border: 1px solid #e6e8eb !important;
  border-radius: 9px !important;
  background: #f7f8f8 !important;
  background-image: none !important;
  color: #4f565e !important;
}

#loans .loan-title-row {
  display: flex !important;
  min-width: 0 !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
}

#loans .loan-title-row h3 {
  min-width: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: #1e2227 !important;
  font-size: 9.5px !important;
  font-weight: 900 !important;
  line-height: 1.55 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#loans .badge-success,
#loans .loan-status {
  display: inline-flex !important;
  min-height: 17px !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  gap: 4px !important;
  border: 1px solid #e1e5e3 !important;
  border-radius: 999px !important;
  background: #f8faf9 !important;
  background-image: none !important;
  padding: 1px 6px !important;
  color: #66736c !important;
  font-size: 6.7px !important;
  font-weight: 800 !important;
  box-shadow: none !important;
}

#loans .loan-metrics {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px !important;
  margin-top: 8px !important;
}

#loans .loan-metrics > div {
  min-width: 0 !important;
  border: 1px solid #eceef0 !important;
  border-radius: 10px !important;
  background: #fafafa !important;
  background-image: none !important;
  padding: 6px 7px !important;
}

/* در ساختار قدیمی، مانده وام اولین آیتم است و به‌صورت تمام‌عرض نمایش داده می‌شود. */
#loans .loan-card-main .loan-metrics > div:first-child {
  grid-column: 1 / -1 !important;
  border-color: #e6e8eb !important;
  background: #fff !important;
  padding-block: 7px !important;
}

#loans .loan-metrics span,
#loans .loan-remaining > span {
  display: block !important;
  overflow: hidden !important;
  color: #989ea5 !important;
  font-size: 6.8px !important;
  line-height: 1.45 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#loans .loan-metrics strong {
  display: block !important;
  min-width: 0 !important;
  margin-top: 2px !important;
  overflow: hidden !important;
  color: #34393f !important;
  font-size: 8.5px !important;
  font-weight: 900 !important;
  line-height: 1.45 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#loans .loan-card-main .loan-metrics > div:first-child strong {
  color: #171a1e !important;
  font-size: 14px !important;
  letter-spacing: -.15px !important;
}

#loans .loan-remaining {
  margin-top: 9px !important;
  border-top: 1px solid #eff0f2 !important;
  padding-top: 8px !important;
}

#loans .loan-remaining > div {
  display: flex !important;
  margin-top: 2px !important;
  align-items: baseline !important;
  gap: 3px !important;
}

#loans .loan-remaining strong {
  color: #171a1e !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
}

#loans .loan-remaining small,
#loans .loan-metrics small {
  color: #8f959d !important;
  font-size: 6.8px !important;
}

#loans .loan-progress-row {
  display: block !important;
  margin-top: 8px !important;
}

#loans .loan-progress-row > span {
  display: block !important;
  margin-top: 5px !important;
  color: #858b92 !important;
  font-size: 7px !important;
  font-weight: 800 !important;
  text-align: left !important;
}

#loans .loan-progress-meta {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin-bottom: 5px !important;
}

#loans .progress-track {
  width: 100% !important;
  height: 3px !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  background: #e9ebed !important;
  background-image: none !important;
}

#loans .progress-track i {
  display: block !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: #626a73 !important;
  background-image: none !important;
}

#loans .loan-open-button {
  display: grid !important;
  width: 25px !important;
  height: 25px !important;
  flex: 0 0 25px !important;
  place-items: center !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #8b9198 !important;
  box-shadow: none !important;
}

@media (min-width: 700px) {
  #loans .loan-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 360px) {
  #loans .loan-metrics {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #loans .loan-card-main .loan-metrics > div:first-child {
    grid-column: auto !important;
  }
}

/* =========================================================
   Active loans V2 + unified in-app update UI • release 9.1.0
   ========================================================= */

.loans-panel-v2 {
  background: #fff;
}

.loans-panel-header-v2 {
  min-height: 58px;
  padding: 11px 13px;
}

.loans-panel-heading-v2,
.loans-panel-title-row-v2,
.active-loan-header-v2,
.active-loan-identity-v2,
.active-loan-balance-v2,
.active-loan-balance-v2 p,
.active-loan-due-v2,
.active-loan-due-copy-v2 p,
.active-loan-footer-v2,
.active-loan-progress-copy-v2,
.loans-all-button-v2 {
  display: flex;
  align-items: center;
}

.loans-panel-heading-v2 {
  min-width: 0;
  gap: 9px;
}

.loans-panel-icon-v2 {
  display: grid;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  place-items: center;
  border: 1px solid #e6ecea;
  border-radius: 11px;
  background: #f7faf9;
  color: #315f59;
}

.loans-panel-title-row-v2 {
  min-width: 0;
  gap: 7px;
}

.loans-panel-title-row-v2 h2 {
  margin: 0;
  color: #1a2422;
  font-size: 12px;
  font-weight: 900;
}

.loans-panel-count-v2 {
  display: inline-flex;
  min-height: 20px;
  align-items: center;
  border: 1px solid #e5ebe9;
  border-radius: 999px;
  background: #fafcfc;
  padding: 2px 7px;
  color: #65736f;
  font-size: 8px;
  font-weight: 800;
}

.loans-panel-header-v2 p {
  margin-top: 2px;
  color: #9aa6a3;
  font-size: 8px;
}

.loans-all-button-v2 {
  flex: 0 0 auto;
  gap: 3px;
  border: 1px solid #e7eceb;
  border-radius: 9px;
  background: #fff;
  padding: 6px 8px;
  color: #64716e;
  font-size: 8px;
  font-weight: 800;
}

.active-loans-grid-v2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 9px;
  padding: 10px;
  background: #f7f9f9;
}

.active-loan-card-v2 {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #e1e7e5;
  border-radius: 15px;
  background: #fff;
  padding: 11px;
  box-shadow: 0 2px 7px rgba(23, 39, 35, .035);
}

.active-loan-header-v2 {
  min-width: 0;
  justify-content: space-between;
  gap: 8px;
}

.active-loan-identity-v2 {
  min-width: 0;
  flex: 1 1 auto;
  gap: 8px;
}

.active-loan-icon-v2 {
  display: grid;
  width: 31px;
  height: 31px;
  flex: 0 0 31px;
  place-items: center;
  border: 1px solid #e2e9e7;
  border-radius: 10px;
  background: #f5f8f7;
  color: #315f59;
}

.active-loan-heading-v2 {
  min-width: 0;
}

.active-loan-eyebrow-v2 {
  display: block;
  margin-bottom: 1px;
  color: #9ca7a4;
  font-size: 7px;
  font-weight: 700;
}

.active-loan-heading-v2 h3 {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  color: #202826;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.5;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.active-loan-status-v2 {
  display: inline-flex;
  min-height: 21px;
  flex: 0 0 auto;
  align-items: center;
  gap: 4px;
  border: 1px solid #dce9e4;
  border-radius: 999px;
  background: #f7fbf9;
  padding: 2px 7px;
  color: #427166;
  font-size: 7.5px;
  font-weight: 900;
}

.active-loan-status-v2 i {
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: #4e897b;
}

.active-loan-balance-v2 {
  justify-content: space-between;
  gap: 10px;
  margin-top: 10px;
  border-top: 1px solid #edf0ef;
  padding-top: 9px;
}

.active-loan-balance-v2 > div {
  min-width: 0;
}

.active-loan-balance-v2 > div > span,
.active-loan-due-copy-v2 > span,
.active-loan-date-v2 > span,
.active-loan-progress-copy-v2 > span {
  display: block;
  color: #98a29f;
  font-size: 7.5px;
  font-weight: 700;
}

.active-loan-balance-v2 p {
  margin-top: 2px;
  align-items: baseline;
  gap: 4px;
}

.active-loan-balance-v2 strong {
  color: #17201e;
  font-size: 17px;
  font-weight: 900;
  line-height: 1.25;
}

.active-loan-balance-v2 small,
.active-loan-due-copy-v2 small {
  color: #87928f;
  font-size: 7px;
}

.active-loan-details-v2 {
  display: grid;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  place-items: center;
  border: 1px solid #e6ebe9;
  border-radius: 9px;
  background: #fff;
  color: #6f7b78;
}

.active-loan-due-v2 {
  min-width: 0;
  gap: 8px;
  margin-top: 9px;
  border: 1px solid #e5ebe9;
  border-radius: 12px;
  background: #f8faf9;
  padding: 8px;
}

.active-loan-due-icon-v2 {
  display: grid;
  width: 29px;
  height: 29px;
  flex: 0 0 29px;
  place-items: center;
  border: 1px solid #e1e8e6;
  border-radius: 9px;
  background: #fff;
  color: #4a6f68;
}

.active-loan-due-copy-v2 {
  min-width: 0;
  flex: 1 1 auto;
}

.active-loan-due-copy-v2 p {
  margin-top: 1px;
  align-items: baseline;
  gap: 3px;
}

.active-loan-due-copy-v2 strong {
  color: #293330;
  font-size: 10px;
  font-weight: 900;
}

.active-loan-date-v2 {
  flex: 0 0 auto;
  border-right: 1px solid #e3e9e7;
  padding-right: 9px;
  text-align: left;
}

.active-loan-date-v2 strong {
  display: block;
  margin-top: 2px;
  color: #394541;
  font-size: 9px;
  font-weight: 900;
}

.active-loan-footer-v2 {
  min-width: 0;
  gap: 7px;
  margin-top: 9px;
}

.active-loan-progress-copy-v2 {
  flex: 0 0 auto;
  align-items: baseline;
  gap: 4px;
}

.active-loan-progress-copy-v2 strong {
  color: #65716e;
  font-size: 7.5px;
  font-weight: 900;
}

.active-loan-progress-v2 {
  height: 4px;
  min-width: 30px;
  flex: 1 1 auto;
  overflow: hidden;
  border-radius: 999px;
  background: #e8eceb;
}

.active-loan-progress-v2 i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #517e75;
}

.active-loan-percent-v2 {
  min-width: 25px;
  flex: 0 0 auto;
  color: #4d5b57;
  font-size: 8px;
  font-weight: 900;
  text-align: left;
}

.app-version-micro {
  position: absolute;
  left: 11px;
  bottom: 7px;
  color: #b0b8b6;
  font-size: 6.5px;
  font-weight: 700;
  direction: rtl;
}

.profile-card {
  position: relative;
}

@media (min-width: 700px) {
  .active-loans-grid-v2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 380px) {
  .loans-all-button-v2 {
    display: none;
  }

  .active-loan-due-v2 {
    gap: 6px;
  }

  .active-loan-date-v2 {
    padding-right: 7px;
  }
}

/* Legacy HTML bridge: اگر صفحه قدیمی هنوز یک بار باز باشد، CSS جدید آن را هم به کارت تبدیل می‌کند. */
#loans:not(.loans-panel-v2) .loan-list {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 9px !important;
  border: 0 !important;
  background: #f7f9f9 !important;
  padding: 10px !important;
}

#loans:not(.loans-panel-v2) .loan-list > .loan-card {
  border: 1px solid #e1e7e5 !important;
  border-radius: 15px !important;
  background: #fff !important;
  padding: 11px !important;
  box-shadow: 0 2px 7px rgba(23, 39, 35, .035) !important;
}

#loans:not(.loans-panel-v2) .loan-card + .loan-card {
  border-top-width: 1px !important;
}

#loans:not(.loans-panel-v2) .loan-metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

#loans:not(.loans-panel-v2) .loan-metrics > div {
  border: 1px solid #e7ecea !important;
  border-radius: 10px !important;
  background: #f8faf9 !important;
  padding: 7px !important;
}

/* In-app update modal */
.app-update-open,
.app-update-open body {
  overflow: hidden !important;
}

.app-update-modal {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  visibility: hidden;
  align-items: end;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease, visibility .2s ease;
}

.app-update-modal.is-open {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.app-update-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  background: rgba(10, 20, 18, .52);
  backdrop-filter: blur(5px);
}

.app-update-sheet {
  position: relative;
  width: min(100%, 460px);
  max-height: min(88dvh, 720px);
  margin-inline: auto;
  overflow-y: auto;
  border: 1px solid #e1e7e5;
  border-radius: 24px 24px 0 0;
  background: #fff;
  padding: 19px 17px max(18px, env(safe-area-inset-bottom));
  box-shadow: 0 -20px 70px rgba(8, 22, 18, .18);
  transform: translateY(24px);
  transition: transform .25s cubic-bezier(.2,.8,.2,1);
}

.app-update-modal.is-open .app-update-sheet {
  transform: translateY(0);
}

.app-update-hero {
  display: flex;
  align-items: center;
  gap: 9px;
}

.app-update-hero-icon {
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border: 1px solid #dfe9e6;
  border-radius: 15px;
  background: #f4f8f7;
  color: #285b54;
}

.app-update-new-badge {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  border: 1px solid #dce8e4;
  border-radius: 999px;
  background: #f8fbfa;
  padding: 3px 9px;
  color: #436c65;
  font-size: 9px;
  font-weight: 900;
}

.app-update-close {
  position: absolute;
  top: 16px;
  left: 16px;
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 1px solid #e7ebea;
  border-radius: 10px;
  background: #fff;
  color: #7e8986;
}

.app-update-heading {
  margin-top: 13px;
}

.app-update-heading h2 {
  color: #17201e;
  font-size: 17px;
  font-weight: 900;
  line-height: 1.5;
}

.app-update-heading p {
  margin-top: 4px;
  color: #7d8885;
  font-size: 10px;
  line-height: 1.8;
}

.app-update-version-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 13px;
  border: 1px solid #e7ecea;
  border-radius: 12px;
  background: #fafbfb;
  padding: 9px 10px;
}

.app-update-version-row strong {
  color: #254f49;
  font-size: 11px;
  font-weight: 900;
}

.app-update-version-row span {
  color: #9aa4a1;
  font-size: 8px;
  font-weight: 700;
}

.app-update-notes {
  display: grid;
  gap: 8px;
  margin-top: 13px;
}

.app-update-notes li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: #4f5b58;
}

.app-update-notes li > span {
  display: grid;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  place-items: center;
  border: 1px solid #dfe9e6;
  border-radius: 7px;
  background: #f5f9f7;
  color: #3e7469;
}

.app-update-notes p {
  padding-top: 1px;
  font-size: 9px;
  font-weight: 700;
  line-height: 1.8;
}

.app-update-security {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  margin-top: 13px;
  border: 1px solid #eceeed;
  border-radius: 11px;
  background: #fbfbfb;
  padding: 9px;
  color: #7b8582;
  font-size: 8px;
  line-height: 1.7;
}

.app-update-security svg {
  flex: 0 0 auto;
  color: #55756f;
}

.app-update-actions {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  gap: 8px;
  margin-top: 15px;
}

.app-update-later,
.app-update-install {
  min-height: 43px;
  border-radius: 12px;
  font-size: 10px;
  font-weight: 900;
}

.app-update-later {
  border: 1px solid #e2e7e5;
  background: #fff;
  color: #75807d;
}

.app-update-install {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid #174c45;
  background: #174c45;
  color: #fff;
  box-shadow: 0 8px 20px rgba(23, 76, 69, .15);
}

/* Installation overlay */
.app-install-overlay {
  position: fixed;
  inset: 0;
  z-index: 11000;
  display: grid;
  visibility: hidden;
  place-items: center;
  background: rgba(244, 247, 246, .98);
  padding: 18px;
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease, visibility .18s ease;
}

.app-install-overlay.is-open {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.app-install-card {
  width: min(100%, 390px);
  border: 1px solid #e1e7e5;
  border-radius: 22px;
  background: #fff;
  padding: 22px 18px;
  box-shadow: 0 24px 70px rgba(12, 28, 24, .1);
  text-align: center;
}

.app-install-logo {
  display: grid;
  width: 54px;
  height: 54px;
  margin-inline: auto;
  place-items: center;
  border: 1px solid #dfe8e5;
  border-radius: 17px;
  background: #f5f9f8;
  color: #295f57;
}

.app-install-logo svg {
  animation: app-update-spin 1.5s linear infinite;
}

.app-install-card h2 {
  margin-top: 13px;
  color: #19221f;
  font-size: 16px;
  font-weight: 900;
}

.app-install-card > p {
  margin-top: 5px;
  color: #818c89;
  font-size: 9px;
  line-height: 1.8;
}

.app-install-progress {
  height: 6px;
  margin-top: 16px;
  overflow: hidden;
  border-radius: 999px;
  background: #e9eeec;
}

.app-install-progress i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: #326b62;
  transition: width .35s ease;
}

.app-install-steps {
  display: grid;
  gap: 7px;
  margin-top: 15px;
  text-align: right;
}

.app-install-steps > div {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #edf0ef;
  border-radius: 10px;
  padding: 7px 8px;
  color: #a2aaa8;
}

.app-install-steps > div.is-active {
  border-color: #dce7e4;
  background: #f7faf9;
  color: #3c665f;
}

.app-install-steps > div.is-done {
  color: #5d6d69;
}

.app-install-step-status {
  display: grid;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  place-items: center;
  border: 1px solid #e3e8e6;
  border-radius: 7px;
  background: #fff;
  font-size: 8px;
  font-weight: 900;
}

.app-install-steps > div.is-active .app-install-step-status {
  border-color: #cdded9;
  color: #2f675e;
}

.app-install-steps p {
  font-size: 9px;
  font-weight: 800;
}

.app-install-card > small {
  display: block;
  margin-top: 13px;
  color: #adb5b3;
  font-size: 7px;
  font-weight: 700;
}

.app-update-success-toast {
  position: fixed;
  right: 14px;
  bottom: max(76px, calc(65px + env(safe-area-inset-bottom)));
  z-index: 9000;
  display: flex;
  min-width: 250px;
  max-width: calc(100vw - 28px);
  align-items: center;
  gap: 9px;
  border: 1px solid #dce7e3;
  border-radius: 14px;
  background: #fff;
  padding: 10px 11px;
  box-shadow: 0 15px 40px rgba(14, 33, 28, .13);
  opacity: 0;
  transform: translateY(12px);
  transition: opacity .2s ease, transform .2s ease;
}

.app-update-success-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.app-update-success-toast > span {
  display: grid;
  width: 31px;
  height: 31px;
  flex: 0 0 31px;
  place-items: center;
  border-radius: 10px;
  background: #edf7f3;
  color: #3d776b;
}

.app-update-success-toast strong,
.app-update-success-toast small {
  display: block;
}

.app-update-success-toast strong {
  color: #26302d;
  font-size: 9px;
  font-weight: 900;
}

.app-update-success-toast small {
  margin-top: 2px;
  color: #8b9693;
  font-size: 7.5px;
}

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

@media (min-width: 640px) {
  .app-update-modal {
    align-items: center;
    padding: 20px;
  }

  .app-update-sheet {
    border-radius: 24px;
    padding-bottom: 19px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .app-update-modal,
  .app-update-sheet,
  .app-install-overlay,
  .app-install-progress i,
  .app-update-success-toast {
    transition: none;
  }

  .app-install-logo svg {
    animation: none;
  }
}

/* Professional updater V2 */
.updater-page-v2 {
  background: #f4f6f6 !important;
}

.updater-card-v2 {
  max-width: 460px;
  border: 1px solid #e1e7e5;
  border-radius: 24px;
  padding: 18px;
  box-shadow: 0 18px 55px rgba(11, 29, 24, .08);
}

.updater-header-v2 {
  align-items: flex-start;
}

.updater-header-copy-v2 {
  min-width: 0;
  flex: 1 1 auto;
}

.updater-header-copy-v2 > span {
  display: block;
  color: #7f8b87;
  font-size: 8px;
  font-weight: 800;
}

.updater-header-copy-v2 h1 {
  margin-top: 1px;
  color: #19231f;
  font-size: 14px;
  font-weight: 900;
}

.updater-header-copy-v2 p {
  margin-top: 4px;
  color: #8e9996;
  font-size: 8.5px;
  line-height: 1.7;
}

.updater-current-release-v2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 15px;
  border: 1px solid #e5eae8;
  border-radius: 13px;
  background: #fafbfb;
  padding: 10px 11px;
}

.updater-current-release-v2 > div > span {
  display: block;
  color: #98a29f;
  font-size: 7.5px;
  font-weight: 700;
}

.updater-current-release-v2 > div > strong {
  display: block;
  margin-top: 1px;
  color: #244d47;
  font-size: 13px;
  font-weight: 900;
  direction: ltr;
  text-align: right;
}

.updater-release-state-v2 {
  display: inline-flex;
  min-height: 23px;
  align-items: center;
  gap: 5px;
  border: 1px solid #dce8e4;
  border-radius: 999px;
  background: #f6faf8;
  padding: 3px 8px;
  color: #497268;
  font-size: 8px;
  font-weight: 900;
}

.updater-release-state-v2 i {
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: #4f8679;
}

.updater-message-v2 {
  border-radius: 12px;
  font-size: 8.5px;
  line-height: 1.8;
}

.updater-installed-release-v2 {
  position: relative;
  margin-top: 14px;
  border: 1px solid #dce7e3;
  border-radius: 17px;
  background: #f8fbfa;
  padding: 13px;
}

.updater-installed-icon-v2 {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid #d8e6e1;
  border-radius: 13px;
  background: #fff;
  color: #3f776b;
}

.updater-installed-copy-v2 {
  margin-top: 9px;
}

.updater-installed-copy-v2 > span {
  color: #5b7f77;
  font-size: 7.5px;
  font-weight: 900;
}

.updater-installed-copy-v2 h2 {
  margin-top: 2px;
  color: #1d2925;
  font-size: 13px;
  font-weight: 900;
}

.updater-installed-copy-v2 p {
  margin-top: 3px;
  color: #7f8b87;
  font-size: 8.5px;
  line-height: 1.7;
}

.updater-installed-version-v2 {
  position: absolute;
  top: 13px;
  left: 13px;
  border: 1px solid #dfe8e5;
  border-radius: 999px;
  background: #fff;
  padding: 4px 8px;
  color: #476f66;
  font-size: 8px;
  font-weight: 900;
}

.updater-installed-notes-v2 {
  display: grid;
  gap: 6px;
  margin-top: 11px;
}

.updater-installed-notes-v2 li {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  color: #596561;
}

.updater-installed-notes-v2 li > span {
  display: grid;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  place-items: center;
  border: 1px solid #dce7e3;
  border-radius: 6px;
  background: #fff;
  color: #47776d;
}

.updater-installed-notes-v2 p {
  padding-top: 1px;
  font-size: 8px;
  font-weight: 700;
  line-height: 1.7;
}

.updater-open-app-v2 {
  margin-top: 12px;
}

.updater-form-v2 {
  margin-top: 14px;
}

.dropzone-v2 {
  min-height: 132px;
  border: 1px dashed #cfdad7;
  border-radius: 16px;
  background: #fafcfc;
}

.dropzone-v2:hover {
  border-color: #9dbab3;
  background: #f7faf9;
}

.dropzone-inner-v2 {
  display: block;
}

.updater-safety-v2 {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  border: 1px solid #e8eceb;
  border-radius: 11px;
  background: #fbfbfb;
  padding: 9px;
  color: #78837f;
  font-size: 7.5px;
  line-height: 1.75;
}

.updater-safety-v2 svg {
  flex: 0 0 auto;
  color: #52756e;
}

.updater-installing,
.updater-installing body {
  overflow: hidden !important;
}

.updater-install-overlay-v2 {
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: grid;
  visibility: hidden;
  place-items: center;
  background: rgba(244, 247, 246, .98);
  padding: 18px;
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease, visibility .18s ease;
}

.updater-install-overlay-v2.is-open {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.updater-install-dialog-v2 {
  width: min(100%, 390px);
  border: 1px solid #e0e6e4;
  border-radius: 22px;
  background: #fff;
  padding: 21px 18px;
  box-shadow: 0 24px 70px rgba(12, 28, 24, .1);
  text-align: center;
}

.updater-install-logo-v2 {
  display: grid;
  width: 52px;
  height: 52px;
  margin-inline: auto;
  place-items: center;
  border: 1px solid #dce7e3;
  border-radius: 16px;
  background: #f5f9f8;
  color: #2f665d;
}

.updater-install-logo-v2 svg {
  animation: updater-v2-spin 1.45s linear infinite;
}

.updater-install-dialog-v2 h2 {
  margin-top: 12px;
  color: #19231f;
  font-size: 15px;
  font-weight: 900;
}

.updater-install-dialog-v2 > p {
  margin-top: 5px;
  color: #818c88;
  font-size: 8.5px;
  line-height: 1.75;
}

.updater-install-progress-v2 {
  height: 7px;
  margin-top: 15px;
  overflow: hidden;
  border-radius: 999px;
  background: #e8edeb;
}

.updater-install-progress-v2 i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: #326a61;
  transition: width .3s ease;
}

.updater-install-percent-v2 {
  margin-top: 5px;
  color: #4a625c;
  font-size: 8px;
  font-weight: 900;
  text-align: left;
}

.updater-install-steps-v2 {
  display: grid;
  gap: 7px;
  margin-top: 13px;
  text-align: right;
}

.updater-install-steps-v2 > div {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #edf0ef;
  border-radius: 10px;
  padding: 7px 8px;
  color: #a1aaa7;
}

.updater-install-steps-v2 > div.is-active {
  border-color: #dbe7e3;
  background: #f7faf9;
  color: #3d675f;
}

.updater-install-steps-v2 > div.is-done {
  color: #5d6e69;
}

.updater-install-steps-v2 span {
  display: grid;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  place-items: center;
  border: 1px solid #e2e8e6;
  border-radius: 7px;
  background: #fff;
  font-size: 8px;
  font-weight: 900;
}

.updater-install-steps-v2 p {
  font-size: 8.5px;
  font-weight: 800;
}

.updater-install-dialog-v2 > small {
  display: block;
  margin-top: 12px;
  color: #abb3b1;
  font-size: 7px;
}

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

/* ========================================================================
   Liquidity summary + quick services • release 9.1.1
   Shared white, compact and neutral visual language
   ======================================================================== */
.dashboard-page .liquidity-card {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--color-line);
  border-radius: 20px;
  background: var(--color-white);
  padding: 15px;
  color: var(--color-slate-900);
  box-shadow: 0 8px 26px rgba(15, 23, 42, .055);
}

.dashboard-page .liquidity-card::before {
  content: "";
  position: absolute;
  inset-inline: 15px;
  top: 0;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background: var(--color-brand-700);
  opacity: .72;
}

.liquidity-card-header,
.liquidity-heading,
.liquidity-main-value,
.liquidity-stats .balance-stat > div,
.quick-services-header,
.quick-action,
.quick-action-copy {
  display: flex;
  align-items: center;
}

.liquidity-card-header {
  justify-content: space-between;
  gap: 12px;
}

.liquidity-heading {
  min-width: 0;
  gap: 10px;
}

.liquidity-heading-icon {
  display: grid;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  place-items: center;
  border: 1px solid #dceae7;
  border-radius: 12px;
  background: #f3f8f7;
  color: var(--color-brand-700);
}

.dashboard-page .liquidity-card .balance-label {
  color: var(--color-slate-900);
  font-size: 11px;
  font-weight: 900;
}

.liquidity-heading small {
  display: block;
  margin-top: 3px;
  color: var(--color-slate-400);
  font-size: 8px;
  line-height: 1.5;
}

.liquidity-status {
  display: inline-flex;
  height: 25px;
  flex: 0 0 auto;
  align-items: center;
  gap: 5px;
  border: 1px solid #dceae7;
  border-radius: 999px;
  background: #f7faf9;
  padding-inline: 9px;
  color: var(--color-brand-700);
  font-size: 8px;
  font-weight: 800;
}

.liquidity-status i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--color-brand-500);
  box-shadow: 0 0 0 3px rgba(15, 118, 110, .08);
}

.liquidity-main-value {
  margin-top: 15px;
  align-items: flex-end;
  gap: 7px;
}

.dashboard-page .liquidity-card .balance-amount {
  color: var(--color-slate-950);
  font-size: 25px;
  font-weight: 950;
  line-height: 1.1;
  letter-spacing: -.035em;
}

.liquidity-main-value > span {
  padding-bottom: 2px;
  color: var(--color-slate-400);
  font-size: 9px;
  font-weight: 700;
}

.dashboard-page .liquidity-card .balance-stats {
  margin-top: 15px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  border: 0;
  padding: 0;
}

.dashboard-page .liquidity-card .balance-stat {
  min-width: 0;
  border: 1px solid #edf1f4;
  border-radius: 12px;
  background: #fafbfc;
  padding: 9px 10px;
}

.dashboard-page .liquidity-card .balance-stat span {
  color: var(--color-slate-400);
  font-size: 7.5px;
  font-weight: 700;
}

.liquidity-stats .balance-stat > div {
  margin-top: 4px;
  min-width: 0;
  align-items: baseline;
  gap: 4px;
}

.dashboard-page .liquidity-card .balance-stat strong {
  min-width: 0;
  margin: 0;
  color: var(--color-slate-900);
  font-size: 9px;
  font-weight: 900;
}

.dashboard-page .liquidity-card .balance-stat small {
  flex: 0 0 auto;
  color: var(--color-slate-400);
  font-size: 6.5px;
  font-weight: 600;
}

.quick-services {
  overflow: hidden;
  border: 1px solid var(--color-line);
  border-radius: 20px;
  background: var(--color-white);
  padding: 13px;
  box-shadow: 0 8px 26px rgba(15, 23, 42, .045);
}

.quick-services-header {
  justify-content: space-between;
  gap: 10px;
  padding: 0 2px 10px;
}

.quick-services-header h2 {
  color: var(--color-slate-900);
  font-size: 11px;
  font-weight: 950;
}

.quick-services-header p {
  margin-top: 3px;
  color: var(--color-slate-400);
  font-size: 8px;
  line-height: 1.5;
}

.dashboard-page .quick-services .quick-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.dashboard-page .quick-services .quick-action {
  min-width: 0;
  min-height: 61px;
  flex-direction: row;
  justify-content: flex-start;
  gap: 9px;
  border: 1px solid #e9eef1;
  border-radius: 13px;
  background: #fbfcfc;
  padding: 9px;
  color: var(--color-slate-700);
  text-align: right;
}

.dashboard-page .quick-services .quick-action:hover {
  background: #f6f9f8;
  border-color: #dbe9e6;
}

.dashboard-page .quick-services .quick-action:active {
  transform: scale(.985);
}

.dashboard-page .quick-services .quick-action-icon {
  display: grid;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  place-items: center;
  border: 1px solid #dceae7;
  border-radius: 11px;
  background: #f2f8f6;
  color: var(--color-brand-700);
}

.quick-action-copy {
  min-width: 0;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
}

.quick-action-copy strong {
  overflow: hidden;
  max-width: 100%;
  color: var(--color-slate-900);
  font-size: 9px;
  font-weight: 900;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.quick-action-copy small {
  overflow: hidden;
  max-width: 100%;
  color: var(--color-slate-400);
  font-size: 7px;
  font-weight: 600;
  line-height: 1.4;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.quick-action-chevron {
  display: grid;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  place-items: center;
  color: var(--color-slate-400);
}

@media (max-width: 420px) {
  .dashboard-page .liquidity-card {
    padding: 13px;
  }

  .dashboard-page .liquidity-card::before {
    inset-inline: 13px;
  }

  .dashboard-page .liquidity-card .balance-amount {
    font-size: 22px;
  }

  .dashboard-page .liquidity-card .balance-stat {
    padding: 8px 7px;
  }

  .dashboard-page .liquidity-card .balance-stat strong {
    font-size: 8px;
  }

  .quick-services {
    padding: 11px;
  }

  .dashboard-page .quick-services .quick-action {
    min-height: 58px;
    gap: 7px;
    padding: 8px;
  }

  .dashboard-page .quick-services .quick-action-icon {
    width: 31px;
    height: 31px;
    flex-basis: 31px;
  }
}

/* ========================================================================== 
   Withdrawal request & management center — v9.2.0
   ========================================================================== */
.withdrawal-page {
  background: #f4f6f6;
}
.withdrawal-page-content {
  max-width: 1080px;
  margin-inline: auto;
  padding-top: 12px;
}
.withdrawal-page-heading {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  padding: 12px 14px;
  border: 1px solid #e4e9e8;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .045);
}
.withdrawal-page-heading > div > span,
.management-brand small {
  display: block;
  margin-bottom: 2px;
  color: #7b8a88;
  font-size: 9px;
  font-weight: 700;
}
.withdrawal-page-heading h1 {
  margin: 0;
  color: #152a27;
  font-size: 16px;
  font-weight: 900;
}
.withdrawal-page-heading p {
  margin: 3px 0 0;
  color: #82908e;
  font-size: 9px;
  line-height: 1.75;
}
.withdrawal-back-button {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid #e4e9e8;
  border-radius: 12px;
  background: #f8faf9;
  color: #375b56;
}
.withdrawal-secure-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 9px;
  border: 1px solid #dce9e7;
  border-radius: 999px;
  background: #f5faf9;
  color: #315f58;
  font-size: 8px;
  font-weight: 800;
  white-space: nowrap;
}
.withdrawal-layout {
  display: grid;
  gap: 12px;
}
.withdrawal-form-card,
.withdrawal-summary-card,
.withdrawal-success-card {
  border: 1px solid #e1e7e6;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 10px 32px rgba(15, 23, 42, .045);
}
.withdrawal-form-card {
  padding: 14px;
}
.withdrawal-card-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 12px;
  border-bottom: 1px solid #edf0f0;
}
.withdrawal-step-badge {
  display: grid;
  width: 29px;
  height: 29px;
  flex: 0 0 29px;
  place-items: center;
  border-radius: 9px;
  background: #edf5f3;
  color: #285a53;
  font-size: 10px;
  font-weight: 900;
}
.withdrawal-card-header h2,
.signature-section h3,
.withdrawal-summary-card h2 {
  margin: 0;
  color: #142824;
  font-size: 12px;
  font-weight: 900;
}
.withdrawal-card-header p,
.signature-section header p,
.withdrawal-summary-card header p {
  margin: 2px 0 0;
  color: #8b9896;
  font-size: 8px;
}
.withdrawal-request-form {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}
.withdrawal-field {
  min-width: 0;
}
.withdrawal-field > label,
.destination-method-fieldset > legend {
  display: block;
  margin-bottom: 6px;
  color: #344744;
  font-size: 9px;
  font-weight: 800;
}
.withdrawal-field label em,
.destination-method-fieldset legend em {
  color: #b34c4c;
  font-style: normal;
}
.withdrawal-field label span {
  color: #94a09e;
  font-size: 8px;
  font-weight: 600;
}
.withdrawal-field > small {
  display: block;
  margin-top: 5px;
  color: #93a09e;
  font-size: 8px;
  line-height: 1.7;
}
.withdrawal-select-wrap,
.withdrawal-input-wrap,
.management-password-wrap {
  position: relative;
  display: flex;
  min-height: 46px;
  align-items: center;
  gap: 8px;
  border: 1px solid #dfe6e5;
  border-radius: 13px;
  background: #fff;
  padding-inline: 11px;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}
.withdrawal-select-wrap:focus-within,
.withdrawal-input-wrap:focus-within,
.management-password-wrap:focus-within {
  border-color: #8fb5af;
  box-shadow: 0 0 0 3px rgba(57, 111, 103, .09);
}
.withdrawal-select-wrap > span,
.withdrawal-input-wrap > span,
.management-password-wrap > span {
  display: grid;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  place-items: center;
  border-radius: 8px;
  background: #f2f6f5;
  color: #52706c;
}
.withdrawal-select-wrap select,
.withdrawal-input-wrap input,
.management-password-wrap input,
.withdrawal-field textarea,
.management-status-form input,
.management-status-form select,
.management-status-form textarea,
.management-filters input,
.management-filters select {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: #172825;
  font-family: inherit;
  font-size: 11px;
  font-weight: 700;
}
.withdrawal-select-wrap select {
  appearance: none;
  min-height: 44px;
  padding-inline-end: 24px;
}
.withdrawal-select-wrap > i {
  position: absolute;
  left: 11px;
  color: #91a09d;
}
.withdrawal-account-preview {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2px 8px;
  margin-top: 6px;
  padding: 8px 10px;
  border: 1px solid #e8edec;
  border-radius: 11px;
  background: #f8faf9;
}
.withdrawal-account-preview span,
.withdrawal-account-preview small {
  color: #8c9997;
  font-size: 8px;
}
.withdrawal-account-preview strong {
  grid-row: span 2;
  align-self: center;
  color: #244943;
  font-size: 9px;
  white-space: nowrap;
}
.withdrawal-account-preview strong b {
  font-size: 11px;
}
.destination-method-fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.destination-method-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.destination-method-tab {
  position: relative;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 0 8px;
  min-height: 61px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid #e1e7e6;
  border-radius: 13px;
  background: #fff;
  cursor: pointer;
  transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}
.destination-method-tab input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.destination-method-tab > span {
  display: grid;
  grid-row: span 2;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 9px;
  background: #f2f6f5;
  color: #607c77;
}
.destination-method-tab strong {
  color: #2e413e;
  font-size: 9px;
  font-weight: 900;
}
.destination-method-tab small {
  color: #929f9d;
  font-size: 7.5px;
}
.destination-method-tab.is-active {
  border-color: #a8c6c1;
  background: #f7fbfa;
  box-shadow: 0 0 0 2px rgba(53, 102, 94, .05);
}
.destination-method-tab.is-active > span {
  background: #e6f1ef;
  color: #265a52;
}
.withdrawal-destination-input input,
.withdrawal-amount-wrap input {
  direction: ltr;
  text-align: left;
  letter-spacing: .4px;
}
.withdrawal-field-state {
  display: none;
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-radius: 50%;
}
.withdrawal-input-wrap.is-valid {
  border-color: #9fc8af;
  background: #fbfefc;
}
.withdrawal-input-wrap.is-valid .withdrawal-field-state {
  display: block;
  background: #4a9a67;
}
.withdrawal-input-wrap.is-invalid,
.withdrawal-input-wrap input.is-invalid {
  border-color: #d9a6a6;
  background: #fffafa;
}
.withdrawal-input-wrap.is-invalid .withdrawal-field-state {
  display: block;
  background: #bf5b5b;
}
.withdrawal-validation-message.is-valid {
  color: #3d8056;
}
.withdrawal-validation-message.is-invalid {
  color: #a34e4e;
}
.withdrawal-amount-wrap b {
  flex: 0 0 auto;
  color: #6f7f7c;
  font-size: 8px;
  font-weight: 800;
}
.withdrawal-amount-words {
  display: flex;
  align-items: flex-start;
  gap: 5px;
  min-height: 23px;
  margin-top: 5px;
  padding: 5px 8px;
  border-radius: 8px;
  background: #f5f8f7;
  color: #7d8b89;
  font-size: 7.5px;
  line-height: 1.7;
}
.withdrawal-amount-words strong {
  color: #44605c;
  font-weight: 800;
}
.withdrawal-field textarea {
  min-height: 76px;
  resize: vertical;
  padding: 10px 11px;
  border: 1px solid #dfe6e5;
  border-radius: 13px;
  background: #fff;
  line-height: 1.8;
}
.withdrawal-field textarea:focus {
  border-color: #8fb5af;
  box-shadow: 0 0 0 3px rgba(57, 111, 103, .09);
}
.signature-section {
  padding: 11px;
  border: 1px solid #e1e7e6;
  border-radius: 15px;
  background: #fafcfb;
}
.signature-section > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 9px;
}
.signature-section > header > div {
  display: flex;
  align-items: center;
  gap: 8px;
}
.signature-clear-button {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 8px;
  border: 1px solid #e0e6e5;
  border-radius: 9px;
  background: #fff;
  color: #74827f;
  font-family: inherit;
  font-size: 8px;
  font-weight: 800;
}
.signature-canvas-wrap {
  position: relative;
  height: 150px;
  overflow: hidden;
  border: 1px dashed #bbc9c7;
  border-radius: 13px;
  background: #fff;
  touch-action: none;
}
.signature-canvas-wrap canvas {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  cursor: crosshair;
  touch-action: none;
}
.signature-placeholder {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 5px;
  color: #a1adaa;
  font-size: 8px;
  pointer-events: none;
}
.signature-placeholder[hidden] {
  display: none;
}
.signature-line {
  position: absolute;
  right: 12%;
  bottom: 27px;
  left: 12%;
  z-index: 1;
  height: 1px;
  background: #e0e7e5;
}
.signature-section > small {
  display: block;
  margin-top: 5px;
  color: #9aa5a3;
  font-size: 7.5px;
}
.signature-section > small.is-signed {
  color: #3f7d55;
}
.withdrawal-rules-checkbox {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  cursor: pointer;
  color: #4c5e5b;
  font-size: 8px;
  line-height: 1.9;
}
.withdrawal-rules-checkbox input {
  position: absolute;
  opacity: 0;
}
.withdrawal-checkmark {
  display: grid;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  place-items: center;
  border: 1px solid #cfd9d7;
  border-radius: 6px;
  background: #fff;
  color: transparent;
  transition: .18s ease;
}
.withdrawal-rules-checkbox input:checked + .withdrawal-checkmark {
  border-color: #376d65;
  background: #376d65;
  color: #fff;
}
.withdrawal-rules-checkbox button {
  padding: 0;
  border: 0;
  background: transparent;
  color: #2d665e;
  font-family: inherit;
  font-size: inherit;
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.withdrawal-rules-box {
  padding: 10px 12px;
  border: 1px solid #e4e9e8;
  border-radius: 12px;
  background: #f8faf9;
  color: #63716f;
  font-size: 8px;
  line-height: 1.9;
}
.withdrawal-rules-box strong {
  display: block;
  margin-bottom: 4px;
  color: #344844;
}
.withdrawal-rules-box ol {
  margin: 0;
  padding-right: 16px;
}
.withdrawal-form-alert,
.management-alert {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 9px 10px;
  border: 1px solid;
  border-radius: 11px;
  font-size: 8px;
  font-weight: 750;
  line-height: 1.8;
}
.withdrawal-form-alert.is-error,
.management-alert.is-error {
  border-color: #efd1d1;
  background: #fff8f8;
  color: #9a4646;
}
.withdrawal-form-alert.is-success,
.management-alert.is-success {
  border-color: #cde4d4;
  background: #f7fcf8;
  color: #38744d;
}
.withdrawal-submit-button {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 20px;
  min-height: 56px;
  align-items: center;
  gap: 9px;
  width: 100%;
  padding: 8px 10px;
  border: 0;
  border-radius: 14px;
  background: #174d46;
  color: #fff;
  font-family: inherit;
  text-align: right;
  box-shadow: 0 8px 20px rgba(23, 77, 70, .17);
}
.withdrawal-submit-button:disabled {
  cursor: wait;
  opacity: .72;
}
.withdrawal-submit-icon {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 11px;
  background: rgba(255, 255, 255, .12);
}
.withdrawal-submit-copy strong,
.withdrawal-submit-copy small {
  display: block;
}
.withdrawal-submit-copy strong {
  font-size: 10px;
  font-weight: 900;
}
.withdrawal-submit-copy small {
  margin-top: 2px;
  color: rgba(255, 255, 255, .68);
  font-size: 7.5px;
}
.withdrawal-submit-loader {
  display: none;
  width: 17px;
  height: 17px;
  border: 2px solid rgba(255, 255, 255, .35);
  border-top-color: #fff;
  border-radius: 50%;
  animation: withdrawal-spin .8s linear infinite;
}
.withdrawal-submit-button.is-loading .withdrawal-submit-loader {
  display: block;
}
@keyframes withdrawal-spin { to { transform: rotate(360deg); } }
.withdrawal-summary-card {
  align-self: start;
  padding: 13px;
}
.withdrawal-summary-card > header {
  display: flex;
  align-items: center;
  gap: 9px;
  padding-bottom: 11px;
  border-bottom: 1px solid #edf0f0;
}
.withdrawal-summary-card > header > span {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 10px;
  background: #eef5f4;
  color: #3e6862;
}
.withdrawal-summary-card dl {
  margin: 8px 0 0;
}
.withdrawal-summary-card dl > div {
  display: flex;
  min-height: 37px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid #f0f2f2;
}
.withdrawal-summary-card dt {
  color: #8c9896;
  font-size: 8px;
}
.withdrawal-summary-card dd {
  margin: 0;
  color: #344744;
  font-size: 8.5px;
  font-weight: 800;
  text-align: left;
}
.withdrawal-summary-card dd strong {
  color: #1c5149;
  font-size: 11px;
}
.withdrawal-summary-note {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  margin-top: 10px;
  padding: 9px;
  border: 1px solid #e2e9e8;
  border-radius: 11px;
  background: #f8faf9;
  color: #74817f;
}
.withdrawal-summary-note svg {
  flex: 0 0 auto;
  color: #5f7c77;
}
.withdrawal-summary-note p {
  margin: 0;
  font-size: 7.5px;
  line-height: 1.9;
}
.withdrawal-storage-state {
  margin-top: 9px;
  padding: 8px 9px;
  border-radius: 10px;
  background: #f3f7f6;
}
.withdrawal-storage-state > span {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #45645f;
  font-size: 8px;
  font-weight: 850;
}
.withdrawal-storage-state i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #5a9a70;
}
.withdrawal-storage-state small {
  display: block;
  margin-top: 3px;
  color: #98a3a1;
  font-size: 7px;
}
.withdrawal-success-card {
  display: grid;
  justify-items: center;
  gap: 11px;
  padding: 26px 18px;
  text-align: center;
}
.withdrawal-success-card[hidden] { display: none; }
.withdrawal-success-icon {
  display: grid;
  width: 56px;
  height: 56px;
  place-items: center;
  border-radius: 18px;
  background: #e9f5ed;
  color: #34724a;
}
.withdrawal-success-card small {
  color: #568467;
  font-size: 8px;
  font-weight: 800;
}
.withdrawal-success-card h2 {
  margin: 4px 0 0;
  color: #173a34;
  font-size: 14px;
}
.withdrawal-success-card h2 strong { direction: ltr; }
.withdrawal-success-card p {
  max-width: 480px;
  margin: 6px auto 0;
  color: #7f8d8a;
  font-size: 8.5px;
  line-height: 1.9;
}
.withdrawal-main em {
  display: block;
  margin-top: 2px;
  color: #a0aaa8;
  font-size: 6.5px;
  font-style: normal;
  direction: ltr;
  text-align: right;
}
.withdrawal-empty-state {
  display: grid;
  justify-items: center;
  gap: 4px;
  padding: 20px 14px;
  text-align: center;
}
.withdrawal-empty-state > span {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 14px;
  background: #f0f5f4;
  color: #57746f;
}
.withdrawal-empty-state strong {
  margin-top: 4px;
  color: #30433f;
  font-size: 10px;
}
.withdrawal-empty-state p {
  margin: 0;
  color: #96a19f;
  font-size: 8px;
}
.withdrawal-empty-state a {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-top: 5px;
  color: #2d665e;
  font-size: 8px;
  font-weight: 850;
}

/* Management */
.management-page { background: #f3f5f5; }
.management-shell {
  width: min(1420px, calc(100% - 24px));
  min-height: 100dvh;
  margin-inline: auto;
  padding-block: 14px 24px;
}
.management-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid #e1e6e5;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 26px rgba(15, 23, 42, .045);
}
.management-brand {
  display: flex;
  align-items: center;
  gap: 10px;
}
.management-brand > span {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 12px;
  background: #edf4f3;
  color: #3a655f;
}
.management-brand h1 {
  margin: 0;
  color: #172a27;
  font-size: 14px;
  font-weight: 900;
}
.management-topbar nav {
  display: flex;
  align-items: center;
  gap: 6px;
}
.management-topbar nav a {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 7px 9px;
  border: 1px solid #e3e8e7;
  border-radius: 10px;
  background: #fff;
  color: #5c6d6a;
  font-size: 8px;
  font-weight: 800;
}
.management-topbar nav a.management-logout { color: #985353; }
.management-login-card {
  width: min(420px, 100%);
  margin: 48px auto 0;
  padding: 20px;
  border: 1px solid #e1e6e5;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 16px 46px rgba(15, 23, 42, .06);
  text-align: center;
}
.management-login-icon {
  display: grid;
  width: 52px;
  height: 52px;
  margin: 0 auto 10px;
  place-items: center;
  border-radius: 17px;
  background: #edf5f3;
  color: #37655e;
}
.management-login-card > div > small {
  color: #6f8b86;
  font-size: 8px;
  font-weight: 800;
}
.management-login-card h2 {
  margin: 3px 0 0;
  color: #172a27;
  font-size: 15px;
}
.management-login-card p {
  margin: 5px auto 0;
  color: #8d9997;
  font-size: 8px;
  line-height: 1.8;
}
.management-login-card form {
  margin-top: 14px;
  text-align: right;
}
.management-login-card form > label {
  display: block;
  margin-bottom: 6px;
  color: #42534f;
  font-size: 8px;
  font-weight: 800;
}
.management-login-card form > button,
.management-status-form > button {
  display: flex;
  min-height: 45px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 100%;
  margin-top: 9px;
  border: 0;
  border-radius: 12px;
  background: #174d46;
  color: #fff;
  font-family: inherit;
  font-size: 9px;
  font-weight: 900;
}
.management-login-hint {
  display: block;
  margin-top: 10px;
  color: #9ba5a3;
  font-size: 7px;
}
.management-release-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}
.management-release-row > div {
  display: flex;
  min-height: 52px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 9px 11px;
  border: 1px solid #e1e7e6;
  border-radius: 13px;
  background: #fff;
}
.management-release-row span { color: #8b9895; font-size: 8px; }
.management-release-row strong { color: #36534e; font-size: 9px; }
.management-alert { margin-top: 9px; }
.management-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}
.management-stats a {
  display: flex;
  min-height: 68px;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 1px solid #e1e7e6;
  border-radius: 15px;
  background: #fff;
  transition: border-color .18s ease, box-shadow .18s ease;
}
.management-stats a.is-active {
  border-color: #9ebeb8;
  box-shadow: 0 0 0 2px rgba(48, 101, 92, .05);
}
.management-stat-icon {
  display: grid;
  width: 35px;
  height: 35px;
  flex: 0 0 35px;
  place-items: center;
  border-radius: 11px;
  background: #f0f5f4;
  color: #52716b;
}
.management-stats small { display: block; color: #8d9997; font-size: 8px; }
.management-stats strong { display: block; margin-top: 2px; color: #263d39; font-size: 16px; }
.management-detail-card,
.management-list-card {
  margin-top: 10px;
  border: 1px solid #e0e6e5;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 28px rgba(15, 23, 42, .035);
}
.management-detail-card > header,
.management-list-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid #edf0ef;
}
.management-detail-heading {
  display: flex;
  align-items: center;
  gap: 9px;
}
.management-detail-heading > span {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 11px;
  background: #edf4f3;
  color: #436b65;
}
.management-detail-heading small,
.management-list-header > div > span { color: #899794; font-size: 8px; }
.management-detail-heading h2,
.management-list-header h2 { margin: 2px 0 0; color: #203733; font-size: 12px; }
.management-detail-heading p { margin: 2px 0 0; color: #a0aaa8; font-size: 7px; }
.management-detail-actions { display: flex; align-items: center; gap: 7px; }
.management-detail-actions > a {
  display: grid;
  width: 31px;
  height: 31px;
  place-items: center;
  border: 1px solid #e1e6e5;
  border-radius: 9px;
  color: #71807d;
}
.management-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(240px, .55fr);
  gap: 10px;
  padding: 12px;
}
.management-detail-info,
.management-signature-card,
.management-status-form {
  border: 1px solid #e5eae9;
  border-radius: 14px;
  background: #fafcfb;
}
.management-detail-info { padding: 4px 11px; }
.management-detail-info dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
}
.management-detail-info dl > div {
  display: grid;
  grid-template-columns: minmax(90px, .45fr) minmax(0, 1fr);
  gap: 8px;
  min-height: 46px;
  align-items: center;
  padding: 7px 5px;
  border-bottom: 1px solid #edf0ef;
}
.management-detail-info dt { color: #8c9896; font-size: 8px; }
.management-detail-info dd { margin: 0; color: #334a46; font-size: 9px; font-weight: 800; }
.management-detail-info dd small { display: block; margin-top: 2px; color: #9aa5a3; font-size: 7px; font-weight: 600; }
.management-detail-info .management-destination-full,
.management-detail-info .management-detail-description { grid-column: 1 / -1; }
.management-detail-amount { color: #1c5b51 !important; font-size: 12px !important; }
.management-signature-card {
  padding: 11px;
  text-align: center;
}
.management-signature-card > span { color: #536763; font-size: 8px; font-weight: 850; }
.management-signature-card > div {
  display: grid;
  min-height: 145px;
  margin-top: 7px;
  place-items: center;
  overflow: hidden;
  border: 1px dashed #cbd5d3;
  border-radius: 11px;
  background: #fff;
}
.management-signature-card img { display: block; max-width: 100%; max-height: 145px; object-fit: contain; }
.management-signature-card small { display: block; margin-top: 5px; color: #9ba5a3; font-size: 7px; }
.management-status-form {
  grid-column: 1 / -1;
  padding: 11px;
}
.management-status-form > header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 9px;
}
.management-status-form > header > span {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 10px;
  background: #edf4f3;
  color: #496e68;
}
.management-status-form h3 { margin: 0; color: #2c423e; font-size: 10px; }
.management-status-form header p { margin: 2px 0 0; color: #98a3a1; font-size: 7px; }
.management-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.management-form-grid label > span {
  display: block;
  margin-bottom: 5px;
  color: #63736f;
  font-size: 8px;
  font-weight: 800;
}
.management-status-form input,
.management-status-form select,
.management-status-form textarea {
  min-height: 41px;
  padding: 8px 10px;
  border: 1px solid #dfe6e4;
  border-radius: 10px;
  background: #fff;
}
.management-status-form textarea { min-height: 70px; resize: vertical; }
.management-note-field { grid-column: 1 / -1; }
.management-status-form > button { width: auto; min-width: 180px; margin-right: auto; }
.management-list-header > div { flex: 0 0 auto; }
.management-filters {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  flex: 1;
}
.management-filters label {
  display: flex;
  min-height: 36px;
  min-width: 210px;
  align-items: center;
  gap: 5px;
  padding: 0 9px;
  border: 1px solid #dfe5e4;
  border-radius: 9px;
}
.management-filters select {
  width: auto;
  min-height: 36px;
  padding: 0 9px;
  border: 1px solid #dfe5e4;
  border-radius: 9px;
}
.management-filters button,
.management-filters > a {
  display: inline-flex;
  min-height: 36px;
  align-items: center;
  gap: 4px;
  padding: 0 10px;
  border: 0;
  border-radius: 9px;
  background: #315f58;
  color: #fff;
  font-family: inherit;
  font-size: 8px;
  font-weight: 850;
}
.management-filters > a { background: #f1f4f3; color: #6f7c79; }
.management-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.management-table {
  width: 100%;
  min-width: 1180px;
  border-collapse: collapse;
  text-align: right;
}
.management-table th {
  padding: 9px 10px;
  border-bottom: 1px solid #e5eae9;
  background: #f7f9f8;
  color: #788683;
  font-size: 7.5px;
  font-weight: 850;
  white-space: nowrap;
}
.management-table td {
  min-height: 52px;
  padding: 9px 10px;
  border-bottom: 1px solid #edf0ef;
  color: #3b4e4a;
  font-size: 8px;
  vertical-align: middle;
}
.management-table tr.is-selected td { background: #f7fbfa; }
.management-table td > span,
.management-table td > strong,
.management-table td > small { display: block; }
.management-table td > strong { color: #284640; font-size: 8.5px; }
.management-table td > small { margin-top: 2px; color: #99a4a2; font-size: 7px; }
.management-view-button {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 6px 8px;
  border: 1px solid #dce5e3;
  border-radius: 8px;
  color: #34665e;
  font-size: 8px;
  font-weight: 850;
  white-space: nowrap;
}
.management-empty {
  display: grid;
  min-height: 180px;
  place-content: center;
  justify-items: center;
  color: #84918f;
  text-align: center;
}
.management-empty > span {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 15px;
  background: #f0f4f3;
}
.management-empty strong { margin-top: 6px; color: #465955; font-size: 10px; }
.management-empty p { margin: 3px 0 0; font-size: 8px; }
.management-footer { padding: 15px 0 0; color: #99a3a1; font-size: 7px; text-align: center; }

@media (min-width: 820px) {
  .withdrawal-layout { grid-template-columns: minmax(0, 1.45fr) minmax(260px, .55fr); }
  .withdrawal-request-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .withdrawal-field-full { grid-column: 1 / -1; }
  .withdrawal-summary-card { position: sticky; top: 78px; }
}
@media (max-width: 819px) {
  .withdrawal-summary-card { order: -1; }
  .withdrawal-summary-card dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 10px; }
  .withdrawal-summary-note,
  .withdrawal-storage-state { display: none; }
  .management-release-row { grid-template-columns: 1fr; }
  .management-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .management-detail-grid { grid-template-columns: 1fr; }
  .management-status-form { grid-column: auto; }
  .management-detail-info dl { grid-template-columns: 1fr; }
  .management-detail-info .management-destination-full,
  .management-detail-info .management-detail-description { grid-column: auto; }
  .management-list-header { align-items: flex-start; flex-direction: column; }
  .management-filters { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
  .management-filters label { flex: 1; min-width: 170px; }
}
@media (max-width: 520px) {
  .withdrawal-page-content { padding-inline: 10px; }
  .withdrawal-page-heading { grid-template-columns: 36px minmax(0, 1fr); padding: 10px; border-radius: 15px; }
  .withdrawal-back-button { width: 34px; height: 34px; }
  .withdrawal-secure-badge { display: none; }
  .withdrawal-form-card { padding: 11px; border-radius: 17px; }
  .withdrawal-summary-card { padding: 10px; border-radius: 16px; }
  .withdrawal-summary-card dl { grid-template-columns: 1fr; }
  .destination-method-tab { padding: 8px; }
  .signature-canvas-wrap { height: 135px; }
  .management-shell { width: min(100% - 16px, 1420px); padding-top: 8px; }
  .management-topbar { align-items: flex-start; padding: 10px; border-radius: 15px; }
  .management-brand h1 { font-size: 11px; }
  .management-topbar nav { flex-wrap: wrap; justify-content: flex-end; }
  .management-topbar nav a { padding: 6px; }
  .management-topbar nav a svg { display: none; }
  .management-detail-card > header { align-items: flex-start; }
  .management-detail-info dl > div { grid-template-columns: 86px minmax(0, 1fr); }
  .management-form-grid { grid-template-columns: 1fr; }
  .management-note-field { grid-column: auto; }
  .management-status-form > button { width: 100%; }
}

/* =====================================================================
   Native-app interaction rules + Account services • release 9.3.0
   ===================================================================== */
html,
body {
  touch-action: pan-x pan-y;
  overscroll-behavior-y: contain;
}

body,
body * {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

input,
textarea,
select,
option,
[contenteditable="true"],
canvas {
  -webkit-user-select: text;
  user-select: text;
  -webkit-touch-callout: default;
}

canvas,
.signature-canvas-wrap {
  touch-action: none;
}

a,
button,
label,
[role="button"] {
  touch-action: manipulation;
}

body ::selection {
  background: transparent;
  color: inherit;
}

input::selection,
textarea::selection,
[contenteditable="true"]::selection {
  background: var(--color-brand-200);
  color: var(--color-brand-900);
}

.account-services-content {
  max-width: 900px;
  margin-inline: auto;
}

.account-services-heading {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 2px 1px 1px;
}

.account-services-back {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid #e3e9e8;
  border-radius: 14px;
  background: #fff;
  color: #35524f;
  box-shadow: 0 4px 14px rgba(21, 42, 39, .04);
}

.account-services-heading > div {
  min-width: 0;
}

.account-services-heading > div > span {
  display: block;
  margin-bottom: 2px;
  color: #6f8582;
  font-size: 10px;
  font-weight: 700;
}

.account-services-heading h1 {
  color: #172522;
  font-size: 20px;
  font-weight: 900;
  line-height: 1.35;
}

.account-services-heading p {
  margin-top: 2px;
  color: #82918f;
  font-size: 10px;
  font-weight: 500;
}

.account-services-secure {
  display: inline-flex;
  min-height: 29px;
  align-items: center;
  gap: 5px;
  border: 1px solid #dceae7;
  border-radius: 999px;
  padding-inline: 9px;
  background: #f5faf9;
  color: #376f68;
  font-size: 9px;
  font-weight: 800;
}

.selected-account-card,
.account-service-list-panel {
  border: 1px solid #e2e8e7;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 8px 26px rgba(26, 45, 42, .045);
}

.selected-account-card {
  padding: 15px;
}

.selected-account-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.selected-account-identity {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 11px;
}

.selected-account-icon {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  place-items: center;
  border: 1px solid #d9e9e6;
  border-radius: 14px;
  background: #f2f8f7;
  color: #266d65;
}

.selected-account-identity > div {
  min-width: 0;
}

.selected-account-identity span:not(.selected-account-icon) {
  display: block;
  color: #8a9997;
  font-size: 9px;
  font-weight: 700;
}

.selected-account-identity h2 {
  overflow: hidden;
  margin-top: 1px;
  color: #1b2927;
  font-size: 14px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.selected-account-identity p {
  margin-top: 2px;
  color: #748783;
  font-size: 9px;
}

.selected-account-identity p b {
  color: #536966;
  font-weight: 800;
}

.account-services-selector-wrap {
  position: relative;
  display: flex;
  min-width: 118px;
  height: 42px;
  flex-direction: column;
  justify-content: center;
  border: 1px solid #e1e8e7;
  border-radius: 13px;
  padding: 5px 11px 5px 30px;
  background: #fafcfc;
}

.account-services-selector-wrap > span {
  color: #92a09e;
  font-size: 8px;
  font-weight: 700;
  line-height: 1.2;
}

.account-services-selector-wrap select {
  width: 100%;
  appearance: none;
  outline: none;
  color: #334b47;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.4;
}

.account-services-selector-wrap svg {
  position: absolute;
  inset-inline-end: 9px;
  top: 50%;
  color: #6f8582;
  transform: translateY(-50%);
  pointer-events: none;
}

.selected-account-balance {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
  border-top: 1px solid #edf1f0;
  padding-top: 13px;
}

.selected-account-balance > span {
  color: #7c8e8b;
  font-size: 10px;
  font-weight: 700;
}

.selected-account-balance p {
  display: flex;
  align-items: baseline;
  gap: 5px;
  direction: rtl;
}

.selected-account-balance strong {
  color: #17342f;
  font-size: clamp(19px, 5vw, 27px);
  font-weight: 900;
  letter-spacing: -.45px;
  line-height: 1;
}

.selected-account-balance small {
  color: #768a86;
  font-size: 9px;
  font-weight: 700;
}

.account-service-list-panel {
  overflow: hidden;
}

.account-service-list-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid #e8edec;
  padding: 14px 15px;
}

.account-service-list-header h2 {
  color: #1e2d2a;
  font-size: 14px;
  font-weight: 900;
}

.account-service-list-header p {
  margin-top: 2px;
  color: #899794;
  font-size: 9px;
}

.account-service-list-header > span {
  display: inline-flex;
  min-height: 25px;
  flex: 0 0 auto;
  align-items: center;
  border: 1px solid #e0e7e6;
  border-radius: 999px;
  padding-inline: 9px;
  background: #f7f9f9;
  color: #667a76;
  font-size: 9px;
  font-weight: 800;
}

.account-service-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.account-service-item {
  position: relative;
  display: grid;
  min-height: 72px;
  grid-template-columns: 42px minmax(0, 1fr) auto 18px;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid #edf1f0;
  padding: 11px 14px;
  background: #fff;
  transition: background-color .18s ease, transform .18s ease;
}

.account-service-item:last-child {
  border-bottom: 0;
}

.account-service-item:active {
  background: #f7faf9;
  transform: scale(.992);
}

.account-service-item-icon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid #e1e8e7;
  border-radius: 14px;
  background: #f7f9f9;
  color: #536b67;
}

.account-service-item.is-available .account-service-item-icon {
  border-color: #d6e9e5;
  background: #f1f8f6;
  color: #246f66;
}

.account-service-item-copy {
  min-width: 0;
}

.account-service-item-copy strong {
  display: block;
  color: #21302d;
  font-size: 12px;
  font-weight: 900;
}

.account-service-item-copy small {
  display: block;
  overflow: hidden;
  margin-top: 2px;
  color: #879692;
  font-size: 9px;
  line-height: 1.65;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-service-ready,
.account-service-next {
  display: inline-flex;
  min-height: 23px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding-inline: 8px;
  font-size: 8px;
  font-weight: 900;
  white-space: nowrap;
}

.account-service-ready {
  border: 1px solid #d3e9e4;
  background: #eef8f5;
  color: #277066;
}

.account-service-next {
  border: 1px solid #e8eceb;
  background: #f8f9f9;
  color: #87928f;
}

.account-service-chevron {
  display: grid;
  width: 18px;
  place-items: center;
  color: #82918e;
}

.account-services-note {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  border: 1px solid #e0e8e6;
  border-radius: 16px;
  padding: 11px 12px;
  background: #f8fbfa;
  color: #5d746f;
}

.account-services-note svg {
  margin-top: 1px;
  color: #36756d;
}

.account-services-note p {
  font-size: 9px;
  font-weight: 600;
  line-height: 1.8;
}

@media (min-width: 720px) {
  .account-service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .account-service-item:nth-child(odd) {
    border-inline-end: 1px solid #edf1f0;
  }

  .account-service-item:nth-last-child(-n + 2) {
    border-bottom: 0;
  }
}

@media (max-width: 430px) {
  .account-services-heading {
    grid-template-columns: 40px minmax(0, 1fr) auto;
    gap: 9px;
  }

  .account-services-heading p {
    max-width: 225px;
  }

  .account-services-secure {
    min-height: 26px;
    padding-inline: 7px;
  }

  .selected-account-card {
    padding: 13px;
  }

  .selected-account-top {
    align-items: stretch;
  }

  .account-services-selector-wrap {
    min-width: 108px;
    height: 40px;
  }

  .account-service-item {
    grid-template-columns: 40px minmax(0, 1fr) auto 16px;
    min-height: 68px;
    gap: 9px;
    padding-inline: 12px;
  }

  .account-service-item-icon {
    width: 40px;
    height: 40px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .account-service-item {
    transition: none;
  }
}

/* =========================================================
   Account statement • v9.4.0
   ========================================================= */
.statement-content {
  max-width: 900px;
  margin-inline: auto;
}

.statement-heading {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 2px 1px 1px;
}

.statement-back {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid #e3e9e8;
  border-radius: 14px;
  background: #fff;
  color: #35524f;
  box-shadow: 0 4px 14px rgba(21, 42, 39, .04);
}

.statement-heading-copy {
  min-width: 0;
}

.statement-heading-copy > span {
  display: block;
  margin-bottom: 2px;
  color: #6f8582;
  font-size: 10px;
  font-weight: 700;
}

.statement-heading h1 {
  color: #172522;
  font-size: 20px;
  font-weight: 900;
  line-height: 1.35;
}

.statement-heading p {
  margin-top: 2px;
  color: #82918f;
  font-size: 10px;
}

.statement-print-button {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid #dfe7e5;
  border-radius: 12px;
  padding-inline: 11px;
  background: #fff;
  color: #45615d;
  font-size: 9px;
  font-weight: 900;
  box-shadow: 0 3px 12px rgba(26, 45, 42, .035);
}

.statement-account-card,
.statement-filter-panel,
.statement-list-panel {
  border: 1px solid #e2e8e7;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 8px 26px rgba(26, 45, 42, .045);
}

.statement-account-card {
  padding: 15px;
}

.statement-account-main {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.statement-account-identity {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 11px;
}

.statement-account-icon {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  place-items: center;
  border: 1px solid #d9e9e6;
  border-radius: 14px;
  background: #f2f8f7;
  color: #266d65;
}

.statement-account-identity > div {
  min-width: 0;
}

.statement-account-identity span:not(.statement-account-icon) {
  display: block;
  color: #8a9997;
  font-size: 9px;
  font-weight: 700;
}

.statement-account-identity h2 {
  overflow: hidden;
  margin-top: 1px;
  color: #1b2927;
  font-size: 14px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.statement-account-identity p {
  margin-top: 2px;
  color: #748783;
  font-size: 9px;
}

.statement-account-identity p b {
  color: #536966;
  font-weight: 800;
}

.statement-account-selector {
  position: relative;
  display: flex;
  min-width: 118px;
  height: 42px;
  flex-direction: column;
  justify-content: center;
  border: 1px solid #e1e8e7;
  border-radius: 13px;
  padding: 5px 11px 5px 30px;
  background: #fafcfc;
}

.statement-account-selector > span {
  color: #92a09e;
  font-size: 8px;
  font-weight: 700;
  line-height: 1.2;
}

.statement-account-selector select {
  width: 100%;
  appearance: none;
  outline: none;
  color: #334b47;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.4;
}

.statement-account-selector svg {
  position: absolute;
  inset-inline-end: 9px;
  top: 50%;
  color: #6f8582;
  transform: translateY(-50%);
  pointer-events: none;
}

.statement-account-balance {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
  border-top: 1px solid #edf1f0;
  padding-top: 13px;
}

.statement-account-balance > div > span {
  color: #7c8e8b;
  font-size: 10px;
  font-weight: 700;
}

.statement-account-balance p {
  display: flex;
  align-items: baseline;
  gap: 5px;
  margin-top: 2px;
}

.statement-account-balance strong {
  color: #17342f;
  font-size: clamp(19px, 5vw, 27px);
  font-weight: 900;
  letter-spacing: -.45px;
  line-height: 1;
}

.statement-account-balance small {
  color: #768a86;
  font-size: 9px;
  font-weight: 700;
}

.statement-account-state {
  display: inline-flex;
  min-height: 27px;
  align-items: center;
  gap: 5px;
  border: 1px solid #d9e9e5;
  border-radius: 999px;
  padding-inline: 9px;
  background: #f3f9f7;
  color: #397068;
  font-size: 8.5px;
  font-weight: 900;
}

.statement-account-state i,
.statement-detail-status i {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #459186;
}

.statement-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.statement-summary-item {
  display: flex;
  min-width: 0;
  min-height: 72px;
  align-items: center;
  gap: 9px;
  border: 1px solid #e3e9e8;
  border-radius: 17px;
  padding: 11px;
  background: #fff;
  box-shadow: 0 5px 18px rgba(26, 45, 42, .035);
}

.statement-summary-icon {
  display: grid;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  place-items: center;
  border: 1px solid #e2e8e7;
  border-radius: 11px;
  background: #f7f9f9;
  color: #586e6a;
}

.statement-summary-item.is-credit .statement-summary-icon {
  border-color: #d7e9e5;
  background: #f1f8f6;
  color: #2d776e;
}

.statement-summary-item.is-debit .statement-summary-icon {
  border-color: #eadfdd;
  background: #faf5f4;
  color: #93615a;
}

.statement-summary-item > div {
  min-width: 0;
}

.statement-summary-item small {
  display: block;
  color: #879692;
  font-size: 8.5px;
  font-weight: 700;
}

.statement-summary-item p {
  display: flex;
  min-width: 0;
  align-items: baseline;
  gap: 4px;
  margin-top: 3px;
  white-space: nowrap;
}

.statement-summary-item strong {
  overflow: hidden;
  color: #273733;
  font-size: 11px;
  font-weight: 900;
  text-overflow: ellipsis;
}

.statement-summary-item p span {
  color: #8a9895;
  font-size: 7.5px;
  font-weight: 700;
}

.statement-filter-panel {
  overflow: hidden;
}

.statement-filter-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 15px 8px;
}

.statement-filter-header h2 {
  color: #1e2d2a;
  font-size: 14px;
  font-weight: 900;
}

.statement-filter-header p {
  margin-top: 2px;
  color: #899794;
  font-size: 9px;
}

.statement-filter-toggle {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  gap: 5px;
  border: 1px solid #e0e7e6;
  border-radius: 10px;
  padding-inline: 9px;
  background: #f8faf9;
  color: #60736f;
  font-size: 8.5px;
  font-weight: 900;
}

.statement-filter-form {
  padding: 0 15px 10px;
}

.statement-search-wrap {
  position: relative;
  display: flex;
  height: 40px;
  align-items: center;
  gap: 8px;
  border: 1px solid #e1e7e6;
  border-radius: 13px;
  padding-inline: 11px;
  background: #fafcfc;
  color: #7e8f8c;
}

.statement-search-wrap input {
  min-width: 0;
  flex: 1;
  outline: none;
  color: #243430;
  font-size: 10px;
  font-weight: 700;
}

.statement-search-wrap input::placeholder {
  color: #9aa6a4;
}

.statement-search-wrap > a {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 8px;
  background: #eef2f1;
  color: #6f807d;
}

.statement-filter-options {
  display: none;
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
  gap: 8px;
  margin-top: 8px;
}

.statement-filter-options.is-open,
.statement-filter-options:has(select:focus) {
  display: grid;
}

.statement-filter-options label {
  position: relative;
  display: flex;
  min-width: 0;
  height: 43px;
  flex-direction: column;
  justify-content: center;
  border: 1px solid #e1e7e6;
  border-radius: 12px;
  padding: 5px 10px 5px 30px;
  background: #fafcfc;
}

.statement-filter-options label > span {
  color: #929f9d;
  font-size: 7.5px;
  font-weight: 700;
  line-height: 1.15;
}

.statement-filter-options select {
  width: 100%;
  appearance: none;
  outline: none;
  color: #354b47;
  font-size: 9px;
  font-weight: 900;
}

.statement-filter-options label svg {
  position: absolute;
  inset-inline-end: 9px;
  top: 50%;
  color: #748783;
  transform: translateY(-50%);
  pointer-events: none;
}

.statement-filter-submit {
  min-width: 88px;
  border-radius: 12px;
  background: #174f49;
  padding-inline: 13px;
  color: #fff;
  font-size: 9px;
  font-weight: 900;
}

.statement-kind-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  border-top: 1px solid #edf1f0;
  padding: 8px 10px;
  background: #fafbfb;
}

.statement-kind-tabs a {
  display: flex;
  min-height: 31px;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: 10px;
  color: #788985;
  font-size: 9px;
  font-weight: 900;
}

.statement-kind-tabs a.is-active {
  border-color: #dce9e6;
  background: #fff;
  color: #2e6760;
  box-shadow: 0 2px 8px rgba(26, 45, 42, .04);
}

.statement-list-panel {
  overflow: hidden;
}

.statement-date-group + .statement-date-group {
  border-top: 1px solid #e9eeed;
}

.statement-date-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px 7px;
  background: #fafbfb;
}

.statement-date-header span {
  color: #526763;
  font-size: 9px;
  font-weight: 900;
}

.statement-date-header small {
  color: #99a4a2;
  font-size: 8px;
  font-weight: 700;
}

.statement-row {
  display: grid;
  width: 100%;
  min-height: 67px;
  grid-template-columns: 40px minmax(0, 1fr) auto 16px;
  align-items: center;
  gap: 9px;
  border-bottom: 1px solid #edf1f0;
  padding: 10px 13px;
  background: #fff;
  text-align: start;
  transition: background-color .16s ease, transform .16s ease;
}

.statement-row:last-child {
  border-bottom: 0;
}

.statement-row:active {
  background: #f8faf9;
  transform: scale(.994);
}

.statement-row-icon {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid #e2e8e7;
  border-radius: 13px;
  background: #f7f9f9;
}

.statement-row-icon.is-credit {
  border-color: #d8eae6;
  background: #f1f8f6;
  color: #2d776e;
}

.statement-row-icon.is-debit {
  border-color: #eadfdd;
  background: #faf5f4;
  color: #93615a;
}

.statement-row-copy {
  min-width: 0;
}

.statement-row-copy strong {
  display: block;
  overflow: hidden;
  color: #24322f;
  font-size: 10.5px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.statement-row-copy small {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 5px;
  margin-top: 3px;
  color: #899793;
  font-size: 8px;
  font-weight: 600;
}

.statement-row-copy small span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.statement-row-copy small i {
  width: 3px;
  height: 3px;
  flex: 0 0 3px;
  border-radius: 999px;
  background: #c8d0ce;
}

.statement-row-amount {
  display: flex;
  min-width: 104px;
  flex-direction: column;
  align-items: flex-start;
  direction: rtl;
}

.statement-row-amount strong {
  font-size: 10px;
  font-weight: 900;
  white-space: nowrap;
}

.statement-row-amount.is-credit strong {
  color: #277168;
}

.statement-row-amount.is-debit strong {
  color: #855d57;
}

.statement-row-amount small {
  margin-top: 1px;
  color: #9aa5a3;
  font-size: 7px;
  font-weight: 700;
}

.statement-row-chevron {
  display: grid;
  width: 16px;
  place-items: center;
  color: #91a09d;
}

.statement-empty {
  display: flex;
  min-height: 260px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 30px 15px;
  text-align: center;
}

.statement-empty > span {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border: 1px solid #e0e8e6;
  border-radius: 19px;
  background: #f6f9f8;
  color: #6d837f;
}

.statement-empty h2 {
  margin-top: 12px;
  color: #263633;
  font-size: 13px;
  font-weight: 900;
}

.statement-empty p {
  margin-top: 3px;
  color: #8b9996;
  font-size: 9px;
}

.statement-empty a {
  display: inline-flex;
  min-height: 32px;
  align-items: center;
  margin-top: 13px;
  border: 1px solid #dce8e5;
  border-radius: 11px;
  padding-inline: 12px;
  background: #f5faf8;
  color: #376e67;
  font-size: 9px;
  font-weight: 900;
}

.statement-footnote {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  border: 1px solid #e0e8e6;
  border-radius: 16px;
  padding: 11px 12px;
  background: #f8fbfa;
  color: #5d746f;
}

.statement-footnote svg {
  margin-top: 1px;
  color: #36756d;
}

.statement-footnote p {
  font-size: 9px;
  font-weight: 600;
  line-height: 1.8;
}

.statement-detail-modal {
  position: fixed;
  inset: 0;
  z-index: 90;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease, visibility .2s ease;
}

.statement-detail-modal.is-open {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.statement-detail-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: rgba(14, 28, 26, .42);
  backdrop-filter: blur(4px);
}

.statement-detail-sheet {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  max-height: 90dvh;
  overflow-y: auto;
  border-radius: 24px 24px 0 0;
  background: #fff;
  padding: 9px 15px calc(17px + env(safe-area-inset-bottom));
  box-shadow: 0 -20px 50px rgba(11, 30, 27, .16);
  transform: translateY(102%);
  transition: transform .25s ease;
}

.statement-detail-modal.is-open .statement-detail-sheet {
  transform: translateY(0);
}

.statement-detail-handle {
  width: 38px;
  height: 4px;
  margin: 0 auto 11px;
  border-radius: 999px;
  background: #dfe5e4;
}

.statement-detail-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid #e8edec;
  padding-bottom: 12px;
}

.statement-detail-header > div {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 10px;
}

.statement-detail-icon {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  place-items: center;
  border: 1px solid #e1e8e7;
  border-radius: 14px;
  background: #f7f9f9;
  color: #566c68;
}

.statement-detail-icon.is-credit {
  border-color: #d8eae6;
  background: #f1f8f6;
  color: #2d776e;
}

.statement-detail-icon.is-debit {
  border-color: #eadfdd;
  background: #faf5f4;
  color: #93615a;
}

.statement-detail-header small {
  display: block;
  color: #8a9996;
  font-size: 8px;
  font-weight: 700;
}

.statement-detail-header h2 {
  overflow: hidden;
  margin-top: 2px;
  color: #22322f;
  font-size: 13px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.statement-detail-header > button {
  display: grid;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  place-items: center;
  border: 1px solid #e3e9e8;
  border-radius: 11px;
  background: #fafbfb;
  color: #667b77;
}

.statement-detail-amount {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 5px;
  padding: 18px 10px 5px;
  direction: rtl;
}

.statement-detail-amount > span {
  color: #283b37;
  font-size: 25px;
  font-weight: 900;
  letter-spacing: -.5px;
}

.statement-detail-amount > span.is-credit {
  color: #277168;
}

.statement-detail-amount > span.is-debit {
  color: #855d57;
}

.statement-detail-amount small {
  color: #879692;
  font-size: 9px;
  font-weight: 700;
}

.statement-detail-description {
  margin: 0 auto 13px;
  color: #7b8b88;
  font-size: 9px;
  text-align: center;
}

.statement-detail-list {
  overflow: hidden;
  border: 1px solid #e5eae9;
  border-radius: 16px;
  background: #fff;
}

.statement-detail-list > div {
  display: flex;
  min-height: 46px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid #edf1f0;
  padding: 9px 11px;
}

.statement-detail-list > div:last-child {
  border-bottom: 0;
}

.statement-detail-list dt {
  color: #84938f;
  font-size: 8.5px;
  font-weight: 700;
}

.statement-detail-list dd {
  color: #364b47;
  font-size: 9px;
  font-weight: 800;
  text-align: end;
}

.statement-detail-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #347168;
}

.statement-detail-reference-row dd {
  display: flex;
  align-items: center;
  gap: 7px;
}

.statement-detail-reference-row button {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  gap: 4px;
  border: 1px solid #dce8e5;
  border-radius: 9px;
  padding-inline: 7px;
  background: #f5faf8;
  color: #386f67;
  font-size: 8px;
  font-weight: 900;
}

.statement-detail-close {
  width: 100%;
  min-height: 43px;
  margin-top: 11px;
  border-radius: 14px;
  background: #174f49;
  color: #fff;
  font-size: 10px;
  font-weight: 900;
}

.statement-modal-open {
  overflow: hidden;
}

@media (min-width: 720px) {
  .statement-detail-sheet {
    inset-inline-start: 50%;
    bottom: 50%;
    width: min(430px, calc(100vw - 32px));
    border-radius: 22px;
    padding-bottom: 17px;
    transform: translate(-50%, 55%);
  }

  .statement-detail-modal.is-open .statement-detail-sheet {
    transform: translate(-50%, 50%);
  }
}

@media (max-width: 560px) {
  .statement-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .statement-summary-item.is-count {
    grid-column: 1 / -1;
    min-height: 58px;
  }

  .statement-filter-options,
  .statement-filter-options.is-open {
    grid-template-columns: 1fr;
  }

  .statement-filter-submit {
    min-height: 40px;
  }
}

@media (max-width: 430px) {
  .statement-heading {
    grid-template-columns: 40px minmax(0, 1fr) auto;
    gap: 9px;
  }

  .statement-print-button {
    width: 36px;
    min-height: 36px;
    padding: 0;
  }

  .statement-print-button span {
    display: none;
  }

  .statement-account-card {
    padding: 13px;
  }

  .statement-account-main {
    align-items: stretch;
  }

  .statement-account-selector {
    min-width: 108px;
    height: 40px;
  }

  .statement-summary-item {
    min-height: 68px;
    padding: 9px;
  }

  .statement-row {
    grid-template-columns: 38px minmax(0, 1fr) auto 14px;
    gap: 8px;
    padding-inline: 11px;
  }

  .statement-row-icon {
    width: 38px;
    height: 38px;
  }

  .statement-row-amount {
    min-width: 92px;
  }

  .statement-row-amount strong {
    font-size: 9px;
  }
}

@media print {
  .app-header,
  .bottom-nav,
  .statement-heading,
  .statement-filter-panel,
  .statement-footnote,
  .statement-detail-modal,
  .toast {
    display: none !important;
  }

  html,
  body,
  .app-body,
  .app-shell {
    min-height: auto !important;
    background: #fff !important;
  }

  .page-content,
  .statement-content {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .statement-account-card,
  .statement-summary-item,
  .statement-list-panel {
    box-shadow: none !important;
    break-inside: avoid;
  }

  .statement-row {
    break-inside: avoid;
  }
}

/* =========================================================
   Deposited cheques • v9.5.0
   ========================================================= */
.deposited-cheques-content {
  display: grid;
  gap: 10px;
  padding-bottom: calc(88px + env(safe-area-inset-bottom));
}

.cheques-heading,
.cheques-account-main,
.cheques-account-identity,
.cheques-account-footer,
.cheques-summary-item,
.cheques-next-due,
.cheques-filter-header,
.cheques-filter-toggle,
.cheques-search-wrap,
.cheques-status-tabs,
.cheques-date-header,
.cheque-card-top,
.cheque-bank-identity,
.cheque-card-amount p,
.cheque-card-progress > div,
.cheque-card-footer,
.cheque-status-badge,
.cheque-detail-header,
.cheque-detail-heading,
.cheque-detail-status-row,
.cheque-detail-amount,
.cheque-detail-progress > div,
.cheque-detail-copy-row dd,
.cheques-help-note {
  display: flex;
  align-items: center;
}

.cheques-heading {
  min-width: 0;
  gap: 9px;
  padding: 3px 1px 0;
}

.cheques-back {
  display: grid;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  place-items: center;
  border: 1px solid #e5e9e8;
  border-radius: 11px;
  background: #fff;
  color: #59635f;
}

.cheques-heading-copy {
  min-width: 0;
  flex: 1 1 auto;
}

.cheques-heading-copy > span {
  display: block;
  color: #98a09d;
  font-size: 7.5px;
  font-weight: 800;
}

.cheques-heading h1 {
  margin: 1px 0 0;
  color: #1d2522;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.35;
}

.cheques-heading p {
  margin-top: 1px;
  color: #949d99;
  font-size: 7.5px;
}

.cheques-secure-badge {
  display: inline-flex;
  min-height: 24px;
  flex: 0 0 auto;
  align-items: center;
  gap: 4px;
  border: 1px solid #e2e9e6;
  border-radius: 999px;
  background: #fafcfc;
  padding: 3px 8px;
  color: #557068;
  font-size: 7px;
  font-weight: 900;
}

.cheques-account-card,
.cheques-filter-panel,
.cheques-list-panel {
  overflow: hidden;
  border: 1px solid #e3e7e6;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(20, 35, 31, .025);
}

.cheques-account-card {
  padding: 11px;
}

.cheques-account-main {
  min-width: 0;
  justify-content: space-between;
  gap: 10px;
}

.cheques-account-identity {
  min-width: 0;
  flex: 1 1 auto;
  gap: 8px;
}

.cheques-account-icon {
  display: grid;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  place-items: center;
  border: 1px solid #e1e7e5;
  border-radius: 11px;
  background: #f7f9f8;
  color: #3e625a;
}

.cheques-account-identity > div {
  min-width: 0;
}

.cheques-account-identity span,
.cheques-account-footer span,
.cheques-summary-item small,
.cheques-next-copy small,
.cheque-card-amount > span,
.cheque-card-meta span,
.cheque-card-progress span,
.cheque-detail-list dt,
.cheque-detail-description-box span {
  display: block;
  color: #969f9b;
  font-size: 7px;
  font-weight: 700;
}

.cheques-account-identity h2 {
  margin: 1px 0 0;
  overflow: hidden;
  color: #222a27;
  font-size: 10px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cheques-account-identity p {
  margin-top: 1px;
  color: #8d9692;
  font-size: 7px;
}

.cheques-account-selector {
  position: relative;
  display: grid;
  min-width: 82px;
  flex: 0 0 auto;
  gap: 1px;
  border: 1px solid #e5e9e8;
  border-radius: 10px;
  background: #fff;
  padding: 5px 8px 5px 24px;
}

.cheques-account-selector > span {
  color: #9aa19f;
  font-size: 6px;
  font-weight: 800;
}

.cheques-account-selector select {
  max-width: 94px;
  border: 0;
  outline: 0;
  background: transparent;
  color: #44504c;
  font-family: inherit;
  font-size: 7px;
  font-weight: 900;
  appearance: none;
}

.cheques-account-selector svg {
  position: absolute;
  top: 50%;
  left: 7px;
  transform: translateY(-50%);
  color: #909995;
}

.cheques-account-footer {
  justify-content: space-between;
  gap: 10px;
  margin-top: 10px;
  border-top: 1px solid #edf0ef;
  padding-top: 9px;
}

.cheques-account-footer p {
  display: flex;
  margin-top: 2px;
  align-items: baseline;
  gap: 4px;
}

.cheques-account-footer strong {
  color: #17201d;
  font-size: 15px;
  font-weight: 900;
}

.cheques-account-footer small {
  color: #8b9490;
  font-size: 7px;
}

.cheques-count-pill {
  display: inline-flex !important;
  min-height: 23px;
  align-items: center;
  border: 1px solid #e2e8e6;
  border-radius: 999px;
  background: #f9fbfa;
  padding: 3px 8px;
  color: #5e6c67 !important;
  font-size: 7px !important;
  font-weight: 900 !important;
}

.cheques-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

.cheques-summary-item {
  min-width: 0;
  align-items: flex-start;
  gap: 7px;
  border: 1px solid #e5e9e8;
  border-radius: 13px;
  background: #fff;
  padding: 9px;
}

.cheques-summary-icon {
  display: grid;
  width: 27px;
  height: 27px;
  flex: 0 0 27px;
  place-items: center;
  border: 1px solid #e2e8e6;
  border-radius: 9px;
  background: #f8faf9;
  color: #596b65;
}

.cheques-summary-item > div {
  min-width: 0;
}

.cheques-summary-item p {
  display: flex;
  min-width: 0;
  margin-top: 2px;
  align-items: baseline;
  gap: 3px;
}

.cheques-summary-item strong {
  overflow: hidden;
  color: #222a27;
  font-size: 9px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cheques-summary-item p span,
.cheques-summary-item em {
  color: #929b97;
  font-size: 6px;
  font-style: normal;
}

.cheques-summary-item em {
  display: block;
  margin-top: 2px;
}

.cheques-summary-item.is-collected .cheques-summary-icon {
  background: #f6faf8;
  color: #3f7466;
}

.cheques-summary-item.is-problem .cheques-summary-icon {
  background: #fbf8f7;
  color: #865f54;
}

.cheques-next-due {
  min-width: 0;
  gap: 8px;
  border: 1px solid #e1e7e5;
  border-radius: 14px;
  background: #f9fbfa;
  padding: 9px 10px;
}

.cheques-next-icon {
  display: grid;
  width: 31px;
  height: 31px;
  flex: 0 0 31px;
  place-items: center;
  border: 1px solid #e0e7e4;
  border-radius: 10px;
  background: #fff;
  color: #4f6d65;
}

.cheques-next-copy {
  min-width: 0;
  flex: 1 1 auto;
}

.cheques-next-copy h2 {
  margin: 1px 0 0;
  color: #2a3430;
  font-size: 9px;
  font-weight: 900;
}

.cheques-next-copy p {
  margin-top: 1px;
  overflow: hidden;
  color: #7f8985;
  font-size: 7px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cheques-filter-header {
  min-height: 49px;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 11px;
}

.cheques-filter-header h2 {
  margin: 0;
  color: #242c29;
  font-size: 10px;
  font-weight: 900;
}

.cheques-filter-header p {
  margin-top: 1px;
  color: #969e9b;
  font-size: 7px;
}

.cheques-filter-toggle {
  gap: 4px;
  border: 1px solid #e2e7e5;
  border-radius: 9px;
  background: #fff;
  padding: 6px 8px;
  color: #65716d;
  font-family: inherit;
  font-size: 7px;
  font-weight: 900;
}

.cheques-filter-form {
  border-top: 1px solid #edf0ef;
  padding: 8px 10px 0;
}

.cheques-search-wrap {
  position: relative;
  min-height: 38px;
  gap: 6px;
  border: 1px solid #e3e8e6;
  border-radius: 11px;
  background: #fafbfb;
  padding: 0 10px;
  color: #8d9793;
}

.cheques-search-wrap input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: #333d39;
  font-family: inherit;
  font-size: 8px;
}

.cheques-search-wrap input::placeholder {
  color: #a7aeab;
}

.cheques-search-wrap a {
  display: grid;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  place-items: center;
  color: #8c9591;
}

.cheques-filter-options {
  display: none;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: 7px;
}

.cheques-filter-options.is-open {
  display: grid;
}

.cheques-filter-options label {
  position: relative;
  display: grid;
  gap: 2px;
  border: 1px solid #e4e8e7;
  border-radius: 10px;
  background: #fff;
  padding: 6px 8px 6px 25px;
}

.cheques-filter-options label > span {
  color: #9aa19e;
  font-size: 6px;
  font-weight: 800;
}

.cheques-filter-options select {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: #45504c;
  font-family: inherit;
  font-size: 7px;
  font-weight: 900;
  appearance: none;
}

.cheques-filter-options label svg {
  position: absolute;
  top: 50%;
  left: 7px;
  transform: translateY(-50%);
  color: #939b98;
}

.cheques-filter-submit {
  grid-column: 1 / -1;
  min-height: 34px;
  border: 0;
  border-radius: 10px;
  background: #315f57;
  color: #fff;
  font-family: inherit;
  font-size: 8px;
  font-weight: 900;
}

.cheques-status-tabs {
  gap: 5px;
  overflow-x: auto;
  padding: 8px 10px 10px;
  scrollbar-width: none;
}

.cheques-status-tabs::-webkit-scrollbar {
  display: none;
}

.cheques-status-tabs a {
  min-height: 28px;
  flex: 0 0 auto;
  border: 1px solid #e3e8e6;
  border-radius: 999px;
  background: #fff;
  padding: 6px 10px;
  color: #747e7a;
  font-size: 7px;
  font-weight: 900;
}

.cheques-status-tabs a.is-active {
  border-color: #395f58;
  background: #395f58;
  color: #fff;
}

.cheques-list-panel {
  padding: 0 10px 10px;
}

.cheques-date-group + .cheques-date-group {
  margin-top: 5px;
}

.cheques-date-header {
  justify-content: space-between;
  gap: 10px;
  min-height: 37px;
  border-bottom: 1px solid #edf0ef;
  color: #555f5b;
  font-size: 8px;
  font-weight: 900;
}

.cheques-date-header small {
  color: #9aa29f;
  font-size: 6.5px;
  font-weight: 800;
}

.cheques-card-list {
  display: grid;
  gap: 8px;
  padding-top: 8px;
}

.cheque-card {
  display: block;
  width: 100%;
  min-width: 0;
  border: 1px solid #e3e8e6;
  border-radius: 14px;
  background: #fff;
  padding: 10px;
  color: inherit;
  font-family: inherit;
  text-align: right;
  cursor: pointer;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.cheque-card:active {
  transform: scale(.995);
}

.cheque-card-top {
  min-width: 0;
  justify-content: space-between;
  gap: 7px;
}

.cheque-bank-identity {
  min-width: 0;
  flex: 1 1 auto;
  gap: 7px;
}

.cheque-bank-icon {
  display: grid;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  place-items: center;
  border: 1px solid #e2e7e5;
  border-radius: 10px;
  background: #f7f9f8;
  color: #506a63;
}

.cheque-bank-identity > div {
  min-width: 0;
}

.cheque-bank-identity small {
  display: block;
  color: #99a19e;
  font-size: 6.5px;
}

.cheque-bank-identity h3 {
  margin: 1px 0 0;
  overflow: hidden;
  color: #252e2a;
  font-size: 9px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cheque-status-badge {
  min-height: 21px;
  flex: 0 0 auto;
  gap: 4px;
  border: 1px solid #e1e6e4;
  border-radius: 999px;
  background: #fafbfb;
  padding: 3px 7px;
  color: #67716d;
  font-size: 6.5px;
  font-weight: 900;
}

.cheque-status-badge i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  opacity: .75;
}

.cheque-status-badge.is-success {
  border-color: #dce9e4;
  background: #f7fbf9;
  color: #3f7567;
}

.cheque-status-badge.is-warning {
  border-color: #ebe5d8;
  background: #fcfaf5;
  color: #826f47;
}

.cheque-status-badge.is-danger {
  border-color: #ecdeda;
  background: #fcf8f7;
  color: #8c5b51;
}

.cheque-card-amount {
  margin-top: 9px;
  border-top: 1px solid #edf0ef;
  padding-top: 8px;
}

.cheque-card-amount p {
  margin-top: 2px;
  align-items: baseline;
  gap: 4px;
}

.cheque-card-amount strong {
  color: #17201d;
  font-size: 15px;
  font-weight: 900;
}

.cheque-card-amount small {
  color: #87918d;
  font-size: 7px;
}

.cheque-card-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin-top: 8px;
}

.cheque-card-meta > div {
  min-width: 0;
  border: 1px solid #eaedec;
  border-radius: 9px;
  background: #fafbfb;
  padding: 6px;
}

.cheque-card-meta strong {
  display: block;
  margin-top: 2px;
  overflow: hidden;
  color: #505a56;
  font-size: 7px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cheque-card-progress {
  margin-top: 8px;
}

.cheque-card-progress > div {
  justify-content: space-between;
  gap: 8px;
}

.cheque-card-progress b {
  color: #65706c;
  font-size: 6.5px;
}

.cheque-card-progress > span,
.cheque-detail-progress > span {
  display: block;
  height: 4px;
  margin-top: 5px;
  overflow: hidden;
  border-radius: 999px;
  background: #e9edeb;
}

.cheque-card-progress > span i,
.cheque-detail-progress > span i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #557970;
}

.cheque-card-footer {
  justify-content: space-between;
  gap: 8px;
  margin-top: 8px;
  border-top: 1px solid #edf0ef;
  padding-top: 7px;
}

.cheque-card-footer > span {
  overflow: hidden;
  color: #9aa19e;
  font-size: 6px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cheque-card-footer b {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 2px;
  color: #546b65;
  font-size: 6.5px;
  font-weight: 900;
}

.cheques-empty {
  display: grid;
  justify-items: center;
  padding: 35px 15px;
  text-align: center;
}

.cheques-empty > span {
  display: grid;
  width: 45px;
  height: 45px;
  place-items: center;
  border: 1px solid #e2e7e5;
  border-radius: 14px;
  background: #f8faf9;
  color: #68746f;
}

.cheques-empty h2 {
  margin: 9px 0 0;
  color: #303936;
  font-size: 10px;
  font-weight: 900;
}

.cheques-empty p {
  margin-top: 3px;
  color: #969e9b;
  font-size: 7px;
}

.cheques-empty a {
  margin-top: 10px;
  border: 1px solid #dfe5e3;
  border-radius: 9px;
  padding: 6px 9px;
  color: #536b64;
  font-size: 7px;
  font-weight: 900;
}

.cheques-help-note {
  align-items: flex-start;
  gap: 7px;
  border: 1px solid #e5e9e7;
  border-radius: 12px;
  background: #fafbfb;
  padding: 8px 9px;
  color: #727d78;
}

.cheques-help-note svg {
  flex: 0 0 auto;
  margin-top: 1px;
}

.cheques-help-note p {
  font-size: 7px;
  line-height: 1.8;
}

.cheque-modal-open {
  overflow: hidden !important;
}

.cheque-detail-modal {
  position: fixed;
  inset: 0;
  z-index: 9500;
  display: grid;
  visibility: hidden;
  align-items: end;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease, visibility .2s ease;
}

.cheque-detail-modal.is-open {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.cheque-detail-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  background: rgba(12, 22, 19, .5);
  backdrop-filter: blur(4px);
}

.cheque-detail-sheet {
  position: relative;
  width: min(100%, 470px);
  max-height: min(88dvh, 760px);
  margin-inline: auto;
  overflow-y: auto;
  border: 1px solid #dfe5e3;
  border-radius: 22px 22px 0 0;
  background: #fff;
  padding: 15px 14px max(16px, env(safe-area-inset-bottom));
  box-shadow: 0 -18px 60px rgba(11, 26, 21, .18);
  transform: translateY(24px);
  transition: transform .24s ease;
}

.cheque-detail-modal.is-open .cheque-detail-sheet {
  transform: translateY(0);
}

.cheque-detail-header {
  justify-content: space-between;
  gap: 10px;
}

.cheque-detail-heading {
  min-width: 0;
  gap: 8px;
}

.cheque-detail-icon {
  display: grid;
  width: 35px;
  height: 35px;
  flex: 0 0 35px;
  place-items: center;
  border: 1px solid #e1e7e5;
  border-radius: 11px;
  background: #f7f9f8;
  color: #4c675f;
}

.cheque-detail-heading small {
  display: block;
  color: #99a19e;
  font-size: 6.5px;
}

.cheque-detail-heading h2 {
  margin: 1px 0 0;
  color: #222b27;
  font-size: 10px;
  font-weight: 900;
}

.cheque-detail-header > button {
  display: grid;
  width: 31px;
  height: 31px;
  place-items: center;
  border: 1px solid #e3e7e6;
  border-radius: 10px;
  background: #fff;
  color: #69736f;
}

.cheque-detail-status-row {
  justify-content: space-between;
  gap: 10px;
  margin-top: 12px;
  border-top: 1px solid #edf0ef;
  padding-top: 11px;
}

.cheque-detail-amount {
  align-items: baseline;
  gap: 4px;
}

.cheque-detail-amount span {
  color: #17201d;
  font-size: 18px;
  font-weight: 900;
}

.cheque-detail-amount small {
  color: #858f8b;
  font-size: 7px;
}

.cheque-detail-status-description {
  margin-top: 7px;
  border: 1px solid #e7ebe9;
  border-radius: 10px;
  background: #fafbfb;
  padding: 7px 8px;
  color: #707a76;
  font-size: 7px;
  line-height: 1.75;
}

.cheque-detail-progress {
  margin-top: 10px;
}

.cheque-detail-progress > div {
  justify-content: space-between;
  gap: 10px;
  color: #818a86;
  font-size: 7px;
}

.cheque-detail-progress b {
  color: #55635e;
}

.cheque-detail-list {
  display: grid;
  margin: 11px 0 0;
  border: 1px solid #e4e8e7;
  border-radius: 13px;
  overflow: hidden;
}

.cheque-detail-list > div {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-height: 39px;
  padding: 7px 9px;
}

.cheque-detail-list > div + div {
  border-top: 1px solid #edf0ef;
}

.cheque-detail-list dd {
  min-width: 0;
  margin: 0;
  color: #46504c;
  font-size: 7px;
  font-weight: 800;
  text-align: left;
  word-break: break-word;
}

.cheque-detail-list dd small {
  display: block;
  margin-top: 1px;
  color: #98a09d;
  font-size: 6px;
  font-weight: 700;
}

.cheque-detail-copy-row dd {
  justify-content: flex-end;
  gap: 6px;
}

.cheque-detail-copy-row button {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  border: 1px solid #e2e7e5;
  border-radius: 8px;
  background: #fff;
  padding: 4px 6px;
  color: #5d6d67;
  font-family: inherit;
  font-size: 6px;
  font-weight: 900;
}

.cheque-detail-description-box {
  margin-top: 9px;
  border: 1px solid #e5e9e8;
  border-radius: 11px;
  background: #fafbfb;
  padding: 8px 9px;
}

.cheque-detail-description-box p {
  margin-top: 3px;
  color: #57615d;
  font-size: 7px;
  line-height: 1.7;
}

.cheque-detail-close {
  width: 100%;
  min-height: 39px;
  margin-top: 10px;
  border: 0;
  border-radius: 11px;
  background: #315f57;
  color: #fff;
  font-family: inherit;
  font-size: 8px;
  font-weight: 900;
}

@media (min-width: 700px) {
  .cheques-card-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cheques-filter-options {
    grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
  }

  .cheques-filter-options.is-open {
    display: grid;
  }

  .cheques-filter-submit {
    grid-column: auto;
    min-width: 110px;
  }
}

@media (max-width: 430px) {
  .cheques-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cheques-summary-item.is-problem {
    grid-column: 1 / -1;
  }

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

  .cheque-card-meta > div:last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 350px) {
  .cheques-secure-badge {
    display: none;
  }

  .cheques-account-main {
    align-items: flex-start;
  }

  .cheques-account-selector {
    min-width: 72px;
  }

  .cheque-detail-list > div {
    grid-template-columns: 75px minmax(0, 1fr);
  }
}

@media (prefers-reduced-motion: reduce) {
  .cheque-card,
  .cheque-detail-modal,
  .cheque-detail-sheet {
    transition: none;
  }
}

/* ========================================================================== 
   Deposited cheques table • v9.5.1
   ========================================================================== */
.deposited-cheques-table-page .cheques-summary-compact {
  margin-bottom: 12px;
}

.deposited-cheques-table-page .cheques-filter-panel {
  margin-bottom: 12px;
}

.cheques-table-panel {
  overflow: hidden;
  margin-top: 12px;
  border: 1px solid #e5e9e8;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 35, 33, 0.045);
}

.cheques-table-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 72px;
  padding: 14px 16px;
  border-bottom: 1px solid #edf0ef;
  background: #fff;
}

.cheques-table-toolbar > div:first-child {
  min-width: 0;
}

.cheques-table-kicker {
  display: block;
  margin-bottom: 3px;
  color: #8a9693;
  font-size: 10px;
  font-weight: 700;
}

.cheques-table-toolbar h2 {
  margin: 0;
  color: #142522;
  font-size: 15px;
  font-weight: 900;
}

.cheques-current-sort {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid #e1e7e5;
  border-radius: 10px;
  background: #f8faf9;
  color: #53625f;
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}

.cheques-current-sort svg {
  width: 14px;
  height: 14px;
  color: #71807d;
}

.cheques-table-mobile-hint {
  display: none;
  align-items: center;
  gap: 6px;
  padding: 9px 13px;
  border-bottom: 1px solid #edf0ef;
  background: #fafbfb;
  color: #76837f;
  font-size: 10px;
  font-weight: 700;
}

.cheques-table-mobile-hint svg {
  width: 14px;
  height: 14px;
}

.cheques-table-scroll {
  width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #ccd5d2 transparent;
}

.cheques-table-scroll::-webkit-scrollbar {
  height: 5px;
}

.cheques-table-scroll::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: #ccd5d2;
}

.cheques-data-table {
  width: 100%;
  min-width: 1060px;
  border-spacing: 0;
  border-collapse: separate;
  table-layout: auto;
  color: #24332f;
  font-size: 11px;
}

.cheques-data-table th,
.cheques-data-table td {
  padding: 12px 13px;
  border-bottom: 1px solid #edf0ef;
  text-align: right;
  vertical-align: middle;
  white-space: nowrap;
}

.cheques-data-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  height: 44px;
  padding-top: 9px;
  padding-bottom: 9px;
  background: #f7f9f8;
  color: #66736f;
  font-size: 10px;
  font-weight: 900;
}

.cheques-data-table tbody tr:last-child td {
  border-bottom: 0;
}

.cheques-table-row {
  outline: none;
  cursor: pointer;
  transition: background-color 150ms ease, box-shadow 150ms ease;
}

.cheques-table-row:nth-child(even) td {
  background: #fcfdfd;
}

.cheques-table-row:hover td,
.cheques-table-row:focus-visible td {
  background: #f4f8f7;
}

.cheques-table-row:focus-visible td:first-child {
  box-shadow: inset -3px 0 #54736c;
}

.cheques-table-row.is-status-registered td:first-child {
  border-right: 3px solid #60a5fa;
}

.cheques-table-row.is-status-processing td:first-child {
  border-right: 3px solid #f59e0b;
}

.cheques-table-row.is-status-success td:first-child {
  border-right: 3px solid #10b981;
}

.cheques-table-row.is-status-returned td:first-child {
  border-right: 3px solid #a78bfa;
}

.cheques-table-row.is-status-danger td:first-child {
  border-right: 3px solid #ef4444;
}

.cheques-col-index {
  width: 54px;
  text-align: center !important;
}

.cheques-col-action {
  width: 64px;
  text-align: center !important;
}

.cheques-row-number {
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border: 1px solid #e1e7e5;
  border-radius: 8px;
  background: #fff;
  color: #66736f;
  font-size: 10px;
  font-weight: 900;
}

.cheques-sort-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: inherit;
  text-decoration: none;
}

.cheques-sort-link.is-active {
  color: #173f39;
}

.cheques-sort-icon {
  display: inline-flex;
  opacity: 0.28;
  transition: transform 160ms ease, opacity 160ms ease;
}

.cheques-sort-icon svg {
  width: 13px;
  height: 13px;
}

.cheques-sort-link.is-active .cheques-sort-icon {
  opacity: 1;
}

.cheques-sort-link.is-active .cheques-sort-icon:not(.is-desc) {
  transform: rotate(180deg);
}

.cheques-sort-link.is-active .cheques-sort-icon.is-desc {
  transform: rotate(0deg);
}

.cheques-date-value,
.cheques-deposit-date,
.cheques-serial-cell {
  color: #354540;
  font-size: 11px;
  font-weight: 850;
}

.cheques-amount-cell,
.cheques-bank-cell {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.cheques-amount-cell strong {
  color: #132824;
  font-size: 12px;
  font-weight: 950;
}

.cheques-amount-cell small,
.cheques-bank-cell small {
  color: #8a9693;
  font-size: 9px;
  font-weight: 700;
}

.cheques-bank-cell strong,
.cheques-issuer-cell {
  color: #263a35;
  font-size: 11px;
  font-weight: 900;
}

.cheques-row-action {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 1px solid #dfe6e4;
  border-radius: 9px;
  background: #fff;
  color: #4f6862;
  cursor: pointer;
  transition: border-color 150ms ease, background-color 150ms ease, color 150ms ease;
}

.cheques-row-action:hover,
.cheques-row-action:focus-visible {
  border-color: #b9c9c5;
  background: #edf5f3;
  color: #153f38;
  outline: none;
}

.cheques-row-action svg {
  width: 14px;
  height: 14px;
}

.cheque-status-badge {
  min-width: 92px;
  justify-content: center;
  border: 1px solid transparent;
  font-weight: 900;
  white-space: nowrap;
}

.cheque-status-badge.is-registered {
  border-color: #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
}

.cheque-status-badge.is-registered i {
  background: #3b82f6;
}

.cheque-status-badge.is-processing {
  border-color: #fed7aa;
  background: #fff7ed;
  color: #c2410c;
}

.cheque-status-badge.is-processing i {
  background: #f59e0b;
}

.cheque-status-badge.is-success {
  border-color: #a7f3d0;
  background: #ecfdf5;
  color: #047857;
}

.cheque-status-badge.is-success i {
  background: #10b981;
}

.cheque-status-badge.is-returned {
  border-color: #e9d5ff;
  background: #faf5ff;
  color: #7e22ce;
}

.cheque-status-badge.is-returned i {
  background: #a855f7;
}

.cheque-status-badge.is-danger {
  border-color: #fecaca;
  background: #fef2f2;
  color: #b91c1c;
}

.cheque-status-badge.is-danger i {
  background: #ef4444;
}

.cheques-table-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 46px;
  padding: 10px 14px;
  border-top: 1px solid #edf0ef;
  background: #fafbfb;
  color: #7c8985;
  font-size: 9px;
  font-weight: 750;
}

@media (max-width: 720px) {
  .cheques-table-toolbar {
    min-height: 64px;
    padding: 12px 13px;
  }

  .cheques-current-sort {
    max-width: 165px;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .cheques-table-mobile-hint {
    display: flex;
  }

  .cheques-data-table {
    min-width: 1020px;
  }

  .cheques-data-table th,
  .cheques-data-table td {
    padding: 11px 12px;
  }

  .cheques-table-footer {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
  }
}

@media (max-width: 420px) {
  .cheques-current-sort {
    max-width: 145px;
    padding-inline: 8px;
  }

  .cheques-summary-compact {
    grid-template-columns: 1fr 1fr;
  }

  .cheques-summary-compact .cheques-summary-item.is-problem {
    grid-column: 1 / -1;
  }
}

/* ========================================================================
   Soft Color System • release 9.6.0
   Colorful icons, restrained accents, no gradients, no visual clutter
   ======================================================================== */
:root {
  --app-mint: #20867d;
  --app-mint-soft: #eaf7f4;
  --app-mint-line: #cce9e3;
  --app-sky: #397fbd;
  --app-sky-soft: #edf6fd;
  --app-sky-line: #d4e8f8;
  --app-violet: #7357b5;
  --app-violet-soft: #f3effb;
  --app-violet-line: #e3d9f5;
  --app-amber: #a96c12;
  --app-amber-soft: #fff7e8;
  --app-amber-line: #f2dfb8;
  --app-rose: #b84d6b;
  --app-rose-soft: #fff0f4;
  --app-rose-line: #f1d5de;
  --app-orange: #ae642a;
  --app-orange-soft: #fff3e9;
  --app-orange-line: #f0dbc8;
  --app-indigo: #4f66b3;
  --app-indigo-soft: #eff2fc;
  --app-indigo-line: #d9e0f5;
  --app-surface: #f6f8fa;
}

html,
body,
.app-body {
  background: var(--app-surface);
}

.app-header {
  border-bottom: 1px solid #e8edef;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 5px 18px rgba(35, 55, 65, .035);
}

.brand-mark-sm {
  border: 1px solid var(--app-mint-line);
  background: var(--app-mint-soft);
  color: var(--app-mint);
}

.app-header-actions .icon-button:first-child {
  border-color: var(--app-sky-line);
  background: var(--app-sky-soft);
  color: var(--app-sky);
}

.app-header-actions .icon-button:last-child {
  border-color: var(--app-rose-line);
  background: var(--app-rose-soft);
  color: var(--app-rose);
}

.panel,
.quick-services,
.profile-card,
.selected-account-card,
.account-service-list-panel,
.statement-account-card,
.statement-filter-panel,
.statement-list-panel,
.cheques-account-card,
.cheques-filter-panel,
.cheques-table-panel,
.withdrawal-form-card,
.withdrawal-summary-card {
  box-shadow: 0 8px 24px rgba(32, 50, 62, .045);
}

/* Dashboard: liquidity */
.dashboard-page .liquidity-card {
  border-color: #dce9e7;
  box-shadow: 0 10px 28px rgba(32, 79, 73, .07);
}

.dashboard-page .liquidity-card::before {
  height: 3px;
  background: var(--app-mint);
  opacity: 1;
}

.liquidity-heading-icon {
  border-color: var(--app-mint-line) !important;
  background: var(--app-mint-soft) !important;
  color: var(--app-mint) !important;
}

.dashboard-page .liquidity-card .balance-stat:nth-child(1) {
  border-color: var(--app-violet-line);
  background: var(--app-violet-soft);
}
.dashboard-page .liquidity-card .balance-stat:nth-child(1) span,
.dashboard-page .liquidity-card .balance-stat:nth-child(1) strong { color: var(--app-violet); }

.dashboard-page .liquidity-card .balance-stat:nth-child(2) {
  border-color: var(--app-amber-line);
  background: var(--app-amber-soft);
}
.dashboard-page .liquidity-card .balance-stat:nth-child(2) span,
.dashboard-page .liquidity-card .balance-stat:nth-child(2) strong { color: var(--app-amber); }

.dashboard-page .liquidity-card .balance-stat:nth-child(3) {
  border-color: var(--app-mint-line);
  background: var(--app-mint-soft);
}
.dashboard-page .liquidity-card .balance-stat:nth-child(3) span,
.dashboard-page .liquidity-card .balance-stat:nth-child(3) strong { color: var(--app-mint); }

/* Dashboard: quick actions */
.dashboard-page .quick-services .quick-action {
  background: #fff;
  box-shadow: 0 2px 8px rgba(31, 47, 57, .025);
}
.dashboard-page .quick-services .quick-action:hover { background: #fff; }

.dashboard-page .quick-action-withdraw { border-color: var(--app-rose-line); }
.dashboard-page .quick-action-withdraw .quick-action-icon { border-color: var(--app-rose-line); background: var(--app-rose-soft); color: var(--app-rose); }
.dashboard-page .quick-action-transfer { border-color: var(--app-sky-line); }
.dashboard-page .quick-action-transfer .quick-action-icon { border-color: var(--app-sky-line); background: var(--app-sky-soft); color: var(--app-sky); }
.dashboard-page .quick-action-loans { border-color: var(--app-amber-line); }
.dashboard-page .quick-action-loans .quick-action-icon { border-color: var(--app-amber-line); background: var(--app-amber-soft); color: var(--app-amber); }
.dashboard-page .quick-action-statement { border-color: var(--app-violet-line); }
.dashboard-page .quick-action-statement .quick-action-icon { border-color: var(--app-violet-line); background: var(--app-violet-soft); color: var(--app-violet); }

.dashboard-page .quick-action-withdraw .quick-action-chevron { color: var(--app-rose); }
.dashboard-page .quick-action-transfer .quick-action-chevron { color: var(--app-sky); }
.dashboard-page .quick-action-loans .quick-action-chevron { color: var(--app-amber); }
.dashboard-page .quick-action-statement .quick-action-chevron { color: var(--app-violet); }

/* Dashboard: accounts */
.accounts-heading-icon {
  border-color: var(--app-mint-line);
  background: var(--app-mint-soft);
  color: var(--app-mint);
}

.accounts-panel .account-card {
  border-color: #e3e9ec;
  box-shadow: inset 0 3px 0 transparent, 0 3px 12px rgba(27, 43, 53, .035);
}
.accounts-panel .account-card--emerald { box-shadow: inset 0 3px 0 #38a88e, 0 3px 12px rgba(27, 43, 53, .035); }
.accounts-panel .account-card--violet { box-shadow: inset 0 3px 0 #866dc2, 0 3px 12px rgba(27, 43, 53, .035); }
.accounts-panel .account-card--sky { box-shadow: inset 0 3px 0 #4c96cf, 0 3px 12px rgba(27, 43, 53, .035); }

.accounts-panel .account-card--emerald .account-card-icon { border-color: var(--app-mint-line); background: var(--app-mint-soft); color: var(--app-mint); }
.accounts-panel .account-card--violet .account-card-icon { border-color: var(--app-violet-line); background: var(--app-violet-soft); color: var(--app-violet); }
.accounts-panel .account-card--sky .account-card-icon { border-color: var(--app-sky-line); background: var(--app-sky-soft); color: var(--app-sky); }

.accounts-panel .account-card--emerald .account-type-pill { border-color: var(--app-mint-line); background: var(--app-mint-soft); color: var(--app-mint); }
.accounts-panel .account-card--violet .account-type-pill { border-color: var(--app-violet-line); background: var(--app-violet-soft); color: var(--app-violet); }
.accounts-panel .account-card--sky .account-type-pill { border-color: var(--app-sky-line); background: var(--app-sky-soft); color: var(--app-sky); }

/* Dashboard: loans */
.loans-panel-icon-v2 {
  border-color: var(--app-violet-line) !important;
  background: var(--app-violet-soft) !important;
  color: var(--app-violet) !important;
}

.active-loan-card-v2:nth-child(odd) {
  border-color: var(--app-violet-line);
  box-shadow: inset 0 3px 0 #856bc0, 0 4px 14px rgba(42, 37, 63, .035);
}
.active-loan-card-v2:nth-child(even) {
  border-color: var(--app-sky-line);
  box-shadow: inset 0 3px 0 #4a94ca, 0 4px 14px rgba(34, 58, 73, .035);
}
.active-loan-card-v2:nth-child(odd) .active-loan-icon-v2,
.active-loan-card-v2:nth-child(odd) .active-loan-due-icon-v2 {
  border-color: var(--app-violet-line);
  background: var(--app-violet-soft);
  color: var(--app-violet);
}
.active-loan-card-v2:nth-child(even) .active-loan-icon-v2,
.active-loan-card-v2:nth-child(even) .active-loan-due-icon-v2 {
  border-color: var(--app-sky-line);
  background: var(--app-sky-soft);
  color: var(--app-sky);
}
.active-loan-card-v2:nth-child(odd) .active-loan-progress-v2 i { background: var(--app-violet); }
.active-loan-card-v2:nth-child(even) .active-loan-progress-v2 i { background: var(--app-sky); }

.profile-avatar {
  border: 1px solid var(--app-violet-line);
  background: var(--app-violet-soft);
  color: var(--app-violet);
}
.profile-score {
  border: 1px solid var(--app-amber-line);
  border-radius: 11px;
  background: var(--app-amber-soft);
  padding: 5px 8px;
}
.profile-score strong { color: var(--app-amber); }

/* Bottom navigation: each destination gets a soft identity color */
.bottom-nav-item:nth-child(1) .bottom-nav-icon { color: var(--app-mint); }
.bottom-nav-item:nth-child(2) .bottom-nav-icon { color: var(--app-sky); }
.bottom-nav-item:nth-child(3) .bottom-nav-icon { color: var(--app-rose); }
.bottom-nav-item:nth-child(4) .bottom-nav-icon { color: var(--app-amber); }
.bottom-nav-item:nth-child(5) .bottom-nav-icon { color: var(--app-violet); }
.bottom-nav-item:nth-child(1).is-active .bottom-nav-icon { background: var(--app-mint-soft); }
.bottom-nav-item:nth-child(2).is-active .bottom-nav-icon { background: var(--app-sky-soft); }
.bottom-nav-item:nth-child(3).is-active .bottom-nav-icon { background: var(--app-rose-soft); }
.bottom-nav-item:nth-child(4).is-active .bottom-nav-icon { background: var(--app-amber-soft); }
.bottom-nav-item:nth-child(5).is-active .bottom-nav-icon { background: var(--app-violet-soft); }
.bottom-nav-item:nth-child(1).is-active { color: var(--app-mint); }
.bottom-nav-item:nth-child(2).is-active { color: var(--app-sky); }
.bottom-nav-item:nth-child(3).is-active { color: var(--app-rose); }
.bottom-nav-item:nth-child(4).is-active { color: var(--app-amber); }
.bottom-nav-item:nth-child(5).is-active { color: var(--app-violet); }

/* Account services */
.selected-account-card {
  box-shadow: inset 0 3px 0 var(--app-mint), 0 8px 24px rgba(32, 50, 62, .045);
}
.selected-account-card.account-tone-violet { box-shadow: inset 0 3px 0 #856bc0, 0 8px 24px rgba(32, 50, 62, .045); }
.selected-account-card.account-tone-sky { box-shadow: inset 0 3px 0 #4a94ca, 0 8px 24px rgba(32, 50, 62, .045); }

.account-service-item-icon { transition: transform .18s ease, background-color .18s ease; }
.account-service-item:active .account-service-item-icon { transform: scale(.94); }
.account-service-item.service-statement .account-service-item-icon { border-color: var(--app-sky-line); background: var(--app-sky-soft); color: var(--app-sky); }
.account-service-item.service-deposit .account-service-item-icon { border-color: var(--app-mint-line); background: var(--app-mint-soft); color: var(--app-mint); }
.account-service-item.service-cheque .account-service-item-icon { border-color: var(--app-amber-line); background: var(--app-amber-soft); color: var(--app-amber); }
.account-service-item.service-withdraw .account-service-item-icon { border-color: var(--app-rose-line); background: var(--app-rose-soft); color: var(--app-rose); }
.account-service-item.service-iban .account-service-item-icon { border-color: var(--app-violet-line); background: var(--app-violet-soft); color: var(--app-violet); }
.account-service-item.service-transfer .account-service-item-icon { border-color: var(--app-indigo-line); background: var(--app-indigo-soft); color: var(--app-indigo); }
.account-service-item.service-bill .account-service-item-icon { border-color: var(--app-orange-line); background: var(--app-orange-soft); color: var(--app-orange); }
.account-service-item.service-mobile .account-service-item-icon { border-color: var(--app-rose-line); background: var(--app-rose-soft); color: #aa527f; }

.account-service-item.service-statement .account-service-chevron { color: var(--app-sky); }
.account-service-item.service-cheque .account-service-chevron { color: var(--app-amber); }
.account-service-item.service-withdraw .account-service-chevron { color: var(--app-rose); }

/* Statement */
.statement-account-icon {
  border-color: var(--app-sky-line) !important;
  background: var(--app-sky-soft) !important;
  color: var(--app-sky) !important;
}
.statement-summary-item:nth-child(3) .statement-summary-icon {
  border-color: var(--app-violet-line);
  background: var(--app-violet-soft);
  color: var(--app-violet);
}
.statement-print-button {
  border-color: var(--app-violet-line);
  background: var(--app-violet-soft);
  color: var(--app-violet);
}

/* Deposited cheques */
.cheques-account-icon {
  border-color: var(--app-amber-line) !important;
  background: var(--app-amber-soft) !important;
  color: var(--app-amber) !important;
}
.cheques-next-due {
  border-color: var(--app-amber-line);
  background: #fffdf8;
}
.cheques-next-icon {
  border-color: var(--app-amber-line) !important;
  background: var(--app-amber-soft) !important;
  color: var(--app-amber) !important;
}
.cheques-data-table thead th {
  background: #f2f7fa;
  color: #415865;
}
.cheques-row-action {
  border-color: var(--app-violet-line);
  background: var(--app-violet-soft);
  color: var(--app-violet);
}
.cheques-current-sort {
  border-color: var(--app-sky-line);
  background: var(--app-sky-soft);
  color: var(--app-sky);
}
.cheques-table-kicker { color: var(--app-sky); }

/* Withdrawal */
.withdrawal-back-button {
  border-color: var(--app-mint-line);
  background: var(--app-mint-soft);
  color: var(--app-mint);
}
.withdrawal-step-badge {
  border-color: var(--app-violet-line);
  background: var(--app-violet-soft);
  color: var(--app-violet);
}
.withdrawal-form-card:nth-child(1) { box-shadow: inset 0 3px 0 var(--app-violet), 0 8px 24px rgba(32, 50, 62, .045); }
.withdrawal-summary-card { box-shadow: inset 0 3px 0 var(--app-mint), 0 8px 24px rgba(32, 50, 62, .045); }
.withdrawal-submit-button {
  border-color: #236d66;
  background: #236d66;
  box-shadow: 0 8px 20px rgba(35, 109, 102, .18);
}
.withdrawal-input-wrap > span,
.withdrawal-select-wrap > span {
  border-radius: 9px;
  background: var(--app-sky-soft);
  color: var(--app-sky);
}
.withdrawal-field:nth-of-type(3) .withdrawal-input-wrap > span { background: var(--app-violet-soft); color: var(--app-violet); }
.withdrawal-field:nth-of-type(4) .withdrawal-input-wrap > span { background: var(--app-rose-soft); color: var(--app-rose); }

/* Update center */
.app-update-sheet,
.updater-install-dialog-v2 {
  box-shadow: inset 0 3px 0 var(--app-mint), 0 18px 60px rgba(15, 31, 37, .18);
}

@media (hover: hover) {
  .account-service-item:hover { background: #fbfcfd; }
  .account-service-item:hover .account-service-item-icon { transform: translateY(-1px); }
}

@media (prefers-reduced-motion: reduce) {
  .account-service-item-icon { transition: none; }
}

/* ========================================================================== 
   Courier pickup request — v9.7.1
   ========================================================================== */
.dashboard-page .quick-action-pickup {
  grid-column: 1 / -1;
  min-height: 66px;
  border-color: #d5e5df;
  background: #fff;
  box-shadow: inset 3px 0 0 #2f9b7c, 0 4px 14px rgba(27, 72, 61, .05);
}
.dashboard-page .quick-action-pickup .quick-action-icon {
  border-color: #cce8dc;
  background: #eaf8f2;
  color: #278a6e;
}
.dashboard-page .quick-action-pickup .quick-action-chevron { color: #278a6e; }
.quick-action-new-badge {
  display: inline-flex;
  min-height: 18px;
  align-items: center;
  margin-inline-start: 5px;
  padding: 0 6px;
  border: 1px solid #cce8dc;
  border-radius: 999px;
  background: #eaf8f2;
  color: #278a6e;
  font-size: 6px;
  font-weight: 900;
  vertical-align: middle;
}

.pickup-page { background: #f4f7f6; }
.pickup-page-content {
  width: min(1120px, 100%);
  margin-inline: auto;
  padding-top: 12px;
}
.pickup-page-heading {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 48px;
  align-items: center;
  gap: 12px;
  margin-bottom: 11px;
  padding: 13px;
  border: 1px solid #e0e8e5;
  border-radius: 19px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(32, 50, 62, .045);
}
.pickup-back-button,
.pickup-heading-icon {
  display: grid;
  place-items: center;
  border-radius: 13px;
}
.pickup-back-button {
  width: 40px;
  height: 40px;
  border: 1px solid var(--app-sky-line);
  background: var(--app-sky-soft);
  color: var(--app-sky);
}
.pickup-heading-icon {
  width: 48px;
  height: 48px;
  border: 1px solid var(--app-mint-line);
  background: var(--app-mint-soft);
  color: var(--app-mint);
}
.pickup-heading-kicker {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #679187;
  font-size: 7px;
  font-weight: 850;
}
.pickup-heading-kicker i {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #39a687;
  box-shadow: 0 0 0 4px rgba(57, 166, 135, .09);
}
.pickup-page-heading h1 {
  margin-top: 3px;
  color: #1e3430;
  font-size: 15px;
  font-weight: 950;
}
.pickup-page-heading p {
  margin-top: 3px;
  color: #8a9995;
  font-size: 8px;
  line-height: 1.7;
}
.pickup-alert,
.pickup-client-error {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  padding: 10px 12px;
  border: 1px solid #f1c8cb;
  border-radius: 13px;
  background: #fff6f6;
  color: #a34c55;
  font-size: 8px;
  font-weight: 800;
}
.pickup-client-error > span {
  display: grid;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  place-items: center;
  border-radius: 8px;
  background: #fbe3e5;
  font-size: 11px;
  font-weight: 950;
}
.pickup-form { display: grid; gap: 10px; }
.pickup-form-columns {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(310px, .65fr);
  align-items: start;
  gap: 10px;
}
.pickup-side-column { display: grid; gap: 10px; }
.pickup-section,
.pickup-history-panel,
.pickup-success-card {
  border: 1px solid #e0e7e5;
  border-radius: 19px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(32, 50, 62, .045);
}
.pickup-section { padding: 13px; }
.pickup-service-section { box-shadow: inset 0 3px 0 #7b70c3, 0 8px 24px rgba(32, 50, 62, .045); }
.pickup-location-section { box-shadow: inset 0 3px 0 #3f96c9, 0 8px 24px rgba(32, 50, 62, .045); }
.pickup-final-section { box-shadow: inset 0 3px 0 #2f9b7c, 0 8px 24px rgba(32, 50, 62, .045); }
.pickup-section-header {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin-bottom: 11px;
}
.pickup-step {
  display: grid;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  place-items: center;
  border: 1px solid #d9e7e3;
  border-radius: 10px;
  background: #f2f8f6;
  color: #3c7e6e;
  font-size: 9px;
  font-weight: 950;
}
.pickup-section-header h2 {
  margin: 0;
  color: #263b37;
  font-size: 11px;
  font-weight: 950;
}
.pickup-section-header p {
  margin-top: 2px;
  color: #94a19e;
  font-size: 7px;
  line-height: 1.6;
}
.pickup-service-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}
.pickup-service-card {
  position: relative;
  display: flex;
  min-height: 95px;
  cursor: pointer;
  flex-direction: column;
  align-items: flex-start;
  gap: 7px;
  padding: 10px;
  overflow: hidden;
  border: 1px solid #e3e9e8;
  border-radius: 14px;
  background: #fff;
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.pickup-service-card::after {
  position: absolute;
  inset-inline: 10px;
  bottom: 0;
  height: 3px;
  border-radius: 999px 999px 0 0;
  background: var(--pickup-tone, #7c8c89);
  content: '';
  opacity: .9;
}
.pickup-service-card:hover { transform: translateY(-1px); box-shadow: 0 6px 17px rgba(28, 47, 58, .055); }
.pickup-service-card input,
.pickup-urgency input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.pickup-service-card:has(input:checked) {
  border-color: var(--pickup-tone, #2f9b7c);
  background: color-mix(in srgb, var(--pickup-soft, #f2f8f6) 78%, white);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--pickup-tone, #2f9b7c) 10%, transparent);
}
.pickup-service-check {
  position: absolute;
  top: 8px;
  inset-inline-end: 8px;
  display: grid;
  width: 19px;
  height: 19px;
  place-items: center;
  border: 1px solid #dde5e3;
  border-radius: 7px;
  background: #fff;
  color: transparent;
}
.pickup-service-card:has(input:checked) .pickup-service-check {
  border-color: var(--pickup-tone);
  background: var(--pickup-tone);
  color: #fff;
}
.pickup-service-icon,
.pickup-history-service {
  display: grid;
  place-items: center;
  border: 1px solid var(--pickup-line, #dce5e3);
  background: var(--pickup-soft, #f2f6f5);
  color: var(--pickup-tone, #657c77);
}
.pickup-service-icon {
  width: 34px;
  height: 34px;
  border-radius: 11px;
}
.pickup-service-copy { display: block; min-width: 0; }
.pickup-service-copy strong {
  display: block;
  color: #263936;
  font-size: 8.5px;
  font-weight: 950;
  line-height: 1.55;
}
.pickup-service-copy small {
  display: block;
  margin-top: 3px;
  color: #8e9b98;
  font-size: 6.5px;
  font-weight: 600;
  line-height: 1.65;
}
.pickup-tone-rose { --pickup-tone: #c35b72; --pickup-soft: #fff0f3; --pickup-line: #f0cbd3; }
.pickup-tone-sky { --pickup-tone: #408fbd; --pickup-soft: #eef8ff; --pickup-line: #cae4f3; }
.pickup-tone-violet { --pickup-tone: #7e68bd; --pickup-soft: #f5f1ff; --pickup-line: #ded4f3; }
.pickup-tone-amber { --pickup-tone: #b67b27; --pickup-soft: #fff8e9; --pickup-line: #efddba; }
.pickup-tone-mint { --pickup-tone: #2f9276; --pickup-soft: #ecf9f4; --pickup-line: #cae9dd; }
.pickup-tone-indigo { --pickup-tone: #5e6fb5; --pickup-soft: #f0f3ff; --pickup-line: #d3daf2; }
.pickup-tone-teal { --pickup-tone: #2d8989; --pickup-soft: #eefaFA; --pickup-line: #c7e8e8; }
.pickup-tone-slate { --pickup-tone: #667a83; --pickup-soft: #f2f5f6; --pickup-line: #dce4e7; }

.pickup-map-shell {
  overflow: hidden;
  border: 1px solid #dce5e3;
  border-radius: 16px;
  background: #f4f7f7;
}
.pickup-map {
  position: relative;
  height: 360px;
  overflow: hidden;
  cursor: grab;
  background: #e9efed;
  touch-action: none;
  isolation: isolate;
}
.pickup-map.is-dragging { cursor: grabbing; }
.pickup-map-tiles {
  position: absolute;
  inset: 0;
  z-index: 1;
  will-change: transform;
}
.pickup-map-tiles img {
  position: absolute;
  width: 256px;
  height: 256px;
  max-width: none;
  user-select: none;
  -webkit-user-drag: none;
}
.pickup-map-tiles img.is-error { opacity: 0; }
.pickup-map-grid {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 32px 32px;
  box-shadow: inset 0 0 50px rgba(22, 60, 51, .08);
}
.pickup-map-pin {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 6;
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  transform: translate(-50%, -95%);
  border: 4px solid rgba(255,255,255,.94);
  border-radius: 18px 18px 18px 5px;
  background: #2f9276;
  color: #fff;
  box-shadow: 0 10px 24px rgba(26, 93, 75, .32);
}
.pickup-map-pin::after {
  position: absolute;
  left: 50%;
  bottom: -12px;
  width: 20px;
  height: 7px;
  transform: translateX(-50%);
  border-radius: 50%;
  background: rgba(23, 54, 46, .24);
  filter: blur(3px);
  content: '';
}
.pickup-map-controls {
  position: absolute;
  top: 11px;
  inset-inline-end: 11px;
  z-index: 7;
  display: grid;
  overflow: hidden;
  border: 1px solid rgba(209, 222, 218, .95);
  border-radius: 11px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 7px 18px rgba(25, 51, 44, .12);
}
.pickup-map-controls button {
  display: grid;
  width: 36px;
  height: 36px;
  cursor: pointer;
  place-items: center;
  color: #45645d;
  font-size: 18px;
  font-weight: 800;
}
.pickup-map-controls button + button { border-top: 1px solid #e4e9e8; }
.pickup-map-locate {
  position: absolute;
  inset-inline-start: 11px;
  bottom: 11px;
  z-index: 7;
  display: inline-flex;
  min-height: 37px;
  cursor: pointer;
  align-items: center;
  gap: 6px;
  padding: 0 10px;
  border: 1px solid rgba(204, 225, 218, .95);
  border-radius: 11px;
  background: rgba(255,255,255,.95);
  color: #2d7967;
  box-shadow: 0 7px 18px rgba(25, 51, 44, .12);
  font-size: 8px;
  font-weight: 900;
}
.pickup-map-locate.is-loading svg { animation: pickupPulse 1s ease-in-out infinite; }
.pickup-map-caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 11px;
  border-top: 1px solid #e0e7e5;
  background: #fff;
}
.pickup-map-caption > div { min-width: 0; }
.pickup-map-caption [data-location-state] {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #7f8e8b;
  font-size: 8px;
  font-weight: 900;
}
.pickup-map-caption [data-location-state] i {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #aab5b2;
}
.pickup-map-caption [data-location-state].is-selected { color: #2b846d; }
.pickup-map-caption [data-location-state].is-selected i { background: #32a181; box-shadow: 0 0 0 4px rgba(50,161,129,.09); }
.pickup-map-caption small {
  display: block;
  overflow: hidden;
  max-width: 100%;
  margin-top: 3px;
  color: #9aa6a3;
  font-size: 6.5px;
  direction: ltr;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pickup-map-caption button {
  display: inline-flex;
  min-height: 34px;
  flex: 0 0 auto;
  cursor: pointer;
  align-items: center;
  gap: 5px;
  padding: 0 9px;
  border: 1px solid #cee7de;
  border-radius: 10px;
  background: #edf9f5;
  color: #2f856f;
  font-size: 7px;
  font-weight: 900;
}
.pickup-map-attribution {
  padding: 5px 10px;
  border-top: 1px solid #edf1f0;
  background: #fafcfb;
  color: #a0aaa8;
  font-family: Arial, sans-serif;
  font-size: 6px;
  direction: ltr;
  text-align: left;
}
.pickup-fields-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}
.pickup-field { display: block; }
.pickup-field-full { grid-column: 1 / -1; }
.pickup-field > span {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 5px;
  color: #586c67;
  font-size: 8px;
  font-weight: 850;
}
.pickup-field > span b { color: #c05b6b; }
.pickup-field > span em { color: #9aa5a2; font-size: 6.5px; font-style: normal; font-weight: 600; }
.pickup-field input,
.pickup-field select,
.pickup-field textarea {
  width: 100%;
  min-height: 43px;
  padding: 9px 10px;
  border: 1px solid #dfe6e4;
  border-radius: 11px;
  background: #fff;
  color: #263b37;
  font-family: inherit;
  font-size: 9px;
  outline: none;
  transition: border-color .18s ease, box-shadow .18s ease;
}
.pickup-field textarea { min-height: 82px; line-height: 1.8; resize: vertical; }
.pickup-field input:focus,
.pickup-field select:focus,
.pickup-field textarea:focus {
  border-color: #78afa1;
  box-shadow: 0 0 0 3px rgba(47, 146, 118, .08);
}
.pickup-field input::placeholder,
.pickup-field textarea::placeholder { color: #aab3b1; font-size: 8px; }
.pickup-location-help {
  display: flex;
  min-height: 43px;
  align-items: center;
  gap: 7px;
  padding: 8px 9px;
  border: 1px solid #dce9e5;
  border-radius: 11px;
  background: #f4faf8;
  color: #66827b;
}
.pickup-location-help > span { flex: 0 0 auto; color: #39836f; }
.pickup-location-help p { font-size: 6.5px; line-height: 1.65; }
.pickup-urgency-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}
.pickup-urgency {
  position: relative;
  min-height: 58px;
  cursor: pointer;
  padding: 8px;
  border: 1px solid #e1e7e5;
  border-radius: 11px;
  background: #fff;
}
.pickup-urgency:has(input:checked) {
  border-color: var(--pickup-tone);
  background: var(--pickup-soft);
  box-shadow: inset 0 -3px 0 var(--pickup-tone);
}
.pickup-urgency strong { display: block; color: #334943; font-size: 8px; font-weight: 950; }
.pickup-urgency small { display: block; margin-top: 3px; color: #8d9a97; font-size: 6px; line-height: 1.5; }
.pickup-time-fields { margin-top: 8px; }
.pickup-security-notice {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #f0dbb7;
  border-radius: 12px;
  background: #fff9ee;
}
.pickup-security-notice > span {
  display: grid;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  place-items: center;
  border-radius: 11px;
  background: #fff1cf;
  color: #a96f1f;
}
.pickup-security-notice strong { display: block; color: #765326; font-size: 8px; }
.pickup-security-notice p { margin-top: 3px; color: #9c805d; font-size: 7px; line-height: 1.65; }
.pickup-rules-check {
  position: relative;
  display: flex;
  min-height: 47px;
  cursor: pointer;
  align-items: center;
  gap: 9px;
  margin-top: 9px;
  padding: 9px 10px;
  border: 1px solid #dfe6e4;
  border-radius: 12px;
  background: #fafcfb;
  color: #5c706b;
  font-size: 8px;
  font-weight: 750;
  line-height: 1.7;
}
.pickup-rules-check input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.pickup-checkbox-icon {
  display: grid;
  width: 23px;
  height: 23px;
  flex: 0 0 23px;
  place-items: center;
  border: 1px solid #cfd9d6;
  border-radius: 8px;
  background: #fff;
  color: transparent;
}
.pickup-rules-check:has(input:checked) { border-color: #cde5dc; background: #f5fbf8; }
.pickup-rules-check:has(input:checked) .pickup-checkbox-icon { border-color: #2f9276; background: #2f9276; color: #fff; }
.pickup-submit-button {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 24px;
  width: 100%;
  min-height: 58px;
  cursor: pointer;
  align-items: center;
  gap: 9px;
  margin-top: 9px;
  padding: 8px 11px;
  border: 1px solid #216e5b;
  border-radius: 14px;
  background: #267d67;
  color: #fff;
  box-shadow: 0 10px 23px rgba(38, 125, 103, .19);
  text-align: right;
}
.pickup-submit-button > span {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 11px;
  background: rgba(255,255,255,.14);
}
.pickup-submit-button strong { display: block; font-size: 9px; font-weight: 950; }
.pickup-submit-button small { display: block; margin-top: 2px; color: rgba(255,255,255,.72); font-size: 6.5px; }
.pickup-submit-button.is-loading > span svg { animation: pickupPulse 1s ease-in-out infinite; }
.pickup-submit-button:disabled { cursor: wait; opacity: .78; }

.pickup-success-card {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 11px;
  padding: 16px;
  box-shadow: inset 0 3px 0 #2f9b7c, 0 8px 24px rgba(32, 50, 62, .045);
}
.pickup-success-icon {
  display: grid;
  width: 52px;
  height: 52px;
  place-items: center;
  border: 1px solid #c7e8dc;
  border-radius: 17px;
  background: #eaf9f3;
  color: #2f9276;
}
.pickup-success-copy small { color: #5e9587; font-size: 7px; font-weight: 850; }
.pickup-success-copy h2 { margin-top: 3px; color: #24443c; font-family: var(--font-mono); font-size: 16px; font-weight: 950; direction: ltr; text-align: right; }
.pickup-success-copy p { margin-top: 4px; color: #84938f; font-size: 8px; line-height: 1.75; }
.pickup-success-card dl {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin: 0;
}
.pickup-success-card dl > div { padding: 9px; border: 1px solid #e3e9e7; border-radius: 11px; background: #fafcfb; }
.pickup-success-card dt { color: #91a09c; font-size: 7px; }
.pickup-success-card dd { margin: 3px 0 0; color: #344b45; font-size: 8px; font-weight: 900; }
.pickup-success-actions { grid-column: 1 / -1; display: flex; gap: 7px; }
.pickup-success-actions a { display: inline-flex; min-height: 36px; align-items: center; gap: 5px; padding: 0 10px; border: 1px solid #dce6e3; border-radius: 10px; color: #52716a; font-size: 7px; font-weight: 900; }
.pickup-success-actions a:first-child { border-color: #cce6dc; background: #f0faf6; color: #2f816c; }

.pickup-history-panel { margin-top: 10px; overflow: hidden; }
.pickup-history-panel > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 13px;
  border-bottom: 1px solid #e9eeec;
}
.pickup-history-panel > header > div { display: flex; align-items: center; gap: 8px; }
.pickup-history-icon { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid var(--app-violet-line); border-radius: 11px; background: var(--app-violet-soft); color: var(--app-violet); }
.pickup-history-panel h2 { color: #273d38; font-size: 10px; font-weight: 950; }
.pickup-history-panel header p { margin-top: 2px; color: #96a29f; font-size: 7px; }
.pickup-history-panel > header > span { padding: 4px 7px; border: 1px solid #e0e7e5; border-radius: 999px; background: #fafcfb; color: #83918e; font-size: 7px; font-weight: 850; }
.pickup-history-list { padding: 4px 12px 9px; }
.pickup-history-list article {
  display: grid;
  grid-template-columns: 36px minmax(180px, 1fr) minmax(120px, .4fr) auto;
  align-items: center;
  gap: 9px;
  min-height: 62px;
  border-bottom: 1px solid #edf1f0;
}
.pickup-history-list article:last-child { border-bottom: 0; }
.pickup-history-service { width: 36px; height: 36px; border-radius: 11px; }
.pickup-history-copy strong { display: block; color: #30443f; font-size: 8.5px; font-weight: 900; }
.pickup-history-copy small { display: block; margin-top: 3px; color: #98a39f; font-size: 6.5px; direction: ltr; text-align: right; }
.pickup-history-time span { display: block; color: #526a64; font-size: 8px; font-weight: 850; }
.pickup-history-time small { display: block; margin-top: 2px; color: #9aa5a2; font-size: 6.5px; }
.pickup-history-empty { display: grid; min-height: 150px; place-items: center; align-content: center; color: #9aa6a3; text-align: center; }
.pickup-history-empty svg { color: #80a59c; }
.pickup-history-empty strong { margin-top: 7px; color: #647872; font-size: 9px; }
.pickup-history-empty p { margin-top: 3px; font-size: 7px; }

/* Management pickup center */
.management-tabs {
  display: flex;
  gap: 6px;
  margin-top: 10px;
  padding: 5px;
  border: 1px solid #e0e6e4;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 5px 17px rgba(26, 45, 55, .035);
}
.management-tabs a {
  display: inline-flex;
  min-height: 39px;
  flex: 1;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid transparent;
  border-radius: 10px;
  color: #71817d;
  font-size: 8px;
  font-weight: 900;
}
.management-tabs a span { display: inline-flex; min-width: 20px; height: 20px; align-items: center; justify-content: center; border-radius: 999px; background: #edf2f1; font-size: 7px; }
.management-tabs a.is-active { border-color: #cfe5de; background: #eff9f5; color: #2d7c67; }
.management-tabs a.is-active span { background: #d9f0e7; color: #26755f; }
.management-location-card {
  overflow: hidden;
  border: 1px solid #e1e7e5;
  border-radius: 14px;
  background: #fafcfb;
}
.management-location-card iframe { width: 100%; height: 220px; border: 0; background: #e9efed; }
.management-location-card > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 10px; }
.management-location-card p { color: #71827d; font-size: 7px; line-height: 1.6; }
.management-location-card a { display: inline-flex; min-height: 31px; flex: 0 0 auto; align-items: center; gap: 4px; padding: 0 8px; border: 1px solid #cce3dc; border-radius: 9px; background: #eff9f5; color: #2d7c67; font-size: 7px; font-weight: 900; }
.management-pickup-detail .management-detail-grid { grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr); }
.management-pickup-detail .management-status-form { grid-column: 1 / -1; }
.management-service-cell { display: flex; align-items: center; gap: 7px; }
.management-service-cell > span { display: grid; width: 30px; height: 30px; flex: 0 0 30px; place-items: center; border: 1px solid var(--pickup-line); border-radius: 9px; background: var(--pickup-soft); color: var(--pickup-tone); }
.management-address-cell { max-width: 260px; line-height: 1.7; }
.management-table.management-pickup-table { min-width: 1280px; }

@keyframes pickupPulse { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(.86); opacity: .55; } }

@media (max-width: 900px) {
  .pickup-form-columns { grid-template-columns: 1fr; }
  .pickup-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pickup-map { height: 330px; }
  .management-pickup-detail .management-detail-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .pickup-page-heading { grid-template-columns: 36px minmax(0, 1fr) 42px; gap: 9px; padding: 11px; }
  .pickup-back-button { width: 36px; height: 36px; }
  .pickup-heading-icon { width: 42px; height: 42px; }
  .pickup-page-heading h1 { font-size: 13px; }
  .pickup-section { padding: 11px; }
  .pickup-service-card { min-height: 100px; padding: 9px; }
  .pickup-map { height: 300px; }
  .pickup-fields-grid { grid-template-columns: 1fr; }
  .pickup-field-full { grid-column: auto; }
  .pickup-urgency-grid { grid-template-columns: 1fr; }
  .pickup-urgency { min-height: 50px; }
  .pickup-success-card dl { grid-template-columns: 1fr; }
  .pickup-history-list article { grid-template-columns: 36px minmax(0, 1fr) auto; padding-block: 8px; }
  .pickup-history-time { grid-column: 2; }
  .pickup-history-list article > .badge { grid-column: 3; grid-row: 1 / span 2; }
  .management-tabs { overflow-x: auto; }
  .management-tabs a { min-width: 150px; }
}
@media (max-width: 420px) {
  .pickup-service-grid { gap: 6px; }
  .pickup-service-copy strong { font-size: 8px; }
  .pickup-service-copy small { font-size: 6px; }
  .pickup-map { height: 270px; }
  .pickup-map-caption { align-items: flex-start; flex-direction: column; }
  .pickup-map-caption button { align-self: stretch; justify-content: center; }
  .pickup-success-actions { flex-direction: column; }
  .pickup-success-actions a { justify-content: center; }
}
.badge-violet { background: #efeafe; color: #6e58aa; }
.badge-sky { background: #e9f5fc; color: #347da9; }
.badge-primary { background: #e7f6f1; color: #267b65; }
.badge-teal { background: #e7f5f5; color: #287878; }
.badge-muted { background: #eff2f3; color: #67777c; }

.management-detail-heading > span[class*='pickup-tone-'] { border: 1px solid var(--pickup-line); background: var(--pickup-soft); color: var(--pickup-tone); }

/* ========================================================================== 
   Pickup compact service picker + reliable map — v9.7.1
   ========================================================================== */
.pickup-service-picker {
  position: relative;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 28px;
  min-height: 58px;
  align-items: center;
  gap: 9px;
  padding: 7px 9px;
  border: 1px solid var(--pickup-line, #d9e7e3);
  border-radius: 14px;
  background: #fff;
  box-shadow: inset 3px 0 0 var(--pickup-tone, #2f9276);
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.pickup-service-picker:focus-within {
  border-color: var(--pickup-tone, #2f9276);
  background: color-mix(in srgb, var(--pickup-soft, #ecf9f4) 42%, white);
  box-shadow: inset 3px 0 0 var(--pickup-tone, #2f9276), 0 0 0 3px color-mix(in srgb, var(--pickup-tone, #2f9276) 9%, transparent);
}
.pickup-service-picker-icon {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid var(--pickup-line, #cae9dd);
  border-radius: 12px;
  background: var(--pickup-soft, #ecf9f4);
  color: var(--pickup-tone, #2f9276);
}
.pickup-service-picker label { display: block; min-width: 0; }
.pickup-service-picker label > small {
  display: block;
  margin-bottom: 2px;
  color: #8a9995;
  font-size: 6.5px;
  font-weight: 800;
}
.pickup-service-picker select {
  width: 100%;
  min-height: 26px;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: #293d38;
  font-family: inherit;
  font-size: 9px;
  font-weight: 950;
  appearance: none;
  -webkit-appearance: none;
}
.pickup-service-picker-chevron {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 9px;
  background: var(--pickup-soft, #ecf9f4);
  color: var(--pickup-tone, #2f9276);
  pointer-events: none;
}
.pickup-service-selected {
  display: flex;
  min-height: 39px;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
  padding: 6px 9px;
  border: 1px dashed var(--pickup-line, #cae9dd);
  border-radius: 11px;
  background: color-mix(in srgb, var(--pickup-soft, #ecf9f4) 50%, white);
}
.pickup-service-selected > i {
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 999px;
  background: var(--pickup-tone, #2f9276);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--pickup-tone, #2f9276) 10%, transparent);
}
.pickup-service-selected > div { min-width: 0; }
.pickup-service-selected strong {
  display: block;
  color: #344944;
  font-size: 7.5px;
  font-weight: 900;
}
.pickup-service-selected small {
  display: block;
  overflow: hidden;
  margin-top: 2px;
  color: #8b9996;
  font-size: 6.2px;
  line-height: 1.55;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pickup-service-selected.is-empty {
  border-color: #e1e7e5;
  background: #fafcfb;
}
.pickup-service-selected.is-empty > i { background: #a7b2af; box-shadow: none; }

.pickup-map { cursor: default; }
.pickup-map-canvas,
.pickup-map-canvas.leaflet-container {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  background: #e8eeec;
  font-family: var(--font-main);
}
.pickup-map .leaflet-tile,
.pickup-map .leaflet-marker-icon,
.pickup-map .leaflet-marker-shadow { max-width: none !important; }
.pickup-map .leaflet-control-container { direction: ltr; }
.pickup-map .leaflet-pane { z-index: 2; }
.pickup-map .leaflet-tile-pane { z-index: 1; }
.pickup-map .leaflet-overlay-pane { z-index: 3; }
.pickup-map .leaflet-popup-pane { z-index: 8; }
.pickup-map-pin { pointer-events: none; }
.pickup-map-loading {
  position: absolute;
  inset: 0;
  z-index: 8;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 5px;
  background: radial-gradient(circle at 50% 42%, #f8fcfa 0, #eef4f2 70%);
  color: #557069;
  text-align: center;
  transition: opacity .2s ease;
}
.pickup-map-loading[hidden] { display: none !important; }
.pickup-map-loading > span {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid #cce6dc;
  border-radius: 14px;
  background: #eaf8f2;
  color: #2f9276;
  animation: pickupPulse 1.25s ease-in-out infinite;
}
.pickup-map-loading strong { margin-top: 3px; font-size: 8px; font-weight: 950; }
.pickup-map-loading small { color: #93a19d; font-size: 6.5px; }
.pickup-map-provider {
  position: absolute;
  top: 11px;
  inset-inline-start: 11px;
  z-index: 7;
  display: inline-flex;
  min-height: 25px;
  align-items: center;
  padding: 0 8px;
  border: 1px solid rgba(209, 222, 218, .95);
  border-radius: 9px;
  background: rgba(255,255,255,.94);
  color: #53736b;
  box-shadow: 0 5px 15px rgba(25, 51, 44, .1);
  font-size: 6.5px;
  font-weight: 900;
  pointer-events: none;
}
.pickup-map.is-error .pickup-map-pin,
.pickup-map.is-error .pickup-map-controls,
.pickup-map.is-error .pickup-map-locate { display: none; }
.pickup-map-manual {
  display: grid;
  grid-template-columns: minmax(170px, 1fr) minmax(110px, .55fr) minmax(110px, .55fr) auto;
  align-items: end;
  gap: 7px;
  padding: 9px;
  border-top: 1px solid #ead9c6;
  background: #fffaf3;
}
.pickup-map-manual[hidden] { display: none !important; }
.pickup-map-manual > div strong { display: block; color: #835c2c; font-size: 7.5px; }
.pickup-map-manual > div small { display: block; margin-top: 2px; color: #a18461; font-size: 6px; line-height: 1.5; }
.pickup-map-manual input {
  width: 100%;
  min-height: 34px;
  padding: 0 8px;
  border: 1px solid #eadcc9;
  border-radius: 9px;
  background: #fff;
  color: #604a32;
  font-family: Arial, sans-serif;
  font-size: 8px;
  direction: ltr;
  text-align: left;
}
.pickup-map-manual button {
  min-height: 34px;
  padding: 0 10px;
  border-radius: 9px;
  background: #936a36;
  color: #fff;
  font-size: 7px;
  font-weight: 900;
}

@media (max-width: 720px) {
  .pickup-service-picker { grid-template-columns: 39px minmax(0, 1fr) 26px; min-height: 54px; padding: 6px 8px; }
  .pickup-service-picker-icon { width: 35px; height: 35px; border-radius: 11px; }
  .pickup-service-selected { min-height: 36px; }
  .pickup-map-manual { grid-template-columns: 1fr 1fr; }
  .pickup-map-manual > div { grid-column: 1 / -1; }
  .pickup-map-manual button { grid-column: 1 / -1; }
}

/* Neshan map diagnostics and CSP hotfix — v9.7.2 */
.pickup-map-diagnostic {
  margin: 10px 14px 0;
  padding: 10px 12px;
  border: 1px solid #d9e5e2;
  border-radius: 13px;
  font-size: 11px;
  line-height: 1.8;
  text-align: right;
  background: #f7faf9;
  color: #526763;
}
.pickup-map-diagnostic[hidden] { display: none !important; }
.pickup-map-diagnostic.is-warning {
  background: #fff9ec;
  border-color: #f2dfb2;
  color: #8a621f;
}
.pickup-map-diagnostic.is-error {
  background: #fff4f5;
  border-color: #f2ced3;
  color: #a13e4c;
}
.pickup-map-diagnostic.is-info {
  background: #f2f8ff;
  border-color: #cfe1f5;
  color: #356990;
}


/* Real login diagnostics */
.login-diagnostics { margin-top: .75rem; }
.login-diagnostic-row { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.65rem 0; border-bottom:1px solid var(--border-soft, #e8edf1); }
.login-diagnostic-row:last-of-type { border-bottom:0; }
.login-diagnostic-row span { color:#718096; font-size:.78rem; }
.login-diagnostic-row code { direction:ltr; unicode-bidi:isolate; color:#1f5f55; background:#eef8f5; border:1px solid #d4ece6; border-radius:.6rem; padding:.25rem .5rem; font-size:.72rem; }
.field-help { display:block; margin-top:.45rem; color:#8b98a7; font-size:.7rem; line-height:1.8; }

.login-diagnostic-message{display:grid;gap:.45rem;padding-top:.8rem}.login-diagnostic-message>span{color:var(--muted);font-size:.78rem}.login-diagnostic-message code{display:block;max-height:8rem;overflow:auto;white-space:pre-wrap;word-break:break-word;direction:ltr;text-align:left;font-size:.72rem;line-height:1.6;background:#f8fafc;border:1px solid #e5e7eb;border-radius:.8rem;padding:.7rem}

/* Live MobileBank data states — v9.8.0 */
.data-sync-notice {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0 0 14px;
  padding: 11px 13px;
  border: 1px solid #f1d7a8;
  border-radius: 16px;
  background: #fffbf2;
  color: #7b5618;
}
.data-sync-notice > span {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: #a66b12;
  background: #fff1cd;
}
.data-sync-notice strong { display: block; font-size: 13px; margin-bottom: 3px; }
.data-sync-notice p { margin: 0; font-size: 11px; line-height: 1.8; color: #906b31; white-space: pre-line; }
.live-data-empty {
  width: 100%;
  min-height: 138px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 7px;
  padding: 20px 16px;
  border: 1px dashed #d7e1e7;
  border-radius: 18px;
  background: #fbfcfd;
  color: #64748b;
}
.live-data-empty > span {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: #168070;
  background: #eaf7f4;
}
.live-data-empty strong { color: #233044; font-size: 13px; }
.live-data-empty p { max-width: 360px; margin: 0; font-size: 11px; line-height: 1.8; }
.transaction-list .live-data-empty { margin: 10px 0; }

/* v9.8.2 */
.login-customer-label{margin-top:14px}.data-sync-notice p{white-space:pre-line}

/* MobileBank diagnostic page — v9.8.4 */
.mobilebank-test-content{display:grid;gap:16px;padding-bottom:112px}.test-hero-card,.test-connection-card,.test-result-overview{background:#fff;border:1px solid #dfe8ee;border-radius:24px;box-shadow:0 12px 32px rgba(25,55,70,.055)}.test-hero-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:18px}.test-hero-icon{width:52px;height:52px;border-radius:18px;display:grid;place-items:center;background:#eaf8f5;color:#138574}.test-hero-copy{min-width:0}.test-hero-kicker{display:block;color:#138574;font-size:12px;font-weight:800;margin-bottom:3px}.test-hero-copy h2{font-size:19px;margin:0 0 5px;color:#152238}.test-hero-copy p{font-size:12px;line-height:1.9;color:#78889e;margin:0}.test-back-link{display:inline-flex;align-items:center;gap:5px;padding:10px 12px;border-radius:14px;background:#f4f7fa;color:#42536a;font-size:12px;font-weight:800;white-space:nowrap}.test-connection-card{padding:8px 16px}.test-connection-card>div,.test-request-meta>div{display:grid;grid-template-columns:150px minmax(0,1fr);align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #edf1f4}.test-connection-card>div:last-child,.test-request-meta>div:last-child{border-bottom:0}.test-connection-card span,.test-request-meta span{font-size:12px;font-weight:800;color:#708097}.test-connection-card code,.test-request-meta code{font-size:12px;color:#176f65;background:#eef9f7;border:1px solid #d3eee8;border-radius:10px;padding:7px 9px;overflow:auto;white-space:nowrap}.test-command-panel,.test-output-panel{overflow:hidden}.test-panel-header,.test-output-header{align-items:center}.test-command-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:0 16px 14px}.test-command-tab{border:1px solid #dfe7ed;background:#f8fafc;border-radius:16px;padding:11px 8px;display:grid;gap:3px;color:#687a91;transition:.18s ease}.test-command-tab strong{font-size:17px;color:#26364c}.test-command-tab span{font-size:11px;font-weight:700}.test-command-tab.is-active{border-color:#9edbd0;background:#eaf8f5;box-shadow:0 0 0 2px rgba(31,143,126,.08)}.test-command-tab.is-active strong,.test-command-tab.is-active span{color:#117c6d}.test-error-box{margin:0 16px 14px;padding:13px 14px;border:1px solid #f4c4ca;background:#fff2f4;color:#b4233c;border-radius:16px;display:flex;align-items:flex-start;gap:9px;font-size:12px;font-weight:750;line-height:1.8}.test-command-form{display:grid;gap:14px;padding:0 16px 18px}.test-payload-preview{border:1px dashed #bfd8d3;background:#f7fcfb;border-radius:17px;padding:6px 12px}.test-payload-preview>div{display:grid;grid-template-columns:100px minmax(0,1fr);gap:10px;align-items:center;padding:7px 0;border-bottom:1px solid #e7f1ef}.test-payload-preview>div:last-child{border-bottom:0}.test-payload-preview span{font-size:11px;font-weight:800;color:#718297}.test-payload-preview code{font-size:12px;color:#176f65;text-align:left;overflow:hidden;text-overflow:ellipsis}.test-command-form .field{margin:0}.test-command-form .field.is-readonly input{background:#f4f7f9;color:#748398}.test-run-button{margin-top:2px;display:flex;align-items:center;justify-content:center;gap:8px}.test-result-overview{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;overflow:hidden;background:#e7edf1}.test-result-overview>div{background:#fff;padding:14px 12px;display:grid;gap:5px;min-width:0}.test-result-overview span{font-size:11px;color:#8492a6}.test-result-overview strong{font-size:13px;color:#28384e;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.test-result-status.is-success{box-shadow:inset -4px 0 #29a47e}.test-result-status.is-success strong{color:#128066}.test-result-status.is-error{box-shadow:inset -4px 0 #e14c62}.test-result-status.is-error strong{color:#c52842}.test-output-header{padding-bottom:12px}.test-copy-button{border:1px solid #dbe5ea;background:#f7fafb;color:#466078;border-radius:12px;padding:8px 10px;display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:800;white-space:nowrap}.test-code-block{direction:ltr;text-align:left;margin:0 16px 16px;border-radius:16px;background:#142035;color:#dce8f4;border:1px solid #26364e;padding:15px;font:12px/1.8 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;max-height:380px;overflow:auto;-webkit-user-select:text!important;user-select:text!important}.test-response-block{max-height:520px}.test-request-meta{padding:0 16px 14px}.test-header-blocks{padding:0 16px 16px;display:grid;gap:12px}.test-header-block{border:1px solid #e2e9ee;border-radius:16px;overflow:hidden}.test-header-block>strong{display:block;background:#f5f8fa;padding:10px 12px;color:#53677f;font-size:12px}.test-header-block>div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:10px;padding:9px 12px;border-top:1px solid #edf1f4}.test-header-block span{font-size:11px;color:#657890;overflow:hidden;text-overflow:ellipsis}.test-header-block code{font-size:11px;color:#1c7168;overflow-wrap:anywhere;-webkit-user-select:text!important;user-select:text!important}.test-structure-list{padding:0 16px 16px;display:grid;gap:8px}.test-structure-row{border:1px solid #e2e9ee;background:#fbfcfd;border-radius:15px;padding:11px 12px}.test-structure-row>div{display:flex;justify-content:space-between;align-items:center;gap:12px}.test-structure-row code{direction:ltr;color:#186f66;background:#eaf8f5;border-radius:8px;padding:4px 7px;font-size:11px}.test-structure-row span{font-size:10px;color:#7f8ea2;white-space:nowrap}.test-structure-row p{margin:8px 0 0;color:#4f6279;font:11px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-wrap:anywhere;-webkit-user-select:text!important;user-select:text!important}.test-empty-output{margin:0 16px 16px;border:1px dashed #d8e2e8;border-radius:15px;padding:18px;text-align:center;color:#8190a4;font-size:12px}
.data-sync-notice{flex-wrap:wrap}.data-sync-test-link{margin-right:auto;display:inline-flex;align-items:center;gap:5px;border:1px solid #e9c77d;background:#fff9eb;color:#8a5d14;border-radius:12px;padding:8px 10px;font-size:11px;font-weight:850;white-space:nowrap}
@media(max-width:640px){.test-hero-card{grid-template-columns:auto 1fr}.test-back-link{grid-column:1/-1;justify-self:stretch;justify-content:center}.test-connection-card>div,.test-request-meta>div{grid-template-columns:1fr;gap:5px}.test-result-overview{grid-template-columns:repeat(2,1fr)}.test-header-block>div{grid-template-columns:110px minmax(0,1fr)}.test-command-tab{padding:10px 4px}.test-command-tab span{font-size:10px}.test-code-block{font-size:11px}.data-sync-test-link{width:100%;justify-content:center;margin-right:0}}

/* MobileBank test numeric identifiers — v9.8.6 */
.test-stage-note{margin:0 16px 12px;padding:12px 14px;border:1px solid #d9e9f5;background:#f4faff;border-radius:16px;display:grid;gap:4px}.test-stage-note strong{font-size:12px;color:#23638d}.test-stage-note span{font-size:10px;line-height:1.8;color:#6f879a}.test-variant-box{border:1px solid #e2e8ee;background:#fbfcfd;border-radius:16px;padding:11px 13px;display:grid;gap:4px}.test-variant-box strong{font-size:12px;color:#1f334b}.test-variant-box span{font-size:10px;line-height:1.8;color:#77889d}.test-command-tab span{direction:ltr;unicode-bidi:plaintext;overflow-wrap:anywhere}.test-command-tab strong{direction:ltr}.test-payload-preview>div{grid-template-columns:125px minmax(0,1fr)}
@media(max-width:760px){.test-command-tabs{grid-template-columns:repeat(2,1fr)}.test-command-tab{min-height:72px}.test-payload-preview>div{grid-template-columns:110px minmax(0,1fr)}}


/* Post-update activation — v9.8.7 */
.update-activation-page{min-height:100vh;background:#f5f8f8}.update-activation-shell{min-height:100vh;display:grid;place-items:center;padding:24px}.update-activation-card{width:min(100%,520px);background:#fff;border:1px solid #dce8e6;border-radius:28px;padding:28px;box-shadow:0 20px 55px rgba(25,70,65,.09);text-align:center}.update-activation-icon{width:64px;height:64px;border-radius:22px;display:grid;place-items:center;margin:0 auto 14px;background:#eaf8f5;color:#167f73;border:1px solid #c7ebe4}.update-activation-kicker{display:block;color:#6d8582;font-size:12px;margin-bottom:6px}.update-activation-card h1{font-size:22px;margin:0 0 8px;color:#122b3e}.update-activation-card>p{font-size:14px;color:#6f8290;margin:0 0 18px}.update-activation-progress{height:8px;border-radius:999px;background:#edf3f2;overflow:hidden;margin-bottom:20px}.update-activation-progress i{display:block;width:4%;height:100%;border-radius:inherit;background:#218e80;transition:width .35s ease}.update-activation-steps{display:grid;gap:8px;text-align:right}.update-activation-steps>div{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid #e6edec;border-radius:14px;color:#82918f}.update-activation-steps span{width:26px;height:26px;border-radius:9px;display:grid;place-items:center;background:#f1f5f4;font-size:12px}.update-activation-steps p{margin:0;font-size:13px}.update-activation-steps .is-active{border-color:#b9ded8;background:#f3fbf9;color:#176f65}.update-activation-steps .is-active span,.update-activation-steps .is-done span{background:#dff5f0;color:#147b6f}.update-activation-steps .is-done{color:#3e6863}.update-activation-card>small{display:block;margin:18px 0 0;color:#97a5a3;font-size:11px}

/* Login interaction hardening — v9.8.8 */
.login-page,
.login-page * {
  -webkit-touch-callout: default;
}
.login-page .login-panel,
.login-page .login-card,
.login-page .field-group,
.login-page .field-wrap,
.login-page .details-card,
.login-page .details-content {
  position: relative;
  pointer-events: auto !important;
}
.login-page .field-wrap {
  z-index: 2;
  touch-action: manipulation !important;
}
.login-page input,
.login-page textarea,
.login-page select {
  position: relative;
  z-index: 3;
  pointer-events: auto !important;
  touch-action: manipulation !important;
  -webkit-user-select: text !important;
  user-select: text !important;
  -webkit-touch-callout: default !important;
  opacity: 1 !important;
}
.login-page input:disabled,
.login-page input[readonly] {
  pointer-events: auto !important;
}
.login-page .field-icon {
  z-index: 4;
  pointer-events: none !important;
}
.login-page .field-action {
  z-index: 5;
  pointer-events: auto !important;
  touch-action: manipulation !important;
}
.login-page .app-update-modal:not(.is-open),
.login-page .app-install-overlay:not(.is-open),
.login-page .updater-install-overlay-v2:not(.is-open) {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
.login-page.app-body {
  touch-action: manipulation;
}

/* Command 31 real-data mapping — v9.8.9 */
.test-applied-notice{margin:0 0 16px;padding:14px 16px;border:1px solid #b9e3d9;background:#effaf7;border-radius:18px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 12px}.test-applied-notice strong{color:#116f62;font-size:14px}.test-applied-notice span{color:#57776f;font-size:11px}.test-applied-notice a{grid-row:1/3;grid-column:2;color:#fff;background:#176f65;border-radius:12px;padding:9px 12px;font-size:11px;font-weight:800;white-space:nowrap}@media(max-width:520px){.test-applied-notice{grid-template-columns:1fr}.test-applied-notice a{grid-row:auto;grid-column:auto;text-align:center;margin-top:6px}}

/* فرمان 2: عیب‌یابی پاسخ گردش حساب */
.statement-diagnostic-card {
    margin: 0 0 16px;
    border: 1px solid #d7e6e2;
    border-radius: 22px;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(15, 52, 48, .06);
}
.statement-diagnostic-card > summary {
    display: grid;
    grid-template-columns: 44px 1fr auto;
    gap: 12px;
    align-items: center;
    padding: 16px;
    cursor: pointer;
    list-style: none;
}
.statement-diagnostic-card > summary::-webkit-details-marker { display: none; }
.statement-diagnostic-card > summary > span {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    color: #177f70;
    background: #eaf8f4;
}
.statement-diagnostic-card > summary strong { display: block; color: #17233c; }
.statement-diagnostic-card > summary small { display: block; margin-top: 4px; color: #8190a6; }
.statement-diagnostic-card > summary > b {
    min-width: 46px;
    padding: 7px 10px;
    border-radius: 999px;
    text-align: center;
    font-size: 12px;
    color: #18735f;
    background: #ecf8f3;
}
.statement-diagnostic-body {
    padding: 0 16px 16px;
    border-top: 1px solid #edf2f4;
}
.statement-diagnostic-body dl { margin: 0; }
.statement-diagnostic-body dl > div {
    display: grid;
    grid-template-columns: 120px minmax(0,1fr);
    gap: 12px;
    padding: 11px 0;
    border-bottom: 1px solid #edf2f4;
}
.statement-diagnostic-body dt { color: #78879c; }
.statement-diagnostic-body dd { margin: 0; color: #17233c; overflow-wrap: anywhere; }
.statement-diagnostic-body label { display: block; margin: 14px 0 8px; font-weight: 700; color: #4e5f76; }
.statement-diagnostic-body pre {
    max-height: 260px;
    margin: 0;
    padding: 14px;
    overflow: auto;
    direction: ltr;
    text-align: left;
    white-space: pre-wrap;
    word-break: break-word;
    border-radius: 15px;
    color: #dce8ff;
    background: #17233c;
    font: 12px/1.8 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    user-select: text;
    -webkit-user-select: text;
}
.statement-diagnostic-body > a {
    display: flex;
    justify-content: center;
    margin-top: 14px;
    padding: 12px 14px;
    border-radius: 14px;
    color: #116d5f;
    background: #eaf8f4;
    font-weight: 800;
}


/* Statement command 2 test — v9.9.3 */
.statement-empty-test-link{display:inline-flex!important;align-items:center;justify-content:center;gap:7px;min-width:190px;background:#eaf8f5!important;color:#117c6d!important;border:1px solid #bce4dc!important}
.statement-test-content{display:grid;gap:16px;padding-bottom:120px}.statement-test-heading{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;align-items:center}.statement-test-heading>div>span{display:block;color:#168274;font-size:11px;font-weight:800}.statement-test-heading h1{margin:2px 0 3px;color:#142239;font-size:24px}.statement-test-heading p{margin:0;color:#7b899c;font-size:11px;line-height:1.8}.statement-test-account-card{display:flex;align-items:center;gap:13px;background:#fff;border:1px solid #dce8e5;border-radius:22px;padding:15px;box-shadow:0 10px 28px rgba(23,62,57,.055)}.statement-test-account-icon{width:46px;height:46px;border-radius:16px;display:grid;place-items:center;background:#e9f8f4;color:#138574;flex:0 0 auto}.statement-test-account-card div{min-width:0}.statement-test-account-card small{display:block;color:#879793;font-size:10px}.statement-test-account-card strong{display:block;color:#17342f;font-size:18px;margin:2px 0}.statement-test-account-card p{margin:0;color:#687c78;font-size:11px}.statement-test-form-panel,.statement-test-result-panel{overflow:hidden}.statement-test-form{display:grid;gap:14px;padding:0 16px 18px}.statement-test-form .field{margin:0}.statement-test-form select{width:100%;min-height:48px}.statement-test-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.statement-test-payload{display:grid;grid-template-columns:1fr 1fr;gap:7px;border:1px dashed #b8dcd5;background:#f6fcfa;border-radius:16px;padding:10px}.statement-test-payload code{direction:ltr;text-align:left;background:#e9f7f4;color:#146f64;border-radius:9px;padding:7px 8px;font-size:11px;overflow:auto;white-space:nowrap;-webkit-user-select:text!important;user-select:text!important}.statement-test-count{color:#127b6c;background:#e8f7f3;border:1px solid #c9e9e2;border-radius:12px;padding:7px 9px;font-size:11px;font-weight:850;white-space:nowrap}.statement-test-result-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#e8eef1;border-top:1px solid #e2e9ec;border-bottom:1px solid #e2e9ec}.statement-test-result-summary>div{background:#fff;padding:12px;display:grid;gap:4px;min-width:0}.statement-test-result-summary small{color:#8391a3;font-size:10px}.statement-test-result-summary strong{color:#21334a;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.statement-test-details{border-bottom:1px solid #e9eef1}.statement-test-details:last-child{border-bottom:0}.statement-test-details summary{cursor:pointer;padding:13px 16px;color:#34495f;font-size:12px;font-weight:850;list-style:none}.statement-test-details summary::-webkit-details-marker{display:none}.statement-test-details summary:after{content:'+';float:left;color:#6f8195;font-size:17px;line-height:1}.statement-test-details[open] summary:after{content:'−'}.statement-test-code-head{display:flex;justify-content:flex-end;padding:0 16px 8px}.statement-test-code-head button{display:inline-flex;align-items:center;gap:5px;border:1px solid #dce6eb;background:#f7fafb;color:#526b82;border-radius:10px;padding:7px 9px;font-size:10px;font-weight:800}.statement-test-result-panel .test-code-block{margin-bottom:14px}.statement-test-page .test-error-box{margin:0}.statement-test-page .panel-header{padding:15px 16px}
@media(max-width:520px){.statement-test-form-grid{grid-template-columns:1fr}.statement-test-payload{grid-template-columns:1fr}.statement-test-result-summary{grid-template-columns:1fr 1fr}.statement-test-result-summary>div:last-child{grid-column:1/-1}.statement-test-heading h1{font-size:21px}}

/* Customer profile & settings — v9.9.5 */
.settings-content{display:grid;gap:18px;padding-bottom:150px}.settings-page-heading{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:8px 2px 2px}.settings-page-heading>div span{display:block;color:#718098;font-size:12px;margin-bottom:3px}.settings-page-heading h1{margin:0;color:#17233a;font-size:27px;line-height:1.25}.settings-page-heading p{margin:5px 0 0;color:#8996aa;font-size:13px}.settings-back{width:52px;height:52px;border:1px solid #dbe4ea;border-radius:18px;background:#fff;display:grid;place-items:center;color:#31556a;box-shadow:0 8px 25px rgba(20,44,61,.06)}.settings-version{border:1px solid #d9ebe7;background:#f0faf7;color:#28766d;border-radius:999px;padding:7px 10px;font-size:11px;white-space:nowrap}.settings-alert{display:flex;align-items:center;gap:9px;padding:13px 15px;border-radius:16px;font-size:13px;font-weight:700}.settings-alert-success{background:#ecfbf5;border:1px solid #bcebd7;color:#23785e}.settings-alert-error{background:#fff1f2;border:1px solid #ffcbd1;color:#b3384a}.settings-profile-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:18px;border:1px solid #dfe7eb;border-radius:24px;background:#fff;box-shadow:0 12px 34px rgba(31,57,73,.06)}.settings-profile-avatar{width:58px;height:58px;border-radius:19px;display:grid;place-items:center;background:#eaf8f4;color:#168a78}.settings-profile-main>span{font-size:11px;color:#8492a5}.settings-profile-main h2{margin:3px 0 4px;color:#152238;font-size:20px}.settings-profile-main p{margin:0;color:#77869a;font-size:12px}.settings-profile-stats{display:flex;gap:7px}.settings-profile-stats div{min-width:52px;padding:9px 8px;border-radius:15px;background:#f6f8fa;text-align:center}.settings-profile-stats strong{display:block;color:#17334a;font-size:16px}.settings-profile-stats span{display:block;color:#8995a6;font-size:10px;margin-top:2px}.settings-form{display:grid;gap:16px}.settings-card{padding:18px;border:1px solid #dfe7eb;border-radius:24px;background:#fff;box-shadow:0 10px 30px rgba(31,57,73,.045)}.settings-card-header{display:flex;align-items:center;gap:12px;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid #edf1f3}.settings-card-header h2{margin:0;color:#17243a;font-size:17px}.settings-card-header p{margin:4px 0 0;color:#8995a5;font-size:11px;line-height:1.7}.settings-card-icon{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;flex:0 0 auto}.settings-card-icon.is-profile{background:#f1ecff;color:#7557c9}.settings-card-icon.is-account{background:#e8f7ff;color:#277bb4}.settings-card-icon.is-appearance{background:#fff4da;color:#b47700}.settings-card-icon.is-security{background:#eaf8f4;color:#168a78}.settings-field{display:grid;gap:7px;margin-top:14px}.settings-field>span,.settings-choice-group>span{color:#46566c;font-size:12px;font-weight:800}.settings-field input,.settings-field select{width:100%;height:52px;border:1px solid #dbe4ea;border-radius:16px;background:#f9fbfc;color:#17243a;padding:0 15px;font-family:inherit;font-size:14px;outline:none}.settings-field input:focus,.settings-field select:focus{border-color:#75bcb2;box-shadow:0 0 0 3px rgba(37,151,135,.1);background:#fff}.settings-field small{color:#9aa5b3;font-size:10.5px;line-height:1.65}.settings-toggle-row{position:relative;display:grid;grid-template-columns:1fr auto;align-items:center;gap:14px;padding:14px 0;border-top:1px solid #eff2f4;margin-top:14px;cursor:pointer}.settings-toggle-copy strong{display:block;color:#29384d;font-size:13px}.settings-toggle-copy small{display:block;color:#909cac;font-size:10.5px;margin-top:4px;line-height:1.6}.settings-toggle-row input{position:absolute;opacity:0;pointer-events:none}.settings-toggle-row i{position:relative;width:46px;height:27px;border-radius:999px;background:#dbe2e7;transition:.2s}.settings-toggle-row i:after{content:"";position:absolute;top:4px;right:4px;width:19px;height:19px;border-radius:50%;background:#fff;box-shadow:0 2px 7px rgba(20,38,52,.18);transition:.2s}.settings-toggle-row input:checked+i{background:#2d9587}.settings-toggle-row input:checked+i:after{transform:translateX(-19px)}.settings-choice-group{display:grid;gap:9px;margin-top:14px}.settings-segmented{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:5px;border-radius:17px;background:#f3f6f8}.settings-segmented label{position:relative}.settings-segmented input{position:absolute;opacity:0}.settings-segmented span{height:42px;border-radius:13px;display:grid;place-items:center;color:#788698;font-size:12px;font-weight:800;cursor:pointer}.settings-segmented input:checked+span{background:#fff;color:#176e65;box-shadow:0 4px 14px rgba(30,59,74,.08)}.settings-sticky-actions{position:sticky;bottom:82px;z-index:20;padding-top:2px}.settings-save-button{width:100%;height:56px;border:0;border-radius:18px;background:#154f49;color:#fff;display:flex;align-items:center;justify-content:center;gap:9px;font-family:inherit;font-size:14px;font-weight:900;box-shadow:0 13px 28px rgba(21,79,73,.2)}.settings-save-button:disabled{opacity:.65}.settings-tools-card{padding:17px;border:1px dashed #cdd9de;border-radius:22px;background:#fbfcfd}.settings-tools-card>div:first-child strong{color:#27364b;font-size:14px}.settings-tools-card>div:first-child p{color:#909baa;font-size:11px;margin:4px 0 0}.settings-tool-actions{display:flex;gap:8px;margin-top:14px}.settings-tool-actions form{flex:1}.settings-tool-actions button{width:100%;min-height:44px;border:1px solid #d9e3e7;border-radius:14px;background:#fff;color:#38625f;display:flex;align-items:center;justify-content:center;gap:6px;font-family:inherit;font-size:11px;font-weight:800}.settings-tool-actions button.is-danger{color:#ad4655;border-color:#f2d4d9}.profile-card-link{text-decoration:none;color:inherit;cursor:pointer}.profile-card-link:hover{border-color:#bcd9d4}.density-comfortable .page-content{gap:24px}.density-comfortable .panel,.density-comfortable .balance-card,.density-comfortable .quick-services{padding-top:24px;padding-bottom:24px}.colors-neutral .quick-action-icon,.colors-neutral .accounts-heading-icon,.colors-neutral .loans-panel-icon-v2,.colors-neutral .transaction-icon,.colors-neutral .bottom-nav-icon,.colors-neutral .settings-card-icon{background:#f1f4f6!important;color:#5c6b7a!important;border-color:#e0e6ea!important}.colors-neutral .account-card{--account-accent:#7b8b96!important}.reduce-motion *,.reduce-motion *:before,.reduce-motion *:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.settings-page input,.settings-page select,.settings-page textarea{user-select:text;-webkit-user-select:text;touch-action:manipulation}.settings-page .bottom-nav{z-index:60}
@media(max-width:600px){.settings-content{gap:14px}.settings-page-heading{grid-template-columns:auto 1fr}.settings-version{grid-column:2;justify-self:start}.settings-profile-card{grid-template-columns:auto 1fr}.settings-profile-stats{grid-column:1/-1;width:100%}.settings-profile-stats div{flex:1}.settings-card{padding:16px}.settings-sticky-actions{bottom:78px}.settings-tools-card{margin-bottom:8px}}

/* Free MobileBank API lab — v9.9.6 */
.api-lab-content{display:grid;gap:16px;padding-bottom:130px}.api-lab-heading{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:8px 2px}.api-lab-heading>div>span{display:block;color:#168577;font-size:11px;font-weight:850}.api-lab-heading h1{margin:3px 0;color:#17243a;font-size:26px}.api-lab-heading p{margin:0;color:#8794a6;font-size:12px;line-height:1.8}.api-lab-security{display:flex;gap:12px;align-items:flex-start;padding:15px;border:1px solid #cfe8e2;background:#f2fbf8;border-radius:19px;color:#176f63}.api-lab-security strong{display:block;font-size:13px}.api-lab-security p{margin:4px 0 0;color:#65867f;font-size:10.5px;line-height:1.75}.api-lab-endpoint{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:13px 15px;border:1px solid #dfe7eb;background:#fff;border-radius:18px}.api-lab-endpoint>span{color:#8190a2;font-size:10px;font-weight:800}.api-lab-endpoint code{direction:ltr;text-align:left;overflow:auto;white-space:nowrap;color:#235a55;font-size:11px;-webkit-user-select:text!important;user-select:text!important}.api-lab-endpoint button,.api-lab-code-actions button,.api-lab-list-map button{display:inline-flex;align-items:center;justify-content:center;gap:5px;border:1px solid #d9e4e7;background:#f8fafb;color:#476b68;border-radius:10px;padding:7px 9px;font-family:inherit;font-size:10px;font-weight:800;white-space:nowrap}.api-lab-presets{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.api-lab-presets button{min-height:70px;border:1px solid #dfe7eb;border-radius:17px;background:#fff;display:grid;place-items:center;align-content:center;gap:3px;font-family:inherit;color:#516278}.api-lab-presets b{font-size:17px;color:#177c70}.api-lab-presets span{font-size:9.5px;font-weight:800}.api-lab-form,.api-lab-result{border:1px solid #dfe7eb;border-radius:24px;background:#fff;box-shadow:0 12px 32px rgba(25,55,70,.055);overflow:hidden}.api-lab-mode-tabs{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:8px;background:#f3f6f8}.api-lab-mode-tabs label{position:relative}.api-lab-mode-tabs input{position:absolute;opacity:0}.api-lab-mode-tabs span{height:44px;border-radius:14px;display:grid;place-items:center;color:#788698;font-size:12px;font-weight:850;cursor:pointer}.api-lab-mode-tabs input:checked+span{background:#fff;color:#176e65;box-shadow:0 4px 14px rgba(30,59,74,.08)}.api-lab-editor{display:grid;gap:14px;padding:18px}.api-lab-editor[hidden]{display:none!important}.api-lab-field{display:grid;gap:7px}.api-lab-field>label,.api-lab-editor>label{color:#3b4b60;font-size:11px;font-weight:850}.api-lab-field-row{display:grid;grid-template-columns:1fr 112px;gap:8px}.api-lab-field input,.api-lab-field select,.api-lab-editor textarea{width:100%;border:1px solid #dbe4ea;border-radius:15px;background:#f9fbfc;color:#17243a;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;outline:none;-webkit-user-select:text!important;user-select:text!important}.api-lab-field input,.api-lab-field select{height:48px;padding:0 12px}.api-lab-field select{font-size:11px}.api-lab-editor textarea{padding:14px;line-height:1.75;resize:vertical;min-height:230px}.api-lab-field input:focus,.api-lab-field select:focus,.api-lab-editor textarea:focus{border-color:#65b6aa;box-shadow:0 0 0 3px rgba(37,151,135,.1);background:#fff}.api-lab-editor small{color:#929dab;font-size:10px}.api-lab-sensitive{display:flex!important;align-items:center;gap:8px;color:#718096!important}.api-lab-sensitive input{width:18px;height:18px;accent-color:#268f82}.api-lab-run{margin:0 18px 18px;width:calc(100% - 36px);height:56px;border:0;border-radius:17px;background:#154f49;color:#fff;display:flex;align-items:center;justify-content:center;gap:9px;font-family:inherit;font-size:13px;font-weight:900}.api-lab-result>header{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:17px}.api-lab-result>header span{display:block;color:#8290a2;font-size:10px}.api-lab-result>header h2{margin:3px 0 0;color:#17243a;font-size:17px}.api-lab-result>header>b{border-radius:999px;padding:8px 11px;font-size:11px;direction:ltr}.api-lab-result>header>b.is-ok{background:#e8f8f2;color:#16765e}.api-lab-result>header>b.is-error{background:#fff0f2;color:#b0384c}.api-lab-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#e8eef1;border-top:1px solid #e8eef1;border-bottom:1px solid #e8eef1}.api-lab-metrics>div{background:#fff;padding:12px;min-width:0}.api-lab-metrics span{display:block;color:#8b97a8;font-size:9px}.api-lab-metrics strong{display:block;margin-top:4px;color:#26384e;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.api-lab-details{border-bottom:1px solid #edf1f3}.api-lab-details:last-child{border-bottom:0}.api-lab-details summary{cursor:pointer;list-style:none;padding:14px 17px;color:#34475c;font-size:12px;font-weight:900}.api-lab-details summary::-webkit-details-marker{display:none}.api-lab-details summary:after{content:'+';float:left;font-size:17px;color:#8290a2}.api-lab-details[open] summary:after{content:'−'}.api-lab-code-actions{display:flex;justify-content:flex-end;padding:0 16px 8px}.api-lab-details>pre,.api-lab-list-map pre{direction:ltr;text-align:left;white-space:pre-wrap;word-break:break-word;max-height:520px;overflow:auto;margin:0 16px 16px;padding:15px;border-radius:16px;background:#17233a;color:#eaf1f7;font-size:11px;line-height:1.75;-webkit-user-select:text!important;user-select:text!important}.api-lab-list-map{display:grid;gap:12px;padding:0 16px 16px}.api-lab-list-map article{border:1px solid #dfe7eb;border-radius:16px;overflow:hidden;background:#fbfcfd}.api-lab-list-map article>div{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px}.api-lab-list-map code{direction:ltr;color:#286b66;font-size:10px}.api-lab-list-map span{color:#8794a5;font-size:9px}.api-lab-list-map pre{margin:0;border-radius:0;max-height:300px}.api-lab-list-map button{margin:10px}.api-lab-page input,.api-lab-page select,.api-lab-page textarea,.api-lab-page pre,.api-lab-page code{touch-action:manipulation;-webkit-user-select:text!important;user-select:text!important}.settings-tool-link{width:100%;min-height:44px;border:1px solid #cfe4df;border-radius:14px;background:#eff9f6;color:#20766b;display:flex;align-items:center;justify-content:center;gap:6px;text-decoration:none;font-size:11px;font-weight:850}
@media(max-width:640px){.api-lab-heading{grid-template-columns:auto 1fr}.api-lab-heading .settings-version{grid-column:2;justify-self:start}.api-lab-presets{grid-template-columns:repeat(2,1fr)}.api-lab-presets button:last-child{grid-column:1/-1}.api-lab-endpoint{grid-template-columns:1fr auto}.api-lab-endpoint>span{grid-column:1/-1}.api-lab-field-row{grid-template-columns:1fr 95px}.api-lab-metrics{grid-template-columns:1fr 1fr}.api-lab-content{gap:13px}}
.settings-tool-actions{flex-wrap:wrap}.settings-tool-actions>.settings-tool-link{flex:1 1 100%}


/* === نسخه 9.9.9: خوانایی و راهنمای اندازه نوشته‌ها === */
html.font-size-normal,
body.font-size-normal {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
html.font-size-large,
body.font-size-large {
  -webkit-text-size-adjust: 116%;
  text-size-adjust: 116%;
}
html.font-size-xlarge,
body.font-size-xlarge {
  -webkit-text-size-adjust: 132%;
  text-size-adjust: 132%;
}

.settings-segmented.settings-segmented-three{grid-template-columns:repeat(3,1fr)}
.settings-font-size-control{scroll-margin-top:24px}
.settings-font-preview{display:flex;align-items:center;gap:11px;margin:9px 0 12px;padding:12px 13px;border:1px solid #dce9e6;border-radius:17px;background:#f5fbf9}
.settings-font-preview>span{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:#dff4ef;color:#15796c;font-size:23px;font-weight:950}
.settings-font-preview strong{display:block;color:#26374d;font-size:12px}
.settings-font-preview small{display:block;margin-top:3px;color:#7c8999;font-size:9.5px;line-height:1.7}
.settings-help-text{display:block;margin-top:8px;color:#8793a4;font-size:9.5px;line-height:1.8}

.font-accessibility-tip{position:fixed;inset:0;z-index:10000;display:grid;place-items:end center;padding:20px 16px calc(20px + env(safe-area-inset-bottom));background:rgba(13,28,39,.38);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;visibility:hidden;transition:opacity .22s ease,visibility .22s ease}
.font-accessibility-tip.is-visible{opacity:1;visibility:visible}
.font-accessibility-tip-card{position:relative;width:min(100%,430px);padding:22px 19px 18px;border:1px solid rgba(255,255,255,.8);border-radius:27px;background:#fff;box-shadow:0 24px 70px rgba(11,32,43,.24);transform:translateY(24px) scale(.98);transition:transform .25s ease;text-align:right}
.font-accessibility-tip.is-visible .font-accessibility-tip-card{transform:translateY(0) scale(1)}
.font-accessibility-tip-close{position:absolute;top:12px;left:12px;width:34px;height:34px;border:0;border-radius:12px;background:#f1f5f6;color:#687787;font-family:inherit;font-size:22px;line-height:1;display:grid;place-items:center}
.font-accessibility-tip-visual{display:flex;align-items:flex-end;gap:7px;width:max-content;margin-bottom:12px;padding:9px 12px;border-radius:17px;background:#edf9f6;color:#16786c}
.font-accessibility-tip-visual .is-small{font-size:16px;font-weight:850;opacity:.58}
.font-accessibility-tip-visual .is-large{font-size:31px;font-weight:950;line-height:.95}
.font-accessibility-tip-kicker{display:block;color:#168174;font-size:10px;font-weight:900}
.font-accessibility-tip h2{margin:5px 0 7px;color:#17253b;font-size:20px;line-height:1.5}
.font-accessibility-tip p{margin:0;color:#718095;font-size:12px;line-height:1.9}
.font-accessibility-tip-actions{display:grid;grid-template-columns:1.35fr .8fr;gap:8px;margin-top:17px}
.font-accessibility-tip-actions a,.font-accessibility-tip-actions button{min-height:49px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-family:inherit;font-size:11.5px;font-weight:900;text-decoration:none}
.font-accessibility-tip-actions a{border:0;background:#155c54;color:#fff;box-shadow:0 10px 23px rgba(21,92,84,.2)}
.font-accessibility-tip-actions button{border:1px solid #dbe5e8;background:#f8fafb;color:#607081}
.reduce-motion .font-accessibility-tip,.reduce-motion .font-accessibility-tip-card{transition:none!important}
@media(max-width:390px){.font-accessibility-tip-actions{grid-template-columns:1fr}.font-accessibility-tip-card{padding:20px 16px 16px}.settings-segmented.settings-segmented-three span{font-size:10px}}

/* === نسخه 9.10.0: گردش و جزئیات اقساط وام === */
.active-loan-card-link-v2 {
  display: block;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}
.active-loan-card-link-v2:focus-visible {
  outline: 3px solid rgba(31, 111, 104, .2);
  outline-offset: 3px;
}
.active-loan-installments-link {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  margin-inline-start: auto;
  color: #1f6f68;
  font-size: .76rem;
  font-weight: 800;
  white-space: nowrap;
}
.loan-details-content {
  display: grid;
  gap: 1rem;
  padding-bottom: calc(7rem + env(safe-area-inset-bottom));
}
.loan-details-heading,
.loan-detail-hero,
.loan-detail-hero-main,
.loan-detail-hero-balance p,
.loan-data-notice,
.loan-summary-grid article,
.loan-next-installment,
.loan-installments-panel > header,
.loan-live-badge,
.installment-status,
.loan-refresh-button,
.loan-diagnostic summary {
  display: flex;
  align-items: center;
}
.loan-details-heading {
  gap: .8rem;
}
.loan-details-heading > div {
  flex: 1;
  min-width: 0;
}
.loan-details-heading > div > span {
  color: #6b7280;
  font-size: .72rem;
  font-weight: 700;
}
.loan-details-heading h1 {
  margin: .1rem 0;
  color: #17211f;
  font-size: 1.25rem;
}
.loan-details-heading p {
  margin: 0;
  color: #7b8482;
  font-size: .78rem;
}
.loan-refresh-button {
  justify-content: center;
  gap: .35rem;
  min-height: 2.45rem;
  padding: 0 .8rem;
  border: 1px solid #dce8e5;
  border-radius: .85rem;
  background: #fff;
  color: #1f6f68;
  font-size: .76rem;
  font-weight: 800;
  text-decoration: none;
}
.loan-detail-hero {
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem;
  border: 1px solid #dce9e6;
  border-radius: 1.15rem;
  background: linear-gradient(135deg, #fff, #f3faf8);
  box-shadow: 0 10px 30px rgba(29, 78, 70, .06);
}
.loan-detail-hero-main {
  gap: .75rem;
  min-width: 0;
}
.loan-detail-hero-icon {
  display: grid;
  flex: 0 0 auto;
  width: 3rem;
  height: 3rem;
  place-items: center;
  border-radius: 1rem;
  background: #dff3ee;
  color: #1f6f68;
}
.loan-detail-hero-main span,
.loan-detail-hero-balance > span {
  color: #77817f;
  font-size: .72rem;
  font-weight: 700;
}
.loan-detail-hero h2 {
  margin: .12rem 0;
  color: #17211f;
  font-size: 1rem;
}
.loan-detail-hero-main p {
  margin: 0;
  color: #697371;
  font-size: .76rem;
}
.loan-detail-hero-balance {
  flex: 0 0 auto;
  text-align: left;
}
.loan-detail-hero-balance p {
  justify-content: flex-end;
  gap: .35rem;
  margin: .25rem 0 0;
}
.loan-detail-hero-balance strong {
  color: #17211f;
  font-size: 1.15rem;
}
.loan-detail-hero-balance small {
  color: #697371;
  font-size: .7rem;
}
.loan-data-notice {
  gap: .7rem;
  padding: .85rem 1rem;
  border: 1px solid #e7dfbd;
  border-radius: 1rem;
  background: #fffdf3;
  color: #7c651d;
}
.loan-data-notice.is-error {
  border-color: #f1d2d2;
  background: #fff7f7;
  color: #9b3030;
}
.loan-data-notice > div {
  flex: 1;
}
.loan-data-notice strong,
.loan-data-notice p {
  display: block;
  margin: 0;
}
.loan-data-notice p {
  margin-top: .15rem;
  font-size: .75rem;
  line-height: 1.7;
}
.loan-api-lab-link {
  color: inherit;
  font-size: .73rem;
  font-weight: 900;
  white-space: nowrap;
}
.loan-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .7rem;
}
.loan-summary-grid article {
  gap: .65rem;
  min-width: 0;
  padding: .8rem;
  border: 1px solid #e6ecea;
  border-radius: 1rem;
  background: #fff;
}
.loan-summary-icon {
  display: grid;
  flex: 0 0 auto;
  width: 2.45rem;
  height: 2.45rem;
  place-items: center;
  border-radius: .8rem;
}
.loan-summary-icon.is-blue { background: #e8f0ff; color: #4169a9; }
.loan-summary-icon.is-green { background: #e6f6ec; color: #278152; }
.loan-summary-icon.is-red { background: #fdeaea; color: #b74343; }
.loan-summary-icon.is-amber { background: #fff3db; color: #a86f1b; }
.loan-summary-grid article > div {
  min-width: 0;
}
.loan-summary-grid span,
.loan-summary-grid small {
  display: block;
  color: #7b8482;
  font-size: .68rem;
}
.loan-summary-grid strong {
  display: block;
  overflow: hidden;
  margin: .1rem 0;
  color: #192320;
  font-size: 1rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.loan-next-installment {
  gap: 1rem;
  padding: .9rem 1rem;
  border: 1px solid #dce8e5;
  border-radius: 1rem;
  background: #f7fbfa;
}
.loan-next-installment > div {
  min-width: 0;
}
.loan-next-installment > div:first-child {
  flex: 1;
}
.loan-next-installment span:not(.installment-status),
.loan-next-installment small {
  display: block;
  color: #7a8482;
  font-size: .68rem;
}
.loan-next-installment strong {
  color: #17211f;
  font-size: .86rem;
}
.loan-status-tabs {
  display: flex;
  gap: .45rem;
  overflow-x: auto;
  padding-bottom: .1rem;
  scrollbar-width: none;
}
.loan-status-tabs::-webkit-scrollbar { display: none; }
.loan-status-tabs a {
  flex: 0 0 auto;
  padding: .55rem .8rem;
  border: 1px solid #e0e8e6;
  border-radius: 999px;
  background: #fff;
  color: #697371;
  font-size: .73rem;
  font-weight: 800;
  text-decoration: none;
}
.loan-status-tabs a.is-active {
  border-color: #1f6f68;
  background: #1f6f68;
  color: #fff;
}
.loan-installments-panel {
  overflow: hidden;
  border: 1px solid #e2eae8;
  border-radius: 1.15rem;
  background: #fff;
}
.loan-installments-panel > header {
  justify-content: space-between;
  gap: .8rem;
  padding: .9rem 1rem;
  border-bottom: 1px solid #edf1f0;
}
.loan-installments-panel h2,
.loan-installments-panel p {
  margin: 0;
}
.loan-installments-panel h2 {
  color: #17211f;
  font-size: .95rem;
}
.loan-installments-panel p {
  margin-top: .15rem;
  color: #7b8482;
  font-size: .72rem;
}
.loan-live-badge {
  gap: .35rem;
  padding: .38rem .6rem;
  border-radius: 999px;
  background: #eaf6f2;
  color: #1f6f68;
  font-size: .67rem;
  font-weight: 800;
}
.loan-live-badge i {
  width: .4rem;
  height: .4rem;
  border-radius: 50%;
  background: #2ca06c;
}
.loan-installments-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.loan-installments-table {
  width: 100%;
  min-width: 1040px;
  border-collapse: collapse;
  text-align: right;
}
.loan-installments-table th,
.loan-installments-table td {
  padding: .78rem .75rem;
  border-bottom: 1px solid #eef2f1;
  vertical-align: middle;
  white-space: nowrap;
}
.loan-installments-table th {
  background: #f8faf9;
  color: #6c7774;
  font-size: .68rem;
  font-weight: 900;
}
.loan-installments-table td {
  color: #26312e;
  font-size: .75rem;
}
.loan-installments-table tbody tr:hover {
  background: #fbfdfc;
}
.loan-installments-table td small {
  color: #7b8482;
  font-size: .62rem;
}
.installment-status {
  justify-content: center;
  width: max-content;
  min-height: 1.7rem;
  padding: 0 .55rem;
  border-radius: 999px;
  font-size: .65rem;
  font-weight: 900;
}
.installment-status-success { background: #e6f6ec; color: #24784d; }
.installment-status-warning { background: #fff3db; color: #956416; }
.installment-status-danger { background: #fde8e8; color: #a93737; }
.installment-status-neutral { background: #eef2f1; color: #68726f; }
.loan-delay {
  color: #71807c;
  font-size: .72rem;
  font-weight: 800;
}
.loan-delay.has-delay { color: #b43c3c; }
.loan-installments-empty {
  padding: 2.5rem 1rem;
  text-align: center;
  color: #7a8482;
}
.loan-installments-empty svg {
  color: #9bb0aa;
}
.loan-installments-empty h3 {
  margin: .6rem 0 .2rem;
  color: #26312e;
  font-size: .95rem;
}
.loan-installments-empty p {
  margin: 0;
  line-height: 1.8;
}
.loan-installments-empty a {
  display: inline-flex;
  margin-top: .7rem;
  color: #1f6f68;
  font-weight: 900;
}
.loan-diagnostic {
  border: 1px solid #e3e9e7;
  border-radius: 1rem;
  background: #fff;
}
.loan-diagnostic summary {
  gap: .4rem;
  padding: .85rem 1rem;
  color: #53605d;
  font-size: .75rem;
  font-weight: 900;
  cursor: pointer;
}
.loan-diagnostic > div {
  padding: 0 1rem 1rem;
}
.loan-diagnostic strong {
  display: block;
  margin: .7rem 0 .25rem;
  font-size: .72rem;
}
.loan-diagnostic pre {
  overflow: auto;
  max-height: 18rem;
  margin: 0;
  padding: .7rem;
  border-radius: .75rem;
  background: #f7f9f8;
  direction: ltr;
  text-align: left;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: .68rem;
}
@media (max-width: 860px) {
  .loan-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .loan-detail-hero { align-items: flex-start; flex-direction: column; }
  .loan-detail-hero-balance { width: 100%; text-align: right; }
  .loan-detail-hero-balance p { justify-content: flex-start; }
  .loan-next-installment { align-items: flex-start; flex-wrap: wrap; }
  .loan-next-installment > div:first-child { flex-basis: 100%; }
  .loan-summary-grid { gap: .55rem; }
  .loan-summary-grid article { padding: .7rem; }
  .loan-refresh-button { padding: 0 .6rem; }
  .active-loan-installments-link { width: 100%; margin-top: .45rem; margin-inline-start: 0; }
}

/* === بازطراحی یکپارچه صفحه اقساط و کارت وام === */
.active-loan-card-link-v2 {
  position: relative;
  display: block;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}
.active-loan-card-link-v2:focus-visible {
  outline: 3px solid rgba(31, 111, 104, .18);
  outline-offset: 3px;
}
.active-loan-card-link-v2:active {
  transform: scale(.992);
  background: #fcfefd;
}
.active-loan-card-link-v2 .active-loan-details-v2 {
  border-color: #dfe9e6;
  background: #f4f8f7;
  color: #315f59;
  transition: transform .16s ease, background-color .16s ease, color .16s ease;
}
.active-loan-installments-link { display: none !important; }
@media (hover:hover) {
  .active-loan-card-link-v2:hover {
    transform: translateY(-2px);
    border-color: #cfdeda;
    box-shadow: 0 9px 25px rgba(31, 72, 65, .08);
  }
  .active-loan-card-link-v2:hover .active-loan-details-v2 {
    transform: translateX(-2px);
    background: #e8f3f0;
    color: #1f6f68;
  }
}

.loan-page-content {
  display: grid;
  gap: 11px;
  padding-bottom: calc(7rem + env(safe-area-inset-bottom));
}
.loan-page-heading,
.loan-page-refresh,
.loan-overview-top,
.loan-overview-identity,
.loan-overview-balance,
.loan-active-pill,
.loan-overview-progress > div:first-child,
.loan-summary-cards article,
.loan-focus-card,
.loan-focus-metrics,
.loan-filter-card > header,
.loan-filter-tabs,
.loan-filter-tabs a,
.loan-list-panel > header,
.loan-table-hint,
.loan-money-cell,
.loan-row-number,
.loan-technical-details summary,
.loan-sync-notice {
  display: flex;
  align-items: center;
}
.loan-page-heading {
  min-height: 50px;
  gap: 9px;
}
.loan-back-button {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  place-items: center;
  border: 1px solid #dfe7e5;
  border-radius: 12px;
  background: #fff;
  color: #526a66;
  box-shadow: 0 2px 7px rgba(25, 52, 47, .035);
}
.loan-page-heading-copy {
  min-width: 0;
  flex: 1 1 auto;
}
.loan-page-heading-copy > span {
  display: block;
  color: #84908d;
  font-size: 8px;
  font-weight: 800;
}
.loan-page-heading h1 {
  margin: 1px 0 0;
  color: #1d2b28;
  font-size: 16px;
  font-weight: 950;
  line-height: 1.45;
}
.loan-page-heading p {
  margin: 1px 0 0;
  color: #929d9a;
  font-size: 8px;
  line-height: 1.65;
}
.loan-page-refresh {
  min-height: 38px;
  flex: 0 0 auto;
  justify-content: center;
  gap: 5px;
  padding: 0 10px;
  border: 1px solid #dfe7e5;
  border-radius: 12px;
  background: #fff;
  color: #456761;
  font-size: 8px;
  font-weight: 900;
  box-shadow: 0 2px 7px rgba(25, 52, 47, .035);
}
.loan-sync-notice {
  gap: 8px;
  padding: 10px 11px;
  border: 1px solid #e8dfbf;
  border-radius: 14px;
  background: #fffdf5;
  color: #866d23;
}
.loan-sync-notice.is-error {
  border-color: #efd2d2;
  background: #fff8f8;
  color: #984747;
}
.loan-sync-notice > span {
  display: grid;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  place-items: center;
  border-radius: 9px;
  background: rgba(255,255,255,.75);
}
.loan-sync-notice > div {
  min-width: 0;
  flex: 1 1 auto;
}
.loan-sync-notice strong,
.loan-sync-notice p {
  display: block;
  margin: 0;
}
.loan-sync-notice strong { font-size: 9px; font-weight: 900; }
.loan-sync-notice p { margin-top: 2px; font-size: 7.5px; line-height: 1.75; }
.loan-sync-notice > a {
  flex: 0 0 auto;
  color: inherit;
  font-size: 8px;
  font-weight: 950;
}

.loan-overview-card,
.loan-filter-card,
.loan-list-panel,
.loan-technical-details {
  overflow: hidden;
  border: 1px solid #dfe7e5;
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 3px 12px rgba(24, 55, 49, .035);
}
.loan-overview-card { padding: 12px; }
.loan-overview-top {
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 11px;
  border-bottom: 1px solid #edf1f0;
}
.loan-overview-identity {
  min-width: 0;
  flex: 1 1 auto;
  gap: 9px;
}
.loan-overview-icon {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  place-items: center;
  border: 1px solid #dce9e6;
  border-radius: 12px;
  background: #edf7f4;
  color: #2d6b62;
}
.loan-overview-identity > div { min-width: 0; }
.loan-overview-identity > div > span {
  display: block;
  color: #8a9693;
  font-size: 7.5px;
  font-weight: 800;
}
.loan-overview-identity h2 {
  overflow: hidden;
  margin: 1px 0;
  color: #26322f;
  font-size: 11px;
  font-weight: 950;
  line-height: 1.55;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.loan-overview-identity p {
  margin: 0;
  color: #7e8b88;
  font-size: 8px;
}
.loan-overview-identity p b { color: #40524e; font-weight: 900; }
.loan-selector {
  position: relative;
  display: grid;
  min-width: 118px;
  gap: 2px;
  padding: 7px 10px;
  border: 1px solid #e0e7e5;
  border-radius: 12px;
  background: #f8faf9;
}
.loan-selector > span {
  color: #8a9693;
  font-size: 7px;
  font-weight: 800;
}
.loan-selector select {
  width: 100%;
  min-height: 17px;
  appearance: none;
  border: 0;
  outline: 0;
  background: transparent;
  padding-left: 18px;
  color: #32433f;
  direction: ltr;
  font-family: inherit;
  font-size: 9px;
  font-weight: 950;
}
.loan-selector > svg {
  position: absolute;
  bottom: 9px;
  left: 8px;
  color: #80908c;
}
.loan-overview-balance {
  justify-content: space-between;
  gap: 12px;
  padding: 12px 1px 9px;
}
.loan-overview-balance > div > span {
  display: block;
  color: #8b9794;
  font-size: 8px;
  font-weight: 800;
}
.loan-overview-balance p {
  display: flex;
  align-items: baseline;
  gap: 5px;
  margin: 3px 0 0;
}
.loan-overview-balance strong {
  color: #172521;
  font-size: 20px;
  font-weight: 950;
  line-height: 1.25;
}
.loan-overview-balance small {
  color: #778581;
  font-size: 7.5px;
  font-weight: 800;
}
.loan-active-pill {
  min-height: 25px;
  flex: 0 0 auto;
  gap: 5px;
  padding: 0 9px;
  border: 1px solid #d5e7e1;
  border-radius: 999px;
  background: #f3faf7;
  color: #3e7469;
  font-size: 7.5px;
  font-weight: 900;
}
.loan-active-pill i {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #4a9b76;
}
.loan-overview-progress {
  padding-top: 9px;
  border-top: 1px solid #edf1f0;
}
.loan-overview-progress > div:first-child {
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.loan-overview-progress span {
  color: #83908d;
  font-size: 7.5px;
  font-weight: 800;
}
.loan-overview-progress strong {
  color: #48615c;
  font-size: 8px;
  font-weight: 950;
}
.loan-overview-progress-track {
  height: 5px;
  overflow: hidden;
  border-radius: 999px;
  background: #e9eeec;
}
.loan-overview-progress-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2f7d70, #64a99b);
}

.loan-summary-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.loan-summary-cards article {
  min-width: 0;
  gap: 8px;
  padding: 10px;
  border: 1px solid #e2e9e7;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(25, 55, 49, .025);
}
.loan-summary-card-icon {
  display: grid;
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  place-items: center;
  border-radius: 10px;
}
.loan-summary-card-icon.is-blue { background: #edf3ff; color: #4d6fa9; }
.loan-summary-card-icon.is-green { background: #eaf7ef; color: #347d56; }
.loan-summary-card-icon.is-red { background: #fff0f0; color: #ad5050; }
.loan-summary-card-icon.is-amber { background: #fff6e5; color: #a4742a; }
.loan-summary-cards article > div { min-width: 0; }
.loan-summary-cards small,
.loan-summary-cards span:not(.loan-summary-card-icon) {
  display: block;
  color: #8a9693;
  font-size: 7px;
  font-weight: 750;
}
.loan-summary-cards strong {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  margin-top: 1px;
  color: #26322f;
  font-size: 13px;
  font-weight: 950;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.loan-summary-cards .is-money strong { font-size: 10px; }

.loan-focus-card {
  gap: 10px;
  padding: 11px 12px;
  border: 1px solid #d9e8e4;
  border-radius: 16px;
  background: linear-gradient(135deg, #f8fcfb, #f1f8f6);
}
.loan-focus-icon {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  place-items: center;
  border: 1px solid #d8e9e4;
  border-radius: 12px;
  background: #fff;
  color: #316d63;
}
.loan-focus-copy {
  min-width: 0;
  flex: 1 1 auto;
}
.loan-focus-copy > span,
.loan-focus-copy > small,
.loan-focus-metrics span,
.loan-focus-metrics small {
  display: block;
  color: #83908d;
  font-size: 7px;
  font-weight: 750;
}
.loan-focus-copy > strong {
  display: block;
  margin: 2px 0;
  color: #273632;
  font-size: 10px;
  font-weight: 950;
}
.loan-focus-metrics {
  flex: 0 0 auto;
  gap: 15px;
}
.loan-focus-metrics > div {
  min-width: 90px;
  padding-right: 12px;
  border-right: 1px solid #dce7e4;
}
.loan-focus-metrics strong {
  display: block;
  margin-top: 2px;
  color: #2c3b37;
  font-size: 9px;
  font-weight: 950;
}
.loan-focus-card > .installment-status { flex: 0 0 auto; }

.loan-filter-card > header,
.loan-list-panel > header {
  justify-content: space-between;
  gap: 10px;
  padding: 11px 12px;
  border-bottom: 1px solid #edf1f0;
}
.loan-filter-card h2,
.loan-filter-card p,
.loan-list-panel h2,
.loan-list-panel p {
  margin: 0;
}
.loan-filter-card h2,
.loan-list-panel h2 {
  color: #26322f;
  font-size: 10px;
  font-weight: 950;
}
.loan-filter-card p,
.loan-list-panel p {
  margin-top: 2px;
  color: #8b9694;
  font-size: 7.5px;
  line-height: 1.7;
}
.loan-record-count,
.loan-table-hint {
  min-height: 26px;
  flex: 0 0 auto;
  justify-content: center;
  gap: 4px;
  padding: 0 8px;
  border-radius: 9px;
  background: #f1f5f4;
  color: #61726e;
  font-size: 7px;
  font-weight: 900;
}
.loan-filter-tabs {
  gap: 6px;
  overflow-x: auto;
  padding: 9px 10px 10px;
  background: #fafcfb;
  scrollbar-width: none;
}
.loan-filter-tabs::-webkit-scrollbar { display: none; }
.loan-filter-tabs a {
  min-height: 31px;
  flex: 0 0 auto;
  justify-content: center;
  gap: 6px;
  padding: 0 10px;
  border: 1px solid #e1e8e6;
  border-radius: 10px;
  background: #fff;
  color: #66736f;
  font-size: 7.5px;
  font-weight: 900;
  text-decoration: none;
}
.loan-filter-tabs a b {
  display: grid;
  min-width: 17px;
  height: 17px;
  place-items: center;
  border-radius: 6px;
  background: #f0f4f3;
  color: #768480;
  font-size: 6.5px;
}
.loan-filter-tabs a.is-active {
  border-color: #276d64;
  background: #276d64;
  color: #fff;
  box-shadow: 0 5px 12px rgba(39, 109, 100, .15);
}
.loan-filter-tabs a.is-active b {
  background: rgba(255,255,255,.16);
  color: #fff;
}

.loan-table-wrap {
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}
.loan-table {
  width: 100%;
  min-width: 980px;
  border-collapse: separate;
  border-spacing: 0;
  text-align: right;
}
.loan-table th,
.loan-table td {
  padding: 10px 11px;
  border-bottom: 1px solid #edf1f0;
  vertical-align: middle;
  white-space: nowrap;
}
.loan-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f7f9f8;
  color: #75817e;
  font-size: 7px;
  font-weight: 950;
}
.loan-table td {
  color: #33413d;
  font-size: 8px;
}
.loan-table tbody tr:last-child td { border-bottom: 0; }
.loan-table tbody tr:nth-child(even) { background: #fcfdfd; }
.loan-table tbody tr:hover { background: #f8fbfa; }
.loan-row-number {
  gap: 5px;
  color: #3b504b;
  font-weight: 950;
}
.loan-row-number > span {
  display: grid;
  width: 25px;
  height: 25px;
  place-items: center;
  border-radius: 8px;
  background: #edf4f2;
  color: #35675f;
  font-size: 8px;
}
.loan-row-number small { color: #87938f; font-size: 7px; }
.loan-date-cell { color: #455651; font-weight: 850; }
.loan-money-cell {
  align-items: baseline;
  gap: 4px;
}
.loan-money-cell strong {
  color: #263631;
  font-size: 8.5px;
  font-weight: 950;
}
.loan-money-cell small {
  color: #899592;
  font-size: 6.5px;
  font-weight: 750;
}
.loan-delay-pill {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
  border-radius: 8px;
  background: #f0f4f3;
  color: #71807c;
  font-size: 7px;
  font-weight: 900;
}
.loan-delay-pill.has-delay {
  background: #fff0f0;
  color: #a64848;
}
.loan-list-panel .installment-status {
  min-height: 24px;
  padding: 0 8px;
  border-radius: 8px;
  font-size: 7px;
}
.loan-empty-state {
  display: grid;
  min-height: 220px;
  place-content: center;
  justify-items: center;
  padding: 24px 15px;
  text-align: center;
}
.loan-empty-state > span {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 15px;
  background: #f0f5f3;
  color: #78918a;
}
.loan-empty-state h3 {
  margin: 9px 0 3px;
  color: #34443f;
  font-size: 10px;
  font-weight: 950;
}
.loan-empty-state p {
  max-width: 290px;
  margin: 0;
  color: #899592;
  font-size: 8px;
  line-height: 1.8;
}
.loan-empty-state a {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 5px;
  margin-top: 10px;
  padding: 0 11px;
  border-radius: 10px;
  background: #286d64;
  color: #fff;
  font-size: 8px;
  font-weight: 900;
}

.loan-technical-details summary {
  justify-content: space-between;
  gap: 7px;
  min-height: 42px;
  padding: 0 12px;
  color: #65736f;
  font-size: 8px;
  font-weight: 900;
  cursor: pointer;
  list-style: none;
}
.loan-technical-details summary::-webkit-details-marker { display: none; }
.loan-technical-details summary span { flex: 1; }
.loan-technical-details > div {
  padding: 0 12px 12px;
  border-top: 1px solid #edf1f0;
}
.loan-technical-details strong {
  display: block;
  margin: 10px 0 4px;
  color: #52615d;
  font-size: 7.5px;
}
.loan-technical-details pre {
  overflow: auto;
  max-height: 220px;
  margin: 0;
  padding: 9px;
  border-radius: 10px;
  background: #f6f8f7;
  color: #44514e;
  direction: ltr;
  text-align: left;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 7px;
  line-height: 1.7;
}
.loan-technical-details a {
  display: inline-flex;
  margin-top: 10px;
  color: #286d64;
  font-size: 8px;
  font-weight: 950;
}

@media (max-width: 820px) {
  .loan-summary-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .loan-page-content { gap: 9px; }
  .loan-page-refresh span { display: none; }
  .loan-page-refresh { width: 38px; padding: 0; }
  .loan-overview-card { padding: 11px; }
  .loan-overview-top { align-items: flex-start; }
  .loan-selector { min-width: 104px; }
  .loan-overview-balance strong { font-size: 18px; }
  .loan-focus-card { align-items: flex-start; flex-wrap: wrap; }
  .loan-focus-copy { min-width: calc(100% - 50px); }
  .loan-focus-metrics { width: 100%; justify-content: space-between; padding-top: 9px; border-top: 1px solid #dde9e6; }
  .loan-focus-metrics > div { min-width: 0; flex: 1 1 50%; }
  .loan-focus-card > .installment-status { display: none; }
  .loan-table-hint { display: none; }
}
@media (max-width: 390px) {
  .loan-page-heading-copy p { display: none; }
  .loan-overview-top { flex-wrap: wrap; }
  .loan-selector { width: 100%; min-width: 0; }
  .loan-summary-cards { gap: 6px; }
  .loan-summary-cards article { padding: 8px; }
  .loan-summary-card-icon { width: 29px; height: 29px; flex-basis: 29px; }
  .loan-filter-card > header,
  .loan-list-panel > header { padding: 10px; }
}

/* === نسخه 9.10.2: انتقال وجه داخلی دو مرحله‌ای === */
.internal-transfer-content{display:grid;gap:10px;padding-bottom:92px}
.internal-transfer-heading{display:flex;align-items:center;gap:10px;padding:2px 1px}
.internal-transfer-back{display:grid;width:38px;height:38px;flex:0 0 38px;place-items:center;border:1px solid #e3e9e7;border-radius:12px;background:#fff;color:#4d5f5a;box-shadow:0 6px 18px rgba(32,57,52,.05)}
.internal-transfer-heading>div{min-width:0;flex:1}
.internal-transfer-heading>div>span{display:block;color:#79908a;font-size:8px;font-weight:900}
.internal-transfer-heading h1{margin-top:2px;color:#263a35;font-size:14px;font-weight:950}
.internal-transfer-heading p{margin-top:2px;color:#879691;font-size:8px;line-height:1.7}
.internal-transfer-secure{display:inline-flex;min-height:28px;align-items:center;gap:4px;padding:0 9px;border-radius:9px;background:#eaf7f4;color:#27766c;font-size:7px;font-weight:900;white-space:nowrap}
.internal-transfer-source-card{overflow:hidden;padding:12px;border:1px solid #dfe8e5;border-radius:18px;background:linear-gradient(145deg,#fff,#f7fbfa);box-shadow:0 10px 30px rgba(32,61,55,.06)}
.internal-transfer-source-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.internal-transfer-source-identity{display:flex;min-width:0;align-items:center;gap:9px}
.internal-transfer-source-identity>span{display:grid;width:37px;height:37px;flex:0 0 37px;place-items:center;border-radius:12px;background:#e3f3ef;color:#236e65}
.internal-transfer-source-identity div{min-width:0}
.internal-transfer-source-identity small{display:block;color:#80918d;font-size:7px;font-weight:850}
.internal-transfer-source-identity strong{display:block;overflow:hidden;margin-top:1px;color:#293b37;font-size:10px;font-weight:950;text-overflow:ellipsis;white-space:nowrap}
.internal-transfer-source-identity p{margin-top:2px;color:#74847f;font-size:7.5px}
.internal-transfer-source-identity p b{color:#465a55;font-weight:950}
.internal-transfer-source-select{position:relative;display:grid;min-width:112px;gap:3px}
.internal-transfer-source-select>span{color:#85948f;font-size:7px;font-weight:800}
.internal-transfer-source-select select{width:100%;height:34px;padding:0 9px 0 26px;border:1px solid #dce6e3;border-radius:10px;background:#fff;color:#344943;direction:ltr;font-size:8px;font-weight:950;outline:none}
.internal-transfer-source-select>svg{position:absolute;bottom:11px;left:8px;color:#80908c;pointer-events:none}
.internal-transfer-source-balance{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:11px;padding-top:10px;border-top:1px solid #e8eeec}
.internal-transfer-source-balance>span{color:#71827d;font-size:8px;font-weight:850}
.internal-transfer-source-balance p{display:flex;align-items:baseline;gap:5px}
.internal-transfer-source-balance strong{color:#173f39;font-size:17px;font-weight:950;letter-spacing:-.5px}
.internal-transfer-source-balance small{color:#71837e;font-size:7px;font-weight:850}
.internal-transfer-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(245px,.65fr);gap:10px;align-items:start}
.internal-transfer-form-card,.internal-transfer-review-card{border:1px solid #e1e8e6;border-radius:18px;background:#fff;box-shadow:0 8px 28px rgba(34,59,54,.05)}
.internal-transfer-card-header,.internal-transfer-review-card>header{display:flex;align-items:center;gap:9px;padding:12px;border-bottom:1px solid #edf1f0}
.internal-transfer-step{display:grid;width:29px;height:29px;flex:0 0 29px;place-items:center;border-radius:9px;background:#e8f5f2;color:#246f66;font-size:8px;font-weight:950}
.internal-transfer-card-header h2,.internal-transfer-review-card h2{color:#2d403b;font-size:10px;font-weight:950}
.internal-transfer-card-header p,.internal-transfer-review-card header p{margin-top:2px;color:#87948f;font-size:7.5px;line-height:1.65}
#internalTransferForm{display:grid;gap:10px;padding:12px}
.internal-transfer-field{display:grid;gap:5px}
.internal-transfer-field label{color:#465853;font-size:8px;font-weight:950}
.internal-transfer-field label em{color:#bb4e55;font-style:normal}
.internal-transfer-field label span{color:#8a9894;font-size:7px;font-weight:750}
.internal-transfer-input-wrap{position:relative;display:flex;min-height:43px;align-items:center;gap:8px;padding:0 10px;border:1px solid #dfe7e5;border-radius:12px;background:#fbfcfc;transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}
.internal-transfer-input-wrap:focus-within{border-color:#61a99f;background:#fff;box-shadow:0 0 0 3px rgba(39,134,124,.10)}
.internal-transfer-input-wrap>span{display:grid;width:29px;height:29px;flex:0 0 29px;place-items:center;border-radius:9px;background:#eaf5f2;color:#34786f}
.internal-transfer-input-wrap input{min-width:0;flex:1;background:transparent;color:#263a35;font-family:inherit;font-size:10px;font-weight:900;outline:none}
.internal-transfer-input-wrap input::placeholder{color:#a4afac;font-size:8px;font-weight:700}
.internal-transfer-input-wrap b{color:#60726d;font-size:8px;font-weight:900;white-space:nowrap}
.internal-transfer-field textarea{width:100%;min-height:76px;resize:vertical;padding:10px;border:1px solid #dfe7e5;border-radius:12px;background:#fbfcfc;color:#2f423d;font-family:inherit;font-size:9px;font-weight:750;line-height:1.9;outline:none}
.internal-transfer-field textarea:focus{border-color:#61a99f;background:#fff;box-shadow:0 0 0 3px rgba(39,134,124,.10)}
.internal-transfer-field textarea::placeholder{color:#a0aba8}
.internal-transfer-field>small{color:#879591;font-size:7px;line-height:1.7}
.internal-transfer-field>small.is-valid{color:#2f8175}
.internal-transfer-field>small.is-error{color:#b64a52}
.internal-transfer-amount-wrap input{text-align:left}
.internal-transfer-amount-wrap input.is-invalid{color:#b8464f}
.internal-transfer-amount-words{display:flex;align-items:flex-start;gap:5px;padding:7px 9px;border-radius:9px;background:#f4f8f7;color:#687975;font-size:7px;line-height:1.8}
.internal-transfer-amount-words strong{color:#36534c;font-weight:900}
.internal-transfer-code-toggle{display:grid;width:30px;height:30px;flex:0 0 30px;place-items:center;border-radius:9px;background:#eef3f2;color:#60736e}
.internal-transfer-confirmation{display:flex;align-items:flex-start;gap:8px;padding:9px 10px;border:1px solid #dce8e5;border-radius:12px;background:#f8fbfa;cursor:pointer}
.internal-transfer-confirmation input{position:absolute;opacity:0;pointer-events:none}
.internal-transfer-confirmation>span{display:grid;width:20px;height:20px;flex:0 0 20px;place-items:center;border:1px solid #c9d8d4;border-radius:6px;background:#fff;color:transparent;transition:.15s ease}
.internal-transfer-confirmation input:checked+span{border-color:#2f8175;background:#2f8175;color:#fff}
.internal-transfer-confirmation p{color:#586a65;font-size:7.5px;font-weight:800;line-height:1.75}
.internal-transfer-alert{padding:9px 10px;border-radius:10px;font-size:8px;font-weight:850;line-height:1.8}
.internal-transfer-alert.is-error{border:1px solid #f0cfd2;background:#fff5f6;color:#9f3f48}
.internal-transfer-submit{display:flex;min-height:44px;align-items:center;justify-content:center;gap:7px;border-radius:12px;background:linear-gradient(135deg,#2b8176,#23685f);color:#fff;font-family:inherit;font-size:9px;font-weight:950;box-shadow:0 9px 20px rgba(37,111,102,.20);transition:transform .15s ease,opacity .15s ease}
.internal-transfer-submit:active{transform:scale(.985)}
.internal-transfer-submit:disabled{opacity:.68;cursor:wait}
.internal-transfer-spinner{width:17px;height:17px;border:2px solid rgba(255,255,255,.38);border-top-color:#fff;border-radius:50%;animation:spin .75s linear infinite}
.internal-transfer-review-card{position:sticky;top:82px;overflow:hidden}
.internal-transfer-review-card dl{display:grid;padding:4px 12px}
.internal-transfer-review-card dl>div{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid #edf1f0}
.internal-transfer-review-card dl>div:last-child{border-bottom:0}
.internal-transfer-review-card dt{color:#81908c;font-size:7.5px;font-weight:800}
.internal-transfer-review-card dd{max-width:62%;color:#344843;font-size:8px;font-weight:950;text-align:left;overflow-wrap:anywhere}
.internal-transfer-review-card dd strong{color:#1f655c;font-size:10px}
.internal-transfer-process-note{display:flex;align-items:flex-start;gap:8px;margin:0 12px 12px;padding:9px;border-radius:11px;background:#f0f8f6;color:#4d6a63}
.internal-transfer-process-note>span{display:grid;width:28px;height:28px;flex:0 0 28px;place-items:center;border-radius:9px;background:#dff1ed;color:#2d796f}
.internal-transfer-process-note p{font-size:7px;font-weight:750;line-height:1.8}
.internal-transfer-process-note b{color:#226d64}
.internal-transfer-safety-note{display:flex;align-items:flex-start;gap:8px;padding:10px 11px;border:1px solid #e2e8e6;border-radius:13px;background:#fafcfc;color:#6d7b77}
.internal-transfer-safety-note>svg{flex:0 0 auto;color:#708c85}
.internal-transfer-safety-note p{font-size:7.5px;font-weight:800;line-height:1.8}
.internal-transfer-success{display:flex;align-items:flex-start;gap:11px;padding:14px;border:1px solid #cce8df;border-radius:18px;background:linear-gradient(145deg,#f3fbf8,#fff);box-shadow:0 10px 28px rgba(38,119,104,.08)}
.internal-transfer-success-icon{display:grid;width:48px;height:48px;flex:0 0 48px;place-items:center;border-radius:15px;background:#dff4ed;color:#267c6d}
.internal-transfer-success>div{min-width:0;flex:1}
.internal-transfer-success small{color:#548075;font-size:7.5px;font-weight:900}
.internal-transfer-success h2{margin-top:2px;color:#25453d;font-size:12px;font-weight:950}
.internal-transfer-success h2 strong{color:#1e7568}
.internal-transfer-success p{margin-top:4px;color:#6a7c77;font-size:8px;line-height:1.8}
.internal-transfer-success dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:11px}
.internal-transfer-success dl>div{padding:8px;border-radius:10px;background:#fff;border:1px solid #e0ece8}
.internal-transfer-success dt{color:#82918d;font-size:7px;font-weight:800}
.internal-transfer-success dd{margin-top:3px;color:#304a43;font-size:8px;font-weight:950;overflow-wrap:anywhere}
.internal-transfer-success-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.internal-transfer-success-actions a{display:inline-flex;min-height:34px;align-items:center;gap:5px;padding:0 10px;border-radius:10px;background:#2a786e;color:#fff;font-size:7.5px;font-weight:900}
.internal-transfer-success-actions a:last-child{border:1px solid #d8e5e1;background:#fff;color:#49645d}
.internal-transfer-modal[hidden]{display:none}
.internal-transfer-modal{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:20px}
.internal-transfer-modal-backdrop{position:absolute;inset:0;background:rgba(20,37,33,.48);backdrop-filter:blur(4px)}
.internal-transfer-modal-card{position:relative;width:min(100%,360px);padding:18px;border-radius:20px;background:#fff;text-align:center;box-shadow:0 24px 70px rgba(15,32,28,.24)}
.internal-transfer-modal-icon{display:grid;width:52px;height:52px;place-items:center;margin:0 auto;border-radius:16px;background:#e4f4f0;color:#26756b}
.internal-transfer-modal-card h2{margin-top:10px;color:#2c403a;font-size:13px;font-weight:950}
.internal-transfer-modal-card p{margin-top:5px;color:#71817c;font-size:8.5px;line-height:1.9}
.internal-transfer-modal-card p strong{color:#286d64}
.internal-transfer-modal-card>div:last-child{display:grid;grid-template-columns:1fr 1.35fr;gap:7px;margin-top:14px}
.internal-transfer-modal-card button{min-height:40px;border-radius:11px;background:#eef3f2;color:#5d6e69;font-family:inherit;font-size:8px;font-weight:950}
.internal-transfer-modal-card button:last-child{background:#28776d;color:#fff}
body.has-transfer-modal{overflow:hidden}
@media(max-width:760px){.internal-transfer-layout{grid-template-columns:1fr}.internal-transfer-review-card{position:static}.internal-transfer-heading p{display:none}.internal-transfer-success dl{grid-template-columns:1fr 1fr}.internal-transfer-success dl>div:last-child{grid-column:1/-1}}
@media(max-width:440px){.internal-transfer-source-top{align-items:stretch;flex-direction:column}.internal-transfer-source-select{width:100%}.internal-transfer-source-balance strong{font-size:15px}.internal-transfer-success{flex-direction:column}.internal-transfer-success dl{grid-template-columns:1fr}.internal-transfer-success dl>div:last-child{grid-column:auto}}

/* ========================================================================== 
   Management operations center redesign — v9.10.3
   ========================================================================== */
.management-page {
  --mg-ink: #16312d;
  --mg-muted: #738783;
  --mg-line: #dce8e5;
  --mg-green: #18765f;
  --mg-green-soft: #e9f7f1;
  --mg-amber: #b56a12;
  --mg-amber-soft: #fff5e6;
  --mg-red: #b44747;
  --mg-red-soft: #fff0ef;
  --mg-violet: #7258b5;
  --mg-violet-soft: #f1edff;
  --mg-sky: #317da5;
  --mg-sky-soft: #eaf6fc;
  background:
    radial-gradient(circle at 8% 0%, rgba(87, 187, 154, .12), transparent 28%),
    radial-gradient(circle at 92% 12%, rgba(111, 91, 188, .09), transparent 25%),
    #f4f7f6;
  color: var(--mg-ink);
}
.management-page button,
.management-page input,
.management-page select,
.management-page textarea { font-family: inherit; }
.management-shell {
  width: min(1500px, calc(100% - 28px));
  padding-block: 18px 32px;
}
.management-topbar {
  min-height: 76px;
  padding: 14px 17px;
  border: 0;
  border-radius: 22px;
  background: linear-gradient(135deg, #143e38 0%, #1c6758 58%, #277865 100%);
  box-shadow: 0 16px 38px rgba(20, 62, 56, .18);
}
.management-brand > span {
  width: 46px;
  height: 46px;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 15px;
  background: rgba(255, 255, 255, .13);
  color: #fff;
}
.management-brand small { color: rgba(255, 255, 255, .67); font-size: 10px; font-weight: 750; }
.management-brand h1 { margin-top: 2px; color: #fff; font-size: 18px; letter-spacing: -.2px; }
.management-topbar nav { gap: 8px; }
.management-topbar nav a {
  min-height: 39px;
  padding: 0 12px;
  border-color: rgba(255, 255, 255, .16);
  border-radius: 11px;
  background: rgba(255, 255, 255, .1);
  color: #fff;
  font-size: 10px;
  backdrop-filter: blur(8px);
}
.management-topbar nav a:hover { background: rgba(255, 255, 255, .18); }
.management-topbar nav a.management-logout { border-color: rgba(255, 215, 215, .2); color: #ffe4e4; }

.management-login-card {
  width: min(480px, 100%);
  padding: 26px;
  border-radius: 26px;
  box-shadow: 0 22px 65px rgba(28, 54, 49, .11);
}
.management-login-icon { width: 62px; height: 62px; border-radius: 20px; background: var(--mg-green-soft); color: var(--mg-green); }
.management-login-card > div > small { font-size: 10px; }
.management-login-card h2 { font-size: 19px; }
.management-login-card p { font-size: 11px; }
.management-login-card form > label { font-size: 11px; }
.management-password-wrap input { font-size: 14px; }
.management-login-card form > button,
.management-status-form > button { min-height: 49px; border-radius: 13px; font-size: 12px; }
.management-login-hint { font-size: 9px; }

.management-overview {
  display: grid;
  grid-template-columns: minmax(270px, .75fr) minmax(0, 1.6fr);
  gap: 15px;
  margin-top: 13px;
  padding: 17px;
  overflow: hidden;
  border: 1px solid rgba(36, 102, 87, .12);
  border-radius: 22px;
  background: linear-gradient(135deg, #f8fffc 0%, #fff 48%, #f7f5ff 100%);
  box-shadow: 0 11px 30px rgba(26, 54, 48, .055);
}
.management-overview-copy { align-self: center; padding: 3px 3px 3px 8px; }
.management-live-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 9px;
  border: 1px solid #cce8dc;
  border-radius: 999px;
  background: #effaf5;
  color: #21785e;
  font-size: 9px;
  font-weight: 900;
}
.management-live-pill i { width: 7px; height: 7px; border-radius: 50%; background: #27a978; box-shadow: 0 0 0 4px rgba(39, 169, 120, .12); }
.management-overview-copy h2 { margin: 10px 0 0; color: #173b34; font-size: 17px; line-height: 1.55; }
.management-overview-copy p { margin: 5px 0 0; color: #7e918c; font-size: 10px; line-height: 1.8; }
.management-overview-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.management-overview-metrics article {
  display: grid;
  grid-template-columns: 39px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  min-height: 87px;
  padding: 11px;
  border: 1px solid var(--metric-line, #dfe8e5);
  border-radius: 16px;
  background: var(--metric-soft, #fff);
}
.management-overview-metrics article > span { display: grid; width: 39px; height: 39px; place-items: center; border-radius: 12px; background: #fff; color: var(--metric, #26765f); box-shadow: 0 5px 14px rgba(34, 57, 52, .06); }
.management-overview-metrics small { display: block; color: #71837f; font-size: 9px; font-weight: 800; }
.management-overview-metrics strong { display: block; margin-top: 3px; overflow: hidden; color: var(--metric, #26765f); font-size: 15px; font-weight: 950; text-overflow: ellipsis; white-space: nowrap; }
.management-overview-metrics em { display: block; margin-top: 1px; color: #92a09d; font-size: 8px; font-style: normal; font-weight: 750; }
.management-overview-metrics .is-amber { --metric: var(--mg-amber); --metric-soft: var(--mg-amber-soft); --metric-line: #f0dfbd; }
.management-overview-metrics .is-green { --metric: var(--mg-green); --metric-soft: var(--mg-green-soft); --metric-line: #cde7dd; }
.management-overview-metrics .is-violet { --metric: var(--mg-violet); --metric-soft: var(--mg-violet-soft); --metric-line: #ded5fa; }
.management-overview-metrics .is-sky { --metric: var(--mg-sky); --metric-soft: var(--mg-sky-soft); --metric-line: #cfe5f0; }

.management-tabs { margin-top: 12px; padding: 6px; border-radius: 16px; box-shadow: 0 7px 22px rgba(26, 50, 45, .045); }
.management-tabs a { min-height: 47px; border-radius: 12px; font-size: 11px; }
.management-tabs a span { min-width: 25px; height: 25px; font-size: 9px; }
.management-tabs a.is-active { border-color: #bfe0d4; background: linear-gradient(135deg, #eaf8f2, #f4fbf8); box-shadow: inset 0 0 0 1px rgba(32, 125, 96, .04); }

.management-stats { gap: 10px; margin-top: 12px; }
.management-stats a {
  position: relative;
  min-height: 84px;
  overflow: hidden;
  padding: 13px;
  border-radius: 18px;
  box-shadow: 0 8px 24px rgba(25, 52, 46, .04);
}
.management-stats a::after { position: absolute; inset: auto -20px -32px auto; width: 80px; height: 80px; border-radius: 50%; background: var(--stat-soft, #edf7f3); content: ''; opacity: .8; }
.management-stats a:nth-child(1) { --stat: #376b93; --stat-soft: #e8f3fb; }
.management-stats a:nth-child(2) { --stat: #a76516; --stat-soft: #fff2dd; }
.management-stats a:nth-child(3) { --stat: #7055ad; --stat-soft: #f0ebff; }
.management-stats a:nth-child(4) { --stat: #218064; --stat-soft: #e5f6ef; }
.management-stats a.is-active { border-color: color-mix(in srgb, var(--stat) 45%, white); box-shadow: 0 9px 25px color-mix(in srgb, var(--stat) 12%, transparent); }
.management-stat-icon { width: 43px; height: 43px; flex-basis: 43px; border-radius: 13px; background: var(--stat-soft); color: var(--stat); }
.management-stats small { color: #748681; font-size: 10px; font-weight: 800; }
.management-stats strong { margin-top: 3px; color: var(--stat); font-size: 22px; }

.management-detail-card,
.management-list-card { margin-top: 12px; border-color: var(--mg-line); border-radius: 22px; box-shadow: 0 11px 32px rgba(24, 53, 47, .055); }
.management-detail-card > header,
.management-list-header { min-height: 72px; padding: 14px 17px; }
.management-detail-heading > span { width: 43px; height: 43px; border-radius: 13px; background: var(--mg-green-soft); color: var(--mg-green); }
.management-detail-heading small,
.management-list-header > div > span { font-size: 10px; font-weight: 800; }
.management-detail-heading h2,
.management-list-header h2 { font-size: 15px; }
.management-detail-heading p { font-size: 9px; }
.management-detail-actions > a { width: 37px; height: 37px; border-radius: 11px; }
.management-detail-actions .badge { min-height: 30px; padding-inline: 11px; font-size: 10px; }
.management-detail-grid { gap: 12px; padding: 14px; }
.management-withdrawal-grid { grid-template-columns: minmax(0, 1.45fr) minmax(300px, .55fr); }

.management-payment-focus {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(250px, .7fr) minmax(250px, .65fr) minmax(330px, 1fr);
  gap: 12px;
  padding: 15px;
  border: 1px solid #cde5dc;
  border-radius: 19px;
  background: linear-gradient(135deg, #f1fbf7 0%, #fff 50%, #f7f5ff 100%);
  box-shadow: inset 4px 0 0 #27836a, 0 9px 25px rgba(34, 83, 70, .06);
}
.management-payment-focus.status-rejected,
.management-payment-focus.status-cancelled { border-color: #efd2cf; background: linear-gradient(135deg, #fff4f2, #fff); box-shadow: inset 4px 0 0 #c65b52; }
.management-payment-focus.status-paid { border-color: #bfe3d3; background: linear-gradient(135deg, #eaf9f2, #fff); box-shadow: inset 4px 0 0 #21835f; }
.management-payment-focus-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; padding: 5px; }
.management-payment-focus-head > div > span { color: #728681; font-size: 10px; font-weight: 850; }
.management-payment-focus-head h3 { margin: 5px 0 0; color: #193f37; font-size: 18px; }
.management-payment-focus-head small { display: block; margin-top: 5px; color: #8a9b97; font-size: 9px; line-height: 1.65; }
.management-payment-amount {
  position: relative;
  padding: 13px;
  border: 1px solid #f0d9b1;
  border-radius: 15px;
  background: linear-gradient(145deg, #fffaf0, #fff4df);
}
.management-payment-amount > small { color: #9a7a45; font-size: 10px; font-weight: 850; }
.management-payment-amount > strong { display: block; margin-top: 4px; direction: ltr; color: #9e5d0e; font-size: clamp(21px, 2vw, 29px); font-weight: 1000; text-align: right; }
.management-payment-amount > span { color: #b28d56; font-size: 10px; font-weight: 800; }
.management-payment-amount .management-copy-button { position: absolute; top: 11px; left: 11px; }
.management-payment-destination {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 13px;
  border: 1px solid #d9d1f4;
  border-radius: 15px;
  background: linear-gradient(145deg, #fbf9ff, #f3efff);
}
.management-payment-destination > div { min-width: 0; }
.management-payment-destination small { display: block; color: #7b70a5; font-size: 10px; font-weight: 850; }
.management-payment-destination strong { display: block; margin-top: 7px; overflow-wrap: anywhere; color: #4d3d85; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: clamp(15px, 1.55vw, 20px); letter-spacing: .5px; }
.management-payment-warning { grid-column: 1 / -1; display: flex; align-items: center; gap: 9px; padding: 10px 12px; border: 1px dashed #e6cf9f; border-radius: 13px; background: rgba(255, 248, 231, .75); color: #97661e; }
.management-payment-warning p { margin: 0; }
.management-payment-warning strong { display: block; font-size: 10px; }
.management-payment-warning span { display: block; margin-top: 2px; color: #a98a58; font-size: 9px; }

.management-copy-button {
  display: inline-flex;
  min-height: 34px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 10px;
  border: 1px solid #bad9ce;
  border-radius: 10px;
  background: #fff;
  color: #23745d;
  font-size: 9px;
  font-weight: 950;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(29, 87, 70, .07);
}
.management-copy-button:hover { border-color: #7fbaa6; background: #f0faf6; transform: translateY(-1px); }
.management-copy-button.is-copied { border-color: #87c9ad; background: #e8f8f0; color: #197456; }
.management-copy-button:disabled { cursor: wait; opacity: .78; }
.management-inline-copy { display: flex; min-width: 260px; align-items: center; gap: 7px; margin-top: 6px; }
.management-inline-copy code { display: block; flex: 1; padding: 7px 9px; border: 1px solid #ddd5f2; border-radius: 9px; background: #f8f5ff; color: #523f88; font-size: 11px; font-weight: 850; letter-spacing: .35px; white-space: nowrap; }
.management-copy-toast {
  position: fixed;
  z-index: 9999;
  right: 50%;
  bottom: max(24px, env(safe-area-inset-bottom));
  min-width: 230px;
  padding: 11px 15px;
  border: 1px solid #bfe2d4;
  border-radius: 12px;
  background: #173f37;
  color: #fff;
  font-size: 11px;
  font-weight: 850;
  text-align: center;
  box-shadow: 0 14px 35px rgba(15, 45, 38, .25);
  opacity: 0;
  pointer-events: none;
  transform: translate(50%, 15px);
  transition: opacity .18s ease, transform .18s ease;
}
.management-copy-toast[data-tone='error'] { border-color: #e9b9b5; background: #7d3434; }
.management-copy-toast.is-visible { opacity: 1; transform: translate(50%, 0); }

.management-detail-info,
.management-signature-card,
.management-status-form { border-color: #dfe9e6; border-radius: 17px; }
.management-detail-info { padding: 5px 13px; }
.management-detail-info dl > div { min-height: 55px; padding: 9px 7px; }
.management-detail-info dt { font-size: 10px; font-weight: 750; }
.management-detail-info dd { font-size: 11px; }
.management-detail-info dd small { font-size: 9px; }
.management-signature-card { padding: 14px; }
.management-signature-card > span { font-size: 10px; }
.management-signature-card > div { min-height: 175px; }
.management-signature-card img { max-height: 175px; }
.management-signature-card small { font-size: 9px; }
.management-status-form { padding: 14px; background: #f8fbfa; }
.management-status-form > header > span { width: 39px; height: 39px; border-radius: 12px; }
.management-status-form h3 { font-size: 13px; }
.management-status-form header p { font-size: 9px; }
.management-form-grid { gap: 10px; }
.management-form-grid label > span { margin-bottom: 6px; font-size: 10px; }
.management-status-form input,
.management-status-form select,
.management-status-form textarea { min-height: 47px; border-radius: 11px; font-size: 12px; }
.management-status-form textarea { min-height: 90px; }
.management-status-form > button { min-width: 240px; box-shadow: 0 8px 20px rgba(23, 77, 70, .17); }

.management-list-title p { margin: 5px 0 0; color: #82918e; font-size: 9px; }
.management-list-title p strong { color: #986112; font-size: 11px; }
.management-filters { gap: 8px; }
.management-filters label { min-height: 42px; min-width: 260px; border-radius: 11px; background: #fff; }
.management-filters input { font-size: 11px; }
.management-filters select { min-height: 42px; border-radius: 11px; font-size: 10px; }
.management-filters button,
.management-filters > a { min-height: 42px; border-radius: 11px; font-size: 10px; }
.management-table-wrap { border-radius: 0 0 22px 22px; }
.management-table { min-width: 1220px; }
.management-withdrawal-table { min-width: 1340px; }
.management-table th {
  position: sticky;
  z-index: 2;
  top: 0;
  padding: 12px;
  background: #f2f7f5;
  color: #687c77;
  font-size: 9px;
}
.management-table td { min-height: 66px; padding: 12px; color: #344b46; font-size: 10px; }
.management-table tbody tr { position: relative; transition: background .16s ease, box-shadow .16s ease; }
.management-table tbody tr:hover td { background: #f9fcfb; }
.management-table tbody tr.is-clickable-row { cursor: pointer; }
.management-table tbody tr.is-selected td { background: #eef9f5; }
.management-table tbody tr.status-pending td:first-child { box-shadow: inset -4px 0 0 #d58a2f; }
.management-table tbody tr.status-reviewing td:first-child { box-shadow: inset -4px 0 0 #795eb2; }
.management-table tbody tr.status-approved td:first-child,
.management-table tbody tr.status-paid td:first-child { box-shadow: inset -4px 0 0 #2b916f; }
.management-table tbody tr.status-rejected td:first-child { box-shadow: inset -4px 0 0 #c75858; }
.management-table td > strong { font-size: 11px; }
.management-table td > small { font-size: 9px; }
.management-request-code strong { color: #376c60 !important; font-size: 12px !important; }
.management-person-cell strong,
.management-beneficiary-cell > strong { display: block; color: #213d37; font-size: 12px; }
.management-beneficiary-cell > strong { color: #574388; }
.management-money-cell { min-width: 160px; }
.management-money-cell strong { direction: ltr; color: #a36212 !important; font-size: 16px !important; text-align: right; }
.management-money-cell small { color: #a18558 !important; font-weight: 800; }
.management-date-cell { min-width: 125px; line-height: 1.8; }
.management-view-button { min-height: 36px; padding: 0 11px; border-color: #bcded2; border-radius: 10px; background: #edf9f4; color: #20745a; font-size: 10px; }
.management-view-button:hover { background: #dff4eb; }
.management-table .badge { min-height: 28px; padding-inline: 9px; font-size: 9px; }

.management-location-card { border-radius: 17px; }
.management-location-card iframe { height: 260px; }
.management-location-card p { font-size: 9px; }
.management-location-card a { min-height: 37px; font-size: 9px; }
.management-service-cell > span { width: 37px; height: 37px; flex-basis: 37px; border-radius: 11px; }
.management-service-cell strong { font-size: 11px; }
.management-address-cell { max-width: 310px; min-width: 260px; font-size: 10px !important; line-height: 1.9; }
.management-table.management-pickup-table { min-width: 1420px; }
.management-footer { padding-top: 20px; font-size: 9px; }

@media (max-width: 1180px) {
  .management-overview { grid-template-columns: 1fr; }
  .management-overview-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .management-payment-focus { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .management-payment-destination { grid-column: 1 / -1; }
}
@media (max-width: 819px) {
  .management-shell { width: min(100% - 18px, 1500px); padding-top: 10px; }
  .management-topbar { align-items: flex-start; }
  .management-brand h1 { font-size: 15px; }
  .management-overview { padding: 13px; }
  .management-overview-copy h2 { font-size: 15px; }
  .management-overview-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .management-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .management-payment-focus { grid-template-columns: 1fr; }
  .management-payment-destination,
  .management-payment-warning { grid-column: auto; }
  .management-withdrawal-grid { grid-template-columns: 1fr; }
  .management-signature-card { order: 3; }
  .management-action-panel { order: 4; }
  .management-filters label { min-width: 100%; }
  .management-copy-toast { right: 12px; left: 12px; min-width: 0; transform: translateY(15px); }
  .management-copy-toast.is-visible { transform: translateY(0); }
}
@media (max-width: 520px) {
  .management-shell { width: min(100% - 12px, 1500px); }
  .management-topbar { min-height: 68px; padding: 11px; border-radius: 18px; }
  .management-brand > span { width: 40px; height: 40px; }
  .management-brand small { font-size: 8px; }
  .management-brand h1 { font-size: 13px; }
  .management-topbar nav { gap: 4px; }
  .management-topbar nav a { min-height: 34px; padding: 0 8px; font-size: 9px; }
  .management-overview-copy { padding: 0; }
  .management-overview-copy p { font-size: 9px; }
  .management-overview-metrics { grid-template-columns: 1fr 1fr; gap: 7px; }
  .management-overview-metrics article { grid-template-columns: 34px minmax(0, 1fr); min-height: 78px; padding: 9px; }
  .management-overview-metrics article > span { width: 34px; height: 34px; }
  .management-overview-metrics small { font-size: 8px; }
  .management-overview-metrics strong { font-size: 12px; }
  .management-tabs a { min-width: 165px; min-height: 44px; font-size: 10px; }
  .management-stats a { min-height: 75px; padding: 10px; }
  .management-stat-icon { width: 38px; height: 38px; flex-basis: 38px; }
  .management-stats small { font-size: 9px; }
  .management-stats strong { font-size: 19px; }
  .management-detail-card > header,
  .management-list-header { padding: 12px; }
  .management-detail-heading h2,
  .management-list-header h2 { font-size: 13px; }
  .management-detail-grid { padding: 10px; }
  .management-payment-focus { padding: 11px; border-radius: 16px; }
  .management-payment-focus-head { flex-direction: column; }
  .management-payment-focus-head h3 { font-size: 16px; }
  .management-payment-amount > strong { font-size: 23px; }
  .management-payment-destination { align-items: flex-start; flex-direction: column; }
  .management-payment-destination .management-copy-button { width: 100%; }
  .management-payment-warning { align-items: flex-start; }
  .management-detail-info dl > div { grid-template-columns: 92px minmax(0, 1fr); }
  .management-status-form > button { min-width: 0; }
  .management-filters select,
  .management-filters button,
  .management-filters > a { flex: 1; }
}
.management-contact-copy { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.management-contact-copy b { color: #305c87; font-size: 12px; letter-spacing: .3px; }
.management-address-detail { display: flex; align-items: center; justify-content: space-between; gap: 12px; line-height: 1.9; }
.management-address-detail > span { flex: 1; }
.management-row-phone { display: flex; align-items: center; gap: 6px; margin-top: 4px; }
.management-row-phone .management-copy-button { min-height: 27px; padding-inline: 7px; font-size: 8px; }
@media (max-width: 520px) {
  .management-address-detail { align-items: flex-start; flex-direction: column; }
  .management-address-detail .management-copy-button { width: 100%; }
}
.management-table tbody tr.status-on_the_way td:first-child { box-shadow: inset -4px 0 0 #3d82a8; }
.management-table tbody tr.status-assigned td:first-child { box-shadow: inset -4px 0 0 #7459b2; }
.management-table tbody tr.status-completed td:first-child { box-shadow: inset -4px 0 0 #2b916f; }
.management-table tbody tr.status-cancelled td:first-child { box-shadow: inset -4px 0 0 #9b7676; }


/* 9.10.5 — فیلترهای فشرده وضعیت درخواست برداشت */
.management-status-chips {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 12px;
  padding: 8px;
  overflow-x: auto;
  border: 1px solid #dde9e5;
  border-radius: 15px;
  background: rgba(255, 255, 255, .88);
  box-shadow: 0 7px 22px rgba(37, 75, 66, .045);
  scrollbar-width: none;
}
.management-status-chips::-webkit-scrollbar { display: none; }
.management-status-chips a {
  --chip-color: #617771;
  --chip-soft: #f1f5f4;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 0 9px;
  border: 1px solid color-mix(in srgb, var(--chip-color) 16%, white);
  border-radius: 999px;
  background: var(--chip-soft);
  color: var(--chip-color);
  font-size: 9px;
  font-weight: 850;
  white-space: nowrap;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.management-status-chips a:hover { transform: translateY(-1px); }
.management-status-chips a svg { width: 14px; height: 14px; }
.management-status-chips a b {
  display: inline-grid;
  min-width: 21px;
  height: 21px;
  padding-inline: 5px;
  place-items: center;
  border-radius: 999px;
  background: rgba(255, 255, 255, .86);
  color: inherit;
  font-size: 9px;
  font-weight: 900;
}
.management-status-chips a.is-active {
  border-color: color-mix(in srgb, var(--chip-color) 52%, white);
  background: color-mix(in srgb, var(--chip-soft) 70%, white);
  box-shadow: 0 7px 18px color-mix(in srgb, var(--chip-color) 14%, transparent), inset 0 0 0 1px rgba(255,255,255,.7);
}
.management-status-chips .is-open { --chip-color: #176d58; --chip-soft: #e5f6ef; }
.management-status-chips .is-pending { --chip-color: #9a651c; --chip-soft: #fff2dd; }
.management-status-chips .is-reviewing { --chip-color: #6d50a9; --chip-soft: #f0ebff; }
.management-status-chips .is-approved { --chip-color: #267b65; --chip-soft: #e7f7f1; }
.management-status-chips .is-paid { --chip-color: #19704f; --chip-soft: #dcf4e9; }
.management-status-chips .is-rejected { --chip-color: #b24e4e; --chip-soft: #fff0ef; }
.management-status-chips .is-cancelled { --chip-color: #687772; --chip-soft: #eef2f1; }
.management-status-chips .is-all { --chip-color: #356b92; --chip-soft: #e8f3fb; }
@media (max-width: 520px) {
  .management-status-chips { margin-inline: -2px; padding: 7px; border-radius: 13px; }
  .management-status-chips a { min-height: 32px; padding-inline: 8px; font-size: 8.5px; }
}

/* ===== انتقال وجه: آزمایشگاه فنی یکپارچه ===== */
.internal-transfer-debug-panel{overflow:hidden;border:1px solid #dce7e4;border-radius:18px;background:#fff;box-shadow:0 9px 28px rgba(34,59,54,.05)}
.internal-transfer-debug-panel>summary{display:flex;min-height:62px;align-items:center;gap:10px;padding:12px;cursor:pointer;list-style:none;user-select:none}
.internal-transfer-debug-panel>summary::-webkit-details-marker{display:none}
.internal-transfer-debug-icon{display:grid;width:38px;height:38px;flex:0 0 38px;place-items:center;border-radius:12px;background:linear-gradient(145deg,#eee9ff,#f8f6ff);color:#6f58aa}
.internal-transfer-debug-panel>summary>span:nth-child(2){min-width:0;flex:1}
.internal-transfer-debug-panel>summary strong{display:block;color:#334640;font-size:9.5px;font-weight:950}
.internal-transfer-debug-panel>summary small{display:block;margin-top:2px;color:#82918c;font-size:7.3px;font-weight:760;line-height:1.7}
.internal-transfer-debug-panel>summary>i{display:grid;width:28px;height:28px;place-items:center;border-radius:9px;background:#f1f5f4;color:#71837e;transition:transform .18s ease}
.internal-transfer-debug-panel[open]>summary>i{transform:rotate(180deg)}
.internal-transfer-debug-body{display:grid;gap:10px;padding:0 12px 12px;border-top:1px solid #edf1f0}
.internal-transfer-debug-note{display:flex;align-items:flex-start;gap:8px;margin-top:10px;padding:10px;border:1px solid #ddd8f2;border-radius:12px;background:#f8f6ff;color:#5f547c}
.internal-transfer-debug-note>svg{flex:0 0 auto;color:#715da7}
.internal-transfer-debug-note p{font-size:7.4px;font-weight:760;line-height:1.9}
.internal-transfer-debug-note b{color:#4f3d86;font-weight:950}
.internal-transfer-debug-controls{display:grid;grid-template-columns:minmax(150px,.72fr) minmax(0,1.28fr);gap:8px}
.internal-transfer-debug-controls>button{display:flex;min-height:42px;align-items:center;justify-content:center;gap:6px;border-radius:11px;background:linear-gradient(135deg,#735eae,#5e4a98);color:#fff;font-family:inherit;font-size:8px;font-weight:950;box-shadow:0 8px 18px rgba(97,76,157,.18)}
.internal-transfer-debug-controls>button:disabled{opacity:.62;cursor:wait}
.internal-transfer-debug-toggle{display:flex;min-height:42px;align-items:center;gap:8px;padding:8px 10px;border:1px solid #e0e7e5;border-radius:11px;background:#fafcfc;cursor:pointer}
.internal-transfer-debug-toggle input{position:absolute;opacity:0;pointer-events:none}
.internal-transfer-debug-toggle>span{position:relative;width:34px;height:20px;flex:0 0 34px;border-radius:999px;background:#d8e1df;transition:.18s ease}
.internal-transfer-debug-toggle>span::after{content:"";position:absolute;top:3px;right:3px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(31,53,48,.18);transition:.18s ease}
.internal-transfer-debug-toggle input:checked+span{background:#6b56a4}
.internal-transfer-debug-toggle input:checked+span::after{transform:translateX(-14px)}
.internal-transfer-debug-toggle p{color:#596b66;font-size:7.3px;font-weight:850;line-height:1.65}
.internal-transfer-debug-status{padding:9px 10px;border-radius:10px;background:#f3f6f5;color:#61716d;font-size:7.7px;font-weight:850;line-height:1.8}
.internal-transfer-debug-status[data-tone="success"]{border:1px solid #c8e7dd;background:#f0fbf7;color:#287566}
.internal-transfer-debug-status[data-tone="error"]{border:1px solid #f0cdd1;background:#fff5f6;color:#a0444d}
.internal-transfer-debug-status[data-tone="loading"]{border:1px solid #dcd5f1;background:#f8f6ff;color:#66548f}
.internal-transfer-debug-result{overflow:hidden;border:1px solid #e0e7e5;border-radius:14px;background:#fbfcfc}
.internal-transfer-debug-result>header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px;border-bottom:1px solid #e9eeec;background:#fff}
.internal-transfer-debug-result>header small{display:block;color:#87948f;font-size:6.8px;font-weight:800}
.internal-transfer-debug-result>header h2{margin-top:2px;color:#334740;font-size:9.5px;font-weight:950}
.internal-transfer-debug-result>header button{min-height:29px;padding:0 9px;border-radius:9px;background:#f0f3f2;color:#677873;font-family:inherit;font-size:7px;font-weight:900}
.internal-transfer-debug-summary{display:flex;align-items:flex-start;gap:8px;margin:10px;padding:9px 10px;border-radius:11px}
.internal-transfer-debug-summary strong{flex:0 0 auto;font-size:7.5px;font-weight:950}
.internal-transfer-debug-summary p{font-size:7.3px;font-weight:760;line-height:1.75}
.internal-transfer-debug-summary.is-success{background:#edf9f5;color:#2a7467}
.internal-transfer-debug-summary.is-error{background:#fff1f3;color:#9d4149}
.internal-transfer-debug-steps{display:grid;gap:9px;padding:0 10px 10px}
.internal-transfer-debug-security{padding:8px 9px;border:1px dashed #d8d0ed;border-radius:10px;background:#faf8ff;color:#65568d;font-size:7.2px;font-weight:850;line-height:1.75}
.internal-transfer-debug-step{overflow:hidden;border:1px solid #e0e7e5;border-radius:12px;background:#fff}
.internal-transfer-debug-step>header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;border-bottom:1px solid #edf1f0}
.internal-transfer-debug-step>header small{display:block;color:#8a9793;font-size:6.5px;font-weight:800}
.internal-transfer-debug-step>header h3{margin-top:1px;color:#344842;font-size:9px;font-weight:950}
.internal-transfer-debug-step>header>span{display:inline-flex;min-height:24px;align-items:center;padding:0 8px;border-radius:999px;background:#f0f3f2;color:#667873;font-size:6.8px;font-weight:950}
.internal-transfer-debug-step.is-success>header>span{background:#e7f7f1;color:#277768}
.internal-transfer-debug-step.is-error>header>span{background:#ffedef;color:#a3434c}
.internal-transfer-debug-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:8px 9px}
.internal-transfer-debug-metrics>div{padding:7px;border-radius:9px;background:#f5f8f7;text-align:center}
.internal-transfer-debug-metrics small{display:block;color:#889590;font-size:6.3px;font-weight:800}
.internal-transfer-debug-metrics strong{display:block;margin-top:2px;color:#3f544e;font-size:7.7px;font-weight:950}
.internal-transfer-debug-message,.internal-transfer-debug-note-text{margin:0 9px 8px;padding:8px 9px;border-radius:9px;font-size:7.3px;font-weight:800;line-height:1.8;overflow-wrap:anywhere}
.internal-transfer-debug-message{background:#f3f7f6;color:#4f6660}
.internal-transfer-debug-step.is-error .internal-transfer-debug-message{background:#fff2f3;color:#98434b}
.internal-transfer-debug-note-text{background:#faf8ff;color:#67578f}
.internal-transfer-debug-block{margin:0 9px 8px;border:1px solid #e3e9e7;border-radius:9px;background:#fafcfc}
.internal-transfer-debug-block>summary{padding:8px 9px;cursor:pointer;list-style:none;color:#536862;font-size:7.2px;font-weight:900}
.internal-transfer-debug-block>summary::-webkit-details-marker{display:none}
.internal-transfer-debug-block[open]>summary{border-bottom:1px solid #e6ecea;background:#fff}
.internal-transfer-debug-block-toolbar{display:flex;justify-content:flex-end;padding:5px 7px 0}
.internal-transfer-debug-block-toolbar button{min-height:25px;padding:0 8px;border-radius:7px;background:#ece8f8;color:#665393;font-family:inherit;font-size:6.5px;font-weight:900}
.internal-transfer-debug-block pre{max-height:260px;overflow:auto;margin:0;padding:9px;color:#233a34;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:7px;line-height:1.7;text-align:left;white-space:pre-wrap;word-break:break-word;direction:ltr}
.internal-transfer-debug-empty{padding:14px;color:#7c8b87;font-size:7.5px;font-weight:800;text-align:center}
@media(max-width:560px){.internal-transfer-debug-controls{grid-template-columns:1fr}.internal-transfer-debug-toggle{min-height:48px}.internal-transfer-debug-block pre{font-size:6.7px}.internal-transfer-debug-metrics{gap:4px}}


/* ========================================================================
   Brand identity correction • release 9.10.10
   Supplied artwork is rendered directly: no frame, background or added shadow
   ======================================================================== */
.brand-mark--logo {
  overflow: visible;
  padding: 0;
  border: 0;
  background: transparent;
  color: transparent;
  box-shadow: none;
}

.brand-mark--logo:hover,
.brand-mark--logo:focus-visible {
  border-color: transparent;
  box-shadow: none;
}

.brand-logo-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  border-radius: 0;
  filter: none;
  box-shadow: none;
}

.login-brand-logo {
  width: 62px;
  height: 62px;
  border-radius: 0;
  box-shadow: none;
}

.app-header .brand-mark--logo {
  width: 40px;
  height: 40px;
  border-radius: 0;
  box-shadow: none;
}

@media (max-width: 420px) {
  .login-brand-logo {
    width: 58px;
    height: 58px;
    border-radius: 0;
  }

  .app-header .brand-mark--logo {
    width: 38px;
    height: 38px;
    border-radius: 0;
  }
}