/* Architectural materials are shaded per surface, never on a model parent:
   opacity/filter on a shared ancestor would flatten its CSS 3D children. */
.architecture-scale, .architecture-model { position: absolute; width: 280px; height: 180px; transform-origin: 0 0; transform-style: preserve-3d; }
.architecture-model { transform-origin: 50% 100%; }
.arch-group { position: absolute; left: 0; top: 0; transform-style: preserve-3d; }
.arch-plane { position: absolute; left: 0; top: 0; transform-origin: 0 0; backface-visibility: hidden; box-sizing: border-box; }
.arch-plane svg, .arch-spire-face svg { display: block; width: 100%; height: 100%; overflow: visible; }
.arch-plane.brick, .arch-plane.redbrick {
  background: repeating-linear-gradient(0deg,transparent 0 2.7px,#e0bba94a 2.7px 3.3px),
    repeating-linear-gradient(90deg,transparent 0 7px,#53362530 7px 7.6px),
    linear-gradient(115deg,var(--brick-a),var(--brick-b));
}
.brick { --brick-a: #ae7253; --brick-b: #91543d; --gable: #a36b50; }
.redbrick { --brick-a: #a15f46; --brick-b: #814b3b; --gable: #915740; }
.stone { --gable: #c4b491; background: repeating-linear-gradient(0deg,transparent 0 6px,#80735a26 6px 6.7px),linear-gradient(135deg,#d8c9a8,#b2a17d); }
.marble { --gable: #eee3cc; background: repeating-linear-gradient(0deg,transparent 0 4px,#a6977c33 4px 4.5px),repeating-linear-gradient(90deg,#e2d8c0 0 11px,#c4b49a 11px 11.5px,#efe4ce 11.5px 23px); }
.slate { --gable: #606b65; background: repeating-linear-gradient(90deg,transparent 0 6px,#bcc0a530 6px 6.6px),repeating-linear-gradient(0deg,#65716a 0 4px,#414e49 4px 4.7px); }
.lead { --gable: #b1b5a3; background: repeating-linear-gradient(0deg,#b5baaa 0 10px,#828f82 10px 11px); }
.brass { background: linear-gradient(90deg,#9d8046,#e5ce83,#a88a51); }
.iron { background: #46564d; }
.arch-right { box-shadow: inset 0 0 0 300px #352c2420; }
.arch-left, .arch-rear { box-shadow: inset 0 0 0 300px #352c2436; }
.arch-bottom { background: #8e8268; }
.arch-top { box-shadow: inset 0 0 0 300px #fff7db18; }
.arch-gable, .arch-decoration, .arch-cut-stone { background: none; }
.arch-roof-slope { border: .5px solid #a4ac9699; }
.roof-shade { box-shadow: inset 0 0 0 300px #313d3526; }
.arch-spire-face { position: absolute; left: 0; transform-origin: 50% 100%; background: none; backface-visibility: hidden; filter: brightness(var(--facet)); }
.arch-vault { backface-visibility: visible; background: #a49272; }
.arch-window {
  position: absolute; display: block; box-sizing: border-box;
  background: linear-gradient(90deg,transparent 46%,#aeb9a4 46% 53%,transparent 53%),linear-gradient(0deg,transparent 47%,#aeb9a4 47% 52%,transparent 52%),linear-gradient(133deg,#94aea5,#3d5a58 45%,#263f3e);
  border: 1.3px solid #c4b69a; box-shadow: inset 1.3px 1px 1.5px #182c29,0 1.1px 0 #e6ccaa;
}
.arch-window.lancet { border-radius: 50% 50% 0 0 / 40% 40% 0 0; border-width: 1.5px; }
.marble .arch-window { border-color: #e9ddc0; box-shadow: inset 1px 1px 2px #243b31,0 1px 0 #a89b80; }
.arch-window.warm-pane { background-color: #b4a272; background-blend-mode: luminosity; }
.arch-stringcourse { display: block; position: absolute; left: 0; right: 0; background: #d8c5a0; border-bottom: .7px solid #705c4666; box-shadow: 0 1px 1px #382e2444; }
.arch-door { display: block; position: absolute; border: 2px solid #caba99; border-radius: 50% 50% 0 0 / 35% 35% 0 0; box-sizing: border-box; background: linear-gradient(90deg,#344a3e 0 46%,#b09a6a 47% 52%,#293f34 53%); box-shadow: inset 1px 2px 3px #102c25,0 1px 0 #f0dbb2; }
.architecture .pop-tab { left: 42%; width: 16%; }
@media (max-width: 900px) and (min-height: 560px) and (max-height: 680px) {
  body:not(.tabletop) .popup-region:is([data-scene="first"],[data-scene="exploring"],[data-scene="graduation"],[data-scene="running"],[data-scene="prologue"],[data-scene="inside-back"]) .pop-stage {
    bottom: 32px;
    --architecture-scale: calc(var(--pop-scale) * .82);
    transform: translateX(-50%) scale3d(var(--architecture-scale),var(--architecture-scale),var(--architecture-scale)) rotateY(calc(var(--hand-x) * 7deg));
  }
}