/* Muted gilded frames and painted mats, without altering the source photographs. */
.photo-hall { --ph-gold: #be9c62; --ph-ink: #151715; color: #eee7d8; padding-top: .6rem; }
.photo-hall [hidden] { display: none !important; }
.ph-intro { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-bottom: 1rem; border-bottom: 1px solid rgba(190,156,98,.22); }
.ph-eyebrow { font-size: .64rem; letter-spacing: .2em; color: #c7ab78; }
.ph-intro p { font-family: Georgia, serif; font-size: clamp(1.1rem,2.1vw,1.7rem); margin: .5rem 0 0; }
.ph-total { font-family: Georgia, serif; font-size: 2.5rem; line-height: 1; text-align: right; color: #d0b47b; }
.ph-total small { display: block; margin-top: .45rem; font: .65rem/1.2 Arial,sans-serif; color: #bcb5a8; letter-spacing: .04em; white-space: nowrap; }
.ph-hint, .ph-viewer-help { color: #b8b1a3; font-size: .79rem; margin: .8rem 0 1.4rem; }
.ph-gallery { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1.65rem 1.3rem; }
.ph-card { min-width: 0; display: block; padding: 0; border: 0; border-radius: 0; background: transparent; color: inherit; text-align: left; cursor: pointer; }
.ph-frame, .ph-inspection-frame { display: block; padding: 8px; background: linear-gradient(135deg,#8f794f 0%,#d2bd8a 13%,#5b4b30 17%,#ae945c 22%,#3b3428 48%,#b49a65 78%,#dfcea1 84%,#665538 90%); border: 1px solid #756342; box-shadow: 0 12px 24px rgba(0,0,0,.3),inset 0 0 0 2px rgba(237,218,160,.17),inset 0 0 0 5px rgba(27,24,18,.65); }
.ph-mat { position: relative; display: flex; justify-content: center; align-items: center; overflow: hidden; background: #191d1c; padding: 9px; aspect-ratio: 3/4; box-shadow: inset 0 0 0 1px #938570, inset 0 2px 8px #080a08; }
.ph-mat img { display: block; width: 100%; height: 100%; max-height: 100%; object-fit: contain; }
.ph-canvas-grain { position: absolute; inset: 0; pointer-events: none; opacity: .16; background-image: repeating-linear-gradient(0deg,transparent 0px,transparent 2px,rgba(238,229,204,.1) 2px,rgba(238,229,204,.1) 3px),repeating-linear-gradient(90deg,transparent 0px,transparent 3px,rgba(0,0,0,.14) 3px,rgba(0,0,0,.14) 4px); }
.ph-caption { display: flex; justify-content: space-between; align-items: center; gap: .5rem; padding: .65rem .1rem 0; color: #cbb992; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; }
.ph-card:focus-visible, .photo-hall button:focus-visible { outline: 2px solid #e7cc88; outline-offset: 5px; }
.ph-load-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-top: 1.6rem; }
.ph-count { font-size: .72rem; color: #b8b1a3; }
.ph-more, .ph-back, .ph-step-controls button { border: 1px solid rgba(201,171,111,.5); border-radius: 3px; color: #e4d7b8; background: rgba(201,171,111,.06); padding: .75rem 1rem; font: inherit; font-size: .76rem; min-height: 44px; cursor: pointer; }
.ph-more span { margin-left: .7rem; }
.ph-source-note { margin: 1.5rem 0 0; padding-top: .8rem; border-top: 1px solid rgba(190,156,98,.18); color: #8f8b81; font-size: .66rem; }
.ph-viewer { outline: none; }
.ph-viewer-toolbar { display: flex; justify-content: space-between; align-items: center; gap: .8rem; margin-bottom: 1.2rem; }
.ph-viewer-count { color: #d0b47b; font-size: .77rem; letter-spacing: .06em; }
.ph-step-controls { display: flex; gap: .5rem; }
.ph-step-controls button { min-width: 44px; padding: .5rem; font-size: 1.15rem; }
.ph-step-controls button:disabled { color: #66665f; border-color: #44463e; cursor: default; }
.ph-viewer-stage { padding: 1rem; display: flex; justify-content: center; align-items: center; min-height: 260px; background: radial-gradient(ellipse at 50% 10%,rgba(216,192,139,.1),transparent 70%),#111513; box-shadow: inset 0 0 45px rgba(0,0,0,.35); }
.ph-inspection-frame { max-width: 100%; margin: 0; padding: 12px; }
.ph-inspection-mat { position: relative; background: #191d1c; padding: 11px; box-shadow: inset 0 0 0 1px #938570,inset 0 3px 9px #080a08; }
.ph-full-image { display: block; width: auto; height: auto; max-width: 100%; max-height: min(68vh,850px); object-fit: contain; }
.ph-viewer-help { text-align: center; margin: 1rem 0 0; }
.ph-scene-wall { display: flex; align-items: center; justify-content: center; gap: 18px; perspective: 800px; transform-style: preserve-3d; padding: 26px 14px 18px; }
.ph-scene-frame { width: 135px; flex: 0 1 135px; transform: translateZ(24px); }
.ph-scene-frame:first-child { transform: rotateY(16deg) translateZ(2px); }
.ph-scene-frame:last-child { transform: rotateY(-16deg) translateZ(2px); }
.ph-scene-frame .ph-frame { padding: 5px; box-shadow: 3px 8px 13px rgba(0,0,0,.42); }
.ph-scene-frame .ph-mat { padding: 5px; aspect-ratio: 3/4; }
.ph-scene-frame .ph-caption { font-size: .55rem; color: #d4b87c; }
@media (hover:hover) and (prefers-reduced-motion:no-preference) { .ph-card .ph-frame { transition: transform .2s ease,box-shadow .2s ease; } .ph-card:hover .ph-frame { transform: translateY(-3px); box-shadow: 0 16px 28px rgba(0,0,0,.4); } }
@media (max-width:950px) { .ph-gallery { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.35rem 1rem; } }
@media (max-width:620px) { .ph-gallery { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.3rem .9rem; } .ph-frame { padding: 6px; } .ph-mat { padding: 6px; } .ph-load-row { flex-direction: column; gap: .4rem; align-items: stretch; text-align: center; } .ph-more { width: 100%; } .ph-viewer-toolbar { flex-wrap: wrap; gap: .6rem; } .ph-back { padding: .6rem .7rem; } .ph-viewer-count { flex: 1; text-align: right; } .ph-step-controls { width: 100%; justify-content: center; } .ph-step-controls button { width: 72px; } .ph-viewer-stage { padding: .45rem; } .ph-inspection-frame { padding: 8px; } .ph-inspection-mat { padding: 7px; } .ph-full-image { max-height: 59vh; } .ph-scene-wall { gap: 10px; padding: 18px 7px 10px; } .ph-scene-frame { width: 102px; } }
@media (prefers-reduced-motion:reduce) { .ph-card .ph-frame { transition: none; } }