/* Shared workspace components. Geometry is independent of theme colors. */
:root{--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px}
body{background-image:none;background-color:var(--bg)}
.page-heading>div:first-child{background:none;padding:0;border-radius:0;box-shadow:none}
.page-heading .eyebrow{display:none}
.page-heading h1{letter-spacing:-.8px;margin:0 0 6px}
.page-footer{background:none;border-top:1px solid var(--divider);border-radius:0;padding:16px 0}
.card,.metric{box-shadow:var(--elevation-1)}
.card{border-radius:16px;padding:24px}
.card.ledger{padding:0}
.section-heading{margin-bottom:20px;align-items:flex-start}
.section-heading p{font-size:13px}
.button,.icon-button,.text-button{min-height:44px}
.text-button{display:inline-flex;align-items:center;gap:8px}
.metric-value,.account-balance,.transaction-amount,.private-loan-total,.private-loan-metrics dd,.private-row-amount strong,.private-overview strong,.private-payment-split dd{white-space:nowrap;overflow-wrap:normal;word-break:normal;font-variant-numeric:tabular-nums}
.transaction-main strong{line-height:1.4}
.transaction-amount{font-size:14px}
.ledger-day-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 22px;background:var(--subtle);border-bottom:1px solid var(--divider);font-size:13px}
.ledger-day-heading span{font-size:12px;color:var(--muted);white-space:nowrap}
.entry-fields,[data-private-loans]:not(.private-loans){display:grid;gap:16px}
.entry-fields>p{margin:0}
.entry-fields label input,.entry-fields label select{min-height:44px}
.dialog-footer{flex-wrap:wrap;align-items:center;gap:12px}
.dialog-footer .button{min-width:0}
.dialog-heading{gap:12px;align-items:center}
.dialog-heading h2{min-width:0;flex:1;font-size:19px}
.dialog-heading .private-header-lock{flex:none;font-size:13px;padding:8px 12px}
.dialog-heading>.icon-button{flex:none}
.setting-row{gap:16px;align-items:center;padding:18px 0}
.setting-row>span:first-child{min-width:0;flex:1}
.setting-row small{font-size:13px}
.setting-row select{width:150px;min-width:150px;max-width:100%;margin-top:0}
.settings-grid{align-items:start;gap:20px}
#settings-recurring{grid-column:1/-1}
.settings-private>.button{margin-top:16px}
.settings-jump{background:var(--bg);padding:8px 0;gap:8px}
.settings-jump button{min-height:44px}
.settings-profile{padding:20px}
.stats-studio{grid-template-columns:minmax(0,1fr);gap:20px;align-items:start}
.stats-studio>.stats-scope,.stats-studio>.toolbar,.stats-studio>.stats-hero,.stats-studio>.stats-insights,.stats-studio>.stats-ledger,.stats-studio>.stats-budget-block{grid-column:1/-1;grid-row:auto}
.stats-studio>.toolbar{margin:0}
.stats-scope{border-radius:12px;padding:16px;background:var(--surface);border:1px solid var(--border)}
.stats-hero{background:var(--surface)}
.stats-hero-number .stats-number{font-size:clamp(28px,3.5vw,44px);letter-spacing:-1px}
.stats-hero-sub{flex-wrap:wrap;gap:12px}
.stats-hero-sub .stats-number{display:inline;font-size:inherit;letter-spacing:0}
.stats-insight{box-shadow:none}
.stats-trend .stats-bars{max-height:240px}
.stats-studio .stats-budget-widget{grid-column:auto;grid-row:auto}
.stats-budget-widget h2,.stats-budget-widget h3{font-size:14px;color:var(--text)}
.stats-budget-scope,.stats-budget-totals span,.stats-budget-legend span,.stats-budget-legend strong,.stats-budget-details{font-size:13px}
.stats-budget-month{font-size:13px}
.stats-rank-val,.stats-change{white-space:nowrap}
.stats-rank-row{gap:8px}
.stats-studio[data-stats-enter] .stats-hero,.stats-studio[data-stats-enter] .stats-insights,.stats-studio[data-stats-enter] .stats-analyzer,.stats-studio[data-stats-enter] .stats-trend,.stats-studio[data-stats-enter] .stats-budget-block,.stats-studio[data-stats-enter] .stats-ledger{animation:none}

