#groups-dialog .delete-round-button, #groups-dialog .back-button, #groups-dialog .close-button { min-height: 44px; }
.card-finance { flex: 0 1 auto; min-width: 0; max-width: 60%; font-size: 11px; color: #965524; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-finance.paid { color: #238366; }
.finance-overview { padding: 12px 14px; margin: -8px 0 19px; border: 1px solid #def0f2; background: linear-gradient(120deg, #eff9ff, #effbf5); border-radius: 15px; border-color: #cce5e9; }
.finance-overview-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 9px; }
.finance-overview-heading h2 { display: flex; align-items: center; gap: 5px; color: #336a7e; font-size: 12px; font-weight: 650; letter-spacing: 0; }
.finance-overview-heading .icon { width: 14px; height: 14px; }
.finance-overview-status { font-size: 11px; color: #316b55; text-align: right; }
.finance-overview-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.money-label { display: block; font-size: 11px; color: var(--muted); margin-bottom: 3px; }
.overview-money { display: block; font-size: 14px; font-weight: 750; line-height: 1.4; letter-spacing: -.3px; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.finance-overview-grid.wide-values { grid-template-columns: 1fr; gap: 5px; }
.finance-overview-grid.wide-values > div { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.finance-overview-grid.wide-values .overview-money { text-align: right; white-space: nowrap; }
.money-collected { color: #176f52; }
.money-outstanding { color: #9b5721; }
.finance-content { flex: 1; overflow-y: auto; padding: 19px 20px; overscroll-behavior: contain; }
.finance-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 13px; }
.finance-heading h3 { margin: 0; font-size: 14px; }
.finance-heading-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; flex-shrink: 0; }
.finance-permissions-button { display:inline-grid;place-items:center;flex-shrink:0;width:44px;height:44px;padding:5px;border-radius:50%;background:transparent;border:0; }
.finance-question-avatar { display:grid;place-items:center;width:32px;height:32px;border-radius:50%;border:1.5px solid #77bcce;background:linear-gradient(135deg,#d9eeff,#d8f7ed);color:#157298;font-size:18px;font-weight:700;box-shadow:0 1px 4px #19779528; }
.finance-permissions-button[data-finance-grantees]:not([data-finance-grantees="0"]) { width:auto;min-width:44px;border-radius:24px; }
.finance-permission-avatars { display:flex;align-items:center;padding-right:2px; }
.finance-permission-avatars .avatar { flex-shrink:0;width:32px;height:32px;min-width:32px;min-height:32px;border:2px solid white;box-shadow:0 1px 4px #19779528;margin-left:-9px; }
.finance-permission-avatars .avatar:first-child { margin-left:0; }
.finance-permission-more { display:grid;place-items:center;width:32px;height:32px;margin-left:-9px;border:2px solid white;border-radius:50%;background:#dbf2fc;color:var(--accent);font-size:11px;font-weight:700; }
.finance-permissions-button:hover,.finance-permissions-button:focus-visible { background:#e4f6fc; }
#finance-access-dialog { position: fixed; inset: 0; margin: auto; width: 480px; max-width: calc(100vw - 32px); max-height: calc(100dvh - 32px); }
#finance-access-dialog .close-button { min-width: 44px; min-height: 44px; }
.finance-access-members { display: grid; gap: 12px; margin-bottom: 18px; }
.finance-access-member { margin: 0; min-width: 0; padding: 0 12px 12px; border: 1px solid var(--line); border-radius: 13px; background: white; }
.finance-access-member legend { max-width: 100%; padding: 5px 7px; }
.finance-access-member legend .avatar { margin-right: 8px; vertical-align: middle; }
.finance-access-member .permission-person-name { font-size: 13px; vertical-align: middle; }
.finance-access-owner { display: flex; align-items: center; gap: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 13px; background: var(--accent-soft); }
.finance-access-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: 4px; }
.finance-access-choice { position: relative; display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 7px 4px; border: 1px solid var(--line); border-radius: 9px; background: var(--soft); font-size: 12px; font-weight: 650; text-align: center; cursor: pointer; }
.finance-access-choice input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.finance-access-choice:has(input:checked) { background: #dbf2fc; color: var(--accent); border-color: #69c2e2; box-shadow: inset 0 0 0 1px #69c2e2; }
.finance-access-choice:has(input:focus-visible) { outline: 3px solid #1489c8; outline-offset: 2px; }
.finance-access-actions { display: grid; grid-template-columns: auto 1fr; gap: 10px; }
.finance-access-actions .back-button { min-height: 44px; padding: 8px 14px; justify-content: center; }
@media (max-width: 420px) { .finance-heading { flex-wrap: wrap; } .finance-heading-actions { margin-left: auto; } }
@media (forced-colors: active) { .finance-access-choice:has(input:checked) { border: 3px solid Highlight; } }
.finance-status { color: var(--muted); background: #eaf2f6; padding: 4px 8px; border-radius: 8px; font-size: 11px; font-weight: 650; }
.finance-status.complete { color: #238366; background: #e4f7ec; }
.finance-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0 0 17px; }
.finance-metrics.wide-values { grid-template-columns: 1fr; }
.finance-metric { padding: 13px; border-radius: 13px; background: white; border: 1px solid #e4eef3; min-width: 0; }
.finance-metric.total { grid-column: 1 / -1; background: linear-gradient(120deg, #eaf6ff, #e8f9f2); border-color: #d8eef0; }
.finance-metric dt { font-size: 12px; color: var(--muted); margin-bottom: 5px; }
.finance-metric dd { margin: 0; font-size: 17px; line-height: 1.4; font-weight: 750; letter-spacing: -.4px; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.finance-metric.total dd { font-size: 23px; }
.finance-form { margin-top: 20px; }
.finance-form h4 { font-size: 13px; margin: 0 0 12px; }
.finance-input-note { font-size: 12px; color: var(--muted); margin: -5px 0 14px; overflow-wrap: anywhere; }
.finance-input-note.invalid { color: #ad4c37; }
.finance-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.finance-footnote { font-size: 11px; color: var(--muted); margin-top: 15px; }
.collection-rounds { margin-top: 21px; }
.rounds-heading { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 10px; }
.rounds-heading h4 { font-size: 14px; margin: 0; }
.round-add-button, .round-action { min-height: 36px; padding: 7px 10px; font-size: 12px; font-weight: 650; color: var(--accent); background: #e8f5fc; border-radius: 9px; border: 1px solid var(--accent-border); }
.round-list { display: grid; gap: 10px; }
.round-card { border: 1px solid #e0edf2; border-radius: 14px; padding: 12px; background: white; }
.round-card.complete { border-color: #cfeade; background: #f2fbf7; }
.round-top { display: flex; gap: 8px; align-items: center; justify-content: space-between; }
.round-title { font-size: 13px; font-weight: 700; margin: 0; min-width: 0; overflow-wrap: anywhere; }
.round-meta { color: var(--muted); font-size: 11px; margin: 4px 0 10px; }
.round-meta.overdue { color: #bd6136; }
.round-created-at { color:var(--muted);font-size:12px;margin:-8px 0 15px; }
.round-money { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.round-money strong { display: block; font-size: 11px; letter-spacing: -.2px; overflow-wrap: anywhere; }
.round-money.wide-values { grid-template-columns: 1fr; gap: 4px; }
.round-money.wide-values > div { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.round-actions { display: flex; gap: 7px; justify-content: flex-end; margin-top: 10px; }
.round-footer { display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px; }
.round-footer:empty { display:none; }
.round-footer .round-actions { margin:0 0 0 auto; }
.round-image-stack { display:flex;align-items:center;min-height:44px;padding:4px;background:transparent;border:0;border-radius:9px; }
.round-image-stack img,.round-image-stack span { width:32px;height:32px;border-radius:8px;border:2px solid white;object-fit:cover;margin-left:-9px;box-shadow:0 1px 4px #19779528; }
.round-image-stack img:first-child { margin-left:0; }
.round-image-stack span { display:grid;place-items:center;background:#dbf2fc;color:var(--accent);font-size:11px;font-weight:700; }
.round-image-stack:hover,.round-image-stack:focus-visible { background:#e4f6fc; }
.round-images-heading { display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px; }
.round-images-heading .field-label { margin:0; }
#round-images-count { color:var(--muted);font-size:11px;margin-left:5px; }
.round-add-image { display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid var(--accent-border);border-radius:11px;background:#e8f5fc;color:var(--accent); }
.round-add-image:hover,.round-add-image:focus-visible { background:#d9f1fc; }
.round-images-preview { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:12px; }
.round-images-preview:empty { display:none; }
.round-images-preview figure { position:relative;min-width:0;margin:0;padding:5px;border:1px solid var(--line);border-radius:10px;background:white; }
.round-images-preview img { display:block;width:100%;aspect-ratio:1.35;object-fit:cover;border-radius:6px; }
.round-images-preview figcaption { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;color:var(--muted);padding-top:4px; }
.round-images-preview button { position:absolute;right:0;top:0;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:white;border:1px solid #b5dce9;color:var(--accent);box-shadow:0 1px 5px #183b4e30;font-size:18px; }
#round-gallery-dialog { position:fixed;inset:0;margin:auto;width:620px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 40px);padding:18px;border:1px solid var(--line);border-radius:20px;background:var(--soft); }
.round-gallery-heading { display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px; }
.round-gallery-heading h3 { margin:0;font-size:16px;overflow-wrap:anywhere; }
.round-gallery-grid { display:grid;grid-template-columns:repeat(var(--round-photo-columns),minmax(0,1fr));gap:10px; }
.round-gallery-grid figure { margin:0;min-width:0; }
.round-gallery-grid button { display:block;width:100%;padding:0;border:1px solid var(--line);border-radius:12px;background:white;overflow:hidden; }
.round-gallery-grid img { display:block;width:100%;aspect-ratio:1;object-fit:cover; }
.round-gallery-grid figcaption { font-size:10px;color:var(--muted);margin-top:5px; }
.round-photo-view { display:grid;gap:8px;text-align:center; }
.round-photo-view img { display:block;max-width:100%;max-height:calc(100dvh - 260px);margin:auto;border-radius:12px;object-fit:contain; }
.round-photo-view strong { font-size:13px;overflow-wrap:anywhere; }
.round-photo-view time { color:var(--muted);font-size:12px; }
.round-gallery-controls { display:flex;gap:8px;justify-content:center;margin-top:14px; }
.round-gallery-controls button { min-width:44px;min-height:44px;padding:8px 12px;border:1px solid var(--accent-border);border-radius:10px;background:#e8f5fc;color:var(--accent); }
.round-action.paid { background: #e3f5eb; color: #176f52; border-color: #b8dfcc; }
.round-empty { padding: 13px; border: 1px dashed #d3e6ed; border-radius: 12px; color: #658390; font-size: 12px; line-height: 1.6; }
.rounds-note { color: var(--muted); font-size: 12px; line-height: 1.6; margin: 9px 0 0; }
.delete-round-button { min-height: 40px; width: 100%; margin-top: 12px; font-size: 12px; color: #98412e; background: #fff0ea; border-radius: 10px; border: 1px solid #edcfc2; }
.delete-round-confirm { padding: 12px; border: 1px solid #efd2c7; background: #fff7f3; border-radius: 12px; margin-top: 12px; }
.delete-round-confirm p { font-size: 12px; color: #9c604e; margin: 0; }

@media (max-width: 360px) {
  .overview-money { font-size: 12px; }
  .finance-overview { padding-left: 11px; padding-right: 11px; border-color: #cce5e9; }
  .finance-content { padding-left: 16px; padding-right: 16px; }
  .finance-metric dd { font-size: 16px; }
}