/* Shared public navigation, independent of live chat and admin controls. */
body:is(.site-navigation,.site-home) { overflow-y: visible; }
body:is(.site-navigation,.site-home) .home-masthead {
  position: sticky; top: 0; z-index: 2147483000;
  background: #ffffffed; border-bottom: 1px solid #dce6f0;
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
}
body:is(.site-navigation,.site-home) .home-header-inner { display:flex; align-items:center; gap:28px; width:min(1160px,calc(100% - 64px)); min-height:84px; margin:auto; }
body:is(.site-navigation,.site-home) .home-header-inner #logo { flex:0 1 220px; width:220px; max-width:220px; margin-right:auto; }
body:is(.site-navigation,.site-home) .home-header-inner #logo img { width:220px; }
body:is(.site-navigation,.site-home) .home-desktop-nav { display:flex; gap:4px; align-items:center; }
body:is(.site-navigation,.site-home) .home-desktop-nav a { display:flex; align-items:center; min-height:44px; padding:0 12px; border-radius:10px; font-size:13px; font-weight:500; text-decoration:none; color:#40566e; white-space:nowrap; }
body:is(.site-navigation,.site-home) .home-desktop-nav a:hover { color:#006ad1; background:#edf5ff; }
body:is(.site-navigation,.site-home) .home-header-actions { gap:8px; }
body:is(.site-navigation,.site-home) .home-account-shortcut { display:flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:12px; color:#40566e; }
body:is(.site-navigation,.site-home) .home-account-shortcut:hover { background:#edf5ff; color:#006ad1; }
body:is(.site-navigation,.site-home) .home-account-shortcut > span { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
body:is(.site-navigation,.site-home).ow-buttons :is(.home-menu-trigger,.home-menu-close,.home-feedback-link) {
  --ow-button-fill:#f3f7fc; --ow-button-hover:#e8f2ff; --ow-button-shadow:none;
  color:#254762 !important; border:1px solid #dce6f0 !important;
  display:inline-flex; align-items:center; justify-content:center; gap:8px; cursor:pointer;
  font-family:inherit; font-weight:500; font-size:13px; line-height:1.2; padding:0 14px; min-height:44px;
}
body:is(.site-navigation,.site-home) .home-menu-trigger { min-width:92px; }
body:is(.site-navigation,.site-home) .home-menu-trigger[aria-expanded="true"] { --ow-button-fill:#e8f2ff; border-color:#a8cbed !important; }
body:is(.site-navigation,.site-home) :is(.home-menu-trigger,.home-menu-close,.home-account-shortcut,.home-feedback-link) svg { width:20px; height:20px; flex-shrink:0; }
body:is(.site-navigation,.site-home) dialog.home-menu {
  position:fixed; inset:12px 12px 12px auto; margin:0; width:min(420px,calc(100vw - 24px));
  height:calc(100dvh - 24px); max-height:none; max-width:none; padding:0;
  border:1px solid #dce6f0; border-radius:24px; background:#fff; color:#142e48;
  box-shadow:0 20px 80px #142e4833; overflow-y:auto; overscroll-behavior:contain;
  opacity:0; transform:translateX(calc(100% + 24px));
  transition:transform 300ms cubic-bezier(.22,.68,0,1),opacity 220ms ease;
}
body:is(.site-navigation,.site-home) dialog.home-menu[open] { display:flex; flex-direction:column; }
body:is(.site-navigation,.site-home) dialog.home-menu.is-open { opacity:1; transform:translateX(0); }
body:is(.site-navigation,.site-home) dialog.home-menu::backdrop { background:#112c4655; opacity:0; transition:opacity 220ms ease; }
body:is(.site-navigation,.site-home) dialog.home-menu.is-open::backdrop { opacity:1; }
body:is(.site-navigation,.site-home) .home-menu-heading { order:0; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:26px 24px 20px; flex-shrink:0; }
body:is(.site-navigation,.site-home) .home-nav-eyebrow { margin:0 0 7px; color:#176cba; text-transform:uppercase; letter-spacing:.12em; font-size:10px; line-height:1.5; font-weight:700; }
body:is(.site-navigation,.site-home) #home-menu-title { margin:0; font-size:27px; letter-spacing:-.035em; }
body:is(.site-navigation,.site-home) .home-menu-close { flex:0 0 44px; padding:0; border-radius:50% !important; }
body:is(.site-navigation,.site-home) .home-menu-body { order:1; padding:0 24px; }
body:is(.site-navigation,.site-home) .home-menu-modes { display:grid; gap:10px; }
body:is(.site-navigation,.site-home) .home-mode-link { display:flex; align-items:center; gap:14px; padding:17px; border-radius:15px; background:var(--ow-button-fill,linear-gradient(180deg,#299cff,#0079f0)); color:#fff; text-decoration:none; box-shadow:0 5px 12px #017ffe24; }
body:is(.site-navigation,.site-home) .home-mode-link:hover { background:linear-gradient(180deg,#168ff6,#006bdc); }
body:is(.site-navigation,.site-home) .home-mode-link > svg { width:25px; height:25px; flex-shrink:0; }
body:is(.site-navigation,.site-home) .home-mode-link > svg:last-child { margin-left:auto; width:19px; height:19px; }
body:is(.site-navigation,.site-home) .home-mode-link strong { display:block; color:inherit; font-size:16px; line-height:1.3; }
body:is(.site-navigation,.site-home) .home-mode-link small { display:block; margin-top:4px; color:#e7f3ff; font-size:12px; line-height:1.3; }
body:is(.site-navigation,.site-home) .home-menu-note { margin:13px 0 20px; font-size:11px; text-align:center; color:#61758b; }
body:is(.site-navigation,.site-home) .home-menu-links { display:grid; border-top:1px solid #e7edf5; }
body:is(.site-navigation,.site-home) .home-menu-links a { display:flex; align-items:center; gap:14px; padding:14px 8px; border-bottom:1px solid #e7edf5; text-decoration:none; color:#29465f; }
body:is(.site-navigation,.site-home) .home-menu-links a:hover { color:#0968c7; background:#f5f9ff; }
body:is(.site-navigation,.site-home) .home-menu-links svg { width:21px; height:21px; flex-shrink:0; color:#3682c6; }
body:is(.site-navigation,.site-home) .home-menu-links svg:last-child { width:16px; height:16px; margin-left:auto; color:#8295a8; }
body:is(.site-navigation,.site-home) .home-menu-links strong { display:block; font-size:14px; line-height:1.4; }
body:is(.site-navigation,.site-home) .home-menu-links small { display:block; margin-top:2px; color:#6d8093; font-size:11px; line-height:1.4; }
body:is(.site-navigation,.site-home) .home-menu-more { margin:12px 0 8px; }
body:is(.site-navigation,.site-home) .home-menu-more summary { display:flex; align-items:center; justify-content:space-between; min-height:44px; padding:8px; font-size:12px; color:#526d84; cursor:pointer; list-style:none; }
body:is(.site-navigation,.site-home) .home-menu-more summary::-webkit-details-marker { display:none; }
body:is(.site-navigation,.site-home) .home-menu-more summary span { font-size:20px; }
body:is(.site-navigation,.site-home) .home-menu-more[open] summary span { transform:rotate(45deg); }
body:is(.site-navigation,.site-home) .home-menu-more nav { display:grid; padding:0 8px 10px; }
body:is(.site-navigation,.site-home) .home-menu-more a { font-size:12px; min-height:40px; display:flex; align-items:center; text-decoration:none; }
body:is(.site-navigation,.site-home).index-page #accordion > .omegle-i18n-mobile-nav { order:2; display:block !important; margin:8px 24px 0; flex-shrink:0; position:relative; padding:0; border:0; z-index:1; }
body:is(.site-navigation,.site-home).index-page #accordion .omegle-i18n-toggle { display:flex; width:100%; height:44px; padding:0 12px; gap:10px; justify-content:flex-start; }
body:is(.site-navigation,.site-home).index-page #accordion :is(.omegle-i18n-label,.omegle-i18n-code,.omegle-i18n-caret) { display:inline; }
body:is(.site-navigation,.site-home).index-page #accordion .omegle-i18n-code { margin-left:auto; font-size:12px; }
body:is(.site-navigation,.site-home).index-page #accordion .omegle-i18n-menu { position:relative; inset:auto; width:100%; max-height:240px; margin-top:8px; overflow-y:auto; box-shadow:none; }
body:is(.site-navigation,.site-home) .home-menu-footer { order:3; padding:18px 24px 24px; margin-top:auto; flex-shrink:0; }
body:is(.site-navigation,.site-home) .home-feedback-link { width:100%; font-size:12px; --ow-button-fill:#fff; }
body:is(.site-navigation,.site-home) .home-menu-footer nav { display:flex; gap:16px; flex-wrap:wrap; margin-top:10px; }
body:is(.site-navigation,.site-home) .home-menu-footer nav a { display:inline-flex; align-items:center; min-height:36px; font-size:11px; color:#60778c; text-decoration:none; }
body:is(.site-navigation,.site-home) .home-menu-footer p { margin:4px 0 0; font-size:10px; line-height:1.5; color:#72869a; }
@media(max-width:1050px) { body:is(.site-navigation,.site-home) .home-header-inner { gap:12px; } body:is(.site-navigation,.site-home) .home-desktop-nav a { padding:0 8px; } body:is(.site-navigation,.site-home) .home-header-inner #logo { flex-basis:190px; } }
@media(max-width:900px) { body:is(.site-navigation,.site-home) .home-desktop-nav { display:none; } }
@media(max-width:640px) {
  body:is(.site-navigation,.site-home) .home-header-inner { width:calc(100% - 32px); min-height:70px; gap:12px; }
  body:is(.site-navigation,.site-home) .home-header-inner #logo { flex-basis:180px; max-width:180px; }
  body:is(.site-navigation,.site-home) .home-header-actions { gap:4px; }
  body:is(.site-navigation,.site-home) .home-header-actions > .omegle-i18n-desktop { display:none !important; }
  body:is(.site-navigation,.site-home) .home-menu-trigger { min-width:72px; padding:0 10px; gap:6px; font-size:12px; }
  body:is(.site-navigation,.site-home) .home-account-shortcut { width:38px; }
  body:is(.site-navigation,.site-home) dialog.home-menu { inset:8px 8px 8px auto; width:calc(100vw - 16px); max-width:380px; height:calc(100dvh - 16px); border-radius:20px; }
  body:is(.site-navigation,.site-home) .home-menu-heading { padding:22px 20px 18px; }
  body:is(.site-navigation,.site-home) .home-menu-body { padding:0 20px; }
  body:is(.site-navigation,.site-home).index-page #accordion > .omegle-i18n-mobile-nav { margin-inline:20px; }
  body:is(.site-navigation,.site-home) .home-menu-footer { padding:16px 20px calc(20px + env(safe-area-inset-bottom,0px)); }
}
@media(prefers-reduced-motion:reduce) { body:is(.site-navigation,.site-home) dialog.home-menu,body:is(.site-navigation,.site-home) dialog.home-menu::backdrop { transition:none; } }

body:is(.site-navigation,.site-home).ow-buttons :is(.home-menu-trigger,.home-menu-close,.home-feedback-link) :is(svg,span) { color:#254762 !important; }

/* Standalone header primitives also work on account and checkpoint templates. */
body:is(.site-navigation,.site-home) .home-masthead, body:is(.site-navigation,.site-home) .home-menu { font-family:Roboto,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; text-align:left; }
body:is(.site-navigation,.site-home) :is(.home-masthead,.home-menu) *, body:is(.site-navigation,.site-home) :is(.home-masthead,.home-menu) { box-sizing:border-box; }
body:is(.site-navigation,.site-home) .home-masthead { width:100%; flex-shrink:0; }
body:is(.site-navigation,.site-home) .home-header-inner #logo { display:flex; align-items:center; min-width:0; padding:0; height:auto; background:none; border:0; box-shadow:none; transform:none; }
body:is(.site-navigation,.site-home) .home-header-inner #logo img { display:block; max-width:100%; height:auto; max-height:none; aspect-ratio:331/57; object-fit:contain; }
body:is(.site-navigation,.site-home) .home-header-actions { display:flex; align-items:center; flex-shrink:0; margin:0; }
body:is(.site-navigation,.site-home) .home-menu h2 { color:#142e48; line-height:1.2; font-weight:700; }
body:is(.site-navigation,.site-home) .home-menu a { text-underline-offset:3px; }
body:is(.site-navigation,.site-home) .home-menu-more a { color:#0968c7; }
body:is(.site-navigation,.site-home) .home-desktop-nav a[aria-current="page"],body:is(.site-navigation,.site-home) .home-menu-links a[aria-current="page"] { color:#006ad1; background:#edf5ff; }
body:is(.site-navigation,.site-home) :is(.home-masthead,.home-menu) :is(a,button,summary):focus-visible { outline:3px solid #ff9b32; outline-offset:3px; }
body:is(.site-navigation,.site-home) #feedback-fab { display:none!important; }
body:is(.site-navigation,.site-home).account-embedded .home-masthead { display:none!important; }
body:is(.site-navigation,.site-home) .home-menu-trigger { border-radius:12px!important; }
body:is(.site-navigation,.site-home) .home-feedback-link { border-radius:12px!important; }

/* A slim scrollbar inside the menu; native scrolling and touch gestures stay intact. */
body:is(.site-navigation,.site-home) dialog.home-menu {
  scrollbar-width:thin;
  scrollbar-color:#b7cadc transparent;
  scrollbar-gutter:stable;
}
body:is(.site-navigation,.site-home) dialog.home-menu:hover { scrollbar-color:#8faac3 transparent; }
body:is(.site-navigation,.site-home) dialog.home-menu::-webkit-scrollbar { width:8px; height:8px; }
body:is(.site-navigation,.site-home) dialog.home-menu::-webkit-scrollbar-track { background:transparent; margin-block:20px; }
body:is(.site-navigation,.site-home) dialog.home-menu::-webkit-scrollbar-thumb { min-height:40px; border:2px solid #fff; border-radius:20px; background:#b7cadc; background-clip:padding-box; }
body:is(.site-navigation,.site-home) dialog.home-menu::-webkit-scrollbar-thumb:hover { background-color:#8faac3; }
body:is(.site-navigation,.site-home) dialog.home-menu::-webkit-scrollbar-corner { background:transparent; }