:root{--font-text:"Microsoft YaHei","PingFang SC","Noto Sans CJK SC",Arial,sans-serif;--font-code:Consolas,"Cascadia Code","Microsoft YaHei","PingFang SC",monospace;font-family:var(--font-text)}
svg text,.story-svg,.output-box pre{font-family:var(--font-text)}
code,pre,kbd,.svg-code,.svg-code-text,svg text[font-family],.order-result{font-family:var(--font-code)}
.output-box pre{font-family:var(--font-text);font-weight:400}
.assignment-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:16px;align-items:stretch}
.program-panel{background:#243e56;color:#f3f8ff;border-radius:18px;padding:20px 16px;min-width:0}
.program-panel .box-label{color:#c4d5e5;font-size:15px}
.program-lines{padding:0;margin:16px 0 0;list-style:none;counter-reset:line}
.program-lines li{counter-increment:line;display:flex;align-items:center;gap:10px;padding:9px 7px;border-radius:7px;white-space:nowrap;line-height:1.6;min-height:48px}
.program-lines li:before{content:counter(line);font-size:14px;color:#9eb6cd;width:12px;flex-shrink:0}
.program-lines code{font-size:20px;overflow-wrap:normal;white-space:pre}
.program-lines li>span{margin-left:auto;color:#ffd774;font-size:14px}
.program-lines .executing{background:#ffffff17;box-shadow:inset 3px 0 #ffd774}
.variable-panel{border:1px solid #e2d6b2;background:#fff9e8;border-radius:18px;padding:18px 12px;min-width:0}
.variable-panel .box-label{font-size:15px;color:#746c55}
.variable-svg{display:block;width:100%;height:auto;margin:0}
.inline-output{display:flex;gap:12px;align-items:center;padding:10px 6px;border-top:1px dashed #dbcda9;font-size:16px}
.inline-output strong{font-size:16px;font-weight:400;color:#707d86}
.inline-output .has-output{font-family:var(--font-code);font-size:24px;color:#365f83}
.calculation-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}
.calculation-steps>span{border:1px solid #dce6eb;background:white;border-radius:12px;padding:10px;font-size:16px}
.calculation-steps b{display:block;margin-top:5px;font-weight:400;font-size:18px;font-family:var(--font-code)}
.calculation-steps .current{border-color:#80ace0;background:#edf5ff}
.assignment-narration{display:flex;align-items:center;gap:14px;margin-top:12px}
.assignment-narration img{width:86px;height:86px;flex-shrink:0;mix-blend-mode:multiply}
.assignment-narration p{font-size:18px;line-height:1.75}
.assignment-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:8px}
.assignment-actions>span{margin-right:auto;font-size:15px;color:#6b8295}
@media(max-width:1250px){.assignment-grid{grid-template-columns:1fr}.variable-panel{padding:12px}.variable-svg{max-width:320px;margin:auto}}
@media(max-width:650px){.program-panel{padding:16px 10px}.program-lines code{font-size:18px}.program-lines li{gap:7px;padding:8px 5px}.calculation-steps{grid-template-columns:1fr}.calculation-steps>span{display:flex;justify-content:space-between}.calculation-steps b{margin:0}.assignment-narration{gap:8px}.assignment-narration img{width:57px;height:67px}.assignment-narration p{font-size:17px}.assignment-actions{flex-wrap:wrap}.assignment-actions>span{font-size:14px}.assignment-actions .btn{font-size:15px;padding:10px 13px}.variable-panel .box-label{font-size:15px}}
