/* Real project media keep the existing panels, dimensions and lighting. */
.view .work-cover { position: relative; display: block; overflow: hidden; background: #101c23; }
.work-cover img { display: block; width: 100%; height: 100%; object-fit: contain; }
.work-cover > span { position: absolute; inset: auto 0 0; padding: 28px 14px 12px; background: linear-gradient(transparent,#071219ee); color: #baffdf; font: 600 calc(var(--text-scale) * 13px)/1.5 var(--mono); }
.view .project-summary { padding: 20px; color: #d1ddec; font: calc(var(--text-scale) * 15px)/1.6 var(--font); }
.project-summary .micro { font-size: calc(var(--text-scale) * 11px); }
.project-summary .short-rule { margin: 16px 0; }
.view .project-detail > header h3 { white-space: normal; overflow-wrap: break-word; }
.view .project-facts dd { overflow-wrap: anywhere; }
#real-project-link a { display: inline-flex; align-items: center; min-height: 44px; padding: 10px 14px; border: 1px solid #5bebbe80; border-radius: 6px; color: #8fffd2; background: #1e66582b; font: 600 calc(var(--text-scale) * 13px)/1.5 var(--mono); }
.view .project-piece > div.art { background: none; }
.project-piece .art img { width: 100%; height: 100%; object-fit: cover; object-position: center; opacity: .75; }
.view .project-piece > div.art::after { background: linear-gradient(180deg,#0e192650,#0c1723d9 40%,#0a1623f5 85%); }
.view .project-piece .open-piece { display: grid; place-items: center; text-decoration: none; }
.view .project-piece > .micro { white-space: normal; }
@media (min-width: 600px) and (max-width: 1199px) { .view .project-summary { grid-column: 1 / -1; } }
@media (min-width: 960px) { .view .project-summary { font-size: 16px; padding: 22px; } }