.back-row{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-5) var(--space-5) 0}
@media(min-width:900px){ .back-row{padding-inline:0} }
.back-btn{width:38px;height:38px;border-radius:50%;background:var(--surface);border:1px solid var(--border);display:flex;align-items:center;justify-content:center}

.detail-hero{padding:var(--space-4) var(--space-5)}
@media(min-width:900px){ .detail-hero{padding-inline:0} }
.detail-hero .task-icon{width:56px;height:56px;font-size:1.7rem;margin-bottom:var(--space-3)}
.detail-hero h1{font-size:1.25rem}
.detail-provider{font-size:.85rem;color:var(--text-muted);margin-top:2px}
.detail-stats{display:flex;gap:var(--space-3);margin-top:var(--space-4)}
.detail-stat{flex:1;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-3);text-align:center}
.detail-stat .v{font-family:var(--font-mono);font-weight:700;font-size:1.1rem}
.detail-stat .l{font-size:.72rem;color:var(--text-faint);margin-top:2px}

.section-block{padding:var(--space-2) var(--space-5) 0}
@media(min-width:900px){ .section-block{padding-inline:0} }
.section-block h3{font-size:.85rem;margin-bottom:6px}
.section-block p, .section-block li{font-size:.87rem;color:var(--text-muted)}
.step-list{list-style:none;counter-reset:step;display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-2)}
.step-list li{counter-increment:step;display:flex;gap:var(--space-3);align-items:flex-start}
.step-list li::before{content:counter(step);flex-shrink:0;width:24px;height:24px;border-radius:50%;background:var(--surface-2);color:var(--text);font-size:.75rem;font-weight:700;display:flex;align-items:center;justify-content:center}

.sticky-cta{position:sticky;bottom:0;padding:var(--space-4) var(--space-5);background:linear-gradient(to top,var(--bg) 60%,transparent);margin-top:var(--space-6)}
@media(min-width:900px){ .sticky-cta{position:static;background:none;padding-inline:0} }

/* progress tracker (ongoing) */
.progress-track{display:flex;align-items:center;margin-top:var(--space-3);gap:4px}
.progress-step{display:flex;align-items:center;gap:4px;flex:1}
.progress-dot{width:9px;height:9px;border-radius:50%;background:var(--border);flex-shrink:0}
.progress-dot.done{background:var(--accent-mint)}
.progress-dot.current{background:var(--accent-amber)}
.progress-line{height:2px;flex:1;background:var(--border)}
.progress-line.done{background:var(--accent-mint)}
.progress-label{font-size:.68rem;color:var(--text-faint);margin-top:4px}

/* Wallet stats */
.wallet-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-2)}
.wallet-stat{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-3);text-align:center}
.wallet-stat .v{font-family:var(--font-mono);font-weight:700;font-size:1rem}
.wallet-stat .l{font-size:.7rem;color:var(--text-faint);margin-top:3px}

.txn-row{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) 0;border-bottom:1px solid var(--border)}
.txn-row:last-child{border-bottom:none}
.txn-left{display:flex;align-items:center;gap:var(--space-3)}
.txn-icon{width:38px;height:38px;border-radius:50%;background:var(--surface-2);display:flex;align-items:center;justify-content:center;font-size:1rem}
.txn-title{font-size:.86rem;font-weight:600}
.txn-sub{font-size:.74rem;color:var(--text-faint);margin-top:1px}
.txn-amt{font-family:var(--font-mono);font-weight:700;font-size:.9rem}
.txn-amt.credit{color:var(--accent-mint-ink)}
.txn-amt.debit{color:var(--accent-coral-ink)}
[data-theme="dark"] .txn-amt.credit,body:not([data-theme="light"]) .txn-amt.credit{color:var(--accent-mint)}
[data-theme="dark"] .txn-amt.debit,body:not([data-theme="light"]) .txn-amt.debit{color:var(--accent-coral)}

