:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--primary:#3a684c;--on-primary:#fff;--primary-container:#72a182;--primary-fixed:#bceecb;--secondary-container:#c3ecd7;--on-secondary-container:#476c5b;--tertiary-fixed:#d9e6dd;--background:#f8f9ff;--on-background:#121c2a;--surface:#f8f9ff;--surface-variant:#d9e3f6;--on-surface:#121c2a;--on-surface-variant:#414942;--surface-container-lowest:#fff;--surface-container-low:#eff4ff;--surface-container:#e6eeff;--surface-container-high:#dee9fc;--surface-container-highest:#d9e3f6;--surface-container-low-alpha:#eff4ffd9;--outline:#717972;--outline-variant:#c1c9c0;--error:#ba1a1a;--error-container:#ffdad6;--on-error-container:#93000a;--success-bg:#c3ecd7;--success-border:#72a182;--success-text:#224f36;--shadow-sm:0 1px 3px #121c2a0f;--shadow-md:0 4px 12px #121c2a14, 0 1px 3px #121c2a0a;--shadow-lg:0 8px 20px #121c2a1a, 0 2px 6px #121c2a0f;--r-sm:.125rem;--r-md:.25rem;--r-lg:.5rem;--r-xl:.75rem;--r-full:9999px;--font-headline:"Manrope", system-ui, sans-serif;--font-body:"Source Sans 3", system-ui, sans-serif;--stack-sm:.5rem;--stack-md:1rem;--stack-lg:2rem;--stack-xl:3rem;--margin-mobile:1.25rem;--container-max:480px;--ease-out:cubic-bezier(.16, 1, .3, 1)}@media (width>=768px){:root{--container-max:640px;--margin-mobile:2.5rem;--stack-lg:2.5rem;--stack-xl:4rem}}@media (width>=1024px){:root{--container-max:960px;--margin-mobile:2.5rem;--stack-lg:1.5rem;--stack-xl:3rem}}[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--primary:#a1d2b0;--on-primary:#003920;--primary-container:#224f36;--primary-fixed:#1a3a28;--background:#0f1420;--on-background:#dde4f0;--surface:#0f1420;--surface-variant:#1e2a3a;--on-surface:#dde4f0;--on-surface-variant:#9aabb8;--surface-container-lowest:#0a0f1a;--surface-container-low:#141e2e;--surface-container:#1a2535;--surface-container-high:#1f2d40;--surface-container-highest:#263548;--surface-container-low-alpha:#141e2ed9;--outline:#5a6e7a;--outline-variant:#2a3a48;--error:#ffb4ab;--error-container:#4a1010;--on-error-container:#ffb4ab;--success-bg:#0f2a1e;--success-border:#2a6048;--success-text:#a1d2b0;--secondary-container:#0f2a1e;--on-secondary-container:#a8cfbc;--shadow-sm:0 1px 3px #0000004d;--shadow-md:0 4px 12px #00000059, 0 1px 3px #0003;--shadow-lg:0 8px 20px #0006, 0 2px 6px #00000040}*,:before,:after{box-sizing:border-box;margin:0;padding:0}:not(img):not(svg):not(canvas){transition:background-color .25s var(--ease-out), border-color .25s var(--ease-out), color .15s var(--ease-out), box-shadow .25s var(--ease-out)}html{-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;font-size:16px}body{font-family:var(--font-body);background-color:var(--background);color:var(--on-surface);min-height:100dvh;line-height:1.6;overflow-x:hidden}#root{flex-direction:column;min-height:100dvh;display:flex}.app-wrapper{background-color:var(--background);flex-direction:column;align-items:center;min-height:100dvh;display:flex}.container{width:100%;max-width:var(--container-max);padding:var(--stack-sm) var(--margin-mobile) var(--stack-lg);gap:var(--stack-md);flex-direction:column;flex:1;display:flex}.label-sm{font-family:var(--font-headline);letter-spacing:.04em;text-transform:uppercase;font-size:12px;font-weight:500;line-height:16px}.label-lg{font-family:var(--font-headline);letter-spacing:.02em;font-size:14px;font-weight:600;line-height:20px}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--surface-container-low)}::-webkit-scrollbar-thumb{background:var(--outline-variant);border-radius:3px}@keyframes fade-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-up{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}.card{background:var(--surface-container);border-radius:var(--r-xl);padding:var(--stack-lg);box-shadow:var(--shadow-sm)}.card-sm{padding:var(--stack-md);border-radius:var(--r-lg)}.card-surface{background:var(--surface-container-lowest)}.card-variant{background:var(--surface-variant)}.card-high{background:var(--surface-container-high)}.game-header{z-index:100;background:var(--surface-container-low-alpha);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--outline-variant);padding:.5rem var(--margin-mobile);width:100%;max-width:var(--container-max);justify-content:space-between;align-self:center;align-items:center;display:flex;position:sticky;top:0}.app-header{width:100%;max-width:var(--container-max);padding:var(--stack-sm) var(--margin-mobile) 0;justify-content:space-between;align-items:center;display:flex}.header-brand{font-family:var(--font-headline);letter-spacing:-.01em;color:var(--primary);font-size:24px;font-weight:600;line-height:32px}.header-streak{font-family:var(--font-headline);letter-spacing:.04em;text-transform:uppercase;color:var(--primary);align-items:center;gap:.25rem;font-size:12px;font-weight:500;display:flex}.game-header{width:100%;max-width:var(--container-max);padding:var(--stack-md) var(--margin-mobile);background:var(--surface-container-low-alpha);-webkit-backdrop-filter:blur(12px);z-index:50;justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.game-close-btn{border-radius:var(--r-full);width:40px;height:40px;color:var(--on-surface-variant);cursor:pointer;font-variation-settings:"FILL" 0;background:#d9e3f680;border:none;justify-content:center;align-items:center;font-family:Material Symbols Outlined;font-size:20px;transition:background .2s,color .2s;display:flex}.game-close-btn:hover{background:var(--surface-container-high);color:var(--on-surface)}.progress-segments{margin:0 var(--stack-md);flex:1;align-items:center;gap:4px;display:flex}.progress-seg{border-radius:var(--r-full);background:var(--surface-variant);height:4px;transition:background .3s var(--ease-out);flex:1}.progress-seg.filled{background:var(--primary);box-shadow:0 0 8px #3a684c40}.streak-chip{color:var(--primary);font-family:var(--font-headline);letter-spacing:.04em;text-transform:uppercase;align-items:center;gap:2px;font-size:12px;font-weight:500;display:flex}.btn{border-radius:var(--r-lg);font-family:var(--font-headline);letter-spacing:.02em;cursor:pointer;transition:all .18s var(--ease-out);-webkit-user-select:none;user-select:none;border:none;justify-content:center;align-items:center;gap:.5rem;padding:1rem 1.5rem;font-size:14px;font-weight:600;line-height:1;display:inline-flex}.btn-primary{background:var(--primary);color:var(--on-primary)}.btn-primary:hover:not(:disabled){background:#2f5540}.btn-primary:active:not(:disabled){transform:scale(.98)}.btn-secondary{color:var(--primary);border:1.5px solid var(--primary);background:0 0}.btn-secondary:hover:not(:disabled){background:var(--surface-container)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-full{width:100%}.btn-lg{padding:1.1rem 1.5rem;font-size:14px}.btn-ghost{color:var(--on-surface-variant);font-family:var(--font-headline);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;border-radius:var(--r-md);background:0 0;border:none;align-items:center;gap:6px;padding:.5rem;font-size:12px;font-weight:500;transition:color .18s;display:inline-flex}.btn-ghost:hover{color:var(--primary)}.status-card{background:var(--surface-container-high);border-radius:var(--r-lg);width:100%;padding:var(--stack-md);align-items:center;gap:var(--stack-md);display:flex}.stats-grid{gap:var(--stack-md);grid-template-columns:1fr 1fr;display:grid}.stat-card{background:var(--surface-container);border-radius:var(--r-xl);padding:var(--stack-md);text-align:center;transition:transform .2s var(--ease-out), background .2s;flex-direction:column;align-items:center;display:flex}.stat-card:hover{background:var(--surface-container-high);transform:translateY(-4px)}.stat-card.accent{border-top:3px solid var(--primary)}.stat-value{font-family:var(--font-headline);color:var(--primary);margin-bottom:2px;font-size:28px;font-weight:700;line-height:36px}.molecule-frame{aspect-ratio:1;background:var(--surface-container);border-radius:var(--r-xl);width:100%;box-shadow:var(--shadow-sm);border:1px solid #c1c9c066;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}@media (width>=1024px){.molecule-frame{max-height:420px}}.molecule-frame-overlay{pointer-events:none;background:linear-gradient(135deg,#3a684c0a 0%,#0000 50%,#55615a0a 100%);position:absolute;inset:0}.molecule-img{object-fit:contain;width:85%;height:85%;transition:transform .5s var(--ease-out)}[data-theme=dark] .molecule-img{filter:brightness(.92)contrast(1.05)}.molecule-frame:hover .molecule-img{transform:scale(1.04)}.formula-badge{bottom:var(--stack-sm);left:var(--stack-sm);background:var(--primary);color:var(--on-primary);border-radius:var(--r-md);font-family:var(--font-headline);letter-spacing:.02em;box-shadow:var(--shadow-md);z-index:10;border:none;padding:4px 10px;font-size:13px;font-weight:700;position:absolute}.option-btn{text-align:left;width:100%;padding:var(--stack-md) 1.25rem;border-radius:var(--r-lg);background:var(--surface-container-lowest);color:var(--on-surface);font-family:var(--font-body);cursor:pointer;transition:all .18s var(--ease-out);border:1px solid #c1c9c080;justify-content:space-between;align-items:center;gap:.75rem;font-size:18px;font-weight:400;line-height:28px;display:flex}.option-btn .chevron{color:var(--outline-variant);opacity:0;transition:all .18s var(--ease-out);font-family:Material Symbols Outlined;font-size:20px;transform:translate(6px)}.option-btn:hover:not(:disabled){background:var(--surface-container-high);color:var(--primary);border-color:#3a684c66}.option-btn:hover:not(:disabled) .chevron{opacity:1;color:var(--primary);transform:translate(0)}.option-btn:focus:not(:disabled){outline:2px solid var(--primary);outline-offset:2px}.option-btn.correct{background:var(--success-bg);border-color:var(--success-border);color:var(--success-text)}.option-btn.wrong{background:var(--error-container);color:var(--on-error-container);border-color:#ba1a1a66}.option-btn:disabled{cursor:default}.option-icon{border-radius:var(--r-full);border:1.5px solid;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;font-size:14px;font-weight:700;display:flex}.fact-card{background:var(--surface-container-low);border-radius:var(--r-xl);padding:var(--stack-md) 1.25rem;animation:slide-up .28s var(--ease-out) both}.fact-meta{margin-bottom:var(--stack-md);grid-template-columns:1fr 1fr;gap:.5rem;display:grid}.fact-meta-item{background:var(--surface-container-lowest);border:1px solid var(--outline-variant);border-radius:var(--r-lg);padding:.6rem .8rem}.fact-meta-item .fact-label{font-family:var(--font-headline);letter-spacing:.04em;text-transform:uppercase;color:var(--on-surface-variant);margin-bottom:2px;font-size:11px;font-weight:500;display:block}.fact-meta-item .fact-value{font-family:var(--font-headline);color:var(--on-surface);word-break:break-word;font-size:15px;font-weight:600}.iupac-item{grid-column:1/-1}.fact-quote{border-left:3px solid var(--primary);color:var(--on-surface-variant);padding-left:.875rem;font-size:14px;font-style:italic;font-weight:400;line-height:1.6}.badge{border-radius:var(--r-full);font-family:var(--font-headline);letter-spacing:.04em;text-transform:uppercase;align-items:center;gap:4px;padding:3px 10px;font-size:12px;font-weight:500;display:inline-flex}.badge-primary{background:var(--primary-fixed);color:var(--primary)}.badge-success{background:var(--success-bg);border:1px solid var(--success-border);color:var(--success-text)}.badge-error{background:var(--error-container);color:var(--on-error-container);border:1px solid #ba1a1a4d}.score-display{align-items:baseline;gap:3px;display:flex}.score-value{font-family:var(--font-headline);color:var(--primary);font-size:20px;font-weight:700}.score-label{font-family:var(--font-headline);letter-spacing:.04em;text-transform:uppercase;color:var(--on-surface-variant);font-size:12px;font-weight:500}.info-card{background:var(--surface-variant);border-radius:var(--r-xl);padding:var(--stack-md);gap:var(--stack-sm);flex-direction:column;display:flex}.info-card-header{align-items:center;gap:6px;display:flex}.summary-answer-tile{font-size:20px}@media (width>=768px){.summary-answer-tile{border-width:2px;font-size:28px}}.responsive-grid{gap:var(--stack-md);grid-template-columns:1fr;display:grid}@media (width>=1024px){.responsive-grid{gap:var(--stack-lg);grid-template-columns:1.4fr 1fr;align-items:start}.sticky-desktop{top:var(--stack-md);position:sticky}.hide-on-desktop{display:none!important}.show-on-desktop{display:block!important}}.show-on-desktop{display:none}.main-footer{width:100%;padding:var(--stack-xl) var(--margin-mobile);margin-top:var(--stack-xl);border-top:1px solid var(--outline-variant);background:var(--surface-container-low);text-align:center}.footer-content{max-width:var(--container-max);gap:var(--stack-md);flex-direction:column;margin:0 auto;display:flex}.footer-links{flex-wrap:wrap;justify-content:center;gap:1.5rem;display:flex}.footer-links a{font-family:var(--font-headline);color:var(--on-surface-variant);font-size:13px;font-weight:600;text-decoration:none;transition:color .18s}.footer-links a:hover{color:var(--primary)}.footer-credit{font-family:var(--font-body);color:var(--on-surface);font-size:14px}.footer-credit a{color:var(--primary);font-weight:700;text-decoration:none}.footer-credit .heart{animation:1.5s infinite heartbeat;display:inline-block}@keyframes heartbeat{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}.footer-copyright{font-family:var(--font-body);color:var(--on-surface-variant);opacity:.6;font-size:12px}.loading-wrap{justify-content:center;align-items:center;gap:var(--stack-md);flex-direction:column;height:60vh;display:flex}.loading-icon{color:var(--primary);font-variation-settings:"FILL" 1;font-family:Material Symbols Outlined;font-size:48px;animation:2s linear infinite spin}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;padding:var(--margin-mobile);animation:fade-in .25s var(--ease-out);background:#121c2a66;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-container{background:var(--surface-container-lowest);border-radius:var(--r-xl);width:100%;max-width:500px;box-shadow:var(--shadow-lg);animation:slide-up .3s var(--ease-out);flex-direction:column;display:flex;overflow:hidden}.modal-header{padding:var(--stack-md) var(--stack-lg);border-bottom:1px solid var(--outline-variant);justify-content:space-between;align-items:center;display:flex}.modal-close{color:var(--on-surface-variant);cursor:pointer;border-radius:var(--r-full);background:0 0;border:none;padding:4px;display:flex}.modal-close:hover{background:var(--surface-container)}.modal-body{padding:var(--stack-lg);text-align:left;max-height:70vh;overflow-y:auto}.modal-body-content h3{font-family:var(--font-headline);margin-bottom:var(--stack-md);color:var(--primary);text-align:left;font-size:20px}.modal-body-content p{font-family:var(--font-body);color:var(--on-surface);margin-bottom:var(--stack-md);text-align:left;font-size:15px;line-height:1.6}.modal-body-content ul{margin-bottom:var(--stack-md);padding-left:1.1rem;list-style-type:none}.modal-body-content li{font-family:var(--font-body);color:var(--on-surface-variant);margin-bottom:.75rem;font-size:14.5px;line-height:1.6;position:relative}.modal-body-content li:before{content:"•";color:var(--primary);font-weight:700;position:absolute;left:-1.1rem}.modal-footer-btn{padding:var(--stack-md) var(--stack-lg);border-top:1px solid var(--outline-variant)}