.ybf12[data-tool="numbers"]{box-sizing:border-box;max-width:520px;margin:0 auto;padding:16px;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:#1f2933;background:#ffffff;border:3px solid #2f6fed;border-radius:14px;line-height:1.5}
.ybf12[data-tool="numbers"] *,.ybf12[data-tool="numbers"] *::before,.ybf12[data-tool="numbers"] *::after{box-sizing:border-box} .ybf12[data-tool="numbers"] .ybf12-title{margin:0 0 6px;font-size:20px;font-weight:700;color:#123a8f} .ybf12[data-tool="numbers"] .ybf12-desc{margin:0 0 12px;font-size:14.4px;color:#3e4c59} .ybf12[data-tool="numbers"] .ybf12-controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:10px;border:2px solid #2f6fed;border-radius:10px;background:#eef3ff} .ybf12[data-tool="numbers"] .ybf12-btn{min-height:44px;min-width:88px;padding:10px 18px;font-size:16px;font-weight:600;border-radius:8px;border:2px solid transparent;cursor:pointer;transition:background-color .15s ease,color .15s ease,border-color .15s ease} .ybf12[data-tool="numbers"] .ybf12-btn:focus-visible{outline:3px solid #b45309;outline-offset:2px} .ybf12[data-tool="numbers"] .ybf12-btn-start{background:#2f6fed;color:#ffffff;border-color:#2f6fed} .ybf12[data-tool="numbers"] .ybf12-btn-start:hover:not(:disabled){background:#1d54c4;border-color:#1d54c4} .ybf12[data-tool="numbers"] .ybf12-btn-start:disabled{background:#c3cbd8;border-color:#c3cbd8;color:#5b6673;cursor:not-allowed} .ybf12[data-tool="numbers"] .ybf12-btn-reset{background:#ffffff;color:#123a8f;border-color:#2f6fed} .ybf12[data-tool="numbers"] .ybf12-btn-reset:hover{background:#dbe6ff} .ybf12[data-tool="numbers"] .ybf12-elapsed{font-size:14.4px;font-variant-numeric:tabular-nums;color:#3e4c59;margin-left:auto} .ybf12[data-tool="numbers"] .ybf12-panel{margin-top:12px;padding:12px;background:#f7f9fc;border:1px solid #d5dde8;border-radius:10px} .ybf12[data-tool="numbers"] .ybf12-board{display:grid;grid-template-columns:repeat(4,1fr);gap:8px} .ybf12[data-tool="numbers"] .ybf12-cell{min-height:56px;min-width:0;padding:6px;font-size:18.4px;font-weight:700;font-variant-numeric:tabular-nums;color:#123a8f;background:#ffffff;border:2px solid #9db4e0;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;text-align:center;word-break:break-word} .ybf12[data-tool="numbers"] .ybf12-cell:focus-visible{outline:3px solid #b45309;outline-offset:2px} .ybf12[data-tool="numbers"] .ybf12-cell:hover:not(:disabled){background:#e8efff} .ybf12[data-tool="numbers"] .ybf12-cell:disabled{cursor:not-allowed;color:#5b6673;background:#eef1f5;border-color:#c3cbd8} .ybf12[data-tool="numbers"] .ybf12-cell.ybf12-done{color:#0f5132;background:#d9f2e3;border-color:#2f9e63} .ybf12[data-tool="numbers"] .ybf12-status{margin:12px 0 4px;font-size:15.2px;font-weight:600;color:#1f2933;min-height:1.4em} .ybf12[data-tool="numbers"] .ybf12-status.ybf12-error{color:#8a1c1c} .ybf12[data-tool="numbers"] .ybf12-status.ybf12-ok{color:#0f5132} .ybf12[data-tool="numbers"] .ybf12-summary{margin:0;font-size:14.4px;color:#3e4c59;font-variant-numeric:tabular-nums}
@media (max-width:390px){.ybf12[data-tool="numbers"]{padding:12px} .ybf12[data-tool="numbers"] .ybf12-controls{gap:8px} .ybf12[data-tool="numbers"] .ybf12-btn{min-width:76px;padding:10px 12px;font-size:15.2px} .ybf12[data-tool="numbers"] .ybf12-elapsed{width:100%;margin-left:0} .ybf12[data-tool="numbers"] .ybf12-cell{min-height:48px;font-size:16px} .ybf12[data-tool="numbers"] .ybf12-board{gap:6px}}
@media (prefers-reduced-motion:reduce){ .ybf12[data-tool="numbers"] .ybf12-btn{transition:none}}
.ybf12[data-tool="numbers"]{background:linear-gradient(135deg,#2c5dc7,#789de9);padding:22px;border:none;border-radius:22px;color:#fff}
.ybf12[data-tool="numbers"] .ybf12-title,.ybf12[data-tool="numbers"] .ybf12-desc{color:#fff}
.ybf12[data-tool="numbers"] .ybf12-panel{background:#fff}
.ybf12[data-tool="numbers"] .ybf12-controls{background:#fff;border-color:transparent}