/* Picorae 18.139 — founder 44633.mp4: genuine guest cover, not a
 * surrogate signed-in cover preview. The WEDDING photo is landscape and
 * retains v18.138/v18.137 framing. Portrait-only transitions use the SAME
 * decoded, guest-authorised cover photo's already available v18.127 blur.
 * No new media/signing/QR/guest privacy requests. */
#eventView #guestEvent .event-hero{
 overflow:hidden!important;
 background:#fffdf8!important;
}
/* A compact real VENUE line belongs immediately under the date/title,
 * not lost among upload controls. The SAME original venue node and Maps
 * action are moved into .guest-event-intro by v18.139 build source. */
#eventView #guestEvent .event-hero > .guest-event-intro > #guestVenueCard:not(.hidden){
 display:flex!important;
 flex-direction:row!important;align-items:center!important;
 flex-wrap:wrap!important;gap:7px 12px!important;
 position:relative!important;z-index:4!important;
 width:100%!important;
 margin:9px 0 7px!important;padding:9px 0 4px!important;
 min-height:0!important;
 border:0!important;border-top:1px solid rgba(154,114,61,.18)!important;
 border-radius:0!important;box-shadow:none!important;
 background:transparent!important;
}
#eventView #guestEvent .guest-event-intro > #guestVenueCard .guest-venue-top{
 flex:1 1 150px!important;
 display:flex!important;gap:9px!important;align-items:center!important;
 min-width:0!important;
}
#eventView #guestEvent .guest-event-intro > #guestVenueCard .guest-venue-pin{
 width:27px!important;height:27px!important;flex:0 0 27px!important;
 border-radius:50%!important;font-size:14px!important;
 background:#f3e6ce!important;color:#795a34!important;
}
#eventView #guestEvent .guest-event-intro > #guestVenueCard .guest-venue-copy{
 flex:1 1 auto!important;min-width:0!important;
}
#eventView #guestEvent .guest-event-intro > #guestVenueCard .guest-venue-copy .guest-event-eyebrow{
 font-size:9px!important;letter-spacing:1.3px!important;margin:0 0 1px!important;
}
#eventView #guestEvent .guest-event-intro > #guestVenueCard #guestVenueName{
 font-size:13px!important;line-height:1.22!important;color:#4a3826!important;
}
#eventView #guestEvent .guest-event-intro > #guestVenueCard #guestVenueAddress{
 font-size:11px!important;margin:0!important;line-height:1.3!important;color:#8c7357!important;
}
#eventView #guestEvent .guest-event-intro > #guestVenueCard .guest-venue-preview{
 display:none!important; /* decorative fake map, not the original Maps action */
}
#eventView #guestEvent .guest-event-intro > #guestVenueCard .guest-venue-map:not(.hidden){
 display:inline-flex!important;align-items:center!important;
 flex:0 0 auto!important;width:auto!important;
 margin:0!important;padding:7px 10px!important;
 font:700 10px/1 system-ui,sans-serif!important;
 border:1px solid #d9c5a1!important;background:#fffdf8!important;
 color:#866032!important;border-radius:999px!important;
 box-shadow:none!important;
}
/* PORTRAIT ONLY: actual guest photo takes the entire editorial masthead,
 * no framed mat/grey bars. Scale portrait to FILL the full frame:
 * object-fit:cover layered above EXISTING authorised blurred image
 * background. Feather sides and bottom into the title below. */
