/* Pixel Pet Studio v2.0.0-alpha.20.4 — Living Realms dashboard */

.pps-realm-progress-quick,
.pps-world-progress-button {
  appearance:none;
  border:1px solid rgba(104,229,174,.42);
  border-radius:999px;
  background:rgba(14,52,58,.78);
  color:#effff7;
  min-height:36px;
  padding:7px 13px;
  font:inherit;
  font-weight:800;
  cursor:pointer;
}
.pps-realm-progress-quick:hover,
.pps-world-progress-button:hover {
  border-color:#6ee9ae;
  background:rgba(21,82,72,.92);
}
.pps-realm-chooser-host {
  display:grid;
  gap:8px;
}
.pps-realm-progress-quick {
  justify-self:start;
  font-size:.8rem;
}

.pps-v204-modal[hidden]{display:none!important}
.pps-v204-modal {
  position:fixed;
  inset:0;
  z-index:2400;
  display:grid;
  place-items:center;
  padding:clamp(12px,3vw,30px);
  color:#effff7;
}
.pps-v204-backdrop {
  position:absolute;
  inset:0;
  background:rgba(2,12,19,.76);
  backdrop-filter:blur(8px);
}
.pps-v204-panel {
  position:relative;
  width:min(920px,100%);
  max-height:min(88dvh,900px);
  overflow:hidden;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  border:1px solid #2d6b68;
  border-radius:22px;
  background:linear-gradient(160deg,#0a2130,#082d29);
  box-shadow:0 28px 90px rgba(0,0,0,.52);
}
.pps-v204-header {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  padding:20px 22px;
  border-bottom:1px solid rgba(83,175,160,.3);
  background:rgba(7,27,40,.9);
}
.pps-v204-header h2 {
  margin:.15rem 0 .15rem;
  font-size:clamp(1.45rem,4vw,2.25rem);
}
.pps-v204-header p {margin:0;color:#acd0c5}
.pps-v204-kicker {
  color:#62e6a6;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.16em;
}
.pps-v204-close {
  appearance:none;
  border:1px solid #376a6e;
  border-radius:999px;
  background:#102d39;
  color:#effff7;
  width:42px;
  height:42px;
  font-size:1.45rem;
  cursor:pointer;
}
.pps-v204-body {
  overflow:auto;
  overscroll-behavior:contain;
  padding:20px 22px 28px;
  display:grid;
  gap:20px;
}
.pps-v204-body section {
  border:1px solid rgba(69,143,139,.38);
  border-radius:16px;
  background:rgba(4,25,32,.66);
  padding:16px;
}
.pps-v204-body h3 {
  margin:0 0 12px;
  font-size:1rem;
  letter-spacing:.03em;
}
.pps-v204-resource-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.pps-v204-resource {
  padding:10px;
  border-radius:12px;
  background:rgba(13,49,54,.74);
}
.pps-v204-resource-top,
.pps-v204-goal-title,
.pps-v204-goal-heading,
.pps-v204-foodweb > div,
.pps-v204-human-grid > div {
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
}
.pps-v204-resource-top {
  margin-bottom:7px;
  color:#dff9ee;
  font-size:.84rem;
}
.pps-v204-track {
  height:7px;
  overflow:hidden;
  border-radius:999px;
  background:#173540;
}
.pps-v204-track i {
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#50daa0,#70ccef);
}

.pps-v241-attraction-help {
  margin:-4px 0 12px;
  color:#a9cbc1;
  font-size:.84rem;
  line-height:1.45;
}
.pps-v241-attraction-list {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
}
.pps-v241-attraction-card {
  display:grid;
  gap:7px;
  min-width:0;
  padding:11px 12px;
  border:1px solid rgba(63,128,130,.36);
  border-radius:12px;
  background:rgba(9,33,43,.68);
  opacity:.72;
}
.pps-v241-attraction-card.is-next {
  opacity:1;
  border-color:rgba(112,204,239,.7);
  background:linear-gradient(145deg,rgba(17,58,67,.9),rgba(8,43,46,.86));
}
.pps-v241-attraction-card.is-unlocked {
  opacity:1;
  border-color:rgba(91,231,164,.52);
}
.pps-v241-attraction-title {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}
.pps-v241-attraction-title strong {
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.pps-v241-attraction-title span {
  flex:0 0 auto;
  color:#76e8b2;
  font-size:.72rem;
  font-weight:800;
}
.pps-v241-attraction-card p {
  margin:0;
  color:#bad8cf;
  font-size:.78rem;
  line-height:1.35;
}
.pps-v241-ambient {
  grid-column:1 / -1;
  display:flex;
  flex-wrap:wrap;
  gap:8px 16px;
  padding:9px 11px;
  border-radius:10px;
  background:rgba(13,49,54,.6);
  color:#cce8df;
  font-size:.78rem;
}

.pps-v204-event {
  display:grid;
  gap:4px;
  padding:13px;
  border-radius:13px;
  background:rgba(16,48,57,.7);
}
.pps-v204-event.is-active {
  border:1px solid rgba(255,193,91,.52);
  background:linear-gradient(140deg,rgba(96,66,28,.52),rgba(15,54,55,.8));
}
.pps-v204-event p {margin:0;color:#d3eee5}
.pps-v204-event small {color:#9ebdb6}
.pps-v204-foodweb {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}
.pps-v204-foodweb > div,
.pps-v204-human-grid > div {
  padding:10px 11px;
  border-radius:11px;
  background:rgba(13,49,54,.7);
  font-size:.84rem;
}
.pps-v204-goal-heading {margin-bottom:10px}
.pps-v204-goal-heading h3 {margin:0}
.pps-v204-goal-heading > strong {color:#72ebb1}
.pps-v204-goals {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.pps-v204-goal {
  display:grid;
  gap:8px;
  padding:13px;
  border:1px solid rgba(63,128,130,.46);
  border-radius:13px;
  background:rgba(10,37,47,.76);
}
.pps-v204-goal.is-complete {
  border-color:rgba(91,231,164,.68);
  background:linear-gradient(145deg,rgba(21,79,58,.82),rgba(8,43,46,.82));
}
.pps-v204-goal-title span {color:#70e7ad;font-weight:800}
.pps-v204-goal p {margin:0;color:#c9e7de;font-size:.88rem}
.pps-v204-goal small {color:#9bbdb4}
.pps-v204-human-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}

.pps-world-card .pps-v204-card-progress {
  margin-top:9px;
  display:grid;
  gap:5px;
}
.pps-v204-card-progress-row {
  display:flex;
  justify-content:space-between;
  gap:10px;
  font-size:.74rem;
  color:#b7d4cc;
}
.pps-v204-card-badge {
  text-transform:capitalize;
  font-weight:900;
}
.pps-v204-card-badge[data-badge="gold"]{color:#ffd76d}
.pps-v204-card-badge[data-badge="silver"]{color:#d6e6ea}
.pps-v204-card-badge[data-badge="bronze"]{color:#d99d64}

@media(max-width:720px){
  .pps-v204-modal {padding:0;place-items:end center}
  .pps-v204-panel {
    width:100%;
    max-height:91dvh;
    border-radius:22px 22px 0 0;
  }
  .pps-v204-header {padding:16px}
  .pps-v204-body {padding:14px 14px calc(20px + env(safe-area-inset-bottom))}
  .pps-v204-resource-grid,
  .pps-v204-foodweb,
  .pps-v204-human-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
  .pps-v204-goals,
  .pps-v241-attraction-list {grid-template-columns:1fr}
}
@media(max-width:420px){
  .pps-v204-resource-grid {grid-template-columns:1fr 1fr}
  .pps-v204-foodweb,
  .pps-v204-human-grid {grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  .pps-v204-track i {transition:none!important}
}