:root {
  --text: #081225;
  --muted: #4b5b73;
  --primary: #165dff;
  --primary-2: #2f7cff;
  --primary-3: #0e49cc;
  --soft-blue: rgba(22, 93, 255, 0.08);
  --shadow-strong: 0 24px 70px rgba(22, 93, 255, 0.22);
  --radius-xl: 28px;
  --radius-md: 16px;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0; min-height: 100vh; font-family: Inter, system-ui, sans-serif; color: var(--text);
  background: radial-gradient(circle at top center, rgba(81, 152, 77) 0%, rgba(81, 152, 77) 44%, #e4eeff 100%);
}
button, textarea { font: inherit; }
a { color: var(--primary); }
.app-shell { position: relative; min-height: 100vh; overflow: hidden; }
.page { position: relative; z-index: 2; width: min(980px, calc(100% - 32px)); margin: 0 auto; padding: 52px 0 calc(40px + env(safe-area-inset-bottom)); }
.bg-orb { position:absolute; border-radius:999px; filter:blur(75px); opacity:.42; pointer-events:none; }
.bg-orb-1 { width:360px; height:360px; top:-90px; left:-110px; background:#77a7ff; }
.bg-orb-2 { width:420px; height:420px; right:-150px; bottom:-110px; background:#bfd5ff; }
.hero { text-align:center; margin-bottom:28px; }
.hero-icon { width:68px; height:68px; margin:0 auto 18px; display:grid; place-items:center; border-radius:50%; color:#fff; background:linear-gradient(135deg,var(--primary),var(--primary-2)); box-shadow:0 16px 32px rgba(22,93,255,.28); }
.hero-icon svg { width:32px; height:32px; }
.hero h1 { margin:0; font-size:clamp(2.1rem,4vw,3.5rem); line-height:1.03; font-weight:800; letter-spacing:-.03em; }
.hero-subtitle { width:min(720px,100%); margin:14px auto 26px; font-size:clamp(1rem,2vw,1.14rem); line-height:1.65; color:#ffffff; }
.welcome-card, .answer-card {
  width:min(760px,100%); margin:0 auto; padding:28px; text-align:left; border-radius:var(--radius-xl);
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.9));
  border:1px solid rgba(255,255,255,.92); box-shadow:var(--shadow-strong);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
}
.answer-card { width:min(880px,100%); }
.welcome-eyebrow, .eyebrow { display:inline-flex; margin-bottom:14px; padding:8px 12px; border-radius:999px; background:var(--soft-blue); color:var(--primary-3); font-size:.8rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.welcome-content { color:#21324a; line-height:1.75; font-size:1.02rem; }
.welcome-content p { margin:0 0 14px; }
.welcome-actions { margin-top:22px; display:flex; justify-content:flex-start; }
.primary-cta { min-width:120px; height:50px; border:0; border-radius:999px; padding:0 24px; color:#fff; font-weight:800; background:linear-gradient(135deg,var(--primary),var(--primary-2)); box-shadow:0 14px 28px rgba(22,93,255,.28); }
.search-wrap { width:min(760px,100%); margin:0 auto; text-align:left; opacity:1; transform:translateY(0); transition:opacity .28s ease, transform .28s ease; }
.search-wrap.is-hidden, .is-hidden { display:none !important; }
.search-wrap.is-entering { display:block !important; opacity:0; transform:translateY(12px); }
.search-label { display:block; margin:0 0 10px 6px; font-size:.95rem; font-weight:700; color:#081225; }
.search-box { display:flex; align-items:center; gap:12px; padding:12px 12px 12px 18px; border-radius:24px; background:#fff; border:1px solid rgba(22,93,255,.18); box-shadow:0 16px 40px rgba(22,93,255,.12), 0 0 0 1px rgba(255,255,255,.75) inset; }
.search-box:focus-within { border-color:rgba(22,93,255,.42); box-shadow:0 18px 48px rgba(22,93,255,.16), 0 0 0 5px rgba(22,93,255,.11); }
.search-box textarea { flex:1; border:0; outline:0; background:transparent; resize:none; min-height:30px; max-height:180px; line-height:1.55; color:var(--text); padding:6px 0; font-size:1rem; font-weight:500; }
.search-box textarea::placeholder { color:#68809f; }
.search-btn { width:52px; height:52px; border:0; border-radius:50%; display:grid; place-items:center; color:#fff; background:linear-gradient(135deg,var(--primary),var(--primary-2)); box-shadow:0 12px 22px rgba(22,93,255,.28); }
.search-btn:disabled, .ghost-btn:disabled { opacity:.5; cursor:not-allowed; transform:none; box-shadow:none; }
.search-btn svg { width:22px; height:22px; }
.turnstile-wrap { margin-top:14px; display:flex; justify-content:flex-start; }
.turnstile-wrap > div { min-height:65px; }
.turnstile-missing { padding:12px 14px; border-radius:14px; background:rgba(254,242,242,.96); color:#991b1b; border:1px solid rgba(220,38,38,.14); }
.search-helper { margin-top:10px; padding-left:8px; font-size:.93rem; color:#ffffff; }
.search-meta { display:flex; justify-content:space-between; gap:12px; margin-top:10px; padding:0 8px; font-size:.92rem; color:#ffffff; }
.quick-actions { width:min(780px,100%); margin:18px auto 0; display:flex; justify-content:center; gap:10px; flex-wrap:wrap; }
.chip, .ghost-btn { border:1px solid rgba(22,93,255,.16); background:rgba(255,255,255,.86); color:#163456; border-radius:999px; padding:10px 15px; font-weight:600; box-shadow:0 8px 20px rgba(22,93,255,.06); }
.result-section { margin-top:30px; }
.answer-head { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; margin-bottom:18px; }
.answer-head h2 { margin:0; font-size:clamp(1.25rem,2vw,1.7rem); line-height:1.2; }
.answer-actions { display:flex; gap:10px; flex-wrap:wrap; }
.question-summary { margin-bottom:18px; padding:16px 18px; border:1px solid rgba(22,93,255,.12); border-radius:var(--radius-md); background:rgba(22,93,255,.05); color:#1f3b5f; line-height:1.55; }
.loading-state { display:flex; align-items:center; gap:12px; padding:18px; margin-bottom:18px; border-radius:var(--radius-md); border:1px solid rgba(22,93,255,.14); background:rgba(255,255,255,.8); }
.loader { width:22px; height:22px; border-radius:50%; border:3px solid rgba(22,93,255,.16); border-top-color:var(--primary); animation:spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.error-box { margin-bottom:18px; padding:16px 18px; border-radius:var(--radius-md); border:1px solid rgba(220,38,38,.14); background:rgba(254,242,242,.96); color:#991b1b; line-height:1.6; }
.answer-content { color:#16263d; line-height:1.78; font-size:1rem; word-break:break-word; }
.answer-content p,.answer-content ul,.answer-content ol,.answer-content blockquote { margin:0 0 16px; }
.answer-content a { color:var(--primary); text-decoration:underline; text-underline-offset:3px; word-break:break-all; font-weight:700; }
.answer-card.is-pulsing { animation:answerPulseStrong 1.05s ease-in-out infinite; will-change:box-shadow, transform, opacity; }
@keyframes answerPulseStrong { 0% { transform: translateY(0) scale(1); box-shadow:0 24px 70px rgba(22,93,255,.18), 0 0 0 0 rgba(22,93,255,0);} 50% { transform:translateY(-2px) scale(1.006); box-shadow:0 30px 84px rgba(22,93,255,.28), 0 0 0 8px rgba(22,93,255,.09);} 100% { transform:translateY(0) scale(1); box-shadow:0 24px 70px rgba(22,93,255,.18), 0 0 0 0 rgba(22,93,255,0);} }
@media (max-width:768px){ .page{width:min(100% - 20px,100%);padding-top:28px}.welcome-card,.answer-card{padding:20px;border-radius:22px}.search-box{padding:10px 10px 10px 14px;border-radius:20px}.search-btn{width:48px;height:48px}.search-meta{flex-direction:column;align-items:flex-start}.answer-head{flex-direction:column;align-items:stretch}.answer-actions{width:100%}.ghost-btn{flex:1 1 auto}.answer-card.is-pulsing{animation:answerPulseStrongMobile .95s ease-in-out infinite}@keyframes answerPulseStrongMobile{0%{transform:translateY(0) scale(1);box-shadow:0 18px 48px rgba(22,93,255,.2),0 0 0 0 rgba(22,93,255,0)}50%{transform:translateY(-2px) scale(1.01);box-shadow:0 24px 62px rgba(22,93,255,.32),0 0 0 10px rgba(22,93,255,.12)}100%{transform:translateY(0) scale(1);box-shadow:0 18px 48px rgba(22,93,255,.2),0 0 0 0 rgba(22,93,255,0)}} }
@media (max-width:480px){ .hero-subtitle{margin-bottom:22px}.primary-cta{width:100%}.chip{width:100%;justify-content:center}.quick-actions{gap:8px}.turnstile-wrap{justify-content:center} }
button,
.chip,
.primary-cta,
.search-btn,
.ghost-btn {
  cursor: pointer;
}

button:disabled,
.search-btn:disabled,
.ghost-btn:disabled {
  cursor: not-allowed;
}

a {
  cursor: pointer;
}
