:root{
  --sanctuary-gold:#f5d98f;
  --sanctuary-gold-deep:#d7a94c;
  --sanctuary-ivory:#fff8ee;
  --sanctuary-muted:#e8dfea;
  --sanctuary-panel:linear-gradient(145deg,rgba(27,12,39,.92),rgba(11,5,18,.88));
  --sanctuary-panel-soft:linear-gradient(145deg,rgba(30,13,43,.88),rgba(12,5,20,.84));
  --sanctuary-border:rgba(233,195,111,.42);
  --sanctuary-shadow:0 24px 54px rgba(0,0,0,.46);
}

html{min-height:100%}

body.oo-sanctuary-page{
  position:relative;
  isolation:isolate;
  min-height:100vh;
  min-height:100dvh;
  color:var(--sanctuary-ivory);
  background-color:#10091b;
  background-image:url("/images/landing-sanctuary-desktop.png");
  background-image:image-set(
    url("/images/landing-sanctuary-desktop.webp") type("image/webp"),
    url("/images/landing-sanctuary-desktop.png") type("image/png")
  );
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;
  background-attachment:fixed;
}

body.oo-sanctuary-page::before{
  content:"";
  position:fixed;
  z-index:-1;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 50% 30%,rgba(19,8,30,.48),rgba(6,3,12,.82) 78%),
    linear-gradient(180deg,rgba(5,2,10,.14),rgba(5,2,10,.7));
}

body.oo-sanctuary-page .oo-sanctuary-emblem{
  width:76px;
  height:76px;
  flex:0 0 auto;
  margin:0 auto 14px;
  overflow:hidden;
  border:1px solid rgba(255,232,171,.86);
  border-radius:50%;
  background:linear-gradient(145deg,#f6dc91,#c99436);
  box-shadow:0 14px 30px rgba(0,0,0,.42),0 0 0 6px rgba(233,195,111,.07);
}

body.oo-sanctuary-page .oo-sanctuary-emblem picture,
body.oo-sanctuary-page .oo-sanctuary-emblem img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}

body.oo-sanctuary-page .oo-sanctuary-emblem img{
  filter:brightness(0) saturate(100%) invert(20%) sepia(28%) saturate(1880%) hue-rotate(245deg) brightness(88%) contrast(94%);
}

body.oo-sanctuary-page .oo-panel-surface,
body.oo-sanctuary-page .oo-panel-soft,
body.oo-sanctuary-page .oo-auth-card{
  border-color:var(--sanctuary-border);
  background:var(--sanctuary-panel);
  color:var(--sanctuary-ivory);
  box-shadow:var(--sanctuary-shadow);
  backdrop-filter:blur(16px);
}

body.oo-sanctuary-page .oo-panel-soft{background:var(--sanctuary-panel-soft)}

body.oo-sanctuary-page .oo-page-title,
body.oo-sanctuary-page .oo-card-title{
  color:var(--sanctuary-gold);
  text-shadow:0 4px 24px rgba(0,0,0,.72);
}

body.oo-sanctuary-page .oo-page-subtitle{color:var(--sanctuary-muted)}
body.oo-sanctuary-page a{color:var(--sanctuary-gold)}

body.oo-sanctuary-page .oo-btn{
  border-color:rgba(233,195,111,.68);
  background:rgba(255,255,255,.04);
  color:var(--sanctuary-gold);
  box-shadow:none;
}

body.oo-sanctuary-page .oo-btn:hover{
  border-color:#ffe2a0;
  background:rgba(233,195,111,.12);
  color:#fff0c8;
}

body.oo-sanctuary-page .oo-btn-primary{
  border-color:#f7dc98;
  background:linear-gradient(135deg,#f3d27f,#ce9b3e);
  color:#211024;
  box-shadow:0 14px 28px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.46);
}

