:root{
  --bg:#0a0612;
  --bg-2:#120a24;
  --card:#171025;
  --card-border:#2a1f42;
  --text:#f2eefc;
  --text-dim:#a596c4;
  --text-faint:#6e6089;
  --purple:#8b3cf7;
  --purple-2:#6e2bd9;
  --purple-light:#b37cff;
  --green:#3ddc84;
  --red:#ff5c72;
  --radius:16px;
}

:root[data-theme="light"]{
  --bg:#f4f1fb;
  --bg-2:#ffffff;
  --card:#ffffff;
  --card-border:#e4defa;
  --text:#211a33;
  --text-dim:#6b6085;
  --text-faint:#948bb0;
  --purple:#8b3cf7;
  --purple-2:#6e2bd9;
  --purple-light:#7c3cf0;
  --green:#1fa15c;
  --red:#e13656;
}

*{box-sizing:border-box;margin:0;padding:0;}

body{
  background:radial-gradient(120% 100% at 50% 0%, var(--bg-2) 0%, var(--bg) 55%);
  color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
}

.app{max-width:480px;margin:0 auto;min-height:100vh;position:relative;overflow-x:hidden;}

.screen{
  display:none;
  flex-direction:column;
  min-height:100vh;
  padding:14px 20px 28px;
  position:relative;
}
.screen.active{display:flex;}

/* progress bar at top, like macет "1/8" */
.progress{height:3px;background:#231a38;border-radius:2px;margin-bottom:18px;overflow:hidden;}
.progress-fill{height:100%;background:linear-gradient(90deg,var(--purple-2),var(--purple-light));border-radius:2px;transition:width .3s ease;}

.topbar{display:flex;align-items:center;gap:12px;margin-bottom:16px;min-height:32px;}
.topbar-title{font-size:17px;font-weight:600;}
.icon-btn{
  background:var(--card);border:1px solid var(--card-border);color:var(--text);
  width:32px;height:32px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  font-size:16px;cursor:pointer;
}

/* ---- welcome ---- */
.hero{position:relative;height:220px;border-radius:20px;overflow:hidden;margin-bottom:20px;
  background:linear-gradient(160deg,#1c1030 0%, #0c0716 80%);
  display:flex;align-items:center;justify-content:center;border:1px solid var(--card-border);}
.hero-glow{position:absolute;inset:0;background:radial-gradient(circle at 50% 40%, rgba(139,60,247,.35), transparent 60%);}
.logo-mark{position:relative;z-index:2;filter:drop-shadow(0 0 24px rgba(179,124,255,.6));}
.candles-bg{position:absolute;inset:0;opacity:.15;
  background-image:repeating-linear-gradient(90deg, var(--purple-light) 0 2px, transparent 2px 18px);
  mask-image:linear-gradient(to top, black, transparent);}

.brand-title{font-size:20px;line-height:1.35;font-weight:600;text-align:center;margin-bottom:6px;}
.brand-name{font-size:30px;font-weight:800;letter-spacing:.5px;
  background:linear-gradient(90deg,var(--purple-light),var(--purple-2));
  -webkit-background-clip:text;background-clip:text;color:transparent;}
.brand-sub{text-align:center;color:var(--text-dim);font-size:14px;margin-bottom:20px;line-height:1.5;}

.feature-list{list-style:none;margin-bottom:24px;}
.feature-list li{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:14px;color:var(--text);}
.feature-list .check{color:var(--purple-light);width:18px;height:18px;border:1px solid var(--purple-light);
  border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;flex-shrink:0;}

.btn{
  width:100%;border:none;border-radius:14px;padding:15px;font-size:15px;font-weight:600;
  display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;margin-top:auto;
}
.btn-primary{background:linear-gradient(90deg,var(--purple-2),var(--purple));color:#fff;
  box-shadow:0 8px 24px rgba(139,60,247,.35);}
.btn-primary:active{opacity:.85;}
.btn-secondary{background:var(--card);color:var(--text);border:1px solid var(--card-border);margin-top:10px;}

/* ---- register / centered informational screens ---- */
.center-block{display:flex;flex-direction:column;align-items:center;text-align:center;flex:1;justify-content:center;gap:16px;}
.icon-circle{
  width:76px;height:76px;border-radius:50%;border:1.5px solid var(--purple-light);
  display:flex;align-items:center;justify-content:center;color:var(--purple-light);
  box-shadow:0 0 30px rgba(139,60,247,.25);
}
.card{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius);padding:16px;}
.info-card{width:100%;}
.info-title{font-size:16px;font-weight:600;margin-bottom:8px;}
.info-text{font-size:13.5px;color:var(--text-dim);line-height:1.55;}

.disclaimer{font-size:11.5px;color:var(--text-faint);margin-top:10px;line-height:1.4;}
.disclaimer.center{text-align:center;}

.text-input{
  width:100%;background:var(--card);border:1px solid var(--card-border);border-radius:12px;
  padding:14px;color:var(--text);font-size:15px;text-align:center;
}
.text-input:focus{outline:none;border-color:var(--purple-light);}
.uid-status{font-size:13px;min-height:16px;}
.uid-status.ok{color:var(--green);}
.uid-status.pending{color:var(--text-dim);}
.uid-status.err{color:var(--red);}

/* ---- main menu ---- */
.menu-header{display:flex;align-items:center;gap:12px;margin-bottom:12px;}
.menu-title{font-weight:700;font-size:16px;}
.menu-sub{font-size:12.5px;color:var(--text-dim);}

.list-item{
  display:flex;align-items:center;gap:12px;width:100%;margin-bottom:10px;
  background:var(--card);border:1px solid var(--card-border);color:var(--text);text-align:left;cursor:pointer;
  text-decoration:none;
}
.list-item.accent{border-color:var(--purple);background:linear-gradient(90deg, rgba(139,60,247,.18), rgba(139,60,247,.06));}
.li-title{font-size:14.5px;font-weight:600;flex:1;}
.li-sub{font-size:12px;color:var(--text-dim);}
.li-sub.ok{color:var(--green);}
.chev{color:var(--text-faint);font-size:18px;}
.dot-status{width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);flex-shrink:0;}