/* Private workspace: list, detail and forms share the existing secure lifecycle. */
dialog.private-workspace{width:min(860px,calc(100vw - 48px));max-width:none}
.private-loans{gap:20px}
.private-overview{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:24px;padding:24px;background:var(--subtle);border:1px solid var(--border);border-radius:16px}
.private-overview>div{display:grid;gap:6px;min-width:0}
.private-overview strong{font-size:clamp(20px,3vw,30px);letter-spacing:-.6px}
.private-overview>div:last-child strong{font-size:22px}
.private-browser{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.private-filters{display:flex;flex-wrap:wrap;gap:8px}
.private-filters .chip{min-height:44px;padding:8px 12px;display:inline-flex;gap:6px;align-items:center}
.private-search{display:flex;align-items:center;gap:8px;border:1px solid var(--control-border);border-radius:10px;padding:0 12px;flex:1;min-width:180px;max-width:320px}
.private-search input{border:0;background:none;margin:0;padding:12px 0;min-height:44px;font-size:14px}
.private-search:focus-within{outline:2px solid var(--brand);outline-offset:2px}
.private-result-count{margin:0;font-size:13px}
.private-loan-list{display:grid;gap:12px}
.private-loan-row{border:1px solid var(--border);border-radius:12px;background:var(--surface);overflow:hidden}
.private-loan-open{display:grid;grid-template-columns:minmax(0,1fr) auto 20px;gap:16px;align-items:center;padding:20px;width:100%;text-align:left;min-height:88px}
.private-loan-open:hover{background:var(--subtle)}
.private-row-name,.private-row-amount{display:grid;gap:4px;min-width:0}
.private-row-name strong{font-size:15px;overflow-wrap:anywhere}
.private-row-amount{text-align:right}
.private-row-amount strong{font-size:18px}
.private-row-chevron{color:var(--muted)}
.private-help{border-top:1px solid var(--divider);padding-top:16px;font-size:13px;color:var(--muted)}
.private-help summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:var(--text)}
.private-help p{margin-top:8px}
.private-footer-note{margin-right:auto;display:flex;gap:8px;align-items:center;color:var(--muted);font-size:13px}
.private-empty{display:grid;place-items:center;gap:8px;text-align:center;padding:32px 16px;border:1px dashed var(--border);border-radius:14px}
.private-empty p{font-size:14px;color:var(--muted)}
.private-detail-nav{display:flex;justify-content:space-between;align-items:center;gap:12px}
.private-back-icon{transform:rotate(180deg)}
.private-actions-menu{position:relative;font-size:14px}
.private-actions-menu summary{cursor:pointer;display:flex;align-items:center;gap:8px;min-height:44px;padding:8px;color:var(--muted);list-style:none}
.private-actions-menu summary::-webkit-details-marker{display:none}
.private-actions-menu>div{position:absolute;z-index:3;right:0;top:100%;display:grid;gap:8px;width:180px;padding:12px;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--elevation-2)}
.private-loan-top{display:flex;justify-content:space-between;align-items:start;gap:12px}
.private-loan-top h3{font-size:20px;overflow-wrap:anywhere}
.private-detail-balance{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.private-detail-balance>div{min-width:0}
.private-loan-total{display:block;font-size:clamp(24px,3.8vw,36px);margin:8px 0 0;letter-spacing:-.6px}
.private-asof{width:180px;max-width:100%}
.private-loan-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:0;padding:20px;background:var(--subtle);border-radius:12px}
.private-loan-metrics dt{font-size:13px;color:var(--muted)}
.private-loan-metrics dd{margin:4px 0 0;font-size:17px;font-weight:600}
.private-repaid progress{width:100%;height:8px;margin-top:8px;accent-color:var(--brand)}
.private-terms{font-size:14px;line-height:1.7}
.private-history{border-top:1px solid var(--divider);padding-top:20px}
.private-history h4{font-size:16px;margin:0 0 16px}
.private-timeline{display:grid;list-style:none;margin:0;padding:0;gap:12px}
.private-timeline li{padding:16px;border:1px solid var(--border);border-radius:12px}
.private-payment-split{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:16px 0}
.private-payment-split dt{font-size:12px;color:var(--muted)}
.private-payment-split dd{font-size:14px;margin:4px 0 0}
.private-timeline-actions{display:flex;gap:16px}
.private-note{display:flex;gap:8px;align-items:center;border-radius:10px;padding:12px;background:var(--subtle);font-size:13px}
.private-form fieldset{border:1px solid var(--border);border-radius:12px;padding:16px;display:grid;gap:16px;margin:0}
.private-form legend{padding:0 6px;font-weight:600}
.private-form .private-rate-field[hidden]{display:none}
.private-payment-context{display:grid;gap:4px;padding:16px;border-radius:12px;background:var(--subtle);overflow-wrap:anywhere}
.private-payment-context span{font-size:14px;color:var(--muted)}
.private-preview{background:var(--subtle);border:1px solid var(--border);padding:16px;border-radius:12px;font-size:14px}
.private-split-wrap{display:grid;gap:8px;margin:12px 0}
.private-split{display:block;width:100%;height:6px}
.private-lock-warning{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;background:var(--expense-soft);padding:16px;border:1px solid var(--border);border-radius:12px;font-size:14px}
.account-spark{display:block;width:100%;height:28px;color:var(--chart-2);margin:4px 0 12px}
.account-owed{font-size:13px;color:var(--muted)}

