.dn-app{--dn-positive:#087f5b;--dn-negative:#b42335;--dn-profit-bg:#e6f7ef;--dn-loss-bg:#fff0f1;--dn-blue:#194ca1;--dn-gold:#865b00;--dn-hk:#a72335;--dn-sg:#086a60;--dn-cn:#6536ac;--dn-chart:#2969cb;font-variant-numeric:tabular-nums}
:root[data-theme="dark"] .dn-app{--dn-positive:#5de4b1;--dn-negative:#ffa3ae;--dn-profit-bg:#123d35;--dn-loss-bg:#49222d;--dn-blue:#a8c9ff;--dn-gold:#ffda83;--dn-hk:#ffb2bf;--dn-sg:#82e1d1;--dn-cn:#d6b7ff;--dn-chart:#6eaaff}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .dn-app{--dn-positive:#5de4b1;--dn-negative:#ffa3ae;--dn-profit-bg:#123d35;--dn-loss-bg:#49222d;--dn-blue:#a8c9ff;--dn-gold:#ffda83;--dn-hk:#ffb2bf;--dn-sg:#82e1d1;--dn-cn:#d6b7ff;--dn-chart:#6eaaff}}
.dn-app .tool-hero{padding-bottom:12px}.dn-app .section{scroll-margin-top:90px}.dn-notice{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;border:1px solid var(--border);border-radius:12px;padding:12px 16px;background:var(--surface);font-size:.875rem}.dn-notice p{margin:0}.dn-notice p:first-child{color:var(--text-2)}.dn-navigation{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0 28px}.dn-navigation .chip{min-height:44px;display:inline-flex;align-items:center}.dn-section-head,.dn-fx-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.dn-section-head{margin-bottom:16px}.dn-section-head h2{margin:0;font-size:1.35rem}.dn-fx-head{margin-top:16px}.dn-toolbar{margin-bottom:16px}.dn-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.dn-fields{border:0;padding:0;margin:0;min-width:0}.dn-preferences{margin-top:12px}.dn-preferences form{padding-top:16px}.dn-app summary{cursor:pointer;min-height:44px;padding:10px 0;font-weight:650}.dn-app details>p{margin-top:10px}.dn-subtle{color:var(--text-2);font-size:.875rem;line-height:1.6}.dn-label{display:block;color:var(--text-2);font-size:.875rem;font-weight:600;margin-bottom:6px}.dn-actions{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}.dn-rate-list{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.dn-rate{padding:8px 12px;border-radius:8px;background:var(--surface-2);font-size:.875rem}.dn-dashboard{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;margin-bottom:16px}.dn-big-number{font-size:clamp(1.7rem,3.6vw,2.6rem);letter-spacing:-.035em;line-height:1.25;overflow-wrap:anywhere;display:block}.dn-change{font-size:.95rem;font-weight:650;line-height:1.6}.dn-positive{color:var(--dn-positive)}.dn-negative{color:var(--dn-negative)}.dn-divider{height:1px;background:var(--border);margin:18px 0}.dn-metric strong{font-size:1.2rem;display:block;overflow-wrap:anywhere}.dn-market-counts{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.dn-badge,.dn-market-tag{border-radius:6px;padding:3px 7px;background:var(--surface-2);font-size:.75rem;font-weight:700}.dn-annual{padding-top:18px;border-top:1px solid var(--border);margin-top:18px}.dn-goal-panel{display:flex;flex-direction:column;justify-content:center}.dn-goal-panel h3{font-size:1.1rem;margin:0 0 24px}.dn-goal{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.dn-goal-ring{--progress:0%;width:112px;height:112px;border-radius:50%;background:conic-gradient(var(--dn-chart) var(--progress),var(--surface-2) 0);display:grid;place-items:center;position:relative;flex:none}.dn-goal-ring::before{content:"";position:absolute;inset:9px;background:var(--surface);border-radius:50%}.dn-goal-ring strong{position:relative;font-size:1.35rem;color:var(--text)}.dn-goal-income{font-size:1.4rem;overflow-wrap:anywhere}.dn-goal p{margin:4px 0 8px;color:var(--text-2)}.dn-chart-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.dn-chart-toolbar p{margin:0}.dn-chart{display:flex;gap:clamp(3px,1vw,14px);height:245px;padding:24px 0 8px;align-items:stretch;margin:18px 0;border-bottom:1px solid var(--border)}.dn-chart-column{min-width:0;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px}.dn-bar-value,.dn-axis{font-size:clamp(.62rem,1vw,.78rem);color:var(--text-2);white-space:nowrap}.dn-bar-value{font-weight:650}.dn-chart-track{height:165px;width:100%;display:flex;align-items:flex-end;justify-content:center;background:linear-gradient(to top,var(--border) 1px,transparent 1px);background-size:100% 25%}.dn-chart-bar{width:min(100%,36px);border-radius:5px 5px 0 0;background:var(--dn-chart);min-height:2px}.dn-bar-negative{background:var(--dn-negative)}.dn-holding-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.dn-stock-card{text-align:left;border:1px solid var(--border);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:8px;color:var(--text);background:var(--surface-2);min-width:0;cursor:pointer;transition:box-shadow .18s,border-color .18s}.dn-stock-card:hover{border-color:var(--brand);box-shadow:var(--shadow-md)}.dn-stock-gain{background:var(--dn-profit-bg);border-color:color-mix(in srgb,var(--dn-positive) 38%,var(--border))}.dn-stock-loss{background:var(--dn-loss-bg);border-color:color-mix(in srgb,var(--dn-negative) 38%,var(--border))}.dn-stock-gain .dn-card-change{color:var(--dn-positive)}.dn-stock-loss .dn-card-change{color:var(--dn-negative)}.dn-card-head{display:flex;justify-content:space-between;align-items:center;gap:8px}.dn-card-head strong{font-size:1.05rem;overflow-wrap:anywhere;min-width:0}.dn-stock-name{font-size:.8rem;color:var(--text-2);overflow-wrap:anywhere}.dn-card-price{display:block;font-size:1.1rem;line-height:1.4;overflow-wrap:anywhere}.dn-card-change{font-size:.9rem;font-weight:700;overflow-wrap:anywhere;margin-top:auto}.dn-card-detail,.dn-card-date{font-size:.8rem;line-height:1.5;color:var(--text-2);overflow-wrap:anywhere}.dn-entry,.dn-ledger{margin-top:16px}.dn-entry form{margin-top:16px}.dn-income-totals{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:20px}.dn-income-total{padding:16px;border:1px solid var(--border);border-radius:14px;background:var(--surface)}.dn-income-total strong{font-size:1.3rem;overflow-wrap:anywhere;display:block}.dn-income-base strong{color:var(--dn-positive)}.dn-market-MY{--market-accent:var(--dn-gold)}.dn-market-US{--market-accent:var(--dn-blue)}.dn-market-HK{--market-accent:var(--dn-hk)}.dn-market-SG{--market-accent:var(--dn-sg)}.dn-market-CN{--market-accent:var(--dn-cn)}.dn-income-total:not(.dn-income-base) strong{color:var(--market-accent)}.dn-month-group{margin-bottom:16px}.dn-month-heading{display:flex;gap:12px;align-items:center;flex-wrap:wrap;list-style:none}.dn-month-heading::before{content:"▾";color:var(--text-2)}.dn-month-group:not([open]) .dn-month-heading::before{content:"▸"}.dn-month-heading .dn-subtle{margin-left:auto}.dn-dividend-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding-top:14px}.dn-dividend-card{background:color-mix(in srgb,var(--market-accent) 8%,var(--surface));border:1px solid color-mix(in srgb,var(--market-accent) 32%,var(--border));border-top:3px solid var(--market-accent);padding:14px;border-radius:12px;display:flex;flex-direction:column;gap:8px;min-width:0}.dn-row-actions{display:flex;flex-wrap:wrap;gap:8px}.dn-row-actions button{min-height:44px;padding:8px 10px;font-size:.8rem}.dn-empty{padding:24px;text-align:center;color:var(--text-2);grid-column:1/-1}.dn-currency{font-weight:700;color:var(--brand)}.dn-error{color:var(--danger)!important}[hidden]{display:none!important}#journalStatus{overflow-wrap:anywhere}
#restoreDialog,#holdingDialog{max-width:740px;width:calc(100% - 32px);max-height:90vh;overflow:auto;padding:24px;border:1px solid var(--border);border-radius:18px;background:var(--surface);color:var(--text)}#restoreDialog::backdrop,#holdingDialog::backdrop{background:rgba(15,23,42,.6)}#holdingDialog form{margin-bottom:18px}#holdingDialog .dn-row-actions{flex-wrap:nowrap}.dn-app button:focus-visible,.dn-app summary:focus-visible{outline:3px solid var(--brand);outline-offset:4px}.dn-app .seg button{min-height:44px}
@media(max-width:1000px){.dn-holding-grid,.dn-dividend-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:700px){.dn-dashboard{grid-template-columns:1fr}.dn-holding-grid,.dn-dividend-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dn-app .panel{padding:18px}.dn-card-price{font-size:1rem}.dn-goal-income{font-size:1.25rem}.dn-chart-toolbar{align-items:flex-start}.dn-navigation{gap:6px}.dn-navigation .chip{padding:8px 10px}.dn-section-head .btn{font-size:.875rem}.dn-month-heading .dn-subtle{margin-left:0}.dn-stock-card{padding:13px}.dn-chart{height:225px}}@media(max-width:420px){.dn-toolbar .dn-grid,.dn-entry .dn-grid,#holdingDialog .dn-grid{grid-template-columns:1fr}.dn-income-totals{grid-template-columns:repeat(2,minmax(0,1fr))}.dn-income-total{padding:12px}.dn-income-total strong{font-size:1.08rem}.dn-stock-card{padding:11px}.dn-card-detail,.dn-card-date{font-size:.75rem}}
@media(prefers-reduced-motion:reduce){.dn-stock-card{transition:none}.dn-app{scroll-behavior:auto}}
.dn-recovery{padding:20px;border:1px solid var(--brand);border-radius:16px;background:var(--surface);margin-bottom:20px}.dn-recovery h3{margin:0 0 8px}.dn-recovery p{color:var(--text-2);font-size:.9rem;line-height:1.6}.dn-recovery .field{max-width:640px}

/* Keep chronological monthly bars readable on narrow screens. */
.dn-chart-scroll{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain}
.dn-chart{min-width:640px;gap:12px;height:245px}
.dn-chart-column{min-width:44px}
.dn-chart-track{position:relative;display:block;flex:none;height:165px;padding:0;border:0;border-radius:0;cursor:pointer;background-color:transparent}
.dn-chart-track::after{content:"";position:absolute;left:0;right:0;bottom:var(--zero,0%);height:1px;background:var(--text-2)}
.dn-chart-bar{position:absolute;display:block;min-height:0;width:40%;max-width:24px;border-radius:4px 4px 0 0}
.dn-bar-received{left:6%}.dn-bar-expected{right:6%;background:repeating-linear-gradient(135deg,#b97714,#b97714 4px,#d59a37 4px,#d59a37 7px)}
.dn-bar-negative{background:var(--dn-negative);border-radius:0 0 4px 4px}
.dn-bar-value,.dn-axis{font-size:.78rem}
.dn-chart-legend{display:flex;gap:20px;flex-wrap:wrap;font-size:.875rem;margin-top:14px}
.dn-chart-legend span{display:flex;align-items:center;gap:7px}.dn-chart-legend span::before{content:"";width:14px;height:14px;border-radius:3px;background:var(--dn-chart)}
.dn-chart-legend .dn-legend-expected::before{background:repeating-linear-gradient(135deg,#b97714,#b97714 4px,#d59a37 4px,#d59a37 7px)}
.dn-auto{display:flex;gap:10px;align-items:center;min-height:44px;cursor:pointer}.dn-auto input{width:20px;height:20px;flex:none}
.dn-market-panel h2{margin-top:0;font-size:1.35rem}.dn-market-panel details{margin-top:14px}.dn-market-panel .field{max-width:620px}
.dn-stock-search{padding:16px;background:var(--surface-2);border-radius:12px;margin:12px 0 20px}.dn-stock-search .field{margin-bottom:10px}
.dn-search-results{display:grid;gap:8px}.dn-search-results .btn{text-align:left;white-space:normal;justify-content:flex-start;overflow-wrap:anywhere}
.dn-navigation{position:sticky;top:64px;z-index:5;padding:10px 0;background:var(--bg);border-bottom:1px solid var(--border);flex-wrap:nowrap}
.dn-navigation [role="tab"]{flex:1;justify-content:center;cursor:pointer;border:1px solid var(--border);background:var(--surface);color:var(--text);font:inherit}
.dn-navigation [aria-selected="true"]{background:var(--brand);color:#fff;border-color:var(--brand);font-weight:700}
.dn-filter-bar{max-width:540px;margin-bottom:22px}.dn-first{max-width:640px;margin:24px auto;text-align:center}.dn-first .dn-actions{justify-content:center}
.dn-quick{grid-template-columns:1fr 1fr}.dn-quick .dn-big-number{font-size:1.8rem}.dn-settlement{margin:16px 0}
#csvResult{margin-top:16px}#csvResult .table-scroll{max-height:420px;overflow:auto}#csvBalances input{min-width:120px}
#tradeRows .btn{min-height:44px;margin:3px}#view-settings .dn-toolbar .dn-grid{max-width:540px}#tradePreview{min-height:1.5em}
@media(max-width:600px){.dn-navigation{gap:4px;top:58px}.dn-navigation .chip{font-size:.8rem;padding:8px 4px}.dn-quick{grid-template-columns:1fr}.dn-quick .panel{padding:16px}.dn-filter-bar{gap:10px}}
