/* Local refinement: preserve the existing glass theme and dashboard composition. */
.route-app .overview-card-title>span,
.route-app .overview-usage-facts dt,
.route-app .overview-ring small,
.route-app .overview-ring span,
.route-app .overview-chart-note,
.route-app .overview-chart-live,
.route-app .overview-chart-legend,
.route-app .overview-y-axis,
.route-app .overview-chart-axis,
.route-app .entitlement-plan p,
.route-app .entitlement-stat small,
.route-app .overview-connect .overview-card-head p,
.route-app .overview-connect-actions span small {color:#4c6279}
.route-app .overview-card-title>span,.route-app .overview-chart-note,
.route-app .entitlement-plan p,.route-app .entitlement-stat small {font-size:12px}
.route-app .experience-scene p {color:#4c6279}
.route-app .overview-chart-empty {gap:8px}
.route-app .overview-chart-empty strong {color:#243950;font-size:15px;line-height:1.5}
.route-app .overview-chart-empty span {color:#4c6279;max-width:37ch;justify-self:center}
.route-app .overview-data-status {display:flex;flex-wrap:wrap;align-items:center;gap:5px 12px;margin-top:14px;padding-top:12px;border-top:1px solid rgba(63,91,125,.12);font-size:11px;line-height:1.65;color:#4c6279}
.route-app .overview-updated {margin-left:auto;white-space:nowrap}
.route-app .overview-data-status time {font:inherit}
.route-app .overview-data-status button {border:0;padding:5px 0;background:none;color:#315bbd;font:inherit;font-weight:700;cursor:pointer;min-height:32px}
.route-app .overview-data-status button[hidden]{display:none}
.route-app .overview-chart-live[data-state="error"] i {background:#b55b35}
.route-app .overview-chart-live[data-state="loading"] i {background:#637f9d}
.route-app .overview-chart-live[data-state="recorded"] i {background:#637f9d}
.route-app .quick-setup {margin-top:18px;padding-top:16px;border-top:1px solid rgba(63,91,125,.12)}
.route-app .quick-device-row {display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px}
.route-app .quick-label {color:#4c6279;font-size:12px;font-weight:650}
.route-app .quick-devices {display:flex;flex-wrap:wrap;gap:6px}
.route-app .quick-devices button {border:1px solid transparent;border-radius:9px;background:transparent;color:#4c6279;min-height:38px;padding:7px 12px;font:inherit;font-size:12px;font-weight:650;cursor:pointer;transition:background .15s,border-color .15s}
.route-app .quick-devices button:hover {background:#edf3fa}
.route-app .quick-devices button[aria-pressed="true"] {color:#234f9b;background:#edf4ff;border-color:#bdcfea}
.route-app .quick-instructions {margin:12px 0 0;color:#4c6279;font-size:12px;line-height:1.75}
.route-app .overview-connect .copy-control {background:#315fc2;color:#fff;border-color:#315fc2;min-width:82px}
.route-app .overview-connect .copy-control:hover {background:#264fa7}
.route-app .overview-connect-actions>button {background:rgba(255,255,255,.60);box-shadow:none;border:1px solid rgba(63,91,125,.12)}
.route-app .overview-connect-actions>button:hover {background:rgba(255,255,255,.92);border-color:#b9cbe0}
html[data-subscription-state="empty"] .quick-setup {display:none}
@media(max-width:560px){
 .route-app .overview-card-title>span {font-size:11px}
 .route-app .overview-chart-note {font-size:11px}
 .route-app .overview-data-status {font-size:11px}
 .route-app .overview-updated {margin-left:0}
 .route-app .quick-device-row {display:block}
 .route-app .quick-devices {margin-top:8px;display:grid;grid-template-columns:1fr 1fr}
 .route-app .quick-devices button {min-height:44px;padding:8px}
 .route-app .overview-connect-actions {grid-template-columns:1fr}
 .route-app .overview-connect-actions>button {min-height:64px}
}
/* Leave room for the status footer instead of clipping it under a 100%-height panel. */
.route-app .overview-chart-panel {height:auto}
.route-app .overview-chart-card {display:flex;flex-direction:column}
.route-app .overview-chart-panel {flex:0 0 auto;height:auto!important}
.route-app .overview-data-status {flex:none}

/* Stable, local loading treatment; the status never pushes the dashboard down. */
.route-app #apiStatePanel {position:fixed;right:24px;bottom:24px;z-index:95;width:min(360px,calc(100vw - 32px));margin:0;padding:12px 16px;border:1px solid #d3dfed;border-radius:14px;background:#f5f9fd;box-shadow:0 8px 28px #27486914;gap:10px}
.route-app #apiStatePanel h2 {font-size:13px;line-height:1.5;color:#30445d}
.route-app #apiStatePanel p {font-size:12px;line-height:1.5;opacity:1;color:#52677d}
.route-app #apiStatePanel[data-kind="loading"] {width:auto;max-width:280px;padding:9px 14px}
.route-app #apiStatePanel[data-kind="loading"] h2 {font-size:12px;font-weight:500}
.route-app #apiStatePanel[data-kind="loading"] p {display:none}
.route-app #apiStatePanel>span {width:7px;height:7px;flex:none;background:#5b81a6;box-shadow:none}
html[data-portal-loading="true"]:not([data-data-ready="true"]) .route-app [data-bind] {color:transparent!important;background:linear-gradient(100deg,#e3ebf3,#f1f5f9,#e3ebf3);border-radius:5px;min-width:30px}
@media(max-width:600px){.route-app #apiStatePanel{right:16px;bottom:88px}}