#eventView #guestEvent .event-hero:has(> #guestCoverWrap.p138-auto-portrait) {
 padding-top:0!important;
}
#eventView #guestEvent .event-hero > #guestCoverWrap.p138-auto-portrait{
 position:relative!important;
 overflow:hidden!important;isolation:isolate!important;
 display:block!important;
 width:calc(100% + 28px)!important;max-width:none!important;
 height:clamp(300px,93vw,390px)!important;
 min-height:300px!important;
 margin:-14px -14px -116px!important;
 padding:0!important;border:0!important;border-radius:0!important;
 background:linear-gradient(180deg,#efe7db,#fffdf8)!important;
 box-shadow:none!important;
}
#eventView #guestEvent .event-hero > #guestCoverWrap.p138-auto-portrait::before{
 content:""!important;position:absolute!important;
 display:block!important;
 inset:-32px!important;width:auto!important;height:auto!important;
 background-image:var(--p127-cover-backdrop)!important;
 background-repeat:no-repeat!important;
 background-size:cover!important;background-position:center 35%!important;
 filter:blur(20px) saturate(.82) sepia(.1) brightness(1.24)!important;
 opacity:.82!important;transform:scale(1.06)!important;
 -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 58%,transparent 98%)!important;
 mask-image:linear-gradient(180deg,#000 0%,#000 58%,transparent 98%)!important;
 pointer-events:none!important;z-index:0!important;
}
#eventView #guestEvent .event-hero > #guestCoverWrap.p138-auto-portrait > #guestCover{
 /* v18.143: original GUEST/host-preview image is anchored to the SAME
    entire photo viewport as the now-correct Saved Events thumbnail.
    Relative normal flow allowed the legacy intrinsic portrait layout to win. */
 position:absolute!important;inset:0!important;z-index:2!important;
 display:block!important;
 width:100%!important;height:100%!important;
 min-width:100%!important;max-width:100%!important;
 min-height:100%!important;max-height:100%!important;
 margin:0!important;padding:0!important;
 object-fit:cover!important; /* v18.140: use actual cover-fill, not narrow contained portrait */
 /* Preserve original object-position, including host manual X/Y. */
 border:0!important;border-radius:0!important;
 background:transparent!important;box-shadow:none!important;
 /* v18.141 actual guest image uses bottom-only gradient from p138 script;
    no radial side alpha and no narrow poster-like silhouette. */
 -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 50%,rgba(0,0,0,.95) 67%,rgba(0,0,0,.42) 85%,transparent 100%)!important;
 mask-image:linear-gradient(180deg,#000 0%,#000 50%,rgba(0,0,0,.95) 67%,rgba(0,0,0,.42) 85%,transparent 100%)!important;
}
/* Pull the actual title OVER the lower photo, not below a hard image card. */
#eventView #guestEvent .event-hero:has(> #guestCoverWrap.p138-auto-portrait) > .guest-event-intro{
 position:relative!important;z-index:3!important;
 width:100%!important;min-width:0!important;
 margin:0 0 4px!important;
 padding:98px 13px 13px!important;
 border:0!important;border-radius:0!important;box-shadow:none!important;
 background:linear-gradient(180deg,rgba(255,253,248,0),rgba(255,253,248,.45) 17%,rgba(255,253,248,.94) 48%,#fffdf8 70%)!important;
}
#eventView #guestEvent .event-hero:has(> #guestCoverWrap.p138-auto-portrait) > .guest-event-intro #guestName{
 position:relative!important;z-index:3!important;color:#32251b!important;
}
#eventView #guestEvent .event-hero:has(> #guestCoverWrap.p138-auto-portrait) > .guest-event-intro #guestWelcome{
 color:#826e57!important;
}
#eventView #guestEvent .event-hero > #guestCoverWrap.p138-auto-portrait.cover-loading{
 min-height:300px!important;
}
/* Crop editor previews exactly the actual cover FILL, its controls retain
 * the original persisted X/Y support. Decoration is preview-only. */
#coverEditorModal .cover-editor-stage.p139-preview-portrait{
 aspect-ratio:1.02/1!important;
 min-height:230px!important;
 /* A preview of the same original guest masthead, not an un-faded crop. */
 background:linear-gradient(180deg,#efe7db,#fffdf8)!important;
 overflow:hidden!important;isolation:isolate!important;
 border-radius:0!important;clip-path:none!important;
}
#coverEditorModal .cover-editor-stage.p139-preview-portrait > img{
 object-fit:cover!important; /* v18.141 true pixel-to-edge preview of the real guest cover */
 /* The old editor had a portrait-sized inner element within a square mat;
    FORCE the original image element to span its whole frame. Object-position
    stays unchanged so saved/manual X/Y coordinates remain functional. */
 position:absolute!important;inset:0!important;
 width:100%!important;height:100%!important;
 min-width:100%!important;min-height:100%!important;
 max-width:none!important;max-height:none!important;
 transform:none!important;
}
/* v18.143: show the SAME bottom cream transition as the real guest view.
   Overlay is decorative, so drag and original manual position remain usable. */
#coverEditorModal .cover-editor-stage.p139-preview-portrait::after{
 content:""!important;position:absolute!important;inset:0!important;
 z-index:2!important;pointer-events:none!important;
 background:linear-gradient(180deg,transparent 0%,transparent 50%,
  rgba(255,253,248,.05) 67%,rgba(255,253,248,.58) 85%,#fffdf8 100%)!important;
}
#coverEditorModal .cover-editor-stage.p139-preview-portrait .cover-editor-grid{
 opacity:.18!important;z-index:3!important;
}
@media(max-width:360px){
 #eventView #guestEvent .event-hero > #guestCoverWrap.p138-auto-portrait{
  width:calc(100% + 20px)!important;margin:-10px -10px -103px!important;
  height:clamp(270px,96vw,335px)!important;min-height:270px!important;
 }
 #eventView #guestEvent .event-hero:has(> #guestCoverWrap.p138-auto-portrait) > .guest-event-intro{
  padding-top:84px!important;
 }
}

