/* =========================================================
   V28 — COI performance + navigation polish
   ========================================================= */

/* Beautiful, lightweight first paint. It disappears once the app is ready. */
#site-preloader{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;background:radial-gradient(circle at 50% 42%,#0b2940 0,#061522 38%,#02070d 100%);transition:opacity .55s ease,visibility .55s ease;overflow:hidden}
#site-preloader.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
#site-preloader:before{content:"";position:absolute;width:min(72vw,560px);height:min(72vw,560px);border-radius:50%;background:radial-gradient(circle,rgba(85,215,255,.15),transparent 68%);filter:blur(10px);animation:preloaderPulse 2.8s ease-in-out infinite}
.preloader-orbit{position:absolute;width:210px;height:210px;border:1px solid rgba(103,220,255,.16);border-radius:50%;animation:preloaderSpin 7s linear infinite}
.preloader-orbit:before,.preloader-orbit:after{content:"";position:absolute;inset:16px;border:1px dashed rgba(170,145,255,.22);border-radius:50%}
.preloader-orbit:after{inset:36px;border-style:solid;border-color:rgba(255,255,255,.10);animation:preloaderSpin 4s linear infinite reverse}
.preloader-orbit span{position:absolute;width:8px;height:8px;border-radius:50%;background:#67dcff;box-shadow:0 0 18px rgba(103,220,255,.85);top:-4px;left:50%;transform:translateX(-50%)}
.preloader-orbit span:nth-child(2){top:auto;left:auto;right:14px;bottom:18px;background:#a88cff}.preloader-orbit span:nth-child(3){top:50%;left:4px;background:#fff}
.preloader-logo{position:relative;z-index:2;width:92px;height:92px;object-fit:contain;filter:drop-shadow(0 12px 30px rgba(85,215,255,.25));animation:preloaderFloat 2.2s ease-in-out infinite}
.preloader-copy{position:absolute;top:calc(50% + 118px);display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center}.preloader-copy strong{font-size:18px;letter-spacing:.08em}.preloader-copy span{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#8faabd}
.preloader-progress{position:absolute;bottom:9vh;width:min(240px,55vw);height:2px;background:rgba(255,255,255,.08);overflow:hidden;border-radius:99px}.preloader-progress i{display:block;width:35%;height:100%;background:linear-gradient(90deg,transparent,#67dcff,#a98dff,transparent);animation:preloaderLoad 1.35s ease-in-out infinite}
@keyframes preloaderSpin{to{transform:rotate(360deg)}}@keyframes preloaderPulse{50%{transform:scale(1.12);opacity:.72}}@keyframes preloaderFloat{50%{transform:translateY(-7px) scale(1.03)}}@keyframes preloaderLoad{0%{transform:translateX(-180%)}100%{transform:translateX(420%)}}

/* Progressive rendering: keep only the first three viewport-heights hot. */
#feed>.reel:nth-child(n+4){content-visibility:auto;contain-intrinsic-size:100vh}
#igFeed>.ig-post:nth-child(n+4){content-visibility:auto;contain-intrinsic-size:760px}
#feed img[loading="lazy"],#igFeed img[loading="lazy"]{content-visibility:auto}

/* Desktop menu: neutral, high-contrast, no washed-out blue text. */
@media(min-width:901px){
  .ig-sidebar{background:#fff!important;color:#18212b!important;border-right:1px solid #e7edf2!important;box-shadow:8px 0 32px rgba(19,41,58,.05)!important}
  .ig-sidebar .ig-brand{color:#111820!important}
  .ig-sidebar .ig-brand-globe{display:block!important;width:42px!important;height:42px!important;object-fit:contain!important}
  .ig-sidebar .ig-brand-logo{display:none!important;width:164px!important;height:78px!important;object-fit:contain!important;object-position:left center!important}
  body.desktop-menu-open .ig-sidebar .ig-brand-globe{display:none!important}
  body.desktop-menu-open .ig-sidebar .ig-brand-logo{display:block!important}
  .ig-sidebar .ig-menu button,.ig-sidebar .ig-sidebar-bottom button{color:#18212b!important;background:transparent!important}
  .ig-sidebar .ig-menu button:hover,.ig-sidebar .ig-sidebar-bottom button:hover{background:#f3f6f8!important;color:#111820!important}
  .ig-sidebar .ig-menu button.active{background:#eef2f5!important;color:#111820!important;box-shadow:inset 3px 0 0 #18212b!important}
  .ig-sidebar .ig-menu button.active svg{color:#111820!important;stroke:#111820!important}
  .ig-sidebar .ig-menu svg,.ig-sidebar .ig-sidebar-bottom svg{color:#25303a!important;stroke:#25303a!important}
  .ig-sidebar .ig-sidebar-bottom{color:#18212b!important}
  .ig-sidebar .ig-sidebar-bottom .market-credit,.ig-sidebar .ig-footer a{color:#18212b!important}
}

/* Mobile video canvas must be truly edge-to-edge; no black gutter. */
@media(max-width:900px){
  html,body,#app,#feed{width:100vw!important;max-width:100vw!important;min-width:100vw!important}
  .video-reel{width:100vw!important;min-width:100vw!important;max-width:100vw!important;background:#041525!important}
  .video-reel .video-bg{inset:0!important;width:100%!important;height:100%!important;background:radial-gradient(circle at 50% 45%,rgba(44,122,255,.38),transparent 30%),linear-gradient(130deg,#031123,#0a2945 52%,#020912)!important;filter:none!important}
  .video-reel .video-overlay{inset:0!important;width:100%!important;height:100%!important}
  .video-library-content{width:100vw!important;max-width:100vw!important;margin:0!important}
  .mobile-video-carousel{width:calc(100vw - 28px)!important;max-width:none!important}
  .top-whatsapp{width:42px!important;height:42px!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;padding:0!important}
  .top-whatsapp img{width:100%!important;height:100%!important;object-fit:contain!important}

  /* Four profile highlights, evenly distributed and visually modern. */
  .profile-reel .highlights{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:6px!important;width:100%!important;align-items:start!important;justify-items:center!important}
  .profile-reel .highlights button{min-width:0!important;width:100%!important;display:flex!important;flex-direction:column!important;align-items:center!important;gap:7px!important}
  .profile-reel .highlights button>span{width:54px!important;height:54px!important;display:grid!important;place-items:center!important;border-radius:18px!important;border:1px solid rgba(255,255,255,.24)!important;background:rgba(255,255,255,.06)!important;box-shadow:0 8px 24px rgba(0,0,0,.16)!important;color:#dff7ff!important}
  .profile-reel .highlights button>span svg{width:24px!important;height:24px!important;stroke:currentColor!important;fill:none!important;stroke-width:1.65!important}
  .profile-reel .highlights small{font-size:9px!important;color:rgba(235,246,255,.76)!important}
  .profile-reel .highlights button:active>span{transform:scale(.96)}

  /* Bottom navigation is now a simple color state — no moving tile at all. */
  .bottom-nav-items::before,.bottom-nav-items::after{display:none!important;content:none!important}
  .bottom-nav-items{overflow:visible!important}
  .bottom-nav .nav-item,.bottom-nav .nav-item.active{background:transparent!important;box-shadow:none!important;border:0!important}
  .bottom-nav .nav-item{color:rgba(230,240,248,.62)!important;transition:color .18s ease,transform .18s ease!important}
  .bottom-nav .nav-item.active{color:#67dcff!important}
  .bottom-nav .nav-item.active span,.bottom-nav .nav-item.active small{color:#67dcff!important;text-shadow:0 0 8px rgba(103,220,255,.28)!important}
  .bottom-nav .nav-item span svg{stroke:currentColor!important;color:currentColor!important}
}

@media(prefers-reduced-motion:reduce){#site-preloader *,.preloader-orbit,.preloader-logo,.preloader-progress i{animation:none!important;transition:none!important}}

/* =========================================================
   V29 — requested visual/interaction corrections
   ========================================================= */

/* Desktop and mobile use the exact same preloader treatment. */
#site-preloader{font-family:inherit}

/* Countdown below the three profile stats. */
.profile-stats-wrap{min-width:0}
.profile-countdown{display:flex;align-items:baseline;gap:3px;margin-top:8px;color:rgba(210,230,242,.68);font-variant-numeric:tabular-nums;white-space:nowrap}
.profile-countdown span{font-size:11px;font-weight:800;letter-spacing:.02em;color:#67dcff}
.profile-countdown b{font-size:8px;font-weight:700;color:rgba(220,235,244,.55);margin-right:2px}
.ig-profile-countdown{display:flex;flex-direction:column;gap:3px;margin-top:8px;padding-top:8px;border-top:1px solid #edf1f4;max-width:280px}
.ig-profile-countdown small,.ig-side-countdown small{font-size:9px;font-weight:800;letter-spacing:.18em;color:#6f7e89}
.ig-profile-countdown strong{font-size:14px;letter-spacing:.02em;color:#0c7da3;font-variant-numeric:tabular-nums}

/* Highlights are circles, not rounded squares, and fill the available desktop row. */
.ig-highlights{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important;width:100%!important;align-items:start!important}
.ig-highlight{min-width:0!important;width:100%!important}
.ig-highlight span{width:74px!important;height:74px!important;border-radius:50%!important}
.ig-highlight img{border-radius:50%!important}

/* Mobile highlights: true circles and equal distribution. */
@media(max-width:900px){
  .profile-reel .highlights button>span{border-radius:50%!important;background:rgba(255,255,255,.045)!important}
  .profile-countdown{margin-top:6px;gap:2px}
  .profile-countdown span{font-size:9px}
  .profile-countdown b{font-size:7px}

  /* The three screenshots labelled 02/02A/02B are vertically centered between fixed UI zones. */
  .reel[data-id="science"],.reel[data-id="memory"],.reel[data-id="gallery"]{display:flex!important;align-items:center!important;justify-content:center!important;box-sizing:border-box!important;padding-top:calc(78px + env(safe-area-inset-top))!important;padding-bottom:calc(112px + env(safe-area-inset-bottom))!important}
  .reel[data-id="science"] .split-copy{padding-top:0!important;margin:0!important;transform:none!important;align-self:center!important}
  .reel[data-id="memory"] .reel-content.bottom,.reel[data-id="gallery"] .reel-content{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;top:auto!important;transform:none!important;margin:0 14px!important;padding-top:0!important;padding-bottom:0!important;align-self:center!important}
  .reel[data-id="memory"] .reel-content.bottom{width:calc(100vw - 28px)!important}
  .reel[data-id="gallery"] .reel-content{width:calc(100vw - 28px)!important}

  /* No active tile/rectangle on the bottom navigation. */
  .bottom-nav-items::before,.bottom-nav-items::after{display:none!important;content:none!important}
  .bottom-nav .nav-item,.bottom-nav .nav-item.active,.bottom-nav .nav-item:hover{background:transparent!important;border:0!important;box-shadow:none!important}
  .bottom-nav .nav-item.active{color:#67dcff!important}

  /* Remove every decorative ring around the globe button; keep only the globe artwork itself. */
  .bottom-nav .nav-profile-avatar,.bottom-nav .nav-profile-avatar:hover,.bottom-nav .nav-profile-avatar:active{background:transparent!important;border:0!important;box-shadow:none!important;outline:0!important;padding:0!important}
  .bottom-nav .nav-profile-avatar:before,.bottom-nav .nav-profile-avatar:after{display:none!important;content:none!important}
  .bottom-nav .nav-profile-avatar img{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important;border:0!important;box-shadow:none!important}

  /* WhatsApp remains icon-only. */
  .top-whatsapp{background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important}
}

/* Desktop sidebar: only text color changes on selection — never a colored selection block. */
@media(min-width:901px){
  .ig-sidebar .ig-menu button,.ig-sidebar .ig-sidebar-bottom button{background:transparent!important;border:0!important;box-shadow:none!important;color:#27313c!important}
  .ig-sidebar .ig-menu button:hover,.ig-sidebar .ig-sidebar-bottom button:hover{background:transparent!important;color:#111820!important}
  .ig-sidebar .ig-menu button.active{background:transparent!important;color:#0b7ea3!important;font-weight:800!important;box-shadow:none!important}
  .ig-sidebar .ig-menu button.active svg{color:#27313c!important;stroke:#27313c!important}
  .ig-sidebar .ig-menu button.active span:last-child{color:#0b7ea3!important}
  .ig-sidebar .ig-menu button span:last-child{color:inherit!important}
  .ig-sidebar .ig-brand{background:transparent!important;box-shadow:none!important}

  /* Better use of the right column. */
  .ig-side-countdown{margin:20px 0 18px;padding:16px 15px;border:1px solid #dce8ee;border-radius:16px;background:#fff;box-shadow:0 8px 24px rgba(19,52,72,.05)}
  .ig-side-countdown strong{display:block;margin-top:5px;color:#087ea5;font-size:17px;line-height:1.25;font-variant-numeric:tabular-nums;letter-spacing:.01em}
  .ig-participate{width:100%;margin-top:12px;padding:10px 14px;border-radius:10px;background:#0b1724!important;color:#fff!important;font-size:12px;font-weight:800;letter-spacing:.03em}
  .ig-right .download-photos-link{display:block!important;color:#087ea5!important;line-height:1.35}
  .ig-highlights .ig-highlight{justify-content:flex-start!important}

  /* Shared reaction counts on desktop posts. */
  .ig-post-actions button{position:relative!important;min-width:34px!important;flex-direction:column!important;gap:2px!important}
  .desktop-social-count{display:block!important;font-size:9px!important;line-height:1!important;color:#87939d!important;font-weight:700!important;font-variant-numeric:tabular-nums!important}
  .ig-post-actions button.liked .desktop-social-count{color:#ed4956!important}
}

/* AORP lockup replaces the text placeholder. */
.aorp-mark{display:flex!important;align-items:center!important;justify-content:center!important;width:min(430px,72vw)!important;margin:26px auto 0!important}
.aorp-mark img{display:block!important;width:100%!important;height:auto!important;object-fit:contain!important;max-height:130px!important}

/* Keep the site native-scrolling: no synthetic wheel loop. */
@media(min-width:901px){html,body{scroll-behavior:auto!important}.ig-main{scroll-behavior:auto!important;scroll-snap-type:none!important}}


/* V30 — final mobile navigation, preloader and comment typing corrections */
.preloader-copy strong{color:#fff!important;text-shadow:0 0 18px rgba(255,255,255,.12)!important}
@media(max-width:900px){
  /* Absolutely no selection tile on Início or any other mobile destination. */
  .bottom-nav-items::before,.bottom-nav-items::after{display:none!important;content:none!important;width:0!important;height:0!important;background:none!important;border:0!important;box-shadow:none!important;transform:none!important}
  .bottom-nav-items{--nav-indicator-opacity:0!important}
  .bottom-nav .nav-item,.bottom-nav .nav-item.active,.bottom-nav .nav-item:hover,.bottom-nav .nav-item:focus{background:transparent!important;border:0!important;box-shadow:none!important}
  .bottom-nav .nav-item.active{color:#67dcff!important}
  .bottom-nav .nav-item.active span,.bottom-nav .nav-item.active small{color:#67dcff!important}
  .final .market-credit-mobile{display:inline-block!important;color:#8eaabd!important;text-decoration:none!important;font-size:10px!important;font-weight:700!important;letter-spacing:.08em!important;margin-top:18px!important;opacity:.9!important}
  .final .market-credit-mobile:hover{color:#67dcff!important}
}
@media(min-width:901px){.final .market-credit-mobile{display:none!important}}


/* V31 — definitive mobile navigation reset + readable action feedback */
@media (max-width:900px){
  .bottom-nav .nav-item,
  .bottom-nav .nav-item.active,
  .bottom-nav .nav-item:hover,
  .bottom-nav .nav-item:focus,
  .bottom-nav .nav-item:focus-visible{
    background:transparent!important;
    background-color:transparent!important;
    border:0!important;
    box-shadow:none!important;
    outline:none!important;
  }
  .bottom-nav-items,
  .bottom-nav-items::before,
  .bottom-nav-items::after{
    background:none!important;
    border:0!important;
    box-shadow:none!important;
    content:none!important;
    display:block!important;
  }
  .bottom-nav-items::before,.bottom-nav-items::after{display:none!important;width:0!important;height:0!important;opacity:0!important;visibility:hidden!important}
  .bottom-nav .nav-item.active{color:#67dcff!important}
}

/* Toasts are always high-contrast on desktop and mobile. */
.toast{background:#ffffff!important;color:#14202b!important;border:1px solid #d5e0e8!important;box-shadow:0 14px 40px rgba(4,18,31,.28)!important;font-weight:700!important;opacity:0;}
.toast.show{opacity:1!important;color:#14202b!important;background:#fff!important;}