/* Native vector portrait; white space is the frame. */
.reader-page.portfolio-page .reader-cover .portrait-cover {
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
  min-width: 0;
}
.reader-page.portfolio-page .reader-cover .portrait-sculpture {
  position: relative;
  width: 100%;
  max-width: 700px;
  height: 100%;
  max-height: 570px;
  min-width: 0;
  margin: 0 auto;
  border: 0;
  background: #fff;
  touch-action: pan-y pinch-zoom;
  user-select: none;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.reader-page.portfolio-page .reader-cover[data-cover-fit="natural"] .portrait-sculpture {
  height: clamp(170px, 44svh, 480px);
}
.portrait-sculpture[data-portrait-ready] { cursor: grab; }
.portrait-sculpture.is-dragging { cursor: grabbing; }
.portrait-sculpture:focus-visible { outline: 2px solid var(--blue, #294bff); outline-offset: 6px; }
.portrait-sculpture .portrait-fallback,
.portrait-sculpture .portrait-live {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: contain;
  border: 0;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
  background: transparent;
  pointer-events: none;
}
.portrait-sculpture[data-portrait-ready] .portrait-fallback { display: none; }
.portrait-live .portrait-ink { stroke: var(--ink, #25272a); }
.portrait-live .portrait-blue { stroke: var(--blue, #294bff); }
.portrait-live .portrait-accent { fill: var(--pink, #d22a83); stroke: none; }
@media (hover: hover) and (pointer: fine) and (forced-colors: none) {
  .portrait-sculpture[data-portrait-ready] { cursor: url("assets/cursor-hand-open.svg") 23 2, grab; }
  .portrait-sculpture.is-dragging { cursor: url("assets/cursor-hand-grasp.svg") 20 7, grabbing; }
}
@media (max-height: 560px) {
  .reader-page.portfolio-page .reader-cover[data-cover-fit="natural"] .portrait-sculpture { height: clamp(150px, 45svh, 250px); }
}
@media print {
  .reader-page.portfolio-page .reader-cover .portrait-sculpture,
  .reader-page.portfolio-page .reader-cover[data-cover-fit="natural"] .portrait-sculpture { height: 90mm; break-inside: avoid; }
  .portrait-sculpture .portrait-live { display: none; }
  .portrait-sculpture[data-portrait-ready] .portrait-fallback { display: block; }
}
