/* ================= PHASE-2 fixes & additions ================= */

/* 24 — kill mobile blue tap highlight + unwanted selection on controls */
*{ -webkit-tap-highlight-color: transparent; }
button, a, [role="button"], .clickable, .nav-item, .icon-btn, .side-link,
.set-row, .qa, .type-card, .tf, .key, .swatch, .toss-pick, .dice-pick,
.pc-avatar, .profile-edit, .req, .lifafa-item, .auth-btn, .sheet-close,
.wallet-act, .chip {
  -webkit-tap-highlight-color: transparent;
  -webkit-user-select: none; user-select: none; touch-action: manipulation;
}
button:focus:not(:focus-visible), a:focus:not(:focus-visible),
[role="button"]:focus:not(:focus-visible){ outline: none; }
/* keep copyable/selectable text selectable */
.selectable, .copy-value, input, textarea { -webkit-user-select: text; user-select: text; }

/* 4 — bottom sheet: never full viewport, stable grab area, scrollable body */
.sheet{ max-height: calc(100dvh - 40px); }
.sheet-grab{ flex: none; cursor: grab; touch-action: none; }
.sheet-grab:active{ cursor: grabbing; }
.sheet .sheet-body{ overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }

/* 8 — expandable sections (Create Lifafa toggles) */
.expandable{ display:grid; grid-template-rows:0fr; opacity:0;
  transition: grid-template-rows .32s var(--ease), opacity .28s var(--ease), margin .28s var(--ease); }
.expandable > .exp-inner{ overflow:hidden; min-height:0; }
.expandable.open{ grid-template-rows:1fr; opacity:1; }

/* generic entrance util */
.fade-in{ animation: fadeIn .3s var(--ease) both; }
@keyframes fadeIn{ from{opacity:0; transform: translateY(6px)} to{opacity:1; transform:none} }

/* 1 — login primary mobile */
.login-card{ margin-top:8px; }
.otp-timer{ text-align:center; font-size:.82rem; color:var(--text-muted); margin-top:10px; }
.otp-timer b{ color:var(--primary); font-variant-numeric:tabular-nums; }
.change-num{ display:inline-flex; align-items:center; gap:6px; font-size:.82rem; color:var(--primary); font-weight:700; margin-top:2px; }
.divider{ display:flex; align-items:center; gap:12px; margin:22px 0 16px; color:var(--text-muted); font-size:.76rem; font-weight:700; }
.divider::before,.divider::after{ content:""; height:1px; flex:1; background:var(--border); }

/* 3 — settings profile card */
.acct-card{ display:flex; align-items:center; gap:14px; }
.acct-card .av{ width:64px; height:64px; border-radius:20px; object-fit:cover; background:var(--grad); flex:none; box-shadow:var(--shadow-sm); }
.acct-card .info{ min-width:0; flex:1; }
.acct-card .nm{ font-weight:800; font-size:1.05rem; }
.acct-card .meta{ font-size:.8rem; color:var(--text-muted); display:flex; flex-direction:column; gap:2px; margin-top:3px; }
.acct-card .edit{ margin-left:auto; }

/* 10/11 — wallet action buttons + clickable safe */
.wallet-actions{ display:flex; gap:12px; margin-top:18px; }
.wallet-act{ flex:1; display:flex; align-items:center; justify-content:center; gap:8px; padding:12px; border-radius:16px;
  background:rgba(255,255,255,.18); color:#fff; font-weight:800; backdrop-filter:blur(6px); transition:transform .16s var(--ease); }
.wallet-act:active{ transform:scale(.96); }
.wallet-sub .ws{ cursor:pointer; transition:transform .16s var(--ease); }
.wallet-sub .ws:active{ transform:scale(.97); }
.quick-amts{ display:flex; gap:8px; margin:10px 0; }
.quick-amts .qa-btn{ flex:1; padding:9px; border-radius:12px; background:var(--surface-2); font-weight:700; font-size:.85rem; }

/* eye/copy row for passcode */
.pc-value-row{ display:flex; align-items:center; gap:10px; }
.pc-value{ flex:1; font-size:clamp(.95rem,4.4vw,1.2rem); font-weight:800; letter-spacing:2px; white-space:nowrap; font-variant-numeric:tabular-nums; }
.pc-ic{ width:40px; height:40px; border-radius:12px; display:grid; place-items:center; background:var(--surface-2); color:var(--text); }

/* 8 — reduced motion */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}


/* Settings profile: keep email icon and long address on one line. */
#acct-email{display:flex;align-items:center;gap:6px;min-width:0;width:100%;white-space:nowrap;overflow:hidden}
#acct-email>i{flex:0 0 auto}
#acct-email .acct-email-text{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}