#dividendMode { display: grid; gap: 20px; }
#dividendMode[hidden] { display: none; }
#dividendMode .panel { min-width: 0; padding: 24px; }
#dividendMode p, #dividendMode small { color: var(--muted, #68758a); }
#dividendMode p { line-height: 1.7; }
#dividendMode a { color: var(--accent); text-decoration: underline; }
.dividend-tag { border: 1px solid #9ed3ce; border-radius: 999px; padding: 6px 12px; white-space: nowrap; color: #0f8f8d; }
.dividend-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; padding: 0; list-style: none; counter-reset: steps; margin: 24px 0; }
.dividend-steps li { border-left: 3px solid #0f8f8d; padding-left: 12px; }
.dividend-steps strong, .dividend-steps span { display: block; }
.dividend-steps span { font-size: 13px; margin-top: 6px; color: var(--muted, #68758a); }
.dividend-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px 16px; margin: 20px 0; }
.dividend-field { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.dividend-field > span { font-size: 13px; font-weight: 600; }
.dividend-field input, .dividend-field select { width: 100%; min-width: 0; }
.dividend-field small { line-height: 1.5; font-size: 12px; }
.dividend-legs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin: 24px 0; }
.dividend-legs fieldset { min-width: 0; border: 1px solid var(--line); border-radius: 12px; padding: 0 16px; }
.dividend-legs legend { font-size: 15px; font-weight: 600; padding: 0 8px; }
.dividend-legs .dividend-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dividend-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 20px 0; }
.dividend-toolbar > span { color: var(--muted, #68758a); font-size: 13px; }
.dividend-quote, .dividend-note { background: rgba(15,143,141,.055); border-radius: 10px; padding: 14px 16px; overflow-wrap: anywhere; }
.dividend-checks { display: grid; gap: 14px; margin: 24px 0; }
.dividend-checks label { display: flex; align-items: flex-start; gap: 10px; }
.dividend-checks input { flex: 0 0 auto; margin-top: 3px; }
.dividend-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.dividend-metrics article { background: var(--panel); padding: 18px; min-width: 0; }
.dividend-metrics span { display: block; color: var(--muted, #68758a); font-size: 13px; }
.dividend-metrics strong { display: block; font-size: 22px; margin-top: 8px; overflow-wrap: anywhere; }
.dividend-metrics small { font-size: 12px; }
.dividend-saved { display: flex; justify-content: space-between; align-items: center; gap: 16px; border-top: 1px solid var(--line); padding: 16px 0; overflow-wrap: anywhere; }
#dividendMessage:empty { display: none; }
@media(max-width: 1000px) { .dividend-grid, .dividend-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dividend-legs { grid-template-columns: 1fr; } }
@media(max-width: 600px) { #dividendMode .panel { padding: 16px; } .dividend-grid, .dividend-legs .dividend-grid, .dividend-metrics { grid-template-columns: 1fr; } .dividend-saved { align-items: flex-start; flex-direction: column; } .dividend-toolbar button { flex: 1; } }

.dividend-watch-form { display: grid; grid-template-columns: 1fr 1fr 1fr auto; gap: 12px; align-items: end; margin: 20px 0; }
.dividend-watch-form button { align-self: end; }
.dividend-watch-list { margin: 12px 0 24px; }
.dividend-watch-list .dividend-saved p { margin: 3px 0; }
.dividend-event-card { border: 1px solid var(--line); border-radius: 14px; padding: 20px; margin: 18px 0 24px; background: linear-gradient(135deg, rgba(15,143,141,.055), rgba(255,255,255,.02)); }
.dividend-event-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.dividend-event-head h3 { margin: 6px 0; }
.dividend-event-head p { margin: 0; }
.dividend-tag.is-ready { border-color: #4ba56b; color: #267342; }
.dividend-event-metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin: 18px 0; }
.dividend-event-metrics article, .dividend-event-columns article { border: 1px solid var(--line); border-radius: 12px; padding: 14px; min-width: 0; background: var(--panel); }
.dividend-event-metrics span, .dividend-event-metrics small { display: block; color: var(--muted, #68758a); font-size: 12px; }
.dividend-event-metrics strong { display: block; margin: 7px 0; overflow-wrap: anywhere; }
.dividend-event-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.dividend-event-columns h4 { margin: 0 0 8px; }
.dividend-event-columns p, .dividend-event-columns ul { margin: 6px 0; font-size: 13px; }
.dividend-event-columns ul { padding-left: 20px; }
.dividend-event-source { margin: 14px 0 0; font-size: 12px; }
.dividend-official-timeline { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin: 18px 0 12px; }
.dividend-official-timeline div { border: 1px solid var(--line); border-radius: 12px; padding: 12px; background: var(--panel); min-width: 0; }
.dividend-official-timeline div.is-key { border-color: #0f8f8d; box-shadow: inset 0 0 0 1px rgba(15,143,141,.18); }
.dividend-official-timeline span, .dividend-official-timeline strong, .dividend-official-timeline small { display: block; }
.dividend-official-timeline span { color: #0f8f8d; font-size: 12px; font-weight: 700; }
.dividend-official-timeline strong { margin: 6px 0; }
.dividend-timing-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin: 22px 0 10px; }
.dividend-timing-head h4, .dividend-timing-head p { margin: 0; }
.dividend-timing-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.dividend-timing-grid article { border: 1px solid var(--line); border-radius: 12px; padding: 14px; background: var(--panel); min-width: 0; }
.dividend-timing-grid article.is-confirmed { border-left: 4px solid #0f8f8d; }
.dividend-timing-grid article.is-warning { border-left: 4px solid #d9902f; }
.dividend-timing-grid h4, .dividend-timing-grid p { margin: 0 0 7px; }
.dividend-timing-grid strong, .dividend-timing-grid small, .dividend-timing-grid a { display: block; }
.dividend-timing-grid small { min-height: 36px; }
.dividend-arbitrage-note { border-left: 4px solid #d9902f; background: rgba(217,144,47,.08); border-radius: 8px; padding: 12px 14px; }
@media(max-width: 900px) { .dividend-watch-form { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media(max-width: 900px) { .dividend-event-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dividend-event-columns, .dividend-timing-grid { grid-template-columns: 1fr; } .dividend-official-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media(max-width: 600px) { .dividend-watch-form, .dividend-event-metrics, .dividend-official-timeline { grid-template-columns: 1fr; } .dividend-event-head, .dividend-timing-head { flex-direction: column; } }