/* ===== screen-setup.css — мастер создания ключа (3 шага) ===== */

.screen-setup { overflow:hidden; }

@keyframes screen-slide-in-left {
    from{ transform: translateX(-100%); }
    to{ transform: translateX(0); }
  }

.screen-setup.sliding-in {
    animation: screen-slide-in-left 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  }

.setup-steps-indicator {
    display:flex; justify-content:center; gap:8px;
    padding: 4px 0 2px;
  }

.step-dot {
    width:7px; height:7px; border-radius:50%;
    background: rgba(255,255,255,0.15);
    transition: background .3s ease, width .3s ease;
  }

.step-dot.active {
    background: var(--accent-neon);
    width:20px; border-radius:100px;
    box-shadow: 0 0 8px rgba(0,255,163,0.5);
  }

.step-dot.done { background: var(--accent-neon); opacity:0.5; }

.setup-scroll {
    position:relative; z-index:2;
    flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch;
    padding: clamp(10px, 2vh, 18px) clamp(20px, 6vw, 32px) clamp(28px, 5vh, 40px);
    display:flex; flex-direction:column; align-items:center;
    gap: clamp(12px, 2vh, 18px);
  }

.setup-scroll::-webkit-scrollbar { width:0; }

.setup-robot-wrap {
    position:relative;
    width: clamp(100px, 30vw, 140px); height: clamp(100px, 30vw, 140px);
    display:flex; align-items:center; justify-content:center;
    margin-bottom:2px;
    transform: translateX(-150vw); opacity:0;
  }

.screen-setup.active .setup-robot-wrap.fly-in {
    animation: robot-fly-in 1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  }

.setup-robot-inner {
    position:relative; width:100%; height:100%;
    display:flex; align-items:center; justify-content:center;
  }

.setup-robot-inner .robot-glow {
    position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
    width:150px; height:150px;
    background: radial-gradient(circle at center, rgba(124,92,252,0.4), rgba(0,255,163,0.14) 45%, transparent 72%);
    filter: blur(20px); z-index:0;
    animation: glow-pulse 3s ease-in-out infinite;
  }

@keyframes setup-robot-out {
    from{ transform: translateY(0) scale(1); opacity:1; }
    to{ transform: translateY(16px) scale(0.7); opacity:0; }
  }

@keyframes setup-robot-in {
    from{ transform: translateY(16px) scale(0.7); opacity:0; }
    to{ transform: translateY(0) scale(1); opacity:1; }
  }

.setup-robot-inner.step-out { animation: setup-robot-out 0.35s ease forwards; }

.setup-robot-inner.step-in { animation: setup-robot-in 0.5s cubic-bezier(0.16,1,0.3,1) forwards; }

.setup-step { display:none; width:100%; flex-direction:column; gap:12px; }

.setup-step.active { display:flex; }

.setup-step-title {
    font-family:'Orbitron', sans-serif; font-weight:700; font-size:17px;
    text-align:center; color: var(--text-primary);
  }

.setup-step-text {
    font-family:'Chakra Petch', sans-serif; font-size:13px; line-height:1.5;
    color: var(--text-muted); text-align:center; margin-top:-4px;
  }

.setup-platform-label {
    font-family:'Chakra Petch', sans-serif; font-weight:600; font-size:13px;
    color: var(--text-primary); margin-top:2px;
  }

.terminal-card-mini .terminal-body { padding:11px 14px 13px; font-size:11.5px; }

.terminal-card-mini .terminal-header { padding:8px 12px; }

.setup-warning {
    background: rgba(239,68,68,0.08);
    border:1px solid rgba(239,68,68,0.3);
    border-radius:14px; padding:12px 14px;
    font-family:'Chakra Petch', sans-serif; font-size:12.5px; line-height:1.45;
    color:#fca5a5;
  }

.setup-next-btn { width:100%; margin-top:4px; }

