/* One app column, including on wide desktop windows. */
/* Quick recording and consumption promises use the account theme throughout. */
html:root body .quick-entry-modes { display:flex; gap:6px; margin-bottom:8px; }
html:root body .quick-entry-modes button { flex:1; min-height:40px; border:1px solid var(--theme-line,#d4dedb); border-radius:10px; background:var(--theme-panel,#fff); color:var(--theme-muted,#66756c); font:inherit; font-size:13px; cursor:pointer; }
html:root body .quick-entry-modes button[aria-pressed=true] { background:var(--theme-accent-soft,#e8faf5); border-color:var(--theme-accent,#23766a); color:var(--theme-accent,#23766a); font-weight:700; }
html:root body .quick-expense-form label[hidden], html:root body .quick-expense-dialog [hidden] { display:none !important; }
html:root body [data-no-spend-help] { padding:14px; border-radius:12px; background:var(--theme-accent-soft,#e8faf5); color:var(--theme-ink,#293c33); font-size:14px; line-height:1.6; }
html:root[data-theme] body .goals-card { padding:16px; border:1px solid var(--theme-line,#d4dedb); border-radius:16px; background:var(--theme-panel,#fff); color:var(--theme-ink,#293c33); gap:10px; }
html:root[data-theme] body .goals-card.is-updated { border-color:var(--theme-accent,#23766a); }
.goals-promise { display:flex; align-items:center; flex-wrap:wrap; gap:5px; font-size:12px; color:var(--theme-muted,#66756c); }
.goals-promise b { color:var(--theme-ink,#293c33); font-weight:650; }
.goals-promise small { margin-left:auto; color:var(--theme-accent,#23766a); font-size:10px; }
html:root[data-theme] body .goals-card-numbers { margin:0; justify-content:space-between; gap:8px; }
html:root[data-theme] body .goals-card-numbers strong { font-size:19px; color:var(--theme-accent,#23766a); }
html:root[data-theme] body .goals-card-numbers strong small { font-size:11px; font-weight:400; }
html:root[data-theme] body .goals-card-numbers em { margin:0; font-size:12px; color:var(--theme-muted,#66756c); }
html:root[data-theme] body .goals-progress-native { height:8px; margin:0; background:var(--theme-raised,#e4eeea); }
html:root[data-theme] body .goals-progress-native::-webkit-progress-bar { border-radius:999px; background:var(--theme-raised,#e4eeea); }
html:root[data-theme] body .goals-progress-native::-webkit-progress-value { border-radius:999px; background:var(--theme-accent,#23766a); }
html:root[data-theme] body .goals-progress-native::-moz-progress-bar { border-radius:999px; background:var(--theme-accent,#23766a); }
html:root[data-theme] body .goals-progress-native.is-over::-webkit-progress-value { background:var(--theme-danger,#a34444); }
html:root[data-theme] body .goals-progress-native.is-over::-moz-progress-bar { background:var(--theme-danger,#a34444); }
html:root[data-theme] body .goals-card.is-over :is(.goals-card-numbers strong,.goals-card-numbers em) { color:var(--theme-danger,#a34444); }
.goals-history-note { display:block; margin:14px 0 0; font-size:10px; line-height:1.5; color:var(--theme-muted,#66756c); }
.goals-history-toolbar { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:14px; }
#goals-month-label[hidden] { display:none !important; }
html:root[data-theme] body .goals-history-month-select { flex:1; min-width:0; max-width:160px; margin:0; }
html:root[data-theme] body .goals-history-month-select select { box-sizing:border-box; width:100%; min-height:38px; padding:8px 12px; border:1px solid var(--theme-line,#d4dedb); border-radius:10px; color:var(--theme-ink,#293c33); background:var(--theme-panel,#fff); font:inherit; font-size:13px; }
html:root[data-theme] body .goals-history-summary { flex:none; justify-content:flex-end; gap:12px; margin:0; padding:0; border:0; background:transparent; font-size:11px; font-weight:400; white-space:nowrap; }
html:root[data-theme] body .goals-history-summary strong { margin-right:2px; font-size:16px; color:var(--theme-accent,#23766a); }
html:root[data-theme] body .goals-history-summary .is-over strong { color:var(--theme-danger,#a34444); }
html:root[data-theme] body .goals-card-progress-copy { color:var(--theme-muted,#66756c); font-size:11px; }
html:root[data-theme] body .goal-detail-summary { display:block; padding:0; background:transparent; border:0; }
.goal-share-card { padding:18px; border:1px solid var(--theme-line,#d4dedb); border-radius:16px; background:var(--theme-panel,#fff); color:var(--theme-ink,#293c33); }
.goal-share-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; }
html:root[data-theme] body .goal-share-card .goal-share-period { margin:0; font-size:12px; color:var(--theme-muted,#66756c); }
html:root[data-theme] body .goal-share-card .goal-share-status { padding:4px 8px; border-radius:999px; background:var(--theme-accent-soft,#e8faf5); color:var(--theme-accent,#23766a); font-size:11px; white-space:nowrap; }
html:root[data-theme] body .goal-share-card .goal-share-promise { margin:12px 0 18px; color:var(--theme-ink,#293c33); font-size:14px; font-weight:600; }
.goal-share-metrics { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:18px; }
.goal-share-metrics > div { min-width:0; display:grid; gap:8px; padding:14px 12px; border-radius:12px; background:var(--theme-raised,#f2f6f4); }
html:root[data-theme] body .goal-share-metrics span { font-size:11px; color:var(--theme-muted,#66756c); }
html:root[data-theme] body .goal-share-metrics strong { font-size:25px; line-height:1.3; overflow-wrap:anywhere; color:var(--theme-accent,#23766a); font-variant-numeric:tabular-nums; }
html:root[data-theme] body .goal-share-card.is-over :is(.is-over,.goal-share-status) { color:var(--theme-danger,#a34444); }
.goal-share-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:14px; }
html:root[data-theme] body .goal-share-card .goal-share-conclusion { flex:1; min-width:0; margin:0; font-size:12px; line-height:1.6; overflow-wrap:anywhere; color:var(--theme-muted,#66756c); }
.goal-share-mascot { display:block; flex:0 0 48px; width:48px; height:48px; object-fit:contain; }
.goal-share-actions { display:flex; flex-direction:column; gap:7px; margin:0; }
html:root body .goal-share-help { margin:0; color:var(--theme-muted,#66756c); font-size:11px; line-height:1.5; text-align:center; }
html:root body .goal-share-actions button { display:flex; align-items:center; justify-content:center; gap:7px; width:100%; min-height:40px; padding:10px; border:1px solid var(--theme-line,#d4dedb); border-radius:10px; background:var(--theme-panel,#fff); color:var(--theme-accent,#23766a); font:inherit; font-size:12px; cursor:pointer; }
html:root body #goal-detail-delete { border:1px solid var(--theme-line,#d4dedb); background:var(--theme-panel,#fff); color:var(--theme-danger,#a34444); }
html:root body #goal-detail-delete:hover:not(:disabled) { border-color:var(--theme-danger,#a34444); background:var(--theme-danger-soft,#fff0f0); }
html:root body #goal-detail-delete:focus-visible { outline:2px solid var(--theme-danger,#a34444); outline-offset:2px; }
html:root body #goal-detail-dialog .category-settings-dialog-header { padding:16px 18px; gap:12px; }
html:root body #goal-detail-title { font-size:20px; line-height:1.4; overflow-wrap:anywhere; }
html:root body #goal-detail-dialog .eyebrow { font-size:11px; letter-spacing:0; color:var(--theme-muted,#66756c); }
html:root body .goal-detail-scroll { gap:14px; }
/* Keep one scroll owner inside these bounded dialogs, including mobile Safari. */
html:root body :is(#recurring-transfers-dialog,#goal-detail-dialog,.family-character-picker) { box-sizing:border-box; max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); overflow:hidden; }
html:root body :is(#recurring-transfers-dialog,#goal-detail-dialog,.family-character-picker) > .category-settings-dialog-shell { max-height:calc(100dvh - 28px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); min-height:0; overflow:hidden; }
html:root body :is(#recurring-transfers-dialog,#goal-detail-dialog,.family-character-picker) .category-settings-dialog-scroll { flex:1 1 auto; min-height:0; overflow-y:auto; overflow-x:hidden; }
.app-bottom-nav-icon img[data-theme-ledger-icon] { display:block; width:24px; height:24px; object-fit:contain; }
/* The carousel's page controls occupy its existing caption line. */
html:root body.app-shell-page .recording-panel { position:relative; }
html:root body.app-shell-page .recording-pages { position:absolute; right:10px; bottom:9px; z-index:1; justify-content:flex-end; width:auto; max-width:72px; height:16px; margin:0; gap:2px; overflow-x:auto; scrollbar-width:none; }
html:root body.app-shell-page .recording-pages button { flex:0 0 14px; width:14px; }
html:root body.app-shell-page .recording-card .recording-caption { box-sizing:border-box; padding-right:74px; }
html:root body.app-shell-page .recording-card .recording-caption > span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.recording-budget-link { display:block; color:inherit; text-decoration:none; }
.recording-budget-numbers { display:grid; grid-template-columns:1fr 1fr; align-items:center; }
.recording-budget-numbers > div { display:grid; min-width:0; gap:3px; }
.recording-budget-numbers span { color:var(--theme-muted,#66756d); font-size:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.recording-budget-numbers strong { font-size:16px; line-height:1.4; font-variant-numeric:tabular-nums; white-space:nowrap; }
.recording-budget-card { --budget-usage-color:color-mix(in srgb,var(--theme-accent,#23766a) calc(100% - var(--budget-warning-mix,0%)),var(--theme-danger,#a34435) var(--budget-warning-mix,0%)); }
html:root body.app-shell-page .recording-budget-card :is(#recording-budget-spent,#recording-budget-pace,#recording-budget-copy) { color:var(--budget-usage-color,var(--theme-accent,#23766a)); }
.recording-budget-card .recording-event-meter::-webkit-progress-value { background:var(--budget-usage-color,var(--theme-accent,#23766a)); }
.recording-budget-card .recording-event-meter::-moz-progress-bar { background:var(--budget-usage-color,var(--theme-accent,#23766a)); }
.recording-budget-card .recording-event-meter { margin:5px 0; }
html:root body.assets-page-body .assets-type-tabs > button { min-height:36px; padding:6px 1px; font-size:14px; }
/* Use a geometric mark so its center does not depend on the font baseline. */
html:root body.assets-page-body .asset-refresh-indicator { display:flex; align-items:center; justify-content:center; box-sizing:content-box; padding:0; font-size:0; line-height:0; }
html:root body.assets-page-body .asset-refresh-indicator[hidden] { display:none; }
html:root body.assets-page-body .asset-refresh-indicator::before { content:''; width:3px; height:9px; background:currentColor; clip-path:polygon(0 0,100% 0,100% 64%,0 64%,0 82%,100% 82%,100% 100%,0 100%); }
/* Keep the title, view switch and settings on one compact header line. */
html:root body.app-shell-page .app-header { gap:4px; }
html:root body.app-shell-page .app-logo { flex:0 0 28px; width:28px; height:32px; margin-right:0; }
html:root body.app-shell-page .app-logo img { width:28px; height:28px; }
html:root body.app-shell-page .app-header-heading h1 { font-size:19px; gap:0; white-space:nowrap; }
html:root body.app-shell-page .app-header :is(.app-page-settings,.app-mobile-settings) { flex:0 0 36px; width:36px; min-width:36px; height:40px; padding:8px; margin:0; }
html:root body.app-shell-page .app-header .records-view-toggle { display:flex; flex:0 0 auto; gap:2px; margin:0 2px 0 auto; padding:3px; border:1px solid var(--theme-line,#dce6df); border-radius:10px; background:var(--theme-raised,#f0f5f2); }
html:root body.app-shell-page .app-header .records-view-toggle button { display:flex; align-items:center; justify-content:center; gap:3px; width:auto; min-width:46px; min-height:32px; padding:4px 6px; border:0; border-radius:7px; font-size:11px; line-height:1.2; color:var(--theme-muted,#66756d); background:transparent; }
html:root body.app-shell-page .app-header .records-view-toggle button[aria-pressed="true"] { color:var(--theme-accent,#23766a); background:var(--theme-panel,#fff); }
html:root body.app-shell-page .app-header .records-view-toggle button > span:first-child { width:14px; height:14px; }
@container kkaebu (max-width:360px) {
  html:root body.app-shell-page .app-header { gap:2px; }
  html:root body.app-shell-page .app-header-heading h1 { font-size:17px; }
  html:root body.app-shell-page .app-header :is(.app-page-settings,.app-mobile-settings) { flex-basis:32px; width:32px; min-width:32px; padding:6px; }
  html:root body.app-shell-page .app-header .records-view-toggle button { min-width:42px; padding-inline:4px; }
}
/* Both views share the same date and totals panel. */
html:root body.app-shell-page .records-period-panel { position:relative; isolation:isolate; margin:0 0 8px; border:1px solid var(--theme-line,#d4dedb); border-radius:12px; background:var(--theme-raised,#f3f6fa); box-shadow:none; filter:none; -webkit-backdrop-filter:none; backdrop-filter:none; }
html:root body.app-shell-page #records-list { border:0; background:var(--theme-panel,#fff); box-shadow:none; overflow:visible; }
html:root body.app-shell-page .records-calendar { overflow:visible; border:0; border-radius:0; background:transparent; box-shadow:none; }
html:root body.app-shell-page.records-calendar-active .records-calendar { padding:0 0 12px; }
html:root body.app-shell-page .records-period-panel .records-period-controls { display:flex; align-items:center; justify-content:space-between; min-height:36px; padding:8px 12px 4px; margin:0; border:0; border-radius:12px 12px 0 0; background:transparent; }
html:root body.app-shell-page .records-period-panel .records-calendar-month-navigation { width:100%; justify-content:space-between; }
html:root body.app-shell-page .records-period-panel .records-calendar-month-navigation > button { width:32px; min-width:32px; height:36px; min-height:36px; padding:0; font-size:22px; }
html:root body.app-shell-page .records-period-panel .records-calendar-month-navigation strong { box-sizing:border-box; height:36px; display:flex; align-items:center; justify-content:center; padding:0 14px; border:1px solid var(--theme-line,#d4dedb); border-radius:8px; background:var(--theme-accent-soft,#e8faf5); color:var(--theme-accent,#15584f); font-size:12px; font-weight:650; }
html:root body.app-shell-page .records-period-panel .records-period-summary { display:flex; flex-wrap:nowrap; justify-content:space-around; min-height:34px; padding:9px 8px 13px; margin:0; border:0; border-radius:0 0 12px 12px; background:transparent; }
html:root body.app-shell-page .records-period-panel .records-period-summary .records-calendar-summary-item { display:flex; flex:1; flex-direction:column; align-items:center; gap:3px; padding:2px 4px; }
html:root body.app-shell-page .records-period-panel .records-period-summary small { font-size:10px; line-height:1.4; }
html:root body.app-shell-page .records-period-panel .records-period-summary strong { font-size:12px; line-height:1.4; white-space:nowrap; overflow-wrap:normal; }
/* Focus belongs to the themed search shell, including dark and seasonal themes. */
html:root body.app-shell-page .records-list-controls > .records-search-panel { border:1px solid var(--theme-line,#d4dedb); background:var(--theme-panel,#fff); color:var(--theme-ink,#293c33); }
html:root body.app-shell-page .records-list-controls > .records-search-panel:focus-within { border-color:var(--theme-accent,#28765e); box-shadow:0 0 0 2px var(--theme-accent-soft,#e8faf5); }
html:root body.app-shell-page .records-search-panel input:is(:focus,:focus-visible) { outline:0 !important; box-shadow:none !important; border:0 !important; background:transparent !important; }
html:root body.app-shell-page .category-view-dialog .records-kind-tabs { display:flex; margin:4px 0 16px; }
html:root body.app-shell-page .category-view-dialog .records-kind-tabs button { flex:1; }
.records-filter-selects { display:grid; gap:12px; }
.records-filter-selects label { display:grid; gap:6px; color:var(--theme-muted,#718178); font-size:12px; }
html:root body.app-shell-page .records-filter-selects select { appearance:auto; box-sizing:border-box; width:100%; min-height:42px; padding:8px 10px; border:1px solid var(--theme-line,#dfe7e1); border-radius:10px; background:var(--theme-panel,#fff); color:var(--theme-ink,#293c33); font:inherit; font-size:14px; }
.records-filter-clear { display:block; margin:14px 0; padding:8px 0; border:0; color:var(--theme-muted,#718178); background:transparent; font-size:12px; text-decoration:underline; cursor:pointer; }
html:root body.app-shell-page .category-view-dialog #records-category-filter-clear { padding:8px 10px; border:0; border-radius:8px; background:transparent; color:var(--theme-accent,#28765e); box-shadow:none; }
html:root body.app-shell-page .category-view-dialog #records-category-filter-clear:is(:hover,:active) { background:var(--theme-accent-soft,#e8faf5); }
html:root body.app-shell-page .category-view-dialog #records-category-filter-clear:focus-visible { outline:2px solid var(--theme-accent,#28765e); outline-offset:2px; }
/* Category and subcategory occupy separate rows; each menu supports multiple checks. */
html:root body.app-shell-page #records-category-options { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; }
.records-filter-dropdown-field { display:grid; gap:6px; min-width:0; }
.records-filter-dropdown-field > span { color:var(--theme-muted,#718178); font-size:12px; }
.records-filter-dropdown { min-width:0; }
html:root body.app-shell-page .records-filter-dropdown > summary { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:44px; box-sizing:border-box; padding:10px 12px; border:1px solid var(--theme-line,#dfe7e1); border-radius:10px; background:var(--theme-panel,#fff); color:var(--theme-ink,#293c33); font-size:14px; line-height:1.5; cursor:pointer; list-style:none; }
.records-filter-dropdown > summary::-webkit-details-marker { display:none; }
.records-filter-dropdown > summary > span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.records-filter-dropdown > summary::after { content:''; flex:none; width:6px; height:6px; margin-right:2px; border:solid var(--theme-muted,#718178); border-width:0 1.5px 1.5px 0; transform:translateY(-2px) rotate(45deg); }
.records-filter-dropdown[open] > summary::after { transform:translateY(2px) rotate(225deg); }
html:root body.app-shell-page .records-filter-dropdown > summary:focus-visible { outline:2px solid var(--theme-accent,#28765e); outline-offset:2px; }
.records-filter-menu { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2px 8px; max-height:240px; overflow:auto; margin-top:6px; padding:8px; border:1px solid var(--theme-line,#dfe7e1); border-radius:10px; background:var(--theme-panel,#fff); }
html:root body.app-shell-page .records-filter-menu .records-filter-choice { display:flex; align-items:center; gap:8px; min-width:0; min-height:42px; margin:0; padding:6px; box-sizing:border-box; color:var(--theme-ink,#293c33); font-size:12px; line-height:1.5; cursor:pointer; overflow-wrap:anywhere; }
.records-filter-choice.is-all { font-weight:650; }
.records-filter-choice > span { min-width:0; }
html:root body.app-shell-page .records-filter-menu input:indeterminate { background:var(--theme-accent,#28765e) !important; border-color:var(--theme-accent,#28765e) !important; }
html:root body.app-shell-page .records-filter-menu input:indeterminate::after { content:''; width:9px; height:2px; margin:0; border:0; background:var(--theme-accent-ink,#fff); transform:none; }
html:root body.app-shell-page .records-filter-menu .records-filter-uncheck { justify-self:end; align-self:center; min-height:36px; padding:6px; border:0; background:transparent; color:var(--theme-muted,#718178); font:inherit; font-size:11px; cursor:pointer; }
.records-filter-uncheck:disabled { opacity:.5; cursor:default; }
.records-filter-empty { grid-column:1 / -1; margin:4px 6px 8px; color:var(--theme-muted,#718178); font-size:12px; line-height:1.6; }
/* Selecting a record never paints the row or adds a focus frame. */
html:root body.app-shell-page .records-row,
html:root body.app-shell-page .records-row:is(:hover,:active,:focus,:focus-visible,:focus-within),
html:root body.app-shell-page .records-row:is(:hover,:active,:focus,:focus-visible,:focus-within) > td,
html:root body.app-shell-page .records-calendar-day-item,
html:root body.app-shell-page .records-calendar-day-item:is(:hover,:active,:focus,:focus-visible,:focus-within) { outline:none !important; box-shadow:none !important; background-color:transparent !important; -webkit-tap-highlight-color:transparent; }
html:root body.app-shell-page .records-calendar-day-item { border:0 !important; }
html:root body.app-shell-page .records-calendar-day:is(:hover,:active,:focus,:focus-visible,.is-selected) { background:transparent !important; border-color:transparent !important; outline:none !important; box-shadow:none !important; -webkit-tap-highlight-color:transparent; }
html:root body.app-shell-page .records-calendar-day:is(:hover,:active,:focus,:focus-visible,.is-selected) .records-calendar-day-number { background:transparent !important; color:inherit !important; outline:none !important; box-shadow:none !important; }
html:root body.app-shell-page .records-calendar-day.is-today .records-calendar-day-number { color:var(--theme-accent,#28765e) !important; }
.records-saved-views { border-top:1px solid var(--theme-line,#dfe7e1); padding-top:12px; margin-top:8px; }
.records-saved-views summary { padding:4px 0; color:var(--theme-muted,#718178); font-size:12px; cursor:pointer; }
.records-saved-views .kb-view-tabs { margin-top:10px; }
html:root body.assets-page-body .connections-asset-list .asset-account-row { min-height:76px; padding:10px 12px; }
html:root body.assets-page-body .asset-account-row .settings-menu-copy { gap:2px; }
html:root body.assets-page-body .assets-total { font-size:24px; }
html:root body.assets-page-body .assets-total-row { display:flex; align-items:center; gap:6px; }
html:root body.assets-page-body .assets-total-row .assets-total { min-width:0; margin:0; }
html:root body.assets-page-body .assets-total-row #assets-visibility { flex:none; }
html:root body.assets-page-body .asset-account-row .settings-menu-value { font-size:17px; line-height:1.3; }
html:root body.assets-page-body .asset-account-name { font-size:13px; line-height:1.4; }
html:root body.assets-page-body .financial-access-item .financial-asset-balance { font-size:22px; }
html:root body.assets-page-body .assets-query-basis { margin-top:18px; padding-top:14px; border-top:1px solid var(--theme-line,#dfe7e1); }
.assets-query-basis h3 { margin:0 0 6px; font-size:13px; font-weight:600; color:var(--theme-ink,#293c33); }
.asset-amount-line { display:flex; align-items:baseline; flex-wrap:wrap; }
.asset-month-label { margin-left:6px; font-size:11px; font-weight:400; color:var(--theme-muted,#718178); white-space:nowrap; }
/* Privacy never waits for a new stylesheet or a network response. */
html.app-is-locked body > :not(.app-lock-screen):not(script):not(style):not(link) { visibility:hidden !important; }
html:root:has(body.app-shell-page) {
  --app-column-width: 480px;
  container: kkaebu / inline-size;
  width: min(100%, var(--app-column-width));
  margin-inline: auto;
  scrollbar-gutter: stable;
  background-color: var(--theme-canvas, #fff);
  background-image: var(--theme-pattern, none);
  background-size: var(--theme-pattern-size, auto);
  background-attachment: fixed;
}
html[data-theme="paper"]:has(body.app-shell-page) {
  background-image: linear-gradient(#d8c3a322 1px, transparent 1px), linear-gradient(90deg, #d8c3a322 1px, transparent 1px);
  background-size: 22px 22px;
}
html[data-theme="ribbon"]:has(body.app-shell-page) {
  background-image: url('/static/theme-pattern-ribbon-v2.svg');
  background-size: 1320px 1060px;
}
html:has(body.app-shell-page dialog[open]) { overflow: hidden; }
body.app-shell-page {
  width: 100%;
  max-width: var(--app-column-width);
  min-height: 100dvh;
  margin-inline: auto;
}
body.app-shell-page:is(.fixed-mobile-page, .records-calendar-active) {
  width: min(100%, var(--app-column-width));
  inset-inline: 0;
}
body.app-shell-page main.page-shell { min-height: 100dvh; }
body.app-shell-page .app-bottom-nav {
  width: min(100%, var(--app-column-width));
  margin-inline: auto;
}
body.app-shell-page :is(.quick-actions, #records-scroll-top) {
  right: max(18px, calc((100% - var(--app-column-width)) / 2 + 18px));
}
body.app-shell-page dialog {
  max-width: min(var(--app-column-width), calc(100% - 24px)) !important;
  max-inline-size: min(var(--app-column-width), calc(100% - 24px)) !important;
  margin-inline: auto;
}
body.app-shell-page .app-settings-overlay {
  width: min(100%, var(--app-column-width));
  max-width: var(--app-column-width) !important;
  max-inline-size: var(--app-column-width) !important;
  inset-inline: 0;
}
body.app-shell-page .app-settings-overlay::backdrop { background: transparent; }
/* Navigation stays in the dialog's top layer, so it remains usable. */
body.app-shell-page .app-settings-overlay .app-settings-frame { height:calc(100% - var(--app-bottom-nav-height, 76px)); }
body.app-shell-page .app-settings-overlay .app-settings-loading { bottom:var(--app-bottom-nav-height, 76px); }
body.app-shell-page .app-settings-overlay .app-bottom-nav { display:grid; }
body.records-calendar-active #recording-panel { display:none !important; }
html:root body.app-shell-page .category-view-dialog .kb-view-name-form input { box-sizing:border-box; border-color:var(--theme-line,#dfe7e1); color:var(--theme-ink,#293c33); background:var(--theme-panel,#fff); outline-color:var(--theme-accent,#28765e); }
html:root body.app-shell-page .category-view-dialog input:is([type=checkbox],[type=radio]) { appearance:none !important; -webkit-appearance:none !important; display:inline-grid; place-content:center; flex:0 0 18px; width:18px; height:18px; min-width:18px; min-height:18px; padding:0; margin:0; border:1.5px solid var(--theme-muted,#718178) !important; border-radius:5px; background:var(--theme-panel,#fff) !important; cursor:pointer; }
html:root body.app-shell-page .category-view-dialog input[type=radio] { border-radius:50%; }
html:root body.app-shell-page .category-view-dialog input:checked { border-color:var(--theme-accent,#28765e) !important; background:var(--theme-accent,#28765e) !important; }
html:root body.app-shell-page .category-view-dialog input[type=checkbox]:checked::after { content:''; width:8px; height:5px; margin-top:-2px; border:solid var(--theme-accent-ink,#fff); border-width:0 0 2px 2px; transform:rotate(-45deg); }
html:root body.app-shell-page .category-view-dialog input[type=radio]:checked::after { content:''; width:6px; height:6px; border-radius:50%; background:var(--theme-accent-ink,#fff); }
html:root body.app-shell-page .category-view-dialog input:focus-visible { outline:2px solid var(--theme-accent,#28765e); outline-offset:3px; }
.assets-dialog-heading h2 { display:flex; align-items:center; gap:8px; }
.assets-dialog-heading h2 svg, .assets-method-icon svg { display:block; width:24px; height:24px; flex-shrink:0; }
body.app-shell-page #assets-add-dialog { box-sizing:border-box; padding:22px; border:1px solid var(--theme-line,#dce4df); border-radius:22px; color:var(--theme-ink,#293c33); background:var(--theme-panel,#fff); }
#assets-add-dialog .assets-dialog-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; }
#assets-add-dialog .assets-dialog-heading h2 { margin:0; font-size:18px; }
#assets-add-dialog :is(.assets-dialog-lead,.assets-dialog-note) { color:var(--theme-muted,#718178); font-size:12px; line-height:1.6; }
#assets-add-dialog .assets-method { display:flex; align-items:center; gap:12px; width:100%; margin:10px 0; padding:14px; border:1px solid var(--theme-line,#dce4df); border-radius:14px; background:var(--theme-raised,#f5f8f6); color:var(--theme-ink,#293c33); text-align:left; cursor:pointer; }
#assets-add-dialog .assets-method[hidden] { display:none; }
#assets-add-dialog .assets-method:disabled { opacity:.55; cursor:default; }
#assets-add-dialog .assets-method > span:nth-child(2) { flex:1; min-width:0; }
#assets-add-dialog .assets-method :is(strong,small) { display:block; line-height:1.5; }
#assets-add-dialog .assets-method strong { font-size:14px; margin:3px 0; }
#assets-add-dialog .assets-method small { color:var(--theme-muted,#718178); font-size:12px; }
#assets-add-dialog .assets-method-icon { flex:0 0 24px; color:var(--theme-accent,#28765e); }
#assets-add-dialog .assets-plan-label { color:var(--theme-accent,#28765e); font-size:10px; font-weight:650; }
body.app-shell-page .goals-toast {
  max-width: calc(min(100%, var(--app-column-width)) - 32px);
}
/* A text node beside ::before creates another grid row, even at font-size:0.
   Use a single flex line so the cross stays centered independently of glyphs. */
html:root body.app-shell-page :is(dialog button[aria-label$="닫기"], dialog button[data-close], button[data-assets-close], .dialog-close, .settings-dialog-close, .category-settings-dialog-close, .record-editor-close, .theme-dialog-close, .quick-install-dialog-close, .billing-dialog-close, #records-calendar-day-close):not([hidden]):not([class*="backdrop"]) {
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:0 !important;
  flex:0 0 44px;
  width:44px !important;
  min-width:44px;
  max-width:44px;
  height:44px !important;
  min-height:44px;
  padding:0 !important;
  border:0 !important;
  border-radius:12px !important;
  background:var(--theme-raised,#f1f6f3) !important;
  color:var(--theme-muted,#68766f) !important;
  font-size:0 !important;
  line-height:0;
  letter-spacing:0;
  word-spacing:0;
  box-shadow:none;
  cursor:pointer;
}
html:root body.app-shell-page :is(dialog button[aria-label$="닫기"], dialog button[data-close], button[data-assets-close], .dialog-close, .settings-dialog-close, .category-settings-dialog-close, .record-editor-close, .theme-dialog-close, .quick-install-dialog-close, .billing-dialog-close, #records-calendar-day-close):not([hidden]):not([class*="backdrop"]) > * { display:none !important; }

/* Smaller remove controls keep their existing footprint; inline X marks keep
   their text labels. Both use the same font-independent, symmetric cross. */
html:root body.app-shell-page :is(.transaction-split-remove, .subcategory-keyword-chip > button) {
  display:inline-flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:0;
  padding:0;
  font-size:0;
  line-height:0;
  letter-spacing:0;
  word-spacing:0;
  --app-dismiss-icon-size:16px;
}
html:root body.app-shell-page :is(.goal-keyword-tags button, .kb-clear, [data-recurring-reset]) { display:inline-flex; align-items:center; gap:4px; }
html:root body.app-shell-page :is(.goal-keyword-tags button > span[aria-hidden], .kb-clear > span[aria-hidden], .app-dismiss-mark) {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 14px;
  width:14px;
  height:14px;
  padding:0;
  font-size:0;
  line-height:0;
  --app-dismiss-icon-size:14px;
}
html:root body.app-shell-page :is(dialog button[aria-label$="닫기"], dialog button[data-close], button[data-assets-close], .dialog-close, .settings-dialog-close, .category-settings-dialog-close, .record-editor-close, .theme-dialog-close, .quick-install-dialog-close, .billing-dialog-close, #records-calendar-day-close, .transaction-split-remove, .subcategory-keyword-chip > button, .goal-keyword-tags button > span[aria-hidden], .kb-clear > span[aria-hidden], .app-dismiss-mark):not([hidden]):not([class*="backdrop"])::before {
  content:"";
  display:block;
  flex:0 0 var(--app-dismiss-icon-size,18px);
  width:var(--app-dismiss-icon-size,18px);
  height:var(--app-dismiss-icon-size,18px);
  margin:0;
  padding:0;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 6 12 12M18 6 6 18' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 6 12 12M18 6 6 18' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
}