/* Milestone 1C — Super Sean Universe portal polish.
   Loaded after styles.css so this can evolve independently of the game UI skin. */
.universe-key-art{
  margin:30px auto 0;
  max-width:1120px;
  padding:8px;
  border-radius:28px;
  background:rgba(255,255,255,.92);
  box-shadow:0 24px 70px rgba(18,54,90,.2);
  overflow:hidden;
}
.universe-key-art img{
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  border-radius:21px;
}
.portal-cards{
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch;
}
.portal-card{
  min-height:360px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  isolation:isolate;
  padding:28px;
  background:#12365a;
}
.portal-card::before,
.portal-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}
.portal-card::before{
  z-index:-2;
  background-position:center;
  background-size:cover;
  transform:scale(1.01);
  transition:transform .22s ease;
}
.portal-card::after{
  z-index:-1;
  background:linear-gradient(180deg,rgba(6,20,42,.06) 12%,rgba(6,20,42,.5) 55%,rgba(6,20,42,.96) 100%);
}
.portal-card:hover::before{transform:scale(1.045)}
.portal-rpg::before{background-image:url('assets/marketing/legend-seven-gems-card.webp')}
.portal-snow::before{background-image:url('assets/marketing/snowball-fight-card.webp')}
.portal-pool::before{background-image:url('assets/marketing/pool-party-card.webp')}
.portal-card h3,.portal-card p,.portal-card b,.portal-card .portal-tag{position:relative;z-index:1}
.portal-card h3{font-size:1.55rem;text-shadow:0 2px 14px rgba(0,0,0,.35)}
.portal-card p{color:#f1f8ff;text-shadow:0 2px 12px rgba(0,0,0,.4)}
.portal-card b{margin-top:auto;padding-top:10px}
.portal-pool b{color:#fff0a7}
@media (max-width:1000px){
  .portal-cards{grid-template-columns:1fr 1fr}
  .portal-pool{grid-column:1/-1}
}
@media (max-width:720px){
  .universe-key-art{margin-top:22px;border-radius:20px;padding:5px}
  .universe-key-art img{border-radius:15px}
  .portal-cards{grid-template-columns:1fr}
  .portal-pool{grid-column:auto}
  .portal-card{min-height:320px}
}
@media (prefers-reduced-motion:reduce){
  .portal-card,.portal-card::before{transition:none!important}
  .portal-card:hover{transform:none}
  .portal-card:hover::before{transform:scale(1.01)}
}
