/* ==========================================================================
   ざいのーと [財産管理] スマホ縦画面（Portrait）専用スタイル
   ========================================================================== */

/* ==========================================================================
   スマホ表示最適化 (@media (max-width: 768px))
   ========================================================================== */
@media (max-width: 768px), (max-height: 500px) and (orientation: landscape) {
    /* 1. PC固定幅の完全解除 & 全体の横スクロール防止 */
    html,
    body {
        overflow-x: hidden !important;
        max-width: 100vw !important;
        width: 100% !important;
    }

    body,
    .main-container,
    .app-header,
    .tab-navigation,
    .tab-content-panel {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    body {
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans JP", sans-serif !important;
        font-size: 14px !important;
    }

    .main-container {
        padding: 6px 8px 30px !important;
        overflow-x: hidden !important;
    }

    /* 2. ヘッダー */
    .app-header {
        flex-direction: column !important;
        align-items: stretch !important;
        padding: 10px 12px !important;
        gap: 8px !important;
        white-space: normal !important;
    }

    .app-title-group {
        display: grid !important;
        grid-template-columns: auto 1fr auto !important;
        grid-template-rows: auto auto !important;
        align-items: center !important;
        width: 100% !important;
        row-gap: 2px !important;
        column-gap: 8px !important;
        position: relative !important;
    }

    /* 左列 (Column 1): ざいのーと アイコン (上) ＆ [アプリ名] (下) */
    .app-title {
        grid-column: 1 / 2 !important;
        grid-row: 1 / 3 !important;
        justify-self: start !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        gap: 2px !important;
        margin: 0 !important;
        line-height: 1.15 !important;
    }

    .app-title a {
        display: flex !important;
        flex-direction: column !important;
        gap: 2px !important;
        color: inherit !important;
        text-decoration: none !important;
    }

    .app-title-main,
    .app-title-tag {
        font-size: 17px !important;
        font-weight: 700 !important;
        white-space: nowrap !important;
        color: #ffffff !important;
        display: block !important;
    }

    /* スマホモード（縦・横）: tipは完全非表示 */
    .mobile-title-tip,
    .mobile-title-tip.active {
        display: none !important;
    }
    .tab-button.management-help-anchor.help-visible::after {
        display: none !important;
    }
    [data-tooltip]::before,
    [data-tooltip]::after {
        display: none !important;
    }

    /* 中央列 (Column 2): 補足文 (上下2行エリア) */
    .app-subtitle {
        grid-column: 2 / 3 !important;
        grid-row: 1 / 3 !important;
        justify-self: start !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        gap: 2px !important;
        margin: 0 !important;
        width: 100% !important;
        min-width: 0 !important;
        line-height: 1.25 !important;
    }

    .subtitle-line1,
    .subtitle-line2 {
        font-size: 11px !important;
        opacity: 0.85 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        min-width: 0 !important;
        display: block !important;
    }

    /* 右列 (Column 3): 1行目: 契約アイコン（プランバッジ） */
    #zainotePlanBadge,
    .zainote-plan-badge {
        grid-column: 3 / 4 !important;
        grid-row: 1 !important;
        justify-self: end !important;
        margin: 0 !important;
        font-size: 11.5px !important;
        padding: 3px 8px !important;
        white-space: nowrap !important;
    }

    /* 右列 (Column 3): 2行目: 画面モード切替ボタン */
    #zainoteModeToggleBtn,
    .zainote-mode-toggle-btn {
        grid-column: 3 / 4 !important;
        grid-row: 2 !important;
        justify-self: end !important;
        margin: 0 !important;
        font-size: 11px !important;
        padding: 3px 6px !important;
        white-space: nowrap !important;
    }

    /* スマホモード（縦・横）: tipは完全非表示 */
    .mobile-title-tip,
    .mobile-title-tip.active {
        display: none !important;
    }
    .tab-button.management-help-anchor.help-visible::after {
        display: none !important;
    }
    [data-tooltip]::before,
    [data-tooltip]::after {
        display: none !important;
    }

    .header-links {
        display: flex !important;
        flex-wrap: nowrap !important;
        width: 100% !important;
        gap: 5px !important;
        align-items: center !important;
        justify-content: space-between !important;
    }

    .header-links .nav-icon {
        display: none !important;
    }

    .header-links a,
    .header-links .current-app {
        flex: 1 1 auto !important;
        font-size: 12px !important;
        padding: 2px 7px !important;
        height: 26px !important;
        white-space: nowrap !important;
        text-align: center !important;
        justify-content: center !important;
    }

    /* 3. タブナビゲーション（360px画面幅に全タブが収まるよう余白・間隔を最適化） */
    .tab-navigation {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow: visible !important;
        overflow-x: hidden !important;
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
        min-width: 0 !important;
        width: 100% !important;
        gap: 2px !important;
        border-bottom: 2px solid var(--dark-header-bg) !important;
        padding-left: 1px !important;
        padding-right: 1px !important;
        box-sizing: border-box !important;
        align-items: flex-end !important;
    }

    .tab-navigation::-webkit-scrollbar {
        display: none !important;
    }

    .tab-button,
    .tab-manual-btn {
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans JP", sans-serif !important;
        font-weight: 600 !important;
        -webkit-appearance: none !important;
    }

    .tab-button {
        flex: 0 0 auto !important;
        min-width: 0 !important;
        padding: 5px 3.5px !important;
        font-size: 11px !important;
        text-align: center !important;
        white-space: nowrap !important;
        gap: 2px !important;
        letter-spacing: -0.3px !important;
    }

    .tab-manual-btn {
        flex: 0 0 auto !important;
        margin-left: auto !important;
        margin-top: 0 !important;
        padding: 5px 4px !important;
        font-size: 11px !important;
        white-space: nowrap !important;
        gap: 2px !important;
        letter-spacing: -0.3px !important;
    }

    /* 4. タブ1: 検索・絞り込み（縦画面2行集約レイアウト） */
    .money-search-content {
        display: grid !important;
        grid-template-columns: minmax(0, 1.55fr) minmax(0, 1.25fr) minmax(0, 0.95fr) !important;
        gap: 5px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .money-search-content label {
        display: none !important;
    }

    /* 1行目: 利用月(1) / 支払方法(2) / 回収状況(3) */
    #month-filter {
        grid-column: 1 / 2 !important;
        grid-row: 1 !important;
        -webkit-appearance: none !important;
        appearance: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: normal !important;
        font-size: 12px !important;
        padding: 0 6px !important;
        text-align: left !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 5px !important;
        box-sizing: border-box !important;
        background-color: #ffffff !important;
    }

    #month-filter::-webkit-date-and-time-value {
        text-align: left !important;
        margin: 0 !important;
        padding: 0 !important;
        min-height: 1.2em !important;
        line-height: normal !important;
    }

    #payment-filter {
        grid-column: 2 / 3 !important;
        grid-row: 1 !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        font-size: 12px !important;
        padding: 0 4px !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 5px !important;
        box-sizing: border-box !important;
    }

    #status-filter {
        grid-column: 3 / 4 !important;
        grid-row: 1 !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        font-size: 12px !important;
        padding: 0 4px !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 5px !important;
        box-sizing: border-box !important;
    }

    /* 2行目: 検索ワード(1.8fr) / 検索ボタン(1fr) / 絞り込み解除(1fr) */
    #search-filter {
        grid-column: 1 / 2 !important;
        grid-row: 2 !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        font-size: 12px !important;
        padding: 0 6px !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 5px !important;
        box-sizing: border-box !important;
    }

    #search-button {
        grid-column: 2 / 3 !important;
        grid-row: 2 !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        border: 1px solid #1d4ed8 !important;
        border-radius: 5px !important;
        background: #2563eb !important;
        color: #ffffff !important;
        cursor: pointer !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
        padding: 0 4px !important;
    }

    #clear-filters-button {
        grid-column: 3 / 4 !important;
        grid-row: 2 !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        font-size: 11.5px !important;
        font-weight: 600 !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 5px !important;
        background: #f8fafc !important;
        color: #334155 !important;
        cursor: pointer !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
        padding: 0 2px !important;
    }

    /* 3行目: 表示件数 */
    #visible-count {
        grid-column: 1 / -1 !important;
        grid-row: 3 !important;
        text-align: right !important;
        font-size: 11.5px !important;
        color: #64748b !important;
        line-height: 18px !important;
        margin: 2px 0 0 !important;
        padding-right: 2px !important;
    }

    .money-search-pool-summary {
        font-size: 11.5px !important;
        text-align: left !important;
        margin-top: 2px !important;
        line-height: 1.3 !important;
    }

    /* 5. タブ2: 新しい支出フォーム（3列グリッド） */
    #expense-form,
    .add-form-container {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 6px !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    #expense-form .form-row,
    .add-form-container .form-row {
        display: contents !important;
    }

    .form-item {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        gap: 2px !important;
    }

    .form-item label {
        font-size: 11.5px !important;
        font-weight: 700 !important;
        color: #5a232b !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    .form-item input,
    .form-item select,
    #expense-form input,
    #expense-form select,
    #amount {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        font-size: 12px !important;
        padding: 0 6px !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 5px !important;
        box-sizing: border-box !important;
        background: #ffffff !important;
    }

    /* iOS Safariにおける日付入力（type="date", type="month"）のネイティブ固有最小幅リセット */
    input[type="date"],
    input[type="month"],
    #expense-date,
    #recovery-date,
    #pool-income-date {
        -webkit-appearance: none !important;
        appearance: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        background-color: #ffffff !important;
    }

    input[type="date"]::-webkit-date-and-time-value,
    input[type="month"]::-webkit-date-and-time-value,
    #expense-date::-webkit-date-and-time-value,
    #recovery-date::-webkit-date-and-time-value,
    #pool-income-date::-webkit-date-and-time-value {
        text-align: left !important;
        margin: 0 !important;
        padding: 0 !important;
        min-height: 1.2em !important;
        line-height: normal !important;
    }

    /* 4行目: 回収日(1) / メモ(1) / 追加ボタン(1) で1行に集約し1行削減 */
    .form-item:has(#recovery-date) {
        grid-column: 1 / 2 !important;
        grid-row: 4 !important;
    }

    .form-item:has(#memo) {
        grid-column: 2 / 3 !important;
        grid-row: 4 !important;
    }

    /* 追加ボタン（4行目の空いた3マス目に配置） */
    #submit-record-button {
        grid-column: 3 / 4 !important;
        grid-row: 4 !important;
        width: 100% !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        border-radius: 5px !important;
        margin: 0 !important;
        align-self: end !important;
        justify-content: center !important;
        box-sizing: border-box !important;
    }

    /* 収入票（#pool-income-form）: PCモードと同じ横並び（加算日の列形式）をそのまま完全維持 */
    #pool-income-form {
        display: block !important;
        margin-bottom: 10px !important;
        width: 100% !important;
    }

    #pool-income-form .form-row {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        gap: 8px !important;
        width: 100% !important;
    }

    #pool-income-form .form-item {
        display: inline-flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 4px !important;
        font-size: 12px !important;
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    #pool-income-form .form-item label {
        display: inline !important;
        font-size: 12px !important;
        font-weight: normal !important;
        color: inherit !important;
        margin: 0 !important;
        white-space: nowrap !important;
        overflow: visible !important;
        line-height: normal !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    #pool-income-form input,
    #pool-income-form select {
        display: inline-block !important;
        height: 24px !important;
        min-height: 24px !important;
        max-height: 24px !important;
        line-height: normal !important;
        padding: 2px 5px !important;
        border: 1px solid #ccc !important;
        border-radius: 3px !important;
        font-size: 12px !important;
        box-sizing: border-box !important;
        background: #ffffff !important;
    }

    #pool-income-date {
        width: 125px !important;
        min-width: 125px !important;
    }

    #pool-income-payer {
        width: auto !important;
        min-width: 95px !important;
    }

    #pool-income-amount {
        width: 85px !important;
        min-width: 85px !important;
    }

    #pool-income-form .form-item:has(#pool-income-memo) {
        flex: 1 !important;
        min-width: 140px !important;
    }

    #pool-income-memo {
        width: 100% !important;
        min-width: 120px !important;
    }

    #pool-income-form button {
        height: 24px !important;
        min-height: 24px !important;
        max-height: 24px !important;
        line-height: 20px !important;
        padding: 0 8px !important;
        font-size: 12px !important;
        margin: 0 !important;
        border-radius: 3px !important;
        width: auto !important;
    }

    /* 6. タブ3: データ管理（3列グリッド） */
    .management-tab-content {
        width: 100% !important;
    }

    .management-group {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 4px !important;
        width: 100% !important;
        margin-bottom: 8px !important;
    }

    .management-group-title {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        border-bottom: 2px solid #decfae !important;
        padding-bottom: 2px !important;
        margin-bottom: 2px !important;
    }

    .management-group .custom-button,
    .management-group a,
    .management-group label,
    body.force-mobile-mode .management-group .custom-button,
    body.force-mobile-mode .management-group a,
    body.force-mobile-mode .management-group label {
        width: 100% !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans JP", sans-serif !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        padding: 0 4px !important;
        box-sizing: border-box !important;
        border-radius: 5px !important;
        white-space: nowrap !important;
        margin: 0 !important;
    }

    /* 7. グローバルアクションバー（スマホ縦モード: ソート・文字色上ラベル、一括保存・ソートボタン排除: zaiko踏襲） */
    .global-action-bar,
    .inventory-content > .global-action-bar {
        display: grid !important;
        grid-template-columns: 1fr auto !important;
        grid-template-rows: auto auto !important;
        align-items: flex-end !important;
        row-gap: 5px !important;
        column-gap: 8px !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 5px 8px !important;
        background: #f8fafc !important;
        border: 1px solid #e2e8f0 !important;
        border-radius: 6px !important;
        box-sizing: border-box !important;
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        position: static !important;
        top: auto !important;
        overflow: hidden !important;
    }

    /* 一括保存ボタン・ソートボタン・保存ラベルを完全非表示 */
    #saveAllButton,
    #sortExecuteButton,
    .save-group-label {
        display: none !important;
    }

    /* 共通上ラベル（zaiko準拠） */
    .action-bar-item-label,
    .sort-group-label,
    .color-priority-label {
        display: block !important;
        height: 16px !important;
        min-height: 16px !important;
        max-height: 16px !important;
        line-height: 16px !important;
        font-size: 11.5px !important;
        color: #475569 !important;
        font-weight: 500 !important;
        margin: 0 0 2px 0 !important;
        padding: 0 !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
    }

    /* 1行目・左: ソート（上ラベル＋下セレクトボックス） */
    .action-group.sort-action-group {
        grid-column: 1 / 2 !important;
        grid-row: 1 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        min-width: 0 !important;
        width: 100% !important;
        gap: 0 !important;
    }

    .action-group .sort-select {
        width: 100% !important;
        min-width: 0 !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        font-size: 12.5px !important;
        padding: 0 6px !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 5px !important;
        background: #ffffff !important;
        box-sizing: border-box !important;
    }

    /* 1行目・右: 文字色（上ラベル＋下ボタン） */
    .color-priority-control {
        grid-column: 2 / 3 !important;
        grid-row: 1 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        min-width: 0 !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
        gap: 0 !important;
    }

    .color-priority-buttons {
        display: flex !important;
        align-items: center !important;
        gap: 3px !important;
        height: 30px !important;
    }

    .color-priority-buttons button,
    .color-priority-control button {
        min-width: 0 !important;
        width: auto !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        font-size: 11px !important;
        font-weight: 600 !important;
        padding: 0 6px !important;
        border-radius: 4px !important;
        border: 1px solid #cbd5e1 !important;
        background: #ffffff !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
    }

    .color-priority-buttons button.active,
    .color-priority-control button.active {
        background-color: #285f88 !important;
        color: #ffffff !important;
        border-color: #1e4767 !important;
    }

    /* 2行目: 最新保存時刻 ＋ 集計サマリー（点線区切りで左右均等配置: zaiko踏襲） */
    .meta-info-control {
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        flex-wrap: wrap !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        gap: 4px 8px !important;
        margin-top: 4px !important;
        padding-top: 6px !important;
        border-top: 1px dashed #cbd5e1 !important;
        box-sizing: border-box !important;
    }

    #saveTimeDisplay {
        font-size: 11px !important;
        color: #64748b !important;
        display: inline-flex !important;
        align-items: center !important;
        white-space: nowrap !important;
        line-height: 1.2 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .money-summary-wrap {
        display: inline-flex !important;
        align-items: center !important;
        flex-wrap: wrap !important;
        gap: 4px !important;
        width: auto !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        font-size: 11px !important;
        line-height: 1.4 !important;
        color: #64748b !important;
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
    }

    .money-summary-wrap .summary-divider {
        color: #cbd5e1 !important;
        font-size: 10px !important;
        margin: 0 1px !important;
    }

    .money-summary-wrap .summary-label {
        font-size: 11px !important;
        color: #64748b !important;
    }

    #month-label {
        font-size: 11px !important;
        color: #64748b !important;
        white-space: nowrap !important;
    }

    #month-total {
        font-size: 12.5px !important;
        font-weight: 800 !important;
        color: #0f172a !important;
        white-space: nowrap !important;
    }

    #pending-count,
    #record-count {
        font-size: 11px !important;
        font-weight: 700 !important;
        color: #1e293b !important;
    }

    /* 8. 一覧テーブルの表示最適化（メイン表・収入票それぞれを独立横スクロール） */
    .inventory-content {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    .money-table-scroll {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow-x: auto !important;
        overflow-y: visible !important;
        -webkit-overflow-scrolling: touch !important;
        border-radius: 4px !important;
    }

    #money-transactions {
        min-width: 1320px !important;
        width: 100% !important;
        table-layout: fixed !important;
    }

    .money-income-table {
        min-width: 0 !important;
        width: auto !important;
        table-layout: fixed !important;
    }

    /* 枠線・矢印・背景を削ってテキスト化 ＆ 入力禁止（スクロール誤タップ防止: zaiko踏襲） */
    #money-transactions tbody td input:not([type="checkbox"]),
    #money-transactions tbody td select,
    #money-transactions .money-inline-input:not([type="checkbox"]),
    #money-transactions .money-inline-select,
    .money-income-table tbody td input:not([type="checkbox"]),
    .money-income-table tbody td select {
        border: none !important;
        background: transparent !important;
        box-shadow: none !important;
        outline: none !important;
        padding: 0 !important;
        margin: 0 !important;
        pointer-events: none !important;
        user-select: none !important;
        -webkit-appearance: none !important;
        -moz-appearance: none !important;
        appearance: none !important;
        color: inherit !important;
        font-size: 12.5px !important;
        font-weight: 500 !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
    }

    /* チェックボックス（積立・回収・出力）はスマホモードでも表示を残し操作可能にする */
    #money-transactions tbody td input[type="checkbox"],
    #money-transactions .money-recovery-toggle input[type="checkbox"],
    .money-income-table tbody td input[type="checkbox"] {
        -webkit-appearance: checkbox !important;
        -moz-appearance: checkbox !important;
        appearance: checkbox !important;
        display: inline-block !important;
        width: 15px !important;
        height: 15px !important;
        min-width: 15px !important;
        min-height: 15px !important;
        margin: 0 !important;
        padding: 0 !important;
        pointer-events: auto !important;
        user-select: auto !important;
        cursor: pointer !important;
        accent-color: #28675e !important;
        opacity: 1 !important;
        visibility: visible !important;
        vertical-align: middle !important;
    }

    #money-transactions .money-recovery-toggle,
    .money-income-table .money-recovery-toggle {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 16px !important;
        min-height: 16px !important;
        pointer-events: auto !important;
        cursor: pointer !important;
    }

    #money-transactions tbody td:nth-child(6),
    #money-transactions tbody td:nth-child(13),
    #money-transactions tbody td:nth-child(14) {
        text-align: center !important;
    }

    #money-transactions tbody td input::-webkit-inner-spin-button,
    #money-transactions tbody td input::-webkit-outer-spin-button,
    #money-transactions tbody td input::-webkit-calendar-picker-indicator,
    .money-income-table tbody td input::-webkit-inner-spin-button,
    .money-income-table tbody td input::-webkit-outer-spin-button,
    .money-income-table tbody td input::-webkit-calendar-picker-indicator {
        display: none !important;
        -webkit-appearance: none !important;
    }

    /* 操作列（16列目）は詳細シート側にあるため表内では非表示にして横幅を大幅圧縮 */
    #money-transactions th:nth-child(16),
    #money-transactions td:nth-child(16),
    #money-transactions th:last-child,
    #money-transactions td:last-child,
    #money-transactions .row-action-cell,
    #money-transactions .row-action-menu,
    .money-income-table th:last-child,
    .money-income-table td:last-child {
        display: none !important;
    }

    #money-transactions thead th,
    th.sticky,
    .money-income-table thead th {
        position: static !important;
        top: auto !important;
        padding: 4px 2px !important;
        font-size: 10px !important;
        height: 24px !important;
        max-height: 24px !important;
        line-height: normal !important;
        text-align: center !important;
        vertical-align: middle !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
    }

    #money-transactions td,
    #money-transactions tbody td,
    td.sticky,
    .money-income-table td,
    .money-income-table tbody td {
        padding: 4px 2px !important;
        font-size: 12.5px !important;
        vertical-align: middle !important;
    }
    /* スマホモード: テキストボックス名残による左側余白を解消（店舗・用途・支払者・支払方法・支払元・回収元・回収方法・メモを左寄せ） */
    #money-transactions tbody td:nth-child(3),
    #money-transactions tbody td:nth-child(4),
    #money-transactions tbody td:nth-child(7),
    #money-transactions tbody td:nth-child(8),
    #money-transactions tbody td:nth-child(9),
    #money-transactions tbody td:nth-child(10),
    #money-transactions tbody td:nth-child(11),
    #money-transactions tbody td:nth-child(15),
    .money-income-table tbody td:nth-child(3),
    .money-income-table tbody td:nth-child(5) {
        text-align: left !important;
    }

    #money-transactions tbody td:nth-child(3) select,
    #money-transactions tbody td:nth-child(4) select,
    #money-transactions tbody td:nth-child(7) select,
    #money-transactions tbody td:nth-child(8) select,
    #money-transactions tbody td:nth-child(9) select,
    #money-transactions tbody td:nth-child(10) select,
    #money-transactions tbody td:nth-child(11) select,
    #money-transactions tbody td:nth-child(15) input,
    .money-income-table tbody td:nth-child(3) input,
    .money-income-table tbody td:nth-child(3) select,
    .money-income-table tbody td:nth-child(5) input {
        text-align: left !important;
        text-align-last: left !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    #money-transactions tbody td:nth-child(5),
    .money-income-table tbody td:nth-child(4),
    .money-income-table tbody td:nth-child(6) {
        text-align: right !important;
    }

    #money-transactions tbody td:nth-child(5) input,
    .money-income-table tbody td:nth-child(4) input,
    .money-income-table tbody td:nth-child(6) input {
        text-align: right !important;
        text-align-last: right !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    #money-transactions tbody td:nth-child(2) input,
    #money-transactions tbody td:nth-child(12) input,
    .money-income-table tbody td:nth-child(2) input {
        text-align: center !important;
        text-align-last: center !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* スマホモード限定: Noセルタップで詳細・編集シート起動の案内スタイル */
    #money-transactions tbody tr td:first-child {
        cursor: pointer !important;
        pointer-events: auto !important;
        font-weight: 700 !important;
        color: #71313a !important;
        text-decoration: underline !important;
        text-underline-offset: 2px !important;
        transition: background-color 0.15s, color 0.15s;
        user-select: none;
        position: relative;
    }

    #money-transactions tbody tr td:first-child:hover {
        background-color: #ffe4e6 !important;
        color: #e11d48 !important;
        text-decoration: underline !important;
    }

    #money-transactions tbody tr td:first-child:active {
        background-color: #fecdd3 !important;
    }
}



