:root{
  --bg:#0f172a; --panel:#111827; --muted:#94a3b8; --text:#e5e7eb;
  --chip:#1f2937; --brand:#60a5fa; --border:#334155; --accent:#3b82f6;
}

.ai-card{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:16px;margin-top:28px}
.ai-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.ai-head-left{display:flex;gap:12px;align-items:center}
.ai-bot{width:36px;height:36px;border-radius:10px;background:#0b1220;border:1px solid var(--border);display:grid;place-items:center}
.ai-bot svg{width:20px;height:20px;fill:#9cc8ff}
.ai-title{margin:0;font-size:1.1rem;color:#fff}
.ai-sub{margin:2px 0 0;color:var(--muted);font-size:.9rem}

.ai-stack{display:flex;flex-direction:column;gap:10px}
.ai-input{width:100%;background:#0b1220;border:1px solid var(--border);border-radius:10px;padding:12px 14px;color:var(--text)}
.ai-egs{display:flex;gap:8px;flex-wrap:wrap}
.ai-pill{background:#0b1220;border:1px solid var(--border);color:#c7d2fe;border-radius:999px;padding:6px 10px;font-size:.85rem}
.ai-pill:hover{background:rgba(255,255,255,.05)}
.ai-cta{background:var(--accent);border:1px solid #2563eb;color:#fff;border-radius:10px;padding:10px 12px;font-weight:600}

.ai-result{margin-top:16px;border:1px solid var(--border);border-radius:14px;padding:14px;background:#0d1324}
.ai-result-head{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.ai-brand{font-weight:700;color:#fff}
.ai-slogan{color:#7cc0ff;font-size:.9rem}

.ai-summary{margin-top:10px}
.ai-chip{background:#0b1220;border:1px solid var(--border);border-radius:10px;padding:10px}
.ai-line{margin:10px 0 4px;color:#eaf0ff;font-size:1.05rem}
.ai-badge{display:inline-block;background:#0b1220;border:1px solid #1d4ed8;color:#bfe0ff;border-radius:999px;padding:2px 8px;margin-left:6px;font-size:.8rem}
.ai-bullets{margin:6px 0 0 18px;color:#dbe7ff}

.ai-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}
.ai-grid>div{background:#0b1220;border:1px solid var(--border);border-radius:10px;padding:10px}
.ai-grid span{color:var(--muted);display:block;font-size:.86rem;margin-bottom:4px}
.ai-grid b{color:#fff}

.ai-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.ai-primary{background:#1d4ed8;border:1px solid #2563eb;color:#fff;border-radius:10px;padding:8px 12px;font-weight:600}
.ai-secondary{display:inline-block;background:#0b1220;border:1px solid var(--border);color:#e5e7eb;border-radius:10px;padding:8px 12px;text-decoration:none}

.ai-note{color:#9fb8e7;opacity:.8;margin:10px 0 0;font-size:.85rem}

@media (max-width: 768px){
  .ai-grid{grid-template-columns:1fr 1fr}
}
@media (max-width: 480px){
  .ai-grid{grid-template-columns:1fr}
}

#aiPlanBtn {
  background: linear-gradient(135deg, #1f6feb, #006aff);
  color: #ffffff;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.12);
  padding: 12px 18px;
  box-shadow: 0 6px 22px rgba(0, 112, 255, 0.35);
  transition: all 0.25s ease;
}

#aiPlanBtn:hover {
  background: linear-gradient(135deg, #268cff, #0056e0);
  box-shadow: 0 10px 32px rgba(0, 112, 255, 0.55);
  transform: translateY(-1px);
}