body.oo-sanctuary-page .oo-btn-primary:hover{
  border-color:#ffe8af;
  background:linear-gradient(135deg,#f9df98,#dcad55);
  color:#170a1a;
}

body.oo-sanctuary-page #ooLangSwitcher{
  top:18px !important;
  left:28px !important;
  border:1px solid rgba(233,195,111,.48) !important;
  background:rgba(13,6,22,.92) !important;
  box-shadow:0 12px 30px rgba(0,0,0,.38) !important;
  backdrop-filter:blur(14px);
}

body.oo-sanctuary-page #ooLangSwitcher button{color:#f0e4f2 !important}
body.oo-sanctuary-page #ooLangSwitcher button.is-active{background:#e9c36f !important;color:#211024 !important}
body.oo-sanctuary-page #ooLangSwitcher .oo-lang-sep{color:#c6afce !important}

body.oo-sanctuary-page #ooGlobalMenuBtn{
  top:18px !important;
  right:28px !important;
  width:56px !important;
  height:56px !important;
  border:1px solid rgba(233,195,111,.62) !important;
  border-radius:14px !important;
  background:rgba(13,6,22,.92) !important;
  color:var(--sanctuary-gold-deep) !important;
  box-shadow:0 12px 30px rgba(0,0,0,.38) !important;
  backdrop-filter:blur(14px);
}

body.oo-sanctuary-page #ooGlobalMenuBtn:hover{
  border-color:var(--sanctuary-gold) !important;
  background:rgba(20,9,31,.98) !important;
  color:#ffe4a1 !important;
}

body.oo-sanctuary-page #ooGlobalMenuPanel{
  right:28px !important;
  border-color:rgba(233,195,111,.38) !important;
  background:rgba(16,8,25,.98) !important;
  box-shadow:0 22px 48px rgba(0,0,0,.54) !important;
  backdrop-filter:blur(18px);
}

body.oo-sanctuary-page #ooGlobalMenuPanel a{color:#f1e6f3 !important}
body.oo-sanctuary-page #ooGlobalMenuPanel a:hover{background:rgba(233,195,111,.11) !important;color:var(--sanctuary-gold) !important}
body.oo-sanctuary-page #ooGlobalMenuPanel hr{border-top-color:rgba(233,195,111,.22) !important}

/* Menu */
body.oo-menu-page{padding:86px 0 48px}
body.oo-menu-page .menu-topbar{flex-direction:column;padding:0 18px 18px}

body.oo-menu-page .menu-title{
  color:var(--sanctuary-gold);
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(46px,5vw,64px);
  font-weight:600;
  line-height:1;
  letter-spacing:-.03em;
  text-shadow:0 4px 24px rgba(0,0,0,.72);
}

body.oo-menu-page .menu-wrap{
  width:min(100% - 32px,940px);
  padding:0 0 40px;
}

body.oo-menu-page .menu-nav-card,
body.oo-menu-page .section,
body.oo-menu-page .deity-details-shell{
  border:1px solid var(--sanctuary-border);
  background:var(--sanctuary-panel-soft);
  box-shadow:0 18px 38px rgba(0,0,0,.3);
  backdrop-filter:blur(14px);
}

body.oo-menu-page .menu-nav-card:hover{
  border-color:rgba(245,217,143,.72);
  background:linear-gradient(145deg,rgba(42,19,57,.94),rgba(17,7,27,.9));
  box-shadow:0 20px 42px rgba(0,0,0,.4);
}

body.oo-menu-page .menu-nav-title,
body.oo-menu-page .menu-wrap h2,
body.oo-menu-page .menu-wrap h3,
body.oo-menu-page .qa-question,
body.oo-menu-page .deity-details-label,
body.oo-menu-page .deity-link{color:var(--sanctuary-gold)}

body.oo-menu-page .menu-nav-desc,
body.oo-menu-page .menu-wrap p,
body.oo-menu-page .menu-wrap li,
body.oo-menu-page .qa-answer,
body.oo-menu-page .deity-entry-power{color:var(--sanctuary-muted)}

body.oo-menu-page .menu-inline-return,
body.oo-menu-page .menu-btn,
body.oo-menu-page .menu-top-btn{
  border-color:rgba(233,195,111,.66);
  background:rgba(13,6,22,.9);
  color:var(--sanctuary-gold);
  box-shadow:0 12px 28px rgba(0,0,0,.34);
}

