.dashboard-shell { display:grid; gap:24px; max-width:1440px; margin:0 auto; padding:4px 0 36px; color:var(--starter-text,#172033); }
.dashboard-topbar,.dashboard-section,.dashboard-attention,.dashboard-priority,.dashboard-subscription-alert { border:1px solid var(--starter-border,#dbe3ec); border-radius:14px; background:var(--starter-card,#fff); }
.dashboard-topbar { display:grid; grid-template-columns:minmax(240px,1fr) auto; gap:18px 28px; padding:24px; box-shadow:0 4px 18px rgba(15,23,42,.04); }
.dashboard-title-group h1,.dashboard-section h2,.dashboard-priority h2 { margin:0; color:var(--starter-text,#172033); font-size:clamp(22px,2.4vw,30px); font-weight:700; letter-spacing:-.02em; }
.dashboard-company-name { margin:5px 0 0; color:var(--starter-muted,#64748b); font-size:15px; }
.dashboard-eyebrow { margin:0 0 5px; color:var(--starter-primary,#123b67); font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.dashboard-plan-badge,.dashboard-mode-badge { display:inline-flex; margin-top:9px; padding:4px 8px; border-radius:999px; background:var(--starter-surface-soft,#f4f7fb); color:var(--starter-muted,#64748b); font-size:12px; font-weight:600; }
.dashboard-filters { display:flex; flex-wrap:wrap; align-items:end; justify-content:end; gap:10px; }
.dashboard-filters label { display:grid; gap:5px; color:var(--starter-muted,#64748b); font-size:12px; font-weight:600; }
.dashboard-period-workspace { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:15px 18px; border:1px solid #c9d9e8; border-radius:14px; background:linear-gradient(100deg,#f4f9fe,#fff); }
.dashboard-period-workspace > div:first-child { display:grid; gap:3px; }.dashboard-period-workspace strong { color:var(--starter-primary,#123b67); font-size:17px; }.dashboard-period-meta { margin:0; color:var(--starter-muted,#64748b); font-size:12px; }
.dashboard-period-presets { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; }.dashboard-period-preset { border:1px solid var(--starter-border,#dbe3ec); border-radius:999px; background:#fff; color:var(--starter-muted,#64748b); padding:6px 9px; font:inherit; font-size:12px; font-weight:600; cursor:pointer; }.dashboard-period-preset:hover,.dashboard-period-preset:focus-visible,.dashboard-period-preset.is-active { border-color:var(--starter-primary,#123b67); background:#edf5fc; color:var(--starter-primary,#123b67); outline:none; }
.dashboard-quick-actions { display:flex; grid-column:1/-1; flex-wrap:wrap; gap:10px; padding-top:4px; border-top:1px solid var(--starter-border,#dbe3ec); }
.dashboard-alert { margin:0; }.dashboard-subscription-alert { padding:13px 16px; border-color:var(--starter-warning,#d97706); background:#fff9ed; color:#7c4700; font-size:14px; }
.dashboard-attention { display:flex; align-items:center; gap:18px; padding:14px 16px; }.dashboard-attention h2 { margin:0; flex:0 0 auto; font-size:16px; font-weight:700; }.dashboard-attention-list { display:flex; flex:1; flex-wrap:wrap; gap:10px; }
.dashboard-attention-item { display:flex; align-items:baseline; gap:6px; min-width:145px; padding:8px 10px; border-radius:9px; color:inherit; text-decoration:none; }.dashboard-attention-item strong { font-size:18px; }.dashboard-attention-item span { font-size:13px; }.dashboard-attention-item.primary { background:#eff6ff; color:var(--starter-primary,#123b67); }.dashboard-attention-item.warning { background:#fff7e6; color:#8a5200; }.dashboard-attention-item.danger { background:#fff1f1; color:var(--starter-danger,#b91c1c); }
.dashboard-priority { display:grid; grid-template-columns:42px minmax(0,1fr) auto; align-items:center; gap:16px; padding:20px 22px; border-left:4px solid var(--starter-primary,#123b67); }.dashboard-priority-icon { display:grid; width:42px; height:42px; place-items:center; border-radius:50%; background:#edf7f1; color:var(--starter-success,#047857); }.dashboard-priority-icon.is-urgent { background:#fff1f1; color:var(--starter-danger,#b91c1c); }.dashboard-priority p:not(.dashboard-eyebrow) { margin:4px 0 0; color:var(--starter-muted,#64748b); font-size:14px; }
.dashboard-section { padding:22px; }.dashboard-panel { min-width:0; }.dashboard-section-heading { display:flex; align-items:start; justify-content:space-between; gap:14px; margin-bottom:16px; }.dashboard-section-heading h2 { font-size:19px; }.dashboard-context,.dashboard-text-link { margin:2px 0 0; color:var(--starter-muted,#64748b); font-size:13px; }.dashboard-text-link { color:var(--starter-primary,#123b67); font-weight:600; text-decoration:none; }
.dashboard-kpi-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }.dashboard-kpi-card { display:grid; min-height:130px; align-content:space-between; gap:10px; padding:18px; border:1px solid var(--starter-border,#dbe3ec); border-radius:11px; color:inherit; text-decoration:none; transition:border-color .15s ease,box-shadow .15s ease; }.dashboard-kpi-card:hover,.dashboard-kpi-card:focus-visible { border-color:var(--starter-primary,#123b67); box-shadow:0 4px 16px rgba(18,59,103,.10); outline:none; }.dashboard-kpi-card span { color:var(--starter-muted,#64748b); font-size:13px; }.dashboard-kpi-card strong { overflow-wrap:anywhere; font-size:clamp(21px,2vw,28px); font-weight:700; line-height:1.2; }.dashboard-kpi-card strong:has(.dashboard-mode-money) { display:grid; gap:8px; font-size:16px; }.dashboard-kpi-card strong .dashboard-mode-money > span:last-child { color:var(--starter-text,#172033); font-size:16px; }.dashboard-kpi-card small { color:var(--starter-muted,#64748b); font-size:12px; }
.dashboard-status-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }.dashboard-status-tile { display:grid; gap:8px; padding:14px; border-radius:10px; background:var(--starter-surface-soft,#f4f7fb); }.dashboard-status-tile span { color:var(--starter-muted,#64748b); font-size:12px; }.dashboard-status-tile strong { font-size:24px; font-weight:700; }.dashboard-status-tile.danger { background:#fff1f1; color:var(--starter-danger,#b91c1c); }.dashboard-status-tile.warning { background:#fff7e6; color:#8a5200; }.dashboard-status-tile.primary { background:#eff6ff; color:var(--starter-primary,#123b67); }
.dashboard-action-list { display:grid; gap:9px; }.dashboard-action-card { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px; border:1px solid var(--starter-border,#dbe3ec); border-left:3px solid var(--starter-primary,#123b67); border-radius:9px; }.dashboard-action-card.is-warning { border-left-color:var(--starter-warning,#d97706); }.dashboard-action-card.is-danger { border-left-color:var(--starter-danger,#b91c1c); }.dashboard-action-card strong { font-size:14px; }.dashboard-action-card p { margin:4px 0 0; color:var(--starter-muted,#64748b); font-size:13px; }.dashboard-mode-badge { margin:0 0 0 6px; padding:2px 6px; font-size:10px; }
.dashboard-paired-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }.dashboard-finance-list,.dashboard-resource-list { display:grid; gap:10px; }.dashboard-finance-row { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:11px 0; border-bottom:1px solid var(--starter-border,#dbe3ec); }.dashboard-finance-row:last-child,.dashboard-resource-row:last-child { border-bottom:0; }.dashboard-finance-row > div { display:grid; gap:3px; }.dashboard-finance-row span { margin:0; color:var(--starter-muted,#64748b); font-size:12px; }.dashboard-finance-row b { text-align:right; font-size:14px; }.dashboard-mode-money { display:flex; align-items:center; justify-content:flex-end; gap:7px; min-width:0; white-space:nowrap; }.dashboard-mode-finance-badge { flex:0 0 auto; border-radius:999px; padding:2px 6px; font-size:10px; font-weight:700; line-height:1.3; }.dashboard-mode-finance-badge.national { background:#eaf4ff; color:#14528a; }.dashboard-mode-finance-badge.international { background:#eefbf4; color:#087443; }.dashboard-finance-row b .dashboard-mode-money + .dashboard-mode-money { margin-top:5px; }
.dashboard-resource-row { display:grid; grid-template-columns:minmax(0,1fr) 78px; align-items:center; gap:16px; min-height:102px; padding:13px 0; border-bottom:1px solid var(--starter-border,#dbe3ec); }.dashboard-resource-copy { display:grid; min-width:0; gap:7px; }.dashboard-resource-heading { display:flex; align-items:baseline; justify-content:space-between; gap:10px; }.dashboard-resource-heading strong { font-size:14px; }.dashboard-resource-heading span,.dashboard-resource-copy p { margin:0; color:var(--starter-muted,#64748b); font-size:12px; }.dashboard-resource-copy p { line-height:1.4; }.dashboard-resource-legend { display:flex; flex-wrap:wrap; gap:5px 10px; }.dashboard-resource-legend span { display:inline-flex; align-items:center; gap:5px; color:var(--starter-muted,#64748b); font-size:10px; white-space:nowrap; }.dashboard-resource-legend i { width:7px; height:7px; flex:0 0 7px; border-radius:50%; background:#94a3b8; }.dashboard-resource-legend i.is-available { background:#16a34a; }.dashboard-resource-legend i.is-reserved { background:#f59e0b; }.dashboard-resource-legend i.is-mission { background:#2563eb; }.dashboard-resource-legend i.is-unavailable { background:#dc2626; }
.dashboard-resource-donut { position:relative; display:grid; width:78px; height:78px; place-items:center; border-radius:50%; box-shadow:inset 0 0 0 1px rgba(15,23,42,.06); }.dashboard-resource-donut::after { position:absolute; inset:12px; border-radius:50%; background:var(--starter-card,#fff); box-shadow:0 1px 4px rgba(15,23,42,.08); content:""; }.dashboard-resource-donut-center { position:relative; z-index:1; display:grid; place-items:center; color:var(--starter-text,#172033); line-height:1; }.dashboard-resource-donut-center strong { font-size:18px; }.dashboard-resource-donut-center small { margin-top:3px; color:var(--starter-muted,#64748b); font-size:9px; font-weight:600; text-transform:uppercase; }
.dashboard-trend-heading { align-items:center; }.dashboard-trend-controls { display:flex; align-items:center; gap:10px; }.dashboard-tabs { display:flex; gap:3px; padding:3px; border-radius:9px; background:var(--starter-surface-soft,#f4f7fb); }.dashboard-tabs button { border:0; border-radius:6px; background:transparent; color:var(--starter-muted,#64748b); padding:7px 9px; font:inherit; font-size:12px; cursor:pointer; }.dashboard-tabs button.is-active { background:#fff; color:var(--starter-primary,#123b67); box-shadow:0 1px 3px rgba(15,23,42,.1); font-weight:700; }.dashboard-trend-chart { display:flex; min-height:200px; align-items:end; gap:10px; padding-top:12px; border-bottom:1px solid var(--starter-border,#dbe3ec); }.dashboard-bar { display:grid; flex:1; min-width:0; height:190px; grid-template-rows:1fr auto auto; gap:5px; align-items:end; text-align:center; }.dashboard-bar-fill { display:block; width:100%; min-height:5px; border-radius:6px 6px 0 0; background:var(--starter-primary,#123b67); }.dashboard-bar strong { overflow-wrap:anywhere; font-size:11px; font-weight:600; }.dashboard-bar small { color:var(--starter-muted,#64748b); font-size:11px; }
.dashboard-table-wrap { overflow:auto; }.dashboard-table { width:100%; border-collapse:collapse; font-size:13px; }.dashboard-table th,.dashboard-table td { padding:10px 8px; border-bottom:1px solid var(--starter-border,#dbe3ec); text-align:left; vertical-align:top; }.dashboard-table th { color:var(--starter-muted,#64748b); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }.dashboard-timeline { display:grid; gap:0; }.dashboard-timeline-item { display:grid; grid-template-columns:12px minmax(0,1fr) auto; gap:11px; align-items:start; padding:11px 0; border-bottom:1px solid var(--starter-border,#dbe3ec); }.dashboard-timeline-item:last-child { border-bottom:0; }.dashboard-timeline-dot { width:8px; height:8px; margin-top:6px; border-radius:50%; background:var(--starter-primary,#123b67); }.dashboard-timeline-item p { margin:4px 0; color:var(--starter-muted,#64748b); font-size:13px; }.dashboard-timeline-item time { color:var(--starter-muted,#64748b); font-size:12px; }.dashboard-warning-list { display:grid; gap:9px; }.dashboard-warning-item { display:flex; justify-content:space-between; gap:14px; padding:13px; border:1px solid #fde7b0; border-radius:9px; background:#fff9ed; }.dashboard-warning-item.is-danger { border-color:#fecaca; background:#fff5f5; }.dashboard-warning-item p { margin:4px 0 0; color:var(--starter-muted,#64748b); font-size:13px; }.dashboard-empty { margin:0; padding:15px 0; color:var(--starter-muted,#64748b); font-size:14px; }.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:1050px) { .dashboard-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.dashboard-status-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.dashboard-topbar { grid-template-columns:1fr; }.dashboard-filters { justify-content:start; } }
@media (max-width:700px) { .dashboard-shell { gap:16px; padding-bottom:24px; }.dashboard-topbar,.dashboard-section { padding:16px; }.dashboard-filters { display:grid; grid-template-columns:1fr 1fr; }.dashboard-filters label { min-width:0; }.dashboard-filters .starter-btn { grid-column:1/-1; }.dashboard-period-workspace { display:grid; padding:14px; }.dashboard-period-presets { justify-content:start; }.dashboard-quick-actions { display:grid; grid-template-columns:1fr; }.dashboard-quick-actions .starter-btn { justify-content:center; }.dashboard-attention { display:grid; }.dashboard-attention-list { display:grid; grid-template-columns:1fr 1fr; }.dashboard-priority { grid-template-columns:36px minmax(0,1fr); padding:16px; }.dashboard-priority .starter-btn { grid-column:1/-1; width:100%; justify-content:center; }.dashboard-kpi-grid,.dashboard-paired-grid { grid-template-columns:1fr; }.dashboard-kpi-card { min-height:104px; }.dashboard-status-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.dashboard-action-card,.dashboard-finance-row { align-items:start; flex-direction:column; }.dashboard-finance-row b { width:100%; text-align:left; }.dashboard-mode-money { justify-content:flex-start; white-space:normal; }.dashboard-action-card .starter-btn { width:100%; justify-content:center; }.dashboard-resource-row { grid-template-columns:minmax(0,1fr) 68px; width:100%; }.dashboard-resource-donut { width:68px; height:68px; }.dashboard-resource-donut::after { inset:10px; }.dashboard-trend-heading { align-items:start; flex-direction:column; }.dashboard-trend-controls { width:100%; align-items:stretch; flex-direction:column; }.dashboard-tabs { width:100%; }.dashboard-tabs button { flex:1; }.dashboard-trend-chart { gap:5px; }.dashboard-bar strong { font-size:9px; }.dashboard-timeline-item { grid-template-columns:12px minmax(0,1fr); }.dashboard-timeline-item .dashboard-text-link { grid-column:2; }.dashboard-table { min-width:500px; } }
