.fra18-context-visual,.fra18-visual{width:100%}.fra18-visual{max-width:58rem;margin-inline:auto}.fra18-board{display:grid;gap:1rem;width:100%;color:#17324d}.fra18-board p{margin:0}.fra18-fraction{display:inline-grid;grid-template-rows:auto 2px auto;min-width:2.5rem;align-items:center;text-align:center;vertical-align:middle;line-height:1}.fra18-fraction i{display:block;height:2px;background:currentcolor}.fra18-fraction b{padding:.18rem .35rem}.fra18-expression{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.8rem;font-size:clamp(1.05rem,3vw,1.45rem);font-weight:900}.fra18-expression .changes{padding:.35rem;border-radius:.6rem;outline:3px solid #2878bd;background:#e2f2ff}.fra18-expression .ready{padding:.35rem;border-radius:.6rem;outline:3px solid #2b7f4b;background:#e7f7eb}
.fra18-battery-card{display:grid;gap:.5rem;justify-items:center;min-width:0;padding:.8rem;border:2px solid #c4d5e2;border-radius:1rem;background:#fff;font-weight:850}.fra18-hook{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;padding:clamp(.4rem,2vw,1rem)}.fra18-battery{display:grid;grid-template-columns:1fr .7rem;width:100%;max-width:20rem;align-items:center}.fra18-battery>div{display:grid;grid-template-columns:repeat(var(--fra18-parts),minmax(.25rem,1fr));min-height:4.2rem;overflow:hidden;border:4px solid #17324d;border-radius:.65rem}.fra18-battery>i{height:1.8rem;border-radius:0 .35rem .35rem 0;background:#17324d}.fra18-cell{display:block;min-width:0;border-right:1px solid rgb(23 50 77/28%);background:#fff}.fra18-cell:last-child{border-right:0}.fra18-cell.is-selected.blue{background:repeating-linear-gradient(135deg,#2878bd 0 7px,#57a4df 7px 12px)}.fra18-cell.is-selected.amber{background:radial-gradient(circle at center,#f0a52d 0 27%,#ffdc8b 29% 48%,#f0a52d 50%);background-size:1.15rem 1.15rem}.fra18-cell.is-selected.ready{background:repeating-linear-gradient(45deg,#3b9160 0 6px,#7bc493 6px 11px)}.fra18-cell.is-selected.blend{background:linear-gradient(90deg,#2878bd 0 43%,#f0a52d 43%)}.fra18-plus{font-size:2rem;font-weight:900}.fra18-size-compare{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:.65rem;justify-content:center;align-items:end}.fra18-size-compare span,.fra18-part-compare>div{display:grid;place-items:center;border:3px solid currentcolor;border-radius:.8rem;font-weight:900}.quarter-piece{width:min(15rem,42vw);min-height:5rem;color:#155b91;background:repeating-linear-gradient(135deg,#d9edff 0 8px,#b9ddf7 8px 14px)}.twelfth-piece{width:min(6rem,18vw);min-height:5rem;color:#875306;background:radial-gradient(circle,#f0a52d 0 13%,#fff0c9 15%);background-size:1.4rem 1.4rem}.fra18-size-compare b{flex-basis:100%;text-align:center}.fra18-hook .hook-first,.fra18-hook .hook-second,.fra18-hook .fra18-size-compare,.fra18-ready-note{opacity:0;visibility:hidden;transition:opacity .25s ease}.fra18-hook.cue-hook-c1 .hook-first,.fra18-hook.cue-hook-c2 .hook-second,.fra18-hook.cue-hook-c3 .fra18-size-compare,.fra18-hook.cue-hook-c4 .fra18-ready-note,.fra18-hook.cue-hook-c5 .fra18-ready-note{opacity:1;visibility:visible}.fra18-ready-note{grid-column:1/-1;justify-self:center;padding:.6rem .85rem;border-radius:.7rem;background:#e7f7eb;font-weight:800}
.fra18-part-compare{grid-template-columns:1fr 1fr;align-items:end;justify-items:center}.fra18-part-compare>p{grid-column:1/-1;padding:.7rem;border-radius:.7rem;background:#eef5f8;font-weight:850;text-align:center}.fra18-ready-denominator,.fra18-order,.fra18-subdivide,.fra18-combine{justify-items:center}.fra18-factor-card{padding:.7rem 1rem;border:2px solid #2b7f4b;border-radius:.8rem;background:#e7f7eb;font-weight:900}.fra18-ready-denominator>p,.fra18-subdivide>p,.fra18-combine>p{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center}.fra18-ready-denominator>p span,.fra18-subdivide>p span,.fra18-subdivide>p strong,.fra18-combine>p span,.fra18-combine>p strong{padding:.45rem .7rem;border-radius:.6rem;background:#eef5f8}.fra18-subdivide>div{display:grid;gap:.4rem;width:100%;justify-items:center}.fra18-subdivide>.fra18-battery{max-width:24rem}.fra18-strip-row{display:grid;grid-template-columns:minmax(4rem,auto) 1fr;gap:.7rem;align-items:center;width:100%}.fra18-strip-label{font-weight:850;text-align:right}.fra18-strip{display:grid;grid-template-columns:repeat(var(--fra18-parts),minmax(.25rem,1fr));min-height:3.7rem;overflow:hidden;border:3px solid #17324d;border-radius:.75rem;background:#fff}.fra18-combine-arrow{font-size:1.5rem;font-weight:900}.fra18-order>p{max-width:42rem;padding:.7rem;border-radius:.7rem;background:#eef5f8;font-weight:800;text-align:center}
.fra18-boundary{grid-template-columns:1fr 1fr}.fra18-boundary section{display:grid;gap:.55rem;padding:1rem;border:3px solid;border-radius:1rem;text-align:center}.fra18-boundary .is-fra18{border-color:#2b7f4b;background:#f1fbf4}.fra18-boundary .is-later{border-color:#a8bac8;background:#f5f7f9}.fra18-boundary section p{font-size:1.25rem;font-weight:900}.fra18-handoff{grid-template-columns:repeat(3,1fr)}.fra18-handoff section{min-height:8rem;padding:1rem;border:2px solid #bfd1df;border-radius:1rem;background:#fff;text-align:center}.fra18-handoff section>span{display:grid;width:2rem;height:2rem;margin:0 auto .5rem;place-items:center;border-radius:50%;background:#17324d;color:#fff;font-weight:900}.fra18-final-intro{justify-items:center}.fra18-final-intro>strong{font-size:clamp(1.4rem,4vw,2rem)}.fra18-final-intro>div{display:flex;gap:.5rem}.fra18-final-intro>div span{display:grid;width:2.7rem;height:2.7rem;place-items:center;border:2px solid #17324d;border-radius:50%;font-weight:900}
.fra18-question-expression{padding:.4rem}.fra18-source-strips{display:grid;gap:.65rem}.fra18-symbolic-card{padding:1rem;border:2px solid #c4d5e2;border-radius:.9rem;background:#fff;text-align:center}.fra18-working{margin-top:.35rem;padding:1rem;border:2px solid #2b7f4b;border-radius:.9rem;background:#f2fbf4}.fra18-working strong{color:#21623b}.fra18-working ol{display:grid;gap:.45rem;margin:.7rem 0 0;padding-left:1.4rem}.fra18-working li{animation:fra18-step-in .28s ease both}.fra18-repair{padding:1rem;border:2px solid #f0a52d;border-radius:1rem;background:#fffaf0}.fra18-fields-answer{display:grid;gap:.8rem;border:0;padding:0}.fra18-fields-answer legend{font-weight:900}.fra18-operand-choice{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}.fra18-operand-choice label,.fra18-field-grid label{display:grid;gap:.35rem}.fra18-operand-choice label{grid-template-columns:auto 1fr;align-items:center;padding:.75rem;border:2px solid #b4c8d7;border-radius:.75rem;background:#fff;font-weight:800}.fra18-operand-choice input{width:1.2rem;height:1.2rem}.fra18-field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}.fra18-field-grid input{width:100%;min-height:3rem;padding:.55rem;border:2px solid #9fb6c8;border-radius:.65rem;font:inherit;text-align:center}.fra18-field-grid input:focus-visible,.fra18-operand-choice input:focus-visible{outline:3px solid #ffbf47;outline-offset:2px}.fra18-cue-focus{filter:saturate(1.15)}@keyframes fra18-step-in{from{opacity:0;transform:translateY(.3rem)}to{opacity:1;transform:none}}
@media(max-width:520px){.fra18-board{gap:.65rem}.fra18-hook{grid-template-columns:1fr}.fra18-plus{line-height:1;transform:rotate(90deg)}.fra18-size-compare,.fra18-ready-note{grid-column:1}.fra18-battery>div{min-height:3.25rem}.fra18-part-compare{grid-template-columns:1fr}.fra18-part-compare>p{grid-column:1}.quarter-piece{width:min(16rem,85vw)}.twelfth-piece{width:min(7rem,34vw)}.fra18-boundary,.fra18-handoff,.fra18-field-grid,.fra18-operand-choice{grid-template-columns:1fr}.fra18-handoff section{min-height:auto}.fra18-strip-row{grid-template-columns:1fr;gap:.3rem}.fra18-strip-label{text-align:left}.fra18-strip{min-height:3rem}.fra18-working{padding:.75rem}.fra18-final-intro>div{gap:.3rem}.fra18-final-intro>div span{width:2.25rem;height:2.25rem}}
@media(prefers-reduced-motion:reduce){.fra18-visual *,.fra18-visual *::before,.fra18-visual *::after{animation:none!important;scroll-behavior:auto!important;transition:none!important}.fra18-board[data-fra18-cue]{outline:3px solid #ffbf47;outline-offset:3px}}