body.oo-menu-page .menu-inline-return:hover,
body.oo-menu-page .menu-btn:hover,
body.oo-menu-page .menu-top-btn:hover{
  border-color:#ffe2a0;
  background:rgba(233,195,111,.12);
  color:#fff0c8;
}

body.oo-menu-page .faq-item,
body.oo-menu-page .deity-details{border-color:rgba(233,195,111,.24)}

body.oo-menu-page .qa-toggle[aria-expanded="true"] + .qa-answer,
body.oo-menu-page .deity-item{
  border-color:rgba(233,195,111,.26);
  background:rgba(255,255,255,.04);
}

body.oo-menu-page .deity-item.is-active{
  border-color:rgba(245,217,143,.64);
  background:rgba(233,195,111,.1);
}

body.oo-menu-page .qa-toggle::after{border-color:var(--sanctuary-gold)}

body.oo-menu-page .menu-scroll-tip{
  left:50%;
  right:auto;
  width:min(280px,calc(100% - 32px));
  transform:translateX(-50%);
  border-color:rgba(233,195,111,.54);
  background:rgba(13,6,22,.94);
  color:var(--sanctuary-gold);
}

body.oo-menu-page .section{
  padding-inline:0;
  border:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
}

/* How it works */
body.oo-how-page{padding:86px 0 52px}
body.oo-how-page .how-wrap{padding:0}

body.oo-how-page .how-card{
  padding-inline:0;
  border:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
}

body.oo-how-page .how-title{
  color:var(--sanctuary-gold);
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(46px,5vw,64px);
  font-weight:600;
  letter-spacing:-.03em;
  text-align:center;
  text-shadow:0 4px 24px rgba(0,0,0,.72);
}

body.oo-how-page .how-section h2{color:var(--sanctuary-gold)}

body.oo-how-page .how-section p,
body.oo-how-page .how-list,
body.oo-how-page .how-close{color:var(--sanctuary-ivory)}

body.oo-how-page .how-section + .how-section{
  padding-top:24px;
  border-top:1px solid rgba(233,195,111,.2);
}

/* Membership */
body.oo-upgrade-page{padding:86px 0 50px}
body.oo-upgrade-page .wrap{padding:0 0 36px}

body.oo-upgrade-page .oo-page-title{
  font-family:Georgia,"Times New Roman",serif;
  font-weight:600;
  letter-spacing:-.03em;
}

body.oo-upgrade-page .card{
  border-color:var(--sanctuary-border);
  background:var(--sanctuary-panel-soft);
  color:var(--sanctuary-ivory);
}

body.oo-upgrade-page .tier-note,
body.oo-upgrade-page .tier-pay-note{color:var(--sanctuary-gold)}
body.oo-upgrade-page .card li{color:var(--sanctuary-ivory)}

/* Account recovery */
body.oo-recovery-page{padding:112px 20px 42px}

body.oo-recovery-page .oo-corner-nav{
  top:78px;
  left:28px;
}

body.oo-recovery-page .oo-corner-link{
  border-color:rgba(233,195,111,.62);
  background:rgba(13,6,22,.92);
  color:var(--sanctuary-gold);
}

body.oo-recovery-page .card{
  border-color:var(--sanctuary-border);
  background:var(--sanctuary-panel);
}

body.oo-recovery-page h1{
  color:var(--sanctuary-gold);
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(40px,5vw,54px);
  font-weight:600;
  letter-spacing:-.03em;
  text-shadow:0 4px 24px rgba(0,0,0,.72);
}

body.oo-recovery-page p.desc,
body.oo-recovery-page .helper,
body.oo-recovery-page .small{color:var(--sanctuary-muted)}
body.oo-recovery-page .oo-form-label{color:var(--sanctuary-ivory)}

body.oo-recovery-page .oo-input{
  border-color:rgba(233,195,111,.5);
  background:rgba(255,255,255,.07);
  color:#fff;
}