.banner{
  margin-top:8px;display:flex;align-items:center;gap:10px;justify-content:center;
  background:var(--card);
  background:linear-gradient(120deg, color-mix(in srgb, var(--purple) 18%, var(--card)), color-mix(in srgb, var(--purple-2) 10%, var(--card)));
  border:1px solid var(--card-border);
  font-size:13px;color:var(--text-dim);padding:20px 16px;
}

/* ---- pairs list ---- */
.page-sub{color:var(--text-dim);font-size:13.5px;margin-bottom:14px;line-height:1.5;}
.search-box{
  display:flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--card-border);
  border-radius:12px;padding:12px 14px;margin-bottom:14px;color:var(--text-faint);
}
.search-box input{background:none;border:none;color:var(--text);font-size:14px;width:100%;}
.search-box input:focus{outline:none;}

.pairs-list{display:flex;flex-direction:column;gap:10px;}
.pair-row{
  display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--card-border);
  border-radius:14px;padding:12px 14px;cursor:pointer;
}
.coin-badge{
  width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:17px;flex-shrink:0;
  background:var(--card) !important;
  border:1px solid var(--card-border);
}
.pair-code{font-size:14.5px;font-weight:600;}
.pair-full{font-size:12px;color:var(--text-dim);}

/* ---- pair detail ---- */
.pair-head{display:flex;align-items:center;gap:12px;margin-bottom:16px;}
.pair-name{font-size:16px;font-weight:700;}
.price-block{margin-bottom:14px;}
.price-main{font-size:30px;font-weight:700;}
.price-change{font-size:14px;font-weight:600;margin-top:2px;}
.price-change.up{color:var(--green);}
.price-change.down{color:var(--red);}

