:root{--bg1:#eef8ff;--bg2:#f8fff1;--primary:#0d6efd;--dark:#1f2937}body{min-height:100vh;background:radial-gradient(circle at 10% 15%,rgba(13,110,253,.18),transparent 28%),radial-gradient(circle at 90% 10%,rgba(25,135,84,.18),transparent 30%),linear-gradient(135deg,var(--bg1),var(--bg2));color:var(--dark)}.hero-card{border:0;border-radius:28px;overflow:hidden;box-shadow:0 20px 55px rgba(0,0,0,.12);background:rgba(255,255,255,.92);backdrop-filter:blur(8px)}.hero-header{background:linear-gradient(135deg,#0d6efd,#20c997);color:#fff;padding:28px;position:relative;overflow:hidden}.hero-header::after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.14);right:-80px;top:-70px}.formula-input{font-size:1.45rem;font-weight:700;text-align:center;border-radius:18px;padding:18px 12px;border:2px solid #d8e5ff;background:#fff}.formula-input:focus{border-color:#0d6efd;box-shadow:0 0 0 .25rem rgba(13,110,253,.14)}.operator{font-size:2.1rem;font-weight:900;color:#0d6efd;line-height:1;display:flex;align-items:center;justify-content:center;min-height:66px}.arrow{font-size:2.35rem;color:#198754}.pill{border-radius:999px;padding:8px 14px;font-weight:700;display:inline-flex;gap:8px;align-items:center}.reaction-box{border:2px dashed #c7d7ee;border-radius:22px;background:#fbfdff;padding:18px;min-height:88px}.equation{font-size:1.55rem;font-weight:800;word-break:break-word}.result-card{border:0;border-radius:22px;box-shadow:0 12px 30px rgba(0,0,0,.08)}.mini-card{border:1px solid #e6eef8;border-radius:18px;background:#fff;padding:16px;height:100%}.badge-soft{background:#eef6ff;color:#0d6efd;border:1px solid #d7e9ff}.voice-panel{border:1px solid #dfefff;border-radius:18px;background:linear-gradient(135deg,#f8fbff,#f2fff9);padding:14px}.voice-status{font-size:.92rem;color:#6b7280}.list-formula code{color:#0b5ed7;background:#eef6ff;border-radius:8px;padding:3px 6px;margin:2px;display:inline-block}.shake{animation:shake .28s linear 1}@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}.subtle{color:#6b7280}.toast-container{z-index:1080}@media(max-width:768px){.equation{font-size:1.18rem}.operator{font-size:1.8rem;min-height:42px}.arrow{font-size:2rem}.formula-input{font-size:1.18rem}}