/* Home page: one primary action, one main navigation, and quiet information panels. */
.topbar .brand-seal { display: none; }
.topbar .brand { gap: 0; }
.topbar .resources { gap: clamp(5px, .8vw, 15px); }
.topbar .resource {
  gap: 8px;
  border-color: #d7bd8066;
  background: linear-gradient(110deg, #1e3744bd, #0d2432b8);
  box-shadow: inset 0 1px #f1d99b20;
}
.topbar .resource .icon {
  width: 24px;
  height: 24px;
  color: #d9f1cf;
  stroke-width: 1.45;
  filter: drop-shadow(0 0 5px #9cd9aa8c);
}
.topbar .resource:nth-child(4) .icon { color: #d5dbfb; filter: drop-shadow(0 0 5px #b5c5ff9c); }
.topbar .header-actions { justify-content: flex-end; }
.topbar #playerAccount { border-color: #b99861a3; background: #1b3440aa; color: #f3dfb6; }
.topbar .gallery-nav { border-color: #e2be79; background: linear-gradient(135deg, #846239, #3d3529); box-shadow: inset 0 0 0 2px #f4d58b36; }

#homeScreen .event-card { display: none; }
#homeScreen .destiny-actions { display: none; }
#homeScreen .side-stack { gap: 16px; }
#homeScreen .side-stack .card {
  color: #f2dfb8;
  background: linear-gradient(155deg, #18313de8, #0e2533ee), url('./environment-home-v2.webp') center/cover;
}
#homeScreen .side-stack .panel-heading { border-color: #d1b77872; }
#homeScreen .side-stack .panel-heading::after { background: #1b3440; }
#homeScreen .side-stack .panel-heading h2 { color: #f6d793; }
#homeScreen .side-stack .eyebrow { color: #d4b578; }
#homeScreen .side-stack .heading-glyph { color: #e1be7a; }
#homeScreen .destiny-card .card-body {
  display: grid;
  grid-template-columns: 98px minmax(0, 1fr);
  grid-template-areas: 'heading heading' 'portrait name' 'portrait tags';
  column-gap: 15px;
  align-items: center;
}
#homeScreen .destiny-card .panel-heading { grid-area: heading; }
#homeScreen .destiny-card .hex-portrait {
  grid-area: portrait;
  width: 98px;
  height: 130px;
  margin: 14px 0 0;
  background: radial-gradient(circle at 50% 55%, #6a9f8894, #142e37 72%);
  box-shadow: inset 0 0 0 3px #152c35, 0 0 18px #83c29956;
}
#homeScreen .destiny-card .hex-lines { width: 66px; height: 105px; fill: #f3dc9d; }
#homeScreen .destiny-card .portrait-mark { display: none; }
#homeScreen .destiny-card .hero-name {
  grid-area: name;
  align-self: end;
  margin: 14px 0 0;
  color: #ffe4a2;
  font-size: 22px;
}
#homeScreen .destiny-card .hero-name span { display: block; margin: 0; color: #d9c6a5; font-size: 15px; }
#homeScreen .destiny-card .tag-row { grid-area: tags; align-self: start; margin: 3px 0 0; }
#homeScreen .destiny-card .tag { padding: 2px 5px; border-color: #bfa46a68; background: #122e3b8e; color: #e9d2a5; font-size: 11px; }

#homeScreen .elements-card .section-desc { display: none; }
#homeScreen .elements-card .element-line { margin: 11px 0; }
#homeScreen .elements-card .element-mark b,
#homeScreen .elements-card .count { color: #ead8b3; }
#homeScreen .elements-card .bar { background: #071b27; box-shadow: inset 0 1px 4px #0009; }
#homeScreen .elements-card .element-note {
  padding: 8px 9px;
  border-color: #91ac9288;
  background: #b7d0ad14;
  color: #d6e4c9;
  font-size: 12px;
}
#homeScreen .elements-card .small-note { margin-top: 8px; color: #b6bbaa; font-size: 11px; }

#homeScreen .journey-card { display: flex; flex: 1; min-height: 0; }
#homeScreen .journey-card .card-body { display: flex; flex: 1; flex-direction: column; min-height: 0; }
#homeScreen .journey-preview { display: grid; gap: 14px; margin-top: 24px; }
#homeScreen .journey-preview-item {
  position: relative;
  display: grid;
  grid-template-columns: 41px minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  min-height: 116px;
  padding: 15px 13px;
  border: 1px solid #bda16b68;
  border-radius: 3px;
  background: linear-gradient(120deg, #102733d9, #213543a8);
  box-shadow: inset 0 1px #e4c9891c;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color .2s, background .2s, transform .2s, box-shadow .2s;
}
#homeScreen .journey-preview-item::after { content: '›'; position: absolute; right: 12px; top: 13px; color: #e6c985; font: 24px/1 Georgia, serif; }
#homeScreen .journey-preview-item:hover { border-color: #ebca83; background: linear-gradient(120deg, #173747ed, #2d4654d9); box-shadow: inset 0 1px #ffe4a45c, 0 7px 18px #06172075; transform: translateY(-2px); }
#homeScreen .journey-preview-item:focus-visible { outline: 2px solid #f5d28f; outline-offset: 3px; }
#homeScreen .journey-preview-icon {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid #d0b77f;
  border-radius: 50%;
  background: radial-gradient(circle, #9d7f3e52, #102631);
  color: #f2d28f;
}
#homeScreen .journey-preview-item b { display: block; color: #f8d992; font: 700 20px/1.3 var(--display); }
#homeScreen .journey-preview-item small { display: block; margin-top: 8px; color: #d1ceb9; font-size: 13px; line-height: 1.7; }
#homeScreen .journey-card #tasksOpen {
  align-self: flex-end;
  margin-top: auto;
  color: #f6d798;
  font: 700 16px var(--display);
}
#homeScreen .journey-card #tasksOpen:hover { color: #fff3cb; }

