/* The existing Earth controls remain unchanged; only the three photo landmarks
   use this separate layout. NASA JPEG pixels are never filtered or repainted. */
#landmark-area{display:contents}
#landmark-area.has-photo{--photo-unit:var(--desktop-unit,1px);position:absolute;left:calc(50% + 75 * var(--photo-unit));top:50%;transform:translateY(-50%);width:calc(260 * var(--photo-unit));display:flex;flex-direction:column;gap:calc(8 * var(--photo-unit))}
#landmark-area.has-photo #landmark{position:static;inset:auto;transform:none;margin:0;width:100%;padding:0;border:0;background:transparent;text-align:left;font-size:calc(16 * var(--photo-unit));line-height:1.6}
#landmark-photo{margin:0;border:1px solid #697a8780;border-radius:4px;overflow:hidden;background:#000;transition:opacity .4s}
#photo-open{display:block;width:100%;padding:0;border:0;background:transparent;cursor:zoom-in}
.photo-window{position:relative;display:block;width:100%;aspect-ratio:3 / 1;overflow:hidden}
#photo-crop{position:absolute;height:auto;max-width:none}
.photo-scale{position:absolute;top:calc(5 * var(--photo-unit));left:calc(5 * var(--photo-unit));padding:calc(2 * var(--photo-unit)) calc(4 * var(--photo-unit));border-radius:2px;background:#000b;color:#edf1f4;font-size:calc(9 * var(--photo-unit));line-height:1.4;white-space:nowrap;pointer-events:none}
.photo-pin{position:absolute;width:calc(14 * var(--photo-unit));height:calc(14 * var(--photo-unit));border:1px solid #d7e3ed;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}
.photo-pin span{position:absolute;top:100%;left:50%;transform:translateX(-50%);padding-top:calc(3 * var(--photo-unit));font-size:calc(9 * var(--photo-unit));line-height:1.3;white-space:nowrap;color:#edf1f4;text-shadow:0 1px 3px #000,0 0 3px #000}
#landmark-photo figcaption{padding:calc(6 * var(--photo-unit)) calc(8 * var(--photo-unit));font-size:calc(11 * var(--photo-unit));line-height:1.45;color:#d4dee6}
#photo-note{display:block;margin-top:calc(4 * var(--photo-unit));font-size:calc(10 * var(--photo-unit))}
#photo-credit{display:block;margin-top:calc(2 * var(--photo-unit));font-size:calc(9 * var(--photo-unit));color:#aebbc6}
@media(max-width:1100px){
 #landmark-area.has-photo{--photo-unit:1px;left:50%;top:calc(50% - 24px);transform:translate(-50%,-100%);width:min(310px,calc(100% - 40px))}
 #landmark-area.has-photo #landmark{font-size:11px;text-align:center}
}
#photo-dialog{position:fixed;max-width:calc(100vw - 32px);max-height:calc(100svh - 32px);padding:16px;background:#080a0c;color:#edf1f4;border:1px solid #697a87;border-radius:6px;overflow:auto}
#photo-dialog::backdrop{background:#000c}
#photo-dialog figure{margin:0}
#photo-close{position:absolute;right:4px;top:4px;width:40px;height:40px;padding:0;border:0;border-radius:50%;background:#000b;font-size:28px;z-index:1}
#photo-full{display:block;margin:auto;padding:0;border:0;background:transparent;cursor:zoom-out}
#photo-original{display:block;max-width:min(85vw,1400px);max-height:65svh;width:auto;height:auto;object-fit:contain}
#photo-dialog figcaption{max-width:900px;margin:12px auto 0;font-size:clamp(12px,.8vw,22px);line-height:1.6}
#photo-dialog-title{margin:0 0 6px;font-size:1.15em}
#photo-detail{margin:0 0 6px;color:#d0d9e1}
#photo-dialog-credit{display:block;color:#aebbc6}
#photo-source{display:inline-block;margin-top:8px}
.photo-close-hint{display:block;margin-top:6px;color:#aebbc6;font-size:.9em}
@media(max-width:650px){#photo-dialog{padding:10px}#photo-original{max-width:calc(100vw - 54px);max-height:60svh}}
@media(prefers-reduced-motion:reduce){#landmark-photo{transition:none}}
