/* Mivo Wellness sign up / log in page: frosted-glass card (iOS style) over a soft moving teal and purple background.
   Uses the --mw-* tokens from wellness.css. */
.auth-body{background:#dfeceb}
.auth{position:relative;isolation:isolate;display:grid;min-height:100vh;min-height:100svh;overflow:hidden;border:0;background:linear-gradient(135deg,#e3f0ee 0%,#cfe4e1 40%,#ddd8ec 100%)}

/* Background: blurred colour blobs drifting behind the glass */
.auth-bg{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.auth-bg i{position:absolute;display:block;border-radius:50%;filter:blur(60px);opacity:.75;animation:auth-drift 22s ease-in-out infinite alternate}
.auth-bg i:nth-child(1){width:46vmax;height:46vmax;left:-12vmax;top:-14vmax;background:#7fb9b3}
.auth-bg i:nth-child(2){width:38vmax;height:38vmax;right:-10vmax;top:6vh;background:#9a90c4;animation-duration:26s;animation-delay:-6s}
.auth-bg i:nth-child(3){width:34vmax;height:34vmax;left:28vw;bottom:-16vmax;background:#5f9d98;animation-duration:30s;animation-delay:-12s}
.auth-bg i:nth-child(4){width:22vmax;height:22vmax;right:18vw;bottom:8vh;background:#f2c9b8;opacity:.6;animation-duration:24s;animation-delay:-3s}
.auth-bg i:nth-child(5){width:18vmax;height:18vmax;left:8vw;top:52vh;background:#c3e0dc;animation-duration:20s;animation-delay:-9s}
@keyframes auth-drift{0%{transform:translate(0,0) scale(1)}50%{transform:translate(6vw,4vh) scale(1.08)}100%{transform:translate(-4vw,-3vh) scale(.95)}}

/* Left: brand and story (sits on the background, no panel) */
.auth-art{display:flex;flex-direction:column;padding:1.5rem 1.25rem 0}
.auth-brand{display:inline-flex;align-items:center;gap:.6rem;align-self:flex-start;font:1.25rem/1 Inter,system-ui,sans-serif;letter-spacing:-.01em;white-space:nowrap}
.auth-brand .wl-tile{width:46px;height:34px}
.auth-brand .wp-word b{font-weight:800;color:#11302a}
.auth-brand .wp-word span{font-weight:500;color:#1fa855}
.auth-art-body{display:none}
.auth-art .mw-girl{width:min(100%,340px);margin:0 0 1.5rem;filter:drop-shadow(0 24px 30px rgba(44,74,72,.18))}
.auth-art .eyebrow{margin-bottom:1rem}
.auth-art h1{max-width:28rem;font-size:3rem;line-height:1.02;color:var(--mw-ink);text-wrap:balance}
.auth-lede{max-width:26rem;margin-top:1.25rem;font-size:1.05rem;line-height:1.6;color:var(--mw-ink-2)}
.auth-points{display:grid;gap:.85rem;margin-top:2rem}
.auth-points li{display:flex;align-items:center;gap:.85rem;font:400 .95rem/1.4 var(--mw-font);color:var(--mw-ink)}
.auth .mw-tick{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;color:var(--m4)}
.auth .mw-tick svg{width:15px;height:15px}
.auth-points .mw-tick,.auth-in .mw-tick{background:rgba(255,255,255,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}

/* Right: the glass card */
.auth-main{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.25rem 1rem 3rem}
.auth-back{display:inline-flex;align-items:center;gap:.5rem;align-self:flex-start;margin-bottom:1.25rem;padding:.55rem 1rem;border:1px solid rgba(255,255,255,.6);border-radius:999px;background:rgba(255,255,255,.3);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);font:500 .82rem/1 var(--mw-font);color:var(--mw-ink);transition:background .2s}
.auth-back:hover{background:rgba(255,255,255,.55)}
.auth-back svg{width:13px;height:12px}
.auth-card{position:relative;width:100%;max-width:440px;padding:1.6rem 1.4rem 1.4rem;border:1px solid rgba(255,255,255,.65);border-radius:2rem;background:linear-gradient(145deg,rgba(255,255,255,.52),rgba(255,255,255,.22));-webkit-backdrop-filter:blur(30px) saturate(170%);backdrop-filter:blur(30px) saturate(170%);box-shadow:0 30px 70px -30px rgba(44,74,72,.45),inset 0 1px 0 rgba(255,255,255,.85),inset 0 -1px 0 rgba(255,255,255,.2)}
.auth-card::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:radial-gradient(120% 60% at 0 0,rgba(255,255,255,.55),transparent 60%);pointer-events:none}
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.auth-card{background:rgba(255,255,255,.9)}}

/* iOS-style segmented control */
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-bottom:1.5rem;padding:4px;border-radius:14px;background:rgba(118,118,128,.14)}
.auth-tabs button{padding:.6rem;border-radius:10px;font:500 .9rem/1.2 var(--mw-font);color:var(--mw-ink-2);transition:background .25s,color .25s,box-shadow .25s}
.auth-tabs button[aria-selected=true]{background:rgba(255,255,255,.92);color:var(--mw-ink);box-shadow:0 3px 8px rgba(0,0,0,.08),0 1px 1px rgba(0,0,0,.05)}

.auth-form h2{margin-bottom:.4rem;font:600 1.5rem/1.2 var(--mw-font);letter-spacing:-.01em;color:var(--mw-ink)}
.auth-card .mw-lbl{color:var(--mw-ink)}
.auth-card .mw-in{border-color:rgba(255,255,255,.7);background:rgba(255,255,255,.5);padding:.8rem .95rem;font-size:.95rem;transition:background .2s,border-color .2s,box-shadow .2s}
.auth-card .mw-in:focus{background:rgba(255,255,255,.8)}
.auth-pw{position:relative}
.auth-pw .mw-in{padding-right:4.2rem}
.auth-eye{position:absolute;top:50%;right:.5rem;padding:.35rem .6rem;border-radius:8px;transform:translateY(-50%);font:500 .75rem/1 var(--mw-font);color:var(--m3)}
.auth-eye:hover{background:rgba(255,255,255,.6)}
.auth-check{display:flex;align-items:flex-start;gap:.6rem;margin-top:1rem;font:400 .82rem/1.45 var(--mw-font);color:var(--mw-ink-2);cursor:pointer}
.auth-check input{flex:none;width:18px;height:18px;margin:.1rem 0 0;accent-color:var(--mw-teal)}
.auth-err{margin-top:1rem;padding:.7rem .9rem;border:1px solid rgba(162,74,60,.25);border-radius:.8rem;background:rgba(251,239,236,.8);font:400 .83rem/1.45 var(--mw-font);color:#7d3328}
.auth-card .mw-btn-block{padding:.85rem 1.25rem;font-size:.95rem;box-shadow:0 10px 24px -12px rgba(63,110,106,.8)}
.auth-card .mw-btn-ghost{box-shadow:none;background:rgba(255,255,255,.35)}
.auth-card .mw-btn-ghost:hover{background:var(--m3)}
.auth-card .mw-btn:disabled{opacity:.65;cursor:progress}
.auth-switch{margin-top:1rem;text-align:center;font:400 .85rem/1.4 var(--mw-font);color:var(--mw-ink-2)}
.auth-switch a{font-weight:500;color:var(--m4);text-decoration:underline;text-underline-offset:3px}
.auth-fine{margin-top:1.4rem;padding-top:1.1rem;border-top:1px solid rgba(255,255,255,.6);font:400 .75rem/1.5 var(--mw-font);color:var(--mw-ink-2)}
.auth-in{display:grid;justify-items:center;gap:.75rem;text-align:center}
.auth-in .mw-tick{width:52px;height:52px}
.auth-in .mw-tick svg{width:24px;height:24px}
.auth-in p{margin-bottom:.5rem;font:500 1.15rem/1.4 var(--mw-font);color:var(--mw-ink)}
.auth-in .mw-btn-block{margin-top:0}
.auth-delete{margin-top:.5rem;font:400 .8rem/1.4 var(--mw-font);color:#a24a3c;text-decoration:underline;text-underline-offset:3px}
.auth-delete.armed{font-weight:600}

@media (min-width:640px){.auth-card{padding:2.1rem 2rem 1.8rem}}
@media (min-width:960px){
  .auth{grid-template-columns:1.1fr 1fr}
  .auth-art{padding:2rem 2rem 3rem 3.5rem}
  .auth-art-body{display:flex;flex-direction:column;justify-content:center;flex:1}
  .auth-main{padding:3rem 3.5rem 3rem 1rem}
  .auth-back{align-self:center;width:100%;max-width:440px;justify-content:flex-start;border-color:transparent;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;padding-left:0}
}
@media (prefers-reduced-motion:reduce){.auth-bg i{animation:none}}

/* Country picker (country.js): a button like the other fields, and a popover with a search box and the list */
.cty{position:relative}
.cty-btn{display:flex;align-items:center;gap:.6rem;text-align:left;cursor:pointer}
.cty-btn .cty-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cty-btn.cty-unset .cty-name{color:var(--mw-ink-3)}
.cty-chev{flex:none;width:16px;height:16px;color:var(--mw-ink-2);transition:transform .2s}
.cty.open .cty-chev{transform:rotate(180deg)}
.cty.open .cty-btn{border-color:var(--mw-teal);box-shadow:0 0 0 3px rgba(95,157,152,.25);background:rgba(255,255,255,.8)}
.cty-code{display:inline-grid;place-items:center;flex:none;min-width:2.1rem;height:1.5rem;padding:0 .35rem;border-radius:.45rem;background:#e4efed;font:600 .66rem/1 "JetBrains Mono",ui-monospace,monospace;letter-spacing:.06em;color:#3f6e6a}
.cty-dash{background:#eef1f0;color:var(--mw-ink-3)}
.cty-pop{position:absolute;top:calc(100% + .45rem);left:0;right:0;z-index:20;padding:.5rem;border:1px solid var(--mw-line);border-radius:1.1rem;background:#fff;box-shadow:0 26px 50px -18px rgba(29,52,50,.35),0 4px 12px -6px rgba(29,52,50,.15);animation:cty-in .16s ease-out}
.cty-search{display:flex;align-items:center;gap:.55rem;height:44px;padding:0 .8rem;border-radius:.75rem;background:#f2f6f5;color:var(--mw-ink-3)}
.cty-search:focus-within{box-shadow:inset 0 0 0 1.5px var(--mw-teal)}
.cty-search svg{flex:none;width:16px;height:16px}
.cty-q{flex:1;min-width:0;padding:0;border:0;outline:0;background:none;font:400 .95rem/1.2 var(--mw-font);color:var(--mw-ink)}
.cty-q::placeholder{color:var(--mw-ink-3)}
.cty-list{position:relative;max-height:min(300px,45vh);margin:.4rem 0 0;padding:0;overflow-y:auto;overscroll-behavior:contain;list-style:none;scrollbar-width:thin}
.cty-group{padding:.75rem .7rem .35rem;font:500 .6rem/1 "JetBrains Mono",ui-monospace,monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--mw-ink-3)}
.cty-opt{display:flex;align-items:center;gap:.65rem;padding:.55rem .7rem;border-radius:.65rem;cursor:pointer;font:400 .9rem/1.3 var(--mw-font);color:var(--mw-ink)}
.cty-opt.on{background:#edf5f3}
.cty-opt[aria-selected=true]{font-weight:500}
.cty-opt mark{background:none;color:#3f6e6a;font-weight:600}
.cty-tick{flex:none;width:16px;height:16px;margin-left:auto;color:var(--mw-teal)}
.cty-none{padding:1rem .7rem .6rem;font:400 .85rem/1.4 var(--mw-font);color:var(--mw-ink-2)}
@keyframes cty-in{from{opacity:0;transform:translateY(-4px)}}
@media (prefers-reduced-motion:reduce){.cty-pop{animation:none}.cty-chev{transition:none}}
.cty-btn[aria-invalid=true]{border-color:#c0574f;box-shadow:0 0 0 3px rgba(192,87,79,.2)}

/* Account page: the country from sign-up, with its flag (flags.js) */
.auth-in .auth-country{display:inline-flex;align-items:center;gap:.55rem;margin:-.6rem 0 .6rem;padding:.4rem .9rem .4rem .55rem;border:1px solid rgba(255,255,255,.7);border-radius:999px;background:rgba(255,255,255,.55);font:500 .9rem/1.2 var(--mw-font);color:var(--mw-ink-2)}
.auth-flg{font:1.3rem/1 "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif}
.auth-flg-code{display:inline-grid;place-items:center;height:1.5rem;padding:0 .4rem;border-radius:.45rem;background:#e4efed;font:600 .68rem/1 "JetBrains Mono",ui-monospace,monospace;letter-spacing:.06em;color:#3f6e6a}