/* The Masterbook outer pages (login, account, checkout, success, auth): 2026-10-16 revamp.
   Same look as the app theme (mb-theme.css). Loaded last on each page, styling only. */
:root{--mbp-ease:cubic-bezier(.16,1,.3,1);--mbp-gold:var(--bmt-gold,#C9A84C);--mbp-gold-lt:var(--bmt-gold-light,#E8C96A);--mbp-gold-dk:var(--bmt-gold-dark,#7A6228);--mbp-cream:var(--bmt-cream,#F5F0E4);--mbp-muted:var(--bmt-muted,#8a8372);--mbp-line:rgba(245,240,228,.08);--mbp-line2:rgba(245,240,228,.13)}
html{background:#0C0B09}
body{background:#0C0B09!important}
body::before{background:var(--bmt-app-bg,linear-gradient(135deg,#0A1628 0%,#0C0B09 55%))!important;pointer-events:none}
body>*{animation:mbpIn .8s var(--mbp-ease) both}
@keyframes mbpIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
::selection{background:rgba(201,168,76,.3);color:var(--mbp-cream)}

/* brand */
.mbp-logo{display:block;width:110px;height:auto;margin:0 auto 18px}
.brand-title,.page-title,.headline,.nav-brand{color:var(--mbp-cream)}
.brand-title span,.page-title span,.headline span,.nav-brand span{color:var(--mbp-gold)}
.brand-sub,.page-sub,.sub,.fine,.fine-print{color:var(--mbp-muted)!important}

/* cards */
.card,.plan-card{background:var(--bmt-bg2,#131210)!important;border:1px solid var(--mbp-line)!important;border-radius:18px!important;overflow:hidden;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 1px 0 rgba(255,255,255,.03) inset,0 40px 80px -40px rgba(0,0,0,.85);transition:transform .35s var(--mbp-ease),border-color .3s,box-shadow .3s}
.plan-card:hover{transform:translateY(-4px);border-color:var(--mbp-line2)!important}
.plan-card.featured,.plan-card.selected{border-color:rgba(201,168,76,.45)!important;background:linear-gradient(170deg,rgba(201,168,76,.10),rgba(20,19,17,.86) 45%)!important}
.card-header{border-bottom:1px solid var(--mbp-line)!important}
.field-row{border-bottom:1px solid var(--mbp-line)!important}
.nav{background:var(--bmt-bg2,#131210)!important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid rgba(201,168,76,.12)!important;border-radius:16px}

/* buttons */
.btn-gold,.cta-btn,.cta{background:linear-gradient(180deg,var(--mbp-gold-lt),var(--mbp-gold))!important;color:#14110a!important;border:0!important;border-radius:10px!important;
  box-shadow:0 10px 26px -14px rgba(232,201,106,.7);transition:transform .25s var(--mbp-ease),box-shadow .25s,filter .25s!important}
.btn-gold:hover,.cta-btn:hover,.cta:hover{transform:translateY(-1px);filter:brightness(1.05);box-shadow:0 14px 30px -12px rgba(232,201,106,.7)}
.cta-btn:disabled{filter:grayscale(.6) brightness(.8);transform:none;box-shadow:none}
.btn,.btn-outline,.btn-danger,.discount-btn,.oauth-btn{border-radius:10px!important;transition:transform .25s var(--mbp-ease),border-color .2s,background .2s,color .2s!important}
.btn-outline,.discount-btn{border-color:var(--mbp-line2)!important}
.btn-outline:hover,.discount-btn:hover{border-color:var(--mbp-gold-dk)!important;background:rgba(201,168,76,.07)!important;color:var(--mbp-gold-lt)!important}
.billing-toggle{border-radius:99px!important;padding:4px!important;border:1px solid var(--mbp-line2)!important;background:var(--bmt-bg2,#131210)!important}
.billing-opt{border-radius:99px!important;transition:background .25s,color .25s}
.billing-opt.active{background:linear-gradient(180deg,var(--mbp-gold-lt),var(--mbp-gold))!important;color:#14110a!important}
.badge,.plan-badge,.billing-save,.save-tag{border-radius:99px!important}

/* inputs */
.edit-input,.discount-input{background:var(--bmt-bg2,#131210)!important;border:1px solid var(--mbp-line2)!important;border-radius:10px!important;transition:border-color .2s,box-shadow .2s}
.edit-input:focus,.discount-input:focus{outline:none;border-color:var(--mbp-gold-dk)!important;box-shadow:0 0 0 3px rgba(201,168,76,.14)}
.msg{border-radius:10px}

/* success tick */
.check,.check-icon{box-shadow:0 0 0 10px rgba(201,168,76,.10),0 0 40px rgba(232,201,106,.35)}

@media(prefers-reduced-motion:reduce){body>*{animation:none}}

/* pages whose body is a centred flex row: stack the legal footer under the content */
body{flex-direction:column}
body>.wrap{flex-shrink:0}