/* Fixed frame; only the rule content is a scroll container. */
.instruction{grid-template-rows:auto minmax(0,1fr) 28px auto auto}
.instruction-body{overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#b2914e #efe6d3;padding-right:8px;scroll-padding-bottom:12px}
.instruction-body:focus-visible{outline:2px solid #c9a353;outline-offset:3px;border-radius:3px}
.instruction-body::-webkit-scrollbar{width:6px}
.instruction-body::-webkit-scrollbar-thumb{background:#b2914e;border-radius:4px}
.instruction-body::-webkit-scrollbar-track{background:#efe6d3}
.instruction-end{display:flex;align-items:center;justify-content:center;gap:12px;margin:22px 0 5px;padding:15px 6px;border-top:2px solid #b89b59;border-bottom:1px solid #d8c696;color:#64512b;font-size:13px;text-align:center;background:linear-gradient(90deg,transparent,#efe1be,transparent)}
.scroll-status{position:relative;display:flex;align-items:center;justify-content:center;min-height:27px;color:#80652d;font-size:11px;border-top:1px solid #d8c696;line-height:1.2;overflow:hidden}
.scroll-progress{position:absolute;top:0;left:0;height:2px;background:#b79754;width:0;transition:width .1s linear}
.scroll-status.at-end{color:#426341;background:#edf1e39c;border-radius:4px}
.scroll-status.at-end .scroll-progress{background:#769263}
@media(max-width:620px){.instruction-body{padding-right:7px}.scroll-status{font-size:10px}.instruction-end{font-size:12px;padding:12px 4px;gap:8px}}
@media(max-height:520px) and (min-width:621px){.instruction{grid-template-rows:auto minmax(0,1fr) 25px auto}.scroll-status{font-size:10px;min-height:24px}}