.dashboard-page{background:#10134b;padding:3.75cqw 8.75cqw 3.75cqw 3.75cqw}
.dashboard-background{position:absolute;inset:0;z-index:-1;background:#171777 url('assets/dashboard-glass.svg') center/cover no-repeat}
.dashboard-background::before,.dashboard-background::after{content:"";position:absolute;width:115%;height:68%;border-radius:50%;transform:rotate(-31deg);background:linear-gradient(180deg,#e4e9ff66,#5865d333 16%,#15147080 70%);box-shadow:0 -1.2cqw 2.8cqw #d4d8ff4d}
.dashboard-background::before,.dashboard-background::after{display:none}
/* 640×480: 24px outer gutter, 32px nav gutter; 3×180 + 2×10 = 560px. */
.dashboard-grid{height:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:1.5625cqw}
.dashboard-tile{position:relative;min-width:0;min-height:0;overflow:hidden;border:1px solid #eef4ff65;border-radius:3.5cqw;color:#fff;background:linear-gradient(135deg,#f5f7ff26 0%,#e4ebff0a 35%,#b9c9ff06 66%,#f3eeff20 100%);box-shadow:inset 0 1px 1px #ffffff85,inset 1px 0 1px #ffffff24,inset -1px -1px 1px #a6b6ff55,0 8px 24px #060c5028;backdrop-filter:blur(9px) saturate(180%) brightness(1.08);-webkit-backdrop-filter:blur(9px) saturate(180%) brightness(1.08);padding:2.5cqw;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:.55cqw;text-align:center;text-decoration:none;transition:background .18s,box-shadow .18s,transform .18s}
.dashboard-tile::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(ellipse at 8% 0%,#ffffff45,transparent 49%),linear-gradient(160deg,#ffffff10,transparent 42%,#e7ecff12);box-shadow:inset 0 0 0 1px #ffffff10;z-index:0}
.dashboard-tile>svg,.dashboard-tile>strong,.dashboard-tile>span{position:relative;z-index:1;text-shadow:0 1px 5px #10166a30}
.dashboard-tile:hover{background-color:#e4ecff12;box-shadow:inset 0 1px 2px #ffffffa6,inset 1px 0 1px #ffffff42,inset -1px -1px 1px #c5d2ff66,0 9px 24px #060c5033}.dashboard-tile:active{transform:scale(.98)}
.dashboard-tile strong{font-size:2.5cqw;font-weight:600;line-height:1.25}.dashboard-tile>span:not(.dashboard-weather-icon){font-size:2.05cqw;line-height:1.35;color:#e0e3ffb8;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dashboard-tile>svg{height:5.7cqw;width:5.7cqw;margin-bottom:1.1cqw;stroke-width:1.7}
.dashboard-weather{grid-column:span 2;grid-row:span 2;gap:0;padding:0;background:linear-gradient(145deg,#edf2ff26,#dce5ff08 50%,#d2d9ff16)}
.dashboard-weather-main{display:block;position:absolute;inset:0;width:100%;height:100%;background:none;border:0;color:inherit;padding:0;text-align:center}
.dashboard-tile.dashboard-weather .dashboard-temperature{position:absolute;top:8.1cqw;left:0;right:0;font-size:22cqw;line-height:1.05;font-weight:350;letter-spacing:-.065em;padding-right:.4cqw;font-variant-numeric:tabular-nums;color:#fff;overflow:visible}
.dashboard-main-caption{position:absolute;bottom:3.2cqw;left:10cqw;right:10cqw;display:flex;flex-direction:column;gap:.2cqw}.dashboard-main-caption strong{font-size:2.5cqw;font-weight:600;margin:0}.dashboard-main-caption>span{font-size:2.15cqw;color:#cbd2ffb8}
.dashboard-location-step{position:absolute;bottom:3cqw;width:6.875cqw;height:6.875cqw;display:grid;place-items:center;padding:1.25cqw;border:0;border-radius:50%;background:none;color:#fff}.dashboard-location-step svg{width:100%;height:100%;stroke-width:2.5}.dashboard-location-step:hover{background:#ffffff18}.previous-location{left:3cqw}.next-location{right:3cqw}
.dashboard-weather .dashboard-weather-icon{width:8cqw;height:8cqw;position:absolute;right:2.5cqw;top:2.1cqw;background:center/contain no-repeat}
.dashboard-weather .dashboard-weather-label{position:absolute;left:3.4cqw;top:3cqw;font-size:2.2cqw;font-weight:500;color:#fff}
.dashboard-weather strong{margin-top:3cqw;font-size:2.65cqw}.dashboard-weather .dashboard-range{margin-top:1.1cqw;font-size:2cqw;color:#eceeffc2}
.dashboard-weather .dashboard-condition{font-size:2.2cqw;margin-top:.45cqw}
.dashboard-clock{padding:.9cqw;background:linear-gradient(135deg,#f0f4ff30,#d2dfff08 65%,#eff0ff26);border-radius:50%;aspect-ratio:1;justify-self:center;width:21.4cqw;align-self:center}
.dashboard-clock>svg{width:100%;height:100%;margin:0;overflow:visible}
.dashboard-clock text{fill:#fff;stroke:none;font-size:10px;font-family:inherit;font-weight:500;text-anchor:middle;dominant-baseline:central}
.dashboard-clock .clock-ticks{stroke:#e3e8ff73;stroke-width:.8}.dashboard-clock .clock-hand{stroke:#fff;stroke-width:2.7}.dashboard-clock .clock-second{stroke:#d4d9ff;stroke-width:.65}
.dashboard-music{grid-column:3;grid-row:2}.dashboard-music>svg{width:6.5cqw;height:6.5cqw;stroke-width:1.6}
.dashboard-music strong{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dashboard-settings>svg{height:6.1cqw;width:6.1cqw}
.display[data-page=dashboard] .page-dots{right:0}
.dashboard-weather .dashboard-main-caption strong{margin:0;font-size:2.5cqw}
.dashboard-demo-note{position:absolute;bottom:.7cqw;left:3.75cqw;right:8.75cqw;text-align:center;font-size:1.55cqw;line-height:1.3;color:#eef2ffb8}
@media(prefers-reduced-motion:reduce){.dashboard-tile{transition:none}}