.source{display:flex;justify-content:center;align-items:center;gap:12px;margin:26px 0 0;font-size:36px}.source button{font-size:30px;font-weight:bold;touch-action:none;border:2px solid #577584}.source #factor{color:#b32635;border-color:#c04c56}.branches{display:grid;grid-template-columns:1fr 1fr;max-width:760px;margin:auto;gap:40px}.arrow{text-align:center;color:#be3442;font-size:70px;opacity:.15}.arrow.active{opacity:1}.multiplication{display:flex;align-items:center;justify-content:center;gap:8px;font-size:32px}.multiplication button{min-width:70px;min-height:60px;border:2px dashed #97a5ac;background:#f1f3f4;font-size:24px}.multiplication button.filled{border:2px solid #438954;background:#eef8ef;opacity:1;color:#225738}.branch form{text-align:center;margin-top:24px}.branch input{width:120px}label{display:block;font-weight:bold;margin-bottom:10px}input{font:inherit;padding:12px;border:1px solid #8299a4;border-radius:7px;max-width:100%}input:focus-visible{outline:3px solid #dba422}form button{margin:6px}form p{min-height:24px}#final-form{text-align:center;margin-top:20px;border-top:1px solid #ddd;padding-top:20px}input.correct{border:2px solid #438954;background:#edf8ef}.source .selected{outline:3px solid #dca521}.source button{user-select:none}.source button.ghost{font-size:25px}#result{text-align:center}#feedback{text-align:center}@media(max-width:600px){.branches{gap:10px}.source{gap:6px}.source button{font-size:24px;padding:8px}.multiplication{gap:3px;font-size:22px}.multiplication button{min-width:44px;padding:4px;font-size:18px}.arrow{font-size:50px}.branch form button{font-size:14px;padding:8px}}
.mode-example{display:block;margin-top:12px;font-size:24px;color:#365a6b;font-weight:500}