/* ONLYNSFW.VIP — mobile-first overrides
   Loaded last. Desktop styles remain untouched. */

@media (max-width: 900px) {
  html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-padding-top: 96px;
    overflow-x: hidden;
  }

  body {
    width: 100%;
    max-width: 100vw;
    overflow-x: hidden !important;
  }

  img, video, canvas, svg { max-width: 100%; }
  button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
  button, .button, a { touch-action: manipulation; }

  /* Shared floating navbar */
  .site-header {
    top: max(10px, env(safe-area-inset-top)) !important;
    padding: 0 10px !important;
  }

  .site-header .nav-shell {
    width: min(100%, 680px) !important;
    max-width: calc(100vw - 20px) !important;
    min-height: 58px !important;
    padding: 7px 8px 7px 11px !important;
    gap: 7px !important;
    border-radius: 17px !important;
  }

  .nav-shell .brand {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    gap: 7px !important;
    font-size: 15px !important;
    white-space: nowrap;
  }

  .nav-shell .brand-logo {
    width: 36px !important;
    height: 36px !important;
    flex: 0 0 36px !important;
  }

  .nav-actions {
    flex: 0 0 auto !important;
    gap: 5px !important;
  }

  .nav-actions .auth-link {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    padding: 0 !important;
    border-radius: 11px !important;
  }

  .nav-actions .auth-link span { display: none !important; }
  .nav-actions .auth-link svg { width: 18px !important; height: 18px !important; }

  .nav-actions .nav-join {
    min-height: 38px !important;
    padding: 0 11px !important;
    gap: 6px !important;
    font-size: 11px !important;
  }

  .nav-actions .nav-join svg { width: 16px !important; height: 16px !important; }

  .menu-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    padding: 0 !important;
    flex: 0 0 38px !important;
    border-radius: 11px !important;
  }

  .nav-links {
    display: none !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: calc(100% + 8px) !important;
    width: 100% !important;
    padding: 8px !important;
    gap: 4px !important;
    border: 1px solid rgba(216,161,255,.28) !important;
    border-radius: 15px !important;
    background: rgba(20,13,29,.97) !important;
    backdrop-filter: blur(24px) saturate(150%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(150%) !important;
    box-shadow: 0 18px 42px rgba(0,0,0,.55) !important;
  }

  .nav-links.is-open {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .site-header .nav-links a {
    width: 100% !important;
    min-height: 46px !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 14px !important;
    border-radius: 10px !important;
    font-size: 14px !important;
  }

  .site-header .nav-links a:active { background: rgba(255,255,255,.08) !important; }

  .user-menu { position: relative !important; }
  .user-menu-button {
    max-width: 132px !important;
    min-height: 38px !important;
    padding: 5px 8px !important;
    gap: 6px !important;
  }
  .user-menu-button .user-avatar,
  .nav-actions .user-avatar { width: 27px !important; height: 27px !important; }
  #userDisplayName {
    max-width: 70px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
  .user-menu-panel {
    position: fixed !important;
    top: 78px !important;
    right: 12px !important;
    left: auto !important;
    width: min(230px, calc(100vw - 24px)) !important;
    z-index: 250 !important;
  }

  /* Shared content spacing below floating nav */
  body > main.wrap,
  body > main.account-main,
  body > main:not(.legal-layout):not(.access-main) {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  /* Home hero */
  header.rx-electric-hero {
    min-height: auto !important;
    padding: 118px 14px 58px !important;
    overflow: hidden !important;
  }

  .rx-electric-hero .hero-content {
    width: 100% !important;
    max-width: 560px !important;
    padding: 0 !important;
  }

  .rx-electric-hero .hero-badge {
    max-width: 100% !important;
    min-height: 34px !important;
    padding: 7px 12px !important;
    font-size: 9px !important;
    letter-spacing: .14em !important;
  }

  .rx-electric-hero .hero-title {
    margin: 17px 0 12px !important;
    font-size: clamp(38px, 11vw, 54px) !important;
    line-height: .98 !important;
    letter-spacing: -.045em !important;
  }

  .rx-electric-hero .rx-hero-brand {
    margin-top: 13px !important;
    gap: 8px !important;
    font-size: clamp(12px, 3.6vw, 16px) !important;
    letter-spacing: .2em !important;
  }

  .rx-electric-hero .rx-hero-age { font-size: 10px !important; }

  .rx-electric-hero .hero-subtitle {
    max-width: 540px !important;
    margin: 16px auto 0 !important;
    padding: 0 4px !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
  }

  .rx-electric-hero .hero-buttons {
    width: 100% !important;
    max-width: 430px !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    margin: 24px auto 0 !important;
  }

  header.rx-electric-hero.rx-electric-hero .hero-buttons a {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 56px !important;
    margin: 0 !important;
    padding: 11px 48px !important;
    font-size: 15px !important;
  }

  .rx-electric-hero .rx-hero-signature { margin-top: 21px !important; }
  .rx-electric-hero .rx-hero-upgrade {
    width: min(100%, 390px) !important;
    margin-top: 15px !important;
    padding: 0 3px !important;
    font-size: 11px !important;
    line-height: 1.4 !important;
  }

  .rx-money-floats,
  .hero-floating-icons { opacity: .34 !important; }

  /* Homepage directory */
  .discover { padding-top: 38px !important; }
  .drops-header {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 18px !important;
  }
  .drops-heading h1 { font-size: clamp(34px, 10vw, 48px) !important; }
  .drops-heading p { font-size: 14px !important; line-height: 1.55 !important; }
  .drops-pill { width: fit-content !important; max-width: 100% !important; font-size: 9px !important; }

  .drops-filters {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    width: 100% !important;
    gap: 8px !important;
  }
  .drop-filter { min-height: 44px !important; justify-content: center !important; }

  .drops-stats {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    margin: 18px 0 !important;
  }
  .stat-glass { min-height: 88px !important; padding: 13px !important; }

  .search-glass {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    padding: 13px !important;
    border-radius: 18px !important;
  }
  .search-caption { min-width: 0 !important; }
  .search-glass .search { min-height: 50px !important; padding: 0 14px !important; }

  .directory-controls,
  .controls.directory-controls {
    width: 100% !important;
    display: block !important;
  }
  .custom-sort, .sort { width: 100% !important; }
  .sort-trigger { width: 100% !important; min-height: 46px !important; justify-content: space-between !important; }
  .sort-options { width: 100% !important; left: 0 !important; right: 0 !important; }

  #categories,
  .categories {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: calc(100vw - 28px) !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    gap: 7px !important;
    padding: 4px 1px 9px !important;
    margin: 14px 0 18px !important;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  #categories::-webkit-scrollbar,
  .categories::-webkit-scrollbar { display: none; }
  #categories .chip,
  .categories .chip { flex: 0 0 auto !important; scroll-snap-align: start; }

  .grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  .grid .card { border-radius: 19px !important; }
  .grid .portrait { aspect-ratio: 1.45 / 1 !important; }
  .grid .card-body { padding: 15px 16px 17px !important; }
  .grid .card-body h3 { font-size: 19px !important; }
  .grid .card-body p { font-size: 13px !important; }
  .grid .creator-cta { min-height: 46px !important; display: flex !important; align-items: center !important; justify-content: center !important; }

  .memberships { padding-top: 54px !important; }
  .section-top {
    align-items: flex-start !important;
    gap: 12px !important;
    flex-direction: column !important;
  }
  .section-top h2 { font-size: clamp(32px, 9vw, 44px) !important; }
  .member-only-link { width: 100% !important; text-align: center !important; }
  .notice { font-size: 13px !important; line-height: 1.55 !important; }
  .membership-grid { grid-template-columns: 1fr !important; gap: 12px !important; }

  /* Join section */
  .join-community {
    padding: 68px 14px 64px !important;
  }
  .join-community-inner { width: 100% !important; }
  .join-community h2 { font-size: clamp(34px, 10vw, 48px) !important; }
  .join-community-description { font-size: 14px !important; }
  .join-community-button {
    width: 100% !important;
    max-width: 390px !important;
    min-height: 56px !important;
    padding: 12px 16px !important;
    font-size: 15px !important;
  }

  /* Transferred footer */
  .pr-footer-scope .site-footer {
    width: calc(100% - 20px) !important;
    max-width: none !important;
    margin: 38px 10px max(16px, env(safe-area-inset-bottom)) !important;
    padding: 22px 16px !important;
    border-radius: 20px !important;
  }
  .pr-footer-scope .footer-content,
  .pr-footer-scope .footer-top,
  .pr-footer-scope .footer-bottom {
    width: 100% !important;
    min-width: 0 !important;
  }
  .pr-footer-scope .footer-top,
  .pr-footer-scope .footer-bottom {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 14px !important;
  }
  .pr-footer-scope .footer-links-grid {
    width: 100% !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 22px 14px !important;
  }
  .pr-footer-scope .footer-col { min-width: 0 !important; }
  .pr-footer-scope .footer-nav-link { min-height: 40px !important; }
  .pr-footer-scope .compliance-badges {
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
  }

  /* Legal pages */
  .legal-layout {
    width: calc(100% - 24px) !important;
    max-width: 760px !important;
    padding-top: 112px !important;
  }
  .legal-layout h1 {
    font-size: clamp(36px, 11vw, 48px) !important;
    letter-spacing: -.045em !important;
    overflow-wrap: anywhere;
  }
  .legal-intro { font-size: 14px !important; line-height: 1.65 !important; }
  .legal-document { width: 100% !important; min-width: 0 !important; }
  .legal-section { padding-bottom: 21px !important; margin-bottom: 22px !important; }
  .legal-section h2 { font-size: 18px !important; line-height: 1.3 !important; }
  .legal-section p,
  .legal-section li { font-size: 14px !important; line-height: 1.72 !important; overflow-wrap: anywhere; }
  .legal-section ul { padding-left: 20px !important; }

  /* Account / profile */
  .account-main {
    width: 100% !important;
    padding-top: 112px !important;
    padding-bottom: 54px !important;
  }
  .account-main h1 { font-size: clamp(34px, 10vw, 46px) !important; letter-spacing: -.04em !important; }
  .account-panel { padding: 18px !important; border-radius: 17px !important; }
  .account-panel .button + .secondary,
  .account-panel .secondary + .button { margin-left: 0 !important; margin-top: 8px !important; }
  .account-panel .button,
  .account-panel .secondary { min-height: 46px !important; }

  #profileDashboard > .user-panel {
    padding: 18px !important;
    border-radius: 18px !important;
  }
  #profileDashboard > .user-panel .user-info { min-width: 0 !important; }
  #profileDashboard > .user-panel .user-info > div { min-width: 0 !important; }
  #profileDashboard > .user-panel .user-info h2,
  #profileDashboard > .user-panel .user-info p { overflow-wrap: anywhere !important; }
  #profileDashboard > .user-panel .row-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
  }
  #profileDashboard > .user-panel .row-actions button,
  #profileDashboard > .user-panel .row-actions a { width: 100% !important; min-width: 0 !important; }

  .access-section { margin-top: 36px !important; }
  .vip-membership-intro {
    padding: 20px 16px !important;
    border-radius: 18px !important;
  }
  .vip-membership-intro-content { min-width: 0 !important; }
  .vip-membership-symbol { width: 52px !important; height: 52px !important; }
  .vip-unlock-action { width: 100% !important; min-height: 48px !important; }

  body:has(.hero) .hero {
    padding-top: 112px !important;
    min-height: auto !important;
    grid-template-columns: 1fr !important;
  }
  body:has(.hero) .hero-copy { min-width: 0 !important; }
  body:has(.hero) .hero h1 { font-size: clamp(38px, 11vw, 50px) !important; }
  body:has(.hero) .hero-art { min-height: 260px !important; transform: scale(.92); transform-origin: center top; }

  /* Admin */
  body:has(.heading) > main {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 54px !important;
    padding: 112px 14px 0 !important;
  }
  .heading {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 16px !important;
  }
  .heading h1 { font-size: clamp(38px, 11vw, 50px) !important; margin: 8px 0 !important; }
  .heading > .primary { width: 100% !important; min-height: 48px !important; }
  .stats { grid-template-columns: 1fr !important; gap: 10px !important; margin: 20px 0 !important; }
  .stats article { padding: 16px !important; border-radius: 16px !important; }
  .toolbar {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }
  .toolbar input { width: 100% !important; }
  .models { grid-template-columns: 1fr !important; }
  .model { padding: 12px !important; }
  .model img { width: 60px !important; height: 68px !important; }
  .model button { min-height: 42px !important; }
  .editor { padding: 16px !important; border-radius: 17px !important; }
  .editor-head {
    align-items: flex-start !important;
    flex-direction: column !important;
  }
  .fields { grid-template-columns: 1fr !important; gap: 13px !important; }
  .fields .wide { grid-column: auto !important; }
  .flags { display: grid !important; grid-template-columns: 1fr 1fr !important; }
  .actions { flex-wrap: wrap !important; }
  .actions .primary,
  .actions .secondary,
  .actions .danger { flex: 1 1 100% !important; min-height: 46px !important; }

  /* Admin access denied */
  .access-main {
    width: 100% !important;
    min-height: auto !important;
    padding: 112px 14px 54px !important;
  }
  .access-card {
    width: 100% !important;
    max-width: 560px !important;
    padding: 28px 18px !important;
    border-radius: 20px !important;
  }
  .access-card h1 { font-size: clamp(34px, 10vw, 46px) !important; overflow-wrap: anywhere; }
  .access-description,
  .access-note { font-size: 14px !important; line-height: 1.6 !important; }
  .access-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }
  .access-actions a { width: 100% !important; min-height: 46px !important; }

  /* Creator modal */
  .creator-modal { padding: 10px !important; }
  .creator-modal-panel {
    width: 100% !important;
    max-width: 100% !important;
    max-height: calc(100dvh - 20px) !important;
    overflow-y: auto !important;
    border-radius: 20px !important;
  }
  .modal-image { max-height: 42dvh !important; object-fit: cover !important; }
  .modal-details { padding: 17px !important; }
  .modal-links { display: grid !important; grid-template-columns: 1fr !important; gap: 8px !important; }
  .modal-links a { min-height: 46px !important; }
  .modal-close { width: 42px !important; height: 42px !important; }

  /* Form usability: prevents iOS zoom and improves touch */
  input, textarea, select {
    font-size: 16px !important;
  }
  input, select, textarea, button { max-width: 100%; }
}

