/* Approved Postcards exterior only.
   The existing heading, canvas, status and action boxes keep their layout;
   postcard selection, all ten illustrations and PNG export remain untouched. */
body.postcard-redesign {
  background: #08090b;
  color: #eee9df;
}
body.postcard-redesign > footer,
body.postcard-redesign > .grain {
  display: none !important;
}
body.postcard-redesign .workshop[data-workshop="postcard"] {
  position: relative;
  isolation: isolate;
  background: transparent;
}
/* A single uniformly scaled image keeps the armillary globe circular.
   Never stretch this artwork with independent horizontal/vertical sizes. */
body.postcard-redesign .workshop[data-workshop="postcard"]::before {
  content: '';
  position: fixed;
  inset: 82px 0 0;
  z-index: -1;
  pointer-events: none;
  background-image: url('assets/game-shell/postcard-library-night.png');
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: cover;
}
body.postcard-redesign .workshop-heading {
  position: relative;
  color: #eee8d9;
}
body.postcard-redesign .workshop-heading .eyebrow {
  color: #c3ad7d;
}
body.postcard-redesign .workshop-heading h1 em {
  color: #d6c29a;
}
body.postcard-redesign .workshop-heading p {
  color: #d3cbba;
}
body.postcard-redesign .workshop-heading::after {
  content: '✶';
  position: absolute;
  left: calc(50% - 95px);
  bottom: -18px;
  width: 190px;
  height: 14px;
  color: #c2aa71;
  text-align: center;
  font: 12px/14px Georgia, serif;
  background: linear-gradient(#a68d58, #a68d58) left center / 85px 1px no-repeat,
              linear-gradient(#a68d58, #a68d58) right center / 85px 1px no-repeat;
  pointer-events: none;
}
/* Paint outside the approved canvas box, without adding padding or borders. */
body.postcard-redesign .postcard-canvas {
  outline: 1px solid #d2b36d;
  outline-offset: -8px;
  box-shadow: 0 0 0 1px #8f683f, 0 0 0 6px #d9b88c,
              0 0 0 7px #9d7548, 0 20px 55px #000b;
}
body.postcard-redesign .workshop-status {
  color: #ddc89e;
  text-shadow: 0 2px 8px #000;
}
/* Existing hit areas, padding, font metrics, order and gaps are unchanged. */
body.postcard-redesign .workshop[data-workshop="postcard"] > .actions > .btn {
  color: #392a1b;
  border-color: #aa8251;
  background-color: #e7cfaa;
  background-image: linear-gradient(#f4dfbd55, #dcb98f44),
                    url('assets/game-shell/note-parchment.webp');
  background-position: center;
  background-size: cover;
  box-shadow: inset 0 0 0 3px #d9b88c, inset 0 0 0 4px #9e774a88,
              0 4px 14px #0006;
}
body.postcard-redesign .workshop[data-workshop="postcard"] > .actions > .btn:hover {
  border-color: #d9b775;
  background-color: #f1dbb9;
}
body.postcard-redesign .workshop[data-workshop="postcard"] > .actions > .btn:focus-visible {
  outline-color: #e8c884;
}
@media (max-width: 700px) {
  body.postcard-redesign .workshop[data-workshop="postcard"]::before {
    /* iOS browser chrome must not resize this cover box while scrolling.
       The large viewport stays stable and covers the page when bars collapse.
       Legacy vh uses the large layout viewport on older iOS versions. */
    inset: 70px 0 auto;
    height: calc(100vh - 139px);
    height: calc(100lvh - 139px);
    background-image: url('assets/game-shell/postcard-library-night-mobile.png');
    background-size: cover;
    background-position: center bottom;
  }
  body.postcard-redesign #navigation {
    background: #08090b;
    backdrop-filter: none;
  }
}

/* Postcards retain only the card, controls and scenery: no Observer UI. */
body.postcard-redesign #observer-margin,
body.postcard-redesign #observer-whisper{display:none!important}