/* =============================================
   大江戸レジ – iPad固定px版
   全要素px固定。ブラウザ/PWA両対応。
   ============================================= */
* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; touch-action:manipulation; -webkit-touch-callout:none; }
button { cursor:pointer; -webkit-appearance:none; }

:root { --vh:100vh; }
html, body {
    height:var(--vh); width:100%; overflow:hidden;
    font-family:-apple-system,BlinkMacSystemFont,'Hiragino Sans',sans-serif;
    background:#d4d4d4; color:#333;
    user-select:none; -webkit-user-select:none;
    padding:0; margin:0;
}

/* === ヘッダー 50px === */
#app-header {
    display:flex; align-items:flex-end; justify-content:space-between;
    height:100px; padding:0 16px 10px;
    background:linear-gradient(135deg,#4a7c59,#5d8a68);
    color:#fff; box-shadow:0 1px 4px rgba(0,0,0,.1); z-index:100; position:relative;
}
.header-left { display:flex; align-items:center; gap:6px; }
.header-logo { width:64px; height:64px; border-radius:50%; }
.header-title-wrap { display:flex; flex-direction:column; align-items:flex-start; gap:2px; line-height:1; }
#app-header h1 { font-size:28px; font-weight:700; letter-spacing:1px; }
.header-center { display:flex; align-items:center; gap:5px; }
.header-center label { font-size:18px; opacity:.9; }
#date-picker {
    padding:6px 12px; border:1px solid rgba(255,255,255,.4); border-radius:6px;
    background:linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.08));
    color:#fff; font-size:20px;
    box-shadow:0 3px 0 rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.35);
    transition:transform .05s;
}
#date-picker:active { transform:translateY(2px); box-shadow:0 1px 0 rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.3); }
#date-picker::-webkit-calendar-picker-indicator { filter:invert(1); }
.header-right { display:flex; gap:8px; align-items:center; }
.header-btn {
    padding:10px 20px; border:1px solid rgba(255,255,255,.4); border-radius:8px;
    background:linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.08));
    color:#fff; font-size:20px; font-weight:600; cursor:pointer;
    box-shadow:0 3px 0 rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.35);
    transition:transform .05s;
}
.header-btn:active { transform:translateY(3px); box-shadow:0 0 0 rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.3); }
.btn-closing {
    background:linear-gradient(180deg, #e07060, #c0453a, #a03028) !important;
    border:1px solid rgba(255,255,255,.3) !important;
    box-shadow:0 3px 0 #701a14, inset 0 1px 0 rgba(255,255,255,.3) !important;
}
.btn-closing:active { transform:translateY(3px); box-shadow:0 0 0 #701a14, inset 0 1px 0 rgba(255,255,255,.3) !important; }
.sync-indicator {
    display:inline-block;
    padding:8px 16px;
    border-radius:6px;
    font-size:16px;
    font-weight:700;
    color:#fff;
    background:linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.08));
    border:1px solid rgba(255,255,255,.4);
    box-shadow:0 3px 0 rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.35);
    white-space:nowrap;
    cursor:pointer;
    user-select:none;
    -webkit-tap-highlight-color:transparent;
    transition:transform .05s;
    letter-spacing:.3px;
}
.sync-indicator:empty { display:none; }
.sync-indicator:active {
    transform:translateY(3px);
    box-shadow:0 0 0 rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.35);
}
.sync-indicator.online { color:#c8f7c8; }
.sync-indicator.syncing { color:#ffe29a; }
.sync-indicator.offline { color:#ffb7b7; }
.sync-indicator.error { color:#ffb7b7; }
.btn-closing { background:rgba(255,82,82,.75); border-color:rgba(255,82,82,.5); }

/* === 画面 === */
.screen { display:none; height:calc(var(--vh) - 100px); overflow:hidden; }
.screen.active { display:flex; }

/* =============================================
   1ページ目 メイン会計画面
   カテゴリ90 + 金額38 + テンキー4行 + 下段60 = 残りflex
   ============================================= */
.reg-grid { display:flex; flex-direction:column; width:100%; height:100%; }

.row-category {
    display:flex; gap:5px; padding:4px 6px;
    background:#d4d4d4; height:130px; flex-shrink:0;
}
.cat-prescription { flex:2.5; font-size:38px !important; }
.cat-selfpay, .cat-otc10, .cat-otc8, .cat-other { flex:1; }
.cat-btn {
    display:flex; align-items:center; justify-content:center;
    border:none; border-radius:14px;
    font-size:28px; font-weight:800; cursor:pointer; transition:transform .03s; letter-spacing:.5px;
    line-height:1.2; text-align:center;
    box-shadow: 0 5px 0 rgba(0,0,0,.18), 0 6px 4px rgba(0,0,0,.1), inset 0 2px 0 rgba(255,255,255,.6), inset 0 -2px 4px rgba(0,0,0,.05);
    border-top:1px solid rgba(255,255,255,.5);
}
.cat-btn .cat-main { pointer-events:none; }
.cat-btn:active { box-shadow:0 1px 0 rgba(0,0,0,.15); transform:translateY(4px); }
.cat-btn.selected { box-shadow:0 2px 0 rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.4); transform:translateY(3px); }

/* 和モダン立体 */
.cat-prescription { background:linear-gradient(180deg,#dfe6ee 0%,#c5d0de 60%,#b0bdd0 100%); color:#2b4a6e; }
.cat-prescription.selected { background:linear-gradient(180deg,#c5d0de 0%,#a8b8cc 60%,#95a8c0 100%); }
.cat-selfpay { background:linear-gradient(180deg,#ddeedd 0%,#c0d8be 60%,#a8c8a6 100%); color:#3a6a40; }
.cat-selfpay.selected { background:linear-gradient(180deg,#c0d8be 0%,#a0c49c 60%,#8cb888 100%); }
.cat-otc10 { background:linear-gradient(180deg,#f2e0cc 0%,#e0c8a8 60%,#d0b490 100%); color:#8b5a2b; }
.cat-otc10.selected { background:linear-gradient(180deg,#e0c8a8 0%,#ccb090 60%,#c0a080 100%); }
.cat-otc8 { background:linear-gradient(180deg,#ede4d8 0%,#dcd0c0 60%,#ccbea8 100%); color:#7a6652; }
.cat-otc8.selected { background:linear-gradient(180deg,#dcd0c0 0%,#c8b8a4 60%,#bca890 100%); }
.cat-other { background:linear-gradient(180deg,#f0f0f0 0%,#d8d8d8 60%,#c4c4c4 100%); color:#555; }
.cat-other.selected { background:linear-gradient(180deg,#d8d8d8 0%,#c0c0c0 60%,#b0b0b0 100%); }

/* その他ダイアログ */
.kobun-overlay { position:fixed; inset:0; background:rgba(0,0,0,.5); display:flex; align-items:center; justify-content:center; z-index:1000; }
.kobun-box { display:flex; flex-direction:column; gap:12px; background:#fff; border-radius:16px; padding:24px 32px; min-width:300px; }
.kobun-choice { padding:28px 48px; border:3px solid #d1d5db; border-radius:14px; background:#fff; font-size:32px; font-weight:700; cursor:pointer; text-align:center; min-width:140px; }
.kobun-choice:active { transform:scale(.97); }
.kobun-choice-in { color:#0369a1; }
.kobun-choice-in:active { background:#e0f2fe; border-color:#0369a1; }
.kobun-choice-out { color:#be185d; }
.kobun-choice-out:active { background:#fce7f3; border-color:#be185d; }
.kobun-cancel { padding:14px; border:none; border-radius:10px; background:#f3f4f6; color:#6b7280; font-size:18px; font-weight:600; cursor:pointer; }
.kobun-cancel:active { background:#e5e7eb; }
.other-section-label { font-size:24px; font-weight:800; color:#333; padding:8px 0 4px; text-align:center; }
.other-row { display:flex; gap:10px; justify-content:center; }

/* テンキー+カート */
.row-main { display:flex; flex:1; min-height:0; overflow:hidden; }

.tenkey-area {
    flex:1; display:flex; flex-direction:column; padding:4px 5px;
    background:#d4d4d4; border-right:1px solid #bbb;
}
.mode-banner { display:none; }
.amount-bar {
    display:flex; align-items:center; padding:4px 12px; height:80px; flex-shrink:0;
    background:#fff; border-radius:8px; border:2px solid #d1d5db;
}
.amount-badge { display:none; padding:6px 14px; border-radius:8px; font-size:18px; font-weight:800; white-space:nowrap; }
.amount-badge.badge-outflow { display:block; background:#be185d; color:#fff; }
.amount-badge.badge-inflow { display:block; background:#0369a1; color:#fff; }
.amount-bar.outflow-active { border-color:#be185d; }
.amount-bar.outflow-active .amount-value { color:#be185d; }
.amount-bar.inflow-active { border-color:#0369a1; }
.amount-bar.inflow-active .amount-value { color:#0369a1; }
.amount-sign { font-size:32px; font-weight:800; margin-right:2px; display:none; }
.amount-bar.outflow-active .amount-sign { display:inline; color:#be185d; }
.amount-bar.inflow-active .amount-sign { display:none; }
.amount-value { font-size:48px; font-weight:800; color:#4a7c59; letter-spacing:1px; }

.tenkey-grid {
    display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(4,1fr);
    gap:3px; flex:1 1 0; min-height:0; margin-top:3px;
}
.tk {
    border:none; border-radius:10px;
    background:linear-gradient(180deg, #fafafa 0%, #e0e0e0 60%, #c8c8c8 100%);
    font-size:24px; font-weight:600; color:#333; cursor:pointer; transition:transform .03s; min-height:0;
    box-shadow: 0 5px 0 #888, 0 6px 2px rgba(0,0,0,.25), 0 8px 6px rgba(0,0,0,.1), inset 0 2px 0 rgba(255,255,255,.9), inset 0 -2px 4px rgba(0,0,0,.06);
    border-top:1px solid rgba(255,255,255,.7);
}
.tk:active { background:linear-gradient(180deg,#d8d8d8,#c4c4c4,#b8b8b8); box-shadow:0 1px 0 #888; transform:translateY(4px); }
.tk-clear {
    background:linear-gradient(180deg, #fde8e8 0%, #f0baba 60%, #e09a9a 100%); color:#8b1a1a;
    box-shadow: 0 5px 0 #a07070, 0 6px 2px rgba(0,0,0,.2), inset 0 2px 0 rgba(255,255,255,.7);
}
.tk-clear:active { background:linear-gradient(180deg,#f0baba,#dea0a0,#d09090); box-shadow:0 1px 0 #a07070; transform:translateY(4px); }

.tenkey-bottom-row { display:flex; gap:3px; margin-top:3px; height:90px; flex-shrink:0; }
.tk-bs {
    flex:1; font-size:22px; color:#666; cursor:pointer; display:flex; align-items:center; justify-content:center;
    background:linear-gradient(180deg,#f3f4f6,#dcdde0,#c8c9cc); border:none; border-radius:10px;
    box-shadow: 0 5px 0 #909090, 0 6px 2px rgba(0,0,0,.2), inset 0 2px 0 rgba(255,255,255,.7);
    border-top:1px solid rgba(255,255,255,.5); transition:transform .03s;
}
.tk-bs:active { transform:translateY(4px); box-shadow:0 1px 0 #909090; }
.tk-add {
    flex:2; font-size:22px; font-weight:700; border:none; border-radius:8px; color:#fff; cursor:pointer;
    letter-spacing:2px; display:flex; align-items:center; justify-content:center;
    background:linear-gradient(180deg,#6aa07a,#4a7c59,#386845);
    box-shadow: 0 5px 0 #2a4e32, 0 6px 2px rgba(0,0,0,.25), inset 0 2px 0 rgba(255,255,255,.3);
    border-top:1px solid rgba(255,255,255,.2); transition:transform .03s;
}
.tk-add:disabled { background:#9ca3af; box-shadow:0 5px 0 #6a6a6a; cursor:not-allowed; }
.tk-add:not(:disabled):active { transform:translateY(4px); box-shadow:0 1px 0 #2a4e32; }

/* カート */
.cart-area { flex:0 0 250px; display:flex; flex-direction:column; padding:4px 5px; background:#d4d4d4; }
.cart-title { font-size:20px; font-weight:700; color:#fff; background:#4a7c59; text-align:center; padding:6px; border-radius:8px 8px 0 0; flex-shrink:0; }
.cart-list { flex:1; overflow-y:auto; background:#f9fafb; border-radius:0 0 8px 8px; border:1px solid #e5e7eb; min-height:0; }
.cart-empty { padding:20px; text-align:center; color:#9ca3af; font-size:16px; }
.cart-item { display:flex; align-items:center; padding:8px 10px; border-bottom:1px solid #f0f0f0; gap:6px; font-size:15px; }
.cart-item:last-child { border-bottom:none; }
.cart-item-cat { font-size:14px; font-weight:700; padding:3px 8px; border-radius:5px; white-space:nowrap; }
.cart-item-cat-処方箋 { background:#dbeafe; color:#1e40af; }
.cart-item-cat-自費 { background:#d1fae5; color:#065f46; }
.cart-item-cat-OTC10 { background:#ffedd5; color:#c2410c; }
.cart-item-cat-OTC8 { background:#fef9c3; color:#a16207; }
.cart-item-cat-小分け { background:#ede9fe; color:#6d28d9; }
.cart-item-cat-小分け入金 { background:#e0f2fe; color:#0369a1; }
.cart-item-cat-小分け出金 { background:#fce7f3; color:#be185d; }
.cart-item-cat-その他入金 { background:#e0f2fe; color:#0369a1; }
.cart-item-cat-その他出金 { background:#fce7f3; color:#be185d; }
.cart-item-amount { flex:1; text-align:right; font-weight:700; font-size:18px; }
.cart-item-method { font-size:13px; color:#6b7280; }
.cart-item-delete { width:40px; height:40px; border:none; border-radius:8px; background:#fee2e2; color:#b91c1c; font-size:16px; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.cart-item-delete:active { background:#fecaca; }
.cart-footer { margin-top:4px; flex-shrink:0; }
.cart-subtotal {
    display:flex; justify-content:space-between; align-items:center;
    padding:12px 14px; height:88px; background:#4a7c59; color:#fff; border-radius:8px; font-size:26px; font-weight:700;
}
.btn-checkout {
    width:100%; margin-top:4px; height:90px; border:none; border-radius:8px;
    background:linear-gradient(180deg,#4a9f52,#2e7d32,#1f5c23); color:#fff; font-size:20px; font-weight:700;
    cursor:pointer; letter-spacing:1px; display:flex; align-items:center; justify-content:center;
    box-shadow: 0 5px 0 #174a1b, 0 6px 2px rgba(0,0,0,.25), inset 0 2px 0 rgba(255,255,255,.25);
    border-top:1px solid rgba(255,255,255,.15); transition:transform .03s;
}
.btn-checkout:disabled { background:#9ca3af; box-shadow:0 5px 0 #6a6a6a; cursor:not-allowed; }
.btn-checkout:not(:disabled):active { transform:translateY(4px); box-shadow:0 1px 0 #174a1b; }

/* =============================================
   2ページ目 会計画面
   支払ボタン80 + メイン残り
   ============================================= */
.chg-layout { display:flex; flex-direction:column; width:100%; height:100%; }

.chg-top-row {
    display:flex; gap:5px; padding:4px 6px;
    background:#d4d4d4; height:130px; flex-shrink:0;
}
.pay-btn {
    flex:1; border:none; border-radius:14px;
    background:linear-gradient(180deg,#fafafa,#e4e4e4,#d0d0d0);
    font-size:30px; font-weight:700; cursor:pointer; text-align:center;
    display:flex; align-items:center; justify-content:center; transition:transform .03s;
    box-shadow: 0 5px 0 rgba(0,0,0,.15), 0 6px 4px rgba(0,0,0,.08), inset 0 2px 0 rgba(255,255,255,.7);
    border-top:1px solid rgba(255,255,255,.5); color:#333;
}
.pay-btn:active { transform:translateY(4px); box-shadow:0 1px 0 rgba(0,0,0,.15); }
/* 現金: 若草色 */
.pay-btn[data-method="現金"] { background:linear-gradient(180deg,#d4e4d1,#b8d4b3,#9cc49a); color:#3a6a40; box-shadow:0 5px 0 #4a7050, inset 0 2px 0 rgba(255,255,255,.5); }
.pay-btn[data-method="現金"].active { background:linear-gradient(180deg,#b8d4b3,#9cc49a,#80b47e); transform:translateY(3px); box-shadow:0 2px 0 #4a7050; }
/* クレジット: 藍鼠 */
.pay-btn[data-method="クレジット"] { background:linear-gradient(180deg,#d5dce6,#b8c7d8,#a0b2c8); color:#2b4a6e; box-shadow:0 5px 0 #4a5a78, inset 0 2px 0 rgba(255,255,255,.5); }
.pay-btn[data-method="クレジット"].active { background:linear-gradient(180deg,#b8c7d8,#a0b2c8,#8a9cb8); color:#1a3050; transform:translateY(3px); box-shadow:0 2px 0 #4a5a78; }
/* QR: 朽葉色 */
.pay-btn[data-method="QR"] { background:linear-gradient(180deg,#ebd8c3,#dcc4a8,#ccb090); color:#7a5a30; box-shadow:0 5px 0 #8a7050, inset 0 2px 0 rgba(255,255,255,.5); }
.pay-btn[data-method="QR"].active { background:linear-gradient(180deg,#dcc4a8,#ccb090,#bca078); transform:translateY(3px); box-shadow:0 2px 0 #8a7050; }
.pay-btn.active:active { transform:translateY(4px); box-shadow:0 1px 0 rgba(0,0,0,.2); }
.chg-back-btn { background:linear-gradient(180deg,#e8e8e8,#cccccc,#b8b8b8) !important; color:#555 !important; box-shadow:0 5px 0 #888, inset 0 2px 0 rgba(255,255,255,.5) !important; }
.chg-back-btn:active { transform:translateY(4px); box-shadow:0 1px 0 #888 !important; }

.chg-main { display:flex; flex:1; min-height:0; overflow:hidden; }

/* 左テンキー */
.chg-tenkey-side {
    flex:1; display:flex; flex-direction:column; align-items:center;
    padding:3px 6px; gap:2px; background:#d4d4d4; border-right:1px solid #bbb;
}
/* 合計は除いてグレーアウト */
.chg-tenkey-side.grayed-out .deposit-bar,
.chg-tenkey-side.grayed-out .bill-shortcuts,
.chg-tenkey-side.grayed-out .dep-tenkey,
.chg-tenkey-side.grayed-out .change-result {
    opacity:.3; pointer-events:none;
}
.chg-total-bar {
    display:flex; justify-content:space-between; align-items:center;
    width:100%; max-width:480px; padding:8px 16px; height:70px;
    background:#4a7c59; color:#fff; border-radius:8px; flex-shrink:0;
}
.chg-total-label { font-size:24px; font-weight:700; }
.chg-total-value { font-size:42px; font-weight:800; }
.deposit-bar {
    display:flex; justify-content:space-between; align-items:center;
    width:100%; max-width:480px; padding:8px 16px; height:70px;
    background:#fff; border-radius:8px; border:2px solid #d1d5db; flex-shrink:0;
}
.deposit-label { font-size:24px; font-weight:700; color:#6b7280; }
.deposit-value { font-size:42px; font-weight:700; color:#333; }
.bill-shortcuts { display:flex; gap:4px; width:100%; max-width:480px; flex-shrink:0; }
.bill-btn { flex:1; height:70px; border:2px solid #4a7c59; border-radius:8px; background:#e8f5e9; color:#4a7c59; font-size:20px; font-weight:700; cursor:pointer; }
.bill-btn:active { background:#c8e6c9; transform:scale(.96); }
.dep-tenkey {
    display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(4,1fr);
    gap:2px; width:100%; max-width:480px; flex:1 1 0; min-height:0;
}
.dep-tenkey .tk { font-size:24px; }
.change-result {
    text-align:center; padding:6px; width:100%; max-width:480px; flex-shrink:0;
    background:#fff; border-radius:10px; border:3px solid #d1d5db; transition:all .2s; display:none;
}
.change-result.has-change { border-color:#2e7d32; background:#e8f5e9; }
.change-result.insufficient { border-color:#b91c1c; background:#fee2e2; }
.change-result-label { font-size:13px; color:#6b7280; }
.change-result-value { font-size:44px; font-weight:800; color:#2e7d32; letter-spacing:2px; }
.change-result.insufficient .change-result-value { color:#b91c1c; }

/* 右明細 */
.chg-detail-side { flex:0 0 250px; display:flex; flex-direction:column; padding:4px; background:#d4d4d4; }
.chg-detail-title { font-size:20px; font-weight:700; color:#fff; background:#4a7c59; text-align:center; padding:6px; border-radius:8px 8px 0 0; flex-shrink:0; }
.chg-items-wrap { flex:1; overflow-y:auto; background:#f9fafb; border-radius:0 0 8px 8px; border:1px solid #e5e7eb; padding:8px; min-height:0; }
.change-item-row { display:flex; justify-content:space-between; padding:8px 0; font-size:18px; font-weight:600; border-bottom:1px solid #f0f0f0; }
.change-item-row:last-child { border-bottom:none; }
.change-total-row { display:none; }
.change-total { font-size:30px; font-weight:800; color:#b91c1c; display:none; }
.change-cash-row { display:flex; justify-content:space-between; padding:4px; font-size:14px; color:#6b7280; }
.btn-confirm {
    margin-top:4px; height:90px; flex-shrink:0; border:none; border-radius:12px;
    background:linear-gradient(180deg,#4a9f52,#2e7d32,#1f5c23); color:#fff; font-size:24px; font-weight:700;
    cursor:pointer; letter-spacing:1px; display:flex; align-items:center; justify-content:center;
    box-shadow: 0 5px 0 #174a1b, 0 6px 2px rgba(0,0,0,.25), inset 0 2px 0 rgba(255,255,255,.25);
    border-top:1px solid rgba(255,255,255,.15); transition:transform .03s;
}
.btn-confirm:disabled { background:#9ca3af; box-shadow:0 5px 0 #6a6a6a; cursor:not-allowed; }
.btn-confirm:not(:disabled):active { transform:translateY(4px); box-shadow:0 1px 0 #174a1b; }

.btn-back {
    padding:16px 32px; border:none; border-radius:12px;
    background:linear-gradient(180deg,#e8e8e8,#d0d0d0,#bbb);
    color:#555; font-size:22px; font-weight:700; cursor:pointer;
    box-shadow: 0 5px 0 #888, 0 6px 2px rgba(0,0,0,.15), inset 0 2px 0 rgba(255,255,255,.6);
    transition:transform .03s;
}
.btn-back:active { transform:translateY(4px); box-shadow:0 1px 0 #888; }

/* =============================================
   履歴・レジ締め
   ============================================= */
.history-layout,.closing-layout { width:100%; padding:14px; display:flex; flex-direction:column; height:100%; overflow-y:auto; }
.history-header,.closing-header { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.history-header h2,.closing-header h2 { font-size:24px; flex:1; }
#history-date-picker { padding:6px 12px; border:1px solid #d1d5db; border-radius:6px; font-size:18px; }
.history-search {
    display:flex; gap:6px; margin-bottom:10px;
}
.history-search input {
    flex:1; padding:10px 14px; border:2px solid #d1d5db; border-radius:10px;
    font-size:20px; background:#fff; outline:none;
}
.history-search input:focus { border-color:#4a7c59; }
.search-clear-btn {
    width:48px; height:48px; border:none; border-radius:10px;
    background:#e5e7eb; color:#6b7280; font-size:20px; font-weight:700; cursor:pointer;
    display:flex; align-items:center; justify-content:center;
}
.search-clear-btn:active { background:#d1d5db; }
.history-summary { display:flex; gap:12px; margin-bottom:12px; }
.summary-card { background:#fff; border-radius:10px; padding:14px 24px; box-shadow:0 1px 3px rgba(0,0,0,.06); text-align:center; min-width:140px; }
.summary-card-label { font-size:16px; color:#6b7280; }
.summary-card-value { font-size:32px; font-weight:800; color:#4a7c59; }
.history-list { flex:1; overflow-y:auto; background:#fff; border-radius:8px; box-shadow:0 1px 3px rgba(0,0,0,.06); }
.history-item { display:flex; align-items:center; padding:14px 14px; border-bottom:1px solid #e8e8e8; gap:10px; min-height:60px; }
.history-time { font-size:18px; color:#6b7280; flex:0 0 60px; }
.history-detail { flex:1; font-size:16px; }
.history-detail-items { display:flex; flex-wrap:wrap; gap:5px; }
.history-detail-tag { font-size:18px; font-weight:700; padding:6px 12px; border-radius:6px; }
.history-detail-tag-処方箋 { background:#dbeafe; color:#1e40af; }
.history-detail-tag-自費 { background:#d1fae5; color:#065f46; }
.history-detail-tag-OTC10 { background:#ffedd5; color:#c2410c; }
.history-detail-tag-OTC8 { background:#fef9c3; color:#a16207; }
.history-detail-tag-小分け { background:#ede9fe; color:#6d28d9; }
.history-detail-tag-小分け入金 { background:#e0f2fe; color:#0369a1; }
.history-detail-tag-小分け出金 { background:#fce7f3; color:#be185d; }
.history-detail-tag-その他入金 { background:#e0f2fe; color:#0369a1; }
.history-detail-tag-その他出金 { background:#fce7f3; color:#be185d; }
.history-amount { font-size:22px; font-weight:700; flex:0 0 120px; text-align:right; }
.history-amount.negative { color:#b91c1c; }
.history-edit-btn {
    flex:0 0 70px; height:44px; border:none; border-radius:10px;
    background:linear-gradient(180deg,#e8e8e8,#d0d0d0,#c0c0c0);
    color:#555; font-size:16px; font-weight:700; cursor:pointer;
    box-shadow: 0 4px 0 #999, inset 0 1px 0 rgba(255,255,255,.6);
    transition:transform .03s;
}
.history-edit-btn:active { transform:translateY(3px); box-shadow:0 1px 0 #999; }
.history-empty { padding:30px; text-align:center; color:#9ca3af; font-size:18px; }

/* 編集ダイアログ */
.edit-dialog {
    background:#fff; border-radius:16px; padding:24px; min-width:400px; max-width:90%;
}
.edit-dialog h3 { font-size:22px; font-weight:700; margin-bottom:8px; }
.edit-time { font-size:16px; color:#6b7280; margin-bottom:12px; }
.edit-items { display:flex; flex-direction:column; gap:10px; margin-bottom:16px; }
.edit-item-row { display:flex; align-items:center; gap:8px; }
.edit-item-cat { font-size:16px; font-weight:700; min-width:100px; }
.edit-item-amount {
    width:120px; padding:10px; border:2px solid #d1d5db; border-radius:8px;
    font-size:20px; font-weight:700; text-align:right;
}
.edit-item-method {
    padding:10px; border:2px solid #d1d5db; border-radius:8px;
    font-size:16px; font-weight:600; background:#fff;
}
.edit-buttons { display:flex; gap:10px; }
.edit-delete-btn {
    padding:14px 20px; border:none; border-radius:10px;
    background:#b91c1c; color:#fff; font-size:18px; font-weight:700; cursor:pointer;
}
.edit-delete-btn:active { opacity:.8; }
.edit-cancel-btn {
    flex:1; padding:14px; border:2px solid #d1d5db; border-radius:10px;
    background:#f3f4f6; color:#6b7280; font-size:18px; font-weight:600; cursor:pointer;
}
.edit-save-btn {
    flex:1; padding:14px; border:none; border-radius:10px;
    background:#2e7d32; color:#fff; font-size:18px; font-weight:700; cursor:pointer;
}
.edit-save-btn:active { opacity:.8; }
.closing-layout { max-width:960px; margin:0 auto; height:100%; display:flex; flex-direction:column; overflow:hidden; padding:8px 14px; }
.closing-date { font-size:20px; font-weight:700; color:#4a7c59; }
.closing-body { display:flex; gap:12px; flex:1; min-height:0; }
/* カテゴリ側: テーブルが全高さ使う */
.closing-section { flex:1; display:flex; flex-direction:column; }
.closing-section h3 { font-size:18px; color:#444; margin-bottom:4px; font-weight:800; flex-shrink:0; }
/* カテゴリテーブル: 行が均等に広がる */
.closing-section:first-child .closing-table { flex:0 1 80%; }
.closing-section:first-child .closing-table td { padding:0 12px; font-size:20px; font-weight:600; vertical-align:middle; }
.closing-section:first-child .closing-table tr { height:calc((100% - 36px) / 8); }
/* 支払方法側: テーブルは上部に、下に総売上 */
.closing-section:last-child { justify-content:flex-start; }
.closing-table { width:100%; border-collapse:collapse; background:#fff; border-radius:10px; overflow:hidden; box-shadow:0 1px 3px rgba(0,0,0,.06); }
.closing-table th { background:#f3f4f6; padding:8px 12px; text-align:left; font-size:16px; color:#555; font-weight:700; }
.closing-table th:last-child,.closing-table td:last-child { text-align:right; }
.closing-table th:nth-child(2),.closing-table td:nth-child(2) { text-align:center; }
.closing-table td { padding:10px 12px; border-top:1px solid #e8e8e8; font-size:20px; font-weight:600; }
.closing-section:last-child .closing-table td { padding:18px 12px; }
.closing-total { background:#4a7c59; color:#fff; border-radius:10px; padding:12px 16px; margin-top:4px; flex-shrink:0; }
.closing-total-row { display:flex; justify-content:space-between; padding:16px 0; font-size:24px; font-weight:700; }
.closing-total-row:first-child { font-size:30px; font-weight:800; border-bottom:1px solid rgba(255,255,255,.3); padding-bottom:18px; }
.closing-actions { padding:8px 0; text-align:center; flex-shrink:0; }
/* レジ締めコンテナ */
.closing-container { display:flex; flex-direction:column; width:100%; height:100%; }
.closing-top { flex-shrink:0; background:#d4d4d4; padding:8px 14px 0; }
.closing-tabs { display:flex; gap:4px; margin-top:6px; }
.closing-tab {
    flex:1; padding:12px; border:none; border-radius:10px 10px 0 0;
    background:#bbb; color:#666; font-size:22px; font-weight:700; cursor:pointer;
}
.closing-tab.active { background:#fff; color:#333; }
.closing-tab:active { opacity:.8; }
.closing-tab-body { display:none; flex:1; overflow-y:auto; }
.closing-tab-body.active { display:block; }

/* 現金照合グリッド */
.cashcheck-grid { display:flex; height:100%; }
.cashcheck-left { flex:1; padding:4px 8px; display:flex; flex-direction:column; overflow:hidden; }
.cashcheck-right { flex:0 0 320px; display:flex; flex-direction:column; padding:6px; background:#d4d4d4; }

.cash-check-prep {
    display:flex; align-items:center; gap:10px; margin-bottom:4px;
    padding:12px 14px; min-height:56px; background:#4a7c59; color:#fff; border-radius:8px; flex-shrink:0;
}
.prep-label { font-size:20px; font-weight:700; }
.prep-value { font-size:28px; font-weight:800; flex:1; text-align:right; }
.prep-edit-btn {
    padding:6px 14px; border:none; border-radius:6px;
    background:rgba(255,255,255,.25); color:#fff; font-size:16px; font-weight:700; cursor:pointer;
}
.prep-edit-btn:active { background:rgba(255,255,255,.4); }

.cashcheck-table-wrap { flex:0 1 80%; overflow:hidden; }
.cashcheck-table-wrap .cash-check-table { height:100%; }
.cash-check-table tbody { display:table-row-group; }
.cc-row { cursor:pointer; }
.cc-row.selected { background:#e8f5e9; }
.cc-row { height:calc((100% - 36px) / 9); }
.cc-row td { padding:0 14px; font-size:20px; vertical-align:middle; }
.cc-count { font-weight:700; font-size:22px; text-align:center; }
.cash-count-subtotal { font-weight:700; }

.cash-check-result {
    margin:4px 0; background:#fff; border-radius:8px; padding:8px 12px;
    box-shadow:0 1px 3px rgba(0,0,0,.08); flex-shrink:0;
}
.cash-check-row {
    display:flex; justify-content:space-between; align-items:center; padding:10px 0;
    font-size:22px; font-weight:600; border-bottom:1px solid #f0f0f0;
}
.cash-check-row:last-child { border-bottom:none; }
.cash-check-diff-row { font-size:24px; font-weight:800; padding:8px 0; }
.diff-value-wrap { text-align:right; }
.diff-amount { display:block; font-size:28px; font-weight:800; }
.diff-status { display:block; font-size:16px; font-weight:600; margin-top:2px; }
.cash-check-diff-row.over .diff-amount, .cash-check-diff-row.over .diff-status { color:#2e7d32; }
.cash-check-diff-row.short .diff-amount, .cash-check-diff-row.short .diff-status { color:#b91c1c; }
.cash-check-diff-row.match .diff-amount, .cash-check-diff-row.match .diff-status { color:#4a7c59; }

/* 照合テンキー */
.cc-selected-label {
    text-align:center; font-size:22px; font-weight:700; padding:14px 6px;
    background:#fff; border-radius:8px; margin-bottom:3px; color:#4a7c59; flex-shrink:0;
}
.cc-tenkey {
    display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(4,1fr);
    gap:3px; flex:0 1 55%; min-height:0;
}
.cc-tenkey .tk { font-size:24px; min-height:0; }
.cc-next-btn { background:linear-gradient(180deg,#6aa07a,#4a7c59,#386845) !important; color:#fff !important; font-weight:700 !important; }

.btn-sync {
    display:inline-block; padding:14px 32px; border:none; border-radius:12px; text-align:center;
    background:linear-gradient(180deg,#d04040,#b91c1c,#8b1515); color:#fff;
    font-size:18px; font-weight:700; cursor:pointer;
    box-shadow: 0 5px 0 #6a1010, 0 6px 2px rgba(0,0,0,.25), inset 0 2px 0 rgba(255,255,255,.2);
    border-top:1px solid rgba(255,255,255,.15); transition:transform .03s;
}
.btn-sync:active { transform:translateY(4px); box-shadow:0 1px 0 #6a1010; }
.btn-sync:disabled { background:#9ca3af; }
.sync-status { font-size:16px; color:#6b7280; min-height:16px; }
.sync-status.success { color:#2e7d32; font-weight:600; }
.sync-status.error { color:#b91c1c; font-weight:600; }

/* === オーバーレイ === */
.confirm-overlay {
    position:fixed; inset:0; background:rgba(46,125,50,.92);
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    z-index:1000; animation:fadeIn .2s;
}
.confirm-overlay .confirm-warning {
    font-size:32px; font-weight:800; color:#a63030;
    text-shadow: -0.8px -0.8px 0 rgba(255,255,255,.75), 0.8px -0.8px 0 rgba(255,255,255,.75), -0.8px 0.8px 0 rgba(255,255,255,.75), 0.8px 0.8px 0 rgba(255,255,255,.75), 0 -0.8px 0 rgba(255,255,255,.75), 0 0.8px 0 rgba(255,255,255,.75);
    background:rgba(255,0,0,.15); padding:12px 28px; border-radius:10px;
    margin-bottom:12px; letter-spacing:1px; border:2px solid rgba(255,50,50,.4);
    animation:blink 1s ease-in-out infinite;
}
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.5} }
.confirm-overlay .confirm-details { margin-top:10px; color:#fff; font-size:20px; min-width:280px; }
.confirm-overlay .confirm-detail-row { display:flex; justify-content:space-between; padding:3px 0; border-bottom:1px solid rgba(255,255,255,.15); }
.confirm-overlay .confirm-detail-row:first-child { justify-content:center; font-size:18px; color:rgba(255,255,255,.8); border-bottom:none; margin-bottom:2px; }
.confirm-overlay .confirm-check { font-size:72px; margin-bottom:10px; }
.confirm-overlay .confirm-text { font-size:26px; color:#fff; font-weight:700; }
.confirm-overlay .confirm-change {
    display:flex; flex-direction:column; align-items:center; color:#fff; margin-top:16px;
    background:rgba(255,255,255,.15); padding:16px 60px 20px; border-radius:16px;
}
.confirm-overlay .confirm-change-label { font-size:32px; font-weight:700; color:rgba(255,255,255,.85); }
.confirm-overlay .confirm-change-amount { font-size:72px; font-weight:800; letter-spacing:2px; }
.confirm-overlay .confirm-btn-row { display:flex; gap:16px; margin-top:32px; }
.confirm-overlay .confirm-redo {
    padding:18px 36px; border:3px solid rgba(255,200,200,.6); border-radius:14px;
    background:rgba(255,255,255,.1); color:rgba(255,200,200,.9); font-size:18px; font-weight:700; cursor:pointer;
}
.confirm-overlay .confirm-redo:active { background:rgba(255,255,255,.2); }
.confirm-overlay .confirm-dismiss {
    padding:18px 60px; border:3px solid rgba(255,255,255,.6); border-radius:14px;
    background:rgba(255,255,255,.15); color:#fff; font-size:22px; font-weight:700; cursor:pointer;
}
.confirm-overlay .confirm-dismiss:active { background:rgba(255,255,255,.3); }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
.toast {
    position:fixed; bottom:14px; left:50%; transform:translateX(-50%);
    padding:8px 18px; background:#333; color:#fff; border-radius:6px;
    font-size:13px; z-index:2000; animation:toastIn .3s,toastOut .3s 1.7s forwards;
}
@keyframes toastIn { from{opacity:0;transform:translateX(-50%) translateY(14px)} to{opacity:1;transform:translateX(-50%) translateY(0)} }
@keyframes toastOut { to{opacity:0;transform:translateX(-50%) translateY(14px)} }
.dialog-overlay { position:fixed; inset:0; background:rgba(0,0,0,.5); display:flex; align-items:center; justify-content:center; z-index:1000; }
.dialog-box { background:#fff; border-radius:12px; padding:20px; max-width:320px; width:90%; text-align:center; }
.dialog-box p { font-size:15px; margin-bottom:16px; }
.dialog-buttons { display:flex; gap:8px; }
.dialog-buttons button { flex:1; padding:10px; border:none; border-radius:8px; font-size:15px; font-weight:600; cursor:pointer; }
.dialog-cancel { background:#f3f4f6; color:#6b7280; }
.dialog-confirm { background:#b91c1c; color:#fff; }

/* =============================================
   スマホ用レイアウト (幅 600px 以下)
   ============================================= */
@media (max-width: 600px) {
    /* ヘッダー（下寄せ、ステータスバー分をtop-padding） */
    #app-header {
        height:120px; padding:env(safe-area-inset-top) 10px 8px;
        align-items:flex-end;
        gap:4px;
    }
    .header-left { gap:6px; flex:0 0 auto; }
    .header-logo { width:34px; height:34px; }
    .header-title-wrap { gap:3px; }
    #app-header h1 {
        font-size:15px; letter-spacing:.2px;
        white-space:nowrap;
    }
    .sync-indicator { font-size:9px; padding:2px 6px; border-radius:4px; box-shadow:0 1px 0 rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.3); }
    .sync-indicator:active { transform:translateY(1px); box-shadow:0 0 0 rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.3); }
    .header-center { flex:1 1 auto; display:flex; justify-content:center; }
    .header-center label { display:none; } /* 営業日ラベル非表示 */
    #date-picker { font-size:13px; padding:4px 8px; box-shadow:0 2px 0 rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.3); }
    #date-picker:active { transform:translateY(1px); box-shadow:0 0 0 rgba(0,0,0,.2); }
    .header-right { flex:0 0 auto; gap:5px; }
    .header-btn { font-size:13px; padding:7px 11px; box-shadow:0 2px 0 rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.3); }
    .header-btn:active { transform:translateY(2px); box-shadow:0 0 0 rgba(0,0,0,.2); }
    .btn-closing { box-shadow:0 2px 0 #701a14, inset 0 1px 0 rgba(255,255,255,.3) !important; }
    .btn-closing:active { transform:translateY(2px); box-shadow:0 0 0 #701a14 !important; }

    .screen { height:calc(var(--vh) - 120px); }

    /* === 1ページ目 === */
    .reg-grid {
        position:relative;
        padding-bottom:52px;
    }

    /* メイン: 縦スタック */
    .row-main { flex-direction:column; }

    /* 明細エリア: 上部(フレックスで空きスペースを吸収) */
    .cart-area {
        order:1; flex:1 1 0; min-height:0;
        padding:4px 5px;
        border-left:none; border-top:none; overflow:hidden;
    }
    .cart-title { font-size:13px; padding:3px; }
    .cart-list { flex:1; overflow-y:auto; }
    .cart-item { padding:5px 8px; font-size:12px; }
    .cart-item-cat { font-size:10px; padding:1px 4px; }
    .cart-item-amount { font-size:13px; }
    .cart-item-method { font-size:10px; }
    .cart-item-delete { width:28px; height:28px; font-size:13px; }
    .cart-footer { margin:0; }
    .cart-subtotal { display:none; }

    /* テンキーエリア: 下部、固定サイズ */
    .tenkey-area {
        order:2; flex:0 0 auto; min-height:0;
        padding:3px 5px; /* 左padding削除、全幅 */
        position:relative;
        display:flex; flex-direction:column;
    }
    /* テンキー関連要素はカテゴリ分左余白 */
    .tenkey-grid, .tenkey-bottom-row {
        margin-left:107px;
    }

    /* カテゴリ: 左サイドバー（テンキーと同じ下寄せ、safe-area対応） */
    .row-category {
        position:absolute;
        left:4px;
        bottom:56px;
        width:104px;
        /* 高さ: テンキー4行 + ギャップ + マージン + 下段60% */
        height:calc(4.6 * ((100vw - 129px) / 3) + 3 * 6px + 5px);
        display:flex; flex-direction:column;
        gap:6px; padding:0; background:transparent; z-index:10;
    }
    .cat-btn {
        flex:1 !important; min-height:0 !important;
        font-size:14px !important; line-height:1.1;
        border-radius:10px;
        box-shadow:0 3px 0 rgba(0,0,0,.15), inset 0 2px 0 rgba(255,255,255,.5);
    }
    .cat-prescription { font-size:15px !important; }
    .cat-btn:active { transform:translateY(2px); box-shadow:0 1px 0 rgba(0,0,0,.12); }
    /* 選択状態を強調 */
    .cat-btn.selected {
        outline:3px solid #4a7c59; outline-offset:-3px;
        transform:translateY(2px);
        box-shadow:0 1px 0 rgba(0,0,0,.2), inset 0 0 0 2px #fff;
    }

    /* 金額バー＋小計（テンキーの上） */
    .amount-bar {
        order:1;
        height:46px; padding:4px 12px;
        display:flex; justify-content:space-between; align-items:center;
    }
    .amount-value { font-size:28px; }
    .amount-badge { font-size:12px; padding:3px 8px; }
    .amount-sign { font-size:24px; }

    /* テンキー: iPhone電卓風の大きな丸ボタン（下寄せ） */
    .tenkey-grid {
        order:3;
        gap:6px; margin-top:0;
        grid-template-columns:repeat(3,1fr);
        grid-auto-rows:auto;
        flex:0 0 auto;
    }
    .tk {
        font-size:28px; border-radius:50%;
        aspect-ratio:1;
        box-shadow:0 4px 0 #888, 0 5px 2px rgba(0,0,0,.2), inset 0 2px 0 rgba(255,255,255,.8);
    }
    .tk:active { transform:translateY(3px); box-shadow:0 1px 0 #888; }

    .tenkey-bottom-row {
        order:2;
        height:calc(((100vw - 129px) / 3) * 0.6); /* テンキーの60% */
        gap:5px; margin-top:0; margin-bottom:5px; flex:0 0 auto;
    }
    .tk-bs, .tk-add { font-size:18px; border-radius:24px; }

    /* 会計ボタン: 画面最下部ぴったり */
    .btn-checkout {
        position:absolute;
        left:0; right:0; bottom:0;
        height:52px; margin:0; font-size:18px;
        border-radius:0;
        z-index:15;
    }

    /* === 2ページ目(1ページ目と同じ構造) === */
    .chg-layout {
        position:relative;
        flex-direction:column;
        padding-bottom:52px;
    }

    /* 支払方法ボタン: 左サイドバー(カテゴリと同じ位置) */
    .chg-top-row {
        position:absolute;
        left:4px;
        bottom:56px;
        width:104px;
        /* 高さ: テンキー4行 + 3ギャップ */
        height:calc(4 * ((100vw - 129px) / 3) + 3 * 6px);
        display:flex; flex-direction:column;
        gap:6px; padding:0; background:transparent; z-index:10;
        border:none;
    }
    .chg-top-row .pay-btn {
        flex:1 !important; min-height:0 !important;
        font-size:15px; border-radius:10px;
        padding:0;
        box-shadow:0 3px 0 rgba(0,0,0,.15), inset 0 2px 0 rgba(255,255,255,.5);
    }
    .chg-top-row .pay-btn:active {
        transform:translateY(2px);
        box-shadow:0 1px 0 rgba(0,0,0,.12);
    }
    /* 支払方法 選択状態の可視化 */
    .chg-top-row .pay-btn.active {
        outline:3px solid #4a7c59 !important;
        outline-offset:-3px;
        transform:translateY(2px);
        box-shadow:0 1px 0 rgba(0,0,0,.2), inset 0 0 0 2px #fff !important;
    }
    /* 未選択の支払方法はグレーアウト */
    .chg-top-row .pay-btn[data-method]:not(.active) {
        opacity:0.4;
        filter:grayscale(0.7);
    }

    /* メイン: 縦スタック */
    .chg-main { flex-direction:column; min-height:0; }

    /* 明細側: 上部 */
    .chg-detail-side {
        order:1;
        flex:1 1 0;
        min-height:0;
        padding:4px 5px;
        border-right:none; border-top:none;
    }
    .chg-detail-title { font-size:13px; padding:3px; }
    .chg-items-wrap {
        flex:1; padding:6px; min-height:0; max-height:none;
    }
    .change-item-row { font-size:14px; padding:5px 0; }
    .change-total-row, .change-cash-row { display:none !important; }

    /* テンキー側: 下部 */
    .chg-tenkey-side {
        order:2;
        flex:0 0 auto;
        padding:3px 5px;
        border-right:none; border-bottom:none;
        display:flex; flex-direction:column;
        gap:3px; min-height:0;
        align-items:stretch;
    }

    /* 合計バー(全幅) */
    .chg-total-bar {
        max-width:none !important; width:auto !important;
        margin:0 !important;
        height:46px; padding:4px 14px; flex-shrink:0;
    }
    .chg-total-label { font-size:17px; }
    .chg-total-value { font-size:26px; }

    /* お預かりバー(全幅) */
    .deposit-bar {
        max-width:none !important; width:auto !important;
        margin:0 !important;
        height:46px; padding:4px 14px; flex-shrink:0;
    }
    .deposit-label { font-size:17px; }
    .deposit-value { font-size:26px; }

    /* 紙幣ショートカット: 全幅(支払方法ボタン上部まで) */
    .bill-shortcuts {
        display:flex !important;
        max-width:none !important; width:auto !important;
        margin:0 0 6px 0 !important;
        height:52px;
        gap:5px; flex-shrink:0;
    }
    .bill-btn {
        flex:1; height:52px; padding:0;
        font-size:15px; font-weight:700;
        border:none; border-radius:10px;
        background:linear-gradient(180deg,#e8f5e9 0%,#c8e6c9 60%,#a5d6a7 100%);
        color:#2d5a35;
        box-shadow:0 4px 0 #4a8050, 0 5px 2px rgba(0,0,0,.2), inset 0 2px 0 rgba(255,255,255,.5);
        transition:transform .05s;
    }
    .bill-btn:active {
        transform:translateY(3px);
        box-shadow:0 1px 0 #4a8050, inset 0 2px 4px rgba(0,0,0,.08);
    }

    /* テンキー(1ページ目と同じデザイン、左に支払方法分余白) */
    .dep-tenkey {
        max-width:none !important; width:auto !important;
        margin-left:107px !important;
        gap:6px;
        grid-template-columns:repeat(3,1fr);
        grid-auto-rows:auto;
        flex:0 0 auto !important;
    }
    .dep-tenkey .tk {
        font-size:28px; border-radius:50%;
        aspect-ratio:1;
        box-shadow:0 4px 0 #888, 0 5px 2px rgba(0,0,0,.2), inset 0 2px 0 rgba(255,255,255,.8);
    }
    .dep-tenkey .tk:active {
        transform:translateY(3px);
        box-shadow:0 1px 0 #888;
    }

    /* おつり表示は非表示(お預かり-合計から推測) */
    .change-result { display:none !important; }

    /* 確定ボタン: 画面最下部 */
    .btn-confirm {
        position:absolute;
        left:0; right:0; bottom:0;
        width:100%;
        height:52px;
        min-height:0 !important;
        border-radius:0 !important;
        margin:0 !important;
        font-size:18px;
        z-index:15;
        padding:0;
    }

    /* === 履歴 === */
    .history-layout { padding:8px; }
    .history-header h2 { font-size:18px; }
    #history-date-picker { font-size:14px; padding:3px 6px; }
    .history-search input { font-size:15px; padding:8px 10px; }
    .search-clear-btn { width:40px; height:40px; font-size:16px; }
    .summary-card { padding:8px 14px; min-width:100px; }
    .summary-card-label { font-size:13px; }
    .summary-card-value { font-size:22px; }
    .history-item { min-height:48px; padding:8px 10px; gap:6px; }
    .history-time { font-size:14px; flex:0 0 46px; }
    .history-detail-tag { font-size:13px; padding:3px 6px; }
    .history-amount { font-size:16px; flex:0 0 90px; }
    .history-edit-btn { flex:0 0 50px; height:36px; font-size:13px; }

    /* === レジ締め === */
    .closing-top { padding:6px 10px 0; }
    .closing-tab { font-size:16px; padding:10px; }
    .closing-layout {
        padding:6px 8px;
        overflow-y:auto; /* スクロール可能 */
        height:100%;
    }
    .closing-header h2 { font-size:16px; }
    .closing-body {
        flex-direction:column; gap:10px;
        display:block !important; /* iPadの横並びをキャンセル */
        flex:0 0 auto !important; /* コンテンツサイズでスタック */
        min-height:0; height:auto;
    }
    .closing-section {
        display:block !important; flex:initial !important;
        margin-bottom:12px;
    }
    .closing-section h3 { font-size:16px; margin-bottom:6px; }
    .closing-table th { font-size:14px; padding:8px 10px; }

    /* カテゴリ別集計: 行をやや広く */
    .closing-section:first-child .closing-table {
        flex:initial !important; height:auto !important;
    }
    .closing-section:first-child .closing-table tr {
        height:auto !important;
    }
    .closing-section:first-child .closing-table td {
        font-size:16px; padding:5px 12px !important;
        vertical-align:middle;
    }

    /* 支払方法別集計: 行をやや狭く */
    .closing-section:last-child .closing-table td {
        font-size:14px; padding:5px 10px;
    }

    /* 総売上: 横1行、総売上が幅広 */
    .closing-total {
        margin-top:12px;
        padding:12px 16px;
        display:flex; flex-direction:row; gap:12px;
        align-items:center;
    }
    .closing-total-row {
        flex:1; padding:0 !important;
        border:none !important;
        font-size:16px;
    }
    .closing-total-row:first-child {
        flex:1.8;
        font-size:20px;
        border-right:1px solid rgba(255,255,255,.2);
        padding-right:12px !important;
        padding-bottom:0 !important;
    }

    /* 送信ボタン + ステータス (縦並び、余白確保) */
    .closing-actions {
        padding:12px 0 16px;
        display:flex;
        flex-direction:column;
        align-items:center;
        gap:10px;
    }
    .btn-sync { font-size:17px; padding:14px 28px; }
    .sync-status { font-size:13px; padding:4px 10px; margin-top:4px; line-height:1.3; }

    /* 現金照合: グリッド配置
       上: 金種テーブル(全幅)
       下: 左=準備金+結果, 右=テンキー(他ページ同サイズ) */
    .cashcheck-grid {
        display:grid !important;
        grid-template-rows:minmax(0,1fr) 72px auto;
        grid-template-columns:minmax(0,1fr) 240px;
        grid-template-areas:
            "table table"
            "prep  tenkey"
            "stats tenkey";
        height:100%;
        gap:3px;
        padding:2px 3px 10px;
        overflow:hidden;
    }
    .cashcheck-right {
        display:contents !important;
    }
    .cashcheck-left {
        grid-area:table;
        min-height:0; overflow:hidden;
        padding:0;
        display:flex; flex-direction:column;
    }
    /* 準備金: 縦2段(上=ラベル+編集, 下=金額) */
    .cash-check-prep {
        grid-area:prep; margin:0 !important;
        display:grid !important;
        grid-template-columns:1fr auto;
        grid-template-rows:auto auto;
        align-items:center;
        gap:2px 6px;
        padding:5px 10px !important;
        min-height:0 !important;
        height:100%;
        border-radius:8px;
    }
    .prep-label {
        grid-column:1; grid-row:1;
        font-size:13px !important; font-weight:700;
    }
    .prep-edit-btn {
        grid-column:2; grid-row:1;
        padding:3px 9px !important; font-size:12px !important;
    }
    .prep-value {
        grid-column:1 / span 2; grid-row:2;
        font-size:20px !important; font-weight:800;
        text-align:right;
    }
    .cash-check-result {
        grid-area:stats; margin:0 !important;
        padding:0 !important;
        background:transparent !important;
        box-shadow:none !important;
        display:flex; flex-direction:column;
        gap:3px;
        overflow:hidden;
    }
    .cash-check-result .cash-check-row {
        background:#fff;
        border-radius:8px;
        border-bottom:none !important;
        padding:6px 10px !important;
        flex:0 0 52px;
    }
    .cash-check-result .cash-check-diff-row {
        flex:0 0 72px;
        justify-content:center !important;
        padding:6px 10px !important;
    }
    /* ラベル非表示 */
    .cc-selected-label { display:none !important; }
    .cc-tenkey {
        grid-area:tenkey;
        margin:0 !important;
        width:100%;
        max-width:none !important;
        gap:5px;
        padding:0;
        grid-template-columns:repeat(3,1fr);
        grid-auto-rows:auto;
        flex:0 0 auto !important;
        height:auto !important;
        align-self:start;
    }
    /* 結果項目: ラベル上、値下 */
    .cash-check-row {
        flex-direction:column !important;
        align-items:flex-start !important;
        padding:4px 6px !important;
        border-bottom:1px solid #f0f0f0 !important;
    }
    .cash-check-row:last-child { border-bottom:none !important; }
    .cash-check-row > span:first-child {
        font-size:11px !important;
        color:#6b7280;
        margin-bottom:1px;
        line-height:1.1;
    }
    .cash-check-row > span:nth-child(2),
    .diff-value-wrap {
        font-size:18px !important;
        font-weight:800;
        line-height:1.1;
    }
    .cash-check-diff-row .diff-value-wrap {
        width:100%;
        text-align:left !important;
    }
    .cash-check-diff-row { font-size:13px !important; }
    .diff-amount { font-size:18px !important; }
    .diff-status { font-size:10px !important; }
    .cc-row td { font-size:15px; padding:5px 10px; }
    /* テンキー: 他ページと同じ丸ボタンデザイン */
    .cc-tenkey .tk {
        font-size:26px;
        border-radius:50%;
        aspect-ratio:1;
        box-shadow:0 4px 0 #888, 0 5px 2px rgba(0,0,0,.2), inset 0 2px 0 rgba(255,255,255,.8);
    }
    .cc-tenkey .tk:active {
        transform:translateY(3px);
        box-shadow:0 1px 0 #888;
    }
    .cashcheck-table-wrap {
        flex:1 !important;
        overflow-y:auto !important;
    }
    /* 金種テーブルのヘッダー固定 */
    .cashcheck-table-wrap .cash-check-table {
        border-radius:0 !important;
        overflow:visible !important;
        box-shadow:none !important;
    }
    .cashcheck-table-wrap .cash-check-table thead th {
        position:sticky !important;
        top:0; z-index:2;
        background:#f3f4f6 !important;
        box-shadow:inset 0 -1px 0 #e8e8e8;
    }

    /* 会計完了画面 */
    .confirm-overlay .confirm-warning {
        font-size:16px; padding:6px 12px;
        white-space:nowrap; letter-spacing:0;
    }
    .confirm-overlay .confirm-check { font-size:56px; }
    .confirm-overlay .confirm-text { font-size:22px; }
    .confirm-overlay .confirm-change { padding:12px 32px 16px; }
    .confirm-overlay .confirm-change-label { font-size:22px; }
    .confirm-overlay .confirm-change-amount { font-size:48px; }
    .confirm-overlay .confirm-dismiss { font-size:18px; padding:14px 36px; }
    .confirm-overlay .confirm-redo { font-size:15px; padding:14px 24px; }

    /* 小分けダイアログ */
    .kobun-box { padding:16px 20px; min-width:0; width:90%; }
    .other-section-label { font-size:18px; padding:6px 0 2px; }
    .kobun-choice { font-size:22px; padding:18px 28px; min-width:100px; }
}