/* PlaCamp media scene system v1.0.0-beta.12. Scoped entirely to the media CPT. */
.pcm-detail{
  --pcm-scene-bg:#f5f1e9;
  --pcm-scene-panel:#fffaf1;
  --pcm-scene-accent:#997450;
  --pcm-scene-ink:#31463a;
  --pcm-scene-line:#c7c5b4;
  --pcm-scene-pattern:none;
  --pcm-scene-motif:none;
  --pcm-decor-opacity:.12;
}
.pcm-detail.pcm-theme--plain{--pcm-scene-bg:#f5f1e9;--pcm-scene-motif:none}
.pcm-detail.pcm-theme--nature{--pcm-scene-bg:#eef2e7;--pcm-scene-panel:#f8f8f0;--pcm-scene-accent:#759073;--pcm-scene-ink:#314e3b;--pcm-scene-line:#b5c5b3;--pcm-scene-motif:url('decor/nature.svg');--pcm-scene-pattern:repeating-radial-gradient(ellipse at 92% 7%,transparent 0 22px,#799c8012 23px 24px,transparent 25px 48px)}
.pcm-detail.pcm-theme--tent{--pcm-scene-bg:#eee9db;--pcm-scene-panel:#f8f4ea;--pcm-scene-accent:#788263;--pcm-scene-ink:#484d37;--pcm-scene-line:#b6bea8;--pcm-scene-motif:url('decor/tent.svg');--pcm-scene-pattern:repeating-linear-gradient(90deg,transparent 0 30px,#a69c7e0d 31px 32px,transparent 33px 60px)}
.pcm-detail.pcm-theme--fire{--pcm-scene-bg:#ece1d6;--pcm-scene-panel:#faf1e5;--pcm-scene-accent:#ad754e;--pcm-scene-ink:#544335;--pcm-scene-line:#d1b6a2;--pcm-scene-motif:url('decor/fire.svg');--pcm-scene-pattern:radial-gradient(circle at 8% 12%,#c88f5840 1px,transparent 2px)}
.pcm-detail.pcm-theme--food{--pcm-scene-bg:#f5ecdd;--pcm-scene-panel:#fff8e9;--pcm-scene-accent:#ad8652;--pcm-scene-ink:#594835;--pcm-scene-line:#d2bfa1;--pcm-scene-motif:url('decor/food.svg');--pcm-scene-pattern:repeating-linear-gradient(0deg,transparent 0 24px,#ad95661c 25px 26px,transparent 27px 50px),repeating-linear-gradient(90deg,transparent 0 24px,#ad95661b 25px 26px,transparent 27px 50px)}
.pcm-detail.pcm-theme--gear{--pcm-scene-bg:#e9eeeb;--pcm-scene-panel:#f7f8f5;--pcm-scene-accent:#6d8985;--pcm-scene-ink:#324c4c;--pcm-scene-line:#bbccc5;--pcm-scene-motif:url('decor/gear.svg');--pcm-scene-pattern:linear-gradient(#789a9a1f 1px,transparent 1px),linear-gradient(90deg,#789a9a1f 1px,transparent 1px)}
.pcm-detail.pcm-theme--shopping{--pcm-scene-bg:#eee3d2;--pcm-scene-panel:#faf2e6;--pcm-scene-accent:#ac875e;--pcm-scene-ink:#5a4b39;--pcm-scene-line:#d0ba9b;--pcm-scene-motif:url('decor/shopping.svg');--pcm-scene-pattern:repeating-linear-gradient(120deg,transparent 0 18px,#a9895e14 19px 20px,transparent 21px 38px)}
.pcm-detail.pcm-theme--maintenance{--pcm-scene-bg:#edf0e6;--pcm-scene-panel:#faf9f1;--pcm-scene-accent:#718975;--pcm-scene-ink:#364b3d;--pcm-scene-line:#b8c8b5;--pcm-scene-motif:url('decor/maintenance.svg');--pcm-scene-pattern:repeating-linear-gradient(0deg,transparent 0 27px,#839f8a18 28px 29px,transparent 30px 56px)}
.pcm-detail.pcm-decor--none{--pcm-decor-opacity:0}
.pcm-detail.pcm-decor--soft{--pcm-decor-opacity:.14}
.pcm-detail.pcm-decor--normal{--pcm-decor-opacity:.24}
.pcm-detail.pcm-decor--playful{--pcm-decor-opacity:.37}
.pcm-detail .pcm-scene-stage{position:relative;isolation:isolate;overflow:hidden;min-width:0;width:100%;box-sizing:border-box;padding:clamp(20px,3.5vw,48px);border:1px solid var(--pcm-scene-line);border-radius:clamp(12px,1.6vw,21px);background:var(--pcm-scene-bg);color:var(--pcm-scene-ink)}
.pcm-detail .pcm-scene-stage::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;background-image:var(--pcm-scene-motif),var(--pcm-scene-motif);background-repeat:no-repeat;background-position:right 2% top 2%,left 2% bottom 2%;background-size:clamp(130px,23vw,285px) auto;opacity:var(--pcm-decor-opacity)}
.pcm-detail .pcm-scene-stage::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;background-image:var(--pcm-scene-pattern);background-repeat:repeat;background-size:auto;opacity:calc(var(--pcm-decor-opacity) * .72)}
.pcm-detail.pcm-theme--gear .pcm-scene-stage::after{background-size:28px 28px}
.pcm-detail.pcm-theme--fire .pcm-scene-stage::after{background-size:42px 48px}
.pcm-detail .pcm-scene-stage > *{position:relative;z-index:1}
.pcm-detail .pcm-photo-story{max-width:100%}
.pcm-detail .pcm-story-meta{color:var(--pcm-scene-ink);margin-bottom:clamp(18px,2.6vw,32px);border-bottom:1px solid var(--pcm-scene-line);padding-bottom:10px}
.pcm-detail .pcm-story-meta span:first-child::before{background:var(--pcm-scene-accent)}
.pcm-detail .pcm-story-featured::before{border-color:var(--pcm-scene-line)}
.pcm-detail .pcm-story-tile{background:var(--pcm-scene-panel)}
.pcm-detail .pcm-story-hint{color:var(--pcm-scene-ink)}
.pcm-detail .pcm-timeline-marker{border-color:var(--pcm-scene-accent);color:var(--pcm-scene-ink);background:var(--pcm-scene-panel)}
.pcm-detail .pcm-timeline::before{background:var(--pcm-scene-line)}
.pcm-detail .pcm-timeline-intro{background:var(--pcm-scene-panel);border-color:var(--pcm-scene-line)}
.pcm-detail .pcm-timeline-heading{color:var(--pcm-scene-ink)}
.pcm-detail .pcm-timeline-empty::before,.pcm-detail .pcm-timeline-empty::after{background:var(--pcm-scene-line)}
.pcm-detail .pcm-timeline-empty-art{opacity:.45}
.pcm-detail .pcm-essay-counter{color:var(--pcm-scene-accent)}
.pcm-detail .pcm-essay-frame:nth-child(even){margin-left:auto}
.pcm-detail .pcm-essay-frame:nth-child(odd){margin-right:auto}
.pcm-intro-block{max-width:760px;margin:0 0 clamp(24px,3vw,40px);padding:clamp(16px,2.5vw,25px);border-left:3px solid var(--pcm-scene-accent);background:color-mix(in srgb,var(--pcm-scene-panel) 88%,transparent);border-radius:0 10px 10px 0}
.pcm-intro-block h2{font-size:clamp(19px,2vw,26px);line-height:1.4;color:var(--pcm-scene-ink);margin:0 0 8px}
.pcm-intro-block p{font-size:clamp(14px,1.4vw,16px);line-height:1.8;margin:0;overflow-wrap:anywhere}
/* Frames added to the original six. Existing frame names remain supported. */
.pcm-photo-story.pcm-decor-note .pcm-story-tile{border:8px solid #f8f4e8;border-bottom-width:22px;box-sizing:border-box;box-shadow:7px 9px 0 #b7bdad78,0 12px 20px #29382919;border-radius:3px}
.pcm-photo-story.pcm-decor-label .pcm-story-tile{border:7px solid #fffdf7;border-top:15px solid #c7aa83;box-sizing:border-box;border-radius:4px;box-shadow:0 12px 24px #262d2726}
.pcm-photo-story.pcm-layout-stack.pcm-decor-note .pcm-essay-frame{background:#f7f3e7;border-left:3px solid #b3bea8;box-shadow:0 11px 20px #23372e20}
.pcm-photo-story.pcm-layout-stack.pcm-decor-label .pcm-essay-frame{background:#fffaf0;border-top:8px solid #c7aa83;box-shadow:0 11px 20px #23372e1d}
.pcm-photo-story.pcm-layout-stack.pcm-decor-note .pcm-essay-frame .pcm-story-tile,
.pcm-photo-story.pcm-layout-stack.pcm-decor-label .pcm-essay-frame .pcm-story-tile{border:0;box-shadow:none}
.pcm-photo-story.pcm-decor-note .pcm-tile-caption,
.pcm-photo-story.pcm-decor-label .pcm-tile-caption{white-space:pre-line}
/* Catalog: readable label attached to each media, not over the pixels. */
.pcm-utility-grid{display:grid;gap:clamp(12px,2vw,26px)}
.pcm-utility-grid--catalog{grid-template-columns:repeat(3,minmax(0,1fr))}
.pcm-utility-grid--simple{grid-template-columns:repeat(3,minmax(0,1fr))}
.pcm-utility-card{min-width:0;background:color-mix(in srgb,var(--pcm-scene-panel) 94%,transparent);border:1px solid var(--pcm-scene-line);padding:clamp(9px,1.5vw,16px);border-radius:10px;box-shadow:0 8px 19px #2a332918}
.pcm-utility-grid .pcm-story-tile{display:flex;flex-direction:column;height:auto;aspect-ratio:auto;overflow:visible;border-radius:5px;box-shadow:none}
.pcm-utility-grid .pcm-story-tile .pcm-lightbox-link,.pcm-utility-grid .pcm-story-tile .pcm-original-link{display:block;aspect-ratio:4/3;height:auto;overflow:hidden;border-radius:5px}
.pcm-utility-grid .pcm-story-tile .pcm-photo-image{height:100%;width:100%;object-fit:cover}
.pcm-utility-grid .pcm-tile-caption{position:static;background:none!important;text-shadow:none!important;color:var(--pcm-scene-ink)!important;padding:12px 4px 3px;font-weight:600;font-size:clamp(13px,1.15vw,16px);line-height:1.65;white-space:pre-line;pointer-events:auto;overflow-wrap:anywhere}
.pcm-utility-grid--simple .pcm-utility-card{border:0;padding:0;background:transparent;box-shadow:none}
.pcm-utility-grid--simple .pcm-story-tile{border-radius:8px}
.pcm-utility-grid--simple .pcm-tile-caption{font-weight:500}
.pcm-photo-story.pcm-caption--minimal .pcm-tile-caption{font-size:14px}
.pcm-detail.pcm-caption--rich .pcm-tile-caption{font-size:clamp(14px,1.25vw,17px)}
.pcm-detail.pcm-caption--rich .pcm-utility-grid .pcm-tile-caption{line-height:1.85}
.pcm-detail .pcm-original-link{display:block;position:relative;width:100%;height:100%;overflow:hidden;border-radius:inherit}
.pcm-detail .pcm-original-link img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:800px){
 .pcm-utility-grid--catalog{grid-template-columns:repeat(2,minmax(0,1fr))}
 .pcm-utility-grid--simple{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:540px){
 .pcm-detail .pcm-scene-stage{padding:clamp(12px,4vw,20px);border-radius:12px}
 .pcm-detail .pcm-scene-stage::before{background-size:125px auto;background-position:right 0 top 1%,left 0 bottom 1%}
 .pcm-utility-grid--catalog{grid-template-columns:1fr}
 .pcm-utility-grid--simple{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .pcm-utility-grid--simple .pcm-tile-caption{font-size:12px}
 .pcm-intro-block{padding:13px 16px}
 .pcm-detail .pcm-story-meta{font-size:12px}
}
@media(prefers-reduced-motion:reduce){.pcm-detail .pcm-photo-image{transition:none!important}}

.pcm-layout-stack .pcm-essay .pcm-original-link{height:auto;overflow:hidden;border-radius:10px}
.pcm-layout-stack .pcm-essay .pcm-original-link .pcm-photo-image{width:100%;height:auto;max-height:68vh;object-fit:contain}
.pcm-detail.pcm-note-mode--always .pcm-timeline-empty{padding:16px 12px;background:color-mix(in srgb,var(--pcm-scene-panel) 65%,transparent);border:1px dashed var(--pcm-scene-line);border-radius:9px}
@media(max-width:700px){.pcm-detail.pcm-note-mode--always .pcm-timeline-text.is-empty{display:none}}

.pcm-detail.pcm-note-mode--hidden .pcm-timeline-text.is-empty{display:none}
.pcm-detail.pcm-note-mode--hidden .pcm-timeline-step--notes-hidden{grid-template-columns:minmax(0,1fr) 70px minmax(0,1fr)}
@media(max-width:700px){.pcm-detail.pcm-note-mode--hidden .pcm-timeline-step--notes-hidden{grid-template-columns:44px minmax(0,1fr)}}

/* Lightbox is always soft/neutral; the scene only introduces a very small warmth shift. */
.pcm-lightbox-dialog[data-scene="nature"],.pcm-lightbox-dialog[data-scene="maintenance"]{background:#e9eee6}
.pcm-lightbox-dialog[data-scene="tent"],.pcm-lightbox-dialog[data-scene="shopping"]{background:#eee7dc}
.pcm-lightbox-dialog[data-scene="fire"],.pcm-lightbox-dialog[data-scene="food"]{background:#f0e7dc}
.pcm-lightbox-dialog[data-scene="gear"]{background:#e7edeb}

/* === beta.11 / visible, photo-safe scene ornament ===
   Scene art used to sit under the photos and vanish in dense galleries.
   The new ribbon reserves its own space BEFORE images, keeping art legible.
   Timeline keeps its established sequence/ornament scheme.
*/
.pcm-detail:not(.pcm-layout--timeline) .pcm-scene-stage::before{display:none}
.pcm-detail .pcm-scene-ribbon{
  position:relative;
  display:flex;
  align-items:center;
  gap:clamp(14px,2vw,28px);
  min-height:clamp(65px,7.8vw,90px);
  box-sizing:border-box;
  padding:8px 0 10px;
  margin:0 0 clamp(18px,2.4vw,26px);
  border-bottom:1px solid var(--pcm-scene-line);
  overflow:hidden;
  isolation:isolate;
}
.pcm-detail .pcm-scene-ribbon__mark{
  flex:0 0 clamp(20px,2.5vw,32px);
  height:2px;
  margin-left:clamp(5px,.8vw,10px);
  border-radius:3px;
  background:var(--pcm-scene-accent);
  opacity:.8;
}
.pcm-detail .pcm-scene-ribbon__rule{
  flex:1 1 auto;
  min-width:12px;
  max-width:390px;
  height:1px;
  background:linear-gradient(90deg,var(--pcm-scene-line),transparent);
}
.pcm-detail .pcm-scene-ribbon__art{
  flex:0 0 clamp(130px,20vw,230px);
  align-self:stretch;
  margin-left:auto;
  min-height:52px;
  background-image:var(--pcm-scene-motif);
  background-position:center right;
  background-repeat:no-repeat;
  background-size:clamp(140px,19vw,210px) auto;
  opacity:clamp(.30,calc(var(--pcm-decor-opacity) * 2.4),.74);
  pointer-events:none;
}
/* Suppress the ribbon's display under a zero-decoration choice, even if a
   saved post later gets an unfamiliar combination of setting values. */
.pcm-detail.pcm-decor--none .pcm-scene-ribbon{display:none}
@media(max-width:540px){
 .pcm-detail .pcm-scene-ribbon{
   min-height:63px;
   padding:7px 0 9px;
   gap:9px;
   margin-bottom:18px;
 }
 .pcm-detail .pcm-scene-ribbon__art{flex-basis:clamp(82px,26vw,112px);min-height:47px;background-size:clamp(105px,34vw,130px) auto}
 .pcm-detail .pcm-scene-ribbon__mark{flex-basis:18px;margin-left:5px}
 .pcm-detail .pcm-scene-ribbon__rule{min-width:0}
}