/* PV LAB public Image entry. Only the signed-out preview uses these rules.
   Private galleries, wallet balances and generation remain behind Clerk. */
#main:has(#gate.pv-guest-image:not([hidden])){
  width:100%;max-width:none;padding:0!important;overflow:clip;
}
#gate.pv-guest-image:not([hidden]){
  display:block;position:relative;isolation:isolate;width:100%;max-width:none;
  min-height:calc(100dvh - var(--lab-header-height,75px));margin:0!important;
  padding:0!important;border:0;border-radius:0;background:#0c0e13;overflow:hidden;
}
/* Guest and signed-in Image pages share the same reference background.
   Source: PV LAB's approved editorial mockup. No added blur/filter. */
#gate.pv-guest-image:before{
  content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;
  background:#090b11 url("./welcome-cards/image-studio-blue-amber-reference.webp") center top/100% auto no-repeat;
  opacity:1;filter:none;
}
#gate.pv-guest-image:after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(7,8,13,.02),transparent 27%,rgba(8,9,12,.06) 49%,#101011 100%);
}
@media(max-width:700px){
  #gate.pv-guest-image:before{
    background-size:auto 560px;background-position:36% top;
  }
}
#gate.pv-guest-image .pv-guest-content{
  position:relative;z-index:1;max-width:1720px;margin:0 auto;padding:
    clamp(37px,6vh,74px) clamp(20px,2.6vw,46px) 80px;
  display:flex;flex-direction:column;align-items:center;text-align:center;
}
#gate .pv-guest-kicker{color:#d1cbca;font-size:10px;letter-spacing:.36em;line-height:1.4}
#gate.pv-guest-image h1{
  margin:15px 0 0;font:400 clamp(32px,3.3vw,54px)/1.09 'DM Sans',Arial,sans-serif;
  letter-spacing:-.048em;color:#f8f8f8;text-wrap:balance;
}
#gate .pv-guest-subtitle{margin:13px 0 0;font:400 14px/1.55 'DM Sans',Arial,sans-serif;color:#d4d0d1}
#gate .pv-guest-credit-note{margin:12px 0 0;color:#c9c6c9;font-size:12px}
#gate .pv-guest-credit-note strong{color:#fff;font-weight:650}
#gate .pv-guest-cards{
  display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(9px,1vw,18px);
  width:100%;margin:31px 0 0;
}
#gate .pv-guest-card{
  appearance:none;position:relative;display:block;min-width:0;width:100%;
  height:clamp(275px,40vh,405px);padding:0;margin:0;overflow:hidden;
  color:#fff;text-align:left;cursor:pointer;background:#111216;
  border:1px solid rgba(255,255,255,.24);border-radius:13px;
  box-shadow:0 14px 33px rgba(0,0,0,.38);transition:transform .2s,border-color .2s,box-shadow .2s;
}
#gate .pv-guest-card img{
  position:absolute;inset:0;display:block;width:100%;height:100%;
  object-fit:cover;object-position:center;filter:brightness(.94);transition:transform .28s,filter .28s;
}
#gate .pv-guest-card:nth-child(3) img{object-position:64% center}
#gate .pv-guest-card:nth-child(5) img{object-position:50% center}
#gate .pv-guest-card:after{
  content:"";position:absolute;inset:37% 0 0;pointer-events:none;
  background:linear-gradient(transparent 24%,rgba(0,0,0,.16) 55%,rgba(0,0,0,.78));
}
#gate .pv-guest-card span{
  position:absolute;bottom:17px;left:18px;right:12px;z-index:1;
  display:block;font:430 clamp(16px,1.28vw,21px)/1.2 'DM Sans',Arial,sans-serif;
  white-space:nowrap;letter-spacing:-.025em;text-shadow:0 2px 12px #0009;
}
#gate .pv-guest-card small{
  display:block;margin-top:9px;color:#e5e2e0;
  font:400 clamp(8px,.6vw,10px)/1.2 'DM Sans',Arial,sans-serif;letter-spacing:.19em;
}
#gate .pv-guest-card:hover,#gate .pv-guest-card:focus-visible{
  transform:translateY(-2px);border-color:#f9f0eb;
  box-shadow:0 0 0 1px #eaded777,0 13px 35px #0009;
}
#gate .pv-guest-card:hover img{filter:brightness(1);transform:scale(1.026)}
#gate .pv-guest-card[aria-pressed=true],
#gate .pv-guest-card:first-child:not(:has(~.pv-guest-card[aria-pressed=true])):not([aria-pressed=true]){
  border-color:#f0d9c9;box-shadow:0 0 0 1px #f5dccba0,0 0 26px #f3c8a144,0 18px 38px #0009;
}
#gate .pv-guest-card:focus-visible{outline:2px solid #fff;outline-offset:3px}
#gate .pv-guest-composer{
  display:block;width:min(1120px,100%);margin:35px auto 0;
  padding:20px 22px 18px;text-align:left;background:rgba(22,23,27,.88);
  border:1px solid #c9c8c453;border-radius:22px;
  box-shadow:0 24px 85px #000a;backdrop-filter:blur(24px);
}
#gate .pv-guest-sr-only{
  position:absolute!important;width:1px!important;height:1px!important;overflow:hidden;
  clip:rect(0,0,0,0)!important;white-space:nowrap;
}
#gate .pv-guest-composer textarea{
  box-sizing:border-box;display:block;width:100%;height:45px;min-height:45px;max-height:170px;
  resize:vertical;margin:0 0 9px;padding:6px 5px;
  color:#f4f3f0;background:transparent;border:0;outline:none;
  font:400 14px/1.5 'DM Sans',Arial,sans-serif;letter-spacing:0;
}
#gate .pv-guest-composer textarea::placeholder{color:#ccc8c5}
#gate .pv-guest-composer textarea:focus-visible{outline:2px solid #dad6d0;outline-offset:3px;border-radius:4px}
#gate .pv-guest-composer-footer{display:flex;align-items:center;gap:15px;justify-content:space-between}
#gate .pv-guest-settings{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
#gate .pv-guest-setting{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:39px;padding:8px 13px;white-space:nowrap;
  border-radius:9px;border:1px solid #ffffff24;
  background:#242629;color:#e9e7e5;font:500 12px/1.2 'DM Sans',Arial,sans-serif;
}
#gate a.pv-guest-moods-link{color:#f4efe7;text-decoration:none}
#gate a.pv-guest-moods-link:hover{background:#343538}
#gate #pv-guest-generate{
  flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-width:150px;min-height:72px;gap:4px;padding:12px 15px;cursor:pointer;
  color:#19191a;background:#f2efeb;border:1px solid #f6f3f0;border-radius:12px;
  font:600 14px/1.25 'DM Sans',Arial,sans-serif;
}
#gate #pv-guest-generate:hover{background:#fff}
#gate #pv-guest-generate small{font-size:10px;font-weight:400;opacity:.7}
#gate .pv-guest-auth-status{margin:17px 0 0;color:#c8c4c4;font-size:11px;line-height:1.5}
#gate .pv-guest-retry{margin:11px auto 0;padding:10px 15px;background:#27292e;color:#fff;border:1px solid #ccc7c3;border-radius:9px;cursor:pointer}
#studio-header #signin.pv-guest-signin:not([hidden]){
  display:inline-flex;align-items:center;justify-content:center;
  flex:none;min-height:36px;padding:8px 18px;
  border-radius:20px;background:#eeeae5;color:#181818;border:1px solid #e9e5e0;
  font:600 12px/1 'DM Sans',Arial,sans-serif;cursor:pointer;
}
#studio-header #signin.pv-guest-signin:disabled{opacity:.55;cursor:wait}
body:has(#gate.pv-guest-image:not([hidden])) #studio-header #identity,
body:has(#gate.pv-guest-image:not([hidden])) #tool-assets{display:none!important}
@media(max-width:1150px){
  #gate .pv-guest-cards{grid-template-columns:repeat(3,minmax(0,1fr));max-width:850px}
  #gate .pv-guest-card{height:clamp(275px,34vw,360px)}
  #gate .pv-guest-content{padding-bottom:56px}
}
@media(max-width:900px){
  body:has(#gate.pv-guest-image:not([hidden]))>#studio-header{height:auto!important;min-height:0}
  body:has(#gate.pv-guest-image:not([hidden]))>#studio-header .wrap.top{height:auto!important;min-height:0}
  #gate.pv-guest-image h1{font-size:clamp(29px,5vw,42px)}
}
@media(max-width:680px){
  #gate .pv-guest-content{padding:40px 15px 65px}
  #gate .pv-guest-kicker{font-size:9px;letter-spacing:.24em}
  #gate.pv-guest-image h1{font-size:clamp(27px,6vw,37px);line-height:1.12;margin-top:12px}
  #gate .pv-guest-subtitle{max-width:360px;margin-top:10px;font-size:12px}
  #gate .pv-guest-credit-note{font-size:11px;margin-top:11px}
  #gate .pv-guest-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:23px}
  #gate .pv-guest-card{height:clamp(210px,63vw,310px);border-radius:11px}
  #gate .pv-guest-card span{font-size:16px;left:12px;bottom:14px}
  #gate .pv-guest-card small{font-size:8px;letter-spacing:.1em;margin-top:6px}
  #gate .pv-guest-composer{padding:15px 13px 13px;margin-top:24px;border-radius:16px}
  #gate .pv-guest-composer-footer{flex-direction:column;align-items:stretch}
  #gate .pv-guest-settings{gap:6px}
  #gate .pv-guest-setting{font-size:10px;padding:7px 10px;min-height:34px}
  #gate #pv-guest-generate{width:100%;min-height:52px;flex-direction:row;gap:9px}
  #gate #pv-guest-generate small{font-size:10px}
  #studio-header #signin.pv-guest-signin:not([hidden]){padding:8px 13px;min-height:33px;font-size:11px}
}
@media(max-width:360px){
  #gate .pv-guest-card{height:195px}
  #gate .pv-guest-card span{font-size:14px}
}
@media(prefers-reduced-motion:reduce){
  #gate .pv-guest-card,#gate .pv-guest-card img{transition:none!important}
}