.setup-instructions { display:flex; flex-direction:column; gap:10px; width:100%; }

.setup-instr-item {
    display:flex; gap:12px; align-items:flex-start;
    background: var(--surface); border:1px solid var(--surface-border);
    border-radius:14px; padding:12px 14px;
  }

.setup-instr-num {
    flex-shrink:0; width:22px; height:22px; border-radius:50%;
    background: linear-gradient(135deg, var(--accent-1), var(--accent-neon));
    color:#0B0A16; font-family:'Orbitron', sans-serif; font-weight:800; font-size:11px;
    display:flex; align-items:center; justify-content:center;
  }

.setup-instr-text {
    font-family:'Chakra Petch', sans-serif; font-size:12.5px; line-height:1.45;
    color: var(--text-muted);
  }

.setup-instr-text strong { color: var(--text-primary); }

.key-copy-icon-btn.copied {
    border-color: var(--accent-neon); color: var(--accent-neon);
    background: rgba(0,255,163,0.06);
  }

.icon-actions { display:flex; justify-content:space-around; }

.icon-action {
    display:flex; flex-direction:column; align-items:center; gap:8px;
    background:none; border:none; cursor:pointer;
  }

.icon-action:active .icon-action-circle { transform: scale(0.93); }

.icon-action-circle {
    width:50px; height:50px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    background: linear-gradient(135deg, rgba(124,92,252,0.25), rgba(0,255,163,0.16));
    border:1px solid var(--surface-border);
    transition: transform .15s ease;
  }

.icon-action-circle svg { width:20px; height:20px; color: var(--accent-neon); }

.icon-action span:last-child {
    font-family:'Chakra Petch', sans-serif; font-weight:600; font-size:11.5px;
    color: var(--text-primary);
  }

.bonus-strip { display:flex; flex-direction:column; gap:10px; }

.bonus-chip {
    background: var(--surface);
    border:1px solid var(--surface-border);
    border-radius:16px; padding:12px 14px;
  }

.bonus-chip-icon {
    width:30px; height:30px; border-radius:9px; margin-bottom:8px;
    display:flex; align-items:center; justify-content:center;
    background: linear-gradient(135deg, rgba(124,92,252,0.22), rgba(0,255,163,0.18));
  }

.bonus-chip-icon svg { width:15px; height:15px; color: var(--accent-neon); }

.bonus-chip-title {
    font-family:'Chakra Petch', sans-serif; font-weight:700; font-size:13px; margin-bottom:2px;
  }

.bonus-chip-sub { font-size:11.5px; color: var(--text-muted); }

.tariff-segment {
    display:flex; gap:6px;
    background: rgba(255,255,255,0.03);
    border:1px solid var(--surface-border);
    border-radius:100px; padding:4px;
  }

.tariff-seg-btn {
    flex:1; border:none; background:none; cursor:pointer;
    font-family:'Share Tech Mono', monospace; font-size:11px; font-weight:700;
    color: var(--text-muted); padding:9px 4px; border-radius:100px;
    transition: background .2s ease, color .2s ease;
    white-space:nowrap;
  }

.tariff-seg-btn.selected {
    background: linear-gradient(135deg, var(--accent-1), var(--accent-2)); color:#fff;
  }

.tariff-detail-panel {
    background: var(--surface); border:1px solid var(--surface-border);
    border-radius:16px; padding:14px 16px;
  }

.tariff-detail-text { font-size:12.5px; color: var(--text-muted); line-height:1.4; }

/* платформа: скрытие неактуального блока + переключатель "показать другую" */
[data-platform].platform-hidden{ display:none; }
.setup-platform-toggle{
    width:100%; text-align:center;
    background:none; border:none; cursor:pointer;
    font-family:'Share Tech Mono', monospace; font-size:11.5px;
    color: var(--text-muted); text-decoration:underline; text-underline-offset:3px;
    margin: -4px 0 2px;
  }