@media(min-width:600px){
 #app[data-route=home] .mobile-home-header{grid-template-columns:44px 124px 44px;justify-content:start;padding:8px 0;background:none}
 #app[data-route=home] .mobile-home-header>[data-action=mobile-search],#app[data-route=home] .mobile-home-header>[data-action=filters],#app[data-route=home] .mobile-header-space,#app[data-route=home] .mobile-status{display:none}
 .stats-studio{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}
 .stats-analyzer{grid-column:1;grid-row:auto}
 .stats-trend{grid-column:2;grid-row:auto}
 .stats-breakdown{grid-template-columns:1fr;gap:16px}
 .stats-insights{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(min-width:1200px){.stats-breakdown{grid-template-columns:150px minmax(0,1fr)}.stats-donut{width:145px;height:145px}.stats-rank-row{grid-template-columns:12px minmax(0,1fr) auto 12px}.stats-change{grid-column:2/4;text-align:right}.stats-chev{grid-column:4;grid-row:1}}
@media(max-width:850px){.stats-studio{grid-template-columns:minmax(0,1fr)}.stats-analyzer,.stats-trend{grid-column:1}.stats-insights{grid-template-columns:1fr}}
@media(max-width:599px){
 main{padding:20px 16px 100px}
 .card{padding:20px}
 .page-heading{margin-bottom:20px}
 .page-heading h1{font-size:26px}
 .metrics{grid-template-columns:minmax(0,1fr);gap:12px}
 .metric,.metric:first-child,.metric:last-child{display:flex;flex-direction:column;align-items:flex-start;text-align:left;padding:18px;gap:6px;min-width:0}
 .metric-value,.metric:first-child .metric-value,.metric:last-child .metric-value{font-size:clamp(20px,6.5vw,26px);margin:4px 0;grid-column:auto;grid-row:auto}
 .account-balance{font-size:clamp(20px,6.5vw,26px)}
 .account-grid{grid-template-columns:1fr}
 .navigation{left:8px;right:8px;width:auto;padding-inline:4px}
 .navigation .nav-item{padding:7px 2px;font-size:10px;white-space:nowrap;min-width:0}
 .navigation .nav-item span{white-space:nowrap}
 .transaction{grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:16px}
 #app[data-route=home] .transaction{grid-template-columns:minmax(0,1fr) auto;gap:8px;padding-inline:16px}
 .transaction-main{gap:8px}
 .transaction-main strong{font-size:14px}
 .transaction-meta{font-size:12px}
 .transaction-amount{font-size:13px;letter-spacing:-.2px;min-width:0}
 .ledger-day-heading{padding:12px 16px}
 .ledger-grouped .mobile-date{display:none}
 .ledger-head{grid-template-columns:minmax(0,1fr) auto;padding-inline:16px}
 .settings-grid{grid-template-columns:1fr}
 .setting-row{flex-wrap:wrap}
 .setting-row select{width:150px;min-width:150px}
 .stats-rank-row{grid-template-columns:12px minmax(0,1fr) auto 12px}
 .stats-change{grid-column:2/4;text-align:right}
 .stats-chev{grid-column:4;grid-row:1}
 .stats-hero-number .stats-number{font-size:30px}
 .stats-hero{gap:16px}
 .stats-budget-limit .stats-number{font-size:26px}
 .dialog-heading{padding:16px;position:sticky;top:0;background:var(--surface);z-index:5}
 .dialog-heading h2{font-size:17px}
 .dialog-heading .private-header-lock{padding:8px;font-size:12px}
 .dialog-heading>.icon-button{min-width:36px}
 dialog.private-workspace{inset:0;margin:0;width:100%;height:100dvh;max-height:100dvh;max-width:100%;border-radius:0;padding-top:0}
 dialog.private-workspace::before{display:none}
 .private-workspace .entry-fields{padding:20px 16px}
 .private-workspace .dialog-footer{padding:12px 16px calc(12px + env(safe-area-inset-bottom));margin-top:auto}
 .private-overview{grid-template-columns:1fr;gap:16px;padding:20px}
 .private-overview strong{font-size:clamp(18px,5.8vw,26px)}
 .private-overview>div:last-child strong{font-size:20px}
 .private-browser{gap:12px}
 .private-search{max-width:none;flex-basis:100%}
 .private-loan-open{grid-template-columns:minmax(0,1fr) 20px;gap:8px;padding:16px}
 .private-row-name{grid-column:1;grid-row:1}
 .private-row-amount{grid-column:1;grid-row:2;text-align:left;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 16px}
 .private-row-chevron{grid-column:2;grid-row:1/3}
 .private-row-amount strong{font-size:19px}
 .private-row-amount .small{font-size:12px}
 .private-loan-metrics{padding:16px;gap:16px}
 .private-loan-metrics dd{font-size:15px}
 .private-payment-split{grid-template-columns:1fr 1fr}
 .private-payment-split>div:last-child{grid-column:1/-1}
 .private-footer-note{display:none}
 .private-workspace .dialog-footer>.primary{width:100%}
 .private-actions-menu summary{font-size:13px}
}
@media(max-width:359px){
 #app[data-route=home] .mobile-home-header{grid-template-columns:44px 96px 44px minmax(0,1fr) 44px 44px}
 #app[data-route=home] .mobile-home-header .mobile-status{display:none}
 .transaction-icon{display:none}.private-loan-metrics{grid-template-columns:1fr}.setting-row select{width:100%}.stats-hero-number .stats-number{font-size:27px}
}
@media(prefers-reduced-motion:reduce){.private-loan-open,.stats-studio *{animation:none;transition:none}}