/* ==========================================================================
   支出明細レコード詳細・直接編集ボトムシート (スマホ専用)
   ========================================================================== */

/* PCモード（769px以上 かつ 横持ちスマホ以外）ではボトムシートを完全非表示 */
@media (min-width: 769px) and (min-height: 501px) {
    body:not(.force-mobile-mode) .mobile-detail-overlay {
        display: none !important;
    }
}
body.force-pc-mode .mobile-detail-overlay {
    display: none !important;
}

/* スマホモード時：No列の数字をクリッカブルとしてアンダーライン表示 */
body.force-mobile-mode #money-transactions tbody td:first-child {
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
    cursor: pointer !important;
}

@media screen and (max-width: 768px),
       screen and (max-height: 500px) and (orientation: landscape) {
    body:not(.force-pc-mode) #money-transactions tbody td:first-child {
        text-decoration: underline !important;
        text-underline-offset: 2px !important;
        cursor: pointer !important;
    }
}

/* ボトムシート オーバーレイ背景 */
.mobile-detail-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 10000;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

.mobile-detail-overlay.active {
    opacity: 1;
    pointer-events: auto;
}

/* ボトムシート本体 */
.mobile-detail-sheet {
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%) translateY(100%);
    width: 100%;
    max-width: 620px;
    max-height: 88vh;
    background: #ffffff;
    border-radius: 18px 18px 0 0;
    box-shadow: 0 -8px 30px rgba(0, 0, 0, 0.28);
    display: flex;
    flex-direction: column;
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1);
    z-index: 10001;
    box-sizing: border-box;
    overflow: hidden;
}

