/* Scoped teaching figures only. Reuse production typography and reader-size inheritance. */
.w-reading article .visual-expansion{margin:40px 0 48px;color:inherit;font:inherit;font-size:var(--body-font,var(--reader-font,18px))}
.w-reading article .visual-expansion h3{font-family:inherit;font-size:1.22em;line-height:1.45;margin:0 0 16px}
.w-reading article .visual-expansion .vx-question{margin:0 0 20px;font-size:1em;line-height:1.85}
.w-reading article .visual-expansion .vx-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.w-reading article .visual-expansion .vx-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}
.w-reading article .visual-expansion .vx-card{min-width:0;padding:20px;background:var(--surface,#f3f3f1);border:1px solid #d8d8d4;border-radius:8px}
.w-reading article .visual-expansion h4{margin:0 0 14px;font-size:1em;line-height:1.6}
.w-reading article .visual-expansion p,.w-reading article .visual-expansion li,.w-reading article .visual-expansion dd,.w-reading article .visual-expansion dt{font-size:1em;line-height:1.85;overflow-wrap:anywhere}
.w-reading article .visual-expansion .vx-card p{margin:10px 0 0}
.w-reading article .visual-expansion .vx-muted{font-size:.9em;line-height:1.65;color:#54565a}
.w-reading article .visual-expansion .vx-list{margin:0;padding:0;list-style:none}
.w-reading article .visual-expansion .vx-list li{padding:6px 0;border-bottom:1px solid #d8d8d4}
.w-reading article .visual-expansion .vx-list--roomy li{padding:16px 0}
.w-reading article .visual-expansion .vx-viewline{margin-top:12px;border-top:2px dashed #767870;padding-top:10px}
.w-reading article .visual-expansion .vx-viewline p{margin:0}
.w-reading article .visual-expansion .vx-flow{margin:0;padding-left:1.5em;display:grid;gap:16px}
.w-reading article .visual-expansion .vx-flow>li{padding:16px 20px;background:#f3f3f1;border-radius:8px}
.w-reading article .visual-expansion .vx-flow p{margin:8px 0 0}
.w-reading article .visual-expansion .vx-actions{margin:12px 0 0;padding-left:1.35em}
.w-reading article .visual-expansion .vx-endnote{margin:20px 0 0}
.w-reading article .visual-expansion figcaption{font-size:16px;line-height:1.65;margin-top:16px;color:#54565a}
.w-reading article .visual-expansion .vx-glyph{display:inline-flex;width:32px;height:32px;align-items:center;justify-content:center;vertical-align:middle}
.w-reading article .visual-expansion .vx-glyph svg{width:26px;height:26px}
.w-reading article .visual-expansion .vx-picture{margin:18px 0 0;border:1px solid #d8d8d4;border-radius:8px;overflow:hidden;background:#fff}
.w-reading article .visual-expansion .vx-picture svg{display:block;width:100%;height:auto;stroke:#34363b;fill:none;stroke-width:2}
.w-reading article .visual-expansion .vx-static-field{padding:12px 16px;border:1px solid #767870;background:white;border-radius:4px;margin-top:8px}
.w-reading article .visual-expansion .vx-phone{border:2px solid #565861;border-radius:18px;background:white;padding:16px 12px;position:relative;min-width:0}
.w-reading article .visual-expansion .vx-phone-title{font-weight:700;margin-bottom:12px}
.w-reading article .visual-expansion .vx-memo{border:1px solid #a6a7a1;border-radius:4px;padding:10px;margin-bottom:12px;min-height:100px}
.w-reading article .visual-expansion .vx-keyboard{background:#d8d9dc;padding:8px;border-radius:4px;display:grid;grid-template-columns:repeat(6,1fr);gap:4px;margin-top:12px}
.w-reading article .visual-expansion .vx-keyboard i{height:14px;background:#fff;border-radius:2px}
.w-reading article .visual-expansion .vx-save{display:block;background:#34363b;color:white;text-align:center;padding:8px;border-radius:5px;margin:8px 0}
.w-reading article .visual-expansion .vx-cover{position:absolute;left:0;right:0;top:0;box-shadow:0 0 0 5px white;margin:0;z-index:1}
.w-reading article .visual-expansion .vx-cover-legend{margin-bottom:10px!important}
.w-reading article .visual-expansion .vx-profile{display:flex;gap:10px;align-items:center;margin:12px 0}
.w-reading article .visual-expansion .vx-avatar{width:42px;height:42px;border-radius:50%;background:#d9dad6;flex:none}
.w-reading article .visual-expansion .vx-state{display:flex;align-items:center;gap:12px;margin:8px 0}
.w-reading article .visual-expansion .vx-dot{width:18px;height:18px;border-radius:50%;display:inline-block;flex:none;background:#245b45}
.w-reading article .visual-expansion .vx-dot--red{background:#963c32}.w-reading article .visual-expansion .vx-dot--gray{background:#72746f}
.w-reading article .visual-expansion dl{margin:0}.w-reading article .visual-expansion dl>div{padding:10px 0;border-bottom:1px solid #d8d8d4}.w-reading article .visual-expansion dt{font-weight:700}.w-reading article .visual-expansion dd{margin:4px 0 0}
.w-reading article .visual-expansion .vx-arrow{display:block;margin:12px 0;font-size:1.2em;color:#565861}
.w-reading article .visual-expansion .vx-source{font-size:.9em}
.w-reading article .visual-expansion.article-photo .vx-scene-image{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;border-radius:8px}
.w-reading article .visual-expansion .vx-scene-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:20px 0 0;padding-left:1.4em}
.w-reading article .visual-expansion .vx-scene-steps li{padding-left:3px}
@media(max-width:760px){.w-reading article .visual-expansion{margin:32px 0 40px}.w-reading article .visual-expansion .vx-grid,.w-reading article .visual-expansion .vx-grid--three,.w-reading article .visual-expansion .vx-scene-steps{grid-template-columns:1fr}.w-reading article .visual-expansion .vx-card{padding:16px}.w-reading article .visual-expansion .vx-flow>li{padding:14px 16px}.w-reading article .visual-expansion h3{font-size:1.12em}}
@media print{.w-reading article .visual-expansion{break-inside:auto}.w-reading article .visual-expansion .vx-card,.w-reading article .visual-expansion .vx-flow>li{break-inside:avoid;background:white}.w-reading article .visual-expansion .vx-grid,.w-reading article .visual-expansion .vx-grid--three{grid-template-columns:1fr}.w-reading article .visual-expansion .vx-dot{border:2px solid #34363b}.w-reading article .visual-expansion .vx-source a{overflow-wrap:anywhere}}

.w-reading article .visual-expansion .vx-viewport{position:relative;padding-top:0}.w-reading article .visual-expansion .vx-viewport-boundary{position:absolute;left:0;right:0;border-top:2px dashed #767870;text-align:right}.w-reading article .visual-expansion .vx-viewport-boundary span{background:#f3f3f1;padding:1px 4px}
.w-reading article .visual-expansion .vx-touch-model{border:1px solid #767870;border-radius:12px;background:white;padding:16px;position:relative;min-height:150px;margin:12px 0}
.w-reading article .visual-expansion .vx-choice-strip{display:flex;justify-content:space-between;gap:8px;background:#eeeeea;border-radius:4px;padding:10px;font-size:.9em}
.w-reading article .visual-expansion .vx-finger{position:absolute;left:calc(50% - 1.2em);top:.35em;bottom:auto;width:2.4em;height:3.8em;border-radius:28px 28px 10px 10px;background:#b6b5ae;border:2px solid #565861;z-index:1}
.w-reading article .visual-expansion .vx-finger--moving{transform:rotate(-18deg);bottom:4px}
.w-reading article .visual-expansion .vx-choice-name{padding:6px 8px;background:#34363b;color:white;text-align:center;margin:0 0 12px;border-radius:4px;font-size:.9em}
.w-reading article .visual-expansion .vx-choice-closed{border:1px dashed #767870;padding:12px;text-align:center;background:#fff;margin-top:14px}
.w-reading article .visual-expansion .vx-toolbar{display:flex;gap:12px;align-items:center;border:1px solid #767870;border-radius:6px;background:white;padding:10px;margin:14px 0}
.w-reading article .visual-expansion .vx-toolbar--focused{outline:2px solid #34363b;outline-offset:3px}
.w-reading article .visual-expansion .vx-tooltip-inset{border:1px dashed #767870;padding:14px;margin:18px 0;background:#f3f3f1}
.w-reading article .visual-expansion .vx-tooltip-inset strong{display:inline-block;background:#34363b;color:white;padding:6px 10px;border-radius:4px}



/* Proportional density/occlusion: stable relationships while reader text grows. */
.w-reading article .visual-expansion .vx-list li{line-height:1.85;padding:.3em 0}
.w-reading article .visual-expansion .vx-viewport{min-height:17.25em}
.w-reading article .visual-expansion .vx-viewport-boundary{top:13.5em;font-size:1em;line-height:1.4}
.w-reading article .visual-expansion .vx-viewport-boundary span{font-size:.7em}
.w-reading article .visual-expansion .vx-viewport .vx-list--roomy li{padding:.7em 0}
.w-reading article .visual-expansion .vx-final-line{position:relative;min-height:1.85em}
.w-reading article .visual-expansion .vx-final-line .vx-cover{top:0;left:0;right:0;bottom:auto;padding:.15em .4em;font-size:1em;line-height:1.55;box-shadow:none}

.w-reading article .visual-expansion .vx-choice-row{position:relative;min-height:4.6em;overflow:hidden}
.w-reading article .visual-expansion .vx-choice-row .vx-finger{top:.35em;left:calc(50% - 1.2em);bottom:auto;width:2.4em;height:3.8em;border-radius:1.4em 1.4em .5em .5em}
.w-reading article .visual-expansion .vx-choice-row .vx-finger--moving{top:.35em;bottom:auto;height:3.2em}

@media print{.w-reading article .visual-expansion.article-photo{break-inside:auto}}

.w-reading article .visual-expansion.article-photo>img+.vx-grid{margin-top:24px}
