.gallery-wall{position:relative}
.has-edge-art{position:relative}
.edge-art{display:none;pointer-events:none;user-select:none}
.edge-art.motion-pending{transform:none}

@media(min-width:1200px){
  .gallery-wall{--gallery-inset:clamp(126px,10.5vw,168px)}
  .gallery-wall>.section-shell,.gallery-wall>.art-section>.section-shell{padding-inline:var(--gallery-inset)}
  .edge-art{--art-width:clamp(88px,7.2vw,126px);display:block;position:absolute;width:var(--art-width);z-index:1;margin:0}
  .edge-art--portrait{left:16px;top:148px;--art-tilt:-4deg}
  .edge-art--citrus{right:18px;top:128px;--art-tilt:3deg}
  .edge-art--coffee{left:17px;top:176px;--art-tilt:-2deg}
  /* SVG is 100×42 with a hook at (50,5). Its 42px-high viewport uses xMidYMid
     meet, so narrow frames add vertical letterboxing: y = max(5,21−.16×width). */
  .edge-art-hanging{position:relative;padding-top:36px;rotate:var(--art-tilt);transform-origin:50% max(5px,calc(21px - var(--art-width)*.16))}
  .edge-art-wire{position:absolute;top:0;left:0;width:100%;height:42px;color:#7a7367;overflow:visible}
  .edge-art-wire path{vector-effect:non-scaling-stroke}
  .edge-art-wire circle{fill:#3c3831;stroke:var(--paper);stroke-width:1px}
  .edge-art-frame{position:relative;padding:8px;border:7px solid #3e3026;border-right-color:#271e18;border-bottom-color:#1b1713;background:#f3eee3;box-shadow:inset 0 0 0 1px #c3b8a5,2px 3px 3px #0002,6px 12px 18px -8px #211a1659}
  .edge-art-frame:after{content:'';position:absolute;inset:0;box-shadow:inset 2px 2px 5px #2d24192b;pointer-events:none}
  .edge-art-frame img{width:100%;height:auto;display:block;border:1px solid #d1c4af;aspect-ratio:var(--art-ratio);object-fit:cover}
  .edge-art--portrait{--art-ratio:1390/2423}
  .edge-art--citrus{--art-ratio:1399/2209}
  .edge-art--coffee{--art-ratio:548/835}
  .edge-art--citrus .edge-art-frame{border-color:#806747;border-right-color:#59452e;border-bottom-color:#443524}
  .edge-art-label{width:fit-content;min-width:36px;margin:17px 0 0 17px;padding:4px 6px;border-left:1px solid var(--line);font-size:7px;line-height:1.5;letter-spacing:.13em;color:var(--muted)}
}

/* Compact hanging pieces occupy the section's own top margin on smaller screens. */
@media(min-width:600px) and (max-width:1199px){
  .edge-art--portrait,.edge-art--citrus,.edge-art--coffee{display:block;position:absolute;top:24px;width:45px;margin:0;opacity:.85}
  .edge-art--portrait,.edge-art--coffee{right:var(--page-pad);rotate:3deg}
  .edge-art--citrus{right:var(--page-pad);rotate:-3deg}
  .edge-art-wire,.edge-art-label{display:none}
  .edge-art-frame{border:3px solid #3e3026;padding:3px;background:#f3eee3;box-shadow:2px 3px 5px #0002}
  .edge-art-frame img{display:block;width:100%;height:auto}
  .has-edge-art{padding-top:104px}
}
/* Fixed dark theme, independent of device settings. */
@media all{
  .edge-art-frame{box-shadow:inset 0 0 0 1px #c3b8a5,2px 3px 4px #0006,6px 12px 18px -8px #0009}
  .edge-art-wire{color:#b4a48c}
}
@media(prefers-reduced-motion:reduce){.edge-art-hanging{transform:none!important}}
@media print{.edge-art{display:none!important}.gallery-wall>.section-shell,.gallery-wall>.art-section>.section-shell{padding-inline:var(--page-pad)}}