.mobile-detail-sheet.open {
    transform: translateX(-50%) translateY(0);
}

/* 上部ドラッグバー風ハンドル */
.sheet-drag-handle {
    width: 44px;
    height: 5px;
    background: #cbd5e1;
    border-radius: 3px;
    margin: 8px auto 4px;
    flex-shrink: 0;
}

/* シートヘッダー */
.sheet-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 16px 10px;
    border-bottom: 1px solid #e2e8f0;
    flex-shrink: 0;
}

.sheet-title-group {
    display: flex;
    align-items: center;
    gap: 8px;
}

.sheet-no-badge {
    background: #e11d48;
    color: #ffffff;
    font-weight: 700;
    font-size: 13px;
    padding: 3px 8px;
    border-radius: 6px;
    letter-spacing: 0.5px;
}

.sheet-title {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    color: #1e293b;
}

.sheet-close-btn {
    background: none;
    border: none;
    font-size: 20px;
    line-height: 1;
    color: #64748b;
    cursor: pointer;
    padding: 6px 10px;
    border-radius: 6px;
    transition: background-color 0.15s, color 0.15s;
}

.sheet-close-btn:hover {
    background: #f1f5f9;
    color: #0f172a;
}

/* シートボディ（スクロール領域） */
.sheet-body {
    padding: 14px 16px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1;
}

