/* Full project pages keep the dense reading style, without modal constraints. */
#explorer-view[hidden], #project-page[hidden], #project-page-share[hidden] { display:none; }
#project-page { --project-page-width:1600px; --project-page-gutter:clamp(18px,3vw,48px); --text-body:.875rem; --text-secondary:.75rem; --text-caption:.75rem; --text-small:.75rem; font-size:var(--text-body); line-height:1.45; padding-bottom:max(28px,env(safe-area-inset-bottom)); }
.project-page-nav { position:sticky; top:0; z-index:800; display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:56px; padding:6px max(var(--project-page-gutter),calc((100% - var(--project-page-width))/2 + var(--project-page-gutter))); background:var(--paper); border-bottom:1px solid var(--border); }
.project-back, .project-share { display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:8px 0; color:var(--accent); font-size:.875rem; font-weight:600; text-decoration:none; }
.project-back .icon { transform:rotate(180deg); }
#project-detail { width:100%; max-width:var(--project-page-width); margin:0 auto; padding:24px var(--project-page-gutter); }
#detail-title:focus { outline:none; }
#project-page h1 { font-size:clamp(1.875rem,3.5vw,2.5rem); line-height:1.12; margin:12px 0; max-width:900px; }
#project-page p { color:var(--muted); line-height:1.5; }
#project-page .project-overview { margin-bottom:20px; }
#project-page .project-overview .detail-summary { max-width:76ch; margin:12px 0 0; color:var(--ink); }
.project-layout { display:grid; grid-template-columns:minmax(0,1fr) 300px; align-items:start; gap:32px; }
.project-sidebar { grid-column:2; grid-row:1; min-width:0; padding:0 0 0 20px; border-left:1px solid var(--border); }
.project-story { grid-column:1; grid-row:1; min-width:0; }
#project-page .detail-facts { grid-template-columns:1fr; margin:0 0 12px; padding:0 0 12px; border-top:0; gap:14px; }
#project-page .detail-facts p { margin-bottom:0; }
#project-page .detail-facts strong { font-size:.875rem; }
#project-page .detail-facts .big-cost { font-size:1.5rem; }
#project-page .project-gallery { margin:0 0 18px; }
#project-page .gallery-open { min-height:44px; }
#project-page .detail-sources { margin:22px 0 16px; }
/* Keep all three actions together, including narrow mobile layouts. */
#project-detail .detail-footer { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1fr) minmax(0,1.3fr); align-items:stretch; gap:8px; width:100%; max-width:440px; margin-top:14px; }
#project-detail .detail-footer button { min-width:0; min-height:44px; justify-content:center; gap:6px; padding:8px; font-size:.8125rem; font-weight:500; line-height:1.25; text-align:center; white-space:normal; overflow-wrap:anywhere; }
#project-detail .detail-footer .icon { flex:none; width:16px; height:16px; }
#project-page .project-unavailable { padding:24px 0; min-height:40svh; }
#project-page .project-unavailable a { text-decoration:none; }
#project-page .project-loading { min-height:40svh; padding:32px 0; color:var(--muted); }
@media(max-width:800px) {
  .project-layout { display:flex; flex-direction:column; gap:18px; }
  .project-sidebar, .project-story { width:100%; }
  .project-sidebar { padding:0; border-left:0; }
  #project-page .detail-facts { grid-template-columns:1fr 1fr; }
  #project-page .detail-facts > div:first-child { grid-column:1/-1; }
  #project-page .detail-facts .detail-wide { grid-column:auto; }
  #project-detail { padding:18px max(16px,env(safe-area-inset-left)) 24px max(16px,env(safe-area-inset-right)); }
  .project-page-nav { padding-inline:max(16px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-right)); }
}
@media(max-width:360px) { #project-page .detail-facts { grid-template-columns:1fr; } }
