/* AUTO-GENERATED by scripts/gen-account-scoped.mjs — DO NOT EDIT BY HAND.
   account-app.css + account-pages.css + account.css, every rule re-namespaced under `.ds-acct` so the
   account design system can be loaded GLOBALLY in app/layout.tsx (always present → no runtime <link>
   injection → no FOUC) without leaking its tokens/.btn-primary/body reset into the marketing pages.
   Regenerate whenever any of the three source files change:  node scripts/gen-account-scoped.mjs */
.ds-acct {
  --brand: #00E37A;
  --brand-2: #00C2FF;
  --brand-ink: #06110A;
  --grad: linear-gradient(100deg, #00E37A 0%, #00C2FF 100%);
  --danger: #ff5a52;
  --r-lg: 22px;
  --r-md: 16px;
  --r-sm: 12px;
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur: 240ms;
  --dur-fast: 140ms;

  --bg: #0a0c10;
  --bg-elev: #11141a;
  --surface: #161a21;
  --surface-2: #1c212a;
  --surface-press: #232936;
  --line: rgba(255,255,255,0.08);
  --line-strong: rgba(255,255,255,0.14);
  --txt: #f3f5f8;
  --txt-2: #aab2c0;
  --txt-3: #8b95a4;
  --shadow: 0 18px 50px -22px rgba(0,0,0,0.8);
  --skel: rgba(255,255,255,0.06);
  --skel-sheen: rgba(255,255,255,0.13);
  --brand-soft: rgba(0,227,122,0.12);
  --brand-line: rgba(0,227,122,0.32);
  
  --tg-bar-bg: #000000;
  --tg-bar-txt: #ffffff;
  --tg-bar-sub: rgba(235,238,245,0.5);
  --tg-more-bg: rgba(255,255,255,0.1);

  --lk-top-h: 64px; --lk-foot-h: 46px; --lk-side-w: 248px;
  
  --lk-tabbar-reserve: calc(92px + env(safe-area-inset-bottom));
}
[data-theme="light"] .ds-acct {
  --bg: #eef1f5;
  --bg-elev: #ffffff;
  --surface: #ffffff;
  --surface-2: #f4f6f9;
  --surface-press: #e9edf2;
  --line: rgba(10,20,40,0.08);
  --line-strong: rgba(10,20,40,0.14);
  --txt: #0f1722;
  --txt-2: #5a6573;
  --txt-3: #8b95a3;
  --shadow: 0 14px 40px -22px rgba(20,40,70,0.35);
  --skel: rgba(10,20,40,0.06);
  --skel-sheen: rgba(10,20,40,0.11);
  --brand-soft: rgba(0,180,100,0.12);
  --brand-line: rgba(0,180,100,0.34);
  --brand: #00b85f;
  --grad: linear-gradient(100deg, #00b85f 0%, #00a6d8 100%);
  --brand-ink: #ffffff;
  --tg-bar-bg: #ffffff;
  --tg-bar-txt: #0f1722;
  --tg-bar-sub: rgba(15,23,34,0.45);
  --tg-more-bg: rgba(15,23,34,0.06);
}

/* ===== account-app.css ===== */
.ds-acct, .ds-acct * { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
.ds-acct .stage { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; }
.ds-acct .scaler { transform-origin: center center; }
.ds-acct .phone {
  width: 390px; height: 844px; border-radius: 54px; background: #000; padding: 11px;
  box-shadow: 0 0 0 2px #1c1f24, 0 40px 90px -20px rgba(0,0,0,0.8), 0 0 140px -50px rgba(0,227,122,0.3);
  position: relative;
}
.ds-acct .screen-frame {
  position: relative; width: 100%; height: 100%; border-radius: 44px; overflow: hidden;
  background: var(--bg); display: flex; flex-direction: column;
  transition: background var(--dur) var(--ease);
}
.ds-acct .ios-status {
  flex: 0 0 auto; position: relative; z-index: 21;
  background: var(--tg-bar-bg); color: var(--tg-bar-txt);
  height: 46px; display: flex; align-items: center; justify-content: space-between;
  padding: 6px 24px 0 30px;
}
.ds-acct .ios-time { font-weight: 700; font-size: 15px; letter-spacing: 0.2px; font-feature-settings: "tnum"; }
.ds-acct .ios-ind { display: flex; align-items: center; gap: 6px; }
.ds-acct .ios-i { display: block; }
.ds-acct .ios-batt { width: 23px; height: 12px; border-radius: 3px; border: 1px solid currentColor; position: relative; padding: 1.6px; opacity: 0.95; }
.ds-acct .ios-batt::after { content: ""; position: absolute; right: -3px; top: 50%; transform: translateY(-50%); width: 2px; height: 4px; border-radius: 0 1.5px 1.5px 0; background: currentColor; }
.ds-acct .ios-batt-fill { display: block; height: 100%; width: 72%; border-radius: 1.5px; background: currentColor; }
.ds-acct .tg-header {
  flex: 0 0 auto; position: relative; z-index: 20;
  background: var(--tg-bar-bg); color: var(--tg-bar-txt);
  padding: 0 10px 8px;
}
.ds-acct .tg-grabber {
  width: 36px; height: 5px; border-radius: 3px; margin: 6px auto 5px;
  background: var(--tg-bar-txt); opacity: 0.22;
}
.ds-acct .tg-bar { position: relative; height: 44px; display: flex; align-items: center; padding: 0 4px; }
.ds-acct .tg-heading {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);
  text-align: center; pointer-events: none; max-width: 62%;
}
.ds-acct .tg-title {
  font-family: var(--font-display); font-weight: 700; font-size: 17px; line-height: 1.12;
  letter-spacing: -0.01em; color: var(--tg-bar-txt); white-space: nowrap;
}
.ds-acct .tg-sub { font-size: 12.5px; color: var(--tg-bar-sub); line-height: 1.2; margin-top: 1px; }
.ds-acct .tg-back {
  display: none; align-items: center; gap: 1px; margin-right: auto;
  background: none; border: 0; color: var(--tg-bar-txt); cursor: pointer;
  font-family: var(--font-body); font-size: 17px; font-weight: 400; padding: 4px 8px 4px 0;
}
.ds-acct .tg-back svg { margin-right: -1px; }
.ds-acct .tg-header.has-back .tg-back { display: flex; }
.ds-acct .tg-more {
  margin-left: auto; width: 30px; height: 30px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--tg-more-bg); color: var(--tg-bar-txt); border: 0; cursor: pointer;
}
.ds-acct .tg-more:active { transform: scale(0.94); }
.ds-acct .viewport { position: relative; flex: 1 1 auto; overflow: hidden; z-index: 1; }
.ds-acct .screen {
  position: absolute; inset: 0; overflow-y: auto; overflow-x: hidden;
  padding: 4px 16px 132px;
  -webkit-overflow-scrolling: touch; scrollbar-width: none;
  opacity: 0; visibility: hidden;
}
.ds-acct .screen::-webkit-scrollbar { display: none; }
.ds-acct .screen.active { opacity: 1; visibility: visible; z-index: 2; }
.ds-acct .screen.leaving { opacity: 0; visibility: visible; z-index: 1; pointer-events: none; transform: scale(0.985) translateY(-6px); transition: opacity 0.26s var(--ease), transform 0.26s var(--ease); }
.ds-acct .screen.anim-in { animation: screen-enter 0.42s cubic-bezier(0.22,1,0.36,1) both; }
@keyframes screen-enter { from { opacity: 0; transform: scale(0.992); } to { opacity: 1; transform: none; } }
.ds-acct .screen.anim-in > .stagger { animation: rise 0.52s var(--ease-out) both; }
.ds-acct .screen.anim-in > .stagger:nth-child(1) { animation-delay: 30ms; }
.ds-acct .screen.anim-in > .stagger:nth-child(2) { animation-delay: 70ms; }
.ds-acct .screen.anim-in > .stagger:nth-child(3) { animation-delay: 110ms; }
.ds-acct .screen.anim-in > .stagger:nth-child(4) { animation-delay: 150ms; }
.ds-acct .screen.anim-in > .stagger:nth-child(5) { animation-delay: 190ms; }
.ds-acct .screen.anim-in > .stagger:nth-child(6) { animation-delay: 230ms; }
.ds-acct .screen.anim-in > .stagger:nth-child(7) { animation-delay: 270ms; }
.ds-acct .screen.anim-in > .stagger:nth-child(8) { animation-delay: 310ms; }
@keyframes rise { from { opacity: 0.35; transform: translateY(11px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
.ds-acct .screen.leaving { transition: none; transform: none; }
.ds-acct .screen.anim-in { animation: none; }
.ds-acct .screen.anim-in > .stagger { animation: none; }
}
.ds-acct .h1 { font-family: var(--font-display); font-weight: 700; font-size: 26px; letter-spacing: -0.02em; margin: 6px 0 0; }
.ds-acct .h2 { font-family: var(--font-display); font-weight: 700; font-size: 20px; letter-spacing: -0.01em; margin: 0; }
.ds-acct .sub { color: var(--txt-2); font-size: 14.5px; line-height: 1.45; margin: 8px 0 0; text-wrap: pretty; }
.ds-acct .section-label { display: flex; align-items: center; justify-content: space-between; margin: 26px 2px 12px; }
.ds-acct .section-label h3 { font-family: var(--font-display); font-weight: 700; font-size: 17px; margin: 0; }
.ds-acct .section-label .more { color: var(--brand); font-size: 14px; font-weight: 600; cursor: pointer; background: none; border: 0; }
.ds-acct .card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--shadow);
  transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.ds-acct .card:hover { transform: none; border-color: var(--line); }
.ds-acct .card::after { content: none; }
.ds-acct .tap { cursor: pointer; transition: transform var(--dur-fast) var(--ease); }
.ds-acct .tap:active { transform: scale(0.98); }
.ds-acct .btn {
  position: relative; overflow: hidden;
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  height: 52px; padding: 0 22px; border-radius: var(--r-md);
  font-family: var(--font-body); font-weight: 600; font-size: 16px;
  border: 1px solid transparent; cursor: pointer; -webkit-appearance: none; appearance: none;
  transition: transform var(--dur-fast) var(--ease), filter var(--dur-fast), background var(--dur-fast), border-color var(--dur-fast);
}
.ds-acct .btn:active { transform: scale(0.985); }
.ds-acct .btn-primary { background: var(--brand); color: var(--brand-ink); box-shadow: 0 10px 26px -14px rgba(0,227,122,0.5); }
.ds-acct .btn-soft { background: var(--brand-soft); color: var(--brand); border-color: var(--brand-line); }
.ds-acct .btn-ghost { background: transparent; color: var(--txt); border-color: var(--line-strong); }
.ds-acct .btn-ghost:active { background: var(--surface-2); }
.ds-acct .btn svg { flex: 0 0 auto; width: 22px; height: 22px; }
.ds-acct .btn-block { width: 100%; }
.ds-acct .btn .ripple { position: absolute; border-radius: 50%; transform: translate(-50%,-50%) scale(0); background: rgba(255,255,255,0.4); pointer-events: none; animation: ripple 600ms var(--ease-out); }
@keyframes ripple { to { transform: translate(-50%,-50%) scale(2.6); opacity: 0; } }
.ds-acct .mainbtn-wrap {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 14;
  padding: 14px 16px calc(16px + env(safe-area-inset-bottom));
  background: linear-gradient(180deg, transparent 0%, var(--bg) 38%);
  transform: translateY(140%);
  pointer-events: none;
}
.ds-acct .mainbtn-wrap.show { transform: none; pointer-events: auto; }
.ds-acct .mainbtn {
  width: 100%; height: 54px; border-radius: var(--r-md);
  background: var(--grad); color: var(--brand-ink);
  font-family: var(--font-body); font-weight: 700; font-size: 16.5px;
  border: 0; cursor: pointer; -webkit-appearance: none; appearance: none;
  display: flex; align-items: center; justify-content: center; gap: 9px;
  box-shadow: 0 14px 34px -14px rgba(0,227,122,0.7);
  transition: transform var(--dur-fast) var(--ease);
}
.ds-acct .mainbtn:active { transform: scale(0.99); }
.ds-acct .mainbtn[disabled] { filter: grayscale(0.4) brightness(0.8); box-shadow: none; cursor: default; }
.ds-acct .mainbtn .spinner { width: 18px; height: 18px; border-radius: 50%; border: 2.5px solid rgba(255,255,255,0.4); border-top-color: #fff; animation: spin 0.7s linear infinite; }
.ds-acct .mainbtn .mb-t { font-weight: 700; }
.ds-acct .mainbtn .mb-old { color: rgba(6,17,10,0.62); font-size: 13px; font-weight: 700; text-decoration: line-through; text-decoration-thickness: 2px; margin-left: 2px; }
.ds-acct .mainbtn .mb-pct { font-weight: 800; font-size: 12px; padding: 3px 8px; border-radius: 7px; background: rgba(6,17,10,0.82); color: #fff; letter-spacing: 0.01em; }
.ds-acct .mainbtn { gap: 9px; }
@keyframes spin { to { transform: rotate(360deg); } }
.ds-acct .tabbar {
  position: absolute; left: 12px; right: 12px; z-index: 15;
  bottom: calc(10px + env(safe-area-inset-bottom));
  height: 64px; display: flex; align-items: center;
  background: var(--surface); border: 1px solid var(--line-strong);
  border-radius: 22px;
  box-shadow: 0 1px 0 rgba(255,255,255,0.05) inset, 0 18px 44px -16px rgba(0,0,0,0.8), 0 6px 18px -10px rgba(0,0,0,0.55);
  -webkit-backdrop-filter: blur(22px) saturate(1.4); backdrop-filter: blur(22px) saturate(1.4);
}
[data-theme="dark"] .ds-acct .tabbar { background: rgba(22,26,34,0.98); border-color: rgba(255,255,255,0.16); box-shadow: 0 1px 0 rgba(255,255,255,0.07) inset, 0 -10px 30px -8px rgba(0,0,0,0.55), 0 22px 50px -18px rgba(0,0,0,0.9), 0 8px 22px -10px rgba(0,0,0,0.7); }
[data-theme="light"] .ds-acct .tabbar { background: rgba(255,255,255,0.98); }
.ds-acct .tabbar.hide { transform: translateY(160%); }
.ds-acct .tab {
  position: relative; flex: 1 1 0; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  background: none; border: 0; cursor: pointer; color: var(--txt-3); padding: 0; z-index: 1;
  -webkit-appearance: none; appearance: none;
  transition: color var(--dur-fast);
}
.ds-acct .tab svg { width: 24px; height: 24px; transition: transform var(--dur-fast) var(--ease); }
.ds-acct .tab .tab-l { font-size: 11px; font-weight: 600; }
.ds-acct .tab.active { color: var(--brand); }
.ds-acct .tab.active svg { transform: translateY(-2px) scale(1.08); }
.ds-acct .tab:active svg { transform: scale(0.86); }
.ds-acct .tab-ind { position: absolute; top: 6px; bottom: 6px; left: 0; width: 0; border-radius: 13px; background: var(--brand-soft); z-index: 0; opacity: 0; transform: translateX(0); transition: transform 0.42s cubic-bezier(0.34,1.32,0.5,1), width 0.42s cubic-bezier(0.34,1.32,0.5,1), opacity 0.3s var(--ease); pointer-events: none; }
.ds-acct .tab-ind.ready { opacity: 0.7; }
.ds-acct .tab .tab-l { transition: font-weight 0.2s; }
.ds-acct .tab.active .tab-l { font-weight: 700; }
.ds-acct .hero-status { display: flex; align-items: center; gap: 9px; justify-content: center; margin-top: 14px; font-weight: 600; font-size: 15px; white-space: nowrap; }
.ds-acct .hero-status .dot { width: 9px; height: 9px; border-radius: 50%; }
.ds-acct .hero-status.ok { color: var(--brand); }
.ds-acct .hero-status.ok .dot { background: var(--brand); box-shadow: 0 0 0 0 rgba(0,227,122,0.5); animation: pdot 2.4s var(--ease-out) infinite; }
.ds-acct .hero-status.warn { color: #ff8a82; }
.ds-acct .hero-status.warn .dot { background: #ff8a82; }
.ds-acct .hero-status.off { color: var(--txt-3); }
.ds-acct .hero-status.off .dot { background: var(--txt-3); }
@keyframes pdot { 0% { box-shadow: 0 0 0 0 rgba(0,227,122,0.5); } 70%,100% { box-shadow: 0 0 0 8px rgba(0,227,122,0); } }
.ds-acct .hero-big { text-align: center; font-family: var(--font-display); font-weight: 700; font-size: 40px; letter-spacing: -0.02em; line-height: 1.06; margin: 8px 0 0; }
.ds-acct .hero-big b { color: var(--brand); }
.ds-acct .hero-date { text-align: center; color: var(--txt-3); font-size: 15px; margin-top: 8px; text-wrap: balance; }
.ds-acct .hero-date .hd-main { display: block; color: var(--txt-2); font-weight: 600; }
.ds-acct .hero-date .hd-sub { display: block; margin-top: 2px; font-size: 13px; color: var(--txt-3); }
.ds-acct .hero-ring { width: 184px; height: 184px; margin: 18px auto 4px; position: relative; }
.ds-acct .hero-ring > svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.ds-acct .hero-ring .track { fill: none; stroke: var(--line); stroke-width: 10; }
.ds-acct .hero-ring .prog { fill: none; stroke: url(#hg); stroke-width: 10; stroke-linecap: round; transition: stroke-dashoffset 1s var(--ease-out); }
.ds-acct .hero-ring .core {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
}
.ds-acct .hero-ring .core .n { font-family: var(--font-display); font-weight: 700; font-size: 56px; line-height: 1; letter-spacing: -0.03em; }
.ds-acct .hero-ring .core .l { color: var(--txt-3); font-size: 13px; margin-top: 5px; }
.ds-acct .hero-ring.warn .prog { stroke: #ff8a82; filter: none; }
.ds-acct .hero-ring.warn .core .n { color: #ff8a82; }
.ds-acct .hero-ring.warn .core .l { color: #ff8a82; opacity: 0.85; }
.ds-acct .hero-ring.trial .prog { stroke: var(--brand-2); }
.ds-acct .hero-ring.trial .core .n { color: var(--brand-2); }
@media (prefers-reduced-motion: no-preference) {
.ds-acct .hero-ring.warn[data-deck-active], .ds-acct .hero-ring.warn { animation: ringBreath 2.6s var(--ease-out) infinite; }
}
@keyframes ringBreath { 0%,100% { transform: scale(1); } 50% { transform: scale(1.025); } }
.ds-acct .chips { display: flex; gap: 9px; justify-content: center; margin-top: 18px; flex-wrap: wrap; }
.ds-acct .chip {
  display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 14px;
  border-radius: 999px; background: var(--surface-2); border: 1px solid var(--line);
  color: var(--txt-2); font-size: 13.5px; font-weight: 600; white-space: nowrap;
}
.ds-acct .chip svg { width: 16px; height: 16px; }
.ds-acct .qa-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 18px; }
.ds-acct .qa {
  display: flex; flex-direction: column; gap: 10px; padding: 16px;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg);
  cursor: pointer; text-align: left; color: var(--txt); -webkit-appearance: none; appearance: none;
  transition: transform var(--dur-fast) var(--ease), background var(--dur-fast), border-color var(--dur-fast);
}
.ds-acct .qa:active { transform: scale(0.97); background: var(--surface-press); }
.ds-acct .qa-ic { width: 42px; height: 42px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); }
.ds-acct .qa-ic.neutral { background: var(--surface-2); border-color: var(--line); color: var(--txt-2); }
.ds-acct .qa-t { font-family: var(--font-display); font-weight: 600; font-size: 16px; }
.ds-acct .qa-s { color: var(--txt-2); font-size: 13px; margin-top: -4px; }
.ds-acct .qa-art { position: relative; overflow: hidden; }
.ds-acct .qa-art > *:not(.qa-deco) { position: relative; z-index: 1; }
.ds-acct .qa-deco { position: absolute; right: -14px; bottom: -14px; width: 92px; height: 92px; z-index: 0; opacity: 0.16; pointer-events: none; }
.ds-acct .qa-deco svg { width: 100%; height: 100%; }
.ds-acct .qa-art-dev { background: linear-gradient(135deg, var(--surface) 60%, rgba(0,227,122,0.07)); }
.ds-acct .qa-art-dev .qa-deco { color: var(--brand); }
.ds-acct .qa-art-ref { background: linear-gradient(135deg, var(--surface) 60%, rgba(0,194,255,0.08)); }
.ds-acct .qa-art-ref .qa-deco { color: var(--brand-2); }
.ds-acct .qa-art-ref .qa-ic { background: rgba(0,194,255,0.12); border-color: rgba(0,194,255,0.34); color: var(--brand-2); }
.ds-acct .list { display: flex; flex-direction: column; gap: 0; overflow: hidden; }
.ds-acct .row {
  display: flex; align-items: center; gap: 14px; padding: 15px 16px; cursor: pointer;
  background: var(--surface); color: var(--txt); -webkit-appearance: none; appearance: none; border: 0; width: 100%; text-align: left;
  transition: background var(--dur-fast);
}
.ds-acct .row + .row { border-top: 1px solid var(--line); }
.ds-acct .row:active { background: var(--surface-press); }
.ds-acct .card.list .row:hover, .ds-acct .dev-row:hover { background: var(--surface-press); }
.ds-acct .row-ic { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 11px; display: flex; align-items: center; justify-content: center; background: var(--surface-2); border: 1px solid var(--line); color: var(--txt-2); }
.ds-acct .row-body { flex: 1 1 auto; min-width: 0; }
.ds-acct .row-t { display: block; font-family: var(--font-display); font-weight: 600; font-size: 15.5px; }
.ds-acct .row-s { display: block; color: var(--txt-3); font-size: 13px; margin-top: 2px; }
.ds-acct .row-chev { flex: 0 0 auto; color: var(--txt-3); }
.ds-acct .faq + .faq { border-top: 1px solid var(--line); }
.ds-acct .faq-q { width: 100%; }
.ds-acct .faq-chev { transition: transform 0.28s var(--ease); }
.ds-acct .faq.open .faq-chev { transform: rotate(180deg); color: var(--brand); }
.ds-acct .faq.open .faq-q .row-t { color: var(--brand); }
.ds-acct .faq-a { display: none; }
.ds-acct .faq.open .faq-a { display: block; animation: faq-reveal 0.26s var(--ease) both; }
@keyframes faq-reveal { from { opacity: 0.4; } to { opacity: 1; } }
.ds-acct .faq-a-in { overflow: hidden; }
.ds-acct .faq-a-t { color: var(--txt-2); font-size: 14px; line-height: 1.5; margin: 0; padding: 0 16px 16px 70px; text-wrap: pretty; }
@media (prefers-reduced-motion: reduce) {
.ds-acct .faq-chev, .ds-acct .faq.open .faq-a { transition: none; animation: none; }
}
.ds-acct .row-val { flex: 0 0 auto; color: var(--txt-2); font-size: 14px; font-weight: 600; }
.ds-acct .seg { display: flex; gap: 4px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 999px; padding: 4px; }
.ds-acct .seg-opt {
  flex: 1 1 0; min-width: 0; height: 44px; border: 0; background: transparent; border-radius: 999px;
  color: var(--txt-3); font-family: var(--font-body); font-weight: 600; font-size: 14px; cursor: pointer;
  -webkit-appearance: none; appearance: none; transition: color var(--dur-fast), background var(--dur-fast);
}
.ds-acct .seg-opt.on { color: var(--txt); background: var(--surface); box-shadow: var(--shadow); }
.ds-acct .plan-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
.ds-acct .tile {
  position: relative; display: flex; flex-direction: column; min-height: 116px; padding: 13px 14px;
  background: var(--surface); border: 1.5px solid var(--line); border-radius: 18px; color: var(--txt);
  cursor: pointer; overflow: hidden; -webkit-appearance: none; appearance: none; text-align: left;
  transition: border-color var(--dur-fast), transform var(--dur-fast) var(--ease), background var(--dur-fast);
}
.ds-acct .tile:active { transform: scale(0.98); }
.ds-acct .tile-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ds-acct .tile-term { font-family: var(--font-display); font-weight: 600; font-size: 14.5px; color: var(--txt-2); white-space: nowrap; }
.ds-acct .tile-radio { flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--line-strong); display: flex; align-items: center; justify-content: center; color: var(--brand-ink); background: transparent; }
.ds-acct .tile-radio svg { width: 12px; height: 12px; opacity: 0; transition: opacity var(--dur-fast); }
.ds-acct .tile-rib-row { margin-top: 10px; }
.ds-acct .tile-ribbon { display: inline-block; font-weight: 700; font-size: 10px; letter-spacing: 0.02em; line-height: 1; padding: 4px 8px; border-radius: 7px; white-space: nowrap; }
.ds-acct .rib-best { background: var(--grad); color: var(--brand-ink); }
.ds-acct .rib-pop { background: rgba(0,194,255,0.16); color: #57b9e8; border: 1px solid rgba(0,194,255,0.4); }
.ds-acct .tile-price { display: flex; align-items: baseline; margin-top: auto; padding-top: 12px; font-family: var(--font-display); font-weight: 700; white-space: nowrap; }
.ds-acct .tile-price b { font-size: 29px; line-height: 1; letter-spacing: -0.03em; }
.ds-acct .tile-price .suf { font-family: var(--font-body); font-weight: 600; font-size: 12.5px; color: var(--txt-3); margin-left: 3px; }
.ds-acct .tile-foot { display: flex; align-items: center; gap: 7px; margin-top: 8px; }
.ds-acct .tile-total { color: var(--txt-3); font-size: 12.5px; white-space: nowrap; }
.ds-acct .tile-disc { font-weight: 700; font-size: 10.5px; line-height: 1; padding: 3px 6px; border-radius: 6px; background: var(--brand-soft); color: var(--brand); }
.ds-acct .tile.sel { border-color: var(--brand); background: var(--brand-soft); }
.ds-acct .tile.sel .tile-radio { background: var(--brand); border-color: var(--brand); }
.ds-acct .tile.sel .tile-radio svg { opacity: 1; }
.ds-acct .tile.accent-best { border-color: var(--brand-line); }
.ds-acct .tile.accent-pop { border-color: rgba(0,194,255,0.3); }
.ds-acct .tile.accent-best.sel { border-color: var(--brand); }
.ds-acct .tile-build { align-items: center; justify-content: center; text-align: center; gap: 4px; border-style: dashed; border-color: var(--brand-line); background: var(--brand-soft); color: var(--brand); }
.ds-acct .tile-build .tb-ic { width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--surface); border: 1px solid var(--brand-line); margin-bottom: 4px; }
.ds-acct .tile-build .tb-ic svg { width: 18px; height: 18px; }
.ds-acct .tile-build .tb-t { font-family: var(--font-display); font-weight: 600; font-size: 15px; color: var(--txt); }
.ds-acct .tile-build .tb-s { font-size: 12px; color: var(--txt-2); }
.ds-acct .tile-glow { position: absolute; z-index: 0; right: -25%; top: -35%; width: 90%; height: 130%; border-radius: 50%; background: radial-gradient(circle, rgba(0,227,122,0.2) 0%, rgba(0,194,255,0.1) 45%, transparent 70%); filter: blur(22px); pointer-events: none; }
.ds-acct .tile > *:not(.tile-glow):not(.tile-check) { position: relative; z-index: 1; }
.ds-acct .skeleton { position: relative; overflow: hidden; background: var(--skel); border-radius: 8px; }
.ds-acct .skeleton::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, var(--skel-sheen), transparent); transform: translateX(-100%); animation: sheen 1.3s infinite; }
@keyframes sheen { to { transform: translateX(100%); } }
.ds-acct .sk-line { height: 13px; border-radius: 7px; }
.ds-acct .sk-card { height: 96px; border-radius: var(--r-lg); }
.ds-acct [hidden] { display: none !important; }
.ds-acct .state {
  display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: 48px 24px; gap: 14px;
}
.ds-acct .state-ic { width: 72px; height: 72px; border-radius: 22px; display: flex; align-items: center; justify-content: center; background: var(--surface-2); border: 1px solid var(--line); color: var(--txt-3); }
.ds-acct .state-t { font-family: var(--font-display); font-weight: 700; font-size: 19px; }
.ds-acct .state-s { color: var(--txt-2); font-size: 14.5px; line-height: 1.5; max-width: 280px; text-wrap: pretty; }
.ds-acct .toast {
  position: absolute; z-index: 30; left: 50%; bottom: 96px; transform: translateX(-50%) translateY(16px);
  background: var(--bg-elev); border: 1px solid var(--line-strong); color: var(--txt);
  padding: 12px 20px; border-radius: 999px; font-size: 14.5px; font-weight: 600;
  opacity: 0; pointer-events: none; box-shadow: var(--shadow);
  transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease);
}
.ds-acct .toast.show { opacity: 1; transform: translateX(-50%); }
.ds-acct .backdrop { position: absolute; inset: 0; z-index: 40; background: rgba(4,6,10,0.55); opacity: 0; pointer-events: none; transition: opacity var(--dur) var(--ease); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }
.ds-acct .backdrop.show { opacity: 1; pointer-events: auto; }
.ds-acct .sheet {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 41;
  background: var(--bg-elev); border-top: 1px solid var(--line);
  border-radius: 26px 26px 0 0; padding: 10px 20px calc(20px + env(safe-area-inset-bottom));
  transform: translateY(100%);
  max-height: 86%; overflow-y: auto; scrollbar-width: none;
}
.ds-acct .sheet.show { transform: none; }
.ds-acct .sheet::-webkit-scrollbar { display: none; }
.ds-acct .sheet-grip { width: 38px; height: 5px; border-radius: 3px; background: var(--line-strong); margin: 4px auto 14px; }
.ds-acct .sheet-ic { width: 60px; height: 60px; border-radius: 18px; margin: 2px auto 14px; display: flex; align-items: center; justify-content: center; }
.ds-acct .sheet-ic.ok { background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); }
.ds-acct .sheet-ic.danger { background: rgba(255,90,82,0.1); border: 1px solid rgba(255,90,82,0.32); color: var(--danger); }
.ds-acct .sheet-title { text-align: center; font-family: var(--font-display); font-weight: 700; font-size: 21px; margin: 0; }
.ds-acct .sheet-text { text-align: center; color: var(--txt-2); font-size: 14.5px; line-height: 1.5; margin: 10px 0 18px; text-wrap: pretty; }
.ds-acct .sheet-cancel { width: 100%; height: 50px; margin-top: 10px; background: transparent; border: 0; color: var(--txt-3); font-family: var(--font-body); font-weight: 600; font-size: 15.5px; cursor: pointer; }
.ds-acct .up-choice { position: relative; display: flex; align-items: center; gap: 14px; width: 100%; padding: 16px; margin-bottom: 10px; border-radius: 18px; background: var(--surface); border: 1.5px solid var(--line); color: var(--txt); text-align: left; cursor: pointer; -webkit-appearance: none; appearance: none; transition: border-color var(--dur-fast), transform var(--dur-fast); }
.ds-acct .up-choice:active { transform: scale(0.985); }
.ds-acct .up-choice-rec { border-color: var(--brand-line); background: var(--brand-soft); }
.ds-acct .up-choice .uc-badge { position: absolute; top: -9px; left: 16px; font-size: 10.5px; font-weight: 700; letter-spacing: 0.02em; color: var(--brand-ink); background: var(--grad); padding: 3px 9px; border-radius: 7px; }
.ds-acct .up-choice .uc-ic { flex: 0 0 auto; width: 46px; height: 46px; border-radius: 13px; display: flex; align-items: center; justify-content: center; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); }
.ds-acct .up-choice .uc-ic.neutral { background: var(--surface-2); border-color: var(--line); color: var(--txt-2); }
.ds-acct .up-choice .uc-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ds-acct .up-choice .uc-t { font-family: var(--font-display); font-weight: 700; font-size: 16px; }
.ds-acct .up-choice .uc-s { color: var(--txt-3); font-size: 12.5px; line-height: 1.35; }
.ds-acct .up-choice .uc-arrow { flex: 0 0 auto; color: var(--txt-3); }
.ds-acct .up-row { display: flex; align-items: center; gap: 14px; padding: 16px 18px; margin-top: 12px; }
.ds-acct .up-row-l { flex: 1 1 auto; min-width: 0; }
.ds-acct .up-row .up-title { font-family: var(--font-display); font-weight: 700; font-size: 16.5px; }
.ds-acct .up-row .up-cap { color: var(--txt-3); font-size: 13px; margin-top: 3px; }
.ds-acct .stepper { flex: 0 0 auto; display: flex; align-items: center; gap: 4px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 999px; padding: 4px; }
.ds-acct .step-btn { width: 38px; height: 38px; border-radius: 50%; border: 0; background: var(--surface); color: var(--txt); display: flex; align-items: center; justify-content: center; cursor: pointer; -webkit-appearance: none; appearance: none; transition: background var(--dur-fast), opacity var(--dur-fast); }
.ds-acct .step-btn:active { transform: scale(0.92); }
.ds-acct .step-btn:disabled { opacity: 0.35; cursor: default; }
.ds-acct .step-val { min-width: 40px; text-align: center; font-family: var(--font-display); font-weight: 700; font-size: 19px; }
.ds-acct .up-presets-row { display: flex; gap: 8px; margin-top: 10px; }
.ds-acct .up-preset { flex: 1 1 0; height: 42px; border-radius: 12px; background: var(--surface); border: 1px solid var(--line); color: var(--txt-2); font-family: var(--font-display); font-weight: 700; font-size: 14.5px; cursor: pointer; -webkit-appearance: none; appearance: none; transition: background var(--dur-fast), border-color var(--dur-fast); }
.ds-acct .up-preset:active { transform: scale(0.96); background: var(--brand-soft); border-color: var(--brand-line); color: var(--brand); }
.ds-acct .up-note { color: var(--txt-3); font-size: 13px; line-height: 1.45; margin-top: 18px; text-align: center; text-wrap: pretty; }
.ds-acct .key-hint { color: var(--txt-3); font-size: 12.5px; line-height: 1.4; margin: 9px 2px 0; text-wrap: pretty; }
.ds-acct .dev-add { width: 100%; background: transparent; border: 0; border-top: 1px solid var(--line); text-align: left; cursor: pointer; -webkit-appearance: none; appearance: none; }
.ds-acct .dev-add:active { background: var(--surface-press); }
.ds-acct .dev-trial-cta { margin-top: 16px; padding: 18px; }
.ds-acct .dtc-top { display: flex; align-items: flex-start; gap: 13px; }
.ds-acct .dtc-ic { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); }
.ds-acct .dtc-t { font-family: var(--font-display); font-weight: 700; font-size: 16px; }
.ds-acct .dtc-s { color: var(--txt-2); font-size: 13.5px; line-height: 1.4; margin-top: 4px; text-wrap: pretty; }
.ds-acct .up-bal { display: flex; align-items: center; gap: 14px; padding: 14px 16px; margin-top: 12px; }
.ds-acct .up-bal-ic { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); }
.ds-acct .up-bal-text { flex: 1 1 auto; min-width: 0; }
.ds-acct .up-bal-t { font-family: var(--font-display); font-weight: 600; font-size: 15px; }
.ds-acct .up-bal-s { color: var(--txt-3); font-size: 12.5px; margin-top: 2px; }
.ds-acct .slide-confirm { margin: 6px 0 4px; }
.ds-acct .sc-track {
  position: relative; height: 60px; border-radius: 999px;
  background: rgba(255,90,82,0.1); border: 1px solid rgba(255,90,82,0.3);
  overflow: hidden; touch-action: none; user-select: none; -webkit-user-select: none;
}
.ds-acct .sc-fill { position: absolute; left: 0; top: 0; bottom: 0; width: 60px; border-radius: 999px; background: var(--danger); opacity: 0.9; }
.ds-acct .sc-label {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  color: #ff9a95; font-family: var(--font-body); font-weight: 600; font-size: 15px;
  padding-left: 40px; pointer-events: none; white-space: nowrap;
  transition: opacity var(--dur-fast);
}
.ds-acct .sc-thumb {
  position: absolute; left: 4px; top: 4px; width: 52px; height: 52px; border-radius: 50%;
  background: var(--danger); color: #fff; border: 0; cursor: grab;
  display: flex; align-items: center; justify-content: center; padding: 0;
  box-shadow: 0 4px 14px -4px rgba(255,90,82,0.7);
  touch-action: none; z-index: 2;
}
.ds-acct .sc-thumb:active { cursor: grabbing; }
.ds-acct .slide-confirm.armed .sc-thumb { background: #fff; color: var(--danger); }
.ds-acct .slide-confirm.done .sc-track { background: var(--danger); border-color: var(--danger); }
.ds-acct .slide-confirm.done .sc-label { color: #fff; padding-left: 0; }
.ds-acct .pay-method { display: flex; align-items: center; gap: 14px; width: 100%; padding: 15px 16px; background: var(--surface); color: var(--txt); border: 1.5px solid var(--line); border-radius: 18px; cursor: pointer; text-align: left; -webkit-appearance: none; appearance: none; margin-bottom: 10px; transition: border-color var(--dur-fast), transform var(--dur-fast); }
.ds-acct .pay-method:active { transform: scale(0.985); border-color: var(--brand-line); }
.ds-acct .pm-ic { flex: 0 0 auto; width: 46px; height: 46px; border-radius: 13px; display: flex; align-items: center; justify-content: center; }
.ds-acct .pm-sbp { background: rgba(0,194,255,0.13); border: 1px solid rgba(0,194,255,0.34); color: #57b9e8; }
.ds-acct .pm-card { background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); }
.ds-acct .pm-crypto { background: rgba(245,180,50,0.13); border: 1px solid rgba(245,180,50,0.34); color: #d99b1c; }
.ds-acct .pm-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.ds-acct .pm-name { font-family: var(--font-display); font-weight: 600; font-size: 16px; line-height: 1.1; }
.ds-acct .pm-sub { color: var(--txt-3); font-size: 12.5px; line-height: 1.3; }
.ds-acct .pm-arrow { flex: 0 0 auto; color: var(--txt-3); }
.ds-acct .wd-amount { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px; margin: 4px 0 14px; border-radius: 16px; background: var(--brand-soft); border: 1px solid var(--brand-line); }
.ds-acct .wd-amount-k { color: var(--txt-2); font-size: 14.5px; }
.ds-acct .wd-amount-v { font-family: var(--font-display); font-weight: 700; font-size: 24px; }
.ds-acct .wd-field-l { display: block; color: var(--txt-3); font-size: 13px; margin: 0 0 8px 2px; }
.ds-acct .wd-row { display: flex; align-items: center; gap: 10px; height: 58px; padding: 0 8px 0 18px; border-radius: 16px; background: var(--surface); border: 1.5px solid var(--line); transition: border-color var(--dur-fast); }
.ds-acct .wd-row:focus-within { border-color: var(--brand-line); }
.ds-acct .wd-input { flex: 1 1 auto; min-width: 0; background: transparent; border: 0; outline: none; color: var(--txt); font-family: var(--font-display); font-weight: 700; font-size: 26px; -webkit-appearance: none; appearance: none; }
.ds-acct .wd-input.err { color: var(--danger); }
.ds-acct .wd-cur { font-family: var(--font-display); font-weight: 700; font-size: 22px; color: var(--txt-3); }
.ds-acct .wd-max { height: 42px; padding: 0 16px; border-radius: 12px; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); font-weight: 600; font-size: 14px; cursor: pointer; }
.ds-acct .wd-err { color: var(--danger); font-size: 13px; margin: 8px 0 0 2px; }
.ds-acct .wd-remain { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 14px 0 4px; color: var(--txt-3); font-size: 14px; }
.ds-acct .wd-remain b { color: var(--txt); font-weight: 700; font-family: var(--font-display); }
.ds-acct .wd-remain span:last-child b { color: var(--brand); }
.ds-acct .link-field { display: flex; align-items: center; gap: 10px; padding: 14px 16px; }
.ds-acct .link-field code { flex: 1 1 auto; min-width: 0; font-family: var(--font-mono, monospace); font-size: 13.5px; color: var(--txt); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ds-acct .link-field .copy { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 11px; display: flex; align-items: center; justify-content: center; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); cursor: pointer; }
.ds-acct .stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ds-acct .stat { padding: 16px; }
.ds-acct .stat .k { color: var(--txt-3); font-size: 13px; }
.ds-acct .stat .v { font-family: var(--font-display); font-weight: 700; font-size: 26px; margin-top: 6px; }
.ds-acct .tg-switch { flex: 0 0 auto; position: relative; width: 50px; height: 30px; border-radius: 16px; background: var(--line-strong); border: 0; cursor: pointer; -webkit-appearance: none; appearance: none; transition: background var(--dur) var(--ease); }
.ds-acct .tg-switch .knob { position: absolute; top: 3px; left: 3px; width: 24px; height: 24px; border-radius: 50%; background: #fff; box-shadow: 0 2px 5px rgba(0,0,0,0.3); transition: transform var(--dur) var(--ease); }
.ds-acct .tg-switch.on { background: var(--brand); }
.ds-acct .tg-switch.on .knob { transform: translateX(20px); }
.ds-acct .locked-badge { display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 11px; border-radius: 14px; font-weight: 600; font-size: 12.5px; color: var(--brand); background: var(--brand-soft); border: 1px solid var(--brand-line); white-space: nowrap; }
.ds-acct .chat-hi { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 16px; font-size: 15px; line-height: 1.5; margin-top: 10px; }
.ds-acct .bubble { max-width: 80%; padding: 11px 14px; border-radius: 16px; font-size: 14.5px; line-height: 1.4; margin-top: 10px; }
.ds-acct .bubble.in { background: var(--surface); border: 1px solid var(--line); border-bottom-left-radius: 5px; margin-right: auto; }
.ds-acct .bubble.out { background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--txt); border-bottom-right-radius: 5px; margin-left: auto; }
.ds-acct .bubble .time { display: block; color: var(--txt-3); font-size: 11px; margin-top: 5px; }
.ds-acct .chat-input-bar { display: none; position: absolute; left: 0; right: 0; bottom: 0; z-index: 16; align-items: center; gap: 10px; padding: 12px 16px calc(14px + env(safe-area-inset-bottom)); background: var(--bg); border-top: 1px solid var(--line); }
.ds-acct.in-chat .chat-input-bar { display: flex; }
.ds-acct .chat-input-bar input { flex: 1 1 auto; height: 46px; padding: 0 16px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--line); color: var(--txt); font-size: 15px; outline: none; }
.ds-acct .chat-send { flex: 0 0 auto; width: 46px; height: 46px; border-radius: 50%; background: var(--grad); color: var(--brand-ink); border: 0; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.ds-acct .spoiler-head { width: 100%; display: flex; align-items: center; gap: 12px; padding: 14px 16px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); color: var(--txt); cursor: pointer; font-family: var(--font-display); font-weight: 700; font-size: 16px; -webkit-appearance: none; appearance: none; }
.ds-acct .spoiler-head .sp-ic { flex: 0 0 auto; width: 32px; height: 32px; border-radius: 9px; background: var(--surface-2); border: 1px solid var(--line); color: var(--txt-3); display: flex; align-items: center; justify-content: center; }
.ds-acct .spoiler-head .sp-chev { margin-left: auto; color: var(--txt-3); transition: transform var(--dur) var(--ease); }
.ds-acct .spoiler-body { overflow: hidden; max-height: 520px; opacity: 1; transition: max-height var(--dur) var(--ease), opacity var(--dur) var(--ease); }
.ds-acct .spoiler.collapsed .sp-chev { transform: rotate(-90deg); }
.ds-acct .spoiler.collapsed .spoiler-body { max-height: 0; opacity: 0; }
.ds-acct .carousel { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 12px -16px 0; padding: 0 16px; scrollbar-width: none; }
.ds-acct .carousel::-webkit-scrollbar { display: none; }
.ds-acct .cslide { flex: 0 0 100%; scroll-snap-align: center; padding: 18px; border-radius: var(--r-lg); background: var(--surface); border: 1px solid var(--line); min-height: 130px; }
.ds-acct .cstep { display: inline-block; font-weight: 700; font-size: 11px; letter-spacing: 0.04em; color: var(--brand); padding: 5px 10px; border-radius: 8px; background: var(--brand-soft); border: 1px solid var(--brand-line); margin-bottom: 12px; }
.ds-acct .cslide h4 { font-family: var(--font-display); font-weight: 700; font-size: 18px; margin: 0; }
.ds-acct .cslide p { color: var(--txt-2); font-size: 14px; line-height: 1.45; margin: 8px 0 0; }
.ds-acct .cslide b { color: var(--brand); }
.ds-acct .dots { display: flex; gap: 7px; justify-content: center; margin-top: 14px; }
.ds-acct .dots i { width: 22px; height: 6px; border-radius: 3px; background: var(--line-strong); transition: background var(--dur); }
.ds-acct .dots i.on { background: var(--brand); }
.ds-acct .dev-row { display: flex; align-items: center; gap: 14px; padding: 16px; }
.ds-acct .dev-row + .dev-row { border-top: 1px solid var(--line); }
.ds-acct .card.list { overscroll-behavior: auto; }
.ds-acct .dev-row-wrap { position: relative; overflow: hidden; }
.ds-acct .dev-row-wrap + .dev-row-wrap { border-top: 1px solid var(--line); }
.ds-acct .dev-row-slide { position: relative; z-index: 1; background: var(--surface); will-change: transform; transition: transform 0.18s var(--ease, ease-out); touch-action: pan-y; }
.ds-acct .dev-swipe-action { position: absolute; inset: 0 0 0 auto; width: 100%; padding-right: 20px; display: flex; align-items: center; justify-content: flex-end; border: 0; background: rgba(255,90,82,0.16); color: #ff9a95; font-weight: 600; font-size: 14px; cursor: pointer; }
@media (prefers-reduced-motion: reduce) {
.ds-acct .dev-row-slide { transition: none; }
}
.ds-acct .dev-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--brand); box-shadow: 0 0 8px rgba(0,227,122,0.7); flex: 0 0 auto; }
.ds-acct .dev-off { margin-left: auto; flex: 0 0 auto; height: 36px; padding: 0 14px; border-radius: 999px; background: rgba(255,90,82,0.1); border: 1px solid rgba(255,90,82,0.32); color: #ff9a95; font-weight: 600; font-size: 13.5px; white-space: nowrap; cursor: pointer; }
.ds-acct .dev-row-hint { color: var(--brand); font-size: 12.5px; margin-top: 3px; }
.ds-acct .slot-dots { display: inline-flex; gap: 5px; }
.ds-acct .slot-dots i { width: 9px; height: 9px; border-radius: 50%; background: var(--line-strong); }
.ds-acct .slot-dots i.fill { background: var(--txt); box-shadow: none; }
.ds-acct .slot-dots.full i.fill { background: #F5A623; }
@media (prefers-reduced-motion: reduce) {
.ds-acct .hero-status.ok .dot { animation: none; }
.ds-acct .skeleton::after { animation: none; }
}
.ds-acct .state-switch { position: fixed; top: 18px; left: 18px; z-index: 50; }
.ds-acct .ss-lbl { display: block; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: #6f7886; margin-bottom: 8px; font-family: var(--font-body); }
.ds-acct .ss-seg { display: inline-flex; gap: 4px; background: #11141a; border: 1px solid rgba(255,255,255,0.1); border-radius: 999px; padding: 4px; }
.ds-acct .ss-opt { height: 34px; padding: 0 14px; border: 0; background: transparent; border-radius: 999px; color: #aab2c0; font-family: var(--font-body); font-weight: 600; font-size: 13px; cursor: pointer; transition: background 0.15s, color 0.15s; }
.ds-acct .ss-opt.is-active { background: rgba(0,227,122,0.16); color: #00E37A; }
@media (max-width: 900px) {
.ds-acct .state-switch { display: none; }
}
.ds-acct .hero-status.danger { color: var(--danger); }
.ds-acct .hero-status.danger .dot { background: var(--danger); animation: none; }
.ds-acct .hero-ring.empty .prog { stroke: var(--line-strong); }
.ds-acct .hero-ring .core-ic { color: var(--txt-2); }
.ds-acct .hero-ring .core-ic svg { width: 46px; height: 46px; }
.ds-acct .hero-ring .core-ic[hidden] { display: none; }
.ds-acct .hero-cta { margin-top: 18px; }
.ds-acct .hero-cta[hidden] { display: none; }
.ds-acct .chips[hidden] { display: none; }
.ds-acct .chip.danger { color: #ff9a95; background: rgba(255,90,82,0.1); border-color: rgba(255,90,82,0.3); }
.ds-acct .btn.pulse { animation: cta-pulse 2.4s ease-in-out infinite; }
@keyframes cta-pulse { 0%,100% { box-shadow: 0 12px 30px -14px rgba(0,227,122,0.6), 0 0 0 0 rgba(0,227,122,0.4); } 50% { box-shadow: 0 14px 34px -12px rgba(0,227,122,0.75), 0 0 0 7px rgba(0,227,122,0); } }
@media (prefers-reduced-motion: reduce) {
.ds-acct .btn.pulse { animation: none; }
}
.ds-acct .sub-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ds-acct .sub-plan { color: var(--txt-2); font-size: 14.5px; line-height: 1.45; margin-top: 10px; text-wrap: pretty; }
.ds-acct .sub-bar { height: 8px; border-radius: 5px; background: var(--surface-2); overflow: hidden; margin-top: 14px; }
.ds-acct .sub-bar > span { display: block; height: 100%; border-radius: 5px; background: var(--grad); }
.ds-acct .sub-bar.danger > span { background: var(--danger); }
.ds-acct .sub-meta { display: flex; justify-content: space-between; gap: 10px; margin-top: 10px; color: var(--txt-3); font-size: 13.5px; }
.ds-acct .sub-meta b { color: var(--txt); }
.ds-acct .sub-price { font-family: var(--font-display); font-weight: 700; font-size: 16px; color: var(--txt); margin: 16px 0 14px; }
.ds-acct .sub-price b { font-size: 30px; letter-spacing: -0.02em; }
.ds-acct .sub-price span { color: var(--txt-3); font-size: 13px; font-weight: 500; font-family: var(--font-body); }
.ds-acct .locked-badge.danger { color: #ff9a95; background: rgba(255,90,82,0.1); border-color: rgba(255,90,82,0.3); }
.ds-acct .locked-badge.off { color: var(--txt-2); background: var(--surface-2); border-color: var(--line); }
.ds-acct .dev-dot.danger { background: var(--danger); box-shadow: none; }
.ds-acct .hero-status.trial { color: var(--brand-2); }
.ds-acct .hero-status.trial .dot { background: var(--brand-2); animation: pdot-trial 2.4s var(--ease-out) infinite; }
@keyframes pdot-trial { 0% { box-shadow: 0 0 0 0 rgba(0,194,255,0.5); } 70%,100% { box-shadow: 0 0 0 8px rgba(0,194,255,0); } }
.ds-acct .chip.trial { color: var(--brand-2); background: rgba(0,194,255,0.1); border-color: rgba(0,194,255,0.3); }
.ds-acct .locked-badge.trial { color: var(--brand-2); background: rgba(0,194,255,0.12); border-color: rgba(0,194,255,0.32); }
.ds-acct .sub-bar.trial > span { background: var(--brand-2); }
.ds-acct .dev-dot.trial { background: var(--brand-2); box-shadow: none; }
.ds-acct .dev-dot.awaiting { background: #ffd456; box-shadow: none; }
.ds-acct .ss-opt[data-sub="trial"].is-active, .ds-acct .ss-opt[data-sub="trialOn"].is-active { background: rgba(0,194,255,0.16); color: var(--brand-2); }
.ds-acct .upg-banner { display: flex; align-items: flex-start; gap: 10px; margin-top: 16px; padding: 13px 15px; border-radius: var(--r-md); background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--txt); font-size: 13.5px; line-height: 1.4; }
.ds-acct .upg-banner[hidden] { display: none; }
.ds-acct .upg-banner svg { flex: 0 0 auto; color: var(--brand); margin-top: 1px; }
.ds-acct .upg-banner b { font-weight: 700; }
.ds-acct .seg-opt.is-locked { opacity: 0.4; }
.ds-acct .seg-opt.is-current { position: relative; }
.ds-acct .seg-opt .seg-cur { display: block; font-size: 10px; font-weight: 700; color: var(--brand); margin-top: 1px; }
.ds-acct .srv-stats { display: flex; gap: 10px; margin: 4px 0 18px; }
.ds-acct .srv-stat { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 16px 8px; border-radius: var(--r-md); background: var(--surface); border: 1px solid var(--line); }
.ds-acct .srv-v { font-family: var(--font-display); font-weight: 700; font-size: 22px; color: var(--brand); }
.ds-acct .srv-u { font-size: 12px; font-weight: 600; color: var(--txt-3); margin-left: 1px; }
.ds-acct .srv-k { font-size: 12px; color: var(--txt-3); }
.ds-acct .con-hero { padding: 22px 20px; text-align: center; }
.ds-acct .con-hero-k { color: var(--txt-3); font-size: 13px; }
.ds-acct .con-price-row { display: flex; flex-direction: column; align-items: center; gap: 9px; margin-top: 6px; }
.ds-acct .con-price { font-family: var(--font-display); font-weight: 700; font-size: 46px; line-height: 1; letter-spacing: -0.02em; white-space: nowrap; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ds-acct .con-price-row { flex-direction: column; }
.ds-acct .con-save { font-size: 13px; color: var(--brand); background: var(--brand-soft); border: 1px solid var(--brand-line); padding: 5px 10px; border-radius: 999px; white-space: nowrap; }
.ds-acct .con-save[hidden] { display: none; }
.ds-acct .con-save b { font-weight: 700; }
.ds-acct .con-sub { color: var(--txt-2); font-size: 14px; margin-top: 10px; }
.ds-acct .con-block { margin-top: 22px; }
.ds-acct .con-block-head { display: flex; align-items: center; justify-content: space-between; color: var(--txt-2); font-size: 14px; margin-bottom: 14px; }
.ds-acct .con-dev-right { display: inline-flex; align-items: baseline; gap: 7px; }
.ds-acct .con-dev-right b { font-family: var(--font-display); font-weight: 700; font-size: 26px; color: var(--txt); }
.ds-acct .con-dev-max { color: var(--txt-3); font-size: 13px; }
.ds-acct .con-vol { font-size: 11.5px; font-weight: 700; color: var(--brand); background: var(--brand-soft); border: 1px solid var(--brand-line); padding: 3px 7px; border-radius: 7px; align-self: center; }
.ds-acct .con-vol[hidden] { display: none; }
.ds-acct .con-range { -webkit-appearance: none; appearance: none; width: 100%; height: 16px; border-radius: 999px; background: linear-gradient(90deg, var(--brand) 0%, var(--brand-2) var(--fill,0%), var(--surface-2) var(--fill,0%), var(--surface-2) 100%); outline: none; cursor: pointer; }
.ds-acct .con-range::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 34px; height: 34px; border-radius: 50%; background: #fff; border: 4px solid var(--brand); box-shadow: 0 4px 14px -4px rgba(0,0,0,0.5); cursor: grab; }
.ds-acct .con-range::-webkit-slider-thumb:active { cursor: grabbing; transform: scale(1.08); }
.ds-acct .con-range::-moz-range-thumb { width: 34px; height: 34px; border-radius: 50%; background: #fff; border: 4px solid var(--brand); cursor: grab; }
.ds-acct .con-range-scale { display: flex; justify-content: space-between; color: var(--txt-3); font-size: 12px; margin-top: 10px; padding: 0 2px; }
.ds-acct .con-terms { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; }
.ds-acct .con-term { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 11px 4px; border-radius: 14px; background: var(--surface); border: 1.5px solid var(--line); color: var(--txt-2); cursor: pointer; -webkit-appearance: none; appearance: none; transition: border-color var(--dur-fast), background var(--dur-fast); }
.ds-acct .con-term:active { transform: scale(0.96); }
.ds-acct .con-term .ct-m { font-family: var(--font-display); font-weight: 700; font-size: 13.5px; color: var(--txt); white-space: nowrap; }
.ds-acct .con-term .ct-d { font-size: 10.5px; font-weight: 700; color: var(--brand); }
.ds-acct .con-term .ct-d.ct-empty { color: transparent; }
.ds-acct .con-term.on { border-color: var(--brand); background: var(--brand-soft); }
[data-theme="dark"] .ds-acct .screen-frame::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(60% 45% at 22% 12%, rgba(0,227,122,0.14) 0%, transparent 60%),
    radial-gradient(60% 45% at 82% 88%, rgba(0,194,255,0.12) 0%, transparent 62%),
    var(--bg);
}
.ds-acct .app-bg { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
[data-theme="light"] .ds-acct .app-bg { opacity: 0.5; }
.ds-acct .app-bg .ab { position: absolute; border-radius: 50%; filter: blur(46px); will-change: transform; opacity: 1; }
.ds-acct .app-bg .ab1 { width: 82%; height: 50%; top: -14%; left: -16%; background: radial-gradient(circle, rgba(0,227,122,0.72), transparent 66%); animation: ab-a 11s ease-in-out infinite alternate; }
.ds-acct .app-bg .ab2 { width: 74%; height: 48%; top: -8%; right: -18%; background: radial-gradient(circle, rgba(0,194,255,0.66), transparent 66%); animation: ab-b 13s ease-in-out infinite alternate; }
.ds-acct .app-bg .ab3 { width: 78%; height: 54%; bottom: -16%; left: 6%; background: radial-gradient(circle, rgba(0,194,255,0.44), transparent 68%); animation: ab-c 15s ease-in-out infinite alternate; }
@keyframes ab-a { to { transform: translate(42%, 48%) scale(1.32); } }
@keyframes ab-b { to { transform: translate(-40%, 52%) scale(1.26); } }
@keyframes ab-c { to { transform: translate(34%, -46%) scale(1.36); } }
[data-theme="dark"] .ds-acct .screen-frame::after {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(135% 90% at 50% 42%, rgba(10,12,16,0.42) 0%, rgba(10,12,16,0.05) 50%, transparent 70%),
    linear-gradient(180deg, rgba(10,12,16,0.32) 0%, transparent 26%, transparent 60%, rgba(7,9,13,0.74) 100%);
}
@media (prefers-reduced-motion: reduce) {
.ds-acct .app-bg .ab { animation: none; }
}
.ds-acct[data-home="expired"] .app-bg .ab1, .ds-acct[data-home="trialExpired"] .app-bg .ab1 { background: radial-gradient(circle, rgba(255,90,82,0.62), transparent 66%); }
.ds-acct[data-home="expired"] .app-bg .ab2, .ds-acct[data-home="trialExpired"] .app-bg .ab2 { background: radial-gradient(circle, rgba(255,90,82,0.5), transparent 66%); }
.ds-acct[data-home="expired"] .app-bg .ab3, .ds-acct[data-home="trialExpired"] .app-bg .ab3 { background: radial-gradient(circle, rgba(255,120,90,0.4), transparent 68%); }
.ds-acct .screen[data-screen="upgrade"] { padding-bottom: 24px; }
.ds-acct .note-line { color: var(--txt-2); font-size: 14px; line-height: 1.5; margin-top: 16px; text-wrap: pretty; }
.ds-acct .up-block { margin-top: 14px; padding: 18px; }
.ds-acct .up-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.ds-acct .up-title { font-family: var(--font-display); font-weight: 700; font-size: 16.5px; letter-spacing: -0.01em; }
.ds-acct .up-cap { color: var(--txt-3); font-size: 13px; margin-top: 3px; }
.ds-acct .up-hint { color: var(--txt-3); font-size: 12.5px; margin-top: 10px; }
.ds-acct .stepper { display: flex; align-items: center; gap: 4px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 999px; padding: 4px; flex: 0 0 auto; }
.ds-acct .step-btn { width: 38px; height: 38px; border-radius: 50%; border: 0; background: var(--surface); color: var(--txt); display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: var(--shadow); transition: transform 0.12s var(--ease), opacity 0.12s; -webkit-appearance: none; appearance: none; }
.ds-acct .step-btn:active { transform: scale(0.9); }
.ds-acct .step-btn:disabled { opacity: 0.32; cursor: default; box-shadow: none; }
.ds-acct .step-val { min-width: 36px; text-align: center; font-family: var(--font-display); font-weight: 700; font-size: 21px; letter-spacing: -0.02em; }
.ds-acct .perdev { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.ds-acct .perdev-k { color: var(--txt-2); font-size: 14px; }
.ds-acct .perdev-v { display: inline-flex; align-items: baseline; }
.ds-acct .perdev-old { color: var(--txt-3); text-decoration: line-through; text-decoration-thickness: 2px; margin-right: 9px; font-size: 15px; font-weight: 600; }
.ds-acct .perdev-old[hidden] { display: none; }
.ds-acct .perdev-v b { font-family: var(--font-display); font-weight: 700; font-size: 20px; letter-spacing: -0.02em; transition: color 0.35s var(--ease); }
.ds-acct .perdev-suf { color: var(--txt-3); font-size: 13px; margin-left: 2px; }
.ds-acct .perdev.win .perdev-v b { color: var(--brand); }
.ds-acct .perdev.flash { animation: pd-flash 0.6s var(--ease-out); }
@keyframes pd-flash { 0% { transform: scale(1); } 35% { transform: scale(1.06); } 100% { transform: scale(1); } }
.ds-acct .vol-badge { display: flex; align-items: center; gap: 9px; margin-top: 13px; padding: 10px 13px; border-radius: 12px; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); font-size: 13px; font-weight: 600; line-height: 1.3; }
.ds-acct .vol-badge[hidden] { display: none; }
.ds-acct .vol-badge svg { flex: 0 0 auto; }
.ds-acct .term-badge { display: inline-flex; align-items: center; height: 27px; padding: 0 12px; border-radius: 13px; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); font-size: 12.5px; font-weight: 700; white-space: nowrap; flex: 0 0 auto; }
.ds-acct .term-badge[hidden] { display: none; }
.ds-acct .up-presets .seg-opt { font-size: 13px; height: 40px; }
.ds-acct .up-slider-row { margin-top: 20px; padding: 0 2px; }
.ds-acct .timeline { position: relative; height: 14px; border-radius: 999px; background: var(--surface-2); margin: 18px 0 30px; }
.ds-acct .tl-fill { position: absolute; top: 0; height: 100%; border-radius: 999px; transition: width 0.45s var(--ease-out); }
.ds-acct .tl-add { left: 0; width: 100%; background: var(--brand-2); }
.ds-acct .tl-rem { left: 0; width: var(--rem, 100%); background: var(--brand); z-index: 2; }
.ds-acct .tl-now, .ds-acct .tl-end { position: absolute; top: 22px; font-size: 12.5px; }
.ds-acct .tl-now { left: 0; color: var(--txt-3); }
.ds-acct .tl-end { right: 0; color: var(--txt); font-weight: 700; }
.ds-acct .tl-legend { display: flex; gap: 18px; color: var(--txt-3); font-size: 12.5px; }
.ds-acct .tl-legend span { display: inline-flex; align-items: center; gap: 7px; }
.ds-acct .tl-legend span[hidden] { display: none; }
.ds-acct .tl-dot { width: 9px; height: 9px; border-radius: 50%; }
.ds-acct .tl-dot.rem { background: var(--brand); }
.ds-acct .tl-dot.add { background: var(--brand-2); }
.ds-acct .bd-rows { display: flex; flex-direction: column; }
.ds-acct .bd-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 11px 0; border-top: 1px solid var(--line); }
.ds-acct .bd-row:first-child { border-top: 0; padding-top: 2px; }
.ds-acct .bd-k { color: var(--txt-2); font-size: 14px; line-height: 1.35; }
.ds-acct .bd-k .bd-sub { display: block; color: var(--txt-3); font-size: 12px; margin-top: 2px; }
.ds-acct .bd-v { color: var(--txt); font-weight: 600; font-size: 14.5px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ds-acct .bd-row.save .bd-v { color: var(--brand); }
.ds-acct .bd-total { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 6px; padding-top: 14px; border-top: 1.5px solid var(--line-strong); }
.ds-acct .bd-total span { color: var(--txt-2); font-size: 14.5px; }
.ds-acct .bd-total b { font-family: var(--font-display); font-weight: 700; font-size: 23px; letter-spacing: -0.02em; }
.ds-acct #breakdownCard.empty { opacity: 0.55; }
.ds-acct .bal-block { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 18px; }
.ds-acct .bal-left { display: flex; align-items: center; gap: 13px; min-width: 0; }
.ds-acct .bal-ic { width: 42px; height: 42px; border-radius: 12px; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.ds-acct .bal-t { font-weight: 600; font-size: 15px; }
.ds-acct .bal-s { color: var(--txt-3); font-size: 13px; margin-top: 2px; }
.ds-acct .bal-block.disabled { opacity: 0.45; pointer-events: none; }
.ds-acct .up-sticky {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 14;
  padding: 13px 16px calc(15px + env(safe-area-inset-bottom));
  background: linear-gradient(to top, var(--bg) 58%, color-mix(in srgb, var(--bg) 70%, transparent) 88%, transparent);
  display: none;
  pointer-events: none;
}
.ds-acct .screen-frame.show-sticky .up-sticky { display: block; pointer-events: auto; animation: sheet-up var(--dur) var(--ease-out); }
.ds-acct .ust-info { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; margin-bottom: 11px; padding: 0 3px; }
.ds-acct .ust-amount-wrap { min-width: 0; }
.ds-acct .ust-k { display: block; color: var(--txt-3); font-size: 12.5px; margin-bottom: 1px; }
.ds-acct .ust-amount { font-family: var(--font-display); font-weight: 700; font-size: 31px; letter-spacing: -0.02em; line-height: 1; }
.ds-acct .ust-strike { color: var(--txt-3); font-size: 14px; font-weight: 700; text-decoration: line-through; text-decoration-thickness: 2px; margin-left: 9px; }
.ds-acct .ust-strike[hidden] { display: none; }
.ds-acct .ust-plan { color: var(--txt-2); font-size: 12.5px; line-height: 1.35; text-align: right; max-width: 47%; text-wrap: pretty; }
.ds-acct .ust-plan b { color: var(--txt); }
.ds-acct .success-meta { display: flex; align-items: center; justify-content: space-between; gap: 6px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); padding: 16px 4px; margin-bottom: 16px; }
.ds-acct .sm-cell { flex: 1 1 0; min-width: 0; text-align: center; display: flex; flex-direction: column; gap: 5px; }
.ds-acct .sm-k { color: var(--txt-3); font-size: 11.5px; }
.ds-acct .sm-v { font-family: var(--font-display); font-weight: 700; font-size: 18px; letter-spacing: -0.01em; white-space: nowrap; }
.ds-acct .sm-div { width: 1px; height: 32px; background: var(--line); flex: 0 0 auto; }
.ds-acct .success-pop { animation: succ-pop 0.5s var(--ease-out); }
@keyframes succ-pop { 0% { transform: scale(0.4); opacity: 0; } 60% { transform: scale(1.12); } 100% { transform: scale(1); opacity: 1; } }
.ds-acct .confetti { position: absolute; left: 0; right: 0; top: 0; height: 0; overflow: visible; pointer-events: none; }
.ds-acct .confetti i { position: absolute; top: 0; width: 8px; height: 8px; border-radius: 2px; opacity: 0; }
.ds-acct .confetti.go i { animation: confetti-drop 1.15s var(--ease-out) forwards; }
@keyframes confetti-drop { 0% { opacity: 1; transform: translateY(-10px) rotate(0deg); } 100% { opacity: 0; transform: translateY(240px) rotate(340deg); } }
@media (prefers-reduced-motion: reduce) {
.ds-acct .success-pop { animation: none; }
.ds-acct .confetti { display: none; }
.ds-acct .perdev.flash { animation: none; }
.ds-acct .tl-fill { transition: none; }
}
.ds-acct .wd-progress { padding: 16px 18px; }
.ds-acct .wdp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 11px; }
.ds-acct .wdp-t { color: var(--txt-2); font-size: 14px; }
.ds-acct .wdp-v { font-family: var(--font-display); font-weight: 700; font-size: 16px; }
.ds-acct .wd-progress.ready .wdp-v { color: var(--brand); }
.ds-acct .wdp-bar { height: 9px; border-radius: 6px; background: var(--surface-2); overflow: hidden; }
.ds-acct .wdp-bar > span { display: block; height: 100%; border-radius: 6px; background: var(--grad); transition: width 0.5s var(--ease-out); }
.ds-acct .wdp-foot { color: var(--txt-3); font-size: 12.5px; margin-top: 10px; }
.ds-acct .wd-progress.ready .wdp-foot { color: var(--brand); }
.ds-acct .btn[disabled] { opacity: 0.42; pointer-events: none; box-shadow: none; }
.ds-acct #stateSwitch { display: none; }
.ds-acct[data-active="home"] #stateSwitch { display: block; }
.ds-acct .ref-switch { display: none; }
.ds-acct[data-active="referral"] .ref-switch { display: block; }
.ds-acct .hero-status.warn .dot { animation: pdot-warn 2.4s var(--ease-out) infinite; }
@keyframes pdot-warn { 0% { box-shadow: 0 0 0 0 rgba(255,138,130,0.5); } 70%,100% { box-shadow: 0 0 0 8px rgba(255,138,130,0); } }
.ds-acct .chip.warn { color: #ff8a82; background: rgba(255,138,130,0.10); border-color: rgba(255,138,130,0.30); }
.ds-acct .locked-badge.warn { color: #ff8a82; background: rgba(255,138,130,0.12); border-color: rgba(255,138,130,0.32); }
.ds-acct .dev-dot.warn { background: #ff8a82; box-shadow: none; }
.ds-acct .sub-bar.warn > span { background: #ff8a82; }
.ds-acct .ss-opt[data-sub="expiring"].is-active { background: rgba(255,138,130,0.16); color: #ff8a82; }
.ds-acct .btn .info-ic { width: 18px; height: 18px; opacity: 0.9; }
.ds-acct .ref-empty { padding: 24px 20px; text-align: center; }
.ds-acct .ref-empty .re-ic { display: inline-flex; width: 54px; height: 54px; border-radius: 16px; align-items: center; justify-content: center; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); margin-bottom: 14px; }
.ds-acct .ref-empty .re-t { font-family: var(--font-display); font-weight: 700; font-size: 17px; }
.ds-acct .ref-empty .re-s { color: var(--txt-2); font-size: 14px; line-height: 1.5; margin-top: 8px; text-wrap: pretty; }
.ds-acct .ref-hint { display: flex; align-items: flex-start; gap: 9px; margin-top: 14px; padding: 11px 13px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--line); color: var(--txt-2); font-size: 13px; line-height: 1.4; }
.ds-acct .ref-hint svg { flex: 0 0 auto; width: 17px; height: 17px; color: var(--txt-3); margin-top: 1px; }
.ds-acct #refStats[hidden], .ds-acct #refActions[hidden], .ds-acct #refHint[hidden], .ds-acct #wdProgress[hidden], .ds-acct #refPayBtn[hidden], .ds-acct #refEmpty[hidden] { display: none !important; }
.ds-acct[data-active="plans"] .ref-switch, .ds-acct[data-active="constructor"] .ref-switch, .ds-acct[data-active="upgrade"] .ref-switch { display: block; }
.ds-acct .hero-autopay { display: flex; align-items: center; gap: 9px; margin-top: 12px; padding: 12px 14px; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--line); }
.ds-acct .hero-autopay .ha-ic { display: inline-flex; color: var(--brand); flex: 0 0 auto; }
.ds-acct .hero-autopay .ha-text { font-size: 13.5px; color: var(--txt-2); line-height: 1.35; }
.ds-acct .hero-autopay .ha-text b { color: var(--txt); font-family: var(--font-display); }
.ds-acct .pay-autopay { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 14px; margin-bottom: 14px; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--line); }
.ds-acct .pay-autopay .pa-left { display: flex; align-items: center; gap: 11px; min-width: 0; }
.ds-acct .pay-autopay .pa-ic { display: inline-flex; width: 38px; height: 38px; border-radius: 11px; align-items: center; justify-content: center; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); flex: 0 0 auto; }
.ds-acct .pay-autopay .pa-t { font-weight: 600; font-size: 15px; }
.ds-acct .pay-autopay .pa-s { color: var(--txt-3); font-size: 12.5px; margin-top: 2px; line-height: 1.3; }
.ds-acct .pay-method.disabled { opacity: 0.45; }
.ds-acct .pay-method.disabled .pm-arrow { display: none; }
.ds-acct .pay-method.disabled .pm-sub { color: #f5b432; }
.ds-acct .ap-demo { top: 110px; }
.ds-acct[data-active="home"] .ap-demo { display: block; }
.ds-acct .ap-demo { display: none; }
.ds-acct .ss-opt[data-ap].is-active { background: rgba(0,227,122,0.16); color: var(--brand); }
.ds-acct .slide-confirm { position: relative; height: 60px; border-radius: 16px; background: var(--surface-2); border: 1px solid var(--line); overflow: hidden; margin: 6px 0 14px; -webkit-user-select: none; user-select: none; touch-action: none; }
.ds-acct .slide-confirm .sc-fill { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: rgba(245,180,50,0.18); transition: width 0.2s var(--ease); }
.ds-acct .slide-confirm .sc-label { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 14.5px; color: var(--txt-2); pointer-events: none; }
.ds-acct .slide-confirm .sc-knob { position: absolute; left: 4px; top: 4px; width: 52px; height: 52px; border-radius: 13px; background: #f5b432; color: #1a1206; display: flex; align-items: center; justify-content: center; cursor: grab; box-shadow: 0 4px 12px -3px rgba(245,180,50,0.6); }
.ds-acct .slide-confirm .sc-knob:active { cursor: grabbing; }
.ds-acct .slide-confirm.done .sc-fill { background: rgba(245,180,50,0.32); }
.ds-acct .slide-confirm.done .sc-label { opacity: 0; }
.ds-acct .status-badge { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; padding: 5px 11px 5px 9px; border-radius: 999px; font-size: 12.5px; font-weight: 600; font-family: var(--font-body); }
.ds-acct .status-badge .sb-dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
.ds-acct .status-badge.ok { color: var(--brand); background: var(--brand-soft); border: 1px solid var(--brand-line); }
.ds-acct .status-badge.ok .sb-dot { background: var(--brand); box-shadow: 0 0 0 0 rgba(0,227,122,0.5); animation: sbPulse 2.4s var(--ease-out) infinite; }
@keyframes sbPulse { 0% { box-shadow: 0 0 0 0 rgba(0,227,122,0.5); } 70%,100% { box-shadow: 0 0 0 6px rgba(0,227,122,0); } }
@media (prefers-reduced-motion: reduce) {
.ds-acct .status-badge.ok .sb-dot { animation: none; }
}
.ds-acct .net-status { text-align: left; }
.ds-acct .net-rows { padding: 4px 4px; margin-bottom: 14px; }
.ds-acct .net-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 12px; font-size: 14.5px; color: var(--txt-2); }
.ds-acct .net-row + .net-row { border-top: 1px solid var(--line); }
.ds-acct .sheet-ic.ok { display: flex; align-items: center; justify-content: center; background: var(--brand-soft); border: 1px solid var(--brand-line); }
.ds-acct .sheet-ic.ok .sb-dot { background: var(--brand); border-radius: 50%; box-shadow: 0 0 12px rgba(0,227,122,0.6); }
.ds-acct .chat-head { position: sticky; top: -4px; z-index: 20; display: flex; align-items: center; gap: 11px; padding: 12px 16px; margin: -4px -16px 14px; background: rgba(20,24,31,0.92); -webkit-backdrop-filter: blur(16px) saturate(1.3); backdrop-filter: blur(16px) saturate(1.3); border-bottom: 1px solid var(--line-strong); }
[data-theme="light"] .ds-acct .chat-head { background: rgba(255,255,255,0.92); }
.ds-acct .chat-head .ch-back { flex: 0 0 auto; width: 34px; height: 34px; margin-left: -6px; display: flex; align-items: center; justify-content: center; border: 0; background: transparent; color: var(--txt-2); cursor: pointer; border-radius: 10px; }
.ds-acct .chat-head .ch-back:active { background: var(--surface-2); }
.ds-acct .chat-head .ch-av { position: relative; flex: 0 0 auto; }
.ds-acct .chat-head .ch-av img { width: 42px; height: 42px; border-radius: 50%; display: block; }
.ds-acct .chat-head .ch-online { position: absolute; right: -1px; bottom: -1px; width: 12px; height: 12px; border-radius: 50%; background: var(--brand); border: 2.5px solid var(--bg); box-shadow: 0 0 0 0 rgba(0,227,122,0.5); animation: sbPulse 2.4s var(--ease-out) infinite; }
.ds-acct .chat-head .ch-meta { flex: 1 1 auto; min-width: 0; }
.ds-acct .chat-head .ch-name { font-family: var(--font-display); font-weight: 700; font-size: 16px; line-height: 1.1; }
.ds-acct .chat-head .ch-status { display: flex; align-items: center; gap: 6px; color: var(--brand); font-size: 12.5px; margin-top: 3px; }
.ds-acct .chat-head .ch-status-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--brand); }
.ds-acct .chat-head .ch-tag { flex: 0 0 auto; width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border-radius: 11px; background: var(--surface-2); border: 1px solid var(--line); color: var(--txt-2); }
@media (prefers-reduced-motion: reduce) {
.ds-acct .chat-head .ch-online { animation: none; }
}
.ds-acct .faq-wrap { position: relative; border-radius: 18px; overflow: hidden; }
.ds-acct .faq-wrap .faq-blur { filter: blur(5px) saturate(0.7); opacity: 0.5; pointer-events: none; -webkit-user-select: none; user-select: none; }
.ds-acct .faq-wrap .faq-wip { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px; text-align: center; background: rgba(13,16,22,0.32); }
.ds-acct .faq-wip .fw-badge { display: inline-flex; align-items: center; gap: 7px; padding: 9px 16px; border-radius: 999px; background: var(--surface); border: 1px solid var(--line-strong); color: var(--txt); font-family: var(--font-display); font-weight: 700; font-size: 14.5px; box-shadow: 0 8px 22px -10px rgba(0,0,0,0.7); }
.ds-acct .faq-wip .fw-badge svg { color: var(--brand); }
.ds-acct .faq-wip .fw-sub { color: var(--txt-2); font-size: 12.5px; }
.ds-acct .ref-soon { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 14px; padding: 64px 26px; }
.ds-acct .ref-soon-ic { width: 76px; height: 76px; border-radius: 22px; display: flex; align-items: center; justify-content: center; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); }
.ds-acct .ref-soon-t { font-family: var(--font-display); font-weight: 700; font-size: 22px; line-height: 1.2; }
.ds-acct .ref-soon-s { color: var(--txt-2); font-size: 14.5px; line-height: 1.5; max-width: 290px; text-wrap: pretty; }
.ds-acct .ref-soon-s b { color: var(--brand); font-weight: 700; }
.ds-acct .ref-soon-badge { display: inline-flex; align-items: center; gap: 7px; margin-top: 4px; padding: 9px 16px; border-radius: 999px; background: var(--surface); border: 1px solid var(--line-strong); color: var(--txt); font-size: 13px; font-weight: 600; white-space: nowrap; }
.ds-acct .ref-soon-badge svg { flex: 0 0 auto; color: var(--brand); }
.ds-acct .ref-wipwrap { position: relative; }
.ds-acct .ref-wipwrap.is-wip #refLive { filter: blur(7px) saturate(0.8); opacity: 0.5; pointer-events: none; -webkit-user-select: none; user-select: none; }
.ds-acct .ref-wipwrap.is-wip #refSoon { position: absolute; inset: 0; z-index: 3; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 20px; }
.ds-acct .ref-wipwrap:not(.is-wip) #refSoon { display: none; }
.ds-acct .support-wipwrap { position: relative; min-height: 320px; }
.ds-acct .support-wipwrap.is-wip #supportLive { filter: blur(7px) saturate(0.8); opacity: 0.45; pointer-events: none; -webkit-user-select: none; user-select: none; }
.ds-acct .support-wipwrap.is-wip #supportLock { position: absolute; inset: 0; z-index: 3; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 20px; }
.ds-acct .support-wipwrap:not(.is-wip) #supportLock { display: none; }
.ds-acct .ref-wrap { position: relative; border-radius: 18px; overflow: hidden; }
.ds-acct .ref-wrap .ref-blur { filter: blur(6px) saturate(0.7); opacity: 0.45; pointer-events: none; -webkit-user-select: none; user-select: none; }
.ds-acct .ref-wrap .ref-wip { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px; text-align: center; padding: 20px; }
.ds-acct .ref-wrap .ref-wip { }
.ds-acct .chat-sys { display: flex; align-items: flex-start; gap: 8px; max-width: 84%; margin: 4px auto 6px; padding: 9px 13px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--line); color: var(--txt-2); font-size: 12.5px; line-height: 1.4; text-align: left; text-wrap: pretty; }
.ds-acct .chat-sys svg { flex: 0 0 auto; color: var(--txt-3); margin-top: 1px; }
.ds-acct .chat-attach { flex: 0 0 auto; width: 42px; height: 46px; display: flex; align-items: center; justify-content: center; border: 0; background: transparent; color: var(--txt-2); cursor: pointer; border-radius: 12px; }
.ds-acct .chat-attach:active { background: var(--surface-2); color: var(--brand); }
.ds-acct .bubble.has-file { padding: 9px 10px; }
.ds-acct .bubble .file-chip { display: flex; align-items: center; gap: 10px; }
.ds-acct .bubble .fc-ic { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,0.18); color: var(--brand); }
.ds-acct .bubble .fc-meta { display: flex; flex-direction: column; min-width: 0; }
.ds-acct .bubble .fc-name { font-size: 13.5px; font-weight: 600; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ds-acct .bubble .fc-size { font-size: 11.5px; color: var(--txt-3); margin-top: 1px; }
.ds-acct .sub-autopay { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--line); }
.ds-acct .sub-autopay .sa-left { display: flex; align-items: center; gap: 11px; min-width: 0; }
.ds-acct .sub-autopay .sa-ic { flex: 0 0 auto; width: 36px; height: 36px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); }
.ds-acct .sub-autopay .sa-ic svg { width: 19px; height: 19px; }
.ds-acct .sub-autopay .sa-t { font-weight: 600; font-size: 15px; }
.ds-acct .sub-autopay .sa-s { color: var(--txt-3); font-size: 12.5px; margin-top: 2px; }
.ds-acct .pay-status { display: flex; flex-direction: column; }
.ds-acct .ps-center { flex: 1 1 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; min-height: 60vh; padding: 20px 6px; }
.ds-acct .ps-title { font-family: var(--font-display); font-weight: 700; font-size: 24px; margin: 18px 0 0; letter-spacing: -0.01em; }
.ds-acct .ps-sub { color: var(--txt-2); font-size: 14.5px; line-height: 1.5; margin: 10px 0 0; max-width: 320px; text-wrap: pretty; }
.ds-acct .ps-actions { padding: 14px 0 calc(20px + env(safe-area-inset-bottom)); }
.ds-acct .ps-nox { position: relative; width: 132px; height: 132px; display: flex; align-items: center; justify-content: center; }
.ds-acct .ps-nox img { width: 116px; height: 116px; border-radius: 50%; display: block; }
.ds-acct .ps-ring { position: absolute; inset: 0; border-radius: 50%; border: 3px solid transparent; border-top-color: var(--brand); border-right-color: var(--brand-2); animation: psSpin 1s linear infinite; }
@keyframes psSpin { to { transform: rotate(360deg); } }
.ds-acct .ps-dots { display: flex; gap: 7px; margin-top: 22px; }
.ds-acct .ps-dots i { width: 8px; height: 8px; border-radius: 50%; background: var(--brand); opacity: 0.35; animation: psDot 1.2s var(--ease-out) infinite; }
.ds-acct .ps-dots i:nth-child(2) { animation-delay: 0.18s; }
.ds-acct .ps-dots i:nth-child(3) { animation-delay: 0.36s; }
@keyframes psDot { 0%,100%{ opacity:0.3; transform:translateY(0);} 50%{ opacity:1; transform:translateY(-4px);} }
.ds-acct .ps-secure { display: inline-flex; align-items: center; gap: 7px; margin-top: 24px; color: var(--txt-3); font-size: 12.5px; }
@media (prefers-reduced-motion: reduce) {
.ds-acct .ps-ring { animation: none; }
.ds-acct .ps-dots i { animation: none; opacity: 0.6; }
}
.ds-acct .ps-icon { width: 76px; height: 76px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.ds-acct .ps-icon.error { background: rgba(255,90,82,0.12); border: 1px solid rgba(255,90,82,0.34); color: #ff6a62; }
.ds-acct .ps-icon.ok { background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); }
.ds-acct .ps-reason { display: inline-flex; align-items: center; gap: 7px; margin-top: 16px; padding: 7px 13px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--line); color: var(--txt-2); font-size: 12.5px; }
.ds-acct .ps-reason svg { color: #ff9a95; }
.ds-acct .ps-success-head { position: relative; text-align: center; padding: 20px 6px 6px; }
.ds-acct .ps-success-head .ps-icon { margin: 0 auto; }
.ds-acct .ps-success-head .ps-title { font-size: 28px; }
.ds-acct .ps-sbp { flex: 1 1 auto; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 14px 6px 0; }
.ds-acct .sbp-qr { margin-top: 22px; padding: 14px; background: #fff; border-radius: 20px; box-shadow: 0 14px 38px -14px rgba(0,0,0,0.7); }
.ds-acct .sbp-qr img { display: block; width: 220px; height: 220px; border-radius: 8px; }
.ds-acct .sbp-amount { margin-top: 16px; color: var(--txt-2); font-size: 14.5px; }
.ds-acct .sbp-amount b { font-family: var(--font-display); font-size: 18px; color: var(--txt); margin-left: 4px; }
.ds-acct .sbp-logo { display: inline-flex; align-items: center; gap: 8px; margin-top: 10px; color: var(--txt-3); font-size: 12.5px; }
.ds-acct .sbp-mark { width: 16px; height: 16px; border-radius: 4px; background: conic-gradient(from 200deg, #00C24D, #1F8FFF, #F5A623, #E94B7B, #00C24D); }
.ds-acct .pay-demo { top: 110px; display: none; }
.ds-acct[data-active="plans"] .pay-demo, .ds-acct[data-active="constructor"] .pay-demo, .ds-acct[data-active="upgrade"] .pay-demo, .ds-acct[data-active="paySbp"] .pay-demo, .ds-acct[data-active="payProcessing"] .pay-demo, .ds-acct[data-active="payError"] .pay-demo, .ds-acct[data-active="paySuccess"] .pay-demo { display: block; }
.ds-acct[data-active="plans"] .ap-demo, .ds-acct[data-active="constructor"] .ap-demo, .ds-acct[data-active="upgrade"] .ap-demo { display: none; }
.ds-acct .ss-opt[data-out="err"].is-active { background: rgba(255,90,82,0.16); color: #ff6a62; }
.ds-acct .instr-os { margin-bottom: 14px; }
.ds-acct .instr-os-lbl { display: block; color: var(--txt-3); font-size: 12px; margin-bottom: 8px; }
.ds-acct .os-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.ds-acct .os-opt { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 12px 6px; border-radius: 13px; background: var(--surface-2); border: 1px solid var(--line); color: var(--txt-2); font-family: var(--font-body); font-weight: 600; font-size: 13px; cursor: pointer; transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease), color var(--dur) var(--ease); }
.ds-acct .os-opt .os-i { width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; }
.ds-acct .os-opt .os-i svg { width: 22px; height: 22px; }
.ds-acct .os-opt:active { transform: scale(0.96); }
.ds-acct .os-opt.on { background: var(--brand-soft); border-color: var(--brand-line); color: var(--brand); }
.ds-acct .instr-steps { display: flex; flex-direction: column; gap: 10px; }
.ds-acct .instr-step { display: flex; gap: 13px; padding: 16px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); }
.ds-acct .instr-step .is-num { flex: 0 0 auto; width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); font-family: var(--font-display); font-weight: 700; font-size: 15px; }
.ds-acct .instr-step .is-body { flex: 1 1 auto; min-width: 0; }
.ds-acct .instr-step .is-t { font-weight: 600; font-size: 15.5px; }
.ds-acct .instr-step .is-s { color: var(--txt-2); font-size: 13px; line-height: 1.4; margin-top: 3px; text-wrap: pretty; }
.ds-acct .instr-step .btn { margin-top: 12px; width: 100%; }
.ds-acct .instr-media { margin-top: 12px; height: 132px; border-radius: 12px; border: 1.5px dashed var(--line-strong); background: var(--surface-2); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: var(--txt-3); font-size: 12.5px; text-align: center; }
.ds-acct .instr-media svg { color: var(--txt-3); }
.ds-acct .screen.wizard { display: flex; flex-direction: column; padding-bottom: 16px; }
.ds-acct .wiz-top { display: flex; align-items: center; gap: 12px; padding: 6px 0 18px; }
.ds-acct .wiz-progress { display: flex; gap: 6px; flex: 1 1 auto; }
.ds-acct .wiz-progress i { height: 4px; flex: 1 1 0; border-radius: 2px; background: var(--line-strong); transition: background 0.3s var(--ease), box-shadow 0.3s var(--ease); }
.ds-acct .wiz-progress i.done { background: var(--brand); }
.ds-acct .wiz-progress i.now { background: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.ds-acct .wiz-step-label { flex: 0 0 auto; font-size: 12px; color: var(--txt-3); font-variant-numeric: tabular-nums; }
.ds-acct .wiz-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden; scrollbar-width: none; padding-bottom: 6px; }
.ds-acct .wiz-body::-webkit-scrollbar { display: none; }
.ds-acct .wiz-title { font-family: var(--font-display); font-weight: 700; font-size: 23px; letter-spacing: -0.01em; line-height: 1.16; text-wrap: balance; }
.ds-acct .wiz-sub { color: var(--txt-2); font-size: 14.5px; line-height: 1.5; margin-top: 9px; text-wrap: pretty; }
.ds-acct .wiz-sub b { color: var(--txt); font-weight: 650; }
.ds-acct .wiz-hero { width: 62px; height: 62px; border-radius: 18px; display: flex; align-items: center; justify-content: center; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); margin-bottom: 16px; }
.ds-acct .wiz-hero svg { width: 30px; height: 30px; }
.ds-acct .wiz-callout { display: flex; gap: 11px; margin-top: 16px; padding: 14px 15px; border-radius: 14px; background: rgba(245,180,50,0.10); border: 1px solid rgba(245,180,50,0.30); }
.ds-acct .wiz-callout .wc-ic { flex: 0 0 auto; color: #f5b432; margin-top: 1px; }
.ds-acct .wiz-callout .wc-ic svg { display: block; }
.ds-acct .wiz-callout .wc-body { font-size: 13.5px; line-height: 1.5; color: var(--txt-2); text-wrap: pretty; }
.ds-acct .wiz-callout .wc-body b { color: var(--txt); font-weight: 650; }
.ds-acct .wiz-ktag { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--line); color: var(--txt-2); font-size: 12.5px; font-weight: 600; margin-bottom: 14px; }
.ds-acct .wiz-ktag .kt-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.ds-acct .wiz-shot { margin-top: 16px; display: flex; justify-content: center; }
.ds-acct .wiz-shot img { display: block; width: auto; height: auto; max-width: 240px; max-height: 430px; border-radius: 20px; border: 1px solid var(--line); box-shadow: 0 12px 30px rgba(0,0,0,0.28); background: #ededed; }
.ds-acct .wiz-shot-pair { display: flex; gap: 10px; margin-top: 16px; align-items: flex-start; justify-content: center; }
.ds-acct .wsp-item { flex: 1 1 0; min-width: 0; max-width: 200px; display: flex; flex-direction: column; gap: 8px; }
.ds-acct .wsp-item img { display: block; width: 100%; height: auto; border-radius: 14px; border: 1px solid var(--line); box-shadow: 0 10px 24px rgba(0,0,0,0.26); background: #ededed; }
.ds-acct .wsp-item figcaption { font-size: 12px; line-height: 1.3; color: var(--txt-2); text-align: center; text-wrap: pretty; }
.ds-acct .wiz-nav { position: sticky; bottom: 0; display: grid; grid-template-columns: auto 1fr; gap: 10px; padding-top: 14px; margin-top: 8px; background: linear-gradient(to top, var(--bg) 60%, transparent); }
.ds-acct .wiz-nav .btn { margin: 0; }
.ds-acct .wiz-nav .btn-soft { padding-left: 22px; padding-right: 22px; }
.ds-acct .setup-count { margin-top: 18px; font-size: 14px; color: var(--txt-3); }
.ds-acct .setup-count b { color: var(--txt); font-variant-numeric: tabular-nums; }
.ds-acct .ps-rain { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.ds-acct .ps-rain span { position: absolute; top: -8%; font-family: var(--font-display); font-weight: 700; color: #ff5a52; opacity: 0; text-shadow: 0 0 10px rgba(255,90,82,0.35); animation-name: errFall; animation-timing-function: cubic-bezier(0.4,0,0.7,1); animation-iteration-count: 1; animation-fill-mode: both; }
@keyframes errFall {
  0% { transform: translateY(0) rotate(0); opacity: 0; }
  12% { opacity: 0.85; }
  80% { opacity: 0.7; }
  100% { transform: translateY(108vh) rotate(var(--rot, 30deg)); opacity: 0; }
}
.ds-acct .pay-status[data-screen="payError"] .ps-center, .ds-acct .pay-status .ps-actions { position: relative; z-index: 1; }
.ds-acct .ps-rain-ok span { color: #00E37A; text-shadow: 0 0 10px rgba(0,227,122,0.4); }
.ds-acct .pay-status[data-screen="paySuccess"] .ps-success-head, .ds-acct .pay-status[data-screen="paySuccess"] .instr { position: relative; z-index: 1; }
.ds-acct .disc-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 18px; }
.ds-acct .disc-card .bal-ic.gift { color: #FFD66B; background: rgba(255,214,107,0.12); border-color: rgba(255,214,107,0.34); }
.ds-acct .disc-badge { flex: 0 0 auto; padding: 6px 12px; border-radius: 999px; background: rgba(255,214,107,0.14); border: 1px solid rgba(255,214,107,0.4); color: #FFD66B; font-family: var(--font-display); font-weight: 700; font-size: 14px; }
.ds-acct .ref-disc-banner { display: flex; align-items: center; gap: 11px; margin-bottom: 14px; padding: 13px 14px; border-radius: 16px; text-decoration: none; color: inherit; background: linear-gradient(110deg, rgba(255,214,107,0.16), rgba(0,227,122,0.10)); border: 1px solid rgba(255,214,107,0.34); }
.ds-acct .ref-disc-banner .rdb-ic { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 11px; display: flex; align-items: center; justify-content: center; background: rgba(255,214,107,0.16); border: 1px solid rgba(255,214,107,0.4); color: #FFD66B; }
.ds-acct .ref-disc-banner .rdb-text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.ds-acct .ref-disc-banner .rdb-text b { font-size: 14.5px; }
.ds-acct .ref-disc-banner .rdb-text span { color: var(--txt-2); font-size: 12.5px; margin-top: 2px; }
.ds-acct .ref-disc-banner .rdb-chev { flex: 0 0 auto; color: var(--txt-3); }
.ds-acct .rw-badge { width: 132px; height: 132px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: radial-gradient(circle at 50% 40%, rgba(255,214,107,0.22), rgba(0,227,122,0.10)); border: 1px solid rgba(255,214,107,0.4); }
.ds-acct .rw-pct { font-family: var(--font-display); font-weight: 700; font-size: 44px; letter-spacing: -0.02em; background: linear-gradient(120deg, #FFD66B, #00E37A); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ds-acct .rw-perks { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 20px; }
.ds-acct .rw-perk { display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--line); color: var(--txt-2); font-size: 13px; }
.ds-acct .rw-perk svg { color: var(--brand); }
.ds-acct .disc-demo { top: 168px; display: none; }
.ds-acct[data-active="home"][data-home="trial"] .disc-demo, .ds-acct[data-active="home"][data-home="trialOn"] .disc-demo { display: block; }
.ds-acct .disc-demo .ss-lbl b { color: var(--brand); }
.ds-acct .disc-demo-range { -webkit-appearance: none; appearance: none; width: 180px; height: 6px; border-radius: 999px; background: linear-gradient(90deg, var(--brand) var(--fill,0%), #2a2f3a var(--fill,0%)); outline: none; }
.ds-acct .disc-demo-range::-webkit-slider-thumb { -webkit-appearance: none; width: 18px; height: 18px; border-radius: 50%; background: var(--brand); border: 2px solid #0b0e13; cursor: pointer; }
.ds-acct .disc-demo-range::-moz-range-thumb { width: 18px; height: 18px; border-radius: 50%; background: var(--brand); border: 2px solid #0b0e13; cursor: pointer; }
.ds-acct .disc-apply { display: block; margin-top: 10px; width: 100%; height: 34px; border: 0; border-radius: 10px; background: var(--brand); color: var(--brand-ink, #06250f); font-family: var(--font-body); font-weight: 700; font-size: 13px; cursor: pointer; }
.ds-acct .disc-apply:active { transform: scale(0.97); }
.ds-acct .demo-panel { position: fixed; top: 14px; left: 14px; z-index: 60; width: 216px; background: rgba(12,15,20,0.94); border: 1px solid rgba(255,255,255,0.1); border-radius: 16px; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 14px 34px -14px rgba(0,0,0,0.75); overflow: hidden; display: none; }
.ds-acct .demo-panel { display: block; }
.ds-acct .demo-head { display: flex; align-items: center; gap: 8px; width: 100%; padding: 11px 14px; background: transparent; border: 0; color: #8b93a3; font-family: var(--font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.12em; cursor: pointer; }
.ds-acct .demo-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--brand); box-shadow: 0 0 8px rgba(0,227,122,0.6); }
.ds-acct .demo-chev { margin-left: auto; display: flex; transition: transform 0.25s var(--ease); }
.ds-acct .demo-panel.collapsed .demo-chev { transform: rotate(-90deg); }
.ds-acct .demo-panel.collapsed { width: max-content; }
.ds-acct .demo-body { padding: 2px 14px 14px; display: flex; flex-direction: column; gap: 14px; max-height: 74vh; overflow-y: auto; scrollbar-width: none; }
.ds-acct .demo-body::-webkit-scrollbar { display: none; }
.ds-acct .demo-panel.collapsed .demo-body { display: none; }
.ds-acct .demo-body .state-switch { position: static; top: auto; left: auto; }
.ds-acct .demo-body .ss-seg { flex-wrap: wrap; border-radius: 12px; padding: 5px; gap: 5px; }
.ds-acct .demo-body .ss-opt { height: 30px; padding: 0 10px; font-size: 12px; border-radius: 8px; white-space: nowrap; }
.ds-acct .demo-body .ss-opt.is-active { border-radius: 8px; }
.ds-acct .demo-body .ss-lbl { margin-bottom: 6px; }
.ds-acct .demo-body #stateSwitch, .ds-acct .demo-body .ref-switch, .ds-acct .demo-body .ap-demo, .ds-acct .demo-body .pay-demo, .ds-acct .demo-body .disc-demo { display: block !important; }
@media (max-width: 900px) {
.ds-acct .demo-panel { display: none !important; }
}
.ds-acct .qa-support { display: flex; align-items: center; gap: 10px; width: 100%; margin-top: 12px; padding: 13px 16px; border-radius: var(--r-lg); background: transparent; border: 1px solid var(--line); color: var(--txt-2); font-family: var(--font-body); font-size: 14px; font-weight: 500; cursor: pointer; transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease); }
.ds-acct .qa-support:active { background: var(--surface-2); }
.ds-acct .qa-support .qas-ic { display: inline-flex; color: var(--txt-3); flex: 0 0 auto; }
.ds-acct .qa-support > span:nth-child(2) { flex: 1 1 auto; text-align: left; }
.ds-acct .qa-support .qas-chev { color: var(--txt-3); flex: 0 0 auto; }
.ds-acct .acc-badge { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px; padding: 6px 11px; border-radius: 999px; font-size: 12px; font-weight: 600; background: var(--surface-2); border: 1px solid var(--line); color: var(--txt-2); }
.ds-acct .acc-badge.ok { background: var(--brand-soft); border-color: var(--brand-line); color: var(--brand); }
.ds-acct .acc-badge.warn { background: rgba(245,180,50,0.12); border-color: rgba(245,180,50,0.34); color: #f5b432; }
.ds-acct .email-field { margin: 4px 0 14px; }
.ds-acct .email-field input { width: 100%; height: 50px; padding: 0 16px; border-radius: 13px; background: var(--surface-2); border: 1px solid var(--line-strong); color: var(--txt); font-family: var(--font-body); font-size: 16px; outline: none; transition: border-color var(--dur) var(--ease); }
.ds-acct .email-field input::placeholder { color: var(--txt-3); }
.ds-acct .email-field input:focus { border-color: var(--brand); }
.ds-acct .email-field input.err { border-color: #ff5a52; }
.ds-acct .hero-reassure { display: flex; align-items: center; gap: 10px; margin-top: 16px; padding: 13px 15px; border-radius: var(--r-md); background: var(--surface); border: 1px solid var(--brand-line); color: var(--txt); font-size: 13.5px; line-height: 1.35; box-shadow: var(--shadow); overflow: hidden; }
.ds-acct .hero-reassure.hr-in { animation: hr-drop 0.45s var(--ease-out); }
.ds-acct .hero-reassure.hr-out { animation: hr-lift 0.4s var(--ease) forwards; }
@keyframes hr-drop { from { opacity: 0; transform: translateY(-16px); } to { opacity: 1; transform: none; } }
@keyframes hr-lift { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(-16px); } }
@media (prefers-reduced-motion: reduce) {
.ds-acct .hero-reassure.hr-in, .ds-acct .hero-reassure.hr-out { animation: none; }
}
.ds-acct .hero-reassure[hidden] { display: none; }
.ds-acct .hero-reassure .hr-ic { flex: 0 0 auto; width: 30px; height: 30px; border-radius: 9px; display: flex; align-items: center; justify-content: center; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand); }
.ds-acct .hero-reassure .hr-text { flex: 1 1 auto; text-wrap: pretty; }
@keyframes hr-pop { from { opacity: 0.001; transform: translateY(8px) scale(0.98); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
.ds-acct .hero-reassure { animation: none; }
}
.ds-acct .chip.meter { gap: 9px; padding-right: 14px; }
.ds-acct .chip.meter .meter-segs { display: inline-flex; gap: 3px; }
.ds-acct .chip.meter .meter-segs i { width: 14px; height: 6px; border-radius: 3px; background: transparent; box-shadow: inset 0 0 0 1px var(--line-strong); transition: background 0.3s var(--ease); }
.ds-acct .chip.meter .meter-segs i.on { background: var(--txt); box-shadow: none; }
.ds-acct .chip.meter.full .meter-segs i.on { background: #F5A623; box-shadow: none; }
.ds-acct .chip.meter.full b { color: #F5A623; }
.ds-acct .chip.meter b { font-family: var(--font-display); font-weight: 700; font-size: 13px; color: var(--txt-2); }
.ds-acct .chip.meter.trial .meter-segs i.on { background: var(--txt); box-shadow: none; }
.ds-acct .chip.meter.danger .meter-segs i { background: rgba(255,90,82,0.28); }
.ds-acct .chip.meter.danger .meter-segs i.on { background: #ff5a52; box-shadow: none; }
.ds-acct .chip.meter.muted { opacity: 0.55; }
.ds-acct .locked-badge.gift-badge { color: var(--brand); background: var(--brand-soft); border-color: var(--brand-line); }
.ds-acct .sheet-ic.gift-ic { animation: gift-bounce 0.6s var(--ease-out); }
@keyframes gift-bounce { 0% { transform: scale(0.4); opacity: 0; } 60% { transform: scale(1.12); } 100% { transform: scale(1); opacity: 1; } }
.ds-acct .chip.meter.muted .meter-segs i { background: var(--line); }
.ds-acct .chip.meter.muted b { color: var(--txt-3); }
.ds-acct .sup-intro { display: flex; align-items: center; gap: 14px; margin-top: 8px; }
.ds-acct .sup-nox { position: relative; flex: 0 0 auto; }
.ds-acct .sup-nox img { width: 56px; height: 56px; border-radius: 50%; display: block; }
.ds-acct .sup-nox-dot { position: absolute; right: 1px; bottom: 1px; width: 13px; height: 13px; border-radius: 50%; background: var(--brand); border: 2.5px solid var(--bg); box-shadow: 0 0 7px rgba(0,227,122,0.6); }
.ds-acct .sup-intro .sub b { color: var(--txt); font-weight: 600; }
.ds-acct .theme-opts { display: flex; flex-direction: column; gap: 8px; margin: 6px 0 14px; }
.ds-acct .theme-opt { display: flex; align-items: center; gap: 13px; width: 100%; padding: 14px 16px; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--line); color: var(--txt); font-family: var(--font-body); font-size: 15px; font-weight: 600; cursor: pointer; transition: border-color var(--dur) var(--ease), background var(--dur) var(--ease); }
.ds-acct .theme-opt .to-ic { display: inline-flex; color: var(--txt-2); flex: 0 0 auto; }
.ds-acct .theme-opt .to-t { flex: 1 1 auto; text-align: left; }
.ds-acct .theme-opt .to-check { color: var(--brand); opacity: 0; transform: scale(0.6); transition: opacity var(--dur) var(--ease), transform 0.3s cubic-bezier(0.34,1.5,0.6,1); }
.ds-acct .theme-opt.sel { border-color: var(--brand-line); background: var(--brand-soft); }
.ds-acct .theme-opt.sel .to-ic { color: var(--brand); }
.ds-acct .theme-opt.sel .to-check { opacity: 1; transform: scale(1); }
.ds-acct .gift-link-card { padding: 8px 8px 8px 14px; margin-bottom: 14px; }
.ds-acct .gift-link { align-items: center; gap: 10px; }
.ds-acct .gift-link code { white-space: normal; word-break: break-all; line-height: 1.4; text-align: left; }
.ds-acct .gift-link .copy { flex: 0 0 auto; }
.ds-acct .dev-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 14px; }
.ds-acct .dev-chip { padding: 9px 14px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--line); color: var(--txt-2); font-family: var(--font-body); font-size: 13.5px; font-weight: 500; cursor: pointer; transition: border-color var(--dur) var(--ease), background var(--dur) var(--ease), color var(--dur) var(--ease); }
.ds-acct .dev-chip:active { transform: scale(0.96); }
.ds-acct .dev-chip.on { background: var(--brand-soft); border-color: var(--brand-line); color: var(--brand); }
.ds-acct .sheet-support {
  width: 100%; height: 46px; margin-top: 8px;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  background: transparent; border: 0; cursor: pointer;
  color: var(--brand); font-family: var(--font-body); font-weight: 600; font-size: 14px;
  -webkit-appearance: none; appearance: none; transition: opacity var(--dur-fast);
}
.ds-acct .sheet-support svg { width: 17px; height: 17px; }
.ds-acct .sheet-support:active { opacity: 0.6; }
.ds-acct .hero-ring { width: 188px; height: 188px; }
.ds-acct .hero-ring::before {
  content: ""; position: absolute; inset: 16%; border-radius: 50%; z-index: 0; pointer-events: none;
  background: radial-gradient(circle, rgba(0,227,122,0.20), transparent 70%);
  filter: blur(9px); transition: background var(--dur) var(--ease), opacity var(--dur) var(--ease);
}
.ds-acct .hero-ring.warn::before { background: radial-gradient(circle, rgba(245,180,50,0.22), transparent 70%); }
.ds-acct .hero-ring.trial::before { background: radial-gradient(circle, rgba(0,194,255,0.22), transparent 70%); }
.ds-acct .hero-ring.empty::before { background: radial-gradient(circle, rgba(255,255,255,0.05), transparent 72%); }
.ds-acct .hero-ring > svg { position: relative; z-index: 1; }
.ds-acct .hero-ring .core { z-index: 2; }
.ds-acct .hero-ring .core .n { font-size: 62px; letter-spacing: -0.04em; font-variant-numeric: tabular-nums; }
.ds-acct .hero-ring.ok .core .n {
  background: var(--grad); -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  filter: drop-shadow(0 2px 13px rgba(0,227,122,0.35));
}
.ds-acct .hero-ring.warn .core .n { filter: drop-shadow(0 2px 13px rgba(245,180,50,0.40)); }
.ds-acct .hero-ring.trial .core .n { filter: drop-shadow(0 2px 13px rgba(0,194,255,0.40)); }
.ds-acct #heroCapWrap { transform-origin: 84px 84px; transition: transform 1s var(--ease-out), opacity 0.5s var(--ease-out); }
.ds-acct .hero-ring .cap { fill: var(--brand-2); filter: drop-shadow(0 0 6px rgba(0,194,255,0.85)); }
.ds-acct .hero-ring.warn .cap { fill: #ff8a82; filter: none; }
.ds-acct .hero-ring.trial .cap { fill: var(--brand-2); }
@media (prefers-reduced-motion: reduce) {
.ds-acct #heroCapWrap { transition: none; }
}
.ds-acct .nn-boot {
  position: absolute; inset: 0; z-index: 17; overflow: hidden;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 26px;
  background: var(--bg);
  transition: opacity 0.6s var(--ease-out), visibility 0.6s;
}
.ds-acct .nn-boot.done { opacity: 0; visibility: hidden; pointer-events: none; }
.ds-acct .nn-boot[hidden] { display: none; }
.ds-acct .nn-boot .nn-boot-bg { z-index: 0; }
.ds-acct .nn-boot::after {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(125% 80% at 50% 42%, rgba(10,12,16,0.5) 0%, rgba(10,12,16,0.1) 46%, transparent 66%),
    linear-gradient(180deg, rgba(10,12,16,0.4) 0%, transparent 26%, transparent 60%, rgba(7,9,13,0.82) 100%);
}
[data-theme="light"] .ds-acct .nn-boot::after {
  background:
    radial-gradient(125% 80% at 50% 42%, rgba(238,241,245,0.5) 0%, transparent 60%),
    linear-gradient(180deg, transparent 60%, rgba(238,241,245,0.7) 100%);
}
.ds-acct .pre-stage { position: relative; z-index: 1; display: grid; place-items: center; width: 248px; height: 318px; }
.ds-acct .pre-figure { position: relative; z-index: 2; width: 100%; height: 100%; animation: pre-float 3.4s var(--ease) infinite; }
.ds-acct .pre-nox { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.ds-acct .pre-scan {
  position: absolute; left: 6%; right: 6%; top: 0; height: 30%; pointer-events: none; z-index: 3;
  background: linear-gradient(180deg, transparent, rgba(0,227,122,0.45) 48%, rgba(0,194,255,0.45) 52%, transparent);
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 38%, #000 62%, transparent 100%);
          mask-image: linear-gradient(to right, transparent 0%, #000 38%, #000 62%, transparent 100%);
  filter: blur(10px); animation: pre-scan 3.6s var(--ease) infinite;
}
.ds-acct .pre-glow {
  position: absolute; z-index: 1; top: 5%; left: 50%; width: 58%; aspect-ratio: 1; transform: translateX(-50%);
  border-radius: 50%; background: radial-gradient(circle, rgba(0,194,255,0.5), rgba(0,194,255,0) 68%);
  filter: blur(6px); animation: pre-glow 3.4s var(--ease) infinite;
}
.ds-acct .pre-sonar { position: absolute; z-index: 0; bottom: 3%; left: 50%; transform: translateX(-50%); width: 200px; height: 64px; }
.ds-acct .pre-sonar span { position: absolute; inset: 0; border: 1.5px solid rgba(0,227,122,0.55); border-radius: 50%; opacity: 0; animation: pre-sonar 2.8s var(--ease-out) infinite; }
.ds-acct .pre-sonar span:nth-child(2) { animation-delay: 0.93s; border-color: rgba(0,194,255,0.5); }
.ds-acct .pre-sonar span:nth-child(3) { animation-delay: 1.86s; }
.ds-acct .pre-shadow { position: absolute; z-index: 0; bottom: 2%; left: 50%; transform: translateX(-50%); width: 132px; height: 16px; border-radius: 50%; background: radial-gradient(ellipse at center, rgba(0,0,0,0.5), transparent 70%); filter: blur(5px); animation: pre-shadow 3.4s var(--ease) infinite; }
.ds-acct .pre-lockup {
  position: absolute; z-index: 5; top: 0; left: 50%; transform: translate(-50%, -116%); width: max-content;
  display: inline-flex; align-items: center; gap: 9px; animation: pre-float-lockup 3.4s var(--ease) infinite;
}
.ds-acct .pre-logomark { flex: none; width: 24px; height: auto; filter: drop-shadow(0 0 9px rgba(0,194,255,0.7)); }
.ds-acct .pre-logomark path { fill: #00E37A; animation: pre-logohue 2.6s var(--ease) infinite; }
.ds-acct .pre-logoword {
  font-family: var(--font-display); font-weight: 700; font-size: 20px; letter-spacing: -0.01em; line-height: 1;
  background: linear-gradient(100deg, #00E37A 0%, #00C2FF 36%, #B9F0FF 50%, #00C2FF 64%, #00E37A 100%);
  background-size: 220% 100%; -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent; animation: pre-flow 2.6s linear infinite;
}
.ds-acct .pre-bracket { flex: none; width: 6px; height: 19px; border: 2px solid rgba(0,194,255,0.5); }
.ds-acct .pre-bracket--l { border-right: 0; }
.ds-acct .pre-bracket--r { border-left: 0; }
.ds-acct .pre-meta { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 13px; }
.ds-acct .pre-bar { width: 188px; height: 3px; border-radius: 2px; background: var(--line); overflow: hidden; }
.ds-acct .pre-bar i { display: block; height: 100%; width: 40%; border-radius: 2px; background: var(--grad); animation: load-sweep 1.1s var(--ease) infinite; }
.ds-acct .pre-word { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-display); font-weight: 500; font-size: 13.5px; color: var(--txt-2); text-align: center; padding-inline: 20px; }
.ds-acct .pre-word__lock { width: 15px; height: 15px; color: var(--brand); flex: none; }
.ds-acct .pre-dots { display: inline-flex; gap: 3px; }
.ds-acct .pre-dots i { width: 3px; height: 3px; border-radius: 50%; background: currentColor; opacity: 0.3; animation: pre-dots 1.4s var(--ease) infinite; }
.ds-acct .pre-dots i:nth-child(2) { animation-delay: 0.2s; }
.ds-acct .pre-dots i:nth-child(3) { animation-delay: 0.4s; }
@keyframes pre-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes pre-float-lockup { 0%,100% { transform: translate(-50%, -116%); } 50% { transform: translate(-50%, calc(-116% - 9px)); } }
@keyframes pre-glow { 0%,100% { opacity: 0.55; } 50% { opacity: 1; } }
@keyframes pre-shadow { 0%,100% { opacity: 0.8; transform: translateX(-50%) scaleX(1); } 50% { opacity: 0.5; transform: translateX(-50%) scaleX(0.86); } }
@keyframes pre-scan { 0% { top: 6%; opacity: 0; } 18% { opacity: 1; } 50% { opacity: 1; } 64% { top: 62%; opacity: 0; } 100% { top: 62%; opacity: 0; } }
@keyframes pre-sonar { 0% { opacity: 0; transform: scale(0.25); } 25% { opacity: 0.9; } 100% { opacity: 0; transform: scale(1.15); } }
@keyframes pre-logohue { 0%,100% { fill: #00E37A; } 50% { fill: #00C2FF; } }
@keyframes pre-flow { 0% { background-position: 0 0; } 100% { background-position: 220% 0; } }
@keyframes load-sweep { 0% { transform: translateX(-120%); } 100% { transform: translateX(360%); } }
@keyframes pre-dots { 0%,100% { opacity: 0.3; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
.ds-acct .pre-figure, .ds-acct .pre-glow, .ds-acct .pre-scan, .ds-acct .pre-sonar span, .ds-acct .pre-shadow, .ds-acct .pre-bar i, .ds-acct .pre-dots i, .ds-acct .pre-lockup, .ds-acct .pre-logomark path, .ds-acct .pre-logoword { animation: none; }
.ds-acct .pre-scan { display: none; }
.ds-acct .nn-boot { transition: opacity 0.2s, visibility 0.2s; }
}
.ds-acct .isteps {list-style:none;margin:18px 0 0;padding:0;display:flex;flex-direction:column;gap:12px}
.ds-acct .istep {display:flex;gap:13px;align-items:flex-start}
.ds-acct .inum {flex:0 0 auto;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:14px;color:var(--brand-ink);background:var(--grad);box-shadow:0 6px 16px -8px rgba(0,227,122,.7);margin-top:1px}
.ds-acct .istep.muted .inum {background:var(--surface-press);color:var(--txt-3);box-shadow:none}
.ds-acct .ibody {flex:1 1 auto;min-width:0}
.ds-acct .ititle {font-weight:700;font-size:15.5px;letter-spacing:-.005em}
.ds-acct .isub {color:var(--txt-2);font-size:13.5px;line-height:1.5;margin:4px 0 0;text-wrap:pretty}
.ds-acct .isub b {color:var(--txt);font-weight:650}
.ds-acct .iact {margin-top:10px;display:flex;flex-direction:column;gap:8px;min-width:0}
.ds-acct .iact .btn {padding:12px 14px;font-size:14px}
.ds-acct .or-sep {align-self:center;font-size:11.5px;font-weight:700;letter-spacing:.06em;color:var(--txt-3);text-transform:uppercase;margin:-1px 0}
.ds-acct .altlink {display:flex;align-items:flex-start;gap:7px;color:var(--txt-3);font-size:12.5px;font-weight:400;
  background:none;border:none;cursor:pointer;padding:0;text-align:left;line-height:1.4;white-space:normal;
  text-decoration:none}
.ds-acct .altlink:hover {color:var(--txt-2);text-decoration:underline;text-underline-offset:3px}
.ds-acct .pwr-ic {display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;
  background:var(--brand-soft);border:1px solid var(--brand-line);color:var(--brand);vertical-align:middle;margin:0 2px}
.ds-acct .pwr-ic svg {width:12px;height:12px}
.ds-acct .inote {display:flex;gap:7px;align-items:flex-start;margin-top:9px;font-size:12px;line-height:1.45;color:var(--txt-3)}
.ds-acct .inote svg {width:14px;height:14px;flex:0 0 auto;margin-top:1px;color:var(--txt-3)}
.ds-acct .inote b {color:var(--txt-2);font-weight:650}
.ds-acct .reward {flex:1 1 auto;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:18px;padding:8px}
.ds-acct .reward .orb {width:84px;height:84px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:var(--brand-ink);background:var(--grad-signal-h);box-shadow:0 0 0 8px var(--brand-soft),0 16px 40px -10px rgba(0,227,122,.7);
  animation:orb-pop .5s var(--ease-out) both}
.ds-acct .reward .orb path {stroke-dasharray:28;stroke-dashoffset:28;animation:check-draw .42s .26s var(--ease-out) forwards}
@keyframes orb-pop{0%{transform:scale(0);opacity:0}62%{transform:scale(1.12)}100%{transform:scale(1);opacity:1}}
@keyframes check-draw{to{stroke-dashoffset:0}}
.ds-acct .upsell {display:flex;flex-direction:column;gap:10px;width:100%;margin-top:4px}
.ds-acct .promo {display:flex;gap:11px;align-items:flex-start;text-align:left;width:100%;padding:14px;border-radius:16px;
  background:var(--surface-2);border:1px solid var(--line)}
.ds-acct .promo-ic {flex:0 0 auto;width:26px;height:26px;color:var(--brand)}
.ds-acct .promo-ic svg {width:26px;height:26px}
.ds-acct .promo-tx {display:flex;flex-direction:column;gap:3px;min-width:0}
.ds-acct .promo-tx b {font-size:14.5px;color:var(--txt)}
.ds-acct .promo-tx span {font-size:12.5px;line-height:1.45;color:var(--txt-2)}
.ds-acct .pulse-cta {box-shadow:0 0 0 1px var(--brand-line),0 14px 34px -12px rgba(0,227,122,.75);
  animation:pulse-cta 1.7s var(--ease) infinite;will-change:transform}
@keyframes pulse-cta{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}
.ds-acct .cabinet-link {align-self:stretch;min-height:46px;margin-top:8px;display:flex;align-items:center;justify-content:center;
  gap:6px;background:transparent;border:1px solid var(--line);border-radius:13px;color:var(--txt-3);
  font-family:var(--font-body);font-size:13px;font-weight:600;cursor:pointer;transition:.15s var(--ease)}
.ds-acct .cabinet-link:hover {color:var(--txt-2);border-color:var(--line-strong);background:var(--surface-2)}
.ds-acct .cabinet-link:active {transform:scale(.985)}
@media (prefers-reduced-motion:reduce) {
.ds-acct .reward .orb, .ds-acct .reward .orb path {animation:none}
.ds-acct .reward .orb path {stroke-dashoffset:0}
.ds-acct .pulse-cta {animation:none}
}
.ds-acct .checkout-cta-bar {position:sticky;bottom:0;padding-top:10px;margin-top:10px;
  background:linear-gradient(to top,var(--bg) 60%,transparent);z-index:2}
.ds-acct .checkout-cta-bar .btn {margin:0}
.ds-acct .checkout-pick-hint {margin:0 0 8px;font-size:13px;text-align:center;
  color:var(--txt-2);font-weight:500;letter-spacing:.01em}
.ds-acct .checkout-summary {display:flex;flex-direction:column;gap:4px;padding:14px 16px;
  margin-bottom:16px;background:var(--surface-2);border:1.5px solid var(--brand-line);
  border-radius:16px}
.ds-acct .checkout-summary__today {font-size:22px;font-weight:700;color:var(--txt);
  font-family:var(--font-display);letter-spacing:-.01em}
.ds-acct .checkout-summary__then {font-size:13px;color:var(--txt-2);margin-top:1px;line-height:1.4}
.ds-acct .checkout-summary__label {font-size:11px;font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;color:var(--brand);margin-bottom:4px}
.ds-acct .pay-method.selected {border-color:var(--brand);background:var(--brand-soft)}
.ds-acct .pay-method.selected .pm-arrow-chev {display:none}
.ds-acct .pay-method.selected .pm-arrow-check {display:flex}
.ds-acct .pm-arrow-chev {display:flex;flex:0 0 auto;color:var(--txt-3)}
.ds-acct .pm-arrow-check {display:none;flex:0 0 auto;color:var(--brand)}
.ds-acct .checkout-autopay-benefit {font-size:12px;color:var(--txt-3);margin-top:3px;line-height:1.35}
.ds-acct .checkout-method-label {font-size:12px;font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;color:var(--txt-3);margin:0 0 10px}

/* ===== account-pages.css ===== */
.ds-acct .np-page {
  margin: 0;
  display: flex; flex-direction: column;
  align-items: stretch; justify-content: flex-start;
  min-height: 100vh;
  overflow-x: hidden; overflow-y: auto;
  background: var(--bg); color: var(--txt);
  font-family: var(--font-body);
}
.ds-acct .np-bg { position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.ds-acct .np-bg .ab { position: absolute; border-radius: 50%; filter: blur(70px); opacity: .55; }
.ds-acct .np-bg .ab1 { width: 60%; height: 46%; top: -16%; left: -12%; background: radial-gradient(circle, rgba(0,227,122,0.55), transparent 66%); }
.ds-acct .np-bg .ab2 { width: 56%; height: 44%; top: -10%; right: -14%; background: radial-gradient(circle, rgba(0,194,255,0.5), transparent 66%); }
.ds-acct .np-bg .ab3 { width: 70%; height: 50%; bottom: -24%; left: 10%; background: radial-gradient(circle, rgba(0,194,255,0.22), transparent 68%); }
[data-theme="light"] .ds-acct .np-bg { opacity: .6; }
.ds-acct .np-top {
  position: relative; z-index: 5;
  min-height: 64px; display: flex; align-items: center; gap: 14px;
  padding: env(safe-area-inset-top) clamp(16px, 4vw, 36px) 0;
}
html.pv-notch .ds-acct .np-top { padding-top: 36px; }
.ds-acct .np-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--txt); }
.ds-acct .np-brand img { width: 26px; height: 28px; }
.ds-acct .np-brand b { font-family: var(--font-display); font-weight: 600; font-size: 19px; letter-spacing: -0.01em; }
.ds-acct .np-brand b span { color: var(--brand); }
.ds-acct .np-top .sp { flex: 1 1 auto; }
.ds-acct .np-back {
  display: inline-flex; align-items: center; gap: 7px; text-decoration: none; white-space: nowrap;
  color: var(--txt-2); font-size: 14px; font-weight: 500;
  padding: 8px 13px; border-radius: 10px; border: 1px solid var(--line); background: var(--surface-2);
}
.ds-acct .np-back:hover { color: var(--txt); border-color: var(--line-strong); }
.ds-acct .np-back svg { width: 17px; height: 17px; }
.ds-acct .np-main {
  position: relative; z-index: 2; flex: 1 1 auto;
  display: flex; align-items: center; justify-content: center;
  padding: 24px clamp(16px, 4vw, 36px) 56px;
}
.ds-acct .np-card {
  width: 100%; max-width: 468px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-xl, 22px); box-shadow: var(--shadow-lg, 0 30px 70px -30px rgba(0,0,0,0.6));
  padding: 30px 28px 26px;
}
.ds-acct .np-card.wide { max-width: 540px; }
.ds-acct .np-page { display: flex; flex-direction: column; align-items: stretch; min-height: 100dvh; }
.ds-acct .np-main .np-stack { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 16px; width: 100%; }
.ds-acct .np-help { text-align: center; font-size: 13px; color: var(--txt-2); margin: 0; }
.ds-acct .np-help a { color: var(--brand); }
.ds-acct .np-top {
  justify-content: flex-start;
  min-height: 56px;
  padding-top: calc(env(safe-area-inset-top) + clamp(14px, 2vw, 22px));
}
.ds-acct .np-top .sp { display: none; }
.ds-acct .np-top .np-back { position: static; }
.ds-acct .np-logo { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--txt); margin-bottom: clamp(12px, 2.2vw, 20px); }
.ds-acct .np-logo img { width: 30px; height: 33px; }
.ds-acct .np-logo b { font-family: var(--font-display); font-weight: 600; font-size: 22px; letter-spacing: -0.01em; }
.ds-acct .np-logo b span { color: var(--brand); }
.ds-acct .np-mascot { display: none; }
.ds-acct .np-mascot img {
  width: auto; display: block; position: relative; z-index: 1;
  filter: drop-shadow(0 32px 60px rgba(0, 0, 0, 0.6));
  animation: np-nox-float 7s ease-in-out infinite alternate;
}
.ds-acct .np-mascot::before {
  content: ""; position: absolute; left: 50%; bottom: -1%; z-index: 0;
  width: 120%; height: 44%; transform: translateX(-50%);
  background: radial-gradient(58% 100% at 50% 100%, rgba(0, 227, 122, 0.24), rgba(0, 194, 255, 0.12) 46%, transparent 72%);
  filter: blur(16px); pointer-events: none;
}
@keyframes np-nox-float { from { transform: translateY(7px); } to { transform: translateY(-12px); } }
@media (prefers-reduced-motion: reduce) {
.ds-acct .np-mascot img { animation: none; }
}
@media (min-width: 920px) {
.ds-acct .np-main { justify-content: center; gap: 0; }
.ds-acct .np-mascot {
    display: block; position: absolute; bottom: 0; z-index: 1; pointer-events: none;
    
    right: calc(50% + clamp(120px, 15vw, 232px));
  }
.ds-acct .np-mascot img { height: clamp(520px, 82vh, 780px); }
}
.ds-acct .np-eyebrow { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 600; color: var(--txt-3); letter-spacing: .02em; }
.ds-acct .np-title { font-family: var(--font-display); font-weight: 700; font-size: 25px; letter-spacing: -0.02em; margin: 12px 0 0; text-wrap: balance; }
.ds-acct .np-sub { color: var(--txt-2); font-size: 14.5px; line-height: 1.5; margin: 9px 0 0; text-wrap: pretty; }
.ds-acct .np-order { margin-top: 20px; border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; }
.ds-acct .np-order .li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 15px; font-size: 14px; }
.ds-acct .np-order .li + .li { border-top: 1px solid var(--line); }
.ds-acct .np-order .li .k { color: var(--txt-2); white-space: nowrap; }
.ds-acct .np-order .li .v { font-weight: 600; text-align: right; }
.ds-acct .np-order .li.total { background: var(--surface-2); }
.ds-acct .np-order .li.total .k { color: var(--txt); font-weight: 600; }
.ds-acct .np-order .li.total .v { font-family: var(--font-display); font-weight: 700; font-size: 19px; }
.ds-acct .np-strike { color: var(--txt-3); text-decoration: line-through; font-weight: 500; margin-right: 7px; }
.ds-acct .np-foot-note { margin-top: 16px; display: flex; align-items: center; justify-content: center; gap: 7px; color: var(--txt-3); font-size: 12.5px; }
.ds-acct .np-foot-note svg { width: 14px; height: 14px; }
.ds-acct .np-step { display: none; opacity: 0; transform: translateY(10px); transition: opacity .35s cubic-bezier(.22,1,.36,1), transform .35s cubic-bezier(.22,1,.36,1); }
.ds-acct .np-step.on { display: block; opacity: 1; transform: none; }
.ds-acct .demo-panel { position: fixed !important; right: 14px !important; left: auto !important; bottom: 14px !important; top: auto !important; z-index: 200; max-width: 290px; }
.ds-acct .np-seg { display: flex; gap: 8px; margin-top: 18px; }
.ds-acct .np-seg button {
  flex: 1; padding: 11px; border-radius: var(--r-md); border: 1px solid var(--line);
  background: var(--surface-2); color: var(--txt-2); font-family: var(--font-body);
  font-weight: 600; font-size: 14px; cursor: pointer; transition: .16s;
}
.ds-acct .np-seg button.on { border-color: var(--brand-line); background: var(--brand-soft); color: var(--brand); }
.ds-acct .np-label { display: block; font-size: 13px; font-weight: 600; color: var(--txt-2); margin: 18px 0 8px; }
.ds-acct .np-input {
  width: 100%; height: 50px; padding: 0 15px; box-sizing: border-box;
  border-radius: var(--r-md); border: 1px solid var(--line); background: var(--surface-2);
  color: var(--txt); font-size: 15.5px; font-family: var(--font-body); outline: none;
  transition: border-color .16s;
}
.ds-acct .np-input:focus { border-color: var(--brand-line); }
.ds-acct .np-otp { display: flex; gap: 9px; margin-top: 18px; justify-content: center; }
.ds-acct .np-otp input {
  width: 50px; height: 60px; text-align: center; font-family: var(--font-display);
  font-weight: 700; font-size: 24px; color: var(--txt);
  border-radius: var(--r-md); border: 1px solid var(--line); background: var(--surface-2); outline: none;
}
.ds-acct .np-otp input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.ds-acct .np-resend { text-align: center; margin-top: 16px; font-size: 13px; color: var(--txt-3); }
.ds-acct .np-resend a { color: var(--brand); text-decoration: none; font-weight: 600; cursor: pointer; }
.ds-acct .np-mail-wait {
  margin-top: 22px; display: flex; flex-direction: column; align-items: center; gap: 12px;
  padding: 24px 18px; border-radius: var(--r-lg);
  border: 1px solid var(--line); background: var(--surface-2);
}
.ds-acct .np-mail-ic {
  width: 56px; height: 56px; border-radius: 16px; display: flex; align-items: center; justify-content: center;
  background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand);
}
.ds-acct .np-mail-ic svg { width: 28px; height: 28px; }
.ds-acct .np-mail-dots { display: flex; gap: 6px; }
.ds-acct .np-mail-dots i { width: 7px; height: 7px; border-radius: 50%; background: var(--brand); opacity: .35; animation: np-mail-dot 1.2s ease-in-out infinite; }
.ds-acct .np-mail-dots i:nth-child(2) { animation-delay: .18s; }
.ds-acct .np-mail-dots i:nth-child(3) { animation-delay: .36s; }
@keyframes np-mail-dot { 0%,100% { opacity: .25; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-3px); } }
.ds-acct .np-mail-txt { color: var(--txt-2); font-size: 13.5px; font-weight: 500; }
@media (prefers-reduced-motion: reduce) {
.ds-acct .np-mail-dots i { animation: none; opacity: .6; }
}
.ds-acct .np-demo-link {
  display: block; width: 100%; margin-top: 16px; padding: 6px;
  background: none; border: 0; cursor: pointer;
  color: var(--txt-3); font-family: var(--font-body); font-size: 12.5px; text-decoration: underline; text-underline-offset: 3px;
}
.ds-acct .np-demo-link:hover { color: var(--txt-2); }
.ds-acct .np-choose { margin-top: 22px; display: flex; flex-direction: column; gap: 11px; }
.ds-acct .np-choose-card {
  display: flex; align-items: center; gap: 13px; text-decoration: none;
  padding: 15px 16px; border-radius: var(--r-lg);
  border: 1px solid var(--line); background: var(--surface-2);
  color: var(--txt); transition: border-color .16s, transform .16s, background .16s;
}
.ds-acct .np-choose-card:hover { border-color: var(--line-strong); transform: translateY(-1px); }
.ds-acct .np-choose-card:active { transform: translateY(0); }
.ds-acct .np-choose-primary { border-color: var(--brand-line); background: var(--brand-soft); }
.ds-acct .np-choose-primary:hover { border-color: var(--brand); }
.ds-acct .np-choose-card .ncc-ic {
  flex: 0 0 auto; width: 42px; height: 42px; border-radius: 13px;
  display: flex; align-items: center; justify-content: center;
  background: var(--surface); border: 1px solid var(--line); color: var(--txt-2);
}
.ds-acct .np-choose-primary .ncc-ic { background: var(--brand); border-color: transparent; color: var(--brand-ink); }
.ds-acct .np-choose-tg .ncc-ic { color: #2AABEE; }
.ds-acct .np-choose-card .ncc-ic svg { width: 22px; height: 22px; }
.ds-acct .np-choose-card .ncc-body { flex: 1 1 auto; display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.ds-acct .np-choose-card .ncc-body b { font-size: 15px; font-weight: 600; }
.ds-acct .np-choose-card .ncc-body span { font-size: 12.5px; color: var(--txt-3); }
.ds-acct .np-choose-card .ncc-arrow { flex: 0 0 auto; color: var(--txt-3); display: flex; }
.ds-acct .np-choose-card .ncc-arrow svg { width: 19px; height: 19px; }
.ds-acct .np-invite-pct { font-family: var(--font-display); font-weight: 700; font-size: 19px; color: var(--brand); letter-spacing: -0.02em; }
.ds-acct .btn-tg { background: #2AABEE !important; color: #fff !important; }
.ds-acct .np a.btn, .ds-acct .np .btn { text-decoration: none; }
.ds-acct .np-or { display: flex; align-items: center; gap: 12px; margin: 18px 0 4px; color: var(--txt-3); font-size: 12.5px; }
.ds-acct .np-or::before, .ds-acct .np-or::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.ds-acct .np-perks { list-style: none; padding: 0; margin: 18px 0 0; display: flex; flex-direction: column; gap: 11px; }
.ds-acct .np-perks li { display: flex; align-items: flex-start; gap: 11px; font-size: 14px; color: var(--txt); }
.ds-acct .np-perks li svg { width: 20px; height: 20px; color: var(--brand); flex: 0 0 auto; margin-top: 1px; }
.ds-acct .np-perks li span { color: var(--txt-2); }
.ds-acct .np-gift-badge {
  width: 72px; height: 72px; border-radius: 22px; margin: 0 auto;
  display: flex; align-items: center; justify-content: center;
  background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand);
}
.ds-acct .np-gift-badge svg { width: 36px; height: 36px; }
.ds-acct .np-center { text-align: center; }
.ds-acct .np-center .np-eyebrow, .ds-acct .np-center .np-perks { justify-content: center; }
.ds-acct .np-mt { margin-top: 14px; }
.ds-acct .np-mt-s { margin-top: 10px; }
.ds-acct .hero-secondary { display: flex; gap: 10px; margin-top: 10px; }
.ds-acct .hero-secondary .btn { margin: 0; flex: 1 1 0; min-width: 0; width: auto; }
.ds-acct .cabinet-identity { text-align: center; color: var(--txt-3); font-size: 13px; margin: 14px 0 0; word-break: break-word; }
.ds-acct .cabinet-muted { color: var(--txt-3); font-size: 14px; margin: 0; }
.ds-acct .sub-autopay { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; padding: 15px 18px; }
.ds-acct .autopay-manage { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; flex: 0 0 auto; }
.ds-acct .autopay-state-label { color: var(--txt-2); font-size: 13px; }
.ds-acct .autopay-next { color: var(--txt-3); font-size: 12.5px; margin: 0; text-align: right; }
.ds-acct .autopay-error { color: var(--danger); font-size: 12.5px; margin: 0; text-align: right; }
.ds-acct .dev-tariff-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.ds-acct .dev-tariff-head > * { flex: 0 0 auto; min-width: fit-content; }
.ds-acct .dev-tariff-date { color: var(--txt-3); font-size: 13px; flex: 0 0 auto; }
.ds-acct .dev-slots { display: flex; align-items: center; gap: 10px; margin-top: 16px; }
.ds-acct .dev-slot-text { color: var(--txt-2); font-size: 13.5px; }
.ds-acct .dev-row-actions { margin-left: auto; display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.ds-acct .dev-reset { height: 36px; padding: 0 14px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--line); color: var(--txt-2); font-weight: 600; font-size: 13.5px; white-space: nowrap; cursor: pointer; }
.ds-acct .dev-reset:active { background: var(--surface-press); }
.ds-acct .dev-row-actions .btn, .ds-acct .dev-reset[disabled], .ds-acct .dev-off[disabled] { opacity: 0.5; pointer-events: none; }
.ds-acct .dev-add-ic { width: 32px; height: 32px; border-radius: 9px; color: var(--brand); background: var(--brand-soft); border-color: var(--brand-line); }
.ds-acct .dev-add-t { color: var(--brand); }
.ds-acct .dev-cap-note { margin-top: 12px; padding: 11px 13px; border-radius: 12px; background: rgba(255,138,130,0.10); border: 1px solid rgba(255,138,130,0.30); color: #ff8a82; font-size: 13.5px; line-height: 1.4; }
.ds-acct .dev-cap-link { color: inherit; font-weight: 700; text-decoration: underline; }
.ds-acct .dev-error { margin-top: 10px; color: var(--danger); font-size: 13.5px; }
.ds-acct .payout-hold-note { color: var(--txt-3); font-size: 12.5px; margin: 12px 2px 0; line-height: 1.4; }
.ds-acct .payout-form { margin-top: 16px; }
.ds-acct .payout-dest { width: 100%; margin-top: 12px; height: 52px; padding: 0 16px; border-radius: 16px; background: var(--surface); border: 1.5px solid var(--line); color: var(--txt); font-family: var(--font-body); font-size: 15px; outline: none; transition: border-color var(--dur-fast); -webkit-appearance: none; appearance: none; }
.ds-acct .payout-dest:focus { border-color: var(--brand-line); }
.ds-acct .payout-form .btn { margin-top: 14px; }
.ds-acct .payout-error { margin-top: 10px; color: var(--danger); font-size: 13.5px; }
.ds-acct .payout-ok { margin-top: 10px; color: var(--brand); font-size: 13.5px; }
.ds-acct .stage > .section-label:first-child { margin-top: 8px; }

/* ===== account.css ===== */
.ds-acct .lk-page { height: 100%; }
.ds-acct .lk-page {
  margin: 0;
  display: flex; flex-direction: column;
  align-items: stretch; justify-content: flex-start;
  min-height: 100vh; height: 100vh;
  
  min-height: 100dvh; height: 100dvh;
  overflow: hidden;
  background: var(--bg);
  color: var(--txt);
  font-family: var(--font-body);
}
.ds-acct .stage { position: relative; inset: auto; flex: 1 1 auto; min-width: 0; display: block; }
.ds-acct .scaler { transform: none !important; width: 100%; height: 100%; }
.ds-acct .phone { width: 100%; height: 100%; border-radius: 0; background: transparent; padding: 0; box-shadow: none; }
.ds-acct .screen-frame { width: 100%; height: 100%; border-radius: 0; box-shadow: none; }
.ds-acct .ios-status { display: none !important; }
.ds-acct .tg-header { display: none; }
.ds-acct .tg-grabber { display: none !important; }
.ds-acct .tg-sub { display: none !important; }
.ds-acct .tg-more { display: none !important; }
.ds-acct .viewport { background: var(--bg); }
.ds-acct .screen { padding: 30px max(22px, calc((100% - 780px) / 2)) 120px; }
.ds-acct .pay-status { padding-bottom: 40px; }
@media (min-width: 920px) {
.ds-acct .h1 { font-size: 30px; }
}
.ds-acct .lk-top {
  flex: 0 0 var(--lk-top-h); height: var(--lk-top-h);
  display: flex; align-items: center; gap: 18px;
  padding: 0 clamp(16px, 3vw, 30px);
  background: color-mix(in srgb, var(--bg-elev) 86%, transparent);
  -webkit-backdrop-filter: saturate(160%) blur(16px);
  backdrop-filter: saturate(160%) blur(16px);
  border-bottom: 1px solid var(--line);
  z-index: 60; position: relative;
}
.ds-acct .lk-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--txt); flex: 0 0 auto; }
.ds-acct .lk-brand img { width: 26px; height: 28px; display: block; }
.ds-acct .lk-brand b { font-family: var(--font-display); font-weight: 700; font-size: 19px; letter-spacing: -0.01em; font-weight: 600; }
.ds-acct .lk-brand b span { color: var(--brand); }
.ds-acct .lk-top-spacer { flex: 1 1 auto; }
.ds-acct .lk-top-nav { display: flex; align-items: center; gap: 4px; }
.ds-acct .lk-top-nav a {
  color: var(--txt-2); text-decoration: none; font-size: 14px; font-weight: 500; white-space: nowrap;
  padding: 8px 12px; border-radius: 9px; transition: background .16s, color .16s;
}
.ds-acct .lk-top-nav a:hover { color: var(--txt); background: var(--surface-2); }
.ds-acct .lk-iconbtn {
  position: relative; flex: 0 0 auto;
  width: 40px; height: 40px; border-radius: 11px;
  display: flex; align-items: center; justify-content: center;
  background: var(--surface-2); border: 1px solid var(--line); color: var(--txt-2);
  cursor: pointer; transition: background .16s, color .16s, border-color .16s;
}
.ds-acct .lk-iconbtn:hover { color: var(--txt); border-color: var(--line-strong); }
.ds-acct .lk-iconbtn svg { width: 20px; height: 20px; }
.ds-acct .lk-support .dot {
  position: absolute; top: 8px; right: 8px; width: 7px; height: 7px; border-radius: 50%;
  background: var(--brand); box-shadow: 0 0 0 2px var(--bg-elev);
}
.ds-acct .lk-support.is-locked .dot { display: none; }
.ds-acct .lk-account {
  display: flex; align-items: center; gap: 9px; flex: 0 0 auto;
  padding: 5px 12px 5px 6px; border-radius: 999px;
  background: var(--surface-2); border: 1px solid var(--line); cursor: pointer;
  color: var(--txt); transition: border-color .16s;
}
.ds-acct .lk-account:hover { border-color: var(--line-strong); }
.ds-acct .lk-account .av {
  width: 30px; height: 30px; border-radius: 50%; flex: 0 0 auto;
  background: var(--grad); color: var(--brand-ink);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-display); font-weight: 700; font-size: 13px;
}
.ds-acct .lk-account .who { display: flex; flex-direction: column; line-height: 1.15; text-align: left; }
.ds-acct .lk-account .who b { font-size: 13px; font-weight: 600; }
.ds-acct .lk-account .who span { font-size: 11px; color: var(--txt-3); }
.ds-acct .lk-shell { flex: 1 1 auto; min-height: 0; display: flex; }
.ds-acct .lk-side {
  flex: 0 0 var(--lk-side-w); width: var(--lk-side-w);
  
  background: color-mix(in srgb, var(--bg-elev) 55%, var(--bg));
  display: flex; flex-direction: column; padding: 16px 14px;
  overflow-y: auto; scrollbar-width: none;
}
.ds-acct .lk-side::-webkit-scrollbar { display: none; }
.ds-acct .lk-side-lbl { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--txt-3); padding: 6px 12px; }
.ds-acct .lk-nav { display: flex; flex-direction: column; gap: 3px; }
.ds-acct .lk-nav button {
  display: flex; align-items: center; gap: 12px; width: 100%;
  padding: 11px 12px; border-radius: 11px; border: 0; cursor: pointer;
  background: transparent; color: var(--txt-2);
  font-family: var(--font-body); font-size: 14.5px; font-weight: 500; text-align: left;
  transition: background .15s, color .15s;
}
.ds-acct .lk-nav button svg { width: 20px; height: 20px; flex: 0 0 auto; }
.ds-acct .lk-nav button[hidden] { display: none; }
.ds-acct .lk-nav button:hover { background: var(--surface-2); color: var(--txt); }
.ds-acct .lk-nav button.active { background: var(--brand-soft); color: var(--brand); }
.ds-acct .lk-nav button.active svg { color: var(--brand); }
.ds-acct .lk-nav .lk-nav-badge {
  margin-left: auto; font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 999px;
  background: var(--brand); color: var(--brand-ink);
}
.ds-acct .lk-side-sub {
  margin-top: 16px; padding: 13px; border-radius: var(--r-md);
  background: var(--surface); border: 1px solid var(--line);
}
.ds-acct .lk-side-sub .st { display: flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 600; color: var(--txt-2); }
.ds-acct .lk-side-sub .st .d { width: 7px; height: 7px; border-radius: 50%; background: var(--brand); }
.ds-acct .lk-side-sub.is-off .st .d { background: var(--txt-3); }
.ds-acct .lk-side-sub.is-warn .st .d { background: #f5b432; }
.ds-acct .lk-side-sub .big { font-family: var(--font-display); font-weight: 700; font-size: 22px; margin: 6px 0 2px; }
.ds-acct .lk-side-sub .sm { font-size: 12px; color: var(--txt-3); }
.ds-acct .lk-side-sub .lk-side-cta {
  
  display: flex; align-items: center; justify-content: center; text-decoration: none;
  margin-top: 10px; width: 100%; height: 38px; border-radius: 10px; border: 0; cursor: pointer;
  background: var(--grad); color: var(--brand-ink); font-family: var(--font-body); font-weight: 600; font-size: 13.5px;
}
.ds-acct .lk-side-foot { margin-top: auto; padding: 14px 12px 4px; }
.ds-acct .lk-side-foot a { display: block; color: var(--txt-3); font-size: 12.5px; text-decoration: none; padding: 4px 0; }
.ds-acct .lk-side-foot a:hover { color: var(--txt-2); }
.ds-acct .lk-side-foot .cc { color: var(--txt-3); font-size: 11px; margin-top: 8px; opacity: .7; }
.ds-acct .lk-foot {
  flex: 0 0 var(--lk-foot-h); height: var(--lk-foot-h);
  display: flex; align-items: center; gap: 16px;
  padding: 0 clamp(16px, 3vw, 30px);
  border-top: 1px solid var(--line);
  background: var(--bg-elev);
  font-size: 12px; color: var(--txt-3);
  z-index: 30;
}
.ds-acct .lk-foot a { color: var(--txt-3); text-decoration: none; }
.ds-acct .lk-foot a:hover { color: var(--txt-2); }
.ds-acct .lk-foot .sp { flex: 1 1 auto; }
.ds-acct .mainbtn-wrap, .ds-acct .up-sticky {
  padding-left: max(22px, calc((100% - 780px) / 2));
  padding-right: max(22px, calc((100% - 780px) / 2));
}
.ds-acct .mainbtn, .ds-acct .up-sticky .mainbtn { max-width: 780px; margin: 0 auto; }
.ds-acct .up-sticky { gap: 18px; }
@media (min-width: 921px) {
.ds-acct .tabbar { display: none !important; }
}
@media (min-width: 921px) {
.ds-acct .sheet {
    left: 50%; right: auto; bottom: auto; top: 50%;
    width: min(460px, 92%); border-radius: var(--r-lg);
    border: 1px solid var(--line); border-top: 1px solid var(--line);
    transform: translate(-50%, -44%) scale(.98); opacity: 0;
    transition: transform .26s var(--ease), opacity .2s var(--ease);
  }
.ds-acct .sheet.show { transform: translate(-50%, -50%); opacity: 1; }
.ds-acct .sheet-grip { display: none; }
.ds-acct .backdrop { -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); }
}
.ds-acct .demo-panel {
  position: fixed; right: 14px; bottom: 14px; top: auto; left: auto;
  z-index: 200; max-width: 290px;
}
@media (max-width: 920px) {
.ds-acct .lk-page { overflow: auto; }
.ds-acct .lk-side { display: none; }
.ds-acct .lk-top-nav { display: none; }
.ds-acct .lk-shell { min-height: calc(100dvh - var(--lk-top-h)); }
.ds-acct .lk-foot { display: none; }
.ds-acct .lk-account .who { display: none; }
.ds-acct .lk-account { padding: 5px; }
.ds-acct .lk-top {
    position: fixed; top: 0; left: 0; right: 0; z-index: 60;
    height: auto; min-height: var(--lk-top-h); flex: 0 0 auto;
    padding-top: env(safe-area-inset-top);
  }
.ds-acct .lk-shell { padding-top: calc(var(--lk-top-h) + env(safe-area-inset-top)); }
.ds-acct .tabbar { position: fixed; }
.ds-acct .screen.wizard { padding-bottom: var(--lk-tabbar-reserve); }
.ds-acct .screen.wizard:has(.wiz-body) { overflow: hidden; }
.ds-acct .wiz-nav { bottom: var(--lk-tabbar-reserve); }
.ds-acct .tg-header {
    display: none;
    background: color-mix(in srgb, var(--bg-elev) 92%, transparent);
    -webkit-backdrop-filter: saturate(160%) blur(14px);
    backdrop-filter: saturate(160%) blur(14px);
    color: var(--txt);
    padding: 0; border-bottom: 1px solid var(--line);
    position: sticky; top: 0; z-index: 18;
  }
.ds-acct .tg-header.has-back { display: block; }
.ds-acct .tg-bar { height: 50px; padding: 0 8px; }
.ds-acct .tg-back {
    display: flex; align-items: center; gap: 3px; margin-right: auto;
    color: var(--txt); font-family: var(--font-body); font-size: 15px; font-weight: 600;
    padding: 8px 10px 8px 6px; border-radius: 10px;
  }
.ds-acct .tg-back:active { background: var(--surface-2); }
.ds-acct .tg-back svg { width: 20px; height: 20px; }
.ds-acct .tg-heading { max-width: 64%; }
.ds-acct .tg-title { color: var(--txt); font-size: 16px; font-weight: 600; }
.ds-acct .screen { padding: 18px 16px 132px; }
.ds-acct .screen[data-screen="chat"] { padding-top: 0; }
.ds-acct .screen[data-screen="chat"] .chat-head { margin-top: 0; top: 0; }
}
@media (max-width: 380px) {
.ds-acct .lk-brand b { font-size: 17px; }
}
@media (max-width: 920px) {
html.pv-notch .ds-acct .lk-top { padding-top: 36px; }
}
.ds-acct .home-rail { display: none; }
@media (min-width: 921px) {
.ds-acct .lk-shell { max-width: 1360px; margin-inline: auto; width: 100%; }
.ds-acct .screen[data-screen="home"].has-rail {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 24px;
    align-items: start;
  }
.ds-acct .screen[data-screen="home"].has-rail .home-main { min-width: 0; }
.ds-acct .screen[data-screen="home"].has-rail .home-rail { display: block; position: sticky; top: 8px; }
}