:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:#0f172a;background-color:#f6f7fb;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background-color:#f6f7fb;min-height:100vh;margin:0}.page{min-height:100vh;padding:2rem 1.5rem 3rem;padding-top:calc(2rem + env(safe-area-inset-top));padding-bottom:calc(3rem + env(safe-area-inset-bottom));flex-direction:column;justify-content:flex-start;align-items:center;gap:1.5rem;display:flex}.page__header{text-align:center;flex-direction:column;align-items:center;gap:.75rem;width:min(720px,100%);display:flex}.page__title{letter-spacing:-.02em;margin:0;font-size:clamp(2rem,4vw,2.5rem);font-weight:700}.page__subtitle{color:#475569;margin:0;font-size:1rem}.page__content{width:min(720px,100%)}.card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;flex-direction:column;gap:1.25rem;padding:1.5rem;display:flex;box-shadow:0 12px 40px #0f172a14}.card--plain{box-shadow:none;background:0 0;border:none;padding:0}.card__header{flex-direction:column;gap:.5rem;display:flex}.card__eyebrow{letter-spacing:.08em;text-transform:uppercase;color:#64748b;margin:0;font-size:.85rem;font-weight:700}.card__title{margin:0;font-size:1.4rem;font-weight:700}.card__subtitle{color:#475569;margin:0;line-height:1.5}.card__section{flex-direction:column;gap:.75rem;display:flex}.card__status{color:#0f172a;margin:0;font-weight:600}.button{appearance:none;color:#fff;cursor:pointer;background:#0f172a;border:none;border-radius:12px;padding:.85rem 1rem;font-weight:700;transition:transform .12s,box-shadow .12s,opacity .12s}.button:hover{transform:translateY(-1px);box-shadow:0 10px 25px #0f172a26}.button:disabled{opacity:.7;cursor:not-allowed;box-shadow:none;transform:none}.button--secondary{color:#0f172a;background:#e2e8f0}.button--magic{color:#fff;background:linear-gradient(135deg,#10b981,#22c55e);padding-inline:1.25rem;font-size:1rem;font-weight:700}.button--magic-sent{color:#fff;cursor:default;background:linear-gradient(135deg,#2563eb,#3b82f6);padding-inline:1.25rem;font-size:1rem;font-weight:700}.auth-form__label{color:#0f172a;font-weight:700;display:block}.auth-form__input{background:#f8fafc;border:1px solid #cbd5e1;border-radius:12px;width:100%;padding:.85rem 1rem;font-size:1rem}.auth-form__input:focus{background:#fff;outline:2px solid #0f172a}.user-details{gap:.5rem;margin:0;display:grid}.user-details__row{background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;justify-content:space-between;padding:.75rem .85rem;display:flex}.user-details dt{color:#0f172a;margin:0;font-weight:700}.user-details dd{color:#334155;text-align:right;word-break:break-all;margin:0;font-weight:600}.user-card{width:100%;font-family:SF Pro Display,SF Pro Text,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.user-card__container{max-width:380px;margin:0 auto}.user-card__shell{background:#fff;border-radius:22px;flex-direction:column;display:flex;position:relative;overflow:hidden;box-shadow:0 18px 40px #0f172a1f}.user-card__hero{background:linear-gradient(135deg,#2563eb,#0ea5e9);border-radius:22px 22px 0 0;height:120px;position:relative}.user-card__hero-bg{background:radial-gradient(circle at 20% 20%,#fff3,#0000 45%),radial-gradient(circle at 80% 20%,#ffffff2e,#0000 40%);position:absolute;inset:0}.user-card__palette{grid-template-rows:repeat(2,32px);grid-template-columns:repeat(2,32px);gap:12px;display:grid;position:absolute;top:12px;left:12px}.user-card__swatch{cursor:pointer;background-size:cover;border:3px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;padding:0;transition:transform .12s,box-shadow .12s;display:inline-flex;position:relative}.user-card__swatch:hover{transform:scale(1.05);box-shadow:0 6px 14px #0f172a1f}.user-card__swatch--active{box-shadow:0 0 10px 4px #ffffff4d,0 0 16px 8px #fff3}.user-card__mode-button{color:#fff;cursor:pointer;background:#0f172a;border:none;border-radius:50%;place-items:center;width:46px;height:46px;transition:transform .12s,box-shadow .12s,opacity .12s;display:grid;position:absolute;top:14px;right:14px;box-shadow:0 12px 26px #0f172a29}.user-card__mode-button--confirm{background:#22c55e}.user-card__mode-button:disabled{opacity:.7;cursor:not-allowed;box-shadow:none;transform:none}.user-card__mode-button:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 14px 28px #0f172a2e}.user-card__avatar-wrapper{width:140px;height:140px;position:absolute;bottom:-64px;left:50%;transform:translate(-50%)}.user-card__avatar{background:#e2e8f0;border:6px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative;overflow:hidden;box-shadow:0 12px 28px #0f172a24}.user-card__avatar--editable{box-shadow:0 16px 34px #0f172a2e}.user-card__avatar-image{object-fit:cover;width:100%;height:100%}.user-card__avatar-fallback{background:linear-gradient(135deg,#cbd5e1,#e2e8f0);width:100%;height:100%}.user-card__avatar--neutral .user-card__avatar-fallback{background:linear-gradient(135deg,#d5d9e2,#e7eaf1)}.user-card__shell--loading{box-shadow:none;background:#f5f6fa}.user-card__shell--loaded{animation:.22s ease-out cardFadeIn}.user-card__hero--loading{background-size:200% 100%;height:110px;animation:1.4s ease-in-out infinite skeletonShimmer}.user-card__hero-bg--loading{opacity:.35;background-size:200% 100%;animation:1.4s ease-in-out infinite skeletonShimmer}.user-card__avatar--loading{background:#fff 0 0/200% 100%;border:1px dashed #e2e8f0;animation:1.4s ease-in-out infinite skeletonShimmer}.user-card__avatar-fallback--loading{background:#eef1f6 0 0/200% 100%;border-radius:999px;width:100%;height:100%;animation:1.4s ease-in-out infinite skeletonShimmer}.user-card__avatar-upload{color:#ffffffd9;cursor:pointer;opacity:.65;background:#0f172a8c;justify-content:center;align-items:center;font-size:2rem;font-weight:800;transition:opacity .12s;display:flex;position:absolute;inset:0}.user-card__avatar-upload-icon{justify-content:center;align-items:center;width:100%;height:100%;line-height:1;display:inline-flex}.user-card__avatar-upload:hover{opacity:.8}.user-card__avatar-input{opacity:0;cursor:pointer;position:absolute;inset:0}.avatar-dots{justify-content:center;align-items:center;gap:6px;display:flex}.avatar-dots span{opacity:.35;background:#fff;border-radius:50%;width:10px;height:10px;animation:1s ease-in-out infinite avatarDotPulse;display:block}.avatar-dots span:nth-child(2){animation-delay:.15s}.avatar-dots span:nth-child(3){animation-delay:.3s}@keyframes avatarDotPulse{0%,20%{opacity:.2}40%,60%{opacity:1}80%,to{opacity:.2}}.user-card__body{text-align:center;flex-direction:column;align-items:center;gap:.75rem;margin-top:80px;padding:0 1.5rem 1.85rem;display:flex}.user-card__fields{flex-direction:column;gap:.35rem;width:100%;display:flex}.user-card__field{width:100%;box-shadow:none;background:0 0;border:1px solid #0000;border-radius:12px;justify-content:center;align-items:center;padding:.5rem .65rem;display:flex}.user-card__field-row{box-shadow:none;background:0 0;border:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;width:100%;padding:0;display:grid}.user-card__field--stacked{box-shadow:none;background:0 0;border:1px solid #0000;border-radius:12px;width:100%;padding:.25rem 0}.user-card__field--primary{box-shadow:none;background:0 0;border:1px solid #0000;width:100%;padding-top:.25rem;padding-bottom:.35rem}.user-card__field--skeleton{background:#eef1f6 0 0/200% 100%;border:1px solid #e2e8f0;border-radius:14px;height:48px;animation:1.4s ease-in-out infinite skeletonShimmer}.user-card__field--login-email{background:#fff;border:1px solid #0f172a0d;border-radius:12px;padding:.5rem .65rem;box-shadow:0 10px 24px #0f172a24}.user-card__field--muted{box-shadow:none;border:1px solid #0000}.user-card__input{text-align:center;color:#6b7280;width:100%;box-shadow:none;background:0 0;border:none;border-radius:8px;outline:none;padding:0;font-size:1.05rem;font-weight:700;line-height:1.35}.user-card__input--display{font-size:1.5rem;font-weight:700;line-height:1.35}.user-card__input--email{color:#6b7280;font-size:1.3rem;font-weight:700;line-height:1.35}.user-card__input::placeholder{color:#94a3b8}.user-card__field-text{color:#6b7280;padding:0;font-size:1.2rem;font-weight:700;line-height:1.35;display:block}.user-card__shell--editing .user-card__field--primary{background:#fff;border:1px solid #0f172a0d;box-shadow:0 10px 24px #0f172a24}.user-card__field--primary .user-card__field-text{color:#6c7bd9;font-size:1.5rem}.user-card__field--stacked .user-card__field-text{font-size:1.5rem}.user-card__field--muted .user-card__field-text{color:#6b7280;font-size:1.3rem}.user-card__field-text--muted{color:#6b7280}.user-card__challenges{flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:1.25rem;width:100%;margin-bottom:1rem;display:flex}.user-card__skeleton-pill{background:#eef1f6 0 0/200% 100%;border:1px solid #e2e8f0;border-radius:999px;width:140px;height:32px;animation:1.4s ease-in-out infinite skeletonShimmer}.user-card__skeleton-pill--small{width:90px}.user-card__challenges-empty{color:#6b7280;margin:0;font-weight:600}.user-card__login-copy{color:#6b7280;margin:0;font-weight:600;line-height:1.5}.challenge-badge{flex-direction:column;align-items:center;gap:.35rem;min-width:72px;display:flex}.challenge-badge__label{color:#6b7280;text-align:center;font-size:.8rem}.challenge-badge__pill{color:#fff;border-radius:50%;place-items:center;width:64px;height:64px;font-weight:800;display:grid;box-shadow:0 8px 20px #0f172a26}.challenge-badge__pill--in{background:#16a34a}.challenge-badge__pill--out{background:#ef4444}.user-card__actions{justify-content:space-between;gap:1rem;width:100%;padding-right:.5rem;display:flex}.user-card__skeleton-link{background:#eef1f6 0 0/200% 100%;border-radius:6px;width:80px;height:14px;animation:1.4s ease-in-out infinite skeletonShimmer;display:inline-block}.user-card__skeleton-link--wide{width:120px}.user-card__link{color:#5b8def;cursor:pointer;background:0 0;border:none;padding:0;font-size:.9rem;font-weight:600;text-decoration:none}.user-card__link--danger{color:#d84b4b;text-decoration:none}@keyframes skeletonShimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes cardFadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (max-width:480px){.page{padding:1.5rem 1.25rem 2.5rem;padding-top:calc(1.5rem + env(safe-area-inset-top));padding-bottom:calc(2.5rem + env(safe-area-inset-bottom))}.page__title{font-size:1.85rem}}