/* KREVIXA v2.3 - top menu is part of the Sauvage hero, not a separate black rail.
   This is intentionally a presentation-only layer; auth, checkout and AI code stay intact. */
:root{--kv-electric:#a22af9;--kv-cyan:#5273ff;--kv-glass:rgba(19,9,51,.25)}
/* Keep the source layout and remove the visual separator only when Home is shown. */
body:has(#homePage:not(.hidden)) .topbar{
 background:transparent!important;
 border:0!important;border-bottom:0!important;box-shadow:none!important;
 outline:0!important;
 isolation:isolate;
}
body:has(#homePage:not(.hidden)) .topbar::before{
 content:"";pointer-events:none;position:absolute;inset:0;z-index:-1;
 background:linear-gradient(180deg,rgba(6,2,24,.48) 0%,rgba(6,2,24,.10) 72%,transparent 100%);
}
body:has(#homePage:not(.hidden)) .topbar::after{display:none!important}
body:has(#homePage:not(.hidden)) .desktop-brand{
 text-decoration:none!important;filter:drop-shadow(0 2px 14px rgba(138,42,244,.38))
}
body:has(#homePage:not(.hidden)) .desktop-brand span{text-shadow:0 2px 18px #b96aff8c}
@media(min-width:901px){
 body:has(#homePage:not(.hidden)) .topbar{height:80px!important;min-height:80px!important;z-index:50!important;position:relative!important}
 /* Hero background starts at the very top behind the navigation. */
 body:has(#homePage:not(.hidden)) #homePage .neon-hero{margin-top:-80px!important;padding-top:80px!important}
 body:has(#homePage:not(.hidden)) .top-nav-shortcuts{
  display:flex!important;align-items:center!important;justify-content:center!important;
  flex:1 1 auto!important;gap:clamp(2px,.65vw,12px)!important;
  background:linear-gradient(95deg,rgba(40,14,85,.18),rgba(16,8,42,.12),rgba(39,15,76,.16))!important;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  border:1px solid rgba(194,124,255,.13);border-radius:999px;
  padding:5px!important;max-width:690px;
 }
 body:has(#homePage:not(.hidden)) .top-nav-shortcuts button{
  position:relative!important;isolation:isolate;display:inline-flex!important;
  justify-content:center;align-items:center;min-height:38px!important;
  color:#e2d8fc!important;text-shadow:0 1px 9px rgba(2,0,14,.9)!important;
  padding:9px clamp(8px,1.1vw,17px)!important;font-size:clamp(11px,.89vw,14px)!important;
  font-weight:600!important;background:transparent!important;
  border:none!important;border-radius:999px!important;
  transition:color .2s ease,transform .2s ease,background .2s ease,box-shadow .2s ease!important;
 }
 body:has(#homePage:not(.hidden)) .top-nav-shortcuts button:first-child{font-weight:600!important;text-shadow:0 1px 9px rgba(2,0,14,.9)!important}
 body:has(#homePage:not(.hidden)) .top-nav-shortcuts button:hover,
 body:has(#homePage:not(.hidden)) .top-nav-shortcuts button:focus-visible{
  color:#fff!important;background:linear-gradient(125deg,rgba(151,41,254,.33),rgba(80,74,246,.22))!important;
  box-shadow:inset 0 0 0 1px #d7a3ff68,0 0 16px rgba(141,44,241,.25)!important;
  transform:translateY(-1px);
 }
 body:has(#homePage:not(.hidden)) .top-nav-shortcuts button.is-current,
 body:has(#homePage:not(.hidden)) .top-nav-shortcuts button[aria-current="page"]{
  background:linear-gradient(115deg,rgba(157,42,252,.33),rgba(79,49,190,.24))!important;
  box-shadow:inset 0 0 0 1px rgba(195,135,255,.30),0 0 16px rgba(159,39,252,.20)!important;
  color:#fff!important;
 }
 body:has(#homePage:not(.hidden)) .top-nav-shortcuts button.is-current::after,
 body:has(#homePage:not(.hidden)) .top-nav-shortcuts button[aria-current="page"]::after{
  content:"";position:absolute;bottom:2px;left:25%;right:25%;height:2px;
  background:#d187ff;box-shadow:0 0 9px #bb54ff,0 0 15px #7b28ff;
  border-radius:5px;pointer-events:none;
 }
 body:has(#homePage:not(.hidden)) .top-actions #topUpgrade{
  border:1px solid rgba(198,151,255,.36)!important;
  box-shadow:0 0 25px rgba(157,40,255,.40)!important;
  transition:transform .2s,box-shadow .2s!important;
 }
 body:has(#homePage:not(.hidden)) .top-actions #topUpgrade:hover{transform:translateY(-2px);box-shadow:0 0 32px rgba(157,40,255,.65)!important}
 /* No white rail when opening the side navigation; page shrinks instead of sitting under it. */
 body.desktop-drawer-open .sidebar{border-right:1px solid rgba(155,71,255,.26)!important}
 .topbar .top-nav-shortcuts button:focus-visible{outline:2px solid #b974ff!important;outline-offset:3px}
}
/* Narrow desktop screens: compact floating menu instead of text overflow. */
@media(min-width:901px) and (max-width:1180px){
 body:has(#homePage:not(.hidden)) .topbar{padding:0 2.2vw!important;gap:10px!important}
 body:has(#homePage:not(.hidden)) .desktop-brand img{width:35px!important;height:35px!important}
 body:has(#homePage:not(.hidden)) .desktop-brand span{font-size:17px!important}
 body:has(#homePage:not(.hidden)) .top-nav-shortcuts{gap:1px!important;padding:3px!important}
 body:has(#homePage:not(.hidden)) .top-nav-shortcuts button{padding:8px 7px!important;font-size:11px!important;min-height:36px!important}
 body:has(#homePage:not(.hidden)) .top-actions #topUpgrade{padding:10px!important;font-size:11px!important}
 body:has(#homePage:not(.hidden)) .top-actions .avatar{width:35px!important;height:35px!important}
}
/* Phone and tablet: logo/menu/account float over the SAME photo, no disconnected dark ribbon. */
@media(max-width:900px){
 body:has(#homePage:not(.hidden)) .topbar{
  height:68px!important;min-height:68px!important;
  position:relative!important;z-index:50!important;overflow:visible!important;
  background:transparent!important;border:0!important;border-bottom:0!important;
  box-shadow:none!important;padding:0 14px!important;
 }
 body:has(#homePage:not(.hidden)) .topbar::before{
  background:linear-gradient(180deg,rgba(7,2,27,.68),rgba(9,4,37,.04))!important;
 }
 body:has(#homePage:not(.hidden)) #homePage .neon-hero{
  margin-top:-68px!important;padding-top:68px!important;
  overflow:hidden!important;
 }
 body:has(#homePage:not(.hidden)) .header-mobile-brand{
  color:#fff!important;text-shadow:0 1px 15px #752ef9c2;
 }
 body:has(#homePage:not(.hidden)) .topbar .mobile-menu-toggle{
  background:linear-gradient(135deg,rgba(148,29,249,.66),rgba(54,35,133,.53))!important;
  border:1px solid rgba(213,166,255,.62)!important;
  box-shadow:inset 0 0 14px rgba(119,35,236,.23),0 0 18px rgba(140,46,254,.36)!important;
  backdrop-filter:blur(8px);
 }
 body:has(#homePage:not(.hidden)) .topbar .top-actions .avatar{
  background:rgba(17,7,47,.50)!important;border:1px solid rgba(205,147,255,.76)!important;
  box-shadow:0 0 17px rgba(116,47,229,.28)!important;
  backdrop-filter:blur(7px);
 }
 body:has(#homePage:not(.hidden)) #homePage .hero-static-image{object-position:50% 25%!important}
 body:has(#homePage:not(.hidden)) #homePage .hero-intro{min-height:590px!important;padding:180px 20px 29px!important}
 /* Keep card text readable and image background visible without clipping below the hero. */
 #homePage .neon-features{margin-top:10px!important}
}
@media(max-width:370px){
 body:has(#homePage:not(.hidden)) #homePage .hero-intro{min-height:610px!important;padding:186px 15px 25px!important}
}
@media(prefers-reduced-motion:reduce){
 .top-nav-shortcuts button,.top-actions #topUpgrade{transition:none!important;transform:none!important}
}

/* Distinct current section on interior pages too, not Home highlighted everywhere. */
@media(min-width:901px){
 body:not(:has(#homePage:not(.hidden))) .top-nav-shortcuts button:first-child{color:#e0d5fb!important;font-weight:600!important;text-shadow:none!important}
 body:not(:has(#homePage:not(.hidden))) .top-nav-shortcuts button.is-current{color:#fff!important;background:linear-gradient(125deg,#6228b8aa,#24207f83)!important;border-radius:999px!important;box-shadow:inset 0 0 0 1px #ae71ef8c,0 0 13px #8d31f15a!important;padding-left:12px!important;padding-right:12px!important}
}