
/* ===== App pages (/start/, /checkout/, /account/) on the v3 site look (Oct 21 2026):
   light blush shell like the homepage, navy type, soft metallic gold accents, pink primary buttons.
   Loaded last on every app page. ===== */
:root{--ink:#14213D;--ink2:#1B2A4A;--paper:#FFFBFC;--tint:#FFF3F7;--line:rgba(20,33,61,.12);--muted:#4A5168;
 --gilt:#D4AF37;--gilt2:#C9A24A;--gilt-ink:#8A6A1F;--gold-ink:#8A6A1F;--champ:#FBF3DF;
 --shadow:0 1px 2px rgba(20,33,61,.04),0 24px 60px -30px rgba(20,33,61,.30)}
body.app{background:#FFFBFC;color:var(--ink);background-image:radial-gradient(900px 600px at 80% -10%,rgba(244,166,192,.30),transparent 60%),radial-gradient(700px 500px at -10% 30%,rgba(255,214,228,.55),transparent 60%),radial-gradient(700px 500px at 100% 100%,rgba(212,175,55,.10),transparent 60%);background-attachment:fixed}
body.app h1,body.app h2,body.app h3{color:var(--ink)}
::selection{background:rgba(212,175,55,.35);color:var(--ink)}

/* top bar: light glass, navy wordmark, thin gold rule */
.app-top{background:rgba(255,251,252,.85);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:var(--ink);border-bottom:1px solid rgba(212,175,55,.45);position:sticky;top:0;z-index:20}
.app-top a{color:var(--ink)}
.app-top img{box-shadow:0 0 0 1px rgba(212,175,55,.5)}
.app-top .top-link{color:var(--ink);font-weight:600;text-decoration:underline;text-decoration-color:var(--gilt);text-decoration-thickness:2px;text-underline-offset:5px}
.app-top .top-link:hover{color:var(--gilt-ink)}

/* type */
.eyebrow{color:var(--gilt-ink)!important}
h1.app-h{color:var(--ink)}
.app-h em,body.app h1 em,body.app h2 em{color:#C02C66}
.app-sub,.muted{color:var(--muted)}
.btn-link{color:#B0275A}

/* steps */
.steps li{background:#fff;border-color:var(--line);color:var(--muted)}
.steps li b{background:var(--tint);color:var(--ink)}
.steps li.on{background:#fff;border-color:var(--gilt2);color:var(--ink);box-shadow:0 0 0 3px rgba(212,175,55,.18)}
.steps li.on b{background:var(--ink);color:#E8C766}

/* cards */
.card{background:#fff;border:1px solid rgba(212,175,55,.35);box-shadow:var(--shadow)}
.card h2,.card h3{color:var(--ink)}

/* buttons: same pink as the homepage; navy secondary; gold focus halo */
.btn{background:var(--ink);color:#fff;border:1px solid var(--ink)}
.btn-gold,a.btn-gold,button.btn-gold{background:linear-gradient(135deg,#FBC9D9,#F4A6C0 55%,#EC8DAE)!important;color:var(--ink)!important;border:1px solid rgba(236,141,174,.9)!important;box-shadow:0 10px 26px -14px rgba(236,141,174,.95)!important}
.btn-gold:hover{background:linear-gradient(135deg,#F9BCD0,#EC8DAE)!important;border-color:#EC8DAE!important}
.btn-ghost,a.btn-ghost,button.btn-ghost{background:transparent;color:var(--ink)!important;border:1.5px solid rgba(20,33,61,.35)!important}
.btn-ghost:hover{background:var(--ink)!important;color:#fff!important;border-color:var(--ink)!important}
.btn-sm.nav-start{border:1px solid rgba(236,141,174,.9)!important}
.btn:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,button:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--ink)!important;outline-offset:3px;box-shadow:0 0 0 5px rgba(212,175,55,.5)!important}
.in:focus,.field input:not([type=checkbox]):focus,.field select:focus,.field textarea:focus,input:not([type=checkbox]):not([type=radio]):focus,textarea:focus,select:focus{border-color:var(--gilt2)!important;box-shadow:0 0 0 3px rgba(212,175,55,.28)!important;outline:none}
.in,.field input:not([type=checkbox]):not([type=radio]),.field select,.field textarea{border-color:rgba(20,33,61,.18)}

/* plan cards: navy featured card with gold hairline + badge */
.pcard{border-color:var(--line)}
.pcard.sel{border-color:var(--gilt2)!important;box-shadow:0 0 0 3px rgba(212,175,55,.25),var(--shadow)!important}
.pcard.dark{background:radial-gradient(90% 60% at 100% 0%,rgba(212,175,55,.18),transparent 60%),linear-gradient(160deg,#1B2A4A,#14213D);border:1.5px solid rgba(212,175,55,.7)!important;color:#fff}
.pcard.dark.sel{box-shadow:0 0 0 3px rgba(212,175,55,.45),var(--shadow)!important}
.pcard.dark .pname{color:#E8C766}
.pcard li:before{background-color:var(--gilt2)}
.pcard.dark li:before{background-color:var(--gilt)}
.pill,.pill2{background:linear-gradient(135deg,#E8D49A,#D4AF37)!important;color:var(--ink)!important;border:0!important}

/* account tabs + toggles */
.tabs button{border-color:var(--line);color:var(--ink)}
.tabs button.on{background:var(--ink);color:#fff;border-color:var(--ink);box-shadow:inset 0 -2px 0 var(--gilt)}
.ap-toggle{border-color:var(--line)}
.ap-toggle input{accent-color:#14213D}
.st-group{border-color:var(--line)}
.st-group[open]{border-color:rgba(212,175,55,.55)}
.st-ico{background:#FBF3DF}
.res:hover,.res:focus-visible,.add-btn:hover{border-color:var(--gilt2)!important}

/* footer */
.app-foot{border-top:1px solid rgba(212,175,55,.35);color:var(--muted)}
.app-foot a{color:var(--muted)}
.app-foot a:hover{color:var(--ink)}

@media (prefers-reduced-motion:reduce){.card{animation:none}}

/* checkout summary: navy with gold hairline */
.summary{background:radial-gradient(90% 60% at 100% 0%,rgba(212,175,55,.18),transparent 60%),linear-gradient(160deg,#1B2A4A,#14213D);border:1.5px solid rgba(212,175,55,.6);box-shadow:var(--shadow)}
.summary .k{color:#E8C766}

/* no test-mode wording on screen (the banner only ever appeared while payments run in test mode) */
.test-banner{display:none!important}

body.app .summary h1,body.app .summary h2,body.app .summary h3,body.app .summary h4,body.app .summary b,body.app .summary strong{color:#fff}
body.app .pcard.dark h2,body.app .pcard.dark h3,body.app .pcard.dark .pprice{color:#fff}

/* Hot-pink button borders restored (Roizy chose them Oct 15 2026; go-live Oct 21): pink fills stay, button outlines are #FF2D8A. */
.btn-gold,a.btn-gold,button.btn-gold,.btn-sm.nav-start{border:2px solid #FF2D8A!important}
.btn-gold:hover,.btn-sm.nav-start:hover{border-color:#FF2D8A!important}
.btn-ghost,a.btn-ghost,button.btn-ghost{border:2px solid #FF2D8A!important}
.btn-ghost:hover{border-color:#FF2D8A!important}

/* First-login "Your Ace has been born!" overlay is dark navy: keep its heading light (go-live Oct 21). */
body.app .ab-ov .ab-h{color:#fff!important}
body.app .ab-ov .ab-h em{color:#F4A6C0!important}
body.app .ab-ov h2,body.app .ab-ov h3{color:#fff!important}

/* ===== 7-day free trial (Oct 29 2026) ===== */
.trial-note{margin:-6px 0 18px;padding:12px 14px;border-radius:14px;background:#14213D;color:rgba(255,255,255,.85);font-size:.92rem;line-height:1.45;border:1px solid rgba(212,175,55,.45)}
.trial-note b{display:block;color:#fff;margin-bottom:2px}
.trial-box{border:1px solid rgba(212,175,55,.55);background:linear-gradient(180deg,#FBF6E6,#fff);border-radius:14px;padding:14px 16px}
.trial-box b{display:block;color:#14213D;font-size:1rem;margin-bottom:4px}
.trial-box p{margin:0;color:#4A5168;font-size:.92rem;line-height:1.45}
.trial-box p+p{margin-top:6px}
.s-trial{display:inline-block;margin:6px 0 4px;padding:5px 10px;border-radius:999px;background:linear-gradient(135deg,#E8D49A,#D4AF37);color:#14213D;font-weight:700;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase}
