.responsive-pottery{position:relative;width:100%;padding:0!important;margin:0!important;overflow:visible;columns:auto}
.responsive-pottery figure{margin:0!important;transform:none!important}
.responsive-pottery figure[hidden]{display:none!important}
.responsive-pottery a,.responsive-pottery img{display:block;max-width:none}
@media(min-width:901px){
 .left{display:flex;flex-direction:column;height:calc(100dvh - 44px);padding:0}
 .left .index-nav a,.left .index-nav a.logo{font-size:clamp(48px,min(6.8vw,10.5vh),96px);line-height:.88}
 .left .personal-images{position:relative;inset:auto;width:94%;left:0;margin-top:26px;display:grid;grid-template-columns:90px minmax(0,1fr);gap:25px;align-items:end;flex:1;min-height:0;padding:0 10px 8px}
 .left .personal-images .portrait-photo{position:relative;width:100%;height:100%;min-height:0;display:flex;justify-content:flex-end;align-items:flex-end;padding:0}
 .left .personal-images .portrait-photo img{position:static;inset:auto;height:100%;width:auto;max-width:100%;max-height:100%;object-fit:contain;aspect-ratio:3/4;margin:0}
 .left .personal-images .molly-photo{position:static;transform:none;width:90px;padding:0;margin:0}
 .left .personal-images .molly-photo .laptop-photo{position:static;width:90px;height:auto;max-height:140px;object-fit:contain}
 .left .personal-images .molly-photo figcaption{width:100%;margin:10px 0 0;font-size:10px;text-align:left}
 .content{min-width:0}.project,.project summary,.project .detail{max-width:100%;min-width:0}
}
@media(max-width:900px){
 .responsive-pottery.mobile-composition{display:grid;grid-template-columns:minmax(0,1fr);gap:36px 20px;padding:35px 20px 70px!important}
 .responsive-pottery.mobile-composition figure{min-width:0;align-self:center}
 body:not(.editing-layout) .responsive-pottery.mobile-composition figure{translate:none!important;rotate:0deg!important;scale:1!important;transform:none!important}
 .responsive-pottery.mobile-composition img{max-width:100%;max-height:300px;object-fit:contain}
 .responsive-pottery.mobile-composition .fence-photo{grid-column:1/-1}
 .photos{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:36px 20px!important;padding:20px 0 70px!important}
 .photos figure:nth-child(n){grid-column:auto!important;margin:0!important;transform:none!important;min-width:0;width:100%}
 .photos img{width:100%;height:auto;max-width:100%}
 .music-list,.quilt{width:100%;max-width:100%}.music-list .artist-name{overflow-wrap:anywhere}
 .system-overview ol{flex-wrap:wrap}
}

@media(max-width:900px){body:has(.responsive-pottery) .layout-editor{display:none}body:not(.editing-layout) .photos figure{translate:none!important;rotate:0deg!important;scale:1!important}}

@media(max-width:900px){
 .responsive-pottery.mobile-composition figure[data-photo-source="assets/pottery-new-cutouts/03.webp"] img{width:88%!important;margin-inline:auto;max-height:264px;}
 .responsive-pottery.mobile-composition figure[data-photo-source="assets/pottery-new-cutouts/15.webp"] a{height:300px!important;display:flex;align-items:center;justify-content:center;overflow:visible;}
 .responsive-pottery.mobile-composition figure[data-photo-source="assets/pottery-new-cutouts/15.webp"] img{width:auto!important;height:300px!important;max-width:100%;transform:rotate(-60deg) scale(.78);}
}

@media(max-width:900px){.responsive-pottery.mobile-composition figure[data-photo-source="assets/pottery-new-cutouts/15.webp"] img{transform:rotate(-60deg) scale(.88);}}

/* Keep mobile spacing tied to the displayed photo rather than oversized image boxes. */
@media(max-width:900px){
 .responsive-pottery.mobile-composition{row-gap:32px;}
 .responsive-pottery.mobile-composition figure{line-height:0;}
 .responsive-pottery.mobile-composition a{display:flex;justify-content:center;align-items:center;height:auto!important;line-height:0;}
 .responsive-pottery.mobile-composition img{width:auto!important;height:auto!important;max-width:100%;max-height:300px;margin-inline:auto;}
 .responsive-pottery.mobile-composition figure[data-photo-source="assets/pottery-new-cutouts/01.webp"] img{max-height:235px;max-width:80%;}
 .responsive-pottery.mobile-composition figure[data-photo-source="assets/pottery-new-cutouts/03.webp"] img{max-height:264px;}
 .responsive-pottery.mobile-composition figure[data-photo-source="assets/pottery-new-cutouts/15.webp"] a{height:300px!important;}
 .responsive-pottery.mobile-composition figure[data-photo-source="assets/pottery-new-cutouts/15.webp"] img{height:300px!important;}
}

@media(max-width:900px){
 .left .personal-images{grid-template-columns:minmax(0,1fr) 82px;}
 .left .personal-images .portrait-photo{grid-column:1;grid-row:1;}
 .left .personal-images .molly-photo{grid-column:2;grid-row:1;}
 .page-ascii{font-size:calc(100vw / 26);line-height:calc(100dvh / 20);}
}

@media(max-width:900px){.left #molly-drag{left:calc(76.5% - 37.5px);right:auto;top:192px;width:75px!important;}}

@media(max-width:900px){.left #molly-drag{left:calc(84.1% - 37.5px);right:auto;top:144px;width:75px!important;}}

/* Anchor the two homepage photos to opposite sides of the narrow layout. */
@media(max-width:900px){
 .left .personal-images{width:100%;max-width:none;margin:32px 0 0;grid-template-columns:minmax(0,1fr) 82px;gap:22px;}
 .left .personal-images .portrait-photo{justify-self:start;max-width:296px;}
 .left .personal-images .portrait-photo img{max-width:296px;width:100%;}
 .left .personal-images .molly-photo{justify-self:end;}
}

/* Short desktop windows reduce display headings while keeping reading text consistent. */
@media(min-width:901px) and (max-height:650px){
 .intro h1{font-size:clamp(42px,12vh,74px);}
 .heading h2,.two h2,.contact-section h2,.etc-section h2,#experience .education h2{font-size:clamp(32px,7.5vh,48px);}
}

#info .tech-stack h2{font-size:24px;line-height:1.2;}

@media(max-width:900px){
 #work .system-overview ol{display:flex;flex-direction:column;flex-wrap:nowrap;gap:24px;align-items:stretch}
 #work .system-overview li{flex:0 0 auto;width:100%}
 #work .system-overview li+li::before{content:'\2193';left:50%;top:-23px;transform:translateX(-50%);line-height:22px}
}