:root {
  color-scheme: light;
  --gold: #ad8a36;
  --gold-dark: #7f6427;
  --gold-soft: #e9ddba;
  --cream: #fbf7eb;
  --ink: #24211b;
  --muted: #6f6758;
  --line: #d8c78f;
  --danger: #a23832;
  --white: #fffefb;
  --shadow: 0 15px 45px rgba(68, 53, 19, .12);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  color: var(--ink);
  background-color: var(--cream);
  background-image: url("./assets/screen.png");
  background-repeat: repeat-y;
  background-position: center top;
  background-size: min(760px, 160vw) auto;
  min-height: 100vh;
}
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.app-shell { width: min(100%, 560px); min-height: 100vh; margin: 0 auto; padding: 0 14px 56px; }
.topbar { height: 84px; display: grid; grid-template-columns: 48px 1fr 48px; align-items: center; gap: 8px; }
.brand { text-align: center; display: flex; flex-direction: column; align-items: center; line-height: 1; }
.brand-mark { font-family: Georgia, serif; font-weight: 800; letter-spacing: .08em; color: var(--gold-dark); font-size: 1.3rem; }
.screen-title { margin-top: 7px; font-size: .73rem; letter-spacing: .16em; font-weight: 800; color: var(--muted); }
.icon-button { width: 44px; height: 44px; border: 0; background: transparent; color: var(--gold-dark); font-size: 2rem; border-radius: 50%; }
.icon-button:hover, .icon-button:focus-visible { background: rgba(173,138,54,.12); }
.avatar { width: 38px; height: 38px; border: 1px solid var(--gold); border-radius: 50%; display: grid; place-items: center; background: white; color: var(--gold-dark); font-weight: 800; justify-self: end; }
.event-strip { background: rgba(255,254,251,.92); border: 1px solid var(--line); border-radius: 18px; padding: 15px 16px; display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 12px; box-shadow: 0 8px 24px rgba(68,53,19,.06); }
.event-strip strong, .event-strip small { display: block; }
.event-strip strong { margin-top: 4px; }
.event-strip small { color: var(--muted); margin-top: 3px; }
.event-strip.compact { padding-block: 12px; }
.eyebrow, legend { color: var(--gold-dark); font-size: .75rem; font-weight: 800; letter-spacing: .12em; }
.status-pill, .save-status { border-radius: 99px; padding: 7px 10px; background: #f2ead1; color: var(--gold-dark); font-size: .72rem; font-weight: 800; letter-spacing: .08em; }
.form-card, .review-card { border: 1px solid var(--line); background: rgba(255,254,251,.97); border-radius: 28px; padding: 20px 18px 24px; box-shadow: var(--shadow); }
fieldset { border: 0; margin: 0; padding: 0 0 22px; }
fieldset + fieldset { border-top: 1px solid #eee5cf; padding-top: 22px; }
legend { padding: 0 0 13px; }
label, .choice-field { display: block; font-size: .88rem; font-weight: 700; color: #514a3e; margin-bottom: 15px; }
.optional, .required { float: right; font-size: .72rem; font-weight: 600; color: var(--muted); }
.required { color: var(--gold-dark); }
input, select, textarea { display: block; width: 100%; min-height: 48px; margin-top: 7px; padding: 11px 12px; border-radius: 12px; border: 1px solid #cfc3a3; background: white; color: var(--ink); outline: none; }
textarea { resize: vertical; line-height: 1.45; }
input:focus, select:focus, textarea:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(173,138,54,.15); }
.field-grid { display: grid; gap: 12px; }
.field-grid.two { grid-template-columns: 1fr 1fr; }
.money-input { position: relative; display: block; }
.money-input > span { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--gold-dark); font-weight: 800; z-index: 1; }
.money-input input { padding-left: 29px; }
.row-heading { display: flex; align-items: center; justify-content: space-between; min-height: 44px; font-size: .88rem; font-weight: 700; }
.text-button { border: 0; background: transparent; color: var(--gold-dark); font-weight: 800; padding: 9px 4px; }
.gift-row { border: 1px solid #e6dbc0; border-radius: 15px; padding: 11px; margin: 6px 0 12px; background: #fff; }
.gift-fields { display: grid; grid-template-columns: minmax(0, 1fr) 74px 92px 38px; gap: 7px; align-items: end; }
.gift-row label { margin: 0; font-size: .72rem; }
.gift-row input { min-height: 44px; margin-top: 4px; padding: 8px 9px; }
.remove-gift { width: 38px; height: 44px; border-radius: 10px; border: 1px solid #dbc9a0; background: white; color: var(--danger); font-weight: 900; }
.gift-photo { display: grid; grid-template-columns: 54px minmax(0,1fr); gap: 10px; align-items: center; margin-top: 11px; padding-top: 10px; border-top: 1px solid #eee5cf; }
.photo-placeholder, .review-photo-empty { width: 54px; height: 54px; display: grid; place-items: center; border: 1px dashed #c6b47f; border-radius: 10px; color: var(--gold); background: #fdf9ed; font-size: 1.25rem; }
.gift-photo img { width: 64px; height: 64px; object-fit: cover; border-radius: 10px; border: 1px solid #dbcda7; }
.gift-photo.has-photo { grid-template-columns: 64px minmax(0,1fr); }
.photo-details strong, .photo-details span { display: block; }
.photo-details strong { font-size: .82rem; color: #504735; }
.photo-details span { font-size: .72rem; color: var(--muted); margin-top: 3px; }
.optional-inline { display: inline; color: var(--muted); font-weight: 600; margin-left: 5px; }
.photo-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 8px; }
.photo-button { position: relative; overflow: hidden; display: inline-grid; place-items: center; min-height: 38px; padding: 6px 11px; border-radius: 99px; background: var(--gold-dark); color: white; font-size: .75rem !important; font-weight: 800; cursor: pointer; }
.photo-button.secondary { background: white; color: var(--gold-dark); border: 1px solid var(--gold); }
.photo-button input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.photo-details .text-button { padding: 5px 0 0; font-size: .74rem; }
.text-button.danger { color: var(--danger); }
.photo-error { grid-column: 1 / -1; color: var(--danger); font-size: .75rem; }
.reciprocation-box { background: #fcf8ec; border: 1px solid var(--gold-soft); border-radius: 17px; padding: 15px; margin-bottom: 22px; }
.reciprocation-box + fieldset { border-top: 0; }
.reciprocation-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.reciprocation-head legend { padding: 0; }
.reciprocation-head p { font-size: .8rem; line-height: 1.4; color: var(--muted); margin: 5px 0 0; }
.outline-button { border: 1px solid var(--gold); color: var(--gold-dark); background: white; border-radius: 99px; min-height: 42px; padding: 8px 14px; font-weight: 800; white-space: nowrap; }
#returnFields { border-top: 1px solid #eadfbe; margin-top: 14px; padding-top: 14px; }
.segmented { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
.segmented label { margin: 0; }
.segmented input { position: absolute; opacity: 0; pointer-events: none; }
.segmented span { min-height: 46px; display: grid; place-items: center; border: 1px solid #cfc3a3; border-radius: 12px; background: white; }
.segmented input:checked + span { color: #fff; background: var(--gold-dark); border-color: var(--gold-dark); }
.segmented input:focus-visible + span { outline: 3px solid rgba(173,138,54,.25); }
.field-error { display: block; min-height: 1em; color: var(--danger); font-size: .78rem; margin-top: 5px; }
.field-help { display: block; color: var(--muted); font-size: .76rem; font-weight: 500; line-height: 1.4; margin-top: 7px; }
.more-options { border: 1px solid #e2d6b8; border-radius: 14px; background: #fdfaf1; overflow: hidden; }
.more-options summary { min-height: 48px; display: flex; align-items: center; justify-content: space-between; padding: 10px 13px; color: var(--gold-dark); font-size: .86rem; font-weight: 800; cursor: pointer; list-style: none; }
.more-options summary::-webkit-details-marker { display: none; }
.more-options summary::after { content: "+"; font-size: 1.25rem; font-weight: 500; }
.more-options[open] summary::after { content: "−"; }
.more-options-body { padding: 14px 13px 1px; border-top: 1px solid #eadfbe; background: white; }
.primary-button { width: 100%; min-height: 54px; border: 0; border-radius: 999px; color: white; background: var(--gold-dark); font-weight: 900; letter-spacing: .09em; box-shadow: 0 8px 20px rgba(92,69,21,.2); }
.primary-button:hover, .primary-button:focus-visible { background: #69511e; }
.outline-wide-button { width: 100%; min-height: 50px; margin-top: 10px; border: 1px solid var(--gold); border-radius: 999px; background: white; color: var(--gold-dark); font-weight: 850; letter-spacing: .06em; }
.outline-wide-button:hover, .outline-wide-button:focus-visible { background: #fbf5e4; }
.review-person { padding: 2px 2px 16px; }
.review-person h1 { margin: 6px 0 4px; font-family: Georgia, serif; font-size: 1.8rem; }
.review-person p { margin: 0; color: var(--muted); }
.review-instruction { margin: -5px 0 15px; padding: 11px 12px; border-left: 3px solid var(--gold); background: #fbf6e8; color: #625941; font-size: .82rem; line-height: 1.45; }
.edit-button { min-width: 66px; }
.cash-summary { display: grid; grid-template-columns: repeat(3,1fr); border: 1px solid var(--gold-soft); border-radius: 16px; overflow: hidden; margin-bottom: 18px; }
.cash-summary div { padding: 13px 8px; text-align: center; background: #fcfaf3; }
.cash-summary div + div { border-left: 1px solid var(--gold-soft); }
.cash-summary span, .cash-summary strong { display: block; }
.cash-summary span { font-size: .68rem; color: var(--muted); margin-bottom: 5px; line-height: 1.25; }
.cash-summary strong { font-size: 1rem; }
.cash-summary .balance { background: #f0e5c5; }
.review-section { border-top: 1px solid #eee5cf; padding: 16px 2px; }
.review-section-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 9px; }
.review-section-title h2 { margin: 0; font-size: .75rem; color: var(--gold-dark); letter-spacing: .1em; }
.review-section-title > span { color: var(--muted); font-size: .74rem; font-weight: 700; }
.review-section p { margin: 4px 0; color: #4f493e; line-height: 1.45; }
.review-section ul { margin: 7px 0 0; padding-left: 20px; }
.review-section li { margin: 5px 0; }
.review-gifts { display: grid; gap: 10px; }
.review-gift { display: grid; grid-template-columns: 58px 1fr; gap: 11px; align-items: center; padding: 9px; border: 1px solid #e9dfc7; border-radius: 13px; background: #fff; }
.review-photo-button { position: relative; width: 58px; height: 58px; padding: 0; border: 0; border-radius: 9px; overflow: hidden; background: #f6efd9; }
.review-photo-button img { width: 58px; height: 58px; object-fit: cover; }
.review-photo-button > span { position: absolute; inset: auto 0 0; padding: 3px; background: rgba(30,25,14,.72); color: white; font-size: .62rem; }
.review-gift strong, .review-gift span, .review-gift small { display: block; }
.review-gift span { color: var(--muted); margin-top: 3px; }
.review-gift small { color: var(--gold-dark); margin-top: 4px; font-weight: 700; }
.review-gift small.muted { color: var(--muted); font-weight: 500; }
.review-details { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; }
.review-details > div { padding: 10px; border-radius: 10px; background: #faf7ef; }
.review-details > div.wide { grid-column: 1 / -1; }
.review-details dt { color: var(--muted); font-size: .7rem; }
.review-details dd { margin: 4px 0 0; color: var(--ink); font-size: .84rem; font-weight: 750; }
.review-details dd.important { color: var(--gold-dark); }
.review-warning.error { color: var(--danger); background: #fbe9e7; }
.review-warning strong, .review-warning span { display: block; }
.review-warning span { margin-top: 3px; }
.photo-dialog { width: min(92vw, 520px); border: 0; border-radius: 20px; padding: 12px; background: #fffefb; box-shadow: 0 25px 80px rgba(0,0,0,.35); }
.photo-dialog::backdrop { background: rgba(26,22,14,.72); }
.photo-dialog img { display: block; width: 100%; max-height: 70vh; object-fit: contain; border-radius: 13px; background: #f2eddf; }
.photo-dialog p { margin: 10px 44px 3px 6px; font-weight: 800; color: var(--ink); }
.dialog-close { position: absolute; top: 17px; right: 17px; width: 38px; height: 38px; border: 0; border-radius: 50%; background: rgba(31,26,16,.82); color: white; font-size: 1.5rem; line-height: 1; }
.review-warning { background: #f8f1dc; border-radius: 12px; color: #645327; padding: 12px; font-size: .82rem; line-height: 1.4; margin: 2px 0 16px; }
.success-view { text-align: center; padding: 38px 10px; }
.success-mark { width: 74px; height: 74px; margin: 0 auto 18px; display: grid; place-items: center; border-radius: 50%; background: var(--gold-dark); color: white; font-size: 2rem; }
.success-view h1 { font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; font-size: 2rem; font-weight: 600; margin: 0 0 8px; }
.success-view > p { color: var(--muted); margin: 0 auto 15px; }
.success-view .primary-button { margin-top: 28px; border-radius: 14px; font-weight: 600; box-shadow: none; }
.success-view .outline-wide-button { border-radius: 12px; font-weight: 600; }
.success-summary-heading { margin: 20px 0 7px; text-align: left; color: var(--gold-dark); font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; font-size: .72rem; font-weight: 600; letter-spacing: .12em; }
.success-summary-heading + .recent-card { margin-top: 0; }
.recent-card { margin-top: 18px; padding: 16px; text-align: left; background: rgba(255,254,251,.9); border: 1px solid var(--line); border-radius: 16px; }
.recent-card span, .recent-card strong { display: block; }
.recent-card span { color: var(--muted); font-size: .78rem; }
.recent-card strong { margin: 4px 0; }
.detail-card, .history-card { border: 1px solid var(--line); background: rgba(255,254,251,.97); border-radius: 25px; padding: 18px; box-shadow: var(--shadow); }
.history-card { margin-top: 13px; box-shadow: 0 8px 25px rgba(68,53,19,.08); }
.detail-status-row, .history-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.recorded-time, .history-heading small { color: var(--muted); font-size: .72rem; }
.detail-person { padding: 20px 2px 15px; }
.detail-person h1 { margin: 6px 0 4px; font-family: Georgia, serif; font-size: 1.8rem; }
.detail-person p { margin: 0; color: var(--muted); }
.detail-section { border-top: 1px solid #eee5cf; padding: 16px 2px; }
.detail-section p { margin: 6px 0 0; color: #4f493e; line-height: 1.5; }
.detail-card .primary-button { margin-top: 8px; }
.detail-action-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.detail-action-grid .outline-wide-button { margin-top: 0; }
.role-pill { border-radius: 99px; padding: 7px 10px; background: #efe4c2; color: var(--gold-dark); font-size: .68rem; font-weight: 900; letter-spacing: .08em; }
.form-guidance { margin: -2px 0 16px; padding: 11px 12px; border-left: 3px solid var(--gold); background: #fbf6e8; color: #625941; font-size: .82rem; line-height: 1.45; }
.reason-box { margin-top: 2px; padding: 18px 14px 3px; border: 1px solid #d7c083; border-radius: 15px; background: #fdf9ed; }
.reason-box + .primary-button { margin-top: 18px; }
.correction-comparison { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 4px 0 18px; }
.correction-comparison > div { min-width: 0; padding: 13px; border: 1px solid #e5d9b9; border-radius: 14px; background: #faf7ef; }
.correction-comparison > div:last-child { border-color: var(--gold); background: #f6edcf; }
.correction-comparison strong, .correction-comparison p { display: block; overflow-wrap: anywhere; }
.correction-comparison strong { margin-top: 7px; }
.correction-comparison p { margin: 5px 0 0; color: var(--muted); font-size: .76rem; line-height: 1.4; }
.correction-reason { margin: 3px 0 16px; padding: 13px; border: 1px solid var(--gold-soft); border-radius: 13px; background: #fcf8ec; }
.correction-reason p { margin: 7px 0 0; color: #4f493e; line-height: 1.45; }
.added-notes { display: grid; gap: 9px; }
.added-notes > div { padding: 11px 12px; border-left: 3px solid var(--gold); border-radius: 0 10px 10px 0; background: #faf7ef; }
.added-notes p { margin: 0; }
.added-notes small { display: block; margin-top: 6px; color: var(--muted); font-size: .7rem; }
.timeline { margin-top: 15px; }
.timeline-item { position: relative; display: grid; grid-template-columns: 18px 1fr; gap: 9px; padding-bottom: 19px; }
.timeline-item:not(:last-child)::before { content: ""; position: absolute; left: 6px; top: 13px; bottom: 0; width: 1px; background: #d7c78f; }
.timeline-dot { width: 13px; height: 13px; margin-top: 3px; border: 3px solid #f3e8c7; border-radius: 50%; background: var(--gold-dark); z-index: 1; }
.timeline-item strong, .timeline-item span, .timeline-item small { display: block; }
.timeline-item strong { font-size: .86rem; }
.timeline-item div > span { color: #4f493e; margin-top: 4px; font-size: .8rem; line-height: 1.4; }
.timeline-item small { color: var(--muted); margin-top: 5px; font-size: .68rem; line-height: 1.35; }
.linked-strip { border-left: 4px solid var(--gold); }
.value-error { margin: 7px 0 0; }
.return-calculation { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: stretch; gap: 6px; margin: 15px 0 18px; }
.return-calculation > div { min-width: 0; display: grid; align-content: center; min-height: 82px; padding: 10px 6px; border: 1px solid var(--gold-soft); border-radius: 13px; background: #fcfaf3; text-align: center; }
.return-calculation > div.new-balance { background: #f0e5c5; }
.return-calculation div span, .return-calculation div strong { display: block; }
.return-calculation div span { color: var(--muted); font-size: .66rem; line-height: 1.25; }
.return-calculation div strong { margin-top: 7px; font-size: .9rem; }
.calculation-sign { align-self: center; color: var(--gold-dark); font-weight: 900; }
[hidden] { display: none !important; }
@media print { body { background: white !important; } }
.records-nav { display: grid; grid-template-columns: repeat(auto-fit, minmax(112px, 1fr)); gap: 3px; padding: 3px; margin-bottom: 14px; border: 1px solid #cdb978; border-radius: 18px; background: rgba(255,254,251,.82); }
.records-nav button { min-height: 40px; padding: 7px 8px; border: 0; border-radius: 14px; background: transparent; color: var(--gold-dark); font-size: .72rem; font-weight: 600; letter-spacing: .01em; }
.records-nav button[aria-current] { color: white; background: #81682e; }
.saved-panel { padding: 18px; border: 1px solid var(--line); border-radius: 24px; background: var(--white); }
.event-home-card, .event-details-card { border: 1px solid var(--line); background: rgba(255,254,251,.97); border-radius: 25px; padding: 18px; box-shadow: var(--shadow); }
.event-home-card { text-align: center; }
.event-home-photo { width: 86px; height: 86px; margin: 0 auto 16px; display:grid; place-items:center; overflow:hidden; border-radius: 22px; background: #f0e5c5; color: var(--gold-dark); font: 800 1.2rem Georgia, serif; border: 1px solid var(--gold-soft); background-size: cover; background-position: center; }
.event-home-card h1 { margin: 7px 0; font: 1.9rem Georgia, serif; }
.event-home-card p { margin: 4px 0; color: var(--muted); }
.event-description { line-height: 1.5; }
.event-home-actions { margin-top: 18px; }
.event-details-card { margin-top: 13px; }
.event-details { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; }
.event-details > div { padding: 10px; background: #faf7ef; border-radius: 10px; }
.event-details .wide { grid-column: 1 / -1; }
.event-details dt { color: var(--muted); font-size: .7rem; }
.event-details dd { margin: 4px 0 0; font-weight: 750; }
.event-screen-heading { margin: 7px 0 15px; font: 1.7rem Georgia, serif; }
.team-list { display: grid; gap: 9px; margin: 16px 0; }
.team-member { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; align-items:center; gap: 10px; padding: 11px; border: 1px solid var(--gold-soft); border-radius: 13px; background: #fff; }
.team-member strong, .team-member small { display:block; }
.team-member small { margin-top: 3px; color: var(--muted); font-size: .76rem; }
.team-initial { width: 42px; height:42px; display:grid; place-items:center; border-radius:50%; background:#f0e5c5; color:var(--gold-dark); font-weight:800; }
.team-add-form { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.share-option { margin-top: 16px; padding: 15px; border: 1px solid var(--gold-soft); border-radius: 15px; background:#fcfaf3; }
.share-option h2 { margin: 0; color: var(--gold-dark); font-size: .9rem; letter-spacing:.06em; }
.share-option p { color: var(--muted); line-height:1.45; font-size:.85rem; }
.saved-panel label { font-size: 1rem; }
.saved-count { color: var(--muted); font-size: .875rem; }
.saved-records { display: grid; gap: 10px; }
.saved-record { display: grid; grid-template-columns: 46px minmax(0, 1fr) 12px; gap: 12px; align-items: center; text-align: left; padding: 14px 10px; border: 1px solid var(--gold-soft); border-radius: 15px; color: var(--ink); background: #fff; }
.saved-record:hover, .saved-record:focus-visible { background: #fcf8ec; outline: 2px solid var(--gold); outline-offset: 2px; }
.saved-thumbnail, .saved-initial { width: 46px; height: 54px; border-radius: 10px; object-fit: cover; }
.saved-initial { display: grid; place-items: center; color: var(--gold-dark); background: #f2ead1; font: bold 1.5rem Georgia, serif; }
.saved-record-content { display: grid; gap: 5px; overflow-wrap: anywhere; }
.saved-record-content strong { font-size: 1rem; }
.saved-record-content > span { font-size: .875rem; }
.saved-record-content small { color: var(--muted); font-size: .75rem; line-height: 1.5; }
.saved-empty { padding: 24px 10px; text-align: center; }
.saved-empty p { color: var(--muted); line-height: 1.5; }
.backup-panel { margin-top: 24px; border-top: 1px solid var(--line); padding-top: 16px; }
.backup-panel summary { min-height: 44px; cursor: pointer; color: var(--gold-dark); font-weight: 800; }
.backup-panel p, #restorePreview { font-size: .875rem; line-height: 1.5; overflow-wrap: anywhere; }
.backup-file { margin-top: 22px; }
.backup-file input { font-size: .875rem; }
#restorePreview { padding: 14px; margin: 15px 0; border: 1px solid var(--line); border-radius: 12px; background: #faf6e9; }
#backupStatus { color: var(--gold-dark); }

@media (max-width: 430px) {
  .app-shell { padding-inline: 10px; }
  .form-card, .review-card { padding-inline: 14px; border-radius: 23px; }
  .field-grid.two { grid-template-columns: 1fr; gap: 0; }
  .gift-fields { grid-template-columns: minmax(0,1fr) 64px 82px 38px; gap: 5px; }
  .gift-row input { font-size: .86rem; }
  .cash-summary strong { font-size: .88rem; }
  .detail-card, .history-card { padding-inline: 14px; border-radius: 22px; }
  .return-calculation { gap: 4px; }
  .return-calculation > div { padding-inline: 3px; }
  .return-calculation div strong { font-size: .78rem; }
  .detail-action-grid, .correction-comparison { grid-template-columns: 1fr; }
}

@media (min-width: 800px) {
  body { padding: 34px 0; }
  .app-shell { min-height: calc(100vh - 68px); border: 1px solid rgba(173,138,54,.22); border-radius: 34px; background: rgba(251,247,235,.55); }
}

/* Event Home: restrained, mobile-first SI’I presentation. */
body:has(#eventView:not([hidden])) .app-shell { padding-bottom: 40px; }
body:has(#eventView:not([hidden])) .topbar { height: 64px; grid-template-columns: 40px 1fr 40px; }
body:has(#eventView:not([hidden])) .brand-mark { font-size: 1.08rem; letter-spacing: .12em; }
body:has(#eventView:not([hidden])) .screen-title { margin-top: 4px; font-size: .61rem; letter-spacing: .18em; }
body:has(#eventView:not([hidden])) .icon-button { width: 36px; height: 36px; font-size: 1.55rem; }
body:has(#eventView:not([hidden])) .avatar { width: 32px; height: 32px; font-size: .72rem; border-color: #c9b678; }
body:has(#eventView:not([hidden])) {
  font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-weight: 400;
}
body:has(#eventView:not([hidden])) .brand-mark,
body:has(#eventView:not([hidden])) .screen-title { font-family: inherit; font-weight: 600; }
body:has(#eventView:not([hidden])) .records-nav {
  grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
  gap: 3px;
  padding: 3px;
  margin-bottom: 14px;
  border-color: #cdb978;
  border-radius: 18px;
  background: rgba(255,254,251,.82);
}
body:has(#eventView:not([hidden])) .records-nav button {
  min-height: 40px;
  padding: 7px 8px;
  border-radius: 14px;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .01em;
}
body:has(#eventView:not([hidden])) .records-nav button[aria-current] { background: #81682e; }
#eventView { display: grid; gap: 12px; }
#eventView[hidden] { display: none; }
#eventView button { font-weight: 600; }
#eventView .event-home-card,
#eventView .event-details-card {
  box-shadow: none;
  border-color: #d7c483;
  border-radius: 20px;
  background: rgba(255,254,251,.94);
}
#eventView .event-home-card {
  position: relative;
  overflow: hidden;
  padding: 18px 18px 20px;
  text-align: left;
}
#eventView .event-home-card::after {
  content: "";
  position: absolute;
  inset: auto -44px -48px auto;
  width: 148px;
  height: 148px;
  border: 1px solid rgba(173,138,54,.16);
  border-radius: 50%;
  box-shadow: 0 0 0 16px rgba(173,138,54,.035), 0 0 0 32px rgba(173,138,54,.025);
  pointer-events: none;
}
#eventView .event-home-motif { display: flex; align-items: center; gap: 5px; width: 94%; margin: 0 auto 13px; }
#eventView .event-home-motif::after { content: ""; flex: 1; height: 1px; margin-left: 5px; background: #d5c48d; opacity: .85; }
#eventView .event-home-motif span { display: block; flex: 0 0 auto; width: 8px; height: 8px; border: 1px solid #ad8a36; transform: rotate(45deg); background: #fffdf7; }
#eventView .event-home-motif span:nth-child(2) { background: #d9c487; }
#eventView .event-home-identity { position: relative; z-index: 1; display: block; }
#eventView .event-home-copy { width: 94%; min-width: 0; margin: 0 auto; }
#eventView .event-home-photo {
  position: relative;
  width: 94%;
  height: auto;
  aspect-ratio: 16 / 9;
  margin: 0 auto 18px;
  overflow: hidden;
  border-radius: 19px;
  background-color: #f7f0dd;
  background-image: url("./assets/woven-cream-texture.png");
  background-repeat: repeat;
  background-position: center;
  background-size: 520px auto;
  font-size: 1.2rem;
  font-family: inherit;
  font-weight: 600;
}
#eventView .event-home-photo img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: 50% 40%; will-change: transform; }
#eventView .event-home-photo span { display: grid; width: 100%; height: 100%; place-items: center; }
#eventView .event-home-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 10px; }
#eventView .event-home-heading .eyebrow { font-size: .64rem; font-weight: 600; letter-spacing: .16em; }
#eventView .event-finalised-badge { padding: 5px 8px; border: 1px solid #b79b54; border-radius: 999px; color: #765b22; background: #f7efda; font-size: .62rem; font-weight: 600; letter-spacing: .1em; }
#eventView .event-home-card h1 { position: relative; z-index: 1; margin: 8px 0 13px; max-width: 100%; color: #29251d; font-family: inherit; font-size: clamp(1.95rem, 8vw, 2.5rem); font-weight: 600; line-height: 1.05; letter-spacing: -.025em; overflow-wrap: anywhere; }
#eventView .event-home-card > p { position: relative; z-index: 1; margin: 0; color: #6b6253; font-size: .88rem; line-height: 1.5; }
#eventView .event-home-date { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 10px; align-items: center; margin: 0 0 11px; color: #5d5445; }
#eventView .event-home-date[hidden] { display: none; }
#eventView .event-home-day { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 11px; background: #ad8a36; color: #fffefb; font: 600 1.35rem Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; }
#eventView .event-home-date-text { font-size: .78rem; font-weight: 500; line-height: 1.35; }
#eventView #eventHomeMeta { display: flex; flex-wrap: wrap; gap: 5px 0; align-items: center; margin: 0; color: #6b6253; font-size: .82rem; line-height: 1.45; }
#eventView #eventHomeMeta span { display: inline-flex; align-items: center; }
#eventView #eventHomeMeta span + span::before { content: ""; width: 3px; height: 3px; margin: 0 9px; border-radius: 50%; background: #b69a55; }
#eventView .event-home-card .event-description { width: 94%; max-width: 39rem; margin: 15px auto 0; padding-top: 13px; border-top: 1px solid #ede3c7; color: #514a3d; }
#eventView #eventCloudStatus { margin: 11px 3% 0; color: #84765a; font-size: .71rem; }
#eventView #eventCloudStatus.event-sync-badge { display: inline-block; width: max-content; padding: 4px 8px; border: 1px solid #ddcfa5; border-radius: 999px; background: #f8f3e5; color: #735f30; font-weight: 500; letter-spacing: .025em; }
#eventView .event-home-actions { position: relative; z-index: 1; width: 94%; margin: 18px auto 0; }
#eventView .event-home-actions .primary-button { min-height: 50px; border-radius: 14px; background: #81682e; box-shadow: none; font-size: .78rem; font-weight: 600; letter-spacing: .11em; }
#eventView .event-home-actions .primary-button:hover,
#eventView .event-home-actions .primary-button:focus-visible { background: #695320; }
#eventView .event-details-card { margin: 0; padding: 17px 18px; }
#eventView .event-details-card .review-section-title { margin-bottom: 5px; }
#eventView .event-details-card .review-section-title h2 { color: #765b22; font-size: .72rem; font-weight: 600; letter-spacing: .15em; }
#eventView .event-details { display: block; }
#eventView .event-details > div,
#eventView .event-details .wide { display: grid; grid-template-columns: minmax(116px, .82fr) minmax(0, 1.4fr); gap: 10px; align-items: baseline; padding: 11px 0; border-radius: 0; background: transparent; }
#eventView .event-details > div + div { border-top: 1px solid #eee5ce; }
#eventView .event-details dt { color: #74664f; font-size: .72rem; font-weight: 500; letter-spacing: .025em; }
#eventView .event-details dd { margin: 0; min-width: 0; color: #302c24; font-size: .9rem; font-weight: 500; overflow-wrap: anywhere; }
#eventView .event-details #yourEventRole { display: inline-block; padding: 5px 8px; border-radius: 999px; background: #f3ead2; color: #765b22; font-size: .7rem; font-weight: 600; letter-spacing: .03em; }
#eventView .event-team-help { margin: 11px 0 0; padding-top: 10px; border-top: 1px solid #eee5ce; color: #84765a; font-size: .71rem; line-height: 1.45; }
#eventView .event-management-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 3px; }
#eventView .event-management-actions .outline-wide-button { min-height: 46px; margin: 0; padding: 8px; border-color: #cdb978; border-radius: 12px; background: rgba(255,254,251,.84); font-size: .67rem; font-weight: 600; letter-spacing: .055em; }
#eventView .event-management-actions .outline-wide-button[hidden] { display: none; }
#eventView #createAnotherEventButton { justify-self: start; margin: 0 2px; font-size: .75rem; }
#eventView #eventPicker { display: grid; gap: 8px; padding: 0; border: 0; border-radius: 0; background: transparent; }
#eventView #eventPicker[hidden] { display: none; }
#eventView .other-events-heading { margin: 5px 2px 2px; color: #80642a; font-size: .68rem; font-weight: 600; letter-spacing: .15em; }
#eventView .event-switch-card { grid-template-columns: minmax(0, 1fr) 16px; gap: 10px; min-width: 0; padding: 13px 14px; border-color: #d9c788; border-radius: 16px; background: rgba(255,254,251,.86); }
#eventView .event-switch-card.has-event-photo { grid-template-columns: 56px minmax(0, 1fr) 16px; }
#eventView .event-switch-thumbnail { width: 56px; height: 56px; align-self: center; border: 1px solid #ddcfa5; border-radius: 12px; object-fit: cover; clip-path: inset(0 round 12px); }
#eventView .event-switch-card .saved-record-content { gap: 3px; }
#eventView .event-switch-card .saved-record-content strong { font-family: inherit; font-size: 1.05rem; font-weight: 600; line-height: 1.15; }
#eventView .event-switch-card .saved-record-content > span { color: #675f51; font-size: .79rem; white-space: normal; }
#eventView .event-switch-card .saved-record-content small { color: #80642a; font-size: .64rem; font-weight: 500; letter-spacing: .08em; }

@media (min-width: 520px) {
  body:has(#eventView:not([hidden])) .records-nav { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Event Photo v1 */
.event-photo-editor { margin: 4px 0 18px; padding: 14px; border: 1px solid var(--gold-soft); border-radius: 16px; background: #fcfaf3; }
.event-photo-label { color: #514a3e; font-size: .88rem; font-weight: 700; }
.event-photo-editor > .field-help { margin: 5px 0 11px; }
.event-photo-preview { position: relative; width: 118px; height: 118px; overflow: hidden; display: grid; place-items: center; border: 1px solid #d8c78f; border-radius: 18px; background-color: #f7f0dd; background-image: url("./assets/woven-cream-texture.png"); background-repeat: repeat; background-position: center; background-size: 520px auto; color: var(--gold-dark); font: 800 1rem Georgia, serif; }
.event-photo-preview img { width: 100%; height: 100%; display: block; object-fit: cover; }
.event-photo-preview span { display: grid; width: 100%; height: 100%; place-items: center; }
.event-photo-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 11px; }
.event-photo-controls .outline-wide-button { min-height: 44px; margin: 0; border-radius: 12px; font-size: .72rem; }
.event-photo-controls .danger { border-color: #c9918b; color: var(--danger); }
.event-photo-choose { position: relative; display: grid; place-items: center; margin-bottom: 0; overflow: hidden; cursor: pointer; }
.event-photo-choose input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
#eventPhotoStatus { min-height: 0; margin: 9px 0 0; }
.public-event-photo-frame { position: relative; width: min(100%, 360px); aspect-ratio: 16 / 9; margin: 15px 0 18px; overflow: hidden; border: 1px solid #d8c78f; border-radius: 20px; }
.public-event-photo { display: block; will-change: left, top, width, height; }
.event-photo-position-dialog { width: min(92vw, 520px); padding: 0; overflow: hidden; border: 1px solid #d6c17f; border-radius: 20px; background: #fffdf8; color: #3f392f; box-shadow: 0 16px 45px rgba(53,42,18,.17); }
.event-photo-position-dialog::backdrop { background: rgba(39,32,20,.42); }
.event-photo-position-dialog section { padding: 18px; }
.event-photo-position-dialog .eyebrow { color: #765b22; font-size: .68rem; font-weight: 600; letter-spacing: .14em; }
.event-photo-position-dialog p:not(.field-help) { margin: 6px 0 14px; color: #625a4c; font-size: .88rem; line-height: 1.45; }
.event-photo-position-frame { position: relative; height: auto; aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid #cdb978; border-radius: 17px; background: #f2ead1; touch-action: none; cursor: grab; }
.event-photo-position-frame:active { cursor: grabbing; }
.event-photo-position-frame img { width: 100%; height: 100%; display: block; object-fit: cover; user-select: none; -webkit-user-drag: none; will-change: transform; }
.event-photo-zoom-control { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; margin-top: 13px; color: #5f5545; font-size: .82rem; font-weight: 500; }
.event-photo-zoom-control input { width: 100%; accent-color: #9b7c32; }
.event-photo-zoom-control output { min-width: 3.3rem; color: #765b22; font-variant-numeric: tabular-nums; text-align: right; }
.event-photo-position-actions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .72fr); gap: 9px; margin-top: 14px; }
.event-photo-position-actions .primary-button,
.event-photo-position-actions .outline-wide-button { min-height: 43px; margin: 0; border-radius: 12px; font-size: .72rem; }
.event-photo-position-dialog .field-help { min-height: 0; margin: 10px 0 0; }

/* Recovered SI’I Create / Edit Event presentation */
body:has(#createEventView:not([hidden])) {
  font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-weight: 400;
}
body:has(#createEventView:not([hidden])) .topbar { height: 66px; }
body:has(#createEventView:not([hidden])) .brand-mark,
body:has(#createEventView:not([hidden])) .screen-title { font-family: inherit; font-weight: 600; }
body:has(#createEventView:not([hidden])) .brand-mark { font-size: 1.08rem; letter-spacing: .12em; }
body:has(#createEventView:not([hidden])) .screen-title { margin-top: 4px; font-size: .61rem; letter-spacing: .18em; }
body:has(#createEventView:not([hidden])) .icon-button { width: 36px; height: 36px; font-size: 1.55rem; }
body:has(#createEventView:not([hidden])) .avatar { width: 32px; height: 32px; font-size: .72rem; border-color: #c9b678; }
body:has(#createEventView:not([hidden])) .records-nav { display: none; }
#createEventView { padding: 3px 4px 10px; }
#createEventView .form-card {
  position: relative;
  padding: 18px 18px 22px;
  border-color: #d7c483;
  border-radius: 22px;
  background: rgba(255,254,251,.96);
  box-shadow: 0 7px 24px rgba(68,53,19,.055);
}
#createEventView .event-form-accent {
  display: block;
  margin: 0 0 15px;
  height: 1px;
  overflow: hidden;
  background: #d8c78f;
  color: transparent;
  font-size: 0;
}
#createEventView .form-guidance {
  margin: 0 0 18px;
  padding: 10px 12px;
  border-left-width: 2px;
  background: #faf5e7;
  color: #5d5548;
  font-size: .8rem;
}
#createEventView .form-card > label {
  margin-bottom: 17px;
  color: #454037;
  font-size: .88rem;
  font-weight: 500;
}
#createEventView .optional,
#createEventView .required { font-weight: 500; }
#createEventView input,
#createEventView select,
#createEventView textarea {
  min-height: 49px;
  border-color: #d5c8a5;
  border-radius: 13px;
  background: #fffdf8;
  font-family: inherit;
  font-size: .93rem;
  font-weight: 400;
  box-shadow: none;
}
#createEventView textarea { min-height: 94px; }
#createEventView input[type="datetime-local"] { color-scheme: light; accent-color: #ad8a36; }
#createEventView input[type="datetime-local"]::-webkit-calendar-picker-indicator { opacity: .72; filter: sepia(.72) saturate(1.15) hue-rotate(2deg); }
#createEventView .event-photo-editor {
  margin: 0 0 18px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
#createEventView .event-photo-label { color: #454037; font-size: .88rem; font-weight: 500; }
#createEventView .event-photo-editor > .field-help { margin: 5px 0 10px; color: #746b5b; }
#createEventView .event-photo-stage { position: relative; }
#createEventView .event-photo-preview {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  border: 1px solid #b99b50;
  border-radius: 18px;
  background-color: #f7f0dd;
  background-image: url("./assets/woven-cream-texture.png");
  background-repeat: repeat;
  background-position: center;
  background-size: 520px auto;
  color: #81682e;
  font-family: inherit;
  box-shadow: none;
}
#createEventView .event-photo-preview img { object-fit: cover; }
#createEventView .event-photo-preview > span {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: #fffefb;
}
#createEventView .event-photo-tap {
  display: grid;
  min-height: 41px;
  place-items: center;
  margin: 0;
  padding: 8px 15px;
  border: 1px solid #cdb978;
  border-radius: 12px;
  background: transparent;
  color: #765b22;
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .07em;
  cursor: pointer;
}
#createEventView .event-photo-tap:focus-within { box-shadow: inset 0 0 0 3px rgba(255,254,251,.72), 0 0 0 3px rgba(173,138,54,.2); }
#createEventView .event-photo-tap input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
#createEventView .event-photo-tap:not(.has-photo) {
  position: absolute;
  inset: 0;
  z-index: 1;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 18px;
}
#createEventView .event-photo-tap:not(.has-photo) > span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
#createEventView .event-photo-controls { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px; margin-top: 10px; }
#createEventView .event-photo-controls:not(:has(.event-photo-tap.has-photo)) { height: 0; margin-top: 0; }
#createEventView .event-photo-controls:not(:has(> :not([hidden]))) { display: none; }
#createEventView .event-photo-controls .outline-wide-button {
  width: auto;
  padding-inline: 15px;
  min-height: 41px;
  border-color: #cdb978;
  background: transparent;
  color: #765b22;
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .07em;
}
#createEventView .primary-button {
  min-height: 50px;
  border-radius: 14px;
  background: #81682e;
  font-weight: 600;
  letter-spacing: .1em;
  box-shadow: none;
}
#createEventView .primary-button:hover,
#createEventView .primary-button:focus-visible { background: #695320; }
#createEventView #cancelEventButton { display: block; margin: 8px auto 0; color: #765b22; font-weight: 500; }

/* Recovered SI’I Record entry presentation */
body:has(#recordView:not([hidden])) {
  font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-weight: 400;
}
body:has(#recordView:not([hidden])) .topbar { height: 66px; }
body:has(#recordView:not([hidden])) .brand-mark,
body:has(#recordView:not([hidden])) .screen-title { font-family: inherit; font-weight: 600; }
body:has(#recordView:not([hidden])) .brand-mark { font-size: 1.08rem; letter-spacing: .12em; }
body:has(#recordView:not([hidden])) .screen-title { margin-top: 4px; font-size: .61rem; letter-spacing: .18em; }
body:has(#recordView:not([hidden])) .icon-button { width: 36px; height: 36px; font-size: 1.55rem; }
body:has(#recordView:not([hidden])) .avatar { width: 32px; height: 32px; font-size: .72rem; border-color: #c9b678; }
body:has(#recordView:not([hidden])) .records-nav { display: none; }
#recordView { padding: 3px 4px 10px; }
#recordView .event-strip {
  margin-bottom: 10px;
  padding: 11px 13px;
  border-color: #d7c483;
  border-radius: 16px;
  background: rgba(255,254,251,.94);
  box-shadow: none;
}
#recordView .event-strip .eyebrow { font-size: .64rem; font-weight: 600; letter-spacing: .13em; }
#recordView .event-strip strong { margin-top: 3px; color: #302c24; font-size: .94rem; font-weight: 600; }
#recordView .event-strip small { margin-top: 2px; color: #756c5d; font-size: .72rem; }
#recordView .status-pill { padding: 5px 8px; font-size: .64rem; font-weight: 600; }
#recordView .form-card {
  padding: 17px 17px 20px;
  border-color: #d7c483;
  border-radius: 22px;
  background: rgba(255,254,251,.96);
  box-shadow: 0 7px 24px rgba(68,53,19,.05);
}
#recordView fieldset { padding-bottom: 18px; }
#recordView fieldset + fieldset { padding-top: 18px; border-top-color: #e8ddc0; }
#recordView legend {
  padding-bottom: 11px;
  color: #765b22;
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .13em;
}
#recordView label,
#recordView .choice-field { margin-bottom: 14px; color: #454037; font-size: .86rem; font-weight: 500; }
#recordView .optional,
#recordView .required { font-weight: 500; }
#recordView input,
#recordView select,
#recordView textarea {
  min-height: 47px;
  border-color: #d5c8a5;
  border-radius: 12px;
  background: #fffdf8;
  font-family: inherit;
  font-size: .92rem;
  font-weight: 400;
  box-shadow: none;
}
#recordView textarea { min-height: 86px; }
#recordView .money-row { gap: 10px; }
#recordView .money-input input { font-size: 1rem; font-weight: 500; }
#recordView .row-heading { min-height: 38px; color: #4d463a; font-size: .84rem; font-weight: 500; }
#recordView .text-button { color: #765b22; font-weight: 600; }
#recordView .gift-row { margin: 5px 0 10px; padding: 9px; border-color: #e2d6b8; border-radius: 12px; box-shadow: none; }
#recordView .gift-row input { min-height: 42px; }
#recordView .gift-fields { grid-template-columns: minmax(0, 1fr) 78px 38px; gap: 7px; }
#recordView .gift-fields label:first-child { grid-column: 1 / -1; }
#recordView .returned-section {
  margin: 0;
  padding-inline: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
#recordView .reciprocation-head p { margin-top: 3px; font-size: .76rem; }
#recordView .reciprocation-head .outline-button { min-height: 38px; padding: 6px 12px; border-radius: 12px; font-weight: 600; }
#recordView #returnFields { margin-top: 12px; padding-top: 14px; }
#recordView .family-contribution-section .choice-field { margin-bottom: 0; }
#recordView .family-contribution-section .choice-field > span:first-child { display: block; margin-bottom: 7px; color: #4d463a; font-weight: 500; }
#recordView .segmented { gap: 7px; margin-top: 0; }
#recordView .segmented span { min-height: 43px; border-color: #d5c8a5; border-radius: 11px; }
#recordView .more-options { border-color: #ddd0ae; border-radius: 12px; background: #fdfaf2; }
#recordView .more-options summary { min-height: 44px; color: #765b22; font-size: .82rem; font-weight: 600; }
#recordView .more-options-body { padding-top: 12px; }
#recordView .primary-button {
  min-height: 50px;
  border-radius: 14px;
  background: #81682e;
  font-weight: 600;
  letter-spacing: .1em;
  box-shadow: none;
}
#recordView .primary-button:hover,
#recordView .primary-button:focus-visible { background: #695320; }

@media (min-width: 480px) {
  #recordView .gift-fields { grid-template-columns: minmax(0, 1fr) 64px 84px 38px; }
  #recordView .gift-fields label:first-child { grid-column: auto; }
}

/* Recovered SI’I Review verification presentation */
body:has(#reviewView:not([hidden])) {
  font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-weight: 400;
}
body:has(#reviewView:not([hidden])) .topbar { height: 66px; }
body:has(#reviewView:not([hidden])) .brand-mark,
body:has(#reviewView:not([hidden])) .screen-title { font-family: inherit; font-weight: 600; }
body:has(#reviewView:not([hidden])) .brand-mark { font-size: 1.08rem; letter-spacing: .12em; }
body:has(#reviewView:not([hidden])) .screen-title { margin-top: 4px; font-size: .61rem; letter-spacing: .18em; }
body:has(#reviewView:not([hidden])) .icon-button { width: 36px; height: 36px; font-size: 1.55rem; }
body:has(#reviewView:not([hidden])) .avatar { width: 32px; height: 32px; font-size: .72rem; border-color: #c9b678; }
body:has(#reviewView:not([hidden])) .records-nav { display: none; }
#reviewView { padding: 3px 4px 10px; }
#reviewView .event-strip {
  margin-bottom: 11px;
  padding: 11px 13px;
  border-color: #d7c483;
  border-radius: 16px;
  background: rgba(255,254,251,.94);
  box-shadow: none;
}
#reviewView .event-strip .eyebrow { font-size: .64rem; font-weight: 600; letter-spacing: .13em; }
#reviewView .event-strip strong { margin-top: 3px; color: #302c24; font-size: .92rem; font-weight: 600; }
#reviewView .event-strip small { margin-top: 2px; color: #756c5d; font-size: .72rem; }
#reviewView .review-card {
  padding: 21px 18px 22px;
  border-color: #d7c483;
  border-radius: 22px;
  background: rgba(255,254,251,.97);
  box-shadow: 0 7px 24px rgba(68,53,19,.05);
}
#reviewView .review-person { padding: 0 2px 18px; }
#reviewView .review-person .eyebrow { font-size: .68rem; font-weight: 600; letter-spacing: .13em; }
#reviewView .review-person h1 {
  margin: 7px 0 5px;
  color: #2d2922;
  font-family: inherit;
  font-size: clamp(1.65rem, 7vw, 2.05rem);
  font-weight: 600;
  line-height: 1.08;
}
#reviewView .review-person p { color: #6a6255; font-size: .82rem; }
#reviewView .review-instruction {
  margin: 0 0 17px;
  padding: 10px 12px;
  border-left-width: 2px;
  background: #faf5e7;
  color: #5d5548;
  font-size: .8rem;
}
#reviewView .review-financial-summary {
  overflow: hidden;
  margin-bottom: 20px;
  border: 1px solid #d9c788;
  border-radius: 16px;
  background: #fcfaf3;
}
#reviewView .review-financial-summary span,
#reviewView .review-financial-summary strong { display: block; }
#reviewView .review-financial-summary span { color: #766a57; font-size: .66rem; font-weight: 500; letter-spacing: .1em; }
#reviewView .review-received { padding: 17px 14px 15px; text-align: center; }
#reviewView .review-received strong { margin-top: 6px; color: #302c24; font-size: 1.55rem; font-weight: 600; }
#reviewView .review-return-balance { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid #e3d7b8; }
#reviewView .review-return-balance > div { padding: 13px 10px; text-align: center; }
#reviewView .review-return-balance > div + div { border-left: 1px solid #e3d7b8; }
#reviewView .review-return-balance strong { margin-top: 5px; color: #433d32; font-size: 1rem; font-weight: 500; }
#reviewView .review-return-balance .balance { background: #f1e6c6; }
#reviewView .review-return-balance .balance strong { color: #614a18; font-weight: 600; }
#reviewView .review-section { padding: 17px 1px; border-top-color: #e8ddc0; }
#reviewView .review-section-title h2 { color: #765b22; font-size: .7rem; font-weight: 600; letter-spacing: .12em; }
#reviewView .review-section-title > span { color: #766d5f; font-weight: 500; }
#reviewView .review-gifts { gap: 8px; }
#reviewView .review-gift { grid-template-columns: 72px minmax(0, 1fr); padding: 9px; border-color: #e0d4b5; border-radius: 12px; background: #fffdf8; }
#reviewView .review-photo-button { width: 72px; height: 72px; border-radius: 11px; cursor: zoom-in; }
#reviewView .review-photo-button img { display: block; width: 72px; height: 72px; object-fit: cover; image-orientation: from-image; }
#reviewView .review-photo-button > span { padding: 4px; font-size: .64rem; }
#reviewView .review-gift.photo-preview-unavailable { grid-template-columns: 1fr; }
#reviewView .review-gift.photo-preview-unavailable .review-photo-button { display: none; }
#reviewView .review-gift.photo-preview-unavailable [data-review-photo-status] { color: #756c5d; }
#reviewView .review-gift strong { color: #3b362d; font-weight: 600; }
#reviewView .review-gift span { color: #6d6558; font-size: .8rem; }
#reviewView .review-gift small { font-weight: 500; }
#reviewView .review-secondary-details { color: #5d5549; }
#reviewView .review-details { gap: 7px; }
#reviewView .review-details > div { padding: 9px 10px; border-radius: 10px; background: #faf7ef; }
#reviewView .review-details dt { color: #756c5d; font-size: .69rem; font-weight: 400; }
#reviewView .review-details dd { color: #423d34; font-size: .82rem; font-weight: 500; }
#reviewView #reviewSaveError { min-height: 17px; margin: 2px 0 10px; }
#reviewView .primary-button {
  min-height: 50px;
  border-radius: 14px;
  background: #81682e;
  font-weight: 600;
  letter-spacing: .1em;
  box-shadow: none;
}
#reviewView .primary-button:hover,
#reviewView .primary-button:focus-visible { background: #695320; }
#photoDialog img { image-orientation: from-image; }

/* Saved SI’I: compact, trustworthy event record lookup. */
body:has(#savedView:not([hidden])) {
  font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-weight: 400;
}
body:has(#savedView:not([hidden])) .topbar { height: 64px; grid-template-columns: 40px 1fr 40px; }
body:has(#savedView:not([hidden])) .brand-mark,
body:has(#savedView:not([hidden])) .screen-title { font-family: inherit; font-weight: 600; }
body:has(#savedView:not([hidden])) .brand-mark { font-size: 1.08rem; letter-spacing: .12em; }
body:has(#savedView:not([hidden])) .screen-title { margin-top: 4px; font-size: .61rem; letter-spacing: .18em; }
body:has(#savedView:not([hidden])) .avatar { width: 32px; height: 32px; border-color: #c9b678; font-size: .72rem; }
body:has(#savedView:not([hidden])) .records-nav {
  grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
  gap: 3px;
  padding: 3px;
  margin-bottom: 14px;
  border-color: #cdb978;
  border-radius: 18px;
  background: rgba(255,254,251,.82);
}
body:has(#savedView:not([hidden])) .records-nav button {
  min-height: 40px;
  padding: 7px 8px;
  border-radius: 14px;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .01em;
}
body:has(#savedView:not([hidden])) .records-nav button[aria-current] { background: #81682e; }
#savedView { display: grid; gap: 11px; }
#savedView[hidden] { display: none; }
#savedView .saved-event-strip {
  margin: 0;
  padding: 13px 15px;
  border-color: #d7c483;
  border-radius: 18px;
  background: rgba(255,254,251,.94);
  box-shadow: none;
}
#savedView .saved-event-strip .eyebrow { font-size: .64rem; font-weight: 600; letter-spacing: .15em; }
#savedView .saved-event-strip strong { margin-top: 5px; color: #2e2a23; font-size: 1.02rem; font-weight: 600; line-height: 1.2; }
#savedView .saved-event-strip small { margin-top: 4px; color: #746b5c; font-size: .72rem; line-height: 1.35; }
#savedView .saved-ledger-panel {
  padding: 15px;
  border-color: #d7c483;
  border-radius: 20px;
  background: rgba(255,254,251,.96);
}
#savedView .saved-search-field { margin: 0; color: #51493d; font-size: .82rem; font-weight: 600; }
#savedView .saved-search-field input {
  min-height: 45px;
  margin-top: 7px;
  border-color: #cdbd8c;
  border-radius: 12px;
  background: #fffefa;
  font-size: .9rem;
}
#savedView .saved-count { margin: 9px 1px 10px; color: #817765; font-size: .7rem; font-weight: 500; }
#savedView .saved-records { gap: 8px; }
#savedView .saved-record {
  grid-template-columns: 48px minmax(0, 1fr) 12px;
  gap: 11px;
  min-width: 0;
  padding: 11px 10px;
  border-color: #dfd1a7;
  border-radius: 14px;
  background: #fffefb;
  box-shadow: none;
}
#savedView .saved-record:hover,
#savedView .saved-record:focus-visible { background: #fcf8ec; outline: 2px solid #ad8a36; outline-offset: 1px; }
#savedView .saved-thumbnail,
#savedView .saved-initial { width: 48px; height: 52px; border: 1px solid #e0d4b5; border-radius: 10px; }
#savedView .saved-thumbnail { object-fit: cover; }
#savedView .saved-initial {
  font: 600 1.15rem Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  background:
    linear-gradient(135deg, rgba(173,138,54,.08) 25%, transparent 25%) 0 0 / 14px 14px,
    linear-gradient(225deg, rgba(173,138,54,.08) 25%, transparent 25%) 0 0 / 14px 14px,
    #f4ecd5;
}
#savedView .saved-record-content { gap: 3px; min-width: 0; overflow-wrap: normal; }
#savedView .saved-record-content > strong { color: #302c24; font-size: .95rem; font-weight: 600; line-height: 1.2; overflow-wrap: anywhere; }
#savedView .saved-record-content > span { font-size: .76rem; line-height: 1.35; }
#savedView .saved-contributor-meta { color: #756c5e; }
#savedView .saved-contribution-summary { margin-top: 2px; color: #423c32; font-weight: 500; }
#savedView .saved-balance { color: #6c5422; font-weight: 600; }
#savedView .saved-record-footer { display: flex; flex-wrap: wrap; align-items: center; gap: 3px 8px; margin-top: 3px; }
#savedView .saved-record-footer time { color: #7a7162; font-size: .66rem; line-height: 1.35; }
#savedView .saved-record-footer small { color: #7b6840; font-size: .65rem; font-weight: 500; line-height: 1.35; }
#savedView .saved-chevron { color: #a88a45; font-size: 1.25rem; font-weight: 400; }
#savedView .saved-record.is-pending { border-style: dashed; background: #fdf9ed; }
#savedView .saved-record.is-pending .saved-record-footer small { color: #765b22; font-weight: 600; }
#savedView .saved-record.is-voided { border-color: #d8b9b2; background: #fbf4f2; opacity: .82; }
#savedView .saved-record.is-voided .saved-record-content > strong { text-decoration: line-through; text-decoration-color: #a76d65; }
#savedView .saved-record.is-voided .saved-balance,
#savedView .saved-record.is-voided .saved-record-footer small { color: #8d4038; }
#savedView .saved-empty { padding: 28px 10px 24px; }
#savedView .saved-empty strong { color: #3d382f; font-size: .95rem; font-weight: 600; }
#savedView .saved-empty p { margin: 7px 0 0; color: #786f61; font-size: .8rem; }

@media (min-width: 520px) {
  body:has(#savedView:not([hidden])) .records-nav { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Contribution Detail: one authoritative SI’I record. */
body:has(#detailView:not([hidden])) {
  font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-weight: 400;
}
body:has(#detailView:not([hidden])) .topbar { height: 64px; grid-template-columns: 40px 1fr 40px; }
body:has(#detailView:not([hidden])) .brand-mark,
body:has(#detailView:not([hidden])) .screen-title { font-family: inherit; font-weight: 600; }
body:has(#detailView:not([hidden])) .brand-mark { font-size: 1.08rem; letter-spacing: .12em; }
body:has(#detailView:not([hidden])) .screen-title { margin-top: 4px; font-size: .61rem; letter-spacing: .16em; }
body:has(#detailView:not([hidden])) .icon-button { width: 36px; height: 36px; font-size: 1.55rem; }
body:has(#detailView:not([hidden])) .avatar { width: 32px; height: 32px; border-color: #c9b678; font-size: .72rem; }
body:has(#detailView:not([hidden])) .records-nav { display: none; }
#detailView { display: grid; gap: 11px; }
#detailView[hidden] { display: none; }
#detailView .detail-event-strip {
  margin: 0;
  padding: 12px 14px;
  border-color: #d7c483;
  border-radius: 18px;
  background: rgba(255,254,251,.94);
  box-shadow: none;
}
#detailView .detail-event-strip .eyebrow { font-size: .62rem; font-weight: 600; letter-spacing: .14em; }
#detailView .detail-event-strip strong { margin-top: 4px; color: #302c24; font-size: .92rem; font-weight: 600; line-height: 1.2; }
#detailView .detail-event-strip small { margin-top: 3px; color: #776e60; font-size: .69rem; }
#detailView .detail-event-strip .status-pill { padding: 5px 8px; border: 1px solid #d7c68f; background: #f7f0dd; font-size: .62rem; font-weight: 600; }
#detailView .detail-card,
#detailView .history-card {
  padding: 18px;
  border-color: #d7c483;
  border-radius: 20px;
  background: rgba(255,254,251,.97);
  box-shadow: none;
}
#detailView .detail-status-row { align-items: flex-start; }
#detailView #detailSaveStatus {
  padding: 5px 8px;
  border: 1px solid #ddcfa5;
  background: #f8f3e5;
  color: #735f30;
  font-size: .65rem;
  font-weight: 500;
  letter-spacing: .02em;
}
#detailView #detailSaveStatus.is-pending { border-style: dashed; color: #765b22; background: #fdf8e9; }
#detailView #detailSaveStatus.is-voided { border-color: #d4b8ae; color: #82473f; background: #f9f0ed; }
#detailView .recorded-time { max-width: 47%; color: #7b7264; font-size: .66rem; line-height: 1.35; text-align: right; }
#detailView .detail-person { padding: 21px 2px 17px; }
#detailView .detail-person .eyebrow { color: #765b22; font-size: .66rem; font-weight: 600; letter-spacing: .14em; }
#detailView .detail-person h1 {
  margin: 7px 0 5px;
  color: #2d2922;
  font-family: inherit;
  font-size: clamp(1.65rem, 7vw, 2.08rem);
  font-weight: 600;
  line-height: 1.08;
  overflow-wrap: anywhere;
}
#detailView .detail-person p { min-height: 0; margin: 0; color: #6e6557; font-size: .8rem; line-height: 1.4; }
#detailView .detail-cash-summary {
  margin-bottom: 5px;
  border-color: #d9c788;
  border-radius: 15px;
  background: #fcfaf3;
}
#detailView .detail-cash-summary div { min-width: 0; padding: 13px 6px; background: #fcfaf3; }
#detailView .detail-cash-summary div + div { border-left-color: #e1d5b4; }
#detailView .detail-cash-summary span { color: #766d5f; font-size: .65rem; font-weight: 500; }
#detailView .detail-cash-summary strong { color: #39342b; font-size: .9rem; font-weight: 600; }
#detailView .detail-cash-summary .balance { background: #f1e6c6; }
#detailView .detail-cash-summary .balance strong { color: #664e1b; }
#detailView .detail-section { padding: 17px 1px; border-top-color: #e8ddc0; }
#detailView .review-section-title { margin-bottom: 9px; }
#detailView .review-section-title h2 { color: #765b22; font-size: .7rem; font-weight: 600; letter-spacing: .12em; }
#detailView .review-section-title > span { color: #776e60; font-size: .7rem; font-weight: 500; }
#detailView .review-gifts { gap: 8px; }
#detailView .review-gift {
  grid-template-columns: 68px minmax(0, 1fr);
  gap: 11px;
  padding: 9px;
  border-color: #e0d4b5;
  border-radius: 12px;
  background: #fffdf8;
}
#detailView .review-gift.no-photo,
#detailView .review-gift.photo-preview-unavailable { grid-template-columns: 1fr; }
#detailView .review-photo-button { width: 68px; height: 68px; border-radius: 10px; cursor: zoom-in; }
#detailView .review-photo-button img { display: block; width: 68px; height: 68px; object-fit: cover; image-orientation: from-image; }
#detailView .review-photo-button > span { padding: 4px; font-size: .63rem; }
#detailView .review-gift.photo-preview-unavailable .review-photo-button { display: none; }
#detailView .review-gift strong { color: #39342c; font-size: .88rem; font-weight: 600; }
#detailView .review-gift span { color: #706758; font-size: .78rem; }
#detailView .review-gift small { color: #79632e; font-size: .68rem; font-weight: 500; }
#detailView .detail-record-information .review-details { gap: 7px; }
#detailView .detail-record-information .review-details > div { padding: 9px 10px; background: #faf7ef; }
#detailView .detail-record-information .review-details dt { color: #776e60; font-size: .68rem; font-weight: 400; }
#detailView .detail-record-information .review-details dd { color: #403a31; font-size: .8rem; font-weight: 500; line-height: 1.4; overflow-wrap: anywhere; }
#detailView .detail-record-information .review-details dd.important { color: #715820; }
#detailView .added-notes { gap: 8px; }
#detailView .added-notes > div { padding: 10px 11px; border-left-width: 2px; background: #faf7ef; }
#detailView .added-notes strong { color: #3d382f; font-size: .8rem; font-weight: 600; }
#detailView .added-notes p { color: #534c40; font-size: .8rem; }
#detailView .added-notes small,
#detailView .correction-current-summary > small { display: block; margin-top: 6px; color: #7b7264; font-size: .68rem; line-height: 1.4; }
#detailView .correction-current-summary { margin-top: 2px; padding: 10px 11px; border: 1px solid #ddcfa7; border-radius: 12px; background: #fbf7eb; }
#detailView .correction-state { color: #715820; font-size: .7rem; font-weight: 600; letter-spacing: .1em; }
#detailView .correction-history .added-notes > div { border-left-color: #b79b54; }
#detailView .voided-entry-status {
  margin: 14px 0 3px;
  padding: 13px 14px;
  border: 1px solid #d3b7ad;
  border-left: 3px solid #9b665d;
  border-radius: 12px;
  background: #faf2ef;
  color: #493a37;
}
#detailView .voided-entry-status strong,
#detailView .voided-entry-status span,
#detailView .voided-entry-status small { display: block; }
#detailView .voided-entry-status strong { color: #7d443d; font-size: .76rem; font-weight: 600; letter-spacing: .12em; }
#detailView .voided-entry-status span { margin-top: 5px; color: #6f443e; font-size: .75rem; font-weight: 600; }
#detailView .voided-entry-status p { margin: 9px 0 0; color: #51433f; font-size: .8rem; }
#detailView .voided-entry-status p b { margin-right: 5px; font-weight: 600; }
#detailView .voided-entry-status small { margin-top: 6px; color: #786763; font-size: .67rem; }
#detailView .detail-primary-action {
  min-height: 50px;
  margin-top: 14px;
  border-radius: 14px;
  background: #81682e;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .09em;
  box-shadow: none;
}
#detailView .detail-action-grid { gap: 8px; margin-top: 11px; }
#detailView .detail-action-grid .outline-wide-button,
#detailView .detail-card > .outline-wide-button {
  min-height: 44px;
  border-color: #cdb978;
  border-radius: 12px;
  background: #fffefb;
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .055em;
  box-shadow: none;
}
#detailView .detail-authorised-action { margin-top: 14px; border-color: #c6a99f !important; color: #7e4a43; background: #fffaf8 !important; }
#detailView #retryCloudSyncButton { border-style: dashed; }
#detailView #detailNextRecordButton { margin-top: 18px; border-color: #cdb978; color: #765b22; }
#detailView .history-card { margin: 0; }
#detailView .history-heading .eyebrow { font-size: .68rem; font-weight: 600; letter-spacing: .14em; }
#detailView .history-heading small { color: #7c7365; font-size: .67rem; }
#detailView .timeline { margin-top: 14px; }
#detailView .timeline-item { gap: 10px; padding-bottom: 17px; }
#detailView .timeline-item:not(:last-child)::before { background: #d9c997; }
#detailView .timeline-dot { border-color: #f3e8c7; background: #92752f; }
#detailView .timeline-item strong { color: #38332b; font-size: .82rem; font-weight: 600; }
#detailView .timeline-item div > span { color: #554e42; font-size: .78rem; }
#detailView .timeline-item small { color: #7a7162; font-size: .66rem; }

@media (min-width: 520px) {
  body:has(#detailView:not([hidden])) .records-nav { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
#copyTeamNoteButton { font-size: 0; }
#copyTeamNoteButton::after { content: "COPY TEAM INVITE"; font-size: .78rem; }

/* Invite & Share: match the standard SI’I secondary action shape. */
#shareView #copyEventNoticeButton,
#shareView #copyPublicLinkButton,
#shareView #disablePublicLinkButton {
  border-radius: 12px;
}

/* Team & Roles stays compact and deliberate while choosing access. */
#teamView .team-introduction { margin-bottom: 14px; }
#teamView .team-role-description { margin: -4px 0 12px; color: #746957; }
#teamView #teamForm .primary-button {
  border-radius: 14px;
  box-shadow: none;
}


/* Two-book Event Home prototype — UI only, no Tupe Galue persistence yet. */
.event-books-section { display: grid; gap: 12px; }
.event-books-heading { padding: 8px 4px 0; }
.event-books-heading p { margin: 6px 0 0; color: var(--muted); font-size: .8rem; line-height: 1.45; }
.event-book-card {
  border: 1px solid #d7c483;
  border-radius: 20px;
  background: rgba(255,254,251,.96);
  padding: 18px;
}
.event-book-card h2 {
  margin: 5px 0 6px;
  font-family: Georgia, serif;
  font-size: 1.38rem;
  font-weight: 600;
}
.event-book-description { margin: 0; color: var(--muted); font-size: .84rem; line-height: 1.45; }
.event-book-title-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.private-book-badge {
  flex: 0 0 auto;
  padding: 5px 8px;
  border: 1px solid #cbb56f;
  border-radius: 999px;
  color: #735d28;
  background: #f7efda;
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .06em;
}
.event-book-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 15px 0 2px;
}
.event-book-metrics > div {
  min-width: 0;
  padding: 11px;
  border-radius: 12px;
  background: #faf7ef;
}
.event-book-metrics dt { color: var(--muted); font-size: .66rem; line-height: 1.3; }
.event-book-metrics dd { margin: 5px 0 0; color: var(--ink); font-size: .95rem; font-weight: 750; overflow-wrap: anywhere; }
.tupe-galue-book-card { border-color: #bda04e; background: #fffdf8; }
.tupe-prototype-note {
  margin: 11px 0 0;
  padding: 9px 10px;
  border-left: 3px solid var(--gold);
  background: #fbf6e8;
  color: #625941;
  font-size: .76rem;
  line-height: 1.4;
}
.tupe-galue-prototype { border-color: #bda04e; }
.tupe-galue-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.tupe-galue-actions .outline-wide-button { margin-top: 0; border-radius: 13px; min-height: 54px; }
.tupe-galue-actions button:disabled { opacity: .6; cursor: not-allowed; }
.tupe-galue-preview-summary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 18px;
}
.tupe-galue-preview-summary > div { padding: 12px; border-radius: 12px; background: #faf7ef; }
.tupe-galue-preview-summary span, .tupe-galue-preview-summary strong { display: block; }
.tupe-galue-preview-summary span { color: var(--muted); font-size: .68rem; line-height: 1.3; }
.tupe-galue-preview-summary strong { margin-top: 6px; }
@media (max-width: 360px) {
  .event-book-metrics, .tupe-galue-preview-summary, .tupe-galue-actions { grid-template-columns: 1fr; }
}


/* ‘Api o Tupe Galue workflow forms. */
.tupe-workflow-panel {
  margin-top: 16px;
  padding: 15px;
  border: 1px solid #ddcfa7;
  border-radius: 16px;
  background: #fffefb;
}
.tupe-workflow-panel > label { display: grid; gap: 6px; }
.tupe-form { display: grid; gap: 12px; }
.tupe-form label { display: grid; gap: 6px; }
.tupe-form .primary-button { margin-top: 2px; }
.tupe-subform {
  margin-top: 14px;
  padding: 13px;
  border: 1px solid #e4d9ba;
  border-radius: 13px;
  background: #faf7ef;
}
.tupe-subform h3 {
  margin: 0 0 2px;
  color: #715820;
  font-size: .7rem;
  letter-spacing: .09em;
}
#tupeAdvanceSelect { margin-top: 6px; }
#tupeReconcileAdvanceButton { margin-top: 14px; }
#tupeBackendStatus { margin-top: 10px; }
.tupe-galue-actions { margin-top: 15px; }
.tupe-galue-actions button[aria-current="page"] {
  border-color: #81682e;
  background: #fbf4df;
}

.tupe-item-details {
  margin: 0;
  padding: 12px;
  border: 1px solid #e5d9b7;
  border-radius: 12px;
  background: #faf7ef;
}
.tupe-item-details legend {
  padding: 0 4px;
  color: #715820;
  font-size: .69rem;
  font-weight: 700;
  letter-spacing: .08em;
}
.tupe-form input[type="file"] {
  padding: 9px;
  border: 1px dashed #ccb979;
  border-radius: 10px;
  background: #fffefb;
}

.tupe-report-summary {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:14px 0;
}
.tupe-report-summary > div {
  padding:11px;
  border-radius:12px;
  background:#faf7ef;
}
.tupe-report-summary span,
.tupe-report-summary strong { display:block; }
.tupe-report-summary span { color:var(--muted); font-size:.68rem; line-height:1.3; }
.tupe-report-summary strong { margin-top:5px; }
.tupe-report-section {
  margin-top:16px;
  padding-top:13px;
  border-top:1px solid #e1d4ae;
}
.tupe-report-section h3 {
  margin:0 0 8px;
  color:#715820;
  font-size:.7rem;
  letter-spacing:.08em;
}
.tupe-report-list { display:grid; gap:7px; }
.tupe-report-row {
  display:grid;
  gap:4px;
  padding:10px 11px;
  border-radius:11px;
  background:#faf7ef;
}
.tupe-report-row strong { font-size:.82rem; }
.tupe-report-row span { color:var(--muted); font-size:.72rem; line-height:1.4; }
.tupe-report-sublist {
  margin-top:9px;
  padding:10px 11px;
  border-left:3px solid var(--gold);
  background:#fbf6e8;
}
.tupe-report-sublist p { margin:5px 0 0; font-size:.75rem; }
@media(max-width:360px){
  .tupe-report-summary { grid-template-columns:1fr; }
}

.event-finalisation-panel {
  margin-top: 16px;
}
.book-finalisation-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 0;
  border-top: 1px solid #e1d4ae;
}
.book-finalisation-row:first-of-type {
  border-top: 0;
}
.book-finalisation-row div {
  display: grid;
  gap: 4px;
}
.book-finalisation-row small {
  color: var(--muted);
}
.book-finalisation-row .outline-wide-button {
  width: auto;
  min-width: 190px;
}
#finaliseOverallEventButton {
  margin-top: 14px;
}
#finaliseOverallEventButton:disabled {
  opacity: .5;
  cursor: not-allowed;
}
@media (max-width: 520px) {
  .book-finalisation-row {
    grid-template-columns: 1fr;
  }
  .book-finalisation-row .outline-wide-button {
    width: 100%;
  }
}


/* Branded finalisation safeguard dialog. */
.finalisation-dialog {
  width: min(92vw, 560px);
  max-height: min(88vh, 760px);
  padding: 0;
  border: 0;
  border-radius: 22px;
  background: transparent;
  overflow: visible;
}
.finalisation-dialog::backdrop {
  background: rgba(24, 20, 14, .58);
  backdrop-filter: blur(2px);
}
.finalisation-dialog-card {
  padding: 22px;
  border: 1px solid #cdb66d;
  border-radius: 22px;
  background: #fffdf8;
  box-shadow: 0 24px 60px rgba(32, 27, 18, .28);
}
.finalisation-dialog-card h2 {
  margin: 5px 0 8px;
  font-family: Georgia, serif;
  font-size: 1.45rem;
  line-height: 1.15;
}
.finalisation-dialog-lead {
  margin: 0;
  color: #5f5748;
  line-height: 1.48;
}
.finalisation-dialog-details {
  display: grid;
  gap: 8px;
  margin: 17px 0;
  padding: 13px;
  border-radius: 14px;
  background: #faf6ea;
}
.finalisation-detail-row {
  display: grid;
  grid-template-columns: 14px 1fr;
  gap: 7px;
  align-items: start;
}
.finalisation-detail-row > span {
  color: #8a6c25;
  font-weight: 800;
}
.finalisation-detail-row p {
  margin: 0;
  font-size: .82rem;
  line-height: 1.45;
}
.finalisation-book-states {
  display: grid;
  gap: 7px;
  margin: 0 0 16px;
}
.finalisation-book-state {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 10px 11px;
  border: 1px solid #dfd3af;
  border-radius: 12px;
  background: #fff;
}
.finalisation-book-state strong {
  font-size: .82rem;
}
.finalisation-book-state span {
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .04em;
}
.finalisation-book-state .is-finalised {
  color: #315e3c;
}
.finalisation-book-state .is-open {
  color: #885a1e;
}
.finalisation-understand {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 10px;
  align-items: start;
  margin: 16px 0;
  padding: 12px;
  border: 1px solid #d7c382;
  border-radius: 13px;
  background: #fffaf0;
  font-size: .82rem;
  line-height: 1.42;
}
.finalisation-understand input {
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
  accent-color: #775d22;
}
.finalisation-dialog-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.finalisation-dialog-actions .outline-wide-button {
  margin-top: 0;
}
.danger-finalise-button {
  min-height: 46px;
  padding: 10px 14px;
  border: 1px solid #704036;
  border-radius: 999px;
  background: #6b332a;
  color: #fff;
  font: inherit;
  font-weight: 800;
  letter-spacing: .025em;
  cursor: pointer;
}
.danger-finalise-button:disabled {
  opacity: .4;
  cursor: not-allowed;
}
#finalisationDialogStatus {
  margin: 10px 0 0;
}
@media (max-width: 440px) {
  .finalisation-dialog {
    width: min(94vw, 560px);
  }
  .finalisation-dialog-card {
    padding: 18px;
  }
  .finalisation-dialog-actions {
    grid-template-columns: 1fr;
  }
}


/* Event build -> preview -> activation candidate */
.preview-private-note {
  margin-top: .35rem;
  font-weight: 700;
}
.activation-preview-card {
  margin-top: 1.25rem;
}
.activation-price-grid {
  display: grid;
  gap: .75rem;
  margin: 1rem 0;
}
.activation-price-card {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas:
    "label price"
    "note price";
  gap: .15rem .8rem;
  align-items: center;
  text-align: left;
  padding: 1rem;
  border: 1px solid var(--gold, #b59656);
  border-radius: 18px;
  background: #fff;
  color: inherit;
  font: inherit;
}
.activation-price-card span { grid-area: label; font-weight: 700; }
.activation-price-card strong { grid-area: price; font-size: 1.35rem; }
.activation-price-card small { grid-area: note; opacity: .72; }
.activation-price-card.selected {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}
.preview-empty-notice { opacity: .65; font-style: italic; }
