/* Event Online V10.2 — invitation layout, final stable overrides.
   These selectors intentionally win over V5–V10.1 layout fragments.
   Never use fixed heights that clip guest names, titles, or invitation text. */
body.design-v5 .invitation{
  width:min(100%,700px);
  min-height:0;
  padding:clamp(31px,4.5vw,48px) clamp(22px,5vw,55px) 34px;
  border-radius:22px;
  box-shadow:0 28px 90px #0306174a,0 0 0 1px color-mix(in srgb,var(--accent) 26%,transparent);
  overflow:hidden;
}
body.design-v5 .invitation .invite-content{position:relative;z-index:7;width:100%;min-width:0;max-width:100%;display:flex;flex-direction:column;align-items:center;text-align:center;gap:0;}
body.design-v5 .invitation .invite-upper{margin:0 auto 7px;max-width:100%;min-width:0;}
body.design-v5 .invitation .script-heading{font-size:clamp(34px,5.1vw,54px);line-height:1.17;text-wrap:balance;}
body.design-v5 .invitation .overline{margin:4px auto 1px;max-width:100%;line-height:1.6;letter-spacing:.1em;font-size:clamp(9px,1.1vw,11px);}
body.design-v5 .invitation .event-title,
body.design-v5 .invitation[data-layout=hero] .event-title,
body.design-v5 .invitation[data-layout=stage] .event-title,
body.design-v5 .invitation[data-layout=framed] .event-title{
  width:100%; max-width:100%;
  margin:9px auto 12px;
  padding:0 0 7px;
  font-size:clamp(34px,5.4vw,63px)!important;
  font-weight:900;
  line-height:1.13;
  text-align:center;
  letter-spacing:-.04em;
  text-wrap:balance;
  word-break:normal;
  overflow-wrap:anywhere;
}
body.design-v5 .invitation .event-title .title-main{font-size:inherit;line-height:1.12;letter-spacing:-.04em;margin:0;}
body.design-v5 .invitation .event-title .title-accent{font-size:clamp(41px,6.2vw,73px);line-height:1.11;margin:1px 0 0;}
body.design-v5 .invitation .event-title .title-main,
body.design-v5 .invitation .event-title .title-accent{background:none!important;background-image:none!important;filter:none!important;-webkit-text-stroke:0!important;letter-spacing:-.035em;white-space:normal;overflow-wrap:anywhere;}
body.design-v5 .invitation .center-ornament{margin:7px auto 13px;}
/* Count down immediately after the main event heading.  */
body.design-v5 .invitation .event-countdown{
  position:relative;z-index:8;
  width:min(100%,580px);max-width:100%;
  margin:0 auto 14px;
  padding:12px 13px;
  border:1px solid color-mix(in srgb,var(--accent) 48%,transparent);
  border-radius:17px;
  background:color-mix(in srgb,var(--card2) 72%,transparent);
  box-shadow:0 10px 24px #00000022,inset 0 1px 0 #ffffff18;
  box-sizing:border-box;
}
body.design-v5 .invitation .event-countdown[hidden]{display:none!important;}
body.design-v5 .invitation .countdown-kicker{margin:0 0 8px;font-size:10px;letter-spacing:.08em;font-weight:850;line-height:1.5;}
body.design-v5 .invitation .countdown-units{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;}
body.design-v5 .invitation .countdown-unit{min-width:0;min-height:62px;border-radius:11px;padding:8px 3px;gap:3px;background:color-mix(in srgb,var(--panel) 86%,transparent);}
body.design-v5 .invitation .countdown-unit strong{font-size:clamp(21px,2.7vw,29px);line-height:1.1;letter-spacing:-.02em;}
body.design-v5 .invitation .countdown-unit span{font-size:9px;letter-spacing:.06em;line-height:1.3;}
body.design-v5 .invitation .countdown-status{margin-top:8px;font-size:11px;}
body.design-v5 .invitation .highlight-banner{width:100%;max-width:100%;margin:8px auto 13px;padding:11px 13px;line-height:1.45;letter-spacing:-.015em;font-size:clamp(12px,1.5vw,15px);border-radius:14px;text-wrap:balance;}
body.design-v5 .invitation .intro-title{margin:4px auto 7px;font-size:clamp(12px,1.5vw,15px);line-height:1.55;font-weight:800;}
body.design-v5 .invitation .invite-body{max-width:585px;margin:2px auto 15px;font-size:clamp(13px,1.5vw,15px);line-height:1.69;letter-spacing:0;white-space:pre-line;overflow-wrap:break-word;text-wrap:pretty;}
body.design-v5 .invitation .detail-grid{display:grid;width:100%;grid-template-columns:repeat(2,minmax(0,1fr));margin:10px 0 15px;gap:10px;}
body.design-v5 .invitation .detail-box{
  width:100%;min-width:0;
  padding:13px 13px;border-radius:15px;gap:11px;
  display:flex;align-items:center;
  border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);
  background:color-mix(in srgb,var(--panel) 90%,transparent);
  box-shadow:inset 0 1px 0 #ffffff16,0 8px 22px #00000013;
}
body.design-v5 .invitation .detail-emoji{width:43px;height:43px;min-width:43px;flex:0 0 43px;border-radius:12px;}
body.design-v5 .invitation .detail-emoji svg{width:27px;height:27px;}
body.design-v5 .invitation .detail-copy{min-width:0;text-align:left;}
body.design-v5 .invitation .detail-copy>span{font-size:9px;letter-spacing:.07em;margin:0 0 3px;}
body.design-v5 .invitation .detail-copy strong{font-size:clamp(14px,1.8vw,18px);line-height:1.35;overflow-wrap:break-word;}
body.design-v5 .invitation .detail-copy small{font-size:11px;line-height:1.5;overflow-wrap:break-word;}
body.design-v5 .invitation .closing-banner{max-width:100%;width:100%;font-size:clamp(12px,1.45vw,16px);line-height:1.43;padding:11px 12px;margin:8px auto 11px;letter-spacing:-.015em;border-radius:12px;}
body.design-v5 .invitation .ending-text{max-width:570px;margin:3px auto 9px;font-size:clamp(12px,1.35vw,14px);line-height:1.6;}
body.design-v5 .invitation .organizer-text{margin:7px auto 0;font-size:11px;line-height:1.55;}
/* Four equal actions without a single button occupying a full row. */
body.design-v5 .invitation .card-actions,
body.design-v5 .invitation[data-layout=editorial] .card-actions,
body.design-v5 .invitation[data-layout=asym] .card-actions,
body.design-v5 .invitation[data-layout=split] .card-actions{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:9px;
  width:100%;max-width:100%;
  margin:24px auto 0;
  padding-top:0;
  align-items:stretch;
  justify-content:stretch;
}
body.design-v5 .invitation .card-actions.no-map{grid-template-columns:repeat(3,minmax(0,1fr));}
body.design-v5 .invitation .card-actions .action-button,
body.design-v5 .invitation .card-actions .guests-action{
  display:flex;min-width:0;grid-column:auto!important;
  min-height:61px;height:100%;
  padding:9px 8px;
  border-radius:13px;
  font-size:11.5px;line-height:1.35;font-weight:800;
  text-align:center;
  align-items:center;justify-content:center;flex-direction:column;
  gap:5px;
  white-space:normal;word-break:normal;overflow-wrap:break-word;
  transition:transform .15s ease,box-shadow .2s ease;
  flex:initial!important;
}
body.design-v5 .invitation .card-actions .action-button:hover{transform:translateY(-2px);}
body.design-v5 .invitation .card-actions .action-button:focus-visible{outline:3px solid var(--accent);outline-offset:3px;}
body.design-v5 .invitation .card-actions .action-button[hidden]{display:none!important;}
body.design-v5 .invitation .card-actions .action-icon{
  width:21px;height:21px;flex:0 0 21px;
  display:block;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
}
body.design-v5 .invitation .card-actions .action-label{display:block;max-width:100%;min-width:0;text-align:center;white-space:normal;overflow-wrap:break-word;}
/* Soften decorative layers behind readable text */
body.design-v5 .invitation .spot,
body.design-v5 .invitation .stage-glow{opacity:.37;}
body.design-v5 .invitation[data-background-light=true] .event-countdown{background:rgba(255,255,255,.91);}
body.design-v5 .invitation[data-background-light=true] .detail-box{background:rgba(255,255,255,.89);}
@media (max-width:740px){
  body.design-v5 .invitation{width:min(100%,580px);padding:31px 25px 27px;border-radius:19px;}
  body.design-v5 .invitation .detail-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  body.design-v5 .invitation .event-countdown{margin-bottom:12px;}
}
@media (max-width:610px){
  .page{padding:10px 8px 8px;}
  body.design-v5 .invitation{width:100%;padding:27px 20px 23px;border-radius:18px;}
  body.design-v5 .invitation .event-title,
  body.design-v5 .invitation[data-layout=hero] .event-title,
  body.design-v5 .invitation[data-layout=stage] .event-title,
  body.design-v5 .invitation[data-layout=framed] .event-title{font-size:clamp(28px,8.2vw,42px)!important;line-height:1.14;margin:7px auto 10px;padding:0 0 7px;}
  body.design-v5 .invitation .event-title .title-main{font-size:inherit;line-height:1.12;}
  body.design-v5 .invitation .event-title .title-accent{font-size:clamp(39px,10.3vw,58px)!important;}
  body.design-v5 .invitation .invite-upper{margin:0 auto 5px;}
  body.design-v5 .invitation .script-heading{font-size:clamp(36px,9vw,46px);}
  body.design-v5 .invitation .event-countdown{max-width:100%;padding:11px 10px;margin-bottom:10px;}
  body.design-v5 .invitation .countdown-kicker{font-size:9.5px;margin-bottom:8px;}
  body.design-v5 .invitation .countdown-units{gap:6px;}
  body.design-v5 .invitation .countdown-unit{min-height:59px;padding:7px 2px;}
  body.design-v5 .invitation .countdown-unit strong{font-size:clamp(19px,5vw,24px);}
  body.design-v5 .invitation .countdown-unit span{font-size:8px;}
  body.design-v5 .invitation .center-ornament{margin:5px auto 10px;}
  body.design-v5 .invitation .highlight-banner{margin:7px auto 11px;padding:10px 10px;font-size:clamp(11.5px,3vw,13px);}
  body.design-v5 .invitation .invite-body{font-size:clamp(12.5px,3.3vw,14px);line-height:1.66;margin-bottom:12px;}
  body.design-v5 .invitation .detail-grid{grid-template-columns:1fr;gap:10px;margin:8px 0 13px;}
  body.design-v5 .invitation .detail-box{padding:11px 12px;min-height:74px;gap:10px;}
  body.design-v5 .invitation .detail-emoji{width:42px;height:42px;min-width:42px;flex-basis:42px;}
  body.design-v5 .invitation .detail-copy strong{font-size:15px;}
  body.design-v5 .invitation .detail-copy small{font-size:10.5px;}
  body.design-v5 .invitation .closing-banner{font-size:clamp(11px,2.9vw,13px);padding:10px 10px;margin:7px auto 9px;}
  body.design-v5 .invitation .ending-text{font-size:12px;line-height:1.65;}
  body.design-v5 .invitation .card-actions,
  body.design-v5 .invitation[data-layout=editorial] .card-actions,
  body.design-v5 .invitation[data-layout=asym] .card-actions,
  body.design-v5 .invitation[data-layout=split] .card-actions,
  body.design-v5 .invitation .card-actions.no-map{
    grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:19px;
  }
  body.design-v5 .invitation .card-actions .action-button,
  body.design-v5 .invitation .card-actions .guests-action{min-height:57px;flex-direction:row;text-align:left;gap:7px;padding:9px 9px;font-size:11px;}
  body.design-v5 .invitation .card-actions .action-label{text-align:left;}
  body.design-v5 .invitation .card-actions .action-icon{width:19px;height:19px;flex-basis:19px;}
  body.design-v5 .invitation .card-actions.no-map #downloadBtn{grid-column:span 2!important;}
}
@media (max-width:360px){
  body.design-v5 .invitation{padding:24px 16px 21px;}
  body.design-v5 .invitation .countdown-units{gap:5px;}
  body.design-v5 .invitation .card-actions .action-button,
  body.design-v5 .invitation .card-actions .guests-action{min-height:62px;font-size:10px;padding:8px 7px;gap:5px;}
  body.design-v5 .invitation .card-actions .action-icon{width:17px;height:17px;flex-basis:17px;}
  body.design-v5 .invitation .detail-emoji{width:38px;height:38px;min-width:38px;flex-basis:38px;}
}
@media (prefers-reduced-motion:reduce){body.design-v5 .invitation .action-button{transition:none!important;transform:none!important;}}
/* Flex child must be allowed to shrink, otherwise the long guest label overflows a phone-sized action. */
body.design-v5 .invitation .card-actions .action-button .action-label{
  min-width:0!important;
  max-width:100%!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  line-height:1.3;
}
@media(max-width:610px){
  body.design-v5 .invitation .card-actions .action-button .action-label{
    flex:1 1 0!important;
    text-align:center;
  }
  body.design-v5 .invitation .card-actions .action-button{
    flex-wrap:nowrap;
  }
}
