/* ZephyHosting navbar — ported from zephyhostingweb Navbar.jsx */

        @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

        .zh-site-header, .zh-site-header * {
          font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
        }

        @keyframes slideDownFade {
          from {
            opacity: 0;
            transform: translateY(-20px);
          }
          to {
            opacity: 1;
            transform: translateY(0);
          }
        }

        @keyframes fadeInContent {
          from {
            opacity: 0;
            transform: translateY(10px);
          }
          to {
            opacity: 1;
            transform: translateY(0);
          }
        }

        @keyframes fadeSlide {
          0% {
            opacity: 1;
            transform: translateX(0);
          }
          40% {
            opacity: 0;
            transform: translateX(-50px);
          }
          60% {
            opacity: 0;
            transform: translateX(50px);
          }
          100% {
            opacity: 1;
            transform: translateX(0);
          }
        }

        @keyframes bounceRotate {
          0%, 100% {
            transform: translateY(0) rotate(0deg);
          }
          25% {
            transform: translateY(-4px) rotate(-8deg);
          }
          75% {
            transform: translateY(-4px) rotate(8deg);
          }
        }

        @keyframes gradientShift {
          0% {
            background-position: 0% 50%;
          }
          50% {
            background-position: 100% 50%;
          }
          100% {
            background-position: 0% 50%;
          }
        }

        @keyframes shineEnter {
          0% {
            left: -100%;
            opacity: 0;
          }
          20% {
            opacity: 1;
          }
          80% {
            opacity: 1;
          }
          100% {
            left: 100%;
            opacity: 0;
          }
        }

        @keyframes slideInRight {
          from {
            transform: translateX(100%);
          }
          to {
            transform: translateX(0);
          }
        }

        @keyframes accordionOpen {
          from {
            opacity: 0;
            max-height: 0;
          }
          to {
            opacity: 1;
            max-height: 2000px;
          }
        }

        .zh-mobile-menu-enter {
          animation: slideInRight 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
        }

        .zh-accordion-content {
          animation: accordionOpen 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
          overflow: hidden;
        }

        .zh-announcement-enter {
          animation: fadeSlide 1.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
        }

        .zh-dropdown-content--games {
          animation: none;
        }

        .zh-dropdown-menu {
          animation: slideDownFade 0.22s cubic-bezier(0.16, 1, 0.3, 1) forwards;
          overflow: hidden;
        }

        .zh-dropdown-content {
          animation: fadeInContent 0.28s cubic-bezier(0.16, 1, 0.3, 1) forwards;
        }

        .zh-banner-btn:hover {
          color: #e879f9;
          transition: color 0.3s ease;
        }

        .zh-menu-btn {
          cursor: pointer;
          transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
        }

        .zh-menu-btn:hover {
          color: #e879f9;
          transform: translateY(-2px);
        }

        .zh-icon-btn {
          cursor: pointer;
          transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
        }

        .zh-icon-btn:hover {
          color: #e879f9;
          animation: bounceRotate 0.6s ease;
        }

        .menu-item {
          cursor: pointer;
          transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
        }

        .menu-item:hover {
          background-color: rgba(232, 121, 249, 0.15) !important;
          border-color: rgba(232, 121, 249, 0.6) !important;
          transform: translateX(4px);
          box-shadow: inset 0 0 12px rgba(232, 121, 249, 0.2);
        }

        .game-hosting-item {
          cursor: pointer;
          background-color: #2a2b3d;
          border: 1px solid #3a3b52;
          border-radius: 12px;
          position: relative;
          overflow: hidden;
          transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
        }

        .game-hosting-item::before {
          content: '';
          position: absolute;
          top: 0;
          left: -100%;
          width: 100%;
          height: 100%;
          background: linear-gradient(
            90deg,
            transparent 0%,
            rgba(255, 255, 255, 0) 20%,
            rgba(255, 255, 255, 0.4) 40%,
            rgba(255, 255, 255, 0.7) 50%,
            rgba(255, 255, 255, 0.4) 60%,
            rgba(255, 255, 255, 0) 80%,
            transparent 100%
          );
          z-index: 2;
          pointer-events: none;
          opacity: 0;
          border-radius: 12px;
        }

        .game-hosting-item::after {
          content: '';
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          background: linear-gradient(270deg, #22d3ee, #e879f9, #22d3ee);
          background-size: 200% 200%;
          opacity: 0;
          transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1);
          z-index: 0;
          pointer-events: none;
          border-radius: 12px;
        }

        .game-hosting-item .game-content {
          position: relative;
          z-index: 1;
        }

        .game-hosting-item:hover {
          border-color: transparent;
          transform: scale(1.05);
          box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
          border-radius: 12px;
        }

        .game-hosting-item:hover::after {
          opacity: 1;
          animation: gradientShift 3s ease infinite;
        }

        .game-hosting-item:hover::before {
          animation: shineEnter 0.8s ease-out forwards;
        }

        .game-hosting-item:not(:hover)::after {
          opacity: 0;
        }

        .game-hosting-item:hover .game-text {
          color: #ffffff;
          font-weight: 700;
          text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
        }

        .game-icon {
          transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
        }

        .game-hosting-item:hover .game-icon {
          color: #ffffff !important;
          transform: scale(1.1);
          filter: drop-shadow(0 2px 8px rgba(255, 255, 255, 0.3));
        }

        @keyframes gamesMegaShellIn {
          from {
            opacity: 0;
            transform: translateY(8px);
          }
          to {
            opacity: 1;
            transform: translateY(0);
          }
        }

        @keyframes gameCoverShine {
          0% {
            transform: translateX(-120%) skewX(-12deg);
            opacity: 0;
          }
          30% {
            opacity: 1;
          }
          100% {
            transform: translateX(220%) skewX(-12deg);
            opacity: 0;
          }
        }

        @keyframes gameRipple {
          0% {
            transform: scale(0);
            opacity: 0.45;
          }
          100% {
            transform: scale(2.2);
            opacity: 0;
          }
        }

        @keyframes gamesMediaEnterLeft {
          from {
            opacity: 0;
            transform: translateX(-12px);
          }
          to {
            opacity: 1;
            transform: translateX(0);
          }
        }

        @keyframes gamesMediaEnterRight {
          from {
            opacity: 0;
            transform: translateX(12px);
          }
          to {
            opacity: 1;
            transform: translateX(0);
          }
        }

        @media (prefers-reduced-motion: reduce) {
          .games-mega__shell,
          .games-mega__aside--left,
          .games-mega__aside--right,
          .zh-dropdown-menu,
          .zh-dropdown-content {
            animation: none !important;
          }
        }

        .games-mega {
          width: 100%;
          display: flex;
          justify-content: center;
          padding: 0 0.5rem;
        }

        .games-mega__shell {
          width: 100%;
          max-width: 1280px;
          display: grid;
          grid-template-columns: 210px minmax(0, 1fr) 192px;
          gap: 1rem 1.15rem;
          align-items: center;
          contain: layout style;
          animation: gamesMegaShellIn 0.28s cubic-bezier(0.16, 1, 0.3, 1) backwards;
        }

        .games-mega__aside--left {
          display: flex;
          flex-direction: column;
          animation: gamesMediaEnterLeft 0.32s cubic-bezier(0.16, 1, 0.3, 1) 0.04s backwards;
        }

        .games-mega__aside--right {
          display: flex;
          flex-direction: column;
          padding: 0.35rem;
          background: linear-gradient(160deg, #15162a 0%, #0e0f18 100%);
          animation: gamesMediaEnterRight 0.32s cubic-bezier(0.16, 1, 0.3, 1) 0.06s backwards;
        }

        .games-mega__aside {
          position: relative;
          align-self: stretch;
          min-height: 100%;
          border-radius: 12px;
          overflow: hidden;
          border: 1px solid rgba(58, 59, 82, 0.65);
          background: #12131f;
          box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
        }

        .games-mega__aside--left::before {
          content: '';
          position: absolute;
          inset: 0;
          background: linear-gradient(
            180deg,
            transparent 35%,
            rgba(18, 19, 31, 0.75) 70%,
            rgba(18, 19, 31, 0.95) 100%
          );
          pointer-events: none;
          z-index: 1;
        }

        .games-mega__aside-img {
          width: 100%;
          flex: 1;
          min-height: 0;
          object-fit: cover;
          display: block;
        }

        .games-mega__video-wrap {
          position: relative;
          flex: 1;
          width: 100%;
          min-height: 0;
          aspect-ratio: 9 / 16;
          border-radius: 9px;
          overflow: hidden;
          background: #000;
        }

        .games-mega__video-wrap iframe {
          position: absolute;
          inset: 0;
          width: 100%;
          height: 100%;
          border: 0;
        }

        .games-mega__aside-label {
          position: absolute;
          left: 0;
          right: 0;
          bottom: 0;
          z-index: 2;
          padding: 0.85rem 0.75rem 0.75rem;
          display: flex;
          flex-direction: column;
          gap: 0.3rem;
        }

        .games-mega__aside-label--video {
          position: relative;
          padding: 0.55rem 0.15rem 0.1rem;
        }

        .games-mega__aside-tag {
          align-self: flex-start;
          padding: 0.15rem 0.45rem;
          border-radius: 4px;
          font-size: 0.55rem;
          font-weight: 700;
          letter-spacing: 0.06em;
          text-transform: uppercase;
          color: #fde68a;
          background: rgba(250, 204, 21, 0.12);
          border: 1px solid rgba(250, 204, 21, 0.28);
        }

        .games-mega__aside-tag--video {
          color: #fca5a5;
          background: rgba(239, 68, 68, 0.12);
          border-color: rgba(239, 68, 68, 0.28);
        }

        .games-mega__aside-title {
          font-size: 0.72rem;
          font-weight: 600;
          color: #e2e8f0;
          line-height: 1.35;
        }

        .games-mega__video-placeholder {
          position: absolute;
          inset: 0;
          display: flex;
          align-items: center;
          justify-content: center;
          background: #0a0a12;
        }

        .games-mega__video-placeholder img {
          width: 100%;
          height: 100%;
          object-fit: cover;
        }

        .games-mega__video-play {
          position: absolute;
          width: 2.25rem;
          height: 2.25rem;
          display: flex;
          align-items: center;
          justify-content: center;
          border-radius: 999px;
          background: rgba(239, 68, 68, 0.92);
          color: #fff;
          font-size: 0.85rem;
          box-shadow: 0 4px 14px rgba(0, 0, 0, 0.4);
        }

        .games-mega__layout {
          width: 100%;
          max-width: none;
          display: grid;
          grid-template-columns: repeat(5, minmax(0, 1fr));
          gap: 0.65rem 0.7rem;
          align-items: start;
        }

        .games-mega__col-title {
          color: #94a3b8;
          font-weight: 700;
          font-size: 0.72rem;
          margin-bottom: 0.45rem;
          letter-spacing: 0.08em;
          text-transform: uppercase;
          padding-bottom: 0.35rem;
          border-bottom: 1px solid rgba(58, 59, 82, 0.55);
        }

        .games-mega__col--accent .games-mega__col-title {
          color: #fde68a;
          border-bottom-color: rgba(250, 204, 21, 0.22);
        }

        .games-mega__col-items {
          display: flex;
          flex-direction: column;
          gap: 0.38rem;
        }

        .games-mega__link {
          position: relative;
          display: flex;
          align-items: center;
          gap: 0.55rem;
          min-height: 68px;
          padding: 0.4rem 0.45rem;
          border-radius: 9px;
          text-decoration: none;
          overflow: hidden;
          background: rgba(42, 43, 61, 0.45);
          border: 1px solid rgba(58, 59, 82, 0.65);
          box-shadow: none;
          cursor: pointer;
          transition:
            transform 0.3s cubic-bezier(0.16, 1, 0.3, 1),
            box-shadow 0.3s ease,
            border-color 0.3s ease,
            background 0.3s ease;
        }

        .games-mega__link::before {
          content: '';
          position: absolute;
          inset: 0;
          background: linear-gradient(
            135deg,
            rgba(34, 211, 238, 0.1) 0%,
            rgba(232, 121, 249, 0.08) 50%,
            transparent 100%
          );
          opacity: 0;
          transition: opacity 0.3s ease;
          pointer-events: none;
        }

        .games-mega__link::after {
          content: '';
          position: absolute;
          inset: 0;
          border-radius: inherit;
          opacity: 0;
          pointer-events: none;
        }

        .games-mega__link:hover {
          transform: translateY(-3px);
          border-color: rgba(34, 211, 238, 0.45);
          background: rgba(45, 46, 69, 0.88);
          box-shadow:
            0 8px 20px rgba(0, 0, 0, 0.28),
            0 0 0 1px rgba(34, 211, 238, 0.12);
        }

        .games-mega__link:hover::before {
          opacity: 1;
        }

        .games-mega__link:active {
          transform: translateY(-2px) scale(0.97);
          transition-duration: 0.12s;
          box-shadow:
            0 6px 16px rgba(0, 0, 0, 0.3),
            0 0 0 1px rgba(34, 211, 238, 0.35);
        }

        .games-mega__link:active::after {
          animation: gameRipple 0.45s ease-out forwards;
          background: radial-gradient(circle, rgba(34, 211, 238, 0.35) 0%, transparent 70%);
        }

        .games-mega__cover {
          position: relative;
          flex-shrink: 0;
          width: 38px;
          height: 54px;
          border-radius: 6px;
          overflow: hidden;
          background: #080a10;
          box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
          transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease;
        }

        .games-mega__link:hover .games-mega__cover {
          transform: scale(1.06);
          box-shadow: 0 6px 18px rgba(0, 0, 0, 0.5), 0 0 12px rgba(34, 211, 238, 0.2);
        }

        .games-mega__link:active .games-mega__cover {
          transform: scale(1.02);
        }

        .games-mega__cover-shine {
          position: absolute;
          inset: 0;
          background: linear-gradient(
            105deg,
            transparent 0%,
            rgba(255, 255, 255, 0.45) 45%,
            transparent 90%
          );
          transform: translateX(-120%) skewX(-12deg);
          pointer-events: none;
          z-index: 2;
        }

        .games-mega__link:hover .games-mega__cover-shine {
          animation: gameCoverShine 0.65s ease forwards;
        }

        .games-mega__cover::after {
          content: '';
          position: absolute;
          inset: 0;
          background: linear-gradient(180deg, transparent 50%, rgba(0, 0, 0, 0.4) 100%);
          pointer-events: none;
        }

        .games-mega__cover img {
          width: 100%;
          height: 100%;
          object-fit: cover;
          transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
        }

        .games-mega__link:hover .games-mega__cover img {
          transform: scale(1.08);
        }

        .games-mega__cover--all {
          display: flex;
          align-items: center;
          justify-content: center;
          background: linear-gradient(145deg, #3b82f6 0%, #1d4ed8 100%);
          border: 1px solid rgba(96, 165, 250, 0.4);
        }

        .games-mega__link--all {
          background: rgba(37, 99, 235, 0.12);
          border-color: rgba(59, 130, 246, 0.35);
        }

        .games-mega__link--all:hover {
          border-color: rgba(96, 165, 250, 0.65);
          background: rgba(37, 99, 235, 0.22);
          box-shadow:
            0 12px 28px rgba(0, 0, 0, 0.35),
            0 0 0 1px rgba(59, 130, 246, 0.25),
            0 0 28px rgba(59, 130, 246, 0.2);
        }

        .games-mega__link--all::before {
          background: linear-gradient(
            135deg,
            rgba(59, 130, 246, 0.15) 0%,
            rgba(147, 197, 253, 0.1) 100%
          );
        }

        .games-mega__cover--all::after {
          display: none;
        }

        .games-mega__grid-icon {
          width: 22px;
          height: 22px;
          display: grid;
          grid-template-columns: repeat(2, 1fr);
          gap: 3px;
          position: relative;
          z-index: 1;
        }

        .games-mega__grid-icon span {
          display: block;
          border-radius: 2px;
          background: rgba(255, 255, 255, 0.92);
        }

        .games-mega__info {
          flex: 1;
          min-width: 0;
          display: flex;
          flex-direction: column;
          justify-content: center;
          gap: 0.25rem;
          position: relative;
          z-index: 1;
        }

        .games-mega__title-row {
          display: flex;
          align-items: center;
          gap: 0.35rem;
          min-width: 0;
        }

        .games-mega__col-items .games-mega__title-row {
          flex-direction: column;
          align-items: flex-start;
          gap: 0.22rem;
        }

        .games-mega__col-items .games-mega__name {
          white-space: normal;
          overflow: visible;
          text-overflow: unset;
          flex: unset;
          width: 100%;
          line-height: 1.3;
        }

        .games-mega__name {
          font-size: 0.625rem;
          font-weight: 700;
          letter-spacing: 0.04em;
          text-transform: uppercase;
          color: #f8fafc;
          line-height: 1.25;
          transition: color 0.25s ease;
        }

        .games-mega__link--stacked .games-mega__title-row {
          flex-direction: column;
          align-items: flex-start;
          gap: 0.22rem;
        }

        .games-mega__link--stacked .games-mega__name {
          white-space: normal;
          overflow: visible;
          text-overflow: unset;
          flex: unset;
          width: 100%;
          line-height: 1.3;
        }

        .games-mega__link:hover .games-mega__name {
          color: #bfdbfe;
        }

        .games-mega__link--all:hover .games-mega__name {
          color: #dbeafe;
        }

        .games-mega__price {
          font-size: 0.6rem;
          font-weight: 500;
          color: #64748b;
          line-height: 1.15;
          transition: color 0.25s ease;
        }

        .games-mega__link:hover .games-mega__price {
          color: #94a3b8;
        }

        .games-mega__hint {
          font-size: 0.68rem;
          font-weight: 500;
          color: #7c8db5;
          line-height: 1.2;
          transition: color 0.25s ease;
        }

        .games-mega__link--all:hover .games-mega__hint {
          color: #93c5fd;
        }

        .games-mega__tag {
          flex-shrink: 0;
          padding: 0.12rem 0.38rem;
          border-radius: 4px;
          font-size: 0.48rem;
          font-weight: 700;
          letter-spacing: 0.04em;
          text-transform: uppercase;
          line-height: 1.15;
          border: 1px solid transparent;
          transition: transform 0.25s ease;
        }

        .games-mega__link:hover .games-mega__tag {
          transform: scale(1.05);
        }

        .games-mega__tag--java {
          color: #fde68a;
          background: rgba(250, 204, 21, 0.12);
          border-color: rgba(250, 204, 21, 0.35);
        }

        .games-mega__tag--bedrock {
          color: #fca5a5;
          background: rgba(239, 68, 68, 0.12);
          border-color: rgba(239, 68, 68, 0.32);
        }

        .games-mega__tag--new {
          color: #86efac;
          background: rgba(34, 197, 94, 0.12);
          border-color: rgba(34, 197, 94, 0.3);
        }

        .games-mega__tag--update {
          color: #fcd34d;
          background: rgba(245, 158, 11, 0.12);
          border-color: rgba(245, 158, 11, 0.32);
        }

        .games-mega__tag--default {
          color: #c4b5fd;
          background: rgba(139, 92, 246, 0.15);
          border-color: rgba(139, 92, 246, 0.3);
        }

        .games-mega-mobile__grid {
          display: flex;
          flex-direction: column;
          gap: 0.35rem;
        }

        .games-mega-mobile__link {
          display: flex;
          align-items: center;
          gap: 0.75rem;
          padding: 0.55rem 0.65rem;
          border-radius: 8px;
          text-decoration: none;
          transition: background 0.2s ease, transform 0.15s ease;
        }

        .games-mega-mobile__link:hover {
          background: #171f3c;
        }

        .games-mega-mobile__link:active {
          transform: scale(0.99);
        }

        .games-mega-mobile__cover {
          flex-shrink: 0;
          width: 48px;
          height: 70px;
          border-radius: 5px;
          overflow: hidden;
          box-shadow: 0 3px 10px rgba(0, 0, 0, 0.35);
          border: 1px solid rgba(255, 255, 255, 0.08);
        }

        .games-mega-mobile__cover img {
          width: 100%;
          height: 100%;
          object-fit: cover;
        }

        .games-mega-mobile__link--all {
          margin-top: 0.15rem;
          border-top: 1px solid rgba(100, 116, 139, 0.25);
          padding-top: 0.65rem;
        }

        .games-mega-mobile__info {
          flex: 1;
          min-width: 0;
          display: flex;
          flex-direction: column;
          gap: 0.15rem;
        }

        .games-mega-mobile__title-row {
          display: flex;
          align-items: center;
          flex-wrap: wrap;
          gap: 0.35rem;
          min-width: 0;
        }

        .games-mega-mobile__name {
          font-size: 0.8rem;
          font-weight: 700;
          letter-spacing: 0.04em;
          text-transform: uppercase;
          color: #f1f5f9;
          line-height: 1.25;
          display: block;
        }

        .games-mega-mobile__price {
          font-size: 0.7rem;
          color: #7c8db5;
          line-height: 1.25;
          display: block;
        }

        .zh-mobile-menu-content::-webkit-scrollbar {
          width: 6px;
        }

        .zh-mobile-menu-content::-webkit-scrollbar-track {
          background: #1a1b2d;
        }

        .zh-mobile-menu-content::-webkit-scrollbar-thumb {
          background: #3a3b52;
          border-radius: 3px;
        }

        .zh-mobile-menu-content::-webkit-scrollbar-thumb:hover {
          background: #4a4b62;
        }

        .mobile-card {
          transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
        }

        .mobile-card:hover {
          transform: translateY(-2px);
        }

        .service-icon-box {
          width: 56px;
          height: 56px;
          border-radius: 14px;
          display: flex;
          align-items: center;
          justify-content: center;
          flex-shrink: 0;
          backdrop-filter: blur(12px);
          -webkit-backdrop-filter: blur(12px);
          border: 1px solid rgba(255, 255, 255, 0.1);
        }

        .zh-client-area-btn {
          background: linear-gradient(135deg, #7621d4 0%, #5b1aa3 100%);
          border-radius: 16px;
          padding: 18px 24px;
          text-align: center;
          font-weight: 800;
          font-size: 18px;
          color: #ffffff;
          text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
          box-shadow: 0 8px 24px rgba(118, 33, 212, 0.4), 0 2px 8px rgba(0, 0, 0, 0.2);
          transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
          border: 2px solid rgba(255, 255, 255, 0.15);
          position: relative;
          overflow: hidden;
        }

        .zh-client-area-btn::before {
          content: '';
          position: absolute;
          top: 0;
          left: -100%;
          width: 100%;
          height: 100%;
          background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
          transition: left 0.5s;
        }

        .zh-client-area-btn:hover::before {
          left: 100%;
        }

        .zh-client-area-btn:hover {
          transform: translateY(-2px);
          box-shadow: 0 12px 32px rgba(118, 33, 212, 0.5), 0 4px 12px rgba(0, 0, 0, 0.3);
        }

        .zh-client-area-btn:active {
          transform: translateY(0);
        }

        .desktop-badge {
          font-weight: 900 !important;
          font-size: 11px;
          letter-spacing: 0.5px;
        }
      

/* ========== WHMCS integration shell (identical chrome + overlay megas) ========== */
html.zh-branded, html.zh-has-site-header { display: block !important; }
html.zh-branded body, body.zh-has-site-header {
  width: 100% !important; max-width: none !important; flex: none !important;
}
.zh-site-header {
  position: relative;
  top: auto;
  z-index: 1040;
  width: 100%;
  background: #1a1b2d;
}
.zh-topbar {
  background: #16172a;
  border-bottom: 1px solid #8b5cf6;
  padding: 10.5px 12px;
}
@media (min-width: 1024px) {
  .zh-topbar { padding: 14.5px 16px; }
}
.zh-topbar-inner {
  max-width: 1400px; margin: 0 auto;
  display: flex; align-items: center; justify-content: center; gap: 12px;
}
@media (min-width: 1024px) {
  .zh-topbar-inner { justify-content: space-between; gap: 24px; }
}
.zh-ann { flex: 1; min-width: 0; display: flex; justify-content: center; overflow: hidden; }
@media (min-width: 1024px) { .zh-ann { justify-content: flex-start; } }
.zh-ann-item {
  display: inline-flex; align-items: center; gap: 8px;
  color: #e2e8f0; text-decoration: none; max-width: 100%;
}
@media (min-width: 1024px) { .zh-ann-item { gap: 12px; } }
.zh-ann-item:hover { opacity: .8; color: #e2e8f0; }
.zh-ann-item[hidden] { display: none !important; }
.zh-ann-badge {
  font-size: .75rem; font-weight: 700; padding: 4px 8px; border-radius: 4px;
  white-space: nowrap; border: 1px solid transparent;
}
@media (min-width: 1024px) { .zh-ann-badge { font-size: .875rem; padding: 4px 12px; } }
.zh-badge-new { background: rgba(124,58,237,.4); color: #c4b5fd; border-color: rgba(139,92,246,.3); }
.zh-badge-info { background: rgba(37,99,235,.4); color: #93c5fd; border-color: rgba(59,130,246,.3); }
.zh-badge-sale { background: rgba(220,38,38,.4); color: #fca5a5; border-color: rgba(239,68,68,.3); }
.zh-badge-tip { background: rgba(22,163,74,.4); color: #86efac; border-color: rgba(34,197,94,.3); }
.zh-ann-text { font-size: .875rem; font-weight: 500; color: #e2e8f0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (min-width: 1024px) { .zh-ann-text { font-size: 1rem; } }
.zh-ann-arrow { width: 16px; height: 16px; flex: 0 0 auto; color: #cbd5e1; }
@media (min-width: 1024px) { .zh-ann-arrow { width: 20px; height: 20px; } }
@media (max-width: 639px) { .zh-ann-arrow { display: none; } }
.zh-topbar-links { display: none; align-items: center; gap: 12px; flex: 0 0 auto; }
@media (min-width: 1024px) { .zh-topbar-links { display: flex; } }
.zh-banner-btn {
  display: inline-flex; align-items: center; gap: 8px;
  color: #cbd5e1 !important; text-decoration: none !important;
  padding: 10px 16px; font-size: .875rem; font-weight: 500;
}
.zh-banner-btn svg { width: 16px; height: 16px; flex: 0 0 auto; }
.zh-banner-btn.is-active { color: #e879f9 !important; }

.zh-nav-shell {
  position: relative;
  width: 100%;
  background: #1a1b2d;
}
.zh-site-header.is-scrolled .zh-nav-shell,
.zh-site-header.is-mega-open .zh-nav-shell {
  background: #1a1b2d;
}
.zh-mainnav {
  max-width: 1400px; margin: 0 auto; padding: 0 24px;
  height: 96px; display: flex; align-items: center; justify-content: space-between;
}
.zh-logo { flex: 0 0 auto; display: block; text-decoration: none; }
.zh-logo-box { width: 160px; height: 80px; }
@media (min-width: 1024px) { .zh-logo-box { width: 192px; height: 88px; } }
.zh-logo-box img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 12px 24px rgba(0,0,0,.45)); }

.zh-navbar-menu { display: none; align-items: center; gap: 4px; }
@media (min-width: 1024px) { .zh-navbar-menu { display: flex; } }
.zh-menu-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 16px; border: 0; border-radius: 8px;
  background: transparent; color: #e2e8f0; cursor: pointer;
  font-size: 1.125rem; font-weight: 600;
}
.zh-menu-btn.is-active { color: #22d3ee; }
.zh-menu-btn .zh-chev { width: 16px; height: 16px; transition: transform .3s ease; }
.zh-menu-btn.is-active .zh-chev { transform: rotate(180deg); }
.zh-nav-sep { width: 1px; height: 32px; margin: 0 8px; background: #22d3ee; }
.zh-icon-btn {
  display: inline-flex; padding: 8px; color: #e2e8f0 !important; text-decoration: none !important;
}
.zh-icon-btn svg { width: 24px; height: 24px; }
.zh-burger {
  display: inline-flex; padding: 8px; border: 0; border-radius: 8px;
  background: transparent; color: #e2e8f0; cursor: pointer;
}
@media (min-width: 1024px) { .zh-burger { display: none; } }
.zh-burger svg { width: 24px; height: 24px; }

/* Mega dropdown: absolute overlay under nav shell — never pushes WHMCS */
.zh-dropdown-menu {
  position: absolute !important;
  left: 0; right: 0; top: 100%;
  z-index: 1060;
  width: 100%;
  background: #1a1b2d;
  border-left: 1px solid #2d2e45;
  border-right: 1px solid #2d2e45;
  border-bottom: 1px solid #2d2e45;
  border-bottom-left-radius: 16px;
  border-bottom-right-radius: 16px;
  box-shadow: 0 25px 50px rgba(0,0,0,.45);
  overflow: hidden;
}
.zh-dropdown-menu[hidden] { display: none !important; }
.zh-dropdown-inner { max-width: 1400px; margin: 0 auto; padding: 32px 24px; }
.zh-dropdown-inner--games { padding-top: 20px; padding-bottom: 20px; }
.zh-cols-3 {
  display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 28px;
  max-width: 750px; margin: 0 auto;
}
.zh-cols-2 {
  display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 28px;
  max-width: 500px; margin: 0 auto;
}
.zh-cols-3.zh-cols-more { max-width: 650px; }
.zh-col-title {
  margin: 0 0 20px; color: #f1f5f9; font-size: 1.125rem; font-weight: 700;
}
.zh-col-items { display: flex; flex-direction: column; gap: 12px; }
.game-hosting-item {
  display: flex; align-items: center; gap: 12px;
  padding: 12px; min-height: 48px; height: 48px;
  text-decoration: none !important; color: inherit;
}
.game-hosting-item .game-content { display: flex; align-items: center; gap: 12px; width: 100%; }
.game-hosting-item .game-icon-wrap {
  width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.game-hosting-item .game-icon { width: 24px; height: 24px; color: #cbd5e1; }
.game-hosting-item .game-text {
  color: #e2e8f0; font-weight: 500; font-size: .875rem;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block;
  transition: all .3s ease;
}

/* Mobile drawer */
.zh-mobile-overlay {
  display: none; position: fixed; inset: 0; z-index: 1080;
  background: rgba(0,0,0,.7); backdrop-filter: blur(4px);
}
.zh-mobile-drawer {
  display: none; position: fixed; top: 0; right: 0; bottom: 0;
  width: 100%; max-width: 28rem; z-index: 1090;
  background: #1e1f2e; box-shadow: -8px 0 32px rgba(0,0,0,.6);
  flex-direction: column; overflow: hidden;
}
.zh-site-header.is-mobile-open .zh-mobile-overlay,
.zh-site-header.is-mobile-open .zh-mobile-drawer { display: flex; }
.zh-site-header.is-mobile-open .zh-mobile-overlay { display: block; }
.zh-mobile-drawer-head {
  padding: 24px; border-bottom: 1px solid #2d2e45;
  display: flex; align-items: center; justify-content: space-between;
}
.zh-mobile-drawer-body { flex: 1; overflow: auto; padding: 16px; }
.zh-mobile-drawer-foot { padding: 20px; border-top: 1px solid #2d2e45; }
.zh-client-area-btn {
  display: block; width: 100%; text-decoration: none !important; color: #fff !important;
}
@media (min-width: 1024px) {
  .zh-mobile-overlay, .zh-mobile-drawer { display: none !important; }
}