/* =========================================================
   КУРТБАНК — тема «Аврора» (тёмная, зелёно-фиолетовая)
   Грузится ПОСЛЕ style.css и переопределяет токены и вид.
   Логика остаётся в app.js, id и классы не менялись.
   ========================================================= */

:root, html[data-theme]{
  --bg:#07060D;
  --bg-soft:rgba(255,255,255,.06);
  --bg-elevated:#14111F;
  --card:rgba(255,255,255,.07);
  --card-soft:rgba(255,255,255,.09);
  --border:rgba(255,255,255,.08);
  --border-strong:rgba(255,255,255,.16);

  --text:#F5F3FF;
  --text-2:#AEA9CB;
  --text-3:#716C90;

  --accent:#5BE38B;
  --accent-press:#3FC474;
  --accent-soft:rgba(91,227,139,.14);
  --accent-text:#05140B;

  --violet:#8B5CF6;
  --violet-light:#B8A2FF;
  --violet-soft:rgba(139,92,246,.20);

  --grad-action:linear-gradient(135deg,#C6F54D 0%,#5BE38B 100%);
  --grad-violet:linear-gradient(145deg,#8B5CF6 0%,#5B2FD1 100%);
  --grad-brand:linear-gradient(120deg,#B8A2FF 0%,#5BE38B 100%);

  --red:#FF6B81;
  --red-soft:rgba(255,107,129,.15);

  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow-md:0 8px 24px rgba(0,0,0,.4);
  --shadow-lg:0 24px 60px rgba(0,0,0,.55);

  --radius-xl:28px; --radius-lg:22px; --radius-md:18px; --radius-sm:12px;
  color-scheme:dark;
}

/* ---------- Основа и «живой» фон ---------- */
body{
  font-family:'Manrope','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  background:var(--bg);
  letter-spacing:-.005em;
}
body::before{
  content:''; position:fixed; inset:-25%; pointer-events:none;
  background:
    radial-gradient(38% 32% at 14% 10%, rgba(139,92,246,.60), transparent 70%),
    radial-gradient(34% 30% at 96% 34%, rgba(76,29,149,.6), transparent 70%),
    radial-gradient(40% 26% at 4% 52%, rgba(109,64,232,.34), transparent 70%),
    radial-gradient(44% 34% at 82% 98%, rgba(91,227,139,.26), transparent 70%),
    radial-gradient(30% 24% at 0% 86%, rgba(52,214,115,.16), transparent 70%);
  animation:aurora 26s ease-in-out infinite alternate;
  will-change:transform;
}
@keyframes aurora{ to{ transform:translate3d(-3%,2%,0) scale(1.1) rotate(2deg); } }
.screen, .view{ background:transparent; }

/* ---------- Лого ---------- */
.splash-logo, .auth-logo{
  width:auto; height:auto; border-radius:0; background:none; box-shadow:none;
}
.splash-logo img, .auth-logo img{
  height:92px; width:auto; display:block;
  filter:drop-shadow(0 10px 30px rgba(91,227,139,.45));
}
.splash-name{ color:var(--text-2); }
.auth-brand-name{
  background:var(--grad-brand); -webkit-background-clip:text; background-clip:text;
  color:transparent; letter-spacing:.2em;
}
.auth-title{ font-size:30px; line-height:1.1; letter-spacing:-.03em; }

/* ---------- Кнопки ---------- */
.btn{ border-radius:var(--radius-md); font-weight:800; min-height:58px; }
.btn-primary, .btn-primary:active{
  background:var(--grad-action); color:var(--accent-text);
  box-shadow:0 12px 32px -10px rgba(91,227,139,.6), inset 0 1px 0 rgba(255,255,255,.45);
}
.btn-primary:active{ filter:brightness(.93); }
.btn-ghost{
  background:rgba(255,255,255,.07); color:var(--text);
  border:1px solid var(--border);
}
.btn-danger{ background:linear-gradient(135deg,#FF7A8E,#E5405C); }
.btn-spinner{ border-color:rgba(5,20,11,.25); border-top-color:var(--accent-text); }

/* ---------- Поля ---------- */
.field input, .field textarea{
  background:rgba(255,255,255,.06);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
}
.field input:focus, .field textarea:focus{
  background:var(--violet-soft);
  border-color:var(--violet-light);
  box-shadow:0 0 0 4px rgba(139,92,246,.2);
}
.back-btn{ background:rgba(255,255,255,.07); border:1px solid var(--border); border-radius:50%; }

/* ---------- Верхняя панель ---------- */
.app-topbar{ padding-bottom:14px; }
.topbar-title{ font-weight:800; font-size:18px; }
.icon-btn{
  width:44px; height:44px; border-radius:50%;
  background:rgba(255,255,255,.07);
  border:1px solid var(--border);
  position:relative;
}
.topbar-avatar{
  border-radius:50%; width:44px; height:44px;
  background:var(--grad-violet); color:#fff;
  box-shadow:0 0 0 2px rgba(255,255,255,.14), 0 6px 18px -4px rgba(139,92,246,.7);
}
.topbar-name{ font-size:17px; font-weight:800; letter-spacing:-.02em; }

/* ---------- Главная: герой-счёт ---------- */
.wallet-scroller{ margin:0 -20px -12px; padding:6px 20px 44px; gap:14px; }
.wallet-card{ flex:0 0 100%; width:auto; }
.wallet-card:not(:only-child){ flex-basis:86%; }
.wallet-card-account{
  min-height:206px; border-radius:32px; padding:24px;
  background:
    radial-gradient(110% 80% at 100% 0%, rgba(91,227,139,.55), transparent 58%),
    radial-gradient(90% 90% at 0% 100%, rgba(184,162,255,.5), transparent 62%),
    linear-gradient(150deg,#6E40E8 0%,#3B1D8F 58%,#1D0F47 100%);
  border:1px solid rgba(255,255,255,.2);
  box-shadow:0 22px 44px -18px rgba(110,64,232,.8), inset 0 1px 0 rgba(255,255,255,.3);
}
.wallet-card-account::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.16) 50%,transparent 62%);
  background-size:260% 100%; background-position:120% 0;
  animation:sheen 1.8s .5s ease-out 1 forwards;
}
@keyframes sheen{ to{ background-position:-40% 0; } }
.wallet-card-mark{
  position:absolute; right:-14px; top:-6px; height:170px; width:auto;
  opacity:.17; filter:grayscale(1) brightness(2.4); pointer-events:none;
}
.wallet-card-label{ position:relative; font-size:14px; font-weight:700; opacity:.85; }
.wallet-card-amount{
  position:relative; font-size:clamp(38px,12vw,48px); font-weight:800;
  letter-spacing:-.045em; line-height:1.05;
  text-shadow:0 4px 24px rgba(20,8,60,.5);
}
.wallet-card-bottom{
  position:relative; font-size:14px; font-weight:600; letter-spacing:.06em;
  font-variant-numeric:tabular-nums;
}

/* ---------- Главная: быстрые действия ---------- */
.quick-actions{ gap:10px; margin-bottom:30px; }
.quick-action{
  background:rgba(255,255,255,.055); border:1px solid var(--border);
  border-radius:24px; padding:14px 4px 12px; font-weight:700; font-size:12px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.quick-action-ic{
  width:48px; height:48px; border-radius:18px;
  background:linear-gradient(145deg,rgba(139,92,246,.45),rgba(139,92,246,.14));
  border:1px solid rgba(184,162,255,.25);
  color:#D5C8FF; box-shadow:none;
}
.quick-action:first-child .quick-action-ic{
  background:var(--grad-action); color:var(--accent-text); border-color:transparent;
  box-shadow:0 8px 22px -6px rgba(91,227,139,.6);
}

/* Заготовки под будущие блоки главной (баннеры, истории, акции) */
.promo-rail{ display:flex; gap:12px; overflow-x:auto; margin:0 -20px 28px; padding:0 20px; scroll-snap-type:x mandatory; }
.promo-rail::-webkit-scrollbar{ display:none; }
.promo-card{
  flex:0 0 78%; min-height:128px; border-radius:26px; padding:18px; scroll-snap-align:start;
  background:linear-gradient(145deg,rgba(139,92,246,.42),rgba(91,227,139,.16));
  border:1px solid var(--border-strong);
}

/* ---------- Заголовки секций и операции ---------- */
.section-title-row{ margin-bottom:14px; }
.section-title{ font-size:21px; font-weight:800; letter-spacing:-.03em; }
.section-title.small{ font-size:15px; }
.section-link{ font-weight:700; }

.tx-list{
  background:rgba(255,255,255,.045);
  border:1px solid var(--border);
  border-radius:28px; padding:4px 18px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.tx-list .tx-item:last-child{ border-bottom:none; }
.modal .tx-list{ background:none; border:none; box-shadow:none; padding:0; }
.tx-item{ padding:15px 0; }
.tx-ic{ width:48px; height:48px; }
.tx-title{ font-weight:700; font-size:16px; }
.tx-sub{ color:var(--text-2); }
.tx-amount{ font-weight:800; font-size:16px; letter-spacing:-.02em; }
.tx-amount.in{ color:var(--accent); text-shadow:0 0 20px rgba(91,227,139,.35); }

/* ---------- Переключатели ---------- */
.segmented{
  background:rgba(255,255,255,.055); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:5px;
}
.segmented-btn{ border-radius:calc(var(--radius-lg) - 5px); font-weight:800; }
.segmented-btn.active{
  background:var(--grad-violet); color:#fff;
  box-shadow:0 8px 20px -6px rgba(139,92,246,.8), inset 0 1px 0 rgba(255,255,255,.3);
}
.theme-btn.active{ background:var(--violet-soft); border-color:var(--violet-light); color:#fff; }

/* ---------- Перевод и чек ---------- */
.recipient-preview{ background:var(--accent-soft); border:1px solid rgba(91,227,139,.25); border-radius:var(--radius-md); }
.recipient-avatar{ background:var(--grad-violet); color:#fff; border-radius:50%; }
.receipt-card{
  background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.04));
  border:1px solid var(--border-strong); border-radius:32px;
  box-shadow:var(--shadow-lg), inset 0 1px 0 rgba(255,255,255,.12);
}
.receipt-check{ background:var(--grad-action); box-shadow:0 12px 36px -6px rgba(91,227,139,.65); }
.receipt-amount{ font-size:36px; letter-spacing:-.04em; }

/* ---------- Карты ---------- */
.bank-card{
  height:196px; border-radius:26px;
  box-shadow:0 24px 50px -18px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.25);
}
.bank-card::before{
  content:''; position:absolute; inset:0; pointer-events:none; z-index:0;
  background:linear-gradient(115deg,rgba(255,255,255,.18) 0%,transparent 38%,transparent 70%,rgba(255,255,255,.06) 100%);
}
.bank-card[data-design="standard"]{
  background:
    radial-gradient(90% 80% at 100% 0%, rgba(91,227,139,.5), transparent 60%),
    linear-gradient(150deg,#6E40E8 0%,#3B1D8F 60%,#1D0F47 100%);
}
.bank-card[data-design="standard"]::after{ background:radial-gradient(circle,rgba(184,162,255,.35),transparent 70%); }
.bank-card-number{ font-size:18px; font-weight:700; }
.new-card-cvv, .profile-list{ background:rgba(255,255,255,.055); border:1px solid var(--border); border-radius:var(--radius-lg); }

/* ---------- Профиль ---------- */
.profile-avatar{
  border-radius:50%; width:96px; height:96px; font-size:42px;
  background:var(--grad-violet); color:#fff;
  box-shadow:0 0 0 3px rgba(255,255,255,.14), 0 16px 40px -8px rgba(139,92,246,.8);
}
.profile-name{ font-size:24px; letter-spacing:-.03em; }

/* ---------- Нижняя навигация: плавающая «капсула» ---------- */
.bottom-nav{
  left:12px; right:12px; bottom:calc(10px + var(--safe-bottom));
  align-items:center; padding:8px 6px;
  border:1px solid var(--border-strong); border-radius:32px;
  background:rgba(20,16,36,.66);
  -webkit-backdrop-filter:blur(24px) saturate(170%); backdrop-filter:blur(24px) saturate(170%);
  box-shadow:0 18px 50px -10px rgba(0,0,0,.75), inset 0 1px 0 rgba(255,255,255,.1);
}
.bn-item{ position:relative; font-size:10.5px; font-weight:700; border-radius:22px; padding:8px 4px; }
.bn-item > *{ position:relative; z-index:1; }
.bn-item.active{ color:var(--text); }
.bn-item.active::before{
  content:''; position:absolute; inset:0 4px; border-radius:22px;
  background:linear-gradient(160deg,rgba(139,92,246,.4),rgba(139,92,246,.12));
  border:1px solid rgba(184,162,255,.22);
}
.bn-item.active .bn-ic{ color:var(--accent); }
.bn-item-transfer{ transform:translateY(-18px); padding:0; }
.bn-item-transfer.active::before{ display:none; }
.bn-ic-transfer{
  width:60px; height:60px;
  background:var(--grad-action);
  box-shadow:0 0 0 6px rgba(7,6,13,.88), 0 12px 30px -4px rgba(91,227,139,.65), inset 0 1px 0 rgba(255,255,255,.5);
}
.bn-badge{ background:var(--grad-violet); color:#fff; }

/* ---------- Окна ---------- */
.modal-overlay{ background:rgba(5,4,12,.66); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); }
.modal{
  background:linear-gradient(180deg,#1B1633 0%,#110E1F 100%);
  border:1px solid var(--border-strong); border-radius:30px;
  box-shadow:var(--shadow-lg), inset 0 1px 0 rgba(255,255,255,.08);
}

/* ---------- Чат (базовая подгонка, полная переработка — отдельным шагом) ---------- */
.chat-bubble.mine{ background:var(--grad-action); color:var(--accent-text); }
.chat-bubble.theirs{ background:rgba(255,255,255,.08); border:1px solid var(--border); color:var(--text); }

/* ---------- Доступность ---------- */
button:focus-visible, a:focus-visible, input:focus-visible{ outline:2px solid var(--violet-light); outline-offset:2px; }
@media (prefers-reduced-motion:reduce){
  *, *::before, *::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

/* =========================================================
   ТОСТЫ — стеклянные карточки с тоном по типу
   success · error · info · money · message
   ========================================================= */
.toast-stack{
  left:12px; right:12px; top:calc(10px + var(--safe-top));
  max-width:460px; margin:0 auto; gap:0;
  display:flex; flex-direction:column; z-index:150; pointer-events:none;
}
.ktoast{ margin-bottom:10px; }
.ktoast-card{
  --tone:#B8A2FF; --tone-glow:rgba(139,92,246,.30); --lead-bg:var(--grad-violet); --lead-fg:#fff;
  position:relative; overflow:hidden; display:flex; align-items:center; gap:12px;
  padding:11px 16px 13px 11px; border-radius:26px;
  pointer-events:auto; touch-action:none; user-select:none; -webkit-user-select:none; cursor:grab;
  background:
    radial-gradient(130% 160% at 0% 50%, var(--tone-glow), transparent 62%),
    rgba(22,17,42,.80);
  -webkit-backdrop-filter:blur(22px) saturate(170%); backdrop-filter:blur(22px) saturate(170%);
  border:1px solid rgba(255,255,255,.15);
  box-shadow:0 18px 40px -12px rgba(0,0,0,.75), inset 0 1px 0 rgba(255,255,255,.16);
  animation:ktoast-in .5s cubic-bezier(.2,.9,.25,1.12) backwards;
  will-change:transform,opacity;
}
.ktoast-success .ktoast-card, .ktoast-money .ktoast-card{
  --tone:#5BE38B; --tone-glow:rgba(91,227,139,.26); --lead-bg:var(--grad-action); --lead-fg:var(--accent-text);
}
.ktoast-error .ktoast-card{
  --tone:#FF6B81; --tone-glow:rgba(255,107,129,.28); --lead-bg:linear-gradient(145deg,#FF8A9B,#E5405C); --lead-fg:#fff;
}
.ktoast-lead{ flex:0 0 auto; display:flex; }
.ktoast-ic{
  width:40px; height:40px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--lead-bg); color:var(--lead-fg);
  box-shadow:0 6px 16px -4px var(--tone-glow), inset 0 1px 0 rgba(255,255,255,.4);
}
.ktoast-ic svg{ width:20px; height:20px; }
.ktoast-lead .avatar-wrap{ width:40px; height:40px; }
.ktoast-body{ flex:1; min-width:0; }
.ktoast-title{
  font-size:12.5px; font-weight:700; color:var(--text-2);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-bottom:1px;
}
.ktoast-text{
  font-size:15px; font-weight:700; line-height:1.3; color:var(--text); letter-spacing:-.01em;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; word-break:break-word;
}
.ktoast-money .ktoast-text{
  font-size:21px; font-weight:800; letter-spacing:-.03em; color:var(--accent);
  text-shadow:0 0 22px rgba(91,227,139,.45);
}
.ktoast-count{
  flex:0 0 auto; font-size:12px; font-weight:800; padding:3px 8px; border-radius:99px;
  background:rgba(255,255,255,.14); color:var(--text);
}
.ktoast-bar{
  position:absolute; left:0; right:0; bottom:0; height:3px; transform-origin:left center;
  background:linear-gradient(90deg,var(--tone),transparent); opacity:.85;
  animation:ktoast-life var(--life,3s) linear forwards;
}
.ktoast-card.held .ktoast-bar{ animation-play-state:paused; }
.ktoast-bump{ animation:ktoast-bump .38s cubic-bezier(.3,1.5,.5,1); }
@keyframes ktoast-in{ from{ transform:translate3d(0,-26px,0) scale(.94); opacity:0; } }
@keyframes ktoast-life{ to{ transform:scaleX(0); } }
@keyframes ktoast-bump{ 35%{ transform:scale(1.035); } }

/* =========================================================
   ЭКРАН КАРТ — карусель, чип, точки, действия
   ========================================================= */
.cards-scroller{
  gap:16px; margin:0 -20px; padding:14px max(8vw,calc((100vw - 340px)/2)) 18px;
  scroll-snap-type:x mandatory; align-items:center;
}
.bank-card{
  width:min(84vw,340px); height:auto; aspect-ratio:1.586; padding:22px 22px 20px;
  scroll-snap-align:center; scroll-snap-stop:always;
  transform:scale(var(--s,1)); transition:opacity .2s;
}
.bank-card-top{ position:relative; z-index:1; }
.bank-card-bank{ font-size:13px; letter-spacing:.2em; }
.bank-card-network{ font-weight:800; letter-spacing:.14em; opacity:.8; }
.bank-card-nickname{ position:relative; z-index:1; font-weight:700; }
.bank-card-number, .bank-card-bottom{ position:relative; z-index:1; }
.bank-card-number{ font-size:19px; letter-spacing:.07em; font-variant-numeric:tabular-nums; text-shadow:0 2px 12px rgba(0,0,0,.35); }
.bank-card-mark{
  position:absolute; right:-10px; bottom:-22px; height:128px; width:auto;
  opacity:.12; filter:grayscale(1) brightness(2.6); pointer-events:none;
}
.bank-card-chip{
  position:absolute; right:22px; top:32%; width:42px; height:31px; border-radius:8px; z-index:1;
  background:
    linear-gradient(90deg,transparent 31%,rgba(0,0,0,.22) 32% 34%,transparent 35% 65%,rgba(0,0,0,.22) 66% 68%,transparent 69%),
    linear-gradient(0deg,transparent 46%,rgba(0,0,0,.22) 47% 53%,transparent 54%),
    linear-gradient(135deg,#F6E3A1,#C9A34E 55%,#EBD083);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55), 0 2px 6px rgba(0,0,0,.3);
}
.card-edit-btn{
  background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.22);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); z-index:2;
}
.cards-dots{ display:flex; justify-content:center; gap:7px; margin:0 0 20px; min-height:7px; }
.cards-dots i{ width:7px; height:7px; border-radius:99px; background:rgba(255,255,255,.2); transition:width .3s cubic-bezier(.2,.9,.3,1), background .3s; }
.cards-dots i.active{ width:22px; background:var(--grad-action); }
.card-actions{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:18px; }
.card-action{
  display:flex; align-items:center; justify-content:center; gap:9px; min-height:54px;
  border-radius:var(--radius-lg); font-size:14px; font-weight:800; color:var(--text);
  background:rgba(255,255,255,.06); border:1px solid var(--border);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06); transition:transform .15s, background .2s;
}
.card-action svg{ width:19px; height:19px; color:var(--violet-light); }
.card-action:active{ transform:scale(.96); background:var(--violet-soft); }
#btn-issue-card{ background:rgba(255,255,255,.07); color:var(--text); border:1px dashed var(--border-strong); box-shadow:none; }
