.fraction-builder{max-width:720px;margin:12px auto;padding:14px;border:1px solid #9abcb9;border-radius:12px;min-width:0}
.fraction-builder legend{font-weight:700;padding:0 6px}
.fraction-area{display:grid;border:2px solid #28555c;max-width:520px;margin:14px auto;overflow:hidden;border-radius:6px}
.fraction-area button{border:1px solid #527f88;border-radius:0;margin:0;min-width:0;min-height:52px;background:#fff;color:#183e49;box-sizing:border-box}
.fraction-area button[aria-pressed=true],.fraction-group[aria-pressed=true]{background:#17656b;color:#fff}
.fraction-area .fraction-given{background:#f5ce79;color:#2d3b42;opacity:1}
.fraction-builder button:focus-visible{outline:3px solid #ad441f;outline-offset:3px}
.fraction-builder svg{width:100%;max-width:520px;height:auto;display:block;margin:auto;max-height:none!important}
.fraction-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.fraction-actions button{min-width:44px;min-height:44px}
.fraction-share-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px;margin:12px 0}
.fraction-share,.fraction-group{border:2px solid #86aaa9;border-radius:10px;padding:8px;min-width:0;background:#f7fbfa;color:#183e49}
.fraction-share h3{font-size:17px;margin:0 0 5px}
.fraction-share p{font-size:15px;margin:6px 0}
.fraction-group{display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:8px;min-height:110px}
.fraction-counter-box,.fraction-reservoir{display:flex;flex-wrap:wrap;align-content:flex-start;justify-content:center;gap:5px;min-height:20px}
.fraction-reservoir{padding:10px;border:1px dashed #86aaa9;margin:10px 0;border-radius:8px}
.fraction-counter{display:inline-block;width:14px;height:14px;background:#17656b;border:1.5px solid #133b44;border-radius:50%;box-sizing:border-box;flex:0 0 14px}
.fraction-group[aria-pressed=true] .fraction-counter{background:#fff;border-color:#fff}
[data-fraction-status]{font-weight:600}
@media(max-width:440px){.fraction-builder{padding:10px}.fraction-actions button{padding:9px}.fraction-area button{min-height:48px}}

.fraction-area.fraction-columns-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.fraction-area.fraction-columns-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.fraction-area.fraction-columns-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.fraction-area.fraction-columns-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.fraction-area.fraction-columns-5{grid-template-columns:repeat(5,minmax(0,1fr))}

.fraction-builder .fraction-reference{display:block;width:100%;max-width:480px;height:auto;margin:auto}