*{box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
body{margin:0;background:radial-gradient(circle at top, #0f1622 0%, #05080f 100%);color:#f3f4f6}
header{display:flex;justify-content:space-between;padding:35px 8%;align-items:center}
.logo{font-size:22px;font-weight:700;letter-spacing:-0.5px}.logo span{background:#12d9c4;padding:6px 12px;border-radius:6px;color:#000;margin-right:4px}
nav a{margin-left:25px;color:#9ca3af;text-decoration:none;font-size:15px;transition:0.2s}
nav a:hover{color:#12d9c4}
.hero{display:flex;justify-content:center;gap:100px;padding:80px 8%;align-items:center}
.text{max-width:600px}
.badge{color:#12d9c4;background:rgba(18,217,196,0.06);border:1px solid rgba(18,217,196,0.15);padding:8px 16px;border-radius:20px;display:inline-block;font-size:12px;font-weight:600;letter-spacing:1px}
h1{font-size:52px;font-weight:800;letter-spacing:-1px;line-height:1.2;margin:20px 0}.text b{color:#12d9c4}
p{color:#9ca3af;font-size:17px;line-height:1.6}
.download{display:inline-block;background:#12d9c4;color:#001;padding:18px 40px;border-radius:10px;text-decoration:none;font-weight:700;margin-top:30px;transition:0.3s;font-size:15px;letter-spacing:0.3px}
.download:hover{transform:translateY(-3px);box-shadow:0 10px 25px rgba(18,217,196,0.35)}

/* Дизайн экрана телефона */
.phone{width:290px;height:540px;background:#0b0f17;border-radius:40px;padding:12px;border:1px solid #1f293d;box-shadow:0 25px 70px rgba(0,0,0,0.7), 0 0 40px rgba(18,217,196,0.05)}
.screen{height:100%;background:#05070c;border-radius:32px;padding:18px;border:1px solid #111827;overflow:hidden}
.screen-ui{display:flex;flex-direction:column;height:100%;justify-content:space-between}
.ui-header{display:flex;align-items:center;gap:10px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,0.05)}
.ui-avatar{width:24px;height:24px;background:linear-gradient(135deg, #12d9c4, #1f6feb);border-radius:50%}
.ui-meta{display:flex;flex-direction:column;text-align:left}
.ui-title{font-size:12px;font-weight:600;color:#ffffff}
.ui-status{font-size:10px;color:#6b7280;margin-top:2px}

/* Контейнер списка кнопок */
.ui-models-list{display:flex;flex-direction:column;gap:10px;margin-top:15px;flex-grow:1}

/* Дизайн кнопок в телефоне */
.ui-model-btn{background:linear-gradient(135deg, #0e131f 0%, #0a0d14 100%);border:1px solid rgba(255,255,255,0.03);padding:12px 14px;border-radius:12px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;width:100%;text-align:left;transition:0.3s;outline:none;box-shadow:0 4px 10px rgba(0,0,0,0.2)}
.btn-left{display:flex;align-items:center;gap:12px}
.model-text{display:flex;flex-direction:column;gap:2px}

/* Цвета текстов внутри кнопок телефона */
.model-name{font-size:11px;font-weight:600;color:#ffffff !important} /* Чистый белый для контраста */
.model-desc{font-size:9px;color:#9ca3af !important} /* Мягкий серый для описания */
.btn-arrow{font-size:11px;color:#4b5563;transition:0.3s}

/* Стилизованные графические логотипы нейросетей */
.model-icon{width:20px;height:20px;border-radius:6px;flex-shrink:0}
.gpt-ico{background:linear-gradient(135deg, #74ecc8 0%, #10a37f 100%)}
.claude-ico{background:linear-gradient(135deg, #ff9a7b 0%, #d97756 100%)}
.mj-ico{background:linear-gradient(135deg, #bf7fff 0%, #7c3aed 100%)}
.sd-ico{background:linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%)}

/* Активное неоновое состояние для кнопок */
.ui-model-btn.active.gpt{border-color:#10a37f;box-shadow:0 0 15px rgba(16,163,127,0.25)}
.ui-model-btn.active.claude{border-color:#d97756;box-shadow:0 0 15px rgba(217,119,86,0.25)}
.ui-model-btn.active.mj{border-color:#7c3aed;box-shadow:0 0 15px rgba(124,58,237,0.25)}
.ui-model-btn.active.sd{border-color:#1d4ed8;box-shadow:0 0 15px rgba(29,78,216,0.25)}

.ui-model-btn.active .model-name{color:#12d9c4 !important} /* Неоновый цвет для активной модели */
.ui-model-btn.active .btn-arrow{color:#12d9c4;transform:translateX(2px)}

.ui-action-area{padding-top:15px}
.ui-ready-btn{background:#12d9c4;border:none;color:#000;text-align:center;padding:12px;border-radius:8px;font-size:12px;font-weight:700;width:100%;cursor:pointer;transition:0.2s;letter-spacing:0.2px}
.ui-ready-btn:hover{background:#0fc3af;box-shadow:0 4px 15px rgba(18,217,196,0.3)}

.features{text-align:center;padding:100px 8%;border-top:1px solid #111827}
.features h2{font-size:32px;font-weight:700}
.cards{display:flex;gap:30px;flex-wrap:wrap;justify-content:center;margin-top:50px}
.cards div{background:#070d19;border:1px solid #111827;padding:35px 30px;border-radius:14px;max-width:260px;text-align:left;transition:0.3s}
.cards div:hover{border-color:#1f293d;transform:translateY(-2px)}
.cards h3{margin:0 0 15px 0;color:#fff;font-size:18px;font-weight:600}
.cards p{font-size:14px;line-height:1.5;color:#6b7280}
.bottom,.install{max-width:850px;margin:50px auto;padding:60px 40px;text-align:center;background:#070d19;border:1px solid #111827;border-radius:16px}
.install{text-align:left;max-width:750px;padding:45px}
.install h2{margin-top:0;font-size:24px}
.install p{line-height:2;color:#9ca3af;font-size:15px}
footer{text-align:center;padding:40px;color:#4b5563;font-size:13px;border-top:1px solid #111827}
@media(max-width:850px){.hero{flex-direction:column;text-align:center;gap:50px}h1{font-size:36px}nav{display:none}}