/* Each help step shows an action, the quantities it acts on, and one unknown. */
.purpose-note{font-size:14px;line-height:1.4;text-align:center;color:#52677a;margin:12px 0}
.purpose-given{display:flex;gap:12px;align-items:baseline;justify-content:center;margin:0 0 18px}.purpose-given>span{font-size:14px;color:#52677a}.purpose-given strong{font-size:26px;font-weight:500;color:var(--given,#285c9b)}
.purpose-equation{text-align:center;font-size:24px;line-height:1.5;margin:16px 0 4px;overflow-wrap:normal}.purpose-equation .math-blank{color:var(--unknown,#7650a3)}
.purpose-loose,.purpose-groups,.purpose-dots,.purpose-keep{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px}.purpose-groups{margin:14px 0}.purpose-group{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;align-items:center;padding:12px;border:1.5px solid #9bb9df;border-radius:8px;background:#f1f6fd;max-width:100%;min-width:46px}.purpose-group.is-active{border-color:#b5822d;background:#fff3d7}.purpose-keep{margin-bottom:16px;font-size:14px;color:#52677a}
.purpose-chip{display:grid;place-items:center;min-width:46px;min-height:36px;padding:5px 9px;border:1px solid #94b3dc;background:#e9f2ff;border-radius:4px;color:#285c9b;font-size:18px;font-weight:500;line-height:1.2}.purpose-chip.large-unit{min-width:64px;min-height:48px;border-width:2px;background:#f7faff;font-size:21px}.purpose-unit-grid{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:5px;width:100%}.purpose-unit-grid .purpose-chip{min-width:0;padding:5px;font-size:18px}.purpose-exchange{max-width:420px;margin:auto}
.purpose-dot{display:inline-block;width:var(--dot,17px);height:var(--dot,17px);flex-shrink:0;border:1px solid #396cae;background:#77a2db;border-radius:50%;position:relative}.purpose-dot.focus,.purpose-dot.second{background:#efc16b;border-color:#a37324}.purpose-dot.blank{border:1.5px dashed #9675b8;background:none}.purpose-slot{display:inline-block;width:17px;height:17px;border:1px dashed #9675b8;border-radius:50%}.purpose-dot.crossed:after{content:'';position:absolute;left:-2px;right:-2px;top:50%;border-top:2px solid #9d4e2b;transform:rotate(-45deg)}
.purpose-left{display:grid;gap:12px;text-align:center;margin-top:18px}.purpose-left>span{font-size:13px;color:#52677a}.purpose-division .purpose-group{max-width:120px}.purpose-division .purpose-group.empty-group{background:none;border-style:dashed;color:#7650a3;font-size:24px}.purpose-dots{gap:8px;max-width:310px;margin:auto}
.purpose-ten-frames{display:grid;gap:12px;max-width:310px;margin:auto}.purpose-ten-frame{display:grid;grid-template-columns:repeat(5,1fr);gap:0;border-top:1px solid #9bb9df;border-left:1px solid #9bb9df}.purpose-ten-frame>span{display:grid;place-items:center;height:44px;border-right:1px solid #9bb9df;border-bottom:1px solid #9bb9df;background:#edf4fd}.purpose-ten-frame>span.missing-slot{background:#faf8fe}.purpose-ten-frame>span.is-active{background:#fff0cf}.purpose-ten-frame .purpose-dot{width:23px;height:23px}
.purpose-parts{display:flex;gap:6px;align-items:stretch;justify-content:center}.purpose-parts>section{flex:1;min-width:0;border:1px solid #9bb9df;background:#edf4fd;padding:12px 6px;display:grid;gap:10px;text-align:center}.purpose-parts>section>span{font-size:13px;color:#52677a;overflow-wrap:anywhere}.purpose-parts strong{font-size:23px;font-weight:500}.purpose-parts>b{align-self:center;color:#52677a;font-size:17px;font-weight:400}.purpose-parts .is-unknown{background:#f4effa;border:1.5px dashed #9675b8;color:#7650a3}
.purpose-share-bar{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));width:100%;border:1px solid #91afd5}.purpose-share-bar>span{display:grid;place-items:center;min-height:53px;background:#f4effa;border-right:1px solid #91afd5;font-size:22px;color:#7650a3}.purpose-share-bar>span:last-child{border:0}.purpose-share-bar>span.is-active{background:#fff0cf;border-color:#bd8a35;color:#70450b}.unit-group{margin:auto;max-width:150px}
.purpose-array{display:grid;gap:6px;justify-content:center;margin:8px auto}.purpose-array-row{display:grid;grid-template-columns:repeat(var(--cols),var(--dot));gap:6px}.purpose-array-row.second-set .purpose-dot{background:#efc16b;border-color:#a37324}.purpose-array-row.paired-row{margin-bottom:9px}.purpose-array-row.removed-row{opacity:.65;position:relative}.purpose-array-row.removed-row:after{content:'';position:absolute;top:50%;left:0;right:0;border-top:2px solid #9d4e2b}
.purpose-grid-multiply{max-width:450px;margin:auto}.purpose-grid-head,.purpose-grid-body{display:grid;grid-template-columns:44px repeat(var(--parts),minmax(0,1fr));gap:0;text-align:center;align-items:stretch}.purpose-grid-head>span{font-size:23px;padding:10px 4px;color:#285c9b}.purpose-grid-body>div{border:1px solid #9bb9df;background:#edf4fd;display:grid;place-items:center;padding:16px 3px;font-size:20px;min-height:62px}.purpose-grid-body>strong{align-self:center;font-weight:500;font-size:23px;color:#285c9b}.purpose-grid-body>div.is-active{background:#fff0cf;border-color:#bd8a35}
.purpose-short-division{width:min(100%,340px);margin:10px auto}.division-answer,.division-number{display:grid;grid-template-columns:45px repeat(var(--digits),1fr);font-size:30px;line-height:1.5;text-align:center}.division-answer{color:#7650a3}.division-answer>span.is-active{background:#fff0cf;color:#70450b}.division-number>span{border-top:2px solid #617993;padding:7px 0;position:relative}.division-number>span:nth-child(2){border-left:2px solid #617993}.division-number>strong{align-self:center;font-weight:500}.division-number small{position:absolute;top:1px;left:0;font-size:15px;color:#9d6321}
.purpose-fraction-pieces{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;max-width:360px;margin:auto}.purpose-fraction-piece{display:inline-grid;place-items:center;min-width:35px;min-height:48px;background:#dceafa;color:#285c9b;border:1px solid #94b3dc;padding:4px;font-size:17px}.fraction-bundles{align-items:flex-start}.fraction-bundle{gap:0;padding:7px;flex-wrap:nowrap}.fraction-bundle.incomplete{border-style:dashed;background:#faf8fe}.fraction-bundle .purpose-fraction-piece{min-width:26px;font-size:16px;padding:3px}
@media(max-width:390px){.purpose-equation{font-size:21px}.purpose-parts strong{font-size:20px}.purpose-chip{font-size:17px}.purpose-given strong{font-size:23px}}

.purpose-bars{display:grid;gap:16px}.purpose-bars section>p{font-size:14px;color:#52677a;margin-bottom:7px}.purpose-bar-row{display:flex;min-height:42px;border:1px solid #94b3dc}.purpose-bar-row>span{min-width:0;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;padding:8px 2px;border-right:1px solid #94b3dc;background:#edf4fd;font-size:17px;line-height:1.3;text-align:center}.purpose-bar-row>span:last-child{border:0}.purpose-bar-row>.is-unknown{background:#f4effa;color:#7650a3}.purpose-parts strong{overflow-wrap:anywhere}

.purpose-equal-groups{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:8px;max-width:400px;margin:auto}.purpose-equal-groups>span{display:grid;place-items:center;min-height:44px;padding:7px;border:1px solid #94b3dc;background:#edf4fd;color:#285c9b;font-size:20px;line-height:1.3;text-align:center}.purpose-equal-groups>span.is-active{background:#fff0cf;border-color:#bd8a35}
@media(max-height:500px){.screen-help-content{gap:10px}.screen-hint{font-size:16px;line-height:1.35}.purpose-given{margin-bottom:10px}.purpose-equation{margin-top:10px;font-size:20px}.purpose-note{margin:8px 0;font-size:13px}}

.purpose-exchange[data-direction=smaller]:not([data-stage="0"]) .purpose-groups .purpose-chip,.purpose-exchange[data-direction=larger][data-stage="2"] .large-unit{background:#fff0cf;border-color:#c99c42;color:#7a5318}.purpose-exchange[data-direction=smaller]:not([data-stage="0"]) .purpose-groups .purpose-group{border-color:#d3b778;background:#fffaf0}

@media(max-height:500px){.ten-frame-model{gap:8px}.ten-frame{grid-template-columns:repeat(5,20px);margin-bottom:5px}.ten-frame>span{width:20px;height:22px}.ten-frame .counter{width:13px;height:13px}.frame-label{margin-bottom:5px}.purpose-array{gap:4px}}