@media (max-width: 520px) {
  .nav-shell .brand-logo { width: 33px !important; height: 33px !important; flex-basis: 33px !important; }
  .nav-shell .brand { font-size: 14px !important; }
  .nav-actions .nav-join span { font-size: 10px !important; }
  .user-menu-button { max-width: 91px !important; }
  #userDisplayName { max-width: 40px !important; font-size: 11px !important; }

  .rx-electric-hero .hero-title { font-size: clamp(36px, 11.5vw, 48px) !important; }
  .rx-electric-hero .hero-badge { letter-spacing: .11em !important; }
  .rx-electric-hero .rx-hero-upgrade { text-align: left !important; }

  .pr-footer-scope .footer-links-grid { grid-template-columns: 1fr !important; }
  .flags { grid-template-columns: 1fr !important; }
}

@media (max-width: 380px) {
  .site-header { padding: 0 7px !important; }
  .site-header .nav-shell { max-width: calc(100vw - 14px) !important; padding-left: 8px !important; gap: 4px !important; }
  .nav-shell .brand { font-size: 13px !important; gap: 5px !important; }
  .nav-shell .brand-logo { width: 31px !important; height: 31px !important; flex-basis: 31px !important; }
  .nav-actions .nav-join { width: 37px !important; min-width: 37px !important; padding: 0 !important; }
  .nav-actions .nav-join span { display: none !important; }
  .nav-actions .auth-link,
  .menu-toggle { width: 36px !important; min-width: 36px !important; height: 36px !important; flex-basis: 36px !important; }
  .user-menu-button { max-width: 78px !important; }

  header.rx-electric-hero { padding-left: 11px !important; padding-right: 11px !important; }
  .rx-electric-hero .hero-buttons { max-width: 100% !important; }
  header.rx-electric-hero.rx-electric-hero .hero-buttons a { padding-left: 42px !important; padding-right: 42px !important; }

  .drops-filters { grid-template-columns: 1fr !important; }
  .join-community { padding-left: 11px !important; padding-right: 11px !important; }
}

