/* Faymoo connected worlds — shared presentation tokens. */
:root{--brand:#7a1d5e;--brand-hover:#601247;--brand-soft:#feeef9;--accent:#7a1d5e;--accentSoft:#feeef9;--bg:#fff9fd;--ink:#3b1630;--muted:#7f6978;--line:#f2ddec;--own:#fee2f5}
body.dark{--bg:#241720;--panel:#34212e;--ink:#fff7fc;--muted:#d5bece;--line:#5e3f55;--own:#663959;--accentSoft:#4e2e44}
body.dark .wordmark img,body.dark .faymooWelcomeLogo{background:#fff9fd;padding:5px;border-radius:6px}
.preview{background:#feeef9;color:#7a1d5e}.brand{display:inline-flex;align-items:center;gap:8px}.brand img{display:block;width:155px;height:auto}.brand span{font-size:16px;letter-spacing:0}
.phoneBrandLogo,.wordmark img,.deskNav img{height:auto}.phoneHero img{border-radius:28px}
.listFoot,.settingsSignature{color:var(--muted)}
@media(max-width:480px){header .brand img{width:120px}.brand span{font-size:13px}}

/* Approved Faymoo purple-magenta presentation, shared by iOS and Android. */
:root{--brand-gradient:linear-gradient(105deg,#7a1d5e 0%,#a63c83 55%,#b6458e 100%)}
button.primary,.deskBlue,.phoneScreen .primary{background:var(--brand-gradient);color:#fff;border:0;border-radius:28px;min-height:52px}
button.primary:disabled{opacity:.55;cursor:wait}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #7a1d5e;outline-offset:3px}
#modal.phoneAuth .phoneScreen{padding-bottom:max(24px,env(safe-area-inset-bottom));color:#3b1630}
#modal.phoneAuth .phoneScreen h2{letter-spacing:-.035em;line-height:1.12}
#modal.phoneAuth .phoneScreen h2 .phoneAccent{color:#a42a7f}
#modal.phoneAuth .phoneBrandLogo{width:210px;max-width:65vw}
#modal.phoneAuth input,#modal.phoneAuth select{border:1px solid #f4daec;border-radius:18px;min-height:54px;font-size:16px}
#modal.phoneAuth .phoneSteps i.active{background:var(--brand-gradient)}
@media(max-width:600px){#modal.phoneAuth .phoneScreen h2{font-size:clamp(32px,9vw,44px)}}

/* Approved reference signup — real controls over a quiet connected-world backdrop. */
#modal.phoneAuth.referenceSignup .phoneScreen{text-align:center;min-height:850px;padding:56px 36px 150px;background:#fff8fd;overflow:hidden}
#modal.referenceSignup .phoneBrand{margin:0 0 32px}
#modal.referenceSignup .phoneBrandLogo{width:260px;max-width:85%}
#modal.referenceSignup .signupTagline{font-size:15px;letter-spacing:2px;margin:0;color:#7e6275}
#modal.referenceSignup .phoneSteps{width:55%;gap:12px;margin:0 auto 42px}
#modal.referenceSignup .phoneSteps i{height:5px}
#modal.referenceSignup .phoneScreen h2{font-size:clamp(36px,9vw,46px);font-weight:800;color:#791b5d;line-height:1.12;margin-bottom:24px}
#modal.referenceSignup .phoneScreen h2 .phoneAccent{color:#b6458e}
#modal.referenceSignup .phoneScreen>p{font-size:16px;margin-bottom:22px}
#modal.referenceSignup form{gap:14px;margin:0}
#modal.referenceSignup form label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#modal.referenceSignup #phoneCountry{padding:16px;background:#ffffffb8;box-shadow:0 8px 20px #ab1b800b;border-radius:14px}
#modal.referenceSignup .phoneRow{grid-template-columns:90px 1fr;gap:0;border:1px solid #f4daec;border-radius:14px;background:#ffffffb8;padding:4px;box-shadow:0 8px 20px #ab1b800b}
#modal.referenceSignup .phoneRow input{border:0;background:transparent;border-radius:0;padding:12px;min-height:48px}
#modal.referenceSignup #countryCode{border-right:1px solid #f4daec}
#modal.referenceSignup .primary{background:linear-gradient(105deg,#7a1d5e,#a63c83 55%,#b6458e);border-radius:32px;min-height:58px;font-size:20px;margin-top:10px;box-shadow:0 12px 25px #95227335}
#modal.referenceSignup .primary span{margin-left:16px;font-size:26px}
#modal.referenceSignup .phoneFoot{margin:0;padding-top:18px}
#modal.referenceSignup .smsPromise{font-size:14px;margin:0}
#modal.referenceSignup .microNote{font-size:10px;margin:14px 0 0}
#modal.referenceSignup .phoneScreen::before{opacity:.13}
#modal.referenceSignup .phoneScreen::after{content:'';position:absolute;z-index:-1;width:115%;height:240px;bottom:-90px;left:-7.5%;border-radius:50% 50% 0 0;background:repeating-linear-gradient(20deg,transparent 0 48px,#ffffff80 49px 50px),repeating-linear-gradient(100deg,transparent 0 70px,#ffffff80 71px 72px),radial-gradient(ellipse at 50% 0%,#f8dcf0,#fee8f7 65%);border:8px solid #fbe7f5;opacity:.8;pointer-events:none}
@media(max-width:600px){#modal.phoneAuth.referenceSignup .phoneScreen{min-height:100dvh;padding-top:calc(42px + env(safe-area-inset-top));padding-bottom:130px}}
@media(max-height:700px){#modal.phoneAuth.referenceSignup .phoneScreen{padding-top:24px}.referenceSignup .phoneBrand{margin-bottom:20px!important}#modal.referenceSignup .phoneSteps{margin-bottom:28px}}