/* Shared text-object showcases, following Setzo's finite scatter and reveal. */
.project-showcase{margin:12px 0 30px}
.project-stage{position:relative;height:340px;isolation:isolate}
.project-toggle{position:absolute;inset:0;z-index:2;width:100%;height:100%;padding:0;border:0;border-radius:12px;background:transparent;color:var(--accent);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.project-toggle:disabled{cursor:default}
.project-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.project-ascii{position:absolute;left:50%;top:50%;margin:0;transform:translate(-50%,-50%);font:8px/9.6px monospace;white-space:pre;text-align:left;pointer-events:none;user-select:none}
.project-canvas{width:100%;height:100%;display:block;pointer-events:none}
.project-showcase[data-ready] .project-ascii{visibility:hidden}
.project-reveal{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transform:translateY(12px) scale(.94);transition:opacity .28s,transform .65s cubic-bezier(.16,1,.3,1),visibility .65s;pointer-events:none}
.project-showcase[data-expanded="true"] .project-reveal{opacity:1;visibility:visible;transform:translateY(0) scale(1);transition-delay:.1s}
.project-shot{width:91%;height:auto;max-height:305px;object-fit:contain;border-radius:8px;box-shadow:0 12px 28px #00000024;background:#0b1017;transform:rotate(-2deg)}
.project-shot-secondary{position:absolute;right:0;bottom:12px;width:43%;max-height:180px;transform:rotate(5deg);box-shadow:0 8px 20px #00000032}
.project-reveal:has(.project-shot-secondary)>.project-shot:first-child{width:85%;margin-right:auto;transform:translateY(-12px) rotate(-3deg)}
.project-hint{min-height:40px;text-align:center;color:var(--quiet);font-size:11px;line-height:1.6;padding-top:7px}
.project-hint-open{display:none}
.project-showcase[data-expanded="true"] .project-hint-rest{display:none}
.project-showcase[data-expanded="true"] .project-hint-open{display:block}
.project-showcase:not([data-ready]) .project-hint{visibility:hidden}
.project-fallback{font-size:12px;text-align:center;color:var(--muted)}
.project-fallback a{text-decoration:underline}
.learning-flow{width:100%;padding:24px 20px;color:var(--ink)}
.learning-flow>p{font-family:"Instrument Serif",Georgia,serif;font-size:25px;text-align:center;line-height:1.3}
.learning-map{display:block;width:100%;height:115px;color:var(--accent);overflow:visible;margin:12px 0 0}
.learning-map line,.learning-map path,.learning-map circle{stroke:currentColor;stroke-width:1;fill:none}
.learning-map .map-node{fill:var(--paper)}
.learning-map text{fill:var(--ink);font:12px "DM Sans",sans-serif;text-anchor:middle}
.learning-map .map-label{fill:var(--quiet);font-size:10px}
.learning-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;list-style:none;padding:0;margin:8px 0 0}
.learning-steps li{padding-top:12px;border-top:1px solid var(--line)}
.learning-steps strong{display:block;font-size:13px;color:var(--accent);margin-bottom:4px}
.learning-steps span{display:block;font-size:11px;line-height:1.6;color:var(--muted)}
.project-showcase[data-kind="rewatch"] .project-stage{height:340px}
@media(max-width:600px){
 .project-stage,.project-showcase[data-kind="rewatch"] .project-stage{height:270px}
 .project-ascii{font-size:4.6px;line-height:5.52px}
 .project-shot{width:98%;max-height:235px;border-radius:5px}
 .project-reveal:has(.project-shot-secondary)>.project-shot:first-child{width:94%;transform:translateY(-15px) rotate(-2deg)}
 .project-shot-secondary{width:50%;bottom:17px}
 .learning-flow{padding:8px 0}
 .learning-flow>p{font-size:22px}
 .learning-map{height:96px;margin-top:7px}
 .learning-steps{gap:10px;margin-top:0}
 .learning-steps strong{font-size:12px}
 .learning-steps span{font-size:10px}
 .project-hint{font-size:10px;min-height:42px}
}
@media(prefers-reduced-motion:reduce){.project-reveal{transition:none;transform:none}}
@media print{.project-stage{height:auto;min-height:260px}.project-toggle{position:relative;height:260px}.project-canvas{display:none}.project-showcase[data-ready] .project-ascii{visibility:visible}.project-reveal,.project-hint{display:none}}