
/* PV Lab Moods. Anchor to the creation deck, but measure actual space above it
   so the popup never clips against the top of the browser viewport. */
#image-composer .composer-moods {
  position:absolute;bottom:calc(100% + var(--moods-anchor-gap,14px) - var(--moods-overlap,0px));left:50%;z-index:125;
  transform:translateX(-50%);
  box-sizing:border-box;width:min(990px,calc(100vw - 36px));
  max-height:min(720px,var(--moods-available-height,calc(76dvh - 44px)));
  display:flex;flex-direction:column;overflow:hidden;padding:20px;
  border:1px solid #4b4b4d;border-radius:20px;background:#1a1b1c;color:#f0f0f0;
  box-shadow:0 24px 90px #000b;
}
#image-composer .composer-moods[hidden]{display:none!important}
/* Quiet the composer without hiding it. The overlay also blocks accidental edits
   while choosing a Mood, and a click on it closes the popup. */
#image-composer .composer-moods-backdrop{
  position:absolute;inset:0;z-index:124;border:0;border-radius:inherit;
  background:rgba(7,8,10,.52);backdrop-filter:blur(1.25px);
}
#image-composer .composer-moods-backdrop[hidden]{display:none!important}
#image-composer .composer-moods.is-viewport-tight{overflow-y:auto;overscroll-behavior:contain}
#image-composer .composer-moods.is-viewport-tight .moods-grid{flex:0 0 auto;max-height:150px!important}
.moods-header{display:grid;flex:0 0 auto;grid-template-columns:minmax(0,1fr) auto;column-gap:16px;row-gap:0;padding:2px 2px 0}
.moods-header-copy{display:contents}
.moods-header-copy>.moods-kicker{grid-column:1/-1;grid-row:1}
.moods-header-copy>.moods-title-row{grid-column:1;grid-row:2;min-width:0}
.moods-header-copy>p{grid-column:1/-1;grid-row:3}
.moods-header-actions{display:flex;grid-column:2;grid-row:2;align-items:center;align-self:center;gap:6px}
#image-composer #composer-moods-create{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:0 0 auto;
  box-sizing:border-box;min-height:42px;padding:9px 15px;
  border:1px solid #595c60;border-radius:10px;
  background:#292b2d;color:#eaedec;
  font-family:inherit;font-size:13px;font-weight:650;line-height:1.15;letter-spacing:-.01em;
  white-space:nowrap;cursor:pointer;transition:background-color .15s,border-color .15s,color .15s
}
#image-composer #composer-moods-create .moods-create-plus{
  font-size:19px;font-weight:400;line-height:.8;color:#d6ff00
}
#image-composer #composer-moods-create:hover{
  border-color:#a9b78b;background:#363b35;color:#fff
}
#image-composer #composer-moods-create:focus-visible{
  outline:2px solid #d6ff00!important;outline-offset:3px
}

