:root{--accent:#4f46e5;--accent-dark:#4338ca;--accent-light:#eef0ff;--success:#16a34a;--success-light:#ecfdf3;--success-border:#86efac;--error:#dc2626;--error-light:#fef2f2;--warn:#b45309;--warn-light:#fffbeb;--ink:#1f2430;--ink-soft:#5b6270;--line:#e4e6ec;--surface:#fbfbfd;--shadow-sm:0 1px 2px #1414280d;--shadow-md:0 6px 20px #1f243014}[hidden]{display:none!important}.tool{width:min(100%, var(--content-width));padding:var(--space-lg) 0;color:var(--ink);margin-inline:auto}.tool-header{margin-bottom:var(--space-lg)}.tool-header h1{letter-spacing:-.01em;margin:0 0 .4rem;font-size:clamp(1.6rem,4vw,2.1rem)}.tool-header p{color:var(--ink-soft);margin:0}code{background:var(--accent-light);color:var(--accent-dark);border-radius:5px;padding:.12em .4em;font-size:.88em}.mode-tabs,.difficulty-tabs{border-radius:calc(var(--radius) + 4px);background:#f1f2f6;flex-wrap:wrap;gap:.4rem;width:fit-content;margin-bottom:1.1rem;padding:.3rem;display:flex}.mode-tab,.difficulty-tab{font:inherit;border-radius:var(--radius);color:var(--ink-soft);cursor:pointer;background:0 0;border:none;padding:.5rem 1.1rem;font-size:.88rem;font-weight:600;transition:background .18s,color .18s,box-shadow .18s}.mode-tab:hover,.difficulty-tab:hover{color:var(--ink)}.mode-tab.active,.difficulty-tab.active{color:var(--accent-dark);box-shadow:var(--shadow-sm);background:#fff}.practice-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1.4rem;display:flex}.reaction-type-tag{background:var(--accent-light);color:var(--accent-dark);border-radius:999px;align-items:center;gap:.35rem;padding:.35rem .85rem;font-size:.8rem;font-weight:600;display:inline-flex}.reaction-type-tag:before{content:"⚙";font-size:.85em}.custom-panel{margin-bottom:1.6rem}.custom-panel label{color:var(--ink-soft);margin-bottom:.6rem;font-size:.88rem;display:block}.custom-input-row{flex-wrap:wrap;gap:.6rem;display:flex}.custom-input-row input{font:inherit;border:1.5px solid var(--line);border-radius:var(--radius);background:var(--surface);flex:260px;padding:.75rem 1rem;font-size:1rem;transition:border-color .15s,box-shadow .15s}.custom-input-row input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light);outline:none}.custom-error{border-radius:var(--radius);background:var(--error-light);color:var(--error);margin-top:.7rem;padding:.7rem .9rem;font-size:.9rem}.workspace{border-top:1px solid var(--line);padding-top:var(--space-lg)}.equation-row{border:1.5px solid var(--line);border-radius:calc(var(--radius) + 4px);background:linear-gradient(180deg, #fff, var(--surface));box-shadow:var(--shadow-sm);flex-wrap:wrap;justify-content:center;align-items:center;gap:.6rem .9rem;margin-bottom:1.25rem;padding:1.75rem 1.5rem;font-size:1.3rem;transition:border-color .25s,box-shadow .25s;display:flex}.equation-row.workspace-balanced{border-color:var(--success-border);box-shadow:0 0 0 4px var(--success-light)}@keyframes balancePulse{0%{transform:scale(1)}35%{transform:scale(1.025)}to{transform:scale(1)}}.equation-row.just-balanced{animation:.5s balancePulse}.species-chip{align-items:center;gap:.5rem;display:inline-flex}.coeff-input{text-align:center;width:2.6rem;font:inherit;color:var(--ink);border:1.5px solid var(--line);-moz-appearance:textfield;background:#fff;border-radius:999px;padding:.45rem .3rem;font-weight:700;transition:border-color .15s,box-shadow .15s,background .15s}.coeff-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.coeff-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.coeff-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light);outline:none}.coeff-input.balanced{border-color:var(--success-border);background:var(--success-light);color:var(--success)}.species-formula{letter-spacing:.01em;font-weight:600}.species-formula sub{font-size:.72em}.species-formula sup{color:var(--accent-dark);font-size:.66em}.equation-symbol{color:#c7cad4;margin:0 -.1rem;font-size:1.3rem;font-weight:400}.equation-arrow{background:var(--ink);color:#fff;border-radius:999px;justify-content:center;align-items:center;width:2.4rem;height:1.9rem;margin:0 .2rem;font-size:1.1rem;font-weight:700;display:inline-flex}.status-banner{border-radius:var(--radius);color:var(--ink-soft);background:#f1f2f6;align-items:center;gap:.5rem;margin-bottom:1.1rem;padding:.85rem 1.1rem;font-size:.92rem;font-weight:600;transition:background .2s,color .2s;display:flex}.status-banner.status-balanced{background:var(--success-light);color:var(--success)}.status-banner.status-balanced:before{content:"✓";background:var(--success);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:1.2rem;height:1.2rem;font-size:.75rem;display:inline-flex}.status-banner.status-wrong{background:var(--error-light);color:var(--error)}.atom-table-wrap{border:1px solid var(--line);border-radius:var(--radius);margin-bottom:1.4rem;overflow-x:auto}.atom-table{border-collapse:collapse;width:100%;font-size:.93rem}.atom-table th,.atom-table td{text-align:left;padding:.65rem .9rem}.atom-table thead th{color:var(--ink-soft);text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--line);background:#f7f8fa;font-size:.78rem;font-weight:600}.atom-table tbody tr:not(:last-child) td{border-bottom:1px solid #eef0f4}.atom-table tbody tr:hover{background:#fafbff}.atom-table td.match{color:var(--success);font-weight:700}.atom-table td.mismatch{color:var(--error);font-weight:700}.tool-actions{flex-wrap:wrap;justify-content:space-between;gap:1rem;margin-bottom:1.1rem;display:flex}.action-group{flex-wrap:wrap;gap:.5rem;display:flex}.tool-actions button,.mode-tab,.difficulty-tab{font:inherit}.primary-button,.secondary-button,.small-button{border:1.5px solid var(--line);border-radius:var(--radius);color:var(--ink);cursor:pointer;background:#fff;padding:.65rem 1.15rem;font-size:.88rem;font-weight:600;transition:background .15s,border-color .15s,transform .1s,box-shadow .15s}.primary-button{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 2px 8px #4f46e540}.primary-button:hover{background:var(--accent-dark);border-color:var(--accent-dark)}.secondary-button:hover,.small-button:hover{background:#f5f6fa;border-color:#c7cad4}.primary-button:active,.secondary-button:active,.small-button:active{transform:scale(.97)}button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none!important;transform:none!important}.hint-text{border-radius:var(--radius);background:var(--warn-light);color:var(--warn);border:1px solid #fde68a;align-items:flex-start;gap:.6rem;margin-bottom:1.1rem;padding:.9rem 1.1rem;font-size:.92rem;display:flex}.hint-text:before{content:"💡";flex-shrink:0}.solution-panel{border:1.5px solid var(--line);border-radius:calc(var(--radius) + 2px);background:var(--surface);margin-bottom:1.6rem;padding:1.25rem 1.4rem}.solution-panel h2{color:var(--ink);margin:0 0 .85rem;font-size:1rem}.solution-steps{counter-reset:step;margin:0 0 1.1rem;padding-left:0;list-style:none}.solution-steps li{counter-increment:step;border-bottom:1px dashed #e8e9ee;margin-bottom:.3rem;padding:.55rem 0 .55rem 2.2rem;font-size:.93rem;line-height:1.5;position:relative}.solution-steps li:last-child{border-bottom:none}.solution-steps li:before{content:counter(step);background:var(--accent-light);width:1.5rem;height:1.5rem;color:var(--accent-dark);border-radius:50%;justify-content:center;align-items:center;font-size:.75rem;font-weight:700;display:flex;position:absolute;top:.45rem;left:0}.score-panel{border-top:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:.9rem;padding-top:1.1rem;display:flex}.score-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);min-width:100px;padding:.8rem 1.1rem;transition:transform .15s}.score-card:hover{transform:translateY(-1px)}.score-label{color:var(--ink-soft);text-transform:uppercase;letter-spacing:.04em;margin-bottom:.25rem;font-size:.76rem;display:block}.score-card strong{color:var(--ink);font-size:1.3rem}@media (width<=600px){.equation-row{padding:1.25rem 1rem;font-size:1.05rem}.coeff-input{width:2rem}.tool-actions{flex-direction:column;align-items:stretch}.action-group{justify-content:flex-start}.score-panel{justify-content:space-between}.score-card{min-width:44%}.mode-tabs,.difficulty-tabs{width:100%}.mode-tab,.difficulty-tab{text-align:center;flex:auto}}