.dashboard-page{
  --dashboard-width:1280px;
  min-height:100vh;
  background:
    radial-gradient(circle at 12% 2%,color-mix(in srgb,var(--accent) 15%,transparent),transparent 28%),
    radial-gradient(circle at 88% 8%,color-mix(in srgb,var(--amber) 12%,transparent),transparent 26%),
    linear-gradient(180deg,var(--bg2),var(--bg) 430px);
}
.dashboard-page::before{
  content:"";position:fixed;inset:0;pointer-events:none;opacity:.42;
  background-image:linear-gradient(30deg,var(--pattern) 12%,transparent 12.5%,transparent 87%,var(--pattern) 87.5%,var(--pattern)),linear-gradient(150deg,var(--pattern) 12%,transparent 12.5%,transparent 87%,var(--pattern) 87.5%,var(--pattern));
  background-size:72px 126px;
}
.dashboard-header{
  position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:24px;
  min-height:78px;padding:11px max(24px,calc((100vw - var(--dashboard-width))/2));
  border-bottom:1px solid var(--line);background:var(--header-bg);backdrop-filter:blur(18px);box-shadow:0 8px 30px rgba(0,0,0,.12);
}
.dashboard-brand{display:flex;align-items:center;gap:13px;color:var(--text);text-decoration:none;min-width:0}
.dashboard-brand-mark{display:grid;place-items:center;width:54px;height:54px;flex:0 0 auto;border:1px solid color-mix(in srgb,var(--accent) 62%,var(--line));border-radius:15px;background:var(--surface);box-shadow:inset 0 0 18px var(--accent-soft),0 7px 20px rgba(0,0,0,.18);overflow:hidden}
.dashboard-brand-mark img{display:block;width:82%;height:82%;object-fit:contain}
.dashboard-brand strong{display:block;font-size:19px;line-height:1.1;letter-spacing:.01em}
.dashboard-brand small{display:block;margin-top:5px;color:var(--muted);font-size:12px}
.dashboard-brand:focus-visible{outline:2px solid var(--accent-strong);outline-offset:5px;border-radius:12px}
.dashboard-controls{display:flex;align-items:center;gap:9px}
.dashboard-main{position:relative;z-index:1;width:min(var(--dashboard-width),calc(100% - 40px));margin:0 auto;padding:56px 0 64px}
.dashboard-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,480px);gap:48px;align-items:end;padding:10px 0 54px}
.hero-kicker,.section-kicker{display:block;color:var(--accent-strong);font-size:11px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}
.hero-copy h1{max-width:720px;margin:11px 0 14px;font-size:clamp(36px,5vw,64px);line-height:.98;letter-spacing:-.045em}
.hero-copy p{max-width:650px;margin:0;color:var(--muted);font-size:17px;line-height:1.65}
.overall-panel{padding:22px 23px 20px;border:1px solid color-mix(in srgb,var(--accent) 46%,var(--line));border-radius:20px;background:linear-gradient(145deg,color-mix(in srgb,var(--panel) 92%,transparent),color-mix(in srgb,var(--surface) 92%,transparent));box-shadow:var(--shadow-soft),inset 0 1px var(--panel-highlight)}
.overall-main{display:flex;align-items:end;justify-content:space-between;gap:18px}
.overall-main span{color:var(--muted);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.overall-main strong{font-size:19px;white-space:nowrap}
.overall-progress-track,.card-progress-track{display:block;overflow:hidden;background:var(--surface2);border:1px solid var(--line);border-radius:99px}
.overall-progress-track{height:10px;margin:17px 0 12px}
.overall-progress-track span,.card-progress-track i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,var(--accent),var(--accent-strong));box-shadow:0 0 16px var(--accent-soft);transition:width .3s ease}
.overall-meta{display:flex;justify-content:space-between;gap:18px;color:var(--muted);font-size:12px}
.overall-meta strong{color:var(--text)}
.overall-favorites{color:var(--amber)}
.dashboard-section{padding-top:3px}
.dashboard-section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:19px}
.dashboard-section-head h2,.dashboard-backup h2{margin:6px 0 0;font-size:24px;letter-spacing:-.02em}
.map-count{padding:8px 12px;border:1px solid var(--line);border-radius:99px;background:var(--surface);color:var(--muted);font-size:12px;white-space:nowrap}
.map-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}
.overview-map-card{
  --card-accent:var(--accent);--card-accent-soft:var(--accent-soft);
  position:relative;isolation:isolate;display:flex;flex-direction:column;min-height:300px;padding:21px;overflow:hidden;
  border:1px solid color-mix(in srgb,var(--card-accent) 40%,var(--line));border-radius:20px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--panel) 96%,var(--card-accent) 4%),var(--surface));
  color:var(--text);text-decoration:none;box-shadow:var(--shadow-soft),inset 0 1px var(--panel-highlight);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.overview-map-card::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(135deg,color-mix(in srgb,var(--card-accent) 10%,transparent),transparent 48%)}
