/* Project previews retain a fixed toolbar while the design scrolls. */
.portfolio-popup { margin:auto; padding:0; width:min(1440px,calc(100% - 2rem)); height:calc(100dvh - 2rem); max-width:none; max-height:none; border:1px solid var(--border-strong); border-radius:var(--r-card); background:var(--canvas); color:var(--ink-strong); overflow:hidden; box-shadow:var(--shadow-raised); }
.portfolio-popup[open] { display:flex; flex-direction:column; }
.portfolio-popup::backdrop { background:var(--offer-backdrop); backdrop-filter:blur(5px); }
.portfolio-popup__bar { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-shrink:0; padding:1rem 1.5rem; border-bottom:1px solid var(--border-strong); background:var(--surface); }
.portfolio-popup__eyebrow { color:var(--ink-muted); font-size:var(--text-xs); }
.portfolio-popup__bar h2 { margin:.15rem 0 0; font-size:var(--text-lg); font-weight:var(--font-bold); }
.portfolio-popup__tools { display:flex; align-items:center; gap:1.25rem; }
.portfolio-popup__tools a { display:inline-flex; align-items:center; gap:.5rem; color:var(--ink-soft); font-size:var(--inner-action-size); }
.portfolio-popup__tools button { display:flex; justify-content:center; align-items:center; width:38px; height:38px; border:1px solid var(--border-strong); border-radius:var(--r-pill); background:var(--surface); color:var(--ink-strong); cursor:pointer; }
.portfolio-popup__tools a:focus-visible,.portfolio-popup__tools button:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.portfolio-popup__body { flex:1; min-height:0; position:relative; }
.portfolio-popup__body iframe { width:100%; height:100%; border:0; display:block; background:var(--canvas); }
.portfolio-popup__body iframe[hidden] { display:none; }
.portfolio-popup__loading { padding:2rem; color:var(--ink-muted); }
body.portfolio-popup-open { overflow:hidden; }
/* Applied only inside the compact project document. */
.portfolio-embedded, .portfolio-embedded body { height:100%; overflow:hidden; }
.portfolio-embedded main { margin:0; padding:0; height:100%; display:flex; flex-direction:column; }
.pv-embed-heading { padding:1.25rem 1.5rem; background:var(--chrome); color:var(--chrome-ink); flex-shrink:0; }
.pv-embed-heading > span { color:var(--chrome-ink-muted); font-size:var(--text-xs); }
.pv-embed-heading h1 { margin:.4rem 0 0; color:var(--chrome-ink); font-size:clamp(1.2rem,2.2vw,1.8rem); line-height:var(--leading-title); font-weight:var(--font-bold); }
.portfolio-embedded .pv-wrap { padding:0; flex:1; min-height:0; }
.portfolio-embedded .pv-wrap > .container { width:100%; max-width:none; padding:0; height:100%; }
.portfolio-embedded .pv-layout { height:100%; min-height:0; grid-template-rows:minmax(0,1fr); grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); gap:0; }
.portfolio-embedded .pv-gallery-col { height:100%; overflow:auto; overscroll-behavior:contain; min-height:0; padding:1.25rem; scrollbar-width:thin; }
.portfolio-embedded .pv-info-col { position:static; max-height:none; height:100%; min-height:0; overflow:auto; overscroll-behavior:contain; padding:1.5rem; border-left:1px solid var(--border-strong); order:0; }
.portfolio-embedded .pv-project-strip { border-radius:var(--r-inner); }
@media(max-width:640px) {
 .portfolio-popup { width:calc(100% - .75rem); height:calc(100dvh - .75rem); border-radius:var(--r-inner); }
 .portfolio-popup__bar { padding:.75rem; gap:.5rem; }
 .portfolio-popup__tools { gap:.65rem; }
 .portfolio-popup__tools a { font-size:var(--text-xs); }
 .portfolio-popup__eyebrow { display:none; }
 .portfolio-embedded, .portfolio-embedded body { overflow:auto; }
 .portfolio-embedded main { height:auto; min-height:100%; }
 .portfolio-embedded .pv-layout { height:auto; grid-template-columns:minmax(0,1fr); grid-template-rows:auto auto; }
 .portfolio-embedded .pv-gallery-col { height:65dvh; max-height:65dvh; padding:.75rem; }
 .portfolio-embedded .pv-info-col { height:auto; overflow:visible; padding:1.25rem; border-left:0; border-top:1px solid var(--border-strong); }
}