/* Touch devices do not need desktop pointer animation; preserve the dotted background
   but remove expensive pointer-following layers for smoother scrolling. */
@media (hover: none), (pointer: coarse) {
  html.rx-pointer-active,
  html.rx-pointer-active * { cursor: auto !important; }
  .rx-pointer-cursor,
  .rx-pixel-trail,
  .rx-field-orb { display: none !important; }
  .rx-pointer-field { animation: none !important; opacity: .58 !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
  }
}

/* =========================================================
   MOBILE NAVBAR — organized like pornoromanesc.ro
   Only affects phones. Desktop stays untouched.
   ========================================================= */
@media (max-width: 640px) {
  .site-header {
    position: fixed !important;
    top: max(10px, env(safe-area-inset-top)) !important;
    left: 0 !important;
    right: 0 !important;
    padding: 0 10px !important;
    pointer-events: none !important;
    z-index: 9999 !important;
  }

  .site-header .nav-shell {
    pointer-events: auto !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 58px !important;
    height: 58px !important;
    margin: 0 !important;
    padding: 6px 8px 6px 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    border-radius: 22px !important;
    overflow: visible !important;
  }

  /* Left: logo only, exactly the compact mobile treatment */
  .site-header .nav-shell .brand {
    flex: 0 0 auto !important;
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
  }

  .site-header .nav-shell .brand > span,
  .site-header .nav-shell .brand #brand {
    display: none !important;
  }

  .site-header .nav-shell .brand-logo {
    width: 42px !important;
    height: 42px !important;
    max-width: 42px !important;
    flex: 0 0 42px !important;
    margin: 0 !important;
  }

  /* Right: login/account + hamburger. JOIN stays inside the menu/content on phone. */
  .site-header .nav-actions {
    flex: 0 0 auto !important;
    margin-left: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 7px !important;
  }

  .site-header .nav-actions .nav-join {
    display: none !important;
  }

  .site-header .nav-actions .auth-link {
    display: inline-flex !important;
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 16px !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 0 !important;
    background: linear-gradient(135deg,#9b38f1 0%,#bd52ee 52%,#d65bd9 100%) !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.17), 0 8px 24px rgba(139,48,204,.24) !important;
  }

  .site-header .nav-actions .auth-link span {
    display: none !important;
  }

  .site-header .nav-actions .auth-link svg {
    display: block !important;
    width: 20px !important;
    height: 20px !important;
    margin: 0 !important;
  }

  /* Logged-in state becomes a compact avatar button instead of a wide username pill. */
  .site-header .user-menu {
    flex: 0 0 auto !important;
  }

  .site-header .user-menu-button {
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    background: linear-gradient(135deg,#8f2eea,#bd4be8 56%,#d85bd3) !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 8px 24px rgba(139,48,204,.22) !important;
  }

  .site-header .user-menu-button #userDisplayName,
  .site-header .user-menu-button > span:not(#userDisplayName) {
    display: none !important;
  }

  .site-header .user-menu-button .user-avatar,
  .site-header .nav-actions .user-avatar {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    margin: 0 !important;
    border-radius: 50% !important;
    object-fit: cover !important;
  }

  .site-header .menu-toggle {
    display: inline-flex !important;
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 !important;
    margin: 0 !important;
    flex: 0 0 46px !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 16px !important;
    background: rgba(255,255,255,.045) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.07) !important;
    font-size: 22px !important;
    line-height: 1 !important;
  }

  .site-header .menu-toggle:active,
  .site-header .nav-actions .auth-link:active,
  .site-header .user-menu-button:active {
    transform: scale(.96) !important;
  }

  /* Dropdown opens neatly under the full navbar, same compact organization. */
  .site-header .nav-links {
    display: none !important;
    position: fixed !important;
    top: calc(max(10px, env(safe-area-inset-top)) + 66px) !important;
    left: 10px !important;
    right: 10px !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 10px !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 7px !important;
    border-radius: 20px !important;
    background: linear-gradient(180deg,rgba(27,17,36,.98),rgba(12,9,17,.97)) !important;
    border: 1px solid rgba(216,161,255,.24) !important;
    box-shadow: 0 22px 65px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.08) !important;
    backdrop-filter: blur(24px) saturate(155%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(155%) !important;
    z-index: 10000 !important;
  }

  .site-header .nav-links.is-open {
    display: flex !important;
  }

  .site-header .nav-links a {
    width: 100% !important;
    min-height: 46px !important;
    padding: 0 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 14px !important;
    background: rgba(255,255,255,.045) !important;
    border: 1px solid rgba(255,255,255,.07) !important;
    color: #f4eaf9 !important;
    font-size: 13px !important;
    font-weight: 750 !important;
  }

  .site-header .user-menu-panel {
    top: calc(max(10px, env(safe-area-inset-top)) + 66px) !important;
    right: 66px !important;
    left: auto !important;
    width: min(220px, calc(100vw - 30px)) !important;
  }
}

