.family-image-open{display:inline-flex;align-items:center;gap:.35em;min-height:38px;padding:6px 10px;margin:6px 0;border:1px solid #9b8969;border-radius:5px;background:#fffaf0;color:#263e2a;font:14px Georgia,serif;cursor:pointer}
.family-image-dialog{box-sizing:border-box;width:96vw;height:96dvh;max-width:96vw;max-height:96dvh;padding:14px;border:1px solid #a18e70;border-radius:10px;background:#f5efe4;color:#29271f;overflow:hidden}
.family-image-dialog[open]{display:flex;flex-direction:column;gap:10px}.family-image-dialog::backdrop{background:#172019db}
.family-image-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;flex-shrink:0}.family-image-actions{display:flex;gap:6px;flex-wrap:wrap}.family-image-dialog button{min-width:44px;min-height:44px;padding:7px 11px;border:1px solid #aa987b;border-radius:5px;background:#fffaf0;color:#263e2a;font:inherit;cursor:pointer}.family-image-dialog button:disabled{opacity:.45}
.family-image-scroll{flex:1;min-height:40px;overflow:auto;overscroll-behavior:contain;touch-action:none}.family-image-stage{position:relative;margin:auto;isolation:isolate;flex:none;line-height:0}.family-image-stage img{position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;user-select:none;pointer-events:none}.family-image-color-layer,.family-image-color-region{position:absolute;inset:0;overflow:hidden;pointer-events:none}.family-image-color-layer{clip-path:inset(0 0 0 var(--split,100%))}.family-image-line{position:absolute;top:0;bottom:0;left:var(--split,100%);width:2px;background:white;box-shadow:0 0 3px #000;pointer-events:none}
.family-image-caption{margin:0;max-height:15dvh;overflow:auto;font:16px/1.4 Georgia,serif;flex-shrink:0}.family-image-compare{display:flex;align-items:center;gap:10px;flex-shrink:0}.family-image-compare input{flex:1;min-width:50px;min-height:30px}.family-image-help{margin:0;font-size:13px;flex-shrink:0}.family-image-dialog [hidden]{display:none!important}.family-image-dialog :focus-visible,.family-image-open:focus-visible{outline:3px solid #50744c;outline-offset:2px}
@media(max-width:500px){.family-image-dialog{padding:10px;gap:7px}.family-image-title{font-size:15px}.family-image-caption{font-size:15px}.family-image-help{font-size:12px}}
.linda-comparison{cursor:zoom-in;box-shadow:0 3px 5px #35281433;overflow:hidden}
.linda-card-image .linda-comparison img,.linda-large-link .linda-comparison img{width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;border:0;box-shadow:none;filter:none}
.linda-image-controls{padding:10px 18px;text-align:center;background:#eee7da}
.linda-inline-slider{display:flex;align-items:center;gap:8px;font-size:14px;color:#263e2a;line-height:1.4}
.linda-inline-slider input{flex:1;min-width:40px;min-height:36px;cursor:ew-resize;accent-color:#365239}
.linda-image-controls .family-image-open{margin:6px 0 0;min-height:44px}
.profile-compare,.leonora-compare,.linda-comparison{cursor:ew-resize;touch-action:pan-y;user-select:none}
/* Keep the comparison track beneath the visible image, including portrait fits. */
.family-image-compare{align-self:center;max-width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 10px}
.family-image-compare input{grid-column:1 / -1;grid-row:1;width:100%;min-width:0;margin:0;box-sizing:border-box}
.family-image-compare span:first-child{grid-column:1;grid-row:2}
.family-image-compare span:last-child{grid-column:2;grid-row:2;text-align:right}
/* Native thumbs travel inside the input by half a thumb at each end.
   Extend the invisible input by that amount; the visible track stays image-wide. */
.family-image-compare input{appearance:none;-webkit-appearance:none;width:calc(100% + 16px);max-width:none;margin-left:-8px;padding:0;border:0;height:30px;background:linear-gradient(to right,#087af5 var(--range-progress,100%),#d5d5d5 var(--range-progress,100%)) center / calc(100% - 16px) 4px no-repeat;cursor:ew-resize}
.family-image-compare input::-webkit-slider-runnable-track{height:4px;background:transparent;border:0}
.family-image-compare input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border:0;border-radius:50%;background:#087af5;margin-top:-6px}
.family-image-compare input::-moz-range-track{height:4px;background:transparent;border:0}
.family-image-compare input::-moz-range-thumb{width:16px;height:16px;border:0;border-radius:50%;background:#087af5}
.profile-page .profile-slider,.leonora-page .leonora-slider,body .linda-inline-slider{max-width:100%;margin-left:auto;margin-right:auto;box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 8px}
.profile-page .profile-slider input,.leonora-page .leonora-slider input,body .linda-inline-slider input{grid-column:1 / -1;grid-row:1;width:100%;min-width:0;margin:0;box-sizing:border-box}
.profile-page .profile-slider span:first-child,.leonora-page .leonora-slider span:first-child,body .linda-inline-slider span:first-child{grid-row:2;grid-column:1}
.profile-page .profile-slider span:last-child,.leonora-page .leonora-slider span:last-child,body .linda-inline-slider span:last-child{grid-row:2;grid-column:2;text-align:right}

/* Letterbox differing restoration proportions inside their existing region masks. */
.family-image-color-region{background:#f7f1e5}
