/* VIENNA v176 — final black-mode authority and auth/banner polish. */
:root{--vb-bg:#171512;--vb-surface:#211E1B;--vb-surface-2:#27231F;--vb-surface-3:#302B27;--vb-text:#FFFBF2;--vb-muted:#D5CBC4;--vb-muted-2:#B9AEA7;--vb-line:rgba(255,251,242,.11);--vb-orange:#F59A62;--vb-orange-2:#FFC39B;--vb-orange-3:#D9703F}

/* Brand banner: use the exact supplied 2048×682 artwork but crop its built-in whitespace in CSS. */
.vienna-auth-banner-link{display:block!important;width:min(100%,570px)!important;text-decoration:none!important}
.vienna-auth-banner-frame{position:relative!important;display:block!important;width:min(100%,560px)!important;aspect-ratio:5.06/1!important;overflow:hidden!important;border-radius:20px!important;background:#fff!important;border:1px solid rgba(112,104,97,.10)!important;box-shadow:0 14px 38px rgba(74,51,36,.11)!important;isolation:isolate!important}
.vienna-auth-banner-frame .vienna-auth-banner{position:absolute!important;left:50%!important;top:50%!important;width:123.7%!important;height:auto!important;max-width:none!important;max-height:none!important;transform:translate(-50%,-50%)!important;display:block!important;image-rendering:auto!important;filter:none!important;object-fit:initial!important}
.vienna-auth-banner--compact .vienna-auth-banner-frame,.vienna-auth-banner-frame.compact{width:min(100%,465px)!important}
.vienna-auth-tagline{margin:10px 0 0!important;color:#706861!important;font-size:12px!important;font-weight:720!important;line-height:1.3!important;letter-spacing:-.12px!important}
@media(max-width:760px){.vienna-auth-banner-link{width:min(100%,380px)!important}.vienna-auth-banner-frame{width:min(100%,360px)!important;border-radius:17px!important}.vienna-auth-tagline{font-size:10.5px!important;margin-top:7px!important}}
@media(max-width:370px){.vienna-auth-banner-link{width:min(100%,330px)!important}.vienna-auth-banner-frame{width:min(100%,316px)!important}}

/* Black mode must paint before and across every normal page. */
html[data-rairo-theme="black"]{background:var(--vb-bg)!important;color-scheme:dark!important}
html[data-rairo-theme="black"] body{background:var(--vb-bg)!important;color:var(--vb-text)!important}
html[data-rairo-theme="black"] body:before{background:radial-gradient(circle at 18% -10%,rgba(245,154,98,.055),transparent 28%),radial-gradient(circle at 88% 8%,rgba(255,195,155,.025),transparent 24%)!important}
html[data-rairo-theme="black"] :is(.page,.section,.auth-wrap,.onboard,.rairo-entry){background:var(--vb-bg)!important;color:var(--vb-text)!important}
html[data-rairo-theme="black"] :is(.topbar,.mobile-dock){background:rgba(23,21,18,.96)!important;border-color:var(--vb-line)!important;color:var(--vb-text)!important;box-shadow:0 12px 34px rgba(0,0,0,.24)!important}
html[data-rairo-theme="black"] footer{background:var(--vb-bg)!important;border-color:var(--vb-line)!important;color:var(--vb-muted)!important}
html[data-rairo-theme="black"] :is(.navlinks a,.navlinks button.navbtn,.nav-actions .tiny){color:var(--vb-muted)!important}
html[data-rairo-theme="black"] :is(.navlinks a:hover,.navlinks button.navbtn:hover,.navlinks a.active){background:var(--vb-surface-2)!important;color:var(--vb-text)!important}
html[data-rairo-theme="black"] :is(.page-title,.title,.section-title,h1,h2,h3,h4,h5,h6,strong,b,summary,label){color:var(--vb-text)!important}
html[data-rairo-theme="black"] :is(.page-subtitle,.subtitle,.muted,.tiny,p,small){color:var(--vb-muted)!important}
html[data-rairo-theme="black"] :is(.eyebrow,[class*="eyebrow"],[class*="kicker"]){color:var(--vb-orange-2)!important}

/* General surfaces/forms used by content pages. */
html[data-rairo-theme="black"] :is(.panel,.card,.kpi,.alert-card,.auth-card,.invite-card,.faq-hero,.faq details,.notif,.users-surface,.flash){background:var(--vb-surface)!important;color:var(--vb-text)!important;border-color:var(--vb-line)!important;box-shadow:0 14px 42px rgba(0,0,0,.20)!important}
html[data-rairo-theme="black"] :is(.panel-head,.panel-body,.card-body,.section,.table-wrap){border-color:var(--vb-line)!important;color:var(--vb-text)!important}
html[data-rairo-theme="black"] :is(.input,.select,.textarea,input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea){background:var(--vb-surface-2)!important;color:var(--vb-text)!important;border-color:var(--vb-line)!important}
html[data-rairo-theme="black"] :is(.input,.select,.textarea,input,textarea)::placeholder{color:#AFA49D!important}
html[data-rairo-theme="black"] table{color:var(--vb-text)!important}
html[data-rairo-theme="black"] :is(.table th,.table td,thead,tbody,tr){border-color:var(--vb-line)!important}
html[data-rairo-theme="black"] .table tr:hover td{background:rgba(255,251,242,.025)!important}
html[data-rairo-theme="black"] :is(.badge,.pill,.chip){border-color:var(--vb-line)!important}
html[data-rairo-theme="black"] .btn:not(.btn-primary){background:var(--vb-surface-2)!important;color:var(--vb-text)!important;border-color:var(--vb-line)!important}
html[data-rairo-theme="black"] .btn-primary{color:#fff!important}

/* Map UI: the account/profile drawer and its profile section were being repainted white by older CSS. */
html[data-rairo-theme="black"] .ws-app{background:var(--vb-bg)!important;color:var(--vb-text)!important}
html[data-rairo-theme="black"] .ws-app :is(.account-drawer,.safety-drawer,.prefs-drawer,.quick-alert-card,.search-results,.destination-confirm,.sheet#planSheet,.sheet,.route-card,.guest-limit-card,.resume-trip-card,.nav-panel.nav-minimal,.nav-voice-popover,.traffic-radar,.route-loading-card){background:rgba(33,30,27,.975)!important;color:var(--vb-text)!important;border-color:var(--vb-line)!important;box-shadow:0 18px 50px rgba(0,0,0,.32)!important}
html[data-rairo-theme="black"] .ws-app :is(.drawer-user,.drawer-link,.drawer-profile,.safety-tool,.pref-row,.quick-alert-grid button,.parking-item,.planner-preset,.nearby-service,.search-item,.search-suggestion,.location-row,.segment button,.travel button,.preview-actions .sub-action){background:var(--vb-surface-2)!important;color:var(--vb-text)!important;border-color:var(--vb-line)!important}
html[data-rairo-theme="black"] .ws-app :is(.drawer-user b,.drawer-profile,.drawer-link,.drawer-link span,.drawer-link em,.drawer-link i,.safety-tool,.safety-tool b,.pref-row,.pref-row b,.quick-alert-label,.quick-alert-head h3,.search-item b,.search-suggestion b,.planner-heading-copy b,.route-card h3,.route-head h2,.destination-confirm h3,.nav-summary-item strong){color:var(--vb-text)!important}
html[data-rairo-theme="black"] .ws-app :is(.drawer-user span,.drawer-login p,.guest-drawer-content>p,.quick-alert-head p,.quick-alert-status,.result-address,.result-copy small,.search-label,.search-label span,.search-label em,.search-message,.search-message span,.search-suggestion small,.planner-heading-copy span,.route-card-meta,.route-ai,.destination-confirm p,.nav-summary-item small,.traffic-radar-copy span){color:var(--vb-muted)!important}
html[data-rairo-theme="black"] .ws-app :is(.drawer-divider,.support-title){border-color:var(--vb-line)!important;background-color:var(--vb-line)!important}
html[data-rairo-theme="black"] .ws-app :is(.drawer-link:hover,.drawer-link:active,.search-item:active,.search-suggestion:active,.quick-alert-grid button:active,.planner-preset:active,.nearby-service:active){background:var(--vb-surface-3)!important;color:var(--vb-orange-2)!important}
html[data-rairo-theme="black"] .ws-app :is(.drawer-avatar.fallback,.quick-alert-close,.guest-drawer-close,.guest-drawer-secondary){background:var(--vb-surface-2)!important;color:var(--vb-text)!important;border-color:var(--vb-line)!important}
html[data-rairo-theme="black"] .ws-app .guest-drawer-benefits span{background:var(--vb-surface-2)!important;color:var(--vb-muted)!important;border-color:var(--vb-line)!important}
html[data-rairo-theme="black"] .ws-app .guest-drawer-primary{color:#fff!important}
html[data-rairo-theme="black"] .ws-app .mapboxgl-popup-content{background:rgba(33,30,27,.99)!important;color:var(--vb-text)!important;border-color:var(--vb-line)!important}
html[data-rairo-theme="black"] .ws-app .mapboxgl-popup-content *{color:inherit!important}
html[data-rairo-theme="black"] .ws-app .mapboxgl-popup-tip{border-top-color:var(--vb-surface)!important}
html[data-rairo-theme="black"] .ws-app .mapboxgl-ctrl-group button{background:var(--vb-surface-2)!important;color:var(--vb-text)!important}
.map-mood-fade{transition:opacity .09s ease!important}

/* Profile page: authoritative dark skin for every nested profile surface. */
html[data-rairo-theme="black"] body:has(.v72-profile-page){background:var(--vb-bg)!important;color:var(--vb-text)!important}
html[data-rairo-theme="black"] :is(.profile-v72-hero,.profile-v72-card,.profile-v72-detail,.profile-v72-links,.profile-v108-quicknav a,.profile-v72-place,.profile-v72-nav-pref,.profile-v72-map-style,.profile-v72-accent,.profile-v72-fuel-list span,.profile-v72-person,.profile-v72-empty){background:var(--vb-surface)!important;color:var(--vb-text)!important;border-color:var(--vb-line)!important;box-shadow:none!important}
html[data-rairo-theme="black"] .profile-v72-detail summary{background:var(--vb-surface)!important;color:var(--vb-text)!important;border-color:var(--vb-line)!important}
html[data-rairo-theme="black"] .profile-v72-detail summary:hover{background:var(--vb-surface-2)!important}
html[data-rairo-theme="black"] .profile-v72-detail-body{background:#1C1916!important;color:var(--vb-text)!important}
html[data-rairo-theme="black"] :is(.profile-v72-field input,.profile-v72-field select,.profile-v72-place input,.profile-v72-invite input){background:var(--vb-surface-2)!important;color:var(--vb-text)!important;border-color:var(--vb-line)!important}
html[data-rairo-theme="black"] :is(.profile-v72-copy h1,.profile-v72-section-head h2,.profile-v72-subhead b,.profile-v72-detail-copy b,.profile-v72-place-head,.profile-v72-nav-copy b,.profile-v72-map-copy b,.profile-v72-person b,.profile-v72-links b,.profile-v108-quicknav b){color:var(--vb-text)!important}
html[data-rairo-theme="black"] :is(.profile-v72-copy p,.profile-v72-section-head p,.profile-v72-subcopy,.profile-v72-detail-copy small,.profile-v72-field>span,.profile-v72-nav-copy small,.profile-v72-map-copy small,.profile-v72-person small,.profile-v72-links small,.profile-v108-quicknav small){color:var(--vb-muted)!important}
html[data-rairo-theme="black"] :is(.profile-v72-badge,.profile-v72-note,.profile-v72-nav-icon,.profile-v72-detail-icon,.profile-v72-card-icon,.profile-v72-link-icon,.profile-v108-quick-icon,.profile-v72-secondary){background:rgba(245,154,98,.10)!important;color:var(--vb-orange-2)!important;border-color:rgba(245,154,98,.18)!important}
html[data-rairo-theme="black"] .profile-v72-switch{background:#4A433E!important}
html[data-rairo-theme="black"] .profile-v72-switch:before{background:#FFFBF2!important}
html[data-rairo-theme="black"] :is(.profile-v72-map-style:has(input:checked),.profile-v72-accent:has(input:checked),.profile-v72-fuel-list input:checked+span){background:rgba(245,154,98,.11)!important;border-color:rgba(245,154,98,.30)!important;color:var(--vb-orange-2)!important}

/* Onboarding and auth entry. */
html[data-rairo-theme="black"] :is(.ob-shell,.ob-section,.choice label,.pref label,.night-card,.presence-consent,.privacy-note,.v63-entry-shell,.v63-entry-panel,.v63-auth-block,.auth-shell,.auth-pane,.sheet-card){background:var(--vb-surface)!important;color:var(--vb-text)!important;border-color:var(--vb-line)!important;box-shadow:none!important}
html[data-rairo-theme="black"] :is(.ob-head h1,.ob-section-title b,.choice label b,.pref label b,.night-card b,.v63-entry-panel h1,.v63-auth-label span:first-child,.auth-copy h1,.sheet-head h2){color:var(--vb-text)!important}
html[data-rairo-theme="black"] :is(.ob-head p,.ob-section-title span,.choice label span,.pref label span,.night-card span,.v63-entry-lead,.auth-legal,.lead,.legal,.sheet-head p,.sheet-switch){color:var(--vb-muted)!important}
html[data-rairo-theme="black"] :is(.ob-section .input,.ob-section .select,.sheet-input,.sheet-select,.field input,.input-shell,.auth-button.google,.auth-google,.auth-choice.secondary,.auth-guest){background:var(--vb-surface-2)!important;color:var(--vb-text)!important;border-color:var(--vb-line)!important}
html[data-rairo-theme="black"] :is(.auth-button.email,.auth-choice.primary,.sheet-submit){color:#fff!important}
html[data-rairo-theme="black"] .vienna-auth-tagline{color:var(--vb-muted)!important}
html[data-rairo-theme="black"] .vienna-auth-banner-frame{border-color:rgba(255,195,155,.16)!important;box-shadow:0 16px 42px rgba(0,0,0,.30)!important}
@media(max-width:760px){html[data-rairo-theme="black"] :is(.auth-page[data-auth-page="login"],.auth-page[data-auth-page="login"] .auth-shell,.auth-page[data-auth-page="login"] .auth-pane,.rairo-entry,.rairo-entry .v63-entry-shell,.rairo-entry .v63-entry-panel){background:var(--vb-bg)!important}}

/* Notifications/help/invites and generic content lists. */
html[data-rairo-theme="black"] :is(.notif-shell,.notif-list,.faq-shell,.invite-shell){color:var(--vb-text)!important}
html[data-rairo-theme="black"] :is(.notif,.faq details,.invite-card){background:var(--vb-surface)!important;color:var(--vb-text)!important;border-color:var(--vb-line)!important}
html[data-rairo-theme="black"] :is(.notif p,.notif small,.faq p,.faq small,.invite-card p,.invite-card small){color:var(--vb-muted)!important}

/* Admin pages: old admin-specific styles contained many late white !important rules. */
html[data-rairo-theme="black"] :is(.admin86,.audit-page,.admin-server-page,.finance93,.risk-admin,.admin-users-v76){background:var(--vb-bg)!important;color:var(--vb-text)!important}
html[data-rairo-theme="black"] :is(.admin86,.audit-page,.admin-server-page,.finance93,.risk-admin,.admin-users-v76) :is([class*="card"],[class*="panel"],[class*="surface"],[class*="kpi"],[class*="metric"],[class*="tile"],[class*="row"],table){background:var(--vb-surface)!important;color:var(--vb-text)!important;border-color:var(--vb-line)!important;box-shadow:none!important}
html[data-rairo-theme="black"] :is(.admin86,.audit-page,.admin-server-page,.finance93,.risk-admin,.admin-users-v76) :is(input,select,textarea){background:var(--vb-surface-2)!important;color:var(--vb-text)!important;border-color:var(--vb-line)!important}
html[data-rairo-theme="black"] :is(.admin86,.audit-page,.admin-server-page,.finance93,.risk-admin,.admin-users-v76) :is(h1,h2,h3,h4,b,strong,label,th,td){color:var(--vb-text)!important}
html[data-rairo-theme="black"] :is(.admin86,.audit-page,.admin-server-page,.finance93,.risk-admin,.admin-users-v76) :is(p,small,.muted,span){border-color:var(--vb-line)!important}

/* Standalone shared/live pages when this sheet is linked there. */
html[data-rairo-theme="black"] :is(.share-app,.map-unavailable,.app,.offline){background:var(--vb-bg)!important;color:var(--vb-text)!important}
html[data-rairo-theme="black"] :is(.share-top,.route-panel,.share-app .metric,.share-app .route-actions button,.share-app .route-actions a:not(.primary),.live-trip-card){background:rgba(33,30,27,.97)!important;color:var(--vb-text)!important;border-color:var(--vb-line)!important}
html[data-rairo-theme="black"] :is(.share-top span,.share-app .place small,.share-app .metric small,.share-app .copy-status,.share-app .route-panel p){color:var(--vb-muted)!important}


/* VIENNA v177 — remove the cramped mobile header shown in the screenshot.
   Signed-in phones already have the bottom dock, so the old wordmark/logout bar is redundant. */
@media(max-width:760px){
  body.vienna-signed-in>.topbar,
  body:has(.rairo-entry)>.topbar,
  body:has(.onboard)>.topbar{display:none!important}
  body.vienna-signed-in{padding-top:0!important}
  body.vienna-signed-in>.page,
  body.vienna-signed-in>.container.page{padding-top:max(14px,env(safe-area-inset-top))!important}
}

/* Desktop/tablet header stays restrained and does not duplicate the wordmark text. */
.topbar .brand>span{display:none!important}
.topbar .rairo-brand-wordmark{width:132px!important;height:32px!important;max-width:132px!important;object-fit:contain!important;object-position:left center!important;filter:none!important}


/* VIENNA v178 — transparent auth branding.
   Removes the white/cropped banner frame entirely and uses high-resolution
   light/dark transparent assets so the identity feels native to the page. */
.vienna-auth-banner-link{
  display:block!important;
  width:min(100%,560px)!important;
  max-width:560px!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:visible!important;
  text-decoration:none!important;
}
.vienna-auth-banner-clean{
  position:relative!important;
  display:block!important;
  width:100%!important;
  aspect-ratio:4.86/1!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:visible!important;
  isolation:isolate!important;
}
.vienna-auth-banner-clean:before{
  content:""!important;
  position:absolute!important;
  left:1.5%!important;
  top:17%!important;
  width:17%!important;
  aspect-ratio:1!important;
  border-radius:34%!important;
  background:rgba(245,154,98,.14)!important;
  filter:blur(22px)!important;
  transform:scale(.92)!important;
  z-index:-1!important;
  pointer-events:none!important;
}
.vienna-auth-banner-clean .vienna-auth-banner{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:left center!important;
  transform:none!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  image-rendering:auto!important;
  -webkit-font-smoothing:antialiased!important;
  filter:drop-shadow(0 10px 22px rgba(74,51,36,.08))!important;
}
.vienna-auth-banner-dark{opacity:0!important;visibility:hidden!important}
html[data-rairo-theme="black"] .vienna-auth-banner-light{opacity:0!important;visibility:hidden!important}
html[data-rairo-theme="black"] .vienna-auth-banner-dark{opacity:1!important;visibility:visible!important;filter:drop-shadow(0 12px 28px rgba(0,0,0,.24))!important}
html[data-rairo-theme="black"] .vienna-auth-banner-clean:before{background:rgba(245,154,98,.18)!important;filter:blur(25px)!important}

/* Kill every legacy framed-banner style that could leak back in. */
.vienna-auth-banner-frame{
  display:contents!important;
  width:auto!important;height:auto!important;aspect-ratio:auto!important;
  overflow:visible!important;border:0!important;border-radius:0!important;
  background:transparent!important;box-shadow:none!important;
}
.vienna-auth-banner-frame .vienna-auth-banner{position:static!important;transform:none!important}

/* Better auth hierarchy around the new lockup. */
.auth-page[data-auth-page="login"] .brand-row{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  min-height:0!important;
  margin:0 0 clamp(24px,4.5vh,48px)!important;
  padding:0!important;
  pointer-events:auto!important;
  display:block!important;
}
.auth-page[data-auth-page="login"] .auth-copy{
  margin:0!important;
  padding:0!important;
}
.rairo-entry .v63-entry-brand{
  display:block!important;
  width:100%!important;
  margin:0 0 clamp(28px,5vh,52px)!important;
  padding:0!important;
}
.rairo-entry .v63-entry-kicker{margin-top:0!important}

@media(max-width:760px){
  .vienna-auth-banner-link{width:min(100%,390px)!important;max-width:390px!important}
  .vienna-auth-banner-clean{aspect-ratio:4.86/1!important}
  .auth-page[data-auth-page="login"] .brand-row{margin-bottom:clamp(28px,6vh,48px)!important}
  .auth-page[data-auth-page="login"] .auth-pane{
    padding-top:max(24px,calc(env(safe-area-inset-top) + 16px))!important;
  }
  .rairo-entry .v63-entry-brand{margin-bottom:34px!important}
}
@media(max-width:380px){
  .vienna-auth-banner-link{width:min(100%,344px)!important}
  .auth-page[data-auth-page="login"] .brand-row{margin-bottom:26px!important}
  .rairo-entry .v63-entry-brand{margin-bottom:28px!important}
}
