/* FOUNTAIN+ V11.9.42 — CREATOR NETWORK MOBILE CLARITY + LEGACY PERFORMANCE
   Fixes the sticky tab text colliding with People copy, makes all four network lanes
   obvious at a glance, and removes expensive mobile compositing from this page. */

@media (max-width:900px){
  /* Give the sticky network tabs a real in-flow landing zone below the fixed 64px site header.
     Without this, position:sticky visually shifts the tabs down while the purpose copy keeps
     its old flow position, which is the overlap visible in the phone screenshot. */
  body[data-page="creators"][data-cn-active-view="people"] .creator-network-os{padding-top:64px!important}

  body[data-page="creators"] .cn-nav{
    position:sticky!important;
    top:64px!important;
    z-index:80!important;
    display:grid!important;
    grid-template-columns:.78fr .95fr 1.52fr 1.35fr!important;
    gap:4px!important;
    width:auto!important;
    margin:0 -10px!important;
    padding:8px 10px!important;
    overflow:visible!important;
    background:#f5efe4!important;
    border-top:1px solid rgba(68,54,38,.10)!important;
    border-bottom:1px solid rgba(68,54,38,.18)!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    box-shadow:none!important;
  }
  body[data-page="creators"] .cn-tab{
    min-width:0!important;
    min-height:46px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:6px 4px!important;
    border:1px solid rgba(79,63,43,.12)!important;
    border-radius:12px!important;
    background:#fffaf2!important;
    color:#665a4e!important;
    font:850 13px/1.12 Arial,Helvetica,sans-serif!important;
    letter-spacing:.015em!important;
    text-transform:none!important;
    text-align:center!important;
    white-space:normal!important;
    box-shadow:none!important;
    -webkit-tap-highlight-color:transparent;
  }
  body[data-page="creators"] .cn-tab.is-active{
    background:#17130f!important;
    border-color:#17130f!important;
    color:#fff!important;
    box-shadow:none!important;
  }

  /* The top tabs are now the only Creator Network mobile switcher.
     Removing the second fixed black bar frees screen space and one compositor layer. */
  body[data-page="creators"] .cn-mobile-bar{display:none!important}

  body[data-page="creators"][data-cn-active-view="people"] .cn-view[data-cn-view="people"]{padding-top:14px!important}
  body[data-page="creators"] .cn-people-purpose-v11941{
    position:relative!important;
    z-index:1!important;
    margin:0 2px 14px!important;
    padding:0!important;
    color:#55483b!important;
    font:650 15px/1.52 Arial,Helvetica,sans-serif!important;
    letter-spacing:-.005em!important;
  }

  /* Older phones: favor paint stability over glass, shadows, and micro-motion. */
  body[data-page="creators"] .cn-people-tools-v11935,
  body[data-page="creators"] .cn-directory-searchbox,
  body[data-page="creators"] .cn-person-card,
  body[data-page="creators"] .cn-panel,
  body[data-page="creators"] .cn-room,
  body[data-page="creators"] .cn-opp{box-shadow:none!important}
  body[data-page="creators"] .cn-people-tools-v11935{background:#fffaf2!important}
  body[data-page="creators"] .cn-tools-arrow,
  body[data-page="creators"] .cn-heart-action,
  body[data-page="creators"] .cn-person-card,
  body[data-page="creators"] .cn-mini-btn{transition:none!important}
  body[data-page="creators"] .cn-all-face-cards .cn-person-card{contain:layout paint style}
  body[data-page="creators"] .cn-card-image-wrap{background:#e8dfd2}
  html{scroll-behavior:auto!important}
}

@media (max-width:430px){
  body[data-page="creators"] .cn-tab{font-size:12.5px!important;min-height:46px!important;padding-inline:2px!important}
  body[data-page="creators"] .cn-people-purpose-v11941{font-size:14.5px!important}
}

@media (max-width:350px){
  body[data-page="creators"] .cn-nav{grid-template-columns:.72fr .88fr 1.5fr 1.32fr!important;gap:3px!important;padding-inline:8px!important}
  body[data-page="creators"] .cn-tab{font-size:11.5px!important;letter-spacing:0!important}
}

@media (max-width:900px) and (prefers-reduced-motion:reduce){
  body[data-page="creators"] *,body[data-page="creators"] *::before,body[data-page="creators"] *::after{animation:none!important;transition:none!important}
}
