*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root,main{color:#111827!important;background-color:#f8fafc!important}input,select,textarea,.chem-input{color:#111827!important;opacity:1!important;background:#fff!important;border:2px solid #326fa0!important}:root{--chem-primary:#235478;--chem-primary-hover:#163650;--chem-secondary:#e5e7eb;--chem-secondary-hover:#d1d5db;--chem-text-main:#111827;--chem-text-muted:#4b5563;--chem-bg-main:#fff;--chem-bg-box:#f9fafb;--chem-border:#d1d5db;--chem-success-bg:#f0fdf4;--chem-success-text:#166534;--chem-success-border:#bbf7d0;--chem-error-bg:#fef2f2;--chem-error-text:#991b1b;--chem-error-border:#fecaca;--font-main:"Inter", system-ui, sans-serif;--font-mono:ui-monospace, "Courier New", monospace;--chem-logo-lightblue:#6da5c0;--chem-logo-darkblue:#2d6388}.applet-container{background-color:var(--chem-bg-main);border:1px solid var(--chem-border);max-width:42rem;font-family:var(--font-main);color:var(--chem-text-main);border-radius:.5rem;margin:1.5rem auto;padding:2rem;box-shadow:0 1px 2px #0000000d}.applet-header{text-align:center;border-bottom:1px solid var(--chem-border);margin-bottom:2rem;padding-bottom:1rem;font-size:1.5rem;font-weight:700}.applet-layout{flex-direction:column;align-items:center;gap:1.5rem;margin-bottom:2rem;display:flex}@media (width>=768px){.applet-layout{flex-direction:row}}.data-box{background-color:var(--chem-bg-box);border:1px solid var(--chem-border);font-family:var(--font-mono);border-radius:.25rem;margin:.5rem 0 1rem;padding:1rem;font-size:.875rem;line-height:1.5rem;list-style:none}.question-text{margin-bottom:2rem;line-height:1.6}.input-group{flex-wrap:wrap;justify-content:center;align-items:center;gap:.75rem;margin-bottom:1.5rem;display:flex}.chem-input{border:1px solid var(--chem-border);width:100%;min-width:8rem;max-width:12rem;font-size:1.1rem;font-family:var(--font-mono);text-align:center;border-radius:.25rem;outline:none;padding:.75rem;transition:all .2s}.chem-input:focus{border-color:var(--chem-primary);box-shadow:0 0 0 2px var(--chem-secondary)}.chem-input.error{border-color:var(--chem-error-text)}.chem-input.success{border-color:var(--chem-success-text)}.button-group{flex-direction:column;gap:.75rem;display:flex}@media (width>=640px){.button-group{flex-direction:row}}.btn{cursor:pointer;border:none;border-radius:.25rem;flex:1;padding:.75rem 1rem;font-size:1rem;font-weight:600;transition:background-color .2s}.btn-primary{background-color:var(--chem-primary);color:#fff}.btn-primary:hover{background-color:var(--chem-primary-hover)}.btn-secondary{background-color:var(--chem-secondary);color:var(--chem-text-main);border:1px solid var(--chem-border)}.btn-secondary:hover{background-color:var(--chem-secondary-hover)}.feedback-box{text-align:center;border-radius:.25rem;margin-top:1.5rem;padding:1rem;font-weight:500}.feedback-success{background-color:var(--chem-success-bg);color:var(--chem-success-text);border:1px solid var(--chem-success-border)}.feedback-error{background-color:var(--chem-error-bg);color:var(--chem-error-text);border:1px solid var(--chem-error-border)}.modal-overlay{z-index:50;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background-color:#111827bf;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.modal-content{background-color:var(--chem-bg-main);border-radius:.5rem;width:100%;max-width:24rem;padding:2rem;position:relative;box-shadow:0 20px 25px -5px #0000001a}.modal-close{background:var(--chem-error-bg);color:var(--chem-error-text);border:1px solid var(--chem-error-border);cursor:pointer;border-radius:.25rem;width:2rem;height:2rem;font-weight:700;position:absolute;top:1rem;right:1rem}@media (width<=480px){.input-group{flex-direction:column}.chem-input{max-width:100%}}.chem-choice-section{text-align:center;width:100%;max-width:24rem;margin:.75rem auto}.chem-choice-label{text-transform:uppercase;letter-spacing:.1em;color:#94a3b8;margin-bottom:.5rem;font-size:10px;font-weight:900;display:block}.chem-choice-group{flex-direction:column;gap:.5rem;width:100%;padding:0 1rem;display:flex}.chem-choice-btn{color:#475569;cursor:pointer;background-color:#fff;border:1px solid #e2e8f0;border-radius:.75rem;width:100%;padding:.65rem 1rem;font-size:.85rem;font-weight:700;transition:all .15s ease-in-out}.chem-choice-btn:hover{color:#1e293b;background-color:#f8fafc}.chem-choice-btn.active{color:#326fa0;background-color:#f0f7ff;border-color:#326fa0;transform:scale(1.01);box-shadow:0 1px 2px #0000000d}
