    .cal-table {
      display: grid;
      grid-template-columns: repeat(7, 1fr);
      gap: 3px;
      text-align: center;
      font-size: 10px;
    }
    .cal-th {
      color: #8C784C;
      font-weight: 700;
      padding-bottom: 4px;
    }
    .cal-td {
      padding: 4px 0;
      font-weight: 700;
      color: #4A3E25;
      width: 24px;
      height: 24px;
      margin: 0 auto;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .cal-td.muted { color: #C2B088; }
    .cal-td.dot-blue {
      background: #D3E7F8;
      color: #1B4567;
      font-weight: 800;
      border-radius: 50%;
      box-shadow: 2px 3.5px 7px rgba(80,120,160,0.28), -1px -1px 3px rgba(255,255,255,0.9), inset 0 1px 0 rgba(255,255,255,0.9); width: 26px; height: 26px;
    }
    .cal-td.dot-pink {
      background: #FCD6CF;
      color: #6E2F26;
      font-weight: 800;
      border-radius: 50%;
      box-shadow: 2px 3.5px 7px rgba(180,90,90,0.28), -1px -1px 3px rgba(255,255,255,0.9), inset 0 1px 0 rgba(255,255,255,0.9); width: 26px; height: 26px;
    }
    .cal-td.dot-yellow {
      background: #F7E4A8;
      color: #5B481D;
      font-weight: 800;
      border-radius: 50%;
      box-shadow: 1px 2px 4px rgba(190,170,110,0.3);
    }
    .cal-td.dot-orange {
      background: #FCE8D5;
      color: #6D3E14;
      font-weight: 800;
      border-radius: 50%;
      box-shadow: 1px 2px 4px rgba(200,150,110,0.3);
    }
    .cal-td.dot-purple {
      background: #DBCCE9;
      color: #442B5B;
      font-weight: 800;
      border-radius: 50%;
      box-shadow: 2px 3.5px 7px rgba(130,100,150,0.28), -1px -1px 3px rgba(255,255,255,0.9), inset 0 1px 0 rgba(255,255,255,0.9); width: 26px; height: 26px;
    }

    /* 3 Карточки на телефоне (Доходы, Расходы, Клиенты) */
    .action-cards {
      display: flex;
      flex-direction: column;
      gap: 11px;
      margin-bottom: auto;
    }
    .phone-card {
      min-height: 60px;
      border-radius: 20px;
      padding: 10px 14px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      cursor: pointer;
    }
    .card-income {
      background: #C8E2D2;
      color: #1E3F30;
      box-shadow: 6px 10px 22px -3px rgba(120, 160, 135, 0.35), -3px -3px 8px rgba(255, 255, 255, 0.8), inset 1px 1px 1.5px rgba(255, 255, 255, 0.9);
    }
    .card-expense {
      background: #FCD6CF;
      color: #58241B;
      box-shadow: 6px 10px 22px -3px rgba(185, 135, 130, 0.35), -3px -3px 8px rgba(255, 255, 255, 0.8), inset 1px 1px 1.5px rgba(255, 255, 255, 0.9);
    }
    .card-clients {
      background: #D3E7F8;
      color: #163B59;
      box-shadow: 6px 10px 22px -3px rgba(125, 150, 180, 0.35), -3px -3px 8px rgba(255, 255, 255, 0.8), inset 1px 1px 1.5px rgba(255, 255, 255, 0.9);
    }

    .card-icon-box {
      width: 42px;
      height: 42px;
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      box-shadow: 2px 3.5px 8px rgba(35, 30, 20, 0.12), -1.5px -1.5px 4px rgba(255, 255, 255, 0.95), inset 1px 1px 0 rgba(255, 255, 255, 0.95);
    }
    .arrow-btn {
      width: 44px;
      height: 44px;
      border-radius: 50%;
      background: #FAF2E7;
      border: none;
      font-size: 14px;
      font-weight: 900;
      color: #4A3E31;
      box-shadow: 4px 6px 12px rgba(150, 130, 110, 0.25), -2px -2px 6px rgba(255, 255, 255, 0.95);
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    /* Таб-бар мобилки: Сливочный песок, НЕ БЕЛЫЙ */
    .tabbar-box {
      background: #F5ECE0;
      border-radius: 26px;
      padding: 6px 8px;
      display: flex;
      justify-content: space-around;
      align-items: center;
      /* 3D-Бумага: свет сверху-слева, тень снизу-справа (Закон Ани) */
      box-shadow: 6px 12px 28px -4px rgba(140, 115, 85, 0.26), 2px 4px 8px rgba(140, 115, 85, 0.12), -2.5px -2.5px 8px rgba(255, 255, 255, 0.95), inset 1px 1.5px 0 rgba(255, 255, 255, 0.95) !important;
      border: none !important;
    }
    .tab-btn {
      font-family: 'Manrope', sans-serif !important;
      width: 44px;
      height: 44px;
      border-radius: 16px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #7A6C5B;
    }
    .tab-btn.active {
      background: #FDF1CC;
      color: #5B481D;
      box-shadow: 2px 3px 6px rgba(190,170,110,0.25);
    }

    /* ---------------- ДЕСКТОП (BENTO GRID) ---------------- */
    .desktop-window {
      background: #F8EFE4;
      border-radius: 28px;
      padding: 22px;
      box-shadow: 14px 22px 48px -6px rgba(160, 135, 110, 0.30), 4px 6px 14px rgba(160, 135, 110, 0.14), -4px -4px 14px rgba(255, 255, 255, 0.9);
      border: none;
      display: grid;
      grid-template-columns: 180px 1fr;
      gap: 20px;
    }
    @media (max-width: 820px) {
      .desktop-window { grid-template-columns: 1fr; }
    }

    .desk-nav-item {
      font-family: 'Manrope', sans-serif !important;
      min-height: 42px;
      border-radius: 14px;
      padding: 0 14px;
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 13px;
      font-weight: 800;
      color: #5A4E40;
      background: transparent;
      border: none;
      cursor: pointer;
      text-align: left;
    }
    .desk-nav-item.active {
      color: #5B481D;
      background: #FDF1CC;
      box-shadow: 4px 6px 14px -2px rgba(190, 170, 110, 0.3), -2px -2px 6px rgba(255, 255, 255, 0.9);
    }

    /* ВЕРХНИЙ РЯД BENTO: КАЛЕНДАРЬ НА 2 ШИРИНЫ (ДОХОД + РАСХОД), ПЛАТЕЖИ НА 1 ШИРИНУ (КАК КЛИЕНТЫ) */
    .bento-top-grid {
      display: grid;
      grid-template-columns: 2fr 1fr;
      gap: 16px;
    }
    @media (max-width: 720px) {
      .bento-top-grid { grid-template-columns: 1fr; }
    }

    /* НИЖНИЙ РЯД BENTO: 3 РАВНЫЕ КОЛОНКИ (ДОХОДЫ, РАСХОДЫ, КЛИЕНТЫ) */
    .bento-bottom-grid {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      gap: 16px;
    }
    @media (max-width: 900px) {
      .bento-bottom-grid { grid-template-columns: 1fr; }
    }

    /* Геометрия Главной при полном списке записей. */
    @media (min-width: 901px) {
      body { padding-top: 20px !important; padding-bottom: 20px !important; }
      #desktop-app > .desktop-window { height: calc(100dvh - 40px) !important; min-height: 0 !important; padding-bottom: 0 !important; }
      #desktop-app > .desktop-window > div:last-child { height: 100%; min-height: 0; display: flex; flex-direction: column; }
      #desk-view-main, #desk-view-main > div:first-child { height: 100%; min-height: 0; }
      #desk-view-main .bento-bottom-grid { flex: 1 1 auto; min-height: 0; margin-bottom: 24px; }
      #desk-view-main .bento-bottom-grid > .desk-income-card,
      #desk-view-main .bento-bottom-grid > .desk-expense-card,
      #desk-view-main .bento-bottom-grid > .desk-clients-card { display: flex; flex-direction: column; min-height: 0; }
      #desk-income-items, #desk-expense-items, #desk-clients-items {
        flex: 1 1 auto; min-height: 0; overflow-y: auto; scrollbar-width: none; -ms-overflow-style: none;
        margin: -16px; padding: 16px;
      }
      #desk-income-items::-webkit-scrollbar, #desk-expense-items::-webkit-scrollbar, #desk-clients-items::-webkit-scrollbar { display: none; width: 0; height: 0; }
    }
    .sub-item-income, .sub-item-expense, .sub-item-clients { min-width: 0; }
    .sub-item-income > div:first-child, .sub-item-expense > div:first-child, .sub-item-clients > div:first-child { min-width: 0; flex: 1 1 auto; }
    .sub-item-income > div:first-child > div:first-child, .sub-item-expense > div:first-child > div:first-child { flex: 0 0 10px; }
    .sub-item-income > div:first-child > div:last-child, .sub-item-expense > div:first-child > div:last-child, .sub-item-clients > div:first-child > div:last-child { min-width: 0; overflow: hidden; }
    .sub-item-income > div:first-child > div:last-child > div, .sub-item-expense > div:first-child > div:last-child > div, .sub-item-clients > div:first-child > div:last-child > div { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .sub-item-income > div:last-child, .sub-item-expense > div:last-child, .sub-arrow-clients { flex-shrink: 0; }
    .sub-item-income > div:last-child > span:first-child, .sub-item-expense > div:last-child > span:first-child { flex: 0 0 auto; white-space: nowrap; }
    @media (max-width: 900px) {
      #mobile-app { height: calc(100dvh - 24px) !important; min-height: 0 !important; }
      #mobile-app > div:first-child {
        height: calc(100% - 64px) !important; min-height: 0 !important; max-height: calc(100% - 64px) !important;
        flex: 0 0 calc(100% - 64px) !important; overflow-y: auto; overflow-x: hidden; padding-bottom: 0 !important;
      }
      #mob-view-main .bento-bottom-grid { margin-top: 16px; margin-bottom: 0; max-height: none; }
      #mob-view-main .bento-bottom-grid > div { min-height: 0; }
      #mob-view-main .bento-bottom-grid [id$="-items"] { flex: none; min-height: 0; max-height: none; overflow: visible; }
    }

    /* ДЕСКТОПНЫЙ КАЛЕНДАРЬ: ЖЁЛТЕНЬКИЙ / НЕЖНЫЕ СЛИВКИ #FDF1CC */
    .desk-calendar-card {
      background: #FDF1CC;
      border-radius: 22px;
      padding: 16px;
      box-shadow: 8px 14px 28px -4px rgba(185, 160, 110, 0.28), -4px -4px 14px rgba(255, 255, 255, 0.85), inset 1px 1px 1.5px rgba(255, 255, 255, 0.9);
      border: none;
    }

    /* ПЛАШКА «МОИ ПЛАТЕЖИ»: АБРИКОСОВЫЙ КРЕМ / ТЁПЛЫЙ ПЕСОК (НЕ БЕЛАЯ) */
    .desk-payments-card {
      background: #FCE8D5;
      border-radius: 22px;
      padding: 16px;
      box-shadow: 8px 14px 28px -4px rgba(185, 145, 110, 0.28), -4px -4px 14px rgba(255, 255, 255, 0.85), inset 1px 1px 1.5px rgba(255, 255, 255, 0.9);
      border: none;
    }

    /* БОЛЬШАЯ ПЛАШКА «ДОХОДЫ» — ЗЕЛЁНАЯ #C8E2D2 */
    .desk-income-card {
      background: #C8E2D2;
      border-radius: 22px;
      padding: 16px;
      box-shadow: 8px 14px 28px -4px rgba(100, 145, 120, 0.32), -4px -4px 14px rgba(255, 255, 255, 0.85), inset 0 1.5px 0 rgba(255, 255, 255, 0.85);
      border: none;
    }

    /* БОЛЬШАЯ ПЛАШКА «РАСХОДЫ» — РОЗОВАЯ #FCD6CF */
    .desk-expense-card {
      background: #FCD6CF;
      border-radius: 22px;
      padding: 16px;
      box-shadow: 8px 14px 28px -4px rgba(175, 120, 115, 0.32), -4px -4px 14px rgba(255, 255, 255, 0.85), inset 0 1.5px 0 rgba(255, 255, 255, 0.85);
      border: none;
    }

    /* БОЛЬШАЯ ПЛАШКА «КЛИЕНТЫ» — ГОЛУБАЯ #D3E7F8 */
    .desk-clients-card {
      background: #D3E7F8;
      border-radius: 22px;
      padding: 16px;
      box-shadow: 8px 14px 28px -4px rgba(110, 135, 165, 0.32), -4px -4px 14px rgba(255, 255, 255, 0.85), inset 0 1.5px 0 rgba(255, 255, 255, 0.85);
      border: none;
    }

    /* ВНУТРЕННИЕ ПЛАШКИ: СВЕТЛЫЕ 3D-БУМАЖЕЧКИ С МЯГКОЙ ТЕНЬЮ */
    .sub-item-income {
      background: #F0F8F3;
      border-radius: 14px;
      padding: 10px 12px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      box-shadow: 2px 4px 10px -1px rgba(50, 90, 70, 0.20), -1.5px -1.5px 5px rgba(255, 255, 255, 0.95), inset 0 1px 0 rgba(255, 255, 255, 0.95);
      font-size: 12px;
      cursor: pointer;
      border: none;
      transition: transform 0.15s ease, box-shadow 0.15s ease;
    }
