/* The web account wears the account-security page's glass (/auth/action): one look for every account screen (CEO 2026-10-10). Prefixed wa- so nothing collides with the site's utilities. */
.wa-main{--wa-ink:#1f1f1d;--wa-soft:#4c4c48;--wa-secondary:#6e6e69;--wa-muted:#92928c;--wa-line:rgba(37,37,34,.10);--wa-glass:rgba(255,255,255,.68);--wa-field:rgba(246,246,243,.82);--wa-danger:#b42318;--wa-success:#21875b;--wa-accent:#f47a24;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,sans-serif;color:var(--wa-ink);-webkit-font-smoothing:antialiased;padding:88px 16px 48px}
@media (min-width:768px){.wa-main{padding-top:104px}}
.wa-main--center{min-height:calc(100dvh - 120px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}
.wa-wrap{max-width:980px;margin:0 auto;display:grid;gap:16px}
.wa-card{background:var(--wa-glass);border:1px solid rgba(255,255,255,.84);border-radius:28px;box-shadow:0 22px 58px rgba(28,28,25,.10),inset 0 1px 0 rgba(255,255,255,.82);-webkit-backdrop-filter:blur(28px) saturate(125%);backdrop-filter:blur(28px) saturate(125%);padding:22px 24px}
.wa-login{width:100%;max-width:390px;padding:24px}
@media (max-width:430px){.wa-card{border-radius:25px}.wa-login{padding:22px 19px}}
.wa-brand{display:flex;justify-content:center;margin:0 0 19px}
.wa-brand img{width:92px;height:40px;object-fit:cover}
.wa-secure{margin:0;color:rgba(65,65,60,.58);font-size:11px;text-align:center}
.wa-eyebrow{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--wa-muted);margin:0 0 10px}
.wa-login .wa-eyebrow{display:none}
.wa-h1{font-size:23px;line-height:1.2;letter-spacing:-.025em;font-weight:700;margin:0;color:var(--wa-ink)}
.wa-login .wa-h1{text-align:center;margin:0 0 8px}
.wa-h2{font-size:17px;letter-spacing:-.015em;font-weight:700;margin:0;color:var(--wa-ink)}
.wa-muted{color:var(--wa-secondary);margin:0;font-size:14px;line-height:1.45}
.wa-login > .wa-muted{text-align:center;margin:0 auto 18px}
.wa-small{font-size:14px;font-weight:400}
.wa-fine{color:var(--wa-muted);font-size:12px;margin:10px 0 0;line-height:1.5}
.wa-login .wa-fine{text-align:center}
.wa-center{text-align:center}.wa-right{text-align:right}
.wa-big{font-size:28px;font-weight:700;letter-spacing:-.02em;margin:2px 0 0;color:var(--wa-ink)}
.wa-stack{display:grid;gap:10px;margin:4px 0 6px}
.wa-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:47px;border-radius:15px;padding:0 18px;font:inherit;font-size:15px;font-weight:650;text-decoration:none;cursor:pointer;border:1px solid var(--wa-line);background:rgba(255,255,255,.72);color:var(--wa-ink);box-shadow:0 6px 18px rgba(28,28,25,.06),inset 0 1px 0 rgba(255,255,255,.9);transition:transform .15s ease,background .15s ease}
.wa-btn:hover{background:#fff;transform:translateY(-1px)}
.wa-btn:active{transform:scale(.985)}
.wa-btn:focus-visible{outline:4px solid rgba(244,122,36,.18);outline-offset:2px}
.wa-btn--ink{background:#242422;border-color:#242422;color:#fff;box-shadow:0 8px 22px rgba(26,26,23,.15),inset 0 1px 0 rgba(255,255,255,.18)}
.wa-btn--ink:hover{background:#11110f}
.wa-btn--sm{min-height:38px;padding:0 14px;font-size:14px;border-radius:12px}
.wa-btn[disabled],.wa-btn[aria-disabled="true"]{opacity:.38;cursor:default;transform:none}
.wa-ico{width:18px;height:18px;flex:none}
.wa-link{background:none;border:0;padding:0;font:inherit;font-size:13px;color:var(--wa-secondary);text-decoration:underline;cursor:pointer}
.wa-link:hover{color:var(--wa-ink)}
.wa-link--danger{color:var(--wa-danger)}
/* Manage billing is orange words, not a button (CEO 2026-10-14). The padding widens the tap target; the matching negative margin keeps the line where it was. */
.wa-link--accent{color:var(--wa-accent);font-size:inherit;font-weight:650;text-decoration:none;padding:8px 2px;margin:-8px -2px}
.wa-link--accent:hover{color:#d9600f;text-decoration:underline}
.wa-link--accent:focus-visible{outline:3px solid rgba(244,122,36,.28);outline-offset:1px;border-radius:6px}
.wa-link--accent[disabled]{opacity:.5;cursor:default}
.wa-error{color:var(--wa-danger);background:rgba(180,35,24,.06);border:1px solid rgba(180,35,24,.22);border-radius:12px;padding:10px 12px;font-size:13px;line-height:1.45;margin:0 0 14px}
.wa-notice{color:#1d5f42;background:rgba(33,135,91,.07);border:1px solid rgba(33,135,91,.20);border-radius:12px;padding:10px 12px;font-size:13px;line-height:1.45;margin:6px 0 14px}
.wa-profile{display:flex;align-items:center;gap:14px}
.wa-profile-text{flex:1;min-width:0}
.wa-profile-text .wa-muted{overflow-wrap:anywhere}
.wa-avatar{width:48px;height:48px;border-radius:50%;background:#242422;color:#fff;display:grid;place-items:center;font-weight:700;font-size:18px;flex:none;box-shadow:0 6px 16px rgba(26,26,23,.15)}
.wa-pill{background:rgba(255,255,255,.58);border:1px solid rgba(30,30,27,.06);border-radius:999px;padding:6px 12px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--wa-ink)}
.wa-row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.wa-meter{height:6px;background:rgba(37,37,34,.08);border-radius:999px;overflow:hidden;margin:12px 0 0}
.wa-meter-fill{height:100%;background:var(--wa-success);width:0;transition:width .3s}
/* The site's styles.css clips every <section> (overflow:hidden). The plan cards' current-plan ring is drawn 2px outside the card, so the section must not clip it (CEO 2026-10-14: the current plan box's left edge was cut off). */
.wa-section{display:grid;gap:14px;margin-top:6px;overflow:visible}
.wa-section-head{display:grid;gap:4px}
.wa-grid{display:grid;gap:14px;grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:900px){.wa-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.wa-grid{grid-template-columns:1fr}.wa-profile{flex-wrap:wrap}.wa-row{flex-wrap:wrap}}
.wa-plan{background:var(--wa-glass);border:1px solid rgba(255,255,255,.84);border-radius:22px;padding:18px;display:flex;flex-direction:column;gap:8px;box-shadow:0 14px 36px rgba(28,28,25,.08),inset 0 1px 0 rgba(255,255,255,.82);-webkit-backdrop-filter:blur(24px) saturate(125%);backdrop-filter:blur(24px) saturate(125%)}
/* The current plan is ringed in its own plan colour, as the app rings it (PlanAppearance.accent in the iOS app, CEO 2026-10-18). */
.wa-plan--starter{--wa-ring:#B5C9BF}.wa-plan--pro{--wa-ring:#A9C5BD}.wa-plan--max{--wa-ring:#D4C5AB}.wa-plan--business{--wa-ring:#B8C8AE}
.wa-plan--current{box-shadow:0 0 0 1.5px var(--wa-ring,#C3D2CD),0 14px 36px rgba(28,28,25,.10)}
.wa-plan-top{display:flex;justify-content:space-between;align-items:center}
.wa-plan-top .wa-eyebrow{margin:0}
.wa-plan-icon{width:18px;height:18px;color:var(--wa-secondary)}
.wa-plan-name{font-size:21px;font-weight:800;letter-spacing:-.01em;text-transform:uppercase;color:var(--wa-ink);line-height:1.1}
.wa-plan-price{display:flex;align-items:baseline;gap:4px}
.wa-price{font-size:26px;font-weight:800;letter-spacing:-.02em;color:var(--wa-ink)}
.wa-per{color:var(--wa-muted);font-size:13px}
.wa-plan-tagline{color:var(--wa-secondary);font-size:13px;border-top:1px solid rgba(37,37,34,.07);padding-top:9px}
.wa-bullets{list-style:none;padding:0;margin:0;display:grid;gap:7px;flex:1}
.wa-bullets li{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--wa-secondary);line-height:1.4}
.wa-bullets li::before{content:"";width:14px;height:14px;flex:none;margin-top:2px;border-radius:50%;border:1.5px solid var(--wa-ink);background:radial-gradient(circle at center,var(--wa-ink) 0 2px,transparent 2.5px)}
.wa-bonus{display:inline-block;align-self:flex-start;border-radius:999px;padding:4px 10px;font-size:12px;font-weight:700;color:var(--wa-success);background:rgba(33,135,91,.09)}
.wa-current{text-align:center;font-size:13px;font-weight:600;color:var(--wa-secondary);padding:12px 0}
/* On a phone the plan you already have is two lines, not a full card (CEO 2026-10-14): what it is and what it costs. */
@media (max-width:520px){
.wa-plan--current{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4px 12px;padding:14px 18px}
.wa-plan--current .wa-plan-top,.wa-plan--current>.wa-fine,.wa-plan--current .wa-plan-tagline,.wa-plan--current .wa-bullets,.wa-plan--current .wa-bonus{display:none}
.wa-plan--current .wa-current{grid-column:1/-1;order:-1;text-align:left;padding:0;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--wa-muted)}
.wa-plan--current .wa-plan-name{font-size:19px}
.wa-plan--current .wa-price{font-size:21px}
}
.wa-list{list-style:none;padding:0;margin:12px 0 14px;display:grid;gap:8px}
.wa-list li{display:flex;justify-content:space-between;gap:12px;align-items:center;background:var(--wa-field);border:1px solid var(--wa-line);border-radius:15px;padding:10px 14px;font-size:14px}
.wa-danger{padding:4px 6px 0}
.wa-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:var(--wa-field);border:1px solid var(--wa-line);border-radius:15px;padding:4px;margin:0 0 18px}
.wa-tab{text-align:center;padding:9px 8px;border-radius:11px;font-size:14px;font-weight:600;color:var(--wa-secondary);text-decoration:none}
.wa-tab--on{background:#fff;color:var(--wa-ink);box-shadow:0 1px 3px rgba(28,28,25,.10)}
.wa-form{display:grid;gap:7px;margin:4px 0 6px}
.wa-label{display:block;margin:6px 3px 0;color:var(--wa-soft);font-size:13px;font-weight:600}
.wa-input{width:100%;box-sizing:border-box;height:49px;padding:0 14px;border:1px solid var(--wa-line);border-radius:15px;outline:none;font:inherit;font-size:16px;color:var(--wa-ink);background:var(--wa-field);box-shadow:inset 0 1px 0 rgba(255,255,255,.66);transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}
.wa-input:focus{border-color:rgba(244,122,36,.72);background:rgba(255,255,255,.88);box-shadow:0 0 0 4px rgba(244,122,36,.11)}
.wa-code{text-align:center;letter-spacing:.3em;font-size:20px;font-weight:700}
.wa-turnstile{min-height:65px;margin:8px 0 2px}
.wa-form .wa-btn{margin-top:6px}
.wa-links{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;margin:12px 3px 0}
.wa-links--center{justify-content:center}
.wa-links a,.wa-fine a{color:var(--wa-secondary)}

/* A page the Oro app opened (Subscribe on the web, the purchase receipt): the
   owner is already signed in to the app, so the site's Sign in / Sign up
   corner is noise there (CEO 2026-10-13). shared.js still mounts it; this
   page does not show it. */
.wa-from-app #auth-logged-out{display:none!important}