/* HF17 FIX6: final iOS layout authority. Loaded last on purpose. */
html.vx-hf17-fix6{--vx-mobile-gutter:12px;--vx-mobile-nav:78px}

@media (max-width:700px){
  html,body,#mainContent{inline-size:100%!important;max-inline-size:100%!important;min-inline-size:0!important;overflow-x:clip!important}
  body{-webkit-text-size-adjust:100%!important;text-size-adjust:100%!important}
  #mainContent :is(h1,h2,h3,h4,h5,h6,p,b,strong,small,span,em,a,button,label,li){
    writing-mode:horizontal-tb!important;text-orientation:mixed!important;word-break:normal!important;overflow-wrap:break-word!important;
  }
  #mainContent :is(span,em,b,strong,small,a){max-width:none!important}
  #mainContent :is(.page,.page.active,.wrap,section,article,aside,header,footer,div){min-width:0!important;box-sizing:border-box!important}
  #mainContent>.page.active{width:100%!important;max-width:100%!important;margin:0!important;padding-inline:var(--vx-mobile-gutter)!important}
  #mainContent>#page-home.active{padding-inline:0!important}

  /* 355px iPhone widths: brand, CTA and controls remain on the same row. */
  #topbar,#topbar.vx320-header,#topbar.vx475-topbar,#topbar.vx46-topbar{
    position:sticky!important;inset:0 0 auto!important;z-index:100!important;display:grid!important;
    grid-template-columns:minmax(116px,1fr) clamp(62px,20vw,82px) 88px!important;align-items:center!important;gap:5px!important;
    width:100%!important;max-width:100%!important;height:68px!important;min-height:68px!important;margin:0!important;padding:7px 8px!important;
    overflow:visible!important;transform:none!important;background:rgba(4,7,18,.97)!important;
    -webkit-backdrop-filter:blur(18px)!important;backdrop-filter:blur(18px)!important;
  }
  #topbar .vx320-brand,#topbar .top-brand,#topbar .vx46-brand{grid-column:1!important;position:static!important;width:100%!important;min-width:0!important;max-width:100%!important;height:52px!important;margin:0!important;padding:0!important;gap:7px!important;overflow:visible!important;transform:none!important}
  #topbar :is(.vx320-brand-mark,.vx320-brand-mark img,.vx46-emblem,.vx95-brand-logo){width:42px!important;height:42px!important;min-width:42px!important;max-width:42px!important;flex:0 0 42px!important;object-fit:contain!important}
  #topbar :is(.vx320-brand-name,.vx46-brand-copy,.vx95-brand-copy){display:block!important;visibility:visible!important;opacity:1!important;min-width:0!important;max-width:100%!important;overflow:hidden!important;white-space:nowrap!important;word-break:keep-all!important;font-size:clamp(15px,4.7vw,20px)!important;line-height:1!important;letter-spacing:.08em!important;text-overflow:clip!important}
  #topbar :is(.vx46-brand-copy small,.vx95-brand-copy small){display:none!important}
  #topbar::after{content:'Keşfet'!important;grid-column:2!important;position:static!important;display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;height:44px!important;min-width:0!important;border:1px solid rgba(164,90,255,.38)!important;border-radius:13px!important;background:linear-gradient(135deg,#7f2eea,#a42eff)!important;color:#fff!important;font:850 clamp(10px,3.2vw,13px)/1 Inter,sans-serif!important;pointer-events:none!important}
  #topbar .vx320-actions{grid-column:3!important;position:static!important;display:grid!important;grid-template-columns:42px 42px!important;align-items:center!important;gap:4px!important;width:88px!important;min-width:88px!important;margin:0!important;transform:none!important}
  #topbar .vx320-lang,#topbar .vx320-hamburger{position:static!important;display:grid!important;place-items:center!important;width:42px!important;min-width:42px!important;height:44px!important;margin:0!important;transform:none!important}
  #topbar .vx320-lang button{display:grid!important;place-items:center!important;width:42px!important;min-width:42px!important;height:44px!important;padding:0!important}
  #topbar .vx320-lang button[data-vx320-lang="en"],#topbar #vx320DesktopNav,#topbar .vx320-theme,#topbar #notifBtn,#topbar .vx320-auth-area{display:none!important}
  #mainContent{padding-top:0!important}

  /* Every desktop composition becomes one real mobile column. */
  #page-home :is(.vx475-hero,.vx475-social-grid,.vx475-feed-grid,.vx475-final,.vx475-network,.vx475-community),
  #page-market :is(.vx477-market-hero,.vx477-market-copy,.vx477-market-benefits),
  #page-servers :is(.vx476-layout,.vx476-server-layout,.v2-grid),
  #page-forum :is(.vx490-forum-layout,.forum-grid),
  #page-discord :is(.vx490-discord-layout,.discord-grid){display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%!important;max-width:100%!important;height:auto!important;min-height:0!important;gap:10px!important}
  #page-home .vx475-wrap,#page-home .vx475-metric-grid{width:calc(100% - 20px)!important;max-width:calc(100% - 20px)!important;margin-inline:auto!important}
  #page-home .vx475-hero{overflow:hidden!important}
  #page-home .vx475-hero-copy,#page-market .vx477-market-copy{width:100%!important;max-width:100%!important;padding:22px 16px!important}
  #page-home .vx475-hero-copy h1,#page-market .vx477-market-copy h1{width:100%!important;max-width:100%!important;font-size:clamp(33px,10vw,48px)!important;line-height:1!important;letter-spacing:-.045em!important}
  #page-home .vx475-quick{position:static!important;inset:auto!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important;max-width:100%!important;height:auto!important;margin-top:12px!important;padding:10px!important;gap:8px!important}
  #page-home .vx475-quick>span,#page-home .vx475-quick>button:last-child{grid-column:1/-1!important}
  #page-home .vx475-quick>button{width:100%!important;min-width:0!important;white-space:normal!important}
  #page-home .vx475-metric-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  #page-home .vx475-metric-grid>article{width:100%!important;min-width:0!important;height:auto!important;min-height:108px!important;grid-template-columns:40px minmax(0,1fr)!important}
  #page-market .vx477-market-hero{padding:10px!important;overflow:hidden!important}
  #page-market .vx477-market-copy>div{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important;gap:8px!important}
  #page-market .vx477-market-art{width:100%!important;min-height:190px!important;max-height:260px!important;overflow:hidden!important}
  #page-market .vx477-market-art img{display:block!important;width:min(100%,420px)!important;height:230px!important;margin:auto!important;object-fit:contain!important}
  #page-market .vx477-market-benefits{padding:8px!important;border-left:0!important;border-top:1px solid rgba(136,91,196,.15)!important}
  #page-market .vx477-market-benefits>div{display:grid!important;grid-template-columns:48px minmax(0,1fr)!important;width:100%!important;min-height:72px!important;padding:10px!important}
  #page-market #marketGrid,#page-market #vx477QuickCats{display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%!important;gap:9px!important}

  /* Only one page of server cards exists in the DOM, preventing iOS crashes. */
  #page-servers.active{padding-bottom:calc(var(--vx-mobile-nav) + env(safe-area-inset-bottom))!important}
  #page-servers #serverList{display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%!important;gap:9px!important;contain:layout style!important}
  #page-servers #serverList>*{width:100%!important;min-width:0!important;max-width:100%!important;transform:none!important;content-visibility:auto!important;contain-intrinsic-size:170px!important}
  #page-server-rankings .vx500-rank-layout{display:grid!important;grid-template-columns:minmax(0,1fr)!important}
  #page-server-rankings .vx500-rank-layout main{width:100%!important;min-width:0!important;overflow:hidden!important}
  #page-server-rankings #vx500RankRows{width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}
  #page-server-rankings :is(.vx500-rank-head,.vx500-rank-row){min-width:690px!important}
  .vx17-page-pager,.vx500-page-pager{display:grid!important;grid-template-columns:repeat(5,minmax(34px,auto))!important;width:100%!important;overflow:visible!important;padding-bottom:max(12px,env(safe-area-inset-bottom))!important}
  .vx17-page-pager>span:last-child,.vx500-page-pager>span:last-child{grid-column:1/-1!important;text-align:center!important}
}

@media (max-width:370px){
  #topbar,#topbar.vx320-header,#topbar.vx475-topbar,#topbar.vx46-topbar{grid-template-columns:minmax(108px,1fr) 58px 80px!important;padding-inline:6px!important;gap:3px!important}
  #topbar :is(.vx320-brand-mark,.vx320-brand-mark img,.vx46-emblem,.vx95-brand-logo){width:38px!important;height:38px!important;min-width:38px!important;max-width:38px!important;flex-basis:38px!important}
  #topbar .vx320-actions{grid-template-columns:38px 38px!important;width:80px!important;min-width:80px!important}
  #topbar .vx320-lang,#topbar .vx320-hamburger,#topbar .vx320-lang button{width:38px!important;min-width:38px!important}
  #topbar :is(.vx320-brand-name,.vx46-brand-copy,.vx95-brand-copy){font-size:14px!important;letter-spacing:.055em!important}
}

@media (prefers-reduced-motion:reduce){html.vx-hf17-fix6 *,html.vx-hf17-fix6 *::before,html.vx-hf17-fix6 *::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
