/* Keep approved artwork at its original 1536:1024 ratio. Gallery stays outside. */
.threaded-project .tm-stage{width:min(100%,620px);margin:0 auto 30px}
.threaded-project .tm-frame{aspect-ratio:3/2;border:0;background:transparent url('/assets/threaded-stage/frame.webp') center/contain no-repeat}
.threaded-project .tm-reveal{position:absolute;inset:24% 10% 9%;padding:0}
.threaded-project .tm-title{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4%;margin:0!important;padding:0}
.threaded-project .tm-word{width:92%;height:48%;gap:3px;grid-template-columns:repeat(8,minmax(0,1fr));align-items:start}
.threaded-project .tm-slot{width:100%;max-width:100%;height:100%;display:flex;justify-content:center;align-items:start}
.threaded-project .tm-letter{height:100%;width:auto;max-width:100%;object-fit:contain}
.threaded-project .tm-curtains{inset:22% 8% 8%}.threaded-project .tm-open{inset:44% 20% auto}
.contact-email{display:block;margin-top:24px;font-size:clamp(16px,1.7vw,22px);font-weight:600;color:var(--accent);overflow-wrap:anywhere;line-height:1.6;text-decoration:underline;text-underline-offset:5px}
@media(max-width:760px){.threaded-project .tm-stage{margin-bottom:24px}.threaded-project .tm-word{gap:2px}.threaded-project .tm-open{inset:43% 15% auto;font-size:13px;padding:10px}.contact-email{font-size:16px}}
.threaded-project .tm-word{width:84%}.threaded-project .tm-slot{height:auto;display:block}.threaded-project .tm-letter{width:100%;height:auto;max-height:none}
/* I is naturally narrower: give its entire sprite (rope + canvas) a smaller slot. */
.threaded-project .tm-slot:has([data-letter="13"]){width:52%;justify-self:center}
/* Curtains bleed beneath the frame; the frame is a foreground layer. */
.threaded-project .tm-frame{background:none;isolation:isolate}
.threaded-project .tm-frame::after{content:'';position:absolute;inset:0;background:url('/assets/threaded-stage/frame.webp') center/100% 100% no-repeat;z-index:4;pointer-events:none}
.threaded-project .tm-reveal{z-index:1}
.threaded-project .tm-curtains{inset:18% 4% 4%;z-index:3}
.threaded-project .tm-panel{width:50.2%;background:#0b1b23}
.threaded-project .tm-panel img{top:-16%;height:140%;width:224%;left:-12%;object-fit:fill}
.threaded-project .tm-right img{left:-112%}
.threaded-project .tm-frame .tm-open{z-index:5}
@media print{.threaded-project .tm-frame::after{display:none}}
/* Preserve the original letter sizes and spacing, moving the whole title slightly up. */
.threaded-project .tm-reveal{transform:translateY(-5%)}
