/* Study surroundings use the home world's bright illustrated colors; teaching art stays whole. */
body.learning-calm-shelf #v-map #worldWrap,body.learning-calm-shelf #v-map #bookDock,body.learning-calm-shelf #v-map #reviewDock,body.learning-calm-shelf #v-module-map .mw-map-content,body.learning-calm-shelf #v-module-map .mw-landscape,body.learning-calm-shelf #v-module-map .mw-river-glint,body.learning-calm-shelf #v-module-map .mg-companions{visibility:hidden;pointer-events:none}
body.learning-calm-shelf #v-module-map,body.learning-calm-shelf #shelf,body.learning-calm-course[data-view=game] #v-game{background:transparent}
body.learning-calm-shelf #shelf .library{box-shadow:0 7px 0 #957b5c,0 14px 35px #58492b20}
#shelf .smart-shelf-island,body.learning-calm-shelf #shelf .library-thumbnail:after{display:none}
body.learning-calm-course #bg{visibility:visible}
body[data-view=game] #qarea,body[data-view=game] #qarea :is(.bk-wrap,.mt-wrap,.bk-learn){min-width:0}
/* The frame follows the full intrinsic bitmap, including padding and border. No fixed image height. */
body[data-view=game] #qarea :is(.bk-pic,.mt-pic){
 width:min(100%,calc((var(--learning-image-height,440px) - var(--learning-frame-y,20px)) * var(--learning-image-ratio,1) + var(--learning-frame-x,20px)))!important;
 height:auto!important;min-height:0!important;max-height:none!important;max-width:100%!important;aspect-ratio:auto!important;box-sizing:border-box!important;
 padding:7px;border:3px solid var(--ink);border-radius:19px;overflow:visible;background:#fffdf4;box-shadow:0 5px 0 #8d795e;margin:0;justify-self:center;align-self:center;
}
body[data-view=game] #qarea :is(.bk-pic,.mt-pic)>img{display:block;width:100%;height:auto!important;min-height:0;max-height:none!important;max-width:100%;aspect-ratio:auto;object-fit:contain;object-position:center;border-radius:0}
/* Labels use the same content coordinate plane as the bitmap. */
body[data-view=game] #qarea .mt-pic:has(.mt-mark){padding:0;border-radius:0}
body[data-view=game] #qarea .bk-pic:hover{transform:none}
/* The large picture control lives beside the question heading; no duplicate overlays on artwork. */
body[data-view=game] #qarea :is(.bk-pic,.mt-pic)>.bk-zoom{display:none}
body[data-view=game] #qarea img[data-course-image-kind=standalone]{display:block;max-width:100%;max-height:var(--learning-image-height,440px);width:auto;height:auto;object-fit:contain;object-position:center;margin-inline:auto;border-radius:0}
body[data-view=game] #qarea img[data-course-image-kind=thumb]{display:block;width:auto!important;height:auto!important;max-width:100%;max-height:clamp(60px,16dvh,150px);aspect-ratio:auto;object-fit:contain;border-radius:0}
body[data-view=game] #qarea :is(.bk-card1,.bk-node,.mt-pickopt,.md-picture){min-width:0}
body[data-view=game] #qarea .bk-node.img{min-width:0;width:fit-content;max-width:100%;padding:8px}
body[data-view=game] #qarea .bk-card1{padding:10px}
body[data-view=game] #qarea .module-scene-stage{max-width:min(100%,calc(var(--learning-image-height,440px) * var(--learning-image-ratio,1)));height:auto}
body[data-view=game] #qarea .module-scene-stage>img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}
#sheet .bk-prow{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
#sheet :is(.bk-prow img,.bk-dimg,.sc-wick-reference){max-width:100%;height:auto;object-fit:contain;border-radius:0}
#sheet .zh-ybline{flex-wrap:wrap}
#qarea :is(.bk-cards,.fl-doc,.mz-write-picture,.module-sort-inspector),#sheet .bk-prow>*{min-width:0}
.bk-lightbox{box-sizing:border-box;grid-template-rows:minmax(0,1fr) auto;gap:10px;padding:14px;height:var(--app-height,100dvh)}
.bk-lightbox img{width:auto;height:auto;max-width:100%;max-height:100%;min-height:0;object-fit:contain;border-radius:0}
.bk-lightbox span{margin:0;min-height:30px;line-height:30px;text-align:center}
@media(max-width:740px){body[data-view=game] #qarea :is(.bk-wrap,.mt-wrap,.bk-learn){gap:14px}}
@media(orientation:landscape) and (max-height:500px){body[data-view=game] #qarea :is(.bk-wrap,.mt-wrap,.bk-learn){grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center;gap:12px}body[data-view=game] #qarea :is(.bk-wrap.nopic,.mt-wrap.nopic){grid-template-columns:minmax(0,1fr)}}
.course-image-open{min-width:44px;min-height:44px;flex:none;padding:5px 9px;border:2px solid var(--ink);border-radius:11px;background:#fff0bd;color:var(--ink);font:700 14px/1.25 var(--f-body);cursor:zoom-in;box-shadow:0 3px 0 #a78554}
.course-image-open[hidden]{display:none!important}
#board .qhead h2{min-width:0;flex:1;overflow-wrap:anywhere}
.course-image-open:focus-visible,.course-image-viewer button:focus-visible{outline:3px solid #2379aa;outline-offset:3px}
.course-image-viewer{position:fixed;inset:0;z-index:12000;display:grid;place-items:center;background:#132c3bd9;box-sizing:border-box;height:var(--app-height,100dvh);padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}
.course-image-viewer>section{display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:8px;width:min(1400px,100%);height:100%;min-height:0;min-width:0;padding:10px;box-sizing:border-box;border:3px solid var(--ink);border-radius:18px;background:#fffaf0}
.course-image-tools{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0}
.course-image-tools button{min-width:44px;min-height:44px;border:2px solid var(--ink);border-radius:10px;padding:4px 10px;background:#ffe09a;color:var(--ink);font:700 14px var(--f-body);cursor:pointer;flex:none}
.course-image-tools button:disabled{opacity:.35;cursor:default}
.course-image-tools span{font:800 16px var(--f-num);min-width:42px;text-align:center;white-space:nowrap}
.course-image-frame{min-width:0;min-height:0;overflow:hidden;display:grid;place-items:center;background:#f4f2e9;touch-action:pan-x pan-y pinch-zoom}
.course-image-frame>img{display:block;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;object-position:center;min-width:0;min-height:0}
.course-image-caption{margin:0;font:600 14px/1.4 var(--f-body);max-height:3em;overflow:auto;text-align:center;overflow-wrap:anywhere}
.course-image-viewer[data-detail=true] .course-image-frame{display:block;overflow:auto;overscroll-behavior:contain}
.course-image-viewer[data-detail=true] .course-image-frame>img{width:var(--course-detail-width);height:auto;max-width:none;max-height:none;margin:0 auto}
@media(max-width:450px){.course-image-tools{gap:4px}.course-image-tools button{padding:4px 7px;font-size:13px}.course-image-viewer>section{padding:6px;gap:6px}.course-image-caption{font-size:13px}}

body[data-view=game] #qarea .module-sort-item img[data-course-image-kind=thumb]{max-height:65px;max-width:min(100%,90px)}

body[data-view=game] #qarea .lt-chip img[data-course-image-kind=thumb]{max-height:64px}
