:root,
      .theme-festive {
        --primary-color: #c00;
        --primary-color-hover: #a00;
        --primary-text-color: #c00;
        --primary-bg-light: #fff2f2;
        --primary-border-color: #ffaaaa;
        --primary-ring-color: #ef4444;
        /* red-500 */
        --header-text-color: #b91c1c;
        /* red-700 */
        --button-bg-color: #dc2626;
        /* red-600 */
        --button-bg-hover: #b91c1c;
        /* red-700 */
        --button-border-color: #dc2626;
        /* red-600 */
        --button-text-color: #dc2626;
        /* red-600 */
        --link-hover-bg: #fee2e2;
        /* red-100 */
        --total-text-color: #ef4444;
        /* red-500 */
      }

      .theme-solemn {
        --primary-color: #374151;
        /* gray-700 */
        --primary-color-hover: #1f2937;
        /* gray-800 */
        --primary-text-color: #111827;
        /* gray-900 */
        --primary-bg-light: #f3f4f6;
        /* gray-100 */
        --primary-border-color: #d1d5db;
        /* gray-300 */
        --primary-ring-color: #4b5563;
        /* gray-600 */
        --header-text-color: #1f2937;
        /* gray-800 */
        --button-bg-color: #4b5563;
        /* gray-600 */
        --button-bg-hover: #374151;
        /* gray-700 */
        --button-border-color: #4b5563;
        /* gray-600 */
        --button-text-color: #4b5563;
        /* gray-600 */
        --link-hover-bg: #e5e7eb;
        /* gray-200 */
        --total-text-color: #374151;
        /* gray-700 */
      }

      body {
        font-family: "Inter", "Microsoft YaHei", sans-serif;
      }

      .gift-book-frame {
        border: 4px solid var(--primary-color);
        padding: 22px;
        border-radius: 10px;
        background-color: var(--primary-bg-light);
        position: relative;
        background-size: 15px 15px;
        display: flex;
        flex-direction: column;
        height: 100%;
        cursor: default;
        min-height: 450px;
      }

      #gift-book-content,
      .print-book-content {
        display: flex;
        flex-direction: column;
        border-top: 2px solid var(--primary-border-color);
        flex: 1;
      }

      .gift-book-row {
        display: flex;
        width: 100%;
        flex: 3;
      }

      .gift-book-row > .book-cell {
        flex: 1;
        min-width: 0;
        position: relative;
        line-height: 1.2;
      }

      .book-cell {
        border-right: 2px solid var(--primary-border-color);
        border-bottom: 2px solid var(--primary-border-color);
        display: flex;
        justify-content: center;
        align-items: center;
        writing-mode: vertical-lr;
        text-orientation: mixed;
        font-weight: bold;
        font-size: clamp(16px, 1.6vw, 25px);
        letter-spacing: 7px;
        font-family: "KaiTi";
        padding: 10px 0;
        max-height: 100%;
        overflow: hidden;
        max-height: 400px;
      }

      .book-cell:first-child {
        border-left: 2px solid var(--primary-border-color);
      }

      .name-cell:hover {
        background-color: var(--link-hover-bg);
      }

      .name-cell .name {
        color: #333;
        padding: 15px 0;
        cursor: pointer;
        flex: 5;
        text-align: center;
        white-space: nowrap;
        min-height: 8em;
      }

      .type-cell {
        color: var(--primary-color);
        font-size: clamp(16px, 1.6vw, 22px);
        padding: 10px 4px;
        font-family: SimSun, "宋体", NSimSun, serif;
        font-weight: bold;
      }

      .amount-cell {
        color: #333;
        justify-content: space-around;
        cursor: pointer;
      }

      .amount-chinese {
        letter-spacing: 1.5px;
        flex: 6;
        text-align: center;
        padding: 15px 0;
        height: 100%;
        overflow: hidden;
      }

      .amount-numeric,
      .mark {
        color: #555;
        letter-spacing: 1px;
        writing-mode: lr;
        line-height: 3;
        font-size: clamp(10px, 1.3vw, 14px);
        flex: 1;
      }

      .mark {
        color: var(--primary-color);
        white-space: nowrap;
        line-height: 1.2;
        height: 2.5em;
        display: flex;
        flex-direction: column;
        justify-content: center;
        position: absolute;
        bottom: 1vw;
      }
      .themed-edit-area {
        background-color: var(--primary-bg-light);
        border: 1px solid var(--primary-border-color);
        padding: 1rem;
        border-radius: 0.5rem;
        width: 100%;
      }

      input[type="number"]::-webkit-inner-spin-button,
      input[type="number"]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
      }

      input[type="number"] {
        -moz-appearance: textfield;
      }

      .themed-header {
        color: var(--header-text-color);
      }

      .themed-button-primary {
        background-color: var(--button-bg-color);
        color: white;
      }

      .themed-button-primary:hover {
        background-color: var(--button-bg-hover);
      }

      .themed-button-secondary {
        border-color: var(--button-border-color);
        color: var(--button-text-color);
      }

      .themed-button-secondary:hover {
        background-color: var(--link-hover-bg);
      }

      .themed-ring:focus {
        --tw-ring-color: var(--primary-ring-color) !important;
      }

      .themed-text-radio {
        color: var(--button-text-color);
      }

      .themed-peer-checked {
        --tw-bg-opacity: 1;
        background-color: var(--button-bg-color);
      }

      .themed-text {
        color: var(--total-text-color);
      }

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

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

      .themed-dropdown-text:hover {
        color: var(--primary-color-hover);
      }

      .peer:checked ~ .toggle-bg {
        background-color: var(--button-bg-color);
      }
      body.printing #app-container {
        display: none;
      }
      #modal.modal-large {
        max-width: 1200px;
        width: 95vw;
      }
      .gridjs-wrapper {
        overflow-x: hidden;
      }
      td.gridjs-td,
      th.gridjs-th {
        padding: 6px;
      }
      @media (max-width: 700px) {
        .amount-numeric,
        .mark {
          position: relative;
          writing-mode: tb;
        }
        .gridjs-wrapper {
          overflow-x: auto;
          height: 30vh !important;
        }
      }
      @media print {
        @page {
          size: 29.7cm 21cm;
          margin: 0;
        }

        body * {
          visibility: hidden;
          background-color: var(--primary-bg-light);
        }

        #print-view,
        #print-view * {
          visibility: visible;
        }

        #print-view {
          position: absolute;
          left: 0;
          top: 0;
          width: 100%;
          height: 100%;
        }

        .print-page {
          page-break-after: always;
          width: 100%;
          height: 100%;
          padding: 15mm;
          box-sizing: border-box;
          display: flex;
          flex-direction: column;
          background: url("./static/bg.webp") center/contain no-repeat, var(--primary-bg-light);
          overflow: hidden;
        }

        .print-cover-page {
          padding: 0;
          background: none; /* Override default page background for cover */
          justify-content: center;
          align-items: center;
          width: 100%;
          height: 100%;
        }
        .print-cover-page img {
          object-fit: cover;
          width: 100%;
          height: 100%;
        }
        /* --- End NEW --- */

        .print-header {
          text-align: center;
          margin-bottom: 20px;
          color: var(--primary-color);
          font-family: "KaiTi";
          font-weight: bold;
          font-size: 38px;
        }

        .print-footer {
          flex-shrink: 0;
          display: flex;
          justify-content: space-between;
          align-items: flex-end;
          font-size: 14px;
          padding: 10px 25px 0;
          margin-top: auto;
          font-family: "KaiTi";
        }

        .print-footer p {
          margin: 3px 0;
        }

        .print-footer-totals {
          text-align: right;
        }

        .print-footer .total-amount-print {
          font-weight: bold;
          font-size: 16px;
        }
        .print-footer-totals .total-amount-print:not(:last-child) {
          margin-right: 25px;
        }
        .print-footer {
          display: flex;
          justify-content: space-between;
          align-items: flex-end;
        }
        .print-page-number {
          text-align: center;
          flex-grow: 1;
        }
        .print-appendix-table {
          width: 100%;
          border-collapse: collapse;
          margin-top: 20px;
          font-size: 14px;
          text-align: center;
        }
        .print-appendix-table th,
        .print-appendix-table td {
          border: 1px solid var(--primary-border-color);
          padding: 8px;
          text-align: left;
          word-break: break-word;
          font-family: "KaiTi";
          font-weight: bold;
          font-size: 18px;
          letter-spacing: 2px;
          text-align: center;
        }
        .print-appendix-table th {
          background-color: var(--link-hover-bg);
          font-weight: bold;
        }
        .print-appendix-table th:nth-child(3) {
          width: 60%;
        }
        .amount-numeric {
          display: block;
        }
        .book-cell {
          font-size: 18pt !important;
        }
        .name-cell .name {
          padding: 0;
        }
        .name-cell:hover {
          background-color: transparent;
        }
        .book-cell:not(.type-cell) {
          font-family: "KaiTi";
        }
        .theme-solemn #print-view {
          filter: grayscale(100%);
        }
        .mark {
          display: none;
        }
        .print-book-content .gift-book-row:nth-child(3) {
          max-height: 82mm;
        }
      }
      .amount-chinese.scale,
      .name.scale {
        font-size: 14pt;
        letter-spacing: -2px;
        padding: 5px 0;
      }
      .amount-numeric.scale {
        letter-spacing: 0.5px;
        writing-mode: tb-rl;
      }