/* Both themes retain LongVest's Manrope type, orange actions and solid offset shadows. */
:root{--surface:#fff;--input:#fbfaf6;--row-alt:#fcfbf8;--hover:#fff2df;--table-head:#f3f1e9;--positive:#087044;--negative:#b4232b;--chart-line:#191917;--chart-grid:#e6e2d9;--chart-accent:#b74600}
.theme-toggle{display:grid;place-items:center;width:36px;height:36px;flex:none;padding:7px;border:1.5px solid var(--ink);border-radius:7px;background:var(--yellow);color:var(--ink);box-shadow:2px 2px 0 #191917;transition:transform 160ms ease,background-color 160ms ease}
.theme-toggle:hover{transform:translateY(-2px)}.theme-toggle:active{transform:translate(1px,1px)}
.theme-toggle svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.theme-sun{display:none}
[data-theme=dark] .theme-sun{display:block}[data-theme=dark] .theme-moon{display:none}
.date-input{display:inline-flex;align-items:center;position:relative;min-width:0;width:100%;isolation:isolate}
.date-input .date-text{width:100%;min-width:0;padding-right:39px;font-variant-numeric:tabular-nums}
.date-control .date-input{width:145px}
.date-input .date-picker{position:absolute;right:5px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:29px;height:29px;padding:5px;background:transparent;color:var(--ink);border:0;border-radius:4px;box-shadow:none;z-index:1}
.date-picker:hover{background:var(--yellow)}.date-picker svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round}
.date-input .date-native{position:absolute;width:1px;height:1px;bottom:0;right:0;opacity:1;color:transparent;font-size:0;pointer-events:none;padding:0;border:0;box-shadow:none}
.date-input .date-text:user-invalid{outline:2px solid var(--negative);outline-offset:2px}
.chart polyline{stroke:var(--chart-line)}.chart line{stroke:var(--chart-grid)}.etf-price-chart polyline{stroke:var(--chart-accent)}
[data-theme=dark]{color-scheme:dark;--paper:#191a1d;--sidebar:#202124;--surface:#24262a;--input:#202226;--ink:#f2eee6;--muted:#b4b0a7;--orange:#ff8a38;--blue:#29384a;--yellow:#433a24;--pink:#452e36;--mint:#253e34;--line:#424347;--shadow:3px 4px 0 #090a0c;--row-alt:#292b2f;--hover:#3d332a;--table-head:#303136;--positive:#72d8a4;--negative:#ff9298;--chart-line:#f2eee6;--chart-grid:#424347;--chart-accent:#ffac70}
[data-theme=dark] body{background:var(--paper);color:var(--ink)}
[data-theme=dark] header,[data-theme=dark] .panel,[data-theme=dark] .toolbar,[data-theme=dark] .secondary,[data-theme=dark] .tabs button,[data-theme=dark] .edit-link,[data-theme=dark] .icon-button,[data-theme=dark] .notice,[data-theme=dark] .donut-hole,[data-theme=dark] .etf-side,[data-theme=dark] .etf-price-chart,[data-theme=dark] .etf-chart-empty,[data-theme=dark] .sheet-target-row,[data-theme=dark] .deposit-chain li{background:var(--surface);color:var(--ink)}
[data-theme=dark] :is(.panel,.metric,.primary,.secondary,.danger-button,.tabs button,.icon-button,.notice,.workspace-switch,.search,.symbol-icon,.pill,.edit-link,.donut,.donut-hole,.progress,.theme-toggle,.etf-side,.etf-summary,.deposit-balance,.sheet-summary article,dialog){border-color:#73716a;box-shadow:var(--shadow)}
[data-theme=dark] :is(.pill,.progress,.donut,.donut-hole){box-shadow:none}
[data-theme=dark] #sidebar{border-color:#08090b}
[data-theme=dark] nav a:hover,[data-theme=dark] #menu.sidebar-toggle:hover,[data-theme=dark] #menu.sidebar-toggle:focus-visible{background:var(--hover);border-color:#73716a}
[data-theme=dark] nav a.active,[data-theme=dark] .primary,[data-theme=dark] .tabs button.selected{background:var(--orange);color:#21170e;border-color:#08090b;box-shadow:3px 3px 0 #08090b}
[data-theme=dark] .primary:hover{background:#ffa25e}
[data-theme=dark] .secondary:hover,[data-theme=dark] .tabs button:hover,[data-theme=dark] .edit-link:hover{background:var(--hover)}
[data-theme=dark] .tabs button.selected:hover{background:#ffa25e}
[data-theme=dark] .workspace-switch{background:var(--input)}
[data-theme=dark] .workspace-switch a.active{background:var(--hover);color:var(--ink);border-color:#73716a;box-shadow:1px 1px 0 #090a0c}
[data-theme=dark] :is(.date-control input,.form-grid input,.form-grid select,.form-grid textarea,.form-inline input,.form-inline select,.search,.sheet-source select,.sheet-connection input,.sheet-target-row input,.sheet-target-row select){background:var(--input);color:var(--ink);border-color:#77736c;box-shadow:2px 2px 0 #090a0c}
[data-theme=dark] input::placeholder,[data-theme=dark] textarea::placeholder{color:#a6a29a;opacity:1}
[data-theme=dark] :is(.sidebar-bottom,.text-button,.metric-note,.featured .metric-note,.notice,.form-inline label,.form-grid label,.setting-row,.methodology,.pnl-caption,.deposit-meta,.deposit-facts dt,.deposit-history h3 span,.deposit-history li p,.deposit-history li small,.deposit-link-label,.deposit-relations button span,.deposit-chain h3 span,.deposit-chain li p,.deposit-chain dt,.deposit-chain small,.sheet-summary article span,.sheet-summary article small,.etf-facts dt,.etf-summary .etf-source){color:var(--muted)}
[data-theme=dark] :is(.sidebar-bottom .text-button,.deposit-history,.deposit-history li,.deposit-chain,.deposit-chain li,.sheet-scopes,.sheet-connection,.sheet-target-row,.sheet-records,.etf-footer){border-color:var(--line)}
[data-theme=dark] .notice.warning,[data-theme=dark] .qb-source-note.error,[data-theme=dark] .deposit-maturity,[data-theme=dark] .deposit-confirm{background:var(--yellow);color:#f1d5a3;border-color:#a58146}
[data-theme=dark] .deposit-balance,[data-theme=dark] .sheet-summary article,[data-theme=dark] .deposit-cycle{background:var(--yellow);color:var(--ink)}
[data-theme=dark] .deposit-auto{background:var(--mint);border-color:#628a70}
[data-theme=dark] .deposit-chain li.is-current{background:var(--yellow);border-color:var(--orange)}
[data-theme=dark] .sheet-connection{background:var(--input)}
[data-theme=dark] .sheet-success>span{background:var(--mint);color:var(--positive)}
[data-theme=dark] :is(.deposit-name,#sheet-dialog a,.qb-symbol-button:hover,.sort-button:hover,th[aria-sort=ascending],th[aria-sort=descending],th[aria-sort=ascending] .sort-button span,th[aria-sort=descending] .sort-button span){color:#ffac70}
[data-theme=dark] .pill{background:var(--mint);color:var(--positive)}
[data-theme=dark] .pill.sell,[data-theme=dark] .danger-button{background:var(--pink);color:var(--negative)}
[data-theme=dark] .pill.neutral,[data-theme=dark] .progress,[data-theme=dark] .mini-bar span{background:#343536;color:#cec9be}
[data-theme=dark] th,[data-theme=dark] .quote-board th,[data-theme=dark] .sheet-table-scroll th{background:var(--table-head);color:#d3cfc5}
[data-theme=dark] .quote-board th.qb-bid{background:var(--mint)}[data-theme=dark] .quote-board th.qb-ask{background:var(--pink)}[data-theme=dark] .quote-board th.qb-match{background:var(--yellow)}
[data-theme=dark] tbody tr:nth-child(even),[data-theme=dark] .quote-board tbody tr:nth-child(even) td{background:var(--row-alt)}
[data-theme=dark] .quote-board tbody tr:nth-child(odd) td{background:var(--surface)}
[data-theme=dark] tbody tr:hover,[data-theme=dark] .quote-board tbody tr:hover td{background:var(--hover)}
[data-theme=dark] .table-scroll{scrollbar-color:#77736c var(--surface)}
[data-theme=dark] .up,[data-theme=dark] .qb-up,[data-theme=dark] .goal-top b{color:var(--positive)}
[data-theme=dark] .down,[data-theme=dark] .qb-down,[data-theme=dark] .error{color:var(--negative)}
[data-theme=dark] .qb-ref,[data-theme=dark] .qb-no-chart{color:#f3ca66}[data-theme=dark] .qb-ceiling{color:#d5a0f8}[data-theme=dark] .qb-floor{color:#69d6eb}[data-theme=dark] .qb-stale-dot{color:#ffac70}
[data-theme=dark] .profit{--pnl-color:var(--positive);--pnl-bg:#203e30}[data-theme=dark] .loss{--pnl-color:var(--negative);--pnl-bg:#452b32}[data-theme=dark] .flat,[data-theme=dark] .unknown{--pnl-color:#d3cfc5;--pnl-bg:#363634}
[data-theme=dark] .chart text,[data-theme=dark] .etf-price-chart text{fill:var(--muted)}[data-theme=dark] .etf-grid{stroke:var(--line)}
[data-theme=dark] .etf-price-chart [fill="#087044"]{fill:var(--positive)}[data-theme=dark] .etf-price-chart [fill="#b4232b"]{fill:var(--negative)}
[data-theme=dark] .chart-total small{color:var(--muted)!important}[data-theme=dark] .legend i{background:var(--chart-line)!important}
[data-theme=dark] dialog::backdrop{background:#050609a8}
[data-theme=dark] :is(button,a,input,select):focus-visible{outline-color:#ffac70}
[data-theme=dark] .quote-board td.qb-flash-up{animation-name:dark-up-flash}[data-theme=dark] .quote-board td.qb-flash-down{animation-name:dark-down-flash}
@keyframes dark-up-flash{0%,20%{background:#315d45}100%{background:var(--surface)}}@keyframes dark-down-flash{0%,20%{background:#713c45}100%{background:var(--surface)}}
@media(prefers-reduced-motion:reduce){.theme-toggle{transition:none}}

[data-theme=dark] #quit:hover{background:var(--hover)}

.date-calendar{position:fixed;inset:auto;margin:0;width:288px;max-height:calc(100dvh - 16px);overflow:auto;padding:14px;background:var(--surface);color:var(--ink);border:1.5px solid var(--ink);border-radius:9px;box-shadow:3px 4px 0 #191917;font:12px Manrope,'Segoe UI',sans-serif;z-index:30}
.date-calendar::backdrop{background:transparent}.calendar-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.calendar-head button{font-size:24px;width:30px;height:30px}.date-calendar button{border:0;border-radius:5px;background:transparent;color:var(--ink);box-shadow:none;padding:4px}.date-calendar button:hover{background:var(--hover)}.calendar-week,.calendar-days{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;text-align:center}.calendar-week{color:var(--muted);font-size:10px;margin-bottom:8px}.calendar-days button{height:32px;font-size:12px}.calendar-days button[aria-current=date]{outline:1px solid var(--orange);outline-offset:-2px}.calendar-days button[aria-pressed=true]{background:var(--orange);color:#191917;font-weight:800}.date-calendar .calendar-today{display:block;width:100%;margin-top:12px;border-top:1px solid var(--line);padding-top:10px;font-size:11px;color:var(--chart-accent)}
[data-theme=dark] .date-calendar{border-color:#73716a;box-shadow:var(--shadow)}

/* Savings settlement cards share the established paper and pastel palette. */
.deposit-balances{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.deposit-balances:has(>.deposit-balance:only-child){grid-template-columns:1fr}
.deposit-balances .deposit-balance{padding:18px;align-content:start;min-width:0;background:var(--yellow);color:var(--ink)}
.deposit-balances .deposit-withdrawable{background:var(--mint)}
.deposit-balances .deposit-balance>strong{font-size:clamp(22px,2.5vw,30px);overflow-wrap:anywhere}
.deposit-balances .deposit-balance>small{font-size:12px;line-height:1.6}
.deposit-confirm .form-grid{margin:20px 0}.deposit-confirm .deposit-auto{display:flex}.deposit-confirm .deposit-auto input{width:20px;height:20px;padding:0;flex:none}
@media(max-width:560px){.deposit-balances{grid-template-columns:1fr}}

.info-button{display:inline-grid;place-items:center;vertical-align:middle;width:20px;height:20px;min-width:20px;min-height:20px;flex:0 0 20px;padding:0;margin:0;border:1px solid var(--muted);border-radius:50%;background:transparent;color:var(--muted);font-size:12px;font-weight:800;font-style:normal;letter-spacing:0;text-transform:none;line-height:1;box-shadow:none;cursor:help}
.info-button:hover,.info-button[aria-expanded=true]{background:var(--yellow);color:var(--ink);border-color:var(--ink)}
.info-button:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.info-popover{position:fixed;inset:auto;margin:0;max-width:min(360px,calc(100vw - 24px));max-height:65vh;overflow:auto;padding:14px 16px;border:1.5px solid var(--ink);border-radius:9px;background:var(--surface);color:var(--ink);box-shadow:var(--shadow);font:12px/1.75 Manrope,sans-serif;white-space:pre-line}
.info-popover::backdrop{background:transparent}
.with-info,.field-caption,.metric-label:has(.info-button),.panel-head h2:has(.info-button),.fund-intro h2:has(.info-button),.settlement-amount>span{display:flex;align-items:center;gap:8px}
.with-info{display:inline-flex;max-width:100%}
.page-title{gap:10px}.page-title h1{min-width:0}
.field-caption{justify-content:flex-start;min-height:20px}
.metric-label:has(.info-button){min-height:20px;line-height:1.5}
.qb-mode .info-button{margin-left:8px}
.deposit-auto-row{display:flex;align-items:center;gap:12px;padding-right:18px;border:1px solid #729980;border-radius:8px;background:var(--mint)}
.deposit-auto-row .deposit-auto{flex:1;min-width:0;border:0;background:transparent}
.deposit-auto-row .info-button{margin:0}
[data-theme=dark] .deposit-auto-row .deposit-auto{background:transparent}
@media(max-width:560px){.page-title{gap:8px}.with-info{vertical-align:middle}}
.deposit-primary-actions{display:flex;gap:10px;align-items:center;justify-content:flex-end;margin:20px 0}
#deposit-action-dialog{width:min(610px,94vw)}
#deposit-action-dialog::backdrop{background:#0006;backdrop-filter:blur(2px)}
#deposit-action-dialog .dialog-actions{gap:14px;flex-wrap:wrap}
#deposit-action-dialog .dialog-actions>div{margin-left:auto;display:flex;gap:10px}
#deposit-action-dialog .deposit-auto{display:flex}#deposit-action-dialog .deposit-auto input{width:20px;height:20px;flex:none;padding:0}
#deposit-action-dialog .settlement-amount{display:grid;gap:8px;padding:18px 20px;margin-bottom:22px;border:1.5px solid var(--ink);border-radius:9px;background:var(--yellow);box-shadow:var(--shadow)}
.settlement-amount>span,.settlement-amount>small{font-size:12px}.settlement-amount>strong{font-size:30px;letter-spacing:-1px}
#deposit-action-dialog .error:empty{display:none}
@media(prefers-reduced-motion:no-preference){#deposit-action-dialog[open]{animation:settlement-enter 160ms ease-out}@keyframes settlement-enter{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}}

/* Interactive dashboard charts retain the shared light/dark palette. */
.interactive-chart{position:relative;min-width:0}
.chart-tip{position:absolute;z-index:3;width:250px;max-width:calc(100% - 16px);padding:12px 14px;background:var(--surface);border:1.5px solid var(--ink);border-radius:8px;box-shadow:var(--shadow);color:var(--ink);pointer-events:none;font-size:11px;line-height:1.55}
.chart-tip[hidden],.chart-marker[hidden]{display:none}
.chart-tip>strong{font-size:12px}.chart-tip dl{margin:7px 0 0;display:grid;gap:5px}.chart-tip dl>div{display:flex;gap:12px;justify-content:space-between}.chart-tip dt{color:var(--muted)}.chart-tip dd{margin:0;font-weight:800;text-align:right;white-space:nowrap}
.chart-hit{cursor:crosshair;touch-action:pan-y}.chart-hit:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.chart .chart-marker line{stroke:var(--orange);stroke-width:1.5}.chart-marker circle{fill:var(--orange);stroke:var(--ink);stroke-width:1.5;vector-effect:non-scaling-stroke}.chart-marker{pointer-events:none}
.interactive-donut{position:relative;overflow:visible;background:none}
.interactive-donut>svg{width:100%;height:100%;overflow:visible;position:absolute;inset:0}
.interactive-donut .donut-hole{position:relative;pointer-events:none;width:70%;height:70%;z-index:1}
.allocation-item{display:block;width:100%;border:0;border-radius:5px;padding:7px;background:transparent;color:var(--ink);text-align:left;min-width:0;box-shadow:none}
.allocation-item .allocation-line{display:flex;margin-bottom:9px}.allocation-item .allocation-line i{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px}.allocation-item .progress{display:block}
.allocation-segment{cursor:pointer;pointer-events:stroke;transition:opacity .15s,stroke-width .15s}
.allocation-chart.has-highlight .allocation-segment:not(.is-highlighted){opacity:.4}
.allocation-segment.is-highlighted{stroke-width:28}.allocation-segment:focus-visible{outline:none;filter:drop-shadow(0 0 2px var(--ink));stroke-width:28}
.allocation-item.is-highlighted{background:var(--yellow)}.allocation-item:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
@media(prefers-reduced-motion:reduce){.allocation-segment{transition:none}}

.chart-tip dd.profit{color:var(--positive)}.chart-tip dd.loss{color:var(--negative)}

[data-theme=dark] .overview-etf-summary>div{border-color:#73716a}