* { box-sizing: border-box; }
html, body { margin:0; padding:0; font-family: Roboto, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; background: var(--bg,#0f1115); color: var(--fg,#ffffff); }
:root {
  --card-bg: rgba(255,255,255,0.06);
  --card-br: 12px;
  --muted: #9aa4b2;
  --accent: #4da3ff;
  --good: #10b981;
  --bad: #ef4444;
}
.topbar { position: sticky; top:0; padding: 14px 16px; backdrop-filter: saturate(180%) blur(12px); background: rgba(0,0,0,0.35); border-bottom: 1px solid rgba(255,255,255,0.08); display:flex; align-items:center; justify-content:space-between; }
.topbar h1 { font-size: 18px; margin: 0; letter-spacing: .4px; }
#userBadge { font-size: 12px; color: var(--muted); display: none; }
#viewRoot {
    padding: 0px !important;
    padding-top: 15px !important;
    padding-bottom: 88px !important;
}
.tabbar { position: fixed; bottom: 0; left:0; right:0; display:grid; grid-template-columns: repeat(5,1fr); gap:4px; padding:10px 8px calc(10px + env(safe-area-inset-bottom)); background: rgba(0, 0, 0, 0); border-top: 1px solid rgba(255,255,255,0.08); backdrop-filter: saturate(180%) blur(12px); }
.tabbar button { appearance:none; border:0; background: var(--card-bg); color:#fff; border-radius:10px; padding:10px 6px; font-size:12px; }
.tabbar button.active { outline: 2px solid var(--accent); }

.cards { display: grid; gap: 12px; }
.card { background: var(--card-bg); border-radius: var(--card-br); padding: 14px; border: 1px solid rgba(255,255,255,0.06); }
.card h3 { margin: 0 0 8px 0; font-size: 15px; }
.row { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.price { font-weight: 700; font-size: 18px; }
.delta { font-weight: 600; }
.delta.up { color: var(--good); }
.delta.down { color: var(--bad); }
.spark { display:block; width:100%; height:42px; }

.grid3 { display:grid; grid-template-columns: repeat(3, 1fr); gap:12px; }
.kv { display:flex; flex-direction:column; gap:4px; background: var(--card-bg); padding:12px; border-radius:12px; border:1px solid rgba(255,255,255,0.06); }
.kv span:first-child { font-size:12px; color:var(--muted); }
.kv span:last-child { font-size:14px; }

.list { display:flex; flex-direction:column; gap:8px; }
.item { display:flex; flex-direction:column; gap:4px; background: var(--card-bg); padding:12px; border-radius:12px; border:1px solid rgba(255,255,255,0.06); }
.item .meta { font-size:12px; color:var(--muted); }
.item .title { font-size:14px; font-weight:600; }

.small { font-size:12px; color:var(--muted); }
.btn { display:inline-flex; align-items:center; gap:8px; padding:10px 12px; border-radius:10px; border:1px solid rgba(255,255,255,0.12); background:#11161d; color:#fff; text-decoration:none; }
.controls { display:flex; gap:8px; flex-wrap:wrap; margin:8px 0 12px; }

.toggle { display:flex; align-items:center; gap:8px; }
.toggle input { transform: scale(1.1); }


/* ===== Aurum Crypto Dark (чёрно-синий фон) ===== */

/* Палитра */
:root{
  --aurum-bg0:#03060c;
  --aurum-bg1:#060a12;
  --aurum-bg2:#0a1220;
  --aurum-accent:#2a5dff;
  --aurum-cyan:#00e6ff;
  --aurum-text:#ffffff;
}

html,body{
  height:100%;
  background:var(--aurum-bg0);
  color:var(--aurum-text);
  margin:0;
}

/* Фон висит на корневом контейнере приложения */
.app{
  position:relative;
  min-height:100dvh;
  background: #101010;
  overflow:hidden;
}

/* Аурора/неон — мягкая «жизнь» фону */
.app::before{
    content: "";
    position: absolute;
    inset: -20%;
    background: conic-gradient(from -45deg at 30% 20%, transparent 0 30deg, rgb(17 16 18) 90deg 160deg, transparent 210deg 360deg), conic-gradient(from 120deg at 70% 30%, transparent 0 20deg, rgb(73 142 251 / 12%) 100deg 180deg, transparent 260deg 360deg);
    filter: blur(60px) saturate(120%);
    mix-blend-mode: screen;
    animation: aurumSpin 42s linear infinite;
    opacity: .9;
    pointer-events: none;
    display: none;
}

/* Тонкая сетка поверх — «цифровой» вайб */
.app::after{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(80,140,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(80,140,255,.05) 1px, transparent 1px);
  background-size:80px 80px;
  animation: aurumGrid 28s linear infinite;
  opacity:.55;
  pointer-events:none;
  mask: radial-gradient(closest-side at 50% 50%, rgba(0,0,0,.85), rgba(0,0,0,.15) 70%, transparent);
  -webkit-mask: radial-gradient(closest-side at 50% 50%, rgba(0,0,0,.85), rgba(0,0,0,.15) 70%, transparent);
}

/* Поднимаем контент над слоями фона */
.topbar,#viewRoot,.tabbar{ position:relative; z-index:2; }

/* Стеклянный хедер */
.topbar{
  position: sticky;
  top: 0;                /* прилипает к верху контейнера TG */
  margin-top: 0;         /* ← убрать 50px — это и есть «лишнее место» */
  padding: 12px 16px;    /* базовый паддинг без safe-area */
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.03);
  border-bottom: 1px solid rgba(120,180,255,.12);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* только в развёрнутом режиме добавляем отступ под вырез */
.twa-expanded .topbar{
  padding-top: calc(env(safe-area-inset-top) + 12px);
  padding-top: calc(constant(safe-area-inset-top) + 12px); /* старые iOS */
}

.topbar h1{
  margin:0;
  font-size:18px;
  color:#e8f1ff;
  letter-spacing:.2px;
}

/* Стеклянная таббар снизу */
.tabbar{
  position:fixed;
  left:0; right:0; bottom:0;
  padding:8px calc(12px + env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left));
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:8px;
  background:rgba(255,255,255,.03);
  border-top:1px solid rgba(120,180,255,.12);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.tabbar button{
  appearance:none;
  border:1px solid rgba(120,180,255,.14);
  background:rgba(255,255,255,.02);
  padding:10px 8px;
  border-radius:12px;
  color:#cfe7ff;
  font:500 13px/1 system-ui,-apple-system,"Segoe UI",Roboto,Inter,"SF Pro Text",sans-serif;
}
.tabbar button.active{
  border-color:rgba(0,160,255,.45);
  box-shadow:0 6px 22px rgba(0,120,255,.25), inset 0 1px 0 rgba(255,255,255,.05);
  background: #000000;
}

/* Отступ, чтобы контент не прятался под таббар */
#viewRoot{ padding:16px; padding-bottom:88px; }

/* Ссылки */
a{ color:#79c9ff; }
a:hover{ color:#a9dcff; }

/* Анимации */
@keyframes aurumSpin{ to{ transform: rotate(360deg) scale(1.04); } }
@keyframes aurumGrid{ to{ background-position:0 80px, 80px 0; } }

/* Менее подвижная версия для пользователей, кто просит меньше анимации */
@media (prefers-reduced-motion: reduce){
  .app::before,
  .app::after{ animation:none; }
}


/* === RATES CARD LAYOUT FIX === */
.rates-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap:12px;
}

.rate-tile{
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  padding: 10px 12px;
  min-width: 0;                /* важен для переноса внутри грид-ячейки */
}

.rate-title{
  opacity:.85;
  font-size: .9rem;
  margin-bottom: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rate-price{
  font-weight: 700;
  line-height: 1.2;
  /* адаптивный размер: от 16px до 22px в зависимости от ширины экрана */
  font-size: clamp(16px, 4.2vw, 22px);
  white-space: nowrap;         /* не переносим цену */
  overflow: hidden;            /* не даём вылезти за границы */
  text-overflow: ellipsis;
  font-variant-numeric: tabular-nums; /* ровные цифры */
}

.rate-change{
  margin-top: 4px;
  font-weight: 600;
}

.rate-change.up { color:#38d39f; }
.rate-change.down { color:#ff6b6b; }

.rate-range{
  margin-top: 4px;
  opacity: .75;
  font-size: .85rem;
  white-space: nowrap;
}

/* уменьшения на очень узких экранах */
@media (max-width: 420px){
  .rate-price{ font-size: clamp(15px, 5.5vw, 19px); }
  .rate-range{ font-size: .8rem; }
  .rates-grid{ gap:10px; }
}


/* === FIX crypto rates block === */
.grid3 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 12px;
}

.grid3 > div {
    background: #142635;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 12px;
    padding: 10px;
    min-width: 0;
}

.row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.price {
  font-weight: 700;
  line-height: 1.2;
  font-size: clamp(16px, 4vw, 20px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-variant-numeric: tabular-nums;
}

.delta {
  font-weight: 600;
}
.delta.up { color: #38d39f; }
.delta.down { color: #ff6b6b; }

.spark {
  width: 100%;
  height: 40px;
  display: block;
}

.row.small {
  font-size: 0.85rem;
  opacity: 0.8;
  margin-top: 4px;
}

/* адаптация под узкие экраны */
@media (max-width: 420px) {
  .price { font-size: clamp(14px, 5vw, 18px); }
}

/* ==== Bottom tabs: horizontal scroll + safe area ==== */
/* Контейнер табов (добавим ему класс tabs-scroll в JS/HTML) */
.tabs-scroll{
  display: flex;
  gap: 10px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
  padding: 8px 12px calc(8px + env(safe-area-inset-bottom));
  scrollbar-width: none;               /* Firefox hide */
  position: sticky;
  bottom: 0;                           /* фиксируем у низа */
  background: inherit;                 /* фон как у страницы */
  z-index: 5;
}
.tabs-scroll::-webkit-scrollbar{ display: none; } /* Chrome/Safari hide */

/* Любая кнопка/ссылка внутри таббара — фиксированная ширина по контенту */
.tabs-scroll > *{
  flex: 0 0 auto;
  scroll-snap-align: start;
  white-space: nowrap;
}

/* Чуть компактнее на узких экранах */
@media (max-width: 420px){
  .tabs-scroll{ gap: 8px; padding: 6px 10px calc(6px + env(safe-area-inset-bottom)); }
  .tabs-scroll > *{ font-size: 14px; padding: 8px 12px; }
}

.news-ul { list-style: none; margin: 0; padding: 0; }
.news-li { padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,0.06); }
.news-li:last-child { border-bottom: none; }
.news-li a { color: var(--fg, #e8efff); text-decoration: none; }
.news-li a:hover { text-decoration: underline; }
.news-meta { font-size: 12px; opacity: .7; margin-top: 4px; display: flex; gap: 6px; align-items: center; }
.news-meta .dot { opacity: .6; }

.news-meta.small {
    margin-bottom: 23px;
}

.tabbar{ z-index:30; pointer-events:auto }
.tabbar button{ -webkit-tap-highlight-color:transparent; pointer-events:auto }
#appOverlay,#debugOverlay{ pointer-events:none !important }

/************  AURUM — БОТЫ (scoped)  ************/
:root{
  --aur-bg:            rgba(255,255,255,0.72);
  --aur-card:          rgba(255,255,255,0.86);
  --aur-text:          #0f172a;
  --aur-muted:         #6b7280;
  --aur-line:          rgba(15,23,42,0.08);
  --aur-green:         #22c55e;
  --aur-red:           #ef4444;
  --aur-brand:         #6366f1;
  --aur-shadow:        0 6px 22px rgba(2,6,23,0.07), 0 1px 0 rgba(2,6,23,0.06);
}
@media (prefers-color-scheme: dark){
  :root{
    --aur-bg:    rgb(159 159 159 / 27%);
    --aur-card:  rgba(30,41,59,0.75);
    --aur-text:  #e5e7eb;
    --aur-muted: #94a3b8;
    --aur-line:  rgba(148,163,184,0.16);
    --aur-shadow: 0 8px 28px rgba(0,0,0,0.35);
  }
}

/* ВСЁ только внутри .bots-scope */
.bots-scope .bots-list{
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

/* Карточка бота */
.bots-scope .bot-card{
  position: relative;
  background: var(--aur-card);
  border: 1px solid var(--aur-line);
  border-radius: 18px;
  padding: 14px;
  box-shadow: var(--aur-shadow);
  backdrop-filter: saturate(120%) blur(6px);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}
.bots-scope .bot-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(2,6,23,0.10);
}

/* Анимированная рамка для активных */
.bots-scope .bot-card.on::before{
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: 19px;
  padding: 1px;
  background: linear-gradient(120deg,#22c55e,#60a5fa,#a78bfa,#f472b6,#facc15,#22c55e);
  background-size: 300% 300%;
  animation: aurGlow 6s linear infinite;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask-composite: exclude;
  pointer-events: none;
}
@keyframes aurGlow{
  0%{ background-position: 0% 50%;}
  50%{background-position: 100% 50%;}
  100%{background-position: 0% 50%;}
}

/* Заголовок + статус */
.bots-scope .bot-row{
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; margin-bottom: 6px;
}
.bots-scope .bot-name{ font-weight: 700; font-size: 16px; letter-spacing: .2px; color: var(--aur-text); }
.bots-scope .bot-status{
  font-size: 12px; padding: 4px 8px; border-radius: 999px;
  background: rgba(148,163,184,0.16); color: var(--aur-muted);
  border: 1px solid var(--aur-line);
}
.bots-scope .bot-status.green{
  background: rgba(34,197,94,0.12); color:#16a34a; border-color: rgba(34,197,94,0.28);
}

/* Описание */
.bots-scope .bot-desc{
  color: var(--aur-muted); font-size: 13px; line-height: 1.35; margin: 2px 0 10px;
}

/* Сетка метрик */
.bots-scope .bot-stats{
  display: grid; grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px; padding: 10px; border-radius: 12px;
  background: linear-gradient(180deg, rgba(2,6,23,0.02), rgba(2,6,23,0.06));
  border: 1px dashed var(--aur-line);
}
@media (min-width: 420px){ .bots-scope .bot-stats{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
.bots-scope .bot-stats > div{ display: grid; gap: 4px; }
.bots-scope .bot-stats .k{ font-size: 11px; color: var(--aur-muted); text-transform: uppercase; letter-spacing: .06em; }
.bots-scope .bot-stats .v{ font-size: 15px; font-weight: 700; color: var(--aur-text); }
.bots-scope .bot-stats .v.green{ color: var(--aur-green); }
.bots-scope .bot-stats .v.red{ color: var(--aur-red); }

/* Кнопка заявки */
.bots-scope .bot-actions{ margin-top: 12px; }
.bots-scope .btn.btn-apply{
  width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-weight: 700; font-size: 14px; color: #fff; padding: 12px 14px; border-radius: 12px;
  border: 0; cursor: pointer;
  background: linear-gradient(135deg, var(--aur-brand), #22c55e);
  box-shadow: 0 8px 22px rgba(99,102,241,.25), inset 0 -1px 0 rgba(255,255,255,.18);
  transition: transform .12s ease, box-shadow .2s ease, opacity .2s ease, filter .2s ease;
}
.bots-scope .btn.btn-apply:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 28px rgba(34,197,94,.22), 0 6px 16px rgba(99,102,241,.18);
  filter: saturate(1.05);
}
.bots-scope .btn.btn-apply:active{ transform: translateY(0) scale(.99); }
.bots-scope .btn.btn-apply:disabled{ opacity: .6; filter: grayscale(.1); cursor: default; box-shadow: none; }

/* «На паузе» */
.bots-scope .bot-card.off{ opacity: .86; }
.bots-scope .bot-card.off .btn-apply{
  background: linear-gradient(135deg, #a3a3a3, #6b7280);
  box-shadow: 0 6px 16px rgba(0,0,0,.15);
}

/* Заголовки внутри вкладки Боты (НЕ трогаем глобальные .card/.cards) */
.bots-scope .card{
  background: rgb(255 255 255 / 00%) !important;
  border: 1px solid var(--aur-line);
  border-radius: 18px;
  padding: 14px;
  box-shadow: var(--aur-shadow);
  backdrop-filter: saturate(120%) blur(6px);
}
.bots-scope .card > h3{
  margin: 0 0 10px 0;
  font-size: 16px; font-weight: 800; letter-spacing: .2px; color: #ffffff;
}

/* ===== SIGNS: красивый список сигналов ===== */

.signals-list{
  display:flex;
  flex-direction:column;
  gap:14px;
}

/* Карточка */
.signal-item{
  position:relative;
  padding:16px 16px 12px;
  border-radius:14px;
  background: rgba(18, 26, 38, .55);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: 0 6px 24px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.06);
  overflow:hidden;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.signal-item:hover{
  transform: translateY(-2px);
  box-shadow: 0 12px 34px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.05);
}

/* Анимированная окантовка (как в «ботах») */
.signal-item::before{
  content:"";
  position:absolute; inset:-1px;
  border-radius:14px;
  padding:1px;
  background:
    linear-gradient(120deg,
      rgba(66,133,244,.22),
      rgba(52,211,153,.22),
      rgba(99,102,241,.22),
      rgba(66,133,244,.22));
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  animation: sigBorder 6s linear infinite;
  pointer-events:none;
}
@keyframes sigBorder{
  0%   { filter:hue-rotate(0deg); }
  100% { filter:hue-rotate(360deg); }
}

/* Шапка карточки: только дата справа/слева */
.sig-head{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  margin-bottom:8px;
}
.sig-date{
  font-size:13px;
  color: var(--muted, #9fb0c7);
  background: rgba(255,255,255,.06);
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}

/* Текст сигнала */
.sig-text{
  margin:8px 0 2px;
  white-space:pre-wrap;
  word-break:break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  font-size:14px;
  line-height:1.35;
  color:#dbe7ff;
  text-shadow: 0 1px 0 rgba(0,0,0,.25);
}

/* Кнопки/ссылки под текстом */
.sig-actions{
  margin-top:10px;
  display:flex; gap:10px; flex-wrap:wrap;
}
.sig-link{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px;
  border-radius:10px;
  text-decoration:none;
  font-size:13px;
  color:#d9e7ff;
  background: rgba(99,102,241,.15);
  border:1px solid rgba(99,102,241,.35);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
  transition: background .18s ease, transform .18s ease, box-shadow .18s ease;
}
.sig-link:hover{
  transform: translateY(-1px);
  background: rgba(99,102,241,.22);
  box-shadow: 0 6px 18px rgba(99,102,241,.26);
}

/* Мелкие статусы/подписи */
.small{ font-size:13px; color:var(--muted, #9fb0c7); }

/* Адаптив */
@media (max-width: 420px){
  .signal-item{ padding:14px 14px 10px; border-radius:12px; }
  .signal-item::before{ border-radius:12px; }
  .sig-text{ font-size:13.5px; line-height:1.32; }
  .sig-date{ font-size:12.5px; padding:5px 9px; }
}



/* ========= SIGNAL PRO CARD ========== */
.signalProCard{
  --bg:rgba(21,28,41,.72);
  --fg:#dfe9ff;
  --muted:#91a3c7;
  --accent: #61d37b;       /* зелёный для LONG */
  --danger: #ff6b6b;       /* красный для SHORT */
  --brand: #8fb3ff;        /* синий для текущей цены */
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.05)), var(--bg);
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  padding:18px;
  color:var(--fg);
  box-shadow: 0 12px 30px rgba(0,0,0,.25) inset, 0 4px 16px rgba(0,0,0,.25);
  backdrop-filter: blur(6px);
}

.signalProHead{
  display:flex; align-items:center; gap:12px; margin-bottom:10px;
}
.signalProTicker{
  display:flex; align-items:center; gap:10px;
  font-weight:700; letter-spacing:.3px; font-size:22px;
}
.signalProBadge{
  font-size:14px; padding:4px 10px; border-radius:12px;
  background: rgba(255,255,255,.06); color: var(--muted);
  border:1px solid rgba(255,255,255,.08);
}
.signalProTime{ color:var(--muted); font-size:13px; margin-left:auto; }

/* шкала */
.signalProScale{
  position:relative; margin:14px 0 8px; height:8px; border-radius:999px;
  background: linear-gradient(90deg, var(--danger), #b3c0ff 45%, var(--accent));
  opacity:.95;
}
.signalProMark{
  position:absolute; top:50%; transform:translate(-50%,-50%);
  width:18px; height:18px; border-radius:50%;
  background:#0b1220; border:3px solid var(--brand); box-shadow:0 0 0 4px rgba(143,179,255,.18);
}
.signalProStops{
  display:flex; justify-content:space-between; margin-top:8px; color:var(--muted); font-size:13px;
}
.signalProStops b{ color:var(--fg); font-weight:700; font-size:16px; }

.signalProMeta{
  display:flex; gap:14px; flex-wrap:wrap; margin-top:10px; font-size:13px; color:var(--muted);
}
.signalProMeta .pill{
  border:1px solid rgba(255,255,255,.1); padding:6px 10px; border-radius:12px;
}
.signalProAction{
  margin-top:14px; display:flex; gap:10px; align-items:center; flex-wrap:wrap;
}
.signalProBtn{
  padding:10px 14px; border-radius:12px; border:1px solid rgba(255,255,255,.1);
  background:#121a29; color:#fff; font-weight:600; font-size:14px;
}
.signalProBtn.primary{ background:linear-gradient(180deg,#1e2b45,#152034); }
.signalProDelta{
  margin-left:auto; font-weight:700; font-size:15px;
}
.signalProDelta.pos{ color:var(--accent); }
.signalProDelta.neg{ color:var(--danger); }

/* маленькая медиа-адаптация */
@media (max-width: 420px){
  .signalProTicker{ font-size:20px }
  .signalProMark{ width:16px; height:16px }
}



/* ИКОНКА-КНОПКА «НАСТРОИТЬ КУРСЫ» */
.icon-btn{
  width: 42px;
  height: 42px;
  padding: 0;                      /* убираем внутренние отступы */
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 12px !important;
  border: 0px solid rgba(120,160,255,.25) !important;
  color: #eaf2ff;
}

.icon-btn svg{
  width: 20px !important;
  height: 20px !important;
  transform: rotate(0deg) !important;
  transition: transform .25s ease !important;
  pointer-events: none !important;
}

.icon-btn:hover{
  transform: translateY(-1px) !important;
  border-color: rgba(120,160,255,.45) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 10px 26px rgba(76,112,240,.22) !important;
}

.icon-btn:hover svg{ transform: rotate(25deg); }

.icon-btn:active{
  transform: translateY(0);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 6px 14px rgba(76,112,240,.18);
}

.icon-btn:focus-visible{
  outline: none;
  box-shadow:
    0 0 0 3px rgba(76,112,240,.35),
    0 10px 26px rgba(76,112,240,.22);
}


button#editWatchlist {
    background: #ffffff00 !important;
}


/* База */
.tabbar{
    position: fixed;
    bottom: 0;
    z-index: 20;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 10px;
    padding: 10px;
    background: rgb(23 42 58 / 79%);
    border-top: 1px solid rgba(255, 255, 255, .08) !important;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.tabbar .tab-btn{
  position: relative;
  height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.00);
  color: rgba(220,232,255,.78);
  cursor: pointer;
  transition: transform .12s ease, color .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

.tabbar .tab-btn .ico{
  width: 22px; height: 22px;
  stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7;
}

/* Hover */
.tabbar .tab-btn:hover{
  color: #dfe8ff;
  background: rgba(255,255,255,.04);
  border-color: rgba(120,160,255,.25);
  transform: translateY(-1px);
}

/* Active */
.tabbar .tab-btn.active {
    color: #ffffff;
    border-color: rgba(120, 160, 255, .4);
    background: #ffffff00;
    box-shadow: none;
    outline: 0px solid var(--accent);
}

/* Индикатор активной (тонкая планка) — кроме «Сигналов» */
.tabbar .tab-btn.active::before{
  content: "";
  position: absolute; top: -6px; width: 18px; height: 3px; border-radius: 2px;
  background: linear-gradient(90deg, #295273, #295273);
}

/* ——— Центральная «Сигналы» — плавающая круглая кнопка ——— */
.tabbar .tab-btn.tab-btn--primary[data-tab="signals"]{
  width: 60px; height: 60px; margin-top: -18px; border-radius: 50%;
  border-width: 2px;
  background: #204059;
  color: #cfe0ff;
  z-index: 3;
  left: 50%;
  margin-left: -30px;
}
.tabbar .tab-btn.tab-btn--primary[data-tab="signals"] .ico{
  width: 28px; height: 28px; stroke-width: 2;
}
.tabbar .tab-btn.tab-btn--primary[data-tab="signals"]:hover{
  color: #ffffff;
  border-color: rgba(160,195,255,.9);
  transform: translateY(-2px);
  box-shadow:
    0 10px 32px rgba(76,112,240,.45),
    inset 0 1px 0 rgba(255,255,255,.18);
}
.tabbar .tab-btn.tab-btn--primary[data-tab="signals"].active{
    color: #ffffff;
    background: #0382ef;
    border-color: rgba(160, 195, 255, .95);
}
.tabbar .tab-btn.tab-btn--primary[data-tab="signals"].active::before{ display:none; }

/* Маленькие экраны */
@media (max-width: 380px){
  .tabbar{ gap:8px; padding:8px; }
  .tabbar .tab-btn{ height: 40px; border-radius: 10px; }
  .tabbar .tab-btn .ico{ width: 20px; height: 20px; }
  .tabbar .tab-btn.tab-btn--primary[data-tab="signals"]{
    width: 54px; height: 54px; margin-top: -14px;
  }
  .tabbar .tab-btn.tab-btn--primary[data-tab="signals"] .ico{
    width: 26px; height: 26px;
  }
}

.btn.appakk {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: .7rem 1.2rem;
  border-radius: 14px;
  background: linear-gradient(135deg,#1e2538,#141926);
  color: #fff;
  border: 1px solid rgba(255,255,255,.12);
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  transition: all .25s ease;
}

.btn.appakk .ico {
  width: 20px;
  height: 20px;
  stroke: currentColor;
  flex-shrink: 0;
}

.btn.appakk:hover {
  background: linear-gradient(135deg,#283147,#1a1f2e);
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(0,0,0,.3);
  border-color: rgba(120,160,255,.35);
}

.btn.appakk:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(0,0,0,.4);
}


/* ===== Admin Users (v2) — desktop table + mobile cards ===== */
:root{
  --bg-card: rgba(255,255,255,.04);
  --brd:     rgba(255,255,255,.10);
  --brd-2:   rgba(255,255,255,.18);
  --muted:   rgba(255,255,255,.75);
  --accent:  #7aa8ff;
  --accent-2:#59f3b4;
  --surface: #0f1320;
}

/* header */
.admin-head{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; flex-wrap:wrap; margin-bottom:12px;
}
.admin-head h3{ margin:0; font-size:18px }
.admin-search input{
  width:min(340px,100%); padding:.6rem .85rem; border-radius:12px;
  border:1px solid var(--brd); background:var(--surface); color:#fff;
}
.admin-search input:focus{ outline:none; border-color:var(--brd-2); box-shadow:0 0 0 3px rgba(120,160,255,.25) }

/* container */
.table-wrap{
  border:1px solid var(--brd); border-radius:16px;
  background:var(--bg-card); backdrop-filter: blur(6px);
  overflow:auto; -webkit-overflow-scrolling:touch;
}

/* ——— Desktop table ——— */
.table{ width:100%; border-collapse:separate; border-spacing:0; min-width:720px }
.table thead th{
  position:sticky; top:0; z-index:2; background:#121829; color:#fff;
  padding:12px 14px; text-align:left; font-size:13px; border-bottom:1px solid var(--brd-2)
}
.table th:first-child{ border-top-left-radius:16px }
.table th:last-child{  border-top-right-radius:16px }
.table tbody td{ padding:12px 14px; border-bottom:1px solid var(--brd) }
.table tbody tr:hover td{ background:rgba(255,255,255,.045) }
.table tbody tr:last-child td{ border-bottom-color:transparent }

/* content atoms */
.table .id{
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  white-space:nowrap; color:#cfe2ff;
}
.table .user{ display:flex; align-items:center; gap:10px; min-width:0 }
.table .user .ava{
  width:32px; height:32px; border-radius:50%; object-fit:cover;
  border:1px solid var(--brd); flex:0 0 32px;
}
.table .user .name{ min-width:0 }
.table .user .name .line1{
  font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.table .user .name .line2{
  font-size:12px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* controls */
.table select,
.table .btn{
  border-radius:12px; border:1px solid var(--brd);
  background:var(--surface); color:#fff; padding:.55rem .8rem; cursor:pointer;
}
.table .btn.secondary{ background:transparent }
.table select{
  -webkit-appearance:none; appearance:none;
  padding-right:2rem;
  background-image:
    radial-gradient(circle at right .7rem center, #fff 0 1px, transparent 2px),
    linear-gradient(transparent,transparent);
  background-repeat:no-repeat; background-position: right .6rem center;
}
.table select:focus, .table .btn:focus{
  outline:none; border-color:var(--brd-2); box-shadow:0 0 0 3px rgba(120,160,255,.25)
}

/* ——— Mobile cards ——— */
@media (max-width:560px){
  .table{ min-width:0 }
  .table thead{ display:none }
  .table, .table tbody{ display:block; width:100% }
  .table tbody tr{
    display:grid;
    grid-template-areas:
      "user   user"
      "id     role"
      "action action";
    grid-template-columns: 1fr auto;
    gap:10px;
    margin:12px;
    padding:14px;
    border:1px solid var(--brd);
    border-radius:16px;
    background:
      linear-gradient(180deg, rgba(122,168,255,.10), transparent 35%),
      var(--bg-card);
    box-shadow: 0 6px 20px rgba(0,0,0,.25);
  }
  .table tbody td{ border:none; padding:0 }

  /* map cells to areas without менять HTML */
  .table tbody td:nth-child(2){ grid-area:user }   /* user */
  .table tbody td:nth-child(1){ grid-area:id }     /* id   */
  .table tbody td:nth-child(3){ grid-area:role; justify-self:end } /* select */
  .table tbody td:nth-child(4){ grid-area:action } /* button */

  /* prettify pieces */
  .table .user .ava{ width:40px; height:40px; border-color:var(--brd-2) }
  .table .id{
    display:inline-block; padding:.25rem .55rem;
    border:1px dashed var(--brd-2); border-radius:999px;
    color:#d7e6ff; background:rgba(122,168,255,.08);
  }
  .table select{
    background:
      linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
      var(--surface);
    border-color: var(--brd-2);
  }
  .table .btn{
    width:100%;
    background: linear-gradient(180deg, rgba(122,168,255,.18), rgba(122,168,255,.08));
    border-color: rgba(122,168,255,.35);
  }

  /* скрыть текстовые псевдо-лейблы, если включены авто-подписи */
  .table tbody td::before{ display:none !important }
}


/* подсветка по выбранной роли (опционально) */
@media (max-width:560px){
  .table tbody tr:is([data-role="VIP"]) { border-color: rgba(89,243,180,.35) }
  .table tbody tr:is([data-role="Заблокирован"]) { border-color: rgba(255,80,80,.35) }
}


h3 {
    font-family: "Unbounded", sans-serif;
    font-weight: 400;
    font-size: 18px !important;
}

a.news-link {
    font-weight: 600 !important;
    text-decoration: none;
    font-size: 19px;
    line-height: 23px;
}

a.news-source {
    color: #4e5367 !important;
    font-size: 12px !important;
    font-weight: 100 !important;
    text-decoration: none !important;
}

.topbar {z-index: 3 !important; }

#viewRoot {
    z-index: 2 !important; 
}

.promo-bleed {
    margin-top: -65px !important; 
}

.promo-slide{ height: 400px  !important;  }

.promo-track {
    width: 100% !important;
}

.signalshome {
    margin-top: -50px  !important;
    background: rgb(29 66 98 / 51%)  !important;
    z-index: -1  !important;
    padding-top: 40px  !important;
}

.news-thumb {
    width: 100% !important;
    height: 185px !important;
    margin-bottom: 10px;
    border: 0px solid var(--news-brd) !important;
   }

.news-body {
    background: #1d4262;
    border-radius: 9px;
    padding: 14px;
    margin-top: -28px;
    width: 100%;
    padding-top: 31px;
}

.news-title {
    font-weight: 300 !important;
    font-size: 16px !important;
    margin: 0;
    min-width: 0;
    color: #ffffff !important;
    display: -webkit-box;
    -webkit-line-clamp: 1 !important;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.25;
}

.news-excerpt {
    opacity: 0.85;
    line-height: 1.4;
    font-size: 13px !important;
    color: rgb(255 255 255) !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: -15px !important;
    background: #163149;
    padding: 3px;
    width: fit-content;
    border-radius: 8px;
    padding-left: 10px;
    padding-right: 10px;
    margin-top: -9px !important;
}

.news-filter-dd .dd-toggle {
    border: 0px solid rgba(255, 255, 255, .12) !important;
}

.news-filter-dd .dd-menu {
    border: 0px solid var(--dd-brd) !important;
    background: #1d4262eb !important;
}

.news-status {
    position: absolute !important;
    right: 28px !important;
    margin-top: 22px !important;
}

.tag {
    padding: 0.18rem .2rem !important;
}

.account-header {
    margin-top: -76px;
    padding-top: 77px !important;
    padding-bottom: 17px !important;
}

.role-badge {
  margin-top: 7px  !important;
}

.payall {
    background-color: #3e49bf  !important;
}

div#billingCard {
    background: #19227d;
}

div#stickyBar {
    background: #212121  !important;
}

.news-head {
    display: block !important;
     margin-bottom: -2px !important;
}

.news-body {
    display: block !important;
}

.news-tags {
    display: inline-flex !important;
    width: fit-content !important;
}

.news-excerpt {
    display: inline-flex !important;
    width: fit-content !important;
    line-height: 1.3  !important;
}

.tag {
    border: 0px solid var(--tag-brd) !important;
    background: #ffffff00 !important;
}


/* ======= PnL Glass Row ======= */
.pnl-row{
  --bg: rgba(255,255,255,.06);
  --chip: rgba(255,255,255,.08);
  --chip-hover: rgba(255,255,255,.12);
  --text: #e9eef5;
  --muted: #a9b3c1;
  --up: #65f3b3;
  --down: #ff6b6b;

  display:flex; align-items:center; gap:8px;
  padding:8px 10px; border-radius:14px;
  color:var(--text); background:var(--bg);
  backdrop-filter: blur(8px);
  border:1px solid rgba(255,255,255,.07);
  box-shadow: 0 4px 12px rgba(0,0,0,.18) inset, 0 2px 8px rgba(0,0,0,.25);
  width: 100%; max-width:100%;
}

.pnl-label{
  font-weight:800; letter-spacing:.4px; font-size:.9rem;
  padding:4px 8px; border-radius:10px;
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.08);
}

.pnl-chip{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 10px; border-radius:12px;
  font-size:.92rem; line-height:1;
  background:var(--chip);
  border:1px solid rgba(255,255,255,.09);
  transition: transform .18s ease, background .2s ease, border-color .2s ease;
  cursor:default;
}
.pnl-chip:hover{ background:var(--chip-hover); transform: translateY(-1px); }

.pnl-chip svg{ width:16px; height:16px; opacity:.9 }
.pnl-chip b{ font-weight:800; letter-spacing:.2px }
.pnl-chip small{
  color:var(--muted); font-size:.74rem; font-weight:600;
  padding-left:2px;
}

/* up/down coloring — просто меняй класс up -> down */
.pnl-chip.up b{ color: var(--up) }
.pnl-chip.up svg{ color: var(--up) }
.pnl-chip.down b{ color: var(--down) }
.pnl-chip.down svg{
  color: var(--down); transform: rotate(180deg);
}

/* ультра-компактная версия — на случай тесных мест */
.pnl-inline{ color:var(--text); font-size:.95rem }
.pnl-inline b.up{ color:var(--up) }
.pnl-inline b.down{ color:var(--down) }



/* ===== убираем бордеры ===== */

.card {
    border: 0px solid rgba(255, 255, 255, .00) !important;
    background: rgba(255, 255, 255, 0.089);
}

.grid3 > div {
    border: 0px solid rgba(255, 255, 255, .08) !important;
}

.news-card {
     border: 0px solid var(--news-brd) !important;
}

.topbar {
    border-bottom: 0px solid rgba(120, 180, 255, .12) !important;
}

.tabbar {
    border-top: 0px solid rgba(255, 255, 255, .08) !important;
}

.tabbar .tab-btn {
    border: 0px solid rgba(255, 255, 255, .06) !important;
}

.icon-btn {
    border: 0px solid rgba(120, 160, 255, .25) !important;
  }

button#goSignals {
    font-weight: 100 !important;
    background:#1c3141!important;
    font-size: 16px !important;
    padding: 9px;
    color: #dfeaff;
    width: -webkit-fill-available;
    place-content: space-around;
}

button#editWatchlist {
    border: 1px solid rgb(255 255 255 / 0%) !important;
    background: #121b2d00 !important;
}