.cp-media { width:100%; min-width:0; }
/* Preference wrappers add a layout level. Size Home's single media directly
   instead of clipping an auto-height child to the old fixed-ratio outer box. */
#page-home .pimg:has(> .cp-media) { aspect-ratio:auto!important; max-height:none; }
#page-home .pimg > .cp-media > div:not(.carousel) > :is(img,video) {
  width:100%; height:auto; max-height:600px; aspect-ratio:auto; object-fit:contain;
}
.cp-photo-backdrop { display:none!important; }
#page-home .pimg > .cp-media > div:has(> .cp-photo-backdrop),
#thread-ov .th-media-inner > .cp-media > div:has(> .cp-photo-backdrop) { position:relative; isolation:isolate; }
#page-home .pimg > .cp-media > div > img.cp-photo-backdrop,
#thread-ov .th-media-inner > .cp-media > div > img.cp-photo-backdrop {
  display:block!important; position:absolute; inset:0; width:100%; height:100%; max-height:none;
  object-fit:cover; filter:blur(24px) brightness(.65); transform:scale(1.12);
  pointer-events:none; user-select:none; z-index:-1;
}
/* Fill the desktop popup panel, including the space above/below square photos.
   Mobile keeps the image's natural height. Both copies remain inside the gate. */
@media (min-width:900px) {
  #thread-ov .th-media-inner > .cp-media:has(> div > .cp-photo-backdrop),
  #thread-ov .th-media-inner > .cp-media > div:has(> .cp-photo-backdrop) { height:100%; }
  #thread-ov .th-media-inner > .cp-media > div > img:not(.cp-photo-backdrop) {
    height:100%; max-height:none; object-fit:contain;
  }
}
.cp-thumbnail { height:100%; }
.cp-placeholder { min-height:180px; height:100%; box-sizing:border-box; padding:20px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; text-align:center; background:var(--surface,#242421); color:var(--text,#fff); }
.cp-placeholder p { margin:0; font-size:12px; line-height:1.5; }
.cp-placeholder button,#cp-form button { min-height:44px; padding:10px 16px; border:1px solid var(--border,#555); border-radius:9px; background:var(--accent,#ff8555); color:#161612; font-weight:600; cursor:pointer; }
.cp-thumbnail .cp-placeholder { min-height:0; padding:8px; font-size:11px; gap:6px; }
.cp-thumbnail .cp-placeholder p { display:none; }
.cp-thumbnail .cp-placeholder button { padding:6px; min-height:36px; font-size:11px; }
.cp-notice { margin:20px 0; padding:18px; border-left:3px solid var(--accent); border-radius:8px; background:var(--surface); line-height:1.6; }
.cp-notice p,#cp-form p { color:var(--muted); font-size:13px; line-height:1.6; }
#cp-form fieldset { padding:18px; border:1px solid var(--border); border-radius:12px; }
#cp-form label { display:flex; align-items:center; gap:12px; padding:12px 0; cursor:pointer; }
#cp-form input { width:20px; height:20px; accent-color:var(--accent); }
#cp-form button { margin:8px 8px 0 0; }
#cp-form button:disabled { opacity:.5; cursor:default; }
#cp-form :is(button,input):focus-visible,.cp-placeholder button:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }