/* Fixed-coordinate worksheet shared with the Mini Program, without idle animation. */
.setup.method-filter{grid-template-columns:1fr auto}
#playView[data-mode=method] .question-heading{margin-bottom:12px;min-height:60px}
#playView[data-mode=method] #questionVisual{display:block;min-height:0;margin-bottom:12px}
.method-workshop{width:min(460px,100%);margin:auto}
.method-steps{display:flex;justify-content:center;gap:20px;list-style:none;padding:0;margin:0 0 16px}
.method-steps li{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#edf1f4;color:#637985;font-size:13px;font-weight:700}
.method-steps li.current{background:#b9512c;color:#fff}.method-steps li.done{background:#d9eee4;color:#1c6c51}
.method-diagram{position:relative;width:100%;aspect-ratio:360/320;text-align:center}
.method-node{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;font-size:30px;font-weight:750;line-height:1;box-sizing:border-box;font-variant-numeric:tabular-nums}
.method-node.box{width:14.45%;height:14.38%;border:2px solid #c4dbd3;border-radius:6px;background:#f2f9f6;color:#254d43}
.method-node.symbol{width:8%;color:#556b76}
.method-node.pending{border:2px dashed #ccd6dd;background:#fafcfd;color:#91a0ab}
.method-node.active{background:#fff0df;border-color:#cd743e;color:#9b451f;box-shadow:0 0 0 3px #fff0df}
.method-node.done{background:#e4f4ec;border-color:#7ebba6;color:#1a6a50}
.method-line{position:absolute;display:block;height:2px;background:#d9a36b;transform-origin:0 50%;pointer-events:none}
.method-row-label{position:absolute;font-size:12px;font-weight:500;color:#6c8089;line-height:1;transform:translateY(-50%)}
.method-diagram::before,.method-diagram::after{content:'';position:absolute;left:5%;right:5%;height:1px;background:#e6ecef;top:47%}
.method-diagram::after{top:73%}
#playView[data-mode=method] .method-answers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:min(460px,100%);margin:14px auto 0;gap:12px}
.method-answers .choice{width:100%;min-width:0;height:62px;padding:0;font-size:28px}
#playView[data-mode=method] #feedback{min-height:28px;font-size:14px;margin-top:12px}
@media(min-width:860px){
 #playView[data-mode=method] .question-zone{display:grid;grid-template-columns:minmax(300px,420px) minmax(240px,330px);grid-template-rows:auto auto minmax(55px,auto) auto;column-gap:42px;align-content:center;max-width:850px;margin-top:24px}
 #playView[data-mode=method] #questionVisual{grid-column:1;grid-row:1/5;margin:0;align-self:center}
 #playView[data-mode=method] .question-heading{grid-column:2;grid-row:1;justify-content:flex-start;min-height:90px;margin-bottom:16px}
 #playView[data-mode=method] .question-guide{width:58px;height:58px;flex-shrink:0}
 #playView[data-mode=method] .question-zone h2{font-size:25px}
 #playView[data-mode=method] .method-answers{grid-column:2;grid-row:2;grid-template-columns:repeat(2,minmax(0,1fr));margin:0;align-self:start}
 #playView[data-mode=method] #feedback{grid-column:2;grid-row:3;margin:14px 0;align-self:center}
 #playView[data-mode=method] .round-actions{grid-column:2;grid-row:4;flex-wrap:wrap}
 #playView[data-mode=method] .round-actions button{min-width:110px}
}
@media(max-height:680px) and (min-width:860px){#playView[data-mode=method] .question-zone{margin-top:10px;column-gap:26px}.method-workshop{max-width:340px}.method-node{font-size:26px}}
@media(max-width:600px){.method-node{font-size:24px}.method-steps{margin-bottom:12px;gap:16px}.method-row-label{font-size:11px}.method-answers .choice{height:52px;font-size:25px}#playView[data-mode=method] .method-answers{gap:10px}#playView[data-mode=method] .question-heading{min-height:52px}#playView[data-mode=method] #feedback{font-size:13px}}
@media(max-width:350px){.method-node{font-size:20px}.method-row-label{font-size:10px}.method-answers .choice{font-size:22px}}