/* GAYZE Navigation V3 — rebuilt from scratch.
   One authoritative navigation system. Mobile-first, safe-area aware. */

.g-tabbar,
.g-tabbar * { box-sizing: border-box; }

@media (max-width: 767px) {
  .g-tabbar {
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
    height: 76px !important;
    padding: 0 !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: 26px !important;
    background: linear-gradient(180deg, rgba(18,16,28,.92), rgba(8,8,14,.97)) !important;
    box-shadow: 0 18px 48px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px rgba(111,60,195,.08) !important;
    backdrop-filter: blur(28px) saturate(155%) !important;
    -webkit-backdrop-filter: blur(28px) saturate(155%) !important;
    overflow: visible !important;
    z-index: 1400 !important;
  }
  .g-tabbar::before {
    content:""; position:absolute; left:22px; right:22px; top:-1px; height:1px;
    background:linear-gradient(90deg,transparent,#7B2CFF,#D43BDE,#FF9E2C,transparent);
    opacity:.7; pointer-events:none;
  }
  .g-tabbar__inner {
    display:grid !important; grid-template-columns:repeat(5,minmax(0,1fr)) !important;
    width:100% !important; height:100% !important; padding:6px !important; gap:3px !important;
    align-items:stretch !important; overflow:visible !important;
  }
  .g-tab {
    position:relative !important; display:flex !important; flex-direction:column !important;
    align-items:center !important; justify-content:center !important; gap:5px !important;
    width:100% !important; min-width:0 !important; height:64px !important; min-height:64px !important;
    padding:7px 2px 5px !important; margin:0 !important; border:1px solid transparent !important;
    border-radius:18px !important; background:transparent !important; color:#77728a !important;
    transform:none !important; transition:color .2s ease,background .2s ease,border-color .2s ease,transform .16s ease !important;
    -webkit-tap-highlight-color:transparent !important;
  }
  .g-tab:not(.g-tab--discover) svg { width:22px !important; height:22px !important; stroke-width:1.75 !important; color:#9c95b0 !important; }
  .g-tab[data-active="true"]:not(.g-tab--discover) {
    color:#f7f3ff !important; background:rgba(111,60,195,.12) !important; border-color:rgba(170,132,245,.18) !important;
  }
  .g-tab[data-active="true"]:not(.g-tab--discover) svg { color:#c69aff !important; filter:drop-shadow(0 0 9px rgba(111,60,195,.4)); }
  .g-tab:active:not(.g-tab--discover) { transform:scale(.965) !important; }
  .g-tab__ind { display:none !important; }
  .g-tab > .g-tab__label {
    margin:0 !important; font-size:9px !important; line-height:1 !important; font-weight:600 !important;
    letter-spacing:.02em !important; color:inherit !important;
  }
  .g-tab--discover {
    z-index:10 !important; height:102px !important; min-height:102px !important;
    transform:translateY(-25px) !important; justify-content:flex-end !important; gap:6px !important;
    padding:0 !important; border:0 !important; background:transparent !important; overflow:visible !important;
  }
  .g-tab--discover:active { transform:translateY(-22px) scale(.97) !important; }
  .g-tab--discover .g-discover-action {
    position:relative !important; display:flex !important; align-items:center !important; justify-content:center !important;
    width:72px !important; height:72px !important; border-radius:50% !important; padding:9px !important;
    background:radial-gradient(circle at 32% 25%,rgba(111,60,195,.48),rgba(12,9,20,.98) 64%) !important;
    border:1px solid rgba(212,59,222,.5) !important;
    box-shadow:0 0 0 2px rgba(123,44,255,.13),0 0 28px rgba(123,44,255,.38),0 14px 34px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.13) !important;
    isolation:isolate !important;
  }
  .g-tab--discover .g-discover-action::after {
    content:""; position:absolute; inset:-14px; border-radius:50%;
    background:radial-gradient(circle,rgba(212,59,222,.22),transparent 68%); filter:blur(6px); z-index:-2; pointer-events:none;
  }
  .g-tab--discover .g-discover-logo-image {
    width:56px !important; height:56px !important; object-fit:contain !important; display:block !important;
    filter:none !important; transform:none !important;
  }
  .g-tab--discover[data-active="true"] .g-discover-action {
    box-shadow:0 0 0 2px rgba(255,92,157,.18),0 0 36px rgba(212,59,222,.52),0 14px 34px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.16) !important;
  }
  .g-tab--discover .g-tab__label { color:#f0e7ff !important; text-shadow:0 0 12px rgba(212,59,222,.25); }
  .g-tab__badge { position:absolute !important; top:7px !important; right:17% !important; width:7px !important; height:7px !important; border-radius:50% !important; background:#C9A24D !important; box-shadow:0 0 0 2px #0a0b10,0 0 10px rgba(201,162,77,.65) !important; }
}
@media (max-width:380px) {
  .g-tabbar { left:8px !important; right:8px !important; height:72px !important; border-radius:23px !important; }
  .g-tabbar__inner { padding:5px !important; }
  .g-tab--discover { height:94px !important; min-height:94px !important; transform:translateY(-22px) !important; }
  .g-tab--discover .g-discover-action { width:66px !important; height:66px !important; }
  .g-tab--discover .g-discover-logo-image { width:51px !important; height:51px !important; }
}
@media (prefers-reduced-motion:reduce) { .g-tab,.g-tab--discover,.g-discover-action { transition:none !important; } }

@media (min-width:768px) {
  .g-desktop-header { position:fixed !important; top:14px !important; left:16px !important; right:16px !important; z-index:1400 !important; }
  .g-desktop-header__inner {
    height:58px !important; padding:7px 10px 7px 14px !important; border:1px solid rgba(255,255,255,.09) !important;
    border-radius:18px !important; background:rgba(10,10,16,.86) !important; backdrop-filter:blur(24px) saturate(145%) !important;
    -webkit-backdrop-filter:blur(24px) saturate(145%) !important; box-shadow:0 12px 34px rgba(0,0,0,.35) !important;
  }
  .g-navpill { background:rgba(255,255,255,.035) !important; border:1px solid rgba(255,255,255,.07) !important; border-radius:14px !important; padding:3px !important; }
  .g-navpill__btn { border-radius:10px !important; }
}