@media (max-width: 350px) {
  .site-header .nav-shell {
    padding-left: 7px !important;
    padding-right: 7px !important;
    gap: 5px !important;
  }
  .site-header .nav-shell .brand,
  .site-header .nav-actions .auth-link,
  .site-header .user-menu-button,
  .site-header .menu-toggle {
    width: 43px !important;
    min-width: 43px !important;
    height: 43px !important;
    min-height: 43px !important;
  }
  .site-header .nav-shell .brand-logo {
    width: 39px !important;
    height: 39px !important;
    max-width: 39px !important;
  }
}

/* === Mobile Discord profile card — adapted 1:1 from pornoromanesc.ro === */
@media (max-width: 900px) {
  .site-header .user-menu { position: relative !important; z-index: 10060 !important; }

  .site-header .user-menu-panel {
    position: fixed !important;
    top: calc(max(10px, env(safe-area-inset-top)) + 68px) !important;
    right: 10px !important;
    left: auto !important;
    width: min(228px, calc(100vw - 20px)) !important;
    min-width: 0 !important;
    padding: 10px !important;
    border-radius: 19px !important;
    background: linear-gradient(180deg, rgba(28,21,36,.98), rgba(12,9,16,.97)) !important;
    border: 1px solid rgba(178,102,244,.30) !important;
    box-shadow: 0 22px 70px rgba(0,0,0,.56), inset 0 1px 0 rgba(255,255,255,.08) !important;
    backdrop-filter: blur(22px) saturate(150%) !important;
    -webkit-backdrop-filter: blur(22px) saturate(150%) !important;
    overflow: visible !important;
    z-index: 2147483600 !important;
  }

  .site-header .user-menu-panel[hidden] { display: none !important; }
  .site-header .user-menu-panel:not([hidden]) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .mobile-profile-summary {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    padding: 8px 9px !important;
    margin: 0 0 9px !important;
    border-radius: 15px !important;
    background: rgba(255,255,255,.045) !important;
    border: 1px solid rgba(255,255,255,.09) !important;
    box-sizing: border-box !important;
  }

  .mobile-profile-summary-avatar {
    width: 39px !important;
    height: 39px !important;
    min-width: 39px !important;
    border-radius: 999px !important;
    object-fit: cover !important;
    background: rgba(255,255,255,.06) !important;
    box-shadow: 0 0 0 2px rgba(255,255,255,.15), 0 0 18px rgba(170,88,242,.35) !important;
  }

  .mobile-profile-summary-copy {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    line-height: 1.15 !important;
    text-align: left !important;
  }

  .mobile-profile-summary-name {
    display: block !important;
    max-width: 145px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: -.01em !important;
  }

  .mobile-profile-summary-id {
    display: block !important;
    margin-top: 3px !important;
    color: rgba(218,204,226,.72) !important;
    font-size: 9.5px !important;
    font-weight: 750 !important;
    line-height: 1.2 !important;
    overflow-wrap: anywhere !important;
  }

  .site-header .user-menu-panel > a.mobile-profile-action,
  .site-header .user-menu-panel > button.mobile-logout-action {
    width: 100% !important;
    min-height: 43px !important;
    margin: 0 !important;
    padding: 0 13px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    box-sizing: border-box !important;
    border-radius: 999px !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    text-align: center !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    transition: transform .18s ease, filter .18s ease !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.17) !important;
  }

  .site-header .user-menu-panel > a.mobile-profile-action {
    margin-bottom: 7px !important;
    background: linear-gradient(135deg, rgba(158,63,242,.96), rgba(181,81,239,.94)) !important;
    box-shadow: 0 11px 30px rgba(158,63,242,.22), inset 0 1px 0 rgba(255,255,255,.17) !important;
  }

  .site-header .user-menu-panel > button.mobile-logout-action {
    background: linear-gradient(135deg, rgba(239,68,168,.98), rgba(212,89,243,.94)) !important;
    box-shadow: 0 11px 30px rgba(239,68,168,.22), inset 0 1px 0 rgba(255,255,255,.17) !important;
  }

  .site-header .user-menu-panel > a.mobile-profile-action:active,
  .site-header .user-menu-panel > button.mobile-logout-action:active {
    transform: scale(.98) !important;
    filter: brightness(1.06) !important;
  }

  .mobile-profile-action svg,
  .mobile-logout-action svg {
    width: 16px !important;
    height: 16px !important;
    flex: 0 0 16px !important;
    stroke: currentColor !important;
  }
}