.sheet-field-group {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.sheet-label {
    font-size: 12px;
    font-weight: 700;
    color: #9f1239;
}

.sheet-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.sheet-input,
.sheet-select {
    width: 100%;
    height: 40px;
    padding: 6px 10px;
    font-size: 15px;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    box-sizing: border-box;
    background: #ffffff;
    color: #1e293b;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.sheet-input:focus,
.sheet-select:focus {
    border-color: #e11d48;
    outline: none;
    box-shadow: 0 0 0 2px rgba(225, 29, 72, 0.2);
}

.sheet-name-input {
    font-size: 16px;
    font-weight: 700;
}

/* メタ情報行 */
.sheet-meta-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    background: #fff1f2;
    border: 1px solid #fecdd3;
    border-radius: 6px;
    font-size: 13px;
    gap: 6px;
    flex-wrap: wrap;
}

.sheet-checkbox-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    font-weight: 600;
    color: #334155;
    user-select: none;
}

.sheet-checkbox-label input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
}

/* フッターアクションバー */
.sheet-footer {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 16px 14px;
    border-top: 1px solid #e2e8f0;
    background: #f8fafc;
    flex-shrink: 0;
}

.sheet-btn {
    flex: 1 1 auto;
    height: 42px;
    padding: 0 12px;
    font-size: 14px;
    font-weight: 700;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    transition: background-color 0.15s, opacity 0.15s, transform 0.05s;
    white-space: nowrap;
}

.sheet-btn:active {
    transform: scale(0.97);
}

.sheet-btn-update {
    background: #e11d48;
    color: #ffffff;
    flex: 2 1 140px;
    font-size: 15px;
}

.sheet-btn-update:hover {
    background: #be123c;
}

.sheet-btn-delete {
    background: #fff1f2;
    border: 1px solid #fecdd3;
    color: #be123c;
}

.sheet-btn-delete:hover {
    background: #ffe4e6;
}

/* デスクトップ通常時のベーススタイル */
.mobile-title-tip {
    display: none;
}

/* 強制スマホモード時のツールチップ */
body.force-mobile-mode .app-title-group {
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    grid-template-rows: auto auto !important;
    align-items: center !important;
    width: 100% !important;
    row-gap: 2px !important;
    column-gap: 8px !important;
    position: relative !important;
}

/* 左列 (Column 1): ざいのーと アイコン (上) ＆ [アプリ名] (下) */
body.force-mobile-mode .app-title {
    grid-column: 1 / 2 !important;
    grid-row: 1 / 3 !important;
    justify-self: start !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 2px !important;
    margin: 0 !important;
    line-height: 1.15 !important;
}

body.force-mobile-mode .app-title a {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    color: inherit !important;
    text-decoration: none !important;
}

body.force-mobile-mode .app-title-main,
body.force-mobile-mode .app-title-tag {
    font-size: 17px !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    color: #ffffff !important;
    display: block !important;
}

/* スマホモード（縦・横）: tipは完全非表示 */
body.force-mobile-mode .mobile-title-tip,
body.force-mobile-mode .mobile-title-tip.active {
    display: none !important;
}
body.force-mobile-mode .tab-button.management-help-anchor.help-visible::after {
    display: none !important;
}
[data-tooltip]::before,
[data-tooltip]::after {
    display: none !important;
}

