.dividends-page { display: grid; gap: 18px; color: var(--text); }
.dividends-page.hidden { display: none; }
.dv-overview { padding: 26px 28px 0; }
.dv-heading, .dv-actions, .dv-filter-row, .dv-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.dv-kicker { color: var(--cobalt); font-size: 12px; font-weight: 600; }
.dv-heading h2 { margin: 7px 0; font-size: 24px; font-weight: 620; }
.dv-heading p, .dv-section-heading p { color: var(--muted); font-size: 12px; line-height: 1.5; margin: 4px 0 0; }
.dv-actions { justify-content: flex-end; flex-wrap: wrap; gap: 8px; }
.dv-actions button { white-space: nowrap; min-height: 40px; }
.dv-filter-row { margin-top: 24px; padding: 15px 0; border-top: 1px solid var(--border); }
.dv-filter-row label { display: flex; align-items: center; gap: 14px; font-size: 12px; color: var(--muted); }
.dv-filter-row select { min-width: 210px; max-width: 320px; }
.dv-note { color: var(--muted); font-size: 12px; }
.dv-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border-top: 1px solid var(--border); padding: 22px 0 26px; }
.dv-metrics > div { padding: 0 22px; border-left: 1px solid var(--border); min-width: 0; }
.dv-metrics > div:first-child { padding-left: 0; border-left: 0; }
.dv-metrics span { display: block; font-size: 12px; color: var(--muted); }
.dv-metrics strong { display: block; font-size: clamp(18px,1.65vw,26px); font-weight: 620; margin: 10px 0 8px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.dv-metrics small { font-size: 11px; color: var(--muted); }
.dv-analytics { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.dv-shares, .dv-comparison { padding: 24px 28px; }
.dv-section-heading h3 { font-size: 16px; font-weight: 620; margin: 0; }
.dv-section-heading > span { color: var(--muted); font-size: 11px; white-space: nowrap; }
.dv-share-content { display: flex; align-items: center; gap: 26px; margin: 26px 0; }
.dv-donut { width: 146px; height: 146px; flex-shrink: 0; border-radius: 50%; background: conic-gradient(var(--cobalt) 0 44.6%, white 44.6% 45%, var(--graphite) 45% 72.1%, white 72.1% 72.5%, #91a5bb 72.5% 99.6%, white 99.6%); display: grid; place-items: center; }
.dv-donut > div { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 112px; height: 112px; border-radius: 50%; background: var(--white); }
.dv-donut strong { font-size: 28px; font-weight: 620; }
.dv-donut strong span { font-size: 17px; margin-left: 2px; }
.dv-donut small { color: var(--muted); font-size: 10px; margin-top: 5px; }
.dv-legend { display: grid; gap: 21px; flex: 1; }
.dv-legend > div { display: grid; grid-template-columns: 7px 1fr auto; gap: 9px; align-items: center; font-size: 11px; }
.dv-legend b { font-size: 12px; font-weight: 600; }
.dv-dot { width: 7px; height: 7px; border-radius: 50%; }
.dv-person-0 { background: var(--cobalt); }
.dv-person-1 { background: var(--graphite); }
.dv-person-2 { background: #91a5bb; }
.dv-share-footer { border-top: 1px solid var(--border); padding-top: 16px; display: grid; grid-template-columns: 1fr auto; gap: 10px; font-size: 12px; }
.dv-share-footer > span { color: var(--muted); }
.dv-share-footer progress { grid-column: 1/-1; width: 100%; height: 5px; border: 0; border-radius: 5px; appearance: none; }
.dv-share-footer progress::-webkit-progress-bar { background: var(--page); border-radius: 5px; }
.dv-share-footer progress::-webkit-progress-value { background: var(--cobalt); border-radius: 5px; }
.dv-key-plan, .dv-key-fact { display: inline-block; width: 8px; height: 8px; margin: 0 5px 0 10px; background: var(--border); border-radius: 2px; }
.dv-key-fact { background: var(--cobalt); }
.dv-chart-person { margin-top: 27px; }
.dv-chart-person > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 12px; font-size: 12px; }
.dv-chart-person strong { font-weight: 550; }
.dv-chart-person small { color: var(--muted); font-size: 11px; }
.dv-bar { height: 17px; display: grid; align-content: space-between; }
.dv-bar span { display: block; height: 5px; border-radius: 2px; }
.dv-plan-bar { background: var(--border); }
.dv-register { overflow: hidden; }
.dv-register > .dv-section-heading { padding: 22px 28px; }
.dv-table-wrap { overflow-x: auto; }
.dv-table { width: 100%; border-collapse: collapse; font-size: 12px; font-variant-numeric: tabular-nums; text-align: left; }
.dv-table th { color: var(--muted); font-weight: 500; background: var(--panel); font-size: 11px; }
.dv-table th, .dv-table td { padding: 16px 18px; border-top: 1px solid var(--border); }
.dv-table th:first-child, .dv-table td:first-child { padding-left: 28px; }
.dv-table th:last-child, .dv-table td:last-child { padding-right: 28px; }
.dv-table strong { font-weight: 550; }
.dv-table td:not(:first-child) { white-space: nowrap; }
.dv-table tbody tr:hover { background: var(--panel); }
.dv-participant { display: flex; align-items: center; gap: 10px; }
.dv-avatar { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; color: white; font-size: 11px; flex-shrink: 0; }
.dv-avatar.dv-person-2 { color: var(--sidebar-deep); }
.dv-status { display: inline-block; padding: 5px 8px; border-radius: 5px; background: var(--page); font-size: 11px; }
.dv-due { color: var(--cobalt); background: #edf4fc; }
.dv-overpaid, .dv-warning-text { color: #9a5910; }
.dv-overpaid { background: #fff6e8; }
.dv-balanced { color: var(--muted); }
.dv-cell-note { display: block; color: var(--muted); font-size: 11px; line-height: 1.5; margin-top: 5px; white-space: normal; overflow-wrap: anywhere; max-width: 440px; }
.dv-payments td:nth-child(3) { white-space: normal; min-width: 200px; }
.dv-payments td:nth-child(4), .dv-payments th:nth-child(4) { text-align: right; }
.dv-count { color: var(--muted); font-weight: 400; margin-left: 5px; }
.dv-source-label { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--muted); }
.dv-notice { display: flex; justify-content: space-between; align-items: center; gap: 20px; border: 1px solid var(--border); background: #edf4fc; border-radius: 10px; padding: 14px 22px; font-size: 12px; }
.dv-notice strong { font-weight: 550; }
.dv-notice small { display: block; color: var(--muted); margin-top: 5px; font-size: 11px; }
.dv-notice button { white-space: nowrap; }
.dv-pending { display: flex; justify-content: space-between; gap: 16px; padding: 15px 28px; border-top: 1px solid var(--border); font-size: 12px; }
.dv-pending strong { font-weight: 500; color: #9a5910; }
.dv-empty { padding: 32px; text-align: center; color: var(--muted); font-size: 13px; }
.dv-empty h3 { color: var(--text); font-weight: 600; }
.dv-empty p { line-height: 1.6; }
.dv-period-note { margin: 0; color: var(--muted); font-size: 12px; white-space: pre-wrap; }
.dv-dialog { width: min(590px, calc(100vw - 32px)); padding: 0; max-height: calc(100dvh - 40px); border: 1px solid var(--border); border-radius: 14px; color: var(--text); box-shadow: var(--shadow); }
.dv-dialog::backdrop { background: rgb(17 26 40 / 40%); }
.dv-dialog form { display: block; }
.dv-dialog .dialog-header { padding: 24px; border-bottom: 1px solid var(--border); }
.dv-dialog .dialog-header p { color: var(--cobalt); margin: 0 0 5px; font-size: 12px; }
.dv-dialog .dialog-header h2 { font-size: 21px; font-weight: 620; margin: 0; }
.dv-form-body { padding: 24px; display: grid; gap: 18px; }
.dv-dialog .form-grid { grid-template-columns: 1fr 1fr; }
.dv-dialog .dialog-actions { padding: 18px 24px; border-top: 1px solid var(--border); }
.dv-dialog .field input, .dv-dialog .field select, .dv-dialog .field textarea { width: 100%; box-sizing: border-box; }
.dv-form-note { font-size: 12px; color: var(--muted); margin: 0; line-height: 1.6; }
.dv-preview { background: var(--panel); padding: 16px; border: 1px solid var(--border); border-radius: 8px; font-size: 12px; }
.dv-preview > strong { display: block; margin-bottom: 16px; }
.dv-preview > div { display: flex; justify-content: space-between; gap: 16px; margin-top: 12px; }
.dv-preview b { font-weight: 600; white-space: nowrap; }
.dv-form-error { color: var(--critical); font-size: 12px; line-height: 1.5; margin: 0; }
.dv-form-error:empty { display: none; }
.dividends-page button:focus-visible, .dv-dialog button:focus-visible { outline: 2px solid var(--cobalt); outline-offset: 3px; }
@media(max-width:1200px) { .dv-analytics { grid-template-columns: 1fr; } .dv-share-content { justify-content: flex-start; } .dv-legend { max-width: 440px; } .dv-heading { align-items: flex-start; flex-direction: column; } .dv-metrics > div { padding: 0 12px; } }
@media(max-width:700px) {
 .dv-overview { padding: 20px 18px 0; } .dv-heading h2 { font-size: 21px; } .dv-actions { justify-content: flex-start; } .dv-actions button { min-height: 44px; }
 .dv-filter-row { align-items: flex-start; flex-direction: column; gap: 12px; } .dv-filter-row label { flex-direction: column; align-items: flex-start; width: 100%; gap: 8px; } .dv-filter-row select { width: 100%; max-width: none; }
 .dv-metrics { grid-template-columns: 1fr 1fr; gap: 20px 0; } .dv-metrics > div:nth-child(3) { border-left: 0; padding-left: 0; } .dv-metrics small { line-height: 1.5; display: block; } .dv-metrics strong { font-size: 21px; }
 .dv-shares, .dv-comparison { padding: 20px 18px; } .dv-share-content { flex-direction: column; gap: 22px; } .dv-legend { width: 100%; gap: 16px; }
 .dv-section-heading { flex-wrap: wrap; gap: 12px; } .dv-register > .dv-section-heading { padding: 20px 18px; } .dv-chart-person > div:first-child { flex-wrap: wrap; }
 .dv-notice { padding: 16px 18px; align-items: flex-start; flex-direction: column; gap: 12px; } .dv-notice button { white-space: normal; text-align: left; min-height: 44px; }
 .dv-table th, .dv-table td { padding: 14px; } .dv-table th:first-child, .dv-table td:first-child { padding-left: 18px; } .dv-participant { min-width: 160px; }
 .dv-pending { padding: 15px 18px; flex-direction: column; gap: 8px; } .dv-dialog .form-grid { grid-template-columns: 1fr; } .dv-form-body { padding: 18px; } .dv-dialog .dialog-header { padding: 18px; }
 .dv-dialog button { min-height: 44px; } .dv-preview > div { flex-wrap: wrap; gap: 6px; }
}
.dv-dialog .dialog-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.dv-dialog .dialog-header .icon-button { flex-shrink: 0; width: 36px; height: 36px; min-height: 36px; }
.dv-dialog .field textarea { padding: 12px; border: 1px solid var(--border); border-radius: 8px; font: inherit; font-size: 13px; line-height: 1.5; color: var(--text); resize: vertical; }

.dv-balancing { overflow: hidden; }
.dv-balancing > .dv-section-heading { padding: 24px 28px 18px; }
.dv-balancing .dv-kicker { display: block; margin-bottom: 8px; }
.dv-balancing-periods { margin: 0 28px 20px; padding: 0; border: 0; }
.dv-balancing-periods legend { color: var(--muted); font-size: 12px; margin-bottom: 12px; }
.dv-period-choices { display: flex; flex-wrap: wrap; gap: 8px; }
.dv-period-choices label { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 8px; font-size: 12px; cursor: pointer; }
.dv-period-choices label:has(input:checked) { background: #edf4fc; border-color: var(--cobalt); color: var(--cobalt); }
.dv-period-choices input { width: 16px; height: 16px; margin: 0; accent-color: var(--cobalt); flex-shrink: 0; }
.dv-period-choices label:focus-within { outline: 2px solid var(--cobalt); outline-offset: 2px; }
.dv-balancing-periods > button { margin-top: 8px; }
.dv-balancing-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0 28px; padding-bottom: 20px; }
.dv-balancing-metrics > div:first-child strong, .dv-receive { color: var(--cobalt); }
.dv-balancing-explanation { margin: 0 28px 20px; padding: 14px 16px; background: var(--panel); border: 1px solid var(--border); border-radius: 8px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.dv-balancing-footnote { margin: 0; padding: 18px 28px 22px; color: var(--muted); font-size: 11px; line-height: 1.6; }
.dv-balancing-table th, .dv-balancing-table td { padding-left: 14px; padding-right: 14px; }
@media(max-width:700px) {
  .dv-balancing > .dv-section-heading { padding: 20px 18px 18px; }
  .dv-balancing-periods { margin: 0 18px 20px; }
  .dv-period-choices label { min-height: 44px; box-sizing: border-box; }
  .dv-balancing-metrics { grid-template-columns: 1fr; margin: 0 18px; gap: 20px; }
  .dv-balancing-metrics > div { padding: 0; border: 0; }
  .dv-balancing-explanation { margin: 0 18px 20px; }
  .dv-balancing-footnote { padding: 18px; }
}
#dvBalancingBlock { min-width: 0; }
.dv-period-choices label span { overflow-wrap: anywhere; }
