.dashboard-content { width: min(1320px, 100%); }
.dashboard-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.dashboard-heading h1 { margin: 0; font-size: clamp(34px, 4vw, 54px); line-height: 1; letter-spacing: -.05em; }
.dashboard-copy { margin: 12px 0 0; color: var(--muted); }
.dashboard-controls { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.dashboard-select { min-height: 42px; padding: 0 36px 0 12px; border: 1px solid var(--line); border-radius: 10px; color: var(--text); background: var(--surface); font-weight: 750; }
.dashboard-grid { --dashboard-primary: #79ba56; --dashboard-secondary: #dfb655; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.dashboard-grid.company-2 { --dashboard-primary: #ed671b; --dashboard-secondary: #651317; }
.dashboard-grid.company-all { --dashboard-primary: #79ba56; --dashboard-secondary: #ed671b; }
.dashboard-card { min-width: 0; min-height: 205px; display: flex; flex-direction: column; padding: 18px; border: 1px solid var(--line); border-radius: 22px; background: var(--surface); box-shadow: 0 12px 26px rgba(0,0,0,.08); }
.company-all .dashboard-card { border-color: transparent; background: linear-gradient(#fff,#fff) padding-box, linear-gradient(135deg, rgba(121,186,86,.35), rgba(237,103,27,.32)) border-box; border-width: 1px; }
.dashboard-card-title { margin: 0; color: var(--muted); font-size: 12px; font-weight: 650; letter-spacing: .1em; text-transform: uppercase; }
.dashboard-periods { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.dashboard-period-label { color: var(--muted); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.dashboard-value { display: block; margin-top: 3px; font-size: 28px; font-weight: 900; letter-spacing: -.04em; }
.dashboard-count-line { display: flex; align-items: baseline; gap: 5px; }
.dashboard-unit { color: var(--muted); font-weight: 800; }
.dashboard-amount { display: block; margin-top: 1px; font-size: 12px; font-weight: 850; }
.dashboard-spark { margin-top: auto; padding-top: 12px; }
.dashboard-spark svg { width: 100%; height: 44px; display: block; }
.dashboard-spark-line { fill: none; stroke: var(--dashboard-primary); stroke-width: 2.4; }
.dashboard-spark-area { fill: color-mix(in srgb, var(--dashboard-primary) 16%, transparent); }
.dashboard-spark-dot { fill: var(--dashboard-secondary); }
.dashboard-card-loading { height: 62px; display: grid; place-items: center; margin: 30px 0; border-radius: 12px; color: var(--muted); background: var(--surface-soft); animation: dashboard-pulse 1.1s ease-in-out infinite alternate; }
@keyframes dashboard-pulse { from { opacity: .55; } to { opacity: 1; } }
.dashboard-card-error { margin: 28px 0 12px; color: #8a3030; }
.dashboard-retry { align-self: flex-start; min-height: 36px; padding: 0 12px; border: 1px solid #e4bcbc; border-radius: 8px; color: #8a3030; background: #fff5f5; cursor: pointer; }
.dashboard-fallback { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 20px; padding: 18px 20px; border: 1px dashed #cbd3c9; border-radius: 14px; background: rgba(255,255,255,.58); }
.dashboard-fallback p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }
.dashboard-fallback .secondary-action { margin-top: 0; white-space: nowrap; }
@media (max-width: 820px) { .dashboard-heading { align-items: flex-start; flex-direction: column; } .dashboard-controls { justify-content: flex-start; } .dashboard-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .dashboard-periods { gap: 6px; } .dashboard-value { font-size: 23px; } .dashboard-amount { font-size: 10px; } .dashboard-fallback { align-items: flex-start; flex-direction: column; } }
@media (prefers-reduced-motion: reduce) { .dashboard-card-loading { animation: none; } }
