/* Easy Fit - estilos customizados */
* { -webkit-tap-highlight-color: transparent; }
html { scroll-behavior: smooth; }

.glass {
  background: rgba(15, 23, 42, 0.7);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(148, 163, 184, 0.1);
}

.card-glow { box-shadow: 0 0 40px rgba(14, 165, 233, 0.08); }

.gradient-text {
  background: linear-gradient(135deg, #38bdf8, #818cf8, #c084fc);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.fade-in { animation: fadeIn .35s ease both; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

.pulse-dot { animation: pulse 1.4s infinite; }
@keyframes pulse { 0%,100% { opacity:.4 } 50% { opacity:1 } }

/* Chat markdown */
.md-content h1,.md-content h2,.md-content h3 { font-weight: 700; margin: .75rem 0 .35rem; color: #7dd3fc; }
.md-content h1 { font-size: 1.15rem } .md-content h2 { font-size: 1.05rem } .md-content h3 { font-size: 1rem }
.md-content p { margin: .4rem 0; line-height: 1.6; }
.md-content ul, .md-content ol { margin: .4rem 0 .4rem 1.25rem; }
.md-content ul { list-style: disc } .md-content ol { list-style: decimal }
.md-content li { margin: .2rem 0; line-height: 1.55; }
.md-content strong { color: #e0f2fe; }
.md-content table { width: 100%; border-collapse: collapse; margin: .6rem 0; font-size: .82rem; }
.md-content th, .md-content td { border: 1px solid rgba(148,163,184,.25); padding: .35rem .5rem; text-align: left; }
.md-content th { background: rgba(14,165,233,.12); }
.md-content code { background: rgba(148,163,184,.15); padding: .1rem .3rem; border-radius: .25rem; font-size: .85em; }
.md-content hr { border-color: rgba(148,163,184,.2); margin: .75rem 0; }

/* Scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-thumb { background: rgba(148,163,184,.3); border-radius: 3px; }

/* Bottom nav safe area */
.pb-safe { padding-bottom: calc(env(safe-area-inset-bottom) + 4.5rem); }

input, select, textarea { color-scheme: dark; }

.typing span { display:inline-block; width:6px; height:6px; border-radius:50%; background:#38bdf8; margin:0 2px; animation: bounce 1.2s infinite; }
.typing span:nth-child(2){ animation-delay:.15s } .typing span:nth-child(3){ animation-delay:.3s }
@keyframes bounce { 0%,60%,100%{transform:translateY(0)} 30%{transform:translateY(-6px)} }