@media screen {
  .painting-open {
    display: inline-flex; align-items: center; min-height: 44px;
    color: var(--muted); font: inherit;
    text-decoration: underline; text-underline-offset: .2em;
  }
  .painting-open:hover { color: var(--ink); }
  html.painting-viewer-open, .painting-viewer-open body { overflow: hidden; }
  .painting-viewer {
    --viewer-paper: #eeeae0; --viewer-ink: #21372d; --viewer-hair: #bbc3b5;
    position: fixed; inset: 0; width: 100%; height: 100%; height: 100dvh;
    max-width: none; max-height: none; margin: 0; padding: 0; border: 0;
    background: var(--viewer-paper); color: var(--viewer-ink);
    font: 400 1rem/1.5 var(--sans,Arial,sans-serif); overscroll-behavior: none;
  }
  .painting-viewer[data-scheme="night"] { --viewer-paper: #111e18; --viewer-ink: #dce5d9; --viewer-hair: #465649; }
  .painting-viewer[open] { display: flex; flex-direction: column; }
  .painting-viewer::backdrop { background: #111e18; }
  .painting-viewer__bar {
    flex: none; display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem;
    padding: max(.65rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) .65rem max(1rem,env(safe-area-inset-left));
    border-bottom: 1px solid var(--viewer-hair);
  }
  .painting-viewer__heading { flex: 1 1 14rem; min-width: 0; }
  .painting-viewer__title { margin: 0; font: 400 clamp(1.15rem,2.5vw,1.5rem)/1.25 Georgia,serif; color: inherit; letter-spacing: -.015em; }
  .painting-viewer__edition { margin: .15rem 0 0; font-size: .75rem; }
  .painting-viewer__close { order: 1; }
  .painting-viewer__tools { display: flex; align-items: center; flex-wrap: wrap; gap: .35rem; }
  .painting-viewer button, .painting-viewer__file {
    display: inline-flex; align-items: center; justify-content: center;
    min-height: 44px; min-width: 44px; padding: .4rem .65rem;
    border: 1px solid var(--viewer-hair); border-radius: 2px;
    background: transparent; color: inherit; font: inherit; font-size: .8rem;
    line-height: 1.3; text-decoration: none; cursor: pointer;
  }
  .painting-viewer button:hover, .painting-viewer__file:hover { border-color: currentColor; }
  .painting-viewer button:disabled { opacity: .4; cursor: default; }
  .painting-viewer :focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
  .painting-viewer__percent { min-width: 3.5em; text-align: center; font-size: .75rem; font-variant-numeric: tabular-nums; }
  .painting-viewer [data-fit] { gap: .4em; }
  .painting-viewer [data-fit] svg { flex: none; }
  .painting-viewer__stage {
    position: relative; flex: 1 1 auto; min-height: 0; overflow: hidden;
    touch-action: none; overscroll-behavior: none; user-select: none;
    background: var(--viewer-paper); cursor: zoom-in;
  }
  .painting-viewer__stage[data-zoomed="true"] { cursor: grab; }
  .painting-viewer__stage[data-dragging="true"] { cursor: grabbing; }
  .painting-viewer .painting-viewer__image {
    display: block; position: absolute; top: 0; left: 0; max-width: none; max-height: none; max-inline-size: none;
    transform-origin: 0 0; pointer-events: none; -webkit-user-drag: none;
  }
  .painting-viewer__foot {
    flex: none; display: flex; flex-wrap: wrap; align-items: center; gap: .3rem 1rem;
    justify-content: space-between; padding: .5rem max(1rem,env(safe-area-inset-right)) max(.5rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left));
    border-top: 1px solid var(--viewer-hair); font-size: .7rem; line-height: 1.5;
  }
  .painting-viewer__status { margin: 0; }
  .painting-viewer__hint { margin: 0; }
  .painting-viewer__retry[hidden] { display: none; }
  @media (max-width: 42rem) {
    .painting-viewer__heading { flex-basis: calc(100% - 6rem); }
    .painting-viewer__close { order: 0; margin-left: auto; }
    .painting-viewer__tools { flex-basis: 100%; }
    .painting-viewer__file { margin-left: auto; }
  }
  @media (max-width: 30rem) {
    .painting-viewer__bar { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .35rem .5rem; padding: max(.5rem,env(safe-area-inset-top)) max(.5rem,env(safe-area-inset-right)) .5rem max(.5rem,env(safe-area-inset-left)); }
    .painting-viewer__title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
    .painting-viewer__close { grid-column: 2; grid-row: 1; }
    .painting-viewer__tools { grid-column: 1 / -1; gap: 4px; }
    .painting-viewer__tools button { padding: .3rem; }
    .painting-viewer__fit-label { display: none; }
    .painting-viewer__percent { min-width: 3em; }
    .painting-viewer__hint { display: none; }
  }
  @media (max-height: 30rem) {
    .painting-viewer__hint { display: none; }
    .painting-viewer__bar { padding-block: .35rem; }
  }
  @media (forced-colors: active) {
    .painting-open, .painting-viewer { background: Canvas; color: CanvasText; }
    .painting-viewer__stage { forced-color-adjust: none; }
  }
}
@media print { .painting-open, .painting-viewer { display: none !important; } }