/* Loading spinner */
.loading-spinner{width:36px;height:36px;border:4px solid #e0e0e0;border-top-color:#1a73e8;border-radius:50%;animation:spin .8s linear infinite;margin:20px auto}
@keyframes spin{to{transform:rotate(360deg)}}

/* Auth screen — fullscreen app feel */
.auth-screen{position:fixed;inset:0;z-index:999;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(135deg,#0f0f0f 0%,#1a1a2e 50%,#16213e 100%);padding:0;overflow:auto}
.auth-card{background:#fff;border-radius:0;padding:40px 28px;width:100%;max-width:100%;min-height:100vh;display:flex;flex-direction:column;justify-content:center;box-shadow:none}
@media(min-width:481px){.auth-card{max-width:460px;min-height:auto;border-radius:28px;margin:20px;box-shadow:0 16px 50px #0003}}
.auth-logo{display:flex;align-items:center;gap:12px;margin-bottom:32px;justify-content:center}
.auth-logo strong{font-size:1.7rem}
.auth-card h2{font-size:1.5rem;margin-bottom:6px}
.auth-card input{width:100%;padding:16px;border:1px solid #ddd;border-radius:14px;font:inherit;margin-bottom:12px;font-size:1rem}
.auth-input-group{position:relative}
.auth-input-group input{padding-left:44px}
.auth-input-icon{position:absolute;left:14px;top:16px;font-size:1.1rem;pointer-events:none}
.auth-err{color:#e44;font-size:.85rem;margin-bottom:10px;display:none}
.auth-link{text-align:center;color:var(--muted);margin-top:16px;font-weight:700}
.auth-link button{color:#111;font-weight:800;text-decoration:underline;border:none;background:none;font:inherit;cursor:pointer}

/* Invite banner */
.invite-banner{background:linear-gradient(135deg,#111,#1a1a2e);border-radius:20px;padding:28px;text-align:center;margin-bottom:20px}

/* Copy address button */
.copy-addr-btn{width:100%;padding:14px;background:#f0f7ff;color:#1a73e8;border:1px solid #1a73e8;border-radius:12px;font-weight:700;cursor:pointer;font:inherit;margin-bottom:14px}

/* Site notice */
.site-notice{padding:14px 18px;border-radius:12px;background:#fff3cd;color:#856404;font-weight:700;margin:14px 0;text-align:center}

/* Support FAB */
.support-fab{position:fixed;z-index:40;bottom:110px;right:20px;width:56px;height:56px;border-radius:50%;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.6rem;text-decoration:none;box-shadow:0 4px 20px #0003;transition:.2s}
.support-fab:hover{transform:scale(1.1)}

/* Video play button */
.video-play-btn{font-weight:800;border:none;background:none;cursor:pointer;color:#111;font:inherit;padding:0}

/* Existing styles below */
.hidden{display:none!important}
.segmented{display:flex;border-bottom:1px solid var(--line);gap:26px;margin:0 -28px 26px;padding:0 28px}
.segmented button{padding:10px 0 17px;color:var(--muted);font-weight:800;font-size:1.05rem;position:relative}
.segmented button.active{color:#111}
.segmented button.active:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;border-radius:3px;background:#111}
.wide-tabs{justify-content:space-around;gap:10px}
.wide-tabs button{flex:1}
.segment-panel{display:none}
.segment-panel.active{display:block;animation:fadeUp .25s ease}
@keyframes fadeUp{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
.notice{padding:15px 18px;border-radius:12px;background:#efebff;font-weight:700;margin:12px 0 14px}
.notice.neutral{background:#f3f3f4;color:#707075;text-align:center}
.text-link,.tutorial-link{font-weight:800;padding:10px 0;margin-bottom:15px}
.tutorial-link{width:100%;border-bottom:1px solid var(--line);padding-bottom:22px}
.filter-row{display:grid;grid-template-columns:1.6fr .8fr auto .8fr 1fr;gap:10px;align-items:center;margin:14px 0 20px}
.filter-row select,.filter-row input,.type-select{min-width:0;border:0;background:#f4f4f5;border-radius:11px;padding:14px 12px;font:inherit;font-weight:700}
.filter-row button{background:#111;color:#fff;border-radius:12px;padding:14px 12px;font-weight:800}
.task-list{display:grid;gap:12px}
.task-card{display:grid;grid-template-columns:1fr auto;gap:5px;padding:19px 0;border-bottom:1px solid var(--line)}
.task-card>strong{font-size:1.34rem}
.task-card button{grid-row:1/3;grid-column:2;background:#111;color:#fff;border-radius:12px;padding:11px 24px;font-weight:800}
.task-meta{display:flex;gap:36px}
.task-meta span{display:flex;flex-direction:column;color:var(--muted);font-size:.8rem}
.task-meta b{color:#111;font-size:.95rem;margin-top:4px}
.task-meta span:last-child b{color:var(--mint)}
.wallet-card{border:1px solid var(--line);border-radius:16px;padding:18px;position:relative}
.wallet-card small,.wallet-card strong{display:block}
.wallet-card small{color:var(--muted);margin-bottom:6px}
.wallet-card strong{overflow:hidden;text-overflow:ellipsis}
.wallet-card button{position:absolute;right:12px;top:20px}
.calc-head{display:flex;justify-content:space-between;margin:24px 0 10px}
.big-input{width:100%;min-height:82px;border:1px solid #aaa;border-radius:12px;padding:18px;font:inherit;font-size:1.2rem}
.calc-result{font-weight:700;line-height:1.8}
.fine-print{font-size:.84rem;font-weight:700}
.account-section{padding-bottom:150px}
.accordion{width:100%;display:flex;justify-content:space-between;padding:20px 0;font-size:1.17rem;font-weight:800;border-bottom:1px solid var(--line)}
.accordion-panel{display:grid;gap:12px;padding:18px 0}
.accordion-panel.hidden{display:none}
.account-card{border:1px solid var(--line);border-radius:18px;padding:18px;display:grid;grid-template-columns:52px 1fr auto;gap:13px;align-items:center;box-shadow:0 8px 28px #11100008}
.provider-icon{width:48px;height:48px;border-radius:13px;display:grid;place-items:center;color:#fff;background:#5824a4;font-weight:800}
.provider-icon.orange{background:#f17931}
.account-card strong,.account-card small{display:block}
.account-card small{color:var(--muted);margin-top:4px}
.switch{width:65px;height:30px;border-radius:30px;background:#c5c5c7;padding:3px;transition:.25s}
.switch:before{content:"";display:block;width:24px;height:24px;border-radius:50%;background:#fff;transition:.25s}
.switch.on{background:#55c878}
.switch.on:before{transform:translateX(35px)}
.account-footer{position:fixed;z-index:10;bottom:var(--nav-h);width:min(calc(100% - 56px),584px);background:#fffd;padding:16px 6px;backdrop-filter:blur(14px);display:grid;grid-template-columns:auto auto;gap:8px 18px}
.account-footer .primary-btn{grid-column:1/3;width:100%;font-size:1.05rem}
/* Team — themed hero (app black + mint) */
.team-hero{border-radius:26px;background:#111;color:#fff;padding:24px;position:relative;overflow:hidden}
.team-hero:after{content:"";position:absolute;inset:auto -80px -120px auto;width:250px;height:250px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#8cf1de,#16aa92 45%,#0a493e 71%);opacity:.9}
.team-hero-top{display:flex;align-items:center;gap:14px;margin-bottom:20px;position:relative;z-index:1}
.team-hero-icon{width:54px;height:54px;border-radius:16px;background:rgba(255,255,255,.12);display:grid;place-items:center;font-size:1.7rem}
.team-hero-count small{display:block;opacity:.75;font-size:.78rem;font-weight:600}
.team-hero-count strong{font-size:2.1rem;line-height:1.05}
.team-hero-badge{margin-left:auto;align-self:flex-start;background:rgba(49,190,166,.2);border:1px solid rgba(140,241,222,.45);color:#8cf1de;border-radius:999px;padding:6px 12px;font-size:.72rem;font-weight:800}
.team-hero-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;position:relative;z-index:1}
.team-hero-stats div{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:14px 16px}
.team-hero-stats span{display:block;opacity:.8;font-size:.78rem;font-weight:600;margin-bottom:8px}
.team-hero-stats strong{font-size:1.5rem;color:#8cf1de}
.team-hero-note{margin-top:14px;position:relative;z-index:1;background:rgba(49,190,166,.14);border:1px solid rgba(49,190,166,.4);color:#a9f5e6;border-radius:14px;padding:11px 14px;font-size:.85rem;font-weight:600}
.team-hero-note b{color:#fff}
.invite-cta{margin-top:16px;border-radius:18px;padding:15px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--panel);border:1px solid var(--line)}
.invite-cta-info{min-width:0}
.invite-cta-info small{display:block;color:#16aa92;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px}
.invite-cta-info span{display:block;font-weight:800;font-size:1.05rem;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.invite-copy{background:#111;color:#fff;border-radius:12px;padding:11px 20px;font-weight:800;white-space:nowrap}
.invite-copy:active{transform:scale(.96)}
.section-label{font-size:1.15rem;margin:24px 0 12px}
/* Get App button (home header) */
#appDownloadBtn{margin-left:auto;display:inline-flex;align-items:center;gap:6px;background:#111;color:#fff;border-radius:999px;padding:10px 18px;font-weight:800;font-size:.92rem}
#appDownloadBtn:active{transform:scale(.96)}
.empty-state{text-align:center;margin:50px auto;background:var(--panel);border-radius:22px;padding:34px}
.empty-state>span{display:block;font-size:2.4rem}
.empty-state>b{display:block;font-size:1.15rem;margin-top:10px}
.empty-state p{color:var(--muted)}
.profile-head{display:flex;align-items:center;gap:14px}
.profile-head h1{margin:0;font-size:1.35rem}
.profile-head p{margin:7px 0;color:#777}
.avatar{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#111;color:#fff;font-weight:800}
.quota{padding:36px 0}
.quota small{font-weight:800}
.quota div{display:flex;align-items:end;gap:8px;margin:18px 0 8px}
.quota strong{font-size:2.5rem}
.quota .primary-btn{margin-left:auto;padding:14px 28px}
.quota span{color:var(--muted);font-weight:700}
.mini-banner{border-radius:18px;background:linear-gradient(120deg,#111,#3a3a3d);color:#fff;padding:24px;margin-bottom:26px;font-weight:800}
.mini-banner b{float:right;color:#74e4cf}
.menu-list{display:grid;gap:12px}
.menu-list>button{display:grid;grid-template-columns:30px 1fr auto auto;align-items:center;text-align:left;border:1px solid var(--line);border-radius:16px;padding:18px;font-size:1.05rem;font-weight:700}
.menu-list em{font-style:normal;color:var(--muted);font-size:.85rem;margin-right:12px}
.subview,.bind-view{position:absolute;inset:0;background:#fff;z-index:30;overflow:auto;padding-bottom:30px}
.sub-head{display:grid;grid-template-columns:42px 1fr 42px;align-items:center;margin-bottom:22px}
.sub-head button{font-size:2.3rem;text-align:left}
.sub-head h1{text-align:center;font-size:1.35rem;margin:0}
.history-row{padding:12px 0}
.history-row>b{font-size:1.15rem}
.history-row dl{display:grid;grid-template-columns:auto 1fr;gap:16px;margin-top:22px}
.history-row dt{color:var(--muted)}
.history-row dd{text-align:right;font-weight:700}
.type-select{margin-bottom:22px}
.token-list{display:grid;gap:8px}
.token-list article{border-bottom:1px solid var(--line);padding:15px 4px;display:grid;grid-template-columns:1fr auto;gap:8px}
.token-list p,.token-list time{margin:0;color:var(--muted);grid-column:1/3}
.token-list time{text-align:right;font-size:.82rem}
.status{justify-self:start;padding:5px 8px;border-radius:6px;font-weight:700}
.status.mint{color:#20a98f;background:#e3faf5}
.status.pink{color:#dc5873;background:#fff0f3}
.status.gold{color:#9b7414;background:#fff8d7}
.overlay{position:fixed;z-index:50;inset:0;background:#0008;display:none;align-items:flex-end}
.overlay.open{display:flex}
.sheet{width:min(100%,640px);margin:auto;background:#fff;border-radius:28px 28px 0 0;padding:10px 28px 30px;animation:sheetUp .25s cubic-bezier(.2,.85,.3,1)}
@keyframes sheetUp{from{transform:translateY(100%)}to{transform:none}}
.grab{width:52px;height:5px;border-radius:4px;background:#ddd;margin:0 auto 20px}
.sheet h2{margin-top:0}
.sheet-actions{display:grid;gap:10px}
.sheet-actions button{padding:16px;border-radius:14px;background:#f3f3f4;font-weight:800}
.sheet-actions button.primary{background:#111;color:#fff}
.toast{position:fixed;z-index:100;left:50%;bottom:105px;transform:translate(-50%,20px);opacity:0;background:#111;color:#fff;border-radius:12px;padding:12px 18px;pointer-events:none;transition:.2s}
.toast.show{opacity:1;transform:translate(-50%,0)}
.steps{display:flex;align-items:flex-start;margin:20px 0 40px}
.steps span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#d1d1d3;color:#fff;font-weight:800;position:relative;flex:none}
.steps span.active,.steps span.done{background:#111}
.steps span.done{font-size:0}
.steps span.done:after{content:"\2713";font-size:1rem}
.steps b{height:2px;background:#ddd;flex:1;margin:16px 7px}
.steps i{position:absolute;top:43px;font-style:normal;color:#999;font-size:.7rem;white-space:nowrap}
.steps span.active i,.steps span.done i{color:#111}
.provider-list{display:grid;gap:12px}
.provider-btn{display:flex;align-items:center;gap:16px;border:1px solid var(--line);border-radius:18px;padding:18px;text-align:left;font-size:1.05rem;font-weight:800;cursor:pointer;background:none;color:inherit;font:inherit;font-weight:800}
.form-card{background:var(--panel);border-radius:18px;padding:20px}
.form-card label{display:block;font-weight:800;margin-bottom:9px}
.form-card input{width:100%;padding:18px;border:1px solid #ddd;border-radius:12px;font:inherit}
.form-card .primary-btn{width:100%;margin-top:18px}
.otp-inputs{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.otp-inputs input{min-width:0;text-align:center;font-size:1.2rem;padding:14px 4px}
.result-card{text-align:center;padding:45px 10px}
.result-check{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;margin:0 auto 18px;background:#dff9f3;color:#1eaa91;font-size:2rem}
.upi-choice{display:grid;gap:12px}
.upi-choice label{border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;gap:12px;align-items:center}
.fine{color:var(--muted);font-size:.82rem}
.spinner{width:32px;height:32px;border:3px solid #ddd;border-top-color:#111;border-radius:50%;animation:spin .8s linear infinite;margin:auto}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:480px){
  .segmented{margin-inline:-18px;padding-inline:18px}
  .filter-row{grid-template-columns:1.4fr .7fr auto .7fr}
  .filter-row button{grid-column:1/5}
  .account-footer{width:calc(100% - 36px)}
  .steps{margin-bottom:46px}
  .steps i{font-size:.59rem}
  .sheet{padding-inline:20px}
  .support-fab{bottom:100px;right:14px;width:50px;height:50px;font-size:1.4rem}
}

/* P2P Orders */
.p2p-list{display:grid;gap:10px}
.p2p-ad{display:flex;align-items:center;justify-content:space-between;padding:16px;border:1px solid #eee;border-radius:14px;background:#fafffe}
.p2p-ad-left{display:flex;flex-direction:column;gap:6px}
.p2p-ad-left b{font-size:1.05rem}
.p2p-badge{display:inline-block;background:#e8f5e9;color:#2e7d32;padding:4px 10px;border-radius:8px;font-size:.8rem;font-weight:800}
.p2p-buy-btn{background:#111;color:#fff;border:none;padding:12px 24px;border-radius:12px;font-weight:800;cursor:pointer;font:inherit}

/* Banner carousel */
.banner-slide{animation:fadeIn .5s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* ── Fixed-amount chips (USDT deposit) ── */
.amount-chips{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:8px}
.amount-chip{border:1.5px solid var(--line);background:#fff;border-radius:14px;padding:14px 8px;font-weight:800;font-size:.95rem;transition:transform .12s ease,border-color .12s ease,background .12s ease}
.amount-chip:active{transform:scale(.96)}
.amount-chip.active{border-color:#111;background:#111;color:#fff}

/* ── UPI direct-pay app buttons ── */
.upi-pay-apps{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:8px}
.upi-pay-app{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;border-radius:14px;padding:13px 14px;font-weight:800;font-size:.9rem;box-shadow:0 6px 16px rgba(0,0,0,.15)}
.upi-pay-app:active{transform:scale(.97)}
.upi-pay-badge{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:rgba(255,255,255,.25);font-size:.85rem}

/* ── Theme polish — soft, cool black & white ── */
body{background:#eceef2}
.app-shell{box-shadow:0 0 50px #0000001f}
.primary-btn{background:linear-gradient(135deg,#2a2a30,#111);box-shadow:0 8px 22px rgba(0,0,0,.18);transition:transform .12s ease,box-shadow .12s ease}
.primary-btn:active{transform:translateY(1px) scale(.99);box-shadow:0 4px 12px rgba(0,0,0,.16)}
.brand-mark{background:linear-gradient(135deg,#2a2a30,#111)}
.hero-card{background:linear-gradient(160deg,#1c1c22,#0e0e12)}
.provider-btn,.task-card,.account-card,.tutorial-card,.stats-grid{transition:transform .14s ease,box-shadow .14s ease}
.provider-btn:active,.task-card:active,.account-card:active{transform:scale(.99)}
.provider-btn,.tutorial-card{box-shadow:0 2px 10px #0000000a}
.notice{border-radius:14px}
.segmented,.wide-tabs{border-radius:16px}

/* ── Quick deposit cards (USDT) with credit preview ── */
.quick-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:10px}
.quick-card{border:1.5px solid var(--line);background:#fff;border-radius:16px;padding:14px;text-align:left;display:flex;flex-direction:column;gap:4px;transition:transform .12s ease,border-color .12s ease,background .12s ease}
.quick-card:active{transform:scale(.97)}
.quick-card strong{font-size:1.15rem}
.quick-card span{color:var(--muted);font-size:.82rem}
.quick-card b{color:var(--mint)}
.quick-card.active{border-color:#111;background:#111;color:#fff}
.quick-card.active span{color:#c8c8cc}
.quick-card.active b{color:#8cf1de}

/* Provider images, PIN entry and deposit navigation */
.provider-icon.provider-brand { background: #fff; border: 1px solid #eee; flex-shrink: 0; overflow: hidden; }
.provider-brand img { width: 38px; height: 38px; object-fit: contain; }
.provider-brand [hidden] { display: none; }
.otp-inputs.pin-inputs { display: block; }
.otp-inputs .pin-entry { width: 100%; min-width: 0; height: 56px; box-sizing: border-box; font-size: 24px; letter-spacing: .35em; text-align: center; border-radius: 12px; }
#cryptoPayForm { scroll-margin-top: 20px; }
.selected-network { outline: 2px solid #26a17b; background: #effbf5; }
.upi-pay-app .provider-icon.provider-brand { width:32px; height:32px; border-radius:8px; }
.upi-pay-app .provider-brand img { width:26px; height:26px; }
