/* JewelBooks login / registration: one card, two halves. A glowing gold-and-graphite panel slides between left and right while the forms cross-fade.
   Desktop only (>=821px). On phones the existing single-column card is kept. */
.auth-gem-img{display:block;width:56px;height:56px;border-radius:14px;margin:0 auto 14px;box-shadow:0 8px 24px rgba(0,0,0,.28)}
@media(min-width:821px){
.auth-modal .auth-card,.auth-register-view .auth-card{display:grid!important;grid-template-columns:100%;width:min(960px,100%)!important;min-height:min(600px,92vh);max-height:92vh;overflow:hidden!important;padding:8px!important;border-radius:32px;background:var(--card,#fff);box-shadow:0 40px 100px rgba(0,0,0,.35)}
.auth-card>*{grid-area:1/1}
.auth-card>.auth-close{align-self:start;justify-self:end;z-index:20;position:relative!important;top:auto!important;right:auto!important;margin:12px 14px 0 0}
/* forms: each lives in one half and fades in or out */
.auth-card>.auth-form-panel{display:block!important;width:50%;max-height:calc(min(92vh,100vh) - 16px);overflow-y:auto;overflow-x:hidden;padding:30px 40px;z-index:1;transition:opacity .55s ease,visibility .55s,transform .65s ease-in-out;scrollbar-width:thin}
.auth-card>.auth-login-panel{justify-self:start}
.auth-card>.auth-register-panel{justify-self:end}
.auth-card[data-auth-view=login]>.auth-register-panel{opacity:0;visibility:hidden;pointer-events:none;transform:translateX(-14%)}
.auth-card[data-auth-view=register]>.auth-login-panel{opacity:0;visibility:hidden;pointer-events:none;transform:translateX(14%)}
.auth-card>.auth-form-panel .auth-form-inner{max-width:380px;margin:0 auto}
/* sliding hero */
.auth-card>.auth-brand-panel{display:block!important;position:relative;width:50%;justify-self:start;align-self:stretch;overflow:hidden;isolation:isolate;border-radius:26px;background:var(--ink,#1d1d1f);color:#fff;transform:translateX(100%);transition:transform .65s ease-in-out;z-index:3}
.auth-card[data-auth-view=register]>.auth-brand-panel{transform:translateX(0)}
.auth-brand-panel::before{content:"";position:absolute;inset:-25%;z-index:-2;background:radial-gradient(46% 42% at 18% 20%,color-mix(in srgb,var(--gold,#9a6b1f) 55%,#fff 20%),transparent 64%),radial-gradient(44% 50% at 88% 28%,rgba(255,255,255,.2),transparent 64%),radial-gradient(60% 50% at 50% 106%,color-mix(in srgb,var(--gold,#9a6b1f) 42%,#fff 28%),transparent 66%),radial-gradient(38% 38% at 62% 52%,rgba(255,255,255,.08),transparent 68%);filter:blur(30px);opacity:.85;animation:authDrift 16s ease-in-out infinite alternate}
.auth-brand-panel::after{content:"";position:absolute;left:0;right:0;bottom:0;height:58%;z-index:-1;opacity:.55;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 200' preserveAspectRatio='none'%3E%3Cpath d='M0 110 C100 60 200 60 300 110 S500 160 600 110 S750 70 800 100 V200 H0Z' fill='%23ffffff' fill-opacity='.07'/%3E%3Cpath d='M0 140 C120 100 240 100 360 140 S580 180 700 130 S780 120 800 130 V200 H0Z' fill='%23ffffff' fill-opacity='.1'/%3E%3C/svg%3E") repeat-x;background-size:200% 100%;animation:authWave 18s linear infinite}
@keyframes authDrift{0%{transform:translate3d(-4%,-3%,0) rotate(0deg) scale(1)}100%{transform:translate3d(5%,4%,0) rotate(8deg) scale(1.12)}}
@keyframes authWave{to{background-position-x:-200%}}
.auth-brand-copy{position:absolute;inset:0;display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:0 34px;text-align:center;transition:opacity .5s ease;opacity:0;pointer-events:none}
.auth-card[data-auth-view=login] .auth-copy-login,.auth-card[data-auth-view=register] .auth-copy-register{opacity:1;pointer-events:auto;transition-delay:.25s}
.auth-brand-copy .auth-kicker{color:color-mix(in srgb,var(--gold,#9a6b1f) 45%,#fff);margin:0 0 10px}
.auth-brand-copy h2{margin:0 0 10px;font-size:32px;line-height:1.1;font-weight:600;letter-spacing:-.03em;color:#fff}
.auth-brand-copy p:not(.auth-kicker){margin:0 0 22px;font-size:15px;line-height:1.45;color:rgba(255,255,255,.86)}
.auth-brand-copy .auth-outline{padding:12px 38px;border-radius:980px;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.14);color:#fff;font:600 15px/1 inherit;font-family:inherit;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:background .25s,color .25s}
.auth-brand-copy .auth-outline:hover{background:#fff;color:#1d1d1f}
}
@media(prefers-reduced-motion:reduce){.auth-brand-panel::before,.auth-brand-panel::after{animation:none}.auth-card>.auth-brand-panel,.auth-card>.auth-form-panel,.auth-brand-copy{transition-duration:.01s}}