/* === Mobile hamburger actions — same PR-style card as Discord profile menu === */
@media (max-width: 900px) {
  .site-header .nav-links {
    position: fixed !important;
    top: calc(max(10px, env(safe-area-inset-top)) + 68px) !important;
    right: 10px !important;
    left: auto !important;
    width: min(228px, calc(100vw - 20px)) !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 10px !important;
    gap: 7px !important;
    border-radius: 19px !important;
    background: linear-gradient(180deg, rgba(28,21,36,.98), rgba(12,9,16,.97)) !important;
    border: 1px solid rgba(178,102,244,.30) !important;
    box-shadow: 0 22px 70px rgba(0,0,0,.56), inset 0 1px 0 rgba(255,255,255,.08) !important;
    backdrop-filter: blur(22px) saturate(150%) !important;
    -webkit-backdrop-filter: blur(22px) saturate(150%) !important;
    overflow: visible !important;
    z-index: 2147483590 !important;
  }

  .site-header .nav-links.is-open {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .site-header .nav-links > a {
    width: 100% !important;
    min-height: 43px !important;
    margin: 0 !important;
    padding: 0 13px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    box-sizing: border-box !important;
    border-radius: 999px !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    text-align: center !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    transition: transform .18s ease, filter .18s ease !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.17) !important;
  }

  .site-header .nav-links > a:first-child {
    background: linear-gradient(135deg, rgba(158,63,242,.96), rgba(181,81,239,.94)) !important;
    box-shadow: 0 11px 30px rgba(158,63,242,.22), inset 0 1px 0 rgba(255,255,255,.17) !important;
  }

  .site-header .nav-links > a:nth-child(2) {
    background: linear-gradient(135deg, rgba(239,68,168,.98), rgba(212,89,243,.94)) !important;
    box-shadow: 0 11px 30px rgba(239,68,168,.22), inset 0 1px 0 rgba(255,255,255,.17) !important;
  }

  .site-header .nav-links > a:active {
    transform: scale(.98) !important;
    filter: brightness(1.06) !important;
  }
}