:root{--abacus-bg: #faf3fb;--abacus-header: #2e2e30;--abacus-divider: #2e2e30;--bead-heaven: #feda92;--bead-heaven-active: #fcba33;--bead-earth: #a087e3;--bead-earth-active: #6548b4;--bead-switch-active: #3e4e99;--bead-switch-hover: #ffe2a8;--button-bg: #3e4e99;--button-hover-bg: #a087e3;--button-color: #fff;--button-hover-color: #fff;--result-color: #2e2e30;--box-shadow: 0 0 1em #0002;--divider-shadow: 0 2px 6px #0002;--switch-shadow: 0 1px 3px rgba(0, 0, 0, .15)}.soroban-abacus-root{display:inline-flex;flex-direction:column;align-items:center;background:var(--abacus-bg);padding:2em;border-radius:1em;box-shadow:var(--box-shadow);width:auto;min-width:unset;max-width:unset;position:relative;overflow:hidden}.abacus-header{display:flex;align-items:center;justify-content:center;width:100%}.abacus-header h2{color:var(--abacus-header);text-align:center;margin:0;font-size:2.2em;font-weight:700;letter-spacing:.04em}.abacus-main{width:100%;position:relative;z-index:0}.rods-row{display:flex;gap:1em;justify-content:center}.rod{display:flex;flex-direction:column;align-items:center}.abacus-divider{width:36px;height:6px;background:var(--abacus-divider);border-radius:3px;margin:6px 0;box-shadow:var(--divider-shadow);z-index:1}.heaven-bead,.earth-beads{display:flex;flex-direction:column;align-items:center}.bead{display:inline-block;position:relative;width:28px;height:36px;margin:8px 0;vertical-align:middle;border-radius:12px;background:transparent;transition:background .2s}.bead-switch{position:absolute;opacity:0;width:0;height:0}.bead .switch-slider{position:absolute;cursor:pointer;top:0;left:50%;transform:translate(-50%);width:20px;height:32px;background:transparent;border-radius:12px;transition:background .2s;display:flex;align-items:flex-start;justify-content:center}.switch-slider:before{content:"";display:block;position:absolute;left:50%;transform:translate(-50%) translateY(0);width:32px;height:18px;background:transparent;border-radius:0;transition:background .2s,transform .2s;box-shadow:var(--switch-shadow);top:2px;clip-path:polygon(15% 0%,85% 0%,100% 50%,85% 100%,15% 100%,0% 50%);pointer-events:auto;z-index:2}.bead-switch:checked+.switch-slider:before{background:var(--bead-switch-active);transform:translate(-50%) translateY(12px)}.bead.heaven .switch-slider:before{background:var(--bead-heaven)}.bead.heaven .bead-switch:checked+.switch-slider:before{background:var(--bead-heaven-active);transform:translate(-50%) translateY(12px)}.bead.earth .switch-slider:before{background:var(--bead-earth)}.bead.earth .bead-switch:checked+.switch-slider:before{background:var(--bead-earth-active);transform:translate(-50%) translateY(0)}.bead.earth .bead-switch:not(:checked)+.switch-slider:before{transform:translate(-50%) translateY(12px)}.abacus-controls{display:flex;gap:1em;margin:1em 0}.reset-btn,.toggle-result-btn,.toggle-whiteboard-btn{padding:.5em 1.5em;border-radius:.5em;border:none;font-size:1em;background:var(--button-bg);color:var(--button-color);cursor:pointer;transition:background .2s}.reset-btn:hover,.toggle-result-btn:hover,.toggle-whiteboard-btn:hover{background:var(--button-hover-bg);color:var(--button-hover-color)}.abacus-result{z-index:1;position:relative;margin:0 0 5%}.result-value{font-size:3em;font-weight:700;color:var(--result-color);font-family:Arial,sans-serif}.abacus-result-hidden{display:none!important}.abacus-rod-label{text-align:center;min-height:1.5em;font-family:Arial,sans-serif}.abacus-rotate-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#fcba33f2;z-index:10;display:flex;align-items:center;justify-content:center;border-radius:1em;pointer-events:all;border:2px solid #2e2e30;box-sizing:border-box}.abacus-rotate-message{color:#2e2e30;font-size:1.5em;text-align:center;font-weight:700;padding:1em 2em}.abacus-rotate-message span{display:block;margin-top:1.5em}.soroban-abacus-whiteboard-layout{display:flex;flex-direction:row;gap:2em;align-items:flex-start;justify-content:center;width:100%;flex-wrap:wrap}.abacus-whiteboard-container{background:#fff;border-radius:1em;box-shadow:var(--box-shadow);padding:0;display:flex;flex-direction:column;align-items:stretch;min-width:0;max-width:100vw}#abacus-whiteboard-canvas{border:2px solid #a087e3;border-radius:1em;background:#fff;box-shadow:0 2px 8px #0001;touch-action:none;width:100%;height:100%;display:block;position:relative}.whiteboard-controls{position:absolute;left:50%;top:0;transform:translate(-50%);width:auto;display:flex;gap:.5em;padding:.5em .5em 0;z-index:2;justify-content:center;pointer-events:none}.whiteboard-color-btn,.whiteboard-clear-btn{pointer-events:auto}.whiteboard-color-btn{width:2em;height:2em;border-radius:50%;border:none;cursor:pointer;outline:none;box-shadow:0 1px 3px #0002;transition:border .2s;display:flex;align-items:center;justify-content:center;font-size:1.2em;margin-right:.2em}.whiteboard-color-btn:focus{border:2px solid #3e4e99}.whiteboard-clear-btn{padding:.5em 1.2em;border-radius:.5em;border:none;background:var(--button-bg);color:var(--button-color);font-size:1em;cursor:pointer;margin-left:.5em;transition:background .2s}.whiteboard-clear-btn:hover{background:var(--button-hover-bg);color:var(--button-hover-color)}.whiteboard-color-btn.selected{box-shadow:0 0 0 3px #aaa,0 1px 3px #0002;border:2px solid #aaa!important}.abacus-whiteboard-container.abacus-whiteboard-cursor-dot{cursor:none!important}.abacus-whiteboard-container.abacus-whiteboard-cursor-dot:after{content:"";position:fixed;pointer-events:none;z-index:9999;width:18px;height:18px;border-radius:50%;background:var(--wb-cursor-color, #3e4e99);border:2px solid #fff;box-shadow:0 1px 4px #0002;transform:translate(-50%,-50%);left:var(--wb-cursor-x, -100px);top:var(--wb-cursor-y, -100px)}.abacus-whiteboard-container.abacus-whiteboard-cursor-eraser{cursor:none!important}.abacus-whiteboard-container.abacus-whiteboard-cursor-eraser:after{content:"🧹";position:fixed;pointer-events:none;z-index:9999;font-size:2em;left:var(--wb-cursor-x, -100px);top:var(--wb-cursor-y, -100px);transform:translate(-50%,-50%)}@media (max-width: 900px){.soroban-abacus-whiteboard-layout{flex-direction:column;align-items:center;gap:2em}.abacus-whiteboard-container{min-width:unset;width:100%;max-width:100vw}.soroban-abacus-root{max-width:100vw;display:flex;flex-direction:column;align-items:center;box-sizing:border-box}}
