:root {
      color-scheme: dark;
      --bg: #050607;
      --surface: #0d0f12;
      --surface-2: #14171b;
      --ink: #f4f5f6;
      --muted: #aeb2b8;
      --line: #2d3136;
      --primary: #9b9ea3;
      --primary-2: #7d8187;
      --accent: #686b70;
      --warn: #c2a15a;
      --ok: #5d9f73;
      --shadow: 0 18px 48px rgba(0, 0, 0, 0.38);
      --app-font-size: 15px;
      --sidebar-bg: #08090b;
      --workspace-bg: #050607;
      --logo-bg: linear-gradient(145deg, #2d3034, #111316);
      --button-gradient: linear-gradient(135deg, #25282c, #3a3e43);
      --motion: 260ms cubic-bezier(.18, .82, .22, 1);
      --android-safe-top: 0px;
      --android-safe-bottom: 0px;
      font-family: Inter, "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, Arial, sans-serif;
    }

    * { box-sizing: border-box; }

    button,
    input,
    select,
    textarea,
    .btn,
    .nav button,
    .mobile-nav-toggle,
    .panel,
    .stat,
    .section-card,
    .settings-card,
    .modal,
    .modal-backdrop,
    .login-card,
    .support-chat-widget,
    .support-chat-fab,
    .tag,
    .badge {
      transition-property: background-color, border-color, box-shadow, transform, color, opacity;
      transition-duration: var(--motion);
      transition-timing-function: cubic-bezier(.2, .8, .2, 1);
    }

    html,
    body {
      overscroll-behavior: none;
      -webkit-font-smoothing: antialiased;
      text-rendering: optimizeLegibility;
    }

    body {
      margin: 0;
      height: 100vh;
      height: 100dvh;
      min-height: 0;
      padding: 0;
      overflow: hidden;
      background:
        linear-gradient(135deg, rgba(245, 241, 232, .96), rgba(226, 235, 232, .94)),
        radial-gradient(circle at 18% 10%, rgba(15, 122, 108, .12), transparent 34%),
        radial-gradient(circle at 84% 0%, rgba(180, 65, 55, .08), transparent 30%);
      color: var(--ink);
      font-size: var(--app-font-size);
    }

    body.performance-mode {
      --motion: 150ms cubic-bezier(.2, .78, .2, 1);
      --shadow: 0 8px 22px rgba(36, 48, 58, 0.08);
    }

    body.reduced-motion * {
      transition-duration: 1ms !important;
      animation-duration: 1ms !important;
      animation-iteration-count: 1 !important;
      backdrop-filter: none !important;
      scroll-behavior: auto !important;
    }

    @media (prefers-reduced-motion: reduce) {
      *,
      *::before,
      *::after {
        transition-duration: 1ms !important;
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
      }
    }

    body.android-shell {
      --android-safe-top: max(36px, env(safe-area-inset-top));
      --android-nav-safe: max(64px, env(safe-area-inset-bottom));
      --android-service-height: 78px;
      --android-safe-bottom: var(--android-nav-safe);
    }

    button, input, select, textarea {
      font: inherit;
    }

    button {
      cursor: pointer;
    }

    .app {
      height: 100dvh;
      min-height: 0;
      display: grid;
      grid-template-columns: 258px minmax(0, 1fr);
      overflow: hidden;
    }

    body.android-shell .app {
      padding-top: var(--android-safe-top);
      padding-bottom: 0;
    }

    @media (orientation: landscape) {
      body.android-shell {
        --android-nav-safe: max(64px, env(safe-area-inset-bottom));
        --android-service-height: 0px;
      }
    }

    .app.locked {
      filter: blur(10px);
      pointer-events: none;
      user-select: none;
    }

    .login-screen {
      position: fixed;
      inset: 0;
      display: grid;
      place-items: center;
      padding: max(14px, env(safe-area-inset-top)) 20px max(14px, env(safe-area-inset-bottom));
      background:
        linear-gradient(135deg, rgba(15, 122, 108, .88), rgba(22, 36, 42, .92)),
        radial-gradient(circle at 20% 10%, rgba(255,255,255,.2), transparent 30%);
      z-index: 50;
      overflow: auto;
    }

    #modalRoot {
      position: relative;
      z-index: 1200;
    }

    .login-card {
      width: min(460px, 100%);
      max-height: calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
      overflow: auto;
      display: grid;
      gap: 16px;
      padding: 24px;
      border: 1px solid rgba(255,255,255,.32);
      border-radius: 14px;
      background: rgba(255,255,255,.9);
      box-shadow: 0 30px 90px rgba(0,0,0,.28);
      backdrop-filter: blur(22px);
      animation: modalIn 280ms cubic-bezier(.16, .84, .22, 1) both;
      will-change: transform, opacity;
    }

    .login-card.activation-login-card {
      width: min(920px, 100%);
      grid-template-columns: minmax(0, 1.12fr) minmax(300px, .88fr);
      align-items: start;
      gap: 18px;
      position: relative;
      max-height: calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
      overscroll-behavior: contain;
      padding-bottom: max(24px, env(safe-area-inset-bottom));
    }

    .activation-main-panel,
    .activation-side-panel {
      display: grid;
      gap: 14px;
      min-width: 0;
    }

    .activation-heading {
      display: grid;
      grid-template-columns: 64px minmax(0, 1fr) auto;
      gap: 14px;
      align-items: center;
    }

    .activation-heading-wide {
      grid-column: 1 / -1;
    }

    .activation-heading-copy {
      display: grid;
      gap: 6px;
      min-width: 0;
    }

    .activation-heading-copy h2 {
      padding-right: 0;
    }

    .activation-top-actions {
      position: absolute;
      right: 18px;
      top: 18px;
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }

    .activation-login-card h2 {
      padding-right: 176px;
    }

    .activation-actions-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }

    .activation-legal-strip {
      align-self: end;
      display: grid;
      gap: 10px;
      padding: 12px;
      border: 1px solid var(--line);
      border-radius: 10px;
      background: rgba(255,255,255,.72);
    }

    .activation-legal-strip .row-actions {
      margin-top: 0;
    }

    .activation-purchase-modal {
      width: min(760px, calc(100vw - 24px));
      max-height: min(870px, calc(100dvh - 34px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));
      overflow-y: auto;
      overflow-x: hidden;
      padding-bottom: max(120px, calc(env(safe-area-inset-bottom) + 112px));
      scroll-padding-bottom: 120px;
    }

    .activation-purchase-actions {
      position: fixed;
      left: 50%;
      bottom: max(28px, calc(env(safe-area-inset-bottom) + 22px));
      transform: translateX(-50%);
      width: min(710px, calc(100vw - 64px));
      z-index: 3;
      margin: 0;
      padding: 10px 16px max(12px, env(safe-area-inset-bottom));
      background: linear-gradient(180deg, rgba(255,255,255,.72), #fff 34%);
      border-top: 1px solid rgba(38, 59, 68, .12);
      box-shadow: 0 -14px 24px rgba(15, 35, 42, .08);
    }

    .login-logo {
      position: relative;
      width: 58px;
      height: 58px;
      display: grid;
      place-items: center;
      border-radius: 14px;
      background: #071522 url("assets/shopsrm-icon-256.png") center / contain no-repeat;
      color: #fff;
      font-weight: 900;
      letter-spacing: 0;
      box-shadow: 0 14px 36px rgba(8,220,220,.2);
      overflow: hidden;
      font-size: 0;
    }

    .login-logo::before {
      content: none;
      position: absolute;
      inset: 14px 12px 20px;
      border-top: 4px solid rgba(255,255,255,.96);
      border-bottom: 4px solid rgba(255,255,255,.9);
      box-shadow: 0 9px 0 rgba(255,255,255,.94);
      border-radius: 3px;
    }

    .login-logo::after {
      content: none;
      position: absolute;
      width: 9px;
      height: 9px;
      right: 12px;
      bottom: 10px;
      border-radius: 999px;
      background: rgba(255,255,255,.96);
      box-shadow: -14px 0 0 rgba(255,255,255,.76);
    }

    .login-card h2 {
      margin: 0;
      font-size: 28px;
    }

    .login-card p {
      margin: 0;
      color: var(--muted);
    }

    .purchase-quote {
      display: grid;
      gap: 10px;
      padding: 14px;
      border: 1px solid rgba(15, 122, 108, .24);
      border-radius: 12px;
      background: linear-gradient(180deg, rgba(15, 122, 108, .1), rgba(255,255,255,.86));
    }

    .purchase-quote strong {
      font-size: 22px;
      color: var(--accent-strong);
    }

    .purchase-quote small {
      color: var(--muted);
      line-height: 1.45;
    }

    .demo-welcome-card {
      width: min(680px, 100%);
      display: grid;
      gap: 18px;
    }

    .demo-welcome-card .demo-actions {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }

    .demo-version-pill {
      width: fit-content;
      padding: 6px 10px;
      border-radius: 999px;
      background: rgba(245, 158, 11, .16);
      color: #92400e;
      font-weight: 800;
      font-size: 12px;
      text-transform: uppercase;
      letter-spacing: .03em;
    }

    .demo-banner {
      position: fixed;
      top: max(8px, env(safe-area-inset-top));
      left: 50%;
      transform: translateX(-50%);
      z-index: 1600;
      margin: 0;
      padding: 4px 10px;
      border: 1px solid rgba(245, 158, 11, .36);
      border-radius: 999px;
      background: rgba(255, 251, 235, .62);
      color: #78350f;
      font-size: 11px;
      font-weight: 800;
      box-shadow: 0 10px 22px rgba(120, 53, 15, .08);
      backdrop-filter: blur(10px);
      pointer-events: none;
    }

    body.demo-mode .subscription-banner {
      display: none !important;
    }

    @media (max-width: 560px) {
      .demo-welcome-card .demo-actions {
        grid-template-columns: 1fr;
      }
      .login-card.activation-login-card {
        grid-template-columns: 1fr;
        width: min(100%, 560px);
        padding: 18px;
      }
      .activation-login-card h2 {
        padding-right: 0;
      }
      .activation-heading {
        grid-template-columns: 58px minmax(0, 1fr);
      }
      .activation-heading .btn {
        grid-column: 1 / -1;
        width: 100%;
      }
      .activation-top-actions {
        position: static;
        justify-content: stretch;
      }
      .activation-top-actions .btn,
      .activation-actions-grid {
        width: 100%;
      }
      .activation-actions-grid {
        grid-template-columns: 1fr;
      }
    }

    .activation-qr-card {
      display: grid;
      grid-template-columns: 112px minmax(0, 1fr);
      gap: 12px;
      align-items: center;
      padding: 10px;
      border: 1px solid rgba(15, 122, 108, .22);
      border-radius: 12px;
      background: rgba(15, 122, 108, .06);
    }

    .activation-qr-card img {
      width: 112px;
      height: 112px;
      border-radius: 10px;
      background: #fff;
      object-fit: contain;
    }

    .activation-qr-card span {
      color: var(--muted);
      font-size: 13px;
      line-height: 1.35;
    }

    .activation-qr-modal {
      width: min(460px, calc(100vw - 24px));
      margin-inline: auto;
      text-align: center;
    }

    .activation-qr-large {
      display: grid;
      gap: 14px;
      place-items: center;
      text-align: center;
      justify-content: center;
      justify-items: center;
      margin-inline: auto;
    }

    .activation-qr-large img {
      width: min(420px, 82vw, calc(100dvh - 230px));
      height: min(420px, 82vw, calc(100dvh - 230px));
      border-radius: 18px;
      background: #fff;
      padding: 10px;
      object-fit: contain;
    }

    .section-card {
      display: grid;
      gap: 12px;
      padding: 14px;
      border: 1px solid rgba(15, 122, 108, .18);
      border-radius: 14px;
      background: rgba(255,255,255,.72);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.72);
    }

    .section-card h3 {
      margin: 0;
      font-size: 17px;
      letter-spacing: 0;
    }

    .sidebar {
      position: sticky;
      top: 0;
      height: 100vh;
      display: grid;
      grid-template-rows: auto 1fr auto;
      gap: 16px;
      padding: 18px;
      background: var(--sidebar-bg);
      color: #edf6f3;
      border-right: 1px solid rgba(255,255,255,0.08);
    }

    .app-exit-button {
      position: absolute;
      top: max(12px, env(safe-area-inset-top));
      right: 12px;
      z-index: 4;
      width: 34px;
      height: 34px;
      display: grid;
      place-items: center;
      border: 1px solid rgba(255,255,255,.18);
      border-radius: 10px;
      background: rgba(255,255,255,.08);
      color: #f2f8f6;
      font-size: 20px;
      font-weight: 900;
      line-height: 1;
      cursor: pointer;
    }

    .app-exit-button:hover {
      border-color: rgba(255,183,173,.58);
      background: rgba(180,65,55,.28);
      transform: translateY(-1px);
    }

    body.windows-shell .app-exit-button {
      display: none;
    }

    body.android-shell .sidebar {
      position: relative;
    }

    body.android-shell .app-exit-button {
      top: 6px;
      right: 10px;
    }

    body.android-shell .shift-box.as-nav-note {
      margin-bottom: 0;
    }

    .brand {
      display: flex;
      align-items: center;
      gap: 12px;
      min-width: 0;
      cursor: pointer;
      border: 0;
      background: transparent;
      color: inherit;
      padding: 0 38px 0 0;
      text-align: left;
    }

    .brand-mark {
      position: relative;
      width: 50px;
      height: 50px;
      display: grid;
      place-items: center;
      border-radius: 14px;
      background: #071522 url("assets/shopsrm-icon-256.png") center / contain no-repeat;
      color: #ffffff;
      font-weight: 900;
      letter-spacing: .5px;
      box-shadow: 0 14px 30px rgba(0,0,0,.22), 0 0 0 1px rgba(84,238,238,.18);
      overflow: hidden;
      font-size: 0;
      border: 1px solid rgba(128,245,245,.34);
    }

    .brand-mark::before {
      content: none;
      position: absolute;
      width: 23px;
      height: 18px;
      border-radius: 7px 7px 4px 4px;
      border: 3px solid rgba(255,255,255,.96);
      border-bottom-width: 5px;
      transform: translateY(2px);
    }

    .brand-mark::after {
      content: none;
      position: absolute;
      width: 7px;
      height: 7px;
      right: 9px;
      bottom: 8px;
      border-radius: 999px;
      background: #fff;
      box-shadow: -13px 0 0 rgba(255,255,255,.86);
    }

    .brand-mark img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: contain;
    }

    .brand-mark.has-custom-logo {
      background: #071522;
    }

    .settings-logo-row {
      display: grid;
      grid-template-columns: auto minmax(180px, 1fr) auto;
      gap: 12px;
      align-items: end;
      padding: 12px;
      border: 1px solid rgba(15, 122, 108, .18);
      border-radius: 16px;
      background: rgba(255,255,255,.64);
    }

    .settings-logo-preview {
      width: 58px;
      height: 58px;
      border-radius: 16px;
      flex: 0 0 auto;
    }

    .brand h1 {
      margin: 0;
      font-size: 16px;
      line-height: 1.1;
      letter-spacing: 0;
    }

    .brand span {
      display: block;
      margin-top: 4px;
      color: #adc0c5;
      font-size: 12px;
    }

    .brand.network-setup-needed {
      position: relative;
      padding: 8px 38px 8px 8px;
      border-radius: 12px;
      background: linear-gradient(135deg, rgba(52, 179, 153, .18), rgba(255,255,255,.07));
      box-shadow: 0 0 0 1px rgba(121, 245, 218, .22), 0 12px 28px rgba(0,0,0,.16);
    }

    .brand.network-setup-needed::after {
      content: "Настройте сеть";
      position: absolute;
      right: 8px;
      top: -8px;
      padding: 3px 7px;
      border-radius: 999px;
      background: #8ff0ba;
      color: #08241d;
      font-size: 10px;
      font-weight: 900;
      white-space: nowrap;
    }

    .profile {
      display: none;
      gap: 9px;
      padding: 12px;
      border: 1px solid rgba(255,255,255,0.12);
      border-radius: 8px;
      background: rgba(255,255,255,0.06);
    }

    .profile label {
      color: #adc0c5;
      font-size: 12px;
    }

    .profile .seller-name {
      color: #fff;
      font-weight: 800;
      font-size: 15px;
    }

    .profile select,
    .profile input {
      width: 100%;
      min-height: 38px;
      border: 1px solid rgba(255,255,255,0.14);
      border-radius: 6px;
      padding: 8px 10px;
      background: #233238;
      color: #fff;
    }

    .quick-profile-button,
    .quick-support-button,
    .quick-support-create-button,
    .quick-purchase-button {
      width: 100%;
      min-height: 36px;
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 2px;
      align-items: center;
      border: 1px solid rgba(255,255,255,.18);
      border-radius: 8px;
      background: rgba(18, 123, 107, .22);
      color: #eef8f6;
      font-weight: 850;
      text-align: center;
    }

    .quick-support-create-button {
      position: relative;
      background: linear-gradient(135deg, rgba(52,179,153,.34), rgba(143,240,186,.16));
      border-color: rgba(143,240,186,.44);
    }

    .support-unread-badge {
      position: absolute;
      right: -5px;
      top: -7px;
      min-width: 20px;
      height: 20px;
      display: grid;
      place-items: center;
      padding: 0 5px;
      border-radius: 999px;
      background: #d93636;
      color: #fff;
      font-size: 11px;
      font-weight: 900;
      box-shadow: 0 0 0 2px #122229;
    }

    .quick-profile-button span {
      color: rgba(255,255,255,.68);
      font-size: 11px;
      font-weight: 800;
    }

    .quick-profile-button strong {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      font-size: 12px;
    }

    .quick-purchase-button {
      grid-column: 1 / -1;
      min-height: 34px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border: 1px solid rgba(37, 182, 255, .42);
      border-radius: 7px;
      background: var(--button-gradient);
      color: #fff;
      font: inherit;
      font-size: 12px;
      font-weight: 800;
      cursor: pointer;
      transition: transform var(--motion), filter var(--motion), box-shadow var(--motion);
    }

    .quick-purchase-button:hover {
      filter: brightness(1.08);
      box-shadow: 0 8px 20px rgba(37, 121, 255, .2);
      transform: translateY(-1px);
    }

    .sidebar-service-divider {
      height: 1px;
      background: rgba(255,255,255,.13);
    }

    .nav {
      display: grid;
      align-content: start;
      gap: 6px;
    }

    .mobile-nav-toggle {
      display: none;
      width: 100%;
      min-height: 44px;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 9px;
      padding: 9px 12px;
      background: rgba(255,255,255,.09);
      color: #fff;
      font-weight: 850;
    }

    .mobile-nav-toggle small {
      color: rgba(255,255,255,.62);
      font-size: 11px;
      font-weight: 750;
    }

    .nav button {
      width: 100%;
      min-height: 42px;
      display: grid;
      grid-template-columns: 28px 1fr auto;
      align-items: center;
      gap: 8px;
      border: 0;
      border-radius: 7px;
      padding: 8px 10px;
      background: transparent;
      color: #dce9e8;
      text-align: left;
      font-size: 13px;
      font-weight: 750;
    }

    .nav button.active,
    .nav button:hover {
      background: rgba(255,255,255,0.11);
      color: #fff;
    }

    .badge {
      min-width: 24px;
      padding: 2px 7px;
      border-radius: 999px;
      background: rgba(255,255,255,0.12);
      color: #dce9e8;
      font-size: 12px;
      text-align: center;
    }

    .shift-box {
      display: grid;
      gap: 10px;
      padding-top: 14px;
      border-top: 1px solid rgba(255,255,255,0.1);
      color: #c7d6da;
      font-size: 13px;
    }

    .quick-sync-button {
      width: 100%;
      min-height: 34px;
      border: 1px solid rgba(255,255,255,.18);
      border-radius: 8px;
      background: rgba(255,255,255,.08);
      color: #eef8f6;
      font-weight: 800;
    }

    .quick-sync-button:hover {
      background: rgba(255,255,255,.15);
      transform: translateY(-1px);
    }

    .quick-support-button {
      width: 100%;
      min-height: 34px;
      border: 1px solid rgba(52,179,153,.36);
      border-radius: 8px;
      background: rgba(52,179,153,.13);
      color: #eef8f6;
      font-weight: 800;
    }

    .quick-support-button:hover {
      background: rgba(52,179,153,.22);
      transform: translateY(-1px);
    }

    .support-modal-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    .support-card {
      display: grid;
      gap: 10px;
      justify-items: center;
      padding: 14px;
      border: 1px solid rgba(15, 122, 108, .18);
      border-radius: 14px;
      background: rgba(255,255,255,.72);
      text-align: center;
    }

    .support-logo {
      width: 56px;
      height: 56px;
      display: grid;
      place-items: center;
      border-radius: 16px;
      color: #fff;
      font-size: 28px;
      font-weight: 900;
      text-decoration: none;
      box-shadow: 0 12px 30px rgba(0,0,0,.13);
    }

    .support-logo.telegram { background: linear-gradient(135deg, #2aabee, #168acd); }
    .support-logo.whatsapp { background: linear-gradient(135deg, #25d366, #128c7e); }

    .support-qr {
      width: min(320px, 84vw);
      height: min(320px, 84vw);
      object-fit: contain;
      border-radius: 18px;
      background: #fff;
      border: 1px solid rgba(15, 122, 108, .18);
      padding: 10px;
      margin: 0 auto;
    }

    .support-chat {
      display: grid;
      gap: 12px;
      text-align: left;
    }

    .support-thread-list,
    .support-message-list {
      display: grid;
      gap: 8px;
      max-height: 260px;
      overflow: auto;
      padding-right: 4px;
    }

    .support-thread-row,
    .support-message {
      border: 1px solid rgba(127, 238, 216, .14);
      border-radius: 12px;
      background: rgba(18, 36, 43, .88);
      padding: 10px;
      color: #eaf7f4;
    }

    .support-thread-row.active {
      border-color: rgba(143,240,186,.56);
      background: rgba(52,179,153,.2);
    }

    .support-message.owner {
      background: rgba(32, 78, 91, .92);
      margin-left: 28px;
    }

    .support-message.store {
      background: rgba(13, 55, 50, .92);
      margin-right: 28px;
    }

    .support-message.system {
      background: rgba(143, 240, 186, .12);
      margin: 0 16px;
      color: #d9fff4;
    }

    .support-status-pill {
      display: inline-flex;
      width: max-content;
      padding: 3px 8px;
      border-radius: 999px;
      background: rgba(15,122,108,.12);
      color: #0b5f54;
      font-size: 12px;
      font-weight: 900;
    }

    .support-chat-fab {
      position: fixed;
      right: 18px;
      bottom: max(18px, calc(env(safe-area-inset-bottom) + 18px));
      z-index: 900;
      width: 52px;
      height: 52px;
      border: 0;
      border-radius: 18px;
      background: #10242b;
      color: #dffaf5;
      box-shadow: 0 18px 40px rgba(8,22,28,.28);
      font-size: 22px;
      font-weight: 900;
    }

    .support-chat-widget {
      position: fixed;
      right: 18px;
      bottom: max(82px, calc(env(safe-area-inset-bottom) + 82px));
      z-index: 901;
      width: min(380px, calc(100vw - 28px));
      max-height: min(560px, calc(100dvh - 120px));
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
      overflow: hidden;
      border-radius: 14px;
      border: 1px solid rgba(15,122,108,.2);
      background: rgba(15, 30, 36, .98);
      box-shadow: 0 22px 54px rgba(8,22,28,.26);
      color: #eaf7f4;
    }

    .support-chat-widget .modal-head {
      border-radius: 0;
    }

    .support-chat-widget-body {
      display: grid;
      gap: 8px;
      overflow: auto;
      padding: 12px;
    }

    .support-chat-widget-form {
      display: grid;
      gap: 8px;
      padding: 12px;
      border-top: 1px solid rgba(127,238,216,.14);
      background: #10242b;
    }

    .support-chat-widget-form textarea {
      min-height: 70px;
      resize: vertical;
    }

    .support-attachment-line {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      padding: 8px 10px;
      border: 1px dashed rgba(15, 122, 108, .28);
      border-radius: 10px;
      background: rgba(52,179,153,.08);
      font-size: 12px;
      color: var(--muted);
    }

    .support-create-modal {
      background: #10242b;
      color: #eaf7f4;
    }

    .support-create-modal .panel-body,
    .support-create-modal .support-card,
    .support-create-modal .table-notice {
      background: #132a31;
      color: #eaf7f4;
      border-color: rgba(127,238,216,.16);
    }

    .support-create-modal input,
    .support-create-modal textarea,
    .support-create-modal select,
    .support-chat-widget input,
    .support-chat-widget textarea,
    .support-chat-widget select {
      background: #0c1d23;
      color: #ecfbf7;
      border-color: rgba(127,238,216,.22);
    }

    .support-create-modal .muted,
    .support-create-modal small,
    .support-chat-widget .muted,
    .support-message .muted {
      color: rgba(234,247,244,.64);
    }

    .support-create-modal a {
      color: #8ff0ba;
    }

    .support-drop-zone {
      display: grid;
      place-items: center;
      min-height: 86px;
      padding: 12px;
      border: 1px dashed rgba(143,240,186,.42);
      border-radius: 12px;
      background: rgba(52,179,153,.08);
      color: rgba(234,247,244,.76);
      text-align: center;
    }

    .support-drop-zone.dragover {
      border-color: #8ff0ba;
      background: rgba(143,240,186,.16);
    }

    .support-attachment-line input {
      max-width: 190px;
      font-size: 12px;
    }

    .sensitive-blur {
      filter: blur(6px);
      user-select: none;
      pointer-events: none;
    }

    .shift-state-line {
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .shift-lamp {
      width: 10px;
      height: 10px;
      border-radius: 999px;
      background: #7e898b;
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.2);
    }

    .shift-lamp.open {
      background: #48d88f;
      box-shadow: 0 0 0 4px rgba(72,216,143,.12), 0 0 18px rgba(72,216,143,.7);
      animation: pulseLamp 1.35s ease-in-out infinite;
    }

    .sync-state {
      margin-top: 8px;
      font-size: 12px;
      color: rgba(255,255,255,.68);
      line-height: 1.35;
    }

    .sync-state strong { color: #eef8f6; font-weight: 800; }
    .sync-state span { color: rgba(255,255,255,.48); font-size: 11px; }
    .sync-state.ok strong { color: #8ff0ba; }
    .sync-state.error strong { color: #ffb7ad; }

    .shift-box.as-nav-note #shiftMeta,
    .shift-box.as-nav-note #shiftEmail {
      display: none;
    }

    .shift-box.as-nav-note {
      color: #adc0c5;
    }

    .network-setup-card {
      border: 1px solid rgba(15, 122, 108, .18);
      background: linear-gradient(135deg, rgba(15,122,108,.12), rgba(255,255,255,.92));
    }

    .network-setup-hint {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      gap: 12px;
      align-items: center;
      padding: 12px;
      border-radius: 14px;
      border: 1px solid rgba(15,122,108,.18);
      background: rgba(15,122,108,.08);
      color: #123139;
    }

    .network-setup-hint .arrow {
      width: 42px;
      height: 42px;
      display: grid;
      place-items: center;
      border-radius: 999px;
      background: #0f7a6c;
      color: #fff;
      font-weight: 900;
      font-size: 24px;
      box-shadow: 0 12px 28px rgba(15,122,108,.22);
    }

    .network-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    .network-card {
      display: grid;
      gap: 10px;
      min-width: 0;
      padding: 12px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: #fff;
    }

    .network-card.wide {
      grid-column: 1 / -1;
    }

    .network-card h4 {
      margin: 0;
      font-size: 14px;
    }

    .network-metrics {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 8px;
    }

    .network-metric {
      padding: 10px;
      border-radius: 12px;
      background: #eef6f3;
      border: 1px solid rgba(15,122,108,.12);
    }

    .network-metric span {
      display: block;
      color: var(--muted);
      font-size: 11px;
      margin-bottom: 4px;
    }

    .network-metric strong {
      font-size: 18px;
    }

    .network-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 7px;
    }

    .network-log-list {
      display: grid;
      gap: 8px;
      max-height: 240px;
      overflow: auto;
      padding-right: 4px;
    }

    .network-log-item {
      padding: 9px 10px;
      border-radius: 12px;
      background: #f3f7f5;
      border: 1px solid rgba(0,0,0,.05);
      font-size: 12px;
    }

    .integrations-center {
      display: grid;
      gap: 14px;
      color: #eaf7f4;
    }

    .integration-card-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    .integration-card {
      display: grid;
      gap: 10px;
      min-width: 0;
      padding: 13px;
      border: 1px solid rgba(127,238,216,.15);
      border-radius: 14px;
      background: linear-gradient(145deg, #10242b, #142f37);
      color: #eaf7f4;
      box-shadow: 0 12px 26px rgba(8,22,28,.12);
    }

    .integration-card-head {
      display: grid;
      grid-template-columns: 42px minmax(0, 1fr) auto;
      gap: 10px;
      align-items: center;
    }

    .integration-icon {
      width: 42px;
      height: 42px;
      display: grid;
      place-items: center;
      border-radius: 14px;
      background: rgba(143,240,186,.14);
      border: 1px solid rgba(143,240,186,.25);
      color: #8ff0ba;
      font-weight: 950;
      font-size: 18px;
    }

    .integration-status {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 26px;
      padding: 4px 8px;
      border-radius: 999px;
      font-size: 11px;
      font-weight: 900;
      white-space: nowrap;
      border: 1px solid rgba(255,255,255,.12);
    }

    .integration-status.green { background: rgba(72,216,143,.16); color: #95f2bf; }
    .integration-status.red { background: rgba(255,96,82,.16); color: #ffb7ad; }
    .integration-status.gold { background: rgba(236,174,75,.16); color: #f6d28f; }
    .integration-status.blue { background: rgba(88,166,255,.16); color: #aad1ff; }
    .integration-status.gray { background: rgba(255,255,255,.08); color: rgba(234,247,244,.7); }

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

    .integration-metric {
      padding: 8px;
      border-radius: 11px;
      background: rgba(255,255,255,.06);
      border: 1px solid rgba(255,255,255,.08);
      font-size: 12px;
    }

    .integration-metric span {
      display: block;
      color: rgba(234,247,244,.58);
      font-size: 10px;
      margin-bottom: 3px;
    }

    .integration-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 7px;
    }

    .integration-panel-dark {
      background: #10242b;
      border-color: rgba(127,238,216,.16);
      color: #eaf7f4;
    }

    .integration-panel-dark input,
    .integration-panel-dark textarea,
    .integration-panel-dark select {
      background: #0c1d23;
      color: #ecfbf7;
      border-color: rgba(127,238,216,.22);
    }

    .integration-log-list {
      display: grid;
      gap: 8px;
      max-height: 280px;
      overflow: auto;
      padding-right: 4px;
    }

    .integration-log-item {
      padding: 9px 10px;
      border-radius: 12px;
      background: rgba(255,255,255,.06);
      border: 1px solid rgba(255,255,255,.08);
      font-size: 12px;
      color: #eaf7f4;
    }

    .integration-test-modal {
      width: min(920px, calc(100vw - 24px));
    }

    .shift-actions {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
    }

    .row-between {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      min-width: 0;
    }

    .row-between > * {
      min-width: 0;
    }

    .main {
      min-width: 0;
      min-height: 0;
      padding: 22px;
      background: color-mix(in srgb, var(--workspace-bg) var(--ui-alpha, 100%), transparent);
      backdrop-filter: blur(var(--ui-blur, 0px));
      display: grid;
      grid-template-rows: auto minmax(0, 1fr);
      gap: 14px;
      overflow: hidden;
      transition: background-color 180ms ease;
    }

    body.android-shell .main {
      padding-bottom: max(14px, calc(var(--android-nav-safe) + 8px));
    }

    @media (orientation: portrait) {
    body.android-shell .shift-box.as-nav-note {
      position: fixed;
      left: max(12px, env(safe-area-inset-left));
      right: max(12px, env(safe-area-inset-right));
      bottom: max(10px, calc(env(safe-area-inset-bottom) + 10px));
      z-index: 45;
      min-height: var(--android-service-height);
      display: grid;
      grid-template-columns: minmax(98px, .46fr) minmax(118px, .55fr) minmax(132px, .62fr) minmax(0, 1.15fr);
      grid-template-areas:
        "profile support create syncstate"
        "sync sync shift syncstate";
      gap: 8px 10px;
      align-items: center;
      padding: 10px 12px;
      border: 1px solid rgba(255,255,255,.16);
      border-radius: 18px;
      background: rgba(18, 31, 36, .94);
      box-shadow: 0 18px 48px rgba(6, 15, 20, .28);
      backdrop-filter: blur(18px);
      color: #d8e8e7;
    }
    }

    @media (orientation: landscape) {
    body.android-shell .shift-box.as-nav-note {
      position: static;
      left: auto;
      right: auto;
      bottom: auto;
      z-index: auto;
      min-height: auto;
      display: grid;
      grid-template-columns: 1fr;
      grid-template-areas:
        "profile"
        "support"
        "create"
        "sync"
        "shift"
        "syncstate";
      gap: 8px;
      padding: 10px 0 0;
      border: 0;
      border-top: 1px solid rgba(255,255,255,.1);
      border-radius: 0;
      background: transparent;
      box-shadow: none;
      backdrop-filter: none;
    }
    }

    body.android-shell .shift-box.as-nav-note .quick-support-button {
      grid-area: support;
    }

    body.android-shell .shift-box.as-nav-note .quick-support-create-button {
      grid-area: create;
    }

    body.android-shell .shift-box.as-nav-note .quick-profile-button {
      grid-area: profile;
    }

    body.android-shell .shift-box.as-nav-note .sidebar-service-divider {
      display: none;
    }

    body.android-shell .shift-box.as-nav-note .quick-sync-button {
      grid-area: sync;
    }

    body.android-shell .shift-box.as-nav-note .shift-state-line {
      grid-area: shift;
      min-width: 0;
    }

    body.android-shell .shift-box.as-nav-note #syncState {
      grid-area: syncstate;
      margin: 0;
      text-align: right;
      min-width: 0;
    }

    body.android-shell .shift-box.as-nav-note #syncState strong,
    body.android-shell .shift-box.as-nav-note #syncState span {
      display: inline;
    }

    body.android-shell .shift-box.as-nav-note #shiftMeta,
    body.android-shell .shift-box.as-nav-note #shiftEmail {
      display: none;
    }

    .topline {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      margin-bottom: 0;
      padding: 18px;
      min-height: 94px;
      border: 1px solid rgba(216, 224, 230, .78);
      border-radius: 12px;
      background: rgba(251, 250, 246, .72);
      box-shadow: 0 12px 30px rgba(36,48,58,.07);
      backdrop-filter: blur(14px);
      contain: layout paint;
    }

    .topline > div:first-child {
      min-width: 0;
    }

    .topline h2 {
      margin: 0;
      font-size: 28px;
      letter-spacing: 0;
      color: #142029;
    }

    .topline p {
      margin: 6px 0 0;
      color: var(--muted);
    }

    .busy-indicator {
      position: fixed;
      top: calc(env(safe-area-inset-top) + 12px);
      right: 18px;
      z-index: 80;
      display: inline-flex;
      align-items: center;
      gap: 9px;
      padding: 9px 13px;
      border: 1px solid rgba(216, 224, 230, .92);
      border-radius: 999px;
      background: rgba(251, 250, 246, .96);
      box-shadow: 0 14px 36px rgba(36,48,58,.14);
      color: #142029;
      font-weight: 800;
      pointer-events: none;
    }

    .busy-indicator::before {
      content: "";
      width: 14px;
      height: 14px;
      border-radius: 999px;
      border: 2px solid rgba(15,122,108,.22);
      border-top-color: var(--primary);
      animation: spin 650ms linear infinite;
    }

    .actions {
      display: flex;
      flex-wrap: wrap;
      gap: 9px;
      justify-content: flex-end;
    }

    .btn {
      min-height: 38px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      border: 1px solid var(--line);
      border-radius: 7px;
      padding: 8px 12px;
      background: var(--surface);
      color: var(--ink);
      font-weight: 600;
      letter-spacing: .01em;
      min-width: 0;
      max-width: 100%;
      white-space: normal;
      overflow-wrap: anywhere;
      line-height: 1.22;
      transition: transform 150ms ease, border-color 150ms ease, background 150ms ease, box-shadow 150ms ease;
    }

    .btn.primary {
      border-color: var(--primary);
      background: var(--button-gradient);
      color: #fff;
      box-shadow: 0 10px 24px rgba(15,122,108,.18);
    }

    .btn:hover {
      transform: translateY(-1px);
      border-color: color-mix(in srgb, var(--primary) 55%, var(--line));
      box-shadow: 0 10px 24px rgba(15, 122, 108, .16);
    }

    .btn.primary:hover {
      background: var(--button-gradient);
      box-shadow: 0 12px 28px rgba(15, 122, 108, .24);
    }

    .btn.danger {
      border-color: #e3b9b5;
      color: #9a2b23;
    }

    .btn.ghost {
      background: transparent;
    }

    .btn.small {
      min-height: 32px;
      padding: 6px 9px;
      font-size: 13px;
    }

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

    .grid {
      display: grid;
      gap: 14px;
    }

    .stats {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 12px;
      margin-bottom: 16px;
    }

    .dashboard-stats {
      grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .stat {
      min-height: 102px;
      padding: 16px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--surface);
      box-shadow: 0 8px 24px rgba(36,48,58,.06);
    }

    .report-card-green { background: linear-gradient(135deg, #dff8eb, #aee7cc); border-color: #8bd9bb; }
    .report-card-blue { background: linear-gradient(135deg, #e1efff, #aecdf7); border-color: #8eb9ef; }
    .report-card-gold { background: linear-gradient(135deg, #fff1c9, #eccb73); border-color: #deb755; }
    .report-card-red { background: linear-gradient(135deg, #ffe0da, #efa79c); border-color: #df867a; }

    .stat span {
      color: var(--muted);
      font-size: 13px;
    }

    .stat strong {
      display: block;
      margin-top: 10px;
      font-size: 27px;
      line-height: 1;
      max-width: 100%;
      overflow-wrap: normal;
      word-break: normal;
    }

    .panel {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: color-mix(in srgb, var(--surface) var(--ui-alpha, 100%), transparent);
      box-shadow: 0 10px 28px rgba(36,48,58,.08);
      overflow: hidden;
      transition: box-shadow 180ms ease, transform 180ms ease;
      backdrop-filter: blur(var(--ui-blur, 0px));
    }

    .panel:hover {
      box-shadow: 0 14px 34px rgba(36,48,58,.12);
    }

    .panel-head {
      min-height: 58px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 14px 16px;
      border-bottom: 1px solid var(--line);
      background: #fbfcfd;
    }

    .panel-head h3 {
      margin: 0;
      font-size: 17px;
    }

    .panel-body {
      padding: 16px;
    }

    .toolbar {
      display: grid;
      grid-template-columns: minmax(160px, 1.35fr) repeat(4, minmax(130px, .75fr));
      gap: 9px;
      padding: 12px;
      border-bottom: 1px solid var(--line);
      background: #fbfcfd;
    }

    .toolbar.compact {
      grid-template-columns: minmax(180px, 1fr) 150px 150px 150px 150px;
    }

    #view-stock .toolbar.compact {
      grid-template-columns:
        minmax(190px, 1.1fr)
        minmax(230px, 1.25fr)
        minmax(150px, .78fr)
        minmax(156px, .78fr)
        minmax(132px, .68fr)
        minmax(150px, .76fr)
        minmax(170px, .9fr);
      align-items: center;
    }

    #stockWarehouse {
      min-width: 0;
      padding-right: 30px;
    }

    #view-stock .toolbar.compact .btn {
      min-height: 38px;
      min-width: 128px;
      padding-inline: 12px;
      font-size: 12px;
      white-space: nowrap;
    }

    #view-stock .stock-bottom-actions {
      display: grid;
      grid-template-columns: repeat(3, minmax(150px, 1fr));
      gap: 10px;
      padding: 14px 16px 16px;
      border-top: 1px solid var(--line);
      background: #fbfcfd;
    }

    #view-stock .stock-bottom-actions .btn {
      min-height: 42px;
      white-space: normal;
      line-height: 1.15;
    }

    .quick-money-panel {
      min-height: 168px;
      overflow: visible;
    }

    .report-toolbar {
      grid-template-columns: minmax(135px, .9fr) minmax(135px, .9fr) repeat(4, minmax(118px, .75fr)) minmax(135px, .75fr);
      align-items: end;
    }

    input, select, textarea {
      width: 100%;
      border: 1px solid var(--line);
      border-radius: 6px;
      padding: 9px 10px;
      background: #fff;
      color: var(--ink);
      outline-color: rgba(15, 122, 108, .25);
      transition: border-color 150ms ease, box-shadow 150ms ease;
    }

    input:focus, select:focus, textarea:focus {
      border-color: var(--primary);
      box-shadow: 0 0 0 3px rgba(15, 122, 108, .12);
    }

    textarea {
      min-height: 96px;
      resize: vertical;
    }

    label {
      display: grid;
      gap: 6px;
      color: var(--muted);
      font-size: 12px;
      font-weight: 650;
    }

    table {
      width: 100%;
      border-collapse: separate;
      border-spacing: 0;
      border: 1px solid var(--line);
      border-radius: 14px;
      overflow: hidden;
      background: #fff;
      font-size: 13px;
      table-layout: fixed;
      box-shadow: 0 10px 24px rgba(20, 44, 62, .045);
    }

    th, td {
      padding: 11px 10px;
      border-bottom: 1px solid var(--line);
      border-right: 1px solid var(--line);
      text-align: left;
      vertical-align: middle;
      overflow-wrap: anywhere;
      word-break: break-word;
      hyphens: auto;
      line-height: 1.32;
    }

    th {
      background: linear-gradient(180deg, #f8fbfb, #eef4f5);
      color: #40515c;
      font-size: 12px;
      text-transform: none;
      letter-spacing: 0;
      font-weight: 850;
    }

    tr:last-child td {
      border-bottom: 0;
    }

    th:last-child,
    td:last-child {
      border-right: 0;
    }

    tr.clickable-row {
      cursor: pointer;
    }

    tr.clickable-row:hover td {
      background: rgba(15, 122, 108, .055);
    }

    .table-notice {
      margin-top: 8px;
      padding: 8px 10px;
      border: 1px dashed var(--line);
      border-radius: 8px;
      background: rgba(255,255,255,.7);
    }

    .subscription-banner {
      display: none;
      margin: -8px 0 14px;
      padding: 12px 14px;
      border-radius: 16px;
      border: 1px solid rgba(15,122,108,.2);
      background: linear-gradient(135deg, rgba(15,122,108,.12), rgba(255,255,255,.9));
      color: var(--ink);
      box-shadow: 0 10px 28px rgba(20,35,44,.08);
    }

    .subscription-banner.show {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      flex-wrap: wrap;
    }

    .subscription-banner.danger {
      border-color: rgba(172,65,56,.28);
      background: linear-gradient(135deg, rgba(172,65,56,.12), rgba(255,255,255,.92));
    }

    .subscription-status-modal {
      width: min(680px, calc(100vw - 24px));
      max-height: min(520px, calc(100dvh - 86px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));
      overflow-y: auto;
      overflow-x: hidden;
      padding-bottom: max(22px, env(safe-area-inset-bottom));
    }

    .subscription-status-modal .row-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: stretch;
    }

    .subscription-status-modal .row-actions .btn {
      min-height: 42px;
      flex: 1 1 150px;
    }

    .subscription-banner strong {
      display: block;
      margin-bottom: 3px;
    }

    .demo-account-banner {
      display: none;
      margin: -8px 0 14px;
      padding: 14px 16px;
      border: 1px solid rgba(173, 177, 184, .24);
      border-radius: 16px;
      background: linear-gradient(135deg, rgba(32, 34, 39, .98), rgba(15, 16, 19, .98));
      color: #f2f3f4;
      box-shadow: 0 18px 42px rgba(0, 0, 0, .26);
      align-items: center;
      justify-content: space-between;
      gap: 14px;
    }

    .demo-account-banner.show { display: flex; }
    .demo-account-banner strong { display: block; margin-bottom: 4px; }
    .demo-account-banner span { color: rgba(232, 234, 237, .72); line-height: 1.45; }

    @media (max-width: 720px) {
      .demo-account-banner { align-items: stretch; flex-direction: column; }
      .demo-account-banner .btn { width: 100%; }
    }

    .quick-money-body {
      display: grid;
      grid-template-columns: minmax(260px, .58fr) minmax(420px, 1fr);
      gap: 18px;
      align-items: stretch;
      min-height: 108px;
    }

    .quick-money-body > div:first-child {
      display: grid;
      gap: 4px;
    }

    .quick-money-body strong {
      font-size: 24px;
    }

    .quick-money-body .row-actions {
      display: grid;
      grid-template-columns: repeat(2, minmax(180px, 1fr));
      gap: 12px;
      align-content: center;
      align-items: stretch;
    }

    .quick-money-body .btn {
      min-height: 52px;
      padding: 12px 16px;
      font-size: 14px;
      white-space: normal;
      line-height: 1.18;
    }

    .sale-detail-layout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
      gap: 14px;
      align-items: start;
      max-width: 100%;
      overflow: hidden;
    }

    .sale-detail-layout > * {
      min-width: 0;
    }

    .sale-detail-layout table {
      width: 100%;
      table-layout: fixed;
    }

    .sale-detail-layout th,
    .sale-detail-layout td {
      white-space: normal;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    .sale-detail-actions {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
      margin-top: 10px;
    }

    .sale-detail-info table {
      font-size: 12px;
    }

    .sale-detail-info {
      min-width: 0;
    }

    .sale-detail-receipt-preview {
      display: grid;
      justify-items: center;
      width: 100%;
      margin-top: 12px;
      padding: 14px;
      overflow: auto;
      border: 1px solid rgba(154, 165, 170, .24);
      border-radius: 8px;
      background: #090b0e;
    }

    .sale-detail-info .receipt {
      width: var(--receipt-width, 58mm);
      min-width: var(--receipt-width, 58mm);
      max-width: none;
      margin-inline: auto;
    }

    .sale-detail-info th,
    .sale-detail-info td {
      padding: 7px 8px;
    }

    .sale-detail-products th:nth-child(2),
    .sale-detail-products td:nth-child(2),
    .sale-detail-products th:nth-child(5),
    .sale-detail-products td:nth-child(5) {
      width: 58px;
      text-align: center;
    }

    .sale-detail-products th:nth-child(3),
    .sale-detail-products td:nth-child(3),
    .sale-detail-products th:nth-child(4),
    .sale-detail-products td:nth-child(4) {
      width: 88px;
    }

    .download-list {
      display: grid;
      gap: 10px;
    }

    .download-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 12px;
      align-items: center;
      padding: 12px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: linear-gradient(180deg, #ffffff, #f7faf9);
    }

    .download-row strong,
    .download-row span {
      overflow-wrap: anywhere;
    }

    .download-kind {
      min-width: 76px;
      justify-content: center;
    }

    .legal-consent-box {
      display: grid;
      gap: 10px;
      padding: 12px;
      border: 1px solid rgba(15, 122, 108, .18);
      border-radius: 14px;
      background: rgba(15, 122, 108, .055);
    }

    .legal-consent-box h4 {
      margin: 0;
      color: #17212b;
      font-size: 14px;
    }

    .legal-consent-box .toggle-line {
      padding: 8px 10px;
      border: 1px solid rgba(216, 224, 230, .82);
      border-radius: 10px;
      background: rgba(255,255,255,.72);
    }

    .legal-library {
      display: grid;
      gap: 10px;
    }

    .legal-group {
      display: grid;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: #fbfcfd;
    }

    .legal-settings-section {
      display: grid;
      gap: 10px;
    }

    .legal-acceptance-summary {
      display: grid;
      gap: 4px;
      padding: 10px 12px;
      border: 1px solid rgba(216, 224, 230, .82);
      border-radius: 12px;
      background: #fff;
      color: #1d2a31;
    }

    .legal-acceptance-summary.accepted {
      border-color: rgba(15, 122, 108, .26);
      background: rgba(15, 122, 108, .07);
    }

    .legal-acceptance-summary strong {
      font-size: 13px;
    }

    .legal-acceptance-summary span {
      color: var(--muted);
      font-size: 11px;
      line-height: 1.35;
    }

    .legal-group-head {
      width: 100%;
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      gap: 10px;
      align-items: center;
      padding: 10px 12px;
      border: 0;
      background: transparent;
      color: #17212b;
      text-align: left;
      cursor: pointer;
    }

    .legal-group-head strong {
      font-size: 14px;
      overflow-wrap: anywhere;
    }

    .legal-group-head small {
      color: var(--muted);
      white-space: nowrap;
    }

    .legal-group-chevron {
      width: 22px;
      height: 22px;
      display: grid;
      place-items: center;
      border-radius: 999px;
      background: rgba(15, 122, 108, .1);
      color: #0f7a6c;
      transition: transform .16s ease, background .16s ease;
    }

    .legal-group.open .legal-group-chevron {
      transform: rotate(90deg);
      background: rgba(15, 122, 108, .16);
    }

    .legal-group-body {
      display: none;
      gap: 8px;
      padding: 0 12px 12px;
    }

    .legal-group.open .legal-group-body {
      display: grid;
    }

    .legal-doc-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 10px;
      align-items: center;
      padding: 9px 10px;
      border: 1px solid rgba(216, 224, 230, .72);
      border-radius: 10px;
      background: #fff;
    }

    .legal-doc-row strong,
    .legal-doc-row span {
      display: block;
      overflow-wrap: anywhere;
    }

    .legal-doc-row span {
      margin-top: 3px;
      color: var(--muted);
      font-size: 11px;
    }

    .legal-preview-text {
      min-height: 0;
      max-height: none;
      overflow: auto;
      padding: 16px 16px max(32px, calc(22px + env(safe-area-inset-bottom, 0px)));
      border: 1px solid var(--line);
      border-radius: 12px;
      background: #f9fbfb;
      color: #1c2931;
      font-family: "Segoe UI", Arial, sans-serif;
      font-size: 11px;
      line-height: 1.5;
      white-space: pre-wrap;
      overscroll-behavior: contain;
    }

    .legal-preview-modal {
      width: min(96vw, 1080px) !important;
      max-width: min(96vw, 1080px);
      max-height: calc(100dvh - 18px);
      display: flex;
      flex-direction: column;
    }

    .legal-preview-modal .panel-body {
      flex: 1;
      min-height: 0;
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
      gap: 12px;
      max-height: none;
      overflow: hidden;
      padding: 16px 16px max(16px, calc(12px + env(safe-area-inset-bottom, 0px)));
    }

    .legal-preview-actions {
      align-items: center;
      justify-content: flex-end;
      padding-top: 2px;
      padding-bottom: max(4px, env(safe-area-inset-bottom, 0px));
    }

    @media (max-width: 920px) {
      .quick-money-body,
      .sale-detail-layout {
        grid-template-columns: 1fr;
      }

      .sale-detail-actions {
        grid-template-columns: 1fr 1fr;
      }
    }

    tbody tr:nth-child(even) td {
      background: #fbfcfc;
    }

    tbody tr:hover td {
      background: rgba(15, 122, 108, .055);
    }

    .row-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 7px;
    }

    .table-actions-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(45px, 1fr));
      gap: 4px;
      min-width: 98px;
      max-width: 126px;
    }

    .table-actions-grid .btn,
    .client-actions-grid .btn {
      min-height: 26px;
      padding: 4px 5px;
      font-size: 11px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .client-actions-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(50px, 1fr));
      gap: 4px;
      min-width: 152px;
      max-width: 176px;
    }

    .client-actions-grid .danger {
      grid-column: auto;
    }

    .tag {
      display: inline-flex;
      align-items: center;
      min-height: 24px;
      border-radius: 999px;
      padding: 3px 8px;
      background: #eaf4f2;
      color: var(--primary-2);
      font-size: 12px;
      font-weight: 700;
      white-space: nowrap;
    }

    .tag.red {
      background: #fae9e7;
      color: #9a2b23;
    }

    .tag.gold {
      background: #fff4d8;
      color: #80600f;
    }

    .tag.gray {
      background: #eef1f3;
      color: #596773;
    }

    .hidden {
      display: none !important;
    }

    .view {
      min-height: 0;
    }

    .view:not(.hidden) {
      display: grid;
      align-content: start;
      gap: 14px;
      min-height: 0;
      height: 100%;
      max-height: 100%;
      overflow-y: auto;
      overflow-x: hidden;
      padding: 1px 2px max(26px, calc(var(--android-safe-bottom, 0px) + 18px)) 1px;
      overscroll-behavior: contain;
      -webkit-overflow-scrolling: touch;
      scrollbar-gutter: stable;
      contain: layout paint;
    }

    #view-reports:not(.hidden),
    #view-history:not(.hidden) {
      min-height: 0;
      height: 100%;
      max-height: 100%;
      overflow-y: auto !important;
      overflow-x: hidden;
      align-content: start;
      padding-bottom: 22px;
    }

    #view-reports .panel,
    #view-history .panel,
    #view-reports .history-list,
    #view-history .history-list {
      min-height: 0;
    }

    .two-col {
      display: grid;
      grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
      gap: 14px;
    }

    .form-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    .form-grid .wide {
      grid-column: 1 / -1;
    }

    .cart-list {
      display: grid;
      gap: 8px;
      max-height: 340px;
      overflow: auto;
      padding-top: 8px;
      overscroll-behavior: contain;
    }

    .cart-item {
      display: grid;
      grid-template-columns: 1fr 70px 92px 78px 36px;
      gap: 8px;
      align-items: center;
      padding: 10px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fbfcfd;
    }

    .cart-item.stock-warning {
      border-color: #d65145;
      background: #fff4f2;
      box-shadow: 0 0 0 3px rgba(214,81,69,.11);
    }

    .cart-item strong {
      display: block;
      font-size: 14px;
    }

    .cart-item span {
      color: var(--muted);
      font-size: 12px;
    }

    .total-box {
      display: grid;
      gap: 8px;
      padding: 14px;
      border-radius: 8px;
      background: #15242b;
      color: #fff;
    }

    .payment-counterparty-card {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 10px;
      align-items: center;
      padding: 12px;
      border: 1px solid rgba(15, 122, 108, .34);
      border-radius: 10px;
      background: linear-gradient(135deg, #e7f7f2, #fffdf6);
      box-shadow: 0 10px 24px rgba(15, 122, 108, .1);
    }

    .payment-counterparty-card span,
    .counterparty-select-row span {
      color: var(--muted);
      font-size: 12px;
    }

    .payment-counterparty-card strong,
    .counterparty-select-row strong {
      overflow-wrap: anywhere;
    }

    .counterparty-select-list {
      display: grid;
      gap: 8px;
      max-height: min(470px, 52vh);
      overflow-y: auto;
      overflow-x: hidden;
      padding-right: 2px;
    }

    .counterparty-select-row {
      width: 100%;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 10px;
      align-items: center;
      padding: 11px 12px;
      border: 1px solid var(--line);
      border-radius: 10px;
      background: #fff;
      text-align: left;
      color: var(--ink);
    }

    .counterparty-select-row:hover,
    .counterparty-select-row.active {
      border-color: var(--primary);
      background: #eefaf7;
      box-shadow: 0 12px 26px rgba(15, 122, 108, .14);
      transform: translateY(-1px);
    }

    .total-line {
      display: flex;
      justify-content: space-between;
      gap: 12px;
    }

    .total-line.big {
      padding-top: 8px;
      border-top: 1px solid rgba(255,255,255,.18);
      font-size: 24px;
      font-weight: 800;
    }

    .tabs {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-bottom: 14px;
    }

    .tabs button {
      border: 1px solid var(--line);
      border-radius: 999px;
      padding: 7px 12px;
      background: #fff;
      color: var(--muted);
      font-weight: 700;
    }

    .tabs button.active {
      border-color: var(--primary);
      background: #eaf4f2;
      color: var(--primary-2);
    }

    .receipt-wrap {
      display: grid;
      gap: 12px;
      justify-items: start;
    }

    .receipt {
      width: var(--receipt-width, 280px);
      max-width: 100%;
      min-height: 0;
      padding: var(--receipt-padding, 16px);
      background: #fff;
      color: #111;
      border: 1px dashed #9aa5aa;
      box-shadow: var(--shadow);
      font-family: Arial, "Segoe UI", sans-serif;
      font-size: var(--receipt-font, 13px);
      line-height: var(--receipt-line-height, 1.38);
      font-weight: var(--receipt-weight, 700);
      letter-spacing: var(--receipt-letter-spacing, .15px);
      white-space: normal;
      overflow: hidden;
    }

    .receipt::after {
      content: "";
      display: block;
      width: 100%;
      height: var(--receipt-bottom-feed, 4mm);
    }

    .receipt-logo {
      display: block;
      width: var(--receipt-logo-width, 64px);
      max-width: 70%;
      height: auto;
      margin: 0 auto 8px;
      filter: grayscale(1) contrast(1.35);
    }

    .receipt-title {
      text-align: center;
      font-weight: 900;
      font-size: 1.2em;
      margin-bottom: 4px;
      overflow-wrap: break-word;
      word-break: normal;
      hyphens: none;
    }

    .receipt-subtitle,
    .receipt-center {
      text-align: center;
      overflow-wrap: break-word;
      word-break: normal;
      hyphens: none;
    }

    .receipt-kind {
      margin: 4px 0 7px;
      text-align: center;
      font-weight: 900;
      line-height: 1.2;
      overflow-wrap: break-word;
      word-break: normal;
      hyphens: none;
    }

    .receipt-separator {
      border-top: 1px dashed #111;
      margin: var(--receipt-separator-margin, 9px) 0;
    }

    .receipt-row,
    .receipt-total {
      display: grid;
      grid-template-columns: minmax(62px, .85fr) minmax(0, 1.15fr);
      gap: 6px;
      align-items: start;
    }

    .receipt-row span:first-child,
    .receipt-item-name {
      overflow-wrap: break-word;
      word-break: normal;
      hyphens: none;
    }

    .receipt-row > strong,
    .receipt-total > span:last-child {
      min-width: 0;
      max-width: none;
      text-align: right;
      overflow-wrap: anywhere;
      word-break: normal;
    }

    .receipt-item {
      display: grid;
      gap: 3px;
      margin: 8px 0;
    }

    .receipt-total {
      font-size: 1.16em;
      font-weight: 900;
    }

    .receipt-meta {
      color: #333;
      font-size: .95em;
    }

    .price-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
      gap: 28px;
      padding: 8px;
    }

    .price-card {
      position: relative;
      min-height: 132px;
      display: grid;
      align-content: space-between;
      gap: 10px;
      padding: 12px;
      border: 3px solid #111;
      background: #fff;
      color: #111;
      font-family: var(--label-font, Arial, sans-serif);
      font-size: var(--label-font-size, 16px);
    }

    .label-bg-image {
      position: absolute;
      right: 8px;
      top: 8px;
      object-fit: contain;
      opacity: .9;
      z-index: 0;
      pointer-events: none;
    }

    .price-card > *:not(.label-bg-image) {
      position: relative;
      z-index: 1;
    }

    .price-grid .price-card {
      box-shadow: 0 8px 20px rgba(36,48,58,.08);
    }

    .price-card strong {
      font-size: 18px;
    }

    .price-card-logo {
      display: block;
      max-width: 42%;
      max-height: 34px;
      object-fit: contain;
      margin: 0 auto 4px;
      image-rendering: auto;
    }

    .price-card .price {
      font-size: 28px;
      font-weight: 900;
      color: var(--label-price-color, #111);
    }

    .history-list {
      display: grid;
      gap: 10px;
    }

    .history-cell {
      display: grid;
      grid-template-columns: minmax(150px, .8fr) minmax(0, 1.6fr) 120px;
      gap: 9px;
      align-items: center;
      padding: 10px 12px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: rgba(255,255,255,.82);
      font-size: 13px;
    }

    .history-cell strong,
    .history-cell span {
      overflow-wrap: break-word;
      word-break: normal;
      hyphens: none;
    }

    .compact-event {
      grid-template-columns: minmax(118px, .72fr) minmax(0, 1.8fr) minmax(96px, auto);
    }

    .compact-event span:not(.tag),
    .compact-event strong {
      display: inline-block;
      max-width: 100%;
      line-height: 1.25;
    }

    .compact-event > strong:last-child {
      justify-self: end;
      text-align: right;
      white-space: nowrap;
    }

    .sales-table th:first-child,
    .sales-table td:first-child {
      width: 82px;
      text-align: center;
    }

    .sales-table .tag {
      min-height: 22px;
      padding: 3px 7px;
      font-size: 11px;
      max-width: 100%;
      justify-content: center;
      white-space: nowrap;
    }

    .history-actions {
      padding-bottom: 0;
    }

    .history-actions .row-actions {
      justify-content: end;
    }

    .history-toolbar {
      grid-template-columns: 160px 160px minmax(150px, 190px) minmax(150px, 190px);
    }

    .report-payment-panel {
      margin-bottom: 14px;
    }

    .report-output-selector {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      gap: 10px;
    }

    .report-output-option {
      display: flex;
      align-items: center;
      gap: 10px;
      min-height: 52px;
      padding: 11px 13px;
      border: 1px solid var(--line);
      border-radius: 10px;
      background: var(--surface-2, #111722);
      color: var(--text, #f4f7fb);
    }

    .report-output-option input {
      width: 18px;
      height: 18px;
      flex: 0 0 auto;
      accent-color: var(--accent, #7d70ff);
    }

    .report-output-option span {
      min-width: 0;
      overflow-wrap: break-word;
    }

    .report-editor {
      display: grid;
      gap: 12px;
      max-height: min(76vh, 760px);
      overflow: auto;
      padding: 12px;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: #f7faf8;
    }

    .report-preview-modal {
      width: min(98vw, 1540px) !important;
      max-width: min(98vw, 1540px);
      max-height: 96vh;
    }

    .report-preview-modal .row-actions:last-child {
      position: sticky;
      bottom: 0;
      z-index: 3;
      padding: 10px 0 2px;
      background: linear-gradient(180deg, rgba(13, 19, 31, 0), rgba(13, 19, 31, .98) 32%);
    }

    .report-preview-modal .row-actions:last-child .btn {
      min-width: 150px;
    }

    .report-sheet-tabs {
      display: flex;
      gap: 7px;
      flex-wrap: wrap;
      position: sticky;
      top: 0;
      z-index: 2;
      padding: 0 0 8px;
      background: #f7faf8;
    }

    .report-sheet-tabs button {
      border: 1px solid var(--line);
      border-radius: 999px;
      background: #fff;
      color: var(--text);
      padding: 7px 10px;
      font-size: 11px;
      font-weight: 800;
      cursor: pointer;
    }

    .report-sheet-tabs button.active {
      color: #fff;
      border-color: transparent;
      background: linear-gradient(135deg, var(--primary), var(--primary-2));
    }

    .report-editor-sheet {
      display: grid;
      gap: 8px;
      min-width: 0;
    }

    .report-editor-sheet.hidden {
      display: none;
    }

    .report-editor-sheet h4 {
      margin: 0;
      font-size: 14px;
    }

    .report-editor td {
      min-width: 82px;
      background: #fff;
      outline: none;
      cursor: text;
      font-size: 11px;
      line-height: 1.25;
      padding: 5px 6px;
    }

    .report-editor td:focus {
      background: #eaf8f4;
      box-shadow: inset 0 0 0 2px var(--primary);
    }

    .order-source-strip {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
      gap: 10px;
      margin-bottom: 12px;
    }

    .order-source-card {
      display: grid;
      gap: 4px;
      min-height: 72px;
      padding: 12px;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: rgba(255,255,255,.88);
      box-shadow: var(--shadow-soft);
    }

    .order-source-card span,
    .order-source-card small {
      color: var(--muted);
      font-size: 11px;
      font-weight: 800;
    }

    .order-source-card strong {
      font-size: 24px;
      line-height: 1;
    }

    .bank-sales-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      flex-wrap: wrap;
    }

    .bank-sales-head h4 {
      margin: 0 0 3px;
    }

    .bank-sales-table {
      table-layout: fixed;
      width: 100%;
    }

    .bank-sales-table th {
      text-align: center;
      min-width: 132px;
    }

    .bank-sales-table td {
      min-width: 132px;
      min-height: 38px;
      vertical-align: top;
      white-space: pre-wrap;
      overflow-wrap: anywhere;
    }

    .bank-sales-table tr.bank-row-selected td {
      box-shadow: inset 0 0 0 1px rgba(15,122,108,.55);
    }

    .bank-merge-controls {
      min-width: 230px !important;
      cursor: default !important;
      background: #f2f7f4 !important;
    }

    .bank-merge-controls button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 28px;
      margin: 2px;
      padding: 5px 8px;
      border: 1px solid var(--line);
      border-radius: 999px;
      background: #fff;
      color: var(--text);
      font-size: 10px;
      font-weight: 800;
      cursor: pointer;
    }

    .bank-merge-controls button.active {
      color: #fff;
      border-color: transparent;
      background: linear-gradient(135deg, var(--primary), var(--primary-2));
    }

    .logo-helper-card {
      display: grid;
      gap: 8px;
      padding: 10px;
      border: 1px dashed rgba(15,122,108,.36);
      border-radius: 12px;
      background: rgba(15,122,108,.07);
      color: var(--text);
      font-size: 12px;
    }

    .logo-helper-card ul {
      margin: 0;
      padding-left: 18px;
    }

    .logo-preview-card {
      display: grid;
      gap: 8px;
      place-items: center;
      min-height: 118px;
      padding: 10px;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: #fff;
      text-align: center;
    }

    .logo-preview-card img {
      max-width: min(220px, 78%);
      max-height: 86px;
      object-fit: contain;
      image-rendering: auto;
      filter: grayscale(1) contrast(1.12);
    }

    .logo-preview-card span {
      color: var(--muted);
      font-size: 12px;
      font-weight: 700;
    }

    .settings-subblock {
      display: grid;
      gap: 9px;
      margin-top: 12px;
      padding-top: 12px;
      border-top: 1px solid var(--line);
    }

    .settings-subblock h4 {
      margin: 0;
    }

    .receipt-options {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
    }

    .notes {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
      grid-auto-flow: dense;
      gap: 12px;
    }

    .note-wide { grid-column: span 2; }
    .note-large { grid-column: span 2; grid-row: span 2; min-height: 260px; }

    .note {
      display: grid;
      gap: 10px;
      padding: 13px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #fffdf3;
    }

    .note p {
      margin: 0;
      white-space: pre-wrap;
    }

    .modal-backdrop {
      position: fixed;
      inset: 0;
      display: grid;
      place-items: center;
      padding: 18px;
      background: rgba(12, 22, 27, .42);
      z-index: 1200;
      animation: backdropIn 260ms ease both;
    }

    .modal-backdrop.child-modal-backdrop {
      z-index: 1210;
      background: rgba(12, 22, 27, .34);
    }

    .modal.child-modal {
      width: min(440px, calc(100vw - 28px));
      max-height: min(740px, 88vh);
    }

    .modal {
      width: min(760px, 100%);
      max-height: min(860px, 94vh);
      overflow: hidden;
      border-radius: 8px;
      background: #fff;
      box-shadow: 0 28px 80px rgba(0,0,0,.24);
      animation: modalIn 300ms cubic-bezier(.16, .84, .22, 1) both;
    }

    .modal-head {
      position: sticky;
      top: 0;
      z-index: 2;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 12px;
      padding: 16px;
      border-bottom: 1px solid rgba(255,255,255,.12);
      background: linear-gradient(180deg, #16242a, #101d22);
      color: #eef8f6;
    }

    .modal-head .btn {
      border-color: rgba(255,183,173,.42);
      background: rgba(180,65,55,.82);
      color: #fff;
      font-weight: 900;
      min-width: 38px;
    }

    .modal-head h3 {
      margin: 0;
      color: #eef8f6;
    }

    .modal .panel-body {
      max-height: calc(94vh - 72px);
      overflow-y: auto;
      overflow-x: hidden;
    }

    body.android-shell .modal-backdrop {
      padding: max(8px, var(--android-safe-top, 0px)) 14px max(18px, calc(var(--android-nav-safe, 0px) + 16px));
    }

    body.android-shell .modal {
      max-height: calc(100dvh - var(--android-safe-top, 0px) - var(--android-nav-safe, 0px) - 18px);
    }

    body.android-shell .modal .panel-body {
      max-height: calc(100dvh - var(--android-safe-top, 0px) - var(--android-nav-safe, 0px) - 92px);
      padding-bottom: max(34px, calc(var(--android-nav-safe, 0px) + 24px));
    }

    .settings-layout {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 14px;
    }

    .settings-summary {
      grid-column: 1 / -1;
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 12px;
    }

    .settings-summary .sync-mini {
      margin-top: 7px;
      color: var(--muted);
      font-size: 11px;
      line-height: 1.25;
      overflow-wrap: anywhere;
    }

    .settings-tabs-panel {
      grid-column: 1 / -1;
      justify-self: start;
      width: 100%;
      padding: 10px;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: rgba(255,255,255,.78);
      box-shadow: 0 12px 30px rgba(36,48,58,.07);
    }

    .settings-tabs {
      display: grid;
      grid-template-columns: repeat(3, minmax(128px, max-content));
      gap: 8px;
      margin: 0;
      align-items: center;
    }

    .settings-tabs button {
      min-height: 34px;
      padding-inline: 14px;
      white-space: nowrap;
    }

    .settings-card {
      grid-column: 1 / -1;
      width: 100%;
      min-width: 0;
    }

    .settings-sync-strip {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(160px, auto) auto;
      gap: 12px;
      align-items: center;
      padding: 14px;
      border-radius: 12px;
      border: 1px solid rgba(137, 238, 226, .18);
      background: linear-gradient(135deg, #16242a, #0f1c21);
      color: #edf8f6;
      box-shadow: 0 16px 38px rgba(22, 36, 42, .18);
    }

    .settings-sync-strip span {
      color: rgba(237,248,246,.72);
      font-size: 12px;
      overflow-wrap: anywhere;
    }

    .settings-sync-strip label {
      color: rgba(237,248,246,.78);
      margin: 0;
    }

    .settings-sync-strip input {
      min-height: 34px;
      background: rgba(255,255,255,.92);
    }

    .settings-card {
      border-radius: 14px;
      box-shadow: 0 18px 42px rgba(36,48,58,.1);
      overflow: hidden;
      transition: transform 180ms ease, box-shadow 180ms ease;
    }

    .settings-card.sync-card { order: 90; }
    .settings-card.service-card { order: 100; }
    .settings-card.warehouse-card,
    .settings-card.shop-card,
    .settings-card.utility-card {
      grid-column: 1 / -1;
      grid-row: auto;
    }

    .settings-mini-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
      align-items: stretch;
    }

    .settings-profiles-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
      gap: 14px;
      align-items: start;
      grid-column: 1 / -1;
      width: 100%;
    }

    .settings-profiles-grid .settings-card {
      grid-column: auto;
      grid-row: auto;
      width: 100%;
    }

    .settings-compact-currency {
      display: grid;
      gap: 8px;
    }

    .settings-compact-currency table {
      font-size: 11px;
      box-shadow: none;
      border-radius: 10px;
    }

    .settings-compact-currency th,
    .settings-compact-currency td {
      padding: 6px 7px;
    }

    .settings-compact-currency input {
      min-height: 30px;
      padding: 5px 6px;
      font-size: 11px;
    }

    .settings-mini {
      display: grid;
      gap: 10px;
      align-content: start;
      min-width: 0;
      padding: 12px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: linear-gradient(180deg, #ffffff, #f7faf9);
    }

    .settings-mini .btn,
    .settings-mini label {
      min-width: 0;
    }

    .settings-mini .toggle-line {
      align-items: start;
      min-height: 0;
    }

    .settings-mini .toggle-line span {
      overflow-wrap: anywhere;
    }

    .settings-mini h4 {
      margin: 0;
      font-size: 14px;
    }

    .settings-card .panel-head {
      cursor: pointer;
    }

    .settings-card .collapse-mark {
      margin-left: auto;
      color: var(--muted);
      font-weight: 900;
      transition: transform 180ms ease;
    }

    .settings-card.collapsed .collapse-mark {
      transform: rotate(-90deg);
    }

    .settings-card.collapsed .panel-body {
      display: none;
    }

    .toggle-line {
      min-height: 44px;
      grid-template-columns: auto 1fr;
      align-items: center;
      padding: 10px 12px;
      border: 1px solid var(--line);
      border-radius: 10px;
      background: #fbfcfd;
    }

    .toggle-line input {
      width: 20px;
      height: 20px;
      accent-color: var(--primary);
    }

    .sort-head {
      border: 0;
      background: transparent;
      color: inherit;
      font: inherit;
      font-weight: 900;
      white-space: nowrap;
      padding: 0;
    }

    .shift-current {
      display: grid;
      grid-template-columns: minmax(280px, .7fr) 1fr;
      gap: 14px;
      align-items: center;
    }

    .shift-current .row-actions {
      display: grid;
      grid-template-columns: repeat(5, minmax(110px, 1fr));
      gap: 10px;
    }

    .shift-current .row-actions .btn {
      min-height: 52px;
      border-radius: 14px;
      padding-inline: 14px;
      box-shadow: 0 12px 24px rgba(24, 56, 46, .14);
      transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
    }

    .shift-current .row-actions .btn:hover:not(:disabled) {
      transform: translateY(-2px);
      box-shadow: 0 18px 30px rgba(24, 56, 46, .2);
      filter: saturate(1.08);
    }

    .shift-action-open,
    .shift-action-close {
      background: linear-gradient(135deg, #4ea985, #9bd6bd) !important;
      color: #12362b;
      border-color: #9bd6bd;
    }

    .shift-action-open:disabled,
    .shift-action-close:disabled {
      opacity: 1;
      background: linear-gradient(135deg, #eef2f1, #dce4e2) !important;
      color: #7a8985;
      border-color: #d8e0de;
    }

    .shift-action-cash {
      background: linear-gradient(135deg, #f7e7b5, #ead091);
      color: #51431e;
      border-color: #ead091;
    }

    .shift-action-expense {
      background: linear-gradient(135deg, #f0c7c2, #dfaaa2);
      color: #64302b;
      border-color: #dfaaa2;
    }

    .shift-action-withdraw {
      background: linear-gradient(135deg, #dce9ff, #aac6ef);
      color: #193d70;
      border-color: #a6c2ea;
    }

    .return-sales-list {
      display: grid;
      gap: 8px;
      max-height: 350px;
      overflow: auto;
    }

    .return-sale-row,
    .event-button {
      width: 100%;
      border: 1px solid var(--line);
      text-align: left;
      color: inherit;
      cursor: pointer;
    }

    .event-button {
      transition: transform 150ms ease, border-color 150ms ease, box-shadow 150ms ease, background 150ms ease;
    }

    .event-button:hover {
      transform: scale(1.015);
      border-color: var(--primary);
      background: var(--surface-2);
      box-shadow: 0 14px 32px rgba(5, 12, 22, .28);
    }

    .drag-target {
      outline: 2px dashed var(--primary);
      outline-offset: -5px;
      background: var(--surface-2) !important;
    }

    .shift-confirm {
      padding: 12px 14px;
      border-radius: 10px;
      background: var(--surface-2);
      color: var(--text);
      border: 1px solid var(--line);
      font-weight: 750;
    }

    .shift-confirm span {
      color: var(--text);
      opacity: .78;
    }

    .return-sale-row {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 10px;
      padding: 10px;
      border-radius: 8px;
      background: var(--surface-2);
    }

    .mini-range {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 6px;
      margin-top: 10px;
    }

    .mini-date-field {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      gap: 6px;
      align-items: center;
    }

    .mini-date-field span {
      color: var(--muted);
      font-size: 10px;
      font-weight: 800;
      white-space: nowrap;
    }

    .mini-range input {
      min-width: 0;
      height: 32px;
      padding: 5px 6px;
      font-size: 11px;
    }

    input[type="date"] {
      min-width: 126px;
      font-size: 13px;
    }

    .mini-range input[type="date"] {
      min-width: 118px;
      font-size: 11px;
      padding-inline: 4px;
    }

    @media (max-width: 1500px) {
      .dashboard-stats .period-stat .mini-range {
        grid-template-columns: 1fr;
        gap: 5px;
      }

      .dashboard-stats .period-stat .mini-date-field {
        grid-template-columns: 22px minmax(0, 1fr);
      }

      .dashboard-stats .period-stat input[type="date"] {
        min-width: 0;
      }
    }

    .toast {
      position: fixed;
      right: 18px;
      bottom: 18px;
      max-width: min(420px, calc(100vw - 36px));
      padding: 12px 14px;
      border-radius: 8px;
      background: #15242b;
      color: #fff;
      box-shadow: var(--shadow);
      z-index: 20;
      animation: toastIn 240ms cubic-bezier(.16, .84, .22, 1) both;
    }

    .swatches {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 9px;
    }

    .swatch {
      min-height: 44px;
      border-radius: 7px;
      border: 2px solid transparent;
    }

    .swatch.active {
      border-color: var(--ink);
      box-shadow: 0 0 0 3px rgba(15, 122, 108, .14);
    }

    input[type="color"] {
      width: 42px;
      height: 42px;
      padding: 3px;
      border-radius: 8px;
    }

    .color-row {
      grid-template-columns: auto 1fr;
      align-items: center;
    }

    .shift-table-wrap {
      max-height: 560px;
      overflow-y: auto;
      overflow-x: hidden;
    }

    .shift-table-wrap table {
      table-layout: fixed;
      font-size: 12px;
    }

    .shift-table-wrap th,
    .shift-table-wrap td {
      padding: 8px 7px;
      overflow-wrap: anywhere;
    }

    .nav-order-row {
      cursor: grab;
      transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease;
    }

    .nav-order-row.dragging {
      transform: scale(1.03);
      box-shadow: 0 16px 34px rgba(36,48,58,.18);
      background: #ffffff;
    }

    .product-picker {
      display: grid;
      gap: 10px;
      max-height: 480px;
      overflow: auto;
    }

    .product-pick-row {
      display: grid;
      grid-template-columns: 1fr 110px 90px 120px;
      gap: 10px;
      align-items: center;
      padding: 10px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      transition: transform 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
    }

    .product-pick-row:hover {
      transform: translateY(-1px);
      border-color: var(--primary);
      box-shadow: 0 10px 24px rgba(15, 122, 108, .12);
    }

    .product-pick-row.is-out {
      opacity: .62;
      background: #f3f5f4;
    }

    .product-thumb {
      width: 46px;
      height: 46px;
      display: grid;
      place-items: center;
      border: 1px solid var(--line);
      border-radius: 10px;
      background: linear-gradient(145deg, #f9fbfa, #e9f1ee);
      color: var(--muted);
      overflow: hidden;
      font-size: 18px;
      font-weight: 900;
    }

    .product-thumb.placeholder {
      font-size: 10px;
      font-weight: 800;
      letter-spacing: 0;
      text-transform: uppercase;
    }

    .product-thumb img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }

    .product-image-preview {
      width: 76px;
      height: 76px;
      border-radius: 14px;
    }

    .empty {
      padding: 28px;
      color: var(--muted);
      text-align: center;
    }

    .print-only {
      display: none;
    }

    @media (max-width: 1060px) {
      .app {
        height: 100dvh;
        min-height: 0;
        overflow: hidden;
        grid-template-columns: 1fr;
        grid-template-rows: auto minmax(0, 1fr);
      }
      .sidebar {
        position: relative;
        height: auto;
        grid-template-rows: auto auto auto;
        padding-top: 12px;
      }
      .profile { display: none; }
      .shift-box.as-nav-note {
        position: sticky;
        bottom: 8px;
        z-index: 8;
        grid-template-columns: auto minmax(0, 1fr);
        align-items: center;
        padding: 9px 11px;
        border: 1px solid rgba(255,255,255,.16);
        border-radius: 14px;
        background: rgba(18, 31, 36, .92);
        backdrop-filter: blur(14px);
      }
      .shift-box.as-nav-note #shiftMeta,
      .shift-box.as-nav-note #shiftEmail {
        display: none;
      }
      .shift-box.as-nav-note #syncState {
        margin-top: 0;
        text-align: right;
      }
      .main {
        min-height: 0;
        overflow: hidden;
        display: grid;
        padding-bottom: max(18px, calc(var(--android-safe-bottom, 0px) + 8px));
        padding-top: 12px;
      }
      .view:not(.hidden) {
        min-height: 0;
        overflow: auto;
        overscroll-behavior: contain;
        padding-bottom: max(36px, calc(var(--android-safe-bottom, 0px) + 24px));
      }
      #view-dashboard:not(.hidden) {
        overflow-y: auto;
        overflow-x: hidden;
        align-content: start;
      }
      .dashboard-events-panel { display: none; }
      .dashboard-bottom { grid-template-columns: 1fr; }
      #view-dashboard .sales-table {
        font-size: 11px;
      }
      #view-dashboard .sales-table th,
      #view-dashboard .sales-table td {
        padding: 6px 5px;
      }
      .nav { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
      .nav button {
        min-height: 38px;
        padding: 7px 8px;
        grid-template-columns: 22px minmax(0, 1fr) auto;
        font-size: 12px;
      }
      .nav button span:nth-child(2) {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .dashboard-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .two-col { grid-template-columns: 1fr; }
      .toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .settings-layout { grid-template-columns: 1fr; }
      .settings-tabs-panel {
        justify-self: stretch;
        width: 100%;
      }
      .settings-tabs {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
      .settings-tabs button {
        padding-inline: 8px;
        white-space: normal;
      }
      .settings-sync-strip {
        grid-template-columns: 1fr;
      }
      .settings-card.warehouse-card,
      .settings-card.shop-card,
      .settings-card.utility-card {
        grid-column: auto;
        grid-row: auto;
      }
      .settings-mini-grid { grid-template-columns: 1fr; }
      .settings-profiles-grid { grid-template-columns: 1fr; }
      .settings-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .shift-current { grid-template-columns: 1fr; }
      .shift-current .row-actions { grid-template-columns: repeat(3, minmax(92px, 1fr)); }
      .shift-current .row-actions .btn {
        min-height: 44px;
        padding-inline: 8px;
        font-size: 12px;
      }
    }

    @media (max-width: 680px) {
      body { background: #eef3f0; }
      body, button, input, select, textarea { font-size: 13px; }
      .app { height: 100dvh; min-height: 0; }
      .main { padding: 8px 10px max(18px, calc(var(--android-safe-bottom, 0px) + 10px)); gap: 8px; }
      .sidebar { padding: 8px 10px 8px; gap: 8px; }
      .brand h1 { font-size: 18px; }
      .brand-mark { width: 36px; height: 36px; border-radius: 11px; }
      .topline { display: grid; gap: 4px; min-height: 58px; padding: 9px 11px; }
      .page-title h2 { font-size: 20px; overflow-wrap: anywhere; }
      .topline p { display: none; }
      .actions { justify-content: stretch; }
      .actions .btn { flex: 1; }
      .nav { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
      .nav button {
        min-height: 38px;
        padding: 5px 6px;
        grid-template-columns: 17px minmax(0, 1fr);
        font-size: 10px;
        line-height: 1.1;
      }
      .nav button span:first-child { width: 17px; height: 17px; font-size: 12px; }
      .nav button span:nth-child(2) {
        display: block;
        white-space: normal;
        overflow: hidden;
        text-overflow: clip;
      }
      .nav button .badge { display: none; }
      .stats { grid-template-columns: 1fr; }
      .dashboard-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .settings-summary { grid-template-columns: 1fr; }
      .toolbar { grid-template-columns: 1fr; }
      .form-grid { grid-template-columns: 1fr; }
      .cart-item { grid-template-columns: 1fr; }
      .cart-item input { width: 100%; }
      table { font-size: 12px; table-layout: fixed; }
      th, td { padding: 8px 6px; }
      .sales-table th:first-child,
      .sales-table td:first-child { width: 58px; padding-inline: 3px; }
      .sales-table .tag { min-height: 18px; padding: 2px 4px; font-size: 9px; }
      .row-actions { gap: 5px; }
      .row-actions .btn, .btn.small { min-height: 34px; padding-inline: 8px; }
      .product-pick-row { grid-template-columns: 1fr; }
      .history-cell { grid-template-columns: minmax(0, 1fr); }
      .compact-event {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 6px;
        padding: 8px;
        font-size: 11px;
      }
      .compact-event > div:first-child {
        grid-column: 1 / -1;
        display: flex;
        justify-content: space-between;
        gap: 8px;
      }
      .compact-event > div:nth-child(2) {
        min-width: 0;
      }
      .compact-event > div:nth-child(2) strong,
      .compact-event > div:nth-child(2) span:not(.tag) {
        display: block;
        white-space: normal;
        overflow-wrap: anywhere;
      }
      .compact-event .tag {
        min-height: 20px;
        padding: 2px 6px;
        font-size: 10px;
      }
      .history-actions .row-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .history-toolbar { grid-template-columns: 1fr 1fr; }
      .note-wide, .note-large { grid-column: auto; grid-row: auto; }
      .modal-backdrop { padding: 0; align-items: stretch; }
      .modal { width: 100%; max-height: 100vh; border-radius: 0; }
      .modal .panel-body {
        max-height: calc(100dvh - 68px - var(--android-safe-top, 0px) - var(--android-safe-bottom, 0px));
        padding-bottom: max(22px, calc(var(--android-safe-bottom, 0px) + 12px));
      }
      .report-preview-modal { width: 100% !important; max-width: 100%; }
      .report-preview-modal .panel-body { padding: 8px; }
      .report-editor {
        max-height: calc(100dvh - 160px - var(--android-safe-top, 0px) - var(--android-safe-bottom, 0px));
        padding: 8px;
      }
      .report-sheet-tabs button { padding: 5px 7px; font-size: 10px; }
      .report-editor td { min-width: 66px; padding: 4px 5px; font-size: 10px; }
      .panel-body { padding: 9px; }
      .panel-head { padding: 9px 10px; }
      .quick-money-panel { min-height: 150px; margin-bottom: 10px !important; }
      .quick-money-body { grid-template-columns: minmax(180px, .55fr) minmax(260px, 1fr); gap: 10px; min-height: 94px; }
      .quick-money-body strong { font-size: 19px; }
      .quick-money-body .row-actions { display: grid; grid-template-columns: repeat(2, minmax(120px, 1fr)); gap: 8px; }
      .quick-money-body .btn { min-height: 44px; padding: 9px 10px; font-size: 12px; }
      .shift-current .row-actions { grid-template-columns: 1fr 1fr; }
      .receipt { width: min(var(--receipt-width, 280px), calc(100vw - 44px)); }
      .stats { gap: 7px; margin-bottom: 8px; }
      .stat { min-height: 68px; padding: 8px; }
      .stat strong { font-size: 17px; }
      .dashboard-stats .stat { padding: 8px; min-height: 62px; }
      .dashboard-stats .stat span { font-size: 10px; }
      .dashboard-stats .stat small { font-size: 10px; line-height: 1.2; }
      .dashboard-stats .period-stat { grid-column: span 2; }
      .dashboard-stats .period-stat .mini-range { grid-template-columns: 1fr; gap: 4px; margin-top: 5px; }
      .dashboard-stats .period-stat input { height: 27px; padding: 3px 4px; font-size: 10px; }
      .settings-mini-grid { grid-template-columns: 1fr; }
      .network-grid,
      .network-metrics,
      .integration-card-grid {
        grid-template-columns: 1fr;
      }
      .legal-doc-row { grid-template-columns: 1fr; }
      .legal-doc-row .row-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .legal-group-head { grid-template-columns: auto minmax(0, 1fr); }
      .legal-group-head small { grid-column: 2; white-space: normal; }
      .legal-preview-modal {
        width: 100% !important;
        max-width: 100%;
        max-height: calc(100dvh - var(--android-safe-top, 0px) - var(--android-safe-bottom, 0px));
      }
      .legal-preview-modal .panel-body {
        padding: 10px 10px max(14px, calc(var(--android-safe-bottom, 0px) + 10px));
      }
      .legal-preview-text {
        max-height: none;
        padding: 12px 12px max(30px, calc(var(--android-safe-bottom, 0px) + 18px));
        font-size: 10.5px;
      }
      .legal-preview-actions {
        display: grid;
        grid-template-columns: 1fr;
        padding-bottom: max(6px, var(--android-safe-bottom, 0px));
      }
      #view-settings:not(.hidden),
      #view-receipts:not(.hidden),
      #view-reports:not(.hidden),
      #view-history:not(.hidden) {
        padding-bottom: max(48px, calc(var(--android-safe-bottom, 0px) + 36px));
      }
    }

    @media (max-width: 420px) {
      .dashboard-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .dashboard-stats .period-stat { grid-column: span 2; }
      .nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .nav button {
        min-height: 44px;
        padding: 5px;
        font-size: 11px;
      }
      .nav button span:nth-child(2) {
        display: block;
        white-space: normal;
        overflow-wrap: anywhere;
      }
      .shift-current .row-actions { grid-template-columns: 1fr; }
      table { font-size: 11px; }
      th, td { padding: 7px 5px; }
      .btn { min-height: 38px; }
    }

    @media (orientation: landscape) and (max-height: 560px) {
      .app {
        grid-template-columns: 168px minmax(0, 1fr);
        grid-template-rows: minmax(0, 1fr);
      }
      .sidebar {
        height: 100%;
        max-height: 100%;
        overflow: hidden;
        grid-template-rows: auto minmax(0, 1fr) auto;
        gap: 6px;
        padding: 6px 8px;
      }
      .brand { gap: 7px; padding-right: 28px; }
      .brand-mark { width: 30px; height: 30px; border-radius: 9px; }
      .brand h1 { font-size: 14px; }
      .brand span { display: none; }
      .app-exit-button { top: 6px; right: 6px; width: 26px; height: 26px; border-radius: 8px; font-size: 16px; }
      .nav {
        grid-template-columns: 1fr;
        gap: 3px;
        overflow: hidden;
      }
      .nav button {
        min-height: 27px;
        padding: 4px 5px;
        grid-template-columns: 17px minmax(0, 1fr);
        font-size: 10px;
      }
      .nav button .badge { display: none; }
      .shift-box.as-nav-note {
        position: static;
        padding: 5px 6px;
        border-radius: 10px;
        font-size: 10px;
      }
      .sync-state { display: none; }
      .main { padding: 6px 8px max(18px, calc(var(--android-safe-bottom, 0px) + 10px)); gap: 6px; }
      .topline { padding: 6px 8px; margin: 0; min-height: 38px; }
      .topline h2 { font-size: 18px; }
      .topline p { display: none; }
      .stats { gap: 5px; margin-bottom: 5px; }
      #view-dashboard:not(.hidden) { overflow-y: auto; overflow-x: hidden; }
      #view-dashboard .dashboard-stats {
        grid-template-columns: repeat(5, minmax(0, 1fr));
      }
      #view-dashboard .dashboard-stats .period-stat {
        grid-column: auto;
      }
      #view-dashboard .dashboard-bottom {
        grid-template-columns: 1fr;
      }
      #view-dashboard .dashboard-events-panel {
        display: none;
      }
      .stat { min-height: 50px; padding: 6px; }
      .stat span { font-size: 9px; }
      .stat strong { margin-top: 3px; font-size: 14px; }
      .dashboard-stats .stat small { display: none; }
      .mini-range {
        grid-template-columns: 1fr;
        gap: 4px;
        margin-top: 6px;
      }
      .mini-range input {
        height: 22px;
        padding: 3px 4px;
        font-size: 9px;
      }
      .two-col {
        grid-template-columns: minmax(0, 1.25fr) minmax(240px, .75fr);
        gap: 8px;
      }
      #view-pos .panel-body {
        padding: 8px;
      }
      #view-pos .toolbar {
        padding: 8px;
        gap: 6px;
      }
      #view-pos .cart-list {
        max-height: 184px;
      }
      #view-pos > .panel:last-child {
        display: none;
      }
      .history-list { gap: 6px; }
      .compact-event {
        grid-template-columns: minmax(0, 1fr) auto;
        padding: 7px 8px;
      }
      .compact-event br {
        display: none;
      }
      .compact-event > div:first-child {
        grid-column: 1 / -1;
        display: flex;
        justify-content: space-between;
      }
      .quick-money-panel { min-height: 134px; margin-bottom: 8px !important; }
      .quick-money-body { grid-template-columns: minmax(126px, .45fr) minmax(190px, 1fr); gap: 8px; min-height: 82px; }
      .quick-money-body strong { font-size: 15px; }
      .quick-money-body small { display: block; font-size: 10px; line-height: 1.18; }
      .quick-money-body .row-actions { display: grid; grid-template-columns: repeat(2, minmax(88px, 1fr)); gap: 6px; }
      .quick-money-body .btn { min-height: 40px; padding: 7px 7px; font-size: 10px; }
      .shift-current .row-actions {
        grid-template-columns: repeat(5, minmax(66px, 1fr));
        gap: 5px;
      }
      .shift-current .row-actions .btn {
        min-height: 34px;
        padding-inline: 4px;
        border-radius: 10px;
        font-size: 9px;
      }
      .panel-head { padding: 7px 8px; }
      .panel-body { padding: 7px 8px; }
    }

    @media (orientation: landscape) and (min-width: 681px) and (max-width: 1280px) {
      .app {
        grid-template-columns: 220px minmax(0, 1fr);
      }
      .sidebar {
        gap: 8px;
        padding: 12px 10px 16px;
      }
      .profile { display: none; }
      .brand span { display: none; }
      .nav { gap: 5px; }
      .nav button {
        min-height: 34px;
        padding: 6px 7px;
        grid-template-columns: 22px minmax(0, 1fr);
        font-size: 11px;
      }
      .nav button .badge { display: none; }
      .shift-box.as-nav-note {
        gap: 6px;
        padding-top: 8px;
        font-size: 12px;
      }
      .settings-summary {
        grid-template-columns: repeat(4, minmax(0, 1fr));
      }
      .settings-summary .stat {
        min-height: 76px;
        padding: 10px;
      }
      .settings-summary .stat strong {
        font-size: 16px;
        overflow-wrap: break-word;
      }
      .settings-layout {
        gap: 10px;
      }
      #view-settings table {
        font-size: 11px;
      }
      #view-settings th,
      #view-settings td {
        padding: 7px 6px;
      }
      .settings-mini-grid {
        grid-template-columns: 1fr;
      }
      .settings-profiles-grid {
        grid-template-columns: 1fr;
      }
      .history-toolbar {
        grid-template-columns: repeat(4, minmax(0, 1fr));
      }
      #view-dashboard:not(.hidden) {
        overflow-y: auto;
        overflow-x: hidden;
      }
      #view-dashboard .dashboard-bottom {
        grid-template-columns: 1fr;
      }
      #view-dashboard .dashboard-events-panel {
        display: none;
      }
      #view-stock .toolbar.compact {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch;
      }
      #view-stock #stockSearch {
        grid-column: 1 / -1;
      }
      #view-stock .stock-bottom-actions {
        grid-template-columns: 1fr;
        gap: 7px;
        padding: 10px;
      }
      #view-stock .toolbar.compact .btn {
        min-width: 0;
        min-height: 36px;
        padding-inline: 8px;
        font-size: 11px;
      }
      #view-stock .toolbar.compact .toggle-line {
        min-width: 0;
        white-space: normal;
        line-height: 1.15;
      }
      #view-stock .toolbar.compact .toggle-line span {
        overflow-wrap: anywhere;
      }
      .shift-current .row-actions {
        grid-template-columns: repeat(5, minmax(76px, 1fr));
        gap: 6px;
      }
      .shift-current .row-actions .btn {
        min-height: 38px;
        padding-inline: 5px;
        border-radius: 10px;
        font-size: 10px;
      }
    }

    @media (min-width: 1061px) and (max-height: 820px) {
      .sidebar {
        gap: 10px;
        padding: 12px;
      }
      .brand-mark {
        width: 36px;
        height: 36px;
      }
      .brand span,
      .profile {
        display: none;
      }
      .nav {
        gap: 5px;
      }
      .nav button {
        min-height: 34px;
        padding: 6px 8px;
        grid-template-columns: 24px 1fr auto;
        font-size: 13px;
      }
      .nav button span:first-child {
        font-size: 16px;
      }
      .shift-box {
        gap: 6px;
        padding-top: 8px;
        font-size: 12px;
      }
      .main {
        padding: 14px;
        gap: 10px;
      }
      .topline {
        padding: 12px 14px;
      }
      .topline h2 {
        font-size: 24px;
      }
    }

    body.android-shell .view:not(.hidden) {
      padding-bottom: max(16px, calc(var(--android-nav-safe, 0px) + 10px));
    }

    body.android-shell #view-settings:not(.hidden),
    body.android-shell #view-receipts:not(.hidden),
    body.android-shell #view-reports:not(.hidden),
    body.android-shell #view-history:not(.hidden) {
      padding-bottom: max(18px, calc(var(--android-nav-safe, 0px) + 12px));
    }

    body.android-shell .sidebar {
      grid-template-rows: auto minmax(0, 1fr);
      padding-bottom: 10px;
    }

    body.android-shell .nav {
      min-height: 0;
    }

    body.android-shell .topline {
      min-height: 72px;
      padding: 12px 14px;
      border-radius: 14px;
    }

    body.android-shell .topline h2 {
      font-size: clamp(20px, 3.1vw, 28px);
    }

    body.android-shell .topline p {
      margin-top: 3px;
      font-size: 13px;
    }

    body.android-shell .quick-support-button,
    body.android-shell .quick-sync-button {
      min-height: 38px;
      padding: 7px 10px;
      font-size: 12px;
      white-space: nowrap;
    }

    body.android-shell .sync-state {
      font-size: 11px;
      line-height: 1.25;
    }

    body.android-shell .sync-state span {
      font-size: 10px;
    }

    body.android-shell .shift-state-line {
      font-size: 12px;
      font-weight: 800;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    body.android-shell .main {
      padding-top: 10px;
      gap: 10px;
    }

    body.android-shell .panel,
    body.android-shell .stat,
    body.android-shell .topline {
      box-shadow: 0 10px 28px rgba(36,48,58,.065);
    }

    body.android-shell .report-preview-modal {
      width: min(98vw, 1500px) !important;
      max-width: min(98vw, 1500px);
      max-height: calc(100dvh - var(--android-safe-top, 0px) - 18px);
    }

    body.android-shell .report-preview-modal .panel-body {
      padding: 10px;
    }

    body.android-shell .report-editor {
      max-height: calc(100dvh - var(--android-safe-top, 0px) - var(--android-service-height) - var(--android-nav-safe) - 132px);
      padding: 8px;
    }

    body.android-shell .report-editor .table-scroll {
      overflow: auto;
      max-width: 100%;
    }

    body.android-shell .report-editor table {
      min-width: 860px;
      font-size: 10px;
      table-layout: fixed;
    }

    body.android-shell .legal-preview-modal {
      max-height: calc(100dvh - var(--android-safe-top, 0px) - var(--android-safe-bottom, 0px) - 10px);
    }

    body.android-shell .legal-preview-modal .panel-body {
      padding-bottom: max(14px, calc(var(--android-safe-bottom, 0px) + 10px));
    }

    body.android-shell .report-editor th,
    body.android-shell .report-editor td {
      padding: 4px 5px;
      font-size: 10px;
      line-height: 1.18;
    }

    @media (orientation: portrait) {
      body.android-shell {
        --android-nav-safe: max(58px, env(safe-area-inset-bottom));
        --android-service-height: 92px;
      }

      body.android-shell .main {
        padding: 8px 10px max(12px, calc(var(--android-nav-safe) + 6px));
      }

      body.android-shell .sidebar {
        padding: 8px 10px 6px;
      }

      body.android-shell .mobile-nav-toggle {
        display: flex;
        min-height: 50px;
        padding: 10px 13px;
        font-size: 14px;
      }

      body.android-shell .nav {
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        transition: max-height 220ms ease, opacity 180ms ease;
        will-change: max-height, opacity;
      }

      body.android-shell.nav-expanded .nav {
        max-height: 62dvh;
        opacity: 1;
        overflow-y: auto;
      }

      body.android-shell.nav-expanded .nav button {
        min-height: 46px;
        padding: 8px 9px;
        font-size: 12px;
        line-height: 1.18;
      }

      body.android-shell .shift-box.as-nav-note {
        left: 8px;
        right: 8px;
        bottom: max(8px, calc(env(safe-area-inset-bottom) + 8px));
        grid-template-columns: minmax(76px, .56fr) minmax(90px, .66fr) minmax(106px, .8fr) minmax(0, 1fr);
        grid-template-areas:
          "profile support create syncstate"
          "sync sync shift syncstate";
        min-height: var(--android-service-height);
        padding: 8px 9px;
        gap: 6px;
        border-radius: 14px;
      }

      body.android-shell .quick-support-button,
      body.android-shell .quick-support-create-button,
      body.android-shell .quick-profile-button,
      body.android-shell .quick-sync-button {
        min-height: 32px;
        padding: 6px 8px;
        font-size: 10.5px;
      }

      body.android-shell .shift-state-line,
      body.android-shell .sync-state {
        font-size: 10px;
      }

      body.android-shell .sync-state span {
        font-size: 9px;
      }

      body.android-shell .topline {
        min-height: 52px;
        padding: 8px 10px;
      }

      body.android-shell .support-chat-fab {
        right: 12px;
        bottom: max(92px, calc(var(--android-nav-safe) + 28px));
        width: 48px;
        height: 48px;
        border-radius: 16px;
      }

      body.android-shell .support-chat-widget {
        right: 10px;
        bottom: max(148px, calc(var(--android-nav-safe) + 84px));
        max-height: calc(100dvh - var(--android-safe-top) - var(--android-nav-safe) - 110px);
      }
    }

    @media (orientation: landscape) {
      body.android-shell #appRoot.app,
      body.android-shell .app {
        grid-template-columns: clamp(168px, 19vw, 220px) minmax(0, 1fr);
        grid-template-rows: minmax(0, 1fr);
      }

      body.android-shell .sidebar {
        position: relative;
        height: auto;
        min-height: 0;
        max-height: none;
        overflow: hidden;
        grid-template-rows: auto minmax(0, 1fr) auto;
      }

      body.android-shell .nav {
        grid-template-columns: 1fr;
        overflow-x: hidden;
        overflow-y: auto;
        scrollbar-width: thin;
      }

      body.android-shell .main {
        padding-bottom: max(12px, calc(var(--android-nav-safe) + 8px));
      }

      body.android-shell .shift-box.as-nav-note {
        position: static;
        left: auto;
        right: auto;
        bottom: auto;
        z-index: auto;
        min-height: auto;
        grid-template-columns: 1fr;
        grid-template-areas:
          "support"
          "sync"
          "shift"
          "syncstate";
        padding: 8px 0 0;
        border: 0;
        border-top: 1px solid rgba(255,255,255,.1);
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        backdrop-filter: none;
        gap: 6px;
      }

      body.android-shell .topline {
        min-height: 56px;
        padding: 8px 12px;
      }
    }

    @keyframes modalIn {
      from { opacity: 0; transform: translateY(18px) scale(.975); filter: blur(2px); }
      to { opacity: 1; transform: translateY(0) scale(1); }
    }

    @keyframes backdropIn {
      from { opacity: 0; }
      to { opacity: 1; }
    }

    @keyframes toastIn {
      from { opacity: 0; transform: translateY(8px); }
      to { opacity: 1; transform: translateY(0); }
    }

    @keyframes pulseLamp {
      0%, 100% { transform: scale(1); opacity: .9; }
      50% { transform: scale(1.35); opacity: 1; }
    }

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

    @media print {
      @page { size: auto; margin: 3mm; }
      @page report { size: A4 portrait; margin: 15mm 18mm; }
      @page shift-report {
        size: A4 portrait;
        margin: 15mm 18mm;
        @bottom-center { content: "Страница " counter(page) " из " counter(pages); }
      }
      @page receipt { size: auto; margin: 2mm; }
      body * { visibility: hidden; }
      #printRoot,
      #printRoot * { visibility: visible; }
      #printRoot {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        box-shadow: none;
        max-width: 100%;
        visibility: visible !important;
        display: block !important;
        color: #000 !important;
        background: #fff !important;
      }
      #printRoot h2 {
        margin: 0 0 10px;
        font-size: 18px;
      }
      .receipt {
        white-space: normal !important;
        min-height: auto !important;
        break-inside: avoid;
        page-break-inside: avoid;
      }
      .receipt-print .receipt {
        width: var(--receipt-width, 58mm) !important;
        max-width: none;
        border: 0 !important;
      }
      #printRoot.receipt-print { page: receipt; }
      #printRoot.report-print { page: report; }
      #printRoot.shift-report-print { page: shift-report; }
      .report-print {
        font-family: Arial, sans-serif;
        font-size: 10px;
      }
      .report-sheet {
        break-inside: avoid;
        page-break-inside: avoid;
        margin-bottom: 14px;
      }
      .shift-report-print {
        padding: 0 !important;
        font-size: 8px !important;
        line-height: 1.12 !important;
      }
      .shift-report-print .report-sheet {
        margin-bottom: 7px !important;
        break-inside: auto !important;
        page-break-inside: auto !important;
      }
      .shift-report-print .report-sheet h3 {
        margin-bottom: 4px !important;
        font-size: 11px !important;
      }
      .shift-report-print table {
        font-size: 7.5px !important;
      }
      .shift-report-print th,
      .shift-report-print td {
        padding: 2px 3px !important;
        line-height: 1.08 !important;
      }
      .shift-report-print thead { display: table-header-group !important; }
      .shift-report-print tr {
        break-inside: avoid !important;
        page-break-inside: avoid !important;
      }
      .report-sheet h3 {
        margin: 0 0 7px;
        font-size: 13px;
      }
      .report-print table {
        width: 100%;
        border-collapse: collapse !important;
        border-spacing: 0 !important;
        table-layout: auto;
        border: 1.5px solid #111 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        font-size: 9px;
      }
      .report-print thead {
        display: table-header-group;
      }
      .report-print tr {
        break-inside: avoid;
        page-break-inside: avoid;
      }
      .report-print th,
      .report-print td {
        border: 1px solid #111 !important;
        padding: 3px 4px !important;
        color: #000 !important;
        background: #fff !important;
        line-height: 1.15;
        overflow-wrap: break-word;
        word-break: normal;
      }
      .report-print th {
        background: #e9eef2 !important;
        font-weight: 800;
      }
      .modal-backdrop { position: static; background: transparent; padding: 0; }
      .modal { box-shadow: none; max-height: none; overflow: visible; }
      .modal-head, .btn, .row-actions { display: none !important; }
      .receipt, .price-card {
        border: 3px solid #000 !important;
        box-shadow: none;
      }
      .receipt-print h2 {
        display: none;
      }
    }

    .print-root {
      display: none;
    }

    .report-meta {
      margin: 0 0 10px;
      color: #4b5560;
      font-size: 12px;
      font-weight: 700;
    }

    :root {
      --bg: #0d1117;
      --bg2: #111821;
      --panel: #1a222d;
      --panel2: #141b23;
      --line: rgba(203, 213, 225, .12);
      --text: #edf7fb;
      --muted: #b3c3cf;
      --muted2: #8fa0ad;
      --accent: #39a7d8;
      --accent2: #67c7e8;
      --accent-soft: rgba(57, 167, 216, .16);
      --danger: #fb7185;
      --success: #35d39d;
      --warning: #f6c76f;
      --shadow: 0 20px 60px rgba(0, 0, 0, .32);
      --shadow-soft: 0 10px 30px rgba(0, 0, 0, .22);
      --radius: 8px;
      --radius-sm: 6px;
      --sidebar-bg: linear-gradient(180deg, #101722 0%, #0d1117 100%);
    }

    html {
      scrollbar-color: rgba(79,183,255,.44) #0d1117;
      scrollbar-width: thin;
    }

    *::-webkit-scrollbar {
      width: 10px;
      height: 10px;
    }

    *::-webkit-scrollbar-track {
      background: #0d1117;
      border-radius: 999px;
    }

    *::-webkit-scrollbar-thumb {
      background: linear-gradient(180deg, rgba(79,183,255,.72), rgba(125,211,252,.36));
      border: 2px solid #0d1117;
      border-radius: 999px;
    }

    body {
      background:
        radial-gradient(circle at 18% -8%, rgba(79,183,255,.18), transparent 34%),
        radial-gradient(circle at 94% 18%, rgba(53,211,157,.08), transparent 30%),
        linear-gradient(135deg, #0d1117 0%, #101722 48%, #0b1017 100%) !important;
      color: var(--text);
      font-family: "Inter", "Segoe UI Variable", "Segoe UI", Arial, sans-serif;
      letter-spacing: 0;
    }

    .app {
      background: rgba(13,17,23,.9);
      color: var(--text);
    }

    .sidebar {
      background: var(--sidebar-bg) !important;
      border-right: 1px solid var(--line);
      box-shadow: 18px 0 46px rgba(0,0,0,.18);
    }

    .brand,
    .shift-box,
    .topline,
    .panel,
    .stat,
    .modal,
    .settings-mini,
    .settings-card,
    .legal-group,
    .support-thread-row,
    .support-chat-message,
    .integration-card,
    .integration-panel-dark,
    .network-card,
    .report-editor,
    .price-card,
    .receipt,
    .subscription-banner {
      background: linear-gradient(180deg, rgba(26,34,45,.96), rgba(20,27,35,.96)) !important;
      border: 1px solid var(--line) !important;
      border-radius: var(--radius) !important;
      box-shadow: var(--shadow-soft);
      color: var(--text);
    }

    .panel,
    .stat,
    .settings-card,
    .network-card,
    .integration-card {
      transition: transform 190ms ease, border-color 190ms ease, box-shadow 190ms ease, background 190ms ease;
    }

    .panel:hover,
    .stat:hover,
    .settings-card:hover,
    .network-card:hover,
    .integration-card:hover {
      transform: translateY(-1px);
      border-color: rgba(79,183,255,.34) !important;
      box-shadow: 0 18px 48px rgba(0,0,0,.28), 0 0 0 1px rgba(79,183,255,.08);
    }

    .main,
    .view,
    .panel-body,
    .modal .panel-body {
      color: var(--text);
    }

    .topline h2,
    .panel-head h3,
    h1, h2, h3, h4,
    strong {
      color: var(--text);
    }

    .topline p,
    .muted,
    small,
    .panel-head span,
    .stat span,
    label,
    td span {
      color: var(--muted) !important;
    }

    .nav button,
    .mobile-nav-toggle,
    .quick-support-button,
    .quick-support-create-button,
    .quick-profile-button,
    .quick-sync-button {
      background: transparent !important;
      color: var(--muted) !important;
      border: 1px solid transparent !important;
      border-radius: var(--radius-sm) !important;
      transition: background 180ms ease, color 180ms ease, transform 180ms ease, border-color 180ms ease;
    }

    .nav button:hover,
    .nav button.active,
    .mobile-nav-toggle:hover,
    .quick-support-button:hover,
    .quick-support-create-button:hover,
    .quick-profile-button:hover,
    .quick-sync-button:hover {
      background: rgba(57, 167, 216, .13) !important;
      color: var(--text) !important;
      border-color: rgba(79,183,255,.24) !important;
      transform: translateY(-1px);
    }

    .btn {
      min-height: 40px;
      border-radius: var(--radius-sm) !important;
      border: 1px solid rgba(203,213,225,.16) !important;
      background: linear-gradient(180deg, rgba(31,42,56,.96), rgba(21,30,41,.96)) !important;
      color: var(--text) !important;
      box-shadow: 0 10px 22px rgba(0,0,0,.18);
      transition: transform 170ms ease, box-shadow 170ms ease, border-color 170ms ease, background 170ms ease;
    }

    .btn:hover:not(:disabled) {
      transform: translateY(-1px) scale(1.01);
      border-color: rgba(103,199,232,.42) !important;
      box-shadow: 0 14px 30px rgba(0,0,0,.24);
    }

    .btn.primary {
      background: linear-gradient(180deg, #238ab7, #17657f) !important;
      border-color: rgba(103,199,232,.48) !important;
      color: #f4fbff !important;
      font-weight: 800;
      text-shadow: 0 1px 0 rgba(0,0,0,.22);
    }

    .btn.danger {
      background: linear-gradient(180deg, rgba(251,113,133,.92), rgba(168,50,70,.92)) !important;
      border-color: rgba(251,113,133,.58) !important;
      color: #fff !important;
    }

    .btn.ghost,
    .btn.small {
      box-shadow: none;
    }

    input,
    select,
    textarea {
      background: #0f1620 !important;
      color: var(--text) !important;
      border: 1px solid rgba(203,213,225,.15) !important;
      border-radius: var(--radius-sm) !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
      transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
    }

    input:focus,
    select:focus,
    textarea:focus {
      outline: none;
      border-color: rgba(79,183,255,.66) !important;
      box-shadow: 0 0 0 3px rgba(79,183,255,.14);
    }

    input::placeholder,
    textarea::placeholder {
      color: rgba(169,182,198,.68);
    }

    table {
      border-collapse: separate;
      border-spacing: 0;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #101722;
    }

    th {
      position: sticky;
      top: 0;
      z-index: 1;
      background: #16202b !important;
      color: #dbeafe !important;
      border-bottom: 1px solid var(--line) !important;
      font-weight: 800;
    }

    td {
      background: rgba(20,27,35,.82) !important;
      color: var(--text) !important;
      border-bottom: 1px solid rgba(203,213,225,.08) !important;
    }

    tbody tr:nth-child(even) td {
      background: rgba(24,34,46,.88) !important;
    }

    tbody tr:hover td {
      background: rgba(79,183,255,.1) !important;
    }

    .tag,
    .status,
    .integration-status {
      border-radius: 999px !important;
      border: 1px solid rgba(203,213,225,.16) !important;
      background: rgba(79,183,255,.12) !important;
      color: #c7ecff !important;
    }

    .tag.red,
    .status.red {
      background: rgba(251,113,133,.14) !important;
      color: #fecdd3 !important;
      border-color: rgba(251,113,133,.32) !important;
    }

    .tag.green,
    .status.green {
      background: rgba(53,211,157,.13) !important;
      color: #bbf7d0 !important;
      border-color: rgba(53,211,157,.28) !important;
    }

    .modal-backdrop {
      background: rgba(3,7,12,.72) !important;
      backdrop-filter: blur(18px) saturate(1.12);
    }

    .modal {
      box-shadow: var(--shadow);
      overflow: hidden;
    }

    .modal-head,
    .panel-head {
      background: linear-gradient(180deg, rgba(22,32,43,.96), rgba(20,27,35,.8));
      border-bottom: 1px solid var(--line);
    }

    .table-notice,
    .empty,
    .legal-preview-text {
      background: rgba(15,22,32,.8) !important;
      border: 1px solid var(--line) !important;
      color: #c7d5df !important;
      border-radius: var(--radius) !important;
    }

    .purchase-quote,
    .activation-purchase-actions,
    .activation-legal-strip,
    .activation-qr-modal,
    .legal-consent-box,
    .support-card {
      background: linear-gradient(180deg, rgba(22,31,42,.98), rgba(15,22,32,.98)) !important;
      border: 1px solid rgba(148,163,184,.16) !important;
      color: var(--text) !important;
      box-shadow: var(--shadow-soft);
    }

    .activation-purchase-modal > .toggle-line {
      background: linear-gradient(180deg, rgba(22,31,42,.98), rgba(12,19,29,.98)) !important;
      border: 1px solid rgba(148,163,184,.18) !important;
      color: #d6e2ea !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    }

    .activation-purchase-modal > .toggle-line span {
      color: #d6e2ea !important;
      font-weight: 600;
    }

    .purchase-quote strong {
      color: #d9f6ff !important;
    }

    .purchase-quote small,
    .purchase-quote span,
    .activation-purchase-modal p,
    .activation-qr-modal p,
    .table-notice small {
      color: #b9c8d3 !important;
    }

    .activation-purchase-actions {
      box-shadow: 0 -18px 28px rgba(3,7,12,.38) !important;
    }

    .toggle-line span,
    .modal label,
    .modal td,
    .modal p {
      color: #d6e2ea;
    }

    .btn.primary:disabled,
    .btn:disabled {
      opacity: .56;
      filter: saturate(.76);
      color: #b9c8d3 !important;
    }

    .modal .table-notice *,
    .settings-mini *,
    .purchase-quote *,
    .support-card *,
    .activation-legal-strip *,
    .activation-purchase-actions *,
    .legal-consent-box * {
      text-shadow: none;
    }

    .modal .table-notice strong,
    .settings-mini strong,
    .purchase-quote strong {
      color: #e8fbff !important;
    }

    .modal select option {
      background: #101722;
      color: #edf7fb;
    }

    .request-summary-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
      gap: 10px;
    }

    .request-summary-grid .settings-mini {
      min-height: 84px;
    }

    .dashboard-stats .stat strong,
    .stat strong {
      color: #e0f2fe;
      font-size: clamp(20px, 2vw, 30px);
    }

    .cart,
    .cart-list,
    .product-card,
    .support-chat-widget {
      background: rgba(20,27,35,.96) !important;
      border-color: var(--line) !important;
      color: var(--text);
    }

    .support-chat-message.user {
      background: rgba(79,183,255,.16) !important;
      border-color: rgba(79,183,255,.28) !important;
    }

    .support-chat-message.owner {
      background: rgba(53,211,157,.12) !important;
      border-color: rgba(53,211,157,.22) !important;
    }

    .login-card.activation-login-card,
    .activation-main-panel,
    .activation-side-panel,
    .activation-purchase-modal,
    .activation-shell,
    .activation-card,
    .first-run,
    .first-run-card,
    .auth-card {
      background: linear-gradient(180deg, rgba(25,34,44,.99), rgba(10,17,24,.99)) !important;
      border: 1px solid var(--line) !important;
      box-shadow: var(--shadow);
      color: var(--text) !important;
    }

    .login-card.activation-login-card {
      border-color: rgba(103,199,232,.22) !important;
      box-shadow: 0 28px 84px rgba(0,0,0,.46), 0 0 0 1px rgba(103,199,232,.08);
    }

    .activation-heading-copy h2,
    .activation-login-card h2,
    .activation-purchase-modal h3,
    .modal-head h3 {
      color: #f0fbff !important;
      text-shadow: 0 1px 0 rgba(0,0,0,.32);
    }

    .activation-heading-copy p,
    .activation-login-card p,
    .activation-login-card span,
    .activation-login-card small,
    .activation-purchase-modal label,
    .activation-purchase-modal small,
    .activation-purchase-modal span {
      color: #bfd0da !important;
    }

    .activation-login-card input,
    .activation-login-card select,
    .activation-login-card textarea,
    .activation-purchase-modal input,
    .activation-purchase-modal select,
    .activation-purchase-modal textarea {
      background: #0b141d !important;
      color: #eef8fb !important;
      border-color: rgba(148,163,184,.22) !important;
    }

    .activation-login-card input::placeholder,
    .activation-purchase-modal input::placeholder,
    .activation-purchase-modal textarea::placeholder {
      color: rgba(190,208,218,.7) !important;
    }

    .employee-login-card {
      position: relative;
      overflow: hidden;
      padding: 16px !important;
      border: 1px solid rgba(103,199,232,.28) !important;
      background:
        linear-gradient(180deg, rgba(22,34,46,.98), rgba(8,15,23,.98)) !important;
      box-shadow: 0 18px 46px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.05) !important;
      color: #edf8fc !important;
    }

    .employee-login-card::before {
      display: none !important;
    }

    .employee-login-card h3 {
      color: #f6fcff !important;
      font-size: 19px;
      line-height: 1.25;
    }

    .employee-login-card p,
    .employee-login-card .muted {
      color: #c9d9e4 !important;
      line-height: 1.45;
    }

    .employee-login-card label {
      color: #e3f0f6 !important;
      font-weight: 700;
    }

    .employee-login-card input {
      margin-top: 7px;
      background: #07131e !important;
      color: #f3fbff !important;
      border-color: rgba(103,199,232,.28) !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    }

    .employee-login-card input:focus {
      border-color: rgba(53,211,157,.72) !important;
      box-shadow: 0 0 0 3px rgba(53,211,157,.14), inset 0 1px 0 rgba(255,255,255,.05);
    }

    .employee-login-card .btn {
      width: 100%;
      justify-content: center;
      min-height: 44px;
      font-weight: 600;
      letter-spacing: .015em;
      box-shadow: 0 12px 28px rgba(53,211,157,.18);
    }

    .activation-login-card .section-card,
    .activation-login-card .table-notice {
      background: linear-gradient(180deg, rgba(16,24,34,.98), rgba(8,14,22,.98)) !important;
      border-color: rgba(103,199,232,.18) !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
      color: #e8f4f8 !important;
    }

    .activation-login-card .login-logo {
      background-color: #071522 !important;
      border: 1px solid rgba(103,199,232,.28) !important;
      box-shadow: 0 12px 26px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.06) !important;
    }

    .activation-login-card .login-logo::before,
    .activation-login-card .login-logo::after {
      display: none !important;
    }

    .activation-actions-grid .btn,
    .activation-main-panel > .btn,
    .activation-side-panel .btn {
      font-weight: 600;
      letter-spacing: .015em;
    }

    .activation-card p,
    .first-run-card p,
    .auth-card p {
      color: var(--muted) !important;
    }

    @media (max-width: 680px) {
      body {
        background: #0d1117 !important;
      }

      .app,
      body.android-shell .app {
        background: #0d1117 !important;
      }

      .panel,
      .topline,
      .stat,
      .modal,
      .settings-card {
        border-radius: 7px !important;
      }

      .btn {
        min-height: 42px;
      }

      table {
        font-size: 12px;
      }
    }

    :root {
      --bg: #17130f;
      --bg2: #211a15;
      --panel: #241d18;
      --panel2: #1b1511;
      --line: rgba(226, 214, 194, .16);
      --text: #f3ece2;
      --muted: #c8b9a7;
      --muted2: #a99a8b;
      --accent: #4fb5a6;
      --accent2: #82d2c3;
      --accent-soft: rgba(79, 181, 166, .16);
      --sidebar-bg: linear-gradient(180deg, #17130f 0%, #11100e 100%);
      --workspace-bg: #17130f;
      --shadow-soft: 0 10px 28px rgba(7, 5, 4, .28);
    }

    body {
      background:
        radial-gradient(circle at 12% -10%, rgba(130, 210, 195, .12), transparent 32%),
        linear-gradient(135deg, #17130f 0%, #211a15 54%, #11100e 100%) !important;
      color: var(--text);
    }

    .app,
    body.android-shell .app,
    .main {
      background: linear-gradient(135deg, #17130f 0%, #211a15 58%, #15110e 100%) !important;
    }

    .topline,
    .panel,
    .stat,
    .modal,
    .settings-mini,
    .settings-card,
    .network-card,
    .network-metric,
    .network-setup-hint,
    .report-editor,
    .order-source-card,
    .cart,
    .cart-list,
    .product-card {
      background: linear-gradient(180deg, rgba(42, 33, 27, .98), rgba(27, 21, 17, .98)) !important;
      border-color: rgba(226, 214, 194, .16) !important;
      color: var(--text) !important;
    }

    .settings-tabs-panel,
    .settings-tabs {
      background: rgba(33, 26, 21, .92) !important;
      border-color: rgba(226, 214, 194, .14) !important;
    }

    .settings-tabs button {
      background: rgba(42, 33, 27, .72) !important;
      border-color: rgba(226, 214, 194, .12) !important;
      color: #c8b9a7 !important;
    }

    .settings-tabs button.active {
      background: rgba(79, 181, 166, .2) !important;
      border-color: rgba(130, 210, 195, .5) !important;
      color: #f5fffb !important;
    }

    input,
    select,
    textarea {
      background: #15110e !important;
      border-color: rgba(226, 214, 194, .2) !important;
      color: #f7efe5 !important;
    }

    input::placeholder,
    textarea::placeholder,
    .network-metric span,
    .settings-mini small,
    .settings-card small,
    .panel-head span,
    .topline p,
    label,
    td span {
      color: var(--muted) !important;
    }

    .network-metric {
      min-height: 64px;
      padding: 10px 12px;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.03), var(--shadow-soft);
    }

    .network-metric strong {
      color: #f7efe5 !important;
      font-size: 20px;
      line-height: 1.05;
    }

    .network-setup-hint p {
      color: rgba(243, 236, 226, .76) !important;
      margin: 4px 0 0;
    }

    .brand.network-setup-needed {
      padding-right: 28px;
    }

    .brand.network-setup-needed::after {
      right: 28px;
      top: -6px;
      max-width: calc(100% - 58px);
      overflow: hidden;
      text-overflow: ellipsis;
      background: #82d2c3;
      color: #0f1f1c;
      box-shadow: 0 4px 14px rgba(0,0,0,.18);
    }

    body.android-shell .app-exit-button {
      top: 8px;
      right: 8px;
      width: 28px;
      height: 28px;
      border-radius: 9px;
      background: rgba(12, 10, 8, .86);
      border-color: rgba(226, 214, 194, .2);
      color: #f7efe5;
      font-size: 18px;
    }

    body.android-shell .shift-box.as-nav-note {
      background: rgba(23, 19, 15, .96) !important;
      border-color: rgba(226, 214, 194, .14) !important;
      color: #eaded0;
    }

    body.android-shell .quick-support-button,
    body.android-shell .quick-support-create-button,
    body.android-shell .quick-profile-button,
    body.android-shell .quick-sync-button {
      color: #eaded0 !important;
    }

    @media (orientation: landscape) and (min-width: 681px) and (max-width: 1280px) {
      body.android-shell .app {
        grid-template-columns: clamp(176px, 16.5vw, 204px) minmax(0, 1fr);
      }

      body.android-shell .sidebar {
        padding: 8px 8px 10px;
        gap: 7px;
      }

      body.android-shell .brand {
        gap: 8px;
        min-height: 50px;
        padding: 6px 30px 6px 6px;
        border-radius: 10px !important;
      }

      body.android-shell .brand-mark {
        width: 34px;
        height: 34px;
        border-radius: 10px;
      }

      body.android-shell .brand h1 {
        font-size: 14px;
        line-height: 1.05;
      }

      body.android-shell .nav {
        gap: 3px;
      }

      body.android-shell .nav button {
        min-height: 31px;
        padding: 5px 6px;
        grid-template-columns: 20px minmax(0, 1fr);
        font-size: 10.5px;
      }

      body.android-shell .shift-box.as-nav-note {
        gap: 4px;
        padding-top: 6px;
        font-size: 10px;
      }

      body.android-shell .quick-support-button,
      body.android-shell .quick-support-create-button,
      body.android-shell .quick-profile-button,
      body.android-shell .quick-sync-button {
        min-height: 28px;
        padding: 4px 6px;
        font-size: 9.5px;
      }

      body.android-shell .shift-state-line,
      body.android-shell .sync-state,
      body.android-shell .sync-state span {
        font-size: 9px;
        line-height: 1.15;
      }

      body.android-shell .topline {
        min-height: 50px;
        padding: 7px 12px;
      }

      body.android-shell .network-metrics {
        gap: 8px;
      }

      body.android-shell .network-metric {
        min-height: 56px;
        padding: 8px 10px;
      }

      body.android-shell .network-metric span {
        font-size: 10px;
      }

      body.android-shell .network-metric strong {
        font-size: 17px;
      }
    }

    :root {
      --text: #eadfd1;
      --text-strong: #f1e7da;
      --muted: #c3b3a2;
      --muted2: #9f907f;
      --field-bg: #11100e;
      --card-bg: rgba(38, 30, 24, .98);
      --card-bg-2: rgba(27, 21, 17, .98);
      --soft-line: rgba(226, 214, 194, .18);
    }

    body,
    .app,
    .main,
    .view,
    .panel-body,
    .modal .panel-body {
      color: var(--text) !important;
    }

    .login-screen {
      background:
        radial-gradient(circle at 22% 12%, rgba(79, 181, 166, .16), transparent 30%),
        linear-gradient(135deg, rgba(13, 80, 70, .9), rgba(22, 18, 14, .94)) !important;
    }

    .login-card,
    .login-card.activation-login-card,
    .activation-main-panel,
    .activation-side-panel,
    .activation-purchase-modal,
    .activation-shell,
    .activation-card,
    .first-run,
    .first-run-card,
    .auth-card,
    .demo-welcome-card,
    .purchase-quote,
    .activation-legal-strip,
    .legal-consent-box,
    .legal-group,
    .legal-acceptance-summary,
    .download-row,
    .table-notice,
    .support-card,
    .settings-logo-row,
    .section-card,
    .subscription-banner {
      background: linear-gradient(180deg, var(--card-bg), var(--card-bg-2)) !important;
      border: 1px solid var(--soft-line) !important;
      color: var(--text) !important;
      box-shadow: 0 18px 48px rgba(7, 5, 4, .28);
    }

    .login-card {
      border-radius: 14px !important;
    }

    .login-card h2,
    .login-card h3,
    .login-card h4,
    .activation-heading-copy h2,
    .activation-login-card h2,
    .activation-purchase-modal h3,
    .modal-head h3,
    .panel-head h3,
    .topline h2,
    .settings-card h3,
    .network-card h4,
    h1, h2, h3, h4 {
      color: var(--text-strong) !important;
      text-shadow: none !important;
    }

    .login-card p,
    .login-card label,
    .login-card small,
    .login-card span,
    .activation-heading-copy p,
    .activation-login-card p,
    .activation-login-card span,
    .activation-login-card small,
    .activation-purchase-modal label,
    .activation-purchase-modal small,
    .activation-purchase-modal span,
    .legal-consent-box h4,
    .toggle-line span,
    .modal label,
    .modal p,
    .table-notice,
    .table-notice small,
    .purchase-quote small,
    .download-row span,
    .settings-mini small,
    .panel-head span,
    .topline p,
    label,
    small,
    .muted {
      color: var(--muted) !important;
    }

    .login-card strong,
    .table-notice strong,
    .purchase-quote strong,
    .download-row strong,
    .settings-mini strong,
    .network-metric strong,
    .stat strong {
      color: var(--text-strong) !important;
    }

    .legal-consent-box .toggle-line,
    .toggle-line,
    .settings-mini .toggle-line,
    .activation-purchase-modal > .toggle-line {
      background: rgba(23, 19, 15, .92) !important;
      border-color: var(--soft-line) !important;
      color: var(--text) !important;
    }

    input,
    select,
    textarea,
    .login-card input,
    .login-card select,
    .login-card textarea,
    .activation-login-card input,
    .activation-login-card select,
    .activation-login-card textarea,
    .activation-purchase-modal input,
    .activation-purchase-modal select,
    .activation-purchase-modal textarea {
      background: var(--field-bg) !important;
      border-color: rgba(226, 214, 194, .22) !important;
      color: var(--text-strong) !important;
    }

    input::placeholder,
    textarea::placeholder,
    .login-card input::placeholder,
    .activation-login-card input::placeholder,
    .activation-purchase-modal input::placeholder,
    .activation-purchase-modal textarea::placeholder {
      color: rgba(195, 179, 162, .78) !important;
      opacity: 1;
    }

    .btn {
      color: var(--text-strong) !important;
      background: linear-gradient(180deg, rgba(47, 38, 31, .98), rgba(27, 22, 18, .98)) !important;
      border-color: rgba(226, 214, 194, .2) !important;
      text-shadow: none !important;
    }

    .btn.primary {
      background: linear-gradient(180deg, #2c9185, #1d7067) !important;
      border-color: rgba(130, 210, 195, .42) !important;
      color: #f2eee7 !important;
      box-shadow: 0 12px 28px rgba(20, 85, 77, .22);
    }

    .btn:disabled,
    .btn.primary:disabled {
      color: rgba(234, 223, 209, .62) !important;
      opacity: .7;
    }

    .tag,
    .badge,
    .status,
    .integration-status,
    .support-status-pill,
    .demo-version-pill {
      color: #e5d8c8 !important;
      background: rgba(79, 181, 166, .14) !important;
      border-color: rgba(130, 210, 195, .22) !important;
    }

    th {
      color: var(--text-strong) !important;
      background: #211a15 !important;
    }

    td {
      color: var(--text) !important;
      background: rgba(31, 25, 20, .9) !important;
    }

    @media (max-width: 680px) {
      .login-card {
        background: linear-gradient(180deg, rgba(38, 30, 24, .99), rgba(27, 21, 17, .99)) !important;
      }
    }
    :root {
      --bg: #f1eadf;
      --surface: #fffaf2;
      --surface-2: #f7efe4;
      --panel: #fffaf2;
      --panel-2: #f6edde;
      --line: rgba(75, 62, 48, .18);
      --text: #2f2a24;
      --muted: #6f665c;
      --primary: #0f7f73;
      --primary-2: #1f9d8a;
      --accent: #9a6a2f;
      --shadow: 0 14px 30px rgba(72, 56, 38, .12);
    }

    body {
      background: #f1eadf !important;
      color: var(--text) !important;
    }

    body::before {
      opacity: 0 !important;
    }

    .app,
    body.android-shell .app {
      background: #f1eadf !important;
      color: var(--text) !important;
    }

    .main,
    body.android-shell .main {
      background: #f5eee4 !important;
      color: var(--text) !important;
    }

    .topline,
    .panel,
    .settings-tabs-panel,
    .settings-card,
    .section-card,
    .login-card,
    .modal,
    .stat,
    .settings-mini,
    .network-metric,
    .payment-order-card {
      background: var(--surface) !important;
      color: var(--text) !important;
      border-color: var(--line) !important;
      box-shadow: var(--shadow) !important;
    }

    .panel-head,
    .modal-head {
      background: #efe4d6 !important;
      color: var(--text) !important;
      border-color: var(--line) !important;
    }

    .topline h2,
    .panel h3,
    .settings-mini h4,
    .login-card h2,
    label,
    strong,
    th,
    td {
      color: var(--text) !important;
    }

    .topline p,
    .muted,
    .empty,
    small,
    .settings-mini small,
    .sync-mini {
      color: var(--muted) !important;
    }

    input,
    select,
    textarea {
      background: #fffdfa !important;
      color: var(--text) !important;
      border-color: rgba(75, 62, 48, .28) !important;
      box-shadow: none !important;
    }

    input::placeholder,
    textarea::placeholder {
      color: #8c8175 !important;
      opacity: 1 !important;
    }

    .table-notice,
    .legal-required-card,
    .logo-helper-card,
    .logo-preview-card,
    .activation-main-panel,
    .activation-side-panel,
    .employee-login-card {
      background: #f6edde !important;
      color: var(--text) !important;
      border-color: var(--line) !important;
    }

    .tabs {
      background: #fff8ee !important;
      border-color: var(--line) !important;
    }

    .tabs button {
      color: #776b5f !important;
      background: transparent !important;
    }

    .tabs button.active {
      color: #0d655d !important;
      background: #e5f3ef !important;
      border-color: rgba(15, 127, 115, .32) !important;
    }

    .btn.primary {
      background: linear-gradient(135deg, #0f7f73, #229d90) !important;
      color: #ffffff !important;
    }

    .sidebar,
    body.android-shell .sidebar {
      background: #2f3a34 !important;
      color: #f5f0e8 !important;
      border-color: rgba(255,255,255,.12) !important;
    }

    .brand,
    .nav button,
    .shift-box.as-nav-note,
    body.android-shell .shift-box.as-nav-note {
      background: rgba(255, 250, 242, .08) !important;
      color: #f7f0e6 !important;
      border-color: rgba(255,255,255,.12) !important;
    }

    .nav button.active {
      background: rgba(31, 157, 138, .24) !important;
      color: #ffffff !important;
    }

    .shift-box.as-nav-note {
      padding: 10px !important;
      gap: 6px !important;
      font-size: 12px !important;
      line-height: 1.25 !important;
      max-height: 220px;
      overflow: hidden auto;
    }

    .shift-box.as-nav-note .quick-support-button,
    .shift-box.as-nav-note .quick-support-create-button,
    .shift-box.as-nav-note .quick-profile-button,
    .shift-box.as-nav-note .quick-sync-button {
      min-height: 34px !important;
      padding: 7px 9px !important;
      font-size: 12px !important;
      border-radius: 8px !important;
    }

    .shift-box.as-nav-note #shiftMeta,
    .shift-box.as-nav-note #shiftEmail,
    .shift-box.as-nav-note #syncState,
    .shift-box.as-nav-note .shift-state-line {
      font-size: 11px !important;
      line-height: 1.22 !important;
      color: rgba(247, 240, 230, .78) !important;
    }

    body.android-shell .app-exit-button {
      width: 34px !important;
      height: 34px !important;
      min-width: 34px !important;
      border-radius: 10px !important;
      right: 10px !important;
      top: 8px !important;
      display: grid !important;
      place-items: center !important;
      line-height: 1 !important;
    }

    body.android-shell .panel,
    body.android-shell .topline,
    body.android-shell .modal,
    body.android-shell .stat,
    body.android-shell .settings-mini,
    body.android-shell .section-card,
    body.android-shell .login-card {
      -webkit-backdrop-filter: none !important;
      backdrop-filter: none !important;
      box-shadow: 0 8px 18px rgba(72, 56, 38, .10) !important;
    }

    body.android-shell * {
      scroll-behavior: auto !important;
      letter-spacing: 0 !important;
    }

    @media (max-width: 980px) {
      body.android-shell .sidebar {
        padding: 8px !important;
      }

      body.android-shell .brand {
        min-height: 58px !important;
        padding: 8px !important;
      }

      body.android-shell .nav button {
        min-height: 38px !important;
        padding: 8px 10px !important;
        font-size: 13px !important;
      }

      body.android-shell .shift-box.as-nav-note {
        max-height: 150px !important;
        padding: 8px !important;
      }

      body.android-shell .topline {
        padding: 14px !important;
      }
    }

    body.android-shell,
    body.android-shell .app {
      background: #efe7dc !important;
    }

    .login-screen,
    body.android-shell .login-screen {
      background: linear-gradient(180deg, #f4ecdf 0%, #efe4d4 48%, #e8dccb 100%) !important;
      color: #2f2a24 !important;
    }

    .login-card.activation-login-card,
    body.android-shell .login-card.activation-login-card,
    .activation-main-panel,
    .activation-side-panel,
    .activation-purchase-modal,
    .activation-shell,
    .activation-card,
    .first-run,
    .first-run-card,
    .auth-card {
      background: #fff8ef !important;
      color: #2f2a24 !important;
      border-color: rgba(78, 62, 44, .18) !important;
      box-shadow: 0 18px 40px rgba(71, 55, 35, .16) !important;
    }

    @media (max-width: 680px) {
      .login-card,
      .login-card.activation-login-card,
      body.android-shell .login-card,
      body.android-shell .login-card.activation-login-card {
        background: #fff8ef !important;
        color: #2f2a24 !important;
      }
    }

    .activation-heading-copy h2,
    .activation-login-card h2,
    .activation-purchase-modal h3,
    .employee-login-card h3 {
      color: #2f2a24 !important;
      text-shadow: none !important;
    }

    .activation-heading-copy p,
    .activation-login-card p,
    .activation-login-card span,
    .activation-login-card small,
    .activation-login-card label,
    .activation-purchase-modal label,
    .activation-purchase-modal small,
    .activation-purchase-modal span,
    .employee-login-card p,
    .employee-login-card .muted,
    .employee-login-card label {
      color: #5f554b !important;
      text-shadow: none !important;
    }

    .activation-login-card .section-card,
    .activation-login-card .table-notice,
    .activation-main-panel .table-notice,
    .activation-side-panel .section-card,
    .employee-login-card {
      background: #fffdf8 !important;
      color: #2f2a24 !important;
      border-color: rgba(78, 62, 44, .18) !important;
      box-shadow: 0 10px 24px rgba(71, 55, 35, .10) !important;
    }

    .activation-login-card input,
    .activation-login-card select,
    .activation-login-card textarea,
    .activation-purchase-modal input,
    .activation-purchase-modal select,
    .activation-purchase-modal textarea,
    .employee-login-card input {
      background: #fffdf8 !important;
      color: #2f2a24 !important;
      border-color: rgba(78, 62, 44, .30) !important;
      box-shadow: none !important;
    }

    .activation-login-card input::placeholder,
    .activation-login-card textarea::placeholder,
    .activation-purchase-modal input::placeholder,
    .activation-purchase-modal textarea::placeholder,
    .employee-login-card input::placeholder {
      color: #81756a !important;
      opacity: 1 !important;
    }

    .activation-actions-grid .btn:not(.primary),
    .activation-login-card .btn:not(.primary) {
      background: #eadfd0 !important;
      color: #2f2a24 !important;
      border-color: rgba(78, 62, 44, .20) !important;
    }

    .activation-login-card .btn.primary,
    .employee-login-card .btn.primary,
    .activation-actions-grid .btn.primary {
      background: linear-gradient(135deg, #0f8f83, #22b3a2) !important;
      color: #ffffff !important;
      box-shadow: 0 10px 20px rgba(15, 143, 131, .18) !important;
    }

    .login-card.activation-login-card .activation-main-panel,
    .login-card.activation-login-card .activation-side-panel,
    body.android-shell .login-card.activation-login-card .activation-main-panel,
    body.android-shell .login-card.activation-login-card .activation-side-panel {
      background: transparent !important;
      border: 0 !important;
      box-shadow: none !important;
      outline: 0 !important;
      backdrop-filter: none !important;
    }

    .activation-actions-grid,
    .activation-top-actions {
      background: transparent !important;
      border: 0 !important;
      box-shadow: none !important;
      outline: 0 !important;
    }

    .activation-login-card .btn,
    .activation-actions-grid .btn,
    .activation-main-panel > .btn,
    .activation-side-panel .btn,
    .employee-login-card .btn,
    body.android-shell .activation-login-card .btn,
    body.android-shell .employee-login-card .btn {
      box-shadow: none !important;
      filter: none !important;
    }

    .activation-side-panel .section-card.employee-login-card,
    .employee-login-card {
      box-shadow: none !important;
      outline: 0 !important;
    }

    html,
    body,
    .app,
    .main,
    .view {
      overscroll-behavior: contain;
      -webkit-font-smoothing: antialiased;
      text-rendering: optimizeLegibility;
    }

    body.android-shell .main,
    .main {
      scrollbar-gutter: stable both-edges;
      padding-right: max(12px, env(safe-area-inset-right, 0px)) !important;
    }

    *::-webkit-scrollbar {
      width: 8px !important;
      height: 8px !important;
    }

    *::-webkit-scrollbar-track {
      background: rgba(47, 42, 36, .08) !important;
      border-radius: 999px !important;
    }

    *::-webkit-scrollbar-thumb {
      background: rgba(15, 127, 115, .55) !important;
      border: 2px solid rgba(255, 248, 239, .9) !important;
      border-radius: 999px !important;
    }

    body.android-shell *,
    .modal *,
    .panel *,
    .settings-card * {
      transition-duration: 120ms !important;
      animation-duration: 180ms !important;
    }

    body.android-shell .panel,
    body.android-shell .modal,
    body.android-shell .settings-card,
    body.android-shell .section-card,
    body.android-shell .stat,
    body.android-shell .integration-card,
    body.android-shell .network-card,
    body.android-shell .legal-group,
    body.android-shell .legal-doc-row {
      transform: translateZ(0);
      will-change: auto !important;
      -webkit-backdrop-filter: none !important;
      backdrop-filter: none !important;
    }

    .panel,
    .settings-card,
    .section-card,
    .stat,
    .settings-mini,
    .legal-group,
    .legal-doc-row,
    .legal-acceptance-summary,
    .table-notice,
    .network-card,
    .download-row,
    .support-card,
    .activation-login-card,
    .employee-login-card,
    .login-card:not(.activation-login-card) {
      color: #2f2a24 !important;
    }

    .panel h1, .panel h2, .panel h3, .panel h4,
    .settings-card h1, .settings-card h2, .settings-card h3, .settings-card h4,
    .section-card h1, .section-card h2, .section-card h3, .section-card h4,
    .stat strong,
    .legal-doc-row strong,
    .legal-group-head strong,
    .settings-mini strong,
    .table-notice strong,
    td strong,
    th {
      color: #28231e !important;
    }

    .panel p,
    .settings-card p,
    .section-card p,
    .panel span,
    .settings-card span,
    .section-card span,
    .muted,
    .empty,
    small,
    td,
    label {
      color: #5f554b !important;
    }

    .sidebar,
    .sidebar *,
    .support-chat-widget,
    .support-chat-widget *,
    .support-create-modal,
    .support-create-modal *,
    .integration-panel-dark,
    .integration-panel-dark *,
    .integration-card,
    .integration-card *,
    .modal .modal-head,
    .modal .modal-head * {
      color: #f4f0e8 !important;
    }

    .integration-panel-dark .muted,
    .integration-panel-dark small,
    .integration-panel-dark span,
    .integration-card small,
    .support-chat-widget .muted,
    .support-create-modal .muted,
    .modal .modal-head .btn.small {
      color: rgba(244, 240, 232, .76) !important;
    }

    .integration-panel-dark input,
    .integration-panel-dark select,
    .integration-panel-dark textarea,
    .support-create-modal input,
    .support-create-modal select,
    .support-create-modal textarea,
    .support-chat-widget input,
    .support-chat-widget textarea,
    .support-chat-widget select {
      background: #fffdf8 !important;
      color: #2f2a24 !important;
      border-color: rgba(78, 62, 44, .30) !important;
    }

    .modal .modal-head {
      background: #2f3a34 !important;
      border-color: rgba(255,255,255,.12) !important;
    }

    .modal .panel-body {
      background: #fff8ef !important;
      color: #2f2a24 !important;
    }

    .modal .panel-body .muted,
    .modal .panel-body p,
    .modal .panel-body span,
    .modal .panel-body label {
      color: #5f554b !important;
    }

    .brand.network-setup-needed {
      padding: 8px 30px 8px 8px !important;
    }

    .brand.network-setup-needed::after {
      left: 46px !important;
      right: auto !important;
      top: -9px !important;
      max-width: 112px;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .shift-box.as-nav-note,
    body.android-shell .shift-box.as-nav-note {
      display: grid !important;
      gap: 6px !important;
      max-height: none !important;
      overflow: visible !important;
      padding: 8px !important;
      font-size: 11px !important;
      line-height: 1.18 !important;
    }

    .shift-box.as-nav-note .quick-support-button,
    .shift-box.as-nav-note .quick-sync-button {
      display: grid !important;
      place-items: center !important;
      min-height: 30px !important;
      padding: 6px 8px !important;
      border-radius: 9px !important;
      background: rgba(255, 250, 242, .12) !important;
      border-color: rgba(255,255,255,.18) !important;
      color: #fffaf2 !important;
      box-shadow: none !important;
    }

    .shift-box.as-nav-note .quick-support-create-button,
    .shift-box.as-nav-note .quick-profile-button {
      min-height: 30px !important;
      padding: 6px 8px !important;
      font-size: 11px !important;
    }

    .shift-box.as-nav-note .shift-state-line,
    .shift-box.as-nav-note #syncState {
      font-size: 10px !important;
      line-height: 1.15 !important;
    }

    .shift-box.as-nav-note #shiftMeta,
    .shift-box.as-nav-note #shiftEmail {
      display: none !important;
    }

    .legal-acceptance-summary span,
    .legal-doc-row span,
    .legal-group-head small {
      color: #6a5f55 !important;
    }

    .settings-tabs button,
    .tabs button {
      color: #5e544b !important;
    }

    .settings-tabs button.active,
    .tabs button.active {
      color: #0d655d !important;
    }

    .login-screen {
      background:
        radial-gradient(circle at 18% 12%, rgba(23, 143, 132, .22), transparent 28%),
        linear-gradient(180deg, #364137 0%, #252f29 54%, #1b211e 100%) !important;
    }

    .login-card:not(.activation-login-card),
    body.android-shell .login-card:not(.activation-login-card) {
      background: #2f3a34 !important;
      color: #fffaf2 !important;
      border: 1px solid rgba(255, 250, 242, .16) !important;
      border-radius: 20px !important;
      box-shadow: 0 24px 60px rgba(12, 16, 14, .34) !important;
      overflow: hidden auto !important;
      scrollbar-gutter: stable !important;
    }

    .login-card:not(.activation-login-card) h2,
    .login-card:not(.activation-login-card) h3,
    .login-card:not(.activation-login-card) h4,
    .login-card:not(.activation-login-card) .login-logo {
      color: #fffaf2 !important;
    }

    .login-card:not(.activation-login-card) p,
    .login-card:not(.activation-login-card) small {
      color: rgba(255, 250, 242, .78) !important;
    }

    .login-card:not(.activation-login-card) label {
      color: #f6efe5 !important;
    }

    .login-card:not(.activation-login-card) input,
    .login-card:not(.activation-login-card) select,
    .login-card:not(.activation-login-card) textarea {
      background: #fffdf8 !important;
      color: #28231e !important;
      border: 1px solid rgba(72, 56, 40, .28) !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.75) !important;
    }

    .login-card:not(.activation-login-card) input::placeholder,
    .login-card:not(.activation-login-card) textarea::placeholder {
      color: #7d7368 !important;
      opacity: 1 !important;
    }

    .login-card:not(.activation-login-card) .legal-consent-box,
    .legal-consent-box {
      background: #fffdf8 !important;
      color: #28231e !important;
      border: 1px solid rgba(72, 56, 40, .18) !important;
      border-radius: 16px !important;
      box-shadow: 0 12px 26px rgba(25, 22, 18, .12) !important;
      overflow: hidden !important;
    }

    .legal-consent-box h4,
    .legal-consent-box strong,
    .legal-consent-box span,
    .legal-consent-box small,
    .legal-consent-box label {
      color: #2f2a24 !important;
    }

    .legal-consent-box .toggle-line,
    .login-card:not(.activation-login-card) .legal-consent-box .toggle-line {
      background: #f7efe4 !important;
      color: #2f2a24 !important;
      border: 1px solid rgba(72, 56, 40, .16) !important;
      border-radius: 12px !important;
    }

    .legal-consent-box input[type="checkbox"] {
      accent-color: var(--srm-accent-2, #7c5cff) !important;
      width: 18px !important;
      height: 18px !important;
      flex: 0 0 auto !important;
    }

    .legal-consent-box .btn,
    .login-card:not(.activation-login-card) .btn:not(.primary) {
      background: #efe3d4 !important;
      color: #2f2a24 !important;
      border-color: rgba(72, 56, 40, .20) !important;
    }

    .legal-consent-box .btn.primary,
    .login-card:not(.activation-login-card) .btn.primary {
      background: linear-gradient(135deg, #0f8f83, #23b3a5) !important;
      color: #ffffff !important;
      border-color: rgba(255,255,255,.18) !important;
    }

    .activation-actions-grid {
      background: rgba(255, 253, 248, .84) !important;
      border: 1px solid rgba(72, 56, 40, .16) !important;
      border-radius: 18px !important;
      padding: 8px !important;
      overflow: visible !important;
      box-shadow: 0 12px 24px rgba(27, 20, 14, .12) !important;
    }

    .activation-actions-grid .btn {
      min-height: 46px !important;
      border-radius: 13px !important;
      white-space: normal !important;
      line-height: 1.2 !important;
    }

    .activation-purchase-modal,
    .modal .activation-purchase-modal {
      background: #fff8ef !important;
      border-radius: 16px !important;
      overflow: hidden auto !important;
      scrollbar-gutter: stable !important;
    }

    .modal,
    .panel,
    .panel-body,
    .settings-card,
    .section-card,
    .activation-login-card,
    .activation-main-panel,
    .activation-side-panel,
    .legal-library,
    .legal-preview-text {
      overflow-x: hidden !important;
      scrollbar-gutter: stable !important;
    }

    .login-card::-webkit-scrollbar,
    .modal::-webkit-scrollbar,
    .panel-body::-webkit-scrollbar,
    .activation-purchase-modal::-webkit-scrollbar,
    .legal-preview-text::-webkit-scrollbar {
      width: 6px !important;
      height: 6px !important;
    }

    .login-card::-webkit-scrollbar-track,
    .modal::-webkit-scrollbar-track,
    .panel-body::-webkit-scrollbar-track,
    .activation-purchase-modal::-webkit-scrollbar-track,
    .legal-preview-text::-webkit-scrollbar-track {
      background: rgba(47, 42, 36, .05) !important;
      border-radius: 999px !important;
    }

    .login-card::-webkit-scrollbar-thumb,
    .modal::-webkit-scrollbar-thumb,
    .panel-body::-webkit-scrollbar-thumb,
    .activation-purchase-modal::-webkit-scrollbar-thumb,
    .legal-preview-text::-webkit-scrollbar-thumb {
      background: rgba(15, 127, 115, .62) !important;
      border: 1px solid rgba(255, 248, 239, .95) !important;
      border-radius: 999px !important;
      background-clip: padding-box !important;
    }

    .activation-main-panel,
    .activation-side-panel {
      background: transparent !important;
      border: 0 !important;
      box-shadow: none !important;
      padding: 0 !important;
    }

    .activation-main-panel > .table-notice,
    .employee-login-card {
      width: 100% !important;
      margin-left: auto !important;
      margin-right: auto !important;
      border-radius: 14px !important;
    }

    .activation-actions-grid {
      background: transparent !important;
      border: 0 !important;
      box-shadow: none !important;
      padding: 0 !important;
    }

    .activation-purchase-modal,
    .modal .activation-purchase-modal {
      padding-bottom: 16px !important;
      scroll-padding-bottom: 110px !important;
    }

    .activation-purchase-actions,
    .modal .activation-purchase-actions {
      position: sticky !important;
      left: auto !important;
      bottom: 0 !important;
      transform: none !important;
      width: 100% !important;
      margin: 8px 0 0 !important;
      padding: 10px !important;
      border: 1px solid rgba(72, 56, 40, .12) !important;
      border-radius: 14px !important;
      background: rgba(255, 248, 239, .96) !important;
      box-shadow: 0 -8px 18px rgba(32, 24, 18, .08) !important;
    }

    .activation-legal-documents {
      max-height: min(760px, calc(100dvh - 92px)) !important;
      overflow: hidden auto !important;
      scrollbar-gutter: stable !important;
    }

    .legal-document-list {
      display: grid !important;
      gap: 10px !important;
    }

    .legal-doc-row-compact {
      align-items: center !important;
      border-radius: 12px !important;
    }

    .legal-doc-row-compact .row-actions {
      margin: 0 !important;
      justify-content: flex-end !important;
    }

    .storage-stepper-label {
      display: grid !important;
      gap: 8px !important;
    }

    .storage-stepper {
      display: grid !important;
      grid-template-columns: 44px minmax(0, 1fr) 44px !important;
      gap: 8px !important;
      align-items: center !important;
    }

    .storage-stepper input {
      text-align: center !important;
      font-weight: 800 !important;
    }

    .storage-stepper .btn {
      min-height: 42px !important;
      border-radius: 12px !important;
      font-size: 20px !important;
      line-height: 1 !important;
    }

    .srm-transient-notice {
      position: fixed;
      left: 50%;
      top: 50%;
      z-index: 4000;
      width: min(360px, calc(100vw - 36px));
      padding: 18px;
      border-radius: 18px;
      background: #fffaf2;
      color: #2f2a24;
      border: 1px solid rgba(72, 56, 40, .16);
      box-shadow: 0 24px 54px rgba(18, 24, 22, .26);
      transform: translate(-50%, -44%) scale(.96);
      opacity: 0;
      pointer-events: none;
      transition: opacity 220ms ease, transform 220ms ease;
      text-align: center;
    }

    .srm-transient-notice.show {
      opacity: 1;
      transform: translate(-50%, -50%) scale(1);
    }

    .srm-transient-notice strong {
      display: block;
      margin-bottom: 6px;
      color: #163f38;
      font-size: 18px;
    }

    .srm-transient-notice span {
      color: #5f554b;
      line-height: 1.35;
    }

    .activation-main-panel,
    .activation-side-panel,
    .activation-main-panel .table-notice,
    .activation-side-panel .section-card,
    .activation-qr-modal,
    .activation-qr-large,
    .activation-qr-large img {
      box-shadow: none !important;
      outline: 0 !important;
    }

    .activation-qr-modal,
    .modal .activation-qr-modal {
      background: #fff8ef !important;
      border: 0 !important;
      border-radius: 0 0 16px 16px !important;
      padding: 16px !important;
    }

    .modal .activation-qr-modal {
      max-height: calc(100dvh - 86px) !important;
      overflow: hidden !important;
      display: grid !important;
      align-content: center !important;
    }

    .activation-qr-modal p {
      margin: 0 !important;
      line-height: 1.25 !important;
    }

    @media (orientation: landscape) and (max-height: 760px) {
      .activation-qr-modal,
      .modal .activation-qr-modal {
        padding: 10px 12px !important;
      }
      .activation-qr-large {
        gap: 8px !important;
      }
      .activation-qr-large img {
        width: min(300px, 44vw, calc(100dvh - 168px)) !important;
        height: min(300px, 44vw, calc(100dvh - 168px)) !important;
        padding: 6px !important;
        border-radius: 10px !important;
      }
      .activation-qr-modal p {
        font-size: 12px !important;
      }
    }

    .activation-qr-large {
      background: transparent !important;
      border: 0 !important;
      padding: 0 !important;
    }

    .activation-qr-large img {
      display: block !important;
      margin: 0 auto !important;
      border: 0 !important;
      background: #ffffff !important;
      border-radius: 14px !important;
    }

    .modal .modal-head {
      overflow: hidden !important;
    }

    .modal .modal-head,
    .modal .modal-head.exit-modal-head {
      width: calc(100% + 2px) !important;
      max-width: calc(100% + 2px) !important;
      box-sizing: border-box !important;
      margin: -1px -1px 0 -1px !important;
      padding-left: 18px !important;
      padding-right: 18px !important;
      background: #2f3a34 !important;
      border-radius: 8px 8px 0 0 !important;
    }

    body:not(.android-shell) .modal {
      background: #2f3a34 !important;
    }

    body:not(.android-shell) .modal .panel-body {
      background: #fff8ef !important;
      border-radius: 0 0 8px 8px !important;
    }

    .modal .modal-head .btn.small,
    .modal .modal-head #exitCancelTop {
      background: #3b241d !important;
      color: #fff8ef !important;
      border: 1px solid rgba(255, 248, 239, .18) !important;
      box-shadow: none !important;
    }

    .shift-box.as-nav-note .shift-state-line,
    .shift-box.as-nav-note .shift-state-line strong,
    .shift-box.as-nav-note #shiftState {
      color: #fff8ef !important;
      font-weight: 800 !important;
      opacity: 1 !important;
    }

    .exit-shift-warning {
      background: #fff2c7 !important;
      color: #3f2a04 !important;
      border-color: rgba(152, 99, 0, .28) !important;
      font-weight: 800 !important;
    }

    @media (max-width: 680px) {
      .main,
      body.android-shell .main {
        padding-right: 10px !important;
      }

      .brand.network-setup-needed::after {
        left: 36px !important;
        max-width: 96px;
      }

      .login-card:not(.activation-login-card),
      body.android-shell .login-card:not(.activation-login-card) {
        width: min(92vw, 520px) !important;
        max-height: calc(100vh - 72px) !important;
        padding: 18px !important;
        border-radius: 18px !important;
      }

      .login-card.activation-login-card,
      body.android-shell .login-card.activation-login-card {
        box-sizing: border-box !important;
        width: min(340px, calc(100vw - 36px)) !important;
        max-width: min(340px, calc(100vw - 36px)) !important;
        min-width: 0 !important;
        margin: 12px auto !important;
        padding: 16px !important;
        border-radius: 18px !important;
        overflow: hidden auto !important;
        scrollbar-gutter: stable !important;
      }

      .activation-heading,
      .activation-heading-wide {
        grid-template-columns: auto minmax(0, 1fr) !important;
        gap: 12px !important;
        align-items: center !important;
      }

      .activation-heading-copy,
      .activation-main-panel,
      .activation-side-panel,
      .employee-login-card,
      .activation-main-panel .table-notice {
        box-sizing: border-box !important;
        min-width: 0 !important;
        max-width: 100% !important;
      }

      .activation-heading h2 {
        font-size: 24px !important;
        line-height: 1.12 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
      }

      .activation-heading p,
      .activation-main-panel .table-notice,
      .employee-login-card p,
      .employee-login-card label,
      .employee-login-card input {
        overflow-wrap: anywhere !important;
      }

      .activation-purchase-actions,
      .modal .activation-purchase-actions {
        grid-template-columns: 1fr !important;
      }

      .legal-doc-row-compact {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
      }

      .legal-doc-row-compact .row-actions {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        width: 100% !important;
      }

      .legal-consent-box {
        padding: 12px !important;
      }

      .legal-consent-box .row-actions,
      .activation-actions-grid {
        grid-template-columns: 1fr !important;
      }

      .legal-consent-box .btn,
      .activation-actions-grid .btn {
        width: 100% !important;
      }
    }

    body:not(.android-shell) .login-screen {
      background:
        radial-gradient(circle at 18% 10%, rgba(14, 164, 147, .18), transparent 30%),
        linear-gradient(180deg, #071217 0%, #0b1c22 52%, #10181b 100%) !important;
    }

    body:not(.android-shell) .login-card:not(.activation-login-card) {
      background: #102027 !important;
      color: #f2fbf8 !important;
      border: 1px solid rgba(86, 212, 195, .20) !important;
      box-shadow: 0 28px 70px rgba(0, 0, 0, .42) !important;
      max-height: calc(100vh - 28px) !important;
    }

    body:not(.android-shell) .login-card:not(.activation-login-card) input,
    body:not(.android-shell) .login-card:not(.activation-login-card) select,
    body:not(.android-shell) .login-card:not(.activation-login-card) textarea {
      background: #071418 !important;
      color: #f4fffb !important;
      border-color: rgba(103, 224, 207, .26) !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
    }

    body:not(.android-shell) .legal-consent-box {
      background: #0b171c !important;
      color: #eefbf8 !important;
      border-color: rgba(103, 224, 207, .22) !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) .legal-consent-box h4,
    body:not(.android-shell) .legal-consent-box strong,
    body:not(.android-shell) .legal-consent-box span,
    body:not(.android-shell) .legal-consent-box small,
    body:not(.android-shell) .legal-consent-box label {
      color: #eefbf8 !important;
    }

    body:not(.android-shell) .legal-consent-box .toggle-line {
      background: #10272e !important;
      color: #eefbf8 !important;
      border-color: rgba(103, 224, 207, .20) !important;
    }

    body:not(.android-shell) .legal-consent-box .btn,
    body:not(.android-shell) .login-card:not(.activation-login-card) .btn:not(.primary) {
      background: #142d34 !important;
      color: #f2fbf8 !important;
      border-color: rgba(103, 224, 207, .24) !important;
    }

    :root {
      color-scheme: dark;
      --bg: #070b12;
      --surface: #131a27;
      --surface-2: #182131;
      --ink: #f4f0ff;
      --text: #f4f0ff;
      --text-strong: #ffffff;
      --muted: #a9b0c2;
      --muted2: #7f8799;
      --line: rgba(185, 169, 255, .13);
      --primary: #7c3aed;
      --primary-2: #a855f7;
      --accent: #8b5cf6;
      --accent2: #c084fc;
      --accent-soft: rgba(124, 58, 237, .18);
      --danger: #ef4444;
      --warn: #f59e0b;
      --ok: #22c55e;
      --sidebar-bg: #030712;
      --workspace-bg: #0b1020;
      --button-gradient: linear-gradient(135deg, #5b21b6 0%, #7c3aed 48%, #a855f7 100%);
      --logo-bg: linear-gradient(145deg, #5b21b6, #a855f7);
      --shadow: 0 24px 70px rgba(0, 0, 0, .38);
      --shadow-soft: 0 12px 32px rgba(0, 0, 0, .26);
      --radius: 14px;
      --radius-sm: 11px;
      --motion: 220ms cubic-bezier(.2, .8, .2, 1);
    }

    html {
      scrollbar-color: rgba(168, 85, 247, .56) #070b12 !important;
    }

    *::-webkit-scrollbar-track {
      background: #070b12 !important;
    }

    *::-webkit-scrollbar-thumb {
      background: linear-gradient(180deg, rgba(168, 85, 247, .78), rgba(91, 33, 182, .52)) !important;
      border: 2px solid #070b12 !important;
    }

    body,
    body.android-shell {
      background:
        radial-gradient(circle at 78% 4%, rgba(124, 58, 237, .16), transparent 32%),
        radial-gradient(circle at 32% -10%, rgba(192, 132, 252, .12), transparent 28%),
        linear-gradient(135deg, #050912 0%, #070b12 42%, #0a1020 100%) !important;
      color: var(--text) !important;
      font-family: Inter, "Segoe UI Variable", "Segoe UI", Arial, sans-serif !important;
      letter-spacing: 0 !important;
    }

    .app,
    body.android-shell .app {
      background: #050912 !important;
      color: var(--text) !important;
    }

    .sidebar,
    body.android-shell .sidebar {
      background:
        linear-gradient(180deg, rgba(3, 7, 18, .98) 0%, rgba(2, 6, 14, .98) 100%) !important;
      border-right: 1px solid rgba(185, 169, 255, .10) !important;
      box-shadow: 18px 0 54px rgba(0, 0, 0, .34) !important;
      color: #e9e3ff !important;
    }

    .main,
    body.android-shell .main {
      background:
        radial-gradient(circle at 86% 0%, rgba(124, 58, 237, .10), transparent 30%),
        linear-gradient(180deg, #0e1424 0%, #0b1020 100%) !important;
      color: var(--text) !important;
    }

    .brand {
      background: transparent !important;
      border: 0 !important;
      box-shadow: none !important;
      color: #fbfaff !important;
    }

    .brand-mark,
    .login-logo,
    .settings-logo-preview {
      background-color: #070b12 !important;
      border: 1px solid rgba(168, 85, 247, .42) !important;
      box-shadow: 0 14px 34px rgba(88, 28, 135, .34), inset 0 1px 0 rgba(255,255,255,.08) !important;
    }

    .brand h1,
    .brand strong {
      color: #ffffff !important;
      font-weight: 850 !important;
    }

    .brand span,
    .shift-box,
    .sync-state span,
    .mobile-nav-toggle small {
      color: rgba(226, 232, 255, .66) !important;
    }

    .nav button,
    .mobile-nav-toggle,
    .quick-profile-button,
    .quick-support-button,
    .quick-support-create-button,
    .quick-sync-button {
      border: 1px solid transparent !important;
      border-radius: 12px !important;
      background: transparent !important;
      color: rgba(226, 232, 255, .74) !important;
      box-shadow: none !important;
      transition: transform var(--motion), background var(--motion), border-color var(--motion), color var(--motion), box-shadow var(--motion) !important;
    }

    .nav button:hover,
    .mobile-nav-toggle:hover,
    .quick-profile-button:hover,
    .quick-support-button:hover,
    .quick-support-create-button:hover,
    .quick-sync-button:hover {
      background: rgba(124, 58, 237, .14) !important;
      border-color: rgba(168, 85, 247, .24) !important;
      color: #ffffff !important;
      transform: translateY(-1px) !important;
    }

    .nav button.active {
      background: linear-gradient(135deg, rgba(91, 33, 182, .92), rgba(124, 58, 237, .72)) !important;
      border-color: rgba(192, 132, 252, .32) !important;
      color: #ffffff !important;
      box-shadow: 0 12px 28px rgba(91, 33, 182, .32), inset 0 1px 0 rgba(255,255,255,.10) !important;
    }

    .badge {
      background: rgba(124, 58, 237, .18) !important;
      color: #eadcff !important;
      border: 1px solid rgba(168, 85, 247, .28) !important;
    }

    .topline,
    .panel,
    .stat,
    .settings-card,
    .section-card,
    .settings-mini,
    .network-card,
    .integration-card,
    .integration-panel-dark,
    .support-chat-widget,
    .support-thread-row,
    .support-chat-message,
    .subscription-banner,
    .cart,
    .cart-list,
    .product-card,
    .modal,
    .login-card,
    .activation-login-card,
    .first-run-card,
    .auth-card,
    .employee-login-card,
    .logo-helper-card,
    .logo-preview-card {
      background: linear-gradient(180deg, rgba(19, 26, 39, .96), rgba(13, 19, 31, .96)) !important;
      border: 1px solid var(--line) !important;
      border-radius: var(--radius) !important;
      box-shadow: var(--shadow-soft) !important;
      color: var(--text) !important;
      backdrop-filter: blur(18px) saturate(1.08) !important;
    }

    .topline {
      min-height: 92px !important;
    }

    .panel:hover,
    .stat:hover,
    .settings-card:hover,
    .network-card:hover,
    .integration-card:hover {
      border-color: rgba(168, 85, 247, .28) !important;
      box-shadow: 0 18px 46px rgba(0, 0, 0, .32), 0 0 0 1px rgba(168, 85, 247, .07) !important;
      transform: translateY(-1px) !important;
    }

    .panel-head,
    .modal-head {
      background: linear-gradient(180deg, rgba(20, 28, 43, .98), rgba(13, 19, 31, .92)) !important;
      border-bottom: 1px solid rgba(185, 169, 255, .12) !important;
      color: var(--text-strong) !important;
    }

    .panel-body,
    .modal .panel-body,
    body:not(.android-shell) .modal .panel-body {
      background: rgba(13, 19, 31, .72) !important;
      color: var(--text) !important;
      border-radius: 0 0 var(--radius) var(--radius) !important;
    }

    .topline h2,
    .panel-head h3,
    .modal-head h3,
    h1, h2, h3, h4,
    strong,
    .stat strong {
      color: #ffffff !important;
      letter-spacing: 0 !important;
    }

    .topline p,
    .panel-head span,
    .stat span,
    label,
    small,
    .muted,
    td span,
    .empty,
    .table-notice,
    .logo-preview-card span {
      color: var(--muted) !important;
    }

    .btn {
      min-height: 40px !important;
      border-radius: 12px !important;
      border: 1px solid rgba(185, 169, 255, .14) !important;
      background: linear-gradient(180deg, rgba(24, 33, 50, .96), rgba(15, 22, 36, .96)) !important;
      color: #f4f0ff !important;
      box-shadow: 0 10px 24px rgba(0, 0, 0, .22) !important;
      font-weight: 760 !important;
      transition: transform var(--motion), box-shadow var(--motion), border-color var(--motion), background var(--motion), color var(--motion) !important;
    }

    .btn:hover:not(:disabled) {
      border-color: rgba(168, 85, 247, .40) !important;
      box-shadow: 0 16px 34px rgba(0, 0, 0, .30), 0 0 0 1px rgba(168, 85, 247, .06) !important;
      transform: translateY(-1px) !important;
    }

    .btn.primary {
      background: var(--button-gradient) !important;
      border-color: rgba(192, 132, 252, .48) !important;
      color: #ffffff !important;
      box-shadow: 0 16px 36px rgba(91, 33, 182, .34), inset 0 1px 0 rgba(255,255,255,.13) !important;
    }

    .btn.primary:hover:not(:disabled) {
      box-shadow: 0 20px 42px rgba(91, 33, 182, .44), 0 0 0 1px rgba(192, 132, 252, .18) !important;
    }

    .btn.danger,
    .row-actions .btn.danger {
      background: rgba(239, 68, 68, .10) !important;
      border-color: rgba(239, 68, 68, .30) !important;
      color: #ffb4b4 !important;
      box-shadow: none !important;
    }

    .btn.ghost,
    .btn.small {
      box-shadow: none !important;
    }

    input,
    select,
    textarea {
      min-height: 42px !important;
      border-radius: 12px !important;
      border: 1px solid rgba(185, 169, 255, .14) !important;
      background: rgba(8, 13, 24, .92) !important;
      color: #f6f2ff !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
      transition: border-color var(--motion), box-shadow var(--motion), background var(--motion) !important;
    }

    input:hover,
    select:hover,
    textarea:hover {
      border-color: rgba(168, 85, 247, .28) !important;
    }

    input:focus,
    select:focus,
    textarea:focus {
      outline: none !important;
      border-color: rgba(192, 132, 252, .72) !important;
      box-shadow: 0 0 0 3px rgba(124, 58, 237, .18), inset 0 1px 0 rgba(255,255,255,.05) !important;
    }

    input::placeholder,
    textarea::placeholder {
      color: rgba(169, 176, 194, .68) !important;
    }

    input[type="checkbox"],
    input[type="radio"] {
      accent-color: var(--primary) !important;
      min-height: auto !important;
    }

    .toolbar {
      background: rgba(19, 26, 39, .78) !important;
      border-bottom-color: rgba(185, 169, 255, .12) !important;
      border-radius: var(--radius) var(--radius) 0 0 !important;
    }

    .tabs {
      background: rgba(7, 11, 18, .58) !important;
      border: 1px solid rgba(185, 169, 255, .12) !important;
      border-radius: 14px !important;
      padding: 4px !important;
      gap: 4px !important;
    }

    .tabs button {
      border-radius: 11px !important;
      color: var(--muted) !important;
      border: 1px solid transparent !important;
      background: transparent !important;
    }

    .tabs button:hover {
      color: #ffffff !important;
      background: rgba(124, 58, 237, .13) !important;
    }

    .tabs button.active {
      background: linear-gradient(135deg, rgba(91, 33, 182, .96), rgba(124, 58, 237, .78)) !important;
      border-color: rgba(192, 132, 252, .28) !important;
      color: #ffffff !important;
      box-shadow: 0 12px 26px rgba(91, 33, 182, .30) !important;
    }

    table {
      border-collapse: separate !important;
      border-spacing: 0 !important;
      overflow: hidden !important;
      border: 1px solid rgba(185, 169, 255, .12) !important;
      border-radius: var(--radius) !important;
      background: rgba(8, 13, 24, .88) !important;
      color: var(--text) !important;
    }

    th {
      background: rgba(20, 28, 43, .98) !important;
      color: #dcd4ff !important;
      border-bottom: 1px solid rgba(185, 169, 255, .13) !important;
      font-weight: 820 !important;
    }

    td {
      background: rgba(13, 19, 31, .86) !important;
      color: #ebe7ff !important;
      border-bottom: 1px solid rgba(185, 169, 255, .08) !important;
      border-right-color: rgba(185, 169, 255, .07) !important;
    }

    tbody tr:nth-child(even) td {
      background: rgba(16, 24, 38, .90) !important;
    }

    tbody tr:hover td {
      background: rgba(124, 58, 237, .12) !important;
    }

    .tag,
    .status,
    .integration-status,
    .sync-badge {
      border-radius: 999px !important;
      border: 1px solid rgba(168, 85, 247, .28) !important;
      background: rgba(124, 58, 237, .14) !important;
      color: #e9d5ff !important;
    }

    .tag.green,
    .status.green,
    .integration-status.green,
    .sync-state.ok strong,
    #shiftState,
    .shift-state-line strong {
      color: #86efac !important;
    }

    .tag.green,
    .status.green,
    .integration-status.green {
      background: rgba(34, 197, 94, .12) !important;
      border-color: rgba(34, 197, 94, .28) !important;
    }

    .tag.red,
    .status.red,
    .integration-status.red,
    .sync-state.error strong {
      background: rgba(239, 68, 68, .12) !important;
      border-color: rgba(239, 68, 68, .30) !important;
      color: #fca5a5 !important;
    }

    .table-notice,
    .empty,
    .legal-preview-text,
    .toggle-line,
    .settings-logo-row {
      background: rgba(8, 13, 24, .72) !important;
      border: 1px solid rgba(185, 169, 255, .12) !important;
      border-radius: 13px !important;
      color: var(--muted) !important;
      box-shadow: none !important;
    }

    .modal-backdrop {
      background: rgba(2, 6, 14, .78) !important;
      backdrop-filter: blur(18px) saturate(1.12) !important;
    }

    .modal,
    body:not(.android-shell) .modal {
      background: linear-gradient(180deg, rgba(19, 26, 39, .98), rgba(10, 15, 27, .98)) !important;
      border: 1px solid rgba(185, 169, 255, .14) !important;
      border-radius: var(--radius) !important;
      overflow: hidden !important;
      box-shadow: 0 28px 80px rgba(0, 0, 0, .48) !important;
      animation: modalIn 240ms cubic-bezier(.2, .8, .2, 1) both !important;
    }

    .modal .modal-head,
    .modal .modal-head.exit-modal-head {
      background: linear-gradient(180deg, rgba(20, 28, 43, .98), rgba(13, 19, 31, .96)) !important;
      border-bottom: 1px solid rgba(185, 169, 255, .12) !important;
      border-radius: var(--radius) var(--radius) 0 0 !important;
    }

    .toast,
    .busy-indicator {
      background: rgba(13, 16, 21, .98) !important;
      color: #f7f8fa !important;
      border: 1px solid rgba(224, 230, 239, .2) !important;
      border-radius: 10px !important;
      box-shadow: 0 18px 44px rgba(0, 0, 0, .36) !important;
      backdrop-filter: blur(16px) !important;
    }

    body.showcase-expired .login-screen {
      display: none !important;
    }

    .trial-expired-screen {
      min-height: 100dvh;
      display: grid;
      place-items: center;
      padding: 24px;
      background:
        radial-gradient(circle at 50% 0%, rgba(124, 58, 237, .26), transparent 34%),
        linear-gradient(135deg, #050912 0%, #0b1020 100%);
    }

    .trial-expired-card {
      width: min(440px, 100%);
      display: grid;
      justify-items: center;
      gap: 14px;
      padding: 28px;
      border: 1px solid rgba(185, 169, 255, .16);
      border-radius: 20px;
      background: rgba(19, 26, 39, .94);
      box-shadow: 0 24px 70px rgba(0, 0, 0, .42);
      text-align: center;
      color: #f7f3ff;
    }

    .trial-expired-card h1 {
      margin: 0;
      font-size: 24px;
    }

    .trial-expired-card p {
      margin: 0;
      color: rgba(226, 232, 255, .72);
    }

    .report-card-green,
    .report-card-blue,
    .report-card-gold,
    .report-card-red {
      background: linear-gradient(180deg, rgba(19, 26, 39, .96), rgba(13, 19, 31, .96)) !important;
      border-color: rgba(168, 85, 247, .16) !important;
      color: var(--text) !important;
    }

    .view:not(.hidden) > * {
      animation: premiumCardIn 220ms cubic-bezier(.2, .8, .2, 1) both;
    }

    @keyframes premiumCardIn {
      from { opacity: .001; transform: translateY(6px); }
      to { opacity: 1; transform: translateY(0); }
    }

    @media (max-width: 680px) {
      .main,
      body.android-shell .main {
        background: linear-gradient(180deg, #0e1424 0%, #0b1020 100%) !important;
      }

      .topline,
      .panel,
      .stat,
      .settings-card,
      .modal {
        border-radius: 13px !important;
      }
    }

    @media (orientation: landscape) and (min-width: 681px) and (max-width: 1280px) {
      body.android-shell {
        --font-size: 12px !important;
      }

      body.android-shell .app {
        grid-template-columns: clamp(164px, 15vw, 196px) minmax(0, 1fr) !important;
      }

      body.android-shell .sidebar {
        height: 100dvh !important;
        overflow-y: auto !important;
        gap: 5px !important;
        padding: 7px 7px 8px !important;
      }

      body.android-shell .brand {
        min-height: 44px !important;
        padding: 5px 28px 5px 6px !important;
        gap: 7px !important;
      }

      body.android-shell .brand-mark {
        width: 30px !important;
        height: 30px !important;
        border-radius: 9px !important;
        font-size: 10px !important;
      }

      body.android-shell .brand h1 {
        font-size: 12.5px !important;
        line-height: 1.05 !important;
      }

      body.android-shell .brand span,
      body.android-shell .quick-profile-button span,
      body.android-shell .sync-state span {
        font-size: 8.5px !important;
        line-height: 1.15 !important;
      }

      body.android-shell .nav {
        gap: 2px !important;
      }

      body.android-shell .nav button {
        min-height: 28px !important;
        padding: 4px 6px !important;
        grid-template-columns: 18px minmax(0, 1fr) !important;
        font-size: 9.5px !important;
        line-height: 1.1 !important;
      }

      body.android-shell .shift-box.as-nav-note {
        gap: 3px !important;
        padding-top: 5px !important;
        font-size: 9px !important;
      }

      body.android-shell .quick-support-button,
      body.android-shell .quick-support-create-button,
      body.android-shell .quick-profile-button,
      body.android-shell .quick-sync-button {
        min-height: 25px !important;
        padding: 3px 5px !important;
        font-size: 8.8px !important;
        border-radius: 8px !important;
        line-height: 1.1 !important;
      }

      body.android-shell .shift-state-line,
      body.android-shell .sync-state {
        font-size: 8.8px !important;
        line-height: 1.12 !important;
      }

      body.android-shell .main {
        padding: 8px !important;
        gap: 8px !important;
      }

      body.android-shell .topline {
        min-height: 44px !important;
        padding: 7px 10px !important;
      }

      body.android-shell .topline h2 {
        font-size: 18px !important;
      }

      body.android-shell .topline p {
        font-size: 10.5px !important;
      }

      body.android-shell .tabs {
        margin-bottom: 8px !important;
        padding: 3px !important;
        gap: 3px !important;
      }

      body.android-shell .tabs button {
        min-height: 29px !important;
        padding: 5px 9px !important;
        font-size: 10px !important;
        line-height: 1.1 !important;
      }

      body.android-shell #view-stock .toolbar,
      body.android-shell #view-stock .toolbar.compact {
        gap: 6px !important;
        padding: 8px !important;
      }

      body.android-shell .panel-body {
        padding: 9px !important;
      }

      body.android-shell .btn,
      body.android-shell input,
      body.android-shell select,
      body.android-shell textarea {
        min-height: 32px !important;
        font-size: 10.5px !important;
      }
    }

    @media (max-width: 680px) {
      body.android-shell {
        --font-size: 12px !important;
      }

      body.android-shell .app {
        display: grid !important;
        grid-template-columns: 1fr !important;
      }

      body.android-shell .sidebar {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        grid-template-rows: auto auto auto !important;
        gap: 7px !important;
        padding: 8px !important;
        height: 100% !important;
        max-height: 100% !important;
      }

      body.android-shell .mobile-nav-toggle {
        order: 1 !important;
        display: flex !important;
        min-height: 42px !important;
        padding: 8px 10px !important;
        border-radius: 13px !important;
        background: rgba(19, 26, 39, .92) !important;
        border-color: rgba(168, 85, 247, .20) !important;
      }

      body.android-shell .brand {
        order: 2 !important;
        min-height: 42px !important;
        padding: 7px 30px 7px 8px !important;
        border-radius: 13px !important;
        background: rgba(19, 26, 39, .92) !important;
        border: 1px solid rgba(168, 85, 247, .20) !important;
      }

      body.android-shell .brand-mark {
        width: 30px !important;
        height: 30px !important;
        border-radius: 9px !important;
        font-size: 10px !important;
      }

      body.android-shell .brand h1 {
        font-size: 13px !important;
        line-height: 1.05 !important;
      }

      body.android-shell .brand span,
      body.android-shell .mobile-nav-toggle small {
        font-size: 9px !important;
      }

      body.android-shell .nav {
        order: 3 !important;
        grid-column: 1 / -1 !important;
      }

      body.android-shell .shift-box.as-nav-note {
        order: 4 !important;
        grid-column: 1 / -1 !important;
      }

      body.android-shell .main {
        padding: 7px 8px max(10px, calc(var(--android-nav-safe) + 6px)) !important;
        gap: 7px !important;
      }

      body.android-shell .topline {
        min-height: 44px !important;
        padding: 8px 10px !important;
      }

      body.android-shell .topline h2 {
        font-size: 18px !important;
      }

      body.android-shell .topline p {
        font-size: 10.5px !important;
      }

      body.android-shell .panel-head,
      body.android-shell .panel-body {
        padding: 9px !important;
      }

      body.android-shell .tabs {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        margin-bottom: 8px !important;
        padding: 3px !important;
      }

      body.android-shell .tabs button {
        min-height: 30px !important;
        padding: 5px 9px !important;
        font-size: 10.5px !important;
        white-space: nowrap !important;
      }

      body.android-shell .toolbar,
      body.android-shell #view-stock .toolbar,
      body.android-shell #view-stock .toolbar.compact {
        grid-template-columns: 1fr !important;
        gap: 7px !important;
        padding: 8px !important;
      }

      body.android-shell .btn,
      body.android-shell input,
      body.android-shell select,
      body.android-shell textarea {
        min-height: 36px !important;
        font-size: 12px !important;
      }

      body.android-shell .mobile-card-table {
        display: block !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
      }

      body.android-shell .mobile-card-table thead {
        display: none !important;
      }

      body.android-shell .mobile-card-table tbody {
        display: grid !important;
        gap: 8px !important;
      }

      body.android-shell .mobile-card-table tr {
        display: grid !important;
        gap: 7px !important;
        padding: 10px !important;
        border: 1px solid rgba(185, 169, 255, .14) !important;
        border-radius: 13px !important;
        background: rgba(19, 26, 39, .94) !important;
      }

      body.android-shell .mobile-card-table td {
        display: grid !important;
        grid-template-columns: minmax(76px, .38fr) minmax(0, 1fr) !important;
        gap: 8px !important;
        align-items: start !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        color: #f4f0ff !important;
        min-width: 0 !important;
      }

      body.android-shell .mobile-card-table td::before {
        content: attr(data-label);
        color: rgba(226, 232, 255, .58);
        font-size: 10px;
        font-weight: 800;
        text-transform: none;
        min-width: 0;
      }

      body.android-shell .mobile-card-table td:empty {
        display: none !important;
      }

      body.android-shell .mobile-card-table .row-actions {
        justify-content: flex-start !important;
        gap: 6px !important;
      }

      body.android-shell .mobile-card-table .row-actions .btn {
        min-height: 30px !important;
        padding: 5px 7px !important;
        font-size: 10px !important;
      }

      body.android-shell .view,
      body.android-shell .view p,
      body.android-shell .view span,
      body.android-shell .view td,
      body.android-shell .view label {
        color: #e8e2ff;
      }

      body.android-shell .view [style*="background:#fff"],
      body.android-shell .view [style*="background: #fff"],
      body.android-shell .view [style*="background:white"],
      body.android-shell .view [style*="background: white"] {
        background: rgba(19, 26, 39, .94) !important;
        color: #f4f0ff !important;
      }
    }

    body.android-shell #view-pos .toolbar {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      align-items: stretch;
    }

    body.android-shell #view-pos .toolbar .btn {
      width: 100%;
      min-width: 0;
      min-height: 42px;
      padding-inline: 10px;
      white-space: normal;
      overflow-wrap: anywhere;
      line-height: 1.15;
    }

    body.android-shell #view-pos .toolbar #clearCartBtn,
    body.android-shell #view-pos .toolbar [data-action="clear-return-cart"] {
      grid-column: 1 / -1;
      width: min(50%, 220px);
      justify-self: start;
    }

    body.android-shell {
      --android-nav-safe: max(72px, env(safe-area-inset-bottom)) !important;
    }

    body.android-shell .nav {
      overflow: visible !important;
      padding-inline: 2px !important;
    }

    body.android-shell .nav button {
      width: 100% !important;
      box-sizing: border-box !important;
      min-width: 0 !important;
      overflow: visible !important;
    }

    body.android-shell .nav button span,
    body.android-shell .quick-profile-button,
    body.android-shell .quick-sync-button,
    body.android-shell .sync-state,
    body.android-shell .shift-state-line {
      min-width: 0 !important;
    }

    @media (orientation: landscape) and (min-width: 681px) and (max-width: 1280px) {
      body.android-shell {
        --android-nav-safe: max(34px, env(safe-area-inset-bottom)) !important;
      }

      body.android-shell .app {
        grid-template-columns: clamp(214px, 20vw, 252px) minmax(0, 1fr) !important;
      }

      body.android-shell .sidebar {
        padding: 8px 10px max(16px, calc(var(--android-nav-safe) + 8px)) !important;
        gap: 6px !important;
        overflow-x: visible !important;
      }

      body.android-shell .nav button {
        grid-template-columns: 22px minmax(0, 1fr) !important;
        min-height: 32px !important;
        padding: 5px 8px !important;
        font-size: 10.5px !important;
      }

      body.android-shell .quick-support-button,
      body.android-shell .quick-support-create-button,
      body.android-shell .quick-profile-button,
      body.android-shell .quick-sync-button {
        min-height: 29px !important;
        padding: 5px 7px !important;
        font-size: 9.8px !important;
      }

      body.android-shell .shift-state-line,
      body.android-shell .sync-state,
      body.android-shell .sync-state span {
        font-size: 9.5px !important;
      }

      body.android-shell .main {
        padding-bottom: max(30px, calc(var(--android-nav-safe) + 14px)) !important;
      }
    }

    @media (max-width: 680px) {
      body.android-shell {
        --android-nav-safe: max(78px, env(safe-area-inset-bottom)) !important;
      }

      body.android-shell .main {
        padding-bottom: max(132px, calc(var(--android-service-height, 92px) + var(--android-nav-safe) + 22px)) !important;
      }

      body.android-shell .shift-box.as-nav-note {
        bottom: max(12px, calc(env(safe-area-inset-bottom) + 14px)) !important;
      }

      body.android-shell.nav-expanded .nav {
        max-height: calc(100dvh - var(--android-safe-top, 0px) - var(--android-nav-safe) - var(--android-service-height, 92px) - 84px) !important;
      }
    }

    .login-screen,
    body.android-shell .login-screen {
      background:
        radial-gradient(circle at 78% 4%, rgba(124, 58, 237, .18), transparent 30%),
        radial-gradient(circle at 18% 0%, rgba(34, 197, 94, .08), transparent 24%),
        linear-gradient(135deg, #050912 0%, #070b12 48%, #0b1020 100%) !important;
      color: #f7f3ff !important;
    }

    .modal,
    body:not(.android-shell) .modal,
    body.android-shell .modal,
    .login-card,
    .login-card.activation-login-card,
    body.android-shell .login-card,
    body.android-shell .login-card.activation-login-card,
    .activation-main-panel,
    .activation-side-panel,
    .activation-purchase-modal,
    .modal .activation-purchase-modal,
    .activation-shell,
    .activation-card,
    .activation-qr-modal,
    .modal .activation-qr-modal,
    .legal-consent-box,
    .legal-group,
    .legal-doc-row,
    .legal-doc-row-compact,
    .legal-acceptance-summary,
    .support-create-modal,
    .integration-test-modal,
    .subscription-status-modal {
      background:
        linear-gradient(180deg, rgba(19, 26, 39, .98), rgba(13, 19, 31, .98)) !important;
      border-color: rgba(185, 169, 255, .16) !important;
      color: #f4f0ff !important;
      box-shadow: 0 24px 70px rgba(0, 0, 0, .42) !important;
    }

    .modal .panel-body,
    body:not(.android-shell) .modal .panel-body,
    body.android-shell .modal .panel-body,
    .support-create-modal .panel-body,
    .activation-login-card .section-card,
    .activation-login-card .table-notice,
    .activation-main-panel .table-notice,
    .activation-side-panel .section-card,
    .activation-purchase-actions,
    .modal .activation-purchase-actions,
    .activation-legal-strip,
    .request-summary-grid .settings-mini,
    .legal-library,
    .legal-group-head,
    .legal-group-body,
    .legal-preview-text,
    .table-notice,
    .settings-mini,
    .section-card {
      background: rgba(7, 11, 18, .72) !important;
      border-color: rgba(185, 169, 255, .14) !important;
      color: #f4f0ff !important;
    }

    .modal .modal-head,
    .modal .modal-head.exit-modal-head,
    .support-chat-widget .modal-head {
      background: linear-gradient(180deg, rgba(24, 31, 47, .99), rgba(13, 19, 31, .98)) !important;
      border-bottom-color: rgba(185, 169, 255, .16) !important;
      color: #ffffff !important;
    }

    .modal h1,
    .modal h2,
    .modal h3,
    .modal h4,
    .modal-head h3,
    .login-card h2,
    .login-card h3,
    .login-card h4,
    .activation-heading-copy h2,
    .activation-login-card h2,
    .activation-purchase-modal h3,
    .legal-consent-box h4,
    .legal-doc-row strong,
    .legal-group-head strong,
    .settings-mini h4,
    .section-card h3,
    .table-notice strong {
      color: #ffffff !important;
      text-shadow: 0 1px 0 rgba(0, 0, 0, .24) !important;
    }

    .modal p,
    .modal label,
    .modal td,
    .modal th,
    .modal span,
    .modal small,
    .modal li,
    .login-card p,
    .login-card label,
    .login-card small,
    .login-card span,
    .activation-heading-copy p,
    .activation-login-card p,
    .activation-login-card span,
    .activation-login-card small,
    .activation-login-card label,
    .activation-purchase-modal p,
    .activation-purchase-modal label,
    .activation-purchase-modal small,
    .activation-purchase-modal span,
    .activation-qr-modal p,
    .legal-consent-box strong,
    .legal-consent-box span,
    .legal-consent-box small,
    .legal-consent-box label,
    .legal-doc-row span,
    .legal-group-head small,
    .settings-mini p,
    .settings-mini small,
    .table-notice,
    .table-notice *,
    .muted {
      color: rgba(232, 226, 255, .82) !important;
    }

    .modal input,
    .modal select,
    .modal textarea,
    .login-card input,
    .login-card select,
    .login-card textarea,
    .activation-login-card input,
    .activation-login-card select,
    .activation-login-card textarea,
    .activation-purchase-modal input,
    .activation-purchase-modal select,
    .activation-purchase-modal textarea,
    .support-create-modal input,
    .support-create-modal select,
    .support-create-modal textarea {
      background: rgba(3, 7, 18, .82) !important;
      border-color: rgba(185, 169, 255, .20) !important;
      color: #ffffff !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
    }

    .modal input::placeholder,
    .modal textarea::placeholder,
    .login-card input::placeholder,
    .login-card textarea::placeholder,
    .activation-login-card input::placeholder,
    .activation-login-card textarea::placeholder,
    .activation-purchase-modal input::placeholder,
    .activation-purchase-modal textarea::placeholder {
      color: rgba(226, 232, 255, .44) !important;
    }

    .modal select option,
    .login-card select option,
    .activation-purchase-modal select option {
      background: #0d1320 !important;
      color: #ffffff !important;
    }

    .modal .btn:not(.primary),
    .login-card .btn:not(.primary),
    .activation-actions-grid .btn:not(.primary),
    .activation-login-card .btn:not(.primary),
    .legal-consent-box .btn:not(.primary),
    .support-create-modal .btn:not(.primary) {
      background: rgba(7, 11, 18, .78) !important;
      border-color: rgba(185, 169, 255, .18) !important;
      color: #f4f0ff !important;
    }

    .modal .btn.primary,
    .login-card .btn.primary,
    .activation-login-card .btn.primary,
    .activation-actions-grid .btn.primary,
    .legal-consent-box .btn.primary {
      color: #ffffff !important;
      background: linear-gradient(135deg, #5b21b6 0%, #7c3aed 48%, #a855f7 100%) !important;
      border-color: rgba(192, 132, 252, .34) !important;
    }

    .activation-qr-large,
    .activation-qr-card,
    .support-qr {
      background: rgba(7, 11, 18, .78) !important;
      border-color: rgba(185, 169, 255, .16) !important;
      color: #f4f0ff !important;
    }

    .activation-qr-large img,
    .activation-qr-card img,
    .support-qr img,
    .modal img[src^="data:image"] {
      background: #ffffff !important;
      border: 1px solid rgba(185, 169, 255, .22) !important;
      box-shadow: 0 14px 36px rgba(0, 0, 0, .28) !important;
    }

    .modal-backdrop {
      animation-duration: 80ms !important;
      backdrop-filter: blur(8px) !important;
    }

    .modal,
    .child-modal,
    .dropdown,
    .menu,
    .popover {
      animation-duration: 110ms !important;
      transition-duration: 120ms !important;
      background: linear-gradient(180deg, rgba(18, 24, 39, .98), rgba(8, 12, 22, .99)) !important;
      border-color: rgba(168, 85, 247, .18) !important;
      color: #f7f3ff !important;
    }

    .product-pick-row,
    .sold-product-pick-row,
    .cart-item,
    .return-sale-row,
    .counterparty-select-row,
    .payment-counterparty-card,
    .sale-detail-info,
    .sale-detail-products,
    .quick-money-panel,
    .quick-money-body,
    .event-row,
    .empty,
    .tag,
    .toggle-line,
    .logo-helper-card,
    .logo-preview-card {
      background: #101318 !important;
      border-color: rgba(224, 230, 239, .15) !important;
      color: #f4f6f8 !important;
      box-shadow: none !important;
    }

    .product-pick-row:hover,
    .sold-product-pick-row:hover,
    .counterparty-select-row:hover,
    .counterparty-select-row.active,
    .return-sale-row:hover,
    .cart-item:hover,
    tr.clickable-row:hover {
      background: #191d23 !important;
      border-color: rgba(224, 230, 239, .32) !important;
    }

    .product-pick-row strong,
    .sold-product-pick-row strong,
    .cart-item strong,
    .return-sale-row strong,
    .counterparty-select-row strong,
    .sale-detail-info strong,
    .sale-detail-products strong,
    .sales-table strong,
    .money-fit {
      color: #ffffff !important;
    }

    .product-pick-row span,
    .sold-product-pick-row span,
    .cart-item span,
    .return-sale-row span,
    .counterparty-select-row span,
    .sale-detail-info span,
    .sale-detail-products span {
      color: #aeb6c1 !important;
    }

    .modal table,
    .panel table,
    .sales-table {
      background: rgba(6, 10, 18, .72) !important;
      border-color: rgba(168, 85, 247, .13) !important;
    }

    .modal th,
    .panel th,
    .sales-table th {
      background: rgba(20, 27, 43, .96) !important;
      color: rgba(244, 240, 255, .88) !important;
      border-color: rgba(168, 85, 247, .16) !important;
    }

    .modal td,
    .panel td,
    .sales-table td {
      background: rgba(8, 13, 23, .66) !important;
      color: rgba(244, 240, 255, .84) !important;
      border-color: rgba(168, 85, 247, .12) !important;
    }

    .tag:not(.red):not(.gold):not(.gray) {
      background: rgba(124, 58, 237, .22) !important;
      border-color: rgba(192, 132, 252, .34) !important;
      color: #eee5ff !important;
    }

    .tag.red,
    .btn.danger {
      background: rgba(239, 68, 68, .14) !important;
      border-color: rgba(248, 113, 113, .28) !important;
      color: #fecaca !important;
    }

    .tag.gold {
      background: rgba(168, 85, 247, .18) !important;
      border-color: rgba(216, 180, 254, .28) !important;
      color: #f3e8ff !important;
    }

    .modal input,
    .modal textarea,
    .modal select,
    .toolbar input,
    .toolbar select,
    .form-grid input,
    .form-grid textarea,
    .form-grid select {
      background: rgba(3, 7, 18, .86) !important;
      border-color: rgba(192, 132, 252, .22) !important;
      color: #ffffff !important;
      caret-color: #c084fc !important;
    }

    .modal input:focus,
    .modal textarea:focus,
    .modal select:focus,
    .toolbar input:focus,
    .toolbar select:focus {
      border-color: rgba(216, 180, 254, .52) !important;
      box-shadow: 0 0 0 3px rgba(124, 58, 237, .18) !important;
      outline: none !important;
    }

    .receipt,
    .receipt *,
    .price-card,
    .price-card *,
    .print-page,
    .print-page * {
      color: #000000 !important;
    }

    .receipt,
    .price-card,
    .print-page {
      background: #ffffff !important;
      border-color: #111111 !important;
      box-shadow: none !important;
    }

    .receipt .receipt-row span:first-child,
    .receipt .receipt-meta {
      color: #333333 !important;
    }

    @media (max-width: 760px) {
      .modal {
        animation-duration: 95ms !important;
      }

      .product-pick-row,
      .sold-product-pick-row,
      .counterparty-select-row,
      .return-sale-row {
        gap: 10px !important;
        padding: 11px !important;
      }
    }

    #view-documents {
      display: flex;
      flex-direction: column;
      gap: 12px;
      min-height: 0;
      height: 100%;
      overflow: hidden;
    }

    #view-documents.hidden {
      display: none !important;
    }

    #view-documents > .tabs,
    #view-documents > .stats,
    #view-documents > .order-source-strip {
      flex: 0 0 auto;
    }

    #view-documents > .panel {
      flex: 1 1 auto;
      min-height: min(560px, 62dvh);
      max-height: calc(100dvh - 236px);
      overflow: auto;
      scrollbar-width: thin;
      scrollbar-color: rgba(168, 85, 247, .45) rgba(7, 11, 18, .7);
    }

    #view-documents .toolbar.compact,
    #view-documents .document-template-tools,
    .stock-bottom-actions,
    .print-root + .row-actions,
    .report-output-actions {
      background: rgba(7, 11, 18, .82) !important;
      border: 1px solid rgba(168, 85, 247, .16) !important;
      border-radius: 14px !important;
      color: #f4f0ff !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 12px 34px rgba(0, 0, 0, .2) !important;
    }

    #view-documents .toolbar.compact {
      position: sticky;
      top: 0;
      z-index: 4;
      backdrop-filter: blur(10px);
    }

    #view-documents table {
      min-width: 860px;
    }

    #view-documents td,
    #view-documents th {
      vertical-align: top;
      white-space: normal;
    }

    #view-documents .row-actions {
      flex-wrap: wrap;
      gap: 6px;
    }

    .document-template-shell {
      display: flex;
      flex-direction: column;
      overflow: hidden !important;
    }

    .document-template-tools {
      display: grid;
      grid-template-columns: minmax(180px, 1fr) minmax(150px, 210px);
      gap: 10px;
      padding: 12px;
      flex: 0 0 auto;
    }

    .document-template-layout {
      display: grid;
      grid-template-columns: minmax(240px, .42fr) minmax(0, 1fr);
      gap: 12px;
      min-height: 0;
      flex: 1 1 auto;
      overflow: hidden;
      padding: 0 12px 12px;
    }

    .document-template-list,
    .document-template-preview {
      min-height: 280px;
      overflow: auto;
      border: 1px solid rgba(168, 85, 247, .16);
      border-radius: 16px;
      background: rgba(7, 11, 18, .64);
    }

    .document-template-list {
      display: grid;
      gap: 8px;
      align-content: start;
      padding: 10px;
    }

    .document-template-row {
      text-align: left;
      border: 1px solid rgba(168, 85, 247, .16);
      border-radius: 14px;
      background: rgba(17, 24, 39, .78);
      color: #f4f0ff;
      padding: 12px;
      cursor: pointer;
      transition: background 120ms ease, border-color 120ms ease, transform 120ms ease;
    }

    .document-template-row:hover,
    .document-template-row.active {
      background: linear-gradient(135deg, rgba(91, 33, 182, .48), rgba(17, 24, 39, .92));
      border-color: rgba(216, 180, 254, .36);
      transform: translateY(-1px);
    }

    .document-template-row strong,
    .document-template-preview h4 {
      display: block;
      color: #ffffff;
      margin: 0 0 5px;
    }

    .document-template-row span,
    .document-template-row small,
    .document-template-preview small {
      display: block;
      color: rgba(232, 226, 255, .76);
      line-height: 1.35;
    }

    .document-template-preview {
      padding: 14px;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .document-template-preview-head {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 12px;
      align-items: start;
    }

    .document-template-body {
      margin: 0;
      min-height: 220px;
      max-height: 46dvh;
      overflow: auto;
      white-space: pre-wrap;
      border: 1px solid rgba(168, 85, 247, .16);
      border-radius: 14px;
      background: rgba(3, 7, 18, .72);
      color: rgba(244, 240, 255, .9);
      padding: 14px;
      font: 13px/1.45 "Segoe UI", Arial, sans-serif;
    }

    .integration-test-modal,
    .integration-test-modal .panel-body,
    .integration-test-modal label,
    .integration-panel-dark,
    .order-source-card {
      background: rgba(7, 11, 18, .78) !important;
      border-color: rgba(168, 85, 247, .16) !important;
      color: #f4f0ff !important;
    }

    .integration-test-modal input,
    .integration-test-modal select,
    .integration-test-modal textarea,
    .integration-panel-dark input,
    .integration-panel-dark select,
    .integration-panel-dark textarea,
    #view-documents input,
    #view-documents select,
    #view-documents textarea {
      background: rgba(3, 7, 18, .86) !important;
      border-color: rgba(192, 132, 252, .22) !important;
      color: #ffffff !important;
    }

    .integration-test-modal input::placeholder,
    .integration-test-modal textarea::placeholder,
    #view-documents input::placeholder,
    #view-documents textarea::placeholder {
      color: rgba(226, 232, 255, .46) !important;
    }

    .confirm-dialog-body {
      min-width: min(420px, calc(100vw - 48px));
    }

    .report-print {
      background: #ffffff !important;
      color: #000000 !important;
    }

    .report-print + .row-actions,
    .receipt-wrap + .row-actions,
    .print-toolbar,
    .stock-bottom-actions {
      background: rgba(7, 11, 18, .82) !important;
      border-color: rgba(168, 85, 247, .16) !important;
      color: #f4f0ff !important;
    }

    @media (max-width: 900px) {
      #view-documents {
        overflow: auto;
        height: auto;
        min-height: 100%;
      }

      #view-documents > .panel {
        min-height: 58dvh;
        max-height: none;
      }

      .document-template-layout {
        grid-template-columns: 1fr;
        overflow: visible;
      }

      .document-template-list,
      .document-template-preview {
        min-height: 220px;
        max-height: none;
      }

      .document-template-preview-head {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 560px) {
      .document-template-tools {
        grid-template-columns: 1fr;
      }

      #view-documents table {
        min-width: 0;
      }

      #view-documents .mobile-card-table tbody tr {
        background: rgba(7, 11, 18, .74) !important;
      }
    }

    #view-stock,
    #view-clients,
    #view-shifts,
    #view-reports,
    #view-history,
    #view-receipts,
    #view-labels {
      min-height: 0;
    }

    #view-stock .panel,
    #view-clients .panel,
    #view-shifts .panel,
    #view-reports .panel,
    #view-history .panel {
      background: rgba(15, 23, 42, .88) !important;
      border-color: rgba(168, 85, 247, .16) !important;
      color: #f4f0ff !important;
    }

    #view-stock .panel-body,
    #view-clients .panel-body,
    #view-shifts .panel-body,
    #view-reports .panel-body,
    #view-history .panel-body {
      color: #f4f0ff !important;
    }

    #view-stock .toolbar,
    #view-clients .toolbar,
    #view-shifts .toolbar,
    #view-reports .toolbar,
    #view-history .toolbar,
    #view-stock .form-grid,
    #view-reports .report-payment-panel,
    .bank-sales-head,
    .bank-merge-controls {
      background: rgba(7, 11, 18, .72) !important;
      border: 1px solid rgba(168, 85, 247, .16) !important;
      border-radius: 14px !important;
      color: #f4f0ff !important;
    }

    #view-stock input,
    #view-stock select,
    #view-stock textarea,
    #view-clients input,
    #view-clients select,
    #view-shifts input,
    #view-shifts select,
    #view-reports input,
    #view-reports select,
    #view-history input,
    #view-history select,
    .bank-sales-sheet input,
    .bank-sales-sheet select,
    .bank-sales-sheet textarea {
      background: rgba(3, 7, 18, .88) !important;
      border-color: rgba(192, 132, 252, .24) !important;
      color: #ffffff !important;
    }

    #view-stock input::placeholder,
    #view-clients input::placeholder,
    #view-reports input::placeholder,
    .bank-sales-sheet input::placeholder,
    .bank-sales-sheet textarea::placeholder {
      color: rgba(226, 232, 255, .48) !important;
    }

    #view-stock table,
    #view-clients table,
    #view-shifts table,
    #view-reports table,
    #view-history table {
      width: 100%;
      border-collapse: separate;
      border-spacing: 0;
      background: rgba(3, 7, 18, .52) !important;
      color: #f8fafc !important;
    }

    #view-stock th,
    #view-stock td,
    #view-clients th,
    #view-clients td,
    #view-shifts th,
    #view-shifts td,
    #view-reports th,
    #view-reports td,
    #view-history th,
    #view-history td {
      color: #f8fafc !important;
      border-color: rgba(148, 163, 184, .14) !important;
      background: transparent !important;
      white-space: normal;
      overflow-wrap: anywhere;
      word-break: normal;
      vertical-align: top;
    }

    #view-stock th,
    #view-clients th,
    #view-shifts th,
    #view-reports th,
    #view-history th {
      color: rgba(232, 226, 255, .86) !important;
      background: rgba(15, 23, 42, .92) !important;
    }

    #view-stock td span,
    #view-clients td span,
    #view-shifts td span,
    #view-reports td span,
    #view-history td span,
    #view-stock .muted,
    #view-clients .muted,
    #view-shifts .muted,
    #view-reports .muted {
      color: rgba(226, 232, 255, .72) !important;
    }

    #view-stock strong,
    #view-clients strong,
    #view-shifts strong,
    #view-reports strong,
    #view-history strong {
      color: #ffffff !important;
    }

    #view-stock .panel-body,
    #view-clients .panel,
    #view-reports .panel-body,
    #view-shifts .shift-table-wrap,
    #view-history .history-list {
      overflow: auto;
      scrollbar-width: thin;
      scrollbar-color: rgba(168, 85, 247, .45) rgba(7, 11, 18, .7);
    }

    #view-stock .panel-body {
      max-height: calc(100dvh - 260px);
    }

    #view-clients .panel {
      max-height: calc(100dvh - 190px);
    }

    #view-clients table {
      min-width: 940px;
      table-layout: fixed;
    }

    #view-clients th:nth-child(1) { width: 24%; }
    #view-clients th:nth-child(2) { width: 12%; }
    #view-clients th:nth-child(3) { width: 22%; }
    #view-clients th:nth-child(4) { width: 16%; }
    #view-clients th:nth-child(5) { width: 12%; }
    #view-clients th:nth-child(6) { width: 14%; }

    #view-clients .client-actions-grid,
    #view-stock .row-actions,
    #view-shifts .row-actions,
    #view-reports .row-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      min-width: 0;
    }

    #view-stock table,
    #view-reports .sales-table,
    #view-shifts table {
      min-width: 860px;
    }

    #view-stock .tabs button,
    #view-stock .tag,
    #view-shifts .tag,
    #view-reports .tag,
    #view-history .tag,
    .bank-sales-table .tag {
      background: rgba(124, 58, 237, .18) !important;
      border: 1px solid rgba(192, 132, 252, .28) !important;
      color: #e9d5ff !important;
      box-shadow: none !important;
    }

    #view-stock .tag.red,
    #view-shifts .tag.red,
    #view-reports .tag.red,
    #view-history .tag.red {
      background: rgba(239, 68, 68, .15) !important;
      border-color: rgba(248, 113, 113, .34) !important;
      color: #fecaca !important;
    }

    #view-stock .tag.gold,
    #view-shifts .tag.gold,
    #view-reports .tag.gold,
    #view-history .tag.gold {
      background: rgba(234, 179, 8, .14) !important;
      border-color: rgba(250, 204, 21, .30) !important;
      color: #fde68a !important;
    }

    #view-stock .toggle-line,
    #view-stock .toggle-line span {
      color: #f4f0ff !important;
    }

    #view-clients .client-mode-tabs {
      background: rgba(3, 7, 18, .78) !important;
      border: 1px solid rgba(148, 163, 184, .18) !important;
      border-radius: 14px !important;
      padding: 5px !important;
      gap: 6px !important;
      margin-bottom: 12px;
    }

    #view-clients .client-mode-tabs button {
      min-height: 38px;
      color: rgba(226, 232, 240, .78) !important;
      background: rgba(15, 23, 42, .62) !important;
      border-color: rgba(148, 163, 184, .14) !important;
    }

    #view-clients .client-mode-tabs button.active {
      color: #ffffff !important;
      background: linear-gradient(135deg, rgba(20, 184, 166, .82), rgba(37, 99, 235, .52)) !important;
      border-color: rgba(45, 212, 191, .46) !important;
      box-shadow: 0 0 0 1px rgba(45, 212, 191, .14), 0 12px 30px rgba(20, 184, 166, .18) !important;
    }

    .counterparty-detail-modal {
      width: min(860px, calc(100vw - 44px)) !important;
      max-width: min(860px, calc(100vw - 44px)) !important;
    }

    .counterparty-detail-row-value {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 8px;
    }

    .counterparty-copy-btn {
      width: 34px;
      min-width: 34px;
      height: 30px;
      min-height: 30px !important;
      padding: 0 !important;
      display: inline-grid;
      place-items: center;
      border-radius: 9px !important;
      font-size: 15px;
      line-height: 1;
    }

    .counterparty-card-actions {
      margin-top: 12px;
      padding: 10px;
      border: 1px solid rgba(148, 163, 184, .14);
      border-radius: 14px;
      background: rgba(3, 7, 18, .62) !important;
      justify-content: flex-end;
    }

    body:not(.android-shell) #view-clients tr[data-counterparty-row] {
      cursor: pointer;
      transition: background 140ms ease, border-color 140ms ease, opacity 140ms ease;
    }

    body:not(.android-shell) #view-clients tr[data-counterparty-row]:hover td {
      background: rgba(18, 35, 54, .98) !important;
    }

    body:not(.android-shell) #view-clients tr[data-counterparty-row]:focus-within td {
      background: rgba(23, 37, 58, .98) !important;
    }

    body:not(.android-shell) #view-clients tr.counterparty-archived-row td {
      background: rgba(9, 15, 26, .78) !important;
      color: rgba(203, 213, 225, .72) !important;
    }

    body:not(.android-shell) #view-clients tr.counterparty-archived-row strong {
      color: rgba(226, 232, 240, .82) !important;
    }

    body:not(.android-shell) #view-clients .counterparty-archive-status {
      display: inline-flex;
      align-items: center;
      width: fit-content;
      margin-top: 6px;
      padding: 3px 8px;
      border-radius: 999px;
      border: 1px solid rgba(148, 163, 184, .22);
      background: rgba(15, 23, 42, .72);
      color: rgba(203, 213, 225, .72) !important;
      font-size: 11px;
      font-weight: 700;
    }

    .clients-report-modal {
      width: min(98vw, 1680px) !important;
      max-width: min(98vw, 1680px) !important;
    }

    .clients-report-modal .panel-body {
      padding-bottom: 0 !important;
      overflow: hidden !important;
    }

    .clients-report-modal .report-editor {
      min-height: min(70vh, 760px);
      overflow: hidden;
    }

    .clients-report-modal .report-editor .table-scroll {
      max-height: min(62vh, 680px);
      overflow: auto;
    }

    .clients-report-modal .report-editor table {
      min-width: 1180px;
      table-layout: auto !important;
    }

    .clients-report-modal .report-editor td {
      min-width: 118px;
      white-space: normal;
      overflow-wrap: break-word;
      word-break: normal;
      line-height: 1.35;
    }

    .clients-report-modal .report-modal-footer {
      position: sticky;
      bottom: 0;
      z-index: 8;
      display: flex;
      justify-content: flex-end;
      gap: 8px;
      margin: 0 -12px -12px;
      padding: 12px 14px;
      border-top: 1px solid rgba(148, 163, 184, .18);
      background: linear-gradient(180deg, rgba(11, 21, 34, .96), rgba(6, 12, 22, 1)) !important;
      box-shadow: 0 -18px 28px rgba(0, 0, 0, .30);
    }

    .history-cell-with-actions {
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) auto !important;
      align-items: stretch !important;
      gap: 12px !important;
      padding: 10px !important;
    }

    .history-main-button {
      width: 100%;
      border: 0;
      background: transparent;
      color: inherit;
      display: grid;
      grid-template-columns: 150px minmax(0, 1fr) auto;
      gap: 14px;
      align-items: center;
      text-align: left;
      padding: 0;
      cursor: pointer;
    }

    .history-item-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      align-content: center;
      justify-content: flex-end;
      min-width: 250px;
    }

    .report-template-section-list {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
      gap: 8px;
    }

    .report-template-row-list {
      display: grid;
      gap: 8px;
    }

    .report-template-row-item {
      display: grid;
      grid-template-columns: 34px minmax(0, 1fr) auto auto;
      gap: 8px;
      align-items: center;
      padding: 8px;
      border: 1px solid rgba(124, 145, 170, .22);
      border-radius: 12px;
      background: rgba(5, 12, 20, .68);
    }

    .shift-report-print .report-sheet h3,
    .shift-report-print h2 {
      color: #000 !important;
    }

    .shift-payment-summary {
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      gap: 7px;
      margin-bottom: 9px;
    }

    .shift-payment-summary > div {
      display: grid;
      gap: 3px;
      min-width: 0;
      padding: 9px;
      border: 1px solid rgba(124, 139, 168, .18);
      border-radius: 7px;
      background: rgba(7, 12, 20, .72);
    }

    .shift-payment-summary span { color: #d8e1ed; font-size: 11px; font-weight: 600; opacity: 1; }
    .shift-payment-summary strong { color: #f5f7fb; overflow-wrap: anywhere; }
    .shift-payment-table { table-layout: auto; }

    .shift-report-actions {
      display: flex;
      justify-content: flex-end;
      gap: 8px;
      flex-wrap: wrap;
    }

    .shift-report-actions .btn { min-width: 150px; }
    .shift-report-actions .shift-report-close { min-width: 112px; }

    .cart-delivery-form .settings-card { display: grid; gap: 10px; }
    .cart-delivery-form .settings-card > h4 { margin: 0; color: #f5f7fb; }
    .cart-delivery-form .settings-card > small { color: #9dacbf; line-height: 1.4; }

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

    #view-stock {
      overflow: hidden;
    }

    #view-stock > .grid {
      width: 100%;
      min-width: 0;
      overflow: hidden;
      background: transparent;
    }

    #view-stock .stock-mode-tabs {
      background: rgba(3, 7, 18, .78) !important;
      border: 1px solid rgba(148, 163, 184, .18) !important;
      border-radius: 14px !important;
      padding: 5px !important;
      gap: 6px !important;
      margin-bottom: 12px;
    }

    #view-stock .stock-mode-tabs button {
      min-height: 38px;
      color: rgba(226, 232, 240, .78) !important;
      background: rgba(15, 23, 42, .62) !important;
      border-color: rgba(148, 163, 184, .14) !important;
    }

    #view-stock .stock-mode-tabs button.active {
      color: #ffffff !important;
      background: linear-gradient(135deg, rgba(20, 184, 166, .82), rgba(37, 99, 235, .52)) !important;
      border-color: rgba(45, 212, 191, .46) !important;
      box-shadow: 0 0 0 1px rgba(45, 212, 191, .14), 0 12px 30px rgba(20, 184, 166, .18) !important;
    }

    #view-stock .stock-shell-panel,
    #view-stock .acceptance-shell-panel {
      overflow: hidden;
      background: linear-gradient(180deg, rgba(15, 23, 42, .94), rgba(8, 13, 24, .96)) !important;
      border-color: rgba(148, 163, 184, .18) !important;
    }

    #view-stock .stock-toolbar {
      display: grid;
      grid-template-columns: minmax(230px, 1fr) minmax(150px, 190px) minmax(150px, 190px) max-content max-content max-content minmax(190px, max-content);
      gap: 8px;
      align-items: center;
      overflow: hidden;
    }

    #view-stock .stock-toolbar input,
    #view-stock .stock-toolbar select,
    #view-stock .stock-toolbar .btn {
      min-height: 40px;
      height: 40px;
    }

    #view-stock .stock-all-toggle {
      min-height: 40px !important;
      height: 40px !important;
      padding: 0 12px !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: flex-start !important;
      gap: 8px !important;
      white-space: nowrap;
      background: rgba(15, 23, 42, .8) !important;
      border-color: rgba(148, 163, 184, .18) !important;
    }

    #view-stock .stock-all-toggle input,
    #view-stock .acceptance-draft-table input[type="checkbox"] {
      width: 16px !important;
      height: 16px !important;
      min-width: 16px !important;
      min-height: 16px !important;
      margin: 0 !important;
      accent-color: var(--srm-accent-2, #7c5cff);
    }

    #view-stock .stock-bottom-actions {
      display: flex;
      justify-content: flex-end;
      gap: 8px;
      padding: 10px 12px;
      border-top: 1px solid rgba(148, 163, 184, .14);
      background: rgba(3, 7, 18, .82) !important;
      color: #f8fafc !important;
    }

    #view-stock .stock-bottom-actions .btn {
      color: #f8fafc !important;
      border-color: rgba(148, 163, 184, .24) !important;
    }

    #view-stock .acceptance-panel-body {
      padding: 14px !important;
    }

    #view-stock .acceptance-meta-grid {
      grid-template-columns: repeat(4, minmax(170px, 1fr)) !important;
      gap: 10px !important;
      padding: 14px !important;
      margin-bottom: 14px !important;
      overflow: hidden;
    }

    #view-stock .acceptance-meta-grid label {
      min-width: 0;
      color: rgba(226, 232, 240, .86) !important;
    }

    #view-stock .acceptance-meta-grid input,
    #view-stock .acceptance-meta-grid select {
      width: 100%;
      min-height: 38px;
    }

    #view-stock .acceptance-filters {
      display: grid;
      grid-template-columns: minmax(240px, 1fr) 140px 140px 150px;
      gap: 8px;
      align-items: center;
      margin: 8px 0 12px;
      padding: 10px;
      border: 1px solid rgba(148, 163, 184, .18) !important;
      border-radius: 12px !important;
      background: rgba(3, 7, 18, .66) !important;
    }

    #view-stock .acceptance-draft-table {
      overflow: auto;
      border: 1px solid rgba(148, 163, 184, .14);
      border-radius: 14px;
      background: rgba(3, 7, 18, .46);
      scrollbar-width: thin;
      scrollbar-color: rgba(45, 212, 191, .38) rgba(3, 7, 18, .65);
    }

    #view-stock .acceptance-draft-table table {
      min-width: 980px;
      table-layout: auto;
    }

    #view-stock .acceptance-draft-table th,
    #view-stock .acceptance-draft-table td,
    #view-stock .acceptance-history-table th,
    #view-stock .acceptance-history-table td {
      padding: 8px 9px !important;
      font-size: 12px;
      line-height: 1.35;
    }

    #view-stock .acceptance-draft-table input[type="number"] {
      min-height: 34px;
      height: 34px;
      padding: 0 8px;
    }

    #view-stock .acceptance-actions {
      padding-top: 10px;
    }

    .stock-print-modal {
      max-width: min(1180px, calc(100vw - 44px)) !important;
      width: min(1180px, calc(100vw - 44px)) !important;
      background: rgba(8, 13, 24, .98) !important;
      overflow: hidden;
    }

    .stock-print-modal-body {
      display: grid;
      grid-template-columns: minmax(250px, 310px) minmax(0, 1fr);
      gap: 14px;
      min-height: min(68vh, 720px);
      overflow: hidden !important;
      background: rgba(8, 13, 24, .98) !important;
    }

    .stock-print-controls {
      display: grid;
      gap: 10px;
      align-content: start;
      padding: 12px;
      border: 1px solid rgba(148, 163, 184, .16);
      border-radius: 14px;
      background: rgba(3, 7, 18, .58);
      overflow: auto;
    }

    .stock-print-controls h4 {
      margin: 6px 0 2px;
      color: #ffffff;
    }

    .stock-print-checks {
      display: grid;
      gap: 6px;
    }

    .stock-print-checks label,
    .stock-print-mode label {
      min-height: 32px;
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 7px 9px;
      border: 1px solid rgba(148, 163, 184, .14);
      border-radius: 10px;
      background: rgba(15, 23, 42, .58);
      color: rgba(226, 232, 240, .88) !important;
    }

    .stock-print-checks input,
    .stock-print-mode input {
      width: 15px !important;
      height: 15px !important;
      min-width: 15px !important;
      min-height: 15px !important;
      accent-color: var(--srm-accent-2, #7c5cff);
    }

    .stock-print-preview {
      overflow: auto;
      border: 1px solid rgba(148, 163, 184, .16);
      border-radius: 14px;
      background: #f8fafc;
      color: #0f172a;
      scrollbar-width: thin;
      scrollbar-color: rgba(20, 184, 166, .45) rgba(15, 23, 42, .12);
    }

    .report-wysiwyg-preview {
      display: block;
      width: 100%;
      height: min(72vh, 840px);
      min-height: 520px;
      border: 0;
      background: #ffffff;
      color-scheme: light;
    }

    .stock-print-page {
      min-width: 880px;
      padding: 24px;
      background: #ffffff;
      color: #0f172a;
    }

    .stock-print-page h2,
    .stock-print-page h3,
    .stock-print-page .report-meta {
      color: #0f172a !important;
    }

    .stock-print-page table {
      width: 100%;
      border-collapse: collapse;
      margin: 10px 0 20px;
      color: #0f172a !important;
      background: #ffffff !important;
      table-layout: auto;
    }

    .stock-print-page th,
    .stock-print-page td {
      border: 1px solid #cbd5e1 !important;
      color: #0f172a !important;
      background: #ffffff !important;
      padding: 7px 8px;
      vertical-align: top;
      overflow-wrap: anywhere;
    }

    .stock-print-page th {
      background: #e2e8f0 !important;
      font-weight: 800;
    }

    .stock-print-footer {
      justify-content: flex-end;
      padding: 12px 14px;
      border-top: 1px solid rgba(148, 163, 184, .14);
      background: rgba(3, 7, 18, .82);
    }

    @media (max-width: 1320px) {
      #view-stock .stock-toolbar {
        grid-template-columns: minmax(220px, 1fr) minmax(140px, 180px) minmax(140px, 180px) repeat(3, max-content);
      }

      #view-stock .stock-all-toggle {
        grid-column: 1 / -1;
        width: max-content;
        max-width: 100%;
      }
    }

    .product-thumb,
    .product-image-preview,
    .modal .product-thumb,
    .modal .product-image-preview {
      background: #080a0d !important;
      border: 1px solid rgba(224, 230, 239, .15) !important;
      color: #8f98a5 !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
    }

    .modal #productForm,
    .modal #stockForm,
    .modal #stockTransferForm,
    .modal #acceptanceItemForm {
      animation: modalSoftIn 120ms ease-out both;
    }

    @keyframes modalSoftIn {
      from { opacity: .82; transform: translateY(4px); }
      to { opacity: 1; transform: translateY(0); }
    }

    #view-stock .stock-bottom-actions {
      position: sticky;
      bottom: 0;
      z-index: 3;
      backdrop-filter: blur(10px);
    }

    #view-shifts .shift-action-open,
    #view-shifts .shift-action-close {
      background: linear-gradient(135deg, #16a34a, #22c55e) !important;
      border-color: rgba(74, 222, 128, .45) !important;
      color: #f0fdf4 !important;
      box-shadow: 0 10px 26px rgba(34, 197, 94, .18) !important;
    }

    #view-shifts .shift-action-open:disabled,
    #view-shifts .shift-action-close:disabled {
      background: rgba(15, 23, 42, .78) !important;
      border-color: rgba(148, 163, 184, .18) !important;
      color: rgba(226, 232, 255, .44) !important;
      box-shadow: none !important;
    }

    #view-shifts .total-box,
    #view-shifts .shift-current {
      background: rgba(7, 11, 18, .68) !important;
      border-color: rgba(168, 85, 247, .16) !important;
      color: #f4f0ff !important;
    }

    #view-shifts .total-line span {
      color: rgba(226, 232, 255, .76) !important;
    }

    #view-reports > .panel {
      max-height: calc(100dvh - 158px);
      overflow: hidden;
      display: flex;
      flex-direction: column;
    }

    #view-reports > .panel > .report-toolbar {
      flex: 0 0 auto;
      position: sticky;
      top: 0;
      z-index: 3;
      backdrop-filter: blur(10px);
    }

    #view-reports > .panel > .panel-body {
      flex: 1 1 auto;
      min-height: 0;
      overflow: auto;
    }

    #view-reports .panel .panel {
      margin-top: 14px;
      overflow: auto;
    }

    #view-reports .sales-table {
      table-layout: fixed;
    }

    .report-card-green,
    .report-card-blue,
    .report-card-gold,
    .report-card-red {
      background: linear-gradient(135deg, rgba(30, 41, 59, .96), rgba(17, 24, 39, .94)) !important;
      border-color: rgba(168, 85, 247, .18) !important;
      color: #f8fafc !important;
    }

    .report-card-green strong,
    .report-card-blue strong,
    .report-card-gold strong,
    .report-card-red strong {
      color: #ffffff !important;
    }

    .report-card-green span,
    .report-card-blue span,
    .report-card-gold span,
    .report-card-red span {
      color: rgba(226, 232, 255, .74) !important;
    }

    .bank-sales-sheet,
    .bank-sales-table,
    .bank-sales-table th,
    .bank-sales-table td {
      background: rgba(3, 7, 18, .78) !important;
      color: #f8fafc !important;
      border-color: rgba(148, 163, 184, .16) !important;
    }

    .bank-sales-table {
      min-width: 920px;
      overflow: auto;
    }

    .bank-sales-table th {
      background: rgba(15, 23, 42, .96) !important;
      color: rgba(232, 226, 255, .88) !important;
    }

    .bank-sales-table td[contenteditable="true"]:focus {
      outline: 2px solid rgba(168, 85, 247, .45);
      background: rgba(30, 41, 59, .94) !important;
    }

    .bank-merge-controls button {
      background: rgba(15, 23, 42, .86) !important;
      border-color: rgba(168, 85, 247, .18) !important;
      color: #f4f0ff !important;
    }

    .bank-merge-controls button.active {
      background: linear-gradient(135deg, rgba(109, 40, 217, .95), rgba(91, 33, 182, .86)) !important;
      border-color: rgba(216, 180, 254, .38) !important;
      color: #ffffff !important;
    }

    .receipt-wrap {
      background: rgba(7, 11, 18, .72) !important;
      border-color: rgba(168, 85, 247, .16) !important;
    }

    .receipt,
    .receipt *,
    .price-card,
    .price-card * {
      color: #000000 !important;
    }

    .receipt,
    .price-card {
      background: #ffffff !important;
      border-color: #111111 !important;
      box-shadow: 0 18px 45px rgba(0, 0, 0, .35) !important;
    }

    .price-card .tag.red {
      background: #111111 !important;
      border-color: #111111 !important;
      color: #ffffff !important;
    }

    @media (max-width: 900px) {
      #view-stock .panel-body,
      #view-clients .panel,
      #view-reports > .panel,
      #view-shifts .shift-table-wrap {
        max-height: none;
        overflow: visible;
      }

      #view-reports > .panel {
        display: block;
      }

      #view-stock table,
      #view-clients table,
      #view-shifts table,
      #view-reports .sales-table {
        min-width: 0;
      }

      #view-stock .mobile-card-table tbody tr,
      #view-clients .mobile-card-table tbody tr,
      #view-shifts .mobile-card-table tbody tr,
      #view-reports .mobile-card-table tbody tr,
      #view-history .mobile-card-table tbody tr {
        background: rgba(7, 11, 18, .78) !important;
        border: 1px solid rgba(168, 85, 247, .15) !important;
      }

      #view-stock .mobile-card-table td,
      #view-clients .mobile-card-table td,
      #view-shifts .mobile-card-table td,
      #view-reports .mobile-card-table td,
      #view-history .mobile-card-table td {
        color: #f8fafc !important;
      }

      #view-stock .mobile-card-table td::before,
      #view-clients .mobile-card-table td::before,
      #view-shifts .mobile-card-table td::before,
      #view-reports .mobile-card-table td::before,
      #view-history .mobile-card-table td::before {
        color: rgba(216, 180, 254, .88) !important;
      }

      #view-clients .client-actions-grid,
      #view-stock .row-actions,
      #view-shifts .row-actions,
      #view-reports .row-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    @media (max-width: 560px) {
      #view-stock .toolbar,
      #view-clients .toolbar,
      #view-shifts .toolbar,
      #view-reports .toolbar,
      #view-history .toolbar,
      #view-stock .form-grid {
        grid-template-columns: 1fr !important;
      }

      #view-clients .client-actions-grid,
      #view-stock .row-actions,
      #view-shifts .row-actions,
      #view-reports .row-actions {
        grid-template-columns: 1fr;
      }

      .receipt {
        width: min(var(--receipt-width, 280px), calc(100vw - 54px)) !important;
      }

      .price-card {
        max-width: calc(100vw - 54px);
      }
    }

    #view-history,
    #view-notes {
      min-height: 0 !important;
      height: 100% !important;
      color: #f8fafc !important;
    }

    #view-history > .panel {
      display: flex !important;
      flex-direction: column !important;
      min-height: 0 !important;
      max-height: calc(100dvh - 132px) !important;
      overflow: hidden !important;
      background: linear-gradient(180deg, rgba(15, 23, 42, .96), rgba(8, 13, 24, .98)) !important;
      border-color: rgba(168, 85, 247, .18) !important;
    }

    #view-history .tabs,
    #view-history .toolbar {
      flex: 0 0 auto !important;
    }

    #view-history .panel-body,
    #view-history .history-actions {
      min-height: 0 !important;
      overflow: auto !important;
      -webkit-overflow-scrolling: touch !important;
    }

    #view-history .panel-body:not(.history-actions) {
      flex: 1 1 auto !important;
      max-height: none !important;
    }

    #view-history .history-actions {
      flex: 0 0 auto !important;
      overflow: visible !important;
      padding-bottom: 8px !important;
    }

    #view-history .history-toolbar,
    #view-history .toolbar {
      margin: 0 12px 12px !important;
      padding: 12px !important;
      border: 1px solid rgba(168, 85, 247, .14) !important;
      border-radius: 14px !important;
      background: rgba(7, 11, 18, .72) !important;
    }

    #view-history .history-list {
      display: grid !important;
      gap: 10px !important;
      min-height: 0 !important;
      overflow: visible !important;
    }

    #view-history .history-cell,
    #view-history .compact-event,
    #view-history .event-button {
      display: grid !important;
      grid-template-columns: minmax(130px, .34fr) minmax(0, 1fr) auto !important;
      align-items: center !important;
      gap: 12px !important;
      width: 100% !important;
      min-height: 76px !important;
      padding: 13px 14px !important;
      border: 1px solid rgba(168, 85, 247, .16) !important;
      border-radius: 14px !important;
      background: linear-gradient(180deg, rgba(15, 23, 42, .86), rgba(7, 11, 18, .88)) !important;
      color: #f8fafc !important;
      text-align: left !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
    }

    #view-history .history-cell:hover,
    #view-history .event-button:hover {
      border-color: rgba(192, 132, 252, .34) !important;
      background: linear-gradient(180deg, rgba(22, 30, 50, .92), rgba(10, 16, 30, .94)) !important;
    }

    #view-history .history-cell strong,
    #view-history .history-cell div,
    #view-history .compact-event strong,
    #view-history .event-button strong {
      color: #ffffff !important;
      min-width: 0 !important;
      overflow-wrap: anywhere !important;
    }

    #view-history .history-cell span,
    #view-history .compact-event span,
    #view-history .event-button span {
      color: rgba(226, 232, 255, .76) !important;
      overflow-wrap: anywhere !important;
    }

    #view-notes {
      overflow: auto !important;
      -webkit-overflow-scrolling: touch !important;
      padding-bottom: max(18px, calc(var(--android-safe-bottom, 0px) + 18px)) !important;
    }

    #view-notes .notes,
    #view-notes .notes-board {
      display: grid !important;
      grid-template-columns: repeat(auto-fill, minmax(178px, 224px)) !important;
      justify-content: start !important;
      align-items: stretch !important;
      gap: 12px !important;
    }

    #view-notes .note,
    #view-notes .note-wide,
    #view-notes .note-large {
      grid-column: auto !important;
      grid-row: auto !important;
      min-height: 236px !important;
      max-height: 380px !important;
      padding: 14px !important;
      overflow: hidden !important;
      border: 1px solid rgba(168, 85, 247, .18) !important;
      border-radius: 16px !important;
      background: linear-gradient(180deg, rgba(15, 23, 42, .92), rgba(8, 13, 24, .96)) !important;
      color: #f8fafc !important;
      box-shadow: 0 14px 36px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.04) !important;
    }

    #view-notes .note strong {
      color: #ffffff !important;
      line-height: 1.25 !important;
      overflow-wrap: anywhere !important;
    }

    #view-notes .note p {
      min-height: 128px !important;
      max-height: 230px !important;
      overflow: auto !important;
      color: rgba(226, 232, 255, .84) !important;
      line-height: 1.5 !important;
      overflow-wrap: anywhere !important;
    }

    #view-notes .note span {
      color: rgba(196, 181, 253, .86) !important;
      font-size: 12px !important;
      line-height: 1.35 !important;
    }

    .sidebar,
    body.android-shell .sidebar {
      width: clamp(268px, 19vw, 322px) !important;
      min-width: 268px !important;
      padding-left: 14px !important;
      padding-right: 14px !important;
      overflow: hidden !important;
    }

    .nav button {
      width: 100% !important;
      min-width: 0 !important;
      overflow: visible !important;
    }

    .nav button span,
    .nav button strong {
      min-width: 0 !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
      white-space: nowrap !important;
    }

    .shift-box.as-nav-note,
    body.android-shell .shift-box.as-nav-note {
      display: grid !important;
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      max-height: min(36dvh, 318px) !important;
      padding: 11px !important;
      gap: 8px !important;
      overflow: hidden auto !important;
      border: 1px solid rgba(168, 85, 247, .18) !important;
      border-radius: 16px !important;
      background: linear-gradient(180deg, rgba(12, 18, 32, .94), rgba(5, 10, 20, .96)) !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
    }

    .shift-box.as-nav-note .quick-profile-button,
    .shift-box.as-nav-note .quick-support-button,
    .shift-box.as-nav-note .quick-support-create-button,
    .shift-box.as-nav-note .quick-sync-button {
      width: 100% !important;
      min-width: 0 !important;
      min-height: 36px !important;
      padding: 8px 10px !important;
      white-space: normal !important;
      overflow-wrap: anywhere !important;
      text-align: left !important;
    }

    .shift-box.as-nav-note #shiftMeta,
    .shift-box.as-nav-note #shiftEmail,
    .shift-box.as-nav-note #syncState,
    .shift-box.as-nav-note .shift-state-line {
      display: block !important;
      min-width: 0 !important;
      max-width: 100% !important;
      color: rgba(226, 232, 255, .78) !important;
      font-size: 11px !important;
      line-height: 1.35 !important;
      overflow-wrap: anywhere !important;
    }

    .shift-box.as-nav-note #syncState strong,
    .shift-box.as-nav-note .shift-state-line strong {
      color: #ffffff !important;
    }

    @media (max-width: 1100px) {
      .sidebar,
      body.android-shell .sidebar {
        width: clamp(248px, 28vw, 292px) !important;
        min-width: 248px !important;
      }

      #view-history .history-cell,
      #view-history .compact-event,
      #view-history .event-button {
        grid-template-columns: minmax(112px, .34fr) minmax(0, 1fr) auto !important;
      }
    }

    @media (max-width: 760px) {
      #view-history {
        height: auto !important;
        overflow: auto !important;
      }

      #view-history > .panel {
        max-height: none !important;
        overflow-x: visible !important;
        overflow-y: visible !important;
      }

      #view-history .history-cell,
      #view-history .compact-event,
      #view-history .event-button {
        grid-template-columns: 1fr !important;
        gap: 8px !important;
      }

      #view-notes .notes,
      #view-notes .notes-board {
        grid-template-columns: minmax(0, 1fr) !important;
      }

      #view-notes .note {
        min-height: 220px !important;
      }

      .shift-box.as-nav-note,
      body.android-shell .shift-box.as-nav-note {
        max-height: none !important;
      }
    }

    .login-screen,
    body.android-shell .login-screen {
      background:
        radial-gradient(circle at 78% 4%, rgba(124, 58, 237, .20), transparent 30%),
        radial-gradient(circle at 18% 0%, rgba(99, 102, 241, .10), transparent 24%),
        linear-gradient(135deg, #050812 0%, #070b14 48%, #0c1020 100%) !important;
    }

    .modal-backdrop {
      animation-duration: 55ms !important;
      backdrop-filter: blur(4px) !important;
    }

    .modal,
    .child-modal,
    .login-card,
    .activation-purchase-modal,
    .dropdown,
    .menu,
    .popover {
      animation-duration: 85ms !important;
      transition-duration: 90ms !important;
      will-change: transform, opacity !important;
    }

    .modal *,
    .login-card *,
    .activation-purchase-modal * {
      transition-duration: 90ms !important;
    }

    input[type="checkbox"],
    .modal input[type="checkbox"],
    .login-card input[type="checkbox"],
    .toggle-line input[type="checkbox"] {
      accent-color: var(--srm-accent-2, #7c5cff) !important;
    }

    .activation-login-card p,
    .activation-login-card span,
    .activation-login-card small,
    .activation-login-card label,
    .employee-login-card p,
    .employee-login-card .muted,
    .employee-login-card label,
    .activation-purchase-modal p,
    .activation-purchase-modal label,
    .activation-purchase-modal small,
    .activation-purchase-modal span,
    .activation-purchase-modal .muted,
    .activation-purchase-modal .table-notice,
    .activation-purchase-modal .table-notice *,
    .purchase-quote,
    .purchase-quote *,
    .request-summary-grid .settings-mini,
    .request-summary-grid .settings-mini *,
    .payment-order-card,
    .payment-order-card *,
    .modal label,
    .modal p,
    .modal small {
      color: rgba(244, 240, 255, .90) !important;
    }

    .activation-purchase-modal label,
    .activation-purchase-modal .grid.compact label {
      color: #fff7ed !important;
      font-weight: 700 !important;
    }

    .activation-purchase-modal input,
    .activation-purchase-modal select,
    .activation-purchase-modal textarea,
    .modal input,
    .modal select,
    .modal textarea {
      color: #ffffff !important;
      caret-color: #c4b5fd !important;
      border-color: rgba(196, 181, 253, .24) !important;
    }

    .activation-purchase-actions,
    .modal .activation-purchase-actions {
      position: sticky !important;
      bottom: 0 !important;
      z-index: 4 !important;
      padding: 12px !important;
      border: 1px solid rgba(196, 181, 253, .18) !important;
      border-radius: 16px !important;
      background: linear-gradient(180deg, #151b2c 0%, #0b1020 100%) !important;
      box-shadow: 0 -12px 30px rgba(0, 0, 0, .42) !important;
      backdrop-filter: none !important;
    }

    .modal-head .btn.small,
    .modal .modal-head .btn.small,
    .child-modal .modal-head .btn.small,
    [data-action="modal-close"],
    .app-exit-button {
      background: rgba(15, 23, 42, .96) !important;
      border-color: rgba(248, 113, 113, .46) !important;
      color: #fff1f2 !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
    }

    .modal-head .btn.small:hover,
    .modal .modal-head .btn.small:hover,
    .child-modal .modal-head .btn.small:hover,
    [data-action="modal-close"]:hover,
    .app-exit-button:hover {
      background: linear-gradient(135deg, #7f1d1d, #dc2626) !important;
      border-color: rgba(252, 165, 165, .62) !important;
      color: #ffffff !important;
    }

    .btn.primary,
    .modal .btn.primary,
    .login-card .btn.primary,
    .activation-login-card .btn.primary,
    .activation-actions-grid .btn.primary,
    .quick-money-panel .btn.primary,
    .shift-card .btn.primary {
      background: linear-gradient(135deg, #4c1d95 0%, #6d28d9 52%, #9333ea 100%) !important;
      border-color: rgba(216, 180, 254, .34) !important;
      color: #ffffff !important;
      box-shadow: 0 14px 28px rgba(88, 28, 135, .30) !important;
    }

    .btn.primary:hover,
    .modal .btn.primary:hover,
    .login-card .btn.primary:hover {
      background: linear-gradient(135deg, #5b21b6 0%, #7c3aed 52%, #a855f7 100%) !important;
      box-shadow: 0 16px 34px rgba(88, 28, 135, .38) !important;
    }

    .tag:not(.red):not(.gold):not(.gray),
    .status:not(.red):not(.gold):not(.gray),
    .tag.green,
    .status.green,
    .integration-status.green,
    .sync-state.ok strong {
      background: rgba(88, 28, 135, .22) !important;
      border-color: rgba(196, 181, 253, .24) !important;
      color: #ede9fe !important;
    }

    .ok,
    .success,
    .text-green,
    .green-text,
    .muted.green {
      color: #ede9fe !important;
    }

    .shift-lamp,
    .checkmark,
    .success-dot {
      background: #22c55e !important;
      color: #052e16 !important;
    }

    .quick-money-panel {
      min-height: 0 !important;
      margin-bottom: 10px !important;
      overflow: visible !important;
    }

    .quick-money-panel .panel-head {
      padding: 12px 14px 6px !important;
    }

    .quick-money-body {
      display: grid !important;
      grid-template-columns: minmax(180px, .68fr) minmax(260px, 1fr) !important;
      align-items: center !important;
      min-height: 0 !important;
      padding: 12px 14px !important;
      gap: 12px !important;
      overflow: visible !important;
    }

    .quick-money-body .muted,
    .quick-money-body small {
      color: rgba(226, 232, 255, .76) !important;
      line-height: 1.28 !important;
    }

    .quick-money-body .money-fit {
      display: block !important;
      color: #ffffff !important;
      font-size: clamp(18px, 2.2vw, 25px) !important;
      line-height: 1.1 !important;
      margin: 4px 0 !important;
    }

    .quick-money-body .row-actions {
      display: grid !important;
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      gap: 10px !important;
      align-items: stretch !important;
    }

    .quick-money-body .btn {
      min-height: 40px !important;
      padding: 8px 12px !important;
      white-space: normal !important;
      line-height: 1.2 !important;
    }

    #view-dashboard .dashboard-bottom table th,
    #view-dashboard .dashboard-bottom table td,
    #view-dashboard .dashboard-bottom .sort-head {
      color: rgba(241, 245, 249, .88) !important;
    }

    #view-dashboard .dashboard-bottom .sales-table td:first-child,
    #view-dashboard .dashboard-bottom .sales-table td:nth-child(6),
    #view-dashboard .dashboard-bottom .sales-table td:nth-child(6) strong,
    #view-dashboard .dashboard-bottom .money-fit {
      color: #fff7ed !important;
    }

    #view-dashboard .dashboard-bottom .sales-table td:first-child .tag {
      background: rgba(88, 28, 135, .22) !important;
      border-color: rgba(196, 181, 253, .24) !important;
      color: #ede9fe !important;
    }

    #cashExpenseForm,
    #cashDepositForm {
      max-height: none !important;
      overflow: visible !important;
      gap: 12px !important;
    }

    #cashExpenseForm label,
    #cashDepositForm label,
    #cashExpenseForm input,
    #cashExpenseForm select,
    #cashExpenseForm textarea,
    #cashDepositForm input,
    #cashDepositForm textarea {
      color: #ffffff !important;
    }

    @media (max-width: 760px) {
      .quick-money-body {
        grid-template-columns: 1fr !important;
      }

      .quick-money-body .row-actions {
        grid-template-columns: 1fr !important;
      }

      .activation-purchase-actions,
      .modal .activation-purchase-actions {
        position: static !important;
      }
    }

    @media (max-width: 680px) {
      body.android-shell,
      body.android-shell * {
        max-width: 100%;
      }

      body.android-shell .app {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-rows: auto minmax(0, 1fr) !important;
        height: 100dvh !important;
        overflow: hidden !important;
      }

      body.android-shell .sidebar {
        position: relative !important;
        z-index: 40 !important;
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        max-height: none !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        grid-template-rows: auto auto !important;
        gap: 8px !important;
        padding: 8px !important;
        overflow: visible !important;
        background: rgba(5, 10, 20, .98) !important;
        border-right: 0 !important;
        border-bottom: 1px solid rgba(168, 85, 247, .18) !important;
      }

      body.android-shell .mobile-nav-toggle,
      body.android-shell .brand {
        min-width: 0 !important;
        min-height: 48px !important;
        max-height: 58px !important;
        overflow: hidden !important;
        align-self: stretch !important;
      }

      body.android-shell .mobile-nav-toggle {
        order: 1 !important;
        grid-column: 1 !important;
      }

      body.android-shell .brand {
        order: 2 !important;
        grid-column: 2 !important;
        grid-template-columns: 34px minmax(0, 1fr) !important;
        padding-right: 34px !important;
      }

      body.android-shell .brand h1,
      body.android-shell .brand span,
      body.android-shell .mobile-nav-toggle span,
      body.android-shell .mobile-nav-toggle small {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
      }

      body.android-shell .app-exit-button {
        top: 9px !important;
        right: 9px !important;
        z-index: 62 !important;
      }

      body.android-shell .nav {
        order: 3 !important;
        grid-column: 1 / -1 !important;
        display: none !important;
        position: absolute !important;
        top: calc(100% + 6px) !important;
        left: 8px !important;
        right: 8px !important;
        z-index: 60 !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        max-height: min(46dvh, 360px) !important;
        overflow: auto !important;
        padding: 10px !important;
        border: 1px solid rgba(168, 85, 247, .24) !important;
        border-radius: 18px !important;
        background: linear-gradient(180deg, rgba(12, 18, 32, .98), rgba(5, 10, 20, .99)) !important;
        box-shadow: 0 20px 50px rgba(0, 0, 0, .46) !important;
      }

      body.android-shell.nav-expanded .nav {
        display: grid !important;
        opacity: 1 !important;
      }

      body.android-shell .nav button {
        min-height: 42px !important;
        padding: 8px 9px !important;
        grid-template-columns: 20px minmax(0, 1fr) auto !important;
        font-size: 12px !important;
        line-height: 1.15 !important;
      }

      body.android-shell .nav button span:nth-child(2) {
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
      }

      body.android-shell .shift-box.as-nav-note {
        order: 4 !important;
        grid-column: 1 / -1 !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        grid-template-areas:
          "profile support create"
          "sync sync shift" !important;
        min-height: 0 !important;
        max-height: 126px !important;
        padding: 8px !important;
        gap: 7px !important;
        overflow: hidden !important;
        border-radius: 16px !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button { grid-area: profile !important; }
      body.android-shell .shift-box.as-nav-note .quick-support-button { grid-area: support !important; }
      body.android-shell .shift-box.as-nav-note .quick-support-create-button { grid-area: create !important; }
      body.android-shell .shift-box.as-nav-note .quick-sync-button { grid-area: sync !important; }
      body.android-shell .shift-box.as-nav-note .shift-state-line { grid-area: shift !important; }

      body.android-shell .shift-box.as-nav-note .sidebar-service-divider,
      body.android-shell .shift-box.as-nav-note #shiftMeta,
      body.android-shell .shift-box.as-nav-note #shiftEmail,
      body.android-shell .shift-box.as-nav-note #syncState {
        display: none !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button,
      body.android-shell .shift-box.as-nav-note .quick-support-button,
      body.android-shell .shift-box.as-nav-note .quick-support-create-button,
      body.android-shell .shift-box.as-nav-note .quick-sync-button,
      body.android-shell .shift-box.as-nav-note .shift-state-line {
        min-width: 0 !important;
        min-height: 36px !important;
        padding: 7px 8px !important;
        font-size: 11px !important;
        line-height: 1.15 !important;
        overflow: hidden !important;
      }

      body.android-shell .shift-box.as-nav-note strong,
      body.android-shell .shift-box.as-nav-note span {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
      }

      body.android-shell .main {
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 8px 10px max(14px, calc(var(--android-nav-safe, 0px) + 8px)) !important;
      }

      body.android-shell .view:not(.hidden) {
        min-height: 0 !important;
        overflow: auto !important;
        padding-bottom: max(28px, calc(var(--android-nav-safe, 0px) + 18px)) !important;
      }

      body.android-shell .topline {
        min-height: 46px !important;
      }
    }

    @media (orientation: landscape) and (min-width: 681px) and (max-width: 1366px) {
      body.android-shell .app {
        grid-template-columns: 272px minmax(0, 1fr) !important;
        grid-template-rows: minmax(0, 1fr) !important;
      }

      body.android-shell .sidebar {
        width: 272px !important;
        min-width: 272px !important;
        max-width: 272px !important;
        display: grid !important;
        grid-template-rows: auto minmax(0, 1fr) auto !important;
        gap: 10px !important;
        padding: 12px 14px max(12px, env(safe-area-inset-bottom)) !important;
        overflow: hidden !important;
      }

      body.android-shell .brand {
        min-height: 44px !important;
        padding-right: 38px !important;
      }

      body.android-shell .brand h1 {
        font-size: 14px !important;
        white-space: nowrap !important;
      }

      body.android-shell .app-exit-button {
        top: 12px !important;
        right: 14px !important;
        z-index: 8 !important;
      }

      body.android-shell .mobile-nav-toggle {
        display: none !important;
      }

      body.android-shell .nav {
        display: grid !important;
        min-height: 0 !important;
        overflow: auto !important;
        gap: 7px !important;
        padding-right: 2px !important;
      }

      body.android-shell .nav button {
        min-height: 38px !important;
        padding: 8px 10px !important;
        grid-template-columns: 24px minmax(0, 1fr) auto !important;
        font-size: 12px !important;
        line-height: 1.15 !important;
      }

      body.android-shell .shift-box.as-nav-note {
        position: relative !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        grid-template-areas:
          "profile"
          "support"
          "create"
          "sync"
          "shift" !important;
        width: 100% !important;
        min-width: 0 !important;
        max-height: 260px !important;
        overflow: hidden !important;
        gap: 8px !important;
        padding: 10px !important;
        border: 1px solid rgba(168, 85, 247, .18) !important;
        border-radius: 16px !important;
        background: linear-gradient(180deg, rgba(12, 18, 32, .94), rgba(5, 10, 20, .96)) !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button { grid-area: profile !important; }
      body.android-shell .shift-box.as-nav-note .quick-support-button { grid-area: support !important; }
      body.android-shell .shift-box.as-nav-note .quick-support-create-button { grid-area: create !important; }
      body.android-shell .shift-box.as-nav-note .quick-sync-button { grid-area: sync !important; }
      body.android-shell .shift-box.as-nav-note .shift-state-line { grid-area: shift !important; }

      body.android-shell .shift-box.as-nav-note .sidebar-service-divider,
      body.android-shell .shift-box.as-nav-note #shiftMeta,
      body.android-shell .shift-box.as-nav-note #shiftEmail,
      body.android-shell .shift-box.as-nav-note #syncState {
        display: none !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button,
      body.android-shell .shift-box.as-nav-note .quick-support-button,
      body.android-shell .shift-box.as-nav-note .quick-support-create-button,
      body.android-shell .shift-box.as-nav-note .quick-sync-button,
      body.android-shell .shift-box.as-nav-note .shift-state-line {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 38px !important;
        padding: 8px 10px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        font-size: 12px !important;
        line-height: 1.15 !important;
        writing-mode: horizontal-tb !important;
        word-break: normal !important;
      }

      body.android-shell .shift-box.as-nav-note strong,
      body.android-shell .shift-box.as-nav-note span {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        writing-mode: horizontal-tb !important;
      }

      body.android-shell .main {
        min-width: 0 !important;
        min-height: 0 !important;
        padding: 12px max(14px, env(safe-area-inset-right)) max(14px, calc(var(--android-nav-safe, 0px) + 8px)) 14px !important;
        overflow: hidden !important;
      }

      body.android-shell #view-dashboard:not(.hidden) {
        display: grid !important;
        align-content: start !important;
        gap: 14px !important;
        overflow: auto !important;
      }

      body.android-shell .quick-money-panel {
        min-height: 156px !important;
        height: auto !important;
        overflow: visible !important;
        margin-bottom: 0 !important;
      }

      body.android-shell .quick-money-panel .panel-head {
        min-height: 48px !important;
        padding: 14px 16px 8px !important;
      }

      body.android-shell .quick-money-body {
        display: grid !important;
        grid-template-columns: minmax(220px, .55fr) minmax(300px, 1fr) !important;
        min-height: 96px !important;
        padding: 12px 16px 16px !important;
        gap: 12px !important;
        overflow: visible !important;
      }

      body.android-shell .quick-money-body .row-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(132px, 1fr)) !important;
      }

      body.android-shell .dashboard-bottom {
        margin-top: 0 !important;
      }
    }

    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell {
        --android-service-height: 0px !important;
      }

      body.android-shell .sidebar {
        gap: 7px !important;
        padding: 7px 8px 8px !important;
      }

      body.android-shell .mobile-nav-toggle,
      body.android-shell .brand {
        min-height: 44px !important;
        max-height: 50px !important;
        padding-top: 7px !important;
        padding-bottom: 7px !important;
      }

      body.android-shell .shift-box.as-nav-note {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        grid-template-areas:
          "profile support create"
          "sync sync shift" !important;
        max-height: 92px !important;
        padding: 7px !important;
        gap: 6px !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button,
      body.android-shell .shift-box.as-nav-note .quick-support-button,
      body.android-shell .shift-box.as-nav-note .quick-support-create-button,
      body.android-shell .shift-box.as-nav-note .quick-sync-button,
      body.android-shell .shift-box.as-nav-note .shift-state-line {
        min-height: 30px !important;
        padding: 5px 7px !important;
        font-size: 10px !important;
        line-height: 1.1 !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button {
        display: grid !important;
        align-content: center !important;
        gap: 0 !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button span {
        font-size: 9px !important;
        opacity: .72 !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-sync-button {
        justify-content: center !important;
        text-align: center !important;
      }

      body.android-shell .shift-box.as-nav-note .shift-state-line {
        justify-content: center !important;
        gap: 5px !important;
      }

      body.android-shell .main {
        gap: 8px !important;
        padding-top: 8px !important;
      }

      body.android-shell .topline {
        min-height: 54px !important;
        padding: 11px 14px !important;
      }

      body.android-shell #view-dashboard:not(.hidden) {
        display: grid !important;
        gap: 10px !important;
        align-content: start !important;
        overflow-x: hidden !important;
      }

      body.android-shell #view-dashboard .dashboard-stats {
        gap: 9px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat {
        min-height: 106px !important;
        padding: 13px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .period-stat {
        min-height: 188px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat strong {
        font-size: 24px !important;
        line-height: 1.15 !important;
      }

      body.android-shell #view-dashboard .quick-money-panel {
        display: block !important;
        min-height: 184px !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        margin: 0 !important;
      }

      body.android-shell #view-dashboard .quick-money-panel .panel-head {
        display: flex !important;
        min-height: 44px !important;
        padding: 13px 14px 6px !important;
        align-items: center !important;
      }

      body.android-shell #view-dashboard .quick-money-panel .panel-head h3 {
        display: block !important;
        color: #ffffff !important;
        font-size: 18px !important;
      }

      body.android-shell #view-dashboard .quick-money-body {
        display: grid !important;
        grid-template-columns: 1fr !important;
        min-height: 126px !important;
        padding: 8px 14px 14px !important;
        gap: 10px !important;
        overflow: visible !important;
      }

      body.android-shell #view-dashboard .quick-money-body .money-fit {
        font-size: 23px !important;
      }

      body.android-shell #view-dashboard .quick-money-body .row-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
      }

      body.android-shell #view-dashboard .quick-money-body .btn {
        min-height: 40px !important;
        padding: 8px 9px !important;
        font-size: 11px !important;
      }

      body.android-shell #view-dashboard .dashboard-bottom {
        display: block !important;
        margin-top: 0 !important;
      }

      body.android-shell #view-dashboard .dashboard-bottom .panel-head {
        min-height: 58px !important;
        padding: 15px 14px !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table tbody {
        gap: 10px !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table tr {
        gap: 8px !important;
        padding: 12px !important;
        border-radius: 15px !important;
        background: linear-gradient(180deg, rgba(18, 24, 39, .96), rgba(9, 14, 26, .98)) !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table td {
        grid-template-columns: minmax(92px, 34%) minmax(0, 1fr) !important;
        gap: 10px !important;
        align-items: center !important;
        min-height: 24px !important;
        font-size: 13px !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table td::before {
        font-size: 11px !important;
        color: rgba(226, 232, 255, .68) !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table td:first-child .tag {
        justify-self: start !important;
        min-width: 74px !important;
        text-align: center !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table td:nth-child(6) strong {
        font-size: 15px !important;
        color: #fff7ed !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table td:last-child {
        display: block !important;
        margin-top: 2px !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table td:last-child::before {
        content: "" !important;
        display: none !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table td:last-child .btn {
        width: 100% !important;
        min-height: 34px !important;
      }
    }

    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell .app {
        grid-template-rows: auto minmax(0, 1fr) !important;
      }

      body.android-shell .sidebar {
        gap: 6px !important;
        padding: 6px 8px 7px !important;
      }

      body.android-shell .mobile-nav-toggle,
      body.android-shell .brand {
        min-height: 42px !important;
        max-height: 46px !important;
        border-radius: 14px !important;
      }

      body.android-shell .brand {
        grid-template-columns: 28px minmax(0, 1fr) !important;
        gap: 8px !important;
        padding: 6px 32px 6px 8px !important;
      }

      body.android-shell .brand-mark {
        width: 28px !important;
        height: 28px !important;
        font-size: 9px !important;
      }

      body.android-shell .brand h1,
      body.android-shell .mobile-nav-toggle span {
        font-size: 13px !important;
        line-height: 1.08 !important;
      }

      body.android-shell .brand span,
      body.android-shell .mobile-nav-toggle small {
        font-size: 10px !important;
      }

      body.android-shell .app-exit-button {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        top: 9px !important;
        right: 9px !important;
      }

      body.android-shell .shift-box.as-nav-note {
        grid-template-columns: 1fr 1fr !important;
        grid-template-areas:
          "profile support"
          "sync shift" !important;
        max-height: 86px !important;
        padding: 7px !important;
        gap: 6px !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-support-create-button {
        display: none !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button,
      body.android-shell .shift-box.as-nav-note .quick-support-button,
      body.android-shell .shift-box.as-nav-note .quick-sync-button,
      body.android-shell .shift-box.as-nav-note .shift-state-line {
        min-height: 28px !important;
        padding: 5px 7px !important;
        border-radius: 11px !important;
        font-size: 10px !important;
      }

      body.android-shell .main {
        padding: 7px 10px max(14px, calc(var(--android-nav-safe, 0px) + 8px)) !important;
      }

      body.android-shell .topline {
        min-height: 44px !important;
        padding: 10px 12px !important;
        border-radius: 14px !important;
      }

      body.android-shell .topline h2 {
        font-size: 18px !important;
      }

      body.android-shell .topline p {
        display: none !important;
      }

      body.android-shell #view-dashboard:not(.hidden) {
        gap: 8px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats {
        gap: 8px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat {
        min-height: 86px !important;
        padding: 10px !important;
        border-radius: 14px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .period-stat {
        min-height: 150px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat span {
        font-size: 10px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat strong {
        font-size: 21px !important;
      }

      body.android-shell #view-dashboard .quick-money-panel {
        min-height: 140px !important;
      }

      body.android-shell #view-dashboard .quick-money-panel .panel-head {
        min-height: 38px !important;
        padding: 10px 12px 4px !important;
      }

      body.android-shell #view-dashboard .quick-money-panel .panel-head h3 {
        font-size: 16px !important;
      }

      body.android-shell #view-dashboard .quick-money-body {
        min-height: 96px !important;
        padding: 6px 12px 12px !important;
        gap: 8px !important;
      }

      body.android-shell #view-dashboard .quick-money-body .money-fit {
        font-size: 20px !important;
      }

      body.android-shell #view-dashboard .quick-money-body .btn {
        min-height: 34px !important;
        font-size: 10px !important;
      }

      body.android-shell .nav {
        max-height: min(50dvh, 420px) !important;
        gap: 6px !important;
        padding: 8px !important;
      }

      body.android-shell .nav button {
        min-height: 38px !important;
        padding: 7px 8px !important;
        border-radius: 12px !important;
      }
    }

    @media (orientation: portrait) and (min-width: 681px) and (max-width: 980px) {
      body.android-shell .app {
        display: grid !important;
        grid-template-columns: 214px minmax(0, 1fr) !important;
        grid-template-rows: minmax(0, 1fr) !important;
        height: 100dvh !important;
        overflow: hidden !important;
      }

      body.android-shell .sidebar {
        width: 214px !important;
        min-width: 214px !important;
        max-width: 214px !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        grid-template-rows: auto auto minmax(0, 1fr) auto !important;
        gap: 7px !important;
        padding: 10px 10px max(10px, calc(var(--android-nav-safe, 0px) + 6px)) !important;
        overflow: hidden !important;
        background: rgba(5, 10, 20, .98) !important;
        border-right: 1px solid rgba(168, 85, 247, .16) !important;
      }

      body.android-shell .brand {
        order: 1 !important;
        grid-column: auto !important;
        min-height: 42px !important;
        max-height: 48px !important;
        padding: 7px 34px 7px 9px !important;
        grid-template-columns: 32px minmax(0, 1fr) !important;
        gap: 8px !important;
      }

      body.android-shell .brand h1 {
        font-size: 13px !important;
        line-height: 1.12 !important;
      }

      body.android-shell .brand span {
        font-size: 10px !important;
      }

      body.android-shell .mobile-nav-toggle {
        order: 2 !important;
        display: flex !important;
        min-height: 38px !important;
        padding: 7px 9px !important;
      }

      body.android-shell .mobile-nav-toggle span {
        font-size: 12px !important;
      }

      body.android-shell .mobile-nav-toggle small {
        font-size: 9px !important;
      }

      body.android-shell .nav {
        order: 3 !important;
        grid-column: auto !important;
        position: static !important;
        display: grid !important;
        max-height: none !important;
        min-height: 0 !important;
        overflow: auto !important;
        grid-template-columns: 1fr !important;
        gap: 7px !important;
        padding: 2px 1px 2px 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
      }

      body.android-shell .nav button {
        min-height: 34px !important;
        padding: 7px 8px !important;
        grid-template-columns: 21px minmax(0, 1fr) auto !important;
        font-size: 11px !important;
      }

      body.android-shell .shift-box.as-nav-note {
        order: 4 !important;
        position: static !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        grid-template-areas:
          "profile"
          "support"
          "create"
          "sync"
          "shift" !important;
        width: 100% !important;
        max-height: 208px !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 9px !important;
        gap: 7px !important;
        border-radius: 15px !important;
        background: linear-gradient(180deg, rgba(12, 18, 32, .94), rgba(5, 10, 20, .96)) !important;
        border: 1px solid rgba(168, 85, 247, .18) !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button { grid-area: profile !important; }
      body.android-shell .shift-box.as-nav-note .quick-support-button { grid-area: support !important; }
      body.android-shell .shift-box.as-nav-note .quick-support-create-button { grid-area: create !important; }
      body.android-shell .shift-box.as-nav-note .quick-sync-button { grid-area: sync !important; }
      body.android-shell .shift-box.as-nav-note .shift-state-line { grid-area: shift !important; }

      body.android-shell .shift-box.as-nav-note .sidebar-service-divider,
      body.android-shell .shift-box.as-nav-note #shiftMeta,
      body.android-shell .shift-box.as-nav-note #shiftEmail,
      body.android-shell .shift-box.as-nav-note #syncState {
        display: none !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button,
      body.android-shell .shift-box.as-nav-note .quick-support-button,
      body.android-shell .shift-box.as-nav-note .quick-support-create-button,
      body.android-shell .shift-box.as-nav-note .quick-sync-button,
      body.android-shell .shift-box.as-nav-note .shift-state-line {
        min-height: 30px !important;
        padding: 6px 8px !important;
        font-size: 10px !important;
        line-height: 1.15 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
      }

      body.android-shell .main {
        min-width: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 12px 12px max(14px, calc(var(--android-nav-safe, 0px) + 8px)) !important;
      }

      body.android-shell .view:not(.hidden) {
        min-height: 0 !important;
        overflow: auto !important;
        padding-bottom: max(24px, calc(var(--android-nav-safe, 0px) + 14px)) !important;
      }

      body.android-shell .topline {
        min-height: 54px !important;
        padding: 11px 13px !important;
      }

      body.android-shell .topline h2 {
        font-size: 20px !important;
      }

      body.android-shell .topline p {
        font-size: 11px !important;
      }

      body.android-shell #view-dashboard:not(.hidden) {
        display: grid !important;
        gap: 12px !important;
        align-content: start !important;
      }

      body.android-shell #view-dashboard .dashboard-stats {
        gap: 10px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat {
        min-height: 98px !important;
        padding: 12px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .period-stat {
        min-height: 146px !important;
      }

      body.android-shell #view-dashboard .quick-money-panel {
        min-height: 126px !important;
        overflow: visible !important;
      }

      body.android-shell #view-dashboard .quick-money-body {
        grid-template-columns: 1fr !important;
        min-height: 92px !important;
        padding: 8px 14px 14px !important;
      }

      body.android-shell #view-dashboard .dashboard-bottom {
        margin-bottom: 0 !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table thead {
        display: none !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table tbody {
        display: grid !important;
        gap: 10px !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table tr {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px 12px !important;
        padding: 12px !important;
        border: 1px solid rgba(148, 163, 184, .18) !important;
        border-radius: 15px !important;
        background: linear-gradient(180deg, rgba(18, 24, 39, .96), rgba(9, 14, 26, .98)) !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table td {
        display: grid !important;
        grid-template-columns: minmax(74px, 38%) minmax(0, 1fr) !important;
        gap: 8px !important;
        min-height: 24px !important;
        padding: 0 !important;
        border: 0 !important;
        font-size: 12px !important;
        white-space: normal !important;
        word-break: normal !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table td::before {
        content: attr(data-label) !important;
        color: rgba(226, 232, 255, .64) !important;
        font-size: 10px !important;
        font-weight: 700 !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table td:last-child {
        grid-column: 1 / -1 !important;
        display: block !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table td:last-child::before {
        display: none !important;
      }

      body.android-shell #view-dashboard .sales-table.mobile-card-table td:last-child .btn {
        width: 100% !important;
        min-height: 32px !important;
      }
    }

    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell .sidebar {
        padding-top: 5px !important;
        padding-bottom: 6px !important;
      }

      body.android-shell .mobile-nav-toggle,
      body.android-shell .brand {
        min-height: 38px !important;
        max-height: 42px !important;
      }

      body.android-shell .app-exit-button {
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
      }

      body.android-shell .shift-box.as-nav-note {
        max-height: 76px !important;
        padding: 6px !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button,
      body.android-shell .shift-box.as-nav-note .quick-support-button,
      body.android-shell .shift-box.as-nav-note .quick-sync-button,
      body.android-shell .shift-box.as-nav-note .shift-state-line {
        min-height: 25px !important;
        padding: 4px 6px !important;
        font-size: 9px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat {
        min-height: 78px !important;
        padding: 9px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .period-stat {
        min-height: 132px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat strong {
        font-size: 20px !important;
      }

      body.android-shell #view-dashboard .quick-money-panel {
        min-height: 126px !important;
      }

      body.android-shell #view-dashboard .quick-money-body {
        min-height: 84px !important;
      }

      body.android-shell #view-dashboard .quick-money-panel {
        position: relative !important;
        z-index: 1 !important;
        display: block !important;
        min-height: 218px !important;
        height: auto !important;
        max-height: none !important;
        margin: 0 0 18px !important;
        overflow: visible !important;
      }

      body.android-shell #view-dashboard .dashboard-bottom {
        position: relative !important;
        z-index: 0 !important;
        display: block !important;
        margin-top: 18px !important;
        clear: both !important;
      }

      body.android-shell #view-dashboard .dashboard-bottom .panel {
        position: relative !important;
        transform: none !important;
      }

      body.android-shell #view-dashboard .quick-money-panel .quick-money-body {
        min-height: 156px !important;
        padding-bottom: 14px !important;
        overflow: visible !important;
      }

      body.android-shell #view-dashboard .quick-money-panel .row-actions {
        position: relative !important;
        z-index: 2 !important;
        margin-top: 4px !important;
      }

      body.android-shell #view-pos .tabs,
      body.android-shell #view-pos .pos-tabs {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        align-items: stretch !important;
        min-height: 42px !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        gap: 8px !important;
        margin: 0 0 10px !important;
        padding: 4px !important;
        border-radius: 14px !important;
      }

      body.android-shell #view-pos .tabs button,
      body.android-shell #view-pos .pos-tabs button {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-height: 36px !important;
        height: auto !important;
        padding: 7px 10px !important;
        border-radius: 12px !important;
        font-size: 12px !important;
        line-height: 1.15 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
      }

      body.android-shell .view:not(.hidden) > .tabs,
      body.android-shell #view-stock .tabs,
      body.android-shell #view-documents > .tabs,
      body.android-shell #view-history .tabs,
      body.android-shell .settings-tabs {
        display: flex !important;
        align-items: center !important;
        min-height: 42px !important;
        height: auto !important;
        max-height: none !important;
        overflow-x: auto !important;
        overflow-y: visible !important;
        gap: 8px !important;
        margin: 0 0 10px !important;
        padding: 4px !important;
        border-radius: 14px !important;
        scrollbar-width: none !important;
      }

      body.android-shell .view:not(.hidden) > .tabs::-webkit-scrollbar,
      body.android-shell #view-stock .tabs::-webkit-scrollbar,
      body.android-shell #view-documents > .tabs::-webkit-scrollbar,
      body.android-shell #view-history .tabs::-webkit-scrollbar,
      body.android-shell .settings-tabs::-webkit-scrollbar {
        display: none !important;
      }

      body.android-shell .view:not(.hidden) > .tabs button,
      body.android-shell #view-stock .tabs button,
      body.android-shell #view-documents > .tabs button,
      body.android-shell #view-history .tabs button,
      body.android-shell .settings-tabs button {
        flex: 0 0 auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: min(42vw, 164px) !important;
        min-height: 36px !important;
        height: auto !important;
        padding: 7px 12px !important;
        border-radius: 12px !important;
        font-size: 12px !important;
        line-height: 1.15 !important;
        white-space: nowrap !important;
      }

      body.android-shell #view-stock h3,
      body.android-shell #view-stock h4,
      body.android-shell #view-stock .panel-head h3 {
        color: #f8fafc !important;
      }

      body.android-shell #view-stock > .tabs,
      body.android-shell #view-stock .tabs:first-of-type {
        position: relative !important;
        z-index: 3 !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        min-height: 46px !important;
        padding: 5px !important;
        background: rgba(8, 13, 24, .92) !important;
        border: 1px solid rgba(168, 85, 247, .18) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
      }

      body.android-shell #view-stock > .tabs button,
      body.android-shell #view-stock .tabs:first-of-type button {
        min-width: 0 !important;
        width: 100% !important;
        min-height: 38px !important;
        color: rgba(248, 250, 252, .9) !important;
        font-weight: 800 !important;
      }

      body.android-shell #view-stock > .tabs button.active,
      body.android-shell #view-stock .tabs:first-of-type button.active {
        color: #ffffff !important;
      }

      body.android-shell .report-preview-modal .row-actions:last-child {
        margin: 0 !important;
        padding: 12px 0 max(8px, var(--android-nav-safe, 0px)) !important;
        border-radius: 0 0 14px 14px !important;
        background: linear-gradient(180deg, rgba(8, 13, 24, 0), rgba(8, 13, 24, .98) 28%, rgba(8, 13, 24, .98)) !important;
      }
    }

    @media (orientation: portrait) and (min-width: 681px) and (max-width: 980px) {
      body.android-shell .mobile-nav-toggle {
        display: none !important;
      }

      body.android-shell .sidebar {
        grid-template-rows: auto minmax(0, 1fr) auto !important;
      }

      body.android-shell .nav,
      body.android-shell.nav-expanded .nav {
        display: grid !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        transform: none !important;
      }

      body.android-shell .nav button {
        display: grid !important;
        visibility: visible !important;
        opacity: 1 !important;
        color: rgba(248, 250, 252, .92) !important;
      }
    }

    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell {
        --mobile-service-dock-height: 132px !important;
      }

      body.android-shell .app {
        grid-template-rows: auto minmax(0, 1fr) !important;
        height: 100dvh !important;
        overflow: hidden !important;
      }

      body.android-shell .sidebar {
        position: relative !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, .98fr) !important;
        grid-template-rows: auto !important;
        gap: 8px !important;
        padding: 7px 10px !important;
        overflow: visible !important;
        background: linear-gradient(180deg, rgba(5, 9, 18, .99), rgba(7, 10, 22, .98)) !important;
        border-bottom: 1px solid rgba(168, 85, 247, .18) !important;
      }

      body.android-shell .brand {
        order: 1 !important;
        grid-column: 1 !important;
        min-width: 0 !important;
        min-height: 44px !important;
        max-height: 48px !important;
        padding: 7px 38px 7px 9px !important;
        border-radius: 15px !important;
      }

      body.android-shell .brand h1 {
        font-size: 13px !important;
        line-height: 1.08 !important;
        white-space: nowrap !important;
      }

      body.android-shell .brand span {
        font-size: 10px !important;
        line-height: 1.05 !important;
      }

      body.android-shell .app-exit-button {
        top: 12px !important;
        right: calc(50% + 12px) !important;
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        z-index: 64 !important;
      }

      body.android-shell .mobile-nav-toggle {
        order: 2 !important;
        grid-column: 2 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 0 !important;
        min-height: 44px !important;
        max-height: 48px !important;
        padding: 7px 10px !important;
        border-radius: 15px !important;
        text-align: center !important;
      }

      body.android-shell .mobile-nav-toggle #mobileNavCurrent {
        display: none !important;
      }

      body.android-shell .mobile-nav-toggle small {
        display: block !important;
        color: #f8fafc !important;
        font-size: 12px !important;
        font-weight: 850 !important;
        line-height: 1.15 !important;
        white-space: normal !important;
      }

      body.android-shell .nav {
        order: 3 !important;
        grid-column: 1 / -1 !important;
        top: calc(100% + 7px) !important;
        left: 10px !important;
        right: 10px !important;
        max-height: min(54dvh, 430px) !important;
        z-index: 80 !important;
      }

      body.android-shell .shift-box.as-nav-note {
        position: fixed !important;
        left: 10px !important;
        right: 10px !important;
        bottom: max(8px, calc(var(--android-nav-safe, 0px) + 8px)) !important;
        z-index: 70 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        grid-template-areas:
          "profile shift"
          "support sync"
          "state state" !important;
        width: auto !important;
        min-height: 0 !important;
        max-height: var(--mobile-service-dock-height) !important;
        padding: 9px !important;
        gap: 7px !important;
        overflow: hidden !important;
        border-radius: 18px !important;
        border: 1px solid rgba(168, 85, 247, .24) !important;
        background: linear-gradient(180deg, rgba(13, 18, 34, .97), rgba(6, 9, 20, .99)) !important;
        box-shadow: 0 -18px 42px rgba(0, 0, 0, .38) !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button { grid-area: profile !important; }
      body.android-shell .shift-box.as-nav-note .quick-support-button { grid-area: support !important; }
      body.android-shell .shift-box.as-nav-note .quick-sync-button { grid-area: sync !important; }
      body.android-shell .shift-box.as-nav-note .shift-state-line { grid-area: shift !important; }
      body.android-shell .shift-box.as-nav-note #syncState { grid-area: state !important; }

      body.android-shell .shift-box.as-nav-note .quick-support-create-button,
      body.android-shell .shift-box.as-nav-note .sidebar-service-divider,
      body.android-shell .shift-box.as-nav-note #shiftMeta,
      body.android-shell .shift-box.as-nav-note #shiftEmail {
        display: none !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button,
      body.android-shell .shift-box.as-nav-note .quick-support-button,
      body.android-shell .shift-box.as-nav-note .quick-sync-button,
      body.android-shell .shift-box.as-nav-note .shift-state-line {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 0 !important;
        min-height: 34px !important;
        max-height: 36px !important;
        padding: 6px 8px !important;
        border-radius: 12px !important;
        font-size: 11px !important;
        line-height: 1.1 !important;
        text-align: center !important;
        white-space: normal !important;
        overflow: hidden !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button {
        display: grid !important;
        align-content: center !important;
        gap: 1px !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button span {
        font-size: 9px !important;
        opacity: .72 !important;
      }

      body.android-shell .shift-box.as-nav-note #syncState {
        display: block !important;
        min-width: 0 !important;
        max-height: 28px !important;
        overflow: hidden !important;
        padding: 0 3px !important;
        color: rgba(226, 232, 255, .74) !important;
        font-size: 9px !important;
        line-height: 1.25 !important;
        text-align: left !important;
      }

      body.android-shell .shift-box.as-nav-note #syncState strong {
        color: #ffffff !important;
      }

      body.android-shell .main {
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 8px 10px calc(var(--mobile-service-dock-height, 178px) + var(--android-nav-safe, 0px) + 42px) !important;
      }

      body.android-shell .view:not(.hidden) {
        overflow-x: hidden !important;
        overflow-y: auto !important;
        padding-bottom: calc(var(--mobile-service-dock-height, 178px) + var(--android-nav-safe, 0px) + 56px) !important;
        scroll-padding-bottom: calc(var(--mobile-service-dock-height, 178px) + var(--android-nav-safe, 0px) + 56px) !important;
      }

      body.android-shell .topline {
        min-height: 48px !important;
        padding: 11px 13px !important;
      }
    }

    @media (max-width: 980px) {
      body.android-shell .table-wrap,
      body.android-shell .panel-body,
      body.android-shell .history-list,
      body.android-shell .notification-log-wrap {
        min-width: 0 !important;
        max-width: 100% !important;
      }

      body.android-shell .mobile-card-table {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        border-collapse: separate !important;
        border-spacing: 0 !important;
      }

      body.android-shell .mobile-card-table thead {
        display: none !important;
      }

      body.android-shell .mobile-card-table tbody {
        display: grid !important;
        gap: 10px !important;
        width: 100% !important;
      }

      body.android-shell .mobile-card-table tr {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        width: 100% !important;
        min-width: 0 !important;
        padding: 12px !important;
        border: 1px solid rgba(148, 163, 184, .18) !important;
        border-radius: 16px !important;
        background: linear-gradient(180deg, rgba(18, 24, 39, .95), rgba(8, 12, 24, .98)) !important;
      }

      body.android-shell .mobile-card-table td {
        display: grid !important;
        grid-template-columns: minmax(92px, 34%) minmax(0, 1fr) !important;
        gap: 10px !important;
        min-width: 0 !important;
        min-height: 24px !important;
        padding: 0 !important;
        border: 0 !important;
        color: rgba(248, 250, 252, .92) !important;
        font-size: 12px !important;
        line-height: 1.28 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
      }

      body.android-shell .mobile-card-table td::before {
        content: attr(data-label) !important;
        color: rgba(203, 213, 225, .66) !important;
        font-size: 10px !important;
        font-weight: 800 !important;
        line-height: 1.2 !important;
      }

      body.android-shell .mobile-card-table .row-actions,
      body.android-shell .mobile-card-table td:last-child .row-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 7px !important;
        width: 100% !important;
      }

      body.android-shell .mobile-card-table .btn,
      body.android-shell .mobile-card-table button {
        min-height: 32px !important;
        padding: 6px 8px !important;
        font-size: 10px !important;
      }

      body.android-shell #view-settings,
      body.android-shell #view-documents,
      body.android-shell #view-stock,
      body.android-shell #view-clients,
      body.android-shell #view-reports,
      body.android-shell #view-history,
      body.android-shell #view-notes,
      body.android-shell #view-receipts,
      body.android-shell #view-shifts {
        max-width: 100% !important;
        overflow-x: hidden !important;
      }

      body.android-shell #view-settings .network-grid,
      body.android-shell #view-settings .network-metrics,
      body.android-shell #view-settings .settings-grid,
      body.android-shell #view-settings .settings-layout,
      body.android-shell #view-settings .form-grid,
      body.android-shell #view-settings .two-col,
      body.android-shell #view-settings .toolbar,
      body.android-shell #view-settings .row-actions,
      body.android-shell #view-stock .toolbar,
      body.android-shell #view-stock .tabs,
      body.android-shell #view-receipts .toolbar,
      body.android-shell #view-reports .toolbar,
      body.android-shell #view-documents .toolbar,
      body.android-shell #view-clients .toolbar {
        display: grid !important;
        grid-template-columns: 1fr !important;
        width: 100% !important;
        min-width: 0 !important;
        gap: 8px !important;
      }

      body.android-shell #view-stock > .tabs,
      body.android-shell #view-stock .tabs:first-of-type {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      }

      body.android-shell #view-settings input,
      body.android-shell #view-settings select,
      body.android-shell #view-settings textarea,
      body.android-shell #view-stock input,
      body.android-shell #view-stock select,
      body.android-shell #view-documents input,
      body.android-shell #view-documents select,
      body.android-shell #view-clients input,
      body.android-shell #view-clients select {
        width: 100% !important;
        min-width: 0 !important;
      }

      body.android-shell #view-settings .network-card,
      body.android-shell #view-settings .panel,
      body.android-shell #view-settings .card,
      body.android-shell .modal,
      body.android-shell .child-modal {
        max-width: min(96vw, 760px) !important;
        overflow-x: hidden !important;
      }
    }

    @media (orientation: portrait) and (min-width: 681px) and (max-width: 980px) {
      body.android-shell .app {
        grid-template-columns: 244px minmax(0, 1fr) !important;
      }

      body.android-shell .sidebar {
        width: 244px !important;
        min-width: 244px !important;
        max-width: 244px !important;
      }

      body.android-shell .nav button {
        font-size: 12px !important;
        min-height: 36px !important;
      }

      body.android-shell .shift-box.as-nav-note {
        max-height: 238px !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button,
      body.android-shell .shift-box.as-nav-note .quick-support-button,
      body.android-shell .shift-box.as-nav-note .quick-support-create-button,
      body.android-shell .shift-box.as-nav-note .quick-sync-button,
      body.android-shell .shift-box.as-nav-note .shift-state-line {
        font-size: 11px !important;
        min-height: 34px !important;
      }
    }

    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell {
        --mobile-service-dock-height: 104px !important;
      }

      body.android-shell .shift-box.as-nav-note {
        grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 1fr) !important;
        grid-template-areas:
          "profile support sync"
          "state state shift" !important;
        max-height: var(--mobile-service-dock-height) !important;
        padding: 8px !important;
        gap: 6px !important;
        border-radius: 17px !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button,
      body.android-shell .shift-box.as-nav-note .quick-support-button,
      body.android-shell .shift-box.as-nav-note .quick-sync-button,
      body.android-shell .shift-box.as-nav-note .shift-state-line {
        min-height: 31px !important;
        max-height: 33px !important;
        padding: 5px 7px !important;
        font-size: 10px !important;
        border-radius: 11px !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-support-button,
      body.android-shell .shift-box.as-nav-note .quick-sync-button {
        font-size: 11px !important;
        font-weight: 850 !important;
      }

      body.android-shell .shift-box.as-nav-note #syncState {
        max-height: 25px !important;
        font-size: 8.7px !important;
        line-height: 1.22 !important;
      }

      body.android-shell #view-dashboard .dashboard-stats {
        gap: 7px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat {
        min-height: 74px !important;
        padding: 9px !important;
        border-radius: 13px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .period-stat {
        min-height: 128px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat strong {
        font-size: 20px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat span {
        font-size: 10px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .period-stat select,
      body.android-shell #view-dashboard .dashboard-stats .period-stat input,
      body.android-shell #view-dashboard .dashboard-stats .period-stat .select-like {
        min-height: 34px !important;
      }

      body.android-shell #view-dashboard .quick-money-panel {
        min-height: 116px !important;
        border-radius: 14px !important;
      }

      body.android-shell #view-dashboard .quick-money-panel .panel-head {
        min-height: 34px !important;
        padding: 9px 12px 4px !important;
      }

      body.android-shell #view-dashboard .quick-money-body {
        min-height: 78px !important;
        padding: 5px 12px 10px !important;
        gap: 6px !important;
      }

      body.android-shell #view-dashboard .quick-money-body .money-fit {
        font-size: 18px !important;
      }

      body.android-shell #view-dashboard .dashboard-bottom .panel-head {
        min-height: 48px !important;
        padding: 12px !important;
      }
    }

    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell .sidebar {
        padding-left: 5px !important;
        padding-right: 5px !important;
      }

      body.android-shell .main {
        padding-left: 4px !important;
        padding-right: 4px !important;
        padding-bottom: calc(var(--mobile-service-dock-height) + var(--android-nav-safe, 0px) + 8px) !important;
      }

      body.android-shell .view:not(.hidden) {
        padding-left: 0 !important;
        padding-right: 0 !important;
        padding-bottom: calc(var(--mobile-service-dock-height) + var(--android-nav-safe, 0px) + 14px) !important;
      }

      body.android-shell .topline,
      body.android-shell #view-dashboard .dashboard-stats,
      body.android-shell #view-dashboard .quick-money-panel,
      body.android-shell #view-dashboard .dashboard-bottom,
      body.android-shell .view:not(.hidden) > .panel,
      body.android-shell .view:not(.hidden) > .tabs,
      body.android-shell .view:not(.hidden) > .stats,
      body.android-shell .view:not(.hidden) > .toolbar,
      body.android-shell .view:not(.hidden) > .order-source-strip {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
      }

      body.android-shell .shift-box.as-nav-note {
        left: 5px !important;
        right: 5px !important;
        bottom: max(4px, calc(var(--android-nav-safe, 0px) - 54px)) !important;
      }
    }

    @media (orientation: portrait) and (min-width: 681px) and (max-width: 980px),
           (orientation: landscape) and (min-width: 681px) and (max-width: 1366px) {
      body.android-shell .shift-box.as-nav-note {
        grid-template-areas:
          "profile"
          "support"
          "sync"
          "shift"
          "state" !important;
        max-height: 292px !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-support-create-button,
      body.android-shell .shift-box.as-nav-note .sidebar-service-divider,
      body.android-shell .shift-box.as-nav-note #shiftMeta,
      body.android-shell .shift-box.as-nav-note #shiftEmail {
        display: none !important;
      }

      body.android-shell .shift-box.as-nav-note #syncState {
        grid-area: state !important;
        display: block !important;
        max-height: 48px !important;
        overflow: hidden !important;
        margin-top: 0 !important;
        padding: 2px 1px 0 !important;
        color: rgba(226, 232, 255, .72) !important;
        font-size: 10px !important;
        line-height: 1.25 !important;
      }

      body.android-shell .shift-box.as-nav-note #syncState strong {
        color: #ffffff !important;
      }

      body.android-shell .shift-box.as-nav-note #syncState span {
        color: rgba(203, 213, 225, .68) !important;
        font-size: 9px !important;
      }
    }

    .shift-lamp.open {
      animation: pulseLamp 3.8s ease-in-out infinite !important;
    }

    @keyframes pulseLamp {
      0%, 100% {
        transform: scale(.96);
        opacity: .82;
        box-shadow: 0 0 0 4px rgba(72, 216, 143, .10), 0 0 12px rgba(72, 216, 143, .48);
      }
      50% {
        transform: scale(1.18);
        opacity: 1;
        box-shadow: 0 0 0 9px rgba(72, 216, 143, .18), 0 0 24px rgba(72, 216, 143, .72);
      }
    }

    @media (max-width: 980px) {
      body.android-shell .report-preview-modal {
        width: calc(100vw - 8px) !important;
        max-width: calc(100vw - 8px) !important;
        max-height: calc(100dvh - max(10px, var(--android-nav-safe, 0px))) !important;
        overflow: hidden !important;
      }

      body.android-shell .report-preview-modal .panel-body {
        overflow: auto !important;
        padding: 6px !important;
      }

      body.android-shell .report-preview-modal .report-editor {
        width: 1180px !important;
        max-width: none !important;
        min-width: 1180px !important;
        transform-origin: top left !important;
        pointer-events: auto !important;
      }

      body.android-shell .report-preview-modal .report-editor [contenteditable="true"] {
        pointer-events: none !important;
        caret-color: transparent !important;
      }

      body.android-shell .report-preview-modal .report-editor table {
        width: 100% !important;
        min-width: 0 !important;
        table-layout: fixed !important;
      }

      body.android-shell .report-preview-modal .report-editor th,
      body.android-shell .report-preview-modal .report-editor td {
        white-space: normal !important;
        word-break: normal !important;
        overflow-wrap: anywhere !important;
      }
    }

    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell .report-preview-modal .report-editor {
        transform: scale(.38) !important;
        margin-bottom: -62% !important;
      }
    }

    @media (orientation: portrait) and (min-width: 681px) and (max-width: 980px) {
      body.android-shell .report-preview-modal .report-editor {
        transform: scale(.62) !important;
        margin-bottom: -36% !important;
      }
    }

    @media (orientation: landscape) and (min-width: 681px) and (max-width: 1366px) {
      body.android-shell .report-preview-modal .report-editor {
        transform: scale(.72) !important;
        margin-bottom: -28% !important;
      }
    }

    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell .sidebar {
        grid-template-columns: minmax(0, 1fr) minmax(0, .88fr) 42px !important;
        gap: 6px !important;
        align-items: stretch !important;
      }

      body.android-shell .brand {
        grid-column: 1 !important;
        padding: 6px 8px !important;
        min-height: 40px !important;
        max-height: 44px !important;
        grid-template-columns: 28px minmax(0, 1fr) !important;
      }

      body.android-shell .brand h1 {
        font-size: 12px !important;
      }

      body.android-shell .brand span {
        font-size: 9px !important;
      }

      body.android-shell .brand-mark {
        width: 27px !important;
        height: 27px !important;
      }

      body.android-shell .mobile-nav-toggle {
        grid-column: 2 !important;
        min-height: 40px !important;
        max-height: 44px !important;
        padding: 6px 8px !important;
      }

      body.android-shell .mobile-nav-toggle small {
        font-size: 11px !important;
      }

      body.android-shell .app-exit-button {
        position: static !important;
        order: 3 !important;
        grid-column: 3 !important;
        grid-row: 1 !important;
        align-self: stretch !important;
        justify-self: stretch !important;
        width: 42px !important;
        height: auto !important;
        min-width: 42px !important;
        min-height: 40px !important;
        max-height: 44px !important;
        margin: 0 !important;
        border-radius: 14px !important;
        font-size: 23px !important;
        line-height: 1 !important;
        background: linear-gradient(180deg, rgba(28, 34, 52, .96), rgba(12, 16, 30, .98)) !important;
        border: 1px solid rgba(248, 113, 113, .44) !important;
        box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 8px 24px rgba(0,0,0,.24) !important;
      }

      body.android-shell.nav-expanded .nav {
        top: calc(100% + 6px) !important;
      }

      body.android-shell .app-exit-modal {
        width: min(92vw, 390px) !important;
        max-width: min(92vw, 390px) !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: hidden !important;
        border-radius: 18px !important;
      }

      body.android-shell .app-exit-modal .modal-head {
        min-height: 48px !important;
        padding: 12px 14px !important;
        border-radius: 18px 18px 0 0 !important;
      }

      body.android-shell .app-exit-modal .modal-head h3 {
        font-size: 16px !important;
        line-height: 1.2 !important;
      }

      body.android-shell .app-exit-modal .app-exit-modal-body {
        padding: 14px !important;
        gap: 12px !important;
        max-height: none !important;
        overflow: visible !important;
      }

      body.android-shell .app-exit-modal .app-exit-modal-body p {
        margin: 0 !important;
        color: rgba(248, 250, 252, .88) !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
      }

      body.android-shell .app-exit-modal .row-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        margin: 0 !important;
        padding: 0 !important;
      }

      body.android-shell .app-exit-modal .row-actions .btn {
        min-height: 38px !important;
        width: 100% !important;
        font-size: 12px !important;
      }
    }

    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell .main {
        padding-bottom: 0 !important;
      }

      body.android-shell .view:not(.hidden) {
        padding-bottom: calc(var(--mobile-service-dock-height) + 10px) !important;
      }

      body.android-shell #view-dashboard .dashboard-bottom,
      body.android-shell #view-dashboard .quick-money-panel {
        margin-bottom: 0 !important;
      }
    }

    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell .shift-box.as-nav-note {
        isolation: isolate !important;
        box-shadow:
          0 -18px 42px rgba(0, 0, 0, .38),
          0 80px 0 84px rgba(7, 10, 22, 1) !important;
      }

      body.android-shell .shift-box.as-nav-note::before {
        content: "" !important;
        position: fixed !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        height: calc(var(--mobile-service-dock-height) + var(--android-nav-safe, 0px) + 24px) !important;
        z-index: -1 !important;
        pointer-events: none !important;
        background:
          linear-gradient(180deg, rgba(7, 10, 22, 0), rgba(7, 10, 22, .96) 26%, rgba(7, 10, 22, 1) 100%) !important;
      }
    }

    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell {
        --mobile-bg: #efe7da;
        --mobile-surface: #fffaf2;
        --mobile-surface-2: #f6efe5;
        --mobile-ink: #211c18;
        --mobile-muted: #6f6257;
        --mobile-line: rgba(92, 74, 56, .14);
        --mobile-teal: #12a99b;
        --mobile-teal-dark: #08756d;
        --mobile-panel-shadow: 0 14px 34px rgba(55, 44, 32, .13);
        background: linear-gradient(180deg, #f2eadf 0%, #e8ddcf 100%) !important;
        color: var(--mobile-ink) !important;
        scrollbar-width: none !important;
      }

      body.android-shell *,
      body.android-shell *::before,
      body.android-shell *::after {
        scrollbar-width: none !important;
        letter-spacing: 0 !important;
      }

      body.android-shell *::-webkit-scrollbar {
        width: 0 !important;
        height: 0 !important;
        display: none !important;
      }

      body.android-shell .app,
      body.android-shell .main,
      body.android-shell .view:not(.hidden) {
        width: 100vw !important;
        max-width: 100vw !important;
        min-width: 0 !important;
        background: transparent !important;
        color: var(--mobile-ink) !important;
        overflow-x: hidden !important;
      }

      body.android-shell .main {
        padding: 7px 7px 0 !important;
      }

      body.android-shell .view:not(.hidden) {
        gap: 10px !important;
        padding-bottom: calc(var(--mobile-service-dock-height, 0px) + 16px) !important;
      }

      body.android-shell .topline,
      body.android-shell .panel,
      body.android-shell .settings-card,
      body.android-shell .section-card,
      body.android-shell .stat,
      body.android-shell .network-card,
      body.android-shell .settings-mini,
      body.android-shell .modal {
        background: var(--mobile-surface) !important;
        color: var(--mobile-ink) !important;
        border: 1px solid var(--mobile-line) !important;
        border-radius: 16px !important;
        box-shadow: var(--mobile-panel-shadow) !important;
        backdrop-filter: none !important;
      }

      body.android-shell .topline {
        padding: 12px 13px !important;
      }

      body.android-shell .topline h2,
      body.android-shell .panel h3,
      body.android-shell .settings-card h3,
      body.android-shell .settings-mini h4,
      body.android-shell .network-card h4,
      body.android-shell .stat strong,
      body.android-shell strong {
        color: var(--mobile-ink) !important;
        text-shadow: none !important;
      }

      body.android-shell .topline p,
      body.android-shell .panel p,
      body.android-shell .settings-card p,
      body.android-shell .settings-mini p,
      body.android-shell .network-card p,
      body.android-shell .stat span,
      body.android-shell .muted,
      body.android-shell small,
      body.android-shell label,
      body.android-shell td,
      body.android-shell th {
        color: var(--mobile-muted) !important;
      }

      body.android-shell .panel-head {
        min-height: 44px !important;
        padding: 12px 13px 7px !important;
        border-bottom: 0 !important;
        background: transparent !important;
      }

      body.android-shell .panel-body {
        padding: 10px 13px 13px !important;
        background: transparent !important;
      }

      body.android-shell .btn,
      body.android-shell button.btn {
        border: 1px solid rgba(92, 74, 56, .16) !important;
        border-radius: 12px !important;
        background: linear-gradient(180deg, #f7efe5, #eadfD1) !important;
        color: #2c241e !important;
        box-shadow: 0 8px 18px rgba(55, 44, 32, .10) !important;
        font-weight: 800 !important;
      }

      body.android-shell .btn.primary,
      body.android-shell button.btn.primary {
        border-color: transparent !important;
        background: linear-gradient(135deg, var(--mobile-teal-dark), var(--mobile-teal)) !important;
        color: #fffdf7 !important;
        box-shadow: 0 12px 26px rgba(18, 169, 155, .22) !important;
      }

      body.android-shell .btn.danger {
        background: linear-gradient(180deg, #f2d9d4, #e9c3bc) !important;
        color: #6b211b !important;
      }

      body.android-shell input,
      body.android-shell select,
      body.android-shell textarea {
        background: #fffdf8 !important;
        color: var(--mobile-ink) !important;
        border: 1px solid rgba(92, 74, 56, .20) !important;
        border-radius: 12px !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.82) !important;
      }

      body.android-shell input::placeholder,
      body.android-shell textarea::placeholder {
        color: #8a7d70 !important;
        opacity: 1 !important;
      }

      body.android-shell .tabs,
      body.android-shell .settings-tabs {
        background: rgba(255, 250, 242, .78) !important;
        border: 1px solid var(--mobile-line) !important;
        box-shadow: none !important;
      }

      body.android-shell .tabs button,
      body.android-shell .settings-tabs button {
        background: transparent !important;
        color: #65594e !important;
        border: 0 !important;
        box-shadow: none !important;
      }

      body.android-shell .tabs button.active,
      body.android-shell .settings-tabs button.active {
        background: #e7f5f2 !important;
        color: #075e57 !important;
        box-shadow: inset 0 0 0 1px rgba(18, 169, 155, .22) !important;
      }

      body.android-shell #view-dashboard:not(.hidden) {
        display: grid !important;
        gap: 10px !important;
        align-content: start !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
      }

      body.android-shell #view-dashboard .dashboard-stats {
        gap: 8px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat {
        min-height: 86px !important;
        padding: 11px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .period-stat {
        min-height: 132px !important;
      }

      body.android-shell #view-dashboard .quick-money-panel {
        position: relative !important;
        z-index: 1 !important;
        min-height: 0 !important;
        margin: 0 0 10px !important;
        overflow: hidden !important;
      }

      body.android-shell #view-dashboard .quick-money-panel .panel-head h3 {
        color: var(--mobile-ink) !important;
        font-size: 16px !important;
      }

      body.android-shell #view-dashboard .quick-money-body {
        display: grid !important;
        grid-template-columns: 1fr !important;
        min-height: 0 !important;
        gap: 9px !important;
        padding: 5px 13px 13px !important;
        color: var(--mobile-ink) !important;
      }

      body.android-shell #view-dashboard .quick-money-body .money-fit {
        color: #0c4f49 !important;
        font-size: 22px !important;
      }

      body.android-shell #view-dashboard .quick-money-body .row-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
      }

      body.android-shell #view-dashboard .dashboard-bottom {
        display: grid !important;
        gap: 10px !important;
        position: relative !important;
        z-index: 0 !important;
        margin-top: 0 !important;
      }

      body.android-shell .mobile-card-table,
      body.android-shell .mobile-card-table tbody {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
      }

      body.android-shell .mobile-card-table tbody {
        display: grid !important;
        gap: 9px !important;
      }

      body.android-shell .mobile-card-table tr,
      body.android-shell #view-dashboard .sales-table.mobile-card-table tr {
        display: grid !important;
        gap: 7px !important;
        padding: 11px !important;
        border: 1px solid var(--mobile-line) !important;
        border-left: 4px solid var(--mobile-teal) !important;
        border-radius: 15px !important;
        background: #fffdf8 !important;
        box-shadow: 0 10px 24px rgba(55, 44, 32, .10) !important;
      }

      body.android-shell .mobile-card-table td,
      body.android-shell #view-dashboard .sales-table.mobile-card-table td {
        display: grid !important;
        grid-template-columns: minmax(84px, 34%) minmax(0, 1fr) !important;
        gap: 8px !important;
        align-items: center !important;
        min-height: 28px !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        color: var(--mobile-ink) !important;
        font-size: 12.5px !important;
      }

      body.android-shell .mobile-card-table td::before,
      body.android-shell #view-dashboard .sales-table.mobile-card-table td::before {
        color: #7c7065 !important;
        font-size: 10.5px !important;
        font-weight: 850 !important;
      }

      body.android-shell .sales-table.mobile-card-table td:nth-child(2),
      body.android-shell .sales-table.mobile-card-table td:nth-child(3),
      body.android-shell .sales-table.mobile-card-table td:nth-child(6) {
        padding: 7px 8px !important;
        border-radius: 11px !important;
        background: var(--mobile-surface-2) !important;
      }

      body.android-shell .sales-table.mobile-card-table td:nth-child(2) {
        color: #5a3516 !important;
        font-weight: 800 !important;
      }

      body.android-shell .sales-table.mobile-card-table td:nth-child(3) {
        color: #075e57 !important;
        font-weight: 800 !important;
      }

      body.android-shell .sales-table.mobile-card-table td:nth-child(6) strong,
      body.android-shell #view-dashboard .sales-table.mobile-card-table td:nth-child(6) strong {
        color: #0c4f49 !important;
        font-size: 15px !important;
      }

      body.android-shell .mobile-card-table .tag,
      body.android-shell .tag {
        border: 1px solid rgba(18, 169, 155, .28) !important;
        background: #e7f5f2 !important;
        color: #075e57 !important;
        box-shadow: none !important;
      }

      body.android-shell .mobile-card-table .tag.red,
      body.android-shell .tag.red {
        border-color: rgba(163, 63, 58, .24) !important;
        background: #f7e3de !important;
        color: #7d2b22 !important;
      }

      body.android-shell .mobile-card-table td:last-child {
        display: block !important;
        margin-top: 2px !important;
      }

      body.android-shell .mobile-card-table td:last-child::before {
        display: none !important;
        content: "" !important;
      }

      body.android-shell .mobile-card-table td:last-child .btn {
        width: 100% !important;
      }

      body.android-shell #view-settings .settings-layout,
      body.android-shell #view-settings .settings-summary,
      body.android-shell #view-settings .settings-tabs-panel,
      body.android-shell #view-settings .settings-profiles-grid,
      body.android-shell #view-settings .network-grid,
      body.android-shell #view-settings .network-metrics,
      body.android-shell #view-settings .settings-mini-grid,
      body.android-shell #view-settings .form-grid {
        display: grid !important;
        grid-template-columns: 1fr !important;
        width: 100% !important;
        max-width: none !important;
        gap: 10px !important;
      }

      body.android-shell #view-settings .network-card,
      body.android-shell #view-settings .settings-mini,
      body.android-shell #view-settings .settings-card,
      body.android-shell #view-settings .panel {
        max-width: none !important;
        background: var(--mobile-surface) !important;
        color: var(--mobile-ink) !important;
      }

      body.android-shell #view-settings table,
      body.android-shell #view-settings tbody,
      body.android-shell #view-settings tr,
      body.android-shell #view-settings td,
      body.android-shell #view-settings th {
        background: transparent !important;
        color: var(--mobile-ink) !important;
        border-color: var(--mobile-line) !important;
      }

      body.android-shell #view-settings table {
        border: 0 !important;
        box-shadow: none !important;
      }

      body.android-shell #view-settings tr {
        border-bottom: 1px solid var(--mobile-line) !important;
      }

      body.android-shell #view-settings tr:last-child {
        border-bottom: 0 !important;
      }

      body.android-shell #view-settings td,
      body.android-shell #view-settings th {
        padding: 9px 0 !important;
      }

      body.android-shell #view-settings td:first-child {
        color: #75685c !important;
      }

      body.android-shell #view-settings td:last-child,
      body.android-shell #view-settings td:last-child strong {
        color: var(--mobile-ink) !important;
      }
    }
    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell,
      body.android-shell .login-screen {
        --phone-bg: #070b12;
        --phone-panel: #121a26;
        --phone-panel-2: #0b111a;
        --phone-card: #101822;
        --phone-field: #070d14;
        --phone-line: rgba(185, 204, 220, .18);
        --phone-text: #f3f7fb;
        --phone-muted: #c2cfda;
        --phone-muted-2: #92a3b3;
        --phone-teal: #16b7a7;
        --phone-teal-dark: #087b72;
        --phone-danger: #f08a8a;
        background:
          radial-gradient(circle at 78% 0%, rgba(26, 183, 167, .16), transparent 30%),
          linear-gradient(180deg, #080c15 0%, #050912 100%) !important;
        color: var(--phone-text) !important;
      }

      body.android-shell .login-card.activation-login-card,
      body.android-shell .activation-purchase-modal,
      body.android-shell .activation-card,
      body.android-shell .activation-shell,
      body.android-shell .first-run,
      body.android-shell .auth-card {
        background: linear-gradient(180deg, rgba(18, 26, 38, .98), rgba(9, 15, 24, .99)) !important;
        color: var(--phone-text) !important;
        border: 1px solid var(--phone-line) !important;
        border-radius: 24px !important;
        box-shadow: 0 22px 48px rgba(0, 0, 0, .36) !important;
      }

      body.android-shell .login-card.activation-login-card {
        width: min(92vw, 430px) !important;
        max-height: calc(100dvh - var(--android-safe-top, 0px) - var(--android-nav-safe, 0px) - 18px) !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        padding: 18px !important;
      }

      body.android-shell .activation-main-panel,
      body.android-shell .activation-side-panel {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
      }

      body.android-shell .activation-heading-copy h2,
      body.android-shell .activation-login-card h2,
      body.android-shell .activation-login-card h3,
      body.android-shell .employee-login-card h3,
      body.android-shell .modal h2,
      body.android-shell .modal h3,
      body.android-shell .modal-head h3,
      body.android-shell .modal-head strong {
        color: var(--phone-text) !important;
        text-shadow: none !important;
      }

      body.android-shell .activation-heading-copy p,
      body.android-shell .activation-login-card p,
      body.android-shell .activation-login-card label,
      body.android-shell .activation-login-card small,
      body.android-shell .activation-login-card span,
      body.android-shell .employee-login-card p,
      body.android-shell .employee-login-card label,
      body.android-shell .employee-login-card .muted,
      body.android-shell .modal p,
      body.android-shell .modal label,
      body.android-shell .modal small,
      body.android-shell .modal span {
        color: var(--phone-muted) !important;
        text-shadow: none !important;
      }

      body.android-shell .activation-login-card strong,
      body.android-shell .activation-main-panel strong,
      body.android-shell .activation-side-panel strong,
      body.android-shell .employee-login-card strong,
      body.android-shell .modal strong {
        color: var(--phone-text) !important;
        text-shadow: none !important;
      }

      body.android-shell .activation-login-card .section-card,
      body.android-shell .activation-login-card .table-notice,
      body.android-shell .activation-main-panel .table-notice,
      body.android-shell .activation-side-panel .section-card,
      body.android-shell .activation-side-panel .employee-login-card,
      body.android-shell .employee-login-card {
        background: linear-gradient(180deg, rgba(13, 20, 30, .98), rgba(7, 13, 20, .98)) !important;
        color: var(--phone-text) !important;
        border: 1px solid var(--phone-line) !important;
        border-radius: 18px !important;
        box-shadow: none !important;
      }

      body.android-shell .activation-main-panel .table-notice,
      body.android-shell .activation-main-panel .table-notice *,
      body.android-shell .activation-side-panel .section-card *,
      body.android-shell .employee-login-card * {
        color: var(--phone-text) !important;
        text-shadow: none !important;
      }

      body.android-shell .activation-login-card input,
      body.android-shell .activation-login-card select,
      body.android-shell .activation-login-card textarea,
      body.android-shell .activation-purchase-modal input,
      body.android-shell .activation-purchase-modal select,
      body.android-shell .activation-purchase-modal textarea,
      body.android-shell .employee-login-card input,
      body.android-shell .modal input,
      body.android-shell .modal select,
      body.android-shell .modal textarea {
        background: var(--phone-field) !important;
        color: var(--phone-text) !important;
        border: 1px solid rgba(185, 204, 220, .22) !important;
        border-radius: 13px !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.03) !important;
        caret-color: var(--phone-teal) !important;
      }

      body.android-shell .activation-login-card input::placeholder,
      body.android-shell .activation-login-card textarea::placeholder,
      body.android-shell .activation-purchase-modal input::placeholder,
      body.android-shell .activation-purchase-modal textarea::placeholder,
      body.android-shell .employee-login-card input::placeholder,
      body.android-shell .modal input::placeholder,
      body.android-shell .modal textarea::placeholder {
        color: var(--phone-muted-2) !important;
        opacity: 1 !important;
      }

      body.android-shell .activation-login-card .btn,
      body.android-shell .activation-actions-grid .btn,
      body.android-shell .activation-main-panel > .btn,
      body.android-shell .activation-side-panel .btn,
      body.android-shell .employee-login-card .btn,
      body.android-shell .modal .btn,
      body.android-shell .btn {
        min-height: 48px !important;
        border-radius: 14px !important;
        background: linear-gradient(180deg, #0b121d, #070d15) !important;
        border: 1px solid rgba(185, 204, 220, .20) !important;
        color: var(--phone-text) !important;
        box-shadow: none !important;
        text-shadow: none !important;
      }

      body.android-shell .activation-login-card .btn.primary,
      body.android-shell .activation-actions-grid .btn.primary,
      body.android-shell .employee-login-card .btn.primary,
      body.android-shell .modal .btn.primary,
      body.android-shell .btn.primary {
        background: linear-gradient(135deg, var(--phone-teal-dark), var(--phone-teal)) !important;
        border-color: rgba(22, 183, 167, .45) !important;
        color: #ffffff !important;
        box-shadow: 0 12px 24px rgba(22, 183, 167, .22) !important;
      }

      body.android-shell .modal,
      body.android-shell .child-modal {
        width: min(92vw, 430px) !important;
        min-height: 0 !important;
        height: auto !important;
        max-height: calc(100dvh - var(--android-safe-top, 0px) - var(--android-nav-safe, 0px) - 22px) !important;
        overflow: hidden auto !important;
        background: linear-gradient(180deg, rgba(18, 26, 38, .98), rgba(8, 14, 23, .99)) !important;
        color: var(--phone-text) !important;
        border: 1px solid var(--phone-line) !important;
        border-radius: 24px !important;
        box-shadow: 0 22px 50px rgba(0,0,0,.45) !important;
      }

      body.android-shell .modal-head,
      body.android-shell .child-modal .modal-head {
        background: linear-gradient(180deg, #172334, #121b29) !important;
        border-bottom: 1px solid var(--phone-line) !important;
        color: var(--phone-text) !important;
      }

      body.android-shell .modal .panel-body,
      body.android-shell .child-modal .panel-body,
      body.android-shell .modal-body {
        min-height: 0 !important;
        background: linear-gradient(180deg, rgba(15, 23, 34, .98), rgba(9, 15, 24, .98)) !important;
        color: var(--phone-text) !important;
        padding: 16px !important;
      }

      body.android-shell .modal .panel-body > p,
      body.android-shell .modal .panel-body > div,
      body.android-shell .modal .panel-body > label,
      body.android-shell .modal .panel-body .muted,
      body.android-shell .child-modal .panel-body > p,
      body.android-shell .child-modal .panel-body > div,
      body.android-shell .child-modal .panel-body > label,
      body.android-shell .child-modal .panel-body .muted {
        color: var(--phone-muted) !important;
        text-shadow: none !important;
      }

      body.android-shell .modal .table-notice,
      body.android-shell .modal .section-card,
      body.android-shell .activation-purchase-modal .table-notice,
      body.android-shell .activation-purchase-modal .settings-mini,
      body.android-shell .purchase-quote {
        background: linear-gradient(180deg, rgba(9, 15, 24, .98), rgba(6, 11, 18, .98)) !important;
        color: var(--phone-text) !important;
        border: 1px solid var(--phone-line) !important;
        border-radius: 16px !important;
        box-shadow: none !important;
      }

      body.android-shell .modal .table-notice *,
      body.android-shell .modal .section-card *,
      body.android-shell .activation-purchase-modal .table-notice *,
      body.android-shell .activation-purchase-modal .settings-mini *,
      body.android-shell .purchase-quote * {
        color: var(--phone-text) !important;
        text-shadow: none !important;
      }

      body.android-shell .modal-head .btn.small,
      body.android-shell .modal .modal-head .btn.small,
      body.android-shell [data-action="modal-close"] {
        min-width: 48px !important;
        width: 48px !important;
        height: 48px !important;
        border-radius: 14px !important;
        background: linear-gradient(180deg, #281918, #1a1112) !important;
        border-color: rgba(240, 138, 138, .38) !important;
        color: #fff6f6 !important;
      }

      body.android-shell .activation-purchase-actions,
      body.android-shell .modal .activation-purchase-actions {
        background: linear-gradient(180deg, rgba(18, 26, 38, .98), rgba(7, 13, 20, .99)) !important;
        border: 1px solid var(--phone-line) !important;
        border-radius: 18px !important;
        box-shadow: 0 -8px 22px rgba(0, 0, 0, .30) !important;
      }

      body.android-shell .app,
      body.android-shell .main,
      body.android-shell .view:not(.hidden) {
        background: transparent !important;
        color: var(--phone-text) !important;
      }

      body.android-shell .topline,
      body.android-shell .panel,
      body.android-shell .settings-card,
      body.android-shell .section-card,
      body.android-shell .stat,
      body.android-shell .network-card,
      body.android-shell .settings-mini,
      body.android-shell .table-wrap,
      body.android-shell table,
      body.android-shell .mobile-card-table tr {
        background: linear-gradient(180deg, rgba(18, 26, 38, .96), rgba(9, 15, 24, .98)) !important;
        color: var(--phone-text) !important;
        border: 1px solid var(--phone-line) !important;
        border-radius: 18px !important;
        box-shadow: 0 12px 28px rgba(0, 0, 0, .22) !important;
      }

      body.android-shell .panel-head,
      body.android-shell .topline {
        border-bottom-color: var(--phone-line) !important;
      }

      body.android-shell .topline h2,
      body.android-shell .topline h3,
      body.android-shell .panel h3,
      body.android-shell .panel h4,
      body.android-shell .settings-card h3,
      body.android-shell .settings-card h4,
      body.android-shell .settings-mini h4,
      body.android-shell .network-card h4,
      body.android-shell .stat strong,
      body.android-shell td strong,
      body.android-shell th,
      body.android-shell strong {
        color: var(--phone-text) !important;
        text-shadow: none !important;
      }

      body.android-shell .topline p,
      body.android-shell .panel p,
      body.android-shell .settings-card p,
      body.android-shell .settings-mini p,
      body.android-shell .network-card p,
      body.android-shell .stat span,
      body.android-shell td,
      body.android-shell label,
      body.android-shell small,
      body.android-shell .muted {
        color: var(--phone-muted) !important;
        text-shadow: none !important;
      }

      body.android-shell #view-settings table,
      body.android-shell #view-settings tbody,
      body.android-shell #view-settings tr,
      body.android-shell #view-settings td,
      body.android-shell #view-settings th,
      body.android-shell .mobile-card-table,
      body.android-shell .mobile-card-table tbody,
      body.android-shell .mobile-card-table td {
        background: transparent !important;
        color: var(--phone-text) !important;
        border-color: var(--phone-line) !important;
      }

      body.android-shell .mobile-card-table td::before,
      body.android-shell #view-settings td:first-child {
        color: var(--phone-muted-2) !important;
      }

      body.android-shell .tabs,
      body.android-shell .settings-tabs {
        background: rgba(8, 14, 23, .92) !important;
        border: 1px solid var(--phone-line) !important;
        border-radius: 16px !important;
        box-shadow: none !important;
      }

      body.android-shell .tabs button,
      body.android-shell .settings-tabs button {
        background: transparent !important;
        color: var(--phone-muted) !important;
        border: 0 !important;
        box-shadow: none !important;
      }

      body.android-shell .tabs button.active,
      body.android-shell .settings-tabs button.active {
        background: rgba(22, 183, 167, .14) !important;
        color: #dffdf8 !important;
        box-shadow: inset 0 0 0 1px rgba(22, 183, 167, .32) !important;
      }

      body.android-shell .tag,
      body.android-shell .status,
      body.android-shell .integration-status {
        background: rgba(22, 183, 167, .12) !important;
        color: #dffdf8 !important;
        border: 1px solid rgba(22, 183, 167, .28) !important;
        box-shadow: none !important;
      }

      body.android-shell .tag.red,
      body.android-shell .status.red {
        background: rgba(240, 138, 138, .12) !important;
        color: #ffdede !important;
        border-color: rgba(240, 138, 138, .28) !important;
      }
    }

    @media (orientation: landscape) and (min-width: 900px) and (pointer: coarse) {
      body.android-shell,
      body.android-shell .login-screen {
        --tablet-bg: #070b12;
        --tablet-panel: #111a26;
        --tablet-panel-2: #0b111a;
        --tablet-field: #f8f4ec;
        --tablet-field-border: rgba(92, 80, 68, .18);
        --tablet-line: rgba(201, 214, 226, .18);
        --tablet-text: #f5f8fb;
        --tablet-muted: #cbd5df;
        --tablet-soft: #9fb0bd;
        --tablet-dark-text: #221c17;
        --tablet-dark-muted: #5f5448;
        --tablet-teal: #16b7a7;
        --tablet-teal-dark: #087b72;
        background:
          radial-gradient(circle at 72% 12%, rgba(22, 183, 167, .12), transparent 34%),
          linear-gradient(180deg, #090e17 0%, #050912 100%) !important;
        color: var(--tablet-text) !important;
      }

      body.android-shell .login-card.activation-login-card {
        width: min(82vw, 1440px) !important;
        min-height: auto !important;
        max-height: calc(100dvh - 112px) !important;
        padding: clamp(28px, 3vw, 48px) !important;
        display: grid !important;
        grid-template-columns: minmax(400px, .9fr) minmax(440px, 1fr) !important;
        gap: clamp(28px, 4vw, 64px) !important;
        align-items: center !important;
        overflow: auto !important;
        background: linear-gradient(180deg, rgba(18, 26, 38, .98), rgba(9, 15, 24, .99)) !important;
        border: 1px solid var(--tablet-line) !important;
        border-radius: 28px !important;
        box-shadow: 0 28px 72px rgba(0, 0, 0, .42) !important;
        color: var(--tablet-text) !important;
      }

      body.android-shell .activation-main-panel,
      body.android-shell .activation-side-panel {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        min-width: 0 !important;
      }

      body.android-shell .activation-heading-copy h2,
      body.android-shell .activation-login-card h2,
      body.android-shell .activation-login-card h3,
      body.android-shell .employee-login-card h3,
      body.android-shell .modal-head h3,
      body.android-shell .modal h2,
      body.android-shell .modal h3 {
        color: var(--tablet-text) !important;
        text-shadow: none !important;
      }

      body.android-shell .activation-heading-copy p,
      body.android-shell .activation-login-card p,
      body.android-shell .activation-login-card label,
      body.android-shell .activation-login-card small,
      body.android-shell .activation-login-card span,
      body.android-shell .employee-login-card p,
      body.android-shell .employee-login-card label,
      body.android-shell .employee-login-card .muted,
      body.android-shell .modal p,
      body.android-shell .modal label,
      body.android-shell .modal small,
      body.android-shell .modal span,
      body.android-shell .modal .muted {
        color: var(--tablet-muted) !important;
        text-shadow: none !important;
      }

      body.android-shell .activation-login-card strong,
      body.android-shell .activation-main-panel strong,
      body.android-shell .activation-side-panel strong,
      body.android-shell .employee-login-card strong,
      body.android-shell .modal strong {
        color: var(--tablet-text) !important;
        text-shadow: none !important;
      }

      body.android-shell .activation-login-card .section-card,
      body.android-shell .activation-login-card .table-notice,
      body.android-shell .activation-main-panel .table-notice,
      body.android-shell .activation-side-panel .section-card,
      body.android-shell .activation-side-panel .employee-login-card,
      body.android-shell .employee-login-card {
        background: linear-gradient(180deg, rgba(18, 28, 44, .98), rgba(8, 15, 26, .99)) !important;
        border: 1px solid var(--tablet-line) !important;
        border-radius: 22px !important;
        box-shadow: 0 14px 34px rgba(0, 0, 0, .18) !important;
        color: var(--tablet-text) !important;
      }

      body.android-shell .activation-main-panel .table-notice,
      body.android-shell .activation-main-panel .table-notice *,
      body.android-shell .activation-side-panel .section-card *,
      body.android-shell .employee-login-card *,
      body.android-shell .activation-login-card .section-card *,
      body.android-shell .activation-login-card .table-notice * {
        color: var(--tablet-text) !important;
        text-shadow: none !important;
      }

      body.android-shell .activation-login-card input,
      body.android-shell .activation-login-card select,
      body.android-shell .activation-login-card textarea,
      body.android-shell .activation-purchase-modal input,
      body.android-shell .activation-purchase-modal select,
      body.android-shell .activation-purchase-modal textarea,
      body.android-shell .employee-login-card input,
      body.android-shell .modal input,
      body.android-shell .modal select,
      body.android-shell .modal textarea {
        background: var(--tablet-field) !important;
        color: var(--tablet-dark-text) !important;
        border: 1px solid rgba(92, 80, 68, .26) !important;
        border-radius: 14px !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72) !important;
        caret-color: var(--tablet-teal-dark) !important;
      }

      body.android-shell .activation-login-card input::placeholder,
      body.android-shell .activation-login-card textarea::placeholder,
      body.android-shell .activation-purchase-modal input::placeholder,
      body.android-shell .activation-purchase-modal textarea::placeholder,
      body.android-shell .employee-login-card input::placeholder,
      body.android-shell .modal input::placeholder,
      body.android-shell .modal textarea::placeholder {
        color: #786d60 !important;
        opacity: 1 !important;
      }

      body.android-shell .activation-login-card .btn,
      body.android-shell .activation-actions-grid .btn,
      body.android-shell .activation-main-panel > .btn,
      body.android-shell .activation-side-panel .btn,
      body.android-shell .employee-login-card .btn,
      body.android-shell .modal .btn,
      body.android-shell .btn {
        min-height: 54px !important;
        border-radius: 16px !important;
        background: linear-gradient(180deg, #efe5d8, #ded1c0) !important;
        border: 1px solid rgba(84, 70, 56, .22) !important;
        color: var(--tablet-dark-text) !important;
        box-shadow: 0 10px 22px rgba(0, 0, 0, .18) !important;
        text-shadow: none !important;
      }

      body.android-shell .activation-login-card .btn.primary,
      body.android-shell .activation-actions-grid .btn.primary,
      body.android-shell .employee-login-card .btn.primary,
      body.android-shell .modal .btn.primary,
      body.android-shell .btn.primary {
        background: linear-gradient(135deg, var(--tablet-teal-dark), var(--tablet-teal)) !important;
        border-color: rgba(22, 183, 167, .45) !important;
        color: #ffffff !important;
        box-shadow: 0 14px 30px rgba(22, 183, 167, .24) !important;
      }

      body.android-shell .modal-backdrop,
      body.android-shell .modal-backdrop.child-modal-backdrop {
        padding: clamp(32px, 5vw, 72px) !important;
        align-items: center !important;
        background: rgba(3, 7, 12, .72) !important;
        backdrop-filter: blur(8px) !important;
      }

      body.android-shell .modal,
      body.android-shell .child-modal {
        width: min(64vw, 1120px) !important;
        min-height: 0 !important;
        height: auto !important;
        max-height: calc(100dvh - 120px) !important;
        overflow: hidden !important;
        background: linear-gradient(180deg, rgba(18, 26, 38, .99), rgba(8, 14, 23, .99)) !important;
        border: 1px solid var(--tablet-line) !important;
        border-radius: 24px !important;
        box-shadow: 0 32px 80px rgba(0, 0, 0, .48) !important;
        color: var(--tablet-text) !important;
      }

      body.android-shell .modal-head,
      body.android-shell .child-modal .modal-head {
        min-height: 86px !important;
        padding: 18px 24px !important;
        background: linear-gradient(180deg, #162334, #101925) !important;
        border-bottom: 1px solid var(--tablet-line) !important;
        color: var(--tablet-text) !important;
      }

      body.android-shell .modal .panel-body,
      body.android-shell .child-modal .panel-body,
      body.android-shell .modal-body {
        max-height: calc(100dvh - 220px) !important;
        overflow: auto !important;
        padding: 24px !important;
        background: linear-gradient(180deg, rgba(12, 19, 29, .98), rgba(8, 13, 21, .98)) !important;
        color: var(--tablet-text) !important;
      }

      body.android-shell .modal .table-notice,
      body.android-shell .modal .section-card,
      body.android-shell .activation-purchase-modal .table-notice,
      body.android-shell .activation-purchase-modal .settings-mini,
      body.android-shell .purchase-quote {
        background: linear-gradient(180deg, rgba(18, 28, 44, .98), rgba(8, 15, 26, .99)) !important;
        border: 1px solid var(--tablet-line) !important;
        border-radius: 18px !important;
        color: var(--tablet-text) !important;
        box-shadow: none !important;
      }

      body.android-shell .modal .table-notice *,
      body.android-shell .modal .section-card *,
      body.android-shell .activation-purchase-modal .table-notice *,
      body.android-shell .activation-purchase-modal .settings-mini *,
      body.android-shell .purchase-quote * {
        color: var(--tablet-text) !important;
        text-shadow: none !important;
      }

      body.android-shell .modal-head .btn.small,
      body.android-shell .modal .modal-head .btn.small,
      body.android-shell [data-action="modal-close"] {
        min-width: 54px !important;
        width: 54px !important;
        height: 54px !important;
        border-radius: 16px !important;
        background: linear-gradient(180deg, #1a2638, #0c1421) !important;
        border-color: rgba(132, 145, 168, .3) !important;
        color: #f4f6fa !important;
        box-shadow: none !important;
      }

      body.android-shell .activation-purchase-modal {
        width: min(82vw, 1480px) !important;
        max-width: calc(100vw - 96px) !important;
      }

      body.android-shell .activation-qr-modal {
        width: min(64vw, 1120px) !important;
      }

      body.android-shell .activation-qr-modal .panel-body {
        overflow-x: hidden !important;
      }

      body.android-shell .activation-qr-large,
      body.android-shell .activation-qr-large img {
        max-width: min(100%, 620px) !important;
        box-sizing: border-box !important;
      }

      body.android-shell .activation-purchase-modal .panel-body {
        overflow-x: hidden !important;
        padding-inline: 28px !important;
      }

      body.android-shell .activation-purchase-modal .panel-body > *,
      body.android-shell .activation-purchase-modal form,
      body.android-shell .activation-purchase-modal label,
      body.android-shell .activation-purchase-modal input,
      body.android-shell .activation-purchase-modal select,
      body.android-shell .activation-purchase-modal textarea,
      body.android-shell .activation-purchase-modal .table-notice,
      body.android-shell .activation-purchase-modal .section-card,
      body.android-shell .activation-purchase-modal .settings-mini,
      body.android-shell .activation-purchase-modal .purchase-quote {
        max-width: 100% !important;
        box-sizing: border-box !important;
      }

      body.android-shell .activation-purchase-actions,
      body.android-shell .modal .activation-purchase-actions {
        position: sticky !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 14px !important;
        align-items: center !important;
        justify-content: flex-start !important;
        max-width: 100% !important;
        padding: 14px !important;
        background: linear-gradient(180deg, rgba(18, 26, 38, .98), rgba(8, 14, 23, .99)) !important;
        border: 1px solid var(--tablet-line) !important;
        border-radius: 20px !important;
        box-shadow: 0 -10px 26px rgba(0, 0, 0, .34) !important;
      }

      body.android-shell .activation-purchase-actions .btn,
      body.android-shell .modal .activation-purchase-actions .btn {
        width: auto !important;
        min-width: 220px !important;
        max-width: 320px !important;
        padding-inline: 24px !important;
        white-space: nowrap !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
      }

      body.android-shell ::-webkit-scrollbar {
        width: 8px !important;
        height: 8px !important;
      }

      body.android-shell ::-webkit-scrollbar-track {
        background: transparent !important;
      }

      body.android-shell ::-webkit-scrollbar-thumb {
        background: rgba(177, 197, 211, .34) !important;
        border-radius: 999px !important;
      }
    }

    @media (orientation: portrait) and (min-width: 681px) and (max-width: 1100px) and (pointer: coarse) {
      body.android-shell,
      body.android-shell .login-screen {
        --tablet-port-bg: #070b12;
        --tablet-port-panel: #101927;
        --tablet-port-panel-2: #0a111b;
        --tablet-port-field: #080f18;
        --tablet-port-line: rgba(201, 214, 226, .18);
        --tablet-port-text: #f5f8fb;
        --tablet-port-muted: #cbd5df;
        --tablet-port-soft: #9fb0bd;
        --tablet-port-teal: #16b7a7;
        --tablet-port-teal-dark: #087b72;
        background:
          radial-gradient(circle at 50% 0%, rgba(22, 183, 167, .12), transparent 34%),
          linear-gradient(180deg, #090e17 0%, #050912 100%) !important;
        color: var(--tablet-port-text) !important;
      }

      body.android-shell .login-card.activation-login-card {
        width: min(90vw, 820px) !important;
        max-height: calc(100dvh - var(--android-safe-top, 0px) - var(--android-nav-safe, 0px) - 42px) !important;
        min-height: auto !important;
        display: block !important;
        padding: clamp(22px, 4vw, 38px) !important;
        overflow: auto !important;
        background: linear-gradient(180deg, rgba(18, 26, 38, .98), rgba(8, 14, 23, .99)) !important;
        border: 1px solid var(--tablet-port-line) !important;
        border-radius: 28px !important;
        box-shadow: 0 28px 72px rgba(0, 0, 0, .42) !important;
        color: var(--tablet-port-text) !important;
      }

      body.android-shell .activation-main-panel,
      body.android-shell .activation-side-panel {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        min-width: 0 !important;
      }

      body.android-shell .activation-actions-grid {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 14px !important;
        margin-top: 18px !important;
        margin-bottom: 24px !important;
      }

      body.android-shell .activation-actions-grid .btn:first-child {
        grid-column: auto !important;
      }

      body.android-shell .activation-actions-grid .btn,
      body.android-shell .activation-actions-grid .btn.primary {
        width: 100% !important;
        min-height: 74px !important;
        grid-column: auto !important;
      }

      body.android-shell .activation-heading-copy h2,
      body.android-shell .activation-login-card h2,
      body.android-shell .activation-login-card h3,
      body.android-shell .employee-login-card h3,
      body.android-shell .modal-head h3,
      body.android-shell .modal h2,
      body.android-shell .modal h3,
      body.android-shell .topline h2,
      body.android-shell .panel h3,
      body.android-shell .panel h4,
      body.android-shell .settings-card h3,
      body.android-shell .settings-card h4 {
        color: var(--tablet-port-text) !important;
        text-shadow: none !important;
      }

      body.android-shell .activation-heading-copy p,
      body.android-shell .activation-login-card p,
      body.android-shell .activation-login-card label,
      body.android-shell .activation-login-card small,
      body.android-shell .activation-login-card span,
      body.android-shell .employee-login-card p,
      body.android-shell .employee-login-card label,
      body.android-shell .employee-login-card .muted,
      body.android-shell .modal p,
      body.android-shell .modal label,
      body.android-shell .modal small,
      body.android-shell .modal span,
      body.android-shell .modal .muted,
      body.android-shell .panel p,
      body.android-shell td,
      body.android-shell label,
      body.android-shell small,
      body.android-shell .muted {
        color: var(--tablet-port-muted) !important;
        text-shadow: none !important;
      }

      body.android-shell .activation-login-card strong,
      body.android-shell .activation-main-panel strong,
      body.android-shell .activation-side-panel strong,
      body.android-shell .employee-login-card strong,
      body.android-shell .modal strong,
      body.android-shell strong,
      body.android-shell th {
        color: var(--tablet-port-text) !important;
        text-shadow: none !important;
      }

      body.android-shell .activation-login-card .section-card,
      body.android-shell .activation-login-card .table-notice,
      body.android-shell .activation-main-panel .table-notice,
      body.android-shell .activation-side-panel .section-card,
      body.android-shell .activation-side-panel .employee-login-card,
      body.android-shell .employee-login-card,
      body.android-shell .topline,
      body.android-shell .panel,
      body.android-shell .settings-card,
      body.android-shell .section-card,
      body.android-shell .stat,
      body.android-shell .network-card,
      body.android-shell .settings-mini,
      body.android-shell .table-wrap,
      body.android-shell table,
      body.android-shell .mobile-card-table tr {
        background: linear-gradient(180deg, rgba(18, 26, 38, .96), rgba(9, 15, 24, .98)) !important;
        color: var(--tablet-port-text) !important;
        border: 1px solid var(--tablet-port-line) !important;
        border-radius: 20px !important;
        box-shadow: 0 14px 32px rgba(0, 0, 0, .24) !important;
      }

      body.android-shell .activation-login-card input,
      body.android-shell .activation-login-card select,
      body.android-shell .activation-login-card textarea,
      body.android-shell .activation-purchase-modal input,
      body.android-shell .activation-purchase-modal select,
      body.android-shell .activation-purchase-modal textarea,
      body.android-shell .employee-login-card input,
      body.android-shell .modal input,
      body.android-shell .modal select,
      body.android-shell .modal textarea,
      body.android-shell input,
      body.android-shell select,
      body.android-shell textarea {
        background: var(--tablet-port-field) !important;
        color: var(--tablet-port-text) !important;
        border: 1px solid rgba(201, 214, 226, .24) !important;
        border-radius: 14px !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
        caret-color: var(--tablet-port-teal) !important;
      }

      body.android-shell input::placeholder,
      body.android-shell textarea::placeholder {
        color: var(--tablet-port-soft) !important;
        opacity: 1 !important;
      }

      body.android-shell .activation-login-card .btn,
      body.android-shell .activation-actions-grid .btn,
      body.android-shell .activation-main-panel > .btn,
      body.android-shell .activation-side-panel .btn,
      body.android-shell .employee-login-card .btn,
      body.android-shell .modal .btn,
      body.android-shell .btn {
        min-height: 52px !important;
        border-radius: 16px !important;
        background: linear-gradient(180deg, #111b29, #0a111b) !important;
        border: 1px solid rgba(201, 214, 226, .20) !important;
        color: var(--tablet-port-text) !important;
        box-shadow: none !important;
        text-shadow: none !important;
        white-space: normal !important;
      }

      body.android-shell .activation-login-card .btn.primary,
      body.android-shell .activation-actions-grid .btn.primary,
      body.android-shell .employee-login-card .btn.primary,
      body.android-shell .modal .btn.primary,
      body.android-shell .btn.primary {
        background: linear-gradient(135deg, var(--tablet-port-teal-dark), var(--tablet-port-teal)) !important;
        border-color: rgba(22, 183, 167, .45) !important;
        color: #ffffff !important;
        box-shadow: 0 14px 30px rgba(22, 183, 167, .22) !important;
      }

      body.android-shell .modal-backdrop,
      body.android-shell .modal-backdrop.child-modal-backdrop {
        padding: calc(var(--android-safe-top, 0px) + 24px) 24px calc(var(--android-nav-safe, 0px) + 24px) !important;
        align-items: center !important;
        justify-content: center !important;
        background: rgba(3, 7, 12, .72) !important;
        backdrop-filter: blur(8px) !important;
      }

      body.android-shell .modal,
      body.android-shell .child-modal {
        width: min(92vw, 920px) !important;
        min-height: 0 !important;
        height: auto !important;
        max-height: calc(100dvh - var(--android-safe-top, 0px) - var(--android-nav-safe, 0px) - 56px) !important;
        overflow: hidden !important;
        background: linear-gradient(180deg, rgba(18, 26, 38, .99), rgba(8, 14, 23, .99)) !important;
        border: 1px solid var(--tablet-port-line) !important;
        border-radius: 24px !important;
        box-shadow: 0 32px 80px rgba(0, 0, 0, .48) !important;
        color: var(--tablet-port-text) !important;
        margin: auto !important;
      }

      body.android-shell .modal-head,
      body.android-shell .child-modal .modal-head {
        min-height: 76px !important;
        padding: 16px 22px !important;
        background: linear-gradient(180deg, #162334, #101925) !important;
        border-bottom: 1px solid var(--tablet-port-line) !important;
        color: var(--tablet-port-text) !important;
      }

      body.android-shell .modal .panel-body,
      body.android-shell .child-modal .panel-body,
      body.android-shell .modal-body {
        max-height: calc(100dvh - var(--android-safe-top, 0px) - var(--android-nav-safe, 0px) - 156px) !important;
        overflow: auto !important;
        overflow-x: hidden !important;
        padding: 22px !important;
        background: linear-gradient(180deg, rgba(12, 19, 29, .98), rgba(8, 13, 21, .98)) !important;
        color: var(--tablet-port-text) !important;
      }

      body.android-shell .modal .table-notice,
      body.android-shell .modal .section-card,
      body.android-shell .activation-purchase-modal .table-notice,
      body.android-shell .activation-purchase-modal .settings-mini,
      body.android-shell .purchase-quote {
        background: linear-gradient(180deg, rgba(18, 26, 38, .96), rgba(9, 15, 24, .98)) !important;
        border: 1px solid var(--tablet-port-line) !important;
        border-radius: 18px !important;
        color: var(--tablet-port-text) !important;
        box-shadow: none !important;
      }

      body.android-shell .modal-head .btn.small,
      body.android-shell .modal .modal-head .btn.small,
      body.android-shell [data-action="modal-close"] {
        min-width: 52px !important;
        width: 52px !important;
        height: 52px !important;
        border-radius: 16px !important;
        background: linear-gradient(180deg, #1a2638, #0c1421) !important;
        border-color: rgba(132, 145, 168, .3) !important;
        color: #f4f6fa !important;
        box-shadow: none !important;
      }

      body.android-shell .activation-purchase-modal,
      body.android-shell .activation-qr-modal {
        width: min(92vw, 920px) !important;
      }

      body.android-shell .activation-purchase-modal .panel-body > *,
      body.android-shell .activation-purchase-modal form,
      body.android-shell .activation-purchase-modal label,
      body.android-shell .activation-purchase-modal input,
      body.android-shell .activation-purchase-modal select,
      body.android-shell .activation-purchase-modal textarea,
      body.android-shell .activation-purchase-modal .table-notice,
      body.android-shell .activation-purchase-modal .section-card,
      body.android-shell .activation-purchase-modal .settings-mini,
      body.android-shell .activation-purchase-modal .purchase-quote {
        max-width: 100% !important;
        box-sizing: border-box !important;
      }

      body.android-shell .activation-purchase-actions,
      body.android-shell .modal .activation-purchase-actions {
        position: static !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        flex-wrap: nowrap !important;
        gap: 12px !important;
        align-items: stretch !important;
        max-width: 100% !important;
        margin-top: 22px !important;
        margin-bottom: 0 !important;
        padding: 12px !important;
        background: linear-gradient(180deg, rgba(18, 26, 38, .98), rgba(8, 14, 23, .99)) !important;
        border: 1px solid var(--tablet-port-line) !important;
        border-radius: 18px !important;
        box-shadow: none !important;
      }

      body.android-shell .activation-purchase-actions .btn,
      body.android-shell .modal .activation-purchase-actions .btn {
        flex: none !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 72px !important;
        white-space: nowrap !important;
        word-break: normal !important;
      }

      body.android-shell .activation-qr-large,
      body.android-shell .activation-qr-large img {
        max-width: min(100%, 560px) !important;
        box-sizing: border-box !important;
      }

      body.android-shell .sidebar {
        width: min(30vw, 280px) !important;
        min-width: 236px !important;
      }

      body.android-shell .main {
        min-width: 0 !important;
        overflow-x: hidden !important;
      }

      body.android-shell .view:not(.hidden) {
        min-width: 0 !important;
        overflow-x: hidden !important;
      }

      body.android-shell .shift-state-line {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        min-width: 0 !important;
      }

      body.android-shell .shift-lamp,
      body.android-shell .shift-lamp.open {
        display: inline-block !important;
        flex: 0 0 10px !important;
        width: 10px !important;
        min-width: 10px !important;
        max-width: 10px !important;
        height: 10px !important;
        min-height: 10px !important;
        max-height: 10px !important;
        padding: 0 !important;
        aspect-ratio: 1 / 1 !important;
        border-radius: 50% !important;
        background: #48d88f !important;
        border: 0 !important;
        box-shadow: 0 0 0 4px rgba(72, 216, 143, .12), 0 0 14px rgba(72, 216, 143, .62) !important;
        transform-origin: center !important;
      }

      body.android-shell .shift-lamp:not(.open) {
        background: #7e898b !important;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22) !important;
        animation: none !important;
      }

      body.android-shell .shift-lamp.open {
        animation: tabletPortraitLampPulse 2.8s ease-in-out infinite !important;
      }

      @keyframes tabletPortraitLampPulse {
        0%, 100% {
          transform: scale(.96);
          opacity: .88;
          border-radius: 50%;
        }
        50% {
          transform: scale(1.1);
          opacity: 1;
          border-radius: 50%;
        }
      }

      body.android-shell ::-webkit-scrollbar {
        width: 7px !important;
        height: 0 !important;
      }

      body.android-shell ::-webkit-scrollbar-track {
        background: transparent !important;
      }

      body.android-shell ::-webkit-scrollbar-thumb {
        background: rgba(177, 197, 211, .32) !important;
        border-radius: 999px !important;
      }
    }
    body.windows-shell {
      color-scheme: dark;
      --bg: #071116;
      --surface: #111c23;
      --surface-2: #17262e;
      --ink: #f3f8f6;
      --muted: #b7c6c2;
      --line: rgba(229, 238, 235, .14);
      --primary: #14b8a6;
      --primary-2: #0f766e;
      --accent: #e08072;
      --warn: #f3bf5c;
      --ok: #51d18f;
      --shadow: 0 18px 48px rgba(0, 0, 0, .34);
      --sidebar-bg: #12242b;
      --workspace-bg: #071116;
      --button-gradient: linear-gradient(135deg, #0f766e, #14b8a6);
      background:
        radial-gradient(circle at 12% -6%, rgba(20, 184, 166, .14), transparent 32%),
        radial-gradient(circle at 88% 4%, rgba(224, 128, 114, .08), transparent 28%),
        linear-gradient(135deg, #071116 0%, #0a141a 52%, #060b10 100%) !important;
      color: var(--ink) !important;
    }

    body.windows-shell,
    body.windows-shell * {
      scrollbar-width: thin;
      scrollbar-color: rgba(169, 191, 187, .38) transparent;
    }

    body.windows-shell ::-webkit-scrollbar {
      width: 9px !important;
      height: 9px !important;
    }

    body.windows-shell ::-webkit-scrollbar-track {
      background: transparent !important;
      margin: 10px !important;
    }

    body.windows-shell ::-webkit-scrollbar-thumb {
      background: rgba(169, 191, 187, .38) !important;
      border: 2px solid transparent !important;
      border-radius: 999px !important;
      background-clip: content-box !important;
    }

    body.windows-shell .login-screen {
      padding: 42px !important;
      background:
        radial-gradient(circle at 16% 8%, rgba(20, 184, 166, .16), transparent 30%),
        radial-gradient(circle at 84% 4%, rgba(224, 128, 114, .10), transparent 28%),
        linear-gradient(135deg, #071116 0%, #0a141a 50%, #05090d 100%) !important;
    }

    body.windows-shell .login-card,
    body.windows-shell .login-card.activation-login-card {
      width: min(1280px, calc(100vw - 96px)) !important;
      max-width: 1280px !important;
      max-height: calc(100dvh - 112px) !important;
      overflow: auto !important;
      padding: clamp(28px, 2.6vw, 44px) !important;
      border: 1px solid rgba(229, 238, 235, .14) !important;
      border-radius: 24px !important;
      background:
        linear-gradient(180deg, rgba(21, 33, 40, .98), rgba(12, 20, 26, .98)) !important;
      box-shadow: 0 32px 82px rgba(0, 0, 0, .46) !important;
      color: var(--ink) !important;
    }

    body.windows-shell .login-card.activation-login-card {
      display: grid !important;
      grid-template-columns: minmax(0, 1.12fr) minmax(380px, .88fr) !important;
      grid-template-areas:
        "heading heading"
        "main side" !important;
      gap: 28px 34px !important;
      align-items: stretch !important;
      min-height: min(650px, calc(100dvh - 150px)) !important;
    }

    body.windows-shell .activation-heading {
      grid-area: heading !important;
      align-items: center !important;
      gap: 18px !important;
      margin: 0 !important;
    }

    body.windows-shell .activation-heading-copy h2,
    body.windows-shell .login-card h2,
    body.windows-shell .login-card h3,
    body.windows-shell .employee-login-card h3,
    body.windows-shell .modal h2,
    body.windows-shell .modal h3,
    body.windows-shell .topline h2,
    body.windows-shell .panel h3,
    body.windows-shell .panel h4,
    body.windows-shell .settings-card h3,
    body.windows-shell .settings-card h4 {
      color: #f7fbfa !important;
      text-shadow: none !important;
    }

    body.windows-shell .activation-heading-copy p,
    body.windows-shell .login-card p,
    body.windows-shell .login-card label,
    body.windows-shell .login-card span,
    body.windows-shell .login-card small,
    body.windows-shell .employee-login-card p,
    body.windows-shell .employee-login-card label,
    body.windows-shell .employee-login-card .muted,
    body.windows-shell .modal p,
    body.windows-shell .modal label,
    body.windows-shell .modal small,
    body.windows-shell .modal span,
    body.windows-shell .modal .muted,
    body.windows-shell .panel p,
    body.windows-shell td,
    body.windows-shell label,
    body.windows-shell small,
    body.windows-shell .muted {
      color: var(--muted) !important;
      text-shadow: none !important;
    }

    body.windows-shell strong,
    body.windows-shell th,
    body.windows-shell .login-card strong,
    body.windows-shell .modal strong {
      color: #ffffff !important;
      text-shadow: none !important;
    }

    body.windows-shell .activation-main-panel {
      grid-area: main !important;
    }

    body.windows-shell .activation-side-panel {
      grid-area: side !important;
    }

    body.windows-shell .activation-main-panel,
    body.windows-shell .activation-side-panel {
      display: grid !important;
      align-content: start !important;
      gap: 18px !important;
      min-width: 0 !important;
      background: transparent !important;
      border: 0 !important;
      box-shadow: none !important;
    }

    body.windows-shell .section-card,
    body.windows-shell .employee-login-card,
    body.windows-shell .table-notice,
    body.windows-shell .settings-mini,
    body.windows-shell .purchase-quote,
    body.windows-shell .payment-order-card,
    body.windows-shell .request-summary-grid .settings-mini,
    body.windows-shell .panel,
    body.windows-shell .stat,
    body.windows-shell .settings-card,
    body.windows-shell .network-card,
    body.windows-shell .table-wrap,
    body.windows-shell .note,
    body.windows-shell .toolbar,
    body.windows-shell .panel-head {
      border: 1px solid rgba(229, 238, 235, .14) !important;
      background: linear-gradient(180deg, rgba(22, 34, 42, .96), rgba(13, 22, 28, .98)) !important;
      color: var(--ink) !important;
      box-shadow: none !important;
    }

    body.windows-shell .section-card,
    body.windows-shell .employee-login-card,
    body.windows-shell .table-notice,
    body.windows-shell .settings-mini,
    body.windows-shell .purchase-quote,
    body.windows-shell .payment-order-card,
    body.windows-shell .network-card,
    body.windows-shell .note {
      border-radius: 18px !important;
    }

    body.windows-shell .activation-actions-grid {
      display: grid !important;
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      gap: 14px !important;
      margin-top: 4px !important;
    }

    body.windows-shell .activation-main-panel > .btn,
    body.windows-shell .activation-actions-grid .btn,
    body.windows-shell .employee-login-card .btn {
      width: 100% !important;
      min-height: 54px !important;
    }

    body.windows-shell input,
    body.windows-shell select,
    body.windows-shell textarea,
    body.windows-shell .modal input,
    body.windows-shell .modal select,
    body.windows-shell .modal textarea,
    body.windows-shell .login-card input,
    body.windows-shell .login-card select,
    body.windows-shell .login-card textarea {
      background: #0a1218 !important;
      color: #f7fbfa !important;
      border: 1px solid rgba(229, 238, 235, .18) !important;
      border-radius: 12px !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
      caret-color: var(--primary) !important;
    }

    body.windows-shell input::placeholder,
    body.windows-shell textarea::placeholder {
      color: #98aba7 !important;
      opacity: 1 !important;
    }

    body.windows-shell .btn,
    body.windows-shell .login-card .btn,
    body.windows-shell .modal .btn {
      min-height: 42px !important;
      border: 1px solid rgba(229, 238, 235, .16) !important;
      border-radius: 12px !important;
      background: linear-gradient(180deg, #1b2b33, #101b22) !important;
      color: #f7fbfa !important;
      box-shadow: none !important;
      text-shadow: none !important;
    }

    body.windows-shell .btn.primary,
    body.windows-shell .login-card .btn.primary,
    body.windows-shell .modal .btn.primary,
    body.windows-shell .activation-actions-grid .btn.primary {
      background: var(--button-gradient) !important;
      border-color: rgba(45, 212, 191, .46) !important;
      color: #ffffff !important;
      box-shadow: 0 12px 28px rgba(20, 184, 166, .20) !important;
    }

    body.windows-shell .btn:hover,
    body.windows-shell .modal .btn:hover,
    body.windows-shell .login-card .btn:hover {
      border-color: rgba(45, 212, 191, .40) !important;
      transform: translateY(-1px);
      box-shadow: 0 12px 28px rgba(0, 0, 0, .22) !important;
    }

    body.windows-shell .modal-backdrop,
    body.windows-shell .modal-backdrop.child-modal-backdrop {
      padding: 36px !important;
      align-items: center !important;
      justify-content: center !important;
      background: rgba(3, 8, 12, .72) !important;
      backdrop-filter: blur(7px) !important;
    }

    body.windows-shell .modal,
    body.windows-shell .child-modal {
      width: min(900px, calc(100vw - 92px)) !important;
      max-height: calc(100dvh - 92px) !important;
      overflow: hidden !important;
      border: 1px solid rgba(229, 238, 235, .16) !important;
      border-radius: 22px !important;
      background: linear-gradient(180deg, #152229, #0c151b) !important;
      color: var(--ink) !important;
      box-shadow: 0 34px 88px rgba(0, 0, 0, .50) !important;
    }

    body.windows-shell .modal-head,
    body.windows-shell .child-modal .modal-head {
      min-height: 68px !important;
      padding: 16px 22px !important;
      background: linear-gradient(180deg, #12242b, #0d1a20) !important;
      border-bottom: 1px solid rgba(229, 238, 235, .14) !important;
      color: #f7fbfa !important;
    }

    body.windows-shell .modal-head .btn.small,
    body.windows-shell .modal .modal-head .btn.small,
    body.windows-shell [data-action="modal-close"] {
      min-width: 44px !important;
      width: 44px !important;
      height: 44px !important;
      border-radius: 12px !important;
      background: linear-gradient(180deg, #3a211f, #1d1212) !important;
      border-color: rgba(248, 113, 113, .40) !important;
      color: #fff6f4 !important;
      box-shadow: none !important;
    }

    body.windows-shell .modal .panel-body,
    body.windows-shell .child-modal .panel-body,
    body.windows-shell .modal-body {
      max-height: calc(100dvh - 166px) !important;
      overflow: auto !important;
      overflow-x: hidden !important;
      padding: 22px !important;
      background: linear-gradient(180deg, rgba(12, 20, 26, .98), rgba(8, 14, 18, .98)) !important;
      color: var(--ink) !important;
    }

    body.windows-shell .activation-purchase-modal {
      width: min(1080px, calc(100vw - 112px)) !important;
    }

    body.windows-shell .activation-qr-modal {
      width: min(620px, calc(100vw - 112px)) !important;
    }

    body.windows-shell .activation-qr-large img {
      width: min(430px, calc(100vw - 220px), calc(100dvh - 270px)) !important;
      height: min(430px, calc(100vw - 220px), calc(100dvh - 270px)) !important;
      border-radius: 18px !important;
      padding: 12px !important;
      background: #f8fbfa !important;
    }

    body.windows-shell .activation-purchase-actions,
    body.windows-shell .modal .activation-purchase-actions {
      position: sticky !important;
      bottom: 0 !important;
      display: flex !important;
      flex-wrap: nowrap !important;
      align-items: center !important;
      justify-content: flex-start !important;
      gap: 12px !important;
      padding: 14px !important;
      margin-top: 18px !important;
      border: 1px solid rgba(229, 238, 235, .14) !important;
      border-radius: 18px !important;
      background: linear-gradient(180deg, #152229, #0c151b) !important;
      box-shadow: 0 -12px 28px rgba(0, 0, 0, .32) !important;
    }

    body.windows-shell .activation-purchase-actions .btn,
    body.windows-shell .modal .activation-purchase-actions .btn {
      flex: 0 0 auto !important;
      width: auto !important;
      min-width: 176px !important;
      max-width: none !important;
      padding-inline: 22px !important;
      white-space: nowrap !important;
      word-break: normal !important;
      overflow-wrap: normal !important;
    }

    body.windows-shell .app {
      grid-template-columns: 286px minmax(0, 1fr) !important;
      background: var(--workspace-bg) !important;
    }

    body.windows-shell .sidebar {
      width: 286px !important;
      height: 100dvh !important;
      padding: 16px !important;
      gap: 14px !important;
      background: linear-gradient(180deg, #12242b, #0b171d) !important;
      border-right: 1px solid rgba(229, 238, 235, .12) !important;
    }

    body.windows-shell .brand {
      padding-right: 0 !important;
    }

    body.windows-shell .nav {
      overflow-y: auto !important;
      overflow-x: hidden !important;
      padding-right: 2px !important;
    }

    body.windows-shell .nav button {
      min-height: 42px !important;
      border-radius: 12px !important;
      color: #d7e4e1 !important;
    }

    body.windows-shell .nav button.active {
      background: rgba(20, 184, 166, .14) !important;
      border-color: rgba(45, 212, 191, .30) !important;
      color: #ffffff !important;
      box-shadow: inset 3px 0 0 rgba(20, 184, 166, .95) !important;
    }

    body.windows-shell .shift-box.as-nav-note {
      max-height: none !important;
      overflow: hidden !important;
      padding: 10px !important;
      gap: 8px !important;
      border: 1px solid rgba(229, 238, 235, .12) !important;
      border-radius: 16px !important;
      background: rgba(255, 255, 255, .045) !important;
    }

    body.windows-shell .shift-box.as-nav-note .quick-profile-button,
    body.windows-shell .shift-box.as-nav-note .quick-support-button,
    body.windows-shell .shift-box.as-nav-note .quick-support-create-button,
    body.windows-shell .shift-box.as-nav-note .quick-sync-button {
      min-height: 34px !important;
      padding: 8px 10px !important;
      border-radius: 12px !important;
      background: rgba(255, 255, 255, .055) !important;
      border: 1px solid rgba(229, 238, 235, .09) !important;
      color: #edf6f3 !important;
    }

    body.windows-shell .sync-state,
    body.windows-shell .sync-state span,
    body.windows-shell .shift-box.as-nav-note #shiftMeta,
    body.windows-shell .shift-box.as-nav-note #shiftEmail {
      color: rgba(220, 232, 229, .68) !important;
      font-size: 10.5px !important;
      line-height: 1.28 !important;
    }

    body.windows-shell .shift-state-line {
      display: flex !important;
      align-items: center !important;
      gap: 8px !important;
      color: #edf6f3 !important;
      font-size: 12px !important;
      line-height: 1.25 !important;
    }

    body.windows-shell .shift-lamp,
    body.windows-shell .shift-lamp.open {
      display: inline-block !important;
      flex: 0 0 10px !important;
      width: 10px !important;
      min-width: 10px !important;
      max-width: 10px !important;
      height: 10px !important;
      min-height: 10px !important;
      max-height: 10px !important;
      padding: 0 !important;
      aspect-ratio: 1 / 1 !important;
      border-radius: 50% !important;
      border: 0 !important;
      transform-origin: center !important;
    }

    body.windows-shell .shift-lamp {
      background: #81908e !important;
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .24) !important;
      animation: none !important;
    }

    body.windows-shell .shift-lamp.open {
      background: #51d18f !important;
      box-shadow: 0 0 0 4px rgba(81, 209, 143, .12), 0 0 16px rgba(81, 209, 143, .62) !important;
      animation: windowsLampPulse 2.4s ease-in-out infinite !important;
    }

    @keyframes windowsLampPulse {
      0%, 100% { transform: scale(.96); opacity: .88; border-radius: 50%; }
      50% { transform: scale(1.12); opacity: 1; border-radius: 50%; }
    }

    body.windows-shell .main {
      min-width: 0 !important;
      overflow: hidden !important;
      background:
        radial-gradient(circle at 10% 0%, rgba(20, 184, 166, .08), transparent 28%),
        linear-gradient(180deg, #071116, #081319) !important;
    }

    body.windows-shell .view:not(.hidden) {
      min-width: 0 !important;
      overflow: auto !important;
      overflow-x: hidden !important;
    }

    body.windows-shell table {
      color: var(--ink) !important;
      border-color: rgba(229, 238, 235, .12) !important;
    }

    body.windows-shell thead,
    body.windows-shell th {
      background: rgba(255, 255, 255, .05) !important;
      color: #f7fbfa !important;
      border-color: rgba(229, 238, 235, .12) !important;
    }

    body.windows-shell td {
      border-color: rgba(229, 238, 235, .10) !important;
    }

    body.windows-shell tr:nth-child(even) td {
      background: rgba(255, 255, 255, .025) !important;
    }

    body.windows-shell .tag,
    body.windows-shell .status,
    body.windows-shell .badge,
    body.windows-shell .integration-status {
      border: 1px solid rgba(229, 238, 235, .16) !important;
      background: rgba(255, 255, 255, .07) !important;
      color: #f0f7f5 !important;
    }

    body.windows-shell .topline,
    body.windows-shell .settings-summary .stat,
    body.windows-shell .dashboard-stats .stat {
      background: linear-gradient(180deg, rgba(22, 34, 42, .96), rgba(13, 22, 28, .98)) !important;
      border-color: rgba(229, 238, 235, .14) !important;
      color: var(--ink) !important;
    }

    body.windows-shell .report-card-green,
    body.windows-shell .report-card-blue,
    body.windows-shell .report-card-gold,
    body.windows-shell .report-card-red {
      background: linear-gradient(180deg, rgba(24, 38, 46, .98), rgba(13, 22, 28, .98)) !important;
      border-color: rgba(229, 238, 235, .14) !important;
    }

    @media (max-width: 1160px) {
      body.windows-shell .login-card.activation-login-card {
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-areas:
          "heading"
          "main"
          "side" !important;
      }

      body.windows-shell .app {
        grid-template-columns: 258px minmax(0, 1fr) !important;
      }

      body.windows-shell .sidebar {
        width: 258px !important;
      }
    }

    @keyframes srmAmbientGlow {
      0%, 100% {
        transform: translate3d(-2%, -1%, 0) scale(1);
        opacity: .62;
      }
      45% {
        transform: translate3d(3%, 2%, 0) scale(1.08);
        opacity: .82;
      }
      72% {
        transform: translate3d(-1%, 3%, 0) scale(1.04);
        opacity: .70;
      }
    }

    body {
      position: relative;
      isolation: isolate;
    }

    body::before,
    body::after,
    .login-screen::before {
      content: "";
      position: fixed;
      inset: -18%;
      z-index: 0;
      pointer-events: none;
      background:
        radial-gradient(circle at 22% 28%, rgba(20, 184, 166, .22), transparent 30%),
        radial-gradient(circle at 78% 18%, rgba(168, 85, 247, .16), transparent 28%),
        radial-gradient(circle at 58% 86%, rgba(244, 190, 105, .13), transparent 32%);
      filter: blur(52px);
      opacity: .55;
      transform-origin: center;
      animation: srmAmbientGlow 18s ease-in-out infinite;
    }

    body::after {
      inset: -24%;
      background:
        radial-gradient(circle at 16% 82%, rgba(15, 122, 108, .16), transparent 30%),
        radial-gradient(circle at 86% 68%, rgba(180, 65, 55, .12), transparent 28%);
      filter: blur(72px);
      opacity: .38;
      animation-duration: 24s;
      animation-direction: reverse;
    }

    body.performance-mode::before,
    body.performance-mode::after,
    body.performance-mode .login-screen::before,
    body.reduced-motion::before,
    body.reduced-motion::after,
    body.reduced-motion .login-screen::before {
      animation: none !important;
      filter: blur(36px) !important;
      opacity: .34 !important;
    }

    .app,
    .login-screen > *,
    #modalRoot {
      position: relative;
      z-index: 1;
    }

    #modalRoot {
      z-index: 1200;
    }

    .login-screen {
      overflow: hidden auto;
    }

    .modal.activation-qr-shell,
    .modal.activation-qr-modal,
    body.windows-shell .modal.activation-qr-shell,
    body.android-shell .modal.activation-qr-shell,
    body.windows-shell .modal:has(.activation-qr-modal),
    body.android-shell .modal:has(.activation-qr-modal),
    .activation-qr-modal,
    body.android-shell .activation-qr-modal,
    body.windows-shell .activation-qr-modal {
      width: min(560px, calc(100vw - 28px)) !important;
      min-height: 0 !important;
      height: auto !important;
      max-height: calc(100dvh - var(--android-safe-top, 0px) - var(--android-nav-safe, 0px) - 34px) !important;
      margin: auto !important;
      overflow: hidden !important;
    }

    .modal.activation-qr-shell .panel-body,
    .modal.activation-qr-modal .panel-body,
    .activation-qr-modal .panel-body,
    body.android-shell .activation-qr-modal .panel-body,
    body.windows-shell .activation-qr-modal .panel-body {
      display: grid !important;
      place-items: center !important;
      align-content: center !important;
      gap: clamp(10px, 2.2dvh, 18px) !important;
      min-height: 0 !important;
      max-height: calc(100dvh - var(--android-safe-top, 0px) - var(--android-nav-safe, 0px) - 116px) !important;
      padding: clamp(14px, 3dvh, 24px) !important;
      overflow: auto !important;
      text-align: center !important;
    }

    .activation-qr-large,
    body.android-shell .activation-qr-large,
    body.windows-shell .activation-qr-large {
      width: 100% !important;
      min-height: 0 !important;
      display: grid !important;
      place-items: center !important;
      align-content: center !important;
      gap: clamp(8px, 1.8dvh, 14px) !important;
      margin: 0 auto !important;
      padding: clamp(10px, 2dvh, 18px) !important;
    }

    .activation-qr-large img,
    body.android-shell .activation-qr-large img,
    body.windows-shell .activation-qr-large img {
      width: min(430px, 78vw, calc(100dvh - var(--android-safe-top, 0px) - var(--android-nav-safe, 0px) - 190px)) !important;
      height: min(430px, 78vw, calc(100dvh - var(--android-safe-top, 0px) - var(--android-nav-safe, 0px) - 190px)) !important;
      min-width: min(250px, 72vw) !important;
      min-height: min(250px, 72vw) !important;
      margin: 0 auto !important;
      object-fit: contain !important;
    }

    .activation-qr-modal p,
    .activation-qr-modal .muted {
      max-width: 38em !important;
      margin: 0 auto !important;
      line-height: 1.35 !important;
    }

    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell::before,
      body.android-shell::after {
        opacity: .42;
        filter: blur(44px);
      }

      body.android-shell .modal.activation-qr-shell,
      body.android-shell .modal.activation-qr-modal,
      body.android-shell .activation-qr-modal {
        width: min(92vw, 440px) !important;
        max-height: calc(100dvh - var(--android-safe-top, 0px) - var(--android-nav-safe, 0px) - 24px) !important;
      }

      body.android-shell .activation-qr-modal .panel-body {
        max-height: calc(100dvh - var(--android-safe-top, 0px) - var(--android-nav-safe, 0px) - 104px) !important;
        padding: 14px !important;
      }

      body.android-shell .activation-qr-large img {
        width: min(78vw, calc(100dvh - var(--android-safe-top, 0px) - var(--android-nav-safe, 0px) - 188px)) !important;
        height: min(78vw, calc(100dvh - var(--android-safe-top, 0px) - var(--android-nav-safe, 0px) - 188px)) !important;
      }
    }

    @media (orientation: landscape) and (max-height: 760px) {
      .modal.activation-qr-shell .panel-body,
      .modal.activation-qr-modal .panel-body,
      .activation-qr-modal .panel-body,
      body.android-shell .activation-qr-modal .panel-body {
        grid-template-columns: minmax(220px, auto) minmax(180px, 1fr) !important;
        align-items: center !important;
        text-align: left !important;
      }

      .activation-qr-large,
      body.android-shell .activation-qr-large {
        padding: 8px !important;
      }

      .activation-qr-large img,
      body.android-shell .activation-qr-large img,
      body.windows-shell .activation-qr-large img {
        width: min(48dvh, 330px) !important;
        height: min(48dvh, 330px) !important;
        min-width: 220px !important;
        min-height: 220px !important;
      }
    }

    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell {
        --mobile-service-reserved: calc(var(--mobile-service-dock-height, 132px) + 18px);
        --mobile-top-reserved: 58px;
      }

      body.android-shell .main {
        align-self: start !important;
        height: calc(100dvh - var(--mobile-top-reserved) - var(--mobile-service-reserved)) !important;
        max-height: calc(100dvh - var(--mobile-top-reserved) - var(--mobile-service-reserved)) !important;
        padding: 8px 10px 10px !important;
        overflow: hidden !important;
      }

      body.android-shell .view:not(.hidden) {
        max-height: 100% !important;
        padding-bottom: 18px !important;
        scroll-padding-bottom: 18px !important;
      }

      body.android-shell #view-dashboard .dashboard-bottom,
      body.android-shell .panel:last-child,
      body.android-shell .card:last-child {
        margin-bottom: 0 !important;
      }
    }

    .modal,
    .child-modal {
      overflow: hidden !important;
      background: linear-gradient(180deg, rgba(16, 25, 35, .98), rgba(8, 13, 22, .99)) !important;
      border-color: rgba(163, 184, 194, .16) !important;
    }

    .modal-head,
    .child-modal .modal-head,
    body.windows-shell .modal-head,
    body.android-shell .modal-head {
      width: 100% !important;
      max-width: 100% !important;
      margin: 0 !important;
      box-sizing: border-box !important;
      border-radius: 0 !important;
      background: linear-gradient(135deg, rgba(35, 52, 45, .98), rgba(18, 31, 38, .99)) !important;
      border-right: 0 !important;
      color: #f8fafc !important;
      overflow: hidden !important;
    }

    .modal-head .btn.small,
    .child-modal .modal-head .btn.small {
      flex: 0 0 auto !important;
      margin-right: 0 !important;
      background: rgba(62, 36, 28, .96) !important;
      color: #fffaf2 !important;
      border-color: rgba(255, 255, 255, .12) !important;
    }

    .modal .panel-body,
    .child-modal .panel-body {
      box-sizing: border-box !important;
      max-width: 100% !important;
      scrollbar-width: thin;
      scrollbar-color: rgba(128, 150, 160, .45) transparent;
    }

    .modal .panel-body::-webkit-scrollbar,
    .child-modal .panel-body::-webkit-scrollbar,
    .activation-purchase-modal::-webkit-scrollbar {
      width: 7px;
      height: 7px;
    }

    .modal .panel-body::-webkit-scrollbar-track,
    .child-modal .panel-body::-webkit-scrollbar-track,
    .activation-purchase-modal::-webkit-scrollbar-track {
      background: transparent;
    }

    .modal .panel-body::-webkit-scrollbar-thumb,
    .child-modal .panel-body::-webkit-scrollbar-thumb,
    .activation-purchase-modal::-webkit-scrollbar-thumb {
      border-radius: 999px;
      background: rgba(128, 150, 160, .42);
    }

    .activation-device-info {
      color: #f8fafc !important;
      background: rgba(8, 15, 24, .78) !important;
      border-color: rgba(148, 163, 184, .22) !important;
    }

    .activation-device-info strong {
      color: #ffffff !important;
    }

    .activation-info-modal {
      display: grid !important;
      gap: 14px !important;
      padding: 18px !important;
      background: rgba(8, 13, 22, .96) !important;
    }

    body.windows-shell .activation-purchase-modal,
    body:not(.android-shell) .activation-purchase-modal {
      width: min(760px, calc(100vw - 56px)) !important;
      max-width: min(760px, calc(100vw - 56px)) !important;
      padding: 18px 22px 22px !important;
      box-sizing: border-box !important;
      overflow-x: hidden !important;
    }

    .activation-purchase-modal label,
    .activation-purchase-modal .grid.compact label {
      min-width: 0 !important;
      max-width: 100% !important;
      box-sizing: border-box !important;
    }

    .activation-purchase-modal input,
    .activation-purchase-modal select,
    .activation-purchase-modal textarea {
      width: 100% !important;
      max-width: 100% !important;
      box-sizing: border-box !important;
    }

    .activation-purchase-modal .grid.compact {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      max-width: 100% !important;
      overflow: hidden !important;
    }

    .activation-purchase-actions,
    .modal .activation-purchase-actions,
    body.windows-shell .activation-purchase-actions,
    body.android-shell .activation-purchase-actions {
      position: static !important;
      inset: auto !important;
      width: 100% !important;
      margin: 14px 0 0 !important;
      padding: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
      border: 0 !important;
      transform: none !important;
    }

    @media (max-width: 760px) {
      .activation-purchase-modal .grid.compact {
        grid-template-columns: 1fr !important;
      }
    }

    @media (min-width: 681px) and (max-width: 1180px) {
      body.android-shell,
      body.android-shell .login-screen {
        overflow-x: hidden !important;
      }

      body.android-shell .login-card.activation-login-card {
        width: min(980px, calc(100vw - 28px)) !important;
        max-width: calc(100vw - 28px) !important;
        transform: none !important;
        overflow-x: hidden !important;
        background: linear-gradient(180deg, rgba(16, 25, 35, .97), rgba(8, 13, 22, .99)) !important;
        color: #f8fafc !important;
      }

      body.android-shell .activation-main-panel,
      body.android-shell .activation-side-panel,
      body.android-shell .activation-side-panel .section-card {
        background: rgba(10, 18, 29, .86) !important;
        color: #f8fafc !important;
        border-color: rgba(148, 163, 184, .2) !important;
      }

      body.android-shell .activation-login-card input,
      body.android-shell .activation-login-card select,
      body.android-shell .activation-login-card textarea {
        background: rgba(248, 250, 252, .96) !important;
        color: #1f2933 !important;
        border-color: rgba(71, 85, 105, .22) !important;
      }
    }

    :root {
      --primary: #6d8dff;
      --primary-dark: #3f5fdc;
      --accent: #a8bdff;
      --button-gradient: linear-gradient(135deg, #3f5fdc, #6d8dff);
      --stage67-bg: #070d16;
      --stage67-panel: rgba(12, 20, 32, .94);
      --stage67-panel-soft: rgba(17, 29, 45, .88);
      --stage67-panel-strong: rgba(8, 14, 24, .98);
      --stage67-border: rgba(178, 199, 217, .16);
      --stage67-text: #f7fbff;
      --stage67-muted: #c4d1df;
      --stage67-faint: #95a6b8;
      --stage67-field: rgba(246, 249, 252, .96);
      --stage67-field-text: #101923;
    }

    body,
    body.android-shell,
    body.windows-shell {
      color: var(--stage67-text) !important;
      background:
        radial-gradient(circle at 20% 12%, rgba(80, 145, 220, .17), transparent 34%),
        radial-gradient(circle at 86% 18%, rgba(165, 190, 235, .12), transparent 38%),
        linear-gradient(135deg, #06101a, #101827 44%, #060b13) !important;
      overflow-x: hidden !important;
    }

    body::before,
    body::after,
    body.android-shell::before,
    body.android-shell::after {
      background:
        radial-gradient(circle, rgba(105, 170, 255, .18), transparent 60%) !important;
      opacity: .58 !important;
      filter: blur(48px) !important;
    }

    body *,
    .panel,
    .card,
    .modal,
    .child-modal,
    .settings-card,
    .settings-mini,
    .section-card,
    .stat,
    .receipt-wrap,
    .bank-sales-sheet,
    .sale-detail-info,
    .sale-detail-products,
    .return-sale-row,
    .support-thread-row,
    .note,
    .empty {
      box-sizing: border-box;
    }

    .panel,
    .card,
    .modal,
    .child-modal,
    .settings-card,
    .settings-mini,
    .section-card,
    .receipt-wrap,
    .bank-sales-sheet,
    .sale-detail-info,
    .sale-detail-products,
    .return-sale-row,
    .support-thread-row,
    .note,
    .login-card:not(.activation-login-card),
    body.android-shell .login-card,
    body.windows-shell .login-card {
      background: linear-gradient(180deg, var(--stage67-panel-soft), var(--stage67-panel-strong)) !important;
      border: 1px solid var(--stage67-border) !important;
      color: var(--stage67-text) !important;
      box-shadow: 0 18px 48px rgba(0, 0, 0, .28) !important;
    }

    .panel-head,
    .modal-head,
    .child-modal .modal-head {
      background: linear-gradient(135deg, rgba(18, 32, 49, .98), rgba(9, 17, 30, .98)) !important;
      color: var(--stage67-text) !important;
      border-color: rgba(178, 199, 217, .14) !important;
    }

    h1, h2, h3, h4, h5,
    .panel-head h3,
    .settings-mini h4,
    .integration-card h4,
    .settings-card h4,
    .login-card h2,
    .activation-login-card h2,
    strong {
      color: #ffffff !important;
    }

    p, span, small, label, td, th, li, .muted, .empty,
    .settings-mini p, .settings-mini small,
    .integration-card span, .integration-card small,
    .integration-panel-dark span, .integration-panel-dark small {
      color: var(--stage67-muted) !important;
    }

    table {
      width: 100% !important;
      table-layout: fixed !important;
      border-collapse: separate !important;
      border-spacing: 0 !important;
      overflow: visible !important;
    }

    th {
      color: #eef6ff !important;
      background: rgba(255, 255, 255, .055) !important;
      font-weight: 700 !important;
    }

    td {
      color: var(--stage67-muted) !important;
      border-color: rgba(178, 199, 217, .10) !important;
      word-break: break-word !important;
    }

    tr + tr td {
      border-top: 1px solid rgba(178, 199, 217, .08) !important;
    }

    input,
    select,
    textarea {
      background: var(--stage67-field) !important;
      color: var(--stage67-field-text) !important;
      border: 1px solid rgba(148, 163, 184, .38) !important;
      box-shadow: none !important;
    }

    input::placeholder,
    textarea::placeholder {
      color: rgba(30, 41, 59, .64) !important;
    }

    .btn,
    button,
    .tabs button {
      border-color: rgba(178, 199, 217, .18) !important;
    }

    .btn.primary,
    .tabs button.active,
    .mobile-nav-toggle,
    .quick-sync-button {
      background: var(--button-gradient) !important;
      color: #ffffff !important;
      box-shadow: 0 12px 26px rgba(47, 128, 237, .24) !important;
    }

    .btn:not(.primary):not(.danger),
    .tabs button:not(.active) {
      background: rgba(255, 255, 255, .075) !important;
      color: #edf6ff !important;
    }

    .tag,
    .tag.green,
    .status.green,
    .integration-status.green,
    .shift-lamp,
    .sync-mini,
    .settings-summary .stat span,
    .brand span,
    .nav button span {
      color: #dbeafe !important;
    }

    .tag,
    .integration-status,
    .support-status-pill {
      background: rgba(110, 155, 220, .16) !important;
      border-color: rgba(170, 200, 235, .22) !important;
    }

    .tag.red,
    .btn.danger {
      color: #ffd7d7 !important;
      background: rgba(185, 63, 63, .2) !important;
      border-color: rgba(248, 113, 113, .34) !important;
    }

    .settings-compact-currency {
      display: none !important;
    }

    .table-wrap,
    .shift-table-wrap,
    .notification-log-wrap,
    .panel-body,
    .settings-card .panel-body {
      max-height: none !important;
      overflow: visible !important;
    }

    .main,
    .view:not(.hidden) {
      overflow-x: hidden !important;
      scrollbar-width: none !important;
      scroll-behavior: smooth !important;
    }

    .main::-webkit-scrollbar,
    .view:not(.hidden)::-webkit-scrollbar,
    .table-wrap::-webkit-scrollbar,
    .panel-body::-webkit-scrollbar {
      width: 0 !important;
      height: 0 !important;
      display: none !important;
    }

    .settings-tabs,
    .tabs {
      gap: 9px !important;
      flex-wrap: wrap !important;
    }

    .settings-tabs button,
    .tabs button {
      min-height: 42px !important;
      padding: 10px 14px !important;
      white-space: normal !important;
      line-height: 1.15 !important;
    }

    .toggle-line,
    .settings-mini .toggle-line,
    .activation-purchase-modal > .toggle-line {
      display: flex !important;
      align-items: center !important;
      gap: 10px !important;
      color: var(--stage67-text) !important;
    }

    .toggle-line input[type="checkbox"] {
      flex: 0 0 auto !important;
      margin: 0 !important;
      align-self: center !important;
    }

    .toggle-line span,
    .settings-mini .toggle-line span {
      color: #f4f8ff !important;
      line-height: 1.25 !important;
    }

    .quick-profile-button,
    .quick-support-button,
    .quick-support-create-button,
    .quick-sync-button,
    .shift-state-line {
      background: rgba(13, 24, 38, .88) !important;
      color: #f7fbff !important;
      border: 1px solid rgba(178, 199, 217, .16) !important;
      border-radius: 10px !important;
    }

    .quick-profile-button {
      display: grid !important;
      grid-template-columns: auto 1fr !important;
      align-items: center !important;
      gap: 8px !important;
      text-align: left !important;
      padding: 8px 10px !important;
    }

    .quick-profile-button span {
      font-size: 11px !important;
      color: var(--stage67-faint) !important;
    }

    .quick-profile-button strong {
      min-width: 0 !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
      white-space: nowrap !important;
    }

    .shift-box.as-nav-note {
      background: rgba(9, 16, 27, .94) !important;
      border-color: rgba(178, 199, 217, .14) !important;
      color: var(--stage67-text) !important;
      overflow: hidden !important;
    }

    .shift-box.as-nav-note #shiftMeta,
    .shift-box.as-nav-note #shiftEmail,
    .shift-box.as-nav-note #syncState {
      font-size: 10.5px !important;
      line-height: 1.18 !important;
      color: #cbd8e5 !important;
    }

    .shift-box.as-nav-note .shift-state-line strong,
    #shiftState {
      color: #ffffff !important;
      font-size: 12px !important;
    }

    .sales-table,
    .bank-sales-table,
    #view-stock table,
    #view-documents table,
    #view-reports table,
    #view-history table,
    #view-clients table {
      font-size: clamp(10px, 1.15vw, 13px) !important;
      min-width: 0 !important;
    }

    .sales-table th,
    .sales-table td,
    .bank-sales-table th,
    .bank-sales-table td,
    #view-stock th,
    #view-stock td,
    #view-documents th,
    #view-documents td,
    #view-reports th,
    #view-reports td,
    #view-history th,
    #view-history td,
    #view-clients th,
    #view-clients td {
      padding: 8px 7px !important;
      line-height: 1.22 !important;
    }

    #view-stock .row-actions,
    #view-documents .row-actions,
    #view-reports .row-actions,
    #view-history .row-actions,
    #view-clients .row-actions {
      display: flex !important;
      flex-wrap: wrap !important;
      gap: 5px !important;
    }

    #view-stock .btn.small,
    #view-documents .btn.small,
    #view-reports .btn.small,
    #view-history .btn.small,
    #view-clients .btn.small {
      min-height: 30px !important;
      padding: 6px 8px !important;
      font-size: 11px !important;
    }

    #view-clients .tag.green,
    #view-clients .integration-status,
    #view-clients .status {
      display: none !important;
    }

    #view-documents [data-action="filter-out-of-stock"],
    #view-documents [data-id="out-of-stock"] {
      display: none !important;
    }

    .sale-detail-layout {
      grid-template-columns: minmax(0, 1fr) minmax(280px, .55fr) !important;
      gap: 14px !important;
    }

    .modal:has(.sale-detail-layout) {
      width: min(1080px, calc(100vw - 28px)) !important;
      max-width: calc(100vw - 28px) !important;
    }

    .modal:has(#shiftReportPrint) {
      width: min(1060px, calc(100vw - 28px)) !important;
      max-width: calc(100vw - 28px) !important;
    }

    .price-card {
      max-width: 100% !important;
      background: #fffdf8 !important;
      color: #111827 !important;
      border-color: rgba(15, 23, 42, .18) !important;
      box-shadow: 0 12px 26px rgba(0, 0, 0, .18) !important;
    }

    .price-card strong,
    .price-card div {
      color: #111827 !important;
    }

    .price-card .price {
      color: var(--label-price-color, #111827) !important;
      font-size: clamp(18px, 9%, 38px) !important;
    }

    .price-grid {
      align-items: start !important;
      overflow: visible !important;
    }

    body.android-shell .login-screen {
      padding-left: max(8px, env(safe-area-inset-left)) !important;
      padding-right: max(8px, env(safe-area-inset-right)) !important;
      overflow-x: hidden !important;
    }

    body.android-shell .login-card.activation-login-card {
      width: min(100%, calc(100vw - 16px)) !important;
      max-width: calc(100vw - 16px) !important;
      margin-left: auto !important;
      margin-right: auto !important;
      transform: none !important;
      background: linear-gradient(180deg, rgba(13, 23, 36, .98), rgba(7, 13, 23, .99)) !important;
      color: var(--stage67-text) !important;
      border-color: rgba(178, 199, 217, .18) !important;
      overflow: hidden !important;
    }

    body.android-shell .activation-main-panel,
    body.android-shell .activation-side-panel,
    body.android-shell .activation-side-panel .section-card,
    body.android-shell .activation-actions,
    body.android-shell .activation-device-info,
    body.android-shell .employee-login-panel,
    body.android-shell .activation-login-card .section-card {
      background: rgba(10, 18, 30, .92) !important;
      color: var(--stage67-text) !important;
      border: 1px solid rgba(178, 199, 217, .16) !important;
      box-shadow: none !important;
    }

    body.android-shell .activation-actions,
    body.android-shell .employee-login-panel {
      border-radius: 18px !important;
    }

    body.android-shell .activation-login-card input,
    body.android-shell .activation-login-card select,
    body.android-shell .activation-login-card textarea {
      background: rgba(245, 248, 252, .98) !important;
      color: #111827 !important;
      border-color: rgba(148, 163, 184, .34) !important;
    }

    body.android-shell .app:not(.locked) {
      width: min(100%, calc(100vw - 14px)) !important;
      max-width: calc(100vw - 14px) !important;
      margin-left: auto !important;
      margin-right: auto !important;
      overflow-x: hidden !important;
    }

    body.android-shell .main {
      padding-left: 8px !important;
      padding-right: 8px !important;
      overflow-x: hidden !important;
    }

    body.android-shell .view:not(.hidden) {
      padding-left: 0 !important;
      padding-right: 0 !important;
      overflow-y: auto !important;
      overflow-x: hidden !important;
    }

    body.android-shell .panel,
    body.android-shell .card,
    body.android-shell .settings-card,
    body.android-shell .settings-mini {
      width: 100% !important;
      max-width: 100% !important;
      overflow: hidden !important;
    }

    body.android-shell .dashboard-bottom,
    body.android-shell .two-col,
    body.android-shell .settings-layout,
    body.android-shell .settings-mini-grid,
    body.android-shell .settings-profiles-grid,
    body.android-shell .form-grid {
      grid-template-columns: 1fr !important;
      min-width: 0 !important;
    }

    body.android-shell .stat,
    body.android-shell .dashboard-stat,
    body.android-shell .kpi-card {
      min-height: auto !important;
      padding: 11px 12px !important;
    }

    body.android-shell .sales-table .tag {
      display: inline-flex !important;
      width: auto !important;
      min-width: max-content !important;
      max-width: 100% !important;
      padding: 4px 8px !important;
      white-space: normal !important;
    }

    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell {
        --mobile-service-reserved: calc(var(--mobile-service-dock-height, 120px) + 14px);
      }

      body.android-shell .main {
        width: calc(100vw - 14px) !important;
        max-width: calc(100vw - 14px) !important;
        justify-self: center !important;
      }

      body.android-shell .panel-body {
        padding: 12px !important;
      }

      body.android-shell .sales-table,
      body.android-shell #view-stock table,
      body.android-shell #view-documents table,
      body.android-shell #view-reports table,
      body.android-shell #view-history table,
      body.android-shell #view-clients table {
        font-size: 11px !important;
      }

      body.android-shell #view-dashboard .dashboard-bottom .panel,
      body.android-shell #view-dashboard .dashboard-bottom .card {
        min-height: auto !important;
      }

      body.android-shell .sale-detail-layout {
        grid-template-columns: 1fr !important;
      }

      body.android-shell .modal,
      body.android-shell .child-modal {
        width: min(96vw, 560px) !important;
        max-width: calc(100vw - 14px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
      }
    }

    @media (min-width: 681px) and (max-width: 1180px) {
      body.android-shell .main {
        padding: 10px 12px !important;
      }

      body.android-shell #view-dashboard .dashboard-bottom,
      body.android-shell .settings-layout,
      body.android-shell .settings-profiles-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      }

      body.android-shell .panel-body {
        padding: 12px !important;
      }

      body.android-shell #view-stock table,
      body.android-shell #view-documents table,
      body.android-shell #view-reports table,
      body.android-shell .bank-sales-table {
        font-size: 10.5px !important;
      }

      body.android-shell .shift-box.as-nav-note {
        max-height: 136px !important;
        padding: 8px !important;
      }
    }

    @media (orientation: landscape) and (min-width: 900px) and (max-height: 900px) {
      body.android-shell .shift-box.as-nav-note {
        bottom: max(16px, calc(env(safe-area-inset-bottom) + 16px)) !important;
        max-height: 118px !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 6px !important;
      }

      body.android-shell .shift-box.as-nav-note #shiftMeta,
      body.android-shell .shift-box.as-nav-note #shiftEmail {
        display: none !important;
      }

      body.android-shell .sale-detail-layout {
        grid-template-columns: minmax(0, 1fr) minmax(310px, .48fr) !important;
      }

      body.android-shell .modal:has(.sale-detail-layout) {
        width: min(1120px, calc(100vw - 30px)) !important;
      }
    }

    body.android-shell .modal,
    body.android-shell .child-modal {
      height: auto !important;
      min-height: 0 !important;
    }

    body.android-shell .modal:not(:has(.activation-purchase-modal)) .panel-body,
    body.android-shell .child-modal:not(:has(.activation-purchase-modal)) .panel-body {
      flex: 0 1 auto !important;
      min-height: 0 !important;
    }

    body.android-shell .modal-head,
    body.android-shell .child-modal .modal-head,
    body.android-shell .modal > .modal-head {
      background: linear-gradient(135deg, rgba(20, 32, 49, .99), rgba(9, 16, 29, .99)) !important;
    }

    body.android-shell .modal .btn.primary,
    body.android-shell .child-modal .btn.primary,
    body.android-shell .activation-login-card .btn.primary,
    body.android-shell .activation-login-card .quick-sync-button {
      background: var(--button-gradient) !important;
      color: #ffffff !important;
    }

    .btn.primary,
    button.primary,
    #view-dashboard .btn.primary,
    #view-pos .btn.primary,
    #view-shifts .btn.primary,
    #view-documents .btn.primary,
    #view-stock .btn.primary,
    #view-reports .btn.primary,
    #view-settings .btn.primary,
    .activation-login-card .btn.primary,
    .activation-login-card [data-action="purchase-open"],
    .activation-login-card [data-action="employee-login"],
    .activation-login-card [data-action="activation-code-open"],
    .activation-login-card [data-action="activation-purchase-open"] {
      background: var(--button-gradient) !important;
      color: #ffffff !important;
      border-color: rgba(190, 204, 255, .26) !important;
      box-shadow: 0 14px 30px rgba(80, 96, 220, .28) !important;
    }

    body:not(.android-shell) {
      --bg: #07111a;
      --workspace-bg: #07111a;
      --surface: #101a27;
      --surface-2: #142130;
      --ink: #edf5ff;
      --text: #edf5ff;
      --text-strong: #ffffff;
      --muted: #a9b8c8;
      --line: rgba(166, 190, 214, .16);
      --primary: #18a7b0;
      --primary-2: #2879a8;
      --button-gradient: linear-gradient(135deg, #1599a8, #24719e);
      --sidebar-bg: #0b1420;
      background:
        radial-gradient(circle at 22% 12%, rgba(24, 167, 176, .11), transparent 34%),
        radial-gradient(circle at 78% 4%, rgba(82, 104, 184, .10), transparent 32%),
        linear-gradient(135deg, #061018, #08131d 48%, #061018) !important;
    }

    body:not(.android-shell)::before {
      content: "";
      position: fixed;
      inset: -18%;
      pointer-events: none;
      z-index: 0;
      background:
        radial-gradient(circle at 16% 72%, rgba(20, 143, 158, .10), transparent 28%),
        radial-gradient(circle at 76% 36%, rgba(95, 112, 190, .08), transparent 30%);
      filter: blur(48px);
      animation: srmAmbientPulse 18s ease-in-out infinite alternate;
    }

    @keyframes srmAmbientPulse {
      from { opacity: .55; transform: scale(1); }
      to { opacity: .82; transform: scale(1.025); }
    }

    body:not(.android-shell) .app:not(.locked) {
      position: relative;
      z-index: 1;
      background: transparent !important;
    }

    body:not(.android-shell) .sidebar {
      height: 100dvh !important;
      overflow: hidden !important;
      gap: 10px !important;
      padding: 12px 10px !important;
      background: linear-gradient(180deg, rgba(11, 20, 32, .98), rgba(8, 15, 25, .98)) !important;
      border-right-color: rgba(166, 190, 214, .12) !important;
    }

    body:not(.android-shell) .brand {
      min-height: 58px !important;
      padding: 8px 38px 8px 8px !important;
      border-radius: 12px !important;
      background: rgba(15, 26, 40, .72) !important;
      border: 1px solid rgba(166, 190, 214, .10) !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) .brand-mark {
      width: 44px !important;
      height: 44px !important;
      border-radius: 12px !important;
      flex: 0 0 44px !important;
    }

    body:not(.android-shell) .brand h1 {
      font-size: 15px !important;
      color: #f7fbff !important;
    }

    body:not(.android-shell) .brand.network-setup-needed::after {
      top: 4px !important;
      right: 42px !important;
      background: rgba(30, 50, 70, .96) !important;
      color: #d9f4ff !important;
      border: 1px solid rgba(166, 190, 214, .18) !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) .nav {
      min-height: 0 !important;
      overflow: hidden !important;
      gap: 3px !important;
      align-content: start !important;
    }

    body:not(.android-shell) .nav button {
      min-height: 30px !important;
      padding: 5px 8px !important;
      grid-template-columns: 24px minmax(0, 1fr) auto !important;
      gap: 7px !important;
      border-radius: 8px !important;
      font-size: 11.5px !important;
      color: #d8e5f0 !important;
      background: transparent !important;
    }

    body:not(.android-shell) .nav button.active,
    body:not(.android-shell) .nav button:hover {
      background: rgba(42, 121, 162, .42) !important;
      color: #ffffff !important;
    }

    body:not(.android-shell) .shift-box.as-nav-note {
      max-height: 166px !important;
      min-height: 0 !important;
      overflow: hidden !important;
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      gap: 5px !important;
      padding: 7px !important;
      border: 1px solid rgba(166, 190, 214, .12) !important;
      border-radius: 12px !important;
      background: rgba(12, 23, 36, .88) !important;
      color: #d8e5f0 !important;
    }

    body:not(.android-shell) .quick-profile-button,
    body:not(.android-shell) .quick-support-button,
    body:not(.android-shell) .quick-support-create-button,
    body:not(.android-shell) .quick-sync-button,
    body:not(.android-shell) .shift-state-line {
      min-height: 24px !important;
      padding: 4px 7px !important;
      border-radius: 9px !important;
      border: 1px solid rgba(166, 190, 214, .13) !important;
      background: rgba(18, 32, 48, .88) !important;
      color: #edf5ff !important;
      box-shadow: none !important;
      font-size: 11px !important;
      line-height: 1.1 !important;
    }

    body:not(.android-shell) .shift-box.as-nav-note .quick-profile-button {
      grid-column: 1 / -1 !important;
    }

    body:not(.android-shell) .shift-box.as-nav-note .quick-sync-button,
    body:not(.android-shell) .shift-box.as-nav-note .shift-state-line {
      grid-column: 1 / -1 !important;
      min-width: 0 !important;
    }

    body:not(.android-shell) .quick-profile-button span,
    body:not(.android-shell) .quick-profile-button strong {
      font-size: 11px !important;
    }

    body:not(.android-shell) .sidebar-service-divider,
    body:not(.android-shell) .shift-box.as-nav-note #syncState,
    body:not(.android-shell) .shift-box.as-nav-note #shiftMeta,
    body:not(.android-shell) .shift-box.as-nav-note #shiftEmail {
      display: none !important;
    }

    body:not(.android-shell) .shift-lamp {
      width: 8px !important;
      height: 8px !important;
      flex: 0 0 8px !important;
      margin: 0 !important;
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.20) !important;
    }

    body:not(.android-shell) .shift-lamp.open {
      background: #5bc8ff !important;
      box-shadow: 0 0 0 3px rgba(91, 200, 255, .12), 0 0 12px rgba(91, 200, 255, .42) !important;
    }

    body:not(.android-shell) .main,
    body:not(.android-shell) .view {
      background: transparent !important;
    }

    body:not(.android-shell) .topline,
    body:not(.android-shell) .panel,
    body:not(.android-shell) .stat,
    body:not(.android-shell) .settings-card,
    body:not(.android-shell) .settings-mini,
    body:not(.android-shell) .section-card,
    body:not(.android-shell) .network-card,
    body:not(.android-shell) .integration-card,
    body:not(.android-shell) .modal,
    body:not(.android-shell) .child-modal,
    body:not(.android-shell) .support-card,
    body:not(.android-shell) .table-notice,
    body:not(.android-shell) .history-cell,
    body:not(.android-shell) .compact-event,
    body:not(.android-shell) .counterparty-select-row,
    body:not(.android-shell) .report-editor,
    body:not(.android-shell) .report-editor-sheet,
    body:not(.android-shell) .report-payment-panel,
    body:not(.android-shell) .report-card-green,
    body:not(.android-shell) .report-card-blue,
    body:not(.android-shell) .report-card-gold,
    body:not(.android-shell) .report-card-red,
    body:not(.android-shell) .report-card-neutral,
    body:not(.android-shell) .settings-logo-row,
    body:not(.android-shell) .network-setup-card,
    body:not(.android-shell) .legal-group,
    body:not(.android-shell) .legal-doc-row,
    body:not(.android-shell) [class*="rights"],
    body:not(.android-shell) [class*="permission"] {
      background: rgba(13, 23, 36, .90) !important;
      border-color: rgba(166, 190, 214, .15) !important;
      color: #edf5ff !important;
      box-shadow: 0 16px 36px rgba(0, 0, 0, .22) !important;
    }

    body:not(.android-shell) .panel-head,
    body:not(.android-shell) .modal-head,
    body:not(.android-shell) .child-modal .modal-head {
      background: linear-gradient(180deg, rgba(19, 32, 47, .98), rgba(12, 22, 35, .94)) !important;
      color: #ffffff !important;
      border-color: rgba(166, 190, 214, .14) !important;
    }

    body:not(.android-shell) h1,
    body:not(.android-shell) h2,
    body:not(.android-shell) h3,
    body:not(.android-shell) h4,
    body:not(.android-shell) strong,
    body:not(.android-shell) .panel-head h3,
    body:not(.android-shell) .stat strong,
    body:not(.android-shell) th {
      color: #ffffff !important;
    }

    body:not(.android-shell) .brand span,
    body:not(.android-shell) .panel-head span,
    body:not(.android-shell) label,
    body:not(.android-shell) small,
    body:not(.android-shell) .muted,
    body:not(.android-shell) td span,
    body:not(.android-shell) .empty {
      color: #a9b8c8 !important;
    }

    body:not(.android-shell) p,
    body:not(.android-shell) td,
    body:not(.android-shell) .panel-body,
    body:not(.android-shell) .modal .panel-body {
      color: #dce8f4 !important;
    }

    body:not(.android-shell) input,
    body:not(.android-shell) select,
    body:not(.android-shell) textarea {
      min-height: 39px !important;
      border-radius: 10px !important;
      background: #f5f2eb !important;
      color: #17212b !important;
      border: 1px solid rgba(166, 190, 214, .28) !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) input::placeholder,
    body:not(.android-shell) textarea::placeholder {
      color: #71808e !important;
      opacity: 1 !important;
    }

    body:not(.android-shell) .btn:not(.primary):not(.danger),
    body:not(.android-shell) .tabs button,
    body:not(.android-shell) .report-sheet-tabs button {
      background: rgba(20, 35, 52, .94) !important;
      color: #eef6ff !important;
      border-color: rgba(166, 190, 214, .16) !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) .btn.primary,
    body:not(.android-shell) button.primary {
      background: var(--button-gradient) !important;
      color: #ffffff !important;
      border-color: rgba(91, 200, 255, .20) !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) .tabs button.active,
    body:not(.android-shell) .report-sheet-tabs button.active {
      background: linear-gradient(135deg, rgba(21, 153, 168, .96), rgba(36, 113, 158, .96)) !important;
      color: #ffffff !important;
      border-color: rgba(91, 200, 255, .22) !important;
    }

    body:not(.android-shell) table,
    body:not(.android-shell) .table-scroll,
    body:not(.android-shell) .report-editor table {
      background: rgba(8, 16, 27, .78) !important;
      border-color: rgba(166, 190, 214, .13) !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) th {
      background: rgba(20, 34, 49, .98) !important;
      border-color: rgba(166, 190, 214, .12) !important;
    }

    body:not(.android-shell) td,
    body:not(.android-shell) .report-editor td {
      background: rgba(10, 19, 31, .82) !important;
      border-color: rgba(166, 190, 214, .09) !important;
    }

    body:not(.android-shell) .report-sheet-tabs {
      background: rgba(12, 22, 35, .96) !important;
      padding: 6px 0 10px !important;
      border: 0 !important;
    }

    body:not(.android-shell) .support-logo.telegram,
    body:not(.android-shell) .support-logo.whatsapp {
      background: linear-gradient(135deg, #1a799f, #165e79) !important;
    }

    body:not(.android-shell) .support-status-pill,
    body:not(.android-shell) .tag,
    body:not(.android-shell) .integration-status,
    body:not(.android-shell) .status-pill {
      background: rgba(39, 79, 111, .58) !important;
      color: #d9f4ff !important;
      border-color: rgba(166, 190, 214, .15) !important;
    }

    body:not(.android-shell) a,
    body:not(.android-shell) .settings-mini a {
      color: #8fd6ff !important;
    }

    body:not(.android-shell) .modal .muted,
    body:not(.android-shell) .support-card small,
    body:not(.android-shell) .support-card p,
    body:not(.android-shell) .support-card span {
      color: #c1cfdd !important;
    }

    body:not(.android-shell) .receipt-wrap {
      justify-items: center !important;
      max-height: 68vh !important;
      overflow: hidden !important;
      padding: 12px !important;
      border-radius: 14px !important;
      background: rgba(8, 16, 27, .55) !important;
      border: 1px solid rgba(166, 190, 214, .12) !important;
    }

    body:not(.android-shell) .receipt-wrap .receipt {
      min-height: 0 !important;
      transform: scale(.86);
      transform-origin: top center;
      margin-bottom: -64px;
      box-shadow: none !important;
    }

    body:not(.android-shell) .price-grid {
      gap: 14px !important;
      grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important;
    }

    body:not(.android-shell) .price-grid .price-card {
      min-height: 118px !important;
      border: 1px solid rgba(166, 190, 214, .18) !important;
      border-radius: 12px !important;
      background: rgba(245, 242, 235, .96) !important;
      color: #182231 !important;
      overflow: hidden !important;
    }

    body:not(.android-shell) .row-actions,
    body:not(.android-shell) .client-actions-grid {
      flex-wrap: wrap !important;
      min-width: 0 !important;
    }

    body:not(.android-shell) ::-webkit-scrollbar {
      width: 8px;
      height: 8px;
    }

    body:not(.android-shell) ::-webkit-scrollbar-thumb {
      background: rgba(91, 200, 255, .34);
      border: 2px solid rgba(8, 16, 27, .72);
      border-radius: 999px;
    }

    body:not(.android-shell) ::-webkit-scrollbar-track {
      background: rgba(8, 16, 27, .18);
    }

    body:not(.android-shell) {
      color-scheme: dark;
      --desktop-bg: #07111a;
      --desktop-panel: rgba(12, 22, 35, .94);
      --desktop-panel-2: rgba(16, 30, 46, .96);
      --desktop-field: #0a1421;
      --desktop-field-2: #0d1a2a;
      --desktop-line: rgba(165, 190, 214, .18);
      --desktop-line-strong: rgba(165, 190, 214, .28);
      --desktop-text: #edf6ff;
      --desktop-muted: #b7c6d6;
      --desktop-accent: #55bfe1;
      --desktop-accent-2: #2b86b6;
      --primary: #55bfe1;
      --primary-2: #8fd6ff;
      --button-gradient: linear-gradient(135deg, #1797a8, #2b78a6);
    }

    body:not(.android-shell) input,
    body:not(.android-shell) select,
    body:not(.android-shell) textarea,
    body:not(.android-shell) input[type="date"],
    body:not(.android-shell) input[type="time"],
    body:not(.android-shell) input[type="number"],
    body:not(.android-shell) input[type="search"],
    body:not(.android-shell) .form-control,
    body:not(.android-shell) .field-control {
      background: var(--desktop-field) !important;
      color: var(--desktop-text) !important;
      border: 1px solid var(--desktop-line-strong) !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
      caret-color: var(--desktop-accent) !important;
    }

    body:not(.android-shell) input:hover,
    body:not(.android-shell) select:hover,
    body:not(.android-shell) textarea:hover {
      border-color: rgba(143, 214, 255, .38) !important;
    }

    body:not(.android-shell) input:focus,
    body:not(.android-shell) select:focus,
    body:not(.android-shell) textarea:focus {
      outline: none !important;
      border-color: rgba(143, 214, 255, .72) !important;
      box-shadow: 0 0 0 3px rgba(85, 191, 225, .16), inset 0 1px 0 rgba(255,255,255,.05) !important;
    }

    body:not(.android-shell) input::placeholder,
    body:not(.android-shell) textarea::placeholder {
      color: rgba(183, 198, 214, .70) !important;
      opacity: 1 !important;
    }

    body:not(.android-shell) option,
    body:not(.android-shell) optgroup {
      background: #0a1421 !important;
      color: #edf6ff !important;
    }

    body:not(.android-shell) input::-webkit-calendar-picker-indicator {
      filter: invert(1) opacity(.72);
    }

    body:not(.android-shell) input[type="checkbox"],
    body:not(.android-shell) input[type="radio"] {
      accent-color: #5bc8ff !important;
      background: transparent !important;
      border-color: var(--desktop-line-strong) !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) .modal,
    body:not(.android-shell) .child-modal,
    body:not(.android-shell) .modal .panel-body,
    body:not(.android-shell) .child-modal .panel-body,
    body:not(.android-shell) .drawer,
    body:not(.android-shell) .dropdown,
    body:not(.android-shell) .popover,
    body:not(.android-shell) .footer-panel,
    body:not(.android-shell) .sticky-footer,
    body:not(.android-shell) .toolbar,
    body:not(.android-shell) .tabs,
    body:not(.android-shell) .settings-tabs-panel,
    body:not(.android-shell) .preview-panel,
    body:not(.android-shell) .preview-container,
    body:not(.android-shell) .print-preview,
    body:not(.android-shell) .document-preview,
    body:not(.android-shell) .receipt-preview,
    body:not(.android-shell) .label-preview,
    body:not(.android-shell) .table-scroll,
    body:not(.android-shell) .report-editor,
    body:not(.android-shell) .report-sheet-tabs,
    body:not(.android-shell) .report-editor-sheet,
    body:not(.android-shell) .report-preview-modal,
    body:not(.android-shell) .report-preview-modal .panel-body {
      background: var(--desktop-panel) !important;
      color: var(--desktop-text) !important;
      border-color: var(--desktop-line) !important;
      box-shadow: 0 18px 44px rgba(0,0,0,.26) !important;
    }

    body:not(.android-shell) .modal-backdrop,
    body:not(.android-shell) .child-modal-backdrop {
      background: rgba(2, 8, 14, .72) !important;
      backdrop-filter: blur(10px);
    }

    body:not(.android-shell) .modal-head,
    body:not(.android-shell) .child-modal .modal-head,
    body:not(.android-shell) .panel-head {
      background: linear-gradient(180deg, #142437, #0d1928) !important;
      color: #ffffff !important;
      border-bottom: 1px solid var(--desktop-line) !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) .modal-head::after,
    body:not(.android-shell) .child-modal .modal-head::after,
    body:not(.android-shell) .panel-head::after {
      content: none !important;
    }

    body:not(.android-shell) .view [style*="background:#fff"],
    body:not(.android-shell) .view [style*="background: #fff"],
    body:not(.android-shell) .view [style*="background:white"],
    body:not(.android-shell) .view [style*="background: white"],
    body:not(.android-shell) .modal [style*="background:#fff"],
    body:not(.android-shell) .modal [style*="background: #fff"],
    body:not(.android-shell) .modal [style*="background:white"],
    body:not(.android-shell) .modal [style*="background: white"] {
      background: var(--desktop-panel-2) !important;
      color: var(--desktop-text) !important;
      border-color: var(--desktop-line) !important;
    }

    body:not(.android-shell) .view [style*="color:#0f7a"],
    body:not(.android-shell) .view [style*="color: #0f7a"],
    body:not(.android-shell) .view [style*="color:#0b5f"],
    body:not(.android-shell) .view [style*="color: #0b5f"],
    body:not(.android-shell) .modal [style*="color:#0f7a"],
    body:not(.android-shell) .modal [style*="color: #0f7a"],
    body:not(.android-shell) .modal [style*="color:#0b5f"],
    body:not(.android-shell) .modal [style*="color: #0b5f"] {
      color: var(--desktop-text) !important;
    }

    body:not(.android-shell) .tag.green,
    body:not(.android-shell) .status.green,
    body:not(.android-shell) .integration-status.green,
    body:not(.android-shell) .text-green,
    body:not(.android-shell) .green-text,
    body:not(.android-shell) .muted.green,
    body:not(.android-shell) .sync-state.ok strong,
    body:not(.android-shell) #shiftState {
      color: #d8efff !important;
    }

    body:not(.android-shell) .tag.green,
    body:not(.android-shell) .status.green,
    body:not(.android-shell) .integration-status.green {
      background: rgba(39, 79, 111, .58) !important;
      border-color: var(--desktop-line) !important;
    }

    body:not(.android-shell) .shift-lamp.open {
      background: #49d889 !important;
      box-shadow: 0 0 0 3px rgba(73, 216, 137, .12), 0 0 12px rgba(73, 216, 137, .42) !important;
    }

    body:not(.android-shell) table {
      border-collapse: separate !important;
      border-spacing: 0 !important;
      background: rgba(8, 16, 27, .82) !important;
      border-color: var(--desktop-line) !important;
      overflow: hidden !important;
    }

    body:not(.android-shell) th {
      background: #142437 !important;
      color: #f3f8ff !important;
      border-color: var(--desktop-line) !important;
    }

    body:not(.android-shell) td {
      background: rgba(10, 19, 31, .88) !important;
      color: #deebf8 !important;
      border-color: rgba(165, 190, 214, .10) !important;
    }

    body:not(.android-shell) tr:nth-child(even) td {
      background: rgba(13, 24, 38, .88) !important;
    }

    body:not(.android-shell) .row-actions,
    body:not(.android-shell) .modal .row-actions,
    body:not(.android-shell) .report-preview-modal .row-actions:last-child {
      background: linear-gradient(180deg, rgba(12, 22, 35, .80), rgba(12, 22, 35, .98)) !important;
      border-color: var(--desktop-line) !important;
      z-index: 4;
    }

    body:not(.android-shell) .btn,
    body:not(.android-shell) button,
    body:not(.android-shell) .tabs button,
    body:not(.android-shell) .report-sheet-tabs button {
      color: #edf6ff !important;
      border-color: var(--desktop-line-strong) !important;
    }

    body:not(.android-shell) .btn.primary,
    body:not(.android-shell) button.primary,
    body:not(.android-shell) [data-action="add-product"],
    body:not(.android-shell) [data-action="save"],
    body:not(.android-shell) [data-action="submit"] {
      background: var(--button-gradient) !important;
      color: #ffffff !important;
      border-color: rgba(143, 214, 255, .25) !important;
    }

    body:not(.android-shell) .empty,
    body:not(.android-shell) .muted,
    body:not(.android-shell) small,
    body:not(.android-shell) label,
    body:not(.android-shell) td span,
    body:not(.android-shell) .panel-head span {
      color: var(--desktop-muted) !important;
    }

    body:not(.android-shell) .receipt-wrap,
    body:not(.android-shell) .price-grid,
    body:not(.android-shell) .saved-labels,
    body:not(.android-shell) .label-editor,
    body:not(.android-shell) .print-toolbar {
      background: var(--desktop-panel) !important;
      border-color: var(--desktop-line) !important;
      color: var(--desktop-text) !important;
    }

    body:not(.android-shell) .receipt-wrap .receipt,
    body:not(.android-shell) .price-grid .price-card:not(.label-wysiwyg-card) {
      background: #111e2d !important;
      color: #edf6ff !important;
      border-color: rgba(165, 190, 214, .24) !important;
    }

    body:not(.android-shell) .receipt-wrap .receipt *,
    body:not(.android-shell) .price-grid .price-card:not(.label-wysiwyg-card) * {
      color: inherit !important;
    }

    body:not(.android-shell) .receipt-separator {
      border-top-color: rgba(237, 246, 255, .70) !important;
    }

    body:not(.android-shell) .support-card,
    body:not(.android-shell) .support-thread-row,
    body:not(.android-shell) .support-message,
    body:not(.android-shell) .support-chat-widget,
    body:not(.android-shell) .support-chat-widget-form {
      background: var(--desktop-panel-2) !important;
      color: var(--desktop-text) !important;
      border-color: var(--desktop-line) !important;
    }

    body:not(.android-shell) .support-logo.telegram,
    body:not(.android-shell) .support-logo.whatsapp {
      background: linear-gradient(135deg, #1b6d91, #123a55) !important;
    }

    body:not(.android-shell) .settings-mini,
    body:not(.android-shell) .settings-card,
    body:not(.android-shell) .section-card,
    body:not(.android-shell) .network-card,
    body:not(.android-shell) .integration-card,
    body:not(.android-shell) .legal-group,
    body:not(.android-shell) .legal-doc-row {
      background: var(--desktop-panel) !important;
      color: var(--desktop-text) !important;
      border-color: var(--desktop-line) !important;
    }

    body:not(.android-shell) .settings-mini-grid,
    body:not(.android-shell) .settings-profiles-grid,
    body:not(.android-shell) .form-grid {
      color: var(--desktop-text) !important;
    }

    body:not(.android-shell) .modal,
    body:not(.android-shell) .child-modal {
      animation: modalIn 180ms cubic-bezier(.18, .82, .22, 1) both !important;
    }

    body:not(.android-shell) .modal,
    body:not(.android-shell) .child-modal,
    body:not(.android-shell) .panel,
    body:not(.android-shell) .topline,
    body:not(.android-shell) .stat,
    body:not(.android-shell) .settings-card,
    body:not(.android-shell) .settings-mini {
      will-change: transform, opacity;
    }

    body:not(.android-shell) .sidebar {
      grid-template-rows: auto minmax(0, 1fr) auto !important;
      gap: 9px !important;
    }

    body:not(.android-shell) .nav {
      padding-top: 5px !important;
      gap: 3px !important;
    }

    body:not(.android-shell) .nav button {
      min-height: 32px !important;
      padding: 5px 8px !important;
      grid-template-columns: 26px minmax(0, 1fr) auto !important;
      gap: 8px !important;
      font-size: 12.5px !important;
      line-height: 1.12 !important;
    }

    body:not(.android-shell) .nav button > span:first-child {
      width: 20px !important;
      min-width: 20px !important;
      height: 20px !important;
      display: inline-grid !important;
      place-items: center !important;
      font-size: 17px !important;
      line-height: 1 !important;
    }

    body:not(.android-shell) .nav button > span:nth-child(2) {
      font-size: 12.5px !important;
      line-height: 1.12 !important;
      min-width: 0 !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
      white-space: nowrap !important;
    }

    body:not(.android-shell) .nav button .badge {
      min-width: 21px !important;
      padding: 1px 6px !important;
      font-size: 11px !important;
    }

    body:not(.android-shell) .shift-box.as-nav-note {
      max-height: 160px !important;
      gap: 5px !important;
      padding: 7px !important;
    }

    body:not(.android-shell) .shift-state-line {
      display: grid !important;
      grid-template-columns: 12px minmax(0, 1fr) !important;
      align-items: center !important;
      column-gap: 9px !important;
      min-height: 28px !important;
      padding: 5px 9px !important;
      overflow: hidden !important;
    }

    body:not(.android-shell) .shift-box.as-nav-note .shift-state-line {
      display: grid !important;
      grid-template-columns: 12px minmax(0, 1fr) !important;
      align-items: center !important;
      column-gap: 9px !important;
    }

    body:not(.android-shell) .shift-state-line strong,
    body:not(.android-shell) #shiftState {
      min-width: 0 !important;
      padding-left: 2px !important;
      color: #eaf6ff !important;
      font-size: 11.8px !important;
      line-height: 1.1 !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
      white-space: nowrap !important;
    }

    body:not(.android-shell) .shift-box.as-nav-note .shift-state-line strong,
    body:not(.android-shell) .shift-box.as-nav-note #shiftState {
      grid-column: 2 !important;
      display: block !important;
      min-width: 0 !important;
      padding-left: 2px !important;
      white-space: nowrap !important;
    }

    body:not(.android-shell) .shift-lamp,
    body:not(.android-shell) .shift-lamp.open {
      display: block !important;
      justify-self: center !important;
      align-self: center !important;
      width: 9px !important;
      min-width: 9px !important;
      max-width: 9px !important;
      height: 9px !important;
      min-height: 9px !important;
      max-height: 9px !important;
      flex: 0 0 9px !important;
      margin: 0 !important;
      border-radius: 999px !important;
      transform-origin: center !important;
    }

    body:not(.android-shell) .shift-box.as-nav-note .shift-lamp,
    body:not(.android-shell) .shift-box.as-nav-note .shift-lamp.open {
      grid-column: 1 !important;
      display: block !important;
      width: 9px !important;
      min-width: 9px !important;
      max-width: 9px !important;
      height: 9px !important;
      min-height: 9px !important;
      max-height: 9px !important;
      justify-self: center !important;
      align-self: center !important;
      margin: 0 !important;
    }

    body:not(.android-shell) .shift-lamp.open {
      background: #49d889 !important;
      box-shadow: 0 0 0 3px rgba(73, 216, 137, .12), 0 0 12px rgba(73, 216, 137, .48) !important;
    }

    @media (max-height: 740px) {
      body:not(.android-shell) .nav button {
        min-height: 31px !important;
        font-size: 12px !important;
      }

      body:not(.android-shell) .nav button > span:first-child {
        font-size: 16px !important;
      }

      body:not(.android-shell) .shift-box.as-nav-note {
        max-height: 154px !important;
      }
    }

    body:not(.android-shell) {
      --desktop-control-bg: #0a1421;
      --desktop-control-bg-2: #0e1c2d;
      --desktop-control-border: rgba(170, 197, 222, .24);
      --desktop-control-border-focus: rgba(114, 204, 236, .66);
      --desktop-control-text: #edf7ff;
      --desktop-control-muted: #a8b9c9;
      --desktop-surface: rgba(11, 21, 34, .96);
      --desktop-surface-2: rgba(14, 27, 43, .97);
      --desktop-surface-3: rgba(18, 34, 52, .98);
      --desktop-close-bg: rgba(17, 31, 48, .96);
      --desktop-close-hover: rgba(103, 48, 58, .96);
    }

    body:not(.android-shell) :where(input, select, textarea, .form-control, .field-control),
    body:not(.android-shell) :where(input[type="number"], input[type="date"], input[type="time"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="search"]) {
      background: linear-gradient(180deg, var(--desktop-control-bg-2), var(--desktop-control-bg)) !important;
      color: var(--desktop-control-text) !important;
      border: 1px solid var(--desktop-control-border) !important;
      border-radius: 10px !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045) !important;
      caret-color: #7bdcff !important;
      transition: border-color 150ms ease, box-shadow 150ms ease, background 150ms ease !important;
    }

    body:not(.android-shell) :where(input, select, textarea)::placeholder {
      color: var(--desktop-control-muted) !important;
      opacity: .82 !important;
    }

    body:not(.android-shell) :where(input, select, textarea):hover {
      border-color: rgba(150, 211, 238, .42) !important;
    }

    body:not(.android-shell) :where(input, select, textarea):focus,
    body:not(.android-shell) :where(input, select, textarea):focus-visible {
      outline: none !important;
      border-color: var(--desktop-control-border-focus) !important;
      box-shadow: 0 0 0 3px rgba(91, 200, 255, .14), inset 0 1px 0 rgba(255, 255, 255, .06) !important;
    }

    body:not(.android-shell) :where(input, select, textarea):disabled {
      opacity: .66 !important;
      color: rgba(237, 247, 255, .58) !important;
      background: rgba(8, 16, 27, .78) !important;
    }

    body:not(.android-shell) :where(select, input[type="date"], input[type="time"], input[type="datetime-local"]) {
      color-scheme: dark !important;
    }

    body:not(.android-shell) input[type="date"]::-webkit-calendar-picker-indicator,
    body:not(.android-shell) input[type="time"]::-webkit-calendar-picker-indicator,
    body:not(.android-shell) input[type="datetime-local"]::-webkit-calendar-picker-indicator {
      filter: invert(1) saturate(.7) brightness(1.25) !important;
      opacity: .74 !important;
    }

    body:not(.android-shell) :where(option, optgroup) {
      background: #0a1421 !important;
      color: #edf7ff !important;
    }

    body:not(.android-shell) :where(input[type="checkbox"], input[type="radio"]) {
      accent-color: #5bc8ff !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) :where(.modal, .child-modal, .drawer, .panel, .panel-body, .footer-panel, .sticky-footer, .table-wrap, .table-wrapper, .table-scroll, .shift-table-wrap, .notification-log-wrap, .preview-panel, .preview-container, .print-preview, .document-preview, .receipt-preview, .label-preview, .price-preview, .report-editor, .report-editor-sheet, .report-preview-modal, .bank-sales-sheet, .legal-preview-text, .pdf-preview, .receipt-wrap, .label-editor, .saved-labels, .print-toolbar) {
      background: linear-gradient(180deg, var(--desktop-surface-2), var(--desktop-surface)) !important;
      color: var(--desktop-control-text) !important;
      border-color: var(--desktop-control-border) !important;
      background-clip: padding-box !important;
      scrollbar-color: rgba(101, 184, 225, .72) rgba(7, 15, 25, .96) !important;
    }

    body:not(.android-shell) :where(.table-wrap, .table-wrapper, .table-scroll, .shift-table-wrap, .notification-log-wrap, .preview-panel, .preview-container, .print-preview, .document-preview, .receipt-preview, .label-preview, .price-preview, .report-editor, .report-editor-sheet, .report-preview-modal, .bank-sales-sheet, .legal-preview-text, .pdf-preview, .receipt-wrap) {
      border: 1px solid var(--desktop-control-border) !important;
      border-radius: 12px !important;
      overflow: auto !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035), 0 16px 34px rgba(0, 0, 0, .18) !important;
    }

    body:not(.android-shell) :where(.modal, .child-modal, .drawer, .panel, .report-preview-modal, .legal-preview-modal) {
      overflow: hidden !important;
      border: 1px solid rgba(170, 197, 222, .20) !important;
      box-shadow: 0 28px 80px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(255, 255, 255, .045) !important;
    }

    body:not(.android-shell) :where(.modal .panel-body, .child-modal .panel-body, .drawer .panel-body, .report-preview-modal .panel-body) {
      overflow: auto !important;
      border-radius: 0 !important;
      border-left: 0 !important;
      border-right: 0 !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) :where(.modal, .child-modal, .drawer, .panel, .table-wrap, .table-wrapper, .table-scroll, .preview-panel, .preview-container, .report-editor, .report-preview-modal, .legal-preview-text, .receipt-wrap)::before,
    body:not(.android-shell) :where(.modal, .child-modal, .drawer, .panel, .table-wrap, .table-wrapper, .table-scroll, .preview-panel, .preview-container, .report-editor, .report-preview-modal, .legal-preview-text, .receipt-wrap)::after {
      background-color: transparent !important;
    }

    body:not(.android-shell) :where(.modal, .child-modal, .drawer, .panel, .table-wrap, .table-wrapper, .table-scroll, .preview-panel, .preview-container, .report-editor, .report-preview-modal, .legal-preview-text, .receipt-wrap)::-webkit-scrollbar-track,
    body:not(.android-shell) :where(.modal .panel-body, .child-modal .panel-body, .drawer .panel-body, .view, .main)::-webkit-scrollbar-track {
      background: rgba(7, 15, 25, .96) !important;
      border-radius: 999px !important;
    }

    body:not(.android-shell) :where(.modal, .child-modal, .drawer, .panel, .table-wrap, .table-wrapper, .table-scroll, .preview-panel, .preview-container, .report-editor, .report-preview-modal, .legal-preview-text, .receipt-wrap)::-webkit-scrollbar-thumb,
    body:not(.android-shell) :where(.modal .panel-body, .child-modal .panel-body, .drawer .panel-body, .view, .main)::-webkit-scrollbar-thumb {
      background: linear-gradient(180deg, rgba(101, 184, 225, .86), rgba(54, 117, 161, .86)) !important;
      border: 2px solid rgba(7, 15, 25, .96) !important;
      border-radius: 999px !important;
    }

    body:not(.android-shell) :where(.modal-head, .panel-head, .drawer-head) {
      background: linear-gradient(180deg, #142436, #0d1928) !important;
      color: #f5fbff !important;
      border-bottom: 1px solid rgba(170, 197, 222, .18) !important;
      background-clip: padding-box !important;
    }

    body:not(.android-shell) :where(.modal-head h1, .modal-head h2, .modal-head h3, .modal-head h4, .panel-head h1, .panel-head h2, .panel-head h3, .panel-head h4) {
      color: #f5fbff !important;
    }

    body:not(.android-shell) :where([data-action="modal-close"], #confirmNoTop, #reportCloseNoTop, #exitCancelTop, #belowCostCancelTop, .modal-head .btn.small, .child-modal .modal-head .btn.small) {
      width: 42px !important;
      min-width: 42px !important;
      height: 42px !important;
      min-height: 42px !important;
      padding: 0 !important;
      display: inline-grid !important;
      place-items: center !important;
      border-radius: 12px !important;
      background: var(--desktop-close-bg) !important;
      color: #f8fbff !important;
      border: 1px solid rgba(190, 210, 230, .20) !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06) !important;
      font-size: 22px !important;
      font-weight: 700 !important;
      line-height: 1 !important;
      transition: background 150ms ease, border-color 150ms ease, transform 150ms ease, box-shadow 150ms ease !important;
    }

    body:not(.android-shell) :where([data-action="modal-close"], #confirmNoTop, #reportCloseNoTop, #exitCancelTop, #belowCostCancelTop, .modal-head .btn.small, .child-modal .modal-head .btn.small):hover {
      background: var(--desktop-close-hover) !important;
      border-color: rgba(255, 145, 145, .32) !important;
      transform: translateY(-1px) !important;
      box-shadow: 0 10px 22px rgba(0, 0, 0, .20), inset 0 1px 0 rgba(255, 255, 255, .06) !important;
    }

    body:not(.android-shell) :where([data-action="modal-close"], #confirmNoTop, #reportCloseNoTop, #exitCancelTop, #belowCostCancelTop, .modal-head .btn.small, .child-modal .modal-head .btn.small):focus-visible {
      outline: none !important;
      box-shadow: 0 0 0 3px rgba(91, 200, 255, .18), inset 0 1px 0 rgba(255, 255, 255, .06) !important;
    }

    body:not(.android-shell) :where(.row-actions, .modal .row-actions, .panel-footer, .modal-footer, .drawer-footer, .report-preview-modal .row-actions:last-child) {
      background: linear-gradient(180deg, rgba(11, 21, 34, .86), rgba(11, 21, 34, .98)) !important;
      border-color: rgba(170, 197, 222, .18) !important;
      background-clip: padding-box !important;
    }

    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="background:#fff"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="background: #fff"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="background:white"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="background: white"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="background-color:#fff"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="background-color: #fff"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="background-color:white"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="background-color: white"] {
      background: var(--desktop-surface-3) !important;
      color: var(--desktop-control-text) !important;
      border-color: var(--desktop-control-border) !important;
    }

    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="color:#111"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="color: #111"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="color:#222"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="color: #222"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="color:#333"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="color: #333"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="color:#666"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="color: #666"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="color:#777"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="color: #777"] {
      color: var(--desktop-control-text) !important;
    }

    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="border:1px solid #fff"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="border: 1px solid #fff"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="border-color:#fff"],
    body:not(.android-shell) :where(.view, .modal, .child-modal) [style*="border-color: #fff"] {
      border-color: var(--desktop-control-border) !important;
    }

    @keyframes desktopBackdropIn {
      from { opacity: 0; }
      to { opacity: 1; }
    }

    @keyframes desktopBackdropOut {
      from { opacity: 1; }
      to { opacity: 0; }
    }

    @keyframes desktopDialogIn {
      from { opacity: 0; transform: translateY(10px) scale(.985); }
      to { opacity: 1; transform: translateY(0) scale(1); }
    }

    @keyframes desktopDialogOut {
      from { opacity: 1; transform: translateY(0) scale(1); }
      to { opacity: 0; transform: translateY(8px) scale(.99); }
    }

    body:not(.android-shell) .modal-backdrop {
      animation: desktopBackdropIn 140ms ease-out both !important;
    }

    body:not(.android-shell) .modal-backdrop > .modal {
      animation: desktopDialogIn 180ms cubic-bezier(.18, .82, .22, 1) both !important;
    }

    body:not(.android-shell) .modal-backdrop.closing {
      pointer-events: none !important;
      animation: desktopBackdropOut 120ms ease-in both !important;
    }

    body:not(.android-shell) .modal-backdrop.closing > .modal {
      animation: desktopDialogOut 120ms ease-in both !important;
    }

    body.reduced-motion:not(.android-shell) .modal-backdrop,
    body.reduced-motion:not(.android-shell) .modal-backdrop > .modal,
    body.reduced-motion:not(.android-shell) .modal-backdrop.closing,
    body.reduced-motion:not(.android-shell) .modal-backdrop.closing > .modal {
      animation: none !important;
    }

    body:not(.android-shell) #view-dashboard .period-stat .mini-range {
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) !important;
      gap: 6px !important;
      margin-top: 8px !important;
    }

    body:not(.android-shell) #view-dashboard .period-stat .mini-date-field {
      display: grid !important;
      grid-template-columns: 20px minmax(0, 1fr) 32px !important;
      align-items: center !important;
      gap: 6px !important;
      min-width: 0 !important;
      padding: 0 !important;
      color: #dcecff !important;
    }

    body:not(.android-shell) #view-dashboard .period-stat .mini-date-field > span {
      color: #dcecff !important;
      font-size: 12px !important;
      line-height: 1 !important;
      text-align: center !important;
    }

    body:not(.android-shell) #view-dashboard .period-stat input[type="date"] {
      min-width: 0 !important;
      height: 30px !important;
      padding: 6px 8px !important;
      background: linear-gradient(180deg, #0e1c2d, #091322) !important;
      color: #eff8ff !important;
      border: 1px solid rgba(170, 197, 222, .26) !important;
      border-radius: 9px !important;
    }

    body:not(.android-shell) #view-dashboard .period-stat input[type="date"]::-webkit-calendar-picker-indicator {
      opacity: 0 !important;
      display: none !important;
    }

    body:not(.android-shell) #view-dashboard .date-picker-button {
      width: 32px !important;
      min-width: 32px !important;
      height: 30px !important;
      min-height: 30px !important;
      padding: 0 !important;
      display: inline-grid !important;
      place-items: center !important;
      border-radius: 9px !important;
      border: 1px solid rgba(170, 197, 222, .24) !important;
      background: linear-gradient(180deg, #14263a, #0d1928) !important;
      color: #eaf7ff !important;
      font-size: 15px !important;
      line-height: 1 !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
    }

    body:not(.android-shell) #view-dashboard .date-picker-button:hover,
    body:not(.android-shell) #view-dashboard .date-picker-button:focus-visible {
      border-color: rgba(114, 204, 236, .58) !important;
      background: linear-gradient(180deg, #1a324c, #102235) !important;
      outline: none !important;
    }

    body:not(.android-shell) #view-dashboard .quick-money-panel {
      min-height: 162px !important;
      overflow: hidden !important;
      border-radius: 12px !important;
    }

    body:not(.android-shell) #view-dashboard .quick-money-panel .panel-head {
      border-radius: 12px 12px 0 0 !important;
    }

    body:not(.android-shell) #view-dashboard .quick-money-panel .row-actions {
      display: flex !important;
      flex-wrap: wrap !important;
      align-items: center !important;
      justify-content: flex-end !important;
      gap: 8px !important;
      background: transparent !important;
      border: 0 !important;
      padding: 0 !important;
    }

    body:not(.android-shell) #view-dashboard .quick-money-panel .row-actions .btn {
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      min-width: 154px !important;
      opacity: 1;
    }

    body:not(.android-shell) .history-cell.compact-event.event-button {
      background: linear-gradient(180deg, rgba(15, 27, 43, .98), rgba(9, 17, 29, .98)) !important;
      border-color: rgba(170, 197, 222, .18) !important;
      color: #eef7ff !important;
    }

    body:not(.android-shell) .history-cell.compact-event.event-button:hover {
      background: linear-gradient(180deg, rgba(20, 38, 58, .98), rgba(11, 22, 36, .98)) !important;
      border-color: rgba(114, 204, 236, .34) !important;
    }

    body:not(.android-shell) .event-date-cell {
      display: grid !important;
      gap: 5px !important;
      align-content: center !important;
      color: #eef7ff !important;
    }

    body:not(.android-shell) .event-date-cell strong {
      display: block !important;
      color: #ffffff !important;
      font-size: 13px !important;
      font-weight: 800 !important;
      line-height: 1.1 !important;
    }

    body:not(.android-shell) .event-date-cell span {
      display: block !important;
      color: #bdcce0 !important;
      font-size: 12px !important;
      line-height: 1.15 !important;
    }

    body:not(.android-shell) .event-copy-cell,
    body:not(.android-shell) .event-copy-cell strong,
    body:not(.android-shell) .event-copy-cell span:not(.tag) {
      color: #e8f3ff !important;
    }

    body:not(.android-shell) .event-copy-cell span:not(.tag) {
      color: #b9c9dc !important;
    }

    body:not(.android-shell) .event-copy-cell .tag {
      color: #eaf5ff !important;
      background: rgba(43, 65, 90, .72) !important;
      border-color: rgba(170, 197, 222, .20) !important;
    }

    body:not(.android-shell) #view-dashboard .dashboard-events-panel {
      min-width: 0 !important;
      overflow: hidden !important;
      border-radius: 14px !important;
      background: linear-gradient(180deg, rgba(12, 23, 38, .96), rgba(7, 14, 25, .96)) !important;
      border: 1px solid rgba(170, 197, 222, .16) !important;
    }

    body:not(.android-shell) #view-dashboard .dashboard-events-panel .panel-head {
      border-radius: 14px 14px 0 0 !important;
      background: rgba(16, 29, 47, .88) !important;
      border-bottom: 1px solid rgba(170, 197, 222, .13) !important;
    }

    body:not(.android-shell) #view-dashboard .dashboard-events-panel .panel-body {
      padding: 12px !important;
      background: transparent !important;
      overflow: hidden !important;
    }

    body:not(.android-shell) #view-dashboard .dashboard-events-panel .history-list {
      display: grid !important;
      gap: 10px !important;
      min-width: 0 !important;
    }

    body:not(.android-shell) #view-dashboard .dashboard-events-panel .history-cell.compact-event {
      display: block !important;
      min-width: 0 !important;
      padding: 0 !important;
      border: 1px solid rgba(156, 184, 213, .18) !important;
      border-radius: 14px !important;
      background: linear-gradient(180deg, rgba(15, 27, 43, .97), rgba(8, 16, 29, .97)) !important;
      box-shadow: 0 14px 32px rgba(0, 0, 0, .20), inset 0 1px 0 rgba(255, 255, 255, .04) !important;
      overflow: hidden !important;
    }

    body:not(.android-shell) #view-dashboard .dashboard-events-panel .history-main-button.event-button,
    body:not(.android-shell) .history-cell.compact-event > .history-main-button.event-button {
      width: 100% !important;
      min-width: 0 !important;
      display: grid !important;
      grid-template-columns: minmax(92px, .54fr) minmax(0, 1.7fr) minmax(84px, auto) !important;
      align-items: center !important;
      gap: 12px !important;
      padding: 13px 14px !important;
      border: 0 !important;
      border-radius: 14px !important;
      background: transparent !important;
      color: #eef7ff !important;
      text-align: left !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) #view-dashboard .dashboard-events-panel .history-main-button.event-button:hover {
      background: rgba(80, 120, 168, .10) !important;
    }

    body:not(.android-shell) #view-dashboard .dashboard-events-panel .event-date-cell {
      min-width: 0 !important;
      padding: 8px 10px !important;
      border-radius: 11px !important;
      background: rgba(9, 18, 32, .62) !important;
      border: 1px solid rgba(170, 197, 222, .12) !important;
    }

    body:not(.android-shell) #view-dashboard .dashboard-events-panel .event-copy-cell {
      min-width: 0 !important;
      overflow: hidden !important;
    }

    body:not(.android-shell) #view-dashboard .dashboard-events-panel .event-copy-cell strong,
    body:not(.android-shell) #view-dashboard .dashboard-events-panel .event-copy-cell span:not(.tag) {
      max-width: 100% !important;
      overflow-wrap: anywhere !important;
    }

    body:not(.android-shell) #view-dashboard .dashboard-events-panel .history-item-actions {
      display: none !important;
    }

    body:not(.android-shell) .event-side-meta {
      min-width: 0 !important;
      display: inline-grid !important;
      justify-items: end !important;
      align-content: center !important;
      gap: 6px !important;
      color: #eef7ff !important;
    }

    body:not(.android-shell) .event-side-meta:empty {
      display: none !important;
    }

    body:not(.android-shell) .event-side-meta .event-amount {
      color: #f4fbff !important;
      font-size: 13px !important;
      font-weight: 850 !important;
      line-height: 1.15 !important;
      white-space: nowrap !important;
    }

    body:not(.android-shell) .event-status-badge {
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      min-height: 24px !important;
      max-width: 100% !important;
      padding: 4px 9px !important;
      border-radius: 999px !important;
      border: 1px solid rgba(170, 197, 222, .22) !important;
      background: rgba(43, 65, 90, .72) !important;
      color: #edf7ff !important;
      font-size: 11px !important;
      font-weight: 800 !important;
      line-height: 1.1 !important;
      white-space: nowrap !important;
    }

    body:not(.android-shell) .event-status-badge.warning {
      border-color: rgba(245, 158, 11, .34) !important;
      background: rgba(245, 158, 11, .13) !important;
      color: #fdecc8 !important;
    }

    body:not(.android-shell) .event-status-badge.danger {
      border-color: rgba(248, 113, 113, .38) !important;
      background: rgba(248, 113, 113, .13) !important;
      color: #ffd2d2 !important;
    }

    body:not(.android-shell) .event-detail-modal,
    body:not(.android-shell) .event-detail-modal .event-detail-body {
      background: linear-gradient(180deg, rgba(14, 27, 43, .98), rgba(9, 17, 29, .98)) !important;
      color: #edf7ff !important;
      background-clip: padding-box !important;
    }

    body:not(.android-shell) .event-detail-body {
      display: flex !important;
      flex-direction: column !important;
      gap: 14px !important;
      max-height: min(72vh, 720px) !important;
      overflow: hidden !important;
      padding: 16px !important;
    }

    body:not(.android-shell) .event-detail-table-wrap {
      flex: 1 1 auto !important;
      min-height: 0 !important;
      overflow: auto !important;
      border: 1px solid rgba(170, 197, 222, .18) !important;
      border-radius: 12px !important;
      background: rgba(8, 16, 27, .96) !important;
    }

    body:not(.android-shell) .event-detail-table-wrap table {
      margin: 0 !important;
      width: 100% !important;
    }

    body:not(.android-shell) .event-detail-footer {
      flex: 0 0 auto !important;
      position: static !important;
      display: flex !important;
      flex-wrap: wrap !important;
      justify-content: flex-end !important;
      gap: 10px !important;
      margin: 0 !important;
      padding: 12px !important;
      border: 1px solid rgba(170, 197, 222, .16) !important;
      border-radius: 12px !important;
      background: rgba(12, 23, 37, .96) !important;
      background-color: rgba(12, 23, 37, .96) !important;
      background-image: none !important;
      box-shadow: none !important;
    }

    .held-receipt-row {
      grid-template-columns: minmax(0, 1fr) 120px minmax(230px, auto) !important;
      align-items: center !important;
    }

    .held-receipt-row .row-actions {
      display: flex !important;
      flex-wrap: nowrap !important;
      gap: 8px !important;
    }

    .held-receipt-row .row-actions .btn {
      min-width: 106px !important;
      white-space: nowrap !important;
    }

    @media (max-width: 760px) {
      .held-receipt-row { grid-template-columns: minmax(0, 1fr) !important; }
      .held-receipt-row .row-actions { flex-wrap: wrap !important; }
    }

    body:not(.android-shell) #view-pos {
      min-width: 0 !important;
    }

    body:not(.android-shell) #view-pos .two-col {
      align-items: stretch !important;
      gap: 14px !important;
    }

    body:not(.android-shell) #view-pos .panel,
    body:not(.android-shell) #view-pos .panel-body,
    body:not(.android-shell) #view-pos .toolbar,
    body:not(.android-shell) #view-pos .cart-list,
    body:not(.android-shell) #view-pos .return-sales-list,
    body:not(.android-shell) #view-pos .total-box {
      background-clip: padding-box !important;
      box-sizing: border-box !important;
    }

    body:not(.android-shell) #view-pos .pos-cart-panel,
    body:not(.android-shell) #view-pos .pos-payment-panel {
      background: linear-gradient(180deg, rgba(14, 27, 43, .98), rgba(8, 16, 27, .98)) !important;
      border-color: rgba(170, 197, 222, .18) !important;
      border-radius: 12px !important;
      overflow: hidden !important;
    }

    body:not(.android-shell) #view-pos .pos-cart-toolbar,
    body:not(.android-shell) #view-pos > .two-col > .panel > .toolbar {
      width: 100% !important;
      display: grid !important;
      grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)) !important;
      align-items: center !important;
      gap: 10px !important;
      margin: 0 !important;
      padding: 12px !important;
      border: 0 !important;
      border-bottom: 1px solid rgba(170, 197, 222, .16) !important;
      border-radius: 0 !important;
      background: rgba(10, 20, 33, .98) !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) #view-pos > .two-col > .panel > .toolbar.pos-return-toolbar,
    body:not(.android-shell) #view-pos .pos-return-toolbar {
      grid-template-columns: minmax(260px, 1fr) minmax(120px, auto) !important;
    }

    body:not(.android-shell) #view-pos .pos-cart-toolbar .btn,
    body:not(.android-shell) #view-pos > .two-col > .panel > .toolbar .btn {
      min-width: 0 !important;
      width: 100% !important;
    }

    body:not(.android-shell) #view-pos .pos-payment-panel .panel-head,
    body:not(.android-shell) #view-pos .pos-receipts-history .panel-head {
      background: linear-gradient(180deg, #142436, #0d1928) !important;
      border-bottom-color: rgba(170, 197, 222, .18) !important;
    }

    body:not(.android-shell) #view-pos .pos-payment-panel .panel-body,
    body:not(.android-shell) #view-pos .pos-cart-panel .panel-body {
      background: rgba(9, 17, 29, .98) !important;
    }

    body:not(.android-shell) #view-pos .payment-counterparty-card {
      background: linear-gradient(180deg, rgba(13, 25, 40, .98), rgba(8, 16, 27, .98)) !important;
      border-color: rgba(170, 197, 222, .20) !important;
      border-radius: 12px !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
    }

    body:not(.android-shell) #view-pos .payment-counterparty-label {
      display: block !important;
      color: #dceaff !important;
      font-size: 13px !important;
      font-weight: 800 !important;
      letter-spacing: 0 !important;
      margin-bottom: 3px !important;
    }

    body:not(.android-shell) #view-pos .payment-counterparty-value {
      display: block !important;
      color: #f6fbff !important;
      font-size: 14px !important;
      font-weight: 500 !important;
      line-height: 1.25 !important;
    }

    body:not(.android-shell) #view-pos label,
    body:not(.android-shell) #view-pos .total-line span {
      color: #dceaff !important;
      font-weight: 700 !important;
    }

    body:not(.android-shell) #view-pos input,
    body:not(.android-shell) #view-pos select,
    body:not(.android-shell) #view-pos textarea {
      background: linear-gradient(180deg, #0e1c2d, #091322) !important;
      color: #eff8ff !important;
      border-color: rgba(170, 197, 222, .26) !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
    }

    body:not(.android-shell) #view-pos input::placeholder,
    body:not(.android-shell) #view-pos textarea::placeholder {
      color: rgba(190, 206, 224, .72) !important;
    }

    body:not(.android-shell) #view-pos .total-box {
      display: grid !important;
      gap: 8px !important;
      padding: 14px !important;
      border: 1px solid rgba(170, 197, 222, .16) !important;
      border-radius: 12px !important;
      background: linear-gradient(180deg, rgba(13, 25, 40, .96), rgba(8, 16, 27, .98)) !important;
      color: #edf7ff !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) #view-pos .total-line {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      gap: 12px !important;
      color: #edf7ff !important;
    }

    body:not(.android-shell) #view-pos .total-line span {
      color: #c8d8ea !important;
      font-weight: 700 !important;
    }

    body:not(.android-shell) #view-pos .total-line strong {
      color: #f7fbff !important;
      font-weight: 800 !important;
    }

    body:not(.android-shell) #view-pos .total-line.big {
      padding-top: 8px !important;
      border-top: 1px solid rgba(170, 197, 222, .16) !important;
    }

    body:not(.android-shell) #view-pos .total-line.big span,
    body:not(.android-shell) #view-pos .total-line.big strong {
      color: #ffffff !important;
      font-size: 22px !important;
    }

    body:not(.android-shell) #view-pos .cart-list {
      min-height: 112px !important;
      padding: 10px !important;
      border: 1px solid rgba(170, 197, 222, .16) !important;
      border-radius: 12px !important;
      background: rgba(8, 16, 27, .92) !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
    }

    body:not(.android-shell) #view-pos .cart-list > .empty {
      min-height: 72px !important;
      display: grid !important;
      place-items: center !important;
      border: 1px solid rgba(170, 197, 222, .16) !important;
      border-radius: 12px !important;
      background: rgba(11, 22, 36, .96) !important;
      color: #dceaff !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) #view-pos .cart-item {
      background: linear-gradient(180deg, rgba(13, 25, 40, .98), rgba(8, 16, 27, .98)) !important;
      border-color: rgba(170, 197, 222, .18) !important;
      border-radius: 12px !important;
      color: #edf7ff !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) #view-pos .cart-item.stock-warning {
      background: linear-gradient(180deg, rgba(52, 24, 29, .94), rgba(25, 16, 24, .96)) !important;
      border-color: rgba(255, 143, 143, .32) !important;
    }

    body:not(.android-shell) #view-pos .cart-item span {
      color: #b9c9dc !important;
    }

    body:not(.android-shell) #view-pos .cart-item input[data-action="cart-qty"] {
      min-width: 0 !important;
      text-align: center !important;
      font-weight: 800 !important;
    }

    body:not(.android-shell) #view-pos .return-sales-list {
      padding: 10px !important;
      border: 1px solid rgba(170, 197, 222, .16) !important;
      border-radius: 12px !important;
      background: rgba(8, 16, 27, .92) !important;
    }

    body:not(.android-shell) #view-pos .return-sale-row {
      background: linear-gradient(180deg, rgba(13, 25, 40, .98), rgba(8, 16, 27, .98)) !important;
      border-color: rgba(170, 197, 222, .18) !important;
      color: #edf7ff !important;
      border-radius: 12px !important;
    }

    body:not(.android-shell) #view-pos .return-sale-row span,
    body:not(.android-shell) #view-pos .return-sale-row strong {
      color: #edf7ff !important;
    }

    body:not(.android-shell) #view-pos .pos-receipts-history {
      background: linear-gradient(180deg, rgba(14, 27, 43, .98), rgba(8, 16, 27, .98)) !important;
      border-color: rgba(170, 197, 222, .18) !important;
      border-radius: 12px !important;
      overflow: hidden !important;
    }

    body:not(.android-shell) #view-pos .pos-receipts-history table {
      margin: 0 !important;
      width: 100% !important;
    }

    body:not(.android-shell) #view-pos .pos-receipts-history th,
    body:not(.android-shell) #view-pos .pos-receipts-history td {
      color: #eaf5ff !important;
    }

    body:not(.android-shell) #view-pos .pos-receipts-history td span {
      color: #b9c9dc !important;
    }

    body:not(.android-shell) .document-modal {
      width: min(1180px, calc(100vw - 56px)) !important;
      max-width: min(1180px, calc(100vw - 56px)) !important;
      background: linear-gradient(180deg, #0f1c2c, #0a1421) !important;
      color: #eef7ff !important;
      overflow: hidden !important;
      background-clip: padding-box !important;
    }

    body:not(.android-shell) .document-edit-modal {
      width: min(1120px, calc(100vw - 56px)) !important;
      max-width: min(1120px, calc(100vw - 56px)) !important;
    }

    body:not(.android-shell) .document-modal .modal-head {
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) auto !important;
      align-items: center !important;
      gap: 12px !important;
      padding-right: 14px !important;
      background: linear-gradient(180deg, #142436, #0d1928) !important;
    }

    body:not(.android-shell) .document-modal .panel-body {
      background: linear-gradient(180deg, rgba(13, 25, 40, .98), rgba(8, 17, 29, .98)) !important;
      color: #eef7ff !important;
      scrollbar-color: rgba(101, 184, 225, .72) rgba(7, 15, 25, .96) !important;
    }

    body:not(.android-shell) .document-modal table,
    body:not(.android-shell) #view-documents table,
    body:not(.android-shell) .document-template-table-preview table {
      width: 100% !important;
      border-collapse: separate !important;
      border-spacing: 0 !important;
      table-layout: auto !important;
      background: rgba(8, 17, 29, .96) !important;
      color: #eef7ff !important;
      border: 1px solid rgba(170, 197, 222, .18) !important;
      border-radius: 12px !important;
      overflow: hidden !important;
    }

    body:not(.android-shell) .document-modal th,
    body:not(.android-shell) .document-modal td,
    body:not(.android-shell) #view-documents th,
    body:not(.android-shell) #view-documents td,
    body:not(.android-shell) .document-template-table-preview th,
    body:not(.android-shell) .document-template-table-preview td {
      color: #eaf4ff !important;
      background: rgba(9, 19, 32, .94) !important;
      border-color: rgba(170, 197, 222, .14) !important;
      white-space: normal !important;
      word-break: normal !important;
      overflow-wrap: anywhere !important;
      line-height: 1.35 !important;
      min-width: 96px !important;
    }

    body:not(.android-shell) .document-modal th,
    body:not(.android-shell) #view-documents th,
    body:not(.android-shell) .document-template-table-preview th {
      background: rgba(20, 36, 54, .98) !important;
      color: #ffffff !important;
      font-weight: 800 !important;
    }

    body:not(.android-shell) .document-empty-items {
      padding: 18px;
      border: 1px dashed rgba(170, 197, 222, .24);
      border-radius: 12px;
      color: #bdd0e5;
      background: rgba(8, 17, 29, .72);
      text-align: center;
    }

    body:not(.android-shell) .document-modal-footer {
      position: sticky;
      bottom: 0;
      z-index: 5;
      display: flex !important;
      flex-wrap: wrap !important;
      gap: 8px !important;
      justify-content: flex-end !important;
      padding: 12px 14px !important;
      margin: 14px -14px -14px !important;
      border-top: 1px solid rgba(170, 197, 222, .18) !important;
      background: linear-gradient(180deg, rgba(13, 25, 40, .94), rgba(8, 17, 29, .99)) !important;
      backdrop-filter: blur(12px);
    }

    body:not(.android-shell) .document-detail-modal .total-box {
      margin-bottom: 16px !important;
      background: rgba(12, 25, 40, .92) !important;
      color: #eef7ff !important;
    }

    body:not(.android-shell) .document-detail-modal .event-list {
      margin-top: 14px !important;
    }

    body:not(.android-shell) .document-print-modal {
      width: min(1320px, calc(100vw - 44px)) !important;
      max-width: min(1320px, calc(100vw - 44px)) !important;
    }

    body:not(.android-shell) .document-print-modal-body {
      padding: 18px !important;
      max-height: min(72vh, 760px) !important;
      overflow: auto !important;
      background: #0b1624 !important;
    }

    body:not(.android-shell) .document-print-preview {
      min-width: min(1080px, 100%);
      padding: 18px;
      border: 1px solid rgba(170, 197, 222, .18);
      border-radius: 16px;
      background: rgba(5, 12, 21, .78);
      overflow: auto;
    }

    body:not(.android-shell) .document-print-page {
      width: min(1120px, 100%);
      margin: 0 auto;
      padding: 28px;
      border-radius: 10px;
      background: #ffffff;
      color: #111827;
      box-shadow: 0 22px 60px rgba(0, 0, 0, .32);
      font: 13px/1.42 "Segoe UI", Arial, sans-serif;
    }

    body:not(.android-shell) .document-print-page h2,
    body:not(.android-shell) .document-print-page h3 {
      color: #111827 !important;
      margin: 0 0 10px;
    }

    body:not(.android-shell) .document-print-page .report-meta {
      color: #000000 !important;
      margin-bottom: 14px;
      font-weight: 600 !important;
    }

    body:not(.android-shell) .document-print-page table {
      width: 100%;
      table-layout: fixed;
      border-collapse: collapse;
      margin: 0 0 18px;
      color: #111827;
      background: #ffffff;
      border: 2px solid #000000 !important;
    }

    body:not(.android-shell) .document-print-page th,
    body:not(.android-shell) .document-print-page td {
      padding: 8px 9px;
      border: 1.5px solid #000000 !important;
      color: #000000 !important;
      background: #ffffff !important;
      vertical-align: top;
      white-space: normal;
      overflow-wrap: break-word;
      word-break: normal;
      line-height: 1.35;
    }

    body:not(.android-shell) .document-print-page th {
      background: #ffffff !important;
      color: #000000 !important;
      font-weight: 800;
    }

    body:not(.android-shell) .document-print-page,
    body:not(.android-shell) .document-print-page * {
      color: #000000 !important;
      -webkit-print-color-adjust: exact !important;
      print-color-adjust: exact !important;
    }

    body:not(.android-shell) #view-documents tr[data-document-row] {
      cursor: pointer !important;
      transition: background 140ms ease, border-color 140ms ease, transform 140ms ease !important;
    }

    body:not(.android-shell) #view-documents tr[data-document-row]:hover td {
      background: rgba(18, 35, 54, .98) !important;
      border-color: rgba(114, 204, 236, .26) !important;
    }

    body:not(.android-shell) #view-documents tr[data-document-row]:focus-within td {
      border-color: rgba(114, 204, 236, .38) !important;
    }

    body:not(.android-shell) .document-template-fields {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }

    body:not(.android-shell) .document-template-fields span {
      padding: 6px 9px;
      border: 1px solid rgba(170, 197, 222, .20);
      border-radius: 999px;
      background: rgba(15, 29, 46, .92);
      color: #dfeeff;
      font-size: 12px;
      font-weight: 700;
    }

    body:not(.android-shell) .document-template-table-preview {
      overflow: auto;
      border-radius: 12px;
    }

    body:not(.android-shell) .document-template-field-editor {
      display: grid;
      gap: 10px;
      padding: 12px;
      border: 1px solid rgba(170, 197, 222, .18);
      border-radius: 14px;
      background: rgba(8, 17, 29, .72);
    }

    body:not(.android-shell) .document-template-field-editor h4 {
      margin: 0;
      color: #ffffff;
    }

    body:not(.android-shell) .document-template-field-row {
      display: grid;
      grid-template-columns: minmax(130px, auto) minmax(0, 1fr);
      gap: 8px;
      align-items: center;
    }

    @media print {
      #printRoot.report-print {
        font-family: "Segoe UI", Arial, sans-serif !important;
        font-size: 10px !important;
      }

      #printRoot.report-print table {
        table-layout: fixed !important;
      }

      #printRoot.report-print th,
      #printRoot.report-print td {
        white-space: normal !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
        line-height: 1.25 !important;
      }
    }
    body:not(.android-shell) #view-receipts .receipt-wrap {
      --receipt-preview-scale: 1.24;
      align-content: center !important;
      justify-items: center !important;
      place-items: center !important;
      align-self: start !important;
      min-height: 0 !important;
      height: auto !important;
      max-height: calc(100vh - 260px) !important;
      overflow: auto !important;
      padding: clamp(14px, 2vw, 28px) !important;
    }

    body:not(.android-shell) #view-receipts .receipt-wrap .receipt,
    body:not(.android-shell) #view-receipts #receiptPrint {
      min-height: 0 !important;
      height: auto !important;
      align-self: center !important;
      justify-self: center !important;
      transform: none !important;
      zoom: var(--receipt-preview-scale);
      margin: 0 !important;
      background: #ffffff !important;
      color: #111111 !important;
      border: 1px dashed #111111 !important;
      box-shadow: 0 18px 36px rgba(0, 0, 0, .32) !important;
    }

    body:not(.android-shell) #view-receipts .receipt-wrap .receipt *,
    body:not(.android-shell) #view-receipts #receiptPrint * {
      color: #111111 !important;
    }

    body:not(.android-shell) #view-receipts .receipt-separator {
      border-top-color: #111111 !important;
    }

    body:not(.android-shell) #view-receipts .form-grid input,
    body:not(.android-shell) #view-receipts .form-grid select,
    body:not(.android-shell) #view-receipts .form-grid textarea {
      background: var(--desktop-field) !important;
      color: var(--desktop-text) !important;
      border-color: var(--desktop-line-strong) !important;
    }

    body:not(.android-shell) #labelPreviewCard {
      background: #ffffff !important;
      color: var(--label-preview-color, #111111) !important;
      border-color: #111111 !important;
      min-height: var(--label-preview-height, 200px) !important;
      width: var(--label-preview-width, 300px) !important;
    }

    body:not(.android-shell) #labelPreviewCard * {
      color: inherit !important;
    }

    body:not(.android-shell) #labelPreviewCard .price {
      color: var(--label-price-color, #111111) !important;
    }

    body:not(.android-shell) :is(#view-receipts, #view-labels) #labelPreviewCard,
    body:not(.android-shell) :is(#view-receipts, #view-labels) .label-card-render {
      position: relative !important;
      overflow: hidden !important;
      font-family: var(--label-font, Arial, sans-serif) !important;
      font-size: var(--label-font-size, 16px) !important;
    }

    body:not(.android-shell) :is(#view-receipts, #view-labels) #labelPreviewCard {
      box-shadow: 0 18px 40px rgba(0, 0, 0, .28) !important;
    }

    body:not(.android-shell) :is(#view-receipts, #view-labels) .label-edit-element {
      position: absolute !important;
      z-index: 3 !important;
      max-width: 78% !important;
      padding: 3px 6px !important;
      border: 1px solid transparent !important;
      border-radius: 8px !important;
      background: transparent !important;
      color: inherit !important;
      cursor: grab !important;
      user-select: none !important;
      line-height: 1.18 !important;
      overflow-wrap: anywhere !important;
      transition: border-color .16s ease, background .16s ease, box-shadow .16s ease !important;
    }

    body:not(.android-shell) :is(#view-receipts, #view-labels) .label-edit-element:hover,
    body:not(.android-shell) :is(#view-receipts, #view-labels) .label-edit-element.active {
      border-color: rgba(22, 198, 255, .72) !important;
      background: rgba(22, 198, 255, .12) !important;
      box-shadow: 0 0 0 3px rgba(22, 198, 255, .12) !important;
    }

    body:not(.android-shell) :is(#view-receipts, #view-labels) .label-drag-handle {
      position: absolute !important;
      top: -8px !important;
      right: -8px !important;
      width: 15px !important;
      height: 15px !important;
      border-radius: 999px !important;
      background: linear-gradient(135deg, #19d3ff, #7c5cff) !important;
      border: 2px solid #ffffff !important;
      box-shadow: 0 6px 12px rgba(0, 0, 0, .28) !important;
      opacity: 0 !important;
      transition: opacity .16s ease !important;
    }

    body:not(.android-shell) :is(#view-receipts, #view-labels) .label-edit-element:hover .label-drag-handle,
    body:not(.android-shell) :is(#view-receipts, #view-labels) .label-edit-element.active .label-drag-handle {
      opacity: 1 !important;
    }

    body:not(.android-shell) :is(#view-receipts, #view-labels) .label-name {
      font-weight: 900 !important;
      font-size: 1.1em !important;
    }

    body:not(.android-shell) :is(#view-receipts, #view-labels) .label-description,
    body:not(.android-shell) :is(#view-receipts, #view-labels) .label-sku {
      font-size: .9em !important;
    }

    body:not(.android-shell) :is(#view-receipts, #view-labels) .label-price {
      color: var(--label-price-color, #111111) !important;
      font-weight: 900 !important;
      font-size: 1.7em !important;
    }

    body:not(.android-shell) :is(#view-receipts, #view-labels) .label-bg-image,
    body:not(.android-shell) :is(#view-receipts, #view-labels) .label-card-logo-floating {
      pointer-events: none !important;
    }

    body:not(.android-shell) :is(#view-receipts, #view-labels) .label-create-preview-shell {
      display: grid !important;
      gap: 10px !important;
      justify-items: center !important;
      padding: 14px !important;
      border: 1px solid var(--desktop-line) !important;
      border-radius: 14px !important;
      background: rgba(8, 16, 27, .56) !important;
      overflow: auto !important;
    }

    body:not(.android-shell) :is(#view-receipts, #view-labels) .modal-footer-actions {
      display: flex !important;
      justify-content: flex-end !important;
      gap: 10px !important;
      padding-top: 4px !important;
    }

    @media (min-width: 1500px) {
      body:not(.android-shell) #view-receipts .receipt-wrap {
        --receipt-preview-scale: 1.38;
        max-height: calc(100vh - 240px) !important;
      }
    }

    @media (min-width: 1800px) and (min-height: 880px) {
      body:not(.android-shell) #view-receipts .receipt-wrap {
        --receipt-preview-scale: 1.5;
        max-height: calc(100vh - 240px) !important;
      }
    }

    @media (max-height: 760px) {
      body:not(.android-shell) #view-receipts .receipt-wrap {
        --receipt-preview-scale: 1.1;
        min-height: 0 !important;
        max-height: calc(100vh - 220px) !important;
      }
    }

    body:not(.android-shell) #view-notes .notes,
    body:not(.android-shell) #view-notes .notes-board {
      grid-template-columns: repeat(auto-fill, minmax(270px, 340px)) !important;
      gap: 14px !important;
    }

    body:not(.android-shell) #view-notes .note,
    body:not(.android-shell) #view-notes .note-wide,
    body:not(.android-shell) #view-notes .note-large {
      min-height: 220px !important;
      max-height: 420px !important;
    }

    body:not(.android-shell) #view-notes .note p {
      min-height: 96px !important;
      max-height: 250px !important;
    }

    body:not(.android-shell) #view-settings :where(.network-card, .settings-card, .settings-mini, .settings-subblock, .logo-helper-card) {
      background: var(--desktop-panel) !important;
      color: var(--desktop-text) !important;
      border-color: var(--desktop-line) !important;
      box-shadow: 0 14px 32px rgba(0, 0, 0, .22) !important;
    }

    body:not(.android-shell) #view-settings :where(input, select, textarea) {
      background: var(--desktop-field) !important;
      color: var(--desktop-text) !important;
      border-color: var(--desktop-line-strong) !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) #view-settings :where(input::placeholder, textarea::placeholder) {
      color: var(--desktop-muted) !important;
      opacity: .95 !important;
    }

    body:not(.android-shell) #view-settings input[type="file"] {
      padding: 7px !important;
    }

    body:not(.android-shell) #view-settings input[type="file"]::file-selector-button {
      background: #1f3441 !important;
      color: var(--desktop-text) !important;
      border: 1px solid var(--desktop-line-strong) !important;
      border-radius: 7px !important;
      padding: 7px 10px !important;
      margin-right: 10px !important;
    }

    body:not(.android-shell) #view-settings .network-devices-section,
    body:not(.android-shell) #view-settings .network-log-section,
    body:not(.android-shell) #view-settings .report-settings-editor {
      display: none !important;
    }

    body:not(.android-shell) #view-settings :where(.toggle-line, .checkbox-line, .check-line) {
      background: rgba(7, 15, 27, .72) !important;
      border: 1px solid rgba(128, 154, 184, .22) !important;
      border-radius: 12px !important;
      color: var(--desktop-text) !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035) !important;
    }

    body:not(.android-shell) #view-settings :where(.toggle-line, .checkbox-line, .check-line) span {
      color: #e8f1fb !important;
      line-height: 1.35 !important;
    }

    body:not(.android-shell) #view-settings :where(.toggle-line, .checkbox-line, .check-line) input[type="checkbox"] {
      accent-color: #4d8dff !important;
    }

    body:not(.android-shell) #view-settings .network-metric {
      background: rgba(7, 15, 27, .68) !important;
      border: 1px solid rgba(128, 154, 184, .22) !important;
      border-radius: 12px !important;
      color: var(--desktop-text) !important;
      box-shadow: none !important;
    }

    body:not(.android-shell) #view-settings .network-metric span {
      color: #a9bed2 !important;
      font-weight: 700 !important;
      letter-spacing: 0 !important;
    }

    body:not(.android-shell) #view-settings .network-metric strong {
      color: #f4f8ff !important;
      font-weight: 900 !important;
    }

    body:not(.android-shell) #view-settings .network-rights-card {
      display: grid !important;
      gap: 10px !important;
      align-content: start !important;
    }

    body:not(.android-shell) #view-settings .network-rights-tile {
      padding: 10px 12px !important;
      border-radius: 12px !important;
      background: rgba(6, 14, 25, .78) !important;
      border: 1px solid rgba(128, 154, 184, .22) !important;
      color: var(--desktop-text) !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035) !important;
    }

    body:not(.android-shell) #view-settings .network-rights-tile strong {
      color: #f5f9ff !important;
      font-weight: 850 !important;
    }

    body:not(.android-shell) #view-settings .network-rights-tile span {
      color: #bdcad8 !important;
      line-height: 1.35 !important;
    }

    body:not(.android-shell) #view-settings .warehouse-actions {
      display: grid !important;
      grid-template-columns: repeat(2, minmax(86px, 1fr)) !important;
      gap: 6px !important;
      align-items: center !important;
      justify-content: flex-end !important;
      min-width: 188px !important;
    }

    body:not(.android-shell) #view-settings .warehouse-actions .btn {
      min-height: 25px !important;
      padding: 4px 8px !important;
      font-size: 11px !important;
      white-space: nowrap !important;
      width: 100% !important;
    }

    body:not(.android-shell) #view-settings .settings-warehouse-table th:nth-child(1) {
      width: 19% !important;
    }

    body:not(.android-shell) #view-settings .settings-warehouse-table th:nth-child(2) {
      width: 13% !important;
    }

    body:not(.android-shell) #view-settings .settings-warehouse-table th:nth-child(3) {
      width: 17% !important;
    }

    body:not(.android-shell) #view-settings .settings-warehouse-table th:nth-child(6) {
      width: 210px !important;
    }

    body:not(.android-shell) #view-settings .settings-category-table {
      table-layout: fixed !important;
    }

    body:not(.android-shell) #view-settings .settings-category-table th:nth-child(1),
    body:not(.android-shell) #view-settings .settings-category-table td:nth-child(1) {
      width: 28% !important;
    }

    body:not(.android-shell) #view-settings .settings-category-table th:nth-child(2),
    body:not(.android-shell) #view-settings .settings-category-table td:nth-child(2) {
      width: 90px !important;
    }

    body:not(.android-shell) #view-settings .settings-category-table th:nth-child(3),
    body:not(.android-shell) #view-settings .settings-category-table td:nth-child(3) {
      width: 110px !important;
    }

    body:not(.android-shell) #view-settings .settings-category-table th:nth-child(4),
    body:not(.android-shell) #view-settings .settings-category-table td:nth-child(4) {
      width: 300px !important;
    }

    body:not(.android-shell) #view-settings .settings-category-table td {
      padding-top: 7px !important;
      padding-bottom: 7px !important;
      vertical-align: middle !important;
      background: rgba(8, 16, 27, .38) !important;
      color: var(--desktop-text) !important;
    }

    body:not(.android-shell) #view-settings .settings-category-table .tag {
      background: rgba(11, 22, 35, .86) !important;
      color: #f1f6ff !important;
      border-width: 1px !important;
    }

    body:not(.android-shell) #view-settings .category-actions {
      display: flex !important;
      flex-wrap: nowrap !important;
      gap: 6px !important;
      justify-content: flex-end !important;
      align-items: center !important;
    }

    body:not(.android-shell) #view-settings .category-actions .btn {
      min-height: 26px !important;
      padding: 4px 8px !important;
      font-size: 11px !important;
      white-space: nowrap !important;
    }

    body:not(.android-shell) #view-settings .warehouse-card table td {
      padding-top: 8px !important;
      padding-bottom: 8px !important;
      vertical-align: middle !important;
    }

    body:not(.android-shell) #view-settings tr.warehouse-archived-row {
      opacity: .58 !important;
      background: rgba(126, 139, 151, .08) !important;
    }

    body:not(.android-shell) #view-settings tr.warehouse-archived-row strong {
      color: var(--desktop-muted) !important;
    }

    body:not(.android-shell) #view-settings .settings-logo-row {
      background: rgba(6, 18, 29, .42) !important;
      border: 1px solid var(--desktop-line) !important;
      border-radius: 10px !important;
      padding: 10px !important;
    }

    body:not(.android-shell) #view-settings .settings-logo-row label,
    body:not(.android-shell) #view-settings label {
      color: var(--desktop-text) !important;
    }

    body:not(.android-shell) #view-settings .integration-card-grid-compact {
      display: grid !important;
      grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
      gap: 12px !important;
    }

    body:not(.android-shell) #view-settings .integration-card-compact {
      min-height: 112px !important;
      padding: 14px !important;
      display: grid !important;
      grid-template-rows: auto auto !important;
      gap: 12px !important;
    }

    body:not(.android-shell) #view-settings .integration-card-compact .integration-card-head {
      display: grid !important;
      grid-template-columns: 42px minmax(0, 1fr) !important;
      gap: 10px !important;
      align-items: center !important;
    }

    body:not(.android-shell) #view-settings .integration-card-compact .integration-icon {
      width: 42px !important;
      height: 42px !important;
      border-radius: 10px !important;
      display: grid !important;
      place-items: center !important;
      background: #18303d !important;
      color: var(--desktop-text) !important;
      font-weight: 800 !important;
      font-size: 13px !important;
    }

    body:not(.android-shell) #view-settings .integration-card-compact h4 {
      margin: 0 !important;
      color: var(--desktop-text) !important;
    }

    body:not(.android-shell) #view-settings .integration-card-compact small {
      color: var(--desktop-muted) !important;
    }

    body:not(.android-shell) #view-settings .subscription-settings-card {
      border-radius: 16px !important;
      overflow: hidden !important;
      background: rgba(8, 16, 27, .82) !important;
      border: 1px solid rgba(128, 154, 184, .24) !important;
      box-shadow: 0 18px 38px rgba(0, 0, 0, .22) !important;
    }

    body:not(.android-shell) .subscription-actions-grid,
    body:not(.android-shell) .subscription-action-section {
      display: grid !important;
      grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
      gap: 8px !important;
      align-items: stretch !important;
    }

    body:not(.android-shell) .subscription-action-section {
      margin-top: 12px !important;
    }

    body:not(.android-shell) .subscription-service-actions {
      grid-template-columns: repeat(3, minmax(150px, 1fr)) !important;
    }

    body:not(.android-shell) .subscription-purchase-actions {
      grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)) !important;
      padding-top: 10px !important;
      border-top: 1px solid rgba(128, 154, 184, .16) !important;
    }

    body:not(.android-shell) :where(.subscription-actions-grid, .subscription-action-section) .btn {
      width: 100% !important;
      min-height: 36px !important;
      white-space: normal !important;
      line-height: 1.15 !important;
      padding-inline: 10px !important;
    }

    body:not(.android-shell) .legal-purchase-acceptance-note,
    body:not(.android-shell) .purchase-legal-note {
      padding: 10px 12px !important;
      border-radius: 12px !important;
      background: rgba(7, 15, 27, .72) !important;
      border: 1px solid rgba(128, 154, 184, .22) !important;
      color: #dce8f6 !important;
      line-height: 1.4 !important;
    }

    body:not(.android-shell) .contact-icon-actions {
      display: flex !important;
      gap: 10px !important;
      align-items: center !important;
      flex-wrap: wrap !important;
    }

    body:not(.android-shell) .contact-icon-button {
      width: 42px !important;
      height: 42px !important;
      border-radius: 12px !important;
      display: inline-grid !important;
      place-items: center !important;
      color: #fff !important;
      text-decoration: none !important;
      font-weight: 800 !important;
      border: 1px solid rgba(255,255,255,.16) !important;
      box-shadow: 0 10px 24px rgba(0,0,0,.22) !important;
    }

    body:not(.android-shell) .contact-icon-button.telegram {
      background: linear-gradient(135deg, #229ed9, #1476aa) !important;
    }

    body:not(.android-shell) .contact-icon-button.whatsapp {
      background: linear-gradient(135deg, #25d366, #128c7e) !important;
    }

    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell {
        --mobile-premium-pad: clamp(16px, 4.2vw, 20px);
        --mobile-premium-dock: 132px;
        --mobile-premium-bg: #050914;
        --mobile-premium-bg-2: #07101d;
        --mobile-premium-card: rgba(13, 24, 42, .78);
        --mobile-premium-card-strong: rgba(10, 18, 34, .92);
        --mobile-premium-field: rgba(7, 13, 25, .86);
        --mobile-premium-line: rgba(125, 95, 255, .22);
        --mobile-premium-line-soft: rgba(120, 145, 190, .18);
        --mobile-premium-text: #ffffff;
        --mobile-premium-muted: #aab3c4;
        --mobile-premium-muted-2: #77869a;
        --mobile-premium-accent-a: #7c5cff;
        --mobile-premium-accent-b: #25b6ff;
        --mobile-premium-ok: #35e38f;
        --android-service-height: var(--mobile-premium-dock) !important;
        color-scheme: dark !important;
        background:
          radial-gradient(circle at 50% -12%, rgba(37, 182, 255, .18), transparent 34%),
          radial-gradient(circle at 86% 22%, rgba(124, 92, 255, .15), transparent 30%),
          radial-gradient(circle at 16% 68%, rgba(84, 42, 190, .10), transparent 34%),
          linear-gradient(180deg, #07101d 0%, #050914 58%, #030711 100%) !important;
        color: var(--mobile-premium-text) !important;
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
      }

      body.android-shell::before {
        content: "" !important;
        position: fixed !important;
        inset: 0 !important;
        pointer-events: none !important;
        z-index: 0 !important;
        opacity: .82 !important;
        background:
          radial-gradient(circle at 40% 0%, rgba(48, 124, 255, .15), transparent 28%),
          radial-gradient(circle at 74% 42%, rgba(126, 87, 255, .10), transparent 32%) !important;
        filter: blur(18px) !important;
        animation: mobilePremiumGlow 9s ease-in-out infinite alternate !important;
      }

      body.android-shell *,
      body.android-shell *::before,
      body.android-shell *::after {
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
        letter-spacing: 0 !important;
      }

      body.android-shell *::-webkit-scrollbar {
        width: 0 !important;
        height: 0 !important;
        display: none !important;
      }

      body.android-shell .app {
        position: relative !important;
        z-index: 1 !important;
        width: 100vw !important;
        max-width: 100vw !important;
        height: 100dvh !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-rows: auto minmax(0, 1fr) !important;
        padding-top: max(10px, env(safe-area-inset-top, 0px)) !important;
        padding-bottom: 0 !important;
        overflow: hidden !important;
        background: transparent !important;
        color: var(--mobile-premium-text) !important;
      }

      body.android-shell .sidebar {
        position: relative !important;
        z-index: 60 !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 var(--mobile-premium-pad) 12px !important;
        padding: 12px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-rows: auto auto !important;
        gap: 10px !important;
        align-items: stretch !important;
        overflow: visible !important;
        border: 1px solid var(--mobile-premium-line) !important;
        border-radius: 26px !important;
        background: linear-gradient(145deg, rgba(13, 24, 42, .84), rgba(8, 14, 28, .92)) !important;
        box-shadow: 0 22px 54px rgba(0, 0, 0, .36), inset 0 1px 0 rgba(255,255,255,.08) !important;
        -webkit-backdrop-filter: blur(22px) !important;
        backdrop-filter: blur(22px) !important;
      }

      body.android-shell .app-exit-button {
        display: none !important;
      }

      body.android-shell .brand {
        grid-column: 1 !important;
        grid-row: 1 !important;
        min-width: 0 !important;
        min-height: 58px !important;
        max-height: none !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        display: grid !important;
        grid-template-columns: 52px minmax(0, 1fr) !important;
        gap: 12px !important;
        align-items: center !important;
        color: var(--mobile-premium-text) !important;
        text-align: left !important;
      }

      body.android-shell .brand-mark {
        width: 52px !important;
        height: 52px !important;
        border-radius: 17px !important;
        display: grid !important;
        place-items: center !important;
        color: #e9fbff !important;
        font-size: 14px !important;
        font-weight: 900 !important;
        background:
          linear-gradient(145deg, rgba(8, 16, 33, .96), rgba(12, 26, 48, .98)),
          radial-gradient(circle at 28% 18%, rgba(37, 182, 255, .56), transparent 40%) !important;
        border: 1px solid rgba(37, 182, 255, .28) !important;
        box-shadow: 0 0 0 1px rgba(124, 92, 255, .18), 0 0 28px rgba(37, 182, 255, .20), inset 0 0 18px rgba(124, 92, 255, .16) !important;
      }

      body.android-shell .brand h1 {
        color: var(--mobile-premium-text) !important;
        font-size: clamp(18px, 4.8vw, 20px) !important;
        line-height: 1.08 !important;
        font-weight: 900 !important;
        margin: 0 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
      }

      body.android-shell .brand span {
        display: block !important;
        margin-top: 3px !important;
        color: var(--mobile-premium-muted) !important;
        font-size: 13px !important;
        line-height: 1.15 !important;
        font-weight: 600 !important;
      }

      body.android-shell .mobile-nav-toggle {
        grid-column: 2 !important;
        grid-row: 1 !important;
        min-width: 98px !important;
        min-height: 54px !important;
        max-height: none !important;
        padding: 0 13px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 1px solid var(--mobile-premium-line-soft) !important;
        border-radius: 20px !important;
        color: var(--mobile-premium-text) !important;
        background: rgba(8, 15, 30, .82) !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.07) !important;
      }

      body.android-shell .mobile-nav-toggle::before {
        content: "" !important;
        width: 18px !important;
        height: 12px !important;
        margin-right: 8px !important;
        background:
          linear-gradient(#fff, #fff) 0 0 / 18px 2px no-repeat,
          linear-gradient(#fff, #fff) 0 5px / 18px 2px no-repeat,
          linear-gradient(#fff, #fff) 0 10px / 18px 2px no-repeat !important;
        opacity: .88 !important;
      }

      body.android-shell.nav-expanded .mobile-nav-toggle::before {
        width: 18px !important;
        height: 18px !important;
        background:
          linear-gradient(45deg, transparent 45%, #fff 46%, #fff 54%, transparent 55%),
          linear-gradient(-45deg, transparent 45%, #fff 46%, #fff 54%, transparent 55%) !important;
      }

      body.android-shell .mobile-nav-toggle #mobileNavCurrent {
        display: none !important;
      }

      body.android-shell .mobile-nav-toggle small {
        display: block !important;
        color: var(--mobile-premium-text) !important;
        font-size: 0 !important;
        line-height: 1 !important;
      }

      body.android-shell .mobile-nav-toggle small::after {
        content: "Разделы" !important;
        font-size: 15px !important;
        font-weight: 850 !important;
      }

      body.android-shell.nav-expanded .mobile-nav-toggle small::after {
        content: "Закрыть" !important;
      }

      body.android-shell .nav {
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        position: fixed !important;
        left: var(--mobile-premium-pad) !important;
        right: var(--mobile-premium-pad) !important;
        top: max(94px, calc(env(safe-area-inset-top, 0px) + 86px)) !important;
        bottom: calc(var(--mobile-premium-dock) + env(safe-area-inset-bottom, 0px) + 18px) !important;
        z-index: 95 !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        align-content: start !important;
        gap: 9px !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 62px 14px 16px !important;
        overflow-y: auto !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: translateY(18px) scale(.98) !important;
        transition: opacity 220ms ease, transform 240ms cubic-bezier(.2,.8,.2,1), visibility 220ms ease !important;
        border: 1px solid var(--mobile-premium-line) !important;
        border-radius: 28px !important;
        background: linear-gradient(180deg, rgba(12, 20, 38, .98), rgba(5, 9, 20, .99)) !important;
        box-shadow: 0 26px 72px rgba(0, 0, 0, .54), inset 0 1px 0 rgba(255,255,255,.08) !important;
        -webkit-backdrop-filter: blur(24px) !important;
        backdrop-filter: blur(24px) !important;
      }

      body.android-shell .nav::before {
        content: "Разделы" !important;
        position: absolute !important;
        left: 18px !important;
        top: 18px !important;
        color: var(--mobile-premium-text) !important;
        font-size: 19px !important;
        font-weight: 900 !important;
      }

      body.android-shell .nav::after {
        content: "×" !important;
        position: absolute !important;
        right: 16px !important;
        top: 14px !important;
        width: 34px !important;
        height: 34px !important;
        display: grid !important;
        place-items: center !important;
        border-radius: 13px !important;
        color: var(--mobile-premium-text) !important;
        background: rgba(255,255,255,.08) !important;
        border: 1px solid rgba(255,255,255,.12) !important;
        font-size: 24px !important;
        line-height: 1 !important;
      }

      body.android-shell.nav-expanded .nav {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateY(0) scale(1) !important;
      }

      body.android-shell .nav button {
        min-height: 50px !important;
        padding: 10px 13px !important;
        display: grid !important;
        grid-template-columns: 28px minmax(0, 1fr) auto !important;
        gap: 11px !important;
        align-items: center !important;
        border: 1px solid rgba(120, 145, 190, .14) !important;
        border-radius: 17px !important;
        color: var(--mobile-premium-muted) !important;
        background: rgba(255,255,255,.045) !important;
        box-shadow: none !important;
        font-size: 15px !important;
        font-weight: 750 !important;
      }

      body.android-shell .nav button.active {
        color: var(--mobile-premium-text) !important;
        background: linear-gradient(135deg, rgba(124, 92, 255, .32), rgba(37, 182, 255, .16)) !important;
        border-color: rgba(124, 92, 255, .42) !important;
        box-shadow: 0 12px 28px rgba(37, 99, 235, .18), inset 0 1px 0 rgba(255,255,255,.08) !important;
      }

      body.android-shell .nav button span:nth-child(2) {
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
      }

      body.android-shell .main {
        position: relative !important;
        z-index: 1 !important;
        width: 100vw !important;
        max-width: 100vw !important;
        min-width: 0 !important;
        min-height: 0 !important;
        padding: 0 var(--mobile-premium-pad) 0 !important;
        overflow: hidden !important;
        background: transparent !important;
        color: var(--mobile-premium-text) !important;
      }

      body.android-shell .view:not(.hidden) {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        display: grid !important;
        align-content: start !important;
        gap: 14px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        padding: 0 0 calc(var(--mobile-premium-dock) + env(safe-area-inset-bottom, 0px) + 28px) !important;
        scroll-padding-bottom: calc(var(--mobile-premium-dock) + env(safe-area-inset-bottom, 0px) + 28px) !important;
        background: transparent !important;
      }

      body.android-shell .topline,
      body.android-shell .panel,
      body.android-shell .settings-card,
      body.android-shell .section-card,
      body.android-shell .stat,
      body.android-shell .network-card,
      body.android-shell .settings-mini,
      body.android-shell .modal,
      body.android-shell .tabs,
      body.android-shell .table-wrap,
      body.android-shell .payment-order-card {
        color: var(--mobile-premium-text) !important;
        background: linear-gradient(180deg, rgba(13, 24, 42, .80), rgba(8, 16, 31, .88)) !important;
        border: 1px solid var(--mobile-premium-line-soft) !important;
        border-radius: 24px !important;
        box-shadow: 0 18px 42px rgba(0, 0, 0, .24), inset 0 1px 0 rgba(255,255,255,.06) !important;
        -webkit-backdrop-filter: blur(20px) !important;
        backdrop-filter: blur(20px) !important;
      }

      body.android-shell .topline {
        min-height: 76px !important;
        padding: 17px 18px !important;
      }

      body.android-shell .topline h2 {
        color: var(--mobile-premium-text) !important;
        font-size: clamp(26px, 7vw, 30px) !important;
        line-height: 1.05 !important;
        font-weight: 900 !important;
      }

      body.android-shell .topline p {
        display: block !important;
        margin-top: 7px !important;
        color: var(--mobile-premium-muted) !important;
        font-size: 14px !important;
        line-height: 1.25 !important;
      }

      body.android-shell #view-dashboard .dashboard-stats {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 14px !important;
        width: 100% !important;
        margin: 0 !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat {
        position: relative !important;
        min-height: 142px !important;
        padding: 18px !important;
        display: grid !important;
        align-content: end !important;
        gap: 9px !important;
        overflow: hidden !important;
        border-radius: 26px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat::before,
      body.android-shell #view-dashboard .quick-money-panel::before,
      body.android-shell #view-dashboard .dashboard-events-panel .panel-body .event-row::before {
        width: 42px !important;
        height: 42px !important;
        display: grid !important;
        place-items: center !important;
        border-radius: 16px !important;
        color: #dff7ff !important;
        background: linear-gradient(135deg, rgba(124, 92, 255, .38), rgba(37, 182, 255, .22)) !important;
        border: 1px solid rgba(124, 92, 255, .36) !important;
        box-shadow: 0 0 26px rgba(124, 92, 255, .16), inset 0 1px 0 rgba(255,255,255,.10) !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat::before {
        content: "" !important;
        position: absolute !important;
        top: 16px !important;
        right: 16px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat::before { content: none !important; display: none !important; }

      body.android-shell #view-dashboard .dashboard-stats .stat span {
        max-width: calc(100% - 46px) !important;
        color: var(--mobile-premium-muted) !important;
        font-size: 15px !important;
        line-height: 1.22 !important;
        font-weight: 750 !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat strong {
        color: var(--mobile-premium-text) !important;
        font-size: clamp(28px, 8.2vw, 35px) !important;
        line-height: 1.02 !important;
        font-weight: 950 !important;
        letter-spacing: 0 !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat small {
        display: block !important;
        color: var(--mobile-premium-muted) !important;
        font-size: 13px !important;
        line-height: 1.28 !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .period-stat {
        grid-column: 1 / -1 !important;
        min-height: 186px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .period-stat .mini-range {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 10px !important;
        margin-top: 4px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .period-stat .mini-date-field {
        min-width: 0 !important;
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr) 34px !important;
        gap: 7px !important;
        align-items: center !important;
        padding: 8px 8px 8px 10px !important;
        min-height: 46px !important;
        border-radius: 15px !important;
        background: rgba(4, 9, 18, .74) !important;
        border: 1px solid rgba(120, 145, 190, .18) !important;
        box-shadow: none !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .period-stat .mini-date-field > span {
        color: var(--mobile-premium-muted) !important;
        font-size: 13px !important;
        font-weight: 850 !important;
        text-transform: uppercase !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .period-stat input[type="date"] {
        min-width: 0 !important;
        width: 100% !important;
        min-height: 30px !important;
        padding: 0 !important;
        color: var(--mobile-premium-text) !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        font-size: 13px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .period-stat input[type="date"]::-webkit-calendar-picker-indicator {
        display: none !important;
      }

      body.android-shell #view-dashboard .date-picker-button {
        width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
        padding: 0 !important;
        border-radius: 12px !important;
        color: var(--mobile-premium-text) !important;
        background: linear-gradient(135deg, rgba(124, 92, 255, .28), rgba(37, 182, 255, .18)) !important;
        border: 1px solid rgba(124, 92, 255, .28) !important;
        font-size: 18px !important;
        line-height: 1 !important;
      }

      body.android-shell #view-dashboard .quick-money-panel {
        position: relative !important;
        min-height: 244px !important;
        margin: 0 !important;
        overflow: hidden !important;
        border-radius: 28px !important;
      }

      body.android-shell #view-dashboard .quick-money-panel::before {
        content: none !important;
        display: none !important;
        position: absolute !important;
        top: 18px !important;
        right: 18px !important;
        font-size: 22px !important;
      }

      body.android-shell #view-dashboard .quick-money-panel .panel-head {
        min-height: 56px !important;
        padding: 19px 18px 4px !important;
        background: transparent !important;
        border: 0 !important;
      }

      body.android-shell #view-dashboard .quick-money-panel .panel-head h3 {
        color: var(--mobile-premium-text) !important;
        font-size: 22px !important;
        line-height: 1.12 !important;
        font-weight: 900 !important;
      }

      body.android-shell #view-dashboard .quick-money-body {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 18px !important;
        padding: 6px 18px 18px !important;
        color: var(--mobile-premium-text) !important;
      }

      body.android-shell #view-dashboard .quick-money-body .muted {
        color: var(--mobile-premium-muted) !important;
        font-size: 14px !important;
        font-weight: 700 !important;
      }

      body.android-shell #view-dashboard .quick-money-body .money-fit {
        display: block !important;
        margin-top: 5px !important;
        color: var(--mobile-premium-text) !important;
        font-size: clamp(31px, 8.7vw, 38px) !important;
        line-height: 1.05 !important;
        font-weight: 950 !important;
      }

      body.android-shell #view-dashboard .quick-money-body small {
        display: block !important;
        margin-top: 6px !important;
        color: var(--mobile-premium-muted) !important;
        font-size: 14px !important;
        line-height: 1.3 !important;
      }

      body.android-shell #view-dashboard .quick-money-body .row-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
      }

      body.android-shell .btn,
      body.android-shell button.btn {
        min-height: 46px !important;
        border-radius: 16px !important;
        border: 1px solid rgba(120, 145, 190, .18) !important;
        color: var(--mobile-premium-text) !important;
        background: rgba(8, 15, 30, .78) !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
        font-size: 15px !important;
        font-weight: 850 !important;
      }

      body.android-shell .btn.primary,
      body.android-shell button.btn.primary {
        border-color: rgba(124, 92, 255, .32) !important;
        color: #ffffff !important;
        background: linear-gradient(135deg, var(--mobile-premium-accent-a), var(--mobile-premium-accent-b)) !important;
        box-shadow: 0 14px 28px rgba(37, 99, 235, .28), inset 0 1px 0 rgba(255,255,255,.14) !important;
      }

      body.android-shell input,
      body.android-shell select,
      body.android-shell textarea {
        width: 100% !important;
        min-width: 0 !important;
        color: var(--mobile-premium-text) !important;
        background: var(--mobile-premium-field) !important;
        border: 1px solid rgba(120, 145, 190, .20) !important;
        border-radius: 15px !important;
        box-shadow: none !important;
      }

      body.android-shell input::placeholder,
      body.android-shell textarea::placeholder {
        color: rgba(170, 179, 196, .72) !important;
        opacity: 1 !important;
      }

      body.android-shell .panel-head {
        border: 0 !important;
        background: transparent !important;
      }

      body.android-shell .panel h3,
      body.android-shell .settings-card h3,
      body.android-shell .section-card h3,
      body.android-shell .settings-mini h4,
      body.android-shell strong {
        color: var(--mobile-premium-text) !important;
      }

      body.android-shell .muted,
      body.android-shell small,
      body.android-shell label,
      body.android-shell td,
      body.android-shell th,
      body.android-shell .panel p {
        color: var(--mobile-premium-muted) !important;
      }

      body.android-shell .tag:not(.red):not(.gold),
      body.android-shell .sync-mini {
        color: var(--mobile-premium-muted) !important;
        background: rgba(120, 145, 190, .14) !important;
        border-color: rgba(120, 145, 190, .18) !important;
      }

      body.android-shell .shift-lamp.open,
      body.android-shell .shift-lamp {
        background: var(--mobile-premium-ok) !important;
        color: var(--mobile-premium-ok) !important;
        box-shadow: 0 0 0 5px rgba(53, 227, 143, .12), 0 0 20px rgba(53, 227, 143, .58) !important;
        animation: pulseLamp 3.2s ease-in-out infinite !important;
      }

      body.android-shell #view-dashboard .dashboard-bottom {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        margin: 0 !important;
      }

      body.android-shell #view-dashboard .dashboard-sales-panel {
        display: none !important;
      }

      body.android-shell #view-dashboard .dashboard-events-panel {
        display: grid !important;
        min-height: 0 !important;
        margin: 0 !important;
        border-radius: 28px !important;
      }

      body.android-shell #view-dashboard .dashboard-events-panel .panel-head {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 10px !important;
        align-items: center !important;
        min-height: 58px !important;
        padding: 18px 18px 4px !important;
      }

      body.android-shell #view-dashboard .dashboard-events-panel .panel-head h3 {
        color: var(--mobile-premium-text) !important;
        font-size: 21px !important;
        font-weight: 900 !important;
      }

      body.android-shell #view-dashboard .dashboard-events-panel .panel-head .btn {
        min-height: 36px !important;
        padding: 7px 11px !important;
        color: #d9d2ff !important;
        background: rgba(124, 92, 255, .14) !important;
        border-color: rgba(124, 92, 255, .26) !important;
        font-size: 12px !important;
      }

      body.android-shell #view-dashboard .dashboard-events-panel .panel-body {
        padding: 12px 18px 18px !important;
      }

      body.android-shell #view-dashboard .dashboard-events-panel .event-log,
      body.android-shell #view-dashboard .dashboard-events-panel .events-list {
        display: grid !important;
        gap: 10px !important;
      }

      body.android-shell #view-dashboard .dashboard-events-panel .event-row,
      body.android-shell #view-dashboard .dashboard-events-panel .event-item,
      body.android-shell #view-dashboard .dashboard-events-panel li {
        position: relative !important;
        display: grid !important;
        grid-template-columns: 48px minmax(0, 1fr) auto !important;
        gap: 12px !important;
        align-items: center !important;
        min-height: 76px !important;
        padding: 12px !important;
        border-radius: 20px !important;
        background: rgba(5, 10, 20, .48) !important;
        border: 1px solid rgba(120, 145, 190, .14) !important;
      }

      body.android-shell #view-dashboard .dashboard-events-panel .event-row::before,
      body.android-shell #view-dashboard .dashboard-events-panel .event-item::before,
      body.android-shell #view-dashboard .dashboard-events-panel li::before {
        content: "▤" !important;
        font-size: 20px !important;
      }

      body.android-shell #view-dashboard .dashboard-events-panel * {
        color: var(--mobile-premium-muted) !important;
      }

      body.android-shell #view-dashboard .dashboard-events-panel strong,
      body.android-shell #view-dashboard .dashboard-events-panel b {
        color: var(--mobile-premium-text) !important;
      }

      body.android-shell .shift-box.as-nav-note {
        position: fixed !important;
        left: var(--mobile-premium-pad) !important;
        right: var(--mobile-premium-pad) !important;
        bottom: max(10px, env(safe-area-inset-bottom, 0px)) !important;
        z-index: 80 !important;
        width: auto !important;
        max-height: none !important;
        min-height: var(--mobile-premium-dock) !important;
        display: grid !important;
        grid-template-columns: minmax(0, .85fr) minmax(0, 1fr) minmax(0, 1fr) !important;
        grid-template-areas:
          "profile support sync"
          "state state shift" !important;
        gap: 8px !important;
        padding: 12px !important;
        overflow: hidden !important;
        color: var(--mobile-premium-text) !important;
        border: 1px solid var(--mobile-premium-line) !important;
        border-radius: 26px !important;
        background: linear-gradient(180deg, rgba(13, 24, 42, .92), rgba(6, 12, 24, .98)) !important;
        box-shadow: 0 -20px 54px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.08) !important;
        -webkit-backdrop-filter: blur(24px) !important;
        backdrop-filter: blur(24px) !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button { grid-area: profile !important; }
      body.android-shell .shift-box.as-nav-note .quick-support-button { grid-area: support !important; }
      body.android-shell .shift-box.as-nav-note .quick-sync-button { grid-area: sync !important; }
      body.android-shell .shift-box.as-nav-note #syncState { grid-area: state !important; }
      body.android-shell .shift-box.as-nav-note .shift-state-line { grid-area: shift !important; }

      body.android-shell .shift-box.as-nav-note .quick-support-create-button,
      body.android-shell .shift-box.as-nav-note .sidebar-service-divider,
      body.android-shell .shift-box.as-nav-note #shiftMeta,
      body.android-shell .shift-box.as-nav-note #shiftEmail {
        display: none !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button,
      body.android-shell .shift-box.as-nav-note .quick-support-button,
      body.android-shell .shift-box.as-nav-note .quick-sync-button,
      body.android-shell .shift-box.as-nav-note .shift-state-line {
        min-width: 0 !important;
        min-height: 39px !important;
        max-height: 42px !important;
        padding: 7px 8px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        border-radius: 15px !important;
        color: var(--mobile-premium-text) !important;
        background: rgba(255,255,255,.055) !important;
        border: 1px solid rgba(120, 145, 190, .14) !important;
        font-size: 11px !important;
        line-height: 1.1 !important;
        font-weight: 850 !important;
        text-align: center !important;
        overflow: hidden !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button {
        display: grid !important;
        align-content: center !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button span {
        color: var(--mobile-premium-muted) !important;
        font-size: 9px !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-support-button::before,
      body.android-shell .shift-box.as-nav-note .quick-sync-button::before { content: none !important; display: none !important; }

      body.android-shell .shift-box.as-nav-note #syncState {
        display: block !important;
        min-width: 0 !important;
        max-height: 34px !important;
        overflow: hidden !important;
        padding: 2px 4px 0 !important;
        color: var(--mobile-premium-muted) !important;
        font-size: 9px !important;
        line-height: 1.24 !important;
      }

      body.android-shell .shift-box.as-nav-note #syncState strong,
      body.android-shell .shift-box.as-nav-note #syncState span {
        color: var(--mobile-premium-muted) !important;
      }

      body.android-shell .shift-box.as-nav-note .shift-state-line {
        color: var(--mobile-premium-text) !important;
      }

      body.android-shell .support-chat-fab {
        bottom: calc(var(--mobile-premium-dock) + env(safe-area-inset-bottom, 0px) + 26px) !important;
      }
    }

    @keyframes mobilePremiumGlow {
      0% { opacity: .58; transform: translate3d(-2%, -1%, 0) scale(1); }
      100% { opacity: .86; transform: translate3d(2%, 1%, 0) scale(1.04); }
    }

    @media (max-width: 680px) {
      body.android-shell {
        --mobile-clean-bg: #040814;
        --mobile-clean-panel: rgba(10, 18, 34, .94);
        --mobile-clean-panel-2: rgba(13, 24, 44, .90);
        --mobile-clean-panel-3: rgba(7, 13, 26, .96);
        --mobile-clean-field: rgba(5, 10, 21, .92);
        --mobile-clean-field-2: rgba(12, 21, 38, .88);
        --mobile-clean-line: rgba(139, 122, 255, .24);
        --mobile-clean-line-soft: rgba(148, 163, 184, .18);
        --mobile-clean-text: #f8fbff;
        --mobile-clean-muted: #b9c4d7;
        --mobile-clean-muted-2: #8795ab;
        --mobile-clean-accent: #8b5cf6;
        --mobile-clean-accent-2: #38bdf8;
        --mobile-clean-danger: #ef6b73;
        --mobile-clean-ok: #36e49a;
        background:
          radial-gradient(circle at 52% -10%, rgba(56, 189, 248, .16), transparent 32%),
          radial-gradient(circle at 95% 22%, rgba(139, 92, 246, .15), transparent 32%),
          linear-gradient(180deg, #07101d 0%, var(--mobile-clean-bg) 68%, #020511 100%) !important;
        color: var(--mobile-clean-text) !important;
      }

      body.android-shell,
      body.android-shell .app,
      body.android-shell .main,
      body.android-shell .view,
      body.android-shell .view:not(.hidden) {
        color: var(--mobile-clean-text) !important;
      }

      body.android-shell :where(.topline, .panel, .settings-card, .settings-mini, .section-card, .stat, .network-card, .integration-card, .integration-card-compact, .legal-group, .legal-doc-row, .payment-order-card, .subscription-settings-card, .warehouse-card, .counterparty-card, .note, .note-wide, .note-large, .receipt-settings-card, .label-settings-card, .support-chat-widget, .support-ticket-card, .event-row, .event-item, .history-card, .document-card, .document-template-card, .modal, .drawer, .bottom-sheet, .mobile-sheet, .tabs, .toolbar, .table-wrap, .table-scroll, .preview-wrap, .preview-panel, .report-preview, .report-editor, .document-template-table-preview, .document-template-field-editor, .document-empty-items, .total-box, .cart-list, .return-sales-list, .pos-receipts-history, .return-sale-row, .cart-item, .customer-panel, .contact-card, .form-grid, .info-card, .notice-card, .empty, .login-card:not(.activation-login-card)) {
        color: var(--mobile-clean-text) !important;
        background: linear-gradient(180deg, var(--mobile-clean-panel-2), var(--mobile-clean-panel)) !important;
        border-color: var(--mobile-clean-line-soft) !important;
        box-shadow: 0 16px 38px rgba(0, 0, 0, .26), inset 0 1px 0 rgba(255,255,255,.055) !important;
      }

      body.android-shell :where(.panel, .settings-card, .settings-mini, .section-card, .stat, .network-card, .integration-card, .integration-card-compact, .legal-group, .legal-doc-row, .payment-order-card, .subscription-settings-card, .warehouse-card, .counterparty-card, .note, .note-wide, .note-large, .receipt-settings-card, .label-settings-card, .support-chat-widget, .support-ticket-card, .event-row, .event-item, .history-card, .document-card, .document-template-card, .modal, .drawer, .bottom-sheet, .mobile-sheet, .table-wrap, .table-scroll, .preview-wrap, .preview-panel, .report-preview, .report-editor, .document-template-table-preview, .document-template-field-editor, .document-empty-items, .total-box, .cart-list, .return-sales-list, .pos-receipts-history, .return-sale-row, .cart-item, .customer-panel, .contact-card, .info-card, .notice-card, .empty) {
        border-radius: 22px !important;
        overflow: hidden !important;
      }

      body.android-shell :where(.panel-head, .modal-head, .drawer-head, .sheet-head, .table-head, .document-modal .modal-head, .report-preview-modal .modal-head, .legal-preview-modal .modal-head) {
        color: var(--mobile-clean-text) !important;
        background: linear-gradient(180deg, rgba(12, 22, 40, .98), rgba(8, 15, 29, .96)) !important;
        border-color: var(--mobile-clean-line-soft) !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
      }

      body.android-shell :where(.panel-body, .modal .panel-body, .drawer-body, .sheet-body, .document-modal .panel-body, .report-preview-modal .panel-body, .legal-preview-modal .panel-body) {
        color: var(--mobile-clean-text) !important;
        background: transparent !important;
        border-color: var(--mobile-clean-line-soft) !important;
      }

      body.android-shell :where(input, select, textarea, .input-like, .field, .numeric-input, .date-input),
      body.android-shell :where(input[type="number"], input[type="date"], input[type="time"], input[type="search"], input[type="tel"], input[type="email"], input[type="password"], input[type="text"]) {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 44px !important;
        color: var(--mobile-clean-text) !important;
        background: linear-gradient(180deg, var(--mobile-clean-field-2), var(--mobile-clean-field)) !important;
        border: 1px solid var(--mobile-clean-line-soft) !important;
        border-radius: 14px !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
        caret-color: var(--mobile-clean-accent-2) !important;
        outline: none !important;
      }

      body.android-shell :where(input:focus, select:focus, textarea:focus) {
        border-color: rgba(139, 92, 246, .56) !important;
        box-shadow: 0 0 0 3px rgba(139, 92, 246, .18), inset 0 1px 0 rgba(255,255,255,.05) !important;
      }

      body.android-shell :where(input::placeholder, textarea::placeholder) {
        color: rgba(185, 196, 215, .72) !important;
        opacity: 1 !important;
      }

      body.android-shell select,
      body.android-shell input[type="date"],
      body.android-shell input[type="time"] {
        color-scheme: dark !important;
      }

      body.android-shell input[type="checkbox"],
      body.android-shell input[type="radio"] {
        width: 18px !important;
        height: 18px !important;
        min-height: 18px !important;
        flex: 0 0 auto !important;
        background: var(--mobile-clean-field) !important;
        border-color: rgba(139, 92, 246, .42) !important;
        accent-color: var(--mobile-clean-accent) !important;
        box-shadow: none !important;
      }

      body.android-shell :where(label, .toggle-line, .checkbox-line, .check-line, .legal-consent-box, .legal-consent-row, .permission-row) {
        color: var(--mobile-clean-muted) !important;
        background: rgba(7, 13, 26, .64) !important;
        border-color: var(--mobile-clean-line-soft) !important;
      }

      body.android-shell :where(h1, h2, h3, h4, h5, h6, strong, b, .title, .section-title, .card-title, .amount, .money-fit, .price, .total-line.big strong) {
        color: var(--mobile-clean-text) !important;
      }

      body.android-shell :where(p, span, small, label, li, td, th, .muted, .hint, .description, .caption, .subtitle, .meta, .tag, .sync-state, .sync-state span, .total-line span, .payment-counterparty-label, .integration-status, .event-copy-cell, .report-meta) {
        color: var(--mobile-clean-muted) !important;
      }

      body.android-shell :where(.view a, .view .link, .settings-card a, .modal a) {
        color: #c9c2ff !important;
      }

      body.android-shell :where(.tag, .badge, .pill, .chip, .integration-status, .status-badge):not(.red):not(.danger):not(.error) {
        color: var(--mobile-clean-muted) !important;
        background: rgba(139, 92, 246, .12) !important;
        border-color: rgba(139, 92, 246, .22) !important;
      }

      body.android-shell :where(.success, .ok, .green, .tag.green, .badge.green, .integration-status.green, .status-ok):not(.shift-lamp):not(.status-dot):not(.lamp):not(.indicator) {
        color: var(--mobile-clean-text) !important;
        background: rgba(54, 228, 154, .11) !important;
        border-color: rgba(54, 228, 154, .22) !important;
      }

      body.android-shell :where(.shift-lamp, .status-dot, .lamp, .indicator, .online-dot) {
        background: var(--mobile-clean-ok) !important;
        color: var(--mobile-clean-ok) !important;
      }

      body.android-shell :where(.btn, button, .button):not(.mobile-nav-toggle):not(.brand):not(.app-exit-button) {
        color: var(--mobile-clean-text) !important;
        background: linear-gradient(180deg, rgba(16, 26, 45, .94), rgba(7, 13, 26, .94)) !important;
        border-color: var(--mobile-clean-line-soft) !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
      }

      body.android-shell :where(.btn.primary, button.primary, .tabs button.active, .nav button.active, .segmented button.active, .tab.active, [aria-selected="true"]) {
        color: #ffffff !important;
        background: linear-gradient(135deg, var(--mobile-clean-accent), var(--mobile-clean-accent-2)) !important;
        border-color: rgba(139, 92, 246, .44) !important;
        box-shadow: 0 12px 28px rgba(56, 189, 248, .18), inset 0 1px 0 rgba(255,255,255,.12) !important;
      }

      body.android-shell :where(.btn.danger, .btn.red, button.danger, button.red, .tag.red, .badge.red) {
        color: #ffe4e7 !important;
        background: rgba(239, 107, 115, .13) !important;
        border-color: rgba(239, 107, 115, .34) !important;
      }

      body.android-shell :where(button:disabled, .btn:disabled, .disabled, [aria-disabled="true"]) {
        color: rgba(185, 196, 215, .48) !important;
        background: rgba(10, 18, 34, .54) !important;
        border-color: rgba(148, 163, 184, .10) !important;
        opacity: 1 !important;
      }

      body.android-shell :where(table, thead, tbody, tfoot, tr, th, td) {
        color: var(--mobile-clean-muted) !important;
        background: transparent !important;
        border-color: rgba(148, 163, 184, .14) !important;
      }

      body.android-shell :where(table) {
        width: 100% !important;
        border-collapse: separate !important;
        border-spacing: 0 !important;
      }

      body.android-shell :where(th) {
        color: var(--mobile-clean-text) !important;
        background: rgba(13, 24, 44, .88) !important;
        font-weight: 850 !important;
      }

      body.android-shell :where(td) {
        background: rgba(7, 13, 26, .46) !important;
      }

      body.android-shell :where(.mobile-card-table tr, .table-wrap tr, .table-scroll tr) {
        border-color: rgba(148, 163, 184, .14) !important;
      }

      body.android-shell :where(.modal-backdrop, .drawer-backdrop, .sheet-backdrop, .support-chat-backdrop) {
        background: rgba(1, 4, 12, .72) !important;
        -webkit-backdrop-filter: blur(12px) !important;
        backdrop-filter: blur(12px) !important;
      }

      body.android-shell :where(.modal, .report-preview-modal, .legal-preview-modal, .document-modal, .document-edit-modal, .document-print-modal, .support-chat-widget) {
        max-width: calc(100vw - 28px) !important;
        color: var(--mobile-clean-text) !important;
        background: linear-gradient(180deg, rgba(13, 24, 44, .98), rgba(5, 10, 21, .99)) !important;
        border: 1px solid var(--mobile-clean-line) !important;
        border-radius: 24px !important;
        box-shadow: 0 28px 80px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.07) !important;
      }

      body.android-shell :where(.modal-close, .close-btn, .icon-close, [data-action="modal-close"]) {
        width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        display: grid !important;
        place-items: center !important;
        color: var(--mobile-clean-text) !important;
        background: rgba(255,255,255,.075) !important;
        border: 1px solid rgba(255,255,255,.12) !important;
        border-radius: 14px !important;
        box-shadow: none !important;
      }

      body.android-shell :where(.modal-close:hover, .close-btn:hover, .icon-close:hover, [data-action="modal-close"]:hover) {
        background: rgba(139, 92, 246, .18) !important;
        border-color: rgba(139, 92, 246, .32) !important;
      }

      body.android-shell :where(.document-print-modal-body, .report-preview-modal .panel-body, .legal-preview-modal .panel-body, .preview-shell, .print-preview-shell, .document-print-preview, .receipt-wrap, .label-preview-wrap, .pdf-preview, .preview-container) {
        color: var(--mobile-clean-text) !important;
        background: linear-gradient(180deg, rgba(5, 10, 21, .94), rgba(3, 7, 16, .98)) !important;
        border: 1px solid var(--mobile-clean-line-soft) !important;
        border-radius: 22px !important;
        overflow: auto !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
      }

      body.android-shell :where(.document-print-page, .receipt, #receiptPrint, #labelPreviewCard) {
        border-radius: 16px !important;
        box-shadow: 0 18px 40px rgba(0,0,0,.38) !important;
      }

      body.android-shell :where(.view [style*="background:#fff"], .view [style*="background: #fff"], .view [style*="background:white"], .view [style*="background: white"], .modal [style*="background:#fff"], .modal [style*="background: #fff"], .modal [style*="background:white"], .modal [style*="background: white"]) {
        background: var(--mobile-clean-panel-3) !important;
        color: var(--mobile-clean-text) !important;
        border-color: var(--mobile-clean-line-soft) !important;
      }

      body.android-shell :where(.document-print-page, .document-print-page *, .receipt, .receipt *, #receiptPrint, #receiptPrint *, #labelPreviewCard, #labelPreviewCard *) {
        color: #111827 !important;
      }

      body.android-shell :where(.document-print-page, .receipt, #receiptPrint, #labelPreviewCard) {
        background: #ffffff !important;
      }

      body.android-shell :where(.row-actions, .form-actions, .modal-footer, .document-modal-footer, .footer-actions, .actions-footer, .support-actions) {
        color: var(--mobile-clean-text) !important;
        background: linear-gradient(180deg, rgba(10, 18, 34, .72), rgba(5, 10, 21, .94)) !important;
        border-color: var(--mobile-clean-line-soft) !important;
      }

      body.android-shell :where(.tabs, .segmented, .tabbar) {
        background: rgba(5, 10, 21, .82) !important;
        border-color: var(--mobile-clean-line-soft) !important;
      }

      body.android-shell :where(.tabs button, .segmented button, .tabbar button) {
        color: var(--mobile-clean-muted) !important;
        background: transparent !important;
        border-color: transparent !important;
      }

      body.android-shell :where(.tabs button.active, .segmented button.active, .tabbar button.active) {
        color: #ffffff !important;
      }

      body.android-shell :where(.total-box, .summary-box, .totals-card) :where(span, small, label) {
        color: var(--mobile-clean-muted) !important;
      }

      body.android-shell :where(.total-box, .summary-box, .totals-card) :where(strong, b, .amount) {
        color: var(--mobile-clean-text) !important;
      }

      body.android-shell :where(.brown, .green-text, .accent-green, [style*="color:#0f"], [style*="color: #0f"], [style*="color:green"], [style*="color: green"]) {
        color: var(--mobile-clean-muted) !important;
      }

      body.android-shell :where(.view, .modal, .drawer, .bottom-sheet, .support-chat-widget) {
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
      }

      body.android-shell :where(.view, .modal, .drawer, .bottom-sheet, .support-chat-widget)::-webkit-scrollbar {
        width: 0 !important;
        height: 0 !important;
        display: none !important;
      }

      body.android-shell .busy-indicator,
      body.android-shell :where(.toast, .snackbar, .notification-toast) {
        color: var(--mobile-clean-text) !important;
        background: linear-gradient(180deg, rgba(20, 30, 50, .96), rgba(9, 15, 29, .98)) !important;
        border: 1px solid var(--mobile-clean-line) !important;
        border-radius: 18px !important;
        box-shadow: 0 18px 44px rgba(0,0,0,.42) !important;
      }
    }

    @media (orientation: portrait) and (min-width: 681px) and (max-width: 920px) {
      body.android-shell {
        --tablet-pad: clamp(16px, 2.4vw, 22px);
        --tablet-gap: clamp(14px, 2vw, 20px);
        --tablet-sidebar: clamp(270px, 34vw, 310px);
        --tablet-bg: #050914;
        --tablet-card: rgba(12, 22, 40, .90);
        --tablet-card-strong: rgba(7, 13, 26, .96);
        --tablet-field: rgba(6, 12, 24, .94);
        --tablet-line: rgba(139, 122, 255, .26);
        --tablet-line-soft: rgba(148, 163, 184, .18);
        --tablet-text: #f8fbff;
        --tablet-muted: #b9c6d8;
        --tablet-muted-2: #8797ad;
        --tablet-accent: #8b5cf6;
        --tablet-accent-2: #38bdf8;
        --tablet-ok: #37e69a;
        --android-service-height: 0px !important;
        color-scheme: dark !important;
        color: var(--tablet-text) !important;
        background:
          radial-gradient(circle at 18% 8%, rgba(56, 189, 248, .16), transparent 32%),
          radial-gradient(circle at 88% 16%, rgba(139, 92, 246, .18), transparent 34%),
          radial-gradient(circle at 60% 92%, rgba(62, 84, 255, .10), transparent 36%),
          linear-gradient(180deg, #07101d 0%, #050914 62%, #020611 100%) !important;
        overflow: hidden !important;
      }

      body.android-shell,
      body.android-shell *,
      body.android-shell *::before,
      body.android-shell *::after {
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
        letter-spacing: 0 !important;
      }

      body.android-shell *::-webkit-scrollbar {
        width: 0 !important;
        height: 0 !important;
        display: none !important;
      }

      body.android-shell::before {
        content: "" !important;
        position: fixed !important;
        inset: 0 !important;
        z-index: 0 !important;
        pointer-events: none !important;
        background:
          radial-gradient(circle at 30% 0%, rgba(56, 189, 248, .14), transparent 30%),
          radial-gradient(circle at 78% 36%, rgba(139, 92, 246, .13), transparent 34%) !important;
        filter: blur(18px) !important;
        opacity: .82 !important;
        animation: mobilePremiumGlow 10s ease-in-out infinite alternate !important;
      }

      body.android-shell .app {
        position: relative !important;
        z-index: 1 !important;
        width: 100vw !important;
        max-width: 100vw !important;
        height: 100dvh !important;
        min-height: 0 !important;
        display: grid !important;
        grid-template-columns: var(--tablet-sidebar) minmax(0, 1fr) !important;
        grid-template-rows: minmax(0, 1fr) !important;
        gap: var(--tablet-gap) !important;
        padding:
          max(12px, env(safe-area-inset-top, 0px))
          var(--tablet-pad)
          max(14px, env(safe-area-inset-bottom, 0px))
          var(--tablet-pad) !important;
        overflow: hidden !important;
        background: transparent !important;
        color: var(--tablet-text) !important;
      }

      body.android-shell .sidebar {
        position: relative !important;
        inset: auto !important;
        z-index: 4 !important;
        width: var(--tablet-sidebar) !important;
        min-width: var(--tablet-sidebar) !important;
        max-width: var(--tablet-sidebar) !important;
        height: 100% !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 16px !important;
        display: grid !important;
        grid-template-rows: auto minmax(0, 1fr) auto !important;
        gap: 16px !important;
        overflow: hidden !important;
        color: var(--tablet-text) !important;
        border: 1px solid var(--tablet-line) !important;
        border-radius: 28px !important;
        background: linear-gradient(180deg, rgba(13, 24, 44, .94), rgba(5, 10, 21, .98)) !important;
        box-shadow: 0 22px 58px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.07) !important;
        -webkit-backdrop-filter: blur(22px) !important;
        backdrop-filter: blur(22px) !important;
      }

      body.android-shell .app-exit-button,
      body.android-shell .mobile-nav-toggle {
        display: none !important;
      }

      body.android-shell .brand {
        width: 100% !important;
        min-height: 76px !important;
        padding: 10px !important;
        display: grid !important;
        grid-template-columns: 58px minmax(0, 1fr) !important;
        gap: 13px !important;
        align-items: center !important;
        color: var(--tablet-text) !important;
        background: rgba(255,255,255,.035) !important;
        border: 1px solid rgba(148, 163, 184, .12) !important;
        border-radius: 22px !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
      }

      body.android-shell .brand::after {
        content: "‹" !important;
        width: 30px !important;
        height: 30px !important;
        display: grid !important;
        place-items: center !important;
        justify-self: end !important;
        grid-column: 2 !important;
        grid-row: 1 !important;
        color: var(--tablet-muted) !important;
        background: rgba(139, 92, 246, .12) !important;
        border: 1px solid rgba(139, 92, 246, .22) !important;
        border-radius: 11px !important;
        font-size: 20px !important;
        line-height: 1 !important;
      }

      body.android-shell .brand-mark {
        width: 58px !important;
        height: 58px !important;
        border-radius: 20px !important;
        color: #eaf9ff !important;
        background:
          radial-gradient(circle at 26% 18%, rgba(56, 189, 248, .42), transparent 36%),
          linear-gradient(145deg, rgba(10, 20, 40, .98), rgba(7, 13, 26, .98)) !important;
        border: 1px solid rgba(56, 189, 248, .28) !important;
        box-shadow: 0 0 32px rgba(56, 189, 248, .16), inset 0 1px 0 rgba(255,255,255,.08) !important;
        font-size: 13px !important;
        font-weight: 950 !important;
      }

      body.android-shell .brand h1 {
        max-width: calc(100% - 38px) !important;
        color: var(--tablet-text) !important;
        font-size: 18px !important;
        line-height: 1.12 !important;
        font-weight: 900 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
      }

      body.android-shell .brand span {
        display: block !important;
        max-width: calc(100% - 38px) !important;
        margin-top: 4px !important;
        color: var(--tablet-muted) !important;
        font-size: 13px !important;
        line-height: 1.2 !important;
        font-weight: 650 !important;
      }

      body.android-shell .nav {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 0 !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        align-content: start !important;
        gap: 9px !important;
        overflow-y: auto !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: none !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
      }

      body.android-shell .nav::before,
      body.android-shell .nav::after {
        display: none !important;
      }

      body.android-shell .nav button {
        min-height: 48px !important;
        padding: 9px 11px !important;
        display: grid !important;
        grid-template-columns: 34px minmax(0, 1fr) auto !important;
        gap: 11px !important;
        align-items: center !important;
        color: var(--tablet-muted) !important;
        background: rgba(255,255,255,.035) !important;
        border: 1px solid rgba(148, 163, 184, .12) !important;
        border-radius: 17px !important;
        box-shadow: none !important;
        font-size: 14px !important;
        font-weight: 780 !important;
      }

      body.android-shell .nav button.active {
        color: #ffffff !important;
        background: linear-gradient(135deg, rgba(139, 92, 246, .72), rgba(56, 189, 248, .34)) !important;
        border-color: rgba(139, 92, 246, .44) !important;
        box-shadow: 0 14px 32px rgba(56, 189, 248, .16), inset 0 1px 0 rgba(255,255,255,.10) !important;
      }

      body.android-shell .nav button > span:first-child {
        width: 34px !important;
        height: 34px !important;
        display: grid !important;
        place-items: center !important;
        color: transparent !important;
        background: rgba(139, 92, 246, .13) !important;
        border: 1px solid rgba(139, 92, 246, .22) !important;
        border-radius: 13px !important;
        overflow: hidden !important;
      }

      body.android-shell .nav button > span:first-child::before {
        content: "" !important;
        width: 14px !important;
        height: 14px !important;
        display: block !important;
        border-radius: 4px !important;
        background: linear-gradient(135deg, #f8fbff, #a8dfff) !important;
        box-shadow: 0 0 14px rgba(56, 189, 248, .20) !important;
      }

      body.android-shell .nav button[data-view="dashboard"] > span:first-child::before { border-radius: 50% !important; }
      body.android-shell .nav button[data-view="pos"] > span:first-child::before { width: 16px !important; height: 12px !important; border-radius: 3px !important; }
      body.android-shell .nav button[data-view="documents"] > span:first-child::before { width: 12px !important; height: 16px !important; border-radius: 3px !important; }
      body.android-shell .nav button[data-view="stock"] > span:first-child::before { transform: rotate(45deg) !important; }
      body.android-shell .nav button[data-view="clients"] > span:first-child::before { border-radius: 50% 50% 7px 7px !important; }
      body.android-shell .nav button[data-view="settings"] > span:first-child::before { border-radius: 50% !important; background: conic-gradient(from 0deg, #f8fbff 0 18%, transparent 18% 28%, #a8dfff 28% 46%, transparent 46% 58%, #f8fbff 58% 76%, transparent 76% 100%) !important; }

      body.android-shell .nav button > span:nth-child(2) {
        min-width: 0 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
      }

      body.android-shell .nav .badge,
      body.android-shell .nav button > span:last-child:not(:empty) {
        min-width: 24px !important;
        height: 24px !important;
        padding: 0 7px !important;
        display: inline-grid !important;
        place-items: center !important;
        color: #e9e4ff !important;
        background: rgba(139, 92, 246, .22) !important;
        border: 1px solid rgba(139, 92, 246, .30) !important;
        border-radius: 999px !important;
        font-size: 12px !important;
        font-weight: 850 !important;
      }

      body.android-shell .shift-box.as-nav-note {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 13px !important;
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        grid-template-areas:
          "profile profile"
          "support sync"
          "shift shift"
          "state state" !important;
        gap: 9px !important;
        overflow: hidden !important;
        color: var(--tablet-text) !important;
        background: linear-gradient(180deg, rgba(13, 24, 44, .88), rgba(6, 12, 24, .96)) !important;
        border: 1px solid var(--tablet-line-soft) !important;
        border-radius: 22px !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button { grid-area: profile !important; }
      body.android-shell .shift-box.as-nav-note .quick-support-button { grid-area: support !important; }
      body.android-shell .shift-box.as-nav-note .quick-sync-button { grid-area: sync !important; }
      body.android-shell .shift-box.as-nav-note .shift-state-line { grid-area: shift !important; }
      body.android-shell .shift-box.as-nav-note #syncState { grid-area: state !important; }

      body.android-shell .shift-box.as-nav-note .quick-support-create-button,
      body.android-shell .shift-box.as-nav-note .sidebar-service-divider,
      body.android-shell .shift-box.as-nav-note #shiftMeta,
      body.android-shell .shift-box.as-nav-note #shiftEmail {
        display: none !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button,
      body.android-shell .shift-box.as-nav-note .quick-support-button,
      body.android-shell .shift-box.as-nav-note .quick-sync-button,
      body.android-shell .shift-box.as-nav-note .shift-state-line {
        min-width: 0 !important;
        min-height: 38px !important;
        padding: 8px 10px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        color: var(--tablet-text) !important;
        background: rgba(255,255,255,.045) !important;
        border: 1px solid rgba(148, 163, 184, .13) !important;
        border-radius: 15px !important;
        font-size: 12px !important;
        line-height: 1.12 !important;
        font-weight: 820 !important;
        text-align: center !important;
        box-shadow: none !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button {
        display: grid !important;
        justify-items: start !important;
        text-align: left !important;
        grid-template-columns: 1fr !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button span,
      body.android-shell .shift-box.as-nav-note #syncState,
      body.android-shell .shift-box.as-nav-note #syncState span {
        color: var(--tablet-muted) !important;
      }

      body.android-shell .shift-box.as-nav-note #syncState {
        display: block !important;
        max-height: 44px !important;
        overflow: hidden !important;
        font-size: 10px !important;
        line-height: 1.28 !important;
        text-align: center !important;
      }

      body.android-shell .shift-lamp,
      body.android-shell .shift-lamp.open {
        width: 9px !important;
        height: 9px !important;
        flex: 0 0 9px !important;
        background: var(--tablet-ok) !important;
        color: var(--tablet-ok) !important;
        box-shadow: 0 0 0 5px rgba(55, 230, 154, .10), 0 0 18px rgba(55, 230, 154, .58) !important;
      }

      body.android-shell .main {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 100% !important;
        min-height: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        color: var(--tablet-text) !important;
        background: transparent !important;
      }

      body.android-shell .view:not(.hidden) {
        width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
        display: grid !important;
        align-content: start !important;
        gap: var(--tablet-gap) !important;
        padding: 0 2px max(18px, env(safe-area-inset-bottom, 0px)) 0 !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        background: transparent !important;
      }

      body.android-shell .topline {
        min-height: 104px !important;
        padding: 24px 26px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;
        gap: 16px !important;
        color: var(--tablet-text) !important;
        background: linear-gradient(135deg, rgba(13, 24, 44, .94), rgba(7, 13, 26, .98)) !important;
        border: 1px solid var(--tablet-line) !important;
        border-radius: 28px !important;
        box-shadow: 0 20px 50px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.07) !important;
      }

      body.android-shell .topline::after {
        content: "" !important;
        width: 48px !important;
        height: 48px !important;
        border-radius: 17px !important;
        background:
          linear-gradient(135deg, rgba(139, 92, 246, .38), rgba(56, 189, 248, .18)),
          radial-gradient(circle at 30% 24%, rgba(255,255,255,.22), transparent 34%) !important;
        border: 1px solid rgba(139, 92, 246, .34) !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
      }

      body.android-shell .topline h2 {
        color: var(--tablet-text) !important;
        font-size: clamp(31px, 4.4vw, 40px) !important;
        line-height: 1.04 !important;
        font-weight: 950 !important;
        margin: 0 !important;
      }

      body.android-shell .topline p {
        margin-top: 8px !important;
        color: var(--tablet-muted) !important;
        font-size: 15px !important;
        line-height: 1.3 !important;
        font-weight: 600 !important;
      }

      body.android-shell :where(.panel, .settings-card, .settings-mini, .section-card, .stat, .network-card, .integration-card, .integration-card-compact, .table-wrap, .table-scroll, .modal, .payment-order-card, .subscription-settings-card, .warehouse-card, .settings-subblock, .logo-helper-card) {
        color: var(--tablet-text) !important;
        background: linear-gradient(180deg, var(--tablet-card), var(--tablet-card-strong)) !important;
        border: 1px solid var(--tablet-line-soft) !important;
        border-radius: 24px !important;
        box-shadow: 0 18px 42px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.055) !important;
        overflow: hidden !important;
      }

      body.android-shell :where(.panel-head, .modal-head) {
        color: var(--tablet-text) !important;
        background: rgba(255,255,255,.025) !important;
        border-color: var(--tablet-line-soft) !important;
      }

      body.android-shell :where(.panel-body, .modal .panel-body) {
        background: transparent !important;
        color: var(--tablet-text) !important;
      }

      body.android-shell :where(input, select, textarea, input[type="date"], input[type="number"], input[type="text"], input[type="tel"], input[type="email"], input[type="password"]) {
        color: var(--tablet-text) !important;
        background: linear-gradient(180deg, rgba(12, 21, 38, .92), var(--tablet-field)) !important;
        border: 1px solid var(--tablet-line-soft) !important;
        border-radius: 15px !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
        color-scheme: dark !important;
      }

      body.android-shell :where(input::placeholder, textarea::placeholder) {
        color: rgba(185, 198, 216, .72) !important;
        opacity: 1 !important;
      }

      body.android-shell :where(h1, h2, h3, h4, h5, h6, strong, b, .amount, .price, .money-fit) {
        color: var(--tablet-text) !important;
      }

      body.android-shell :where(p, span, small, label, td, th, li, .muted, .hint, .caption, .subtitle, .meta, .tag, .integration-status, .sync-mini) {
        color: var(--tablet-muted) !important;
      }

      body.android-shell :where(.green, .accent-green, .green-text, [style*="color:#0f"], [style*="color: #0f"], [style*="color:green"], [style*="color: green"]):not(.shift-lamp):not(.status-dot):not(.lamp):not(.indicator) {
        color: var(--tablet-muted) !important;
      }

      body.android-shell :where(.btn, button.btn) {
        color: var(--tablet-text) !important;
        background: linear-gradient(180deg, rgba(16, 26, 45, .94), rgba(7, 13, 26, .94)) !important;
        border-color: var(--tablet-line-soft) !important;
        border-radius: 16px !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
      }

      body.android-shell :where(.btn.primary, button.btn.primary, .tabs button.active) {
        color: #ffffff !important;
        background: linear-gradient(135deg, var(--tablet-accent), var(--tablet-accent-2)) !important;
        border-color: rgba(139, 92, 246, .42) !important;
        box-shadow: 0 14px 30px rgba(56, 189, 248, .16), inset 0 1px 0 rgba(255,255,255,.12) !important;
      }

      body.android-shell :where(table, thead, tbody, tr, th, td) {
        background: transparent !important;
        border-color: rgba(148, 163, 184, .14) !important;
      }

      body.android-shell th {
        color: var(--tablet-text) !important;
        background: rgba(13, 24, 44, .82) !important;
      }

      body.android-shell td {
        color: var(--tablet-muted) !important;
        background: rgba(7, 13, 26, .42) !important;
      }

      body.android-shell #view-settings:not(.hidden) {
        grid-template-columns: 1fr !important;
      }

      body.android-shell #view-settings .settings-layout {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: var(--tablet-gap) !important;
        width: 100% !important;
        min-width: 0 !important;
      }

      body.android-shell #view-settings .settings-summary {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 14px !important;
        margin: 0 !important;
      }

      body.android-shell #view-settings .settings-summary .stat {
        position: relative !important;
        min-height: 132px !important;
        padding: 20px 18px !important;
        display: grid !important;
        align-content: end !important;
        gap: 8px !important;
        border-radius: 26px !important;
      }

      body.android-shell #view-settings .settings-summary .stat::before,
      body.android-shell #view-settings .network-metric::before,
      body.android-shell #view-settings .settings-tabs button::before {
        content: "" !important;
        position: absolute !important;
        top: 16px !important;
        right: 16px !important;
        width: 38px !important;
        height: 38px !important;
        border-radius: 15px !important;
        background:
          linear-gradient(135deg, rgba(139, 92, 246, .34), rgba(56, 189, 248, .18)),
          radial-gradient(circle at 35% 25%, rgba(255,255,255,.18), transparent 34%) !important;
        border: 1px solid rgba(139, 92, 246, .30) !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
      }

      body.android-shell #view-settings .settings-summary .stat span {
        color: var(--tablet-muted) !important;
        font-size: 14px !important;
        font-weight: 760 !important;
      }

      body.android-shell #view-settings .settings-summary .stat strong {
        max-width: calc(100% - 52px) !important;
        color: var(--tablet-text) !important;
        font-size: clamp(20px, 3.3vw, 28px) !important;
        line-height: 1.08 !important;
        font-weight: 950 !important;
      }

      body.android-shell #view-settings .settings-summary .sync-mini {
        color: var(--tablet-muted) !important;
        font-size: 12px !important;
        line-height: 1.28 !important;
      }

      body.android-shell #view-settings .settings-tabs-panel {
        padding: 14px !important;
        color: var(--tablet-text) !important;
        background: linear-gradient(180deg, rgba(12, 22, 40, .90), rgba(7, 13, 26, .96)) !important;
        border: 1px solid var(--tablet-line-soft) !important;
        border-radius: 26px !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
      }

      body.android-shell #view-settings .settings-tabs {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
      }

      body.android-shell #view-settings .settings-tabs button {
        position: relative !important;
        min-height: 58px !important;
        padding: 10px 12px 10px 48px !important;
        justify-content: start !important;
        text-align: left !important;
        color: var(--tablet-muted) !important;
        background: rgba(255,255,255,.04) !important;
        border: 1px solid rgba(148, 163, 184, .13) !important;
        border-radius: 18px !important;
        font-size: 13px !important;
        font-weight: 820 !important;
      }

      body.android-shell #view-settings .settings-tabs button::before {
        top: 50% !important;
        left: 12px !important;
        right: auto !important;
        width: 28px !important;
        height: 28px !important;
        border-radius: 11px !important;
        transform: translateY(-50%) !important;
      }

      body.android-shell #view-settings .settings-tabs button.active {
        color: #ffffff !important;
      }

      body.android-shell #view-settings .network-setup-card {
        border-radius: 28px !important;
      }

      body.android-shell #view-settings .network-metrics,
      body.android-shell #view-settings .settings-mini-grid,
      body.android-shell .request-summary-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 14px !important;
      }

      body.android-shell #view-settings .network-metric,
      body.android-shell #view-settings .settings-mini {
        position: relative !important;
        min-height: 112px !important;
        padding: 18px !important;
        display: grid !important;
        align-content: end !important;
        gap: 7px !important;
      }

      body.android-shell #view-settings .network-metric span,
      body.android-shell #view-settings .settings-mini small {
        color: var(--tablet-muted) !important;
        font-size: 12px !important;
        line-height: 1.3 !important;
      }

      body.android-shell #view-settings .network-metric strong,
      body.android-shell #view-settings .settings-mini h4,
      body.android-shell #view-settings .settings-mini p strong {
        color: var(--tablet-text) !important;
        font-size: clamp(18px, 2.7vw, 24px) !important;
        line-height: 1.08 !important;
        font-weight: 920 !important;
      }

      body.android-shell #view-settings .form-grid,
      body.android-shell #view-settings .panel-body.form-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 14px !important;
      }

      body.android-shell #view-settings .wide,
      body.android-shell #view-settings .logo-helper-card,
      body.android-shell #view-settings .settings-logo-row {
        grid-column: 1 / -1 !important;
      }

      body.android-shell #view-settings .warehouse-actions {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 7px !important;
      }

      body.android-shell #view-settings .warehouse-actions .btn {
        min-height: 32px !important;
        padding: 6px 9px !important;
        font-size: 11px !important;
      }

      body.android-shell .modal-backdrop {
        background: rgba(1, 4, 12, .72) !important;
        -webkit-backdrop-filter: blur(12px) !important;
        backdrop-filter: blur(12px) !important;
      }

      body.android-shell .modal {
        max-width: min(680px, calc(100vw - 48px)) !important;
        color: var(--tablet-text) !important;
        background: linear-gradient(180deg, rgba(13, 24, 44, .98), rgba(5, 10, 21, .99)) !important;
        border: 1px solid var(--tablet-line) !important;
        border-radius: 26px !important;
        box-shadow: 0 30px 82px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.07) !important;
      }

      body.android-shell :where(.view [style*="background:#fff"], .view [style*="background: #fff"], .view [style*="background:white"], .view [style*="background: white"], .modal [style*="background:#fff"], .modal [style*="background: #fff"], .modal [style*="background:white"], .modal [style*="background: white"]) {
        background: var(--tablet-card-strong) !important;
        color: var(--tablet-text) !important;
        border-color: var(--tablet-line-soft) !important;
      }

      body.android-shell :where(.document-print-page, .receipt, #receiptPrint, #labelPreviewCard) {
        background: #ffffff !important;
        color: #111827 !important;
        border-radius: 18px !important;
      }

      body.android-shell :where(.document-print-page *, .receipt *, #receiptPrint *, #labelPreviewCard *) {
        color: #111827 !important;
      }
    }

    :root {
      --srm-bg: #030712;
      --srm-bg-2: #07111f;
      --srm-bg-3: #0b1628;
      --srm-card: rgba(13, 24, 44, .92);
      --srm-card-strong: rgba(15, 28, 51, .98);
      --srm-card-soft: rgba(20, 35, 61, .72);
      --srm-line: rgba(137, 116, 255, .26);
      --srm-line-soft: rgba(148, 163, 184, .18);
      --srm-text: #f7fbff;
      --srm-muted: #b8c7dc;
      --srm-faint: #8393aa;
      --srm-purple: #8b5cf6;
      --srm-violet: #6d5dfc;
      --srm-blue: #38bdf8;
      --srm-cyan: #22d3ee;
      --srm-ok: #32d583;
      --srm-danger: #fb7185;
      --srm-warn: #fbbf24;
      --srm-radius: 22px;
      --srm-radius-sm: 14px;
      --srm-shadow: 0 24px 70px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .045);
      --srm-glow: 0 0 0 1px rgba(139, 92, 246, .2), 0 20px 58px rgba(77, 70, 229, .26);
      --srm-primary-gradient: linear-gradient(135deg, #7c3aed 0%, #4f46e5 48%, #0891b2 100%);
      --srm-panel-gradient: linear-gradient(180deg, rgba(15, 28, 51, .95), rgba(6, 13, 28, .98));
      --srm-input-bg: rgba(7, 15, 29, .96);
      --srm-motion-fast: 160ms cubic-bezier(.2, .8, .2, 1);
      --srm-motion: 260ms cubic-bezier(.18, .82, .22, 1);
    }

    html,
    body {
      background:
        radial-gradient(circle at 14% 10%, rgba(124, 58, 237, .18), transparent 34%),
        radial-gradient(circle at 88% 18%, rgba(56, 189, 248, .13), transparent 32%),
        linear-gradient(145deg, var(--srm-bg), var(--srm-bg-2) 54%, #020617) !important;
      color: var(--srm-text) !important;
    }

    body::before {
      content: "";
      position: fixed;
      inset: -20%;
      z-index: -1;
      pointer-events: none;
      background:
        radial-gradient(circle at 20% 24%, rgba(139, 92, 246, .14), transparent 30%),
        radial-gradient(circle at 76% 18%, rgba(34, 211, 238, .10), transparent 26%),
        radial-gradient(circle at 62% 84%, rgba(79, 70, 229, .12), transparent 30%);
      filter: blur(34px);
      opacity: .9;
      animation: srmAmbientGlow 12s ease-in-out infinite alternate;
    }

    @keyframes srmAmbientGlow {
      from { transform: translate3d(-1.2%, -.8%, 0) scale(1); opacity: .72; }
      to { transform: translate3d(1.4%, 1%, 0) scale(1.04); opacity: .95; }
    }

    body.windows-shell::before {
      background:
        radial-gradient(circle at 16% 22%, rgba(139, 92, 246, .18), transparent 29%),
        radial-gradient(circle at 82% 16%, rgba(56, 189, 248, .14), transparent 28%),
        radial-gradient(circle at 48% 82%, rgba(79, 70, 229, .16), transparent 32%),
        radial-gradient(circle at 72% 64%, rgba(34, 211, 238, .09), transparent 26%) !important;
      filter: blur(38px);
      opacity: .98;
      animation: srmDesktopAmbientFlow 15s ease-in-out infinite alternate;
    }

    body.windows-shell::after {
      content: "";
      position: fixed;
      inset: -18%;
      z-index: -1;
      pointer-events: none;
      background:
        radial-gradient(circle at 28% 74%, rgba(56, 189, 248, .08), transparent 26%),
        radial-gradient(circle at 88% 78%, rgba(139, 92, 246, .11), transparent 30%),
        radial-gradient(circle at 44% 20%, rgba(14, 165, 233, .07), transparent 24%);
      filter: blur(46px);
      opacity: .86;
      animation: srmDesktopAmbientFlowAlt 18s ease-in-out infinite alternate;
    }

    @keyframes srmDesktopAmbientFlow {
      0% { transform: translate3d(-1.4%, -1%, 0) scale(1); }
      45% { transform: translate3d(1.1%, .7%, 0) scale(1.035) rotate(.4deg); }
      100% { transform: translate3d(-.2%, 1.4%, 0) scale(1.055) rotate(-.5deg); }
    }

    @keyframes srmDesktopAmbientFlowAlt {
      0% { transform: translate3d(1%, .6%, 0) scale(1.03); opacity: .72; }
      55% { transform: translate3d(-1.3%, -1.1%, 0) scale(1.07); opacity: .94; }
      100% { transform: translate3d(.4%, -1.7%, 0) scale(1.02); opacity: .84; }
    }

    :where(.app, .workspace, .main, main, .view, .view.active, .content, .android-main, .desktop-main) {
      color: var(--srm-text) !important;
      background-color: transparent !important;
    }

    :where(.topbar, .topline, .sidebar, .mobile-topbar, .drawer, .bottom-sheet, .panel, .card, .stat, .tile, .section-card, .settings-card, .settings-mini, .network-card, .network-metric, .integration-card, .table-wrap, .shift-table-wrap, .report-editor, .preview-wrapper, .document-preview-wrap, .document-print-modal-body, .stock-print-modal-body, .support-card, .support-chat-widget, .toast, .modal, .child-modal, .subscription-box, .receipt-preview, .price-label-preview, .event-card, .history-card, .note-card, .warehouse-card, .counterparty-card) {
      background: var(--srm-panel-gradient) !important;
      color: var(--srm-text) !important;
      border-color: var(--srm-line-soft) !important;
      box-shadow: var(--srm-shadow) !important;
    }

    :where(.panel, .card, .stat, .tile, .section-card, .settings-card, .settings-mini, .network-card, .network-metric, .integration-card, .table-wrap, .shift-table-wrap, .report-editor, .preview-wrapper, .document-preview-wrap, .support-card, .toast, .modal, .child-modal, .subscription-box, .event-card, .history-card, .note-card, .warehouse-card, .counterparty-card) {
      border: 1px solid var(--srm-line-soft) !important;
      border-radius: var(--srm-radius) !important;
      overflow: hidden;
    }

    :where(.panel-head, .modal-head, .table-head, .section-head, .card-head, .settings-head, .document-modal-footer, .report-modal-footer, .row-actions.document-modal-footer, .row-actions.report-modal-footer, .footer-panel) {
      background: linear-gradient(180deg, rgba(19, 34, 59, .96), rgba(10, 20, 38, .96)) !important;
      color: var(--srm-text) !important;
      border-color: var(--srm-line-soft) !important;
    }

    :where(h1, h2, h3, h4, h5, h6, label, th, td, p, li, span, strong, small, div) {
      border-color: var(--srm-line-soft);
    }

    :where(h1, h2, h3, h4, h5, h6, strong, th) {
      color: var(--srm-text) !important;
    }

    :where(p, label, td, li, small, .muted, .hint, .subtle, .helper, .description, .caption, .empty-state, .table-notice, .summary-line span) {
      color: var(--srm-muted) !important;
    }

    :where(input, select, textarea, .input, .select, .textarea, [contenteditable="true"]) {
      background: var(--srm-input-bg) !important;
      color: var(--srm-text) !important;
      border: 1px solid var(--srm-line) !important;
      border-radius: 14px !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035) !important;
      caret-color: var(--srm-cyan) !important;
      transition: border-color var(--srm-motion-fast), box-shadow var(--srm-motion-fast), background var(--srm-motion-fast), transform var(--srm-motion-fast) !important;
    }

    :where(input, select, textarea, .input, .select, .textarea, [contenteditable="true"]):focus,
    :where(input, select, textarea, .input, .select, .textarea, [contenteditable="true"]):focus-visible {
      outline: none !important;
      border-color: rgba(56, 189, 248, .62) !important;
      box-shadow: 0 0 0 3px rgba(79, 70, 229, .22), inset 0 1px 0 rgba(255, 255, 255, .05) !important;
    }

    :where(input, textarea)::placeholder {
      color: rgba(184, 199, 220, .64) !important;
    }

    :where(select option) {
      background: #08111f !important;
      color: var(--srm-text) !important;
    }

    :where(input[type="checkbox"], input[type="radio"]) {
      accent-color: var(--srm-violet) !important;
      background: #0b1628 !important;
      border-color: var(--srm-line) !important;
      box-shadow: none !important;
    }

    :where(table) {
      background: rgba(7, 15, 29, .82) !important;
      color: var(--srm-text) !important;
      border-color: var(--srm-line-soft) !important;
    }

    :where(thead, th) {
      background: rgba(20, 35, 61, .95) !important;
      color: var(--srm-text) !important;
    }

    :where(tbody tr, td) {
      background-color: transparent !important;
      color: var(--srm-muted) !important;
      border-color: rgba(148, 163, 184, .13) !important;
    }

    :where(tbody tr:hover) {
      background: rgba(79, 70, 229, .13) !important;
    }

    :where(.btn, button, [role="button"]) {
      color: var(--srm-text) !important;
      border-color: rgba(148, 163, 184, .22) !important;
      background: linear-gradient(180deg, rgba(18, 32, 55, .98), rgba(10, 19, 35, .98)) !important;
      box-shadow: 0 12px 30px rgba(0, 0, 0, .24), inset 0 1px 0 rgba(255, 255, 255, .055) !important;
      transition: transform var(--srm-motion-fast), filter var(--srm-motion-fast), box-shadow var(--srm-motion-fast), border-color var(--srm-motion-fast) !important;
    }

    :where(.btn:hover, button:hover, [role="button"]:hover) {
      transform: translateY(-1px);
      border-color: rgba(139, 92, 246, .5) !important;
      box-shadow: 0 16px 40px rgba(79, 70, 229, .22), inset 0 1px 0 rgba(255, 255, 255, .07) !important;
    }

    :where(.btn:active, button:active, [role="button"]:active) {
      transform: translateY(0);
    }

    :where(.btn.primary, button.primary, .primary, .nav button.active, .tabs button.active, .tab.active, .segmented button.active, [aria-selected="true"]) {
      background: var(--srm-primary-gradient) !important;
      color: #ffffff !important;
      border-color: rgba(167, 139, 250, .45) !important;
      box-shadow: 0 18px 48px rgba(79, 70, 229, .34), inset 0 1px 0 rgba(255, 255, 255, .17) !important;
    }

    :where(.btn.danger, button.danger, .danger, [data-action*="delete"], [data-action*="archive"]) {
      border-color: rgba(251, 113, 133, .34) !important;
    }

    :where(.btn.danger, button.danger) {
      background: linear-gradient(135deg, rgba(159, 18, 57, .94), rgba(127, 29, 29, .96)) !important;
      color: #fff5f5 !important;
    }

    :where(.btn:disabled, button:disabled, .disabled) {
      opacity: .56 !important;
      filter: saturate(.65) !important;
      cursor: not-allowed !important;
      transform: none !important;
    }

    :where(.modal-backdrop, .child-modal-backdrop) {
      background: rgba(2, 6, 23, .76) !important;
      -webkit-backdrop-filter: blur(14px) saturate(118%) !important;
      backdrop-filter: blur(14px) saturate(118%) !important;
    }

    :where(.modal, .child-modal) {
      background: linear-gradient(180deg, rgba(17, 31, 54, .99), rgba(5, 12, 25, .99)) !important;
      animation: srmModalIn 180ms cubic-bezier(.2, .8, .2, 1) both !important;
    }

    @keyframes srmModalIn {
      from { opacity: 0; transform: translateY(10px) scale(.985); }
      to { opacity: 1; transform: translateY(0) scale(1); }
    }

    :where(.modal-head .btn.small, .child-modal .modal-head .btn.small, [data-action="modal-close"], #exitCancelTop, #confirmNoTop, #reportCloseNoTop) {
      width: 42px !important;
      height: 42px !important;
      min-width: 42px !important;
      padding: 0 !important;
      display: inline-grid !important;
      place-items: center !important;
      border-radius: 14px !important;
      color: #f8fbff !important;
      font-size: 22px !important;
      line-height: 1 !important;
      background: linear-gradient(145deg, rgba(39, 25, 55, .96), rgba(24, 18, 35, .96)) !important;
      border: 1px solid rgba(148, 163, 184, .22) !important;
    }

    :where(.modal-head .btn.small:hover, .child-modal .modal-head .btn.small:hover, [data-action="modal-close"]:hover, #exitCancelTop:hover, #confirmNoTop:hover, #reportCloseNoTop:hover) {
      background: linear-gradient(145deg, rgba(92, 38, 132, .98), rgba(44, 35, 72, .98)) !important;
      box-shadow: 0 16px 38px rgba(79, 70, 229, .24) !important;
    }

    :where(.brand-mark, .settings-logo-preview) {
      background:
        radial-gradient(circle at 28% 22%, rgba(34, 211, 238, .34), transparent 30%),
        linear-gradient(145deg, #050b16, #0b1730 58%, #170c2e) !important;
      border: 1px solid rgba(56, 189, 248, .34) !important;
      box-shadow: 0 0 0 1px rgba(139, 92, 246, .26), 0 0 24px rgba(34, 211, 238, .22), 0 18px 42px rgba(0, 0, 0, .34) !important;
    }

    :where(.badge, .pill, .tag, .integration-status, .counter, .nav .badge) {
      background: rgba(139, 92, 246, .16) !important;
      color: #dbeafe !important;
      border: 1px solid rgba(139, 92, 246, .28) !important;
      border-radius: 999px !important;
    }

    :where(.shift-lamp, .status-dot, .lamp, .indicator, .presence-dot) {
      background: var(--srm-ok) !important;
      box-shadow: 0 0 0 4px rgba(50, 213, 131, .14), 0 0 18px rgba(50, 213, 131, .42) !important;
      flex: 0 0 auto !important;
    }

    :where(.shift-lamp.open, .status-dot.open, .lamp.open) {
      animation: srmStatusPulse 1.8s ease-in-out infinite;
    }

    @keyframes srmStatusPulse {
      0%, 100% { box-shadow: 0 0 0 3px rgba(50, 213, 131, .12), 0 0 14px rgba(50, 213, 131, .34); }
      50% { box-shadow: 0 0 0 8px rgba(50, 213, 131, .05), 0 0 26px rgba(50, 213, 131, .48); }
    }

    :where([style*="background:#fff"], [style*="background: #fff"], [style*="background:white"], [style*="background: white"], [style*="background-color:#fff"], [style*="background-color: #fff"], [style*="background-color:white"], [style*="background-color: white"]) {
      background: var(--srm-card-strong) !important;
      color: var(--srm-text) !important;
      border-color: var(--srm-line-soft) !important;
    }

    :where([style*="color:#0"], [style*="color: #0"], [style*="color:green"], [style*="color: green"]) {
      color: var(--srm-muted) !important;
    }

    :where(.document-print-page, .document-print-page *, .receipt, .receipt *, #receiptPrint, #receiptPrint *, #labelPreviewCard, #labelPreviewCard *, .print-page, .print-page *) {
      background: #ffffff !important;
      color: #111827 !important;
      border-color: #cbd5e1 !important;
      box-shadow: none !important;
    }

    :where(.preview-wrapper, .document-preview-wrap, .document-print-modal-body, .stock-print-modal-body, .receipt-preview, .price-label-preview) :where(.document-print-page, .receipt, #receiptPrint, #labelPreviewCard, .print-page) {
      border-radius: 18px !important;
      margin: 0 auto !important;
    }

    :where(.row-actions, .toolbar, .tabs, .segmented, .filters, .actions) {
      background-color: transparent !important;
      border-color: var(--srm-line-soft) !important;
    }

    :where(.tabs button, .segmented button, .nav button) {
      color: var(--srm-muted) !important;
    }

    :where(.tabs button.active, .segmented button.active, .nav button.active) {
      color: #ffffff !important;
    }

    :where(.nav button) > span:first-child {
      color: transparent !important;
      position: relative;
      width: 24px !important;
      height: 24px !important;
      min-width: 24px !important;
      display: inline-grid !important;
      place-items: center !important;
      overflow: hidden !important;
    }

    :where(.nav button) > span:first-child::before {
      content: "";
      width: 15px;
      height: 15px;
      display: block;
      background: currentColor;
      color: #c4d3e7;
      opacity: .95;
      mask: radial-gradient(circle at center, #000 58%, transparent 61%);
      -webkit-mask: radial-gradient(circle at center, #000 58%, transparent 61%);
    }

    :where(.nav button.active) > span:first-child::before {
      color: #ffffff;
    }

    .nav button[data-view="dashboard"] > span:first-child::before { border-radius: 4px; mask: linear-gradient(#000 0 0); -webkit-mask: linear-gradient(#000 0 0); }
    .nav button[data-view="pos"] > span:first-child::before { border-radius: 50%; mask: radial-gradient(circle at center, transparent 38%, #000 40%); -webkit-mask: radial-gradient(circle at center, transparent 38%, #000 40%); }
    .nav button[data-view="documents"] > span:first-child::before { border-radius: 3px; mask: linear-gradient(#000 0 0); -webkit-mask: linear-gradient(#000 0 0); }
    .nav button[data-view="stock"] > span:first-child::before { border-radius: 3px; mask: conic-gradient(from 45deg, #000 0 25%, transparent 0 50%, #000 0 75%, transparent 0); -webkit-mask: conic-gradient(from 45deg, #000 0 25%, transparent 0 50%, #000 0 75%, transparent 0); }
    .nav button[data-view="settings"] > span:first-child::before { border-radius: 50%; mask: radial-gradient(circle at center, transparent 28%, #000 30% 54%, transparent 56%); -webkit-mask: radial-gradient(circle at center, transparent 28%, #000 30% 54%, transparent 56%); }

    * {
      scrollbar-color: rgba(139, 92, 246, .5) rgba(7, 15, 29, .36);
      scrollbar-width: thin;
    }

    ::-webkit-scrollbar {
      width: 8px;
      height: 8px;
    }

    ::-webkit-scrollbar-track {
      background: rgba(7, 15, 29, .34);
      border-radius: 999px;
    }

    ::-webkit-scrollbar-thumb {
      background: linear-gradient(180deg, rgba(139, 92, 246, .7), rgba(56, 189, 248, .55));
      border-radius: 999px;
    }

    :where(.table-wrap, .shift-table-wrap, .panel-body, .modal, .view, .main, .workspace) {
      min-width: 0;
    }

    body.android-shell :where(.main, .workspace, .view, .panel-body, .modal, .table-wrap, .shift-table-wrap) {
      scrollbar-width: none !important;
    }

    body.android-shell :where(.main, .workspace, .view, .panel-body, .modal, .table-wrap, .shift-table-wrap)::-webkit-scrollbar {
      width: 0 !important;
      height: 0 !important;
      display: none !important;
    }

    body:not(.android-shell) :where(.topbar, .window-titlebar, .app-titlebar) :where(.brand-mark, img, .title, .subtitle, h1, strong) {
      display: none !important;
    }

    body:not(.android-shell) .sidebar {
      background: linear-gradient(180deg, rgba(8, 17, 33, .98), rgba(3, 9, 20, .99)) !important;
      border-right: 1px solid rgba(139, 92, 246, .22) !important;
    }

    body:not(.android-shell) .nav {
      padding-top: 12px !important;
      gap: 7px !important;
    }

    body:not(.android-shell) .nav button {
      min-height: 36px !important;
      font-size: 14px !important;
      border-radius: 12px !important;
      padding: 8px 11px !important;
      gap: 11px !important;
    }

    body:not(.android-shell) .nav button > span:first-child {
      width: 23px !important;
      height: 23px !important;
      min-width: 23px !important;
    }

    body:not(.android-shell) .sidebar-footer,
    body:not(.android-shell) .profile-footer,
    body:not(.android-shell) .sidebar-bottom {
      background: rgba(11, 22, 40, .86) !important;
      border: 1px solid rgba(139, 92, 246, .22) !important;
      border-radius: 18px !important;
      padding: 10px !important;
      overflow: hidden !important;
    }

    body:not(.android-shell) :where(.view.active, .main) {
      padding-right: max(14px, env(safe-area-inset-right)) !important;
    }

    body:not(.android-shell) :where(.grid, .form-grid, .settings-grid, .dashboard-grid, .pos-grid, .document-grid) {
      min-width: 0;
    }

    body.android-shell {
      --workspace-bg: transparent;
      overflow-x: hidden !important;
    }

    body.android-shell :where(.app, #appRoot) {
      background: transparent !important;
    }

    body.android-shell :where(.view.active, .main, .workspace) {
      padding-left: max(14px, env(safe-area-inset-left)) !important;
      padding-right: max(14px, env(safe-area-inset-right)) !important;
      padding-bottom: max(22px, env(safe-area-inset-bottom)) !important;
      overflow-x: hidden !important;
    }

    @media (max-width: 680px) {
      body.android-shell {
        font-size: 14px !important;
      }

      body.android-shell :where(.mobile-topbar, .panel, .card, .stat, .section-card, .settings-card, .settings-mini, .table-wrap, .modal, .bottom-sheet, .drawer) {
        border-radius: 22px !important;
      }

      body.android-shell :where(.stat-grid, .dashboard-stats, .network-metrics, .settings-mini-grid) {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
      }

      body.android-shell :where(.row-actions, .toolbar, .tabs, .segmented) {
        gap: 9px !important;
        flex-wrap: wrap !important;
      }

      body.android-shell :where(.btn, button) {
        min-height: 42px !important;
      }

      body.android-shell :where(.modal, .child-modal) {
        width: min(100%, calc(100vw - 24px)) !important;
        max-width: calc(100vw - 24px) !important;
      }
    }

    @media (orientation: landscape) and (min-width: 921px) and (max-width: 1400px) {
      body.android-shell {
        --tablet-land-sidebar: clamp(250px, 22vw, 300px);
        font-size: 14px !important;
      }

      body.android-shell #appRoot,
      body.android-shell .app {
        display: grid !important;
        grid-template-columns: var(--tablet-land-sidebar) minmax(0, 1fr) !important;
        gap: 0 !important;
        min-height: 100dvh !important;
        height: 100dvh !important;
        overflow: hidden !important;
      }

      body.android-shell .sidebar {
        position: relative !important;
        left: auto !important;
        top: auto !important;
        width: var(--tablet-land-sidebar) !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        display: grid !important;
        grid-template-rows: auto minmax(0, 1fr) auto !important;
        padding: max(16px, env(safe-area-inset-top)) 14px max(14px, env(safe-area-inset-bottom)) !important;
        background: linear-gradient(180deg, rgba(8, 17, 33, .98), rgba(3, 9, 20, .99)) !important;
        border-right: 1px solid rgba(139, 92, 246, .22) !important;
        transform: none !important;
        overflow: hidden !important;
      }

      body.android-shell .main,
      body.android-shell .workspace {
        height: 100dvh !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        padding: max(16px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) 18px !important;
      }

      body.android-shell :where(.mobile-topbar, .mobile-drawer-toggle, .app-exit-button) {
        display: none !important;
      }

      body.android-shell .nav {
        overflow: hidden !important;
        gap: 7px !important;
      }

      body.android-shell .nav button {
        min-height: 38px !important;
        font-size: 13px !important;
        border-radius: 13px !important;
        padding: 8px 10px !important;
      }

      body.android-shell :where(.stats-grid, .dashboard-stats, .network-metrics, #view-settings .network-metrics, #view-settings .settings-mini-grid) {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 14px !important;
      }

      body.android-shell #view-settings .settings-tabs,
      body.android-shell #view-settings .tabs {
        display: grid !important;
        grid-template-columns: repeat(6, minmax(120px, 1fr)) !important;
        gap: 10px !important;
        overflow: hidden !important;
      }

      body.android-shell #view-settings .form-grid,
      body.android-shell #view-settings .panel-body.form-grid,
      body.android-shell .form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 14px !important;
      }

      body.android-shell :where(.pos-grid, .cash-grid, .documents-grid, .settings-layout) {
        grid-template-columns: minmax(0, 1.45fr) minmax(340px, .9fr) !important;
        gap: 16px !important;
      }

      body.android-shell :where(.modal, .child-modal) {
        max-width: min(860px, calc(100vw - var(--tablet-land-sidebar) - 44px)) !important;
      }
    }

    body.android-shell.performance-mode::before {
      animation: none !important;
      filter: blur(18px) !important;
      opacity: .46 !important;
    }

    body.android-shell :where(.main, .workspace, .view, .panel-body, .modal, .child-modal, .table-wrap, .table-scroll, .support-chat-widget) {
      -webkit-overflow-scrolling: touch !important;
      overscroll-behavior: contain !important;
      scroll-behavior: smooth !important;
      transform: translateZ(0);
      backface-visibility: hidden;
    }

    body.android-shell.performance-mode :where(.panel, .stat, .section-card, .settings-card, .settings-mini, .network-card, .integration-card, .table-wrap, .modal, .child-modal, .toast, .sidebar, .topline) {
      -webkit-backdrop-filter: none !important;
      backdrop-filter: none !important;
      box-shadow: 0 10px 28px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .04) !important;
      contain: layout paint style;
    }

    body.android-shell.performance-mode :where(.view.hidden, .modal-backdrop:empty) {
      content-visibility: hidden;
      contain-intrinsic-size: 1px 1px;
    }

    body.android-shell.performance-mode :where(.view:not(.hidden), .modal, .child-modal, .drawer, .bottom-sheet) {
      will-change: transform, opacity;
    }

    body.android-shell.performance-mode .view:not(.hidden) {
      animation: srmFastViewIn 140ms cubic-bezier(.2, .78, .2, 1) both !important;
    }

    body.android-shell.performance-mode :where(.modal, .child-modal) {
      animation: srmFastModalIn 150ms cubic-bezier(.2, .78, .2, 1) both !important;
    }

    body.android-shell.performance-mode :where(.btn, button, .nav button, .tabs button, input, select, textarea) {
      transition-duration: 120ms !important;
      transition-timing-function: cubic-bezier(.2, .78, .2, 1) !important;
    }

    @keyframes srmFastViewIn {
      from { opacity: .72; transform: translate3d(0, 6px, 0); }
      to { opacity: 1; transform: translate3d(0, 0, 0); }
    }

    @keyframes srmFastModalIn {
      from { opacity: 0; transform: translate3d(0, 12px, 0) scale(.992); }
      to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
    }

    :where(.nav button) .nav-icon {
      --nav-icon-image: none;
      position: relative !important;
      width: 28px !important;
      height: 28px !important;
      min-width: 28px !important;
      display: inline-grid !important;
      place-items: center !important;
      overflow: hidden !important;
      color: #dce9fb !important;
      background:
        var(--nav-icon-image),
        linear-gradient(145deg, rgba(139, 92, 246, .22), rgba(56, 189, 248, .12)) !important;
      background-repeat: no-repeat !important;
      background-position: center !important;
      background-size: 72%, cover !important;
      border: 1px solid rgba(148, 163, 184, .22) !important;
      border-radius: 11px !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 8px 18px rgba(0, 0, 0, .18) !important;
    }

    :where(.nav button.active) .nav-icon {
      color: #ffffff !important;
      border-color: rgba(255, 255, 255, .24) !important;
      background:
        var(--nav-icon-image),
        linear-gradient(145deg, rgba(255, 255, 255, .18), rgba(56, 189, 248, .14)) !important;
    }

    :where(.nav button) .nav-icon::before,
    :where(.nav button) .nav-icon::after {
      content: "";
      position: absolute;
      display: block;
      box-sizing: border-box;
      background: currentColor;
      border-color: currentColor;
      box-shadow: none;
      -webkit-mask: none !important;
      mask: none !important;
    }

    .nav button[data-view="dashboard"] .nav-icon::before {
      width: 5px; height: 5px; border-radius: 2px;
      left: 8px; top: 8px;
      box-shadow: 8px 0 0 currentColor, 0 8px 0 currentColor, 8px 8px 0 currentColor;
    }

    .nav button[data-view="pos"] .nav-icon::before {
      width: 15px; height: 11px; left: 7px; top: 10px;
      border-radius: 3px; background: transparent; border: 2px solid currentColor;
    }
    .nav button[data-view="pos"] .nav-icon::after {
      width: 9px; height: 2px; left: 10px; top: 14px; border-radius: 2px;
      box-shadow: 0 4px 0 currentColor;
    }

    .nav button[data-view="documents"] .nav-icon::before {
      width: 13px; height: 16px; left: 8px; top: 6px;
      border-radius: 3px; background: transparent; border: 2px solid currentColor;
    }
    .nav button[data-view="documents"] .nav-icon::after {
      width: 7px; height: 2px; left: 11px; top: 11px; border-radius: 2px;
      box-shadow: 0 5px 0 currentColor;
    }

    .nav button[data-view="stock"] .nav-icon::before {
      width: 14px; height: 14px; left: 7px; top: 8px;
      background: transparent; border: 2px solid currentColor; border-radius: 3px;
      transform: rotate(45deg);
    }
    .nav button[data-view="stock"] .nav-icon::after {
      width: 10px; height: 2px; left: 9px; top: 13px; border-radius: 2px;
    }

    .nav button[data-view="clients"] .nav-icon::before {
      width: 8px; height: 8px; left: 7px; top: 7px; border-radius: 50%;
      box-shadow: 7px 2px 0 -1px currentColor;
    }
    .nav button[data-view="clients"] .nav-icon::after {
      width: 17px; height: 8px; left: 6px; top: 17px;
      border-radius: 9px 9px 4px 4px;
    }

    .nav button[data-view="shifts"] .nav-icon::before {
      width: 16px; height: 16px; left: 6px; top: 6px;
      border-radius: 50%; background: transparent; border: 2px solid currentColor;
    }
    .nav button[data-view="shifts"] .nav-icon::after {
      width: 6px; height: 7px; left: 14px; top: 10px;
      background: transparent; border-left: 2px solid currentColor; border-bottom: 2px solid currentColor;
    }

    .nav button[data-view="reports"] .nav-icon::before {
      width: 3px; height: 10px; left: 8px; top: 12px; border-radius: 2px;
      box-shadow: 6px -4px 0 currentColor, 12px -8px 0 currentColor;
    }
    .nav button[data-view="reports"] .nav-icon::after {
      width: 17px; height: 2px; left: 6px; top: 22px; border-radius: 2px;
    }

    .nav button[data-view="history"] .nav-icon::before {
      width: 16px; height: 16px; left: 6px; top: 6px;
      border-radius: 50%; background: transparent; border: 2px solid currentColor;
    }
    .nav button[data-view="history"] .nav-icon::after {
      width: 8px; height: 6px; left: 11px; top: 11px;
      background: transparent; border-left: 2px solid currentColor; border-bottom: 2px solid currentColor;
    }

    .nav button[data-view="receipts"] .nav-icon::before {
      width: 15px; height: 18px; left: 7px; top: 5px;
      border-radius: 3px 3px 6px 6px; background: transparent; border: 2px solid currentColor;
    }
    .nav button[data-view="receipts"] .nav-icon::after {
      width: 9px; height: 2px; left: 10px; top: 10px; border-radius: 2px;
      box-shadow: 0 5px 0 currentColor;
    }

    .nav button[data-view="notes"] .nav-icon::before {
      width: 16px; height: 4px; left: 7px; top: 13px; border-radius: 4px;
      transform: rotate(-35deg);
    }
    .nav button[data-view="notes"] .nav-icon::after {
      width: 5px; height: 5px; left: 18px; top: 8px; border-radius: 1px;
      transform: rotate(-35deg);
    }

    .nav button[data-view="settings"] .nav-icon::before {
      width: 16px; height: 16px; left: 6px; top: 6px;
      border-radius: 50%; background: transparent; border: 3px dotted currentColor;
    }
    .nav button[data-view="settings"] .nav-icon::after {
      width: 6px; height: 6px; left: 11px; top: 11px; border-radius: 50%;
    }

    body.android-shell .shift-box.as-nav-note .quick-support-button {
      position: relative !important;
    }

    body.android-shell .support-unread-badge,
    body:not(.android-shell) .support-unread-badge {
      position: absolute !important;
      right: 8px !important;
      top: 50% !important;
      transform: translateY(-50%) !important;
    }

    :where(.brand-mark, .settings-logo-preview) {
      display: grid !important;
      place-items: center !important;
      background-color: #071522 !important;
      background-image: url("assets/shopsrm-icon-256.png") !important;
      background-position: center !important;
      background-repeat: no-repeat !important;
      background-size: contain !important;
      color: transparent !important;
      overflow: hidden !important;
    }

    :where(.brand-mark, .settings-logo-preview) img {
      width: 100% !important;
      height: 100% !important;
      display: block !important;
      object-fit: contain !important;
    }

    .nav button .nav-icon {
      width: 28px !important;
      height: 28px !important;
      min-width: 28px !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      padding: 0 !important;
      margin: 0 !important;
      line-height: 0 !important;
      transform: none !important;
    }

    .nav button .nav-icon::before,
    .nav button .nav-icon::after {
      content: none !important;
      display: none !important;
    }

    .nav button .nav-icon svg {
      width: 17px !important;
      height: 17px !important;
      display: block !important;
      flex: 0 0 auto !important;
      margin: 0 !important;
      transform: none !important;
      stroke: currentColor !important;
      stroke-width: 2.2 !important;
      stroke-linecap: round !important;
      stroke-linejoin: round !important;
      fill: none !important;
    }

    .shift-box.as-nav-note {
      align-content: start !important;
    }

    .shift-box.as-nav-note .sidebar-actions-row {
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) minmax(0, .95fr) !important;
      gap: 6px !important;
      min-width: 0 !important;
    }

    .shift-box.as-nav-note .quick-support-button,
    .shift-box.as-nav-note .quick-sync-button {
      width: 100% !important;
      min-width: 0 !important;
      min-height: 30px !important;
      padding: 6px 8px !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      text-align: center !important;
      white-space: nowrap !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
      font-size: 11px !important;
      line-height: 1.1 !important;
    }

    .shift-box.as-nav-note .quick-sync-button {
      grid-column: auto !important;
    }

    .shift-box.as-nav-note .quick-sync-button::before {
      margin-right: 6px !important;
    }

    .shift-box.as-nav-note .shift-state-line {
      width: 100% !important;
      min-height: 28px !important;
      display: flex !important;
      align-items: center !important;
      justify-content: flex-start !important;
      gap: 8px !important;
      padding: 6px 8px !important;
      border-radius: 10px !important;
      background: rgba(18, 32, 48, .72) !important;
      border: 1px solid rgba(166, 190, 214, .13) !important;
      color: #edf5ff !important;
    }

    .shift-box.as-nav-note .shift-lamp,
    .shift-box.as-nav-note .shift-lamp.open {
      display: block !important;
      flex: 0 0 9px !important;
      width: 9px !important;
      min-width: 9px !important;
      height: 9px !important;
      min-height: 9px !important;
      margin: 0 !important;
      padding: 0 !important;
      border-radius: 999px !important;
      transform-origin: center !important;
    }

    .shift-box.as-nav-note .shift-lamp.open {
      background: #46df91 !important;
      box-shadow: 0 0 0 3px rgba(70, 223, 145, .13), 0 0 14px rgba(70, 223, 145, .58) !important;
    }

    .shift-box.as-nav-note #shiftState {
      min-width: 0 !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
      white-space: nowrap !important;
      color: #eef8f6 !important;
    }

    .shift-box.as-nav-note #syncState.sync-state {
      width: 100% !important;
      min-height: 44px !important;
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) auto !important;
      align-items: center !important;
      gap: 8px !important;
      margin: 0 !important;
      padding: 7px 9px !important;
      border: 1px solid rgba(166, 190, 214, .13) !important;
      border-radius: 12px !important;
      background: rgba(7, 13, 24, .76) !important;
      color: #d8e5f0 !important;
      text-align: left !important;
      cursor: default !important;
      box-shadow: none !important;
    }

    .shift-box.as-nav-note #syncState.sync-state.error {
      cursor: pointer !important;
      border-color: rgba(248, 113, 113, .34) !important;
      background: rgba(48, 18, 24, .58) !important;
    }

    .sync-state-main {
      min-width: 0 !important;
      display: grid !important;
      gap: 2px !important;
    }

    .sync-state-main strong {
      color: #eef8f6 !important;
      font-size: 11.5px !important;
      line-height: 1.15 !important;
    }

    .sync-state-main span {
      color: rgba(216, 229, 240, .72) !important;
      font-size: 10.5px !important;
      line-height: 1.18 !important;
      white-space: nowrap !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
    }

    .sync-state-icon {
      width: 22px !important;
      height: 22px !important;
      display: none !important;
      place-items: center !important;
      border-radius: 999px !important;
      background: rgba(248, 113, 113, .16) !important;
      color: #fecaca !important;
      border: 1px solid rgba(248, 113, 113, .34) !important;
      font-weight: 900 !important;
      line-height: 1 !important;
    }

    .sync-state.error .sync-state-icon {
      display: grid !important;
    }

    body:not(.android-shell) .shift-box.as-nav-note .sidebar-actions-row {
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
      grid-column: 1 / -1 !important;
      gap: 6px !important;
      width: 100% !important;
    }

    body:not(.android-shell) .shift-box.as-nav-note .quick-purchase-button,
    body.android-shell .shift-box.as-nav-note .quick-purchase-button {
      grid-column: 1 / -1 !important;
      width: 100% !important;
    }

    body:not(.android-shell) .shift-box.as-nav-note .quick-support-button,
    body:not(.android-shell) .shift-box.as-nav-note .quick-sync-button {
      grid-column: auto !important;
      width: 100% !important;
      min-width: 0 !important;
      white-space: nowrap !important;
    }

    body:not(.android-shell) .shift-box.as-nav-note #syncState.sync-state {
      display: grid !important;
    }

    @media (max-height: 820px) {
      body:not(.android-shell) .sidebar {
        gap: 6px !important;
        padding-top: 8px !important;
        padding-bottom: 8px !important;
      }

      body:not(.android-shell) .brand {
        min-height: 58px !important;
        padding: 8px !important;
      }

      body:not(.android-shell) .brand-mark {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
      }

      body:not(.android-shell) .nav {
        gap: 2px !important;
        padding-top: 3px !important;
      }

      body:not(.android-shell) .nav button {
        min-height: 28px !important;
        padding: 4px 8px !important;
        font-size: 11.6px !important;
      }

      body:not(.android-shell) .nav button .nav-icon {
        width: 25px !important;
        height: 25px !important;
        min-width: 25px !important;
      }

      body:not(.android-shell) .nav button .nav-icon svg {
        width: 15.5px !important;
        height: 15.5px !important;
      }

      body:not(.android-shell) .shift-box.as-nav-note {
        gap: 4px !important;
        padding: 6px !important;
      }

      body:not(.android-shell) .shift-box.as-nav-note .quick-profile-button,
      body:not(.android-shell) .shift-box.as-nav-note .quick-support-button,
      body:not(.android-shell) .shift-box.as-nav-note .quick-sync-button {
        min-height: 28px !important;
        padding: 4px 7px !important;
        font-size: 10.4px !important;
        line-height: 1 !important;
      }

      body:not(.android-shell) .shift-box.as-nav-note .quick-sync-button::before {
        display: none !important;
      }

      body:not(.android-shell) .shift-box.as-nav-note .shift-state-line {
        min-height: 26px !important;
        padding: 4px 8px !important;
      }

      body:not(.android-shell) .shift-box.as-nav-note #shiftState,
      body:not(.android-shell) .shift-box.as-nav-note .shift-state-line strong {
        font-size: 10.8px !important;
      }

      body:not(.android-shell) .shift-box.as-nav-note #syncState.sync-state {
        min-height: 40px !important;
        padding: 6px 8px !important;
      }

      body:not(.android-shell) .shift-box.as-nav-note #syncState.sync-state strong,
      body:not(.android-shell) .shift-box.as-nav-note #syncState.sync-state span {
        font-size: 10px !important;
      }
    }

    body:not(.android-shell) #view-shifts .shift-table-wrap {
      width: 100% !important;
      max-height: min(62vh, 620px) !important;
      overflow: auto !important;
      padding-bottom: 6px !important;
    }

    body:not(.android-shell) #view-shifts table.shift-table,
    body:not(.android-shell) #view-reports table.shift-table {
      table-layout: fixed !important;
      min-width: 980px !important;
      width: 100% !important;
    }

    body:not(.android-shell) table.shift-table .shift-col-status { width: 8.5%; }
    body:not(.android-shell) table.shift-table .shift-col-seller { width: 15%; }
    body:not(.android-shell) table.shift-table .shift-col-date { width: 12%; }
    body:not(.android-shell) table.shift-table .shift-col-activity { width: 10%; }
    body:not(.android-shell) table.shift-table .shift-col-checks { width: 6.5%; }
    body:not(.android-shell) table.shift-table .shift-col-revenue { width: 12%; }
    body:not(.android-shell) table.shift-table .shift-col-actions { width: 24%; }

    body:not(.android-shell) table.shift-table th,
    body:not(.android-shell) table.shift-table td {
      padding: 7px 8px !important;
      vertical-align: middle !important;
      overflow-wrap: normal !important;
      word-break: normal !important;
    }

    body:not(.android-shell) table.shift-table .shift-action-cell {
      min-width: 230px !important;
    }

    body:not(.android-shell) table.shift-table .shift-row-actions {
      display: flex !important;
      flex-wrap: nowrap !important;
      align-items: center !important;
      justify-content: flex-end !important;
      gap: 6px !important;
      min-width: 0 !important;
    }

    body:not(.android-shell) table.shift-table .shift-table-action {
      flex: 0 0 auto !important;
      min-height: 28px !important;
      height: 28px !important;
      min-width: 62px !important;
      padding: 4px 8px !important;
      font-size: 11px !important;
      line-height: 1 !important;
      white-space: nowrap !important;
    }

    body:not(.android-shell) #view-reports:not(.hidden) {
      display: flex !important;
      flex-direction: column !important;
      min-height: 0 !important;
      height: 100% !important;
      overflow: hidden !important;
    }

    body:not(.android-shell) #view-reports > .panel {
      flex: 1 1 auto !important;
      min-height: 0 !important;
      max-height: calc(100dvh - 132px) !important;
      display: flex !important;
      flex-direction: column !important;
      overflow: hidden !important;
    }

    body:not(.android-shell) #view-reports > .panel > .report-toolbar {
      flex: 0 0 auto !important;
      position: relative !important;
      top: auto !important;
      z-index: 2 !important;
    }

    body:not(.android-shell) #view-reports > .panel > .report-scroll-body {
      flex: 1 1 auto !important;
      min-height: 0 !important;
      max-height: none !important;
      overflow-y: auto !important;
      overflow-x: hidden !important;
      padding-bottom: 96px !important;
      scroll-padding-bottom: 96px !important;
    }

    body:not(.android-shell) #view-reports .report-scroll-body > .panel,
    body:not(.android-shell) #view-reports .report-scroll-body > .report-payment-panel {
      flex: 0 0 auto !important;
      overflow: hidden !important;
    }

    body:not(.android-shell) #view-reports .report-scroll-body > .panel > .panel-body,
    body:not(.android-shell) #view-reports .report-payment-panel > .panel-body {
      max-height: none !important;
      overflow-x: auto !important;
      overflow-y: visible !important;
    }

    body:not(.android-shell) #view-history > .panel,
    body:not(.android-shell) #view-history .history-list {
      background: linear-gradient(180deg, rgba(5, 10, 18, .96), rgba(3, 7, 14, .98)) !important;
      border-color: rgba(99, 116, 145, .18) !important;
    }

    body:not(.android-shell) #view-history .panel-body {
      background: transparent !important;
    }

    body:not(.android-shell) #view-history .history-list {
      padding: 12px !important;
      border-radius: 16px !important;
      gap: 12px !important;
      overflow: visible !important;
    }

    body:not(.android-shell) #view-history .history-cell,
    body:not(.android-shell) #view-history .history-cell-with-actions,
    body:not(.android-shell) #view-history .compact-event {
      width: 100% !important;
      min-height: 0 !important;
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) minmax(132px, max-content) !important;
      align-items: stretch !important;
      gap: 10px !important;
      padding: 10px !important;
      border: 1px solid rgba(119, 141, 169, .20) !important;
      border-radius: 16px !important;
      background: linear-gradient(180deg, rgba(7, 13, 24, .98), rgba(3, 8, 17, .98)) !important;
      color: #f5f8ff !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035), 0 16px 34px rgba(0, 0, 0, .22) !important;
      overflow: visible !important;
    }

    body:not(.android-shell) #view-history .history-cell:hover,
    body:not(.android-shell) #view-history .history-cell-with-actions:hover {
      border-color: rgba(91, 200, 255, .32) !important;
      background: linear-gradient(180deg, rgba(10, 19, 34, .99), rgba(5, 11, 22, .99)) !important;
    }

    body:not(.android-shell) #view-history .history-main-button,
    body:not(.android-shell) #view-history .history-main-button.event-button,
    body:not(.android-shell) #view-history .history-cell.compact-event > .history-main-button.event-button {
      width: 100% !important;
      min-width: 0 !important;
      min-height: 76px !important;
      display: grid !important;
      grid-template-columns: minmax(112px, .34fr) minmax(0, 1.8fr) minmax(56px, auto) !important;
      align-items: center !important;
      gap: 14px !important;
      padding: 14px 16px !important;
      border: 1px solid rgba(109, 132, 162, .18) !important;
      border-radius: 14px !important;
      background: linear-gradient(180deg, rgba(11, 22, 38, .94), rgba(7, 14, 27, .94)) !important;
      color: #f5f8ff !important;
      text-align: left !important;
      box-shadow: none !important;
      overflow: visible !important;
      cursor: pointer !important;
    }

    body:not(.android-shell) #view-history .history-main-button:hover,
    body:not(.android-shell) #view-history .history-main-button.event-button:hover {
      border-color: rgba(91, 200, 255, .36) !important;
      background: linear-gradient(180deg, rgba(16, 31, 51, .96), rgba(8, 18, 34, .96)) !important;
    }

    body:not(.android-shell) #view-history .history-main-button > *,
    body:not(.android-shell) #view-history .event-copy-cell,
    body:not(.android-shell) #view-history .event-date-cell {
      min-width: 0 !important;
      overflow: visible !important;
    }

    body:not(.android-shell) #view-history .history-main-button strong,
    body:not(.android-shell) #view-history .history-main-button span:not(.tag),
    body:not(.android-shell) #view-history .event-copy-cell strong,
    body:not(.android-shell) #view-history .event-copy-cell span:not(.tag) {
      white-space: normal !important;
      overflow: visible !important;
      text-overflow: clip !important;
      overflow-wrap: anywhere !important;
    }

    body:not(.android-shell) #view-history .history-item-actions {
      width: 132px !important;
      display: grid !important;
      grid-template-columns: 1fr !important;
      align-content: center !important;
      gap: 6px !important;
      padding: 0 !important;
      background: transparent !important;
      border: 0 !important;
    }

    body:not(.android-shell) #view-history .history-item-actions .btn {
      width: 100% !important;
      min-height: 28px !important;
      height: 28px !important;
      padding: 4px 8px !important;
      font-size: 11px !important;
      line-height: 1.1 !important;
      white-space: nowrap !important;
    }

    body:not(.android-shell) #view-history .sync-history-cell .event-copy-cell strong {
      color: #ffffff !important;
    }

    body:not(.android-shell) .sync-history-detail .summary-table td:first-child {
      width: 210px;
      color: rgba(197, 211, 232, .78) !important;
    }

    body:not(.android-shell) :where(.document-print-preview, .document-preview-wrap, .document-print-modal-body, .preview-wrapper) .document-print-page,
    body:not(.android-shell) :where(.document-print-preview, .document-preview-wrap, .document-print-modal-body, .preview-wrapper) .document-print-page :where(table, thead, tbody, tr, th, td),
    body:not(.android-shell) #printRoot.report-print,
    body:not(.android-shell) #printRoot.report-print :where(table, thead, tbody, tr, th, td) {
      background: #ffffff !important;
      color: #000000 !important;
      border-color: #000000 !important;
      box-shadow: none !important;
      text-shadow: none !important;
    }

    body:not(.android-shell) :where(.document-print-preview, .document-preview-wrap, .document-print-modal-body, .preview-wrapper) .document-print-page table,
    body:not(.android-shell) #printRoot.report-print table {
      border: 2px solid #000000 !important;
      border-collapse: collapse !important;
    }

    body:not(.android-shell) :where(.document-print-preview, .document-preview-wrap, .document-print-modal-body, .preview-wrapper) .document-print-page :where(th, td),
    body:not(.android-shell) #printRoot.report-print :where(th, td) {
      border: 1.5px solid #000000 !important;
    }

    body:not(.android-shell) :where(.document-print-preview, .document-preview-wrap, .document-print-modal-body, .preview-wrapper) .document-print-page :where(h1, h2, h3, h4, .report-meta, strong, span, p, div),
    body:not(.android-shell) #printRoot.report-print :where(h1, h2, h3, h4, .report-meta, strong, span, p, div) {
      color: #000000 !important;
    }

    body:not(.android-shell) .nav button > span.nav-icon {
      width: 30px !important;
      height: 30px !important;
      min-width: 30px !important;
      display: inline-grid !important;
      place-items: center !important;
      color: #e5efff !important;
      background:
        radial-gradient(circle at 32% 24%, rgba(255, 255, 255, .16), transparent 34%),
        linear-gradient(145deg, rgba(124, 92, 255, .30), rgba(37, 182, 255, .13)) !important;
      border: 1px solid rgba(142, 124, 255, .26) !important;
      border-radius: 12px !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 8px 18px rgba(0, 0, 0, .18) !important;
      overflow: hidden !important;
    }

    body:not(.android-shell) .nav button.active > span.nav-icon {
      color: #ffffff !important;
      background:
        radial-gradient(circle at 32% 24%, rgba(255, 255, 255, .20), transparent 34%),
        linear-gradient(145deg, rgba(124, 92, 255, .58), rgba(37, 182, 255, .24)) !important;
      border-color: rgba(199, 210, 254, .34) !important;
    }

    body:not(.android-shell) .nav button > span.nav-icon::before,
    body:not(.android-shell) .nav button > span.nav-icon::after {
      content: none !important;
      display: none !important;
    }

    body:not(.android-shell) .nav button > span.nav-icon svg {
      width: 18px !important;
      height: 18px !important;
      display: block !important;
      margin: 0 !important;
      transform: none !important;
      stroke: currentColor !important;
      fill: none !important;
    }

    body.android-shell {
      --android-bg-deep: #020711;
      --android-bg: #050b16;
      --android-card: rgba(9, 17, 32, .96);
      --android-card-2: rgba(13, 24, 44, .92);
      --android-field: rgba(3, 9, 20, .98);
      --android-field-2: rgba(8, 16, 30, .98);
      --android-line: rgba(127, 113, 255, .28);
      --android-line-soft: rgba(145, 164, 190, .16);
      --android-text: #f8fbff;
      --android-muted: #bcc9dd;
      --android-muted-2: #8ea0b8;
      --android-accent: #7c5cff;
      --android-accent-2: #25b6ff;
      --android-status-ok: #36e49a;
      color-scheme: dark !important;
      color: var(--android-text) !important;
      background:
        radial-gradient(circle at 16% 10%, rgba(37, 182, 255, .15), transparent 34%),
        radial-gradient(circle at 88% 18%, rgba(124, 92, 255, .17), transparent 36%),
        linear-gradient(180deg, var(--android-bg), var(--android-bg-deep) 72%) !important;
    }

    body.android-shell,
    body.android-shell * {
      box-sizing: border-box !important;
      letter-spacing: 0 !important;
    }

    body.android-shell :where(.app, .main, .workspace, .view, .view.active, .login-screen) {
      background: transparent !important;
      color: var(--android-text) !important;
      max-width: 100vw !important;
      overflow-x: hidden !important;
    }

    body.android-shell :where(.panel, .card, .stat, .tile, .section-card, .settings-card, .settings-mini, .network-card, .network-metric, .integration-card, .table-wrap, .table-scroll, .modal, .child-modal, .bottom-sheet, .drawer, .login-card, .activation-main-panel, .activation-side-panel, .activation-purchase-modal, .employee-login-card, .subscription-box, .warehouse-card, .counterparty-card, .history-card, .event-card, .note-card, .total-box, .summary-box, .cart-list, .customer-panel, .pos-receipts-history) {
      color: var(--android-text) !important;
      background: linear-gradient(180deg, var(--android-card-2), var(--android-card)) !important;
      border-color: var(--android-line-soft) !important;
      box-shadow: 0 18px 44px rgba(0, 0, 0, .30), inset 0 1px 0 rgba(255, 255, 255, .045) !important;
    }

    body.android-shell :where(input, select, textarea, .input, .select, .textarea, .input-like, .field, .numeric-input, .date-input, [contenteditable="true"]):not([type="checkbox"]):not([type="radio"]) {
      width: 100% !important;
      min-width: 0 !important;
      color: var(--android-text) !important;
      -webkit-text-fill-color: var(--android-text) !important;
      background: linear-gradient(180deg, var(--android-field-2), var(--android-field)) !important;
      border: 1px solid var(--android-line-soft) !important;
      border-radius: 14px !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 0 0 1000px transparent inset !important;
      caret-color: var(--android-accent-2) !important;
      outline: none !important;
    }

    body.android-shell :where(input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill) {
      -webkit-text-fill-color: var(--android-text) !important;
      -webkit-box-shadow: 0 0 0 1000px #07101d inset !important;
      box-shadow: 0 0 0 1000px #07101d inset !important;
    }

    body.android-shell :where(input::placeholder, textarea::placeholder) {
      color: rgba(188, 201, 221, .74) !important;
      -webkit-text-fill-color: rgba(188, 201, 221, .74) !important;
      opacity: 1 !important;
    }

    body.android-shell :where(select option) {
      color: var(--android-text) !important;
      background: #07101d !important;
    }

    body.android-shell :where(h1, h2, h3, h4, h5, h6, strong, b, th, .amount, .price, .money-fit, .total-line.big strong) {
      color: var(--android-text) !important;
    }

    body.android-shell :where(p, span, small, label, td, li, .muted, .hint, .description, .caption, .subtitle, .meta, .tag, .badge, .pill, .integration-status, .payment-counterparty-label, .sync-state, .sync-state span) {
      color: var(--android-muted) !important;
    }

    body.android-shell :where(.green, .accent-green, .green-text, .success, .ok, .integration-status.green, [style*="color:#0"], [style*="color: #0"], [style*="color:green"], [style*="color: green"]):not(.shift-lamp):not(.status-dot):not(.lamp):not(.indicator):not(.online-dot) {
      color: var(--android-muted) !important;
    }

    body.android-shell :where([style*="background:#fff"], [style*="background: #fff"], [style*="background:white"], [style*="background: white"], [style*="background-color:#fff"], [style*="background-color: #fff"], [style*="background-color:white"], [style*="background-color: white"]) {
      background: var(--android-card) !important;
      color: var(--android-text) !important;
      border-color: var(--android-line-soft) !important;
    }

    body.android-shell :where(.document-print-page, .document-print-page *, .receipt, .receipt *, #receiptPrint, #receiptPrint *, #labelPreviewCard, #labelPreviewCard *, .print-page, .print-page *) {
      background: #ffffff !important;
      color: #111827 !important;
    }

    body.android-shell :where(.btn, button, .button):not(.brand):not(.mobile-nav-toggle):not(.app-exit-button) {
      color: var(--android-text) !important;
      background: linear-gradient(180deg, rgba(17, 28, 49, .96), rgba(6, 13, 26, .98)) !important;
      border-color: var(--android-line-soft) !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055) !important;
    }

    body.android-shell :where(.btn.primary, button.primary, .nav button.active, .tabs button.active, .segmented button.active, [aria-selected="true"]) {
      color: #ffffff !important;
      background: linear-gradient(135deg, var(--android-accent), var(--android-accent-2)) !important;
      border-color: rgba(127, 113, 255, .44) !important;
      box-shadow: 0 14px 34px rgba(37, 182, 255, .17), inset 0 1px 0 rgba(255, 255, 255, .12) !important;
    }

    body.android-shell :where(.shift-lamp, .status-dot, .lamp, .indicator, .online-dot) {
      background: var(--android-status-ok) !important;
      color: var(--android-status-ok) !important;
    }

    body.android-shell .view:not(.hidden) {
      padding-bottom: max(96px, calc(env(safe-area-inset-bottom, 0px) + 72px)) !important;
    }

    @media (orientation: portrait) and (min-width: 681px) and (max-width: 920px) {
      body.android-shell {
        --tablet-sidebar: clamp(232px, 30vw, 262px);
        --tablet-pad: clamp(12px, 1.8vw, 18px);
        --tablet-gap: clamp(10px, 1.45vw, 14px);
      }

      body.android-shell .app {
        grid-template-columns: var(--tablet-sidebar) minmax(0, 1fr) !important;
        gap: var(--tablet-gap) !important;
        padding:
          max(8px, env(safe-area-inset-top, 0px))
          var(--tablet-pad)
          max(88px, env(safe-area-inset-bottom, 0px))
          var(--tablet-pad) !important;
      }

      body.android-shell .sidebar {
        width: var(--tablet-sidebar) !important;
        min-width: var(--tablet-sidebar) !important;
        max-width: var(--tablet-sidebar) !important;
        gap: 10px !important;
        padding: 11px !important;
        border-radius: 22px !important;
      }

      body.android-shell .brand {
        min-height: 58px !important;
        grid-template-columns: 46px minmax(0, 1fr) 30px !important;
        gap: 9px !important;
        padding: 8px !important;
        border-radius: 18px !important;
        overflow: hidden !important;
      }

      body.android-shell .brand::after {
        grid-column: 3 !important;
        grid-row: 1 !important;
        align-self: center !important;
        justify-self: end !important;
      }

      body.android-shell .brand > div:not(.brand-mark) {
        min-width: 0 !important;
        overflow: hidden !important;
      }

      body.android-shell .brand-mark {
        width: 46px !important;
        height: 46px !important;
        min-width: 46px !important;
        border-radius: 16px !important;
      }

      body.android-shell .brand h1 {
        max-width: 100% !important;
        font-size: 14px !important;
        line-height: 1.08 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
      }

      body.android-shell .brand span {
        max-width: 100% !important;
        font-size: 11px !important;
        line-height: 1.12 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
      }

      body.android-shell .nav {
        gap: 6px !important;
      }

      body.android-shell .nav button {
        min-height: 37px !important;
        grid-template-columns: 28px minmax(0, 1fr) auto !important;
        gap: 8px !important;
        padding: 6px 8px !important;
        border-radius: 14px !important;
        font-size: 12.2px !important;
      }

      body.android-shell .nav button > span.nav-icon,
      body.android-shell .nav button > span:first-child {
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
        border-radius: 11px !important;
      }

      body.android-shell .nav button > span.nav-icon svg {
        width: 16px !important;
        height: 16px !important;
      }

      body.android-shell .nav .badge,
      body.android-shell .nav button > span:last-child:not(:empty) {
        min-width: 21px !important;
        height: 21px !important;
        padding: 0 6px !important;
        font-size: 10.5px !important;
      }

      body.android-shell .shift-box.as-nav-note {
        grid-template-areas:
          "profile"
          "actions"
          "shift"
          "state" !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 7px !important;
        padding: 9px !important;
        border-radius: 18px !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button { grid-area: profile !important; }
      body.android-shell .shift-box.as-nav-note .sidebar-actions-row {
        grid-area: actions !important;
        width: 100% !important;
        min-width: 0 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 6px !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-support-button,
      body.android-shell .shift-box.as-nav-note .quick-sync-button {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 30px !important;
        padding: 5px 6px !important;
        font-size: 10px !important;
        line-height: 1.05 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button,
      body.android-shell .shift-box.as-nav-note .shift-state-line {
        min-height: 34px !important;
        padding: 6px 8px !important;
        font-size: 11px !important;
      }

      body.android-shell .shift-box.as-nav-note #syncState {
        min-height: 38px !important;
        max-height: 46px !important;
        padding: 6px 8px !important;
        font-size: 9.5px !important;
      }

      body.android-shell .topline {
        min-height: 78px !important;
        padding: 16px 18px !important;
        border-radius: 22px !important;
      }

      body.android-shell .topline::after {
        width: 34px !important;
        height: 34px !important;
        border-radius: 13px !important;
      }

      body.android-shell .topline h2 {
        font-size: clamp(25px, 3.2vw, 32px) !important;
      }

      body.android-shell .topline p {
        font-size: 13px !important;
        line-height: 1.22 !important;
      }

      body.android-shell :where(.panel, .settings-card, .settings-mini, .section-card, .stat, .network-card, .integration-card, .table-wrap, .modal, .payment-order-card, .subscription-settings-card, .warehouse-card) {
        border-radius: 19px !important;
      }

      body.android-shell :where(.panel-body, .modal .panel-body) {
        padding: 14px !important;
      }

      body.android-shell :where(.stats-grid, .dashboard-stats, .network-metrics, #view-settings .network-metrics, #view-settings .settings-mini-grid, #view-settings .settings-summary) {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
      }

      body.android-shell #view-settings .settings-summary .stat {
        min-height: 96px !important;
        padding: 14px !important;
        border-radius: 18px !important;
      }

      body.android-shell #view-settings .settings-summary .stat::before,
      body.android-shell #view-settings .network-metric::before,
      body.android-shell #view-settings .settings-tabs button::before {
        width: 28px !important;
        height: 28px !important;
        top: 12px !important;
        right: 12px !important;
        border-radius: 11px !important;
      }

      body.android-shell #view-settings .settings-summary .stat strong {
        font-size: clamp(19px, 2.6vw, 23px) !important;
      }

      body.android-shell #view-settings .settings-tabs-panel {
        padding: 10px !important;
        border-radius: 20px !important;
      }

      body.android-shell #view-settings .settings-tabs {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
      }

      body.android-shell #view-settings .settings-tabs button {
        min-height: 44px !important;
        padding: 8px 10px 8px 42px !important;
        font-size: 11.8px !important;
        border-radius: 14px !important;
      }

      body.android-shell :where(.pos-grid, .cash-grid, .documents-grid, .settings-layout, .settings-grid, .report-grid) {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 12px !important;
      }

      body.android-shell #view-pos .pos-grid,
      body.android-shell #view-pos .cash-grid {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
      }

      body.android-shell :where(.toolbar, .row-actions, .form-actions, .activation-actions-grid, .activation-top-actions) {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
      }

      body.android-shell :where(.toolbar .btn, .row-actions .btn, .form-actions .btn, .activation-actions-grid .btn) {
        min-width: min(100%, 132px) !important;
        flex: 1 1 132px !important;
      }

      body.android-shell :where(.cart-item, .document-card, .history-card, .event-card, .counterparty-card, .warehouse-card) {
        overflow: hidden !important;
      }
    }

    @media (orientation: landscape) and (min-width: 681px) and (max-width: 1280px) {
      body.android-shell {
        --tablet-land-sidebar: clamp(214px, 21vw, 248px);
        --tablet-land-gap: 12px;
      }

      body.android-shell .app {
        grid-template-columns: var(--tablet-land-sidebar) minmax(0, 1fr) !important;
        gap: var(--tablet-land-gap) !important;
        padding: max(8px, env(safe-area-inset-top, 0px)) 12px max(74px, env(safe-area-inset-bottom, 0px)) 12px !important;
        overflow: hidden !important;
      }

      body.android-shell .sidebar {
        width: var(--tablet-land-sidebar) !important;
        min-width: var(--tablet-land-sidebar) !important;
        max-width: var(--tablet-land-sidebar) !important;
        padding: 10px !important;
        gap: 7px !important;
        border-radius: 20px !important;
      }

      body.android-shell .brand {
        min-height: 50px !important;
        grid-template-columns: 38px minmax(0, 1fr) 26px !important;
        gap: 8px !important;
        padding: 6px !important;
        border-radius: 16px !important;
        overflow: hidden !important;
      }

      body.android-shell .brand > div:not(.brand-mark) {
        min-width: 0 !important;
        overflow: hidden !important;
      }

      body.android-shell .brand::after {
        grid-column: 3 !important;
        grid-row: 1 !important;
        width: 26px !important;
        height: 26px !important;
        align-self: center !important;
      }

      body.android-shell .brand-mark {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        border-radius: 13px !important;
      }

      body.android-shell .brand h1 {
        max-width: 100% !important;
        font-size: 12.5px !important;
        line-height: 1.05 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
      }

      body.android-shell .brand span {
        max-width: 100% !important;
        font-size: 10px !important;
        line-height: 1.05 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
      }

      body.android-shell .nav {
        gap: 4px !important;
        overflow: hidden !important;
      }

      body.android-shell .nav button {
        min-height: 31px !important;
        grid-template-columns: 24px minmax(0, 1fr) auto !important;
        gap: 7px !important;
        padding: 4px 7px !important;
        border-radius: 12px !important;
        font-size: 10.7px !important;
      }

      body.android-shell .nav button > span.nav-icon,
      body.android-shell .nav button > span:first-child {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        border-radius: 9px !important;
      }

      body.android-shell .nav button > span.nav-icon svg {
        width: 14px !important;
        height: 14px !important;
      }

      body.android-shell .nav .badge,
      body.android-shell .nav button > span:last-child:not(:empty) {
        min-width: 18px !important;
        height: 18px !important;
        padding: 0 5px !important;
        font-size: 9px !important;
      }

      body.android-shell .shift-box.as-nav-note {
        grid-template-areas:
          "profile"
          "actions"
          "shift"
          "state" !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 5px !important;
        padding: 7px !important;
        border-radius: 16px !important;
      }

      body.android-shell .shift-box.as-nav-note .sidebar-actions-row {
        grid-area: actions !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 5px !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-profile-button,
      body.android-shell .shift-box.as-nav-note .quick-support-button,
      body.android-shell .shift-box.as-nav-note .quick-sync-button,
      body.android-shell .shift-box.as-nav-note .shift-state-line {
        min-height: 27px !important;
        padding: 4px 6px !important;
        font-size: 9.6px !important;
        line-height: 1 !important;
      }

      body.android-shell .shift-box.as-nav-note #syncState {
        min-height: 32px !important;
        max-height: 38px !important;
        padding: 5px 6px !important;
        font-size: 8.7px !important;
      }

      body.android-shell .main,
      body.android-shell .workspace {
        padding: 0 !important;
        min-width: 0 !important;
        overflow: hidden !important;
      }

      body.android-shell .view:not(.hidden) {
        gap: 12px !important;
        padding-bottom: 84px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
      }

      body.android-shell .topline {
        min-height: 64px !important;
        padding: 12px 16px !important;
        border-radius: 19px !important;
      }

      body.android-shell .topline::after {
        width: 30px !important;
        height: 30px !important;
        border-radius: 11px !important;
      }

      body.android-shell .topline h2 {
        font-size: clamp(22px, 2.6vw, 30px) !important;
      }

      body.android-shell .topline p {
        font-size: 12px !important;
        line-height: 1.16 !important;
      }

      body.android-shell :where(.panel-body, .modal .panel-body) {
        padding: 12px !important;
      }

      body.android-shell :where(.pos-grid, .cash-grid, .documents-grid, .settings-layout, .settings-grid, .report-grid) {
        grid-template-columns: minmax(0, 1.12fr) minmax(260px, .88fr) !important;
        gap: 12px !important;
      }

      body.android-shell :where(.stats-grid, .dashboard-stats, .network-metrics, #view-settings .network-metrics, #view-settings .settings-mini-grid, #view-settings .settings-summary) {
        gap: 10px !important;
      }
    }

    @media (max-width: 680px) {
      body.android-shell .app {
        padding-left: max(8px, env(safe-area-inset-left, 0px)) !important;
        padding-right: max(8px, env(safe-area-inset-right, 0px)) !important;
        padding-bottom: max(78px, env(safe-area-inset-bottom, 0px)) !important;
      }

      body.android-shell .login-card.activation-login-card,
      body.android-shell .login-card,
      body.android-shell .modal {
        max-width: calc(100vw - 16px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
      }

      body.android-shell :where(.panel, .card, .stat, .section-card, .settings-card, .modal, .login-card) {
        border-radius: 18px !important;
      }

      body.android-shell :where(.toolbar, .row-actions, .form-actions, .activation-actions-grid, .activation-top-actions) {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
      }

      body.android-shell :where(.toolbar .btn, .row-actions .btn, .form-actions .btn, .activation-actions-grid .btn) {
        min-width: min(100%, 128px) !important;
        flex: 1 1 128px !important;
      }
    }

    body.android-shell :where(.login-screen, .activation-main-panel, .activation-side-panel) {
      overflow-x: hidden !important;
    }

    body.android-shell :where(.login-card.activation-login-card, .activation-main-panel, .activation-side-panel, .employee-login-card) {
      isolation: isolate !important;
      max-width: min(1180px, calc(100vw - 28px)) !important;
    }

    body.android-shell :where(.activation-login-card input, .activation-login-card select, .activation-login-card textarea, .employee-login-card input, .employee-login-card select, .employee-login-card textarea, .activation-purchase-modal input, .activation-purchase-modal select, .activation-purchase-modal textarea) {
      appearance: none !important;
      -webkit-appearance: none !important;
      height: auto !important;
      min-height: 48px !important;
      color: #f8fbff !important;
      -webkit-text-fill-color: #f8fbff !important;
      background:
        linear-gradient(180deg, rgba(10, 20, 38, .98), rgba(4, 10, 22, .99)) !important;
      border: 1px solid rgba(127, 113, 255, .34) !important;
      border-radius: 16px !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .05),
        0 0 0 1000px transparent inset !important;
    }

    body.android-shell :where(.activation-login-card input:focus, .activation-login-card select:focus, .activation-login-card textarea:focus, .employee-login-card input:focus, .employee-login-card select:focus, .employee-login-card textarea:focus, .activation-purchase-modal input:focus, .activation-purchase-modal select:focus, .activation-purchase-modal textarea:focus) {
      border-color: rgba(37, 182, 255, .70) !important;
      box-shadow:
        0 0 0 3px rgba(37, 182, 255, .12),
        inset 0 1px 0 rgba(255, 255, 255, .06),
        0 0 0 1000px transparent inset !important;
    }

    body.android-shell :where(.activation-login-card input::placeholder, .activation-login-card textarea::placeholder, .employee-login-card input::placeholder, .employee-login-card textarea::placeholder, .activation-purchase-modal input::placeholder, .activation-purchase-modal textarea::placeholder) {
      color: rgba(188, 201, 221, .76) !important;
      -webkit-text-fill-color: rgba(188, 201, 221, .76) !important;
    }

    body.android-shell :where(.activation-actions-grid, .activation-top-actions) {
      width: 100% !important;
      align-items: stretch !important;
    }

    body.android-shell :where(.activation-actions-grid .btn, .activation-top-actions .btn, .employee-login-card .btn) {
      min-height: 50px !important;
      border-radius: 16px !important;
      overflow: hidden !important;
    }

    body.android-shell :where(.activation-device-info, .activation-login-card .table-notice, .activation-side-panel, .activation-side-panel .section-card, .employee-login-card) {
      color: var(--android-text) !important;
      background:
        linear-gradient(180deg, rgba(11, 22, 40, .98), rgba(5, 11, 23, .99)) !important;
      border: 1px solid rgba(145, 164, 190, .22) !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045) !important;
    }

    body.android-shell :where(.activation-device-info *, .activation-side-panel *, .employee-login-card *) {
      color: var(--android-text) !important;
      -webkit-text-fill-color: currentColor !important;
    }

    body.android-shell :where(.activation-side-panel p, .employee-login-card p, .activation-side-panel label, .employee-login-card label) {
      color: var(--android-muted) !important;
    }

    body.android-shell.keyboard-open :where(.login-screen, .activation-login-card) {
      align-items: flex-start !important;
      justify-content: flex-start !important;
      overflow-y: auto !important;
      -webkit-overflow-scrolling: touch !important;
    }

    body.android-shell.keyboard-open .login-card.activation-login-card {
      margin-top: max(12px, env(safe-area-inset-top, 0px)) !important;
      margin-bottom: max(180px, calc(env(safe-area-inset-bottom, 0px) + 160px)) !important;
    }

    @media (prefers-reduced-motion: reduce) {
      body::before,
      body::after,
      :where(.modal, .child-modal, .shift-lamp.open, .status-dot.open, .lamp.open) {
        animation: none !important;
      }

      * {
        transition-duration: 1ms !important;
        scroll-behavior: auto !important;
      }
    }

    :root {
      color-scheme: dark;
      --srm-canvas: #050607;
      --srm-canvas-2: #08090b;
      --srm-surface-1: #0d0f12;
      --srm-surface-2: #131518;
      --srm-surface-3: #191c20;
      --srm-border-subtle: rgba(181, 184, 189, .14);
      --srm-border: rgba(181, 184, 189, .24);
      --srm-border-strong: rgba(199, 202, 207, .42);
      --srm-text-primary: #f4f5f6;
      --srm-text-secondary: #ced1d5;
      --srm-text-muted: #aeb2b8;
      --srm-accent: #9b9ea3;
      --srm-accent-2: #7d8187;
      --srm-accent-3: #686b70;
      --srm-success: #3ddc97;
      --srm-warning: #f8c14a;
      --srm-error: #ff6f7d;
      --srm-focus-ring: 0 0 0 3px rgba(181, 184, 189, .16), 0 0 0 1px rgba(199, 202, 207, .46);
      --srm-shadow-sm: 0 10px 28px rgba(0, 0, 0, .24);
      --srm-shadow-md: 0 18px 54px rgba(0, 0, 0, .34);

      --bg: var(--srm-canvas);
      --workspace-bg: var(--srm-canvas);
      --surface: var(--srm-surface-1);
      --surface-2: var(--srm-surface-2);
      --sidebar-bg: #080b12;
      --ink: var(--srm-text-primary);
      --text: var(--srm-text-primary);
      --muted: var(--srm-text-muted);
      --line: var(--srm-border-subtle);
      --primary: var(--srm-accent);
      --primary-2: var(--srm-accent-2);
      --accent: var(--srm-accent-3);
      --accent-strong: var(--srm-accent-2);
      --warn: var(--srm-warning);
      --ok: var(--srm-success);
      --button-gradient: linear-gradient(135deg, #4c4f54, #36393e 58%, #292c30);
      --shadow: var(--srm-shadow-md);
      --shadow-soft: var(--srm-shadow-sm);
    }

    body {
      background:
        radial-gradient(circle at 16% 10%, rgba(166, 170, 176, .09), transparent 30%),
        radial-gradient(circle at 86% 12%, rgba(128, 132, 138, .07), transparent 32%),
        radial-gradient(circle at 50% 92%, rgba(104, 107, 112, .06), transparent 36%),
        linear-gradient(180deg, var(--srm-canvas-2), var(--srm-canvas)) !important;
      color: var(--srm-text-primary) !important;
    }

    :where(.app, .main, .view, .login-screen) {
      background-color: transparent !important;
      color: var(--srm-text-primary) !important;
    }

    :where(.panel, .stat, .section-card, .settings-card, .network-card, .integration-card, .legal-group, .legal-doc-row, .support-chat-widget, .support-create-modal, .login-card, .modal, .child-modal, .table-notice, .event-button, .settings-mini, .shift-current, .counterparty-select-row, .report-editor, .settings-sync-strip, .logo-preview-card, .activation-main-panel, .activation-side-panel, .employee-login-card) {
      border-color: var(--srm-border-subtle) !important;
      background: linear-gradient(180deg, rgba(20, 21, 23, .97), rgba(10, 11, 13, .97)) !important;
      color: var(--srm-text-primary) !important;
      box-shadow: var(--srm-shadow-sm) !important;
    }

    :where(.panel-head, .modal-head, .table-head, thead, .settings-card .panel-head, .support-chat-widget .modal-head) {
      border-color: var(--srm-border-subtle) !important;
      background: rgba(15, 16, 18, .94) !important;
      color: var(--srm-text-primary) !important;
    }

    :where(.panel-body, .modal .panel-body, .settings-card .panel-body) {
      background-color: transparent !important;
      color: var(--srm-text-primary) !important;
    }

    :where(input:not([type="checkbox"]):not([type="radio"]):not([type="color"]), select, textarea, .counterparty-select-list, .report-sheet-tabs, .tabs, .settings-tabs, .mini-range, .receipt-options, .bank-merge-controls, .support-attachment-line) {
      color-scheme: dark !important;
      border-color: var(--srm-border) !important;
      background: linear-gradient(180deg, rgba(15, 16, 18, .98), rgba(8, 9, 10, .98)) !important;
      color: var(--srm-text-primary) !important;
      -webkit-text-fill-color: var(--srm-text-primary) !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
    }

    :where(input::placeholder, textarea::placeholder) {
      color: var(--srm-text-muted) !important;
      -webkit-text-fill-color: var(--srm-text-muted) !important;
      opacity: 1 !important;
    }

    :where(input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill) {
      -webkit-text-fill-color: var(--srm-text-primary) !important;
      box-shadow: 0 0 0 1000px #0a0e16 inset !important;
      transition: background-color 9999s ease-in-out 0s !important;
    }

    :where(input:focus, select:focus, textarea:focus, button:focus-visible, .btn:focus-visible, [tabindex]:focus-visible) {
      outline: none !important;
      box-shadow: var(--srm-focus-ring) !important;
    }

    :where(.btn, .nav button, .quick-support-button, .quick-support-create-button, .quick-profile-button, .quick-sync-button, .tabs button, .settings-tabs button, .report-sheet-tabs button, .event-button) {
      border-color: var(--srm-border) !important;
      background: linear-gradient(180deg, rgba(30, 31, 34, .98), rgba(15, 16, 18, .98)) !important;
      color: var(--srm-text-primary) !important;
    }

    :where(.btn.primary, .nav button.active, .tabs button.active, .settings-tabs button.active, .report-sheet-tabs button.active, .bank-merge-controls button.active) {
      border-color: rgba(199, 202, 207, .46) !important;
      background: var(--button-gradient) !important;
      color: #ffffff !important;
      -webkit-text-fill-color: #ffffff !important;
    }

    :where(.btn.danger, .danger, .app-exit-button) {
      border-color: rgba(255, 111, 125, .38) !important;
      color: #ffd5da !important;
      background: rgba(92, 28, 42, .72) !important;
    }

    :where(.muted, .hint, .subtitle, .caption, .meta, small, label, .panel-head span, .settings-card p, .settings-mini span, .sync-state span, .event-copy-cell span, .total-line span) {
      color: var(--srm-text-secondary) !important;
    }

    :where(table, .table-scroll, .report-table, .summary-table) {
      border-color: var(--srm-border-subtle) !important;
      background: rgba(7, 9, 14, .66) !important;
      color: var(--srm-text-secondary) !important;
    }

    :where(th, td) {
      border-color: var(--srm-border-subtle) !important;
      color: var(--srm-text-secondary) !important;
    }

    :where(th, strong, h1, h2, h3, h4, .panel-head h3, .modal-head h3, .total-line strong) {
      color: var(--srm-text-primary) !important;
    }

    :where(.toast, .empty, .loading-state, .error-state) {
      border-color: var(--srm-border) !important;
      background: rgba(12, 13, 15, .96) !important;
      color: var(--srm-text-primary) !important;
    }

    :where(input[type="checkbox"], input[type="radio"]) {
      accent-color: var(--srm-accent-2) !important;
    }

    :where(.receipt-wrap, .app-preview, .product-image-preview, .legal-preview-text) {
      border-color: var(--srm-border-subtle) !important;
      background: rgba(9, 10, 12, .82) !important;
      color: var(--srm-text-primary) !important;
    }

    :where(.receipt, .price-card, .label-preview-card, .print-root, .print-root *, .receipt-print, .receipt-print *, .receipt-document, .receipt-document *, .pdf-page, .print-page) {
      background: #ffffff !important;
      color: #000000 !important;
      -webkit-text-fill-color: #000000 !important;
    }

    :where(.receipt *, .price-card *, .label-preview-card *, .print-root *, .receipt-print *, .pdf-page *, .print-page *) {
      color: #000000 !important;
      -webkit-text-fill-color: #000000 !important;
    }

    :where(.status-dot.open, .shift-lamp.open, .lamp.open) {
      background: var(--srm-success) !important;
    }

    body.thin-trade-client .quick-purchase-button { display: none !important; }
    body.thin-trade-client .srm-shell-brand { cursor: pointer; }
    body.thin-trade-client .srm-control-link { margin-top: 8px; border-top: 1px solid rgba(128, 151, 188, .22); }
    .device-settings-layout { display: grid; gap: 14px; padding-bottom: 18px; }
    .device-settings-hero .panel-head p { margin: 4px 0 0; color: var(--muted); }
    .device-status-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
    .device-status-grid .settings-mini { display: grid; gap: 5px; }
    .device-status-grid .settings-mini > span { color: var(--muted); }
    .device-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
    .device-settings-grid .settings-card { min-width: 0; }
    .inline-field-action { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
    .diagnostics-list { display: grid; gap: 0; margin-bottom: 14px; }
    .diagnostics-list > div { display: flex; justify-content: space-between; gap: 18px; padding: 11px 0; border-bottom: 1px solid rgba(128, 151, 188, .16); }
    .diagnostics-list span { color: var(--muted); }
    .equipment-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .equipment-card { display: grid; gap: 7px; min-width: 0; padding: 12px; border: 1px solid rgba(128, 151, 188, .2); border-radius: 9px; background: rgba(10, 19, 32, .88); }
    .equipment-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
    .equipment-card-head strong { font-size: 13px; }
    .equipment-card small { color: var(--muted); overflow-wrap: anywhere; }
    .equipment-status { display: inline-flex; align-items: center; min-height: 24px; padding: 3px 8px; border: 1px solid rgba(128, 151, 188, .24); border-radius: 999px; background: rgba(72, 87, 118, .2); color: #dce5f1; font-size: 11px; font-weight: 700; }
    .equipment-status.connected, .equipment-status.available { border-color: rgba(112, 132, 255, .38); background: rgba(91, 92, 190, .22); }
    .equipment-device-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid rgba(128, 151, 188, .14); }
    .equipment-device-row:last-child { border-bottom: 0; }
    .equipment-unsaved { min-height: 22px; color: #b9c5d6; font-size: 12px; }
    .stock-service-grid, .stock-category-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px; }
    .stock-service-card, .stock-category-card { display: grid; gap: 9px; min-width: 0; padding: 13px; border: 1px solid rgba(128, 151, 188, .2); border-radius: 9px; background: rgba(9, 18, 31, .9); }
    .stock-service-card header, .stock-category-card header { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
    .stock-service-card p, .stock-category-card p { margin: 0; color: var(--muted); }
    .movement-list { display: grid; max-height: 280px; overflow: auto; border: 1px solid rgba(128, 151, 188, .16); border-radius: 8px; }
    .movement-row { display: grid; grid-template-columns: 125px minmax(110px, 1fr) 80px minmax(120px, 1fr); gap: 9px; align-items: center; min-height: 36px; padding: 7px 9px; border-bottom: 1px solid rgba(128, 151, 188, .12); font-size: 12px; }
    .movement-row:last-child { border-bottom: 0; }
    .control-handoff-card { border-color: rgba(108, 123, 255, .35) !important; }
    .device-settings-footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px; border: 1px solid rgba(128, 151, 188, .2); border-radius: 10px; background: rgba(7, 17, 29, .96); }
    .relocated-admin-surface { display: grid; gap: 14px; line-height: 1.55; }
    #view-settings .device-settings-layout,
    #view-profile .profile-workspace,
    #view-support .support-workspace { --workspace-line: rgba(255,255,255,.12); --workspace-soft: rgba(255,255,255,.045); --workspace-panel: #111315; --workspace-panel-2: #15181b; color: #f2f3f4; }
    .device-settings-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 16px; border: 1px solid var(--workspace-line); border-radius: 8px; background: linear-gradient(145deg,#151719,#0e1012); }
    .device-settings-heading > div { display: flex; align-items: center; gap: 12px; color: #aeb2b6; }
    .device-overview-link { display: flex; align-items: center; gap: 12px; min-width: 230px; padding: 0; border: 0; background: transparent; color: #f5f5f5; text-align: left; cursor: pointer; }
    .device-overview-link > span:first-child { display: grid; place-items: center; width: 38px; height: 38px; flex: 0 0 38px; border: 1px solid rgba(255,255,255,.14); border-radius: 8px; background: #1b1e21; }
    .device-overview-link svg { width: 18px; height: 18px; }
    .device-overview-link > span:last-child { display: grid; gap: 2px; }
    .device-overview-link small { color: #999ea3; font-size: 11px; }
    .device-overview-link strong { font-size: 16px; }
    .device-overview-link.active > span:first-child,
    .device-settings-tabs button.active,
    .device-choice-row button.active { border-color: rgba(255,255,255,.62) !important; background: #24272a !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); color: #fff !important; }
    #view-settings .device-settings-tabs { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; padding: 5px; border: 1px solid var(--workspace-line); border-radius: 8px; background: #0d0f11; overflow: visible; }
    #view-settings .device-settings-tabs button { min-width: 0; min-height: 42px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: #b8bcc0; }
    #view-settings .device-settings-grid { display: block; }
    .device-settings-panel { display: grid; gap: 14px; min-width: 0; }
    .device-panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px 18px; border: 1px solid var(--workspace-line); border-radius: 8px; background: var(--workspace-panel); }
    .device-panel-heading span,
    .device-overview-card header span,
    .device-config-card header span,
    .profile-section-card header span,
    .support-workspace header > span { color: #969ba0; font-size: 10px; font-weight: 750; text-transform: uppercase; }
    .device-panel-heading h3,
    .device-overview-card h3,
    .device-config-card h3,
    .profile-section-card h3 { margin: 3px 0 0; font-size: 16px; letter-spacing: 0; }
    .device-panel-heading p,
    .device-config-card p { margin: 5px 0 0; color: #a1a6aa; }
    .device-overview-status-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 10px; }
    .device-overview-status-grid button { display: grid; grid-template-columns: 36px minmax(0,1fr); grid-template-rows: auto auto auto; gap: 2px 10px; min-width: 0; padding: 14px; border: 1px solid var(--workspace-line); border-radius: 8px; background: var(--workspace-panel); color: #f2f3f4; text-align: left; cursor: pointer; transition: border-color .16s ease, background .16s ease, transform .16s ease; }
    .device-overview-status-grid button:hover { border-color: rgba(255,255,255,.3); background: #181b1e; transform: translateY(-1px); }
    .device-overview-status-grid button > span { grid-row: 1 / 4; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 7px; background: #222529; color: #dfe1e3; }
    .device-overview-status-grid button svg { width: 18px; height: 18px; }
    .device-overview-status-grid button small { color: #969ba0; }
    .device-overview-status-grid button strong,
    .device-overview-status-grid button i { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .device-overview-status-grid button strong { font-size: 13px; }
    .device-overview-status-grid button i { color: #8e9499; font-size: 10px; font-style: normal; }
    .device-overview-columns { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
    .device-overview-card,
    .device-config-card,
    .device-website-card { min-width: 0; padding: 16px; border: 1px solid var(--workspace-line); border-radius: 8px; background: var(--workspace-panel); }
    .device-overview-card header,
    .device-config-card header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
    #view-settings .diagnostics-list > div { padding: 10px 0; border-color: rgba(255,255,255,.09); }
    #view-settings .diagnostics-list strong { max-width: 62%; color: #eceeef; text-align: right; overflow-wrap: anywhere; }
    .device-quick-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
    .device-overview-note { display: grid; gap: 3px; margin-top: 12px; padding: 12px; border-radius: 7px; background: #0d0f11; }
    .device-overview-note span,
    .device-overview-note small { color: #a0a5a9; }
    .device-equipment-layout,
    .device-receipt-grid,
    .device-interface-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
    .device-config-card { display: grid; align-content: start; gap: 11px; }
    .device-config-card.wide { grid-column: 1 / -1; }
    .device-config-card :where(input,select,textarea),
    .support-workspace :where(input,select,textarea),
    .profile-workspace :where(input,select,textarea) { border-color: rgba(255,255,255,.16) !important; background: #090b0d !important; color: #f0f1f2 !important; }
    .device-choice-row { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; }
    .device-choice-row button { min-height: 42px; border: 1px solid rgba(255,255,255,.14); border-radius: 7px; background: #0c0e10; color: #b9bdc1; }
    .device-interface-preview { display: grid; gap: 3px; padding: 14px; border: 1px dashed rgba(255,255,255,.18); border-radius: 7px; background: #0c0e10; }
    .device-interface-preview span,
    .device-interface-preview small { color: #959a9f; }
    .connection-status-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
    .connection-status-grid > div { display: grid; gap: 4px; padding: 15px; border: 1px solid var(--workspace-line); border-radius: 8px; background: var(--workspace-panel); }
    .connection-status-grid span,
    .connection-status-grid small { color: #979ca1; }
    .connection-status-grid strong { font-size: 18px; }
    .connection-timeline { display: grid; gap: 12px; margin-bottom: 14px; }
    .connection-timeline > div { display: grid; grid-template-columns: 12px minmax(0,1fr); gap: 10px; align-items: start; }
    .connection-timeline i { width: 9px; height: 9px; margin-top: 4px; border: 2px solid #74797e; border-radius: 50%; }
    .connection-timeline .ok i { border-color: #66c994; background: #66c994; }
    .connection-timeline .error i { border-color: #d46b6b; background: #d46b6b; }
    .connection-timeline .pending i { border-color: #aaa; }
    .connection-timeline span { display: grid; gap: 2px; }
    .connection-timeline small { color: #959a9f; }
    #view-settings .device-website-card { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
    #view-settings .device-website-card h3 { margin: 3px 0; }
    #view-settings .device-website-card p { margin: 0; color: #9da2a7; }
    #view-settings .equipment-status.available { border-color: rgba(255,255,255,.24) !important; background: #24272a !important; color: #f0f1f2 !important; }
    #view-settings .equipment-card { border-color: var(--workspace-line); background: #0d0f11; }
    #view-settings #equipmentDevices { display: grid; gap: 10px; min-width: 0; }
    #view-settings #equipmentDevices .panel-head { margin: 0; padding: 12px 14px; border: 1px solid var(--workspace-line); border-radius: 7px; background: #0c0e10; }
    #view-settings #equipmentDevices .panel-head p { margin: 4px 0 0; color: #a2a7ab; }
    #view-settings :where(#equipmentDevices, #equipmentCapabilities) .notice {
      display: grid;
      gap: 6px;
      min-width: 0;
      margin: 0;
      padding: 12px 14px;
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 7px;
      background: #0c0e10;
      color: #e8eaeb;
    }
    #view-settings :where(#equipmentDevices, #equipmentCapabilities) .notice.warning { border-color: rgba(255,255,255,.18); background: #131517; }
    #view-settings :where(#equipmentDevices, #equipmentCapabilities) .notice p { margin: 0; color: #a4a9ad; }
    #view-settings :where(#equipmentDevices > .row-actions, .device-config-card > .row-actions) {
      margin-top: 0;
      padding: 0;
      border: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
    }
    #view-settings .device-settings-footer { border-color: rgba(255,255,255,.15); background: rgba(14,16,18,.96); backdrop-filter: blur(16px); }
    .profile-workspace { display: grid; gap: 14px; width: 100%; max-width: 100%; min-width: 0; }
    .profile-identity-card { display: grid; grid-template-columns: 64px minmax(0,1fr) auto; gap: 15px; align-items: center; padding: 18px; border: 1px solid var(--workspace-line); border-radius: 8px; background: linear-gradient(140deg,#17191c,#0f1113); }
    .profile-avatar { display: grid; place-items: center; width: 64px; height: 64px; aspect-ratio: 1; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; background: #26292c; color: #f6f6f6; font-size: 20px; font-weight: 800; }
    .profile-identity-copy { min-width: 0; }
    .profile-identity-copy span,
    .profile-identity-copy p { color: #9da2a6; }
    .profile-identity-copy h3 { margin: 3px 0; font-size: 22px; }
    .profile-identity-copy p { margin: 0; }
    .profile-session-state { display: inline-flex; align-items: center; gap: 7px; color: #c7cacc; }
    .profile-session-state i { width: 8px; height: 8px; border-radius: 50%; background: #63c78f; }
    .profile-workspace-grid { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(280px,.72fr); gap: 14px; align-items: start; }
    .profile-workspace-main,
    .profile-workspace-side { display: grid; gap: 14px; min-width: 0; }
    .profile-section-card { min-width: 0; padding: 16px; border: 1px solid var(--workspace-line); border-radius: 8px; background: var(--workspace-panel); }
    .profile-section-card > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
    .profile-readonly-note { max-width: 260px; color: #999ea3 !important; font-size: 11px !important; text-align: right; text-transform: none !important; }
    .profile-field-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
    .profile-security-row { display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 12px; align-items: center; min-height: 58px; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.09); }
    .profile-security-row:last-child { border-bottom: 0; }
    .profile-security-row > div { display: grid; gap: 3px; }
    .profile-security-row small,
    .profile-preference-grid span,
    .profile-exit-card small { color: #969ba0; overflow-wrap: anywhere; }
    .profile-secret { letter-spacing: 3px; }
    .profile-preference-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
    .profile-preference-grid > div { display: grid; gap: 4px; padding: 12px; border-radius: 7px; background: #0c0e10; }
    .profile-exit-card { display: grid; gap: 12px; }
    .profile-exit-card > div { display: grid; gap: 3px; }
    #view-support { min-width: 0; max-width: 100%; overflow-x: hidden !important; }
    .support-workspace { display: grid; grid-template-columns: minmax(220px,.76fr) minmax(240px,.9fr) minmax(300px,1.45fr); gap: 12px; width: 100%; max-width: 100%; min-width: 0; min-height: min(690px,calc(100dvh - 190px)); background: transparent !important; }
    .support-compose-card,
    .support-ticket-column,
    .support-conversation-card { min-width: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.12) !important; border-radius: 8px; background: #101214 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.02), 0 16px 34px rgba(0,0,0,.16) !important; }
    .support-compose-card { display: grid; align-content: start; gap: 11px; padding: 15px; }
    .support-compose-card header h3,
    .support-ticket-column header h3,
    .support-conversation-card header h3 { margin: 3px 0; font-size: 17px; }
    .support-compose-card header p,
    .support-conversation-card header p { margin: 4px 0 0; color: #9da2a7; }
    .support-file-field { padding: 11px; border: 1px dashed rgba(255,255,255,.18); border-radius: 7px; background: #0c0e10; }
    .support-file-field input { display: block; width: 100%; max-width: 100%; min-width: 0; margin-top: 7px; }
    .support-contact-strip { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.09); }
    .support-contact-strip > div:first-child { display: grid; gap: 2px; min-width: 0; }
    .support-contact-strip span,
    .support-response-note { color: #979ca1; }
    .support-contact-strip a { overflow-wrap: anywhere; }
    .support-ticket-column { display: grid; grid-template-rows: auto minmax(0,1fr); }
    .support-ticket-column > header,
    .support-conversation-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 15px; border-bottom: 1px solid rgba(255,255,255,.09); }
    .support-ticket-list { display: grid; align-content: start; gap: 7px; padding: 10px; overflow: auto; }
    .support-ticket-item { display: grid; gap: 6px; min-width: 0; padding: 12px; border: 1px solid transparent; border-radius: 7px; background: #090b0d !important; color: #eceeef; text-align: left; cursor: pointer; }
    .support-ticket-item:hover,
    .support-ticket-item.active { border-color: rgba(255,255,255,.28); background: #1a1d20 !important; }
    .support-ticket-top { display: flex; justify-content: space-between; gap: 8px; }
    .support-ticket-top i { color: #8f9499; font-size: 10px; font-style: normal; }
    .support-ticket-item b,
    .support-ticket-item small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .support-ticket-item small { color: #999ea3; }
    #view-support .support-status-pill { justify-self: start; border-color: rgba(255,255,255,.16); background: #25282b; color: #e2e4e6; }
    .support-conversation-card { display: grid; grid-template-rows: auto minmax(0,1fr) auto auto; }
    .support-conversation-messages { display: grid; align-content: start; gap: 10px; padding: 15px; overflow: auto; }
    .support-bubble { max-width: 82%; padding: 11px 13px; border: 1px solid rgba(255,255,255,.1); border-radius: 8px; background: #191c1f !important; }
    .support-bubble.customer { justify-self: end; background: #24272a !important; }
    .support-bubble > div { display: flex; justify-content: space-between; gap: 12px; }
    .support-bubble time,
    .support-bubble small { color: #92979c; font-size: 10px; }
    .support-bubble p { margin: 7px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }
    .support-reply-box { display: grid; grid-template-columns: minmax(0,1fr) 42px auto; gap: 8px; align-items: end; padding: 12px 15px; border-top: 1px solid rgba(255,255,255,.09); }
    .support-reply-box textarea { min-height: 70px; resize: vertical; }
    .support-attachment-button { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid rgba(255,255,255,.16); border-radius: 7px; background: #0c0e10; cursor: pointer; }
    .support-attachment-button span { font-size: 22px; }
    .support-attachment-button input { position: absolute !important; width: 1px !important; min-width: 1px !important; max-width: 1px !important; height: 1px !important; padding: 0 !important; opacity: 0; overflow: hidden; }
    .support-conversation-card > footer { padding: 10px 15px; border-top: 1px solid rgba(255,255,255,.09); }
    .support-empty-state { display: grid; place-items: center; gap: 5px; min-height: 120px; padding: 18px; color: #94999e; text-align: center; }
    .support-empty-large { min-height: 100%; }
    #view-profile .btn,
    #view-support .btn,
    #view-settings .btn { border-color: rgba(255,255,255,.2) !important; background: #1b1e21 !important; color: #f0f1f2 !important; }
    #view-profile .btn:hover,
    #view-support .btn:hover,
    #view-settings .btn:hover { border-color: rgba(255,255,255,.42) !important; background: #292c2f !important; }
    #view-profile .btn.primary,
    #view-support .btn.primary,
    #view-settings .btn.primary { border-color: #d8dade !important; background: #e5e6e7 !important; color: #111315 !important; }
    @media (max-width: 1180px) {
      .device-status-grid, .device-settings-grid { grid-template-columns: 1fr 1fr; }
      .device-overview-status-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
      .profile-workspace-grid { grid-template-columns: 1fr; }
      .support-workspace { grid-template-columns: minmax(220px,.8fr) minmax(0,1.5fr); }
      .support-compose-card { grid-column: 1 / -1; }
      body.android-shell .topline { min-height: 0 !important; height: auto !important; align-items: flex-start !important; flex-wrap: wrap !important; contain: none !important; }
    }
    @media (max-width: 720px) {
      .device-status-grid, .device-settings-grid { grid-template-columns: 1fr; }
      .equipment-card-grid { grid-template-columns: 1fr; }
      .device-settings-footer .btn { width: 100%; }
      .device-settings-heading,
      .device-panel-heading,
      #view-settings .device-website-card { align-items: stretch; flex-direction: column; }
      #view-settings .device-settings-tabs { display: flex; overflow-x: auto; scrollbar-width: none; }
      #view-settings .device-settings-tabs::-webkit-scrollbar { display: none; }
      #view-settings .device-settings-tabs button { flex: 0 0 138px; }
      .device-overview-status-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
      .device-overview-columns,
      .device-equipment-layout,
      .device-receipt-grid,
      .device-interface-grid,
      .connection-status-grid,
      .profile-field-grid { grid-template-columns: 1fr; }
      .profile-preference-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
      .profile-security-row { grid-template-columns: minmax(0,1fr) auto; }
      .profile-security-row .btn { grid-column: 1 / -1; width: 100%; }
      .support-workspace { grid-template-columns: 1fr; min-height: 0; }
      .support-compose-card { grid-column: auto; }
      .support-ticket-list { max-height: 320px; }
      .support-conversation-card { min-height: 520px; }
      .support-reply-box { grid-template-columns: minmax(0,1fr) 42px; }
      .support-reply-box .btn { grid-column: 1 / -1; }
      #pageActions [data-action="support-create-focus"] { display: none !important; }
      body.thin-trade-client:not(.android-shell) { overflow: auto !important; }
      body.thin-trade-client:not(.android-shell) .app {
        display: flex !important;
        flex-direction: column !important;
        min-height: 100dvh !important;
        height: auto !important;
        overflow: visible !important;
      }
      body.thin-trade-client:not(.android-shell) .sidebar {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        min-height: 0 !important;
        height: auto !important;
        max-height: none !important;
        padding: 10px !important;
        overflow: visible !important;
      }
      body.thin-trade-client:not(.android-shell) .srm-shell-brand {
        width: 100% !important;
        min-height: 64px !important;
      }
      body.thin-trade-client:not(.android-shell) .mobile-nav-toggle {
        display: flex !important;
        position: relative !important;
        z-index: 2 !important;
      }
      body.thin-trade-client:not(.android-shell) #nav {
        display: none !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 7px !important;
        max-height: none !important;
        overflow: visible !important;
      }
      body.thin-trade-client:not(.android-shell).nav-expanded #nav {
        display: grid !important;
      }
      body.thin-trade-client:not(.android-shell) #nav button {
        display: grid !important;
        grid-template-columns: 34px minmax(0, 1fr) auto !important;
        min-height: 46px !important;
        height: auto !important;
        padding: 7px 9px !important;
      }
      body.thin-trade-client:not(.android-shell) #nav button > span:nth-child(2) {
        display: block !important;
        min-width: 0 !important;
        overflow-wrap: anywhere !important;
      }
      body.thin-trade-client:not(.android-shell) .shift-box.as-nav-note {
        position: relative !important;
        inset: auto !important;
        margin-top: 8px !important;
      }
      body.thin-trade-client:not(.android-shell) .main {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 60dvh !important;
        height: auto !important;
        padding: 10px !important;
        overflow: visible !important;
      }
      body.thin-trade-client:not(.android-shell) .topline {
        position: relative !important;
        top: auto !important;
      }
    }

    @media (orientation: portrait) and (max-width: 680px) {
      body.android-shell {
        --mobile-premium-dock: 0px !important;
        --android-service-height: 0px !important;
      }

      body.android-shell .app {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: var(--mobile-premium-pad) !important;
        padding-right: var(--mobile-premium-pad) !important;
        overflow: visible !important;
      }

      body.android-shell .sidebar {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 12px !important;
        grid-template-rows: auto auto !important;
      }

      body.android-shell .main {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        display: block !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
      }

      body.android-shell .topline {
        width: 100% !important;
        margin: 0 0 14px !important;
      }

      body.android-shell .view:not(.hidden) {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
      }

      body.android-shell .nav {
        z-index: 1000 !important;
      }

      body.android-shell.nav-expanded .nav {
        display: grid !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
      }

      body.android-shell .shift-box.as-nav-note {
        position: static !important;
        inset: auto !important;
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        width: 100% !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 8px !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        grid-template-areas:
          "profile profile"
          "actions actions"
          "state shift" !important;
        gap: 6px !important;
        border-radius: 18px !important;
      }

      body.android-shell .shift-box.as-nav-note .sidebar-actions-row {
        grid-area: actions !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 6px !important;
      }

      body.android-shell .shift-box.as-nav-note .sidebar-actions-row :where(.quick-support-button, .quick-sync-button) {
        grid-area: auto !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-sync-button {
        font-size: 0 !important;
      }

      body.android-shell .shift-box.as-nav-note .quick-sync-button::after {
        content: "Синхр.";
        font-size: 10px;
        line-height: 1;
      }

      body.android-shell .shift-box.as-nav-note :where(.quick-profile-button, .quick-support-button, .quick-sync-button, .shift-state-line) {
        min-height: 34px !important;
        max-height: 38px !important;
        padding: 5px 6px !important;
        font-size: 10px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
      }

      body.android-shell .shift-box.as-nav-note #syncState {
        max-height: 38px !important;
        padding: 3px 5px !important;
      }

      body.android-shell .view:not(.hidden) {
        padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 24px) !important;
        scroll-padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 24px) !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .stat strong {
        max-width: 100% !important;
        font-size: clamp(23px, 6.4vw, 28px) !important;
        white-space: nowrap !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .period-stat {
        min-height: 236px !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .period-stat .mini-range {
        grid-template-columns: minmax(0, 1fr) !important;
      }

      body.android-shell #view-dashboard .dashboard-stats .period-stat input[type="date"] {
        font-size: 14px !important;
      }
    }

    @media (min-width: 681px) {
      body.android-shell .nav button .nav-icon::before,
      body.android-shell .nav button .nav-icon::after {
        content: none !important;
        display: none !important;
      }

      body.android-shell .sidebar {
        grid-template-rows: auto minmax(0, 1fr) auto !important;
      }

      body.android-shell .shift-box.as-nav-note {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-areas:
          "profile"
          "actions"
          "shift"
          "state" !important;
      }

      body.android-shell .shift-box.as-nav-note .sidebar-actions-row {
        grid-area: actions !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 6px !important;
      }

      body.android-shell .shift-box.as-nav-note .sidebar-actions-row :where(.quick-support-button, .quick-sync-button) {
        grid-area: auto !important;
      }

      body.android-shell .shift-box.as-nav-note :where(.quick-support-button, .quick-sync-button) {
        width: 100% !important;
        min-width: 0 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
      }
    }

    @media (orientation: portrait) and (min-width: 681px) and (max-width: 920px) {
      body.android-shell .topline::after {
        display: none !important;
      }
    }

    @media (orientation: portrait) and (max-width: 680px) {
      html, body.android-shell {
        width: 100% !important;
        min-height: 100% !important;
        height: auto !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior-y: contain !important;
        -webkit-overflow-scrolling: touch !important;
      }
      body.android-shell #appRoot.app,
      body.android-shell .app {
        min-height: 100dvh !important;
        height: auto !important;
        display: flex !important;
        flex-direction: column !important;
        overflow-x: visible !important;
        overflow-y: visible !important;
      }
      body.android-shell .main {
        flex: 0 0 auto !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        display: block !important;
        overflow: visible !important;
        touch-action: pan-y !important;
      }
      body.android-shell .topline {
        min-height: 0 !important;
        padding: 10px 13px !important;
        border-radius: 14px !important;
        box-shadow: none !important;
      }
      body.android-shell .topline h2 { margin: 0 !important; font-size: 18px !important; line-height: 1.2 !important; }
      body.android-shell .topline p,
      body.android-shell .topline #pageSubtitle { display: none !important; }
      body.android-shell .topline #pageActions:empty { display: none !important; }
      body.android-shell.nav-expanded .nav {
        position: relative !important;
        inset: auto !important;
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        width: 100% !important;
        max-height: min(58dvh, 520px) !important;
        margin: 0 !important;
        z-index: 10000 !important;
        display: grid !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: none !important;
        overflow-y: auto !important;
      }
      body.android-shell.nav-expanded .sidebar {
        grid-template-rows: auto auto auto !important;
      }
      body.android-shell.nav-expanded .shift-box.as-nav-note {
        grid-row: 3 !important;
      }
      body.android-shell.nav-expanded .nav::after {
        content: none !important;
        display: none !important;
      }
      body.android-shell #view-dashboard,
      body.android-shell #view-dashboard :where(.dashboard-stats, .stat, .quick-money-panel, .dashboard-bottom, .dashboard-events-panel) {
        transform: none !important;
        touch-action: pan-y !important;
        overscroll-behavior: auto !important;
      }
      body.android-shell #view-dashboard:not(.hidden),
      body.android-shell .main > .view:not(.hidden) {
        height: auto !important;
        max-height: none !important;
        overflow-x: visible !important;
        overflow-y: visible !important;
      }
      body.android-shell #view-dashboard .dashboard-stats .stat { position: relative !important; inset: auto !important; }
      body.android-shell #view-dashboard .dashboard-events-panel .history-list { display: grid !important; gap: 10px !important; }
      body.android-shell #view-dashboard .dashboard-events-panel .history-cell.compact-event {
        width: 100% !important;
        min-width: 0 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
        padding: 12px !important;
        overflow: hidden !important;
        border-radius: 18px !important;
        background: rgba(5, 10, 20, .62) !important;
        border: 1px solid rgba(120, 145, 190, .16) !important;
      }
      body.android-shell #view-dashboard .dashboard-events-panel .history-main-button.event-button {
        min-width: 0 !important;
        display: grid !important;
        grid-template-columns: minmax(78px, .34fr) minmax(0, 1fr) !important;
        gap: 10px !important;
        padding: 0 !important;
        text-align: left !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
      }
      body.android-shell #view-dashboard .dashboard-events-panel :where(.event-copy-cell, .event-date-cell) {
        min-width: 0 !important;
        overflow-wrap: anywhere !important;
      }
      body.android-shell #view-dashboard .dashboard-events-panel .event-side-meta { grid-column: 1 / -1 !important; }
      body.android-shell #view-dashboard .dashboard-events-panel .history-item-actions { display: none !important; }
    }

    .inventory-trade-strip {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
      gap: 8px;
      align-items: stretch;
      margin-bottom: 10px;
      padding: 10px;
      border: 1px solid rgba(118, 137, 207, .22);
      border-radius: 12px;
      background: rgba(8, 17, 34, .78);
    }
    .inventory-trade-strip span { display: flex; justify-content: space-between; gap: 8px; padding: 9px 10px; border-radius: 9px; background: rgba(18, 30, 53, .82); color: #aebbd2; }
    .inventory-trade-strip strong { color: #f5f7ff; }
    .inventory-scan-form { max-height: min(72dvh, 640px); overflow-y: auto; }
    @media (max-width: 900px) {
      .inventory-trade-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .inventory-trade-strip .btn { grid-column: 1 / -1; }
    }

    body.android-shell,
    body.android-shell .app,
    .login-screen,
    body.android-shell .login-screen {
      background:
        radial-gradient(circle at 18% 16%, rgba(76, 92, 190, .16), transparent 34%),
        radial-gradient(circle at 82% 76%, rgba(35, 73, 142, .12), transparent 38%),
        linear-gradient(145deg, #050914, #091225 55%, #050812) !important;
      color: #eef4ff !important;
    }
    .login-card,
    body.android-shell .login-card,
    .login-card.auth-card,
    body.android-shell .login-card.auth-card,
    .login-card.activation-login-card,
    body.android-shell .login-card.activation-login-card {
      background: linear-gradient(180deg, rgba(15, 26, 47, .98), rgba(8, 16, 31, .98)) !important;
      color: #eef4ff !important;
      border: 1px solid rgba(118, 137, 207, .28) !important;
      box-shadow: 0 24px 64px rgba(0, 0, 0, .42) !important;
    }
    .login-card :where(h2, h3, h4, strong, label),
    body.android-shell .login-card :where(h2, h3, h4, strong, label) { color: #f7f9ff !important; }
    .login-card :where(p, span, small),
    body.android-shell .login-card :where(p, span, small) { color: #aebbd2 !important; }
    .login-card :where(input, select, textarea),
    body.android-shell .login-card :where(input, select, textarea) {
      background: #071022 !important;
      color: #f7f9ff !important;
      border-color: rgba(118, 137, 207, .3) !important;
    }
    .login-card :where(input, textarea)::placeholder,
    body.android-shell .login-card :where(input, textarea)::placeholder { color: #7f8da8 !important; }
    .login-card .btn.primary,
    body.android-shell .login-card .btn.primary {
      background: linear-gradient(135deg, #6558d9, #4169d8) !important;
      border-color: rgba(150, 159, 255, .45) !important;
      color: #fff !important;
    }
    .login-surface-switcher {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 4px;
      padding: 4px;
      border: 1px solid rgba(118, 137, 207, .28);
      border-radius: 10px;
      background: #060c18;
    }
    .login-surface-switcher :where(span, button) {
      min-width: 0;
      min-height: 40px;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0 10px;
      border: 1px solid transparent;
      border-radius: 7px;
      background: transparent;
      color: #aebbd2 !important;
      font: inherit;
      font-weight: 750;
    }
    .login-surface-switcher button {
      -webkit-appearance: none;
      appearance: none;
      background: #17191c !important;
      border-color: #3d4146 !important;
      color: #f2f3f5 !important;
      box-shadow: none !important;
    }
    .login-surface-switcher .active {
      border-color: rgba(125, 109, 255, .34);
      background: rgba(125, 109, 255, .14);
      color: #f7f9ff !important;
    }
    .login-surface-switcher button:hover,
    .login-surface-switcher button:focus-visible {
      border-color: #686d73 !important;
      background: #24272a !important;
      color: #ffffff !important;
      outline: none;
    }
    .login-card .btn:not(.primary),
    body.android-shell .login-card .btn:not(.primary) {
      background: #0c172a !important;
      border-color: rgba(118, 137, 207, .28) !important;
      color: #e7edfa !important;
    }

    .pos-loyalty-card {
      display: grid;
      gap: 10px;
      padding: 12px;
      border: 1px solid rgba(130, 143, 173, .24);
      border-radius: 8px;
      background: #0d1522;
      color: #f2f5fa;
    }
    .pos-loyalty-head, .pos-loyalty-fields { display: flex; align-items: center; gap: 10px; }
    .pos-loyalty-head { justify-content: space-between; }
    .pos-loyalty-head div { display: grid; gap: 3px; }
    .pos-loyalty-head span, .pos-loyalty-explanation { color: #aeb9ca; font-size: 12px; }
    .pos-loyalty-fields > * { min-width: 0; flex: 1; }
    .pos-loyalty-card input { background: #09111d !important; color: #f2f5fa !important; border-color: rgba(130, 143, 173, .26) !important; }
    .pos-loyalty-explanation { margin: 0; line-height: 1.45; }
    .pos-loyalty-summary {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
    }
    .pos-loyalty-summary span,
    .loyalty-detail-grid article {
      min-width: 0;
      padding: 9px 10px;
      border: 1px solid rgba(130, 143, 173, .2);
      border-radius: 8px;
      background: #09111d;
      color: #aeb9ca;
    }
    .pos-loyalty-summary strong,
    .loyalty-detail-grid strong {
      display: block;
      margin-top: 3px;
      color: #f6f8ff;
    }
    .pos-loyalty-summary input { width: 100%; margin-top: 5px; }
    .loyalty-result-list { display: grid; gap: 7px; }
    .loyalty-result-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      width: 100%;
      padding: 10px;
      border: 1px solid rgba(130, 143, 173, .22);
      border-radius: 8px;
      background: #09111d;
      color: #f2f5fa;
      text-align: left;
      cursor: pointer;
    }
    .loyalty-result-row:hover { border-color: rgba(143, 139, 255, .58); background: #111a2a; }
    .loyalty-result-row span { min-width: 0; }
    .loyalty-result-row small { display: block; margin-top: 3px; color: #aeb9ca; }
    .loyalty-detail-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }
    .loyalty-detail-grid article span { color: #aeb9ca; font-size: 12px; }
    .loyalty-detail-grid small { color: #c8d0df; }
    @media (max-width: 760px) { .pos-loyalty-head, .pos-loyalty-fields { align-items: stretch; flex-direction: column; } .pos-loyalty-summary, .loyalty-detail-grid { grid-template-columns: 1fr; } }

    .delivery-trade-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 12px; }
    .delivery-trade-card { min-width: 0; overflow: hidden; border: 1px solid rgba(130,143,173,.24); border-radius: 10px; background: #0b111c; color: #f2f5fa; cursor: pointer; transition: border-color .16s ease, background .16s ease, transform .16s ease; }
    .delivery-trade-card:hover, .delivery-trade-card:focus-visible { border-color: rgba(128,139,255,.7); background: #101927; outline: none; transform: translateY(-1px); }
    .delivery-trade-card .panel-head { border-bottom-color: rgba(130,143,173,.18); }
    .delivery-trade-card .panel-body p { margin: 0; color: #c6cfdd; overflow-wrap: anywhere; }
    .delivery-trade-meta { display: flex; flex-wrap: wrap; gap: 8px 14px; color: #aeb9ca; font-size: 12px; }
    .delivery-detail-summary, .delivery-items-list, .delivery-checklist { padding: 12px; border: 1px solid rgba(130,143,173,.22); border-radius: 9px; background: #0b111c; }
    .delivery-detail-summary { display: grid; gap: 5px; }
    .delivery-detail-summary p { margin: 0; color: #c6cfdd; overflow-wrap: anywhere; }
    .delivery-items-list { display: grid; gap: 8px; }
    .delivery-items-list > div { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 8px; border-bottom: 1px solid rgba(130,143,173,.14); }
    .delivery-checklist { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
    .delivery-checklist .toggle-line { min-height: 42px; margin: 0; }
    .delivery-trade-modal .modal { width: min(920px, calc(100vw - 24px)); }
    .delivery-print-sheet { color: #000; background: #fff; font-family: Arial, sans-serif; }
    .delivery-print-sheet table { width: 100%; border-collapse: collapse; }
    .delivery-print-sheet th, .delivery-print-sheet td { padding: 7px; border: 1px solid #000; color: #000; text-align: left; }
    @media (max-width: 700px) { .delivery-trade-grid, .delivery-checklist { grid-template-columns: 1fr; } .delivery-items-list > div { align-items: flex-start; flex-direction: column; } }

    .trade-help-banner {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 12px;
      align-items: center;
      margin: 0 0 12px;
      padding: 12px 14px;
      border: 1px solid color-mix(in srgb, var(--srm-accent, #756de8) 34%, var(--srm-border, #293140));
      border-radius: 10px;
      background: color-mix(in srgb, var(--srm-surface-2, #111722) 92%, transparent);
    }
    .trade-help-banner strong { display: block; margin-bottom: 3px; color: var(--srm-text, #f4f6fb); font-size: 13px; }
    .trade-help-banner p { margin: 0; color: var(--srm-text-secondary, #b5bdca); font-size: 12px; line-height: 1.45; }
    .trade-help-banner .btn { min-height: 36px; white-space: nowrap; }
    .trade-help-content { display: grid; gap: 13px; }
    .trade-help-content > p { margin: 0; color: var(--srm-text-secondary, #b5bdca); line-height: 1.55; }
    .trade-help-first { padding: 13px; border: 1px solid var(--srm-border, #293140); border-radius: 9px; background: var(--srm-surface-2, #111722); }
    .trade-help-first span { display: block; margin-bottom: 5px; color: var(--srm-text-muted, #8993a3); font-size: 11px; font-weight: 800; text-transform: uppercase; }
    .trade-help-steps { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; counter-reset: trade-help-step; }
    .trade-help-steps li { position: relative; min-height: 38px; padding: 10px 12px 10px 44px; border: 1px solid var(--srm-border, #293140); border-radius: 9px; color: var(--srm-text-secondary, #b5bdca); background: var(--srm-surface-2, #111722); line-height: 1.45; }
    .trade-help-steps li::before { counter-increment: trade-help-step; content: counter(trade-help-step); position: absolute; left: 11px; top: 9px; display: grid; place-items: center; width: 23px; height: 23px; border: 1px solid var(--srm-border-strong, #3a4557); border-radius: 50%; color: var(--srm-text, #f4f6fb); font-size: 11px; font-weight: 800; }
    .trade-help-important { padding: 12px 14px; border-left: 3px solid var(--srm-danger, #d46d7a); border-radius: 8px; color: var(--srm-text-secondary, #b5bdca); background: color-mix(in srgb, var(--srm-danger, #d46d7a) 8%, var(--srm-surface-2, #111722)); line-height: 1.5; }
    .trade-onboarding-modal {
      width: min(560px, calc(100vw - 24px)) !important;
      background: var(--srm-surface-1, #0b1018) !important;
    }
    .trade-onboarding-card {
      width: 100%;
      background: var(--srm-surface-1, #0b1018);
    }
    body.windows-shell .modal-backdrop:has(.trade-onboarding-modal) {
      background: rgba(2, 7, 12, .52) !important;
      backdrop-filter: blur(3px) !important;
    }
    body.windows-shell .trade-onboarding-modal {
      width: min(560px, calc(100vw - 72px)) !important;
      border-radius: 14px !important;
      box-shadow: 0 30px 72px rgba(0, 0, 0, .48) !important;
    }
    .trade-onboarding-card .panel-body > p { min-height: 64px; margin: 0; color: var(--srm-text-secondary, #b5bdca); font-size: 15px; line-height: 1.6; }
    .trade-onboarding-progress { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 6px; }
    .trade-onboarding-progress span { height: 3px; border-radius: 3px; background: var(--srm-border, #293140); }
    .trade-onboarding-progress span.active { background: var(--srm-accent, #756de8); }
    .trade-onboarding-actions { display: flex; justify-content: space-between; gap: 10px; }
    .trade-onboarding-actions > div { display: flex; gap: 8px; }
    .auth-role-guide { display: grid; gap: 6px; margin: 0; padding: 11px 13px; border: 1px solid var(--srm-border, #293140); border-radius: 9px; background: var(--srm-surface-2, #111722); text-align: left; }
    .auth-role-guide p { margin: 0; color: var(--srm-text-secondary, #b5bdca); font-size: 11.5px; line-height: 1.4; }
    .auth-role-guide strong { color: var(--srm-text, #f4f6fb); }
    .auth-field-help { display: block; margin-top: 4px; color: var(--srm-text-muted, #8993a3); font-size: 10.5px; line-height: 1.35; }
    .auth-password-field { position: relative; display: block; width: 100%; }
    .auth-password-field input { width: 100%; padding-right: 48px !important; }
    .auth-password-toggle {
      position: absolute;
      top: 50%;
      right: 7px;
      width: 36px !important;
      min-width: 36px !important;
      height: 36px !important;
      min-height: 36px !important;
      padding: 0 !important;
      transform: translateY(-50%);
      border: 0 !important;
      border-radius: 7px !important;
      background: transparent !important;
      color: var(--srm-text-secondary, #b5bdca) !important;
      box-shadow: none !important;
      display: grid !important;
      place-items: center;
    }
    .auth-password-toggle:hover,
    .auth-password-toggle:focus-visible { background: rgba(117, 109, 232, .13) !important; color: var(--srm-text, #f4f6fb) !important; }
    .auth-password-toggle:focus-visible { outline: 2px solid rgba(117, 109, 232, .58); outline-offset: 1px; }
    .auth-password-eye { position: relative; width: 19px; height: 12px; border: 1.8px solid currentColor; border-radius: 50% / 62%; }
    .auth-password-eye::after { content: ""; position: absolute; left: 50%; top: 50%; width: 5px; height: 5px; transform: translate(-50%, -50%); border-radius: 50%; background: currentColor; }
    .auth-password-eye::before { content: ""; position: absolute; left: -3px; top: 4px; width: 24px; height: 2px; transform: rotate(-38deg); border-radius: 2px; background: currentColor; box-shadow: 0 0 0 2px var(--srm-surface-2, #111722); }
    .auth-password-toggle.visible .auth-password-eye::before { display: none; }
    @media (max-width: 680px) {
      .trade-help-banner { grid-template-columns: 1fr; }
      .trade-help-banner .btn { width: 100%; }
      .trade-onboarding-actions { align-items: stretch; }
      .trade-onboarding-actions > div { flex: 1; }
      .trade-onboarding-actions .btn { flex: 1; }
    }

html body:not(.android-shell) .login-screen,
      .login-screen,
      body.android-shell .login-screen {
        background:
          radial-gradient(circle at 18% 16%, rgba(76, 92, 190, .16), transparent 34%),
          radial-gradient(circle at 82% 76%, rgba(35, 73, 142, .12), transparent 38%),
          linear-gradient(145deg, #050914, #091225 55%, #050812) !important;
        color: #eef4ff !important;
      }
      html body:not(.android-shell) .login-card:not(.activation-login-card),
      .login-card,
      .login-card.auth-card,
      body.android-shell .login-card,
      body.android-shell .login-card.auth-card {
        background: linear-gradient(180deg, rgba(15, 26, 47, .98), rgba(8, 16, 31, .98)) !important;
        color: #eef4ff !important;
        border: 1px solid rgba(118, 137, 207, .28) !important;
        box-shadow: 0 24px 64px rgba(0, 0, 0, .42) !important;
      }
      html body:not(.android-shell) .login-card:not(.activation-login-card) :where(h2, h3, h4, strong, label),
      .login-card :where(h2, h3, h4, strong, label) { color: #f7f9ff !important; }
      .login-card :where(p, span, small) { color: #aebbd2 !important; }
      .login-card :where(input, select, textarea) { background: #071022 !important; color: #f7f9ff !important; border-color: rgba(118, 137, 207, .3) !important; }
      .login-card :where(input, textarea)::placeholder { color: #7f8da8 !important; }
      html body:not(.android-shell) .login-card:not(.activation-login-card) .btn.primary,
      .login-card .btn.primary { background: linear-gradient(135deg, #6558d9, #4169d8) !important; border-color: rgba(150, 159, 255, .45) !important; color: #fff !important; }
      html body:not(.android-shell) .login-card:not(.activation-login-card) .btn:not(.primary),
      .login-card .btn:not(.primary) { background: #0c172a !important; border-color: rgba(118, 137, 207, .28) !important; color: #e7edfa !important; }
      .auth-recovery-link {
        width: fit-content !important;
        min-height: 0 !important;
        margin: -4px 0 0 auto !important;
        padding: 2px 0 !important;
        border: 0 !important;
        background: transparent !important;
        color: #79a7ff !important;
        box-shadow: none !important;
        font-size: 13px !important;
        font-weight: 700 !important;
      }
      .auth-recovery-link:hover,
      .auth-recovery-link:focus-visible { color: #a9c5ff !important; text-decoration: underline; }
      .activation-code-entry {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 8px;
        align-items: end;
        padding: 12px;
        border: 1px solid rgba(118, 137, 207, .24);
        border-radius: 12px;
        background: rgba(8, 17, 34, .72);
      }
      .activation-code-entry label { min-width: 0; }
      .activation-code-entry .btn { min-width: 132px; }
      .auth-inline-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
      .demo-login-divider { display: flex; align-items: center; gap: 12px; color: #8f99a8; font-size: 12px; }
      .demo-login-divider::before,
      .demo-login-divider::after { content: ""; height: 1px; flex: 1; background: rgba(183, 192, 205, .2); }
      .demo-login-button { width: 100%; }
      .store-login-actions { display: none; }
      body.windows-shell .store-login-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        padding-top: 2px;
      }
      body.windows-shell .store-login-actions .btn {
        min-width: 0;
        min-height: 44px;
      }
      body.windows-shell .store-login-purchase-placeholder[disabled] {
        cursor: not-allowed;
        opacity: .68;
      }
      .store-login-purchase-placeholder span {
        margin-left: 6px;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: .03em;
        text-transform: uppercase;
      }
      @media (max-width: 520px) {
        body.windows-shell .store-login-actions { grid-template-columns: 1fr; }
      }
      .auth-register-grid { display: grid; gap: 9px; }
      .auth-register-consents { display: grid; gap: 8px; margin: 0; padding: 12px; border: 1px solid rgba(118, 137, 207, .24); border-radius: 12px; background: rgba(8, 17, 34, .72); }
      .auth-register-consents legend { padding-inline: 5px; color: #f7f9ff; font-size: 13px; font-weight: 700; }
      .auth-register-consents label { display: grid !important; grid-template-columns: 20px minmax(0, 1fr); align-items: start; gap: 8px !important; color: #c1ccdf !important; line-height: 1.35; }
      .auth-register-consents input { width: 18px !important; height: 18px !important; min-height: 18px !important; margin: 0; accent-color: #756de8; }
      .auth-register-consents .btn { width: fit-content; min-height: 36px; }
      .auth-success-panel { display: grid; gap: 12px; padding: 14px; border: 1px solid rgba(118, 137, 207, .24); border-radius: 12px; background: rgba(8, 17, 34, .72); }

      @media (min-width: 560px) and (orientation: landscape) and (max-height: 900px) {
        html body.android-shell .login-screen {
          overflow: hidden !important;
          padding: max(10px, env(safe-area-inset-top)) 20px max(10px, env(safe-area-inset-bottom)) !important;
        }
        html body.android-shell .login-card.auth-card {
          width: min(680px, calc(100vw - 48px)) !important;
          max-height: calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
          overflow: hidden !important;
          gap: 9px !important;
          padding: 18px 30px !important;
        }
        html body.android-shell .login-card.auth-card .login-logo { width: 48px !important; height: 48px !important; border-radius: 12px !important; }
        html body.android-shell .login-card.auth-card h2 { font-size: 26px !important; line-height: 1.15 !important; }
        html body.android-shell .login-card.auth-card p { font-size: 14px !important; line-height: 1.35 !important; }
        html body.android-shell .login-card.auth-card label { gap: 4px !important; font-size: 13px !important; }
        html body.android-shell .login-card.auth-card input { min-height: 44px !important; height: 44px !important; padding-block: 8px !important; }
        html body.android-shell .login-card.auth-card > .btn:not(.auth-recovery-link) { min-height: 44px !important; height: 44px !important; padding-block: 8px !important; }
        html body.android-shell .login-card.auth-card > small { font-size: 11px !important; line-height: 1.3 !important; }
        html body.android-shell .login-card.auth-card.auth-register-card { width: min(780px, calc(100vw - 48px)) !important; }
        html body.android-shell .login-card.auth-card .auth-role-guide { display: none !important; }
        html body.android-shell .login-surface-switcher :where(span, button) { min-height: 36px; }
        html body.android-shell .auth-register-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        html body.android-shell .auth-register-grid .auth-register-wide { grid-column: 1 / -1; }
      }

      @media (pointer: coarse) and (orientation: landscape) {
        .login-screen .auth-role-guide { display: none !important; }
        .login-screen .login-card.auth-card {
          width: min(680px, calc(100vw - 48px)) !important;
          max-height: calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
          overflow: hidden !important;
          gap: 8px !important;
          padding-block: 14px !important;
        }
        .login-screen .login-card.auth-card > small { display: none !important; }
        .login-screen .login-card.auth-card .login-logo { width: 48px !important; height: 48px !important; }
        .login-screen .login-surface-switcher :where(span, button) { min-height: 36px !important; }
      }

      @media (max-width: 560px) {
        .activation-code-entry { grid-template-columns: 1fr; }
        .activation-code-entry .btn { width: 100%; }
      }

      @media (orientation: landscape) and (min-width: 921px) {
        body.android-shell .shift-box.as-nav-note .quick-sync-button {
          font-size: 0 !important;
        }

        body.android-shell .shift-box.as-nav-note .quick-sync-button::after {
          content: "Синхр.";
          font-size: 10px;
          line-height: 1;
        }
      }

      @media (orientation: landscape) {
        body.android-shell .modal-backdrop,
        body.android-shell .modal-backdrop.child-modal-backdrop {
          position: fixed !important;
          top: 0 !important;
          right: 0 !important;
          bottom: 0 !important;
          left: 0 !important;
          display: grid !important;
          place-items: center !important;
          align-items: center !important;
          justify-content: center !important;
          padding: 24px !important;
        }

        body.android-shell .modal,
        body.android-shell .child-modal {
          width: min(760px, calc(100vw - 48px)) !important;
          height: auto !important;
          max-height: calc(100vh - 48px) !important;
          max-height: calc(100dvh - 48px) !important;
          margin: auto !important;
          border-radius: 20px !important;
          overflow: hidden !important;
        }

        body.android-shell .modal .panel-body,
        body.android-shell .child-modal .panel-body {
          max-height: calc(100vh - 124px) !important;
          max-height: calc(100dvh - 124px) !important;
          overflow: auto !important;
        }
      }

:root {
        --srm-bg: #050608;
        --srm-bg-2: #080a0e;
        --srm-bg-3: #0d1015;
        --srm-card: rgba(11, 13, 17, .92);
        --srm-card-strong: rgba(13, 16, 21, .98);
        --srm-card-soft: rgba(18, 21, 27, .82);
        --srm-line: rgba(222, 229, 238, .15);
        --srm-line-soft: rgba(222, 229, 238, .10);
        --srm-text: #f4f5f7;
        --srm-muted: #c8ced8;
        --srm-faint: #aeb7c5;
        --srm-purple: #c5cad2;
        --srm-violet: #b7bec9;
        --srm-blue: #aeb5c0;
        --srm-cyan: #c7ccd4;
        --srm-danger: #c5cad2;
        --srm-warn: #bcc2cb;
        --srm-primary-gradient: linear-gradient(180deg, #242932, #171b22);
        --srm-panel-gradient: linear-gradient(180deg, rgba(15, 18, 24, .97), rgba(8, 10, 14, .99));
        --srm-input-bg: #0b0e13;
        --srm-shadow: 0 24px 68px rgba(0, 0, 0, .5), inset 0 1px rgba(255, 255, 255, .035);
        --srm-glow: 0 18px 46px rgba(0, 0, 0, .4);
      }

      html,
      body,
      body.android-shell,
      body.windows-shell,
      body.android-shell .app,
      body.windows-shell .app,
      .login-screen,
      body.android-shell .login-screen {
        background: #050608 !important;
        color: var(--srm-text) !important;
      }

      body::before,
      body.windows-shell::before,
      body.android-shell::before,
      .login-screen::before {
        content: "";
        position: fixed;
        inset: -38%;
        z-index: -1;
        pointer-events: none;
        background:
          linear-gradient(118deg, transparent 28%, rgba(58, 64, 78, .09) 44%, rgba(76, 72, 104, .11) 50%, transparent 68%),
          linear-gradient(35deg, transparent 34%, rgba(45, 52, 66, .06) 51%, transparent 66%) !important;
        filter: blur(84px) !important;
        opacity: .58 !important;
        animation: srmNeutralAmbient 16s ease-in-out infinite alternate !important;
      }

      body::after,
      body.windows-shell::after,
      body.android-shell::after {
        background: linear-gradient(180deg, rgba(255, 255, 255, .01), transparent 34%, rgba(0, 0, 0, .2)) !important;
        filter: none !important;
        opacity: 1 !important;
      }

      @keyframes srmNeutralAmbient {
        0% { transform: translate3d(-8%, -3%, 0) scale(1); opacity: .4; }
        50% { transform: translate3d(2%, 3%, 0) scale(1.06); opacity: .76; }
        100% { transform: translate3d(9%, -1%, 0) scale(1.12); opacity: .5; }
      }

      :where(.topbar, .topline, .sidebar, .mobile-topbar, .drawer, .bottom-sheet, .panel, .card, .stat, .tile, .section-card, .settings-card, .settings-mini, .network-card, .network-metric, .integration-card, .table-wrap, .shift-table-wrap, .report-editor, .preview-wrapper, .document-preview-wrap, .document-print-modal-body, .stock-print-modal-body, .support-card, .support-chat-widget, .toast, .modal, .child-modal, .subscription-box, .event-card, .history-card, .note-card, .warehouse-card, .counterparty-card, .login-card, .auth-card, .activation-login-card) {
        background: var(--srm-panel-gradient) !important;
        color: var(--srm-text) !important;
        border-color: var(--srm-line-soft) !important;
        box-shadow: var(--srm-shadow) !important;
      }

      :where(.panel-head, .modal-head, .table-head, .section-head, .card-head, .settings-head, .document-modal-footer, .report-modal-footer, .footer-panel) {
        background: rgba(15, 18, 24, .98) !important;
        color: var(--srm-text) !important;
        border-color: var(--srm-line-soft) !important;
      }

      :where(input, select, textarea, .input, .select, .textarea, [contenteditable="true"]),
      .login-card :where(input, select, textarea),
      body.android-shell .login-card :where(input, select, textarea) {
        background: var(--srm-input-bg) !important;
        color: var(--srm-text) !important;
        border-color: var(--srm-line) !important;
        box-shadow: inset 0 1px rgba(255, 255, 255, .025) !important;
        color-scheme: dark !important;
      }

      :where(input, select, textarea, .input, .select, .textarea, [contenteditable="true"]):focus,
      :where(input, select, textarea, .input, .select, .textarea, [contenteditable="true"]):focus-visible {
        border-color: rgba(230, 235, 242, .34) !important;
        box-shadow: 0 0 0 3px rgba(255, 255, 255, .045) !important;
      }

      :where(select option) {
        background: #0b0e13 !important;
        color: var(--srm-text) !important;
      }

      :where(.btn, button, [role="button"]),
      .login-card .btn,
      body.android-shell .login-card .btn {
        color: var(--srm-text) !important;
        border-color: rgba(222, 229, 238, .14) !important;
        background: linear-gradient(180deg, #20252d, #14181f) !important;
        box-shadow: 0 13px 30px rgba(0, 0, 0, .3), inset 0 1px rgba(255, 255, 255, .05) !important;
      }

      :where(.btn.primary, button.primary, .primary, .nav button.active, .tabs button.active, .tab.active, .segmented button.active, [aria-selected="true"]),
      .login-card .btn.primary,
      body.android-shell .login-card .btn.primary {
        color: #f7f8fa !important;
        border-color: rgba(232, 236, 242, .22) !important;
        background: var(--srm-primary-gradient) !important;
        box-shadow: 0 16px 38px rgba(0, 0, 0, .4), inset 0 1px rgba(255, 255, 255, .08) !important;
      }

      :where(.btn:hover, button:hover, [role="button"]:hover) {
        border-color: rgba(232, 236, 242, .3) !important;
        box-shadow: 0 17px 42px rgba(0, 0, 0, .42) !important;
      }

      :where(.btn.danger, button.danger, .danger, [data-action*="delete"], [data-action*="archive"]) {
        color: #e1e4e9 !important;
        border-color: rgba(222, 229, 238, .18) !important;
        background: linear-gradient(180deg, #292d34, #1b1e24) !important;
      }

      :where(.modal-backdrop, .child-modal-backdrop) {
        background: rgba(0, 0, 0, .78) !important;
      }

      :where(.modal, .child-modal) {
        background: linear-gradient(180deg, rgba(15, 18, 24, .995), rgba(7, 9, 12, .995)) !important;
      }

      :where(.modal-head .btn.small, .child-modal .modal-head .btn.small, [data-action="modal-close"], #exitCancelTop, #confirmNoTop, #reportCloseNoTop) {
        color: #f4f5f7 !important;
        border-color: rgba(222, 229, 238, .16) !important;
        background: #171a20 !important;
        box-shadow: none !important;
      }

      :where(.badge, .pill, .tag, .integration-status, .counter, .nav .badge),
      :where(.integration-status.green, .integration-status.red, .integration-status.gold, .integration-status.blue, .integration-status.gray) {
        color: #cdd2d9 !important;
        border-color: rgba(222, 229, 238, .14) !important;
        background: rgba(255, 255, 255, .05) !important;
      }

      :where(thead, th) {
        background: #12151b !important;
      }

      :where(tbody tr:hover) {
        background: rgba(255, 255, 255, .045) !important;
      }

      .auth-recovery-link,
      .auth-recovery-link:hover,
      .auth-recovery-link:focus-visible {
        color: #b7bec9 !important;
      }

      :where(.document-print-page, .document-print-page *, .receipt, .receipt *, #receiptPrint, #receiptPrint *, #labelPreviewCard, #labelPreviewCard *, .print-page, .print-page *, .pdf-page, .pdf-page *) {
        background: #ffffff !important;
        color: #000000 !important;
        border-color: #000000 !important;
        box-shadow: none !important;
      }

      @media (prefers-reduced-motion: reduce) {
        body::before,
        .login-screen::before { animation: none !important; }
      }

      html body:not(#srm-legacy-theme) .login-screen,
      html body:not(#srm-legacy-theme).android-shell .login-screen {
        background: #050608 !important;
        color: var(--srm-text) !important;
      }

      html body:not(#srm-legacy-theme) :where(.login-card, .auth-card, .activation-login-card, .panel, .card, .stat, .modal, .child-modal, .bottom-sheet, .drawer, .table-wrap, .settings-card, .network-card, .integration-card) {
        background: var(--srm-panel-gradient) !important;
        color: var(--srm-text) !important;
        border-color: var(--srm-line-soft) !important;
      }

      html body:not(#srm-legacy-theme) :where(.btn.primary, button.primary, .nav button.active, .tabs button.active, .settings-tabs button.active, .segmented button.active, [aria-selected="true"]),
      html body:not(#srm-legacy-theme) .login-card .btn.primary {
        color: #f7f8fa !important;
        border-color: rgba(232, 236, 242, .22) !important;
        background: var(--srm-primary-gradient) !important;
        box-shadow: 0 16px 38px rgba(0, 0, 0, .4), inset 0 1px rgba(255, 255, 255, .08) !important;
      }

      html body:not(#srm-legacy-theme) :where(.btn.danger, button.danger, .danger, [data-action*="delete"], [data-action*="archive"]) {
        color: #e1e4e9 !important;
        border-color: rgba(222, 229, 238, .18) !important;
        background: linear-gradient(180deg, #292d34, #1b1e24) !important;
      }

      html body:not(#srm-legacy-theme) :where(input, select, textarea, [contenteditable="true"]) {
        background: var(--srm-input-bg) !important;
        color: var(--srm-text) !important;
        border-color: var(--srm-line) !important;
      }

      html body:not(#srm-legacy-theme) #view-dashboard .dashboard-events-panel {
        background: var(--srm-panel-gradient) !important;
        color: var(--srm-text) !important;
        border-color: var(--srm-line-soft) !important;
        box-shadow: var(--srm-shadow) !important;
      }

      body.android-shell::before,
      body.android-shell .login-screen::before {
        filter: none !important;
        animation: none !important;
        transform: none !important;
      }

      body.android-shell :where(.topbar, .topline, .sidebar, .mobile-topbar, .drawer, .bottom-sheet, .panel, .card, .stat, .tile, .section-card, .settings-card, .modal, .child-modal, .login-card) {
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
      }

      html body.android-shell .login-screen .login-card,
      html body.android-shell .activation-login-card,
      html body.android-shell .modal,
      html body.android-shell .child-modal,
      html body.android-shell .bottom-sheet,
      html body.android-shell .panel,
      html body.android-shell .card,
      html body.android-shell .stat {
        background: linear-gradient(180deg, #10131a, #090b10) !important;
        color: #f3f5f8 !important;
        border-color: rgba(220, 228, 240, .16) !important;
      }

      html body.android-shell .login-screen .login-card input,
      html body.android-shell .login-screen .login-card select,
      html body.android-shell .login-screen .login-card textarea,
      html body.android-shell input,
      html body.android-shell select,
      html body.android-shell textarea {
        background: #0b0e13 !important;
        color: #f3f5f8 !important;
        border-color: rgba(220, 228, 240, .18) !important;
        -webkit-text-fill-color: #f3f5f8 !important;
      }

      html body.android-shell .login-screen .login-card input::placeholder,
      html body.android-shell .login-screen .login-card textarea::placeholder,
      html body.android-shell input::placeholder,
      html body.android-shell textarea::placeholder {
        color: #8f98a8 !important;
        -webkit-text-fill-color: #8f98a8 !important;
      }

      html body.android-shell .btn.primary,
      html body.android-shell button.primary,
      html body.android-shell .login-card .btn.primary {
        background: linear-gradient(180deg, #242932, #171b22) !important;
        border-color: rgba(232, 236, 242, .22) !important;
        color: #f7f8fa !important;
        box-shadow: 0 14px 30px rgba(0, 0, 0, .38), inset 0 1px rgba(255, 255, 255, .08) !important;
      }

      html body.android-shell .login-card a,
      html body.android-shell .auth-link,
      html body.android-shell .auth-recovery-link,
      html body.android-shell .link-button {
        color: #d5dae3 !important;
      }

      html body.android-shell .stat .stat-icon,
      html body.android-shell .stat .icon,
      html body.android-shell .calendar-button,
      html body.android-shell .date-picker-button {
        color: #dbe0e8 !important;
        background: linear-gradient(180deg, #272c35, #191d24) !important;
        border-color: rgba(220, 228, 240, .18) !important;
        box-shadow: none !important;
      }

      html body.android-shell .login-screen .login-card h1,
      html body.android-shell .login-screen .login-card h2,
      html body.android-shell .login-screen .login-card h3,
      html body.android-shell .login-screen .login-card p,
      html body.android-shell .login-screen .login-card label,
      html body.android-shell .login-screen .login-card small,
      html body.android-shell .login-screen .login-card span {
        color: #f3f5f8 !important;
      }

      html body.android-shell .login-screen .login-card p,
      html body.android-shell .login-screen .login-card small {
        color: #b4bbc7 !important;
      }

      @media (max-width: 680px) {
        html body.android-shell .shift-box.as-nav-note {
          display: grid !important;
          grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
          grid-template-areas:
            "profile profile"
            "actions actions"
            "state shift" !important;
          height: auto !important;
          min-height: 0 !important;
          padding: 8px !important;
        }

        html body.android-shell .shift-box.as-nav-note .sidebar-actions-row {
          grid-area: actions !important;
          grid-column: 1 / -1 !important;
          position: static !important;
          display: grid !important;
          grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
          grid-auto-flow: row !important;
          width: 100% !important;
          min-width: 0 !important;
          gap: 6px !important;
          transform: none !important;
        }

        html body.android-shell .shift-box.as-nav-note .sidebar-actions-row > button {
          grid-area: auto !important;
          grid-column: auto !important;
          grid-row: auto !important;
          position: static !important;
          inset: auto !important;
          width: 100% !important;
          min-width: 0 !important;
          max-width: none !important;
          margin: 0 !important;
          transform: none !important;
        }

        html body.android-shell .shift-box.as-nav-note .quick-purchase-button:not(.hidden) {
          grid-column: 1 / -1 !important;
        }
      }

      body.android-shell #modalRoot #shiftForm label,
      body.android-shell #modalRoot #shiftForm .shift-confirm span {
        color: #b8c0cc !important;
        opacity: 1 !important;
      }

      body.android-shell #modalRoot #shiftForm .shift-confirm strong {
        color: var(--srm-text) !important;
      }

      body .modal-backdrop,
      body.android-shell .modal-backdrop,
      body .modal-backdrop.child-modal-backdrop {
        background: rgba(2, 6, 14, .86) !important;
        backdrop-filter: blur(12px) !important;
        -webkit-backdrop-filter: blur(12px) !important;
      }
      body .modal-backdrop .modal {
        background: #0a111d !important;
        opacity: 1 !important;
      }

      #view-dashboard .dashboard-events-panel .history-cell,
      #view-dashboard .dashboard-events-panel .history-main-button,
      #view-dashboard .dashboard-events-panel .compact-event,
      #view-dashboard .dashboard-events-panel .event-button,
      #view-dashboard .history-list .history-cell,
      #view-dashboard .history-list .history-main-button,
      #view-dashboard .history-list .compact-event,
      #view-dashboard .history-list .event-button {
        color: #f8fbff !important;
        background: linear-gradient(180deg, rgba(13, 24, 44, .96), rgba(5, 11, 22, .99)) !important;
        border-color: rgba(145, 164, 190, .18) !important;
        box-shadow: none !important;
      }

      #view-dashboard .dashboard-events-panel .history-cell strong,
      #view-dashboard .dashboard-events-panel .history-main-button strong,
      #view-dashboard .dashboard-events-panel .compact-event strong,
      #view-dashboard .dashboard-events-panel .event-button strong,
      #view-dashboard .history-list .history-cell strong,
      #view-dashboard .history-list .history-main-button strong,
      #view-dashboard .history-list .compact-event strong,
      #view-dashboard .history-list .event-button strong {
        color: #f8fbff !important;
      }

      @media (orientation: landscape) and (min-width: 681px) {
        html body.android-shell .sidebar {
          padding: 10px !important;
          gap: 6px !important;
        }

        html body.android-shell .brand {
          min-height: 50px !important;
        }

        html body.android-shell .nav {
          gap: 4px !important;
          overflow: hidden !important;
        }

        html body.android-shell .nav button {
          min-height: 36px !important;
          padding: 5px 8px !important;
          font-size: 12px !important;
          line-height: 1.2 !important;
        }

        html body.android-shell .shift-box.as-nav-note {
          position: static !important;
          inset: auto !important;
          grid-column: 1 / -1 !important;
          justify-self: stretch !important;
          display: grid !important;
          grid-template-columns: minmax(0, 1fr) !important;
          gap: 5px !important;
          padding: 6px !important;
          width: 100% !important;
          min-width: 0 !important;
          max-width: none !important;
          margin: 0 !important;
          box-sizing: border-box !important;
          transform: none !important;
          height: auto !important;
          min-height: 0 !important;
          overflow: visible !important;
        }

        html body.android-shell .shift-box.as-nav-note .sidebar-actions-row {
          position: static !important;
          inset: auto !important;
          display: grid !important;
          grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
          gap: 5px !important;
          width: 100% !important;
          min-width: 0 !important;
          max-width: none !important;
          margin: 0 !important;
          transform: none !important;
        }

        html body.android-shell .shift-box.as-nav-note .sidebar-actions-row > button {
          position: static !important;
          inset: auto !important;
          grid-column: auto !important;
          grid-row: auto !important;
          width: 100% !important;
          min-width: 0 !important;
          max-width: none !important;
          margin: 0 !important;
          transform: none !important;
          overflow: hidden !important;
          text-overflow: ellipsis !important;
          white-space: nowrap !important;
        }

        html body.android-shell .shift-box.as-nav-note .quick-profile-button,
        html body.android-shell .shift-box.as-nav-note .quick-support-button,
        html body.android-shell .shift-box.as-nav-note .quick-sync-button,
        html body.android-shell .shift-box.as-nav-note .quick-purchase-button,
        html body.android-shell .shift-box.as-nav-note .shift-state-line {
          min-height: 28px !important;
          max-height: 30px !important;
          padding: 4px 6px !important;
          font-size: 10.5px !important;
          line-height: 1.15 !important;
        }

        html body.android-shell .shift-box.as-nav-note #syncState {
          min-height: 28px !important;
          max-height: 31px !important;
          padding: 4px 6px !important;
          font-size: 10px !important;
          line-height: 1.15 !important;
        }

        html body.android-shell .shift-box.as-nav-note #shiftMeta,
        html body.android-shell .shift-box.as-nav-note #shiftEmail {
          display: none !important;
        }
      }

      .sidebar .shift-box.as-nav-note {
        grid-column: 1 / -1 !important;
        justify-self: stretch !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        box-sizing: border-box !important;
      }

      .sidebar .shift-box.as-nav-note .sidebar-actions-row {
        position: static !important;
        inset: auto !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 5px !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
        transform: none !important;
      }

      .sidebar .shift-box.as-nav-note .sidebar-actions-row > button {
        position: static !important;
        inset: auto !important;
        grid-column: auto !important;
        grid-row: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
        transform: none !important;
      }

      html body.android-shell .sidebar .shift-box.as-nav-note {
        margin-bottom: max(88px, calc(var(--android-nav-safe, 72px) + 16px)) !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-areas: none !important;
      }

      html body.android-shell .sidebar .shift-box.as-nav-note .sidebar-actions-row {
        grid-area: auto !important;
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
        grid-template-columns: minmax(0, 1fr) !important;
      }

      html body.android-shell .sidebar .shift-box.as-nav-note > .quick-profile-button,
      html body.android-shell .sidebar .shift-box.as-nav-note > .shift-state-line,
      html body.android-shell .sidebar .shift-box.as-nav-note > #syncState {
        grid-area: auto !important;
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
        width: 100% !important;
        min-width: 0 !important;
      }

      html body.android-shell .sidebar .shift-box.as-nav-note > #shiftMeta,
      html body.android-shell .sidebar .shift-box.as-nav-note > #shiftEmail {
        display: none !important;
      }

      html body.android-shell .sidebar .shift-box.as-nav-note .quick-sync-button::after {
        content: none !important;
        display: none !important;
      }

      @media (orientation: landscape) and (min-width: 681px) and (max-width: 1280px) {
        body:not(.android-shell) .app {
          grid-template-columns: 252px minmax(0, 1fr) !important;
        }

        body:not(.android-shell) .app > .sidebar {
          width: 252px !important;
          min-width: 252px !important;
          max-width: 252px !important;
        }

        body:not(.android-shell) .sidebar .nav button {
          column-gap: 8px !important;
        }

        body:not(.android-shell) .sidebar .nav button > span:nth-child(2) {
          font-size: 12px !important;
        }
      }
      @media (min-width: 1281px) {
        body.thin-trade-client:not(.android-shell) .app {
          grid-template-columns: 286px minmax(0, 1fr) !important;
        }
        body.thin-trade-client:not(.android-shell) .app > .sidebar {
          width: 286px !important;
          min-width: 286px !important;
          max-width: 286px !important;
        }
        body.thin-trade-client:not(.android-shell) .sidebar-actions-row {
          grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
          gap: 6px !important;
        }
        body.thin-trade-client:not(.android-shell) .sidebar-actions-row :where(.quick-support-button, .quick-sync-button) {
          padding-inline: 6px !important;
          font-size: 10.5px !important;
          letter-spacing: 0 !important;
        }
      }

      html body.android-shell .modal .support-card,
      html body.android-shell .modal .support-create-modal .support-card,
      html body.android-shell #cabinetForm .section-card,
      html body.android-shell #cabinetForm .stat,
      html body.android-shell #cabinetForm input {
        background: linear-gradient(180deg, #11151c, #0a0d12) !important;
        color: #f4f5f7 !important;
        border-color: rgba(222, 229, 238, .16) !important;
        box-shadow: none !important;
      }

      html body.android-shell .modal .support-card :where(strong, p, span, a, .muted),
      html body.android-shell #cabinetForm :where(strong, p, span, label, .muted) {
        color: #d8dde5 !important;
      }

      html body.android-shell .modal-head .btn.small,
      html body.android-shell .child-modal .modal-head .btn.small {
        background: #171a20 !important;
        color: #f4f5f7 !important;
        border-color: rgba(222, 229, 238, .16) !important;
        box-shadow: none !important;
      }

      html body.android-shell #modalRoot .modal-head button[data-action="modal-close"],
      html body.android-shell #modalRoot .modal-head button[data-action="modal-close"]:hover,
      html body.android-shell #modalRoot .modal-head button[data-action="modal-close"]:focus-visible,
      html body.android-shell #childModalRoot .modal-head button[data-action="modal-close"],
      html body.android-shell #childModalRoot .modal-head button[data-action="modal-close"]:hover,
      html body.android-shell #childModalRoot .modal-head button[data-action="modal-close"]:focus-visible {
        background-color: #171a20 !important;
        background-image: none !important;
        color: #f4f5f7 !important;
        border-color: #353b45 !important;
        box-shadow: none !important;
      }

      /* Tablet workspace and compact service footer. */
      /* Paint ordinary tablet surfaces in the main layer. */
      @media (orientation: landscape) and (min-width: 681px) and (max-width: 1400px) {
        html body.android-shell #appRoot.app {
          gap: 8px !important;
          background: #050608 !important;
        }

        html body.android-shell #appRoot.app > .sidebar {
          border-right: 1px solid rgba(174, 184, 199, .16) !important;
          border-radius: 0 14px 14px 0 !important;
        }

        html body.android-shell #appRoot.app > .main {
          border-left: 1px solid rgba(174, 184, 199, .12) !important;
          border-radius: 14px 0 0 14px !important;
        }

        html body.android-shell #appRoot.app > .sidebar > .nav {
          align-content: start !important;
          gap: 3px !important;
          overflow-y: auto !important;
          overflow-x: hidden !important;
          scrollbar-width: none !important;
        }

        html body.android-shell #appRoot.app > .sidebar > .nav button {
          min-height: 34px !important;
          padding-block: 4px !important;
          font-size: 12px !important;
        }

        html body.android-shell #appRoot.app > .sidebar > .nav::-webkit-scrollbar {
          width: 0 !important;
          height: 0 !important;
        }

        html body.android-shell .sidebar .shift-box.as-nav-note {
          grid-template-columns: minmax(0, 1.4fr) minmax(78px, .6fr) !important;
          grid-template-areas:
            "profile shift"
            "actions actions"
            "state state" !important;
          margin-bottom: max(66px, calc(env(safe-area-inset-bottom) + 18px)) !important;
          gap: 4px !important;
          padding: 5px !important;
        }

        html body.android-shell .sidebar .shift-box.as-nav-note > .quick-profile-button {
          grid-area: profile !important;
          grid-template-columns: auto minmax(0, 1fr) !important;
          gap: 5px !important;
          text-align: left !important;
        }

        html body.android-shell .sidebar .shift-box.as-nav-note > .quick-profile-button span {
          display: block !important;
          overflow: visible !important;
          text-overflow: clip !important;
          white-space: nowrap !important;
          color: #c2c8d1 !important;
          font-size: 10px !important;
        }

        html body.android-shell .sidebar .shift-box.as-nav-note > .quick-profile-button strong {
          min-width: 0 !important;
          font-size: 10px !important;
        }

        html body.android-shell .sidebar .shift-box.as-nav-note > .shift-state-line {
          grid-area: shift !important;
        }

        html body.android-shell .sidebar .shift-box.as-nav-note .sidebar-actions-row {
          grid-area: actions !important;
          grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
          gap: 4px !important;
        }

        html body.android-shell .sidebar .shift-box.as-nav-note .quick-purchase-button {
          grid-column: 1 / -1 !important;
        }

        html body.android-shell .sidebar .shift-box.as-nav-note :where(
          .quick-profile-button,
          .quick-support-button,
          .quick-sync-button,
          .quick-purchase-button,
          .shift-state-line
        ) {
          min-height: 26px !important;
          max-height: 28px !important;
          padding: 3px 5px !important;
          font-size: 10px !important;
          line-height: 1.1 !important;
        }

        html body.android-shell .sidebar .shift-box.as-nav-note #syncState {
          grid-area: state !important;
          min-height: 26px !important;
          max-height: 28px !important;
          padding: 3px 5px !important;
          font-size: 10px !important;
          line-height: 1.1 !important;
          overflow: hidden !important;
        }

        html body.android-shell .sidebar .shift-box.as-nav-note #syncState .sync-state-main {
          grid-template-columns: auto minmax(0, 1fr) !important;
          align-items: center !important;
          gap: 5px !important;
        }

        html body.android-shell .sidebar .shift-box.as-nav-note #syncState .sync-state-main span {
          overflow: hidden !important;
          text-overflow: ellipsis !important;
          white-space: nowrap !important;
        }

        html body.android-shell .brand.network-setup-needed {
          padding-right: 10px !important;
          background: linear-gradient(180deg, #10131a, #090b10) !important;
          border-color: rgba(220, 228, 240, .16) !important;
          box-shadow: inset 0 1px rgba(255, 255, 255, .04) !important;
        }

        html body.android-shell .brand.network-setup-needed::after {
          content: "" !important;
          position: absolute !important;
          top: 8px !important;
          right: 8px !important;
          left: auto !important;
          width: 10px !important;
          height: 10px !important;
          min-width: 10px !important;
          padding: 0 !important;
          border: 2px solid #171a20 !important;
          border-radius: 50% !important;
          background: #d75b65 !important;
          box-shadow: 0 0 0 2px rgba(215, 91, 101, .18) !important;
        }

        html body.android-shell #cabinetForm .section-card,
        html body.android-shell #cabinetForm .stat,
        html body.android-shell #cabinetForm input {
          background: linear-gradient(180deg, #11151c, #0a0d12) !important;
          color: #f4f5f7 !important;
          border-color: rgba(222, 229, 238, .16) !important;
          box-shadow: none !important;
        }

        html body.android-shell button.btn.small[data-action="modal-close"],
        html body.android-shell button.modal-close[data-action="modal-close"] {
          background: #171a20 !important;
          background-image: none !important;
          color: #f4f5f7 !important;
          border: 1px solid #353b45 !important;
          box-shadow: none !important;
        }

        html body.android-shell :where(
          .topline,
          .panel,
          .section-card,
          .settings-card,
          .stat,
          .support-card,
          .network-card,
          .integration-card,
          .legal-group,
          .legal-doc-row
        ) {
          transform: none !important;
          filter: none !important;
          will-change: auto !important;
          -webkit-backdrop-filter: none !important;
          backdrop-filter: none !important;
        }

        html body.android-shell .modal-backdrop,
        html body.android-shell .modal-backdrop.child-modal-backdrop {
          -webkit-backdrop-filter: none !important;
          backdrop-filter: none !important;
        }

        html body.android-shell .view:not(.hidden) > :where(.panel, .section-card, .settings-card, .stat) {
          animation: none !important;
        }
      }

      /* Chapter 06 Android visual parity with SRM Control. */
      .report-period-shell {
        display: grid;
        grid-template-columns: minmax(190px, .75fr) minmax(300px, 1.2fr) minmax(290px, 1fr);
        gap: 10px;
        align-items: center;
        padding: 12px;
        border-bottom: 1px solid var(--srm-line-soft);
        background: linear-gradient(180deg, rgba(15, 18, 24, .98), rgba(9, 11, 16, .98));
      }

      .report-period-heading,
      .report-date-control {
        display: flex;
        align-items: center;
        min-width: 0;
      }

      .report-period-heading { gap: 10px; }
      .report-period-heading > div { min-width: 0; }
      .report-period-heading strong,
      .report-period-heading small { display: block; }
      .report-period-heading small { margin-top: 2px; color: var(--srm-muted) !important; font-size: 11px; }

      .report-period-icon,
      .quick-profile-icon {
        display: inline-grid;
        place-items: center;
        flex: 0 0 auto;
        width: 28px;
        height: 28px;
        border: 1px solid rgba(224, 226, 230, .2);
        border-radius: 7px;
        color: #eef2f8 !important;
        background: #1a1d20;
      }

      .report-period-icon svg,
      .quick-profile-icon svg,
      .date-picker-button svg {
        display: block;
        width: 17px;
        height: 17px;
        margin: 0;
        stroke: currentColor;
      }

      .report-period-presets {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 6px;
      }

      .report-period-presets button {
        min-width: 0;
        min-height: 34px;
        padding: 6px 8px;
        border: 1px solid rgba(222, 229, 238, .13) !important;
        border-radius: 8px !important;
        background: #12161d !important;
        color: #b9c1ce !important;
        box-shadow: none !important;
        white-space: nowrap;
      }

      .report-period-presets button.active {
        border-color: rgba(238, 239, 241, .42) !important;
        background: #2b2e31 !important;
        color: #f7f8fa !important;
      }

      .report-date-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
        min-width: 0;
      }

      .report-date-field {
        display: grid;
        gap: 4px;
        min-width: 0;
        font-size: 10px;
        font-weight: 750;
      }

      .report-date-control {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 30px;
        gap: 4px;
        min-height: 36px;
        padding: 3px 3px 3px 8px;
        border: 1px solid rgba(222, 229, 238, .14);
        border-radius: 9px;
        background: #0b0e13;
      }

      .report-date-control input[type="date"] {
        width: 100%;
        min-width: 0;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        font-size: 11px;
      }

      .report-date-control input[type="date"]::-webkit-calendar-picker-indicator {
        display: none !important;
      }

      .report-date-control .date-picker-button,
      .mini-date-field .date-picker-button {
        display: inline-grid !important;
        place-items: center !important;
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
        min-height: 30px !important;
        padding: 0 !important;
        border: 1px solid rgba(125, 109, 255, .24) !important;
        border-radius: 7px !important;
        background: rgba(125, 109, 255, .12) !important;
        color: #eef2f8 !important;
        box-shadow: none !important;
      }

      .report-actions {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 8px !important;
        justify-content: stretch !important;
      }

      .report-actions > .btn {
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
      }

      body.android-shell {
        position: relative;
        isolation: isolate;
      }

      html body.android-shell::before {
        inset: -22% !important;
        z-index: 0 !important;
        background:
          radial-gradient(ellipse at 18% 26%, rgba(71, 112, 190, .22) 0%, rgba(45, 73, 128, .11) 28%, transparent 61%),
          radial-gradient(ellipse at 78% 72%, rgba(104, 80, 190, .17) 0%, rgba(58, 44, 111, .08) 30%, transparent 64%) !important;
        filter: none !important;
        opacity: .66 !important;
        will-change: transform, opacity;
        animation: srmAndroidAmbientBreath 14s ease-in-out infinite alternate !important;
      }

      html body.android-shell #appRoot.app {
        position: relative;
        z-index: 1;
        background: transparent !important;
      }

      html body.android-shell #appRoot.app > .main {
        position: relative;
        isolation: isolate;
        overflow: hidden !important;
      }

      html body.android-shell #appRoot.app > .main::before {
        content: "";
        position: absolute;
        inset: -18%;
        z-index: 0;
        pointer-events: none;
        background:
          radial-gradient(ellipse at 26% 20%, rgba(69, 111, 188, .16), transparent 54%),
          radial-gradient(ellipse at 82% 76%, rgba(102, 79, 180, .12), transparent 58%);
        opacity: .64;
        will-change: transform, opacity;
        animation: srmAndroidWorkspaceGlow 17s ease-in-out infinite alternate;
      }

      html body.android-shell #appRoot.app > .main > * {
        position: relative;
        z-index: 1;
      }

      @keyframes srmAndroidAmbientBreath {
        0% { transform: translate3d(-2%, -1%, 0) scale(1); opacity: .48; }
        55% { transform: translate3d(1.5%, 1%, 0) scale(1.045); opacity: .72; }
        100% { transform: translate3d(3%, -1.5%, 0) scale(1.08); opacity: .56; }
      }

      @keyframes srmAndroidWorkspaceGlow {
        from { transform: translate3d(-2%, 0, 0) scale(1); opacity: .46; }
        to { transform: translate3d(3%, -2%, 0) scale(1.08); opacity: .72; }
      }

      html body.android-shell .nav button > span.nav-icon {
        width: 26px !important;
        height: 26px !important;
        min-width: 26px !important;
        border: 1px solid transparent !important;
        border-radius: 7px !important;
        background: #12161d !important;
        color: #aeb8c8 !important;
        box-shadow: none !important;
      }

      html body.android-shell .nav button > span.nav-icon svg {
        width: 17px !important;
        height: 17px !important;
        stroke-width: 2 !important;
      }

      html body.android-shell .nav button.active > span.nav-icon {
        border-color: rgba(125, 109, 255, .3) !important;
        background: rgba(125, 109, 255, .14) !important;
        color: #f4f6fa !important;
      }

      html body.android-shell .quick-profile-button {
        display: grid !important;
        grid-template-columns: 24px minmax(0, 1fr) !important;
        align-items: center !important;
        justify-items: start !important;
        gap: 6px !important;
        text-align: left !important;
      }

      html body.android-shell .quick-profile-button .quick-profile-icon {
        width: 22px !important;
        height: 22px !important;
        border-radius: 6px !important;
      }

      html body.android-shell .quick-profile-button .quick-profile-icon svg {
        width: 14px !important;
        height: 14px !important;
      }

      html body.android-shell .quick-profile-button > span:not(.quick-profile-icon) {
        display: block !important;
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        color: #e8ebf0 !important;
        font-size: 10.5px !important;
        font-weight: 750 !important;
      }

      html body.android-shell .quick-profile-button .quick-profile-name {
        display: none !important;
      }

      html body.android-shell .modal.sync-details-modal .table-notice,
      html body.android-shell .child-modal.sync-details-modal .table-notice {
        background: linear-gradient(180deg, rgba(17, 29, 48, .98), rgba(8, 17, 31, .98)) !important;
        border: 1px solid rgba(132, 145, 168, .24) !important;
        color: var(--android-text) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
      }

      html body.android-shell .modal.sync-details-modal .table-notice *,
      html body.android-shell .child-modal.sync-details-modal .table-notice * {
        color: var(--android-text) !important;
        -webkit-text-fill-color: currentColor !important;
      }

      html body.android-shell .modal.sync-details-modal [data-action="modal-close"],
      html body.android-shell .child-modal.sync-details-modal [data-action="modal-close"] {
        background: rgba(18, 27, 42, .96) !important;
        border-color: rgba(132, 145, 168, .28) !important;
        color: #f4f6fa !important;
      }

      html body.android-shell :where(.modal, .child-modal) :where(.table-notice, .section-card, .settings-mini, .purchase-quote),
      html body.android-shell :where(.activation-login-card, .activation-main-panel, .activation-side-panel) :where(.table-notice, .section-card, .settings-mini, .employee-login-card) {
        background: linear-gradient(180deg, rgba(17, 29, 48, .98), rgba(8, 17, 31, .99)) !important;
        border: 1px solid rgba(132, 145, 168, .24) !important;
        color: var(--android-text) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
      }

      html body.android-shell :where(.modal, .child-modal) :where(.table-notice, .section-card, .settings-mini, .purchase-quote) *,
      html body.android-shell :where(.activation-login-card, .activation-main-panel, .activation-side-panel) :where(.table-notice, .section-card, .settings-mini, .employee-login-card) * {
        color: var(--android-text) !important;
        -webkit-text-fill-color: currentColor !important;
        text-shadow: none !important;
      }

      html body.android-shell :where(.modal-head .btn.small, [data-action="modal-close"]) {
        background: linear-gradient(180deg, rgba(26, 38, 56, .98), rgba(10, 18, 30, .99)) !important;
        border-color: rgba(132, 145, 168, .3) !important;
        color: #f4f6fa !important;
        box-shadow: none !important;
      }

      html body.android-shell input[type="date"]::-webkit-calendar-picker-indicator,
      html body.android-shell input[type="datetime-local"]::-webkit-calendar-picker-indicator {
        opacity: .72;
        filter: invert(88%) sepia(8%) saturate(245%) hue-rotate(180deg) brightness(103%);
      }

      @media (max-width: 1040px) {
        .report-period-shell { grid-template-columns: minmax(0, 1fr); }
        .report-period-presets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      }

      @media (orientation: landscape) and (min-width: 681px) and (max-width: 1400px) {
        html body.android-shell .sidebar .shift-box.as-nav-note {
          grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr) !important;
        }
      }

      @media (max-width: 680px) {
        body.android-shell .report-period-presets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        body.android-shell .report-date-grid { grid-template-columns: minmax(0, 1fr); }
        body.android-shell .report-actions { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
      }

      body.simple-trade-mode .nav {
        align-content: start;
        gap: 10px;
      }

      body.simple-trade-mode .nav > button {
        min-height: 52px;
        padding-block: 10px;
        font-size: 15px;
      }

      body.simple-trade-mode .nav > button .nav-icon {
        width: 30px;
        height: 30px;
      }

      body.simple-trade-mode #view-pos .pos-tabs {
        display: none !important;
      }

      body.simple-trade-mode .brand {
        cursor: default;
      }

      .profile-interface-mode {
        display: grid;
        gap: 8px;
        padding: 12px;
        border: 1px solid rgba(121, 139, 170, .24);
        border-radius: 8px;
        background: linear-gradient(180deg, rgba(18, 29, 47, .96), rgba(9, 17, 29, .98));
      }

      .profile-interface-mode > span {
        color: #dce5f2;
        font-weight: 700;
      }

      .profile-interface-mode small {
        color: #9dacbf;
        line-height: 1.4;
      }

      .interface-mode-switch {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px;
      }

      .interface-mode-switch .btn {
        min-width: 0;
        margin: 0;
      }

      .interface-mode-switch .btn.active {
        color: #f7f9fc;
        border-color: rgba(116, 144, 190, .58);
        background: linear-gradient(180deg, rgba(53, 73, 105, .96), rgba(26, 40, 62, .98));
        box-shadow: 0 0 0 1px rgba(117, 146, 196, .12), 0 8px 20px rgba(0, 0, 0, .2);
      }

      .topline-tools {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 10px;
        min-width: 0;
      }

      .top-interface-mode {
        display: flex;
        align-items: center;
        gap: 8px;
        min-width: 0;
        padding: 5px 6px 5px 10px;
        border: 1px solid rgba(121, 139, 170, .22);
        border-radius: 8px;
        background: rgba(8, 13, 21, .86);
      }

      .top-interface-mode > span {
        color: #9dacbf;
        font-size: 11px;
        font-weight: 700;
        white-space: nowrap;
      }

      .top-interface-mode .interface-mode-switch {
        display: flex;
        gap: 4px;
      }

      .top-interface-mode .btn {
        min-height: 30px;
        padding: 5px 9px;
        font-size: 11px;
      }

      /* Chapter 06 release polish: focused trade workstation and one page scroll. */
      #view-support.hidden {
        display: none !important;
      }

      body.simple-trade-mode .main {
        overflow-y: auto !important;
        overflow-x: hidden !important;
      }

      body.simple-trade-mode :where(#view-reports, #view-shifts, #view-stock):not(.hidden) {
        height: auto !important;
        min-height: 100% !important;
        max-height: none !important;
        contain: none !important;
        overflow: visible !important;
        padding-bottom: max(28px, calc(var(--android-safe-bottom, 0px) + 20px)) !important;
      }

      :where(#view-reports, #view-shifts, #view-stock):not(.hidden) {
        height: auto !important;
        min-height: 100% !important;
        max-height: none !important;
        contain: none !important;
        overflow: visible !important;
        align-content: start !important;
        padding-bottom: max(28px, calc(var(--android-safe-bottom, 0px) + 20px)) !important;
      }

      :where(#view-reports, #view-shifts, #view-stock) :where(.panel-body, .shift-table-wrap, .acceptance-panel-body) {
        max-height: none !important;
        overflow-y: visible !important;
      }

      #view-stock:not(.hidden) > .grid {
        display: block !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
      }

      #view-stock:not(.hidden) .stock-shell-panel {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
      }

      #view-stock:not(.hidden) .stock-bottom-actions {
        position: static !important;
        inset: auto !important;
        margin-top: 12px !important;
      }

      body.simple-trade-mode :where(#view-reports, #view-shifts, #view-stock) :where(.panel-body, .shift-table-wrap, .acceptance-panel-body) {
        max-height: none !important;
        overflow-y: visible !important;
      }

      body.simple-trade-mode :where(#view-reports, #view-shifts, #view-stock) :where(.table-wrap, .table-scroll) {
        max-height: none !important;
        overflow-x: auto !important;
        overflow-y: visible !important;
      }

      body.simple-trade-mode #view-reports > .panel,
      body.simple-trade-mode #view-shifts > .grid,
      body.simple-trade-mode #view-stock > .grid,
      body.simple-trade-mode #view-stock .stock-shell-panel,
      body.simple-trade-mode #view-stock .acceptance-shell-panel {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
      }

      body.simple-trade-mode #view-reports .report-scroll-body {
        display: grid;
        gap: 14px;
        padding-bottom: 24px;
      }

      body.simple-trade-mode #view-reports :where(.report-card-green, .report-card-blue, .report-card-gold, .report-card-red) {
        background: linear-gradient(180deg, rgba(19, 30, 48, .98), rgba(8, 15, 27, .98)) !important;
        border-color: rgba(123, 139, 170, .24) !important;
        color: #f4f7fb !important;
      }

      body.simple-trade-mode #view-reports :where(.report-card-green, .report-card-blue, .report-card-gold, .report-card-red) span {
        color: #aab6c8 !important;
      }

      body.simple-trade-mode #view-pos:not(.hidden) {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
        padding: 0 0 max(28px, calc(var(--android-safe-bottom, 0px) + 20px)) !important;
      }

      .simple-pos-shell {
        display: grid;
        grid-template-rows: minmax(300px, auto) auto;
        gap: 10px;
        min-height: 0;
        height: auto;
      }

      .simple-pos-workspace {
        display: grid !important;
        grid-template-rows: auto auto minmax(0, 1fr);
        min-height: 0 !important;
        overflow: visible !important;
        border-radius: 8px !important;
        background: linear-gradient(180deg, rgba(12, 21, 35, .98), rgba(5, 11, 21, .99)) !important;
      }

      .simple-pos-commandbar {
        display: grid;
        grid-template-columns: minmax(260px, 1fr) auto auto;
        gap: 8px;
        align-items: center;
        padding: 10px;
        border-bottom: 1px solid rgba(124, 139, 168, .2);
        background: rgba(10, 17, 29, .94);
      }

      .simple-pos-commandbar .simple-pos-search {
        justify-content: flex-start;
        min-height: 42px;
        text-align: left;
      }

      .simple-return-heading {
        display: grid;
        align-content: center;
        gap: 2px;
        min-width: 0;
        padding: 7px 12px;
        border: 1px solid rgba(145, 164, 190, .2);
        border-radius: 8px;
        background: rgba(7, 13, 23, .88);
      }

      .simple-return-heading strong {
        color: #ffffff;
        font-size: 13px;
      }

      .simple-return-heading span,
      .return-sale-row small {
        display: block;
        color: rgba(199, 211, 229, .76) !important;
        font-size: 11px;
        line-height: 1.3;
      }

      .simple-pos-receipt-number {
        color: #aab6c8;
        font-size: 12px;
        white-space: nowrap;
      }

      .simple-pos-cart-columns {
        display: grid;
        grid-template-columns: minmax(240px, 1fr) 110px 110px 130px 104px;
        gap: 8px;
        padding: 8px 12px;
        color: #8998ad;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        border-bottom: 1px solid rgba(124, 139, 168, .14);
      }

      .simple-pos-cart {
        min-height: 180px !important;
        max-height: none !important;
        overflow: visible !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        padding: 8px !important;
      }

      .simple-pos-cart .cart-item {
        grid-template-columns: minmax(240px, 1fr) 92px minmax(110px, auto) auto auto !important;
        min-height: 54px;
        border-radius: 7px !important;
        background: rgba(15, 25, 41, .76) !important;
        border-color: rgba(124, 139, 168, .16) !important;
      }

      .simple-pos-empty {
        min-height: 180px;
        display: grid;
        place-items: center;
        border: 1px dashed rgba(124, 139, 168, .24) !important;
        background: rgba(8, 14, 25, .54) !important;
      }

      .simple-pos-checkout {
        display: grid;
        grid-template-columns: minmax(220px, .58fr) minmax(330px, 1fr) minmax(330px, .9fr);
        gap: 10px;
        align-items: stretch;
        padding: 10px;
        border: 1px solid rgba(124, 139, 168, .22);
        border-radius: 8px;
        background: linear-gradient(180deg, rgba(18, 27, 43, .98), rgba(8, 14, 25, .99));
        box-shadow: 0 16px 34px rgba(0, 0, 0, .24);
      }

      .simple-pos-summary {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        padding: 12px;
        border: 1px solid rgba(124, 139, 168, .18);
        border-radius: 7px;
        background: rgba(5, 10, 19, .72);
      }

      .simple-pos-summary > div {
        display: grid;
        align-content: center;
        gap: 4px;
        min-width: 0;
      }

      .simple-pos-summary span,
      .simple-pos-customer span {
        color: #91a0b5 !important;
        font-size: 11px;
      }

      .simple-pos-summary strong {
        color: #f7f9fc !important;
        font-size: clamp(17px, 1.55vw, 25px);
        overflow-wrap: anywhere;
      }

      .simple-pos-summary > div:first-child {
        grid-column: 1 / -1;
        padding-bottom: 8px;
        border-bottom: 1px solid rgba(124, 139, 168, .16);
      }

      .simple-pos-summary > div:first-child strong {
        font-size: clamp(24px, 2.35vw, 38px);
      }

      .simple-pos-payment-fields {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        align-content: start;
      }

      .simple-pos-payment-fields label {
        gap: 4px !important;
        color: #aab6c8 !important;
        font-size: 11px !important;
      }

      .simple-pos-payment-fields :where(input, select) {
        min-height: 36px !important;
        background: rgba(5, 11, 21, .94) !important;
        border-color: rgba(124, 139, 168, .24) !important;
        color: #f5f7fb !important;
      }

      .simple-pos-customer {
        grid-column: 1 / -1;
        display: grid;
        gap: 3px;
        min-width: 0;
        padding: 8px 10px;
        text-align: left;
        border: 1px solid rgba(124, 139, 168, .22);
        border-radius: 7px;
        background: rgba(8, 15, 27, .88);
        color: #f5f7fb;
        cursor: pointer;
      }

      .simple-pos-details {
        grid-column: 1 / -1;
        border: 1px solid rgba(124, 139, 168, .18);
        border-radius: 7px;
        background: rgba(7, 13, 23, .68);
      }

      .simple-pos-details summary {
        padding: 8px 10px;
        color: #aab6c8;
        cursor: pointer;
      }

      .simple-pos-details-body {
        display: grid;
        gap: 8px;
        padding: 0 8px 8px;
      }

      .simple-pos-mixed,
      .simple-return-filters {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
      }

      .simple-pos-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
        align-content: stretch;
      }

      .simple-pos-actions .btn {
        min-height: 42px;
        padding: 8px 10px;
        border-radius: 7px !important;
        white-space: normal;
      }

      .simple-pos-actions .simple-pos-pay {
        grid-column: 1 / -1;
        min-height: 48px;
        font-size: 15px;
      }

      .simple-return-shell .simple-pos-workspace {
        grid-template-rows: auto minmax(150px, .7fr) minmax(190px, 1fr);
      }

      .simple-return-sales {
        min-height: 0;
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
        gap: 8px;
        padding: 8px;
        border-top: 1px solid rgba(124, 139, 168, .14);
      }

      .simple-return-filters {
        grid-template-columns: minmax(180px, 1fr) repeat(3, minmax(120px, auto));
      }

      .simple-return-sales .return-sales-list {
        min-height: 0;
        max-height: none;
        overflow: visible;
      }

      .simple-return-checkout {
        grid-template-columns: minmax(240px, .7fr) minmax(260px, 1fr) minmax(320px, 1fr);
      }

      #view-settings .device-settings-layout :where(.panel, .settings-mini, .toggle-line, .equipment-capabilities, .diagnostics-list > div) {
        background: linear-gradient(180deg, rgba(17, 28, 45, .96), rgba(8, 15, 27, .98)) !important;
        border-color: rgba(124, 139, 168, .22) !important;
        color: #edf2f8 !important;
      }

      #view-settings .device-settings-layout :where(.settings-mini span, .settings-mini small, .diagnostics-list span, .panel-head p, label, .muted) {
        color: #a5b1c2 !important;
      }

      #view-settings .device-settings-layout :where(strong, h3, h4) {
        color: #f6f8fb !important;
      }

      #view-settings .device-settings-layout .tag {
        background: rgba(91, 112, 151, .28) !important;
        border-color: rgba(124, 139, 168, .24) !important;
        color: #dce5f1 !important;
      }

      #view-settings .device-settings-layout input[type="checkbox"] {
        accent-color: #7c5cff !important;
      }

      html body:not(.android-shell) .contact-icon-button,
      html body.android-shell .contact-icon-button,
      html body:not(.android-shell) .support-logo.telegram,
      html body:not(.android-shell) .support-logo.whatsapp,
      html body.android-shell .support-logo.telegram,
      html body.android-shell .support-logo.whatsapp {
        color: transparent !important;
        font-size: 0 !important;
        border-color: rgba(149, 160, 181, .24) !important;
      }

      html body:not(.android-shell) .contact-icon-button.telegram,
      html body.android-shell .contact-icon-button.telegram,
      html body:not(.android-shell) .support-logo.telegram,
      html body.android-shell .support-logo.telegram {
        background: #080b10 url("assets/contact-platform-strip.png") 6% 50% / 420% auto no-repeat !important;
      }

      html body:not(.android-shell) .contact-icon-button.whatsapp,
      html body.android-shell .contact-icon-button.whatsapp,
      html body:not(.android-shell) .support-logo.whatsapp,
      html body.android-shell .support-logo.whatsapp {
        background: #080b10 url("assets/contact-platform-strip.png") 50% 50% / 420% auto no-repeat !important;
      }

      .shift-box.as-nav-note .quick-profile-button {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 7px !important;
        min-width: 0 !important;
        overflow: hidden !important;
      }

      .shift-box.as-nav-note .quick-profile-button > span:not(.quick-profile-icon) {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
      }

      .shift-box.as-nav-note .quick-profile-button .quick-profile-name {
        display: none !important;
      }

      @media (max-width: 1080px) {
        .simple-pos-checkout,
        .simple-return-checkout {
          grid-template-columns: minmax(200px, .55fr) minmax(290px, 1fr);
        }
        .simple-pos-actions {
          grid-column: 1 / -1;
          grid-template-columns: repeat(6, minmax(0, 1fr));
        }
        .simple-pos-actions .simple-pos-pay { grid-column: span 2; }
      }

      @media (max-height: 760px) and (min-width: 681px) {
        .simple-pos-workspace { min-height: 280px !important; }
        .simple-pos-empty { min-height: 120px; }
        .simple-pos-checkout { grid-template-columns: minmax(190px, .5fr) minmax(270px, 1fr); }
        .simple-pos-actions { grid-column: 1 / -1; grid-template-columns: repeat(5, minmax(0, 1fr)); }
        .simple-pos-actions .simple-pos-pay { grid-column: span 2; }
      }

      @media (max-width: 680px) {
        .topline-tools { width: 100%; justify-content: stretch; flex-wrap: wrap; }
        .top-interface-mode { width: 100%; justify-content: space-between; }
        .topline-tools .actions { width: 100%; }
        body.simple-trade-mode #view-pos:not(.hidden) {
          height: auto !important;
          overflow: visible !important;
        }
        .simple-pos-shell {
          height: auto;
          grid-template-rows: auto auto;
        }
        .simple-pos-workspace { min-height: 390px !important; }
        .simple-pos-commandbar { grid-template-columns: minmax(0, 1fr); }
        .simple-pos-receipt-number { white-space: normal; }
        .simple-pos-cart-columns { display: none; }
        .simple-pos-cart .cart-item { grid-template-columns: minmax(0, 1fr) 84px auto !important; }
        .simple-pos-checkout,
        .simple-return-checkout { grid-template-columns: minmax(0, 1fr); }
        .simple-pos-payment-fields,
        .simple-return-filters { grid-template-columns: minmax(0, 1fr); }
        .simple-pos-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        .simple-pos-actions .simple-pos-pay { grid-column: 1 / -1; }
        .simple-return-shell .simple-pos-workspace { grid-template-rows: auto minmax(160px, auto) auto; }
        .simple-return-sales .return-sales-list { max-height: none; overflow: visible; }
      }

      html body {
        --srm-bg: #030405 !important;
        --srm-bg-2: #07080a !important;
        --srm-bg-3: #0b0d10 !important;
        --srm-panel: #0d1014 !important;
        --srm-panel-strong: #111419 !important;
        --srm-line: rgba(177, 185, 198, .16) !important;
        --srm-line-strong: rgba(177, 185, 198, .27) !important;
      }

      html body .app,
      html body .main,
      html body .sidebar {
        background-color: var(--srm-bg) !important;
      }

      html body :is(.panel, .stat, .settings-card, .total-box, .payment-counterparty-card, .pos-loyalty-card) {
        background: linear-gradient(180deg, #111419, #090b0e) !important;
        border-color: var(--srm-line) !important;
      }

      html body :is(.panel > .panel-head, table > thead, .table-head) {
        background: #11151a !important;
        border-color: var(--srm-line) !important;
      }

      html body :is(.btn.primary, button.primary, .simple-pos-pay) {
        background: linear-gradient(180deg, #2a2f38, #191d23) !important;
        border-color: rgba(198, 205, 216, .24) !important;
        color: #f5f6f8 !important;
        box-shadow: 0 12px 28px rgba(0, 0, 0, .34), inset 0 1px rgba(255, 255, 255, .065) !important;
      }

      html body:not(#srm-legacy-theme) :is(.btn.primary, button.primary, .simple-pos-pay) {
        background: linear-gradient(180deg, #242a32, #171b21) !important;
        border-color: rgba(167, 139, 250, .34) !important;
        box-shadow: 0 8px 20px rgba(0, 0, 0, .28), inset 0 1px rgba(255, 255, 255, .055) !important;
      }

      html body:not(#srm-legacy-theme) :is(.panel > .panel-head, table > thead, table thead th, .table-head) {
        background: linear-gradient(180deg, #15191f, #101318) !important;
        color: #edf1f7 !important;
        border-color: rgba(177, 185, 198, .14) !important;
      }

      .shift-box.as-nav-note .quick-profile-button {
        display: grid !important;
        grid-template-columns: 32px minmax(0, 1fr) 32px !important;
        align-items: center !important;
        justify-content: stretch !important;
        width: 100% !important;
        min-height: 40px !important;
        padding: 4px 6px !important;
        border-radius: 10px !important;
        background: #0d1014 !important;
        border-color: var(--srm-line) !important;
      }

      body:not(.android-shell) .sidebar {
        grid-template-rows: auto minmax(0, 1fr) auto !important;
      }

      html body .sidebar .shift-box.as-nav-note {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
      }

      body:not(.android-shell) .sidebar .shift-box.as-nav-note {
        grid-template-columns: minmax(0, 1fr) !important;
      }

      body:not(.android-shell) .sidebar .shift-box.as-nav-note > :where(.quick-profile-button, .sidebar-actions-row, .shift-state-line, #syncState) {
        grid-column: 1 / -1 !important;
      }

      .shift-box.as-nav-note .quick-profile-button .quick-profile-icon {
        grid-column: 1 !important;
        justify-self: start !important;
        width: 30px !important;
        height: 30px !important;
        border-radius: 7px !important;
        background: #12161c !important;
        border-color: var(--srm-line-strong) !important;
      }

      .shift-box.as-nav-note .quick-profile-button > span:not(.quick-profile-icon) {
        grid-column: 2 !important;
        justify-self: center !important;
        text-align: center !important;
        color: #f2f4f7 !important;
        font-weight: 750 !important;
      }

      .shift-box.as-nav-note #syncState.sync-state {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        width: 100% !important;
        min-height: 58px !important;
        padding: 9px 10px !important;
        overflow: visible !important;
        border-radius: 11px !important;
        background: #0b0e12 !important;
        border-color: var(--srm-line) !important;
      }

      .shift-box.as-nav-note #syncState .sync-state-main {
        display: grid !important;
        min-width: 0 !important;
        gap: 4px !important;
      }

      .shift-box.as-nav-note #syncState .sync-state-main strong {
        display: block !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: #f2f4f7 !important;
        font-size: 12px !important;
        line-height: 1.2 !important;
      }

      .shift-box.as-nav-note #syncState .sync-state-main span {
        color: #9da6b3 !important;
        font-size: 10.5px !important;
        line-height: 1.25 !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
      }

      .mini-range .mini-date-field {
        min-width: 0 !important;
        overflow: hidden !important;
        border: 1px solid var(--srm-line) !important;
        border-radius: 9px !important;
        background: #0b0e12 !important;
        box-shadow: none !important;
      }

      .mini-range .mini-date-field input[type="date"] {
        min-width: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        outline: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        color: #eef1f5 !important;
      }

      .mini-range .mini-date-field .date-picker-button {
        border: 0 !important;
        border-left: 1px solid var(--srm-line) !important;
        border-radius: 0 !important;
        background: #10141a !important;
        color: #b9c0ca !important;
      }

      .mixed-payment-fields,
      .simple-pos-mixed {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        grid-column: 1 / -1 !important;
        padding: 9px !important;
        border: 1px solid var(--srm-line) !important;
        border-radius: 10px !important;
        background: #090c10 !important;
      }

      .mixed-payment-balance {
        grid-column: 1 / -1;
        color: #9da6b3 !important;
        font-size: 11px;
      }

      #view-documents .document-workspace {
        display: grid;
        grid-template-columns: 188px minmax(0, 1fr);
        gap: 12px;
        min-height: 0;
        height: 100%;
      }

      #view-documents .document-mode-nav {
        display: flex;
        flex-direction: column;
        align-self: start;
        gap: 7px;
        padding: 9px;
        border: 1px solid var(--srm-line);
        border-radius: 11px;
        background: linear-gradient(180deg, #101318, #090b0e);
      }

      #view-documents .document-mode-nav button {
        width: 100%;
        min-height: 40px;
        padding: 8px 10px;
        border: 1px solid transparent;
        border-radius: 8px;
        background: transparent;
        color: #aeb6c2;
        font: inherit;
        font-weight: 700;
        text-align: left;
        cursor: pointer;
      }

      #view-documents .document-mode-nav button:hover {
        background: #141820;
        color: #eef1f5;
      }

      #view-documents .document-mode-nav button.active {
        border-color: rgba(167, 139, 250, .38);
        background: linear-gradient(180deg, #1b2028, #12161c);
        color: #fff;
        box-shadow: inset 3px 0 #8b7cf6;
      }

      #view-documents .document-mode-content {
        min-width: 0;
        min-height: 0;
        overflow: auto;
        padding: 0 2px 84px 0;
      }

      #view-documents .document-mode-content > * + * { margin-top: 12px; }

      #view-documents .document-mode-content .stat > span,
      .document-detail-summary-table td:first-child,
      .delivery-detail-summary > span {
        display: inline-flex;
        align-items: center;
        width: fit-content;
        padding: 3px 7px;
        border: 1px solid rgba(177, 185, 198, .14);
        border-radius: 6px;
        background: #161a20;
        color: #aeb8c6 !important;
        font-weight: 700;
      }

      .document-detail-summary-table td:first-child {
        width: 34%;
        border-radius: 0;
        background: #15191f !important;
      }

      .document-detail-summary-table td:last-child {
        background: #0b0e12 !important;
        color: #f2f4f7 !important;
      }

      .report-template-section-list {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 7px !important;
      }

      .report-template-section-item {
        display: grid;
        grid-template-columns: 54px 34px minmax(0, 1fr) auto;
        align-items: center;
        gap: 8px;
        min-height: 46px;
        padding: 7px 8px;
        border: 1px solid var(--srm-line);
        border-radius: 8px;
        background: #0b0e12;
      }

      .report-template-section-item:focus-within {
        border-color: rgba(167, 139, 250, .42);
        background: #10141a;
      }

      .report-template-section-order {
        width: 54px !important;
        min-width: 54px !important;
        padding: 6px !important;
        text-align: center;
      }

      .report-template-section-toggle {
        display: grid;
        place-items: center;
        width: 34px;
        height: 34px;
        margin: 0;
      }

      .report-template-section-toggle input[type="checkbox"] {
        width: 18px !important;
        min-width: 18px !important;
        height: 18px !important;
        margin: 0 !important;
        accent-color: #7d70e8;
      }

      .report-template-section-title {
        min-width: 0;
        color: #eef1f5 !important;
        font-weight: 750;
      }

      .report-template-section-actions {
        display: flex;
        gap: 5px;
      }

      .report-template-section-actions button {
        width: 32px;
        min-width: 32px;
        height: 32px;
        padding: 0 !important;
      }

      .report-custom-editor,
      .report-custom-columns {
        display: grid;
        gap: 10px;
      }

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

      .report-custom-column {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 8px;
        padding: 9px;
        border: 1px solid var(--srm-line);
        border-radius: 8px;
        background: #0b0e12;
      }

      @media (max-width: 760px) {
        .report-custom-columns,
        .report-custom-column {
          grid-template-columns: minmax(0, 1fr);
        }
      }

      #view-reports :is(.report-card-green, .report-card-blue, .report-card-gold, .report-card-red) {
        background: linear-gradient(180deg, #111419, #090b0e) !important;
        border: 1px solid var(--srm-line) !important;
        border-left-width: 3px !important;
      }

      #view-reports .report-card-green { border-left-color: #8b7cf6 !important; }
      #view-reports .report-card-blue { border-left-color: #6488b8 !important; }
      #view-reports .report-card-gold { border-left-color: #9c7fbd !important; }
      #view-reports .report-card-red { border-left-color: #a96f7b !important; }

      #view-reports :is(.report-card-green, .report-card-blue, .report-card-gold, .report-card-red) span {
        color: #aeb8c6 !important;
      }

      #view-reports :is(.report-card-green, .report-card-blue, .report-card-gold, .report-card-red) strong {
        color: #f5f6f8 !important;
      }

      #view-pos:not(.hidden) {
        display: block !important;
        height: 100% !important;
        min-height: 0 !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        padding-bottom: 88px !important;
      }

      #view-pos .pos-receipts-history {
        width: 100%;
        height: auto !important;
        min-height: 180px !important;
        min-width: 0;
        overflow: hidden;
      }

      #view-pos .pos-receipts-history .table-wrap,
      #view-pos .pos-receipts-history .table-scroll {
        max-height: none !important;
        overflow-x: auto !important;
        overflow-y: visible !important;
      }

      .incoming-receipts, .incoming-receipt-form, .incoming-receipt-list, .incoming-receipt-lines, .inventory-boundary-note { display: grid; gap: 10px; }
      .incoming-receipts { margin-bottom: 14px; padding: 13px; }
      .incoming-receipts-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
      .incoming-receipts-head > div, .incoming-receipt-list article > div { display: grid; gap: 3px; min-width: 0; }
      .incoming-receipts span, .incoming-receipts small, .inventory-boundary-note span { color: #aeb8c6; }
      .incoming-transfer-filters { display: flex; flex-wrap: wrap; gap: 8px; }
      .incoming-receipt-list article { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 10px; }
      .incoming-receipt-list article, .incoming-receipt-context, .inventory-boundary-note { padding: 11px; border: 1px solid rgba(148, 163, 184, .2); border-radius: 10px; }
      .incoming-receipt-context p { margin: 8px 0 0; }
      .inventory-boundary-note { margin-top: 12px; }
      .inventory-boundary-note strong { color: #f4f6fa; }
      #modalRoot .modal.incoming-receipt-modal { width: min(1120px, calc(100vw - 40px)) !important; }
      .incoming-receipt-line {
        display: grid;
        grid-template-columns: auto minmax(170px, 1.25fr) minmax(88px, .55fr) 100px 100px minmax(125px, .7fr) minmax(140px, 1fr);
        align-items: center;
        gap: 10px;
        padding: 11px;
        border: 1px solid rgba(148, 163, 184, .18);
        border-radius: 10px;
        background: rgba(10, 13, 19, .92);
        min-width: 0;
      }
      .incoming-receipt-line > span { display: grid; gap: 3px; color: #d7dce5; }
      .incoming-receipt-line small { color: #9da8b8; overflow-wrap: anywhere; }
      .incoming-receipt-line > input[type="number"] { width: 100%; min-width: 0; min-height: 38px; }
      .incoming-receipt-line select { min-height: 38px; }
      .incoming-receipt-form .form-actions { display: flex; justify-content: flex-end; gap: 8px; }
      .incoming-receipt-form .form-actions .btn { width: auto; min-width: 132px; white-space: nowrap; }
      @media (max-width: 980px) and (min-width: 721px) {
        .incoming-receipt-line {
          grid-template-columns: auto minmax(180px, 1fr) minmax(88px, .55fr) 96px 96px;
        }
        .incoming-receipt-line > select,
        .incoming-receipt-line > input[data-receipt-comment] { grid-column: 2 / -1; width: 100%; }
      }

      @media (max-width: 720px) {
        .incoming-receipt-list article, .incoming-receipt-line { grid-template-columns: auto minmax(0, 1fr); }
        .incoming-receipt-list article > .tag, .incoming-receipt-list article > .btn, .incoming-receipt-line > span:nth-of-type(2), .incoming-receipt-line > input[type="number"], .incoming-receipt-line > select, .incoming-receipt-line > input[data-receipt-comment] { grid-column: 2; width: 100%; }
        #view-documents .document-workspace {
          grid-template-columns: minmax(0, 1fr);
          height: auto;
        }

        #view-documents .document-mode-nav {
          display: grid;
          grid-template-columns: repeat(3, minmax(0, 1fr));
          position: sticky;
          top: 0;
          z-index: 4;
        }

        #view-documents .document-mode-nav button {
          min-width: 0;
          padding: 7px 5px;
          text-align: center;
        }

        #view-documents .document-mode-nav button.active { box-shadow: inset 0 -3px #8b7cf6; }
        #view-documents .document-mode-content { overflow: visible; padding-bottom: 88px; }
        .report-template-section-item { grid-template-columns: 48px 32px minmax(0, 1fr); }
        .report-template-section-actions { grid-column: 1 / -1; justify-content: flex-end; }
      }

      @media (max-width: 520px) {
        .mixed-payment-fields,
        .simple-pos-mixed { grid-template-columns: minmax(0, 1fr) !important; }
      }

      /* Ordinary supporting text must remain readable on every dark surface. */
      html body:not(#srm-legacy-theme) :where(
        .muted,
        .hint,
        .subtitle,
        .caption,
        .meta,
        .helper,
        .description,
        .field-help,
        .field-hint,
        .empty-state,
        .table-notice,
        .panel-head > span,
        .topline p,
        .stat > span,
        .metric > span,
        .network-metric > span,
        .integration-metric > span,
        .settings-mini > span,
        .settings-mini > small,
        .settings-card small,
        .summary-line > span,
        .total-line > span,
        .sync-state span,
        .event-copy-cell span,
        td > small,
        label
      ) {
        color: #c8ced8 !important;
        opacity: 1 !important;
        text-shadow: none !important;
      }

      html body:not(#srm-legacy-theme) :where(
        .shift-payment-summary,
        .stats,
        .dashboard-stats,
        .settings-summary
      ) :where(.stat > span, div > span:first-child) {
        color: #d8e1ed !important;
        opacity: 1 !important;
        font-weight: 600 !important;
        text-shadow: none !important;
      }

      html body:not(#srm-legacy-theme) :where(input, textarea)::placeholder {
        color: #aeb7c5 !important;
        -webkit-text-fill-color: #aeb7c5 !important;
        opacity: 1 !important;
      }

      :where(.document-print-page, #printRoot.report-print) {
        box-sizing: border-box !important;
        width: min(210mm, 100%) !important;
        max-width: 210mm !important;
        margin-inline: auto !important;
        padding: 15mm 18mm !important;
        background: #ffffff !important;
        color: #000000 !important;
        font-family: Arial, "Noto Sans", sans-serif !important;
        font-size: 9pt !important;
        line-height: 1.3 !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
      }

      :where(.document-print-page, #printRoot.report-print) .report-document-header {
        display: grid !important;
        justify-items: center !important;
        gap: 2.5mm !important;
        margin: 0 0 11mm !important;
        color: #000000 !important;
        text-align: center !important;
      }

      :where(.document-print-page, #printRoot.report-print) .report-document-header h1 {
        margin: 0 !important;
        color: #000000 !important;
        font-size: 21pt !important;
        line-height: 1 !important;
        font-weight: 800 !important;
        letter-spacing: 0 !important;
      }

      :where(.document-print-page, #printRoot.report-print) .report-document-name {
        color: #000000 !important;
        font-size: 12pt !important;
        font-weight: 700 !important;
      }

      :where(.document-print-page, #printRoot.report-print) .report-document-meta {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 1.5mm 5mm !important;
        color: #000000 !important;
        font-size: 9pt !important;
      }

      :where(.document-print-page, #printRoot.report-print) .report-section {
        margin: 0 0 12mm !important;
        color: #000000 !important;
        break-inside: auto !important;
        page-break-inside: auto !important;
      }

      :where(.document-print-page, #printRoot.report-print) .report-section-title {
        box-sizing: border-box !important;
        min-height: 10mm !important;
        margin: 0 !important;
        padding: 2.4mm 3.5mm !important;
        border: 2px solid #000000 !important;
        border-radius: 4px 4px 0 0 !important;
        background: #000000 !important;
        color: #ffffff !important;
        font-size: 13pt !important;
        line-height: 1.1 !important;
        font-weight: 800 !important;
        text-align: left !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
      }

      :where(.document-print-page, #printRoot.report-print) .report-table {
        width: 100% !important;
        margin: 0 !important;
        table-layout: fixed !important;
        border: 2px solid #000000 !important;
        border-collapse: collapse !important;
        border-spacing: 0 !important;
        background: #ffffff !important;
        color: #000000 !important;
      }

      :where(.document-print-page, #printRoot.report-print) .report-table thead {
        display: table-header-group !important;
      }

      :where(.document-print-page, #printRoot.report-print) .report-table tr {
        break-inside: avoid !important;
        page-break-inside: avoid !important;
      }

      :where(.document-print-page, #printRoot.report-print) .report-table :is(th, td) {
        box-sizing: border-box !important;
        border: 1.5px solid #000000 !important;
        background: #ffffff !important;
        color: #000000 !important;
        padding: 2.2mm 2.4mm !important;
        vertical-align: middle !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: auto !important;
      }

      :where(.document-print-page, #printRoot.report-print) .report-table th {
        height: 10mm !important;
        min-height: 10mm !important;
        font-size: 10pt !important;
        line-height: 1.15 !important;
        font-weight: 800 !important;
        text-align: center !important;
      }

      :where(.document-print-page, #printRoot.report-print) .report-table td {
        min-height: 8mm !important;
        font-size: 9pt !important;
        line-height: 1.25 !important;
        text-align: left !important;
      }

      :where(.document-print-page, #printRoot.report-print) .report-table-wide :is(th, td) {
        padding-inline: 1.5mm !important;
        font-size: 7.5pt !important;
      }

      @media print {
        @page report { size: A4 portrait; margin: 15mm 18mm; }
        @page shift-report { size: A4 portrait; margin: 15mm 18mm; }

        #printRoot.report-print,
        #printRoot.shift-report-print {
          width: 100% !important;
          max-width: none !important;
          margin: 0 !important;
          padding: 0 !important;
        }

        #printRoot.report-print .report-section,
        #printRoot.shift-report-print .report-section {
          break-inside: auto !important;
          page-break-inside: auto !important;
          margin-bottom: 12mm !important;
        }

        #printRoot.report-print .report-section-title,
        #printRoot.shift-report-print .report-section-title {
          background: #000000 !important;
          color: #ffffff !important;
        }
      }

html body.android-shell .login-screen {
        box-sizing: border-box !important;
        min-height: 100vh !important;
        min-height: 100dvh !important;
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        padding:
          max(16px, env(safe-area-inset-top))
          max(16px, env(safe-area-inset-right))
          max(16px, env(safe-area-inset-bottom))
          max(16px, env(safe-area-inset-left)) !important;
        scrollbar-width: none !important;
      }

      html body.android-shell .login-screen.hidden {
        display: none !important;
      }

      html body.android-shell .login-screen::-webkit-scrollbar {
        width: 0 !important;
        height: 0 !important;
      }

      html body.android-shell .login-screen .login-card.auth-card {
        box-sizing: border-box !important;
        width: min(100%, 560px) !important;
        max-width: 560px !important;
        min-width: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        max-height: none !important;
        margin: auto !important;
        padding: clamp(20px, 5vw, 32px) !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 12px !important;
        overflow: visible !important;
        text-align: center !important;
        border-radius: 20px !important;
      }

      html body.android-shell .login-screen .login-card.auth-card > *,
      html body.android-shell .login-screen .auth-register-grid > *,
      html body.android-shell .login-screen .auth-password-field {
        box-sizing: border-box !important;
        min-width: 0 !important;
        max-width: 100% !important;
      }

      html body.android-shell .login-screen .login-card.auth-card label {
        width: 100% !important;
        display: grid !important;
        gap: 6px !important;
        margin: 0 !important;
        text-align: left !important;
      }

      html body.android-shell .login-screen .login-card.auth-card :is(input, select, textarea),
      html body.android-shell .login-screen .login-card.auth-card > .btn {
        box-sizing: border-box !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 48px !important;
        height: auto !important;
        margin: 0 !important;
        border-radius: 12px !important;
      }

      html body.android-shell .login-screen .auth-register-grid {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 12px !important;
      }

      html body.android-shell .login-screen .auth-inline-actions {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        align-items: center !important;
        gap: 10px !important;
      }

      html body.android-shell .login-screen .auth-recovery-link {
        box-sizing: border-box !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 40px !important;
        margin: 0 !important;
        padding: 8px 6px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        white-space: normal !important;
        text-align: center !important;
      }

      html body.android-shell .login-screen .auth-password-field {
        position: relative !important;
        width: 100% !important;
        display: block !important;
      }

      html body.android-shell .login-screen .auth-password-field input {
        width: 100% !important;
        padding-right: 52px !important;
      }

      html body.android-shell .login-screen .auth-password-toggle,
      html body.android-shell .login-screen .auth-password-toggle.btn {
        appearance: none !important;
        -webkit-appearance: none !important;
        position: absolute !important;
        z-index: 2 !important;
        top: 50% !important;
        right: 6px !important;
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: translateY(-50%) !important;
        display: grid !important;
        place-items: center !important;
        border: 0 !important;
        border-radius: 10px !important;
        background: transparent !important;
        color: #c8ced8 !important;
        box-shadow: none !important;
      }

      html body.android-shell .login-screen .auth-password-toggle:focus-visible {
        outline: 2px solid rgba(128, 118, 239, .72) !important;
        outline-offset: -2px !important;
      }

      html body.android-shell .login-screen .auth-password-eye::before {
        box-shadow: 0 0 0 2px #0b0e13 !important;
      }

      @media (min-width: 600px) {
        html body.android-shell .login-screen .login-card.auth-card.auth-register-card {
          width: min(100%, 720px) !important;
          max-width: 720px !important;
        }

        html body.android-shell .login-screen .auth-register-grid {
          grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        }

        html body.android-shell .login-screen .auth-register-grid .auth-register-wide {
          grid-column: 1 / -1 !important;
        }
      }

      @media (orientation: landscape) and (max-height: 620px) {
        html body.android-shell .login-screen {
          align-items: flex-start !important;
          padding-block: max(10px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-bottom)) !important;
        }

        html body.android-shell .login-screen .login-card.auth-card {
          gap: 8px !important;
          padding: 14px clamp(22px, 5vw, 34px) !important;
        }

        html body.android-shell .login-screen .login-card.auth-card .login-logo {
          width: 44px !important;
          height: 44px !important;
        }

        html body.android-shell .login-screen .auth-role-guide,
        html body.android-shell .login-screen .login-card.auth-card > small {
          display: none !important;
        }
      }

      @media (max-width: 380px) {
        html body.android-shell .login-screen {
          padding-inline: max(12px, env(safe-area-inset-left)) max(12px, env(safe-area-inset-right)) !important;
        }

        html body.android-shell .login-screen .login-card.auth-card {
          padding-inline: 18px !important;
        }

        html body.android-shell .login-screen .auth-inline-actions {
          grid-template-columns: minmax(0, 1fr) !important;
        }
      }

      #modalRoot,
      #modalRoot .modal-backdrop,
      #modalRoot .modal,
      #modalRoot .modal > * {
        box-sizing: border-box !important;
      }

      #modalRoot .modal-backdrop {
        overflow-x: hidden !important;
      }

      #modalRoot .modal {
        max-width: 100% !important;
        min-width: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
        background: linear-gradient(180deg, rgba(15, 20, 29, .99), rgba(8, 12, 19, .99)) !important;
        border: 1px solid rgba(137, 148, 170, .22) !important;
      }

      #modalRoot .modal > :not(.modal-head),
      #modalRoot .modal .panel-body,
      #modalRoot .modal form,
      #modalRoot .modal .table-shell,
      #modalRoot .modal .table-scroll {
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
      }

      #modalRoot .modal > .panel-body,
      #modalRoot .modal > form.panel-body {
        width: 100% !important;
        overflow-x: hidden !important;
        scrollbar-gutter: auto !important;
      }

      #modalRoot .modal-head {
        flex: 0 0 auto !important;
        width: 100% !important;
        min-width: 0 !important;
      }

      #modalRoot .modal-close-button {
        flex: 0 0 40px !important;
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 8px !important;
        border: 1px solid rgba(156, 166, 186, .24) !important;
        background: rgba(22, 28, 39, .92) !important;
        color: #eef2f8 !important;
        line-height: 1 !important;
      }

      #modalRoot .modal-close-button:hover {
        background: rgba(42, 49, 63, .96) !important;
        border-color: rgba(181, 190, 208, .38) !important;
      }

      #modalRoot .modal-close-button:active {
        transform: scale(.96) !important;
      }

      #modalRoot .modal-close-button:focus-visible {
        outline: 2px solid #8f7cff !important;
        outline-offset: 2px !important;
      }

      #modalRoot .modal-close-button svg {
        display: block !important;
        width: 20px !important;
        height: 20px !important;
        pointer-events: none !important;
      }

      .profile-public-id {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;
        gap: 10px !important;
      }

      .profile-public-id strong {
        min-width: 0 !important;
        overflow-wrap: anywhere !important;
      }

      .profile-public-id > span {
        grid-column: 1 / -1 !important;
      }

      .profile-public-id .btn {
        min-height: 38px !important;
        white-space: nowrap !important;
      }

      .contact-icon-button,
      .support-logo.telegram,
      .support-logo.whatsapp {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: rgba(13, 18, 27, .96) !important;
        border: 1px solid rgba(149, 160, 181, .28) !important;
        color: #dbe4f2 !important;
        font-size: 0 !important;
        background-image: none !important;
      }

      .contact-icon-button svg,
      .support-logo svg {
        width: 25px !important;
        height: 25px !important;
        display: block !important;
      }

      html body.android-shell .contact-icon-button.telegram,
      html body.android-shell .contact-icon-button.whatsapp,
      html body:not(.android-shell) .contact-icon-button.telegram,
      html body:not(.android-shell) .contact-icon-button.whatsapp,
      html body.android-shell .support-logo.telegram,
      html body.android-shell .support-logo.whatsapp,
      html body:not(.android-shell) .support-logo.telegram,
      html body:not(.android-shell) .support-logo.whatsapp {
        background: #0a0f17 none !important;
      }

      .simple-shift-overview {
        display: grid !important;
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
        gap: 7px !important;
      }

      .simple-shift-overview .stat {
        min-width: 0 !important;
        min-height: 64px !important;
        padding: 10px 12px !important;
        gap: 4px !important;
        background: #101316 !important;
        border: 1px solid rgba(255,255,255,.12) !important;
        border-radius: 8px !important;
      }

      .simple-shift-overview .stat span { min-width: 0 !important; color: #aeb3b8 !important; font-size: 11px !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
      .simple-shift-overview .stat strong {
        color: #f5f7fb !important;
        min-width: 0 !important;
        font-size: 15px !important;
        line-height: 1.15 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
      }
      .simple-shift-screen { gap: 10px !important; }
      .simple-shift-screen > .panel > .panel-body { padding: 12px !important; gap: 10px !important; }
      .simple-shift-actions { display: grid !important; grid-template-columns: repeat(5,minmax(0,1fr)) !important; gap: 7px !important; }
      .simple-shift-actions .btn { min-width: 0 !important; min-height: 38px !important; padding: 7px 9px !important; }

      .bank-sales-sheet .bank-sales-table {
        min-width: min(760px, 100%) !important;
      }

      .bank-sales-sheet .bank-sales-table td {
        padding: 7px 9px !important;
      }

      .bank-sales-sheet .bank-sales-table td:first-child {
        width: 44%;
        overflow: hidden;
        text-overflow: ellipsis;
      }

      .bank-sales-sheet .bank-sales-table td:last-child {
        width: 24%;
        font-variant-numeric: tabular-nums;
      }

      #modalRoot .report-template-modal .report-modal-footer {
        display: flex !important;
        justify-content: flex-end !important;
        align-items: center !important;
        min-height: 58px;
        padding: 10px 0 0 !important;
      }

      #modalRoot .report-template-modal .report-modal-footer .btn.primary {
        width: auto !important;
        min-width: 132px !important;
        margin: 0 !important;
        white-space: nowrap !important;
      }

      #modalRoot .modal:has(#shiftReportPrint) {
        width: min(1120px, calc(100vw - 28px)) !important;
        max-height: calc(100dvh - 28px) !important;
      }

      .shift-report-summary {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 10px;
      }

      .shift-report-summary .stat {
        min-width: 0;
        min-height: 76px;
        border: 1px solid rgba(156, 166, 186, .22) !important;
        border-radius: 10px !important;
        background: linear-gradient(180deg, #151c26, #0c121a) !important;
      }

      .shift-report-summary .stat span {
        color: #b8c2d0 !important;
      }

      .shift-report-summary .stat strong {
        color: #ffffff !important;
        font-variant-numeric: tabular-nums;
        overflow-wrap: anywhere;
      }

      #shiftReportPrint {
        width: min(100%, 860px);
        margin-inline: auto;
        border: 1px solid rgba(156, 166, 186, .24);
        border-radius: 10px;
        overflow: hidden;
        background: #ffffff !important;
        color: #000000 !important;
        box-shadow: 0 18px 46px rgba(0, 0, 0, .24);
      }

      #shiftReportPrint .report-section {
        margin-bottom: 20px;
      }

      #shiftReportPrint .report-table {
        table-layout: fixed;
        border-collapse: collapse;
        background: #ffffff !important;
        color: #000000 !important;
      }

      #shiftReportPrint .report-table td,
      #shiftReportPrint .report-table th {
        overflow-wrap: anywhere;
      }

      #shiftReportPrint .report-section-title {
        background: #000000 !important;
        color: #ffffff !important;
      }

      #shiftReportPrint .report-table thead,
      #shiftReportPrint .report-table tbody,
      #shiftReportPrint .report-table tr,
      #shiftReportPrint .report-table td {
        background: #ffffff !important;
        color: #000000 !important;
      }

      #shiftReportPrint .report-table th {
        background: #ffffff !important;
        color: #000000 !important;
      }

      #shiftReportPrint .report-section:nth-of-type(3) .report-table td:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }

      .shift-report-actions {
        display: flex;
        justify-content: flex-end;
        flex-wrap: wrap;
        gap: 8px;
        position: sticky;
        bottom: 0;
        z-index: 2;
        padding: 10px 0 0;
        background: linear-gradient(180deg, transparent, rgba(8, 13, 20, .96) 24%);
      }

      .shift-report-actions .btn {
        flex: 0 0 auto;
        min-width: 132px;
        white-space: nowrap;
      }

      #modalRoot .shift-report-actions .shift-report-close {
        width: auto !important;
        min-width: 112px !important;
        padding: 8px 12px !important;
        font-size: 14px !important;
      }

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

        #modalRoot .modal:has(#shiftReportPrint) {
          width: calc(100vw - 12px) !important;
          max-height: calc(100dvh - 12px) !important;
        }

        .shift-report-actions .btn {
          flex: 1 1 140px;
          min-width: 0;
        }
      }

      body.android-shell .mobile-nav-toggle {
        background: linear-gradient(145deg, #171a1f, #0b0d10) !important;
        border-color: rgba(255, 255, 255, .14) !important;
        box-shadow: 0 10px 26px rgba(0, 0, 0, .28) !important;
      }

      #modalRoot .modal {
        scrollbar-gutter: auto !important;
      }

      #modalRoot .modal > .panel-body,
      #modalRoot .modal > form.panel-body {
        overflow-y: auto !important;
        overflow-x: hidden !important;
        scrollbar-gutter: auto !important;
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
      }

      #modalRoot .modal > .panel-body::-webkit-scrollbar,
      #modalRoot .modal > form.panel-body::-webkit-scrollbar {
        width: 0 !important;
        height: 0 !important;
        display: none !important;
      }

      #modalRoot .modal {
        background: linear-gradient(180deg, #0f1217, #080a0e) !important;
        border-color: rgba(255, 255, 255, .12) !important;
      }

      #modalRoot .modal > .modal-head {
        background: linear-gradient(180deg, #181c22, #101318) !important;
        border-color: rgba(255, 255, 255, .11) !important;
      }

      #modalRoot .modal > .modal-head :is(h2, h3, h4, strong) {
        color: #f7f8fa !important;
      }

      #modalRoot .modal > .modal-head small,
      #modalRoot .modal > .panel-body :is(p, small, .muted) {
        color: #b8bec8 !important;
      }

      #modalRoot .modal > .modal-head .btn,
      #modalRoot .modal .report-template-section-actions .btn {
        background: #1a1e24 !important;
        border-color: rgba(255, 255, 255, .14) !important;
        color: #f2f4f7 !important;
        box-shadow: none !important;
      }

      @media (max-width: 680px) {
        .simple-shift-overview { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
        .simple-shift-overview .stat { min-height: 58px !important; padding: 8px 10px !important; }
        .simple-shift-overview .stat strong { font-size: 13px !important; }
        .simple-shift-actions { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
        .simple-shift-actions .btn:last-child { grid-column: 1 / -1; }
        .profile-public-id { grid-template-columns: minmax(0, 1fr) !important; }
        .profile-public-id .btn { width: 100% !important; }
      }

      .app-exit-button,
      body.windows-shell .app-exit-button {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        min-width: 72px !important;
        height: 34px !important;
        padding: 0 14px !important;
        border-radius: 9px !important;
        font-size: 12px !important;
        font-weight: 800 !important;
        line-height: 1 !important;
        letter-spacing: 0 !important;
        color: #eef1f5 !important;
        background: #171b21 !important;
        border-color: rgba(255, 255, 255, .14) !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
      }

      .app-exit-button:hover {
        color: #ffffff !important;
        background: #242a32 !important;
        border-color: rgba(255, 255, 255, .24) !important;
      }

      body.android-shell .app-exit-button {
        display: none !important;
      }

      .app-update-notice {
        position: fixed;
        z-index: 1700;
        right: 18px;
        bottom: 18px;
        display: grid;
        grid-template-columns: 38px minmax(0, 1fr) auto;
        align-items: center;
        gap: 11px;
        width: min(470px, calc(100vw - 36px));
        padding: 11px 12px;
        border: 1px solid rgba(255, 255, 255, .15);
        border-radius: 12px;
        background: rgba(13, 16, 21, .96);
        color: #f4f6f9;
        box-shadow: 0 18px 46px rgba(0, 0, 0, .46);
        backdrop-filter: blur(18px);
      }

      .app-update-notice-icon {
        display: grid;
        width: 38px;
        aspect-ratio: 1;
        place-items: center;
        border: 1px solid rgba(255, 255, 255, .14);
        border-radius: 10px;
        background: #1b2028;
        color: #f7f9fc;
        font-size: 20px;
        font-weight: 900;
      }

      .app-update-notice-copy {
        display: grid;
        min-width: 0;
        gap: 2px;
      }

      .app-update-notice-copy strong {
        color: #ffffff;
        font-size: 13px;
      }

      .app-update-notice-copy small {
        color: #b7c0cc;
        font-size: 10px;
        line-height: 1.35;
      }

      @media (max-width: 680px) {
        .app-update-notice {
          right: 10px;
          bottom: calc(84px + env(safe-area-inset-bottom));
          width: calc(100vw - 20px);
          grid-template-columns: 34px minmax(0, 1fr) auto;
        }
        .app-update-notice-icon { width: 34px; }
        .app-update-notice .btn { min-width: 74px !important; padding-inline: 10px !important; }
      }

      html body #view-receipts #receiptPrint,
      html body #view-receipts #receiptPrint * {
        color: #000000 !important;
        -webkit-text-fill-color: #000000 !important;
        opacity: 1 !important;
        text-shadow: none !important;
        filter: none !important;
      }

html body {
        --stage34-surface: #0b0d10;
        --stage34-surface-raised: #111419;
        --stage34-surface-soft: #171b21;
        --stage34-line: rgba(224, 230, 239, .15);
        --stage34-line-strong: rgba(224, 230, 239, .25);
        --stage34-text: #f4f6f8;
        --stage34-muted: #b8c0cb;
      }

      html body :where(.main, #tradeMain) {
        scrollbar-gutter: auto !important;
      }

      html body #tradeMain > .view:not(.hidden) {
        overflow: visible !important;
      }

      html body .topline {
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: none !important;
        margin-inline: 0 !important;
        border-color: var(--stage34-line) !important;
        background: rgba(7, 9, 12, .97) !important;
      }

      html body .topline-tools.actions-before-mode .actions { order: -1; }

      html body :where(.view > .panel, .view .settings-card, .view .section-card, .view .table-wrap, .view .shift-table-wrap, .view .report-card, .view .event-card, .view .notification-card) {
        border-color: var(--stage34-line) !important;
        background: linear-gradient(180deg, var(--stage34-surface-raised), var(--stage34-surface)) !important;
        color: var(--stage34-text) !important;
      }

      html body :where(.view .panel-head, .view .toolbar, .view .report-toolbar, .view .notification-head, .view .section-head) {
        border-color: var(--stage34-line) !important;
        background: #0c0f13 !important;
        color: var(--stage34-text) !important;
      }

      html body :where(.view .btn, .topline .btn, .device-settings-tabs button) {
        border-color: var(--stage34-line-strong) !important;
        background: #171b21 !important;
        color: #edf1f5 !important;
        box-shadow: none !important;
      }

      html body :where(.view .btn:hover, .topline .btn:hover, .device-settings-tabs button:hover, .device-settings-tabs button.active) {
        border-color: rgba(239, 243, 248, .35) !important;
        background: #242a32 !important;
        color: #ffffff !important;
      }

      html body :where(.view .btn.primary, .topline .btn.primary, .simple-pos-pay) {
        border-color: rgba(239, 243, 248, .3) !important;
        background: linear-gradient(180deg, #303640, #20252c) !important;
        color: #ffffff !important;
      }

      html body :where(.view input, .view select, .view textarea, .topline input, .topline select) {
        color-scheme: dark !important;
        border-color: var(--stage34-line-strong) !important;
        background: #090b0e !important;
        color: #f3f5f8 !important;
      }

      html body :where(.view input[type="date"], .view input[type="datetime-local"])::-webkit-calendar-picker-indicator {
        filter: invert(1) brightness(.85) !important;
        opacity: .9 !important;
      }

      html body :where(.view .muted, .view small, .view label, .view .panel-head p, .view .panel-head span) {
        color: var(--stage34-muted) !important;
      }

      html body :where(#view-dashboard, #view-pos, #view-stock, #view-clients, #view-documents, #view-delivery, #view-shifts, #view-reports) table {
        border-collapse: separate !important;
        border-spacing: 0 6px !important;
      }

      html body :where(#view-reports, #view-shifts) table thead th:first-child { border-radius: 9px 0 0 9px !important; }
      html body :where(#view-reports, #view-shifts) table thead th:last-child { border-radius: 0 9px 9px 0 !important; }
      html body #view-dashboard table thead th:first-child,
      html body #view-dashboard table thead th:last-child { border-radius: 0 !important; }
      html body #view-dashboard table tbody td:first-child { border-radius: 9px 0 0 9px !important; }
      html body #view-dashboard table tbody td:last-child { border-radius: 0 9px 9px 0 !important; }
      html body #view-dashboard table tbody td { background: #101318 !important; }

      .simple-pos-commandbar {
        grid-template-columns: minmax(0, 1fr) !important;
      }

      .simple-pos-commandbar .simple-pos-receipt-number {
        justify-self: end;
      }

      .simple-pos-clear-stack {
        display: grid;
        grid-template-rows: minmax(36px, 1fr) 34px;
        gap: 6px;
        min-width: 0;
      }

      .simple-pos-clear-stack > .btn { width: 100%; min-width: 0 !important; }
      .simple-pos-clear-stack .simple-pos-scan { min-height: 34px !important; }

      .remembered-login-list {
        display: grid;
        gap: 6px;
        margin: 2px 0 4px;
        max-height: 170px;
        overflow-y: auto;
      }

      .remembered-login-row {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 34px;
        gap: 6px;
        padding: 5px;
        border: 1px solid var(--stage34-line);
        border-radius: 10px;
        background: #0a0c0f;
      }

      .remembered-login-select {
        display: grid;
        grid-template-columns: 34px minmax(0, 1fr);
        align-items: center;
        gap: 8px;
        min-width: 0;
        padding: 0;
        border: 0;
        background: transparent;
        color: var(--stage34-text);
        text-align: left;
      }

      .remembered-login-select > span:last-child { display: grid; min-width: 0; }
      .remembered-login-select strong,
      .remembered-login-select small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
      .remembered-login-select small { color: var(--stage34-muted); }
      .remembered-login-avatar {
        display: grid;
        width: 34px;
        aspect-ratio: 1;
        place-items: center;
        border: 1px solid var(--stage34-line-strong);
        border-radius: 9px;
        background: #1b2027;
        color: #fff;
        font-weight: 800;
      }
      .remembered-login-delete {
        width: 34px;
        min-width: 34px;
        min-height: 34px;
        padding: 0;
        border: 1px solid var(--stage34-line);
        border-radius: 8px;
        background: #14181d;
        color: #cbd2dc;
      }

      .account-login-history-field { position: relative; display: block; }
      .account-login-history-field > input { width: 100%; }
      .account-login-suggestions {
        position: absolute;
        z-index: 30;
        top: calc(100% + 6px);
        left: 0;
        right: 0;
        max-height: 190px;
        margin: 0;
        padding: 6px;
        overflow-y: auto;
        border: 1px solid var(--stage34-line-strong);
        border-radius: 10px;
        background: #090b0e;
        box-shadow: 0 18px 42px rgba(0,0,0,.48);
      }
      .account-login-suggestions .remembered-login-row { margin: 0; }
      .account-login-suggestions .remembered-login-row + .remembered-login-row { margin-top: 5px; }
      .auth-login-remember {
        display: flex !important;
        flex-direction: row !important;
        grid-template-columns: none !important;
        align-items: center;
        gap: 9px !important;
        cursor: pointer;
      }
      html body #loginScreen .login-card label.auth-login-remember > input#firebaseRememberLogin[type="checkbox"] {
        width: 18px !important;
        min-width: 18px !important;
        max-width: 18px !important;
        height: 18px !important;
        min-height: 18px !important;
        max-height: 18px !important;
        flex: 0 0 18px !important;
        margin: 0;
        padding: 0 !important;
        accent-color: #9b9ea3 !important;
        box-shadow: none !important;
      }

      .device-settings-tabs {
        display: flex;
        gap: 8px;
        overflow-x: auto;
        padding: 3px;
        border: 1px solid var(--stage34-line);
        border-radius: 11px;
        background: #080a0d;
      }
      .device-settings-tabs button { min-height: 40px; flex: 1 0 150px; border-radius: 8px; }
      .device-settings-grid > [data-device-settings-panel] { grid-column: 1 / -1; }
      .diagnostics-list { gap: 8px !important; }
      .diagnostics-list > div {
        padding: 11px 12px !important;
        border: 1px solid var(--stage34-line) !important;
        border-radius: 9px !important;
        background: #0d1014 !important;
      }

      html body :where(.contact-icon-button.whatsapp, .support-logo.whatsapp) {
        background-color: #080a0d !important;
        background-image: none !important;
        background-repeat: no-repeat !important;
      }
      html body :where(.contact-icon-button.whatsapp, .support-logo.whatsapp) svg {
        width: 24px !important;
        height: 24px !important;
        transform: none !important;
      }
      html body :where(.contact-icon-button, .support-logo, .support-send-button)::before,
      html body :where(.contact-icon-button, .support-logo, .support-send-button)::after { display: none !important; }

      @media (orientation: landscape) and (min-width: 820px) and (max-width: 1400px) and (min-height: 500px) and (max-height: 1000px) {
        body.simple-trade-mode #view-pos:not(.hidden) > .trade-help-banner {
          display: none !important;
        }
        body.simple-trade-mode #view-pos:not(.hidden) {
          height: calc(100dvh - 102px) !important;
          min-height: 0 !important;
          overflow: hidden !important;
          padding-bottom: 8px !important;
        }
        body.simple-trade-mode .simple-pos-shell {
          height: 100% !important;
          grid-template-rows: minmax(185px, 1fr) auto !important;
          gap: 8px !important;
        }
        body.simple-trade-mode .simple-pos-workspace {
          min-height: 0 !important;
          overflow: hidden !important;
        }
        body.simple-trade-mode .simple-pos-commandbar { padding: 7px 8px !important; }
        body.simple-trade-mode .simple-pos-cart {
          min-height: 0 !important;
          overflow-y: auto !important;
          overscroll-behavior: contain;
        }
        body.simple-trade-mode .simple-pos-empty { min-height: 110px !important; }
        body.simple-trade-mode .simple-pos-checkout {
          grid-template-columns: minmax(180px, .52fr) minmax(270px, .85fr) minmax(300px, .78fr) !important;
          gap: 8px !important;
          padding: 8px !important;
        }
        body.simple-trade-mode .simple-pos-summary { padding: 9px !important; gap: 5px !important; }
        body.simple-trade-mode .simple-pos-summary > div:first-child strong { font-size: 27px !important; }
        body.simple-trade-mode .simple-pos-payment-fields { gap: 6px !important; }
        body.simple-trade-mode .simple-pos-details summary { padding: 6px 8px !important; }
        body.simple-trade-mode .simple-pos-actions {
          grid-column: auto !important;
          grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
          align-content: start !important;
          gap: 6px !important;
        }
        body.simple-trade-mode .simple-pos-actions .btn {
          min-height: 36px !important;
          padding: 6px 4px !important;
          font-size: 11px !important;
          line-height: 1.15 !important;
          overflow-wrap: normal !important;
        }
        body.simple-trade-mode .simple-pos-actions .simple-pos-pay { grid-column: span 3 !important; min-height: 42px !important; }
      }

      @media (max-width: 680px) {
        .topline-tools.actions-before-mode .actions { order: 0; }
        .simple-pos-clear-stack { grid-template-columns: minmax(0, 1fr) 42px; grid-template-rows: auto; }
      }

      html body.ui-busy-blocking::after {
        content: "";
        position: fixed;
        inset: 0;
        z-index: 79;
        background: rgba(3, 4, 6, .72);
        backdrop-filter: blur(4px);
        pointer-events: auto;
        cursor: progress;
      }

      html body .busy-indicator {
        z-index: 80 !important;
        max-width: min(360px, calc(100vw - 32px));
        min-height: 48px;
        padding: 10px 14px !important;
      }

      html body .toast {
        display: grid;
        grid-template-columns: 34px minmax(0, 1fr);
        align-items: center;
        gap: 10px;
      }

      html body .toast-brand-logo {
        width: 34px;
        height: 34px;
        display: block;
        object-fit: contain;
        border-radius: 8px;
      }
      html body .toast-message { min-width: 0; line-height: 1.35; overflow-wrap: anywhere; }

      html body .quick-sync-button.syncing .quick-action-icon svg {
        animation: srm-manual-sync-spin .8s linear infinite !important;
        transform-origin: 50% 50%;
      }

      @keyframes srm-manual-sync-spin { to { transform: rotate(360deg); } }

      html body #modalRoot .modal.product-picker-modal {
        width: min(1120px, calc(100vw - 40px)) !important;
        max-height: min(90dvh, 860px) !important;
      }

      html body #modalRoot .product-picker-modal > .panel-body {
        min-height: 0;
        overflow: hidden !important;
      }

      html body #modalRoot .product-picker-toolbar {
        display: grid !important;
        grid-template-columns: minmax(260px, 1fr) minmax(180px, .55fr) minmax(150px, .45fr) minmax(150px, .45fr) !important;
        gap: 8px !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
      }

      html body #modalRoot .product-picker-modal .product-picker {
        max-height: min(68dvh, 620px) !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
      }

      html body #modalRoot .product-picker-modal .product-pick-row {
        grid-template-columns: 64px minmax(220px, 1fr) minmax(110px, .35fr) minmax(150px, .45fr) 104px !important;
        gap: 12px !important;
        min-width: 0 !important;
        border-radius: 8px !important;
      }

      html body #modalRoot .product-picker-modal .product-pick-row:hover {
        transform: none !important;
      }

      html body #modalRoot .product-picker-modal .product-thumb {
        width: 64px !important;
        height: 64px !important;
        border-radius: 8px !important;
        font-size: 11px !important;
      }

      html body #modalRoot .product-picker-modal :is(.product-pick-info, .product-pick-price, .product-pick-stock) {
        min-width: 0;
        display: grid;
        gap: 4px;
      }
      html body #modalRoot .product-picker-modal .product-pick-info strong { font-size: 14px; line-height: 1.3; }
      html body #modalRoot .product-picker-modal .product-pick-info > span,
      html body #modalRoot .product-picker-modal :is(.product-pick-price, .product-pick-stock) small,
      html body #modalRoot .product-picker-modal .product-pick-stock > span:not(.tag) {
        color: #aeb6c1 !important;
        font-size: 11px !important;
        line-height: 1.3;
        overflow: hidden;
        text-overflow: ellipsis;
      }
      html body #modalRoot .product-picker-modal .product-pick-price strong { color: #ffffff !important; white-space: nowrap; }
      html body #modalRoot .product-picker-modal .tag {
        border-color: rgba(224, 230, 239, .18) !important;
        background: #20242a !important;
        color: #f2f4f7 !important;
      }
      html body #modalRoot .product-picker-modal .product-pick-row > .btn {
        width: 100%;
        min-width: 0 !important;
        border-color: rgba(224, 230, 239, .24) !important;
        background: #252a31 !important;
        color: #ffffff !important;
        box-shadow: none !important;
      }
      html body #modalRoot .product-picker-modal .product-pick-row > .btn:hover { background: #313740 !important; }

      @media (max-width: 720px) {
        html body #modalRoot .modal.product-picker-modal {
          width: calc(100vw - 16px) !important;
          max-height: calc(100dvh - 18px) !important;
        }
        html body #modalRoot .product-picker-toolbar {
          grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        }
        html body #modalRoot .product-picker-toolbar #pickerSearch { grid-column: 1 / -1; }
        html body #modalRoot .product-picker-toolbar #pickerStock { grid-column: 1 / -1; }
        html body #modalRoot .product-picker-modal .product-picker { max-height: calc(100dvh - 250px) !important; }
        html body #modalRoot .product-picker-modal .product-pick-row {
          grid-template-columns: 48px minmax(0, 1fr) auto !important;
          gap: 9px !important;
          padding: 8px !important;
        }
        html body #modalRoot .product-picker-modal .product-thumb { width: 48px !important; height: 48px !important; }
        html body #modalRoot .product-picker-modal .product-pick-price {
          justify-items: end;
          align-self: start;
        }
        html body #modalRoot .product-picker-modal .product-pick-stock {
          grid-column: 2 / 3;
          display: flex;
          align-items: center;
          flex-wrap: wrap;
          gap: 6px;
        }
        html body #modalRoot .product-picker-modal .product-pick-stock small { display: none; }
        html body #modalRoot .product-picker-modal .product-pick-row > .btn { grid-column: 3; min-height: 38px !important; }
      }

      /* Approved stock, receiving, services, categories and shifts workspaces. */
      #view-stock,
      #view-shifts { color: #f4f5f7; }
      #view-stock :is(.stock-workspace-head, .shift-workspace-head),
      #view-shifts .shift-workspace-head {
        display: flex;
        align-items: end;
        justify-content: space-between;
        gap: 16px;
        margin-bottom: 12px;
      }
      #view-stock .stock-workspace-head h3,
      #view-shifts .shift-workspace-head h3 { margin: 0 0 4px; font-size: 24px; letter-spacing: 0; }
      #view-stock .stock-workspace-head p,
      #view-shifts .shift-workspace-head p { margin: 0; color: #a9afb8; }
      #view-stock :is(.stock-warehouse-control, .shift-workspace-head label),
      #view-shifts .shift-workspace-head label { display: grid; gap: 5px; min-width: 260px; color: #a9afb8; font-size: 11px; }
      #view-stock .stock-mode-tabs {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        width: min(520px, 100%);
        padding: 3px;
        margin: 0 0 14px;
        border: 1px solid #2d3239;
        border-radius: 8px;
        background: #111317;
      }
      #view-stock .stock-mode-tabs button { min-height: 36px; border: 0; border-radius: 6px; background: transparent; color: #b9bec6; }
      #view-stock .stock-mode-tabs button.active { background: #25292f; color: #fff; box-shadow: inset 0 0 0 1px #4c525b; }
      #view-stock .stock-kpi-grid,
      #view-shifts .shift-kpi-grid {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 8px;
        margin-bottom: 10px;
      }
      #view-shifts .shift-kpi-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
      #view-stock .stock-kpi-grid article,
      #view-shifts .shift-kpi-grid article {
        min-width: 0;
        padding: 14px 16px;
        border: 1px solid #2c3138;
        border-radius: 8px;
        background: linear-gradient(145deg, #171a1f, #121418);
      }
      #view-stock .stock-kpi-grid span,
      #view-shifts .shift-kpi-grid span { display: block; margin-bottom: 7px; color: #aeb4bd; font-size: 12px; }
      #view-stock .stock-kpi-grid strong,
      #view-shifts .shift-kpi-grid strong { display: block; color: #fff; font-size: 22px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
      #view-stock .stock-workspace-grid {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(300px, 330px);
        min-height: 520px;
        border: 1px solid #2c3138;
        border-radius: 8px;
        overflow: hidden;
        background: #111317;
      }
      #view-stock .stock-master-panel { min-width: 0; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; border-right: 1px solid #2c3138; }
      #view-stock .stock-filter-row { display: grid; grid-template-columns: minmax(240px, 1fr) minmax(150px, .4fr) minmax(150px, .4fr); gap: 8px; padding: 10px; border-bottom: 1px solid #2c3138; }
      #view-stock .stock-filter-row:has(.icon-btn) { grid-template-columns: minmax(240px, 1fr) minmax(170px, .45fr) 42px; }
      #view-stock .stock-search-field { position: relative; min-width: 0; }
      #view-stock .stock-search-field > span { position: absolute; left: 13px; top: 50%; z-index: 1; transform: translateY(-50%); color: #9ca3ad; font-size: 20px; }
      #view-stock .stock-search-field input { width: 100%; padding-left: 38px; }
      #view-stock :is(input, select, textarea) { border-color: #353a42 !important; background: #0d0f12 !important; color: #f4f5f7 !important; }
      #view-stock .stock-table-wrap { min-width: 0; overflow: auto; scrollbar-width: none; }
      #view-stock .stock-table-wrap::-webkit-scrollbar { display: none; }
      #view-stock table { width: 100%; border-collapse: collapse; }
      #view-stock .stock-workspace-table { min-width: 920px; }
      #view-stock .stock-services-table { min-width: 850px; }
      #view-stock .stock-categories-table { min-width: 620px; }
      #view-stock .acceptance-workspace-table { min-width: 760px; }
      #view-stock :is(.stock-workspace-table, .stock-services-table, .stock-categories-table, .acceptance-workspace-table) {
        table-layout: auto !important;
      }
      #view-stock .stock-workspace-table th:first-child,
      #view-stock .stock-workspace-table td:first-child { min-width: 205px; }
      #view-stock .stock-workspace-table th:nth-child(2),
      #view-stock .stock-workspace-table td:nth-child(2) { min-width: 88px; }
      #view-stock th { position: sticky; top: 0; z-index: 1; padding: 10px 12px; background: #15181c; color: #aeb4bd; font-size: 11px; font-weight: 600; text-align: left; white-space: nowrap; }
      #view-stock td { padding: 10px 12px; border-top: 1px solid #292e35; color: #dadde2; font-size: 12px; vertical-align: middle; }
      #view-stock tbody tr { cursor: pointer; transition: background-color .14s ease, box-shadow .14s ease; }
      #view-stock tbody tr:hover { background: #1a1e23; }
      #view-stock tbody tr.selected { background: #20242a; box-shadow: inset 2px 0 #e4e7eb; }
      #view-stock td small { display: block; margin-top: 3px; color: #8f97a2; }
      #view-stock .stock-product-cell { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; gap: 10px; }
      #view-stock .stock-product-cell > span { min-width: 0; }
      #view-stock .stock-product-cell strong,
      #view-stock .stock-product-cell small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
      #view-stock .stock-product-cell .product-thumb,
      #view-stock .stock-inspector-title .product-thumb,
      #view-stock .category-popular .product-thumb,
      #view-stock .acceptance-line-preview .product-thumb { width: 42px; height: 42px; border-radius: 7px; }
      #view-stock .stock-dot-status { display: inline-flex; align-items: center; gap: 7px; color: #d9dce1; white-space: nowrap; }
      #view-stock .stock-dot-status::before { content: ""; width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: #7d858f; }
      #view-stock .stock-dot-status.ok::before { background: #6fbd78; }
      #view-stock .stock-dot-status.warn::before { background: #d29a45; }
      #view-stock .stock-dot-status.bad::before { background: #d9635d; }
      #view-stock .stock-list-footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 12px; border-top: 1px solid #2c3138; color: #aeb4bd; }
      #view-stock .stock-inspector { min-width: 0; padding: 16px; overflow: auto; scrollbar-width: none; background: linear-gradient(155deg, #181b20, #121418 72%); }
      #view-stock .stock-inspector::-webkit-scrollbar { display: none; }
      #view-stock .stock-inspector-title { display: grid; grid-template-columns: 70px minmax(0, 1fr); align-items: center; gap: 14px; padding-bottom: 14px; border-bottom: 1px solid #2d3239; }
      #view-stock .stock-inspector-title .product-thumb { width: 70px; height: 70px; }
      #view-stock .stock-inspector h3 { margin: 0 0 5px; font-size: 18px; }
      #view-stock .stock-inspector p { margin: 0; color: #a8afb8; line-height: 1.45; }
      #view-stock .stock-barcode { display: grid; justify-items: center; gap: 5px; padding: 14px 0; border-bottom: 1px solid #2d3239; color: #a8afb8; }
      #view-stock .stock-barcode div { width: 100%; height: 42px; background: repeating-linear-gradient(90deg, #eef0f2 0 2px, transparent 2px 4px, #eef0f2 4px 5px, transparent 5px 8px); opacity: .9; }
      #view-stock .stock-detail-list { display: grid; gap: 0; margin: 10px 0; }
      #view-stock .stock-detail-list > div { display: flex; justify-content: space-between; gap: 16px; padding: 8px 0; border-bottom: 1px solid #282d33; }
      #view-stock .stock-detail-list dt { color: #a8afb8; }
      #view-stock .stock-detail-list dd { margin: 0; color: #fff; text-align: right; }
      #view-stock .stock-movement-preview { margin-top: 16px; }
      #view-stock .stock-movement-preview h4,
      #view-stock .service-description h4,
      #view-stock .category-popular h4,
      #view-stock .stock-inspector h4 { margin: 0 0 9px; }
      #view-stock .stock-movement-preview > div { display: grid; grid-template-columns: 92px minmax(0, 1fr) auto; gap: 8px; padding: 7px 0; border-bottom: 1px solid #282d33; font-size: 11px; }
      #view-stock .stock-movement-preview .positive { color: #83c78b; }
      #view-stock .stock-movement-preview .negative { color: #e07670; }
      #view-stock .stock-inspector-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 16px; }
      #view-stock .stock-inspector-actions.vertical { grid-template-columns: 1fr; }
      #view-stock .service-description { padding: 10px 0 14px; border-bottom: 1px solid #2d3239; }
      #view-stock .category-popular > div,
      #view-stock .acceptance-line-preview > div { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 9px; padding: 8px 0; border-bottom: 1px solid #282d33; }
      #view-stock .category-popular small,
      #view-stock .acceptance-line-preview small { display: block; color: #8f97a2; }
      #view-stock .acceptance-inspector header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-bottom: 13px; border-bottom: 1px solid #2d3239; }
      #view-stock .acceptance-context { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 12px 0; }
      #view-stock .acceptance-context > div { padding: 10px; border: 1px solid #30353d; border-radius: 7px; }
      #view-stock .acceptance-context span { display: block; margin-bottom: 5px; color: #9da4ad; font-size: 10px; }
      #view-stock .acceptance-progress { display: flex; justify-content: space-between; gap: 10px; padding: 9px 0 13px; color: #c7cbd1; }
      #view-stock .acceptance-info-note,
      #view-shifts .shift-summary-note { margin-top: 12px; padding: 10px 12px; border: 1px solid #343941; border-radius: 7px; background: #1b1e23; color: #b8bec6; font-size: 11px; line-height: 1.45; }
      #view-stock .stock-line-placeholder { display: grid; width: 40px; height: 40px; place-items: center; border: 1px solid #343941; border-radius: 7px; }
      #view-shifts .shift-status-card { display: grid; grid-template-columns: minmax(190px, .7fr) minmax(360px, 1.1fr) auto; align-items: center; gap: 18px; padding: 14px 16px; margin-bottom: 10px; border: 1px solid #2d3239; border-radius: 8px; background: linear-gradient(145deg, #181b20, #121418); }
      #view-shifts .shift-status-main { display: flex; align-items: center; gap: 10px; }
      #view-shifts .shift-status-dot { width: 9px; height: 9px; border-radius: 50%; background: #767e88; }
      #view-shifts .shift-status-card.open .shift-status-dot { background: #6fbd78; box-shadow: 0 0 0 5px rgba(111,189,120,.1); }
      #view-shifts .shift-status-main strong,
      #view-shifts .shift-status-main small { display: block; }
      #view-shifts .shift-status-main small { margin-top: 4px; color: #9ea5af; }
      #view-shifts .shift-status-card dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0; }
      #view-shifts .shift-status-card dt { color: #9ea5af; font-size: 11px; }
      #view-shifts .shift-status-card dd { margin: 5px 0 0; color: #fff; }
      #view-shifts .shift-status-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: end; }
      #view-shifts .shift-workspace-grid { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 10px; }
      #view-shifts .shift-left-column { min-width: 0; display: grid; gap: 10px; }
      #view-shifts :is(.shift-operations-panel, .shift-history-panel, .shift-summary-panel) { min-width: 0; border: 1px solid #2d3239; border-radius: 8px; background: linear-gradient(145deg, #171a1f, #111317); overflow: hidden; }
      #view-shifts :is(.shift-operations-panel, .shift-history-panel) > header { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 14px; border-bottom: 1px solid #2d3239; }
      #view-shifts :is(.shift-operations-panel, .shift-history-panel) h3 { margin: 0; font-size: 15px; }
      #view-shifts .shift-operations-panel header input { width: min(280px, 42%); }
      #view-shifts .shift-operations-table,
      #view-shifts .shift-table-wrap { min-width: 0; overflow: auto; scrollbar-width: none; }
      #view-shifts .shift-operations-table::-webkit-scrollbar,
      #view-shifts .shift-table-wrap::-webkit-scrollbar { display: none; }
      #view-shifts table { width: 100%; border-collapse: collapse; }
      #view-shifts .shift-operations-table table { min-width: 720px; }
      #view-shifts th { padding: 9px 12px; background: #15181c; color: #9ea5af; font-size: 10px; text-align: left; white-space: nowrap; }
      #view-shifts td { padding: 9px 12px; border-top: 1px solid #292e35; color: #dadde2; font-size: 11px; white-space: nowrap; }
      #view-shifts tbody tr:hover { background: #1d2126; }
      #view-shifts .shift-history-filters { display: flex; gap: 7px; }
      #view-shifts .shift-history-filters input { width: 135px; }
      #view-shifts .shift-summary-panel { padding: 14px; }
      #view-shifts .shift-summary-panel h3 { margin: 0 0 10px; }
      #view-shifts .shift-summary-panel h4 { margin: 18px 0 8px; }
      #view-shifts .shift-summary-panel dl { margin: 0; }
      #view-shifts .shift-summary-panel dl > div { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px solid #292e35; }
      #view-shifts .shift-summary-panel dt { color: #a6adb6; }
      #view-shifts .shift-summary-panel dd { margin: 0; color: #fff; font-weight: 600; }
      #view-shifts .shift-summary-panel .emphasis { margin: 7px 0; padding: 10px 0; }
      #view-shifts .shift-summary-panel .emphasis dd { color: #7fc389; font-size: 18px; }
      #view-shifts .shift-summary-panel label { display: grid; gap: 6px; margin-top: 14px; color: #a6adb6; font-size: 11px; }
      #view-shifts .shift-summary-panel textarea { min-height: 70px; resize: vertical; }
      #view-shifts .shift-summary-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }

      @media (max-width: 1500px) {
        #view-stock .stock-workspace-grid { grid-template-columns: minmax(0, 1fr); }
        #view-stock .stock-master-panel { border-right: 0; border-bottom: 1px solid #2c3138; }
        #view-stock .stock-inspector { max-height: 520px; }
      }
      @media (max-width: 1180px) {
        #view-shifts .shift-workspace-grid { grid-template-columns: minmax(0, 1fr); }
        #view-shifts .shift-status-card { grid-template-columns: minmax(170px, .7fr) minmax(300px, 1fr); }
        #view-shifts .shift-status-actions { grid-column: 1 / -1; justify-content: start; }
      }
      @media (max-width: 760px) {
        #view-stock :is(.stock-workspace-head, .stock-workspace-head),
        #view-shifts .shift-workspace-head { align-items: stretch; flex-direction: column; }
        #view-stock .stock-warehouse-control,
        #view-shifts .shift-workspace-head label { min-width: 0; }
        #view-stock .stock-mode-tabs { width: 100%; }
        #view-stock .stock-kpi-grid,
        #view-shifts .shift-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        #view-shifts .shift-kpi-grid article:last-child { grid-column: 1 / -1; }
        #view-stock .stock-kpi-grid article,
        #view-shifts .shift-kpi-grid article { padding: 11px 12px; }
        #view-stock .stock-kpi-grid strong,
        #view-shifts .shift-kpi-grid strong { font-size: 18px; }
        #view-stock .stock-workspace-grid { min-height: 0; }
        #view-stock .stock-filter-row,
        #view-stock .stock-filter-row:has(.icon-btn) { grid-template-columns: minmax(0, 1fr) 42px; }
        #view-stock .stock-filter-row .stock-search-field { grid-column: 1 / -1; }
        #view-stock .stock-filter-row select:last-of-type { grid-column: 1 / -1; }
        #view-stock .stock-table-wrap { max-height: 48dvh; }
        #view-stock .stock-workspace-table,
        #view-stock .stock-services-table,
        #view-stock .stock-categories-table,
        #view-stock .acceptance-workspace-table { min-width: 820px; }
        #view-stock .stock-inspector { max-height: none; }
        #view-stock .stock-inspector-actions { grid-template-columns: 1fr; }
        #view-shifts .shift-status-card { grid-template-columns: 1fr; }
        #view-shifts .shift-status-card dl { grid-template-columns: 1fr 1fr; }
        #view-shifts .shift-status-actions { grid-column: auto; display: grid; grid-template-columns: 1fr 1fr; }
        #view-shifts .shift-operations-table,
        #view-shifts .shift-table-wrap { max-height: 45dvh; }
        #view-shifts table { min-width: 780px; }
        #view-shifts :is(.shift-operations-panel, .shift-history-panel) > header { align-items: stretch; flex-direction: column; }
        #view-shifts .shift-operations-panel header input { width: 100%; }
        #view-shifts .shift-history-filters { width: 100%; }
        #view-shifts .shift-history-filters input { min-width: 0; width: 100%; }
      }

      @media (min-width: 900px) and (max-height: 950px) {
        html body:not(.android-shell) #view-pos:not(.hidden) { padding-bottom: 24px !important; }
        html body:not(.android-shell) #view-pos > .two-col {
          min-height: 0 !important;
          align-items: start !important;
        }
        html body:not(.android-shell) #view-pos .pos-payment-panel .panel-body {
          gap: 5px !important;
          padding: 8px !important;
        }
        html body:not(.android-shell) #view-pos .pos-payment-panel .panel-head { padding-block: 8px !important; }
        html body:not(.android-shell) #view-pos .payment-counterparty-card { padding: 8px 10px !important; }
        html body:not(.android-shell) #view-pos .pos-loyalty-card { padding: 7px !important; gap: 5px !important; }
        html body:not(.android-shell) #view-pos .total-box { padding: 8px 10px !important; gap: 4px !important; }
        html body:not(.android-shell) #view-pos .total-line.big { padding-top: 4px !important; }
        html body:not(.android-shell) #view-pos .total-line.big :is(span, strong) { font-size: 18px !important; }
        html body:not(.android-shell) #view-pos :is(input, select) { min-height: 34px !important; padding-block: 5px !important; }
        html body:not(.android-shell) #view-pos #completeSaleBtn { min-height: 42px !important; }
      }

html body #view-pos .cart-list {
        background: #07090c !important;
        border-color: rgba(183, 190, 202, .16) !important;
      }
      html body #view-pos .simple-pos-cart-columns {
        grid-template-columns: minmax(170px, 1fr) 66px minmax(88px, auto) 112px !important;
        gap: 8px !important;
        padding-inline: 18px !important;
        color: #838c99 !important;
      }
      html body #view-pos .cart-item,
      html body #view-pos .simple-pos-cart .cart-item {
        min-width: 0 !important;
        min-height: 58px !important;
        display: grid !important;
        grid-template-columns: minmax(170px, 1fr) 66px minmax(88px, auto) 112px !important;
        align-items: center !important;
        gap: 8px !important;
        padding: 8px 10px !important;
        border: 1px solid rgba(183, 190, 202, .15) !important;
        border-radius: 7px !important;
        background: #0d1014 !important;
        color: #f2f4f7 !important;
        box-shadow: none !important;
      }
      html body #view-pos .cart-item:hover { border-color: rgba(210, 216, 225, .26) !important; background: #11151a !important; }
      html body #view-pos .cart-item.stock-warning { border-color: rgba(229, 112, 112, .38) !important; background: #171013 !important; }
      html body #view-pos .cart-item-product { min-width: 0; display: grid; gap: 3px; }
      html body #view-pos .cart-item-product > strong {
        min-width: 0;
        display: block;
        overflow: hidden;
        color: #f5f7fa !important;
        font-size: 13px !important;
        line-height: 1.2;
        text-overflow: ellipsis;
        white-space: nowrap !important;
      }
      html body #view-pos .cart-item-product > span {
        min-width: 0;
        display: block;
        overflow: hidden;
        color: #9ba4b1 !important;
        font-size: 10.5px !important;
        line-height: 1.2;
        text-overflow: ellipsis;
        white-space: nowrap !important;
      }
      html body #view-pos .cart-item-product .tag { display: inline-flex; margin-left: 5px; vertical-align: 1px; }
      html body #view-pos .cart-item-qty { min-width: 0; display: grid; gap: 3px; color: #8f98a5 !important; font-size: 9px !important; }
      html body #view-pos .cart-item-qty > span { color: #8f98a5 !important; font-size: 9px !important; line-height: 1; white-space: nowrap !important; }
      html body #view-pos .cart-item-qty input {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 32px !important;
        padding: 4px 5px !important;
        border-color: rgba(183, 190, 202, .2) !important;
        border-radius: 6px !important;
        background: #07090c !important;
        color: #f5f7fa !important;
        text-align: center !important;
        font-weight: 800 !important;
      }
      html body #view-pos .cart-item-total {
        min-width: 0;
        overflow: hidden;
        color: #f7f8fa !important;
        font-size: 13px !important;
        font-variant-numeric: tabular-nums;
        text-align: right;
        text-overflow: ellipsis;
        white-space: nowrap !important;
      }
      html body #view-pos .cart-item-actions {
        min-width: 0;
        display: grid;
        grid-template-columns: minmax(68px, 1fr) 34px;
        align-items: center;
        gap: 5px;
      }
      html body #view-pos .cart-discount-button {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 34px !important;
        padding: 5px 8px !important;
        border-color: rgba(183, 190, 202, .18) !important;
        border-radius: 6px !important;
        background: #15191f !important;
        color: #e3e7ec !important;
        font-size: 10.5px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
      }
      html body #view-pos .cart-remove-button {
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
        display: grid !important;
        place-items: center !important;
        padding: 0 !important;
        border: 1px solid rgba(226, 125, 125, .24) !important;
        border-radius: 6px !important;
        background: #171114 !important;
        color: #e9b1b7 !important;
        cursor: pointer;
      }
      html body #view-pos .cart-remove-button:hover { border-color: rgba(236, 139, 139, .46) !important; background: #211417 !important; color: #ffffff !important; }
      html body #view-pos .cart-remove-button > span { color: inherit !important; font-size: 20px !important; font-weight: 400 !important; line-height: 1 !important; transform: translateY(-1px); }
      html body #view-pos .cart-item-options {
        grid-column: 1 / -1;
        min-width: 0;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
        gap: 6px;
        padding-top: 6px;
        border-top: 1px solid rgba(183, 190, 202, .11);
      }
      html body #view-pos .cart-item-options :is(input, select) { width: 100% !important; min-width: 0 !important; min-height: 32px !important; }
      html body #view-pos .cart-item > .tag.red { grid-column: 1 / -1; justify-self: start; white-space: nowrap !important; }
      @media (max-width: 680px) {
        html body #view-pos .cart-item,
        html body #view-pos .simple-pos-cart .cart-item {
          grid-template-columns: 60px minmax(76px, 1fr) 108px !important;
          gap: 6px !important;
          min-height: 78px !important;
          padding: 7px 8px !important;
        }
        html body #view-pos .cart-item-product { grid-column: 1 / -1; }
        html body #view-pos .cart-item-qty { grid-column: 1; }
        html body #view-pos .cart-item-total { grid-column: 2; }
        html body #view-pos .cart-item-actions { grid-column: 3; }
        html body #view-pos .cart-item-options,
        html body #view-pos .cart-item > .tag.red { grid-column: 1 / -1; }
      }
      html[lang="kk"] body.windows-shell .sidebar-actions-row {
        grid-template-columns: minmax(0, 1fr) !important;
      }
      html[lang="kk"] body.windows-shell .sidebar-actions-row :is(.quick-support-button, .quick-sync-button) {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        min-width: 0 !important;
        justify-content: flex-start !important;
        padding-inline: 10px !important;
      }
      html[lang="kk"] body.windows-shell #nav button > span:nth-child(2) {
        overflow: visible !important;
        text-overflow: clip !important;
        white-space: normal !important;
        line-height: 1.15 !important;
      }
      html[lang="kk"] body.windows-shell #nav button {
        min-height: 46px !important;
      }

      /* Stage 34: operational delivery and customer workspaces. */
      .kassa-workspace {
        display: grid;
        gap: 12px;
        min-width: 0;
        color: #f4f5f7;
      }
      .kassa-workspace-head,
      .kassa-workspace-toolbar,
      .kassa-workspace-metric,
      .kassa-workspace-table,
      .kassa-workspace-inspector,
      .kassa-editor-section,
      .kassa-editor-summary {
        border: 1px solid rgba(255,255,255,.13);
        background: rgba(20,22,25,.92);
        box-shadow: 0 16px 38px rgba(0,0,0,.16);
      }
      .kassa-workspace-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 16px;
        padding: 16px;
        border-radius: 8px;
      }
      .kassa-workspace-head h2 { margin: 0; font-size: 24px; line-height: 1.1; }
      .kassa-workspace-head p { margin: 5px 0 0; color: #a8adb5; }
      .kassa-workspace-head-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
      .kassa-workspace-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
      .kassa-workspace-metric { min-width: 0; padding: 14px 16px; border-radius: 8px; }
      .kassa-workspace-metric span { display: block; color: #aeb3bb; font-size: 12px; }
      .kassa-workspace-metric strong { display: block; margin-top: 7px; font-size: 24px; line-height: 1; color: #f7f7f8; }
      .kassa-workspace-metric small { display: block; min-height: 16px; margin-top: 6px; color: #868c95; }
      .kassa-workspace-toolbar {
        display: grid;
        grid-template-columns: minmax(220px,1fr) minmax(145px,.35fr) minmax(145px,.35fr) auto;
        gap: 8px;
        padding: 9px;
        border-radius: 8px;
      }
      .kassa-workspace-toolbar input,
      .kassa-workspace-toolbar select { min-width: 0; width: 100%; }
      .kassa-workspace-search { position: relative; display: block; min-width: 0; }
      .kassa-workspace-search > span { position: absolute; left: 12px; top: 50%; z-index: 1; color: #9298a1; transform: translateY(-50%); pointer-events: none; }
      .kassa-workspace-search input { padding-left: 34px; }
      .kassa-workspace-body { display: grid; grid-template-columns: minmax(0,1fr) minmax(300px,32%); gap: 10px; min-width: 0; align-items: stretch; }
      .kassa-workspace-table { min-width: 0; overflow: hidden; border-radius: 8px; }
      .kassa-workspace-table-scroll { overflow: auto; scrollbar-width: none; }
      .kassa-workspace-table-scroll::-webkit-scrollbar { width: 0; height: 0; }
      .kassa-workspace-table table { width: 100%; margin: 0; table-layout: fixed; border-collapse: collapse; }
      .kassa-workspace-table th { height: 42px; padding: 9px 12px; color: #9298a1; font-size: 11px; font-weight: 700; text-align: left; background: #16181b; border-bottom: 1px solid rgba(255,255,255,.12); }
      .kassa-workspace-table td { height: 52px; padding: 9px 12px; color: #d9dce1; vertical-align: middle; border-bottom: 1px solid rgba(255,255,255,.08); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
      .kassa-workspace-row { cursor: pointer; transition: background-color .16s ease, box-shadow .16s ease; }
      .kassa-workspace-row:hover td { background: rgba(255,255,255,.035); }
      .kassa-workspace-row.active td { background: rgba(255,255,255,.065); box-shadow: inset 0 1px rgba(255,255,255,.18), inset 0 -1px rgba(255,255,255,.18); }
      .kassa-workspace-row.active td:first-child { box-shadow: inset 1px 0 rgba(255,255,255,.5), inset 0 1px rgba(255,255,255,.18), inset 0 -1px rgba(255,255,255,.18); }
      .kassa-workspace-table tbody tr[data-action] { cursor: pointer; transition: background-color .16s ease; }
      .kassa-workspace-table tbody tr[data-action]:hover td { background: rgba(255,255,255,.035); }
      .kassa-workspace-table tbody tr.is-active td { background: rgba(255,255,255,.065); }
      .kassa-workspace-table-footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; padding: 8px 12px; color: #9ca2ab; }
      .kassa-client-inspector-host { display: grid; min-width: 0; }
      .kassa-client-inspector-host > .kassa-workspace-inspector { height: 100%; }
      .kassa-workspace-inspector { min-width: 0; padding: 16px; border-radius: 8px; overflow: hidden; }
      .kassa-workspace-inspector-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding-bottom: 14px; border-bottom: 1px solid rgba(255,255,255,.1); }
      .kassa-workspace-inspector-section { padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.09); }
      .kassa-workspace-inspector-section h4 { margin: 0 0 9px; }
      .kassa-workspace-inspector-list { display: grid; gap: 8px; }
      .kassa-workspace-inspector-list > div { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
      .kassa-workspace-inspector-list span { min-width: 0; color: #aeb3bb; overflow-wrap: anywhere; }
      .kassa-workspace-inspector-list strong { min-width: 0; text-align: right; overflow-wrap: anywhere; }
      .kassa-workspace-inspector-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.09); }
      .kassa-workspace-inspector-grid > div { min-width: 0; padding: 10px; border: 1px solid rgba(255,255,255,.1); border-radius: 7px; background: rgba(7,8,10,.28); }
      .kassa-workspace-inspector-grid span { display: block; color: #9299a3; font-size: 11px; }
      .kassa-workspace-inspector-grid strong { display: block; margin-top: 4px; overflow-wrap: anywhere; }
      .kassa-workspace-inspector-footer { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding-top: 14px; }
      .kassa-client-person { display: flex; align-items: center; gap: 11px; min-width: 0; }
      .kassa-client-person .kassa-client-avatar { width: 44px; height: 44px; margin: 0; font-size: 15px; flex: 0 0 auto; }
      .kassa-client-person h3 { margin: 0 0 5px; overflow-wrap: anywhere; }
      .kassa-client-table-name { display: flex; align-items: center; gap: 8px; min-width: 0; }
      .kassa-client-table-name i { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; color: #dfe1e4; background: #292c30; font-size: 10px; font-style: normal; flex: 0 0 auto; }
      .kassa-client-table-name strong { overflow: hidden; text-overflow: ellipsis; }
      .kassa-loyalty-card { display: grid; gap: 10px; padding: 13px; border: 1px solid rgba(255,255,255,.14); border-radius: 8px; background: linear-gradient(145deg,#292c30,#17191c); }
      .kassa-loyalty-card > div { display: flex; justify-content: space-between; gap: 10px; }
      .kassa-loyalty-card code { padding: 9px; border-radius: 5px; color: #f2f3f4; background: #0d0f11; text-align: center; letter-spacing: .08em; }
      .kassa-loyalty-card small { color: #a8adb5; }
      .kassa-inspector-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding-bottom: 14px; border-bottom: 1px solid rgba(255,255,255,.1); }
      .kassa-inspector-head h3 { margin: 0; font-size: 20px; overflow-wrap: anywhere; }
      .kassa-inspector-head p { margin: 4px 0 0; color: #a3a9b1; }
      .kassa-inspector-actions { display: flex; gap: 7px; flex-wrap: wrap; }
      .kassa-inspector-section { padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.09); }
      .kassa-inspector-section:last-of-type { border-bottom: 0; }
      .kassa-inspector-section-title { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 9px; }
      .kassa-inspector-section-title span { color: #9da3ac; }
      .kassa-inspector-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
      .kassa-inspector-grid > div { min-width: 0; padding: 10px; border: 1px solid rgba(255,255,255,.1); border-radius: 7px; background: rgba(7,8,10,.28); }
      .kassa-inspector-grid span { display: block; color: #9299a3; font-size: 11px; }
      .kassa-inspector-grid strong { display: block; margin-top: 4px; overflow-wrap: anywhere; }
      .kassa-inspector-list { display: grid; gap: 7px; }
      .kassa-inspector-list > div { display: flex; justify-content: space-between; gap: 10px; min-width: 0; }
      .kassa-inspector-list span { min-width: 0; color: #b5bac2; overflow-wrap: anywhere; }
      .kassa-inspector-list strong { flex: 0 0 auto; text-align: right; }
      .kassa-inspector-footer { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding-top: 14px; }
      .kassa-workspace-empty { display: grid; place-items: center; min-height: 310px; padding: 30px; text-align: center; color: #9ea4ad; }
      .kassa-workspace-empty strong, .kassa-workspace-empty span { display: block; }
      .kassa-workspace-empty.compact { min-height: 90px; padding: 16px; }
      .kassa-status { display: inline-flex; align-items: center; gap: 7px; min-width: 0; color: #d9dce1; }
      .kassa-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #8b929c; flex: 0 0 auto; }
      .kassa-status.active::before,
      .kassa-status.delivered::before { background: #74b56d; }
      .kassa-status.attention::before { background: #d2a75d; }
      .kassa-status.problem::before { background: #c76363; }
      .kassa-status.is-success::before { background: #74b56d; }
      .kassa-status.is-warning::before { background: #d2a75d; }
      .kassa-delivery-progress { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0; margin-top: 12px; }
      .kassa-delivery-progress div { position: relative; padding-top: 18px; color: #858b94; font-size: 11px; text-align: center; }
      .kassa-delivery-progress div::before { content: ""; position: absolute; top: 4px; left: calc(50% - 5px); width: 10px; height: 10px; border: 2px solid #6f757e; border-radius: 50%; background: #141619; z-index: 1; }
      .kassa-delivery-progress div::after { content: ""; position: absolute; top: 9px; left: -50%; width: 100%; height: 1px; background: #555b63; }
      .kassa-delivery-progress div:first-child::after { display: none; }
      .kassa-delivery-progress div.complete { color: #d9dce1; }
      .kassa-delivery-progress div.complete::before { border-color: #8fc786; background: #8fc786; }
      .kassa-delivery-progress div.complete::after { background: #8fc786; }
      .kassa-editor-modal .modal { width: min(1120px,calc(100vw - 24px)); max-height: min(880px,calc(100dvh - 24px)); }
      .kassa-editor-modal .modal-head { padding: 16px 20px; }
      .kassa-editor-modal .modal-head small { display: block; margin-bottom: 4px; color: #979da6; }
      .kassa-editor-form { display: grid; grid-template-columns: minmax(0,1fr) minmax(270px,34%); min-height: 0; overflow: hidden; }
      .kassa-editor-main { display: grid; gap: 10px; padding: 14px; overflow: auto; scrollbar-width: none; }
      .kassa-editor-main::-webkit-scrollbar { width: 0; }
      .kassa-editor-section { display: grid; gap: 10px; padding: 13px; border-radius: 8px; }
      .kassa-editor-section h4 { margin: 0; font-size: 15px; }
      .kassa-editor-section .form-grid { gap: 9px; }
      .kassa-editor-section label { min-width: 0; }
      .kassa-editor-section input,
      .kassa-editor-section select,
      .kassa-editor-section textarea { width: 100%; min-width: 0; }
      .kassa-editor-summary { min-width: 0; padding: 16px; border-width: 0 0 0 1px; border-radius: 0; overflow: auto; scrollbar-width: none; }
      .kassa-editor-summary::-webkit-scrollbar { width: 0; }
      .kassa-editor-summary h4 { margin: 0 0 14px; font-size: 17px; }
      .kassa-editor-summary-total { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 14px 0; padding: 14px 0; border-top: 1px solid rgba(255,255,255,.12); border-bottom: 1px solid rgba(255,255,255,.12); }
      .kassa-editor-summary-total strong { font-size: 24px; }
      .kassa-editor-note { margin-top: 14px; padding: 12px; border: 1px solid rgba(255,255,255,.1); border-radius: 7px; color: #a9afb8; background: rgba(0,0,0,.18); }
      .kassa-editor-footer { grid-column: 1/-1; display: flex; justify-content: flex-end; gap: 8px; padding: 12px 14px; border-top: 1px solid rgba(255,255,255,.12); background: #111315; }
      .kassa-client-avatar { display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto 10px; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; background: #292c30; color: #f5f5f6; font-size: 20px; font-weight: 800; }
      .kassa-client-preview { text-align: center; }
      .kassa-client-preview h4 { margin-bottom: 5px; }
      .kassa-client-preview p { margin: 3px 0; color: #aeb3bb; overflow-wrap: anywhere; }
      .kassa-client-completion { margin-top: 14px; text-align: left; }
      .kassa-client-completion progress { width: 100%; height: 7px; accent-color: #c7c9cd; }
      @media (prefers-reduced-motion: reduce) {
        .kassa-client-inspector-host > .kassa-workspace-inspector { animation: none !important; }
      }
      @media (max-width: 980px) {
        .kassa-workspace-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
        .kassa-workspace-body { grid-template-columns: minmax(0,1fr) minmax(270px,38%); }
        .kassa-workspace-toolbar { grid-template-columns: minmax(200px,1fr) repeat(2,minmax(130px,.4fr)); }
        .kassa-workspace-toolbar .btn { grid-column: auto; }
        .kassa-workspace-table th:nth-child(4), .kassa-workspace-table td:nth-child(4) { display: none; }
      }
      @media (max-width: 720px) {
        .kassa-workspace-head { align-items: stretch; flex-direction: column; }
        .kassa-workspace-head-actions { justify-content: stretch; }
        .kassa-workspace-head-actions > * { flex: 1 1 120px; }
        .kassa-workspace-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
        .kassa-workspace-toolbar { grid-template-columns: 1fr 1fr; }
        .kassa-workspace-toolbar .kassa-workspace-search { grid-column: 1/-1; }
        .kassa-workspace-body { grid-template-columns: 1fr; }
        .kassa-workspace-inspector { min-height: 0; }
        .kassa-workspace-table table { min-width: 680px; }
        .kassa-editor-modal .modal { width: 100vw; max-width: 100vw; max-height: 100dvh; height: 100dvh; border-radius: 0; }
        .kassa-editor-form { grid-template-columns: 1fr; overflow: auto; }
        .kassa-editor-main,
        .kassa-editor-summary { overflow: visible; }
        .kassa-editor-summary { border-width: 1px 0 0; }
        .kassa-editor-footer { position: sticky; bottom: 0; z-index: 3; }
      }
      @media (max-width: 460px) {
        .kassa-workspace-metrics { grid-template-columns: 1fr 1fr; gap: 7px; }
        .kassa-workspace-metric { padding: 11px; }
        .kassa-workspace-metric strong { font-size: 20px; }
        .kassa-workspace-toolbar { grid-template-columns: 1fr; }
        .kassa-workspace-toolbar > * { grid-column: 1; }
        .kassa-inspector-grid { grid-template-columns: 1fr 1fr; }
        .kassa-inspector-footer { grid-template-columns: 1fr; }
        .kassa-workspace-inspector-footer { grid-template-columns: 1fr; }
        .kassa-editor-footer { display: grid; grid-template-columns: 1fr 1fr; }
        .kassa-editor-footer .primary { grid-column: 1/-1; grid-row: 1; }
      }

      /* Stage 34: focused touch workspace for small stores and non-fiscal sales. */
      body.simple-trade-mode {
        --simple-touch-bg: #07090b;
        --simple-touch-surface: #101317;
        --simple-touch-surface-raised: #15191e;
        --simple-touch-line: rgba(255,255,255,.12);
        --simple-touch-line-strong: rgba(255,255,255,.24);
        --simple-touch-text: #f6f7f8;
        --simple-touch-muted: #aeb4bc;
      }
      @media (min-width: 721px) {
        body.simple-trade-mode .app { grid-template-columns: 184px minmax(0,1fr) !important; }
        body.simple-trade-mode .sidebar { padding: 12px 10px !important; gap: 10px !important; }
        body.simple-trade-mode .brand { padding-inline: 7px !important; }
        body.simple-trade-mode .brand-copy strong { font-size: 16px !important; }
        body.simple-trade-mode .nav { gap: 6px !important; }
        body.simple-trade-mode .nav button { min-height: 48px !important; padding: 8px 10px !important; gap: 10px !important; }
        body.simple-trade-mode .nav button > span:nth-child(2) { font-size: 13px !important; }
        body.simple-trade-mode .nav .nav-icon { width: 34px !important; height: 34px !important; flex: 0 0 34px !important; }
      }
      body.simple-trade-mode #view-pos:not(.hidden) > .trade-help-banner { display: none !important; }
      body.simple-trade-mode #view-pos:not(.hidden) {
        height: 100% !important;
        min-height: 0 !important;
        padding: 0 0 8px !important;
        overflow: hidden !important;
      }
      body.simple-trade-mode .simple-touch-pos {
        display: grid;
        grid-template-columns: minmax(0,1fr) clamp(270px,24vw,330px);
        grid-template-rows: auto clamp(150px,22vh,188px) minmax(250px,1fr);
        gap: 10px;
        height: 100%;
        min-height: 0;
        color: var(--simple-touch-text);
      }
      body.simple-trade-mode .simple-touch-main {
        display: contents;
        min-width: 0;
        min-height: 0;
      }
      body.simple-trade-mode .simple-touch-toolbar,
      body.simple-trade-mode .simple-touch-favorites,
      body.simple-trade-mode .simple-touch-receipt,
      body.simple-trade-mode .simple-touch-checkout {
        border: 1px solid var(--simple-touch-line) !important;
        border-radius: 8px !important;
        background: var(--simple-touch-surface) !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.025), 0 12px 30px rgba(0,0,0,.12) !important;
      }
      body.simple-trade-mode .simple-touch-toolbar {
        grid-column: 1 / -1;
        grid-row: 1;
        display: grid;
        grid-template-columns: minmax(180px,1fr) 48px auto auto;
        align-items: center;
        gap: 7px;
        padding: 7px;
      }
      body.simple-trade-mode .simple-touch-search,
      body.simple-trade-mode .simple-touch-toolbar .universal-scan-button,
      body.simple-trade-mode .simple-touch-mode-link {
        min-height: 44px !important;
        border: 1px solid var(--simple-touch-line) !important;
        border-radius: 7px !important;
        background: #090b0e !important;
        color: var(--simple-touch-text) !important;
      }
      body.simple-trade-mode .simple-touch-search {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 10px;
        padding: 0 13px;
        font-weight: 700;
        text-align: left;
      }
      body.simple-trade-mode .simple-touch-search svg,
      body.simple-trade-mode .simple-touch-toolbar .universal-scan-button svg { width: 20px !important; height: 20px !important; }
      body.simple-trade-mode .simple-touch-receipt-meta {
        display: grid;
        gap: 2px;
        min-width: 118px;
        padding: 0 8px;
        line-height: 1.15;
        white-space: nowrap;
      }
      body.simple-trade-mode .simple-touch-receipt-meta strong { font-size: 12px; }
      body.simple-trade-mode .simple-touch-receipt-meta small { color: var(--simple-touch-muted); font-size: 11px; }
      body.simple-trade-mode .simple-touch-mode-link { padding: 0 12px; font-size: 12px; font-weight: 750; white-space: nowrap; }
      body.simple-trade-mode .simple-touch-favorites { grid-column: 2; grid-row: 2; min-width: 0; min-height: 0; padding: 9px; overflow: hidden; }
      body.simple-trade-mode .simple-touch-section-head {
        min-height: 28px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 7px;
      }
      body.simple-trade-mode .simple-touch-section-head strong { font-size: 14px; }
      body.simple-trade-mode .simple-touch-section-head > span { color: var(--simple-touch-muted); font-size: 11px; }
      body.simple-trade-mode .simple-touch-section-head > button {
        min-height: 30px;
        padding: 4px 10px;
        border: 1px solid var(--simple-touch-line);
        border-radius: 6px;
        background: #0a0c0f;
        color: var(--simple-touch-text);
        font-size: 11px;
        font-weight: 700;
      }
      body.simple-trade-mode .simple-touch-quick-actions { display: flex; align-items: center; gap: 7px; }
      body.simple-trade-mode .simple-touch-quick-switch { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); padding: 2px; border: 1px solid var(--simple-touch-line); border-radius: 7px; background: #090b0e; }
      body.simple-trade-mode .simple-touch-quick-switch button { min-height: 28px; padding: 3px 9px; border: 1px solid transparent; border-radius: 5px; background: transparent; color: var(--simple-touch-muted); font-size: 10px; font-weight: 750; }
      body.simple-trade-mode .simple-touch-quick-switch button.active { border-color: var(--simple-touch-line-strong); background: #20242a; color: #fff; }
      body.simple-trade-mode .simple-touch-all-products { min-height: 34px; padding: 4px 10px; border: 1px solid var(--simple-touch-line); border-radius: 7px; background: #0a0c0f; color: var(--simple-touch-text); font-size: 10px; font-weight: 750; }
      body.simple-trade-mode .simple-touch-product-grid {
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        grid-template-rows: repeat(3,minmax(0,1fr));
        grid-auto-rows: minmax(0,1fr);
        gap: 7px;
        height: calc(100% - 35px);
        overflow: hidden;
      }
      body.simple-trade-mode .simple-touch-product-grid > :nth-child(n+7) { display: none; }
      body.simple-trade-mode .simple-touch-product {
        min-width: 0;
        min-height: 50px;
        display: grid;
        grid-template-columns: 36px minmax(0,1fr);
        align-items: center;
        gap: 7px;
        padding: 6px 8px;
        border: 1px solid var(--simple-touch-line);
        border-radius: 7px;
        background: #0a0d10;
        color: var(--simple-touch-text);
        text-align: left;
        transition: border-color .16s ease, background .16s ease, transform .16s ease;
      }
      body.simple-trade-mode .simple-touch-product:hover,
      body.simple-trade-mode .simple-touch-product:focus-visible {
        border-color: var(--simple-touch-line-strong);
        background: #171b20;
        transform: translateY(-1px);
      }
      body.simple-trade-mode .simple-touch-product .product-thumb {
        width: 36px !important;
        height: 40px !important;
        border-radius: 6px !important;
        background: #181c21 !important;
        color: #8f969f !important;
        font-size: 8px !important;
      }
      body.simple-trade-mode .simple-touch-product > span { min-width: 0; display: grid; gap: 2px; }
      body.simple-trade-mode .simple-touch-product strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
      body.simple-trade-mode .simple-touch-product-meta { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 7px; }
      body.simple-trade-mode .simple-touch-product small { color: #e5e7ea; font-size: 11px; font-weight: 800; white-space: nowrap; }
      body.simple-trade-mode .simple-touch-product-stock { min-width: 0; overflow: hidden; color: var(--simple-touch-muted); font-size: 9px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
      body.simple-trade-mode .simple-touch-product-empty { grid-column: span 2; }
      body.simple-trade-mode .simple-touch-product-empty > svg { width: 28px; height: 28px; margin: auto; }
      body.simple-trade-mode .simple-touch-receipt {
        grid-column: 1;
        grid-row: 2 / 4;
        display: grid;
        grid-template-rows: auto auto minmax(0,1fr);
        min-width: 0;
        min-height: 0;
        padding: 9px;
        overflow: hidden;
      }
      body.simple-trade-mode .simple-touch-cart {
        display: flex;
        flex-direction: column;
        min-height: 0;
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-width: none;
      }
      body.simple-trade-mode .simple-touch-cart > :first-child { margin-top: auto; }
      body.simple-trade-mode .simple-touch-cart::-webkit-scrollbar { width: 0; height: 0; }
      body.simple-trade-mode .simple-touch-cart-row {
        position: relative;
        display: grid;
        grid-template-columns: minmax(180px,1.6fr) 104px minmax(104px,.52fr) 34px;
        align-items: center;
        gap: 8px;
        min-height: 66px;
        padding: 7px 2px;
        border-bottom: 1px solid var(--simple-touch-line);
      }
      body.simple-trade-mode .simple-touch-cart-product { min-width: 0; display: grid; grid-template-columns: 42px minmax(0,1fr); align-items: center; gap: 9px; }
      body.simple-trade-mode .simple-touch-cart-product .product-thumb { width: 42px !important; height: 42px !important; border-radius: 6px !important; }
      body.simple-trade-mode .simple-touch-cart-product > div { min-width: 0; display: grid; gap: 3px; }
      body.simple-trade-mode .simple-touch-cart-product strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
      body.simple-trade-mode .simple-touch-cart-product span { color: var(--simple-touch-muted); font-size: 10px; white-space: nowrap; }
      body.simple-trade-mode .simple-touch-quantity { display: grid; gap: 3px; color: var(--simple-touch-muted); font-size: 9px; }
      body.simple-trade-mode .simple-touch-quantity > span:last-child {
        display: grid;
        grid-template-columns: 28px 34px 28px;
        align-items: stretch;
        width: 90px;
        max-width: 100%;
      }
      body.simple-trade-mode .simple-touch-quantity button,
      body.simple-trade-mode .simple-touch-quantity input {
        box-sizing: border-box !important;
        display: block;
        min-width: 0;
        width: 100% !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        margin: 0 !important;
        padding: 0 4px !important;
        border: 1px solid var(--simple-touch-line) !important;
        border-radius: 0 !important;
        background: #090b0e !important;
        color: var(--simple-touch-text) !important;
        text-align: center;
        font-weight: 800;
        line-height: 28px !important;
      }
      body.simple-trade-mode .simple-touch-quantity input {
        appearance: textfield;
        -moz-appearance: textfield;
      }
      body.simple-trade-mode .simple-touch-quantity input::-webkit-inner-spin-button,
      body.simple-trade-mode .simple-touch-quantity input::-webkit-outer-spin-button {
        margin: 0;
        -webkit-appearance: none;
        appearance: none;
      }
      html body.simple-trade-mode #view-pos .simple-touch-quantity input[type="number"] {
        box-sizing: border-box !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        padding-block: 0 !important;
        appearance: textfield !important;
        -moz-appearance: textfield !important;
      }
      html body.simple-trade-mode #view-pos .simple-touch-quantity input[type="number"]::-webkit-inner-spin-button,
      html body.simple-trade-mode #view-pos .simple-touch-quantity input[type="number"]::-webkit-outer-spin-button {
        margin: 0 !important;
        -webkit-appearance: none !important;
        appearance: none !important;
      }
      body.simple-trade-mode .simple-touch-quantity button:first-child { border-radius: 6px 0 0 6px !important; }
      body.simple-trade-mode .simple-touch-quantity button:last-child { border-radius: 0 6px 6px 0 !important; }
      body.simple-trade-mode .simple-touch-line-total { min-width: 0; display: grid; justify-items: end; gap: 4px; }
      body.simple-trade-mode .simple-touch-line-total strong { font-size: 13px; white-space: nowrap; }
      body.simple-trade-mode .simple-touch-line-total button { padding: 0; border: 0; background: transparent; color: var(--simple-touch-muted); font-size: 10px; text-decoration: underline; }
      body.simple-trade-mode .simple-touch-remove {
        width: 32px;
        height: 32px;
        border: 1px solid var(--simple-touch-line);
        border-radius: 6px;
        background: #0b0d10;
        color: #d9dde1;
        font-size: 20px;
      }
      body.simple-trade-mode .simple-touch-stock-error { grid-column: 1/-1; color: #f08b8b; font-size: 10px; }
      body.simple-trade-mode .simple-touch-empty {
        width: 100%;
        height: 100%;
        min-height: 110px;
        display: grid;
        place-content: center;
        justify-items: center;
        gap: 7px;
        border: 1px dashed var(--simple-touch-line);
        border-radius: 7px;
        background: #090b0e;
        color: var(--simple-touch-text);
      }
      body.simple-trade-mode .simple-touch-empty svg { width: 27px; height: 27px; }
      body.simple-trade-mode .simple-touch-empty span { color: var(--simple-touch-muted); font-size: 11px; text-align: center; }
      body.simple-trade-mode .simple-touch-receipt-actions { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 6px 0 7px; border-bottom: 1px solid var(--simple-touch-line); }
      body.simple-trade-mode .simple-touch-secondary-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
      body.simple-trade-mode .simple-touch-receipt-actions button {
        min-height: 38px;
        display: inline-flex;
        align-items: center;
        gap: 7px;
        padding: 0 12px;
        border: 1px solid var(--simple-touch-line);
        border-radius: 6px;
        background: #0a0c0f;
        color: var(--simple-touch-text);
        font-size: 11px;
        font-weight: 700;
      }
      body.simple-trade-mode .simple-touch-receipt-actions svg { width: 16px; height: 16px; }
      body.simple-trade-mode .simple-touch-receipt-actions b { font-size: 19px; line-height: 1; }
      body.simple-trade-mode .simple-touch-add-product { border-color: rgba(255,255,255,.24) !important; background: #1a1d20 !important; }
      body.simple-trade-mode .simple-touch-checkout {
        grid-column: 2;
        grid-row: 3;
        display: flex;
        flex-direction: column;
        gap: 9px;
        min-width: 0;
        min-height: 0;
        padding: 13px;
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-width: none;
      }
      body.simple-trade-mode .simple-touch-checkout::-webkit-scrollbar { width: 0; }
      body.simple-trade-mode .simple-touch-total { display: grid; gap: 6px; padding: 4px 2px 11px; border-bottom: 1px solid var(--simple-touch-line); }
      body.simple-trade-mode .simple-touch-total > span:first-child { color: var(--simple-touch-muted); font-size: 12px; text-transform: uppercase; }
      body.simple-trade-mode .simple-touch-total > strong { font-size: clamp(31px,3.5vw,48px); line-height: 1; letter-spacing: 0; white-space: nowrap; }
      body.simple-trade-mode .simple-touch-total > div { display: flex; justify-content: space-between; gap: 8px; color: var(--simple-touch-muted); font-size: 11px; }
      body.simple-trade-mode .simple-touch-total b { color: var(--simple-touch-text); }
      body.simple-trade-mode .simple-touch-subtotal { color: #858c95 !important; font-size: 10px !important; text-transform: none !important; }
      body.simple-trade-mode .simple-touch-customer {
        min-height: 50px;
        display: grid;
        grid-template-columns: 30px minmax(0,1fr) auto;
        align-items: center;
        gap: 9px;
        padding: 7px 10px;
        border: 1px solid var(--simple-touch-line);
        border-radius: 7px;
        background: #0a0c0f;
        color: var(--simple-touch-text);
        text-align: left;
      }
      body.simple-trade-mode .simple-touch-customer svg { width: 20px; height: 20px; }
      body.simple-trade-mode .simple-touch-customer > span { min-width: 0; display: grid; gap: 2px; }
      body.simple-trade-mode .simple-touch-customer small { color: var(--simple-touch-muted); font-size: 9px; }
      body.simple-trade-mode .simple-touch-customer strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
      body.simple-trade-mode .simple-touch-payment-block { display: grid; gap: 7px; }
      body.simple-trade-mode .simple-touch-payment-block > strong { font-size: 12px; }
      body.simple-trade-mode .simple-touch-payment-types { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
      body.simple-trade-mode .simple-touch-payment-types button {
        min-width: 0;
        min-height: 62px;
        display: grid;
        place-content: center;
        justify-items: center;
        gap: 5px;
        padding: 6px 3px;
        border: 1px solid var(--simple-touch-line) !important;
        border-radius: 7px !important;
        background: #090b0e !important;
        color: #d9dde2 !important;
        font-size: 10px;
        font-weight: 750;
      }
      body.simple-trade-mode .simple-touch-payment-types button.active {
        border-color: rgba(255,255,255,.52) !important;
        background: #20242a !important;
        color: #fff !important;
        box-shadow: inset 0 0 0 1px rgba(255,255,255,.12) !important;
      }
      body.simple-trade-mode .simple-touch-payment-types svg { width: 29px; height: 29px; }
      body.simple-trade-mode .simple-touch-mixed { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
      body.simple-trade-mode .simple-touch-mixed label { display: grid; gap: 3px; color: var(--simple-touch-muted); font-size: 9px; }
      body.simple-trade-mode .simple-touch-mixed input { min-width: 0; height: 36px; }
      body.simple-trade-mode .simple-touch-mixed span { grid-column: 1/-1; color: var(--simple-touch-muted); font-size: 9px; }
      body.simple-trade-mode .simple-touch-options { border: 1px solid var(--simple-touch-line); border-radius: 7px; background: #0a0c0f; }
      body.simple-trade-mode .simple-touch-options summary { min-height: 42px; display: flex; align-items: center; padding: 0 11px; color: var(--simple-touch-text); font-size: 11px; font-weight: 750; cursor: pointer; }
      body.simple-trade-mode .simple-touch-options-body { display: grid; gap: 8px; padding: 0 9px 9px; }
      body.simple-trade-mode .simple-touch-options-body > label { display: grid; gap: 4px; color: var(--simple-touch-muted); font-size: 9px; }
      body.simple-trade-mode .simple-touch-options-body > label > div { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
      body.simple-trade-mode .simple-touch-options-body input,
      body.simple-trade-mode .simple-touch-options-body select { min-width: 0; height: 36px; }
      body.simple-trade-mode .simple-touch-options .pos-loyalty-card { padding: 8px !important; border-color: var(--simple-touch-line) !important; background: #0d1013 !important; }
      body.simple-trade-mode .simple-touch-print-row { display: flex; align-items: center; justify-content: space-between; gap: 7px; color: var(--simple-touch-muted); font-size: 9px; }
      body.simple-trade-mode .simple-touch-print-row button { min-height: 36px; display: inline-flex; align-items: center; gap: 6px; padding: 0 9px; border: 1px solid var(--simple-touch-line); border-radius: 6px; background: #090b0e; color: var(--simple-touch-text); font-size: 10px; font-weight: 700; }
      body.simple-trade-mode .simple-touch-print-row button.active { border-color: var(--simple-touch-line-strong); background: #1b1f24; }
      body.simple-trade-mode .simple-touch-print-row svg { width: 16px; height: 16px; }
      body.simple-trade-mode .simple-touch-complete {
        position: sticky;
        bottom: 0;
        z-index: 4;
        width: 100%;
        min-height: 64px;
        margin-top: auto;
        padding: 10px 12px;
        border: 1px solid rgba(255,255,255,.6);
        border-radius: 8px;
        background: #f0f1f2;
        color: #07090b;
        font-size: clamp(15px,1.45vw,20px);
        font-weight: 900;
        letter-spacing: 0;
      }
      body.simple-trade-mode .simple-touch-complete:hover:not(:disabled) { background: #fff; transform: translateY(-1px); }
      body.simple-trade-mode .simple-touch-complete:disabled { border-color: var(--simple-touch-line); background: #1a1d21; color: #777e87; opacity: 1; }

      @media (max-width: 1500px) {
        body.simple-trade-mode .simple-touch-product { min-height: 50px; }
      }
      @media (max-width: 980px) and (min-width: 721px) {
        body.simple-trade-mode .app { grid-template-columns: 158px minmax(0,1fr) !important; }
        body.simple-trade-mode .simple-touch-pos { grid-template-columns: minmax(0,1fr) 252px; gap: 7px; }
        body.simple-trade-mode .simple-touch-toolbar { grid-template-columns: minmax(130px,1fr) 44px auto; }
        body.simple-trade-mode .simple-touch-mode-link { display: none; }
        body.simple-trade-mode .simple-touch-product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
        body.simple-trade-mode .simple-touch-cart-row { grid-template-columns: minmax(140px,1fr) 90px 86px 32px; gap: 5px; }
        body.simple-trade-mode .simple-touch-cart-product .product-thumb { display: none; }
        body.simple-trade-mode .simple-touch-cart-product { grid-template-columns: minmax(0,1fr); }
        body.simple-trade-mode .simple-touch-checkout { padding: 10px; gap: 7px; }
        body.simple-trade-mode .simple-touch-total > strong { font-size: 30px; }
      }
      @media (max-height: 680px) and (min-width: 721px) {
        body.simple-trade-mode #view-pos:not(.hidden) { height: 100% !important; min-height: 0 !important; }
        body.simple-trade-mode .simple-touch-pos { grid-template-rows: auto 118px minmax(230px,1fr); gap: 6px; }
        body.simple-trade-mode .simple-touch-favorites { padding: 6px; }
        body.simple-trade-mode .simple-touch-section-head { min-height: 22px; margin-bottom: 4px; }
        body.simple-trade-mode .simple-touch-product { min-height: 40px; padding: 4px 6px; }
        body.simple-trade-mode .simple-touch-product .product-thumb { width: 30px !important; height: 32px !important; }
        body.simple-trade-mode .simple-touch-cart-row { min-height: 57px; padding-block: 4px; }
        body.simple-trade-mode .simple-touch-total { gap: 3px; padding-top: 0; padding-bottom: 6px; }
        body.simple-trade-mode .simple-touch-total > strong { font-size: 28px; }
        body.simple-trade-mode .simple-touch-payment-types button { min-height: 52px; }
        body.simple-trade-mode .simple-touch-payment-types svg { width: 25px; height: 25px; }
        body.simple-trade-mode .simple-touch-customer { min-height: 44px; }
        body.simple-trade-mode .simple-touch-checkout { padding: 9px; gap: 6px; }
        body.simple-trade-mode .simple-touch-options summary { min-height: 34px; }
        body.simple-trade-mode .simple-touch-print-row { display: none; }
        body.simple-trade-mode .simple-touch-complete { min-height: 50px; }
      }
      @media (max-width: 720px) {
        body.simple-trade-mode #view-pos:not(.hidden) { height: auto !important; min-height: 0 !important; overflow: visible !important; padding-bottom: calc(var(--trade-bottom-nav-height,74px) + 10px) !important; }
        body.simple-trade-mode .simple-touch-pos { grid-template-columns: 1fr; grid-template-rows: max-content max-content; height: max-content !important; min-height: max-content !important; align-content: start; }
        body.simple-trade-mode .simple-touch-main { display: grid; grid-template-rows: auto auto auto; gap: 9px; height: max-content !important; min-height: max-content !important; align-self: start; }
        body.simple-trade-mode .simple-touch-toolbar,
        body.simple-trade-mode .simple-touch-favorites,
        body.simple-trade-mode .simple-touch-receipt,
        body.simple-trade-mode .simple-touch-checkout { grid-column: auto; grid-row: auto; }
        body.simple-trade-mode .simple-touch-toolbar { grid-template-columns: minmax(0,1fr) 46px auto; }
        body.simple-trade-mode .simple-touch-mode-link { display: none; }
        body.simple-trade-mode .simple-touch-receipt-meta { min-width: 84px; }
        body.simple-trade-mode .simple-touch-favorites { max-height: none; overflow: hidden; }
        body.simple-trade-mode .simple-touch-product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
        body.simple-trade-mode .simple-touch-product-grid > :nth-child(n+7) { display: none; }
        body.simple-trade-mode .simple-touch-product { min-height: 66px; }
        body.simple-trade-mode .simple-touch-receipt { min-height: 190px; max-height: 230px; }
        body.simple-trade-mode .simple-touch-cart-row { grid-template-columns: minmax(0,1fr) 90px 32px; }
        body.simple-trade-mode .simple-touch-cart-product { grid-column: 1; }
        body.simple-trade-mode .simple-touch-quantity { grid-column: 2; }
        body.simple-trade-mode .simple-touch-line-total { grid-column: 1; grid-row: 2; justify-items: start; padding-left: 51px; }
        body.simple-trade-mode .simple-touch-remove { grid-column: 3; grid-row: 1; }
        body.simple-trade-mode .simple-touch-checkout { height: max-content !important; min-height: max-content !important; overflow: visible; align-self: start; }
        body.simple-trade-mode .simple-touch-total > strong { font-size: clamp(34px,12vw,50px); }
        body.simple-trade-mode .simple-touch-complete { position: sticky; bottom: calc(var(--trade-bottom-nav-height,74px) + 8px); z-index: 6; }
      }
      @media (max-width: 900px) and (min-width: 721px) {
        html body.simple-trade-mode.android-shell #appRoot.app,
        html body.simple-trade-mode #appRoot.app {
          grid-template-columns: minmax(0,1fr) !important;
          column-gap: 0 !important;
        }
        html body.simple-trade-mode.android-shell #appRoot.app > .sidebar,
        html body.simple-trade-mode #appRoot.app > .sidebar { display: none !important; }
        body.simple-trade-mode .trade-bottom-nav {
          position: fixed !important;
          inset: auto 8px 8px 8px !important;
          z-index: 90 !important;
          display: grid !important;
          grid-template-columns: repeat(5,minmax(0,1fr));
          align-items: stretch !important;
          width: auto !important;
          height: 70px !important;
          min-height: 70px !important;
          padding: 5px !important;
          gap: 4px !important;
          border: 1px solid rgba(255,255,255,.14) !important;
          border-radius: 9px !important;
          background: rgba(13,15,18,.98) !important;
        }
        body.simple-trade-mode .trade-bottom-nav button {
          display: grid !important;
          grid-template-rows: 28px 16px !important;
          place-items: center !important;
          min-width: 0 !important;
          min-height: 58px !important;
          height: 58px !important;
          padding: 4px 2px !important;
          gap: 2px !important;
          border-radius: 7px !important;
        }
        html body.simple-trade-mode #appRoot .trade-bottom-nav button > svg {
          width: 23px !important;
          height: 23px !important;
          min-width: 23px !important;
          min-height: 23px !important;
        }
        body.simple-trade-mode .trade-bottom-nav span:last-child { font-size: 10px !important; line-height: 1 !important; }
        body.simple-trade-mode .main { padding-bottom: calc(var(--trade-bottom-nav-height,74px) + 8px) !important; }
        body.simple-trade-mode #view-pos:not(.hidden) { height: 100% !important; min-height: 0 !important; }
        body.simple-trade-mode .simple-touch-pos { grid-template-columns: minmax(0,1fr) 252px; }
      }
      @media (min-width: 901px) {
        html body.simple-trade-mode .sidebar .shift-box.as-nav-note .sidebar-actions-row {
          grid-template-columns: minmax(0,1fr) !important;
          gap: 4px !important;
        }
        html body.simple-trade-mode .sidebar .shift-box.as-nav-note .sidebar-actions-row > button {
          min-height: 38px !important;
          justify-content: flex-start !important;
          padding: 5px 7px !important;
          font-size: 10.5px !important;
        }
        html body.simple-trade-mode .sidebar .shift-box.as-nav-note .sidebar-actions-row .quick-action-label {
          min-width: 0 !important;
          overflow: visible !important;
          text-overflow: clip !important;
          white-space: normal !important;
          line-height: 1.1 !important;
        }
      }
      @media (max-width: 420px) {
        body.simple-trade-mode .simple-touch-toolbar { grid-template-columns: minmax(0,1fr) 44px; }
        body.simple-trade-mode .simple-touch-receipt-meta { display: none; }
        body.simple-trade-mode .simple-touch-product { grid-template-columns: 34px minmax(0,1fr); }
        body.simple-trade-mode .simple-touch-product .product-thumb { width: 34px !important; height: 34px !important; }
        body.simple-trade-mode .simple-touch-section-head { align-items: flex-start; }
        body.simple-trade-mode .simple-touch-quick-actions { gap: 4px; }
        body.simple-trade-mode .simple-touch-quick-switch button { padding-inline: 6px; }
        body.simple-trade-mode .simple-touch-all-products { display: none; }
        body.simple-trade-mode .simple-touch-favorites { height: 160px; }
        body.simple-trade-mode .simple-touch-product-grid { grid-template-rows: repeat(2,50px); grid-auto-rows: 50px; }
        body.simple-trade-mode .simple-touch-product-grid > :nth-child(n+5) { display: none; }
        body.simple-trade-mode .simple-touch-product { min-height: 50px; padding: 5px; }
        body.simple-trade-mode .simple-touch-receipt { height: 160px; min-height: 160px; }
        body.simple-trade-mode .simple-touch-cart-row { grid-template-columns: minmax(0,1fr) 90px 32px; }
        body.simple-trade-mode .simple-touch-cart-product .product-thumb { display: none; }
        body.simple-trade-mode .simple-touch-cart-product { grid-template-columns: minmax(0,1fr); }
        body.simple-trade-mode .simple-touch-line-total { padding-left: 0; }
        body.simple-trade-mode .simple-touch-checkout {
          display: grid !important;
          grid-template-columns: repeat(2,minmax(0,1fr)) !important;
          grid-template-areas: "total total" "customer customer" "payment payment" "complete complete" "options options" !important;
          gap: 4px !important;
          padding: 8px !important;
        }
        body.simple-trade-mode .simple-touch-total { grid-area: total; padding: 1px 1px 5px; gap: 2px; }
        body.simple-trade-mode .simple-touch-total > strong { font-size: 30px; }
        body.simple-trade-mode .simple-touch-customer { grid-area: customer; min-height: 42px; }
        body.simple-trade-mode .simple-touch-payment-block { grid-area: payment; }
        body.simple-trade-mode .simple-touch-complete { grid-area: complete; position: static; min-height: 52px; margin-top: 0; }
        body.simple-trade-mode .simple-touch-options { grid-area: options; }
        body.simple-trade-mode .simple-touch-options[open] { grid-column: 1/-1; }
        body.simple-trade-mode .simple-touch-options summary { min-height: 42px; padding-inline: 8px; }
        body.simple-trade-mode .simple-touch-print-row { display: none; }
        body.simple-trade-mode .simple-touch-payment-types button { min-height: 48px; }
      }

      /* Canonical graphite treatment for local device settings and sidebar actions. */
      html body.srm-page #appRoot > .sidebar .shift-box.as-nav-note .sidebar-actions-row,
      html[lang="kk"] body.srm-page.windows-shell #appRoot > .sidebar .shift-box.as-nav-note .sidebar-actions-row,
      html body.srm-page.simple-trade-mode #appRoot > .sidebar .shift-box.as-nav-note .sidebar-actions-row {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 6px !important;
        width: 100% !important;
      }
      html body.srm-page #appRoot > .sidebar .shift-box.as-nav-note .sidebar-actions-row > :is(.quick-support-button, .quick-sync-button),
      html body.srm-page.simple-trade-mode #appRoot > .sidebar .shift-box.as-nav-note .sidebar-actions-row > :is(.quick-support-button, .quick-sync-button) {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-rows: 20px minmax(24px, auto) !important;
        align-items: center !important;
        justify-items: center !important;
        justify-content: stretch !important;
        grid-column: auto !important;
        min-width: 0 !important;
        min-height: 58px !important;
        padding: 7px 6px !important;
        gap: 4px !important;
        overflow: hidden !important;
        border-color: rgba(255,255,255,.13) !important;
        background: #101214 !important;
      }
      html body.srm-page #appRoot > .sidebar .shift-box.as-nav-note .sidebar-actions-row .quick-action-icon {
        display: grid !important;
        place-items: center !important;
        width: 20px !important;
        height: 20px !important;
        min-width: 20px !important;
        margin: 0 !important;
      }
      html body.srm-page #appRoot > .sidebar .shift-box.as-nav-note .sidebar-actions-row .quick-action-label {
        display: block !important;
        min-width: 0 !important;
        margin: 0 !important;
        color: #e7e9eb !important;
        font-size: 10px !important;
        line-height: 1.18 !important;
        text-align: center !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        overflow: hidden !important;
      }
      html body.srm-page #appRoot > .sidebar .shift-box.as-nav-note .sidebar-actions-row .quick-action-label-simple {
        display: none !important;
      }
      html body.srm-page.simple-trade-mode #appRoot > .sidebar .shift-box.as-nav-note .sidebar-actions-row .quick-action-label-full {
        display: none !important;
      }
      html body.srm-page.simple-trade-mode #appRoot > .sidebar .shift-box.as-nav-note .sidebar-actions-row .quick-action-label-simple {
        display: block !important;
      }
      #view-settings :is(.device-overview-card, .device-config-card, .device-website-card, .device-panel-heading, .device-interface-preview),
      #view-settings :is(.diagnostics-list > div, .connection-status-grid > div, .device-overview-note, .equipment-capabilities, .connection-timeline) {
        border-color: rgba(255,255,255,.12) !important;
        background: #111315 !important;
        background-image: none !important;
        box-shadow: none !important;
      }
      #view-settings .device-config-card .toggle-line,
      #view-settings .device-config-card label.toggle-line,
      #view-settings .device-interface-preview,
      #view-settings .diagnostics-list > div,
      #view-settings .connection-status-grid > div {
        border-color: rgba(255,255,255,.11) !important;
        background: #0d0f11 !important;
        background-image: none !important;
      }
      #view-settings :is(.diagnostics-list, .connection-status-grid, .device-config-card) :is(strong, span, small, p) {
        text-shadow: none !important;
      }
      #view-settings :is(.diagnostics-list, .connection-status-grid) span,
      #view-settings :is(.diagnostics-list, .connection-status-grid) small,
      #view-settings .device-interface-preview small {
        color: #a7abb0 !important;
      }
      #view-settings :is(.diagnostics-list, .connection-status-grid) strong,
      #view-settings .device-config-card .toggle-line span,
      #view-settings .device-interface-preview strong {
        color: #f0f1f2 !important;
      }
      #view-settings .device-choice-row button.active {
        border-color: rgba(255,255,255,.34) !important;
        background: #24272a !important;
        color: #fff !important;
      }
      #view-settings .device-overview-card .row-actions {
        border-color: transparent !important;
        background: transparent !important;
        background-image: none !important;
        box-shadow: none !important;
      }
      #view-settings .device-overview-card .row-actions .btn {
        border-color: rgba(255,255,255,.16) !important;
        background: #181a1d !important;
        background-image: none !important;
        color: #f0f1f2 !important;
      }

      /* Graphite synchronization status shared by web, Windows and Android. */
      html body .modal.sync-details-modal {
        width: min(760px, calc(100vw - 28px)) !important;
        max-width: 760px !important;
        max-height: min(820px, calc(100dvh - 28px)) !important;
        overflow: hidden !important;
        border: 1px solid rgba(255,255,255,.14) !important;
        border-radius: 10px !important;
        background: #0b0d0f !important;
        background-image: none !important;
        box-shadow: 0 28px 80px rgba(0,0,0,.56) !important;
        color: #eef0f2 !important;
      }
      html body .modal.sync-details-modal .modal-head {
        min-height: 70px !important;
        padding: 15px 17px !important;
        border-bottom: 1px solid rgba(255,255,255,.1) !important;
        background: #101214 !important;
        background-image: none !important;
      }
      .sync-status-heading { display: grid; gap: 3px; min-width: 0; }
      .sync-status-heading > span {
        color: #989da2 !important;
        font-size: 10px !important;
        font-weight: 700 !important;
        text-transform: uppercase;
      }
      .sync-status-heading h3 { margin: 0 !important; font-size: 19px !important; }
      html body .modal.sync-details-modal .modal-close-button {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        border-color: rgba(255,255,255,.14) !important;
        background: #17191c !important;
        background-image: none !important;
        color: #eff1f2 !important;
      }
      .sync-status-shell {
        display: grid !important;
        gap: 12px !important;
        padding: 15px !important;
        overflow: auto !important;
        background: #0b0d0f !important;
        background-image: none !important;
        scrollbar-width: none;
      }
      .sync-status-shell::-webkit-scrollbar { display: none; }
      .sync-status-summary {
        display: grid;
        grid-template-columns: 52px minmax(0,1fr) auto;
        align-items: center;
        gap: 13px;
        min-width: 0;
        padding: 14px;
        border: 1px solid rgba(255,255,255,.13);
        border-radius: 8px;
        background: #131518;
      }
      .sync-status-orbit {
        position: relative;
        display: grid;
        place-items: center;
        width: 52px;
        height: 52px;
        border: 1px solid rgba(255,255,255,.14);
        border-radius: 50%;
        background: #0c0e10;
        color: #e3e5e7;
      }
      .sync-status-orbit svg { width: 24px; height: 24px; }
      .sync-status-orbit i {
        position: absolute;
        right: 3px;
        bottom: 4px;
        width: 8px;
        height: 8px;
        border: 2px solid #0c0e10;
        border-radius: 50%;
        background: #9da2a7;
      }
      .sync-status-summary.ok .sync-status-orbit i { background: #5bc994; }
      .sync-status-summary.error .sync-status-orbit i { background: #e06b72; }
      .sync-status-summary > div:nth-child(2) { display: grid; gap: 3px; min-width: 0; }
      .sync-status-summary > div:nth-child(2) > span,
      .sync-status-last span,
      .sync-status-grid article > div > span,
      .sync-status-detail span { color: #92979c !important; font-size: 11px !important; }
      .sync-status-summary h4 { margin: 0; color: #f4f5f6; font-size: 20px; }
      .sync-status-summary p { margin: 0; color: #b2b6ba; line-height: 1.4; overflow-wrap: anywhere; }
      .sync-status-last {
        display: grid;
        gap: 5px;
        min-width: 150px;
        padding-left: 14px;
        border-left: 1px solid rgba(255,255,255,.1);
      }
      .sync-status-last strong { color: #eceeef; font-size: 12px; overflow-wrap: anywhere; }
      .sync-status-grid {
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        gap: 9px;
      }
      .sync-status-grid article {
        position: relative;
        display: grid;
        grid-template-columns: 38px minmax(0,1fr);
        align-items: center;
        gap: 10px;
        min-width: 0;
        min-height: 76px;
        padding: 11px;
        border: 1px solid rgba(255,255,255,.11);
        border-radius: 8px;
        background: #101214;
      }
      .sync-status-grid article::after {
        content: "";
        position: absolute;
        top: 10px;
        right: 10px;
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #8f9499;
      }
      .sync-status-grid article.ok::after { background: #5bc994; }
      .sync-status-grid article.error::after { background: #e06b72; }
      .sync-status-grid article.pending::after { background: #a6aaae; }
      .sync-status-card-icon {
        display: grid;
        place-items: center;
        width: 38px;
        height: 38px;
        border: 1px solid rgba(255,255,255,.12);
        border-radius: 8px;
        background: #191b1e;
        color: #d5d8db;
      }
      .sync-status-card-icon svg { width: 19px; height: 19px; }
      .sync-status-grid article > div { display: grid; gap: 2px; min-width: 0; }
      .sync-status-grid article strong { color: #eff1f2; font-size: 14px; }
      .sync-status-grid article small { color: #9da2a7 !important; overflow-wrap: anywhere; }
      .sync-status-detail {
        display: grid;
        grid-template-columns: minmax(150px,.7fr) minmax(0,1.7fr);
        gap: 9px;
      }
      .sync-status-detail > div {
        display: grid;
        align-content: start;
        gap: 6px;
        min-width: 0;
        padding: 12px;
        border: 1px solid rgba(255,255,255,.1);
        border-radius: 8px;
        background: #0f1113;
      }
      .sync-status-detail strong { color: #eceeef; overflow-wrap: anywhere; }
      .sync-status-detail p { margin: 0; color: #b4b8bc; line-height: 1.42; overflow-wrap: anywhere; }
      .sync-status-failures {
        display: grid;
        gap: 7px;
        padding: 11px;
        border: 1px solid rgba(224,107,114,.28);
        border-radius: 8px;
        background: #121012;
      }
      .sync-status-failures > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
      .sync-status-failures > header > span { color: #d9dcde; font-weight: 700; }
      .sync-status-failures > header > strong { color: #f2f3f4; }
      .sync-status-actions {
        display: flex;
        justify-content: flex-end;
        gap: 8px;
        padding-top: 2px;
      }
      .sync-status-actions .btn {
        width: auto !important;
        min-width: 112px !important;
        height: auto !important;
        min-height: 40px;
        padding: 9px 15px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 7px !important;
        font-size: 13px !important;
        line-height: 1.25 !important;
        border-color: rgba(255,255,255,.15) !important;
        background: #17191c !important;
        background-image: none !important;
        color: #eef0f2 !important;
      }
      .sync-status-actions .btn.primary {
        border-color: rgba(255,255,255,.3) !important;
        background: #292c2f !important;
      }
      html body .modal.sync-details-modal .sync-status-actions button[data-action="sync-modal-close"] {
        inline-size: 112px !important;
        width: 112px !important;
        min-width: 112px !important;
        max-width: 112px !important;
        flex: 0 0 112px !important;
        white-space: nowrap !important;
      }

      html body :where(.contact-icon-button.whatsapp, .support-logo.whatsapp) {
        aspect-ratio: 1 / 1 !important;
        box-sizing: border-box !important;
        padding: 0 !important;
        overflow: visible !important;
        border-color: rgba(255,255,255,.16) !important;
        background: #101214 !important;
        background-image: none !important;
        color: #eceeef !important;
      }
      html body :where(.contact-icon-button.whatsapp, .support-logo.whatsapp) .contact-platform-icon-whatsapp {
        display: block !important;
        width: 23px !important;
        height: 23px !important;
        min-width: 23px !important;
        min-height: 23px !important;
        margin: 0 !important;
        transform: none !important;
        transform-origin: 50% 50% !important;
        overflow: visible !important;
      }

      @media (max-width: 620px) {
        html body .modal.sync-details-modal {
          width: min(100vw - 16px, 520px) !important;
          max-height: calc(100dvh - 16px) !important;
        }
        html body .modal.sync-details-modal .modal-head { min-height: 62px !important; padding: 11px 12px !important; }
        .sync-status-shell { gap: 9px !important; padding: 10px !important; }
        .sync-status-summary { grid-template-columns: 44px minmax(0,1fr); gap: 10px; padding: 11px; }
        .sync-status-orbit { width: 44px; height: 44px; }
        .sync-status-orbit svg { width: 21px; height: 21px; }
        .sync-status-last { grid-column: 1 / -1; min-width: 0; padding: 9px 0 0; border-left: 0; border-top: 1px solid rgba(255,255,255,.09); }
        .sync-status-grid { grid-template-columns: minmax(0,1fr); }
        .sync-status-grid article { min-height: 68px; }
        .sync-status-detail { grid-template-columns: minmax(0,1fr); }
        .sync-status-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
      }

      /* Stage 34 notification bell: compact graphite inbox without a separate page. */
      html body .sidebar { position: relative !important; }
      html body .sidebar > .brand { padding-right: 52px !important; }
      html body .notification-bell {
        position: relative;
        display: grid;
        place-items: center;
        width: 38px;
        height: 38px;
        padding: 0;
        border: 1px solid rgba(229, 231, 235, .17);
        border-radius: 8px;
        background: linear-gradient(180deg, #171a1f, #0b0d10);
        color: #e9ebef;
        cursor: pointer;
      }
      html body .notification-bell:hover,
      html body .notification-bell:focus-visible,
      html body .notification-bell.active {
        border-color: rgba(245, 246, 248, .48);
        background: linear-gradient(180deg, #22262c, #111419);
        outline: none;
      }
      html body .notification-bell > svg { width: 19px; height: 19px; }
      html body .notification-bell-sidebar {
        display: grid !important;
        position: absolute;
        z-index: 5;
        top: 17px;
        right: 12px;
      }
      html body .notification-bell-badge {
        position: absolute;
        top: -5px;
        right: -5px;
        display: grid;
        place-items: center;
        min-width: 18px;
        height: 18px;
        padding: 0 4px;
        border: 2px solid #07080a;
        border-radius: 999px;
        background: #eceef1;
        color: #090a0c;
        font-size: 9px;
        line-height: 1;
        font-weight: 850;
      }
      html body .notification-popover {
        --notification-popover-left: 10px;
        --notification-popover-top: 64px;
        --notification-popover-width: 380px;
        position: fixed;
        z-index: 980;
        top: var(--notification-popover-top);
        left: var(--notification-popover-left);
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
        width: var(--notification-popover-width);
        max-width: calc(100vw - 20px);
        max-height: min(520px, calc(100dvh - var(--notification-popover-top) - 10px));
        overflow: hidden;
        border: 1px solid rgba(229, 231, 235, .19);
        border-radius: 8px;
        background: #0b0d10;
        color: #f3f4f6;
        box-shadow: 0 24px 64px rgba(0, 0, 0, .58);
      }
      html body .notification-popover.hidden { display: none !important; }
      html body .notification-popover-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-height: 58px;
        padding: 10px 11px 10px 14px;
        gap: 10px;
        border-bottom: 1px solid rgba(229, 231, 235, .12);
        background: #111419;
      }
      html body .notification-popover-head > div:first-child { display: grid; gap: 2px; min-width: 0; }
      html body .notification-popover-head strong { font-size: 15px; line-height: 1.2; }
      html body .notification-popover-head span { color: #aeb3bc; font-size: 11px; }
      html body .notification-popover-head-actions { display: flex; align-items: center; gap: 5px; }
      html body .notification-popover-head-actions button,
      html body .notification-item-actions button {
        min-height: 30px;
        padding: 5px 8px;
        border: 1px solid rgba(229, 231, 235, .16);
        border-radius: 7px;
        background: #171a1f;
        color: #e9ebef;
        font: inherit;
        font-size: 10px;
        font-weight: 750;
        cursor: pointer;
      }
      html body .notification-popover-head-actions button:hover,
      html body .notification-item-actions button:hover { border-color: rgba(245, 246, 248, .42); background: #22262c; }
      html body .notification-popover-close {
        width: 30px;
        min-width: 30px;
        padding: 0 !important;
        font-size: 18px !important;
        line-height: 1 !important;
      }
      html body .notification-popover-list {
        min-height: 94px;
        overflow: auto;
        overscroll-behavior: contain;
        scrollbar-width: none;
        background: #090b0e;
      }
      html body .notification-popover-list::-webkit-scrollbar { width: 0; height: 0; }
      html body .notification-popover-item {
        position: relative;
        display: grid;
        grid-template-columns: 8px minmax(0, 1fr);
        gap: 7px;
        padding: 10px 11px;
        border-bottom: 1px solid rgba(229, 231, 235, .09);
        background: #0b0d10;
      }
      html body .notification-popover-item:last-child { border-bottom: 0; }
      html body .notification-unread-dot {
        align-self: start;
        width: 6px;
        height: 6px;
        margin-top: 6px;
        border-radius: 50%;
        background: transparent;
      }
      html body .notification-popover-item.unread .notification-unread-dot { background: #eef0f3; box-shadow: 0 0 0 3px rgba(238, 240, 243, .08); }
      html body .notification-popover-copy {
        display: grid;
        gap: 3px;
        min-width: 0;
        border: 0;
        background: transparent;
        color: inherit;
        text-align: left;
        cursor: pointer;
      }
      html body .notification-item-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
      html body .notification-item-meta b { color: #c6cad1; font-size: 9px; text-transform: uppercase; }
      html body .notification-item-meta time { color: #8e949e; font-size: 10px; white-space: nowrap; }
      html body .notification-popover-copy > strong { overflow-wrap: anywhere; font-size: 12px; line-height: 1.3; }
      html body .notification-popover-copy > span:last-child {
        display: -webkit-box;
        overflow: hidden;
        color: #b5bac3;
        font-size: 11px;
        line-height: 1.35;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
      }
      html body .notification-popover-item.read { opacity: .74; }
      html body .notification-item-actions {
        grid-column: 2;
        display: flex;
        flex-wrap: wrap;
        gap: 5px;
        padding-top: 3px;
      }
      html body .notification-popover-empty {
        display: grid;
        place-items: center;
        min-height: 112px;
        padding: 20px;
        color: #aeb3bc;
        text-align: center;
        font-size: 12px;
      }

:root {
      --srm-canvas: #050607;
      --srm-canvas-2: #08090b;
      --srm-surface-1: #0d0f12;
      --srm-surface-2: #131518;
      --srm-surface-3: #191c20;
      --srm-border-subtle: rgba(181, 184, 189, .14);
      --srm-border: rgba(181, 184, 189, .24);
      --srm-border-strong: rgba(199, 202, 207, .42);
      --srm-text-primary: #f4f5f6;
      --srm-text-secondary: #ced1d5;
      --srm-text-muted: #aeb2b8;
      --srm-accent: #9b9ea3;
      --srm-accent-2: #7d8187;
      --srm-accent-3: #686b70;
      --button-gradient: linear-gradient(135deg, #4c4f54, #36393e 58%, #292c30);
      --desktop-bg: #070809;
      --desktop-panel: rgba(17, 18, 20, .97);
      --desktop-panel-2: rgba(22, 23, 26, .97);
      --desktop-field: #0d0e10;
      --desktop-field-2: #121416;
      --desktop-line: rgba(181, 184, 189, .18);
      --desktop-line-strong: rgba(199, 202, 207, .28);
      --desktop-text: #f1f2f3;
      --desktop-muted: #b7bac0;
      --desktop-accent: #a7aab0;
      --desktop-accent-2: #7e8288;
    }

    html body,
    html body:not(.android-shell),
    html body.android-shell {
      --bg: #050607;
      --workspace-bg: #050607;
      --surface: #0d0f12;
      --surface-2: #131518;
      --line: rgba(181, 184, 189, .18);
      --primary: #9b9ea3;
      --primary-2: #7d8187;
      --button-gradient: linear-gradient(135deg, #4c4f54, #36393e 58%, #292c30);
      color-scheme: dark;
      background:
        radial-gradient(circle at 18% 10%, rgba(174, 177, 182, .08), transparent 30%),
        radial-gradient(circle at 84% 12%, rgba(112, 115, 120, .06), transparent 32%),
        linear-gradient(180deg, #08090b, #050607) !important;
    }

    html body::before,
    html body:not(.android-shell)::before,
    html body.android-shell::before {
      background:
        radial-gradient(circle at 18% 70%, rgba(139, 142, 147, .07), transparent 29%),
        radial-gradient(circle at 78% 34%, rgba(92, 95, 100, .06), transparent 31%) !important;
    }

    html body :where(.topline, .panel, .stat, .settings-card, .settings-mini, .section-card, .network-card, .integration-card, .modal, .child-modal, .support-card, .table-notice, .history-cell, .compact-event, .counterparty-select-row, .report-editor, .report-editor-sheet, .report-payment-panel, .settings-logo-row, .network-setup-card, .legal-group, .legal-doc-row, .purchase-quote, .activation-purchase-actions, .activation-legal-strip, .legal-consent-box, .subscription-banner) {
      background: linear-gradient(180deg, rgba(22, 23, 26, .98), rgba(11, 12, 14, .98)) !important;
      border-color: rgba(181, 184, 189, .18) !important;
      color: #f1f2f3 !important;
    }

    html body :where(.panel-head, .modal-head, .child-modal .modal-head, .table-head) {
      background: linear-gradient(180deg, #1b1d20, #111214) !important;
      border-color: rgba(181, 184, 189, .18) !important;
      color: #f4f5f6 !important;
    }

    html body :where(input:not([type="checkbox"]):not([type="radio"]):not([type="color"]), select, textarea, .form-control, .field-control) {
      background: linear-gradient(180deg, #101113, #090a0b) !important;
      border-color: rgba(199, 202, 207, .28) !important;
      color: #f1f2f3 !important;
      -webkit-text-fill-color: #f1f2f3 !important;
      caret-color: #d6d8dc !important;
    }

    html body :where(input:not([type="checkbox"]):not([type="radio"]):not([type="color"]), select, textarea):hover {
      border-color: rgba(214, 216, 220, .42) !important;
    }

    html body :where(input:not([type="checkbox"]):not([type="radio"]):not([type="color"]), select, textarea):focus {
      border-color: rgba(224, 226, 229, .66) !important;
      box-shadow: 0 0 0 3px rgba(181, 184, 189, .14) !important;
    }

    html body :where(.btn, button, .tabs button, .settings-tabs button, .report-sheet-tabs button) {
      background: linear-gradient(180deg, #24262a, #151618) !important;
      border-color: rgba(199, 202, 207, .24) !important;
      color: #f1f2f3 !important;
    }

    html body :where(.btn.primary, button.primary, .tabs button.active, .settings-tabs button.active, .report-sheet-tabs button.active) {
      background: linear-gradient(135deg, #4c4f54, #36393e 58%, #292c30) !important;
      border-color: rgba(214, 216, 220, .38) !important;
      color: #ffffff !important;
      box-shadow: none !important;
    }

    html body :where(.row-actions, .modal .row-actions, .report-preview-modal .row-actions:last-child) {
      background: linear-gradient(180deg, rgba(20, 21, 23, .88), rgba(12, 13, 15, .98)) !important;
      border-color: rgba(181, 184, 189, .18) !important;
    }

    html body :where(table, .table-scroll, .report-editor table) {
      background: rgba(9, 10, 12, .9) !important;
      border-color: rgba(181, 184, 189, .16) !important;
    }

    html body th { background: #1a1c1f !important; border-color: rgba(181, 184, 189, .16) !important; }
    html body td { background: rgba(14, 15, 17, .92) !important; border-color: rgba(181, 184, 189, .10) !important; }
    html body tr:nth-child(even) td { background: rgba(18, 19, 21, .92) !important; }
    html body :where(option, optgroup) { background: #101113 !important; color: #f1f2f3 !important; }
    html body :where(input[type="checkbox"], input[type="radio"]) { accent-color: #9b9ea3 !important; }

    html body:not(.android-shell) .modal .table-notice,
    html body:not(.android-shell) .child-modal .table-notice,
    html body.android-shell .modal .table-notice,
    html body:not(.android-shell) .purchase-legal-note,
    html body.android-shell .purchase-legal-note,
    html body:not(.android-shell) .modal .purchase-quote,
    html body.android-shell .modal .purchase-quote {
      background: linear-gradient(180deg, rgba(22, 23, 26, .98), rgba(11, 12, 14, .98)) !important;
      border-color: rgba(181, 184, 189, .18) !important;
      color: #d6d8dc !important;
    }

    html body:not(.android-shell) .modal .row-actions,
    html body:not(.android-shell) .child-modal .row-actions,
    html body.android-shell .modal .row-actions,
    html body.android-shell .child-modal .row-actions {
      background: linear-gradient(180deg, rgba(20, 21, 23, .88), rgba(12, 13, 15, .98)) !important;
      border-color: rgba(181, 184, 189, .18) !important;
    }

    html body:not(#srm-legacy-theme):not(.android-shell) .modal .btn.primary,
    html body:not(#srm-legacy-theme):not(.android-shell) .child-modal .btn.primary,
    html body.android-shell .modal .btn.primary,
    html body.android-shell .child-modal .btn.primary {
      background: linear-gradient(135deg, #4c4f54, #36393e 58%, #292c30) !important;
      border-color: rgba(214, 216, 220, .38) !important;
      color: #ffffff !important;
      box-shadow: none !important;
    }

html body.windows-shell :is(.dashboard-home, .pos-standard-shell, .kassa-orders-workspace),
    html body.windows-shell :is(.dashboard-home, .pos-standard-shell, .kassa-orders-workspace) * {
      box-sizing: border-box;
      min-width: 0;
    }
    @media (min-width: 721px) {
      html body[data-active-view="pos"] #appRoot > .main {
        display: grid !important;
        height: auto !important;
        min-height: 0 !important;
        grid-template-rows: auto minmax(0, 1fr) !important;
        gap: 10px !important;
        overflow: hidden !important;
      }
      html body[data-active-view="pos"] #view-pos:not(.hidden) {
        width: 100% !important;
        height: auto !important;
        max-height: none !important;
        align-self: stretch;
        align-content: stretch !important;
        gap: 0 !important;
        min-height: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
      }
      html body[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-shell,
      html body.windows-shell[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-shell {
        display: grid !important;
        grid-template-rows: auto minmax(0, 1fr) !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
      }
      html body[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-grid,
      html body.windows-shell[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-grid {
        height: 100% !important;
        min-height: 0 !important;
      }
      html body[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-checkout {
        overflow-y: auto !important;
        overscroll-behavior: contain;
      }
    }
    @media (min-width: 721px) and (max-width: 900px) {
      html body.simple-trade-mode[data-active-view="pos"] #appRoot > .main {
        padding-bottom: 82px !important;
      }
      html body.simple-trade-mode[data-active-view="pos"] #view-pos .simple-touch-pos {
        grid-template-rows: auto 84px minmax(0, 1fr) !important;
      }
      html body.simple-trade-mode[data-active-view="pos"] #view-pos .simple-touch-product-grid {
        grid-template-rows: minmax(0, 1fr) !important;
      }
      html body.simple-trade-mode[data-active-view="pos"] #view-pos .simple-touch-product-grid > :nth-child(n+3) {
        display: none !important;
      }
      html body.simple-trade-mode[data-active-view="pos"] #view-pos .simple-touch-product {
        min-height: 0 !important;
      }
      html body.simple-trade-mode[data-active-view="pos"] #view-pos .simple-touch-checkout {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-areas: "total" "customer" "payment" "complete" !important;
        grid-template-rows: 60px 36px 64px 46px !important;
        align-content: start;
        gap: 4px !important;
        padding: 8px !important;
      }
      html body.simple-trade-mode[data-active-view="pos"] #view-pos .simple-touch-total { grid-area: total; gap: 2px; padding: 0 1px 5px; overflow: hidden; }
      html body.simple-trade-mode[data-active-view="pos"] #view-pos .simple-touch-total > strong { font-size: 28px; }
      html body.simple-trade-mode[data-active-view="pos"] #view-pos .simple-touch-subtotal { display: none; }
      html body.simple-trade-mode[data-active-view="pos"] #view-pos .simple-touch-customer { grid-area: customer; min-height: 36px; padding: 3px 8px; }
      html body.simple-trade-mode[data-active-view="pos"] #view-pos .simple-touch-payment-block { grid-area: payment; }
      html body.simple-trade-mode[data-active-view="pos"] #view-pos .simple-touch-payment-block > strong { font-size: 11px; }
      html body.simple-trade-mode[data-active-view="pos"] #view-pos .simple-touch-payment-types { gap: 4px; }
      html body.simple-trade-mode[data-active-view="pos"] #view-pos .simple-touch-payment-types button { min-height: 42px; padding: 2px; }
      html body.simple-trade-mode[data-active-view="pos"] #view-pos .simple-touch-complete { grid-area: complete; min-height: 46px; }
      html body.simple-trade-mode[data-active-view="pos"] #view-pos :is(.simple-touch-options, .simple-touch-print-row) {
        display: none !important;
      }
    }
    @media (min-width: 901px) and (max-width: 1180px) {
      html body[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-grid,
      html body.windows-shell[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-grid {
        grid-template-columns: minmax(0, 1fr) minmax(292px, 330px) !important;
      }
      html body[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-receipt,
      html body.windows-shell[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-receipt {
        min-height: 0 !important;
      }
      html body[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-checkout,
      html body.windows-shell[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-checkout {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-rows: auto minmax(0, 1fr) auto auto !important;
      }
      html body[data-active-view="pos"]:not(.simple-trade-mode) #view-pos :is(.pos-standard-customer, .pos-standard-payment, .pos-standard-summary, .pos-standard-checkout-actions) {
        grid-column: 1 !important;
        grid-row: auto !important;
        border-right: 0 !important;
      }
    }
    @media (min-width: 721px) and (max-width: 900px) {
      html body:not(.simple-trade-mode) #appRoot.app {
        grid-template-columns: 176px minmax(0, 1fr) !important;
      }
      html body:not(.simple-trade-mode) #appRoot > .sidebar {
        padding-inline: 10px !important;
      }
      html body:not(.simple-trade-mode) #appRoot > .sidebar .brand {
        padding-inline: 6px !important;
      }
      html body:not(.simple-trade-mode) #appRoot > .sidebar .brand h1 {
        font-size: 14px !important;
      }
      html body:not(.simple-trade-mode) #appRoot > .sidebar .brand span {
        display: none !important;
      }
      html body:not(.simple-trade-mode) #appRoot > .sidebar .nav button {
        min-height: 46px !important;
        padding: 7px 8px !important;
        gap: 8px !important;
      }
      html body:not(.simple-trade-mode) #appRoot > .sidebar .nav button > span:nth-child(2) {
        font-size: 11px !important;
      }
      html body:not(.simple-trade-mode) #appRoot > .sidebar .quick-action-label,
      html body:not(.simple-trade-mode) #appRoot > .sidebar .quick-profile-name {
        display: none !important;
      }
      html body:not(.simple-trade-mode) #appRoot > .sidebar .sidebar-actions-row {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      }
      html body:not(.simple-trade-mode) #appRoot > .sidebar .sidebar-actions-row > button {
        min-width: 0 !important;
        padding-inline: 4px !important;
      }
      html body[data-active-view="pos"]:not(.simple-trade-mode) .topline :is(button, .segmented button) {
        white-space: nowrap;
      }
      html body[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-customer > button {
        min-width: 72px;
        white-space: nowrap;
      }
      html body[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-grid,
      html body.windows-shell[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-rows: minmax(0, 1fr) 340px !important;
      }
      html body[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-receipt,
      html body.windows-shell[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-receipt {
        min-height: 0 !important;
      }
      html body[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-checkout,
      html body.windows-shell[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-checkout {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        grid-template-rows: minmax(0, 1fr) auto !important;
        overflow: hidden !important;
      }
      html body[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-customer { grid-column: 1; grid-row: 1; overflow-y: auto; }
      html body[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-payment { grid-column: 2; grid-row: 1; overflow-y: auto; border-right: 0 !important; }
      html body[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-summary { grid-column: 1; grid-row: 2; border-bottom: 0 !important; }
      html body[data-active-view="pos"]:not(.simple-trade-mode) #view-pos .pos-standard-checkout-actions { grid-column: 2; grid-row: 2; }
    }

#view-settings .device-settings-tabs { grid-template-columns: repeat(auto-fit, minmax(144px, 1fr)); }
    .device-theme-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
    .device-theme-card { position: relative; display: grid; min-width: 0; gap: 12px; padding: 13px; border: 1px solid var(--workspace-line, rgba(255,255,255,.14)); border-radius: 9px; background: var(--theme-panel, #111315); color: var(--ink); text-align: left; cursor: pointer; }
    .device-theme-card:hover { border-color: rgba(255,255,255,.34); transform: translateY(-1px); }
    .device-theme-card.active { border-color: rgba(255,255,255,.65); box-shadow: inset 0 0 0 1px rgba(255,255,255,.09), 0 12px 28px rgba(0,0,0,.18); }
    .device-theme-preview { display: grid; grid-template-columns: 28% minmax(0,1fr); grid-template-rows: 20px 22px 22px; gap: 6px; min-height: 92px; padding: 8px; border: 1px solid rgba(255,255,255,.16); border-radius: 7px; overflow: hidden; }
    .device-theme-preview::before { grid-row: 1 / 4; border-radius: 4px; background: var(--preview-sidebar); content: ""; }
    .device-theme-preview i, .device-theme-preview b, .device-theme-preview em { display: block; border: 1px solid var(--preview-line); border-radius: 4px; background: var(--preview-panel); }
    .device-theme-preview i { grid-column: 2; }
    .device-theme-preview b { grid-column: 2; width: 72%; }
    .device-theme-preview em { grid-column: 2; width: 88%; }
    .device-theme-preview.is-carbon { --preview-sidebar:#08090b; --preview-panel:#15181b; --preview-line:#34383d; background:#050607; }
    .device-theme-preview.is-graphite { --preview-sidebar:#2d3942; --preview-panel:#50616d; --preview-line:#80919d; background:#3a4852; }
    .device-theme-preview.is-soft_graphite { --preview-sidebar:#1b1e22; --preview-panel:#3a3f45; --preview-line:#676e76; background:#292d31; }
    .device-theme-copy { display: grid; min-width: 0; gap: 4px; }
    .device-theme-copy small { color: var(--muted); font-size: 10px; font-weight: 750; text-transform: uppercase; }
    .device-theme-copy strong { font-size: 16px; }
    .device-theme-copy > span { color: var(--muted); font-size: 12px; line-height: 1.45; }
    .device-theme-check { position: absolute; top: 20px; right: 20px; display: grid; width: 23px; height: 23px; place-items: center; border: 1px solid rgba(255,255,255,.32); border-radius: 50%; background: rgba(5,6,7,.82); color: #fff; font-size: 13px; font-style: normal; }
    .device-theme-note { display: grid; gap: 4px; padding: 13px 15px; border: 1px solid var(--workspace-line, rgba(255,255,255,.14)); border-radius: 8px; background: var(--theme-control, #090b0d); }
    .device-theme-note span { color: var(--muted); font-size: 12px; line-height: 1.45; }

    body[data-ui-theme="graphite"], body[data-ui-theme="soft_graphite"] { background: var(--workspace-bg) !important; color: var(--ink) !important; }
    body[data-ui-theme="graphite"] #appRoot > .sidebar,
    body[data-ui-theme="soft_graphite"] #appRoot > .sidebar { background: var(--sidebar-bg) !important; }
    body[data-ui-theme="graphite"] #appRoot > .main,
    body[data-ui-theme="soft_graphite"] #appRoot > .main,
    body[data-ui-theme="graphite"] :where(.view, .login-screen),
    body[data-ui-theme="soft_graphite"] :where(.view, .login-screen) { background-color: var(--workspace-bg) !important; }
    body[data-ui-theme="graphite"] :where(.panel, .stat, .modal, .child-modal, .login-card, .settings-card, .device-overview-card, .device-config-card, .device-website-card, .device-panel-heading, .dashboard-surface, .dashboard-kpi-card, .dashboard-shift-card, .pos-standard-receipt, .pos-standard-checkout, .kassa-order-list-panel, .kassa-order-inspector, .kassa-documents-workspace),
    body[data-ui-theme="soft_graphite"] :where(.panel, .stat, .modal, .child-modal, .login-card, .settings-card, .device-overview-card, .device-config-card, .device-website-card, .device-panel-heading, .dashboard-surface, .dashboard-kpi-card, .dashboard-shift-card, .pos-standard-receipt, .pos-standard-checkout, .kassa-order-list-panel, .kassa-order-inspector, .kassa-documents-workspace) { border-color: var(--line) !important; background: var(--theme-panel) !important; color: var(--ink) !important; }
    body[data-ui-theme="graphite"] :where(.topline, .device-settings-heading, .device-settings-tabs, .nav button.active, .pos-standard-head, .kassa-orders-tabs),
    body[data-ui-theme="soft_graphite"] :where(.topline, .device-settings-heading, .device-settings-tabs, .nav button.active, .pos-standard-head, .kassa-orders-tabs) { border-color: var(--line) !important; background: var(--theme-panel-2) !important; color: var(--ink) !important; }
    body[data-ui-theme="graphite"] :where(input, select, textarea, .device-choice-row button, .pos-standard-product-search, .pos-standard-loyalty-toggle, .kassa-order-search, .device-interface-preview, .device-overview-note),
    body[data-ui-theme="soft_graphite"] :where(input, select, textarea, .device-choice-row button, .pos-standard-product-search, .pos-standard-loyalty-toggle, .kassa-order-search, .device-interface-preview, .device-overview-note) { border-color: var(--line) !important; background: var(--theme-control) !important; color: var(--ink) !important; }
    body[data-ui-theme="graphite"] :where(.muted, .device-panel-heading p, .device-theme-copy span, .device-overview-card small, .device-config-card small, .dashboard-home small, .pos-standard-shell small, .kassa-orders-workspace small),
    body[data-ui-theme="soft_graphite"] :where(.muted, .device-panel-heading p, .device-theme-copy span, .device-overview-card small, .device-config-card small, .dashboard-home small, .pos-standard-shell small, .kassa-orders-workspace small) { color: var(--muted) !important; }
    body[data-ui-theme="graphite"] :where(.topline h2, .topline strong, .device-settings-heading h3, .device-settings-heading strong, .device-panel-heading h3),
    body[data-ui-theme="soft_graphite"] :where(.topline h2, .topline strong, .device-settings-heading h3, .device-settings-heading strong, .device-panel-heading h3) { background: none !important; color: var(--ink) !important; -webkit-text-fill-color: var(--ink) !important; }
    body[data-ui-theme="graphite"] :where(.topline p, .topline small, .device-settings-heading small, .device-panel-heading p, .device-panel-heading span),
    body[data-ui-theme="soft_graphite"] :where(.topline p, .topline small, .device-settings-heading small, .device-panel-heading p, .device-panel-heading span) { color: var(--muted) !important; -webkit-text-fill-color: var(--muted) !important; }
    body[data-ui-theme="graphite"] :where(th, td),
    body[data-ui-theme="soft_graphite"] :where(th, td) { border-color: var(--line) !important; }

    .app-exit-modal .row-actions { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); }
    @media (max-width: 900px) {
      .device-theme-grid { grid-template-columns: 1fr; }
      .device-theme-card { grid-template-columns: minmax(120px, .55fr) minmax(0, 1fr); align-items: center; }
      .device-theme-preview { min-height: 82px; }
    }
    @media (max-width: 760px) {
      #view-settings .device-settings-tabs { display: flex; }
      .device-theme-card { grid-template-columns: 1fr; }
      .app-exit-modal .row-actions { grid-template-columns: 1fr; }
    }

body[data-ui-theme] {
      background:
        radial-gradient(circle at 84% -8%, var(--theme-glow), transparent 34%),
        var(--srm-bg-canvas) !important;
      color: var(--srm-text-primary) !important;
      scrollbar-color: var(--srm-bg-selected) var(--srm-bg-canvas);
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot,
    html body.srm-page[data-ui-theme] #appRoot#appRoot > .main,
    html body.srm-page[data-ui-theme] #appRoot#appRoot .view,
    html body.srm-page[data-ui-theme] #appRoot#appRoot :where(.dashboard-home, .pos-standard-shell, .simple-pos-workspace, .simple-reports-workspace, .document-workspace, .acceptance-workspace, .report-workspace, .profile-workspace, .kassa-workspace, .kassa-orders-workspace, .support-workspace),
    html body.srm-page[data-ui-theme] #loginScreen#loginScreen {
      background:
        radial-gradient(circle at 86% 0%, var(--theme-glow), transparent 32%),
        var(--srm-bg-canvas) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot > .sidebar {
      border-color: var(--srm-border) !important;
      background: linear-gradient(180deg, var(--srm-bg-sidebar), var(--srm-bg-surface)) !important;
      color: var(--srm-text-primary) !important;
      box-shadow: 14px 0 40px rgba(0, 0, 0, .22) !important;
    }

    html body.srm-page[data-ui-theme] :is(#appRoot#appRoot, #loginScreen#loginScreen) :where(
      .panel, .stat, .modal, .child-modal, .login-card, .auth-card, .auth-register-card,
      [class*="-panel"], [class*="-card"], [class*="-inspector"], [class*="-box"], [class*="-sheet"],
      [class*="-table-wrap"], [class*="-table-scroll"], [class*="-metric"],
      .notification-popover, .support-chat-widget, .table-shell, .table-wrap, .table-scroll,
      .pos-standard-receipt, .pos-standard-checkout, .simple-touch-browse, .simple-touch-cart,
      .simple-touch-checkout, .simple-touch-product, .simple-report-summary, .settings-tabs-panel,
      .stock-workspace-grid, .report-period-shell, .report-date-control, .panel-body
    ):not(:where(
      .receipt, .receipt *, #printRoot, #printRoot *, .label-sheet, .label-sheet *,
      .label-card-render, .label-card-render *, .document-print-preview, .document-print-preview *,
      .document-template-preview, .document-template-preview *, .document-template-table-preview, .document-template-table-preview *,
      .report-output-preview-sheet, .report-output-preview-sheet *, .stock-print-preview, .stock-print-preview *,
      .delivery-print-sheet, .delivery-print-sheet *, .legal-preview-body, .legal-preview-body *
    )) {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-surface) !important;
      color: var(--srm-text-primary) !important;
      box-shadow: var(--srm-shadow) !important;
    }

    html body.srm-page[data-ui-theme] :is(#appRoot#appRoot, #loginScreen#loginScreen) :where(
      .topline, .panel-head, .modal-head, .exit-modal-head, [class*="-heading"],
      [class*="-header"], [class*="-toolbar"], [class*="-tabs"], .tabs, .segmented,
      .sort-head, .display-head, .incoming-receipts-head, .kassa-workspace-head,
      .kassa-inspector-head, .kassa-workspace-inspector-head, .notification-popover-head
    ):not(:where(.receipt, .receipt *, #printRoot, #printRoot *, .document-template-preview, .document-template-preview *)) {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-surface-raised) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] :is(#appRoot#appRoot, #loginScreen#loginScreen) :where(
      input, select, textarea, .select-like, .search-box, [contenteditable="true"],
      .device-interface-preview, .device-overview-note, .pos-standard-product-search,
      .pos-standard-loyalty-toggle, .kassa-order-search, .kassa-workspace-search,
      .pos-standard-quantity > span
    ) {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-control) !important;
      color: var(--srm-text-primary) !important;
      box-shadow: none !important;
    }

    html body.srm-page[data-ui-theme] :is(#appRoot#appRoot, #loginScreen#loginScreen) :where(input, textarea)::placeholder {
      color: var(--srm-text-secondary) !important;
      opacity: .78;
    }

    html body.srm-page[data-ui-theme] :is(#appRoot#appRoot, #loginScreen#loginScreen) :where(
      button, .btn, [role="button"]
    ):not(:where(.primary, .danger, .success, .brand, .mobile-nav-toggle, .notification-bell, .modal-close)) {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-control) !important;
      color: var(--srm-text-primary) !important;
      box-shadow: none !important;
    }

    html body.srm-page[data-ui-theme] :is(#appRoot#appRoot, #loginScreen#loginScreen) :where(
      button, .btn, [role="button"], input, select, textarea, [contenteditable="true"]
    ):focus-visible {
      outline: 2px solid var(--srm-text-primary) !important;
      outline-offset: 2px !important;
    }

    html body.srm-page[data-ui-theme] :is(#appRoot#appRoot, #loginScreen#loginScreen) :where(
      button, .btn, [role="button"]
    ):not(:disabled):hover {
      border-color: var(--srm-text-secondary) !important;
      background: var(--srm-bg-hover) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] :is(#appRoot#appRoot, #loginScreen#loginScreen) :where(
      .btn.primary, button.primary, .simple-touch-complete, .pos-standard-complete,
      [data-action="sale-complete"], [data-action="simple-sale-complete"]
    ) {
      border-color: var(--srm-text-secondary) !important;
      background: var(--button-gradient) !important;
      color: #fff !important;
      box-shadow: 0 10px 24px rgba(0, 0, 0, .22) !important;
    }

    html body.srm-page[data-ui-theme] :is(#appRoot#appRoot, #loginScreen#loginScreen) :where(
      .nav button.active, button.active, .tab.active, [role="tab"][aria-selected="true"],
      [aria-pressed="true"], .selected, tr.selected, .device-theme-card.active
    ):not(:where(.receipt, .receipt *, #printRoot, #printRoot *)) {
      border-color: var(--srm-text-secondary) !important;
      background: var(--srm-bg-selected) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot :where(table, .sales-table, .shift-table, .summary-table, .settings-category-table, .settings-warehouse-table, .stock-workspace-table, .kassa-workspace-table, .kassa-order-table) {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-surface) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot :where(thead, th) {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-surface-raised) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot tbody tr {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-row) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot tbody tr:nth-child(even) { background: var(--srm-bg-row-alt) !important; }
    html body.srm-page[data-ui-theme] #appRoot#appRoot tbody tr:hover { background: var(--srm-bg-hover) !important; }
    html body.srm-page[data-ui-theme] #appRoot#appRoot :where(td, th) { border-color: var(--srm-border) !important; color: inherit !important; }

    html body.srm-page[data-ui-theme] #appRoot#appRoot :where(
      .event-row, .movement-row, .dashboard-sales-row, .product-pick-row, .counterparty-select-row,
      .held-receipt-row, .return-sale-row, .download-row, .kassa-document-row, .kassa-order-row,
      .kassa-workspace-row, .notification-popover-item, .support-thread-row, .simple-report-row,
      .simple-touch-cart-row, .pos-standard-cart-row, .document-template-row, .equipment-device-row,
      .remembered-login-row, .incoming-receipt-line
    ) {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-row) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot :where(
      .event-row, .movement-row, .dashboard-sales-row, .product-pick-row, .counterparty-select-row,
      .held-receipt-row, .return-sale-row, .download-row, .kassa-document-row, .kassa-order-row,
      .kassa-workspace-row, .notification-popover-item, .support-thread-row, .simple-report-row,
      .simple-touch-cart-row, .pos-standard-cart-row, .document-template-row, .equipment-device-row,
      .remembered-login-row, .incoming-receipt-line
    ):hover { background: var(--srm-bg-hover) !important; }

    html body.srm-page[data-ui-theme] :is(#appRoot#appRoot, #loginScreen#loginScreen) :where(h1, h2, h3, h4, h5, h6, strong, label, legend) {
      color: var(--srm-text-primary) !important;
      -webkit-text-fill-color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] :is(#appRoot#appRoot, #loginScreen#loginScreen) :where(.muted, .hint, .subtitle, small) {
      color: var(--srm-text-secondary) !important;
      -webkit-text-fill-color: var(--srm-text-secondary) !important;
    }

    body[data-ui-theme] :where(.modal-backdrop, .child-modal-backdrop) {
      background: var(--srm-overlay) !important;
      backdrop-filter: blur(8px) !important;
    }

    body[data-ui-theme] :where(.toast, .busy-indicator) {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-surface-raised) !important;
      color: var(--srm-text-primary) !important;
      box-shadow: var(--srm-shadow) !important;
    }

    body[data-ui-theme] :where(hr, .divider, .separator) { border-color: var(--srm-border) !important; }

    html body.srm-page[data-ui-theme] #appRoot#appRoot#appRoot :where(
      .dashboard-surface, .report-workspace.panel, .panel, .stock-inspector, .stock-master-panel,
      .shift-summary-panel, .receipt-wrap, .device-settings-footer, .kassa-order-fulfilment,
      .stock-list-footer, .kassa-order-table-wrap
    ) {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-surface) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot#appRoot :where(
      .panel-head, .pos-standard-head, .shift-summary-note, .kassa-workspace-inspector-grid > *,
      .kassa-client-avatar, .device-settings-heading, .device-settings-footer
    ) {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-surface-raised) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot#appRoot :where(
      .toggle-line, .report-date-control, .report-date-field, .report-period-presets > button,
      .pos-standard-quantity > span, .empty, .stock-workspace-empty
    ) {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-control) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot#appRoot :where(
      .diagnostics-list > *, .kassa-order-row, .kassa-order-mobile-card
    ) {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-row) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot#appRoot :where(
      .report-period-presets > button.active, .kassa-order-row.selected, .kassa-order-mobile-card.selected
    ) {
      border-color: var(--srm-text-secondary) !important;
      background: var(--srm-bg-selected) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot#appRoot tbody tr {
      background: var(--srm-bg-row) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot#appRoot tbody tr:nth-child(even) { background: var(--srm-bg-row-alt) !important; }
    html body.srm-page[data-ui-theme] #appRoot#appRoot#appRoot tbody td { background: transparent !important; }

    html body.srm-page[data-ui-theme] #appRoot#appRoot#appRoot #view-documents#view-documents .mobile-card-table tbody,
    html body.srm-page[data-ui-theme] #appRoot#appRoot#appRoot #view-documents#view-documents .mobile-card-table tbody tr {
      background: var(--srm-bg-row) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme][data-active-view="documents"] #appRoot #view-documents.view .mobile-card-table thead,
    html body.srm-page[data-ui-theme][data-active-view="documents"] #appRoot #view-documents.view .mobile-card-table thead tr {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-surface-raised) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot#appRoot #view-reports#view-reports :where(
      .report-period-shell, .report-toolbar, .report-scroll-body, .report-payment-panel
    ) {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-surface) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot#appRoot #view-reports#view-reports :where(
      input, .report-date-control, .report-date-field, .report-action-button
    ) {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-control) !important;
      color: var(--srm-text-primary) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot#appRoot #view-reports#view-reports .report-action-primary {
      border-color: var(--srm-text-secondary) !important;
      background: var(--button-gradient) !important;
      color: #fff !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot#appRoot #view-reports#view-reports .report-register-panel,
    html body.srm-page[data-ui-theme][data-active-view="reports"] #appRoot #view-reports.view .report-register-panel {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-surface) !important;
      color: var(--srm-text-primary) !important;
      box-shadow: var(--srm-shadow) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot#appRoot #view-reports#view-reports .tag,
    html body.srm-page[data-ui-theme][data-active-view="reports"] #appRoot #view-reports.view .tag {
      border-color: var(--srm-border) !important;
      background: var(--srm-bg-control) !important;
      color: var(--srm-text-primary) !important;
    }

    body[data-ui-theme] :where(
      .receipt, .label-sheet, .label-card-render, .document-print-preview,
      .document-template-preview, .document-template-table-preview, .report-output-preview-sheet,
      .stock-print-preview, .delivery-print-sheet, .legal-preview-body
    ) {
      background: #fff !important;
      color: #111 !important;
      color-scheme: light;
    }

    @media (prefers-reduced-motion: reduce) {
      body[data-ui-theme],
      html body.srm-page[data-ui-theme] #appRoot#appRoot > .main,
      html body.srm-page[data-ui-theme] #loginScreen#loginScreen { background: var(--srm-bg-canvas) !important; }
    }

html body.srm-page[data-ui-theme] #appRoot#appRoot :is(
      .kassa-workspace-search,
      .kassa-order-search,
      .stock-search-field
    ) {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
      min-height: 40px;
      padding: 0 12px;
      overflow: hidden;
      border: 1px solid var(--srm-border) !important;
      border-radius: 7px;
      background: var(--srm-bg-control) !important;
      color: var(--srm-text-secondary) !important;
      box-shadow: none !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot :is(
      .kassa-workspace-search,
      .kassa-order-search,
      .stock-search-field
    ):focus-within {
      border-color: var(--srm-text-secondary) !important;
      box-shadow: 0 0 0 2px color-mix(in srgb, var(--srm-text-primary) 12%, transparent) !important;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot :is(
      .kassa-workspace-search,
      .kassa-order-search,
      .stock-search-field
    ) > span {
      position: static !important;
      z-index: auto !important;
      flex: 0 0 auto;
      transform: none !important;
      color: var(--srm-text-secondary) !important;
      pointer-events: none;
    }

    html body.srm-page[data-ui-theme] #appRoot#appRoot :is(
      .kassa-workspace-search,
      .kassa-order-search,
      .stock-search-field
    ) > input {
      flex: 1 1 auto;
      width: 100%;
      min-width: 0;
      min-height: 38px;
      padding: 0 !important;
      border: 0 !important;
      border-radius: 0 !important;
      outline: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
    }

.sidebar-account-logout {
      width: 100%;
      min-height: 38px;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      margin-top: 7px;
      border: 1px solid color-mix(in srgb, var(--srm-danger) 52%, var(--srm-border));
      border-radius: 8px;
      background: color-mix(in srgb, var(--srm-danger) 14%, var(--srm-bg-control));
      color: #ffd9dd;
      font-weight: 800;
    }

    .trade-onboarding-modal {
      width: min(500px, calc(100vw - 24px)) !important;
      max-height: min(560px, calc(100dvh - 32px)) !important;
      overflow: hidden !important;
    }
    .trade-onboarding-card { min-height: 280px; display: grid; grid-template-rows: auto 1fr; }
    .trade-onboarding-card .panel-body { min-height: 0; display: grid; grid-template-rows: auto minmax(96px, 1fr) auto; }
    .trade-onboarding-card [data-onboarding-text] { min-height: 96px; }
    .trade-onboarding-card :where(h3, p, button) { transition: color 140ms ease, opacity 140ms ease, background-color 140ms ease; }

    .report-output-mobile-actions { display: grid; gap: 10px; }
    .report-output-mobile-actions > p { margin: 0; color: var(--srm-text-secondary); line-height: 1.5; }
    .report-output-mobile-actions dl { display: grid; gap: 8px; margin: 0 0 4px; }
    .report-output-mobile-actions dl > div { min-width: 0; display: grid; grid-template-columns: 80px minmax(0, 1fr); gap: 10px; padding: 9px 10px; border: 1px solid var(--srm-border); border-radius: 7px; background: var(--srm-bg-control); }
    .report-output-mobile-actions :where(dt, dd) { min-width: 0; margin: 0; overflow-wrap: anywhere; }
    .report-output-mobile-actions dt { color: var(--srm-text-secondary); }

    html body.srm-page[data-ui-theme] :is(#appRoot#appRoot, #loginScreen#loginScreen) :where(
      .cart-discount-button, .cart-remove-button, .pos-standard-remove, .simple-touch-remove,
      .auth-recovery-link, .profile-security-row, .profile-preference-grid > div,
      .support-compose-card label, .support-reply-box, .shift-table .row-actions,
      .report-register-panel .row-actions, .download-row .row-actions, .equipment-device-row,
      .current-workplace-card, .stock-filter-row, .stock-list-footer
    ) {
      background-image: none !important;
      box-shadow: none !important;
    }
    html body.srm-page[data-ui-theme] #appRoot :where(.row-actions, .cart-item-actions, .profile-security-row, .support-compose-card label)::before,
    html body.srm-page[data-ui-theme] #appRoot :where(.row-actions, .cart-item-actions, .profile-security-row, .support-compose-card label)::after {
      content: none !important;
      display: none !important;
    }
    html body.srm-page[data-ui-theme] #view-pos .cart-remove-button > span { transform: none !important; }

    html body.srm-page[data-ui-theme] #loginScreen .login-card :where(
      label, .auth-login-remember, .account-login-history-field, .auth-password-field,
      .auth-inline-actions, .store-login-actions
    ) {
      background: transparent !important;
      background-image: none !important;
      box-shadow: none !important;
      outline: 0 !important;
    }
    html body.srm-page[data-ui-theme] #loginScreen#loginScreen .auth-recovery-link {
      padding: 3px 0 !important;
      border: 0 !important;
      background: transparent !important;
      background-image: none !important;
      box-shadow: none !important;
      color: var(--srm-text-primary) !important;
    }

    #appRoot .view:not(.hidden) { animation: srmViewEnter 160ms ease-out both; }
    @keyframes srmViewEnter { from { opacity: .985; transform: translateY(2px); } to { opacity: 1; transform: none; } }

    @media (max-width: 760px) {
      html, body { width: 100%; min-height: 100%; overflow: hidden !important; }
      body.android-shell #appRoot { height: 100dvh !important; min-height: 100dvh !important; overflow: hidden !important; }
      body.android-shell #tradeMain {
        height: 100dvh !important;
        min-height: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior-y: contain;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
      }
      body.android-shell .trade-onboarding-modal {
        width: min(420px, calc(100vw - 28px)) !important;
        max-height: min(440px, calc(100dvh - 40px)) !important;
        margin: auto !important;
        inset: auto !important;
        border-radius: 13px !important;
      }
      body.android-shell .trade-onboarding-card { min-height: 258px; }
      body.android-shell .trade-onboarding-card .modal-head { min-height: 68px !important; padding: 13px 15px !important; }
      body.android-shell .trade-onboarding-card .panel-body { padding: 13px 15px 15px !important; gap: 10px !important; grid-template-rows: auto minmax(78px, 1fr) auto; }
      body.android-shell .trade-onboarding-card [data-onboarding-text] { min-height: 78px; max-height: 126px; overflow-y: auto; font-size: 13.5px !important; line-height: 1.48 !important; }
      body.android-shell .trade-onboarding-actions { align-items: stretch; }
      body.android-shell .trade-onboarding-actions > div { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; }
      body.android-shell .trade-onboarding-actions .btn { min-height: 40px !important; padding-inline: 10px !important; }

      body.android-shell .topline {
        min-height: 58px !important;
        padding: 8px 10px !important;
        border-radius: 10px !important;
        gap: 8px !important;
      }
      body.android-shell .topline > div:first-child { min-width: 0; }
      body.android-shell .topline h2 { font-size: 18px !important; line-height: 1.1 !important; }
      body.android-shell .topline p { display: none !important; }
      body.android-shell .topline-tools { gap: 5px !important; }
      body.android-shell :where(.top-interface-mode, .top-language-switch) { min-height: 38px !important; }
      body.android-shell :where(.top-interface-mode button, .top-language-switch button, .help-context-button) { min-height: 38px !important; height: 38px !important; padding: 0 9px !important; }
      body.android-shell .top-interface-mode > span { display: none !important; }

      body.android-shell .stock-workspace-head { grid-template-columns: 1fr !important; gap: 8px !important; padding: 11px !important; }
      body.android-shell .stock-warehouse-control { width: 100%; grid-template-columns: auto minmax(0, 1fr); align-items: center; }
      body.android-shell .stock-mode-tabs { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px !important; padding: 5px !important; }
      body.android-shell .stock-mode-tabs button { min-height: 38px !important; padding: 6px 8px !important; }
      body.android-shell .stock-filter-row { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; gap: 6px !important; padding: 7px !important; }
      body.android-shell .stock-filter-row .stock-search-field { grid-column: 1 / -1; min-height: 40px !important; }
      body.android-shell .stock-filter-row select { width: 100% !important; min-width: 0 !important; min-height: 38px !important; padding: 6px 30px 6px 9px !important; }
      body.android-shell .stock-filter-row .icon-btn { width: 40px !important; min-width: 40px !important; height: 38px !important; min-height: 38px !important; padding: 0 !important; }
      body.android-shell .stock-list-footer { display: flex !important; align-items: center; justify-content: space-between; gap: 8px; padding: 8px !important; }
      body.android-shell .stock-all-toggle { width: auto !important; min-width: 0 !important; min-height: 34px !important; margin: 0 !important; padding: 5px 8px !important; }
      body.android-shell .stock-all-toggle input { width: 18px !important; height: 18px !important; min-height: 18px !important; }

      body.android-shell #view-pos :where(.pos-standard-shell, .simple-pos-workspace),
      body.android-shell #view-stock,
      body.android-shell #view-reports,
      body.android-shell #view-shifts,
      body.android-shell #view-profile,
      body.android-shell #view-support { min-height: 0 !important; overflow: visible !important; scroll-margin-top: 0; }
      body.android-shell #view-reports :where(.report-scroll-body, .report-register-panel, .report-period-shell) { overflow: visible !important; max-height: none !important; }
      body.android-shell #view-reports::before,
      body.android-shell #view-reports::after { content: none !important; display: none !important; }

      body.android-shell .toast {
        left: 8px !important;
        right: 8px !important;
        bottom: calc(var(--android-safe-bottom) + 66px) !important;
        width: auto !important;
        max-width: none !important;
        min-height: 46px;
        justify-content: center;
        z-index: 5000 !important;
      }
      body.android-shell .sidebar-account-logout { display: flex !important; }
      body.android-shell .report-output-mobile-modal { width: min(430px, calc(100vw - 24px)) !important; }
    }

    @media (prefers-reduced-motion: reduce) {
      #appRoot .view:not(.hidden) { animation: none !important; }
      html { scroll-behavior: auto !important; }
    }

/* Compact controls keep all labels inside their own hit target. */
    .simple-touch-quick-switch { min-width: 0 !important; }
    .simple-touch-quick-switch button {
      width: 100% !important;
      min-width: 0 !important;
      padding-inline: 6px !important;
      overflow: hidden !important;
      text-align: center !important;
      text-overflow: ellipsis !important;
      white-space: nowrap !important;
    }

    #view-pos .pos-standard-payment-types:not(.simple-touch-payment-types) button {
      min-height: 48px !important;
      padding: 7px 8px !important;
      gap: 6px !important;
    }
    #view-pos .pos-standard-payment-types:not(.simple-touch-payment-types) button svg { width: 18px !important; height: 18px !important; }
    #view-pos .pos-standard-checkout-actions > div button { min-height: 38px !important; padding: 7px 9px !important; }
    #view-pos .pos-standard-cart-footer [data-action="pos-hold"] {
      flex: 0 0 auto !important;
      min-width: 154px !important;
      white-space: nowrap !important;
    }
    #view-pos .pos-standard-cart-footer [data-action="pos-hold"] span { white-space: nowrap !important; }

    /* Shift totals remain visible before long operation/history lists on narrower workspaces. */
    #view-shifts .shift-kpi-grid {
      grid-template-columns: minmax(86px, .58fr) repeat(3, minmax(128px, 1fr)) minmax(112px, .78fr) !important;
      gap: 8px !important;
    }
    #view-shifts .shift-kpi-grid article { min-height: 64px !important; padding: 9px 11px !important; }
    #view-shifts .shift-kpi-grid article:first-child,
    #view-shifts .shift-kpi-grid article:last-child { padding-inline: 9px !important; }
    #view-shifts .shift-kpi-grid span { margin-bottom: 4px !important; }
    #view-shifts .shift-kpi-grid strong { font-size: 18px !important; }
    #view-shifts .shift-status-card.closed { max-width: 960px; }
    @media (max-width: 1180px) {
      #view-shifts .shift-workspace-grid { grid-template-columns: minmax(0, 1fr) !important; }
      #view-shifts .shift-summary-panel { order: -1; }
      #view-shifts .shift-status-card.closed { max-width: none; }
    }
    @media (max-width: 760px) {
      #view-shifts .shift-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
      #view-shifts .shift-kpi-grid article:last-child { grid-column: auto !important; }
    }

    /* One neutral two-arrow synchronisation glyph, animated only while work is active. */
    body.sync-in-progress [data-action="manual-sync"] svg,
    [data-action="manual-sync"].syncing svg {
      animation: srm-manual-sync-spin .8s linear infinite !important;
      transform-origin: 50% 50% !important;
    }
    [data-action="manual-sync"] svg { color: currentColor !important; filter: grayscale(1); }

    /* Remove accidental nested icon tiles from the settings heading. */
    .device-overview-link > span:first-child {
      border: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
    }

    /* Closed customer tickets stay readable but cannot receive another reply. */
    .support-readonly-note {
      margin: 10px 12px;
      padding: 10px 12px;
      border: 1px solid var(--srm-border, rgba(255,255,255,.15));
      border-radius: 8px;
      background: var(--srm-bg-control, #0d1013);
      color: var(--srm-text-secondary, #b9bec6);
      font-size: 12px;
      line-height: 1.45;
    }
    .support-conversation-card > footer { display: flex; flex-wrap: wrap; gap: 8px; }

    .profile-phone-modal .row-actions {
      display: grid !important;
      grid-template-columns: minmax(0, 1.45fr) minmax(96px, .75fr) !important;
      gap: 8px !important;
    }
    .profile-phone-modal .row-actions .btn {
      width: 100% !important;
      min-width: 0 !important;
      padding-inline: 8px !important;
      white-space: nowrap !important;
    }
    @media (max-width: 350px) {
      .profile-phone-modal .row-actions { grid-template-columns: 1fr !important; }
    }

    /* Keep the Windows notification glyph centered and away from the outer edge. */
    body.windows-shell .notification-bell-sidebar {
      top: 17px !important;
      right: 20px !important;
      align-items: center !important;
      justify-items: center !important;
      line-height: 0 !important;
    }
    body.windows-shell .notification-bell-sidebar > svg { display: block; margin: 0 !important; transform: none !important; }
    @media (max-width: 600px) {
      html body #loginScreen .login-card.auth-card {
        width: calc(100% - 20px) !important;
        margin-inline: auto !important;
        padding: 18px !important;
        gap: 12px !important;
      }
      html body #loginScreen .auth-card .login-logo { width: 44px !important; height: 44px !important; }
      html body #loginScreen .auth-card h2 { font-size: 24px !important; margin: 0 !important; }
      html body #loginScreen .auth-card > p { font-size: 13px !important; line-height: 1.4 !important; margin: 0 !important; }
      html body #loginScreen .auth-card .auth-role-guide { display: none !important; }
      html body #loginScreen#loginScreen .login-card.auth-card label.auth-login-remember {
        display: flex !important; flex-direction: row !important; align-items: center !important;
        font-size: 12px !important; line-height: 1.4 !important;
      }
      html body #loginScreen .auth-card .auth-login-remember span { min-width: 0; }
    }