/* Shared sign-in treatment for the desktop shell and the web account.
   Visual adaptation of the supplied sign-in-card-2 reference. Auth remains owned by each app. */
@property --auth-light-angle { syntax:"<angle>"; initial-value:25deg; inherits:false; }
.auth-box,.auth-card { --auth-light-angle:25deg; position:relative; isolation:isolate; border:1px solid #b39acc4f; border-radius:24px; background:radial-gradient(ellipse at 90% 0,#8560c32b,transparent 48%),linear-gradient(145deg,#1d1827f7,#0e0e17fc); box-shadow:0 28px 90px #08061170,inset 0 1px #e8dcff17; animation:auth-card-enter .65s cubic-bezier(.16,1,.3,1) both; }
.auth-box::before,.auth-card::before { content:""; position:absolute; z-index:-1; pointer-events:none; inset:-1px; padding:1px; border-radius:inherit; background:conic-gradient(from var(--auth-light-angle),transparent 10%,#7b8def 22%,#d1b2ff 26%,transparent 29%,transparent 65%,#9574cf 78%,transparent 82%); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; animation:auth-card-edge 14s linear infinite; }
.auth-box { padding:32px; }
.auth-box .auth-tabs { padding:5px; gap:5px; border:1px solid #b4a0d32c; border-radius:12px; background:#09081080; margin-bottom:26px; }
.auth-box .auth-tabs button { border-radius:8px; min-height:42px; background:none; color:#c5b8d8; transition:background .2s,color .2s; }
.auth-box .auth-tabs button[aria-pressed=true] { background:#9980cf22; color:#efe3ff; box-shadow:inset 0 1px #dac4ff22; }
.auth-box .auth-form h2,.auth-card .auth-form h2 { letter-spacing:-.035em; font-size:27px; color:#f2ebff; margin-bottom:6px; }
.auth-box .auth-form,.auth-card .auth-form { gap:18px; }
.auth-box .auth-form label,.auth-card .auth-form label { color:#cec1dc; font-weight:450; font-size:13px; }
.auth-box .auth-form input:not([type=checkbox]),.auth-card .auth-form input:not([type=checkbox]) { width:100%; height:49px; border:1px solid #ae93ce3d; border-radius:10px; background:#ffffff05; color:#f0e8ff; padding:12px 14px; box-shadow:inset 0 2px 5px #0002; transition:border-color .2s,box-shadow .2s,background .2s; }
.auth-box .auth-form input:focus,.auth-card .auth-form input:focus { outline:2px solid #c5a3ff; outline-offset:2px; border-color:#9872db; background:#a58bc911; box-shadow:0 0 24px #9c70e316; }
.auth-password-field { display:block; position:relative; width:100%; min-width:0; }
.auth-box .auth-password-field input,.auth-card .auth-password-field input { padding-right:52px!important; }
.auth-box .auth-password-toggle,.auth-card .auth-password-toggle { position:absolute; right:5px; top:50%; transform:translateY(-50%); display:grid; place-items:center; width:39px; height:39px; min-height:0; padding:0; border:0; border-radius:7px; background:none; color:#b9a5d1; cursor:pointer; }
.auth-password-toggle svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.6; }.auth-password-toggle:hover { background:#ae8ade16; color:#e5cbff; }
.auth-box .primary,.auth-card .button.primary { color:#f1e4ff; background:linear-gradient(150deg,#322738,#0c0b11); border:1px solid #b491e46b; border-radius:11px; min-height:48px; box-shadow:inset 0 1px #e4c8ff30,0 3px 15px #0004; transition:box-shadow .2s,border-color .2s,transform .2s; }
.auth-box .primary:hover:not(:disabled),.auth-card .button.primary:hover:not(:disabled) { box-shadow:inset 0 1px #e4c8ff50,0 0 25px #9d6de031; border-color:#c0a0edb3; transform:translateY(-1px); }
.auth-box .primary:disabled { opacity:.5; cursor:not-allowed; }
.auth-box .google-entry>button { background:#ffffff05; border:1px solid #bda8d530; border-radius:10px; min-height:46px; }
.auth-box .invite-link,.auth-card .text-button { color:#ceb3fa; }
.auth-box .auth-help { margin-top:22px; padding-top:16px; color:#b7a9c8; }
.auth-box a:focus-visible,.auth-box button:focus-visible,.auth-card button:focus-visible { outline:2px solid #d3b3ff; outline-offset:3px; }
.auth-box .registration-legal { border-color:#b497da36; background:#13101bb3; border-radius:10px; }
.auth-box .registration-legal label { line-height:1.6; }
.auth-box .quiet,.auth-box small,.auth-box .muted { color:#bfb0cf; }
.auth-box .auth-form small { margin-top:-8px; }
.auth-box [hidden],.auth-card [hidden] { display:none!important; }
html.auth-effects-hidden .auth-box::before,html.auth-effects-hidden .auth-card::before { animation-play-state:paused; }
@keyframes auth-card-edge { to { --auth-light-angle:385deg; } }
@keyframes auth-card-enter { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }
@media(max-width:720px) { .auth-box { padding:24px; border-radius:19px; }.auth-box .auth-form h2,.auth-card .auth-form h2 { font-size:25px; }.guest-layout { gap:24px; }.guest-story .auth-scene { display:none; } }
@media(max-width:380px) { .auth-box { padding:20px 17px; }.auth-box .auth-help { gap:7px; }.auth-box .auth-form h2 { font-size:23px; } }
@media(prefers-reduced-motion:reduce) { .auth-box,.auth-card,.auth-box::before,.auth-card::before { animation:none!important; }.auth-box *,.auth-card * { transition:none!important; } }
@media(forced-colors:active) { .auth-box::before,.auth-card::before { display:none; }.auth-box,.auth-card { border-color:CanvasText; } }

.auth-box.auth-card-offscreen::before,.auth-card.auth-card-offscreen::before { animation-play-state:paused; }
