/* Keep the fixed web authentication layer inside narrow mobile viewports. */
body[data-client="web"] {
  overflow-x: hidden;
  /* Keep normal taps, scrolling and pinch gestures, but do not let mobile
     browsers reinterpret two quick taps as a page-zoom command. */
  touch-action: manipulation;
  -ms-touch-action: manipulation;
}

body[data-client="web"] .app,
body[data-client="web"] button,
body[data-client="web"] a,
body[data-client="web"] label,
body[data-client="web"] summary,
body[data-client="web"] [role="button"] {
  touch-action: manipulation;
  -ms-touch-action: manipulation;
}

.web-auth {
  box-sizing: border-box;
  width: 100%;
  max-width: 100vw;
  overflow-x: hidden;
  overflow-y: auto;
}

.web-auth-card {
  box-sizing: border-box;
  width: 100%;
  max-width: 420px;
  min-width: 0;
}

.web-auth-card form,
.web-auth-card label,
.web-auth-card input,
.web-auth-tabs,
.web-captcha,
.web-captcha > * {
  min-width: 0;
}

.web-captcha-hint {
  margin: 7px 2px 2px;
  color: #91a8c6;
  font-size: 12px;
  line-height: 1.5;
}

.web-captcha-hint.hidden {
  display: none;
}

#webCaptchaAnswer {
  font-size: 18px;
  font-weight: 800;
  text-align: center;
}

.web-auth-error:not(:empty) {
  box-sizing: border-box;
  width: 100%;
  margin: 10px 0;
  padding: 10px 12px;
  border: 1px solid rgba(255, 124, 133, 0.45);
  border-radius: 10px;
  background: rgba(89, 18, 30, 0.45);
  color: #ffd8dc;
  line-height: 1.45;
  scroll-margin-block: 24vh;
}

@media (max-width: 380px) {
  .web-auth {
    padding-inline: 14px;
  }

  .web-captcha {
    grid-template-columns: minmax(0, 1.35fr) minmax(76px, 0.65fr);
  }

  .web-captcha img,
  #webCaptchaAnswer {
    min-height: 56px;
  }
}

/* Luxury image system v20261001: web welcome and account entry. */
.web-auth{background:
  linear-gradient(180deg,rgba(2,10,27,.66),rgba(2,8,20,.9)),
  url("/assets/ui-luxury/canada-hero.webp") center/cover no-repeat!important}
.web-auth-glow{background:radial-gradient(circle,rgba(237,190,78,.27),rgba(37,133,244,.2) 42%,transparent 72%)}
.web-auth-card{overflow:hidden;border-color:rgba(244,208,111,.48);background:linear-gradient(155deg,rgba(9,28,57,.94),rgba(4,14,33,.97));box-shadow:0 30px 82px rgba(0,5,19,.78),0 0 0 1px rgba(255,255,255,.08) inset;backdrop-filter:blur(16px)}
.web-auth-card:before{content:"";position:absolute;inset:0 0 auto;height:4px;background:linear-gradient(90deg,transparent,#dca633,#fff0ad,#dca633,transparent)}
.web-auth-card header span{color:#efcc72}.web-auth-tabs button.active{background:linear-gradient(135deg,#0756a9,#168fe5);box-shadow:0 8px 20px rgba(8,121,255,.32)}
.web-auth-card input{border-color:rgba(104,156,211,.44);background:rgba(3,15,34,.76)}.web-auth-card input:focus{border-color:#e5bd58;box-shadow:0 0 0 3px rgba(229,189,88,.14)}
.web-auth-submit{background:linear-gradient(135deg,#dca52c,#ffe894 52%,#dda82e);box-shadow:0 9px 22px rgba(216,158,31,.25)}
.web-auth-close{border-color:rgba(244,208,111,.35);background:rgba(3,15,34,.72)}
.web-guest-welcome{background:rgba(2,8,21,.68);backdrop-filter:blur(10px)}
.web-guest-welcome section{overflow:hidden;padding-top:142px;border-color:rgba(244,208,111,.52);background:
  linear-gradient(180deg,rgba(3,16,39,.05) 0 116px,rgba(4,18,42,.92) 151px,rgba(5,17,36,.98) 100%),
  url("/assets/ui-luxury/canada-hero.webp") center top/auto 185px no-repeat,#07162e;box-shadow:0 28px 80px rgba(0,5,20,.72),0 0 0 1px rgba(255,255,255,.08) inset}
.web-guest-welcome section:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,transparent,#dda832,#fff0a7,#dda832,transparent)}
.web-guest-welcome span{color:#efcd76}.web-guest-welcome h2{color:#fffdf4;text-shadow:0 2px 8px #000}.web-guest-welcome p{color:#c0d2e8}.web-guest-welcome section>div button{background:linear-gradient(135deg,#075cb4,#1699eb);box-shadow:0 8px 20px rgba(7,98,191,.28)}.web-guest-welcome section>div button+button{background:linear-gradient(135deg,#dba52b,#ffe78d);box-shadow:0 8px 20px rgba(212,155,26,.24)}
.web-guest-browse{color:#9db1ca}.web-guest-close{z-index:2;border:1px solid rgba(255,231,163,.28);background:rgba(2,12,29,.66);color:#fff1bf}
@media(max-width:380px){.web-guest-welcome section{padding-top:126px;background-size:auto 167px}.web-auth-card{padding-inline:17px}}

