/* UI-015/016: one motion rhythm, paired with explicit application lifecycles.
   The existing warm-orange smoked-glass visual language is unchanged. */
:root{--control-glide:420ms;--motion-enter:280ms;--motion-exit:190ms;--motion-ease:cubic-bezier(.22,.68,.2,1)}
#main[data-glass-phase="closing"]{pointer-events:none}
#detail-dialog,.manual-copy-dialog{transition:none;opacity:1;transform:none}
#detail-dialog[open],.manual-copy-dialog[open]{opacity:1;transform:none}
#detail-dialog::backdrop,.manual-copy-dialog::backdrop{opacity:1;background:#121410aa;backdrop-filter:blur(5px);transition:opacity var(--motion-exit) ease}
#detail-dialog[data-glass-phase="closing"]::backdrop,.manual-copy-dialog[data-glass-phase="closing"]::backdrop{opacity:0}
@starting-style{#detail-dialog[open],.manual-copy-dialog[open]{opacity:1;transform:none}#detail-dialog[open]::backdrop,.manual-copy-dialog[open]::backdrop{opacity:0}}
.manual-copy-dialog{background:linear-gradient(145deg,#464136fa,#2c2b26fc);border:1px solid #d7bd8f4a;color:var(--ink);box-shadow:0 30px 80px #0008}
.manual-copy-dialog textarea{background:var(--surface-input);color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:12px}
[data-glass-phase="closing"] form,[data-glass-phase="closing"].api-section-body{pointer-events:none}
.api-section-toggle .api-arrow{font-size:0;display:block;width:18px;height:18px;position:relative;transform:rotate(0);transition:transform var(--motion-enter) var(--motion-ease)}
.api-section-toggle .api-arrow::after{content:"";position:absolute;inset:4px 5px 6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
.api-section-toggle[aria-expanded="true"] .api-arrow{transform:rotate(180deg)}
.work-area,#assistant-panel{transition:none}
.work-area.chat-open::after{display:none}
.glass-assistant-backdrop{display:none}
.work-area.chat-hidden.glass-assistant-leaving #assistant-panel{visibility:visible;padding:20px;border-width:1px;pointer-events:none}
@media(min-width:1280px){
 .work-area.glass-assistant-leaving{grid-template-columns:minmax(0,1fr) 340px;column-gap:24px}
 .work-area.glass-assistant-leaving .expense-hero,.work-area.glass-assistant-leaving .live-columns{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:1279px){
 .glass-assistant-backdrop{display:block;position:fixed;inset:0;z-index:80;border:0;border-radius:0;padding:0;background:#10120ebe;backdrop-filter:blur(4px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity 200ms ease,visibility 0s 200ms}
 .work-area.chat-open>.glass-assistant-backdrop{opacity:1;visibility:visible;pointer-events:auto;transition:opacity 260ms ease,visibility 0s}
 .work-area.glass-assistant-leaving>.glass-assistant-backdrop{opacity:0;visibility:visible;pointer-events:none}
 .work-area.chat-hidden.glass-assistant-leaving #assistant-panel{padding:22px}
}
@media(max-width:760px){
 .work-area.chat-hidden.glass-assistant-leaving #assistant-panel{padding:18px}
 .sidebar{transition:transform 260ms var(--motion-ease),opacity 220ms ease,visibility 0s 260ms}
 .glass-menu-open .sidebar{transition:transform 300ms var(--motion-ease),opacity 240ms ease,visibility 0s}
 .glass-nav-backdrop{transition:opacity 220ms ease,visibility 0s 220ms}
 .glass-menu-open .glass-nav-backdrop{transition:opacity 260ms ease,visibility 0s}
}
/* UI-019 / DOC-008: current amount + direction beside it; known prior values
   stay visible below. Green/red encode direction, not expense quality. */
:root{--trend-up:#a0e1b1;--trend-down:#ffaca2;--trend-flat:#ded5c6}
.metric-value-row{display:flex;align-items:center;gap:10px;min-width:0;width:100%;flex-wrap:nowrap}
.live-metric .metric-current{display:block;flex:0 1 auto;min-width:0;margin:0;font-size:27px;font-weight:500;line-height:1.25;letter-spacing:-.02em;white-space:nowrap;font-variant-numeric:tabular-nums}
.known-difference>.profit-value-row{order:1}
.profit-value-row>#known-difference{order:0;flex:0 1 auto;min-width:0;margin:0;font-size:clamp(36px,4.4vw,76px)}
.comparison-badge{display:inline-flex;align-items:center;justify-content:center;gap:4px;flex:0 1 auto;min-width:0;max-width:48%;padding:5px 7px;border-radius:9px;border:1px solid #8294814d;background:#29312a;color:var(--trend-flat);font-size:12px;font-weight:600;line-height:1.5;letter-spacing:0;white-space:nowrap;font-variant-numeric:tabular-nums;box-shadow:inset 0 1px #ffffff0d}
.comparison-badge>span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.comparison-badge.is-up{color:var(--trend-up);background:#223a30;border-color:#7aba8c57}
.comparison-badge.is-down{color:var(--trend-down);background:#492d2b;border-color:#dd8b8057}
.comparison-badge.is-flat{color:var(--trend-flat);background:#383730;border-color:#a8a18b40}
.trend-arrow{width:18px;height:18px;flex:0 0 18px;overflow:hidden}
.comparison-badge.is-down .trend-arrow{transform:rotate(180deg)}
.trend-arrow-head{animation:trend-arrow-arrive 940ms cubic-bezier(.22,.68,.2,1) 2}
.trend-arrow-echo{opacity:0;animation:trend-arrow-trail 940ms cubic-bezier(.22,.68,.2,1) 2}
@keyframes trend-arrow-arrive{0%,100%{transform:translateY(0);opacity:1}35%{transform:translateY(-2px);opacity:.72}68%{transform:translateY(1px);opacity:1}}
@keyframes trend-arrow-trail{0%,100%{transform:translateY(2px);opacity:0}28%{transform:translateY(0);opacity:.55}72%{transform:translateY(-4px);opacity:0}}
.metric-comparison{margin:0!important;padding:0!important;border:0!important;min-width:0;color:var(--muted)}
.metric-comparison>summary{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;padding:4px 0!important;min-height:34px;font-size:12px;line-height:1.55;list-style:none}
.metric-comparison>summary::-webkit-details-marker{display:none}
.metric-comparison>summary::after{display:none!important}
.comparison-basis{font-size:12px;letter-spacing:0;color:var(--muted)}
.comparison-reference{font-size:13px;font-weight:500;color:#e2d8c9;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.metric-comparison[data-reference-state="missing"] .comparison-reference,.comparison-unavailable{color:#c8c1b2;font-size:12px}
.comparison-info{flex:0 0 14px;color:#c8bfaf;opacity:.9;transition:opacity 180ms}
.metric-comparison>summary:hover .comparison-info,.metric-comparison[open] .comparison-info{opacity:1}
.comparison-evidence,.live-metric .comparison-evidence{font-size:13px;line-height:1.8;color:var(--muted);overflow-wrap:anywhere;padding:2px 0 10px}
.comparison-evidence p{margin:7px 0}
.comparison-reason{color:#dcc39d}
.known-difference>.metric-comparison{order:2;max-width:100%;margin:6px 0 10px!important}
.known-difference>span{order:3}
.known-difference>.metric-comparison>summary{padding:6px 0!important;font-size:12px;gap:5px 9px}
.known-difference .comparison-reference{font-size:14px}
.live-metric>.metric-comparison{width:100%;align-self:start}
.live-metric{gap:8px}
.overview-tax-rule{margin:14px 0;padding-top:9px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
.overview-tax-rule>summary{min-height:36px;line-height:1.7}
.overview-tax-rule>.disclosure-content{padding-top:6px;line-height:1.8}
/* UI-022: evidence identity, fee category, and direction are independent axes. */
:root{--basis-actual:#c8dfa4;--basis-rule:#e4c58f;--basis-estimated:#dacda4;--basis-sample:#c4cce4;--basis-manual:#d9c4df;--basis-partial:#eac396;--basis-missing:#f1b3a2}
.legend-values [data-evidence-state="actual"]{color:var(--basis-actual)}
.legend-values [data-evidence-state="rule"]{color:var(--basis-rule)}
.legend-values [data-evidence-state="estimated"]{color:var(--basis-estimated)}
.legend-values [data-evidence-state="sample"]{color:var(--basis-sample)}
.legend-values [data-evidence-state="manual"]{color:var(--basis-manual)}
.legend-values [data-evidence-state="partial"]{color:var(--basis-partial)}
.legend-values [data-evidence-state="missing"]{color:var(--basis-missing)}
.legend-values .legend-meta{display:flex;align-items:baseline;justify-content:flex-end;gap:3px 7px;flex-wrap:wrap;font-size:12px;line-height:1.5}
.legend-evidence{font-size:12px;font-weight:400}
.legend-values .legend-share{color:#d0c8bc;font-size:12px;font-weight:400;font-variant-numeric:tabular-nums}
.expense-toggle.is-excluded .legend-values .legend-share{color:#d0c8bc}
@media(max-width:760px){.legend-values .legend-meta{justify-content:flex-start;column-gap:6px}}
@media(min-width:761px) and (max-width:1100px){.live-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.live-metrics>.live-metric{border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.live-metric:nth-child(2n){border-right:0}.live-metric:nth-last-child(-n+2){border-bottom:0}}
@media(min-width:1800px){.live-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.live-metric:nth-child(-n+3){border-bottom:1px solid var(--line)}.live-metric:nth-child(3n){border-right:0}.profit-value-row>#known-difference{font-size:80px}}
@media(max-width:760px){.live-metrics{grid-template-columns:minmax(0,1fr)}.live-metric{padding:17px 18px;min-height:0;border-right:0!important}.live-metric:not(:last-child){border-bottom:1px solid var(--line)}.live-metric:last-child{border-bottom:0}.live-metric .metric-current{font-size:27px}.metric-comparison>summary{row-gap:4px}.comparison-basis{width:auto;font-size:12px}.comparison-evidence,.live-metric .comparison-evidence{font-size:13px}.profit-value-row>#known-difference{font-size:46px}.profit-value-row{gap:8px}.comparison-badge{padding:4px 6px}}
@media(prefers-reduced-motion:reduce){.trend-arrow-head,.trend-arrow-echo{animation:none!important}.trend-arrow-echo{display:none}.comparison-info{transition:none!important}}
@media(prefers-reduced-motion:reduce){
 .sidebar,.glass-nav-backdrop,.glass-assistant-backdrop,.api-arrow,dialog::backdrop{transition:none!important}
}