/* Optional original manual position controls, hidden by default only for portrait photos. */
#coverEditorModal .cover-editor-controls.p139-manual-hidden{display:none!important;}
#coverEditorModal .p139-adjust-position:not([hidden]){
 display:flex!important;align-items:center!important;justify-content:center!important;
 width:100%!important;min-height:43px!important;padding:9px 13px!important;margin:10px 0 8px!important;
 font:700 12px/1.2 system-ui,sans-serif!important;color:#775330!important;
 background:#f5e8d2!important;border:1px solid #d9c49d!important;border-radius:12px!important;cursor:pointer;
}
#coverEditorModal .p139-adjust-position[hidden]{display:none!important;}
#coverEditorModal .p139-adjust-position:focus-visible{outline:3px solid #aa7d3d;outline-offset:2px;}


/* v18.144 — ROOT CAUSE from founder's 44647.mp4, not another visual workaround.
   The older v18.125 real-guest rule has four IDs and THREE class/pseudo-class
   selectors (#guestCoverWrap:not(.hidden):not(.cover-loading)), so it was
   MORE specific than v18.139/v18.143, and silently forced object-fit:contain,
   position:relative and the shorter 220px photo viewport on real phones.
   These portrait-only selectors MUST outrank that exact legacy cascade.
   Leave the existing wedding landscape route and all stored X/Y intact. */
#eventView #guestEvent > .event-hero > #guestCoverWrap.p138-auto-portrait:not(.hidden):not(.cover-loading){
 position:relative!important;
 display:block!important;
 width:100%!important;
 height:clamp(300px,93vw,390px)!important;
 min-height:300px!important;
 max-height:390px!important;
 margin:0 0 -116px!important;
 padding:0!important;
 border:0!important;
 border-radius:0!important;
 overflow:hidden!important;
 box-shadow:none!important;
 background:linear-gradient(180deg,#efe7db,#fffdf8)!important;
 /* Fade the original PHOTO once; never mask the full parent twice. */
 -webkit-mask-image:none!important;
 mask-image:none!important;
}
#eventView #guestEvent > .event-hero > #guestCoverWrap.p138-auto-portrait:not(.hidden):not(.cover-loading) > #guestCover{
 position:absolute!important;inset:0!important;
 display:block!important;z-index:2!important;
 width:100%!important;height:100%!important;
 min-width:100%!important;min-height:100%!important;
 max-width:100%!important;max-height:100%!important;
 margin:0!important;padding:0!important;
 object-fit:cover!important;
 /* The original signed img's inline-important saved object-position wins;
    do NOT force object-position:center and lose custom framing. */
 background:transparent!important;border:0!important;border-radius:0!important;
 box-shadow:none!important;
 -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 50%,rgba(0,0,0,.95) 67%,rgba(0,0,0,.42) 85%,transparent 100%)!important;
 mask-image:linear-gradient(180deg,#000 0%,#000 50%,rgba(0,0,0,.95) 67%,rgba(0,0,0,.42) 85%,transparent 100%)!important;
}
/* The original editor must depict a COVER crop, not the legacy narrow
   contain preview. Higher-specificity original element IDs are intentional. */
#coverEditorModal #coverEditorStage.p139-preview-portrait{
 position:relative!important;
 aspect-ratio:1.02 / 1!important;
 overflow:hidden!important;
 background:#fffdf8!important;
}
#coverEditorModal #coverEditorStage.p139-preview-portrait > #coverEditorImage{
 position:absolute!important;inset:0!important;
 display:block!important;
 width:100%!important;height:100%!important;
 min-width:100%!important;min-height:100%!important;
 max-width:100%!important;max-height:100%!important;
 margin:0!important;padding:0!important;
 object-fit:cover!important;
 background:transparent!important;
}
@media(max-width:360px){
 #eventView #guestEvent > .event-hero > #guestCoverWrap.p138-auto-portrait:not(.hidden):not(.cover-loading){
  height:clamp(270px,96vw,335px)!important;
  min-height:270px!important;max-height:335px!important;
  margin-bottom:-103px!important;
 }
}
