/* SOCIUS mobile cleanup: stable bubbles + native Safari color normalization */

/* Keep iOS/Safari from applying bright blue native button/link text. */
button{color:inherit}
a,a:visited{color:inherit}
button,a{-webkit-tap-highlight-color:transparent}

@media(max-width:700px){
  /* Bubble layouts use desktop percentage coordinates inline. On a narrow screen
     those coordinates push large circles outside the card, so give mobile its own
     fixed composition and turn off pointer physics there. */
  .build-stage .bubble,.visual-community .cloud .bubble{
    transform:none!important;
    margin:0!important;
    padding:10px!important;
    line-height:1.12!important;
    overflow:hidden!important;
  }
  .build-stage .bubble b,.visual-community .cloud .bubble b{
    color:#f4f1eb!important;
    font-size:12px!important;
    line-height:1.12!important;
    overflow-wrap:anywhere;
  }
  .build-stage .bubble small,.visual-community .cloud .bubble small{
    color:#b5aea5!important;
    font-size:9px!important;
    line-height:1.2!important;
  }
  .build-stage .bubble .status,.visual-community .cloud .bubble .status{
    color:#91897f!important;
    font-size:7px!important;
    letter-spacing:.09em!important;
    margin-top:4px!important;
  }

  .build-stage .bubble:nth-child(1),.visual-community .cloud .bubble:nth-child(1){width:122px!important;height:122px!important;left:3%!important;top:5%!important}
  .build-stage .bubble:nth-child(2),.visual-community .cloud .bubble:nth-child(2){width:108px!important;height:108px!important;left:57%!important;top:4%!important}
  .build-stage .bubble:nth-child(3),.visual-community .cloud .bubble:nth-child(3){width:98px!important;height:98px!important;left:31%!important;top:30%!important}
  .build-stage .bubble:nth-child(4),.visual-community .cloud .bubble:nth-child(4){width:112px!important;height:112px!important;left:64%!important;top:32%!important}
  .build-stage .bubble:nth-child(5),.visual-community .cloud .bubble:nth-child(5){width:104px!important;height:104px!important;left:4%!important;top:59%!important}
  .build-stage .bubble:nth-child(6),.visual-community .cloud .bubble:nth-child(6){width:96px!important;height:96px!important;left:39%!important;top:61%!important}
  .build-stage .bubble:nth-child(7),.visual-community .cloud .bubble:nth-child(7){width:94px!important;height:94px!important;left:70%!important;top:69%!important}

  /* Explicit colors for interactive text Safari sometimes renders as native blue. */
  .preview-rows button,.visual-rows button,.visual-world-card,.request-row strong,
  .account-list button,.footer-links button,.brand,.mobile{
    color:inherit!important;
    -webkit-appearance:none;
    appearance:none;
  }
  .build .request-row strong{color:#efe8dd!important}
  .build .request-row .vote{color:#fff!important}
  .site-footer button{color:inherit!important}

  /* Keep dark community content inside its card cleanly on very narrow phones. */
  .build-stage,.visual-community .cloud{position:relative!important;isolation:isolate!important}
}

@media(max-width:390px){
  .build-stage .bubble:nth-child(1),.visual-community .cloud .bubble:nth-child(1){width:112px!important;height:112px!important}
  .build-stage .bubble:nth-child(2),.visual-community .cloud .bubble:nth-child(2){width:100px!important;height:100px!important;left:58%!important}
  .build-stage .bubble:nth-child(3),.visual-community .cloud .bubble:nth-child(3){width:92px!important;height:92px!important}
  .build-stage .bubble:nth-child(4),.visual-community .cloud .bubble:nth-child(4){width:104px!important;height:104px!important;left:62%!important}
  .build-stage .bubble:nth-child(5),.visual-community .cloud .bubble:nth-child(5){width:96px!important;height:96px!important}
  .build-stage .bubble:nth-child(6),.visual-community .cloud .bubble:nth-child(6){width:90px!important;height:90px!important}
  .build-stage .bubble:nth-child(7),.visual-community .cloud .bubble:nth-child(7){width:88px!important;height:88px!important;left:69%!important}
}