:root { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #17243a; background: #f4f7fb; --blue: #3568d4; --blue-dark: #2857b8; --ink: #17243a; --muted: #5f6f86; --line: #dce5f1; --surface-soft: #f4f7fb; --surface: #fff; }
* { box-sizing: border-box; }
html { scroll-padding-block: max(1rem, env(safe-area-inset-top)) max(5rem, env(safe-area-inset-bottom)); }
body { margin: 0; min-width: 20rem; min-height: 100vh; min-height: 100dvh; background: linear-gradient(180deg, #eaf1fc 0, #f4f7fb 18rem); }
button, input, select, textarea { font: inherit; }
button { min-height: 2.75rem; cursor: pointer; touch-action: manipulation; }
.shell { width: min(100%, 72rem); margin: 0 auto; padding: max(1rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(5rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left)); }
.topbar { position: relative; z-index: 10; padding: .75rem .25rem 1.15rem; }
.topbar-main { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.topbar-title { min-width: 0; }
.eyebrow { margin: 0 0 .35rem; color: var(--blue-dark); font-size: .78rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.context-title { margin: 0; overflow-wrap: anywhere; font-size: clamp(1.05rem, 5vw, 1.35rem); font-weight: 800; line-height: 1.2; }
.identity { margin: .2rem 0 0; overflow-wrap: anywhere; color: var(--muted); font-size: .88rem; }
.menu-button { flex: 0 0 auto; display: inline-flex; align-items: center; gap: .45rem; }
.menu-button::before { content: ""; width: 1rem; height: .75rem; border-block: 2px solid currentColor; box-shadow: inset 0 -2px 0 transparent; background: linear-gradient(currentColor, currentColor) center / 100% 2px no-repeat; }
.global-nav { display: none; position: absolute; top: calc(100% - .65rem); right: .25rem; width: min(19rem, calc(100vw - 2rem)); padding: .5rem; border: 1px solid var(--line); border-radius: .85rem; background: var(--surface); box-shadow: 0 .8rem 2rem rgba(39,69,122,.16); }
.global-nav[data-open="true"] { display: grid; gap: .25rem; }
.global-nav button { width: 100%; border: 0; border-radius: .65rem; padding: .7rem .8rem; background: transparent; color: var(--ink); text-align: left; font-weight: 720; }
.global-nav button:hover, .global-nav button[aria-current="page"] { background: #eaf1fc; color: var(--blue-dark); }
.global-nav button[aria-current="page"] { box-shadow: inset .2rem 0 0 var(--blue); }
.card { background: rgba(255,255,255,.98); border: 1px solid var(--line); border-radius: 1rem; padding: 1.15rem; box-shadow: 0 .7rem 2rem rgba(39,69,122,.08); }
.capture-card { width: min(100%, 42rem); margin: 0 auto; padding: 0; border: 0; background: transparent; box-shadow: none; }
.capture-heading { margin-bottom: 1rem; }
.capture-title { margin: 0; font-size: clamp(1.55rem, 7vw, 2rem); line-height: 1.15; }
.expense-form { display: grid; gap: 1.35rem; }
.stack { display: grid; gap: 1rem; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
label, legend { display: block; margin-bottom: .4rem; font-weight: 750; }
.expense-form label, .expense-form legend { margin-bottom: .5rem; color: #31435d; font-weight: 680; text-align: left; }
.form-group { min-width: 0; }
input:not([type="radio"]):not([type="checkbox"]), select, textarea { width: 100%; min-height: 3.25rem; border: 1px solid #b9c7da; border-radius: .7rem; padding: .75rem .85rem; background: #fff; color: var(--ink); }
textarea { min-height: 6.5rem; resize: vertical; }
input:not([type="radio"]):not([type="checkbox"]):focus, select:focus, textarea:focus, button:focus-visible, summary:focus-visible { outline: 3px solid rgba(53,104,212,.24); outline-offset: 2px; border-color: var(--blue); }
.amount-wrap { position: relative; }
.amount-wrap input { min-height: 4.25rem; padding-right: 3rem; font-size: clamp(1.7rem, 8vw, 2.25rem); font-weight: 780; letter-spacing: -.02em; }
.currency { position: absolute; right: 1rem; top: 1.1rem; color: #6b7a90; font-size: 1.35rem; }
fieldset { margin: 0; padding: 0; border: 0; }
.category-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 8rem), 1fr)); gap: .45rem; }
.category { position: relative; }
.category input { position: absolute; opacity: 0; pointer-events: none; }
.category span, .category-more { display: flex; align-items: center; justify-content: center; gap: .25rem; min-height: 3.2rem; padding: .4rem .5rem; border: 1px solid #b9c7da; border-radius: .7rem; background: #fff; color: #2b568f; text-align: center; overflow-wrap: normal; word-break: normal; font-size: .8rem; font-weight: 720; }
.category:hover span, .category-more:hover { border-color: #91a7c7; background: #f7f9fc; }
.category input:checked + span { color: var(--blue-dark); background: #eaf1fc; border-color: var(--blue); box-shadow: inset 0 0 0 1px var(--blue); }
.category input:checked + span::before { content: "✓"; flex: 0 0 auto; font-size: .85rem; font-weight: 900; }
.category:hover input:checked + span { background: #dfeafd; }
.category input:focus-visible + span { outline: 3px solid rgba(53,104,212,.25); }
.category-more { width: 100%; border-style: dashed; }
.category-more[aria-expanded="true"], .category-more.is-selected { border-color: var(--blue); background: #eaf1fc; color: var(--blue-dark); }
.category-options-panel { margin-top: .7rem; padding: .75rem; border-radius: .8rem; background: var(--surface-soft); }
details { border: 1px solid var(--line); border-radius: .8rem; padding: .7rem .8rem; }
summary { min-height: 2.75rem; display: flex; align-items: center; color: var(--blue-dark); font-weight: 750; cursor: pointer; }
.more-categories { display: grid; grid-template-columns: repeat(2, 1fr); gap: .5rem; margin-top: .75rem; }
.hint { margin: 0; padding: .8rem; border-radius: .8rem; background: #eef3fb; color: #40536e; font-size: .92rem; }
.primary { width: 100%; min-height: 3.4rem; border: 0; border-radius: .75rem; padding: .8rem 1rem; color: #fff; background: var(--blue); font-weight: 800; }
.compact-primary { width: auto; }
.primary:hover { background: var(--blue-dark); }
.primary:disabled { opacity: .55; cursor: wait; }
.secondary { min-height: 2.75rem; border: 1px solid #a9b8ce; border-radius: .7rem; padding: .6rem .85rem; color: #2b568f; background: #fff; font-weight: 750; }
.danger { min-height: 3rem; border: 1px solid #bd7777; border-radius: .8rem; padding: .65rem 1rem; color: #8a2e2e; background: #fff7f7; font-weight: 750; }
.split-options { display: grid; gap: .55rem; }
.choice { display: flex; align-items: center; gap: .65rem; min-height: 2.8rem; padding: .55rem .7rem; border: 1px solid var(--line); border-radius: .8rem; }
.choice input[type="radio"], .choice input[type="checkbox"] { appearance: auto; accent-color: var(--blue); width: 1.2rem; height: 1.2rem; min-height: 0; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; flex: 0 0 auto; }
.choice input:focus-visible { outline: 3px solid rgba(53,104,212,.32); outline-offset: 3px; }
.choice span { min-width: 0; overflow-wrap: break-word; word-break: normal; hyphens: auto; }
.allocation-panel { display: grid; gap: .65rem; padding: .8rem; border-radius: .8rem; background: var(--surface-soft); }
.allocation-mode { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem; padding: .25rem; border: 1px solid var(--line); border-radius: .75rem; background: #fff; }
.allocation-mode button { min-height: 2.75rem; border: 0; border-radius: .55rem; background: transparent; color: var(--blue-dark); font-weight: 780; }
.allocation-mode button[aria-pressed="true"] { background: #eaf1fc; color: var(--blue-dark); box-shadow: inset 0 0 0 1px var(--blue); }
.individual-share-list { display: grid; gap: .65rem; }
.share-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(8rem, 9rem) minmax(7rem, 8rem); align-items: center; gap: .65rem; }
.share-family { min-width: 0; overflow-wrap: break-word; word-break: normal; hyphens: auto; font-weight: 750; }
.share-value, .share-editable { min-width: 0; }
.share-editable { grid-column: 2; }
.share-amount-output, .share-percentage-output { grid-column: 3; }
.share-input label, .share-counter span { display: block; margin: 0 0 .25rem; color: var(--muted); font-size: .75rem; font-weight: 720; }
.share-input .amount-wrap input { min-height: 3.25rem; padding-right: 2.2rem; font-size: 1rem; letter-spacing: 0; }
.share-input .currency { right: .75rem; top: .82rem; font-size: 1rem; }
.share-counter output { display: block; min-height: 3.25rem; padding: .8rem .65rem; border: 1px solid var(--line); border-radius: .7rem; background: #eef3fb; overflow-wrap: anywhere; font-weight: 750; }
.share-total { margin: 0; padding: .65rem; border-radius: .7rem; background: #fff4ce; color: #6d5700; font-weight: 700; }
.share-total.complete { background: #eaf8f1; color: #155f41; }
.individual-amount-hint { display: grid; gap: .6rem; padding: .8rem; border: 1px solid #dfc56c; border-radius: .75rem; background: #fff9e6; color: #624d00; }
.individual-amount-hint p { margin: 0; font-weight: 700; }
.individual-amount-hint button { justify-self: start; }
.expense-workspace, .expense-core, .advanced-content { display: grid; gap: 1.35rem; min-width: 0; }
.date-field { display: grid; justify-items: start; text-align: left; }
.date-field input { width: min(100%, 18rem); max-width: 18rem; }
.advanced-expense { padding: 0; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; }
.advanced-expense > summary { justify-content: space-between; gap: .75rem; padding: .85rem 0; list-style: none; }
.advanced-expense > summary::-webkit-details-marker { display: none; }
.standard-summary { flex: 1 1 auto; display: grid; justify-items: start; gap: .2rem; min-width: 0; text-align: left; }
.standard-summary strong { color: var(--ink); font-size: .93rem; overflow-wrap: anywhere; }
.standard-summary span { color: #53657e; font-size: .85rem; line-height: 1.35; overflow-wrap: anywhere; }
.adjust-action { flex: 0 0 auto; display: inline-flex; align-items: center; gap: .4rem; color: var(--blue-dark); font-weight: 720; }
.disclosure-indicator { width: .55rem; height: .55rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .15s ease; }
.advanced-expense[open] .disclosure-indicator { transform: rotate(225deg); }
.advanced-content { padding: 1rem 0 0; border-top: 1px solid #edf2f8; }
.advanced-content .split-options { gap: .15rem; }
.advanced-content .choice { min-height: 2.75rem; padding: .4rem .2rem; border-color: transparent; background: transparent; }
.advanced-content .choice:hover { background: #f7f9fc; }
.advanced-content .choice:has(input:checked) { background: #eaf1fc; }
.advanced-content .allocation-panel { padding: .75rem 0 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; }
.comment-group { padding-top: .1rem; }
.comment-group textarea { min-height: 4.5rem; max-height: 14rem; overflow-y: auto; overflow-x: hidden; resize: vertical; }
.expense-submit { margin-top: .1rem; }
.view-heading, .button-row, .metric-head, .expense-topline, .expense-meta, .transfer { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.view-heading { flex-wrap: wrap; margin-bottom: 1rem; }
.view-heading h2, .section-heading { margin: 0; }
.nav-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .5rem; }
.nav-actions .secondary { min-height: 2.75rem; padding: .5rem .7rem; }
.button-row { flex-wrap: wrap; margin-top: 1rem; }
.button-row > * { flex: 1; }
.button-row .primary { flex-basis: 100%; }
.confirmation-summary { display: grid; gap: .35rem; padding: 1rem 0 .25rem; text-align: center; }
.confirmation-summary .expense-reference { font-size: .9rem; }
.confirmation-amount { font-size: clamp(1.7rem, 9vw, 2.4rem); font-weight: 800; letter-spacing: -.025em; }
.confirmation-description { margin: 0; overflow-wrap: anywhere; font-size: 1.05rem; font-weight: 720; }
.confirmation-details { margin-top: 1rem; }
.tertiary-action { width: 100%; margin-top: .75rem; border: 0; background: transparent; color: #8a2e2e; font-weight: 720; }
.dashboard { display: grid; gap: 1rem; }
.final-transfer-plan { display: grid; gap: .8rem; }
.final-transfer-plan h2, .final-transfer-plan p { margin: 0; }
.final-transfer-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.final-transfer-actions button { flex: 1 1 10rem; }
.manual-transfer-copy { display: grid; gap: .75rem; margin-top: .25rem; padding: .9rem; border: 1px solid var(--line); border-radius: .8rem; background: var(--surface-soft); }
.manual-transfer-copy h3, .manual-transfer-copy p { margin: 0; }
.manual-transfer-copy textarea { min-height: 10rem; background: #fff; }
#dashboard-detail-level { display: grid; gap: 1rem; }
.overview-depth-control { display: flex; justify-content: center; }
.overview-depth-control button { width: min(100%, 24rem); }
.metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: .55rem; }
.metric { min-width: 0; padding: .8rem; border: 1px solid var(--line); border-radius: .9rem; background: #f8fafd; }
.metric span { display: block; min-height: 2.2em; color: #65756e; font-size: .78rem; }
.metric strong { display: block; overflow-wrap: anywhere; font-size: clamp(.9rem, 4vw, 1.15rem); }
.metric.balance.positive strong { color: #236449; }
.metric.balance.negative strong { color: #a33a3a; }
.total-line { margin: 1rem 0 0; padding-top: .8rem; border-top: 1px solid #e1e9e5; }
.family-list, .expense-list, .transfer-list { display: grid; gap: .65rem; margin-top: .8rem; }
.family-card, .expense-card, .transfer { padding: .85rem; border: 1px solid var(--line); border-radius: .9rem; background: #fff; }
.family-card .metrics { margin-top: .7rem; }
.expense-card.cancelled { opacity: .72; background: #f4f4f4; }
.expense-topline strong:first-child { min-width: 0; overflow-wrap: anywhere; }
.expense-topline > div { min-width: 0; overflow-wrap: anywhere; }
.expense-topline > strong { flex: 0 0 auto; }
.expense-meta { justify-content: flex-start; flex-wrap: wrap; margin-top: .35rem; color: #65756e; font-size: .82rem; }
.status { padding: .15rem .45rem; border-radius: 999px; background: #eaf1fc; color: #2857b8; font-size: .72rem; font-weight: 800; }
.expense-reference { color: var(--blue-dark); font-size: .78rem; font-weight: 800; letter-spacing: .03em; white-space: nowrap; }
.status.cancelled { color: #6d5757; background: #ece5e5; }
.expense-card details { margin-top: .7rem; }
.expense-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .75rem; }
.expense-actions button { flex: 1; }
.detail-area { display: grid; gap: 1rem; }
.transfer span { color: #52635c; }
.empty { padding: 1rem; border-radius: .8rem; background: #eef3fb; color: var(--muted); text-align: center; }
.dashboard-error { border-color: #e8bcbc; }
.message { padding: 1rem; border-radius: .8rem; }
.message h2 { margin: 0; font-size: 1.1rem; }
.message.error { color: #842c2c; background: #fff0f0; }
.message.success { color: #155f41; background: #eaf8f1; }
.admin-list, .finding-list { display: grid; gap: .75rem; }
.admin-card { padding: .8rem; }
.admin-shell { display: grid; gap: 1rem; }
.admin-section-picker { display: grid; gap: .35rem; }
.admin-section-picker label { margin: 0; }
.admin-sidebar { display: none; }
.admin-workspace { min-width: 0; }
.admin-source-error { display: grid; gap: .75rem; margin-bottom: 1rem; }
.admin-source-error p { margin: 0; }
.trip-picker { display: grid; gap: .35rem; margin-bottom: 1rem; }
.trip-desktop-layout { display: grid; gap: 1rem; }
.trip-list { display: none; align-content: start; gap: .4rem; }
.trip-list button { width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: .75rem; padding: .7rem; background: #fff; color: var(--ink); text-align: left; }
.trip-list button[aria-current="true"] { border-color: var(--blue); box-shadow: inset .2rem 0 0 var(--blue); background: #eef4ff; }
.trip-list strong, .trip-list span { display: block; overflow-wrap: anywhere; }
.trip-list span { margin-top: .2rem; color: var(--muted); font-size: .8rem; }
.trip-detail { display: grid; gap: 1rem; min-width: 0; }
.trip-next-action { display: grid; gap: .7rem; padding: 1rem; border-radius: .85rem; background: #eef4ff; }
.trip-next-action p { margin: 0; }
.local-section { display: grid; gap: .75rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.local-section-heading { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.local-section-heading h3 { margin: 0; }
.family-group { display: grid; gap: .65rem; padding: 1rem 0; border-top: 1px solid var(--line); }
.family-group:first-child { border-top: 0; padding-top: 0; }
.family-group-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.family-group-heading h3, .family-group-heading p { margin: 0; }
.person-list { display: grid; gap: .55rem; }
.person-card { padding: 0; background: #fff; }
.person-card > summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .35rem .7rem; padding: .75rem; list-style: none; }
.person-card > summary::-webkit-details-marker { display: none; }
.person-summary-main { min-width: 0; }
.person-summary-main strong, .person-summary-main span { display: block; overflow-wrap: anywhere; }
.person-summary-main span { margin-top: .15rem; color: var(--muted); font-size: .82rem; }
.person-details { display: grid; gap: .75rem; padding: 0 .75rem .75rem; border-top: 1px solid var(--line); }
.person-details .master-meta { margin-bottom: 0; }
.system-overview { margin-bottom: 1rem; }
.system-source { display: grid; gap: .65rem; padding: 1rem 0; border-top: 1px solid var(--line); }
.system-source h3, .system-source p { margin: 0; }
.status.unknown { color: #6d5700; background: #fff7da; }
.status.error { color: #842c2c; background: #fff0f0; }
.status.warning { color: #6d5700; background: #fff7da; }
.status.ok { color: #155f41; background: #eaf8f1; }
.master-card { padding: 1rem; border: 1px solid var(--line); border-radius: .9rem; background: #fff; }
.master-card h3 { margin: 0; overflow-wrap: anywhere; }
.master-meta { display: flex; flex-wrap: wrap; gap: .35rem .7rem; margin: .45rem 0; color: #65756e; font-size: .84rem; }
.master-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .8rem; }
.master-actions button { flex: 1; }
.category-language-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); gap: .8rem; }
.category-language { min-width: 0; padding: .85rem; border: 1px solid var(--line); border-radius: .8rem; background: var(--surface-soft); }
.category-language legend { padding: 0 .25rem; }
.category-language-fields { display: grid; gap: .75rem; }
.category-completeness { display: inline-flex; align-items: center; width: fit-content; margin-top: .3rem; padding: .25rem .55rem; border-radius: 999px; background: #fff7da; color: #6d5700; font-size: .8rem; font-weight: 800; }
.category-completeness.complete { background: #eaf8f1; color: #155f41; }
.suggestion-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; }
.suggestion-actions button { flex: 0 1 auto; }
.suggestion-note { margin: 0; color: var(--muted); font-size: .86rem; }
.toggle { display: flex; align-items: flex-start; gap: .65rem; padding: .7rem; border: 1px solid var(--line); border-radius: .8rem; }
.toggle input { width: 1.25rem; min-height: 1.25rem; margin: .1rem 0 0; flex: 0 0 auto; }
.toggle span { font-weight: 700; }
.warning-inline { margin: .55rem 0 0; color: #775c00; font-size: .86rem; font-weight: 700; }
.one-time-link { width: 100%; min-height: 7rem; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .78rem; overflow-wrap: anywhere; }
.qr-box { width: min(100%, 20rem); margin: 1rem auto; padding: .75rem; border: 1px solid var(--line); border-radius: 1rem; background: #fff; }
.qr-box svg { display: block; width: 100%; height: auto; }
.trip-card { padding: 1rem; border: 1px solid var(--line); border-radius: .9rem; background: #fff; }
.trip-card h3 { margin: 0; overflow-wrap: anywhere; }
.trip-period { margin: .45rem 0; color: #385348; font-weight: 700; }
.technical-id { margin: 0; color: #73827c; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .75rem; overflow-wrap: anywhere; }
.trip-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; margin-top: .9rem; }
.trip-actions button { width: 100%; }
.status.draft { color: #725800; background: #fff3c4; }
.draft-restored-notice { position: fixed; z-index: 30; right: max(1rem, env(safe-area-inset-right)); bottom: max(1rem, env(safe-area-inset-bottom)); width: min(calc(100% - 2rem), 24rem); margin: 0; box-shadow: 0 .65rem 1.8rem rgba(39,69,122,.16); }
.status.active { color: #155f41; background: #eaf8f1; }
.status.finalized, .status.archived { color: #4c5967; background: #e9edf1; }
.finding { padding: .85rem; border-left: .3rem solid; border-radius: .75rem; }
.finding strong { display: block; margin-bottom: .2rem; }
.finding > span { display: block; }
.finding.error { color: #842c2c; background: #fff0f0; border-color: #b94343; }
.finding.warning { color: #6d5700; background: #fff7da; border-color: #d0a500; }
.finding.ok { color: #155f41; background: #eaf8f1; border-color: #258960; }
.trip-checklist { display: grid; gap: 1rem; }
.checklist-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .55rem; }
.checklist-summary > div { min-width: 0; padding: .75rem; border: 1px solid var(--line); border-radius: .75rem; background: #f8fafd; }
.checklist-summary strong, .checklist-summary span { display: block; overflow-wrap: anywhere; }
.checklist-summary strong { font-size: 1.1rem; }
.checklist-summary span { margin-top: .15rem; color: var(--muted); font-size: .78rem; }
.checklist-group { display: grid; gap: .65rem; }
.checklist-group h4 { margin: 0; }
.checklist-item { display: grid; gap: .55rem; }
.checklist-item strong, .checklist-item span { margin: 0; }
.checklist-item .secondary { justify-self: start; }
.checklist-completed { padding: .2rem .8rem; background: #f8fafd; }
.checklist-completed > summary { justify-content: space-between; gap: .75rem; }
.checklist-completed-list { display: grid; gap: .55rem; padding: .35rem 0 .65rem; }
.checklist-diagnostics { background: #f8fafd; }
.trip-start-reason { margin: 0; color: var(--muted); font-weight: 700; }
.trip-start-dialog { display: grid; gap: 1rem; }
.trip-start-dialog h2, .trip-start-dialog p { margin-top: 0; }
.confirmation { display: flex; align-items: flex-start; gap: .7rem; padding: .9rem; border: 1px solid #d8bd5b; border-radius: .8rem; background: #fff9e6; }
.confirmation input { width: 1.25rem; min-height: 1.25rem; margin: .15rem 0 0; flex: 0 0 auto; }
.confirmation span { font-weight: 700; }
.recovery-panel { display: grid; gap: .75rem; margin-top: 1rem; padding: 1rem; border: 1px solid #d8bd5b; border-radius: .9rem; background: #fff9e6; }
.recovery-panel h3, .recovery-panel p { margin: 0; }
.summary { display: grid; grid-template-columns: auto 1fr; gap: .6rem 1rem; margin: 1rem 0; }
.summary dt { color: #65756e; }
.summary dt, .summary dd { min-width: 0; overflow-wrap: anywhere; }
.summary dd { margin: 0; text-align: right; font-weight: 720; }
.shares { list-style: none; margin: 0; padding: 0; border-top: 1px solid #e1e9e5; }
.shares li { display: flex; justify-content: space-between; gap: 1rem; padding: .65rem 0; border-bottom: 1px solid #e1e9e5; }
.muted { color: var(--muted); }
.loading { padding: 3rem 1rem; text-align: center; color: var(--muted); }
[hidden] { display: none !important; }
.shell[data-view="form"] .topbar { padding-bottom: .65rem; }
.shell[data-view="form"] .topbar-title > .eyebrow { display: none; }
.shell[data-view="form"] .global-nav [data-nav="form"] { display: none; }
@media (max-width: 30rem) { .shell { padding-left: .75rem; padding-right: .75rem; } .topbar { padding-left: .25rem; } .view-heading { align-items: flex-start; } .nav-actions { justify-content: flex-start; } .trip-actions { grid-template-columns: 1fr; } .category-grid { gap: .35rem; } .category span, .category-more { font-size: .78rem; } .metrics, .checklist-summary { grid-template-columns: 1fr; } .metric span { min-height: 0; } .share-row { grid-template-columns: 1fr; gap: .35rem; padding-block: .2rem .55rem; border-bottom: 1px solid var(--line); } .share-row:last-child { border-bottom: 0; } .share-family, .share-editable, .share-amount-output, .share-percentage-output { grid-column: auto; } .share-counter output { min-height: auto; padding: .45rem 0 0; border: 0; border-radius: 0; background: transparent; } .share-counter span { display: inline; margin-right: .25rem; } .button-row { align-items: stretch; } }
@media (min-width: 48rem) { .shell { padding-top: 1.5rem; } .topbar { display: grid; grid-template-columns: minmax(15rem, .75fr) minmax(0, 1.25fr); align-items: end; gap: 1.5rem; padding-bottom: 1.5rem; } .menu-button { display: none; } .global-nav, .global-nav[data-open="true"] { position: static; display: flex; justify-content: flex-end; width: auto; padding: 0; border: 0; background: transparent; box-shadow: none; } .global-nav button { width: auto; padding: .65rem .8rem; text-align: center; } .global-nav button[aria-current="page"] { box-shadow: inset 0 -.2rem 0 var(--blue); } .shell[data-view="form"] .global-nav [data-nav="form"] { display: block; } .shell[data-view="form"] .topbar { padding-bottom: .85rem; } .card { padding: 1.5rem; } .capture-card { padding: 1.75rem; border: 1px solid var(--line); background: rgba(255,255,255,.98); box-shadow: 0 .7rem 2rem rgba(39,69,122,.08); } .dashboard { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; } .dashboard > .card:first-child, #dashboard-detail-level, .overview-depth-control, .detail-area { grid-column: 1 / -1; } .detail-area { grid-template-columns: repeat(2, minmax(0, 1fr)); } .button-row .primary { flex-basis: auto; } .admin-card { padding: 1rem; } .admin-shell { grid-template-columns: 12rem minmax(0, 1fr); gap: 1.5rem; } .admin-section-picker { display: none; } .admin-sidebar { display: grid; align-content: start; gap: .2rem; padding-right: 1rem; border-right: 1px solid var(--line); } .admin-sidebar button { width: 100%; border: 0; border-radius: .65rem; padding: .65rem .75rem; background: transparent; color: var(--ink); text-align: left; font-weight: 720; } .admin-sidebar button:hover, .admin-sidebar button[aria-current="page"] { background: #eaf1fc; color: var(--blue-dark); } .admin-sidebar button[aria-current="page"] { box-shadow: inset .2rem 0 0 var(--blue); } .trip-picker { display: none; } .trip-desktop-layout { grid-template-columns: minmax(12rem, .65fr) minmax(0, 1.6fr); align-items: start; } .trip-list { display: grid; position: sticky; top: 1rem; } .person-card > summary { grid-template-columns: minmax(10rem, 1fr) minmax(8rem, .55fr) auto; } .person-summary-main { display: contents; } .person-summary-main span { margin: 0; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; } }