.moods-title-row{display:flex;align-items:center;gap:10px}
.moods-kicker{font-size:10px;color:#a1a1a1;letter-spacing:.13em;text-transform:uppercase}
#image-composer #composer-moods-title{display:block;margin:0;font-size:26px;letter-spacing:-.055em;font-weight:540;line-height:1.1;color:#fff;outline:none}
.moods-header p{margin:8px 0 10px;font-size:12px;line-height:1.4;color:#a5a5a5}
#image-composer #composer-moods-close{
  display:inline-flex;align-items:center;justify-content:center;
  flex:0 0 42px;width:42px;height:42px;min-height:42px;margin:0;padding:0;
  border:0;border-radius:6px;background:transparent;color:#aeb1b3;
  font-size:21px;line-height:1;transition:color .15s
}
#image-composer #composer-moods-close:hover{background:transparent;color:#fff}
#image-composer #composer-moods-close:focus-visible{outline:2px solid #d6ff00!important;outline-offset:3px}
.moods-toolbar{display:flex;flex:0 0 auto;align-items:center;justify-content:space-between;gap:16px;min-width:0}
/* Mood categories are navigation, not tiny metadata. Increase their hit area and
   text while keeping the cards, gallery grid and footer completely unchanged. */
.moods-filters{display:flex;gap:8px;overflow-x:auto;padding:2px 0 11px;flex:0 1 auto;min-width:0;scrollbar-width:thin;overscroll-behavior-x:contain}
#image-composer .moods-filter{
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
  min-height:39px;padding:9px 15px;border:1px solid #55575a;border-radius:30px;
  background:transparent;color:#d1d3d5;font-size:13px;font-weight:550;line-height:1.2;
  letter-spacing:-.01em;white-space:nowrap;transition:background-color .15s,border-color .15s,color .15s
}
#image-composer .moods-filter:hover:not(.is-selected){background:#2b2d30;border-color:#86898d;color:#fff}
#image-composer .moods-filter.is-selected{background:#eee;border-color:#eee;color:#171717;font-weight:650}
#image-composer .moods-filter:focus-visible{outline:2px solid #d6ff00!important;outline-offset:2px}
.moods-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px;flex:0 1 auto;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-gutter:stable;min-height:0;padding:2px 2px 2px;scrollbar-width:thin;scrollbar-color:#666 transparent}
#image-composer .moods-card{display:flex;flex-direction:column;gap:7px;min-width:0;padding:0;border:0;background:transparent;color:#ededed;text-align:left;border-radius:9px}
#image-composer .moods-card[hidden]{display:none!important}
.moods-card-media{display:block;position:relative;aspect-ratio:4/3;width:100%;background:#2c2c2c;overflow:hidden;border:2px solid transparent;border-radius:9px}
.moods-card-media img{display:block;width:100%;height:100%;object-fit:cover}
.moods-card-copy{display:block;min-width:0}
.moods-card-copy strong{display:block;font-size:14px;line-height:1.3;font-weight:570;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#f0f0f0}
.moods-card-copy small{display:block;margin-top:3px;color:#b3b5b7;font-size:12px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#image-composer .moods-card:hover .moods-card-media{border-color:#909090}
#image-composer .moods-card.is-selected .moods-card-media{border-color:#d6ff00}
#image-composer .moods-card.is-selected strong{color:#d6ff00}
.moods-look-hong-kong-nights img{object-position:center center;filter:none}
/* These source photographs include a scan edge and an instant-print surround.
   Crop only their card windows, keeping the original photographs untouched. */
.moods-look-midnight-reverie img{transform:scale(1.045)}
.moods-look-polaroid-600 img{
  position:absolute;inset:0 auto auto 0;width:113%;max-width:none;height:auto;
  transform:translate(-5.6%,-5.6%)
}
.moods-look-90s-cinema img{filter:none;object-position:center center}
.moods-look-night-flash img{filter:none}
.moods-look-fashion-editorial img{filter:contrast(1.04) saturate(.84)}
.moods-look-80s-film img{filter:none}
.moods-look-kodak-gold img{filter:sepia(.22) saturate(1.52) contrast(1.15) brightness(1.06)}
.moods-look-soft-pastel-film img{filter:none;object-position:center center}
.moods-look-frutiger-aero img{filter:none}
.moods-look-dreamcore img{filter:none;object-position:center center}
.moods-look-sumi-ink img{filter:contrast(1.07) saturate(.8)}
.moods-look-hyper-pop img{filter:saturate(1.65) contrast(1.2)}


/* Selected mood is beside filters; intensity and CTA occupy the lower rail. */
.moods-footer{
  display:flex;flex:0 0 auto;flex-direction:column;gap:6px;
  padding-top:10px;border-top:1px solid #393a3c;background:#1a1b1c
}
.moods-selection{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex:0 1 auto;min-width:0;max-width:42%;padding-bottom:11px}
#image-composer .moods-selection[hidden]{display:none!important}
.moods-current{display:flex;align-items:center;gap:8px;min-width:0}
.moods-current-label{flex:0 0 auto;font-size:9px;font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:#979a9c}
.moods-selected{display:block;min-width:0;max-width:230px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:650;line-height:1.2;color:#dfff9a}
.moods-about{position:relative;display:flex;align-items:center;justify-content:center;flex:0 0 auto;min-height:28px}
#image-composer #composer-moods-about{
  display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;min-height:28px;padding:0;
  border:0;border-radius:50%;background:none;color:#a2a5a8;font:inherit;font-size:11px;cursor:pointer
}
#image-composer #composer-moods-about:hover,
#image-composer #composer-moods-about[aria-expanded="true"]{color:#ededed}
#image-composer #composer-moods-about:focus-visible{outline:2px solid #d6ff00;outline-offset:3px;border-radius:5px}
.moods-info-icon{
  display:inline-flex;align-items:center;justify-content:center;width:17px;height:17px;
  border:1px solid #8c8f93;border-radius:50%;font-size:10px;line-height:1;font-weight:600
}
.moods-about-popover{
  position:absolute;left:0;top:calc(100% + 9px);z-index:10;
  width:min(295px,calc(100vw - 45px));padding:15px 17px;
  border:1px solid #515357;border-radius:11px;background:#292a2d;box-shadow:0 14px 35px #0009;color:#ddd
}
#image-composer .moods-about-popover[hidden]{display:none!important}
.moods-about-popover strong{font-size:12px;color:#fafafa;font-weight:650}
.moods-about-popover p{font-size:11px;line-height:1.55;margin:7px 0 0;color:#bbbfc2}
.moods-controls{
  display:grid;grid-template-columns:minmax(0,1fr) 170px;column-gap:22px;align-items:center
}
.moods-strength{display:flex;flex-direction:column;gap:4px;min-width:0;width:100%}
.moods-strength-header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.moods-strength label{font-size:12px;color:#d7d9da;font-weight:640}
.moods-browse-count{min-width:0;color:#aeb1b3;font-size:11px;font-weight:400;white-space:nowrap;font-variant-numeric:tabular-nums}
.moods-browse-count[hidden]{display:none!important}
#image-composer #composer-moods-amount{
  min-width:36px;color:#e5e5e5;font-size:12px;font-weight:650;
  font-variant-numeric:tabular-nums;text-align:right
}
#image-composer .film-finish-compact input[type=range],
#image-composer #composer-moods-intensity{
  -webkit-appearance:none;appearance:none;display:block;min-width:0;width:100%;height:25px;
  margin:0;border:0;background:transparent;cursor:pointer;accent-color:#d6ff00
}
#image-composer .film-finish-compact input[type=range]::-webkit-slider-runnable-track,
#image-composer #composer-moods-intensity::-webkit-slider-runnable-track{
  height:7px;border-radius:999px;
  background:linear-gradient(to right,#d6ff00 0%,#d6ff00 var(--moods-progress,60%),#515457 var(--moods-progress,60%),#515457 100%)
}
#image-composer .film-finish-compact input[type=range]::-webkit-slider-thumb,
#image-composer #composer-moods-intensity::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;width:19px;height:19px;margin-top:-6px;
  border:2px solid #242526;border-radius:50%;background:#d6ff00;box-shadow:0 0 0 1px #d6ff0030
}
#image-composer .film-finish-compact input[type=range]::-moz-range-track,
#image-composer #composer-moods-intensity::-moz-range-track{height:7px;border:0;border-radius:999px;background:#515457}
#image-composer .film-finish-compact input[type=range]::-moz-range-progress,
#image-composer #composer-moods-intensity::-moz-range-progress{height:7px;border:0;border-radius:999px;background:#d6ff00}
#image-composer .film-finish-compact input[type=range]::-moz-range-thumb,
#image-composer #composer-moods-intensity::-moz-range-thumb{width:17px;height:17px;border:2px solid #242526;border-radius:50%;background:#d6ff00}
#image-composer .film-finish-compact input[type=range]:focus-visible,
#image-composer #composer-moods-intensity:focus-visible{outline:2px solid #d6ff00;outline-offset:3px;border-radius:10px}
#image-composer .film-finish-compact input[type=range]:disabled,
#image-composer #composer-moods-intensity:disabled{opacity:.3;cursor:not-allowed}
.moods-actions{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:2px;min-width:0}
#image-composer .moods-actions button{
  border:0;background:transparent;color:#b0b3b5;font:inherit;font-size:10px;cursor:pointer
}
#image-composer .moods-actions button[hidden]{display:none!important}
#image-composer #composer-moods-done,
#image-composer #composer-moods-switch{
  display:flex;align-items:center;justify-content:center;gap:9px;
  width:100%;min-height:48px;padding:12px 14px;border:1px solid #d6ff00;border-radius:9px;
  background:#d6ff00;color:#171717;font-size:13px;font-weight:700;white-space:nowrap
}
#image-composer #composer-moods-done span,
#image-composer #composer-moods-switch span{font-size:16px;font-weight:500;line-height:1}
#image-composer #composer-moods-done:not(:disabled):hover,
#image-composer #composer-moods-switch:not(:disabled):hover{background:#e4ff51;border-color:#e4ff51}
#image-composer .moods-actions button:focus-visible{outline:2px solid #fff;outline-offset:3px}
#image-composer #composer-moods-done:disabled,
#image-composer #composer-moods-switch:disabled{
  opacity:1;background:#303234;border-color:#45474a;color:#878b8e;cursor:not-allowed
}
#image-composer #composer-moods-none{
  flex:0 0 auto;min-height:28px;padding:4px 6px;border:0;background:none;color:#a2a6a7;font:inherit;font-size:11px;text-align:center;cursor:pointer
}
#image-composer #composer-moods-none:not(:disabled):hover{
  color:#f2f2f2;text-decoration:underline;text-underline-offset:3px
}
#image-composer #composer-moods-none:disabled{visibility:hidden}
.moods-compat{margin:0;color:#dfc79e;font-size:11px;line-height:1.3}
#image-composer .moods-compat[hidden]{display:none!important}
#image-composer .composer-settings-pill.is-mood-selected{border-color:#b8ce32;background:#323923;color:#edffb3}
@media(max-width:740px){
  #image-composer .composer-moods{left:50%;width:calc(100vw - 18px);padding:14px;max-height:min(70dvh,var(--moods-available-height,70dvh))}
  #image-composer #composer-moods-title{font-size:21px}
  .moods-header{column-gap:8px}
  .moods-header-actions{gap:4px}
  #image-composer #composer-moods-create{
    min-height:44px;padding:9px 12px;font-size:12px;gap:6px
  }
  #image-composer #composer-moods-close{
    flex-basis:44px;width:44px;min-width:44px;height:44px;min-height:44px;
    margin:0
  }

  .moods-toolbar{flex-wrap:wrap;gap:6px}
  .moods-filters{width:100%;padding-bottom:5px}
  .moods-selection{justify-content:flex-start;max-width:100%;width:100%;padding-bottom:6px}
  .moods-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 10px;margin:8px 0 12px}
  .moods-card-media{aspect-ratio:5/4}
  .moods-card-copy small{min-height:0}
  .moods-footer{gap:6px;padding-top:9px}
  .moods-controls{grid-template-columns:minmax(0,1fr) 122px;gap:12px}
  .moods-strength{gap:3px}
  .moods-actions{gap:2px}
  #image-composer #composer-moods-done,
  #image-composer #composer-moods-switch{min-height:44px;padding:9px 8px}
}
@media(max-width:420px){
  .moods-create-tail{display:none}
  #image-composer #composer-moods-create{padding:8px 11px}
}
@media(max-width:340px){
  .moods-create-label{display:none}
  #image-composer #composer-moods-create{width:44px;min-width:44px;padding:8px}
}
@media(max-width:390px){
  .moods-selected{font-size:12px}
  .moods-controls{grid-template-columns:minmax(0,1fr) 110px;gap:8px}
  .moods-browse-count{display:none}
  #image-composer #composer-moods-done,
  #image-composer #composer-moods-switch{gap:6px}
}
@media(prefers-reduced-motion:reduce){#image-composer .composer-moods *{scroll-behavior:auto}}

/* Two complete desktop rows with room around the photographs and readable,
   single-line captions. The header and action rail stay outside the scroller. */
@media(min-width:741px){
  .moods-card-media{aspect-ratio:6/5}
  .moods-header p{margin-bottom:7px}
  .moods-toolbar{margin-bottom:12px}
  .moods-filters{padding-bottom:2px}
  .moods-selection{padding-bottom:2px}
  .moods-grid{row-gap:20px;margin-bottom:16px}
  .moods-footer{gap:2px;padding-top:12px}
  .moods-strength{
    display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:17px 25px;gap:4px
  }
  .moods-strength-header{grid-column:1;grid-row:1;align-self:center;min-width:0}
  #image-composer #composer-moods-intensity{grid-column:1;grid-row:2}
}
/* Short laptop windows keep the two-row composition within the viewport. */
@media(min-width:741px) and (max-height:760px){
  #image-composer .composer-moods{padding:16px}
  .moods-toolbar{margin-bottom:12px}
  .moods-grid{row-gap:16px;margin-bottom:12px}
  .moods-card-media{max-height:max(88px,calc((100dvh - 440px)/2))}
}
.pv-native-lab .moods-browse-count{display:none}

/* My Moods gallery cards remain inside the existing floating mood selector. */
#image-composer .moods-my-empty[hidden],#image-composer .moods-board-wrap[hidden]{display:none!important}
.moods-my-empty{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:145px;padding:24px;border:1px dashed #515357;border-radius:12px;text-align:center;color:#e4e5e8}
.moods-my-empty strong{font-size:14px}
.moods-my-empty p{margin:0;color:#a7aaac;font-size:12px;line-height:1.5}
#image-composer .moods-my-empty button{margin-top:5px;min-height:37px;padding:8px 16px;border:1px solid #d6ff00;border-radius:9px;background:#d6ff00;color:#181a18;font-size:12px;font-weight:660}
.moods-board-wrap{position:relative;min-width:0}
#image-composer .moods-board-wrap>.moods-card{width:100%}
#image-composer .moods-board-wrap>.moods-board-edit{position:absolute;top:8px;right:8px;min-height:28px;padding:4px 9px;border-radius:7px;border:1px solid #fff6;background:#121417d9;color:#fff;font-size:10px}
#image-composer .moods-board-wrap>.moods-board-edit:hover{background:#383b3c}
.moods-board-cover{display:grid;place-items:center}
.moods-board-placeholder{display:grid;place-items:center;height:100%;font-size:32px;background:linear-gradient(120deg,#263333,#40404a);color:#d5ffc4}
.moods-board-count{position:absolute;left:7px;bottom:7px;font-size:10px;color:#f5f5f5;background:#111b;padding:4px 7px;border-radius:5px}
/* Private saved style editor. Not part of the fixed generation deck. */
#moodboard-editor{box-sizing:border-box;width:min(560px,calc(100vw - 28px));max-width:none;max-height:min(86dvh,760px);margin:auto;padding:0;border:1px solid #57595d;border-radius:18px;background:#1c1d20;color:#f0f0f1;box-shadow:0 32px 95px #000b;overflow:auto;font-family:inherit}
#moodboard-editor::backdrop{background:#07080ac9;backdrop-filter:blur(5px)}
#moodboard-editor form{display:flex;flex-direction:column;gap:17px;margin:0;padding:24px}
.moodboard-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.moodboard-head span{font-size:10px;letter-spacing:.13em;color:#adacb0}
.moodboard-head h2{margin:5px 0 7px;color:#fff;font-size:25px;font-weight:580;letter-spacing:-.045em}
.moodboard-head p{margin:0;font-size:12px;line-height:1.5;color:#adb0b4}
#moodboard-cancel{flex:0 0 35px;width:35px;height:35px;min-height:35px;padding:0;background:#303136;border:1px solid #45464a;border-radius:50%;font-size:22px;line-height:1;color:#e2e4e7}
.moodboard-row{display:flex;flex-direction:column;gap:7px;min-width:0}
.moodboard-row label{color:#d6d8db;font-size:12px;font-weight:590}
#moodboard-editor :is(input,textarea,select){box-sizing:border-box;width:100%;min-height:42px;padding:10px 12px;border:1px solid #4a4c50;border-radius:9px;background:#282a2e;color:#f4f4f5;font:inherit;font-size:13px}
#moodboard-editor textarea{min-height:103px;resize:vertical;line-height:1.55}
#moodboard-editor :is(input,textarea,select):focus-visible{outline:2px solid #d6ff00;outline-offset:1px}
.moodboard-row small{font-size:11px;line-height:1.5;color:#a3a6a9}
.moodboard-settings{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.moodboard-images-heading{display:flex;justify-content:space-between;align-items:center;color:#e2e2e3;font-size:12px}
.moodboard-images-heading span{font-size:11px;color:#9a9ea1}
.moodboard-images{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.moodboard-image-tile{position:relative;aspect-ratio:4/5;min-width:0;background:#33363a;border-radius:8px;overflow:hidden}
.moodboard-image-tile img{display:block;width:100%;height:100%;object-fit:cover}
#moodboard-editor .moodboard-image-remove{position:absolute;top:4px;right:4px;display:grid;place-items:center;width:22px;height:22px;min-height:22px;padding:0;border:1px solid #ffffff57;border-radius:50%;background:#13151add;color:#fff;font-size:15px}
.moodboard-actions{display:flex;align-items:center;gap:12px;margin-top:2px;border-top:1px solid #3c3e42;padding-top:14px}
.moodboard-actions span{flex:1}
#moodboard-delete{min-height:37px;padding:7px 10px;border:1px solid #544448;border-radius:8px;background:none;color:#c99ca5;font-size:11px}
#moodboard-save{min-width:155px;min-height:43px;padding:10px 16px;border:1px solid #d6ff00;border-radius:9px;background:#d6ff00;color:#171917;font:inherit;font-size:13px;font-weight:700}
#moodboard-save:hover{background:#e7ff7c}
#moodboard-save:disabled{opacity:.55;cursor:not-allowed}
.moodboard-editor-status{min-height:0;margin:0;color:#aab0b2;font-size:11px}
.moodboard-editor-status:empty{display:none}
.moodboard-editor-status.error{color:#efb2b2}
.image-detail-action-grid #image-detail-save-mood{grid-column:1/-1;min-height:37px;border-color:#63695c;color:#ddedc6;background:#30352d;font-size:12px}
.image-detail-action-grid #image-detail-save-mood:hover{background:#3c4534}
@media(max-width:560px){#moodboard-editor form{padding:17px;gap:13px}.moodboard-settings{grid-template-columns:1fr}.moodboard-images{grid-template-columns:repeat(4,minmax(0,1fr))}.moodboard-head h2{font-size:22px}}

.moodboard-images-heading>div{display:flex;align-items:center;gap:11px}
#moodboard-editor .moodboard-upload-label{display:inline-block;padding:7px 9px;border:1px solid #515559;border-radius:7px;color:#dce7c5;background:#2b302a;font-size:11px;cursor:pointer}
#moodboard-editor .moodboard-upload-label:hover{border-color:#88916c;background:#363e31}
#moodboard-editor #moodboard-upload[hidden]{display:none}
@media(max-width:390px){.moodboard-images-heading>div{gap:6px}#moodboard-editor .moodboard-upload-label{font-size:10px;padding:6px}}

/* Author CSS must explicitly respect native hidden state. */
#moodboard-editor .moodboard-config[hidden],
#moodboard-editor #moodboard-target-row[hidden],
#moodboard-editor #moodboard-delete[hidden]{display:none!important}

/* Hong Kong Nights: retain the lower roadway/car in deck thumbnails. */
.moods-look-hong-kong-nights img{object-position:50% 100%}

/* Berlin Rave: show the face, exaggerated shoulders and layered leather, not a midriff crop. */
.moods-look-berlin-rave img{object-position:50% 12%;filter:none}
