/* Stage 34 reports workspace: neutral graphite UI with shared WYSIWYG output. */
      html body #view-reports {
        --report-bg: #07090c;
        --report-surface: #0d1014;
        --report-surface-raised: #12161b;
        --report-surface-hover: #181d23;
        --report-line: rgba(229, 231, 235, .16);
        --report-line-strong: rgba(229, 231, 235, .28);
        --report-text: #f5f6f7;
        --report-muted: #a7adb6;
      }

      html body #view-reports > .report-workspace {
        border: 1px solid var(--report-line) !important;
        border-radius: 10px !important;
        background: var(--report-bg) !important;
        box-shadow: 0 20px 46px rgba(0, 0, 0, .28) !important;
      }

      html body #view-reports .report-period-shell {
        grid-template-columns: minmax(190px, .7fr) minmax(330px, 1.15fr) minmax(310px, 1fr) !important;
        gap: 12px !important;
        padding: 14px !important;
        border: 0 !important;
        border-bottom: 1px solid var(--report-line) !important;
        border-radius: 9px 9px 0 0 !important;
        background: #101318 !important;
      }

      html body #view-reports .report-period-icon,
      html body #view-reports .report-date-control .date-picker-button {
        border-color: var(--report-line) !important;
        background: #1a1e24 !important;
        color: #edf0f3 !important;
        box-shadow: none !important;
      }

      html body #view-reports .report-period-heading strong { color: var(--report-text) !important; }
      html body #view-reports .report-period-heading small,
      html body #view-reports .report-date-field > span:first-child { color: var(--report-muted) !important; }

      html body #view-reports .report-period-presets button,
      html body #view-reports .report-date-control {
        border: 1px solid var(--report-line) !important;
        background: #0b0e12 !important;
        color: #d7dbe0 !important;
        box-shadow: none !important;
      }

      html body #view-reports .report-period-presets button:hover,
      html body #view-reports .report-period-presets button:focus-visible,
      html body #view-reports .report-period-presets button.active {
        border-color: var(--report-line-strong) !important;
        background: #25292f !important;
        color: #ffffff !important;
        outline: none !important;
      }

      html body #view-reports .report-date-control:focus-within {
        border-color: rgba(255, 255, 255, .36) !important;
        outline: 2px solid rgba(255, 255, 255, .10) !important;
        outline-offset: 1px !important;
      }

      html body #view-reports .report-date-control input[type="date"] {
        color: var(--report-text) !important;
        -webkit-text-fill-color: var(--report-text) !important;
      }

      html body #view-reports .report-toolbar.report-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        padding: 12px 14px !important;
        border: 0 !important;
        border-bottom: 1px solid var(--report-line) !important;
        border-radius: 0 !important;
        background: #090b0e !important;
      }

      html body #view-reports .report-action-button,
      html body #view-reports .report-action-button.primary {
        min-width: 0 !important;
        min-height: 60px !important;
        display: grid !important;
        grid-template-columns: 34px minmax(0, 1fr) !important;
        align-items: center !important;
        justify-items: stretch !important;
        gap: 10px !important;
        padding: 9px 12px !important;
        border: 1px solid var(--report-line) !important;
        border-radius: 9px !important;
        background: #121519 !important;
        color: var(--report-text) !important;
        text-align: left !important;
        box-shadow: none !important;
      }

      html body #view-reports .report-action-button:hover,
      html body #view-reports .report-action-button:focus-visible,
      html body #view-reports .report-action-button.report-action-primary {
        border-color: var(--report-line-strong) !important;
        background: #1b1f24 !important;
        color: #ffffff !important;
        outline: none !important;
      }

      html body #view-reports .report-action-button.report-action-primary {
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06) !important;
      }

      html body #view-reports .report-action-button > span:last-child { min-width: 0; display: grid; gap: 2px; }
      html body #view-reports .report-action-button strong { color: #f7f8f9 !important; font-size: 13px; line-height: 1.2; }
      html body #view-reports .report-action-button small { color: #969da7 !important; font-size: 10.5px; line-height: 1.25; }
      html body #view-reports .report-action-icon {
        width: 34px;
        height: 34px;
        display: inline-grid;
        place-items: center;
        border: 1px solid var(--report-line);
        border-radius: 8px;
        background: #0b0d10;
        color: #e9ebee;
      }
      html body #view-reports .report-action-icon svg { width: 18px; height: 18px; }

      html body #view-reports .report-scroll-body {
        display: grid !important;
        gap: 14px !important;
        padding: 16px !important;
        background: #07090c !important;
      }

      html body #view-reports .report-summary-heading,
      html body #view-reports .report-payment-panel .panel-head,
      html body #view-reports .report-register-panel .panel-head {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 12px !important;
      }

      html body #view-reports .report-summary-heading > div,
      html body #view-reports .panel-head > div { min-width: 0; display: grid; gap: 3px; }
      html body #view-reports .report-summary-heading small,
      html body #view-reports .panel-head small {
        color: #858c95 !important;
        font-size: 9.5px !important;
        font-weight: 800 !important;
        line-height: 1 !important;
      }
      html body #view-reports .report-summary-heading h3,
      html body #view-reports .panel-head h3 { margin: 0 !important; color: #f7f8f9 !important; }
      html body #view-reports .report-summary-heading > span { color: var(--report-muted) !important; font-size: 12px; white-space: nowrap; }

      html body #view-reports .report-kpi-grid {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 10px !important;
      }
      html body #view-reports .report-kpi-card,
      html body #view-reports :is(.report-card-green, .report-card-blue, .report-card-gold, .report-card-red) {
        min-width: 0 !important;
        min-height: 92px !important;
        display: grid !important;
        align-content: center !important;
        gap: 5px !important;
        padding: 13px 14px !important;
        border: 1px solid var(--report-line) !important;
        border-radius: 9px !important;
        background: linear-gradient(180deg, #14171b, #0d0f12) !important;
        box-shadow: none !important;
      }
      html body #view-reports .report-kpi-card span { color: #aeb4bd !important; font-size: 11px !important; }
      html body #view-reports .report-kpi-card strong { color: #ffffff !important; font-size: clamp(18px, 1.6vw, 25px) !important; line-height: 1.05 !important; overflow-wrap: anywhere; }
      html body #view-reports .report-kpi-card small { color: #858c95 !important; font-size: 10px !important; }

      html body #view-reports .report-payment-panel,
      html body #view-reports .report-register-panel {
        margin: 0 !important;
        overflow: hidden !important;
        border: 1px solid var(--report-line) !important;
        border-radius: 9px !important;
        background: var(--report-surface) !important;
        box-shadow: none !important;
      }
      html body #view-reports .report-payment-panel .panel-head,
      html body #view-reports .report-register-panel .panel-head {
        min-height: 58px !important;
        padding: 11px 14px !important;
        border: 0 !important;
        border-bottom: 1px solid var(--report-line) !important;
        border-radius: 0 !important;
        background: #121519 !important;
      }
      html body #view-reports .report-payment-panel .panel-head > strong { color: #ffffff !important; font-variant-numeric: tabular-nums; white-space: nowrap; }
      html body #view-reports .report-payment-panel .panel-body,
      html body #view-reports .report-register-panel .panel-body { padding: 12px 14px !important; background: #0a0c0f !important; }

      html body #view-reports .report-payment-table {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        overflow: hidden !important;
        border: 1px solid var(--report-line) !important;
        border-radius: 8px !important;
        background: #090b0e !important;
      }
      html body #view-reports .report-payment-table tr,
      html body #view-reports .report-payment-table td {
        background: #0d1014 !important;
        color: #dfe2e6 !important;
        border-color: rgba(229, 231, 235, .10) !important;
      }
      html body #view-reports .report-payment-table tr:nth-child(even) td { background: #101318 !important; }
      html body #view-reports .report-payment-table td { height: 42px !important; padding: 9px 12px !important; }
      html body #view-reports .report-payment-table td:first-child { display: flex; align-items: center; gap: 9px; width: auto !important; }
      html body #view-reports .report-payment-table td:last-child { color: #ffffff !important; font-weight: 800; text-align: right; font-variant-numeric: tabular-nums; }
      html body #view-reports .report-payment-marker { width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: #aeb4bc; box-shadow: 0 0 0 3px rgba(174, 180, 188, .09); }
      html body #view-reports .report-payment-marker-return { background: #d98b8b; box-shadow: 0 0 0 3px rgba(217, 139, 139, .09); }

      html body #view-reports .report-count-badge {
        min-width: 30px;
        height: 26px;
        display: inline-grid;
        place-items: center;
        padding-inline: 8px;
        border: 1px solid var(--report-line);
        border-radius: 999px;
        background: #0a0c0f;
        color: #e9ebee !important;
        font-size: 11px;
        font-weight: 800;
      }
      html body #view-reports :is(.sales-table, .shift-table) {
        margin: 0 !important;
        border: 1px solid var(--report-line) !important;
        border-radius: 8px !important;
        background: #090b0e !important;
      }
      html body #view-reports :is(.sales-table, .shift-table) th { background: #171a1f !important; color: #f1f2f4 !important; border-color: var(--report-line) !important; }
      html body #view-reports :is(.sales-table, .shift-table) td { background: #0d1014 !important; color: #d9dde2 !important; border-color: rgba(229, 231, 235, .09) !important; }
      html body #view-reports :is(.sales-table, .shift-table) tr:nth-child(even) td { background: #101318 !important; }
      html body #view-reports :is(.sales-table, .shift-table) tbody tr:hover td { background: #181c21 !important; }

      html body #modalRoot .modal.report-template-modal {
        width: min(1180px, calc(100vw - 28px)) !important;
        max-height: calc(100dvh - 28px) !important;
        border: 1px solid rgba(229, 231, 235, .16) !important;
        border-radius: 10px !important;
        background: #090b0e !important;
      }
      html body #modalRoot .modal.report-template-modal > .modal-head {
        min-height: 68px !important;
        padding: 13px 16px !important;
        border-bottom: 1px solid rgba(229, 231, 235, .14) !important;
        background: #14171b !important;
      }
      html body #modalRoot .modal.report-template-modal > form.report-template-modal {
        display: flex !important;
        flex-direction: column !important;
        gap: 14px !important;
        padding: 14px !important;
        background: #090b0e !important;
      }
      html body #modalRoot .report-config-intro {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(190px, auto);
        align-items: center;
        gap: 14px;
        padding: 13px 14px;
        border: 1px solid rgba(229, 231, 235, .14);
        border-radius: 9px;
        background: #111419;
      }
      html body #modalRoot .report-config-intro > div { min-width: 0; display: grid; gap: 4px; }
      html body #modalRoot .report-config-intro small,
      html body #modalRoot .report-config-layout .settings-card > div > small { color: #858c95 !important; font-size: 9.5px; font-weight: 850; }
      html body #modalRoot .report-config-intro strong { color: #f7f8f9 !important; font-size: 16px; }
      html body #modalRoot .report-config-intro span:not(.report-config-state) { color: #aeb4bd !important; font-size: 11px; line-height: 1.35; }
      html body #modalRoot .report-config-state {
        justify-self: end;
        padding: 8px 11px;
        border: 1px solid rgba(229, 231, 235, .18);
        border-radius: 8px;
        background: #090b0e;
        color: #eef0f2;
        font-size: 11px;
        font-weight: 800;
      }
      html body #modalRoot .report-config-type { min-width: 210px; margin: 0 !important; }
      html body #modalRoot .modal.report-template-modal .settings-card {
        min-width: 0;
        display: grid;
        gap: 12px;
        margin: 0 !important;
        padding: 14px !important;
        border: 1px solid rgba(229, 231, 235, .14) !important;
        border-radius: 9px !important;
        background: #0e1115 !important;
        box-shadow: none !important;
      }
      html body #modalRoot .modal.report-template-modal .settings-card h4 { margin: 2px 0 0 !important; color: #f5f6f7 !important; }
      html body #modalRoot .modal.report-template-modal .settings-card p { margin: 4px 0 0 !important; color: #9ca3ad !important; font-size: 11px; line-height: 1.4; }
      html body #modalRoot .report-config-section-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 16px;
      }
      html body #modalRoot .report-config-quick-actions { display: flex; flex: 0 0 auto; gap: 7px; }
      html body #modalRoot .report-template-section-list { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 7px !important; }
      html body #modalRoot .report-template-section-item {
        min-height: 44px;
        display: grid !important;
        grid-template-columns: 40px 28px minmax(0, 1fr) 70px !important;
        align-items: center !important;
        gap: 8px !important;
        padding: 6px 7px !important;
        border: 1px solid rgba(229, 231, 235, .12) !important;
        border-radius: 8px !important;
        background: #090b0e !important;
      }
      html body #modalRoot .report-template-section-item:has(input[type="checkbox"]:checked) {
        border-color: rgba(229, 231, 235, .24) !important;
        background: #14171b !important;
      }
      html body #modalRoot .report-template-section-order { width: 40px !important; min-height: 30px !important; padding: 4px !important; text-align: center; }
      html body #modalRoot .report-template-section-toggle { min-height: 28px !important; display: grid !important; place-items: center !important; margin: 0 !important; padding: 0 !important; }
      html body #modalRoot .report-template-section-title { min-width: 0; display: grid; gap: 2px; color: #e9ebee !important; overflow-wrap: anywhere; }
      html body #modalRoot .report-template-section-title strong { color: #f2f3f5 !important; font-size: 11.5px; line-height: 1.2; }
      html body #modalRoot .report-template-section-title small { color: #858c95 !important; font-size: 9px; line-height: 1.2; }
      html body #modalRoot .report-template-section-actions { display: grid; grid-template-columns: repeat(2, 32px); gap: 5px; }
      html body #modalRoot .report-template-section-actions .btn { width: 32px !important; min-width: 32px !important; height: 30px !important; min-height: 30px !important; padding: 0 !important; }
      html body #modalRoot .report-custom-columns { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
      html body #modalRoot .report-custom-column {
        min-width: 0;
        display: grid;
        gap: 7px;
        padding: 9px !important;
        border: 1px solid rgba(229, 231, 235, .11) !important;
        border-radius: 8px !important;
        background: #090b0e !important;
      }
      html body #modalRoot .report-custom-column label { min-width: 0; margin: 0 !important; font-size: 10px !important; }
      html body #modalRoot .report-custom-column input,
      html body #modalRoot .modal.report-template-modal :is(input, select, textarea) {
        min-width: 0 !important;
        border-color: rgba(229, 231, 235, .16) !important;
        background: #080a0d !important;
        color: #f2f3f5 !important;
        box-shadow: none !important;
      }
      html body #modalRoot .report-cash-comment-editor { grid-column: 1 / -1; }
      html body #modalRoot .report-config-optional { padding: 0 !important; overflow: hidden; }
      html body #modalRoot .report-config-optional > summary {
        min-height: 54px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        padding: 11px 14px;
        cursor: pointer;
        list-style: none;
      }
      html body #modalRoot .report-config-optional > summary::-webkit-details-marker { display: none; }
      html body #modalRoot .report-config-optional > summary > span:first-child { display: grid; gap: 2px; }
      html body #modalRoot .report-config-optional > summary > span:last-child { color: #969da7; font-size: 10px; }
      html body #modalRoot .report-config-optional[open] > summary { border-bottom: 1px solid rgba(229, 231, 235, .12); background: #14171b; }
      html body #modalRoot .report-config-optional .report-custom-editor,
      html body #modalRoot .report-config-optional .report-cash-comment-fields { display: grid; gap: 10px; padding: 13px; }
      html body #modalRoot .report-modal-footer {
        position: sticky !important;
        bottom: 0 !important;
        z-index: 3 !important;
        min-height: 58px !important;
        margin: 0 !important;
        padding: 10px 0 0 !important;
        border-top: 1px solid rgba(229, 231, 235, .12) !important;
        background: #090b0e !important;
      }
      html body #modalRoot .report-modal-footer > .btn { flex: 0 0 auto !important; min-width: 108px !important; white-space: nowrap !important; }
      html body #modalRoot .report-modal-hint { min-width: 0; margin-right: auto; color: #969da7; font-size: 10.5px; line-height: 1.35; }
      html body #modalRoot .report-modal-footer .btn.primary {
        min-width: 174px !important;
        min-height: 40px !important;
        border-color: rgba(229, 231, 235, .28) !important;
        background: #24282e !important;
        color: #ffffff !important;
        box-shadow: none !important;
      }

      html body #modalRoot .modal.report-output-modal {
        width: min(1180px, calc(100vw - 28px)) !important;
        max-height: calc(100dvh - 28px) !important;
        border-radius: 10px !important;
        background: #090b0e !important;
      }
      html body #modalRoot .report-output-preview-layout {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 270px !important;
        gap: 14px !important;
        min-height: min(720px, calc(100dvh - 110px));
        padding: 14px !important;
      }
      html body #modalRoot .report-output-preview-sheet {
        min-width: 0;
        min-height: 620px;
        overflow: hidden;
        border: 1px solid rgba(229, 231, 235, .14);
        border-radius: 9px;
        background: #202328;
      }
      html body #modalRoot .report-output-preview-sheet .report-wysiwyg-preview { width: 100%; height: 100%; min-height: 620px; border: 0; background: #fff; }
      html body #modalRoot .report-output-summary {
        display: flex;
        flex-direction: column;
        gap: 16px;
        padding: 15px;
        border: 1px solid rgba(229, 231, 235, .14);
        border-radius: 9px;
        background: #101318;
      }
      html body #modalRoot .report-output-summary h4 { margin: 3px 0 0; color: #f5f6f7; }
      html body #modalRoot .report-output-summary p { margin: 4px 0 0; color: #a4abb4; font-size: 10.5px; line-height: 1.4; }
      html body #modalRoot .report-output-summary dl { display: grid; gap: 0; margin: 0; border-block: 1px solid rgba(229, 231, 235, .12); }
      html body #modalRoot .report-output-summary dl div { display: grid; grid-template-columns: 80px minmax(0, 1fr); gap: 8px; padding: 10px 0; border-bottom: 1px solid rgba(229, 231, 235, .09); }
      html body #modalRoot .report-output-summary dl div:last-child { border-bottom: 0; }
      html body #modalRoot .report-output-summary dt { color: #858c95; font-size: 10px; }
      html body #modalRoot .report-output-summary dd { min-width: 0; margin: 0; color: #eef0f2; font-size: 10.5px; overflow-wrap: anywhere; }
      html body #modalRoot .report-output-note { padding: 10px; border: 1px solid rgba(229, 231, 235, .11); border-radius: 8px; background: #090b0e; }
      html body #modalRoot .report-output-actions { display: grid; gap: 8px; margin-top: auto; }
      html body #modalRoot .report-output-actions .btn { width: 100%; min-height: 40px; }

      html body #modalRoot .report-output-selector-layout { gap: 12px !important; }
      html body #modalRoot .report-output-selector-intro { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 13px; border: 1px solid rgba(229,231,235,.14); border-radius: 9px; background: #111419; }
      html body #modalRoot .report-output-selector-intro > div { min-width: 0; display: grid; gap: 3px; }
      html body #modalRoot .report-output-selector-intro strong { color: #f4f5f6; }
      html body #modalRoot .report-output-selector-intro span { color: #969da7; font-size: 10px; }
      html body #modalRoot .report-output-selector { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
      html body #modalRoot .report-output-option { min-width: 0; display: grid; grid-template-columns: 24px minmax(0, 1fr) 28px; align-items: center; gap: 9px; min-height: 54px; margin: 0; padding: 9px 11px; border: 1px solid rgba(229,231,235,.13); border-radius: 8px; background: #0e1115; }
      html body #modalRoot .report-output-option > span { min-width: 0; display: grid; gap: 2px; }
      html body #modalRoot .report-output-option small { color: #8e959e; }
      html body #modalRoot .report-output-option b { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid rgba(229,231,235,.12); border-radius: 7px; color: #aeb4bd; font-size: 10px; }

      @media (max-width: 1100px) {
        html body #view-reports .report-period-shell { grid-template-columns: minmax(0, 1fr) minmax(300px, 1fr) !important; }
        html body #view-reports .report-date-grid { grid-column: 1 / -1; }
        html body #view-reports .report-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
        html body #modalRoot .report-output-preview-layout { grid-template-columns: minmax(0, 1fr) 230px !important; }
      }

      @media (max-width: 720px) {
        html body #view-reports .report-period-shell { grid-template-columns: minmax(0, 1fr) !important; padding: 11px !important; }
        html body #view-reports .report-date-grid { grid-column: auto; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
        html body #view-reports .report-toolbar.report-actions { grid-template-columns: minmax(0, 1fr) !important; padding: 10px !important; }
        html body #view-reports .report-action-button,
        html body #view-reports .report-action-button.primary { min-height: 52px !important; }
        html body #view-reports .report-scroll-body { gap: 11px !important; padding: 11px !important; }
        html body #view-reports .report-summary-heading { align-items: flex-start !important; flex-direction: column; }
        html body #view-reports .report-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
        html body #view-reports .report-kpi-card { min-height: 82px !important; padding: 10px !important; }
        html body #view-reports .report-kpi-card strong { font-size: 18px !important; }
        html body #view-reports .report-payment-panel .panel-head,
        html body #view-reports .report-register-panel .panel-head { min-height: 52px !important; padding: 9px 11px !important; }
        html body #view-reports .report-payment-panel .panel-body,
        html body #view-reports .report-register-panel .panel-body { padding: 9px !important; }
        html body #modalRoot .modal.report-template-modal { width: calc(100vw - 12px) !important; max-height: calc(100dvh - 12px) !important; }
        html body #modalRoot .report-config-intro { grid-template-columns: minmax(0, 1fr); }
        html body #modalRoot .report-config-state { justify-self: start; }
        html body #modalRoot .report-config-section-head { flex-direction: column; }
        html body #modalRoot .report-template-section-list { grid-template-columns: minmax(0, 1fr) !important; }
        html body #modalRoot .report-custom-columns { grid-template-columns: minmax(0, 1fr) !important; }
        html body #modalRoot .report-output-preview-layout { grid-template-columns: minmax(0, 1fr) !important; min-height: auto; }
        html body #modalRoot .report-output-preview-sheet,
        html body #modalRoot .report-output-preview-sheet .report-wysiwyg-preview { min-height: 62dvh; }
        html body #modalRoot .report-output-selector { grid-template-columns: minmax(0, 1fr); }
        html body #modalRoot .report-modal-footer { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
        html body #modalRoot .report-modal-footer .report-modal-hint { grid-column: 1 / -1; margin: 0; }
        html body #modalRoot .report-modal-footer > .btn { width: 100% !important; min-width: 0 !important; }
      }

      @media (max-width: 430px) {
        html body #view-reports .report-period-presets { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
        html body #view-reports .report-date-grid { grid-template-columns: minmax(0, 1fr) !important; }
        html body #view-reports .report-kpi-grid { grid-template-columns: minmax(0, 1fr) !important; }
        html body #view-reports .report-kpi-card { min-height: 72px !important; }
        html body #view-reports .report-summary-heading > span { white-space: normal; }
        html body #view-reports .report-payment-panel .panel-head { align-items: flex-start !important; flex-direction: column; }
      }

      body:not(.simple-trade-mode) #view-reports .report-toolbar.report-actions { grid-template-columns: repeat(2,minmax(0,1fr)) !important; padding: 9px 14px !important; }
      body:not(.simple-trade-mode) #view-reports .report-action-button,
      body:not(.simple-trade-mode) #view-reports .report-action-button.primary { min-height: 44px !important; grid-template-columns: 28px minmax(0,1fr) !important; padding: 7px 10px !important; }
      body:not(.simple-trade-mode) #view-reports .report-action-icon { width: 28px; height: 28px; }
      body:not(.simple-trade-mode) #view-reports .report-scroll-body { grid-template-columns: repeat(12,minmax(0,1fr)) !important; }
      body:not(.simple-trade-mode) #view-reports .report-summary-heading { grid-column: 1/-1; }
      body:not(.simple-trade-mode) #view-reports .report-kpi-grid { grid-column: span 8; }
      body:not(.simple-trade-mode) #view-reports .report-payment-panel { grid-column: span 4; }
      body:not(.simple-trade-mode) #view-reports .report-register-panel { grid-column:1/-1; min-width:0; width:100%; overflow:hidden !important; }
      html body #view-reports .report-register-panel > .panel-body { width:100%; min-width:0; max-width:100%; overflow:auto !important; }
      body:not(.simple-trade-mode) #view-reports .report-payment-panel .panel-head { min-height: 52px !important; }
      body:not(.simple-trade-mode) #view-reports .report-payment-table td { height: 38px !important; }

      body.simple-trade-mode #view-reports { --sr-bg:#07090b; --sr-panel:#101317; --sr-raised:#15191e; --sr-line:rgba(235,238,242,.15); --sr-muted:#9ba2ab; --sr-text:#f5f6f7; }
      body.simple-trade-mode #view-reports .simple-reports-workspace { min-height:100%; display:grid; grid-template-rows:auto auto auto minmax(0,1fr); gap:10px; color:var(--sr-text); }
      .simple-reports-header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:15px 16px; border:1px solid var(--sr-line); border-radius:10px; background:linear-gradient(180deg,#15181c,#0c0e11); }
      .simple-reports-header>div:first-child { min-width:0; }
      .simple-reports-header small,.simple-report-section-head small,.simple-report-aside>small { color:#858c95; font-size:9px; font-weight:850; }
      .simple-reports-header h2 { margin:3px 0 2px; font-size:22px; }
      .simple-reports-header p { margin:0; color:var(--sr-muted); font-size:11px; }
      .simple-report-period,.simple-report-tabs { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(86px,1fr); gap:5px; padding:4px; border:1px solid var(--sr-line); border-radius:9px; background:#090b0e; }
      .simple-report-period button,.simple-report-tabs button { min-height:34px; padding:6px 10px; border:1px solid transparent; border-radius:7px; background:transparent; color:#abb1ba; font-weight:750; }
      .simple-report-period button.active,.simple-report-tabs button.active { border-color:rgba(255,255,255,.25); background:#24282e; color:#fff; }
      .simple-report-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
      .simple-report-kpis article,.simple-report-payment-grid article { min-width:0; display:grid; gap:5px; padding:11px 13px; border:1px solid var(--sr-line); border-radius:9px; background:linear-gradient(180deg,#15181c,#0d1013); }
      .simple-report-kpis span,.simple-report-payment-grid span { color:var(--sr-muted); font-size:10px; }
      .simple-report-kpis strong,.simple-report-payment-grid strong { overflow-wrap:anywhere; color:#fff; font-size:clamp(17px,1.8vw,24px); font-variant-numeric:tabular-nums; }
      .simple-report-tabs { width:max-content; grid-auto-columns:minmax(110px,1fr); }
      .simple-report-content { min-height:0; display:grid; grid-template-columns:minmax(0,1.65fr) minmax(240px,.55fr); gap:10px; }
      .simple-report-register,.simple-report-aside,.simple-report-summary { min-width:0; overflow:hidden; border:1px solid var(--sr-line); border-radius:10px; background:var(--sr-panel); }
      .simple-report-register-wide,.simple-report-summary { grid-column:1/-1; }
      .simple-report-section-head { min-height:54px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 13px; border-bottom:1px solid var(--sr-line); background:#15181c; }
      .simple-report-section-head h3 { margin:3px 0 0; font-size:15px; }
      .simple-report-section-head>span { min-width:27px; height:25px; display:grid; place-items:center; border:1px solid var(--sr-line); border-radius:999px; color:#e9ebee; font-size:11px; }
      .simple-report-list { display:grid; align-content:start; max-height:min(52vh,520px); overflow:auto; scrollbar-width:none; }
      .simple-report-list::-webkit-scrollbar { display:none; }
      .simple-report-row { min-width:0; min-height:58px; display:grid; grid-template-columns:36px minmax(0,1fr) minmax(92px,auto) 16px; align-items:center; gap:10px; padding:8px 12px; border:0; border-bottom:1px solid rgba(235,238,242,.09); border-radius:0; background:#0d1013; color:var(--sr-text); text-align:left; }
      .simple-report-row:hover,.simple-report-row:focus-visible { background:#191d22; outline:none; }
      .simple-report-row>span { min-width:0; }
      .simple-report-row>span:nth-child(3) { text-align:right; }
      .simple-report-row strong,.simple-report-row small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
      .simple-report-row strong { font-size:12px; }
      .simple-report-row small { margin-top:3px; color:var(--sr-muted); font-size:9.5px; }
      .simple-report-row-icon { width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--sr-line); border-radius:8px; background:#171a1f; }
      .simple-report-row-icon svg { width:17px; height:17px; }
      .simple-report-row-arrow { color:#89909a; font-size:22px; }
      .simple-report-aside { display:grid; align-content:start; gap:12px; padding:14px; }
      .simple-report-aside h3 { margin:-7px 0 1px; font-size:14px; }
      .simple-report-aside-total { display:grid; gap:4px; padding:13px; border:1px solid var(--sr-line); border-radius:9px; background:#090b0e; }
      .simple-report-aside-total span,.simple-report-aside dt { color:var(--sr-muted); font-size:10px; }
      .simple-report-aside-total strong { color:#fff; font-size:24px; }
      .simple-report-aside dl { display:grid; gap:0; margin:0; }
      .simple-report-aside dl div { display:flex; justify-content:space-between; gap:10px; padding:9px 0; border-bottom:1px solid rgba(235,238,242,.09); }
      .simple-report-aside dd { margin:0; color:#f0f1f3; font-size:11px; font-weight:800; }
      .simple-report-summary { padding-bottom:12px; }
      .simple-report-payment-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; padding:12px; }
      .simple-report-callout { display:grid; grid-template-columns:36px minmax(0,1fr) auto; align-items:center; gap:10px; margin:0 12px; padding:11px; border:1px solid var(--sr-line); border-radius:9px; background:#0a0c0f; }
      .simple-report-callout>span { width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--sr-line); border-radius:8px; }
      .simple-report-callout svg { width:18px; height:18px; }
      .simple-report-callout strong,.simple-report-callout small { display:block; }
      .simple-report-callout small { margin-top:3px; color:var(--sr-muted); font-size:10px; }
      .simple-report-empty { min-height:190px; display:grid; place-items:center; align-content:center; gap:7px; color:var(--sr-muted); text-align:center; }
      .simple-report-empty svg { width:25px; height:25px; }
      .simple-report-empty strong { color:#e9ebee; }
      @media(max-width:1100px){
        body:not(.simple-trade-mode) #view-reports .report-kpi-grid,body:not(.simple-trade-mode) #view-reports .report-payment-panel{grid-column:1/-1}
        html body #view-reports .report-register-panel>.panel-body{overflow:auto!important}
        html body #view-reports .report-register-panel .mobile-card-table,html body #view-reports .report-register-panel .mobile-card-table tbody{display:grid!important;width:100%!important;min-width:0!important;gap:8px!important}
        html body #view-reports .report-register-panel .mobile-card-table colgroup,html body #view-reports .report-register-panel .mobile-card-table thead{display:none!important}
        html body #view-reports .report-register-panel .mobile-card-table tr{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px 12px!important;width:100%!important;min-width:0!important;padding:10px!important;border:1px solid rgba(235,238,242,.14)!important;border-radius:9px!important;background:#0d1013!important}
        html body #view-reports .report-register-panel .mobile-card-table td{display:grid!important;grid-template-columns:minmax(88px,.72fr) minmax(0,1fr)!important;align-items:center!important;gap:8px!important;min-width:0!important;min-height:23px!important;padding:0!important;border:0!important;color:#e9ebee!important;white-space:normal!important;overflow-wrap:anywhere!important}
        html body #view-reports .report-register-panel .mobile-card-table td::before{content:attr(data-label)!important;color:#9299a3!important;font-size:9px!important;font-weight:800!important}
        html body #view-reports .report-register-panel .mobile-card-table .tag{width:max-content!important;max-width:100%!important;min-height:22px!important;height:auto!important;padding:4px 8px!important;line-height:1.25!important;white-space:normal!important;overflow:visible!important}
        html body #view-reports .report-register-panel .mobile-card-table .row-actions{display:flex!important;justify-content:flex-end!important;gap:5px!important;width:100%!important}
        .simple-report-content{grid-template-columns:minmax(0,1fr)}.simple-report-aside{grid-row:auto}.simple-report-payment-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
      }
      @media(max-width:720px){html body #view-reports .report-register-panel .mobile-card-table tr{grid-template-columns:minmax(0,1fr)!important}.simple-reports-header{align-items:stretch;flex-direction:column;padding:12px}.simple-report-period{width:100%;grid-auto-columns:1fr}.simple-report-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.simple-report-tabs{width:100%;grid-auto-columns:1fr}.simple-report-content{display:block}.simple-report-aside{margin-top:9px}.simple-report-list{max-height:none}.simple-report-payment-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.simple-report-callout{grid-template-columns:32px minmax(0,1fr)}.simple-report-callout .btn{grid-column:1/-1;width:100%}.simple-report-row{grid-template-columns:34px minmax(0,1fr) minmax(80px,auto) 12px;padding-inline:9px}}
      @media(max-width:420px){.simple-report-kpis{grid-template-columns:minmax(0,1fr)}.simple-report-payment-grid{grid-template-columns:minmax(0,1fr)}.simple-report-row>span:nth-child(2) small{white-space:normal}.simple-report-row{gap:7px}.simple-reports-header h2{font-size:20px}}