#homeScene .scene-content {
  left: 4.5%;
  right: auto;
  width: min(390px, 43%);
  bottom: 5.5%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  text-align: left;
}
#homeScene .scene-copy { display: flex; flex-direction: column; align-items: flex-start; }
#homeScene .scene-kicker { display: none; }
#homeScene #homeTitle { margin: 0 0 6px; background-position: left center; }
#homeScene .scene-copy p { max-width: 390px; color: #f2ead3; font-size: 14px; text-shadow: 0 2px 6px #000; }
#homeScene .scene-cta { width: min(250px, 100%); }
#homeScene .scene-cta .primary-button {
  width: 100%;
  justify-content: center;
  border-color: #f4d99b;
  background: linear-gradient(135deg, #bc914c, #876038);
  color: #201b14;
  font: 700 21px var(--display);
  box-shadow: 0 3px 22px #e5bd6970, inset 0 0 0 3px #ffebbc78;
}
.dock .dock-icon {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background: radial-gradient(circle at 45% 35%, #eddfb9, #9e865b);
  color: #31454b;
  box-shadow: 0 0 0 3px #d9bd7940, inset 0 1px #fff5d4;
}
.dock .dock-button:first-of-type .dock-icon { color: #7b632c; box-shadow: 0 0 0 3px #e7c67e88, 0 0 19px #eac07170; }
.dock .dock-button b { color: #f7dfaa; }

@media (min-width: 1101px) {
  #homeScene { min-height: 650px; height: max(650px, calc(100svh - 252px)); }
  #homeScreen .side-stack { height: max(650px, calc(100svh - 252px)); max-height: none; }
}
@media (max-width: 1100px) {
  #homeScreen .journey-card { min-height: 390px; }
  #homeScreen .journey-card #tasksOpen { margin-top: 28px; }
}
@media (max-width: 760px) {
  .topbar .resource { padding: 5px 7px; }
  .topbar .resource .icon { width: 20px; height: 20px; }
  #homeScene .scene-content { left: 20px; right: auto; width: min(300px, calc(100% - 40px)); bottom: 26px; }
  #homeScene .scene-copy p { font-size: 13px; }
  #homeScreen .journey-preview { margin-top: 18px; }
}