/* 中央列 (Column 2): 補足文 (上下2行エリア) */
body.force-mobile-mode .app-subtitle {
    grid-column: 2 / 3 !important;
    grid-row: 1 / 3 !important;
    justify-self: start !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 2px !important;
    margin: 0 !important;
    width: 100% !important;
    min-width: 0 !important;
    line-height: 1.25 !important;
}

body.force-mobile-mode .subtitle-line1,
body.force-mobile-mode .subtitle-line2 {
    font-size: 11px !important;
    opacity: 0.85 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    min-width: 0 !important;
    display: block !important;
}

/* 右列 (Column 3): 1行目: 契約アイコン（プランバッジ） */
body.force-mobile-mode #zainotePlanBadge,
body.force-mobile-mode .zainote-plan-badge {
    grid-column: 3 / 4 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    margin: 0 !important;
    font-size: 11.5px !important;
    padding: 3px 8px !important;
    white-space: nowrap !important;
}

/* 右列 (Column 3): 2行目: 画面モード切替ボタン */
body.force-mobile-mode #zainoteModeToggleBtn,
body.force-mobile-mode .zainote-mode-toggle-btn {
    grid-column: 3 / 4 !important;
    grid-row: 2 !important;
    justify-self: end !important;
    margin: 0 !important;
    font-size: 11px !important;
    padding: 3px 6px !important;
    white-space: nowrap !important;
}

body.force-mobile-mode .inventory-content {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
}

body.force-mobile-mode .money-table-scroll {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch !important;
    border-radius: 4px !important;
}

body.force-mobile-mode #money-transactions {
    min-width: 1320px !important;
    width: 100% !important;
    table-layout: fixed !important;
}

body.force-mobile-mode .money-income-table {
    min-width: 0 !important;
    width: auto !important;
    table-layout: fixed !important;
}



/* ==========================================================================
   スマホ縦画面（Portrait）データ管理タブ: 3-2の2行構成
   - 1行目: 3ボタン均等（各2マス / 計6マス）
   - 2行目: 2ボタン均等（各3マス / 計6マス）
   - ボタン上下サイズ30px統一
   ========================================================================== */
@media screen and (orientation: portrait),
       (max-width: 768px) and (orientation: portrait),
       (max-width: 500px) {

    .management-tab-content {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        gap: 6px !important;
    }

    .management-group {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 4px !important;
        margin-bottom: 6px !important;
        align-items: center !important;
        box-sizing: border-box !important;
    }

    .management-group-title {
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        color: #334155 !important;
        border-bottom: 2px solid #decfae !important;
        padding: 0 0 2px 0 !important;
        margin-bottom: 3px !important;
        display: block !important;
        line-height: 1.2 !important;
    }

    .management-group-title::after {
        content: none !important;
    }

    #receiptImportLink,
    #backup-button,
    #restore-button,
    #report-link,
    .management-group a[href*="customizeLists"], .management-group a[href*="money-lists"],
    #clearAllRecordsBtn {
        grid-column: auto !important;
        grid-row: auto !important;
    }

    .management-group .custom-button,
    .management-group a,
    .management-group button,
    .management-group label {
        width: 100% !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        font-size: 11.5px !important;
        font-weight: 600 !important;
        padding: 0 2px !important;
        white-space: nowrap !important;
        justify-content: center !important;
        text-align: center !important;
        box-sizing: border-box !important;
        border-radius: 5px !important;
    }
}

/* PCでの強制スマホモード時のグローバルアクションバー（PCモニタ上での検証対応） */
body.force-mobile-mode:not(.force-pc-mode) .global-action-bar,
body.force-mobile-mode:not(.force-pc-mode) .inventory-content > .global-action-bar {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    grid-template-rows: auto auto !important;
    align-items: flex-end !important;
    row-gap: 5px !important;
    column-gap: 8px !important;
    height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 5px 8px !important;
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 6px !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    position: static !important;
    top: auto !important;
    overflow: hidden !important;
}

body.force-mobile-mode:not(.force-pc-mode) #saveAllButton,
body.force-mobile-mode:not(.force-pc-mode) #sortExecuteButton,
body.force-mobile-mode:not(.force-pc-mode) .save-group-label {
    display: none !important;
}

body.force-mobile-mode:not(.force-pc-mode) .action-bar-item-label,
body.force-mobile-mode:not(.force-pc-mode) .sort-group-label,
body.force-mobile-mode:not(.force-pc-mode) .color-priority-label {
    display: block !important;
    height: 16px !important;
    min-height: 16px !important;
    max-height: 16px !important;
    line-height: 16px !important;
    font-size: 11.5px !important;
    color: #475569 !important;
    font-weight: 500 !important;
    margin: 0 0 2px 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}

body.force-mobile-mode:not(.force-pc-mode) .action-group.sort-action-group {
    grid-column: 1 / 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    min-width: 0 !important;
    width: 100% !important;
    gap: 0 !important;
}

body.force-mobile-mode:not(.force-pc-mode) .action-group .sort-select {
    width: 100% !important;
    min-width: 0 !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    font-size: 12.5px !important;
    padding: 0 6px !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 5px !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
}

body.force-mobile-mode:not(.force-pc-mode) .color-priority-control {
    grid-column: 2 / 3 !important;
    grid-row: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    min-width: 0 !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
}

body.force-mobile-mode:not(.force-pc-mode) .color-priority-buttons {
    display: flex !important;
    align-items: center !important;
    gap: 3px !important;
    height: 30px !important;
}

body.force-mobile-mode:not(.force-pc-mode) .color-priority-buttons button,
body.force-mobile-mode:not(.force-pc-mode) .color-priority-control button {
    min-width: 0 !important;
    width: auto !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    line-height: 28px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    padding: 0 6px !important;
    border-radius: 4px !important;
    border: 1px solid #cbd5e1 !important;
    background: #ffffff !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}

body.force-mobile-mode:not(.force-pc-mode) .color-priority-buttons button.active,
body.force-mobile-mode:not(.force-pc-mode) .color-priority-control button.active {
    background-color: #285f88 !important;
    color: #ffffff !important;
    border-color: #1e4767 !important;
}

body.force-mobile-mode:not(.force-pc-mode) .meta-info-control {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    gap: 4px 8px !important;
    margin-top: 4px !important;
    padding-top: 6px !important;
    border-top: 1px dashed #cbd5e1 !important;
    box-sizing: border-box !important;
}

body.force-mobile-mode:not(.force-pc-mode) #saveTimeDisplay {
    font-size: 11px !important;
    color: #64748b !important;
    display: inline-flex !important;
    align-items: center !important;
    white-space: nowrap !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.force-mobile-mode:not(.force-pc-mode) .money-summary-wrap {
    display: inline-flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    font-size: 11px !important;
    line-height: 1.4 !important;
    color: #64748b !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}

body.force-mobile-mode:not(.force-pc-mode) .money-summary-wrap .summary-divider {
    color: #cbd5e1 !important;
    font-size: 10px !important;
    margin: 0 1px !important;
}

body.force-mobile-mode:not(.force-pc-mode) .money-summary-wrap .summary-label {
    font-size: 11px !important;
    color: #64748b !important;
}

body.force-mobile-mode:not(.force-pc-mode) #month-label {
    font-size: 11px !important;
    color: #64748b !important;
    white-space: nowrap !important;
}

body.force-mobile-mode:not(.force-pc-mode) #month-total {
    font-size: 12.5px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    white-space: nowrap !important;
}

body.force-mobile-mode:not(.force-pc-mode) #pending-count,
body.force-mobile-mode:not(.force-pc-mode) #record-count {
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
}



