
/* Synthetic Hearts — Discover Modern v4
   Clean editorial dating layout: photo first, info second, actions last. */

@media (min-width:1101px){
  .member-shell.swipe-dashboard{
    max-width:1320px !important;
    padding-top:76px !important;
    padding-bottom:28px !important;
  }

  .swipe-topbar{
    margin-bottom:24px !important;
    align-items:flex-start !important;
  }
  .swipe-topbar h1{
    font-size:clamp(2rem,2.45vw,2.65rem) !important;
    line-height:.96 !important;
    letter-spacing:-.045em !important;
    margin:0 !important;
  }
  .swipe-topbar > div > p{
    margin-top:8px !important;
    font-size:.9rem !important;
  }

  .discovery-layout{
    display:grid !important;
    grid-template-columns:minmax(190px,.58fr) minmax(560px,1.72fr) minmax(205px,.62fr) !important;
    gap:clamp(30px,3.4vw,58px) !important;
    align-items:center !important;
    min-height:0 !important;
    height:auto !important;
  }

  .discovery-side{
    padding:8px 0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
  }
  .discovery-side h2{
    font-size:1.45rem !important;
    line-height:1.05 !important;
  }
  .discovery-side > p{
    font-size:.86rem !important;
    line-height:1.5 !important;
  }
  .swipe-legend{
    margin-top:16px !important;
  }

  .swipe-deck{
    width:100% !important;
    max-width:610px !important;
    min-height:0 !important;
    height:auto !important;
    margin-inline:auto !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    overflow:visible !important;
  }

  /* One coherent premium card */
  .swipe-card{
    position:relative !important;
    display:grid !important;
    grid-template-areas:
      "photo"
      "identity"
      "detail" !important;
    grid-template-rows:auto auto auto !important;
    width:100% !important;
    max-width:none !important;
    min-height:0 !important;
    height:auto !important;
    max-height:none !important;
    overflow:hidden !important;
    border-radius:30px !important;
    background:linear-gradient(180deg,rgba(20,18,25,.98),rgba(13,12,17,.99)) !important;
    border:1px solid rgba(255,255,255,.11) !important;
    box-shadow:0 28px 80px rgba(0,0,0,.38),0 0 0 1px rgba(255,76,170,.025) inset !important;
  }

  .swipe-photo{
    grid-area:photo !important;
    position:relative !important;
    order:0 !important;
    width:100% !important;
    height:430px !important;
    min-height:430px !important;
    flex:none !important;
    overflow:hidden !important;
    background:#0c0b10 !important;
  }
  .swipe-photo::after{
    content:"" !important;
    position:absolute !important;
    inset:auto 0 0 0 !important;
    height:18% !important;
    background:linear-gradient(to bottom,transparent,rgba(13,12,17,.24)) !important;
    pointer-events:none !important;
  }
  .swipe-photo img{
    display:block !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center 22% !important;
  }

  /* Force identity below photo regardless of old absolute positioning. */
  .persona-content{
    grid-area:identity !important;
    position:relative !important;
    order:1 !important;
    inset:auto !important;
    left:auto !important;
    right:auto !important;
    top:auto !important;
    bottom:auto !important;
    transform:none !important;
    width:100% !important;
    max-width:none !important;
    box-sizing:border-box !important;
    padding:20px 26px 14px !important;
    margin:0 !important;
    background:transparent !important;
    z-index:2 !important;
  }
  .persona-name-row{
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
  }
  .persona-name-row h2{
    font-size:2rem !important;
    line-height:1 !important;
    letter-spacing:-.04em !important;
    margin:0 !important;
  }
  .persona-content .persona-meta,
  .persona-content > p{
    margin-top:7px !important;
  }

  .swipe-card-detail{
    grid-area:detail !important;
    position:relative !important;
    order:2 !important;
    inset:auto !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    box-sizing:border-box !important;
    padding:0 26px 22px !important;
    margin:0 !important;
    background:transparent !important;
    border-top:0 !important;
  }
  .swipe-card-detail p{
    margin:0 !important;
    font-size:.92rem !important;
    line-height:1.48 !important;
  }

  /* Controls become a full modern action bar BELOW the card. */
  .swipe-controls{
    position:relative !important;
    inset:auto !important;
    transform:none !important;
    width:100% !important;
    max-width:none !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:12px !important;
    margin:14px 0 0 !important;
  }
  .swipe-pass,.swipe-match{
    position:relative !important;
    inset:auto !important;
    transform:none !important;
    width:100% !important;
    height:58px !important;
    min-width:0 !important;
    border-radius:18px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:9px !important;
  }
  .swipe-pass{
    background:rgba(255,255,255,.045) !important;
    border:1px solid rgba(255,255,255,.1) !important;
  }
  .swipe-match{
    background:linear-gradient(135deg,rgba(224,55,157,.22),rgba(126,71,255,.18)) !important;
    border:1px solid rgba(244,74,168,.32) !important;
    box-shadow:0 10px 32px rgba(213,50,148,.10) !important;
  }

  /* If labels exist inside action buttons, show them. Icon-only markup stays centered. */
  .swipe-controls button span,
  .swipe-controls a span{
    position:static !important;
  }

  .swipe-hint{
    margin:10px 0 0 !important;
    text-align:center !important;
    font-size:.74rem !important;
    opacity:.55 !important;
  }
}

@media (min-width:1500px) and (min-height:850px){
  .member-shell.swipe-dashboard{max-width:1400px !important;}
  .discovery-layout{
    grid-template-columns:minmax(200px,.56fr) minmax(620px,1.86fr) minmax(215px,.6fr) !important;
  }
  .swipe-deck{max-width:650px !important;}
  .swipe-photo{
    height:455px !important;
    min-height:455px !important;
  }
}

@media (min-width:1101px) and (max-height:820px){
  .member-shell.swipe-dashboard{
    padding-top:70px !important;
    padding-bottom:18px !important;
  }
  .swipe-topbar{margin-bottom:14px !important;}
  .swipe-topbar h1{font-size:1.9rem !important;}
  .swipe-topbar > div > p{font-size:.82rem !important;margin-top:5px !important;}
  .swipe-photo{
    height:300px !important;
    min-height:300px !important;
  }
  .persona-content{padding:14px 22px 9px !important;}
  .persona-name-row h2{font-size:1.65rem !important;}
  .swipe-card-detail{padding:0 22px 14px !important;}
  .swipe-card-detail p{font-size:.82rem !important;}
  .swipe-controls{
    display:grid !important; /* overrides old compact rule that hid them */
    margin-top:10px !important;
  }
  .swipe-pass,.swipe-match{height:50px !important;}
  .swipe-hint{display:block !important;}
}
