/* v39.3 — common header, clearer artwork and faster first load. */

/* One boundary for every site page, including the contact and commerce pages. */
body.v393.v38 .site-header {
 display:block; position:absolute; z-index:50; inset:12px 4% auto;
 width:92%; max-width:1480px; height:auto; margin:0 auto; padding:0;
 background:transparent; border:0; box-shadow:none; transform:none;
}
body.v393 .site-header .nav-wrap {
 position:relative; display:flex; align-items:center; justify-content:space-between;
 width:100%; max-width:none; height:76px; min-height:76px; margin:0;
 padding:2px 16px; gap:14px; border:1px solid #c6eafb; border-radius:48px;
 background:linear-gradient(180deg,#fffffffc,#f9fdfffa);
 box-shadow:0 4px 12px #13648e18; backdrop-filter:none;
}
body.v393 .site-header .brand {
 display:block; flex:0 0 clamp(174px,14vw,208px); width:clamp(174px,14vw,208px);
 height:auto; margin:0; padding:0; align-self:center;
}
body.v393 .site-header .brand img { border:0; border-radius:0; box-shadow:none; filter:none; }
body.v393 .site-header .main-nav {
 position:static; display:flex; flex:1; align-items:center; justify-content:space-evenly;
 min-width:0; width:auto; max-height:none; gap:2px; margin:0; padding:0;
 background:none; border:0; box-shadow:none; overflow:visible;
}
body.v393 .site-header .main-nav>a {
 display:flex; align-items:center; justify-content:center;
 min-height:44px; margin:0; padding:12px 9px; border:0; border-radius:24px;
 font-family:'Nunito Sans','Trebuchet MS',Arial,sans-serif;
 font-size:14px; line-height:1.2; font-weight:900; letter-spacing:-.015em;
 white-space:nowrap; color:#071c72; background:transparent; box-shadow:none;
 transform:none; transition:background-color .15s;
}
body.v393 .site-header .main-nav>a:hover { background:#eaf8ff; }
body.v393 .site-header .main-nav>a[aria-current="page"] {
 background:linear-gradient(#d0f2ff,#a7e5ff); box-shadow:inset 0 1px 0 #ffffffb3;
}
body.v393 .site-header .nav-actions { display:flex; align-items:center; gap:6px; margin:0; }
body.v393 .site-header .nav-icon,body.v393 .site-header .menu-toggle {
 flex:0 0 44px; width:44px; min-width:44px; height:44px; margin:0; padding:10px;
 border:1px solid #e3f3fc; border-radius:50%; background:#eef9ff; color:#08256c;
}
body.v393 .site-header .nav-icon { display:grid; place-items:center; }
body.v393 .site-header .nav-icon:hover,body.v393 .site-header .menu-toggle:hover { background:#dff4ff; }
body.v393 .site-header .nav-icon svg { width:24px; height:24px; }
body.v393 .site-header .menu-toggle { display:none; }
body.v393 .site-header .nav-cart-v391 [data-cart-count] { top:-5px; right:-5px; min-width:21px; height:21px; }

/* The original contact art is untouched. Only its painted navigation is outside
   this viewport; the shared, accessible header above it owns site navigation. */
body.v393.contact-exact-page {
 background:#90d8f5 url('/assets-v37/images/world-map-clean.webp') center top/100% auto no-repeat;
}
body.v393 .contact-exact-v391 { padding:104px 0 0!important; }
body.v393 .contact-viewport-v393 { overflow:hidden; width:100%; }
body.v393 .contact-artboard-v391 { margin:-7.47608% 0 0; }
body.v393 .contact-email-v392 { font-size:clamp(10px,.85cqw,15px); bottom:5%; }

/* Native clipping follows the outer cyan frame; the card pixels stay original. */
.v393 .integrated-character-v391,
.v393 .character-dialog img.integrated-portrait-v391 {
 border-radius:0;
 clip-path:inset(1.25% 2.3% 1.35% 2.3% round 18% / 13.5%);
}
.v393 .character-dialog img.integrated-portrait-v391 {
 width:min(100%,48.75vh); height:auto; max-height:none; object-fit:contain; justify-self:center;
}
.v393 .integrated-card-v391:focus-visible { outline-offset:-3px; }

/* High-resolution title art is rendered once at its natural aspect ratio. */
body.v393 .characters-hero {
 height:auto; padding:104px 12px 24px!important; display:flex; align-items:center; justify-content:center;
}
.v393 .characters-hero>.title-art-v393 {
 display:block; width:min(780px,88vw); height:auto; max-width:100%; aspect-ratio:2172/724;
 object-fit:contain; filter:none; transform:none; image-rendering:auto;
}
body.v393 .games-heading-v39 { padding:104px 16px 24px!important; }
.v393 .games-heading-v39 img {
 display:block; width:min(510px,80vw); height:auto; max-height:none; aspect-ratio:2172/724;
 object-fit:contain; margin:0 auto; filter:none; transform:none; image-rendering:auto;
}

/* Food Time keeps its supplied frame. These three covers receive a quiet frame. */
.v393 .games-page>.page-backdrop { filter:blur(3px); transform:scale(1.025); opacity:.88; }
.v393 .games-catalog-v39 { width:min(1320px,90%); }
.v393 .game-grid-v39 { gap:28px; align-items:start; }
.v393 .game-cover-v39.framed-game-v393 {
 padding:5px; border:1px solid #fffde9; border-radius:24px;
 background:linear-gradient(145deg,#fffef0,#dfedd5);
 box-shadow:0 2px 0 #52774270,0 8px 22px #173c3b38;
}
.v393 .game-cover-v39.framed-game-v393>img {
 border-radius:18px; width:100%; height:auto; aspect-ratio:auto; object-fit:contain;
 filter:none; opacity:1;
}
.v393 .game-cover-v39.framed-game-v393[href*="tamtam"] {
 background:linear-gradient(145deg,#fff8dd,#eccc95);
}

/* Small social buttons share the site's rounded shape and retain their URLs. */
.v393 .footer-inner-v39>.footer-social-v39 {
 display:flex; flex-direction:column; align-items:stretch; justify-content:center;
 width:172px; gap:9px; grid-column:auto;
}
.v393 .footer-social-v39>a.footer-network-v393 {
 display:flex; align-items:center; justify-content:flex-start; gap:9px;
 min-height:46px; width:100%; padding:10px 13px; border:1px solid #ffffffd9; border-radius:18px;
 color:#fff; font-size:14px; line-height:1.2; font-weight:900;
 box-shadow:inset 0 1px 0 #ffffff40,0 3px 7px #123e3920;
 transition:transform .15s,box-shadow .15s;
}
.v393 .footer-social-v39>a.network-youtube { background:linear-gradient(135deg,#ec364c,#c71326); }
.v393 .footer-social-v39>a.network-instagram { background:linear-gradient(125deg,#823acb,#d62d80 60%,#ed7442); }
.v393 .footer-social-v39>a.network-tiktok { background:linear-gradient(125deg,#12656f,#29273b 65%,#573055); }
.v393 .footer-social-v39>a:hover { color:white; transform:translateY(-2px); box-shadow:0 5px 12px #123e3935; }
.v393 .footer-social-v39 svg { width:22px; height:22px; }
.v393 .social-arrow-v393 { margin-left:auto; opacity:.85; font-size:19px; }

@media(max-width:1200px) {
 body.v393 .site-header .main-nav>a { font-size:13px; padding-inline:6px; }
 body.v393 .site-header .nav-wrap { gap:10px; padding-inline:12px; }
 .v393 .footer-inner-v39>.footer-social-v39 { flex-direction:row; grid-column:1/-1; width:min(530px,100%); margin:auto; gap:10px; }
 .v393 .footer-social-v39>a.footer-network-v393 { flex:1; }
}
@media(max-width:1020px) {
 body.v393.v38 .site-header { inset:12px 4% auto; margin:0; width:92%; }
 body.v393 .site-header .nav-wrap { height:68px; min-height:68px; padding:2px 12px; gap:8px; }
 body.v393 .site-header .brand { flex-basis:180px; width:180px; }
 body.v393 .site-header .nav-actions { margin-left:auto; }
 body.v393 .site-header .menu-toggle {
  display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px;
 }
 body.v393 .site-header .menu-toggle span { width:21px; height:2px; margin:0; background:currentColor; border-radius:3px; }
 body.v393 .site-header .main-nav {
  display:none; position:absolute; inset:calc(100% + 10px) 0 auto; width:100%;
  max-height:calc(100dvh - 104px); overflow-y:auto; padding:12px; border:1px solid #c6eafb;
  border-radius:24px; background:#fffffff7; box-shadow:0 10px 24px #174c6726;
 }
 body.v393 .site-header .main-nav.open { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
 body.v393 .site-header .main-nav>a { min-height:46px; padding:12px 8px; font-size:14px; }
 body.v393 .contact-exact-v391 { padding-top:96px!important; }
 .v393 .contact-access-v391 { background:#f1fbf6e8; }
 .v393 .contact-access-v391>nav { gap:12px; max-width:680px; margin:auto; }
 .v393 .contact-access-v391 a.contact-channel-v393 {
  display:flex; flex:1 1 100%; flex-direction:row; align-items:center; text-align:left;
  min-height:84px; padding:14px 18px; gap:14px; border:1px solid #c1e8ff;
  border-radius:22px; background:linear-gradient(120deg,#eaf8ff,#d8f0ff); color:#072771;
 }
 .v393 .contact-access-v391 a.contact-channel-1 { background:linear-gradient(120deg,#ecfbef,#def5ec); border-color:#c2eddb; }
 .v393 .contact-access-v391 a.contact-channel-2 { background:linear-gradient(120deg,#f5f0ff,#e9dfff); border-color:#decefa; }
 .v393 .contact-channel-icon-v393 {
  display:grid; place-items:center; flex:0 0 48px; height:48px; border-radius:50%;
  color:white; background:linear-gradient(#388dff,#1250d6); box-shadow:inset 0 2px 0 #fff6;
 }
 .v393 .contact-channel-1 .contact-channel-icon-v393 { background:linear-gradient(#54c550,#179846); }
 .v393 .contact-channel-2 .contact-channel-icon-v393 { background:linear-gradient(#a653ed,#7024c8); }
 .v393 .contact-channel-icon-v393 svg { width:27px; height:27px; }
 .v393 .contact-channel-copy-v393 { display:grid; flex:1; gap:3px; min-width:0; }
 .v393 .contact-channel-copy-v393 strong { font-size:18px; }
 .v393 .contact-channel-copy-v393 small { color:#153b78; font-size:15px; text-decoration:underline; text-underline-offset:3px; overflow-wrap:anywhere; }
 .v393 .contact-access-v391>.contact-zoom-v391 { min-height:44px; max-width:680px; margin:0 auto 16px; border:1px solid #bbdceb; font-size:14px; box-shadow:none; }
}
@media(max-width:760px) {
 body.v393.v38 .site-header { inset:10px 3% auto; width:94%; }
 body.v393 .site-header .nav-wrap { height:64px; min-height:64px; padding:2px 9px; gap:5px; }
 body.v393 .site-header .brand { flex-basis:150px; width:150px; }
 body.v393 .site-header .nav-actions { gap:3px; }
 body.v393 .characters-hero { padding:92px 10px 20px!important; }
 .v393 .characters-hero>.title-art-v393 { width:min(690px,94vw); }
 body.v393 .games-heading-v39 { padding:92px 12px 20px!important; }
 .v393 .games-catalog-v39 { width:calc(100% - 30px); }
 .v393 .game-grid-v39 { gap:22px; }
 .v393 .game-cover-v39.framed-game-v393 { padding:4px; border-radius:21px; }
 .v393 .game-cover-v39.framed-game-v393>img { border-radius:16px; }
 .v393 .character-dialog img.integrated-portrait-v391 { width:min(100%,30vh); max-height:none; }
 .v393 .footer-inner-v39>.footer-social-v39 { flex-direction:column; width:min(300px,100%); gap:9px; }
 .v393 .footer-social-v39>a.footer-network-v393 { padding:12px 17px; min-height:48px; }
 body.v393 .contact-exact-v391 { padding-top:88px!important; }
}
@media(max-width:540px) {
 body.v393 .site-header .main-nav.open { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:355px) {
 body.v393 .site-header .brand { width:130px; flex-basis:130px; }
 body.v393 .site-header .nav-wrap { padding-inline:6px; gap:3px; }
 body.v393 .site-header .nav-actions { gap:1px; }
 .v393 .contact-access-v391 a.contact-channel-v393 { gap:10px; padding:12px; }
 .v393 .contact-channel-copy-v393 strong { font-size:17px; }
}
@media(prefers-reduced-motion:reduce) {
 .v393 .footer-social-v39>a:hover { transform:none; }
}