.overview-map-card::after{content:"";position:absolute;left:0;top:22px;bottom:22px;width:3px;border-radius:0 4px 4px 0;background:var(--card-accent);box-shadow:0 0 18px var(--card-accent)}
.overview-map-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--card-accent) 75%,var(--line));box-shadow:0 20px 44px rgba(0,0,0,.24),0 0 30px var(--card-accent-soft)}
.overview-map-card:focus-visible{outline:2px solid var(--card-accent);outline-offset:4px}
.overview-map-card.aberration{--card-accent:#8583dc;--card-accent-soft:rgba(133,131,220,.15)}
.overview-map-card.scorched-earth{--card-accent:#d5964b;--card-accent-soft:rgba(213,150,75,.15)}
.overview-map-card.extinction{--card-accent:#91aa6b;--card-accent-soft:rgba(145,170,107,.15)}
.overview-map-card.genesis-one{--card-accent:#5fb6c4;--card-accent-soft:rgba(95,182,196,.15)}
.overview-map-card.genesis-two{--card-accent:#967bd2;--card-accent-soft:rgba(150,123,210,.15)}
.card-glow{position:absolute;z-index:-1;width:180px;height:180px;right:-75px;top:-70px;border-radius:50%;background:var(--card-accent);opacity:.09;filter:blur(3px)}
.card-top{display:flex;align-items:start;justify-content:space-between;gap:16px}
.card-symbol{display:grid;place-items:center;width:72px;height:72px;border:1px solid color-mix(in srgb,var(--card-accent) 58%,var(--line));border-radius:18px;background:color-mix(in srgb,var(--surface) 88%,var(--card-accent) 12%);overflow:hidden;box-shadow:inset 0 0 18px var(--card-accent-soft)}
.card-symbol img{display:block;width:84%;height:84%;object-fit:contain;border-radius:10px}
.card-percent{padding:7px 10px;border:1px solid color-mix(in srgb,var(--card-accent) 45%,var(--line));border-radius:99px;background:color-mix(in srgb,var(--surface) 88%,transparent);color:var(--card-accent);font-size:12px;font-weight:800}
.card-copy{display:block;margin-top:19px}
.card-copy strong{display:block;font-size:22px;letter-spacing:-.02em}
.card-copy small{display:block;margin-top:5px;color:var(--muted);font-size:12px}
.card-progress{display:block;margin-top:auto;padding-top:22px}
.card-progress-copy{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:9px;color:var(--muted);font-size:12px}
.card-favorite{color:var(--amber);white-space:nowrap}
.card-progress-track{height:7px}
.card-progress-track i{background:linear-gradient(90deg,color-mix(in srgb,var(--card-accent) 78%,white 4%),var(--card-accent))}
.card-action{display:flex;align-items:center;justify-content:space-between;margin-top:19px;padding-top:15px;border-top:1px solid var(--line);color:var(--text);font-size:13px;font-weight:750}
.card-action b{color:var(--card-accent);font-size:19px;transition:transform .18s ease}
.overview-map-card:hover .card-action b{transform:translateX(4px)}
.dashboard-backup{display:flex;align-items:center;justify-content:space-between;gap:32px;margin-top:30px;padding:25px 27px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(130deg,var(--panel),var(--surface));box-shadow:var(--shadow-soft),inset 0 1px var(--panel-highlight)}
.dashboard-backup p{margin:7px 0 0;color:var(--muted);font-size:13px}
.backup-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.dashboard-button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 15px;border-radius:11px;font-size:13px;font-weight:760;cursor:pointer;transition:.16s}
.dashboard-button.primary{border:1px solid color-mix(in srgb,var(--accent) 70%,var(--line));background:var(--accent);color:#07110c}
.dashboard-button.secondary{border:1px solid var(--line-strong);background:var(--surface);color:var(--text)}
.dashboard-button:hover{transform:translateY(-1px);filter:brightness(1.08)}
.dashboard-button:focus-within,.dashboard-button:focus-visible{outline:2px solid var(--accent-strong);outline-offset:3px}
.dashboard-button input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.backup-status{flex-basis:100%;min-height:16px;color:var(--muted);font-size:11px;text-align:right}
.dashboard-footer{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px max(24px,calc((100vw - var(--dashboard-width))/2));border-top:1px solid var(--line);background:color-mix(in srgb,var(--surface) 88%,transparent);color:var(--muted);font-size:11px}
.dashboard-footer nav{display:flex;gap:17px;flex-wrap:wrap;justify-content:flex-end}
.dashboard-footer a{color:var(--muted);text-decoration:none}
.dashboard-footer a:hover{color:var(--text)}
html[data-theme="light"] .dashboard-button.primary{color:#fff}

@media(max-width:980px){
  .dashboard-hero{grid-template-columns:1fr;gap:28px;align-items:start}
  .overall-panel{max-width:600px}
  .map-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dashboard-backup{align-items:flex-start;flex-direction:column}
  .backup-actions{justify-content:flex-start}
  .backup-status{text-align:left}
}
@media(max-width:640px){
  .dashboard-header{min-height:68px;padding:9px 14px}
  .dashboard-brand-mark{width:47px;height:47px;border-radius:13px}
  .dashboard-brand strong{font-size:16px}
  .dashboard-controls{gap:6px}
  .dashboard-main{width:calc(100% - 24px);padding:34px 0 42px}
  .dashboard-hero{padding-bottom:39px}
  .hero-copy h1{font-size:38px}
  .hero-copy p{font-size:15px}
  .overall-panel{padding:18px}
  .overall-main{align-items:start;flex-direction:column;gap:8px}
  .overall-main strong{font-size:17px}
  .dashboard-section-head{align-items:start}
  .dashboard-section-head h2{font-size:22px}
  .map-count{margin-top:2px}
  .map-card-grid{grid-template-columns:1fr;gap:13px}
  .overview-map-card{min-height:272px}
  .dashboard-backup{padding:21px}
  .backup-actions{width:100%;display:grid;grid-template-columns:1fr}
  .dashboard-button{width:100%}
  .backup-status{text-align:center}
  .dashboard-footer{align-items:flex-start;flex-direction:column;padding:21px 15px}
  .dashboard-footer nav{justify-content:flex-start}
}
@media(prefers-reduced-motion:reduce){.overview-map-card,.card-action b,.overall-progress-track span,.card-progress-track i,.dashboard-button{transition:none}}