/* ==========================================================================
   全スマホモード（縦・横・強制スマホ）共通:
   - タブ余白削減 (padding: 4px 8px 3px)
   - ドロップダウン・テキストボックス: 上下サイズ30pxに圧縮
   - ソートエリア: 30px統一
   - データ管理タブボタン: 30px統一
   ========================================================================== */
@media (max-width: 768px), (max-height: 600px) and (orientation: landscape), (orientation: portrait) and (max-width: 768px) {
    #tab-panel-search,
    #tab-panel-add,
    #tab-panel-manage,
    .tab-content-panel {
        padding: 4px 8px 3px !important;
        margin-bottom: 4px !important;
        min-height: 0 !important;
    }

    .management-tab-content .custom-button,
    .management-group .custom-button,
    .management-group a,
    .management-group button,
    .management-group label {
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        font-size: 12px !important;
        padding: 2px 2px !important;
        box-sizing: border-box !important;
        border-radius: 5px !important;
        line-height: 1.2 !important;
    }

    /* ソートエリア: 高さ30pxに統一 */
    .action-group .sort-select,
    .action-group .sort-execute-button,
    #saveAllButton,
    .sort-select,
    .sort-execute-button {
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        box-sizing: border-box !important;
    }

    /* タブ内: ドロップダウン・テキストボックスの上下サイズを30pxに圧縮（上下余白・パディングを削減） */
    .tab-content-panel input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
    .tab-content-panel select,
    #tab-panel-search input,
    #tab-panel-search select,
    #expense-form input,
    #expense-form select,
    #month-filter,
    #payment-filter,
    #search-filter,
    #status-filter,
    #expense-date,
    #merchant,
    #amount,
    #category,
    #paid-by,
    #payment-method,
    #paid-from,
    #recovery-source,
    #recovery-method,
    #recovery-date,
    #memo {
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        padding: 0 6px !important;
        box-sizing: border-box !important;
        font-size: 12px !important;
    }

    /* iOS Safariにおける日付・月入力のネイティブ固有最小幅リセット */
    input[type="date"],
    input[type="month"],
    #month-filter,
    #expense-date,
    #recovery-date,
    #pool-income-date {
        -webkit-appearance: none !important;
        appearance: none !important;
        min-width: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        line-height: normal !important;
    }

    input[type="date"]::-webkit-date-and-time-value,
    input[type="month"]::-webkit-date-and-time-value,
    #month-filter::-webkit-date-and-time-value,
    #expense-date::-webkit-date-and-time-value,
    #recovery-date::-webkit-date-and-time-value,
    #pool-income-date::-webkit-date-and-time-value {
        text-align: left !important;
        margin: 0 !important;
        padding: 0 !important;
        min-height: 1.2em !important;
        line-height: normal !important;
    }

    /* タブ内ボタンの高さも30pxで揃える */
    #submit-record-button,
    #clear-filters-button {
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        box-sizing: border-box !important;
    }

    /* ラベルの高さ統一 */
    #expense-form label,
    .form-item label {
        height: 16px !important;
        min-height: 16px !important;
        max-height: 16px !important;
        line-height: 16px !important;
        font-size: 11.5px !important;
        margin: 0 0 2px 0 !important;
        padding: 0 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        box-sizing: border-box !important;
    }
}

/* 強制スマホモード（PCでの検証用） */
body.force-mobile-mode #tab-panel-search,
body.force-mobile-mode #tab-panel-add,
body.force-mobile-mode #tab-panel-manage,
body.force-mobile-mode .tab-content-panel {
    padding: 4px 8px 5px !important;
    margin-bottom: 4px !important;
    min-height: 0 !important;
}

/* 強制スマホモード（縦画面）検索タブ2行集約レイアウト */
@media screen and (orientation: portrait) {
    body.force-mobile-mode .money-search-content {
        display: grid !important;
        grid-template-columns: minmax(0, 1.55fr) minmax(0, 1.25fr) minmax(0, 0.95fr) !important;
        gap: 5px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    body.force-mobile-mode .money-search-content label {
        display: none !important;
    }

    body.force-mobile-mode #month-filter {
        grid-column: 1 / 2 !important;
        grid-row: 1 !important;
        -webkit-appearance: none !important;
        appearance: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: normal !important;
        font-size: 12px !important;
        padding: 0 6px !important;
        text-align: left !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 5px !important;
        box-sizing: border-box !important;
        background-color: #ffffff !important;
    }

    body.force-mobile-mode #month-filter::-webkit-date-and-time-value {
        text-align: left !important;
        margin: 0 !important;
        padding: 0 !important;
        min-height: 1.2em !important;
        line-height: normal !important;
    }

    body.force-mobile-mode #payment-filter {
        grid-column: 2 / 3 !important;
        grid-row: 1 !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        font-size: 12px !important;
        padding: 0 4px !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 5px !important;
        box-sizing: border-box !important;
    }

    body.force-mobile-mode #status-filter {
        grid-column: 3 / 4 !important;
        grid-row: 1 !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        font-size: 12px !important;
        padding: 0 4px !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 5px !important;
        box-sizing: border-box !important;
    }

    body.force-mobile-mode #search-filter {
        grid-column: 1 / 2 !important;
        grid-row: 2 !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        font-size: 12px !important;
        padding: 0 6px !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 5px !important;
        box-sizing: border-box !important;
    }

    body.force-mobile-mode #search-button {
        grid-column: 2 / 3 !important;
        grid-row: 2 !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        border: 1px solid #1d4ed8 !important;
        border-radius: 5px !important;
        background: #2563eb !important;
        color: #ffffff !important;
        cursor: pointer !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
        padding: 0 4px !important;
    }

    body.force-mobile-mode #clear-filters-button {
        grid-column: 3 / 4 !important;
        grid-row: 2 !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 28px !important;
        font-size: 11.5px !important;
        font-weight: 600 !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 5px !important;
        background: #f8fafc !important;
        color: #334155 !important;
        cursor: pointer !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
        padding: 0 2px !important;
    }

    body.force-mobile-mode #visible-count {
        grid-column: 1 / -1 !important;
        grid-row: 3 !important;
        text-align: right !important;
        font-size: 11.5px !important;
        color: #64748b !important;
        line-height: 18px !important;
        margin: 2px 0 0 !important;
        padding-right: 2px !important;
    }

    body.force-mobile-mode .money-search-pool-summary {
        font-size: 11.5px !important;
        text-align: left !important;
        margin-top: 2px !important;
        line-height: 1.3 !important;
    }
}

body.force-mobile-mode .management-tab-content .custom-button,
body.force-mobile-mode .management-group .custom-button,
body.force-mobile-mode .management-group a,
body.force-mobile-mode .management-group button,
body.force-mobile-mode .management-group label,
body.force-mobile-mode .action-group .sort-select,
body.force-mobile-mode .action-group .sort-execute-button,
body.force-mobile-mode #saveAllButton,
body.force-mobile-mode .sort-execute-button,
body.force-mobile-mode .tab-content-panel input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.force-mobile-mode .tab-content-panel select,
body.force-mobile-mode #submit-record-button,
body.force-mobile-mode #search-button,
body.force-mobile-mode #clear-filters-button {
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    box-sizing: border-box !important;
}

/* 強制スマホモードでも収入票はPCモードの横並び（加算日の列形式）を完全維持 */
body.force-mobile-mode #pool-income-form {
    display: block !important;
    margin-bottom: 10px !important;
    width: 100% !important;
}

body.force-mobile-mode #pool-income-form .form-row {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
}

body.force-mobile-mode #pool-income-form .form-item {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 4px !important;
    font-size: 12px !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
}