.chart-placeholder{
  height:140px;border-radius:14px;margin-bottom:14px;border:1px solid var(--card-border);
  background:linear-gradient(180deg, rgba(139,60,247,.12), transparent);
  display:flex;align-items:flex-end;overflow:hidden;
}

.timeframes{display:flex;gap:8px;margin-bottom:16px;}
.lang-switch{position:absolute;top:16px;right:16px;display:flex;gap:6px;z-index:2;}
.lang-btn{background:var(--card);border:1px solid var(--card-border);color:var(--text-dim);border-radius:20px;padding:5px 12px;font-size:12px;font-weight:600;cursor:pointer;}
.lang-btn.active{background:var(--purple);color:#fff;border-color:var(--purple);}
.menu-logo{border-radius:10px;object-fit:cover;}
.banner-logo{border-radius:8px;object-fit:cover;}
.settings-card{display:flex;flex-direction:column;gap:10px;margin-bottom:12px;}
.settings-label{font-size:13px;color:var(--text-dim);font-weight:600;}
.settings-row{display:flex;gap:8px;}
.theme-btn{flex:1;background:var(--bg);border:1px solid var(--card-border);color:var(--text-dim);border-radius:10px;padding:10px;font-size:13px;font-weight:600;cursor:pointer;}
.theme-btn.active{background:var(--purple);color:#fff;border-color:var(--purple);}
.tf{flex:1;background:var(--card);border:1px solid var(--card-border);color:var(--text-dim);
  padding:8px;border-radius:10px;font-size:13px;cursor:pointer;}
.tf.active{background:linear-gradient(90deg,var(--purple-2),var(--purple));color:#fff;border-color:transparent;}

.analysis-card{margin-bottom:16px;}
.analysis-head{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--purple-light);margin-bottom:10px;}
.analysis-text{font-size:13.5px;color:var(--text-dim);line-height:1.55;margin-bottom:12px;}
.analysis-row{display:flex;justify-content:space-between;font-size:13px;padding:6px 0;border-top:1px solid var(--card-border);}
.news-card{margin-bottom:16px;}
.news-loading{font-size:13px;color:var(--text-dim);}
.news-item{display:block;padding:9px 0;border-top:1px solid var(--card-border);text-decoration:none;}
.news-item:first-child{border-top:none;}
.news-item-title{font-size:13px;color:var(--text);line-height:1.4;margin-bottom:3px;}
.news-item-meta{font-size:11px;color:var(--text-dim);}
.a-label{color:var(--text-dim);}
.a-badge{padding:2px 10px;border-radius:20px;font-size:12px;font-weight:600;}
.a-badge.buy{background:rgba(61,220,132,.15);color:var(--green);}
.a-badge.sell{background:rgba(255,92,114,.15);color:var(--red);}
.a-badge.neutral{background:rgba(165,150,196,.15);color:var(--text-dim);}

/* ---- loading ---- */
.loading-block{gap:20px;}
.spinner-mark{animation:spin 2.4s linear infinite;filter:drop-shadow(0 0 28px rgba(179,124,255,.55));}
@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.loading-title{font-size:18px;font-weight:600;}
.loading-sub{font-size:13.5px;color:var(--text-dim);}
.progress-bar{width:100%;height:6px;background:#231a38;border-radius:4px;overflow:hidden;}
.progress-bar-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--purple-2),var(--purple-light));transition:width .4s ease;}
.progress-pct{font-size:13px;color:var(--text-dim);}

/* ---- done ---- */
.check-circle{
  width:70px;height:70px;border-radius:50%;border:2px solid var(--green);color:var(--green);
  display:flex;align-items:center;justify-content:center;box-shadow:0 0 30px rgba(61,220,132,.25);
}
.done-title{font-size:19px;font-weight:700;}
.done-sub{font-size:13.5px;color:var(--text-dim);line-height:1.5;}

@media (prefers-reduced-motion: reduce){
  .spinner-mark{animation:none;}
}