body.oo-recovery-page .oo-input::placeholder{color:#d3c8d5}

body.oo-recovery-page .oo-input:focus{
  border-color:var(--sanctuary-gold);
  box-shadow:0 0 0 3px rgba(233,195,111,.18);
}

/* Privacy and disclaimer */
body.oo-privacy-page{padding:86px 18px 50px}

body.oo-privacy-page header,
body.oo-privacy-page main,
body.oo-privacy-page footer{width:min(100%,960px)}
body.oo-privacy-page header{padding:0 0 20px}

body.oo-privacy-page header h1{
  max-width:900px;
  margin:0 auto;
  color:var(--sanctuary-gold);
  background:none;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(42px,5vw,60px);
  font-weight:600;
  line-height:1.05;
  letter-spacing:-.03em;
  text-shadow:0 4px 24px rgba(0,0,0,.72);
  -webkit-text-fill-color:currentColor;
}

body.oo-privacy-page .card{
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:var(--sanctuary-ivory);
  box-shadow:none;
  backdrop-filter:none;
}

body.oo-privacy-page h2.gold-text{
  color:var(--sanctuary-gold);
  background:none;
  border-top-color:rgba(233,195,111,.22);
  -webkit-text-fill-color:currentColor;
}

body.oo-privacy-page .card > h2:first-child{
  margin-top:0;
  padding-top:0;
  border-top:0;
}

body.oo-privacy-page p,
body.oo-privacy-page li{color:var(--sanctuary-ivory)}
body.oo-privacy-page footer{color:var(--sanctuary-muted)}

body.oo-privacy-page .back.gold-text{
  color:var(--sanctuary-gold);
  background:none;
  -webkit-text-fill-color:currentColor;
}

@media (max-width:720px){
  body.oo-sanctuary-page{
    background-image:url("/images/landing-sanctuary-mobile.png");
    background-image:image-set(
      url("/images/landing-sanctuary-mobile.webp") type("image/webp"),
      url("/images/landing-sanctuary-mobile.png") type("image/png")
    );
    background-position:center top;
    background-attachment:scroll;
  }

  body.oo-sanctuary-page #ooLangSwitcher{top:10px !important;left:10px !important}

  body.oo-sanctuary-page #ooGlobalMenuBtn{
    top:10px !important;
    right:12px !important;
    width:50px !important;
    height:50px !important;
  }

  body.oo-sanctuary-page #ooGlobalMenuPanel{right:12px !important}

  body.oo-sanctuary-page .oo-sanctuary-emblem{
    width:68px;
    height:68px;
    margin-bottom:12px;
  }

  body.oo-menu-page,
  body.oo-how-page,
  body.oo-upgrade-page,
  body.oo-privacy-page{padding-top:76px}

  body.oo-menu-page .menu-wrap{
    width:min(100% - 24px,940px);
    padding:0 0 36px;
  }

  body.oo-menu-page .menu-title{font-size:42px}

  body.oo-menu-page .menu-nav-card,
  body.oo-menu-page .section{border-radius:18px}

  body.oo-how-page .how-wrap{width:min(100% - 20px,940px)}
  body.oo-how-page .how-card{padding:24px 18px 26px}
  body.oo-how-page .how-title{font-size:42px}

  body.oo-upgrade-page .oo-page-title{
    padding-inline:56px;
    font-size:42px;
  }

  body.oo-upgrade-page .card{min-height:0}

  body.oo-recovery-page{padding:126px 12px 34px}

  body.oo-recovery-page .oo-corner-nav{
    top:64px;
    left:10px;
  }

  body.oo-recovery-page .card{width:min(100%,560px)}
  body.oo-recovery-page h1{font-size:40px}

  body.oo-privacy-page header h1{
    padding-inline:6px;
    font-size:38px;
  }

  body.oo-privacy-page .card{
    padding:0 6px;
  }
}

@media (max-width:380px){
  body.oo-upgrade-page .oo-page-title{font-size:36px}
  body.oo-recovery-page h1,
  body.oo-privacy-page header h1{font-size:34px}
}