:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color-scheme:light;color:#10243c;background:#f5f8fd;font-size:15px}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(ellipse 850px 450px at 10% -10%,#dde9ff,transparent 65%),#f6f8fc}
.shell{max-width:760px;padding:28px 24px 45px;margin:auto}
.header{display:flex;justify-content:space-between;align-items:center;gap:14px}
.brand{display:flex;gap:12px;align-items:center}
.brand-symbol{height:48px;width:48px;border-radius:15px;display:grid;place-items:center;font-size:26px;font-weight:900;background:linear-gradient(145deg,#2768cf,#0d295f);color:white;box-shadow:0 10px 24px #193c741a}
.brand strong{display:block;font-size:14px;letter-spacing:.07em}
.brand span{font-size:12px;color:#66788d;margin-top:4px;display:block}
.private{font-size:12px;color:#50677e;white-space:nowrap}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#27b58a;margin-right:5px}
.hero{padding:56px 0 25px}
.eyebrow{font-weight:800;font-size:11px;letter-spacing:.15em;color:#2467cb}
h1{font-size:clamp(27px,5vw,39px);letter-spacing:-.045em;line-height:1.2;margin:12px 0 12px}
.hero p,.muted{color:#65768a;line-height:1.58}
.hero p{max-width:560px;margin:0}
.panel{background:#fff;border:1px solid #e0e7f1;border-radius:24px;box-shadow:0 22px 65px #162e5510;padding:29px}
h2{font-size:20px;letter-spacing:-.025em;margin:0}
.login-embed{margin:25px 0 10px}
.userline{display:flex;justify-content:space-between;align-items:center;gap:12px}
.userline h2{margin-top:6px}
.text-button{border:0;background:none;color:#2467cb;cursor:pointer;font-weight:600}
.balance{margin:25px 0;background:#f3f7fc;border:1px solid #e0e9f5;padding:20px;border-radius:16px;display:flex;flex-direction:column;gap:7px}
.balance span{font-size:13px;color:#556d86}
.balance strong{font-size:31px;letter-spacing:-.04em}
label{display:block;font-weight:650;margin:18px 0 10px}
.amount-row{display:flex;align-items:center;gap:8px;border:1px solid #cfdced;border-radius:14px;padding:12px 16px}
.amount-row span{font-size:19px;font-weight:650;color:#57708c}
.amount-row input{min-width:0;flex:1;border:0;outline:none;font-size:21px;font-weight:650;color:#10243c;background:transparent}
.primary{background:#205bcc;color:#fff;border:0;border-radius:13px;padding:17px;font-weight:750;cursor:pointer;width:100%;margin-top:14px;font-size:15px;box-shadow:0 8px 18px #205bcc2a}
.primary:disabled{opacity:.55;cursor:not-allowed}
.fineprint{font-size:12px;line-height:1.6;color:#63748a;margin:16px 0 0}
.message{padding:12px 14px;margin-top:16px;background:#fff5f3;color:#9d3829;border-radius:10px;border:1px solid #ffdad4}
footer{color:#8090a3;font-size:12px;text-align:center;margin-top:34px}
[hidden]{display:none!important}
@media(max-width:520px){.shell{padding:17px 15px 32px}.hero{padding:38px 0 23px}.panel{border-radius:18px;padding:20px}.private{display:none}.brand-symbol{width:42px;height:42px}.balance strong{font-size:27px}}
@media(prefers-color-scheme:dark){:root{color-scheme:dark;background:#0d1522;color:#f0f5ff}body{background:radial-gradient(ellipse 750px 330px at 10% -10%,#1c3d65,transparent 70%),#0d1522}.brand span,.private,.hero p,.muted{color:#a5b6ca}.panel{background:#141f30;border-color:#304057;box-shadow:none}.balance{background:#1c2a3e;border-color:#334765}.balance span,.fineprint{color:#b4c2d3}.amount-row{border-color:#42566e}.amount-row input{color:#fff}.message{background:#3b242a;border-color:#70404a;color:#ffc4c0}}

/* Whop card entry belongs to the ExpressesimTR page; the iframe owns PCI data. */
.checkout-area{margin-top:21px;padding-top:19px;border-top:1px solid #e1e8f3}
.checkout-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.checkout-head h3{font-size:19px;line-height:1.3;margin:7px 0 0}
.checkout-total{font-size:17px;font-weight:750;margin:14px 0 12px}
.whop-checkout-embed{display:block;width:100%;min-height:330px;max-width:100%;overflow:visible}
.backup-link{display:block;text-align:center;padding:12px 16px;border-radius:12px;background:#205bcc;color:white;font-weight:700;text-decoration:none;margin-top:12px}
@media(max-width:520px){.checkout-head h3{font-size:17px}.checkout-area{margin-top:16px}.whop-checkout-embed{min-height:390px}}

/* ExpressesimTR compact web checkout — no extra page navigation. */
.hero{padding:28px 0 18px}
.hero h1{font-size:clamp(24px,4.4vw,32px);margin:8px 0}
.hero p{font-size:14px;line-height:1.5}
.panel{padding:23px;border-radius:19px}
.balance{margin:18px 0;padding:17px;border-radius:14px}
.balance strong{font-size:clamp(24px,4vw,30px)}
.quick-amounts{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 2px}
.quick-amount{border:1px solid #d1deee;border-radius:11px;background:#f2f7ff;color:#164376;padding:11px 14px;font-weight:700;font-size:13px;cursor:pointer;min-height:42px}
.quick-amount:focus-visible{outline:2px solid #2a73d2;outline-offset:3px}
.quick-amount:hover{background:#e7f0ff}
.primary{min-height:52px;margin-top:15px}
@media(max-width:520px){
 .hero{padding:18px 0 14px}
 .shell{padding:16px 13px 26px}
 .panel{padding:17px}
 .header .brand-symbol{height:40px;width:40px}
 .quick-amount{flex:1;min-width:calc(50% - 6px)}
 .primary{min-height:54px}
}
@media(prefers-color-scheme:dark){
 .quick-amount{background:#1a3454;color:#d7eaff;border-color:#385877}
 .quick-amount:hover{background:#254468}
}

/* Telegram in-app card payment: account-specific actions stacked in reading order. */
.payment-modes{display:grid;grid-template-columns:1fr;gap:10px;margin:18px 0 16px}
.payment-mode{display:flex;align-items:center;justify-content:center;min-height:54px;padding:12px 15px;border-radius:13px;text-align:center;font-size:16px;font-weight:780;cursor:pointer;border:2px solid #d5e0f0;background:#f4f8ff;color:#23456d}
.payment-mode.active{background:#164fc1;color:#fff;border-color:#164fc1;box-shadow:0 7px 19px rgba(15,65,158,.15)}
.payment-mode:focus-visible{outline:3px solid #5598e9;outline-offset:3px}
@media(max-width:520px){.payment-modes{gap:9px}.payment-mode{min-height:58px;font-size:15px}}
@media(prefers-color-scheme:dark){.payment-mode{background:#1c304b;border-color:#405979;color:#e5efff}.payment-mode.active{background:#306bd5;color:#fff;border-color:#306bd5}}