body.force-mobile-mode #pool-income-form .form-item label {
    display: inline !important;
    font-size: 12px !important;
    font-weight: normal !important;
    color: inherit !important;
    margin: 0 !important;
    white-space: nowrap !important;
    overflow: visible !important;
    line-height: normal !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
}

body.force-mobile-mode #pool-income-form input,
body.force-mobile-mode #pool-income-form select {
    display: inline-block !important;
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
    line-height: normal !important;
    padding: 2px 5px !important;
    border: 1px solid #ccc !important;
    border-radius: 3px !important;
    font-size: 12px !important;
    box-sizing: border-box !important;
    background: #ffffff !important;
}

body.force-mobile-mode #pool-income-date {
    width: 125px !important;
    min-width: 125px !important;
}

body.force-mobile-mode #pool-income-payer {
    width: auto !important;
    min-width: 95px !important;
}

body.force-mobile-mode #pool-income-amount {
    width: 85px !important;
    min-width: 85px !important;
}

body.force-mobile-mode #pool-income-form .form-item:has(#pool-income-memo) {
    flex: 1 !important;
    min-width: 140px !important;
}

body.force-mobile-mode #pool-income-memo {
    width: 100% !important;
    min-width: 120px !important;
}

body.force-mobile-mode #pool-income-form button {
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
    line-height: 20px !important;
    padding: 0 8px !important;
    font-size: 12px !important;
    margin: 0 !important;
    border-radius: 3px !important;
    width: auto !important;
}

body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td input:not([type="checkbox"]),
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td select,
body.force-mobile-mode:not(.force-pc-mode) #money-transactions .money-inline-input:not([type="checkbox"]),
body.force-mobile-mode:not(.force-pc-mode) #money-transactions .money-inline-select,
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td input:not([type="checkbox"]),
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td select {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
    padding: 0 !important;
    margin: 0 !important;
    pointer-events: none !important;
    user-select: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    color: inherit !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    }

/* チェックボックス（積立・回収・出力）強制モード */
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td input[type="checkbox"],
body.force-mobile-mode:not(.force-pc-mode) #money-transactions .money-recovery-toggle input[type="checkbox"],
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td input[type="checkbox"] {
    -webkit-appearance: checkbox !important;
    -moz-appearance: checkbox !important;
    appearance: checkbox !important;
    display: inline-block !important;
    width: 15px !important;
    height: 15px !important;
    min-width: 15px !important;
    min-height: 15px !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: auto !important;
    user-select: auto !important;
    cursor: pointer !important;
    accent-color: #28675e !important;
    opacity: 1 !important;
    visibility: visible !important;
    vertical-align: middle !important;
}

body.force-mobile-mode:not(.force-pc-mode) #money-transactions .money-recovery-toggle,
body.force-mobile-mode:not(.force-pc-mode) .money-income-table .money-recovery-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 16px !important;
    min-height: 16px !important;
    pointer-events: auto !important;
    cursor: pointer !important;
}

body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(6),
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(13),
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(14) {
    text-align: center !important;
}

body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td input::-webkit-inner-spin-button,
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td input::-webkit-outer-spin-button,
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td input::-webkit-calendar-picker-indicator,
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td input::-webkit-inner-spin-button,
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td input::-webkit-outer-spin-button,
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td input::-webkit-calendar-picker-indicator {
    display: none !important;
    -webkit-appearance: none !important;
}

body.force-mobile-mode:not(.force-pc-mode) #money-transactions th:nth-child(16),
body.force-mobile-mode:not(.force-pc-mode) #money-transactions td:nth-child(16),
body.force-mobile-mode:not(.force-pc-mode) #money-transactions th:last-child,
body.force-mobile-mode:not(.force-pc-mode) #money-transactions td:last-child,
body.force-mobile-mode:not(.force-pc-mode) #money-transactions .row-action-cell,
body.force-mobile-mode:not(.force-pc-mode) #money-transactions .row-action-menu,
body.force-mobile-mode:not(.force-pc-mode) .money-income-table th:last-child,
body.force-mobile-mode:not(.force-pc-mode) .money-income-table td:last-child {
    display: none !important;
}

body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody tr td:first-child {
    cursor: pointer !important;
    pointer-events: auto !important;
    font-weight: 700 !important;
    color: #71313a !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
}

body.force-mobile-mode:not(.force-pc-mode) #money-transactions td,
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td,
body.force-mobile-mode:not(.force-pc-mode) .money-income-table td,
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td {
    vertical-align: middle !important;
    padding: 4px 2px !important;
}
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(3),
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(4),
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(7),
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(8),
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(9),
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(10),
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(11),
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(15),
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td:nth-child(3),
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td:nth-child(5) {
    text-align: left !important;
}

