:root{--bead-width:60px;--bead-height:32px;--rod-gap:40px;--rod-height:350px;--beam-top:110px;--abacus-padding:40px;--top-bead-move:60px;--bottom-bead-move:-60px;--beads-top-height:110px;--beads-bottom-height:240px}@media (max-width:600px){:root{--bead-width:50px;--bead-height:26px;--rod-gap:20px;--rod-height:300px;--beam-top:90px;--abacus-padding:20px;--top-bead-move:50px;--bottom-bead-move:-50px;--beads-top-height:90px;--beads-bottom-height:200px}}@media (max-width:400px){:root{--bead-width:40px;--bead-height:22px;--rod-gap:15px;--rod-height:250px;--beam-top:75px;--abacus-padding:15px;--top-bead-move:40px;--bottom-bead-move:-40px;--beads-top-height:75px;--beads-bottom-height:170px}}body{color:#1e293b;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;touch-action:manipulation;background:#f8fafc;margin:0;font-family:Outfit,sans-serif}.game-layout{-webkit-user-select:none;user-select:none;flex-direction:column;justify-content:center;align-items:center;gap:1.5rem;max-width:100vw;min-height:100vh;padding:10px;display:flex;overflow-x:hidden}.title{background:linear-gradient(135deg,#4f46e5,#ec4899);-webkit-text-fill-color:transparent;text-align:center;-webkit-background-clip:text;margin:0;font-size:clamp(2rem,5vw,2.5rem);font-weight:800}.level-selector{flex-wrap:wrap;justify-content:center;gap:.5rem;width:100%;display:flex}.level-btn{cursor:pointer;color:#64748b;background:0 0;border:2px solid #e2e8f0;border-radius:8px;padding:8px 12px;font-size:clamp(.8rem,3vw,1rem);font-weight:600;transition:all .2s}.level-btn.active{color:#fff;background:#4f46e5;border-color:#4f46e5}.question-panel{color:#334155;text-align:center;box-sizing:border-box;background:#fff;border-radius:20px;width:90%;min-width:200px;max-width:400px;padding:clamp(1rem,4vw,1.5rem) clamp(2rem,8vw,4rem);font-size:clamp(3rem,10vw,4rem);font-weight:800;box-shadow:0 10px 25px #0000000d}.abacus-container{padding:var(--abacus-padding);box-sizing:border-box;background:linear-gradient(135deg,#fef2f2 0%,#ffedd5 100%);border:15px solid #7d5125;border-top-color:#9c6734;border-bottom:20px solid #6b4421;border-radius:12px;justify-content:center;align-items:center;max-width:100%;display:flex;position:relative;box-shadow:0 20px 40px #00000026,inset 0 2px 10px #fffc}@media (max-width:600px){.abacus-container{border-width:10px 10px 15px}}.abacus-rods{gap:var(--rod-gap);display:flex;position:relative}.abacus-rods:before{content:"";top:var(--beam-top);z-index:1;background:#e8cc99;border-radius:6px;height:12px;position:absolute;left:-20px;right:-20px;box-shadow:0 4px 6px #0006,inset 0 -2px 5px #0000004d}.rod-container{height:var(--rod-height);flex-direction:column;align-items:center;display:flex;position:relative}.rod-line{z-index:0;background:#718096;border-radius:4px;width:8px;position:absolute;top:0;bottom:0;box-shadow:inset 0 2px 6px #0009,1px 0 2px #fff6}@media (max-width:600px){.rod-line{width:6px}}.beads-top{height:var(--beads-top-height);z-index:2;box-sizing:border-box;flex-direction:column;align-items:center;padding-top:10px;display:flex}.beads-bottom{height:var(--beads-bottom-height);z-index:2;box-sizing:border-box;flex-direction:column;justify-content:flex-end;gap:4px;padding-bottom:10px;display:flex}.bead{width:var(--bead-width);height:var(--bead-height);cursor:pointer;background:radial-gradient(circle at 30% 30%,#ff8a00,#e52e71);border-radius:16px;transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s;box-shadow:0 6px 10px #0006,inset 0 -4px 8px #0000004d,inset 0 4px 8px #ffffff80}@media (max-width:600px){.bead{border-radius:12px}}.bead:hover{filter:brightness(1.1);box-shadow:0 8px 12px #00000080,inset 0 -4px 8px #0000004d,inset 0 4px 8px #fff9}.bead.top-bead{background:radial-gradient(circle at 30% 30%,#00f2fe,#4facfe)}.bead.active.top-bead{transform:translateY(var(--top-bead-move))}.bead.active.bottom-bead{transform:translateY(var(--bottom-bead-move))}.controls{flex-wrap:wrap;justify-content:center;gap:1rem;width:100%;display:flex}.btn{cursor:pointer;border:none;border-radius:12px;padding:12px 24px;font-family:inherit;font-size:clamp(1rem,4vw,1.25rem);font-weight:800;transition:all .2s;box-shadow:0 4px 6px #0000001a}.btn-primary{color:#fff;background:linear-gradient(135deg,#10b981,#059669)}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 8px 15px #10b98166}.btn-secondary{color:#4f46e5;background:#fff}.btn-secondary:hover{transform:translateY(-3px);box-shadow:0 8px 15px #00000014}.message{text-align:center;opacity:0;min-height:2rem;padding:0 10px;font-size:clamp(1.2rem,5vw,1.5rem);font-weight:800;transition:all .3s;transform:translateY(10px)}.message.show{opacity:1;transform:translateY(0)}.message.success{color:#10b981}.message.error{color:#ef4444}.tutorial-active{background:linear-gradient(135deg,#fffbeb,#fef3c7);border:4px solid #f59e0b;transition:all .3s;box-shadow:0 10px 25px #f59e0b33}.tutorial-text{color:#92400e;font-size:clamp(1.2rem,5vw,2rem);font-weight:600;line-height:1.4;animation:2s infinite alternate pulseLight}@keyframes pulseLight{0%{opacity:.8}to{opacity:1}}