/* Lord of Sea — mobile experience (≤760px). Loaded last: compact sticky app-style header, slide-down panel, pill nav, bottom-sheet consent. */
@media(max-width:760px){
  :root{--hdr-h:62px;--nav-h:48px}
  html{scroll-padding-top:calc(var(--hdr-h) + 12px)}

  /* header: the bar stays stuck, the pill strip scrolls away on the way down and returns on the way up of the page top */
  .navy-header{display:contents}
  .navy-header .topbar{position:sticky;top:0;z-index:50;box-shadow:0 8px 24px #0009;width:100%;margin:0;max-width:none;box-sizing:border-box;height:auto;min-height:var(--hdr-h);display:flex;flex-wrap:wrap;align-items:center;gap:0 10px;padding:0 12px;background:linear-gradient(#162650,#0f1b3a);border-bottom:1px solid #8aa2d122}
  .navy-header .topbar::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,#dfbd72aa,transparent);opacity:.8;pointer-events:none}

  .navy-header .topbar .brand{position:static;order:1;flex:1 1 auto;min-width:0;max-width:none;height:var(--hdr-h);padding:0;gap:9px;align-items:center}
  .navy-header .topbar .brand img{width:46px;height:42px;filter:drop-shadow(0 3px 6px #0009)}
  .navy-header .topbar .brand .topbar-title{display:flex;flex-direction:column;justify-content:center;font:700 15px/1 'Cinzel',Georgia,serif;letter-spacing:2.2px;color:#ecd59b;text-shadow:0 1px 8px #0008}
  .navy-header .topbar .brand .topbar-title small{margin-top:5px;font:600 6.5px/1 Inter,Arial,sans-serif;letter-spacing:1.5px;color:#8fa3cc;white-space:nowrap}

  /* children of the right cluster take part in the bar's own layout */
  .navy-header .topbar-right{display:contents}
  .navy-header .server-status{display:none}

  .navy-header .top-download{position:static;order:2;flex:0 0 auto;width:auto;min-width:0;height:40px;margin:0;padding:0 13px 0 10px;gap:7px;border-radius:10px;border-width:1px 1px 3px;box-shadow:0 4px 14px #0006,inset 0 1px #fff6;animation:dlGlow 3.2s ease-in-out infinite}
  .navy-header .top-download .download-glyph{font-size:20px}
  .navy-header .top-download small{display:none}
  .navy-header .top-download>span:last-child{font-size:11px;letter-spacing:.3px;line-height:1;white-space:nowrap}
  @keyframes dlGlow{0%,100%{box-shadow:0 4px 14px #0006,inset 0 1px #fff6,0 0 0 0 #5ee38d00}50%{box-shadow:0 4px 14px #0006,inset 0 1px #fff6,0 0 16px 1px #5ee38d55}}

  /* hamburger → animated ✕ */
  .navy-header .topbar .mobile-toggle{position:relative;order:3;flex:0 0 42px;width:42px;height:40px;margin:0;padding:0;font-size:0;color:transparent;background:linear-gradient(#22375f,#16254a);border:1px solid #7d93bf4d;border-radius:10px;box-shadow:inset 0 1px #ffffff12;align-self:center;top:auto;right:auto}
  .navy-header .topbar .mobile-toggle::before,.navy-header .topbar .mobile-toggle::after{content:'';position:absolute;left:12px;right:12px;height:2px;border-radius:2px;background:#e5c985;transition:transform .28s cubic-bezier(.3,.9,.3,1),top .28s,opacity .2s}
  .navy-header .topbar .mobile-toggle::before{top:14px;box-shadow:0 6px #e5c985}
  .navy-header .topbar .mobile-toggle::after{top:26px;width:auto}
  .navy-header.menu-open .topbar .mobile-toggle::before{top:19px;transform:rotate(45deg);box-shadow:none}
  .navy-header.menu-open .topbar .mobile-toggle::after{top:19px;transform:rotate(-45deg)}

  /* slide-down panel (account · language · social) — hidden until the hamburger opens it */
  .navy-header .account-nav,.navy-header .language-menu,.navy-header .header-socials{display:none}
  .navy-header.menu-open .account-nav,.navy-header.menu-open .language-menu,.navy-header.menu-open .header-socials{display:flex;position:static;order:10;flex:0 0 100%;width:100%;max-width:100%;margin:0;animation:panelIn .32s cubic-bezier(.2,.9,.3,1) both}
  .navy-header.menu-open .topbar{max-height:100dvh;overflow-y:auto;overscroll-behavior:contain;padding-bottom:14px;background:linear-gradient(#182b57,#101d3d)}
  .navy-header.menu-open .account-nav{margin-top:6px;gap:10px}
  .navy-header.menu-open .account-nav .auth-button,.navy-header.menu-open .account-nav button{flex:1;width:auto;height:46px;min-height:46px;font-size:13px;border-radius:10px}
  .navy-header.menu-open .account-nav.signed-in{width:100%;max-width:100%}
  .navy-header.menu-open .account-nav.signed-in .captain-chip{height:50px}
  .navy-header.menu-open .language-menu{display:block;margin-top:10px;animation-delay:.05s}
  .navy-header .language-menu summary{height:46px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-radius:10px}
  .navy-header .language-menu #language-options{position:static;width:100%;max-height:none;margin-top:8px;display:grid;grid-template-columns:1fr 1fr;gap:4px;box-shadow:none;border-radius:10px;padding:6px}
  .navy-header .language-menu #language-options button{padding:11px 10px}
  .navy-header.menu-open .header-socials{order:11;justify-content:center;gap:12px;margin-top:12px;padding:12px 0 0;border:0;border-top:1px solid #8aa2d11f;animation-delay:.1s}
  .navy-header .header-socials .header-social{width:44px;height:44px;border-radius:12px}
  .navy-header .header-socials .header-social svg{width:20px;height:20px}
  @keyframes panelIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}

  /* pill navigation strip */
  .navy-header nav{height:var(--nav-h);padding:0 12px;gap:7px;align-items:center;overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap;scroll-snap-type:x proximity;scrollbar-width:none;background:linear-gradient(#0e1a34,#09122a);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12px,#000 calc(100% - 28px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 12px,#000 calc(100% - 28px),transparent 100%)}
  .navy-header nav::-webkit-scrollbar{display:none}
  .navy-header.menu-open nav{height:var(--nav-h);flex-wrap:nowrap;padding:0 12px}
  .navy-header nav a{flex:0 0 auto;scroll-snap-align:center;height:34px;display:inline-flex;align-items:center;padding:0 15px;font-size:12px;font-weight:600;letter-spacing:.2px;white-space:nowrap;border-radius:999px;border:1px solid #7d93bf30;background:#17284b99;color:#bccae4}
  .navy-header nav a.active{background:linear-gradient(#f0d28a,#c79f4f);border-color:#f2da97;color:#1a2440;box-shadow:0 3px 12px #d6b56133,inset 0 1px #fff7}
  .navy-header nav{position:relative;top:auto;left:auto;right:auto;z-index:1}
  .nav-chain{position:relative;display:block;height:12px;margin:-6px 0 0;bottom:auto;background-size:44px 12px;opacity:.9;z-index:2}

  /* touch-friendly, full-width hero actions */
  .navy-hero-actions{flex-direction:column;gap:14px}
  .navy-hero-actions .button{width:100%;min-height:52px;font-size:11px;border-radius:10px}
  .navy-features{gap:8px 14px}

  /* consent: compact bottom sheet instead of a screen-eating card */
  .consent-banner{left:0;right:0;bottom:0;max-width:none;border-radius:18px 18px 0 0;border-width:1px 0 0;padding:16px 16px calc(14px + env(safe-area-inset-bottom));gap:10px;flex-direction:column;align-items:stretch;box-shadow:0 -12px 40px #000a}
  .consent-banner h2{font-size:16px;margin:4px 0 2px}
  .consent-banner .eyebrow{font-size:8px}
  .consent-banner p{font-size:12px;line-height:1.55}
  .consent-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .consent-actions button{min-width:0;min-height:44px;padding:0 8px;border-radius:10px;font-size:12px}
  .consent-actions button:last-child{grid-column:1/-1;order:-1;background:linear-gradient(#f0d28a,#c79f4f);border-color:#f2da97;color:#1a2440}

  /* download dock + generic comfort */
  .download-strip{border-radius:14px}
  .platform-link{min-height:44px}
  .button,.auth-button{touch-action:manipulation}
  main{overflow-x:clip}
}
@media(max-width:370px){
  .navy-header .topbar .brand img{width:40px;height:37px}
  .navy-header .topbar .brand .topbar-title{font-size:13px;letter-spacing:1.6px}
  .navy-header .topbar .brand .topbar-title small{display:none}
  .navy-header .top-download{padding:0 10px 0 8px}
}
@media(max-width:350px){
  .navy-header .topbar{gap:0 8px;padding:0 10px}
  .navy-header .topbar .brand{gap:7px}
  .navy-header .topbar .brand .topbar-title{font-size:12px;letter-spacing:1.2px}
  .navy-header .top-download{width:42px;padding:0;justify-content:center}
  .navy-header .top-download>span:last-child{display:none}
}
@media(prefers-reduced-motion:reduce){.navy-header .top-download{animation:none}.navy-header.menu-open .account-nav,.navy-header.menu-open .language-menu,.navy-header.menu-open .header-socials{animation:none}}