.theme-control{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:#627689;margin:8px 0}.theme-control select{padding:8px 12px;min-height:36px}
.appearance-card .theme-control{display:inline-flex;flex-direction:row;align-items:center;white-space:nowrap;width:auto;gap:12px}.appearance-card .theme-control select{width:auto;min-width:128px;flex:none}
.change-module{padding-bottom:22px}.change-controls{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:0 24px 18px}.change-controls label{display:flex;align-items:center;gap:10px}.change-periods{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:0 24px}.change-period{display:grid;gap:8px;padding:16px;background:var(--blue-soft);border-radius:12px}.change-period strong{font-size:26px}.change-period small{font-size:14px}.change-conclusion{padding:20px 24px 0;font-size:20px}.change-module>.section-note{padding:0 24px}.change-body{display:grid;grid-template-columns:1.2fr 1fr;gap:28px;padding:0 24px}.change-body h4{margin:10px 0}.change-body small{color:var(--muted,#73849a)}.change-row{display:grid;grid-template-columns:90px 1fr auto;gap:10px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}.change-row>div{grid-column:1/-1;font-size:14px}.change-bar{height:10px;background:var(--blue-soft);border-radius:5px;overflow:hidden}.change-bar i{display:block;height:100%;border-radius:5px}.change-order{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 0;border-bottom:1px solid var(--line)}.change-order small{display:block;margin-top:6px}.change-order .x-drill{white-space:nowrap}.dashboard-slot>.panel{height:auto!important}.recent-panel .data-table td{padding:13px 18px}.recent-panel .data-table th{padding:12px 18px}.recent-panel .data-table th:last-child,.recent-panel .data-table td:last-child{display:none}.recent-panel .data-table tr[data-open]{cursor:pointer}.recent-panel{max-width:760px}
:root[data-theme=cream] :is(.x-drill,.x-drill:hover,.subtle,.data-table small,.data-table th,.metric-label svg,.trend-legend,.chart-mode button,.tabs button,.growth-chart-heading,.x-calendar-legend,.filter-scope,.period-switch button){color:#6c7d6c}
:root[data-theme=cream] .metric-label::after{display:none}
:root[data-theme=cream] :is(.data-table thead,.chart-mode,.period-switch){background:#f2f3ec}
:root[data-theme=cream] :is(button:hover,.data-table tbody tr:hover,.metric:hover){background-color:#edf2e9;border-color:#bdcdb8;color:#385642}
:root[data-theme=cream] :is(button:focus-visible,input:focus,select:focus){outline-color:#91ad94;border-color:#91ad94;box-shadow:0 0 0 3px #91ad941f}
:root[data-theme=cream] :is(.tabs button.active,.period-switch button.active,.chart-mode button[aria-pressed=true]){background:#e5eddf;color:#466a53}
@media(max-width:650px){.change-body{grid-template-columns:1fr}.change-periods{gap:10px;padding:0 16px}.change-period{padding:12px}.change-period strong{font-size:21px}.change-period small{font-size:12px}.change-controls,.change-body{padding-left:16px;padding-right:16px}.change-row{grid-template-columns:75px 1fr auto;font-size:15px}}
.dashboard-customize-head>.theme-control{flex-shrink:0;white-space:nowrap}
:root[data-theme=cream] .data-table th{background:#f2f3ec;color:#6c7d6c}
:root[data-theme=cream] .data-table tbody tr:hover{background:#edf2e9}
:root[data-theme=cream] .metric:hover{box-shadow:0 4px 12px #50674912;border-color:#bdcdb8}
.overview-calendar .month-share-ring:not(:has([data-ring-category])){display:none}
.dashboard-slot>.panel{height:auto}
:root[data-theme=cream]{--page:#f6f4ed;--ink:#293b32;--blue:#527e69;--blue-dark:#41674f;--blue-soft:#eaf0e6}
:root[data-theme=cream] :is(.x-calendar-note,.x-calendar-head small,.growth-note,.growth-range,.growth-head>span,.growth-summary>span,.growth-summary>p){color:#7b8776}
:root[data-theme=cream] .tabs button.active{border-bottom-color:#527e69}
.dashboard-customize-head{flex-wrap:wrap}.dashboard-customize-head>span{flex:1}.dashboard-customize>button{margin:10px 0}.card-library{margin:10px 0}.card-library>summary{cursor:pointer;padding:10px;font-weight:600}
.dashboard-slot{position:relative;min-width:0;align-self:stretch}.dashboard-slot>.metric{width:100%;height:100%;container-type:inline-size}.dashboard-slot>.panel{width:100%;max-width:100%;height:100%;margin:0;min-width:0}.dashboard-board>.dashboard-slot.wide{grid-column:1/-1;width:min(100%,1040px);justify-self:center}.dashboard-slot:has(.card-edit-tools){padding-top:32px}.card-edit-tools{position:absolute;inset:0 0 auto;display:flex;justify-content:space-between;height:30px;z-index:2}.card-edit-tools button{padding:2px 10px;min-width:34px;height:28px;justify-content:center;background:#fff;border:1px solid #d8e2e9;border-radius:7px}.drag-handle{cursor:grab;touch-action:none;user-select:none}.drag-origin{opacity:.25}.drag-ghost{z-index:9999;pointer-events:none;opacity:.9;box-shadow:0 10px 24px #142c3a22;border-radius:16px;overflow:hidden}.drag-ghost .card-edit-tools{display:none}
.dashboard-slot>.metric .metric-value{font-size:clamp(18px,16cqi,calc(30px * var(--ui-font-scale,1)))}
.overview-calendar .calendar-month-tile{position:relative;display:flex;align-items:stretch;justify-content:space-between;padding:12px;gap:6px}.overview-calendar .calendar-month-tile>span{display:flex;width:100%}.overview-calendar .calendar-month-tile strong{text-align:left;font-size:clamp(17px,18cqi,calc(23px * var(--ui-font-scale,1)));margin-top:auto;padding-right:0;z-index:1}.overview-calendar .calendar-month-tile small{text-align:left}.overview-calendar .month-share-ring{position:absolute;right:8px;top:37px;width:36px;height:36px;max-height:36px;opacity:.85}.overview-calendar .month-share-ring text{display:none}
.annual-mini-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;padding:0 22px 22px}.annual-mini-grid article{border:1px solid #e1e7ec;border-radius:12px;padding:16px;min-width:0}.annual-mini-grid h4{margin:0 0 8px}.annual-mini-grid article>strong{font-size:calc(22px * var(--ui-font-scale,1));color:#294862}.annual-mini-bars{height:115px;margin-top:18px;display:flex;gap:5px;padding-bottom:22px}.annual-mini-bars button{position:relative;min-width:0;flex:1;height:100%;display:flex;align-items:end;justify-content:center;padding:0;border:0;background:none;border-radius:0}.annual-mini-bars i{display:block;width:100%;background:#86b0c4;border-radius:3px;min-height:1px}.annual-mini-bars span{position:absolute;bottom:-21px;font-size:11px;color:#6f8291}.insight-list{display:grid;gap:10px;padding:0 22px 22px}.insight-item{display:grid;gap:7px;text-align:left;padding:15px;background:#f7f9fb;border:1px solid #e5ebf1;border-radius:11px;white-space:normal}.insight-item>span{font-size:calc(12px * var(--ui-font-scale,1));color:#62768b}.insight-item strong{font-size:calc(19px * var(--ui-font-scale,1));overflow-wrap:anywhere}.insight-item small{font-size:calc(11px * var(--ui-font-scale,1));color:#7a8b9e}
:root[data-theme=cream]{--line:#e4e4da;--line-soft:#eeeee6;--primary:#527e69;--text:#26392f;--muted:#788276;--bg:#f6f4ed}
:root[data-theme=cream] body{background:#f6f4ed;color:#293b32}
:root[data-theme=cream] :is(.topbar,.nav){background:#faf9f4;border-color:#e4e5da}
:root[data-theme=cream] :is(.panel,.metric,.dashboard-editor){background:#fffefb;border-color:#e6e6dc;box-shadow:0 3px 10px #364a2e04}
:root[data-theme=cream] :is(h1,h2,h3,h4,.metric-value,.insight-item strong,.annual-mini-grid article>strong){color:#263b30}
:root[data-theme=cream] :is(.primary,.nav [aria-current=page]){background:#527e69;color:#fff;border-color:#527e69}
:root[data-theme=cream] :is(.secondary,.icon-button,input,select,textarea){background:#fffefb;border-color:#dce0d5;color:#40584a}
:root[data-theme=cream] :is(.link-button,.order-link,.metric-label,.theme-control){color:#567561}
:root[data-theme=cream] :is(.tabs button.active,.chart-mode button[aria-pressed=true]){background:#eaf0e6;color:#466a53;border-color:#dce5d6}
:root[data-theme=cream] :is(.subtle,.section-note,.metric-foot,.panel-head small,.page-head p,.analysis-scope,.nav-note,.eyebrow,.chart-note,.change-empty){color:#778472}
:root[data-theme=cream] :is(.demo-strip,.brand-symbol,.growth-empty-note,.insight-item){background:#eef2e8;border-color:#dfe7d8;color:#526d59}
:root[data-theme=cream] .metric{position:relative;overflow:hidden;border-radius:15px;padding:23px;text-align:left}
:root[data-theme=cream] .metric::after{content:'';position:absolute;right:-22px;bottom:-27px;width:98px;height:98px;border-radius:50%;background:#e3eee6;pointer-events:none;opacity:.75}
:root[data-theme=cream] .dashboard-slot:nth-child(3n+1)>.metric::after{background:#e1edf2}
:root[data-theme=cream] .dashboard-slot:nth-child(3n)>.metric::after{background:#f2ecd9}
:root[data-theme=cream] .metric>*{position:relative;z-index:1}
:root[data-theme=cream] .metric-label{font-size:calc(13px * var(--ui-font-scale,1));font-weight:600;padding-right:18px}
:root[data-theme=cream] .metric-label::after{content:'↗';position:absolute;right:0;top:0;font-size:13px;padding:2px 5px;border-radius:5px;background:#edf3e8;color:#739783}
:root[data-theme=cream] .metric.featured .metric-value{color:#3f7256}
:root[data-theme=cream] .overview-calendar .calendar-month-tile{background:#fffefb;border-color:#e1e5d9;color:#344e3b}
:root[data-theme=cream] .overview-calendar .calendar-month-tile.is-current{background:#edf2e7;outline-color:#9bac94}
:root[data-theme=cream] .annual-mini-bars i{background:#8aae98}
.annual-mini-bars i,:root[data-theme=cream] .annual-mini-bars i{background:var(--annual-accent,#86aa96)}
:root[data-theme=cream] .finance-boot{background:#f6f4ed;color:#3e644d}
.overview-calendar .month-share-ring{width:52px;height:52px;max-height:52px;top:35px;right:8px}
@media(max-width:1000px){.dashboard-board>.dashboard-slot{max-width:760px;width:100%;justify-self:center}}
@media(max-width:600px){.dashboard-board>.dashboard-slot.wide{grid-column:auto}.dashboard-customize-head>span{flex-basis:100%;order:3}.annual-mini-grid{grid-template-columns:1fr}.card-edit-tools button{height:32px;min-width:40px}.dashboard-slot:has(.card-edit-tools){padding-top:36px}.overview-calendar .calendar-month-tile{padding:10px}.overview-calendar .calendar-month-tile strong{font-size:clamp(16px,17cqi,calc(22px * var(--ui-font-scale,1)))}.overview-calendar .month-share-ring{width:32px;height:32px;top:35px;right:7px}}
@media(max-width:600px){.overview-calendar .month-share-ring{width:46px;height:46px;max-height:46px;right:7px}}

/* Shared semantic colors: components consume these, themes define them. */
:root[data-theme=cream]{--ui-surface:#fffefb;--ui-surface-soft:#f3f4ed;--ui-selected:#e5eddf;--ui-border:#e1e5d9;--ui-focus:#91ad94;--ui-accent:#527e69;--ui-text:#293b32;--ui-muted:#74816f;--ui-on-accent:#fffefb;--ui-shadow-color:#364a2e12;--surface:var(--ui-surface);--surface-soft:var(--ui-surface-soft);--ink-strong:var(--ui-text)}
.change-controls label{white-space:nowrap}.change-controls input{width:190px}.change-row{padding:10px 0;gap:6px 10px}.change-body>section>small{display:block;margin-bottom:8px}.recent-panel tr[data-purchase-row]{cursor:pointer}
