/* Keep classification at the left edge and the sphere in the main field. */
#portfolioMain{height:auto;min-height:calc(100dvh - 150px)}
#portfolioMain .explorer{display:grid;grid-template-columns:200px minmax(0,1fr);grid-template-rows:auto auto minmax(380px,1fr) auto;align-content:start}
.medium-rail{grid-column:1;grid-row:1/5;min-width:0;border-right:1px solid var(--line);padding:14px 7px;background:#f8f8f4}
.medium-rail>summary{display:none}
.medium-rail .medium-strip{margin:0;padding:0;display:block;border:0;background:transparent}
.medium-rail .medium-label{display:block;padding:0 4px 9px;line-height:1.5;font-size:14px;font-weight:600}
.medium-rail #mediumNav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 3px;overflow:visible}
.medium-rail #mediumNav button{width:100%;min-height:30px;padding:3px 3px;gap:2px;text-align:left;justify-content:space-between;font-size:13px;font-weight:500;line-height:1.4;white-space:normal;border-radius:3px}
.medium-rail #mediumNav button span{min-width:0;white-space:nowrap}
.medium-rail #mediumNav button.medium-wide{grid-column:1/-1}
.medium-rail #mediumNav small{font-size:11px;white-space:nowrap;opacity:.8;flex-shrink:0}
#portfolioMain .view-head{grid-column:2;grid-row:1;margin:0 22px;padding:12px 0;min-height:50px}
#portfolioMain .dimension-tools{grid-column:2;grid-row:2;margin:10px 22px 0;padding:0}
#dimensionNav{gap:2px}#dimensionNav button{padding:5px 8px;font-size:14px}
.dimension-row{gap:8px}.dimension-label{font-size:13px}
#dimensionNote{font-size:12px;margin:5px 0;line-height:1.5}
#portfolioMain #stage{grid-column:2;grid-row:3;margin:8px 18px 0;height:clamp(380px,calc(100dvh - 310px),850px);min-height:380px;background-size:44px 44px;background-image:linear-gradient(#dce2e828 1px,transparent 1px),linear-gradient(90deg,#dce2e828 1px,transparent 1px)}
#portfolioMain #grid,#portfolioMain #empty{grid-column:2;grid-row:3}
#portfolioMain .bottom-bar{grid-column:2;grid-row:4;margin-top:8px;padding:9px 22px;flex-direction:row;flex-wrap:wrap}
#portfolioMain .bottom-bar p{font-size:12px}
@media(min-width:1600px){#portfolioMain .explorer{grid-template-columns:208px minmax(0,1fr)}.medium-rail{padding-left:9px;padding-right:9px}}
@media(max-width:760px){
 #portfolioMain .explorer{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto minmax(440px,1fr) auto}
 #portfolioMain .view-head{grid-column:1;grid-row:1;margin:0 16px}
 .medium-rail{grid-column:1;grid-row:2;padding:0 16px;border:0;background:transparent;position:relative;z-index:5}
 .medium-rail>summary{display:list-item;width:max-content;margin:0;padding:7px 10px;border:1px solid #c9754445;border-radius:3px;color:var(--orange);font-size:13px;background:#faf5ef;cursor:pointer}
 .medium-rail .medium-strip{position:absolute;left:16px;top:40px;width:min(270px,calc(100vw - 32px));padding:12px;background:#faf9f5;border:1px solid #c9754445;box-shadow:0 12px 28px #29303918;max-height:65dvh;overflow-y:auto}
 .medium-rail .medium-label{display:none}.medium-rail #mediumNav button{min-height:36px;font-size:13px}
 #portfolioMain .dimension-tools{grid-column:1;grid-row:3;margin:9px 16px 0}
 .dimension-label{display:none}#dimensionNav button{font-size:13px;padding:5px 7px}
 #categoryPicker{width:auto;max-width:100%;font-size:13px;min-height:32px;padding:4px 7px}
 #dimensionNote{display:none}.cross-search summary{font-size:13px;margin:0;padding:6px 0}
 #portfolioMain #stage{grid-column:1;grid-row:4;height:clamp(440px,65dvh,620px);min-height:440px;margin:4px 8px 0}
 #portfolioMain #grid,#portfolioMain #empty{grid-column:1;grid-row:4}
 #portfolioMain .bottom-bar{grid-column:1;grid-row:5;padding:10px 12px;justify-content:center}
}


#courseVideo{display:block;width:100%;height:70dvh;object-fit:contain;background:#16191d}
#groupAttachments:empty{display:none}#groupAttachments a{font-size:12px;color:var(--blue);margin-right:12px}
#resourceSearch{width:100%;font:inherit;padding:7px;border:1px solid var(--line);margin-top:10px}
#resourceList{padding-left:20px;max-height:230px;overflow:auto;font-size:12px;line-height:1.7}#resourceList li{margin-bottom:8px}#resourceList a{color:var(--blue);overflow-wrap:anywhere}
.course-gallery.videos{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}.course-gallery.videos img{height:220px}

/* Let the left taxonomy use roughly four fifths of the desktop height. */
@media(min-width:761px){
 .medium-rail .medium-label{font-size:15px}
 .medium-rail #mediumNav{min-height:calc(80dvh - 44px);grid-auto-rows:minmax(30px,1fr);gap:1px 3px}
 .medium-rail #mediumNav button{font-size:14px;padding:3px 2px;min-height:30px;align-items:center}
 .medium-rail #mediumNav small{font-size:12px}
}