/* Forms */
.field{margin-bottom:var(--space-4)}
.field label{display:block;font-size:.78rem;font-weight:600;color:var(--text-muted);margin-bottom:6px}
.field .input{
  width:100%;padding:12px 14px;border-radius:var(--radius-sm);background:var(--surface);
  border:1px solid var(--border);font-size:.92rem;
}
.field .input:focus{border-color:var(--accent-violet)}
.quick-amounts{display:flex;gap:var(--space-2);margin-top:var(--space-2)}
.quick-amounts button{flex:1;padding:8px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface);font-size:.8rem;font-weight:600}
.quick-amounts button.active{background:var(--text);color:var(--bg)}
[data-theme="dark"] .quick-amounts button.active,body:not([data-theme="light"]) .quick-amounts button.active{background:var(--accent-amber);color:#1A1300}

.method-list{display:flex;flex-direction:column;gap:var(--space-2)}
.method-row{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);cursor:pointer}
.method-row.selected{border-color:var(--accent-amber);box-shadow:0 0 0 1px var(--accent-amber)}
.method-icon{width:36px;height:36px;border-radius:var(--radius-sm);background:var(--surface-2);display:flex;align-items:center;justify-content:center;font-size:1rem}
.hint{font-size:.76rem;color:var(--text-faint);margin-top:var(--space-2)}
.summary-row{display:flex;justify-content:space-between;font-size:.85rem;padding:8px 0}
.summary-row.total{font-weight:700;border-top:1px solid var(--border);margin-top:4px;padding-top:12px}

/* Sheet / modal */
.sheet-overlay{position:fixed;inset:0;background:var(--overlay);display:none;align-items:flex-end;justify-content:center;z-index:60}
.sheet-overlay.open{display:flex}
@media(min-width:900px){ .sheet-overlay{align-items:center} }
.sheet{background:var(--surface);border-radius:20px 20px 0 0;width:100%;max-width:480px;padding:var(--space-6) var(--space-5);max-height:88vh;overflow-y:auto}
@media(min-width:900px){ .sheet{border-radius:var(--radius-lg)} }
.sheet h2{font-size:1.05rem;margin-bottom:var(--space-4)}

/* Profile */
.profile-head{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--space-6) var(--space-5)}
.profile-head .avatar{width:76px;height:76px;margin-bottom:var(--space-3)}
.profile-head h2{font-size:1.1rem}
.profile-head .uid{font-size:.76rem;color:var(--text-faint);font-family:var(--font-mono);margin-top:2px}
.menu-group{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}
.menu-item{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4);border-bottom:1px solid var(--border);font-size:.88rem;font-weight:500}
.menu-item:last-child{border-bottom:none}
.menu-item .chev{color:var(--text-faint)}
.menu-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);padding:0 4px;margin-bottom:8px;margin-top:var(--space-2)}

/* Referral / bonus */
.ref-code{display:flex;align-items:center;justify-content:space-between;background:var(--surface-2);border:1px dashed var(--border);border-radius:var(--radius-md);padding:var(--space-4);margin-top:var(--space-3)}
.ref-code .code{font-family:var(--font-mono);font-weight:700;font-size:1.05rem;letter-spacing:.05em}
.bonus-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-top:var(--space-4)}
.bonus-day-card{aspect-ratio:1;border-radius:var(--radius-sm);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:.65rem;gap:2px;border:1px solid var(--border);background:var(--surface)}
.bonus-day-card.claimed{background:var(--accent-mint);border-color:transparent;color:#04321F}
.bonus-day-card.current{border-color:var(--accent-amber);box-shadow:0 0 0 2px rgba(242,184,75,.25)}
.bonus-day-card.locked{opacity:.5}

/* Legal / support docs */
.doc{padding:var(--space-5);max-width:760px}
@media(min-width:900px){ .doc{padding-inline:0} }
.doc h1{font-size:1.4rem;margin-bottom:4px}
.doc .updated{font-size:.78rem;color:var(--text-faint);margin-bottom:var(--space-6)}
.doc h2{font-size:1.02rem;margin-top:var(--space-6);margin-bottom:var(--space-2)}
.doc p,.doc li{font-size:.9rem;color:var(--text-muted);line-height:1.7}
.doc ul{padding-left:1.1em;margin-top:6px}

.faq-item{border-bottom:1px solid var(--border);padding:var(--space-4) 0}
.faq-q{display:flex;justify-content:space-between;align-items:center;font-weight:600;font-size:.9rem;cursor:pointer}
.faq-a{display:none;font-size:.85rem;color:var(--text-muted);margin-top:8px;line-height:1.6}
.faq-item.open .faq-a{display:block}
.faq-item.open .chevron{transform:rotate(180deg)}