/* Header artwork is limited to top-level controls, never menu contents. */
:root { --site-header-height: 83px; }
.site-header .nav-shell { width: min(1640px, calc(100% - 32px)); min-height: 82px; gap: 12px; flex-wrap: nowrap; }
.site-header .nav-shell .brand { width: 200px; }
.site-header .nav-shell .nav-live-star { width: 66px; }
.site-header .site-nav { min-width: 0; gap: 8px; flex-wrap: nowrap; }
.site-header .site-nav > :is(.nav-profile, .nav-tools, .nav-deck-doctor) { display: inline-flex; flex: 0 0 auto; width: auto; }
.site-header .nav-deck-doctor { position: relative; align-items: center; }
.site-header .nav-deck-doctor-trigger { cursor: pointer; }
.site-header .nav-deck-doctor-caret { font-size: .62rem; transition: transform .18s ease; }
.site-header .nav-deck-doctor.is-open .nav-deck-doctor-caret { transform: rotate(180deg); }
.site-header .nav-deck-doctor-menu {
  position: absolute; z-index: 210; top: calc(100% + 10px); right: 0; width: min(340px, calc(100vw - 28px));
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 10px;
  border: 1px solid rgba(255,255,255,.3); border-radius: 10px; background: rgba(8,10,30,.98);
  box-shadow: 0 18px 48px rgba(0,0,0,.48); backdrop-filter: blur(18px);
}
.site-header .nav-deck-doctor-menu[hidden] { display: none !important; }
.site-header .nav-deck-doctor-link {
  display: flex; align-items: center; justify-content: center; min-height: 48px; padding: 8px 10px;
  border: 1px solid rgba(255,255,255,.52); border-radius: 999px; color: #fff; text-decoration: none;
  background: linear-gradient(120deg, rgba(255,255,255,.15), rgba(3,5,19,.72)), var(--bubble-foil);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.48), 0 3px 0 rgba(0,0,0,.34), 0 0 14px var(--bubble-glow);
  font-size: .7rem; font-weight: 950; line-height: 1.1; text-align: center; text-shadow: 0 1px 3px #050615;
}
.site-header .nav-deck-doctor-link:nth-child(2) { --bubble-foil: linear-gradient(120deg,#49c9bc,#4a89e3 45%,#b374e5); --bubble-glow: rgba(74,137,227,.24); }
.site-header .nav-deck-doctor-link:nth-child(3) { --bubble-foil: conic-gradient(from 120deg,#5ed6bb,#5589e8,#f3c46e,#df78bd,#5ed6bb); --bubble-glow: rgba(94,214,187,.24); }
.site-header .nav-deck-doctor-link:hover, .site-header .nav-deck-doctor-link:focus-visible { border-color: #f8ff46; transform: translateY(-1px); }
.site-header .nav-deck-doctor-link:focus-visible, .site-header .nav-deck-doctor-overview:focus-visible { outline: 2px solid #f8ff46; outline-offset: 2px; }
.site-header .nav-deck-doctor-overview {
  grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 6px 3px 0; color: #cbd6ef; font-size: .72rem; font-weight: 800; text-decoration: none;
}
.site-header .nav-deck-doctor-overview:hover { color: #fff; }
.site-header [data-header-art] {
  --bubble-foil: linear-gradient(120deg, #276cff, #1cb99c 55%, #f7cf68);
  --bubble-pattern: repeating-linear-gradient(140deg, transparent 0 11px, rgba(255,255,255,.14) 12px 13px, transparent 14px 25px);
  --bubble-glow: rgba(56,232,255,.22);
  --bubble-delay: 0s;
}
.site-header [data-header-art="home"] {
  --bubble-foil: conic-gradient(from 160deg at 28% 50%, #83f6e5, #558be3, #f4e9fc, #58bcc5, #83f6e5);
  --bubble-pattern: repeating-linear-gradient(45deg, transparent 0 8px, rgba(255,255,255,.21) 9px, transparent 10px 22px);
  --bubble-delay: -1s;
}
.site-header [data-header-art="store"] {
  --bubble-foil: linear-gradient(115deg, #fbc56a, #eb7589 38%, #85e8b7 75%, #fff2a2);
  --bubble-pattern: repeating-conic-gradient(from 15deg at 78% 120%, transparent 0 12deg, rgba(255,255,255,.2) 13deg 14deg, transparent 15deg 27deg);
  --bubble-glow: rgba(255,215,99,.22);
  --bubble-delay: -2.5s;
}
.site-header [data-header-art="releases"] {
  --bubble-foil: linear-gradient(120deg, #ef517d, #ab61d7 38%, #64dcbd 74%, #aaf6e9);
  --bubble-pattern: repeating-linear-gradient(90deg, transparent 0 7px, rgba(255,255,255,.22) 8px 9px, transparent 10px 18px);
  --bubble-glow: rgba(255,85,118,.22);
  --bubble-delay: -4s;
}
.site-header [data-header-art="search"] {
  --bubble-foil: conic-gradient(from 218deg at 52% 48%, #f46dbd, #f6ba64, #bef27b, #39cdb8, #55c9ed, #9681ee, #f46dbd);
  --bubble-pattern: radial-gradient(circle at 20% 30%, rgba(255,255,255,.85) 0 1px, transparent 2px);
  --bubble-pattern-size: 23px 23px;
  --bubble-glow: rgba(56,232,255,.28);
  --bubble-delay: -5.5s;
}
.site-header [data-header-art="deck"] {
  --bubble-foil: linear-gradient(125deg, #f86abd, #9065e7 28%, #3eadd6 52%, #71e3ad 74%, #f2d37d);
  --bubble-pattern: repeating-linear-gradient(135deg, transparent 0 3px, rgba(255,255,255,.14) 4px, transparent 5px 10px);
  --bubble-glow: rgba(255,78,219,.23);
  --bubble-delay: -6.5s;
}
.site-header [data-header-art="prebuilt"] {
  --bubble-foil: conic-gradient(from 185deg at 45% 52%, #77d9f6, #8678e9 28%, #ef89bf 53%, #f6dd83 76%, #77d9f6);
  --bubble-pattern: repeating-linear-gradient(115deg, transparent 0 8px, rgba(255,255,255,.2) 9px 10px, transparent 11px 21px);
  --bubble-glow: rgba(152,119,255,.28);
  --bubble-delay: -7.25s;
}
.site-header [data-header-art="studio"] {
  --bubble-foil: linear-gradient(120deg, #f27eaa, #8861e4 43%, #48c5b6 80%, #f3d878);
  --bubble-pattern: repeating-linear-gradient(145deg, transparent 0 9px, rgba(255,255,255,.2) 10px 11px, transparent 12px 22px);
  --bubble-glow: rgba(242,126,170,.26);
  --bubble-delay: -2.2s;
}
.site-header [data-header-art="build"] {
  --bubble-foil: linear-gradient(120deg, #ff8c79, #e55d91 42%, #8468df 75%, #55c9b2);
  --bubble-pattern: repeating-linear-gradient(35deg, transparent 0 11px, rgba(255,255,255,.18) 12px 13px, transparent 14px 25px);
  --bubble-glow: rgba(255,140,121,.24);
  --bubble-delay: -1.1s;
}
.site-header [data-header-art="analyzer"] {
  --bubble-foil: conic-gradient(from 120deg at 50% 50%, #5ed6bb, #5589e8, #f3c46e, #df78bd, #5ed6bb);
  --bubble-pattern: radial-gradient(circle at 24% 28%, rgba(255,255,255,.72) 0 1px, transparent 2px);
  --bubble-pattern-size: 19px 19px;
  --bubble-glow: rgba(94,214,187,.26);
  --bubble-delay: -4.3s;
}
.site-header [data-header-art="swap"] {
  --bubble-foil: linear-gradient(125deg, #49c9bc, #4a89e3 40%, #b374e5 70%, #f0b56b);
  --bubble-pattern: repeating-linear-gradient(45deg, transparent 0 7px, rgba(255,255,255,.2) 8px 9px, transparent 10px 20px);
  --bubble-glow: rgba(74,137,227,.26);
  --bubble-delay: -5.8s;
}
.site-header [data-header-art="tools"] {
  --bubble-foil: conic-gradient(from 45deg at 72% 48%, #7393ed, #4bd9ce, #fbce83, #f391b6, #7393ed);
  --bubble-pattern: repeating-linear-gradient(165deg, transparent 0 12px, rgba(255,255,255,.22) 13px 14px, transparent 15px 27px);
  --bubble-glow: rgba(75,125,255,.23);
  --bubble-delay: -3s;
}
.site-header [data-header-art="create"] {
  --bubble-foil: linear-gradient(115deg, #ff947e, #eab85c 35%, #e6deab 58%, #6bcbd8 90%);
  --bubble-pattern: repeating-conic-gradient(from 25deg at 0% 0%, transparent 0 17deg, rgba(255,255,255,.19) 18deg 20deg, transparent 21deg 36deg);
  --bubble-glow: rgba(255,148,126,.24);
  --bubble-delay: -1.8s;
}
.site-header [data-header-art="broadcast"] {
  --bubble-foil: linear-gradient(120deg, #3cceb0, #71e491 36%, #dcea72 65%, #4aaed6);
  --bubble-pattern: repeating-linear-gradient(45deg, transparent 0 5px, rgba(255,255,255,.19) 6px 7px, transparent 8px 20px);
  --bubble-glow: rgba(93,255,197,.28);
  --bubble-delay: -4.8s;
}
.site-header [data-header-art="profile"] {
  --bubble-foil: linear-gradient(115deg, #e78fcb, #f6c17b 33%, #8adaad 66%, #9981d8);
  --bubble-pattern: repeating-linear-gradient(125deg, transparent 0 13px, rgba(255,255,255,.27) 14px 15px, transparent 16px 26px);
  --bubble-glow: rgba(255,112,203,.26);
  --bubble-delay: -7s;
}
.site-header .site-nav .nav-graphic-bubble {
  position: relative; isolation: isolate; display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 auto; gap: 6px; width: auto; min-width: 0; height: 44px; min-height: 44px; padding: 0 12px;
  border: 1px solid rgba(255,255,255,.54); border-radius: 999px; overflow: hidden;
  color: #fff; background: linear-gradient(180deg, rgba(255,255,255,.13), rgba(3,5,19,.64)), var(--bubble-pattern), var(--bubble-foil);
  background-size: 100% 100%, var(--bubble-pattern-size, 100% 100%), 100% 100%;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65), inset 0 -5px 12px rgba(3,5,19,.28), 0 3px 0 rgba(0,0,0,.3), 0 0 16px var(--bubble-glow);
  font-size: .77rem; font-weight: 900; letter-spacing: 0; line-height: 1; text-transform: none; white-space: nowrap;
  text-shadow: 0 1px 2px #050615, 0 0 7px rgba(0,0,0,.7); text-decoration: none; animation: none;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.site-header .site-nav .nav-graphic-bubble::before {
  content: ""; position: absolute; inset: -80% -40%; z-index: -1; pointer-events: none;
  background: linear-gradient(110deg, transparent 37%, rgba(255,255,255,.56) 49%, transparent 61%);
  transform: translateX(-85%) rotate(7deg); animation: headerFoilGlint 8s ease-in-out infinite; animation-delay: var(--bubble-delay);
  transition: none;
}
.site-header .site-nav .nav-graphic-bubble::after {
  content: ""; position: absolute; inset: 3px; z-index: -1; height: auto; border: 1px solid rgba(255,255,255,.22);
  border-radius: inherit; background: none; animation: none; pointer-events: none;
}
.site-header .site-nav .nav-graphic-bubble:is(:hover, [aria-current="page"], [aria-expanded="true"]) {
  color: #fff; border-color: #f8ff46; transform: translateY(-1px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7), inset 0 -5px 12px rgba(3,5,19,.2), 0 2px 0 rgba(0,0,0,.3), 0 0 20px var(--bubble-glow);
}
.site-header .site-nav .nav-graphic-bubble:focus-visible { outline: 2px solid #f8ff46; outline-offset: 4px; }
.site-header :is(.nav-card-swap-label, .nav-profile-label, .nav-profile-caret) { font-size: .77rem; letter-spacing: 0; text-shadow: inherit; }
.site-header .nav-card-swap-mark { width: 22px; flex-basis: 22px; }
.site-header .nav-card-swap-spark { display: none; }
.site-header .nav-beta-member { font-size: .55rem; padding: 3px 4px; text-shadow: none; }
.site-header .nav-tools-spark { font-size: .85rem; }
.site-header .nav-shell .menu-toggle { width: 44px; height: 44px; flex: 0 0 44px; border-radius: 50%; padding: 10px; border-color: rgba(255,255,255,.45); background: linear-gradient(150deg, #346795, #4e3b65 55%, #436657); box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 0 15px rgba(56,232,255,.16); }
.site-header .nav-shell .menu-toggle:focus-visible { outline: 2px solid #f8ff46; outline-offset: 3px; }

.site-header .nav-live-dropdown { position: relative; z-index: 220; flex: 0 0 auto; width: 66px; }
.site-header .nav-live-trigger { width: 66px; border: 0; padding: 0; cursor: pointer; font: inherit; }
.site-header .nav-live-star-label { display: inline-flex; align-items: center; justify-content: center; gap: 3px; transform: rotate(-7deg); }
.site-header .nav-live-star-label > span { transform: none; }
.site-header .nav-live-caret { font-size: .48rem; }
.site-header .nav-live-menu {
  position: absolute; z-index: 230; top: calc(100% + 8px); left: 0; width: 238px; display: grid; gap: 7px;
  padding: 10px; border: 1px solid rgba(255,255,255,.38); border-radius: 10px;
  background: rgba(8,10,30,.98); box-shadow: 0 18px 48px rgba(0,0,0,.5); backdrop-filter: blur(18px);
}
.site-header .nav-live-menu[hidden] { display: none !important; }
.site-header .nav-live-menu-link {
  display: flex; align-items: center; justify-content: center; min-height: 46px; padding: 8px 12px;
  border: 1px solid rgba(255,255,255,.5); border-radius: 999px; color: #fff; text-decoration: none;
  background: linear-gradient(110deg,rgba(56,232,255,.19),rgba(159,85,255,.3) 54%,rgba(255,78,219,.2));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.45),0 3px 0 rgba(0,0,0,.32);
  font-size: .74rem; font-weight: 950; line-height: 1.1; text-align: center; text-shadow: 0 1px 2px #050615;
}
.site-header .nav-live-menu-link:hover, .site-header .nav-live-menu-link:focus-visible { border-color: #f8ff46; }
.site-header .nav-live-menu-link:focus-visible { outline: 2px solid #f8ff46; outline-offset: 2px; }
@keyframes headerFoilGlint {
  0%, 68% { transform: translateX(-85%) rotate(7deg); opacity: 0; }
  72% { opacity: .75; }
  95%, 100% { transform: translateX(85%) rotate(7deg); opacity: 0; }
}
@media (min-width: 1201px) {
  .site-header .nav-shell.has-menu-toggle .menu-toggle { display: none; }
  .site-header .nav-shell.has-menu-toggle .site-nav { position: static; display: flex; flex-direction: row; align-items: center; padding: 0; margin-left: auto; border: 0; border-radius: 0; background: none; box-shadow: none; backdrop-filter: none; }
  .site-header .site-nav > a[href="deck-builder.html"],
  .site-header .site-nav > a[href="deck-tools.html"],
  .site-header .site-nav > a[href="deck-analyzer.html"],
  .site-header .site-nav > a[href="deck-swap.html"] { gap: 4px; padding-inline: 8px; font-size: .68rem; }
  .site-header .site-nav > a[href="deck-builder.html"] > span[aria-hidden="true"],
  .site-header .site-nav > a[href="deck-tools.html"] > span[aria-hidden="true"],
  .site-header .site-nav > a[href="deck-analyzer.html"] > span[aria-hidden="true"],
  .site-header .site-nav > a[href="deck-swap.html"] > span[aria-hidden="true"] { display: none; }
  .site-header .nav-shell.has-menu-toggle .site-nav > a.nav-graphic-bubble { width: auto; min-width: 0; }
  .site-header .nav-profile-menu, .site-header .nav-tools-menu { position: absolute; top: calc(100% + 12px); right: auto; inset-inline-end: 0; margin: 0; display: block; opacity: 0; visibility: hidden; transform: translateY(-7px); }
  .site-header .nav-profile-menu { width: 320px; }
  .site-header .nav-tools-menu { width: min(610px, calc(100vw - 28px)); }
  .site-header :is(.nav-profile.is-open .nav-profile-menu, .nav-tools.is-open .nav-tools-menu) { display: block; opacity: 1; visibility: visible; transform: none; }
}
@media (min-width: 1201px) and (max-width: 1400px) {
  .site-header .nav-shell { gap: 8px; }
  .site-header .nav-shell .brand { width: 156px; }
  .site-header .nav-shell .nav-live-star, .site-header .nav-live-dropdown { width: 56px; }
  .site-header .site-nav { gap: 6px; }
  .site-header .site-nav .nav-graphic-bubble { padding-inline: 10px; font-size: .75rem; }
  .site-header :is(.nav-card-swap-label, .nav-profile-label, .nav-profile-caret) { font-size: .75rem; }
  .site-header .site-nav > a[href="deck-builder.html"],
  .site-header .site-nav > a[href="deck-tools.html"],
  .site-header .site-nav > a[href="deck-analyzer.html"],
  .site-header .site-nav > a[href="deck-swap.html"] {
    width: 44px; min-width: 44px; height: 44px; padding: 0; gap: 0; font-size: 1rem;
  }
  .site-header .site-nav > a[href="deck-builder.html"] > span[aria-hidden="true"],
  .site-header .site-nav > a[href="deck-tools.html"] > span[aria-hidden="true"],
  .site-header .site-nav > a[href="deck-analyzer.html"] > span[aria-hidden="true"],
  .site-header .site-nav > a[href="deck-swap.html"] > span[aria-hidden="true"] { display: inline-flex; }
  .site-header .site-nav > a[href="deck-builder.html"] > span:not([aria-hidden="true"]),
  .site-header .site-nav > a[href="deck-tools.html"] > span:not([aria-hidden="true"]),
  .site-header .site-nav > a[href="deck-analyzer.html"] > span:not([aria-hidden="true"]),
  .site-header .site-nav > a[href="deck-swap.html"] > span:not([aria-hidden="true"]) { display: none; }
}
@media (max-width: 1200px) {
  :root { --site-header-height: 73px; }
  .site-header .nav-shell { min-height: 72px; }
  .site-header .nav-shell .brand { width: min(200px, 44vw); }
  .site-header .nav-shell .nav-live-star { width: 52px; }
  .site-header .nav-shell.has-menu-toggle .menu-toggle { display: block; margin-left: auto; }
  .site-header .nav-shell.has-menu-toggle .site-nav { max-height: calc(100dvh - 96px); overflow-y: auto; overscroll-behavior: contain; gap: 10px; }
  .site-header .site-nav > :is(.nav-profile, .nav-tools) { display: grid; width: 100%; }
  .site-header .site-nav > .nav-deck-doctor { display: grid; width: 100%; }
  .site-header .nav-deck-doctor-trigger { width: 100%; justify-content: space-between; }
  .site-header .nav-deck-doctor-menu { position: static; width: 100%; margin-top: 8px; }
  .site-header .site-nav .nav-graphic-bubble { width: 100%; min-height: 46px; height: 46px; }
  .site-header .nav-profile-menu, .site-header .nav-tools-menu { position: static; width: 100%; margin-top: 8px; display: none; opacity: 1; visibility: visible; transform: none; }
  .site-header :is(.nav-profile.is-open .nav-profile-menu, .nav-tools.is-open .nav-tools-menu) { display: block; }
}
@media (prefers-reduced-motion: reduce) {
  .site-header .site-nav .nav-graphic-bubble::before { animation: none; opacity: 0; }
  .site-header .site-nav .nav-graphic-bubble { transition: none; }
}