@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&family=Lora:wght@400;500;600;700&display=swap');

/* Corvamar Login v9 - approved framed login over ultrawide tabletop scene. */
:root{
  --auth-ink:#2b1a12;
  --auth-wine:#641526;
  --auth-gold:#b98a44;
  --auth-parchment:#ead4aa;
}
html:has(.entry-shell),body:has(.entry-shell){min-height:100%}
body:has(.entry-shell){
  position:relative;
  isolation:isolate;
  min-height:100dvh;
  margin:0;
  display:grid;
  place-items:center;
  padding:12px;
  overflow:auto;
  background:#160e0a;
  color:var(--auth-ink);
  font-family:"Lora",Georgia,serif;
}
body:has(.entry-shell)::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:url("/assets/auth-corvamar-v1/auth-tabletop-outer-v9.webp") center/cover no-repeat;
  filter:brightness(.72) saturate(.88);
  transform:none;
}
body:has(.entry-shell)::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(ellipse at center,rgba(22,12,8,.06) 0%,rgba(16,9,6,.12) 62%,rgba(7,4,3,.42) 100%),
    linear-gradient(180deg,rgba(18,10,7,.06),rgba(18,10,7,.18));
}
.entry-shell{
  position:relative;
  z-index:1;
  isolation:isolate;
  display:grid;
  grid-template-columns:55.5% 44.5%;
  width:min(1600px,calc(100vw - 24px),calc((100dvh - 24px) * 1.6));
  aspect-ratio:8 / 5;
  min-height:0;
  overflow:hidden;
  border:0;
  border-radius:0;
  background:url("/assets/auth-corvamar-v1/auth-corvamar-reference-v7.webp") center/100% 100% no-repeat;
  box-shadow:0 28px 80px rgba(13,7,4,.66);
}
.entry-shell::before,.entry-shell::after{content:none}
.campaign-cover{
  position:relative;
  min-width:0;
  min-height:0;
  padding:0;
  overflow:hidden;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
}
.campaign-cover::before,.campaign-cover::after{content:none}
.campaign-cover>*{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
.login-card{
  position:relative;
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  padding:51% 0 0;
  overflow:hidden;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.login-card::before{
  content:"";
  position:absolute;
  z-index:0;
  left:11%;
  right:7%;
  top:32%;
  bottom:9%;
  background:
    linear-gradient(rgb(244,225,187),rgb(237,211,164)),
    url("/assets/auth-corvamar-v1/auth-parchment.png") center/cover;
  box-shadow:0 0 34px 22px rgba(238,215,174,.82);
}
.login-card::after{content:none}
.login-card>*{position:relative;z-index:1}
.login-card>.eyebrow{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
}
.login-card>h2,.login-card>.login-copy{
  width:68%;
  margin-left:16%;
  margin-right:16%;
}
.login-card>h2{
  margin-top:0;
  margin-bottom:3px;
  color:#2b1a12;
  font:600 clamp(21px,2.1vw,34px)/1.05 "Lora",Georgia,serif;
}
.login-card>.login-copy{
  margin-top:0;
  margin-bottom:10px;
  color:#6a4b39;
  font:500 clamp(8px,.68vw,12px)/1.35 "Lora",Georgia,serif;
}
.google-identity-entry,.login-card>form,.login-card>.help,.login-card>.auth-create-account{
  width:68%;
  margin-left:16%;
  margin-right:16%;
}
.login-card>.google-identity-entry{
  width:68%!important;
  margin-left:16%!important;
  margin-right:16%!important;
}
.google-identity-entry{margin-bottom:8px}
.google-identity-entry__button{
  display:flex;
  justify-content:center;
  min-height:32px;
  margin:0 0 5px;
}
.google-identity-entry__note{
  margin:0 auto 6px!important;
  color:#66493a!important;
  font:500 clamp(7px,.58vw,10px)/1.32 "Lora",Georgia,serif!important;
  text-align:center!important;
}
.google-identity-entry__divider{margin:5px 0 4px!important}
.google-identity-entry__divider::before{background:rgba(94,62,38,.28)!important}
.google-identity-entry__divider span{
  padding:0 8px!important;
  background:var(--auth-parchment)!important;
  color:#77563e!important;
  font:600 clamp(7px,.55vw,9px)/1 "Cinzel",Georgia,serif!important;
}
.login-card>form{display:grid;gap:7px}
.login-card label{
  display:grid;
  gap:3px;
  color:#3a2519;
  font:600 clamp(8px,.62vw,11px)/1.2 "Cinzel",Georgia,serif;
}
.login-card input{
  width:100%;
  min-height:clamp(36px,4.1vh,47px);
  padding:8px 14px;
  border:1px solid rgba(87,58,37,.33);
  border-radius:5px;
  background:rgba(238,218,180,.96);
  color:#2f2018;
  font:500 clamp(11px,.78vw,14px)/1.2 "Lora",Georgia,serif;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.48);
}
.login-card input:focus{
  outline:2px solid #8c6334;
  outline-offset:2px;
  box-shadow:0 0 0 4px rgba(140,99,52,.18);
}
.login-card input:-webkit-autofill{
  -webkit-text-fill-color:#2f2018;
  -webkit-box-shadow:0 0 0 1000px #ead4aa inset;
}
.login-card form>button{
  min-height:clamp(39px,4.5vh,51px);
  margin-top:5px;
  padding:8px 16px;
  border:1px solid #3b0d16;
  border-radius:5px;
  background:
    linear-gradient(rgba(120,25,42,.9),rgba(80,14,27,.96)),
    url("/assets/auth-corvamar-v1/auth-button-frame.png") center/100% 100% no-repeat;
  color:#fff4df;
  font:600 clamp(12px,.95vw,17px)/1 "Cinzel",Georgia,serif;
  letter-spacing:.02em;
  text-shadow:0 2px 3px #26060c;
  box-shadow:0 7px 14px rgba(53,14,18,.22);
}
.login-card form>button:hover{filter:brightness(1.12)}
.login-card>.help{
  margin-top:5px;
  margin-bottom:0;
  padding:0;
  border:0;
  color:#65493a;
  font:500 clamp(7px,.6vw,10px)/1.35 "Lora",Georgia,serif;
}
.login-card>.help a,.auth-create-account a{color:#6a2130;text-underline-offset:2px}
.login-card>.auth-create-account{
  margin-top:7px;
  margin-bottom:0;
  padding:0;
  border:0;
  background:transparent;
  color:#4b3023;
  text-align:center;
  font:500 clamp(9px,.7vw,12px)/1.3 "Lora",Georgia,serif;
}
.auth-entry-note,.auth-age-note,.auth-legal-links,.auth-disclaimer{display:none}
.google-identity-entry__error,.login-card>.error{
  width:68%;
  margin:0 auto 7px;
  padding:6px 9px;
  font-size:10px;
}
@media (max-width:900px){
  body:has(.entry-shell){
    display:block;
    padding:0;
    background:#281b15;
  }
  body:has(.entry-shell)::before,
  body:has(.entry-shell)::after{display:none}
  .entry-shell{
    display:block;
    width:100%;
    min-height:100dvh;
    aspect-ratio:auto;
    overflow:visible;
    background:none;
    box-shadow:none;
  }
  .campaign-cover{
    min-height:380px;
    padding:38px 28px 28px;
    background:
      linear-gradient(100deg,rgba(13,8,6,.93),rgba(41,24,17,.78)),
      url("/assets/auth-corvamar-v1/auth-left-texture.png") center/cover;
    color:#f5e9d3;
  }
  .campaign-cover>*{
    position:relative!important;
    width:auto!important;
    height:auto!important;
    padding:initial!important;
    margin:initial!important;
    overflow:visible!important;
    clip:auto!important;
    white-space:normal!important;
  }
  .campaign-cover .brand-mark{
    width:58px!important;
    height:58px!important;
    margin-bottom:14px!important;
    background:url("/assets/auth-corvamar-v1/auth-d20-seal.png") center/contain no-repeat;
    color:transparent;
  }
  .campaign-cover h1{
    max-width:620px;
    margin:10px 0 16px!important;
    font-size:clamp(2rem,8vw,3.2rem);
    line-height:1.03;
  }
  .campaign-cover .intro{max-width:620px}
  .campaign-summary{max-width:520px;margin-top:22px!important}
  .entry-features{display:none}
  .login-card{
    min-height:0;
    padding:42px 28px 34px;
    overflow:visible;
    background:
      linear-gradient(rgba(249,238,215,.94),rgba(235,210,166,.97)),
      url("/assets/auth-corvamar-v1/auth-parchment.png") center/cover;
  }
  .login-card::before{display:none}
  .login-card>h2,.login-card>.login-copy,.login-card>.eyebrow{
    position:relative!important;
    width:auto!important;
    height:auto!important;
    margin:0!important;
    overflow:visible!important;
    clip:auto!important;
    white-space:normal!important;
  }
  .login-card>.eyebrow{color:#772436;font-family:"Cinzel",Georgia,serif}
  .login-card>h2{
    margin-top:8px!important;
    font:600 clamp(2rem,9vw,3rem)/1.04 "Lora",Georgia,serif;
  }
  .login-card>.login-copy{margin-top:10px!important;margin-bottom:22px!important}
  .google-identity-entry,.login-card>form,.login-card>.help,.login-card>.auth-create-account,
  .google-identity-entry__error,.login-card>.error{
    width:100%;
    max-width:520px;
    margin-left:auto;
    margin-right:auto;
  }
  .login-card>.google-identity-entry{
    width:100%!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  .google-identity-entry__note{font-size:11px!important}
  .google-identity-entry__divider span{font-size:9px!important}
  .login-card>form{gap:12px}
  .login-card label{font-size:11px}
  .login-card input{min-height:50px;font-size:15px}
  .login-card form>button{min-height:52px;font-size:16px}
  .login-card>.help{margin-top:12px;font-size:11px}
  .login-card>.auth-create-account{margin-top:14px;font-size:14px}
  .auth-entry-note,.auth-age-note,.auth-legal-links,.auth-disclaimer{display:block}
}
@media (max-width:420px){
  .campaign-cover{min-height:340px;padding:30px 22px 24px}
  .campaign-cover h1{font-size:2.2rem}
  .campaign-cover .intro{font-size:14px}
  .campaign-summary{display:none}
  .login-card{padding:34px 22px 30px}
  .g_id_signin{transform:scale(.9);transform-origin:center}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}

/* Registration framing fix - keep desktop copy inside the parchment safe area */
@media (min-width:901px){
  .auth-register-card>h1,
  .auth-register-card>p:not(.eyebrow):not(.help):not(.error){
    width:68%;
    margin-left:16%;
    margin-right:16%;
  }
  .auth-register-card>h1{
    margin-top:0;
    margin-bottom:9px;
    color:#2b1a12;
    font:600 clamp(21px,2.1vw,34px)/1.05 "Lora",Georgia,serif;
  }
  .auth-register-card>p:not(.eyebrow):not(.help):not(.error){
    margin-top:0;
    margin-bottom:12px;
    color:#6a4b39;
    font:500 clamp(9px,.72vw,12px)/1.42 "Lora",Georgia,serif;
  }
}