body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(3) select,
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(4) select,
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(7) select,
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(8) select,
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(9) select,
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(10) select,
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(11) select,
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(15) input,
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td:nth-child(3) input,
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td:nth-child(3) select,
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td:nth-child(5) input {
    text-align: left !important;
    text-align-last: left !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(5),
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td:nth-child(4),
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td:nth-child(6) {
    text-align: right !important;
}

body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(5) input,
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td:nth-child(4) input,
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td:nth-child(6) input {
    text-align: right !important;
    text-align-last: right !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(2) input,
body.force-mobile-mode:not(.force-pc-mode) #money-transactions tbody td:nth-child(12) input,
body.force-mobile-mode:not(.force-pc-mode) .money-income-table tbody td:nth-child(2) input {
    text-align: center !important;
    text-align-last: center !important;
    width: 100% !important;
    box-sizing: border-box !important;
}


/* スマホ縦: 保存アクションブロック完全非表示 */
@media (max-width: 768px) {
    body:not(.force-pc-mode) .save-action-group,
    body:not(.force-pc-mode) .save-action-group * {
        display: none !important;
    }
}
body.force-mobile-mode:not(.force-pc-mode) .save-action-group,
body.force-mobile-mode:not(.force-pc-mode) .save-action-group * {
    display: none !important;
}

/* 縦画面ではインラインアクションボタンを非表示（フッターを使用） */
.sheet-inline-actions {
    display: none !important;
}

/* ==========================================================================
   【スマホモード統一】タブエリア（タブナビゲーション＋タブパネル内）ボタン統一スタイル
   ※タブの外（アクションバー・ヘッダー・テーブル等）には干渉しないようタブ内に完全限定
   ========================================================================== */

/* 1. タブナビゲーションボタン（フォント11px・太さ600・システムフォント統一） */
body.force-mobile-mode:not(.force-pc-mode) .tab-navigation .tab-button,
body.force-mobile-mode:not(.force-pc-mode) .tab-navigation .tab-manual-btn,
body.force-mobile-mode:not(.force-pc-mode) .tab-button,
body.force-mobile-mode:not(.force-pc-mode) .tab-manual-btn {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans JP", sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: normal !important;
}

/* 2. タブパネル内の全ボタン（データ管理・追加・検索パネル内：高さ30px・フォント12px・太さ600統一） */
body.force-mobile-mode:not(.force-pc-mode) .tab-content-panel button,
body.force-mobile-mode:not(.force-pc-mode) .tab-content-panel .custom-button,
body.force-mobile-mode:not(.force-pc-mode) .tab-content-panel a.custom-button,
body.force-mobile-mode:not(.force-pc-mode) .tab-content-panel input[type="button"],
body.force-mobile-mode:not(.force-pc-mode) .tab-content-panel input[type="submit"],
body.force-mobile-mode:not(.force-pc-mode) .management-tab-content .custom-button,
body.force-mobile-mode:not(.force-pc-mode) .management-group .custom-button,
body.force-mobile-mode:not(.force-pc-mode) .management-group a,
body.force-mobile-mode:not(.force-pc-mode) .management-group button,
body.force-mobile-mode:not(.force-pc-mode) .management-group label,
body.force-mobile-mode:not(.force-pc-mode) .search-tab-content button,
body.force-mobile-mode:not(.force-pc-mode) .search-tab-content .custom-button,
body.force-mobile-mode:not(.force-pc-mode) .search-tab-content #searchButton,
body.force-mobile-mode:not(.force-pc-mode) .search-tab-content #outOfStockButton,
body.force-mobile-mode:not(.force-pc-mode) .search-tab-content #clearFilterButton,
body.force-mobile-mode:not(.force-pc-mode) #tab-panel-search button,
body.force-mobile-mode:not(.force-pc-mode) #tab-panel-search #searchButton,
body.force-mobile-mode:not(.force-pc-mode) #tab-panel-search #outOfStockButton,
body.force-mobile-mode:not(.force-pc-mode) #tab-panel-search #clearFilterButton,
body.force-mobile-mode:not(.force-pc-mode) #tab-panel-add button,
body.force-mobile-mode:not(.force-pc-mode) #tab-panel-manage button,
body.force-mobile-mode:not(.force-pc-mode) #tab-search button,
body.force-mobile-mode:not(.force-pc-mode) #tab-add button,
body.force-mobile-mode:not(.force-pc-mode) #tab-manage button,
body.force-mobile-mode:not(.force-pc-mode) .form-section button,
body.force-mobile-mode:not(.force-pc-mode) .add-form-row .custom-button,
body.force-mobile-mode:not(.force-pc-mode) #addButton,
body.force-mobile-mode:not(.force-pc-mode) #scanButton,
body.force-mobile-mode:not(.force-pc-mode) #addButton2,
body.force-mobile-mode:not(.force-pc-mode) #compressButton,
body.force-mobile-mode:not(.force-pc-mode) #addPriceSubmitBtn,
body.force-mobile-mode:not(.force-pc-mode) #addWalletSubmitBtn,
body.force-mobile-mode:not(.force-pc-mode) #submit-record-button,
body.force-mobile-mode:not(.force-pc-mode) #searchButton,
body.force-mobile-mode:not(.force-pc-mode) #searchButtonNew,
body.force-mobile-mode:not(.force-pc-mode) #tabSearchButton,
body.force-mobile-mode:not(.force-pc-mode) #search-button,
body.force-mobile-mode:not(.force-pc-mode) #clearFilterButton,
body.force-mobile-mode:not(.force-pc-mode) #clearFilterButtonNew,
body.force-mobile-mode:not(.force-pc-mode) #tabClearFilterButton,
body.force-mobile-mode:not(.force-pc-mode) #clear-filters-button,
body.force-mobile-mode:not(.force-pc-mode) #outOfStockButton,
body.force-mobile-mode:not(.force-pc-mode) #tabExpiringButton {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans JP", sans-serif !important;
    height: 30px !important;
    min-height: 30px !important;
    line-height: 28px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    box-sizing: border-box !important;
}

/* レスポンシブ (max-width: 768px) 用ルール */
@media (max-width: 768px), (max-height: 500px) and (orientation: landscape) {
    body:not(.force-pc-mode) .tab-navigation .tab-button,
    body:not(.force-pc-mode) .tab-navigation .tab-manual-btn,
    body:not(.force-pc-mode) .tab-button,
    body:not(.force-pc-mode) .tab-manual-btn {
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans JP", sans-serif !important;
        font-size: 11px !important;
        font-weight: 600 !important;
        line-height: normal !important;
    }

    body:not(.force-pc-mode) .tab-content-panel button,
    body:not(.force-pc-mode) .tab-content-panel .custom-button,
    body:not(.force-pc-mode) .tab-content-panel a.custom-button,
    body:not(.force-pc-mode) .tab-content-panel input[type="button"],
    body:not(.force-pc-mode) .tab-content-panel input[type="submit"],
    body:not(.force-pc-mode) .management-tab-content .custom-button,
    body:not(.force-pc-mode) .management-group .custom-button,
    body:not(.force-pc-mode) .management-group a,
    body:not(.force-pc-mode) .management-group button,
    body:not(.force-pc-mode) .management-group label,
    body:not(.force-pc-mode) .search-tab-content button,
    body:not(.force-pc-mode) .search-tab-content .custom-button,
    body:not(.force-pc-mode) .search-tab-content #searchButton,
    body:not(.force-pc-mode) .search-tab-content #outOfStockButton,
    body:not(.force-pc-mode) .search-tab-content #clearFilterButton,
    body:not(.force-pc-mode) #tab-panel-search button,
    body:not(.force-pc-mode) #tab-panel-search #searchButton,
    body:not(.force-pc-mode) #tab-panel-search #outOfStockButton,
    body:not(.force-pc-mode) #tab-panel-search #clearFilterButton,
    body:not(.force-pc-mode) #tab-panel-add button,
    body:not(.force-pc-mode) #tab-panel-manage button,
    body:not(.force-pc-mode) #tab-search button,
    body:not(.force-pc-mode) #tab-add button,
    body:not(.force-pc-mode) #tab-manage button,
    body:not(.force-pc-mode) .form-section button,
    body:not(.force-pc-mode) .add-form-row .custom-button,
    body:not(.force-pc-mode) #addButton,
    body:not(.force-pc-mode) #scanButton,
    body:not(.force-pc-mode) #addButton2,
    body:not(.force-pc-mode) #compressButton,
    body:not(.force-pc-mode) #addPriceSubmitBtn,
    body:not(.force-pc-mode) #addWalletSubmitBtn,
    body:not(.force-pc-mode) #submit-record-button,
    body:not(.force-pc-mode) #searchButton,
    body:not(.force-pc-mode) #searchButtonNew,
    body:not(.force-pc-mode) #tabSearchButton,
    body:not(.force-pc-mode) #search-button,
    body:not(.force-pc-mode) #clearFilterButton,
    body:not(.force-pc-mode) #clearFilterButtonNew,
    body:not(.force-pc-mode) #tabClearFilterButton,
    body:not(.force-pc-mode) #clear-filters-button,
    body:not(.force-pc-mode) #outOfStockButton,
    body:not(.force-pc-mode) #tabExpiringButton {
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans JP", sans-serif !important;
        height: 30px !important;
        min-height: 30px !important;
        line-height: 28px !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        box-sizing: border-box !important;
    }
}

/* スマホモード（縦画面・横画面・強制スマホモード）: ソート実行ボタンを完全非表示 */
@media screen and (max-width: 1024px) {
    body:not(.force-pc-mode) #sortExecuteButton,
    body:not(.force-pc-mode) .sort-execute-button,
    body:not(.force-pc-mode) .action-group .sort-execute-button,
    body:not(.force-pc-mode) .sort-control-wrap .sort-execute-button {
        display: none !important;
    }
}
@media screen and (orientation: landscape) and (max-height: 600px) {
    body:not(.force-pc-mode) #sortExecuteButton,
    body:not(.force-pc-mode) .sort-execute-button,
    body:not(.force-pc-mode) .action-group .sort-execute-button,
    body:not(.force-pc-mode) .sort-control-wrap .sort-execute-button {
        display: none !important;
    }
}
body.force-mobile-mode:not(.force-pc-mode) #sortExecuteButton,
body.force-mobile-mode:not(.force-pc-mode) .sort-execute-button,
body.force-mobile-mode:not(.force-pc-mode) .action-group .sort-execute-button,
body.force-mobile-mode:not(.force-pc-mode) .sort-control-wrap .sort-execute-button {
    display: none !important;
}