/* Painted furniture, cushions and room are one illustration. Only treasures
   change appearance with ownership; labels and counts sit on painted tags. */
#trophyRoomView { margin:6px -14px -8px; }
.trophy-room-sign { margin:2px 0 18px; text-align:center; color:#e7d2af; }
.trophy-room-sign>span { font-size:.66rem; font-weight:900; letter-spacing:.16em; text-transform:uppercase; color:#b5c6d0; }
.trophy-room-sign h3 { margin:5px 0 0; font-size:clamp(1rem,2.6vw,1.5rem); letter-spacing:-.035em; text-transform:none; }
.trophy-room-scene {
  position:relative; width:100%; aspect-ratio:1536/1024; container-type:inline-size;
  background:#172b3e url('./assets/trophy-room-forge-desktop.png') center / 100% 100% no-repeat;
  border-radius:20px; overflow:hidden;
}
.trophy-cabinet { position:absolute; inset:0; }
.trophy-shelf { position:absolute; left:15.5%; width:75%; height:20.5078125%; margin:0; padding:0; }
.trophy-shelf[data-shelf="0"] { top:24.4140625%; }
.trophy-shelf[data-shelf="1"] { top:41.9921875%; }
.trophy-shelf[data-shelf="2"] { top:59.5703125%; }
.trophy-shelf-items { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); width:100%; height:100%; gap:0; }
.trophy-alcove { position:relative; min-width:0; width:100%; height:100%; text-align:center; font-family:"Arial Rounded MT Bold","Trebuchet MS",system-ui,sans-serif; }
.trophy-cushion { position:absolute; left:12.5%; top:13%; width:75%; height:46.05%; }
.trophy-cushion .trophy-sprite { display:block; width:100%; height:100%; max-width:none; aspect-ratio:auto; opacity:1; filter:none; mix-blend-mode:normal; }
.trophy-alcove.is-uncollected .trophy-sprite { filter:grayscale(1); opacity:.27; }
.trophy-plaque,.trophy-tag {
  position:absolute; left:50%; transform:translateX(-50%); display:grid; place-items:center;
  margin:0; padding:0; border:0; background:none; box-shadow:none; color:#5f3943;
  font-size:clamp(8px,1.25cqw,17px); line-height:1; font-weight:900; white-space:nowrap;
}
.trophy-plaque { top:61.9%; width:51%; height:14.76%; }
.trophy-tag { top:80.95%; width:20%; height:19.05%; font-size:clamp(8px,1.3cqw,18px); }
.trophy-alcove small { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.celestial-display { position:absolute; left:41.5%; top:1.953125%; width:18.23%; height:25.390625%; }
.celestial-display .trophy-cushion { left:0; top:0; width:100%; height:61.54%; }
.celestial-display .trophy-plaque { top:65.77%; height:11.92%; width:46%; }
.celestial-display .trophy-tag { top:80%; height:16.15%; width:16%; }
.coal-display { position:absolute; left:1.56%; top:69.3359375%; width:14.7%; height:20.5078125%; }
.coal-display .trophy-cushion { top:0; height:50%; }
.coal-display .trophy-plaque { top:62.86%; height:14.29%; width:47%; }
.coal-display .trophy-tag { top:80.48%; height:19.05%; }
.trophy-room-note { margin:12px 0 0; text-align:center; color:#bacbd3; font-size:.73rem; }

/* Coordinates matched to the Forge room illustration. */
.trophy-shelf { left:10.31901%; width:61.71875%; height:22.46094%; }
.trophy-shelf[data-shelf="0"] { top:21.97266%; }
.trophy-shelf[data-shelf="1"] { top:39.06250%; }
.trophy-shelf[data-shelf="2"] { top:56.15234%; }
.trophy-cushion { left:18.35443%; top:0; width:63.29114%; height:54.34783%; }
.trophy-plaque { top:60.86957%; height:13.04348%; }
.trophy-tag { top:76.52174%; height:17.39130%; }
.celestial-display { left:36.65365%; top:3.80859%; width:9.76562%; height:21.67969%; }
.celestial-display .trophy-cushion { left:0; top:0; width:100%; height:58.55856%; }
.celestial-display .trophy-plaque { top:64.86486%; height:13.51351%; width:100%; }
.celestial-display .trophy-tag { top:80.18018%; height:18.01802%; width:30%; }
.coal-display { left:4.62240%; top:70.80078%; width:7.81250%; height:19.14062%; }
.coal-display .trophy-cushion { left:0; top:0; width:100%; height:51.02041%; }
.coal-display .trophy-plaque { top:58.67347%; height:15.30612%; width:100%; }
.coal-display .trophy-tag { top:77.55102%; height:20.40816%; width:30%; }
@media(max-width:600px) {
#trophyRoomView { margin:4px -10px -5px; }
.trophy-room-scene { aspect-ratio:887/1774; background-image:url('./assets/trophy-room-forge-mobile.png'); border-radius:15px; }
.trophy-shelf-items { grid-template-columns:repeat(2,minmax(0,1fr)); }
.trophy-plaque { font-size:clamp(9px,2.6cqw,15px); }
.trophy-tag { font-size:clamp(9px,2.8cqw,16px); }
.trophy-shelf { left:16.79820%; width:65.83991%; height:12.68320%; }
.trophy-shelf[data-shelf="0"] { top:11.55581%; }
.trophy-shelf[data-shelf="1"] { top:21.42052%; }
.trophy-shelf[data-shelf="2"] { top:31.28523%; }
.trophy-shelf[data-shelf="3"] { top:41.14994%; }
.trophy-shelf[data-shelf="4"] { top:51.01466%; }
.trophy-shelf[data-shelf="5"] { top:60.76663%; }
.trophy-cushion { left:21.74658%; top:0; width:56.50685%; height:64.44444%; }
.trophy-plaque { top:73.33333%; height:13.33333%; }
.trophy-tag { top:90.66667%; height:17.77778%; }
.celestial-display { left:40.75536%; top:0.28185%; width:18.60203%; height:13.75423%; }
.celestial-display .trophy-cushion { left:0; top:0; width:100%; height:59.42623%; }
.celestial-display .trophy-plaque { top:65.98361%; height:12.29508%; width:100%; }
.celestial-display .trophy-tag { top:81.96721%; height:16.39344%; width:30%; }
.coal-display { left:9.47012%; top:72.66065%; width:15.78354%; height:12.51409%; }
.coal-display .trophy-cushion { left:0; top:0; width:100%; height:54.05405%; }
.coal-display .trophy-plaque { top:61.26126%; height:13.51351%; width:100%; }
.coal-display .trophy-tag { top:80.18018%; height:18.01802%; width:30%; }
}

/* Smaller keepsakes sit on the cushions, below the previous shelf's count tag.
   These boxes leave at least 9 native-canvas pixels between adjacent items. */
.trophy-shelf .trophy-cushion { left:27.21519%; top:23.91304%; width:45.56962%; height:32.60870%; }
.trophy-tag {
  z-index:5; width:28.69198%; box-sizing:border-box;
  background:linear-gradient(#fff2cc,#f7dfae); border:1px solid #cba879;
  border-radius:clamp(3px,.4cqw,6px); box-shadow:0 1px 2px #37251d40;
  color:#5a3540; font-size:clamp(7px,1.05cqw,16px); font-variant-numeric:tabular-nums;
}
.trophy-tag.has-large-count { font-size:clamp(6px,.9cqw,14px); }
.celestial-display .trophy-tag { width:45.33333%; }
.coal-display .trophy-tag { width:56.66667%; }
.coal-display .trophy-cushion { left:12.5%; top:15.30612%; width:75%; height:35.71429%; }
@media(max-width:600px) {
  .trophy-shelf .trophy-cushion { left:28.76712%; top:35.55556%; width:42.46575%; height:35.55556%; }
  .trophy-tag { width:26.71233%; font-size:clamp(7px,2.5cqw,15px); }
  .trophy-tag.has-large-count { font-size:clamp(6px,2cqw,13px); }
  .celestial-display .trophy-tag { width:47.27273%; }
  .coal-display .trophy-tag { width:55.71429%; }
  .coal-display .trophy-cushion { left:10.71429%; top:18.01802%; width:78.57143%; height:36.03604%; }
}
