/* Space Gate NOVA+ — Mobile Commercial Final R7
   PHONE ONLY (<768px). Web Mobile + MAUI shared UI. Desktop untouched.
   Focus: larger commercial banners + more premium card metadata/details. */
@media (max-width: 767px) {
  :root{
    --r7-black:#000;--r7-white:#fff;--r7-muted:rgba(255,255,255,.74);--r7-soft:rgba(255,255,255,.52);
    --r7-line:rgba(255,255,255,.10);--r7-line-strong:rgba(143,93,255,.38);
    --r7-purple:#8f5dff;--r7-purple-soft:rgba(143,93,255,.16);--r7-cyan:#43dfff;--r7-gold:#ffd35a;
    --r7-glass:rgba(255,255,255,.055);--r7-panel:rgba(255,255,255,.032);
  }

  /* =======================
     COMMERCIAL / AD BANNERS
     ======================= */
  html.nova-web-shell body #nova-app .nova-commercial-display-slot{
    margin:18px 0 22px!important;padding:0!important;
  }
  html.nova-web-shell body #nova-app .nova-commercial-display-card{
    aspect-ratio:16/8!important;min-height:230px!important;border-radius:20px!important;overflow:hidden!important;
    background:#05070f!important;
    outline:1px solid rgba(143,93,255,.26)!important;outline-offset:-1px!important;
    box-shadow:0 16px 40px rgba(0,0,0,.38),0 0 0 1px rgba(67,223,255,.06) inset!important;
  }
  html.nova-web-shell body #nova-app .nova-commercial-display-picture,
  html.nova-web-shell body #nova-app .nova-commercial-display-picture img{
    display:block!important;width:100%!important;height:100%!important;
  }
  html.nova-web-shell body #nova-app .nova-commercial-display-picture img{
    object-fit:cover!important;object-position:center!important;filter:saturate(1.06) contrast(1.02) brightness(.92)!important;
    transform:scale(1.01)!important;
  }
  html.nova-web-shell body #nova-app .nova-commercial-display-meta{
    inset:0!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:flex-end!important;
    gap:12px!important;padding:18px 16px 18px!important;pointer-events:none!important;color:#fff!important;
    background:
      linear-gradient(180deg,rgba(4,8,20,.08) 0%,rgba(4,8,20,.22) 26%,rgba(4,8,20,.82) 100%),
      linear-gradient(90deg,rgba(5,8,18,.80) 0%,rgba(5,8,18,.34) 52%,rgba(5,8,18,.08) 100%)!important;
  }
  [dir="rtl"] html.nova-web-shell body #nova-app .nova-commercial-display-meta{
    background:
      linear-gradient(180deg,rgba(4,8,20,.08) 0%,rgba(4,8,20,.22) 26%,rgba(4,8,20,.82) 100%),
      linear-gradient(270deg,rgba(5,8,18,.80) 0%,rgba(5,8,18,.34) 52%,rgba(5,8,18,.08) 100%)!important;
  }
  html.nova-web-shell body #nova-app .nova-commercial-display-copy{
    display:grid!important;gap:6px!important;max-width:min(100%,94%)!important;
    text-shadow:0 2px 14px rgba(0,0,0,.58)!important;
  }
  html.nova-web-shell body #nova-app .nova-commercial-display-kicker{
    display:flex!important;align-items:center!important;gap:8px!important;font-size:.78rem!important;line-height:1.2!important;
    letter-spacing:.015em!important;font-weight:760!important;opacity:.98!important;
  }
  html.nova-web-shell body #nova-app .nova-commercial-display-kicker::before{
    margin-inline-end:0!important;padding:4px 9px!important;border:1px solid rgba(255,255,255,.24)!important;border-radius:999px!important;
    background:rgba(10,14,28,.34)!important;backdrop-filter:blur(10px)!important;
  }
  html.nova-web-shell body #nova-app .nova-commercial-display-copy strong{
    display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;overflow:hidden!important;
    font-size:clamp(1.08rem,3.9vw,1.26rem)!important;line-height:1.22!important;font-weight:900!important;color:#fff!important;
  }
  html.nova-web-shell body #nova-app .nova-commercial-display-copy small{
    display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;overflow:hidden!important;
    font-size:.79rem!important;line-height:1.48!important;opacity:.94!important;color:rgba(255,255,255,.88)!important;
  }
  html.nova-web-shell body #nova-app .nova-commercial-display-cta{
    pointer-events:auto!important;align-self:flex-start!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
    min-height:40px!important;padding:0 16px!important;border-radius:999px!important;border:1px solid rgba(143,93,255,.42)!important;
    background:linear-gradient(135deg,rgba(10,14,28,.78),rgba(67,223,255,.12))!important;color:#fff!important;
    font-size:.84rem!important;font-weight:840!important;white-space:nowrap!important;backdrop-filter:blur(12px)!important;
    box-shadow:0 10px 26px rgba(0,0,0,.32)!important;
  }
  html.nova-web-shell body #nova-app .nova-commercial-display-card:not([data-target]) .nova-commercial-display-cta{display:none!important;}

  @media (max-width: 420px) {
    html.nova-web-shell body #nova-app .nova-commercial-display-card{min-height:220px!important;border-radius:18px!important;}
    html.nova-web-shell body #nova-app .nova-commercial-display-meta{padding:16px 14px 16px!important;gap:10px!important;}
    html.nova-web-shell body #nova-app .nova-commercial-display-copy strong{font-size:1.02rem!important;}
    html.nova-web-shell body #nova-app .nova-commercial-display-copy small{font-size:.75rem!important;}
  }

  /* =======================
     RICH CARD DETAILS SYSTEM
     ======================= */
  html.nova-web-shell body #nova-app :is(
    .nova-r5-home-episode,.nova-r5-home-facts,.nova-r5-home-pills,.nova-r5-browser-episode,.nova-r5-browser-facts,.nova-r5-browser-pills,
    .media-meta-episode-r5,.media-meta-primary-r5,.media-meta-secondary-r5,.media-meta-pills-r5,
    .nova-r6-episode-line,.nova-r6-facts,.nova-r6-pills
  ){
    position:relative!important;z-index:1!important;
  }

  /* Elegant block treatment for the metadata region on card variants */
  html.nova-web-shell body #nova-app :is(.nx2-card--poster,.nova-r6-poster-card,.shahid-poster-card,.nx2-card--ranked,.nova-r6-ranked-card,.shahid-ranked-card,
    .nx2-card--landscape,.nova-r6-landscape-card,.shahid-landscape-card,.nova-item-card,.nova-r6-parity-card,.nova-media-card,.nova-r6-media-card){
    background:#000!important;
  }

  /* Titles */
  html.nova-web-shell body #nova-app :is(.nova-r5-home-title,.nx2-ranked-title,.shahid-poster-card strong,.nova-r6-title,.media-title,.nova-r6-media-card > strong){
    text-shadow:0 2px 10px rgba(0,0,0,.34)!important;
  }
  html.nova-web-shell body #nova-app :is(.shahid-poster-card strong,.nova-r6-title,.media-title,.nova-r6-media-card > strong){
    color:#fff!important;font-weight:880!important;letter-spacing:.005em!important;
  }
  html.nova-web-shell body #nova-app :is(.nova-item-card,.nova-r6-parity-card) .media-info{
    display:flex!important;flex-direction:column!important;gap:5px!important;padding:9px 2px 2px!important;background:#000!important;
  }
  html.nova-web-shell body #nova-app :is(.nova-item-card,.nova-r6-parity-card) .media-title{
    font-size:.81rem!important;line-height:1.28!important;min-height:2.1em!important;
  }
  html.nova-web-shell body #nova-app .nova-r6-media-card > strong{
    margin-top:8px!important;font-size:.78rem!important;line-height:1.28!important;
  }

  /* Fact lines */
  html.nova-web-shell body #nova-app :is(.nova-r6-facts,.nova-r5-home-facts,.nova-r5-browser-facts,.media-meta-primary-r5,.media-meta-secondary-r5){
    color:var(--r7-muted)!important;font-size:.61rem!important;font-weight:710!important;line-height:1.42!important;letter-spacing:.01em!important;
  }
  html.nova-web-shell body #nova-app :is(.nova-r6-parity-card .nova-r6-facts,.nova-r6-media-card > .nova-r6-facts,.nx2-card--landscape > .nova-r5-home-facts,.shahid-landscape-card > .nova-r5-home-facts){
    display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;overflow:hidden!important;white-space:normal!important;
  }
  html.nova-web-shell body #nova-app :is(.nx2-card--poster,.nova-r6-poster-card,.shahid-poster-card,.nx2-card--ranked,.nova-r6-ranked-card,.shahid-ranked-card) > :is(.nova-r6-facts,.nova-r5-home-facts){
    margin-top:5px!important;
  }

  /* Episode/new badge line */
  html.nova-web-shell body #nova-app :is(.nova-r6-episode-line,.nova-r5-home-episode,.nova-r5-browser-episode,.media-meta-episode-r5){
    display:inline-flex!important;align-items:center!important;max-width:100%!important;width:max-content!important;
    padding:5px 9px!important;border-radius:999px!important;border:1px solid rgba(143,93,255,.26)!important;
    background:linear-gradient(135deg,rgba(143,93,255,.16),rgba(67,223,255,.08))!important;color:#fff!important;
    font-size:.60rem!important;font-weight:840!important;line-height:1.1!important;letter-spacing:.012em!important;
    box-shadow:0 8px 20px rgba(0,0,0,.18)!important;
  }
  html.nova-web-shell body #nova-app :is(.nova-r6-parity-card.is-episode .nova-r6-episode-line,.nx2-card--landscape .nova-r5-home-episode,.shahid-landscape-card .nova-r5-home-episode){
    margin-top:6px!important;
  }

  /* Pills row */
  html.nova-web-shell body #nova-app :is(.nova-r6-pills,.nova-r5-home-pills,.nova-r5-browser-pills,.media-meta-pills-r5){
    display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:6px!important;margin:5px 0 0!important;
  }
  html.nova-web-shell body #nova-app :is(.nova-r6-pill,.nova-r5-pill){
    display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:21px!important;
    padding:3px 8px!important;border:1px solid var(--r7-line)!important;border-radius:999px!important;
    background:var(--r7-glass)!important;color:rgba(255,255,255,.92)!important;font-size:.55rem!important;font-weight:800!important;line-height:1!important;
    box-shadow:0 8px 16px rgba(0,0,0,.14)!important;
  }
  html.nova-web-shell body #nova-app :is(.nova-r6-pill--rating,.nova-r5-pill--rating){
    color:var(--r7-gold)!important;border-color:rgba(255,211,90,.26)!important;background:rgba(255,211,90,.07)!important;
  }
  html.nova-web-shell body #nova-app :is(.nova-r6-pill--quality,.nova-r5-pill--quality){
    border-color:rgba(143,93,255,.36)!important;background:rgba(143,93,255,.14)!important;
  }
  html.nova-web-shell body #nova-app :is(.nova-r6-pill--season,.nova-r5-pill--season,.nova-r6-pill--time,.nova-r5-pill--time){
    border-color:rgba(67,223,255,.26)!important;background:rgba(67,223,255,.08)!important;
  }
  html.nova-web-shell body #nova-app :is(.nova-r6-pill--type,.nova-r5-pill--type,.nova-r6-pill--meta,.nova-r5-pill--meta){
    border-color:rgba(255,255,255,.10)!important;background:rgba(255,255,255,.04)!important;
  }
  html.nova-web-shell body #nova-app :is(.nova-r6-pill--age,.nova-r5-pill--age){
    border-color:rgba(255,255,255,.14)!important;background:rgba(255,255,255,.06)!important;
  }

  /* Poster cards */
  html.nova-web-shell body #nova-app :is(.nx2-card--poster,.nova-r6-poster-card,.shahid-poster-card) > :is(.nova-r5-home-episode,.nova-r5-home-facts,.nova-r5-home-pills,.nova-r6-episode-line,.nova-r6-facts,.nova-r6-pills){
    margin-inline:3px!important;
  }
  html.nova-web-shell body #nova-app :is(.nx2-card--poster,.nova-r6-poster-card,.shahid-poster-card) > :is(.nova-r5-home-pills,.nova-r6-pills){
    padding-top:1px!important;
  }

  /* Ranked cards */
  html.nova-web-shell body #nova-app :is(.nx2-card--ranked,.nova-r6-ranked-card,.shahid-ranked-card) > strong{
    display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;overflow:hidden!important;
    font-size:.80rem!important;font-weight:900!important;line-height:1.26!important;margin:8px 2px 0!important;color:#fff!important;
  }
  html.nova-web-shell body #nova-app :is(.nx2-card--ranked,.nova-r6-ranked-card,.shahid-ranked-card) > :is(.nova-r5-home-episode,.nova-r5-home-facts,.nova-r5-home-pills,.nova-r6-episode-line,.nova-r6-facts,.nova-r6-pills){
    padding-inline:2px!important;
  }

  /* Landscape + latest episodes */
  html.nova-web-shell body #nova-app :is(.nx2-card--landscape,.nova-r6-landscape-card,.shahid-landscape-card) :is(.shahid-landscape-copy,.nova-r5-landscape-copy,.nova-r6-landscape-copy){
    display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:10px!important;
    padding:9px 10px 3px!important;background:#000!important;border:0!important;box-shadow:none!important;
  }
  html.nova-web-shell body #nova-app :is(.nx2-card--landscape,.nova-r6-landscape-card,.shahid-landscape-card) :is(.shahid-landscape-copy,.nova-r5-landscape-copy,.nova-r6-landscape-copy) strong{
    font-size:.89rem!important;font-weight:900!important;line-height:1.22!important;color:#fff!important;
  }
  html.nova-web-shell body #nova-app :is(.nx2-card--landscape,.nova-r6-landscape-card,.shahid-landscape-card) > :is(.nova-r5-home-episode,.nova-r5-home-facts,.nova-r5-home-pills,.nova-r6-episode-line,.nova-r6-facts,.nova-r6-pills){
    margin-inline:10px!important;
  }
  html.nova-web-shell body #nova-app :is(.shahid-landscape-duration){
    min-height:26px!important;padding:0 10px!important;border-radius:999px!important;border:1px solid rgba(143,93,255,.30)!important;
    background:rgba(7,10,20,.56)!important;backdrop-filter:blur(9px)!important;color:#fff!important;font-size:.66rem!important;font-weight:800!important;
  }

  /* Catalog / browser cards */
  html.nova-web-shell body #nova-app .nova-r6-parity-card .nova-r6-facts{margin-top:2px!important;}
  html.nova-web-shell body #nova-app .nova-r6-parity-card.is-episode .nova-r6-episode-line{
    padding-inline:8px!important;border-right:0!important;
  }
  html.nova-web-shell body #nova-app .nova-r6-media-card > :is(.nova-r6-episode-line,.nova-r6-facts,.nova-r6-pills){margin-inline:1px!important;}

  /* Slightly cleaner vertical rhythm between sections */
  html.nova-web-shell body #nova-app :is(.shahid-home-section,.nx2-rail-section){padding-bottom:17px!important;margin-bottom:0!important;}
  html.nova-web-shell body #nova-app :is(.shahid-section-heading,.nx2-rail-head){margin-bottom:12px!important;}
}

@media (min-width:768px){
  .nova-commercial-display-card{min-height:86px!important;aspect-ratio:5/1!important;}
}
