.result-open{position:absolute;inset:0;z-index:1;cursor:zoom-in;background:transparent}.result-open:focus-visible{outline:2px solid #720113;outline-offset:-4px}.result-open-label{position:absolute;right:12px;top:12px;width:30px;height:30px;border-radius:50%;background:#f8f6f2dd;color:#720113;display:grid;place-items:center;font:400 20px/1 Arial}
.result-viewer{border:0;padding:0;width:100vw;max-width:none;height:100dvh;max-height:none;background:#f8f6f2;color:#720113;overflow:hidden}.result-viewer::backdrop{background:#211816aa;backdrop-filter:blur(8px)}.result-viewer-inner{height:100%;display:flex;flex-direction:column;padding:20px 28px;gap:16px}.result-viewer-header{display:flex;align-items:center;justify-content:space-between;gap:16px}.result-viewer h2{margin:0;font:600 32px/1.1 'Cormorant Garamond',Georgia,serif}.result-viewer-close{width:44px;height:44px;border-radius:50%;font:300 30px/1 Arial}.result-viewer-photo{flex:1;min-height:0;width:100%;object-fit:contain}.result-viewer-controls{display:flex;justify-content:center;gap:6px;padding-bottom:env(safe-area-inset-bottom,0px)}.result-viewer-controls button{padding:8px 20px;border:1px solid #c6aca5;border-radius:5px;font:400 12px/20px Manrope,Arial,sans-serif;color:#720113}.result-viewer-controls button[aria-pressed=true]{background:#720113;color:white;border-color:#720113}@media(max-width:600px){.result-viewer-inner{padding:14px 16px;gap:12px}.result-viewer h2{font-size:28px}}

.result-card[data-real-result="myo"] .result-image>img{transform:rotate(180deg);object-fit:cover;object-position:center}

/* Treatment-dialog presentation: photo and a quiet editorial panel. */
.result-viewer{width:min(1120px,calc(100vw - 64px));height:min(740px,calc(100dvh - 64px));margin:auto;border-radius:6px;background:#f8f6f2;box-shadow:0 20px 70px #26141230}
.result-viewer::backdrop{background:rgba(38,31,28,.45);backdrop-filter:blur(6px)}
.result-viewer-inner{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);padding:0;gap:0;height:100%}
.result-viewer-media{min-height:0;min-width:0;background:#eee8df;display:flex;align-items:center;justify-content:center;overflow:hidden}
.result-viewer-photo{flex:none;height:100%;width:100%;object-fit:contain;display:block}
.result-viewer-content{position:relative;padding:58px 40px 40px;overflow:auto;color:#171516}
.result-viewer-eyebrow{margin:0 0 24px;color:#720113;font:400 12px/18px Manrope,Arial,sans-serif;letter-spacing:.7px}
.result-viewer h2{font-size:48px;color:#080808;margin:0 0 24px}
.result-viewer-close{position:absolute;right:20px;top:20px;background:#fffdf9;color:#720113;display:grid;place-items:center}
.result-viewer-description{font:400 15px/24px Manrope,Arial,sans-serif;color:#625852;margin:0 0 28px}
.result-viewer-controls{justify-content:flex-start;padding:0;gap:8px}
.result-viewer-note{font:400 13px/22px Manrope,Arial,sans-serif;color:#81766f;margin-top:22px}
@media(max-width:650px){.result-viewer{width:calc(100vw - 24px);height:calc(100dvh - 32px)}.result-viewer-inner{display:flex;flex-direction:column;gap:0;padding:0}.result-viewer-media{flex:1;min-height:0}.result-viewer-content{flex:none;padding:20px 24px 24px}.result-viewer-eyebrow{font-size:10px;margin-bottom:10px}.result-viewer h2{font-size:32px;margin-bottom:10px}.result-viewer-description{margin-bottom:16px;font-size:13px;line-height:20px}.result-viewer-close{top:14px;right:14px}.result-viewer-note{margin:12px 0 0;font-size:11px;line-height:18px}}

/* A standalone magnifier appears on hover, without a circular badge. */
.result-open-label{background:transparent;border-radius:0;width:22px;height:22px;right:16px;top:16px;opacity:0;transition:opacity 180ms ease}
.result-open-label::before{content:"";display:block;width:20px;height:20px;background:#720113;-webkit-mask:url('assets/result-magnify-353.svg') center/contain no-repeat;mask:url('assets/result-magnify-353.svg') center/contain no-repeat}
@media(hover:hover){.result-image:hover .result-open-label{opacity:1}}
.result-open:focus-visible .result-open-label{opacity:1}
@media(prefers-reduced-motion:reduce){.result-open-label{transition:none}}

/* Fine ivory strokes remain readable over the photography. */
.result-open-label{width:26px;height:26px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}
.result-open-label::before{width:24px;height:24px;background:#fffdf7;-webkit-mask-image:url('assets/result-magnify-thin-354.svg');mask-image:url('assets/result-magnify-thin-354.svg')}

/* Use a clean interaction cursor; the corner icon communicates enlargement. */
.result-open{cursor:pointer}

/* Compact comparison dialog with more space devoted to photography. */
@media(min-width:651px){
.result-viewer{width:min(1040px,calc(100vw - 64px));height:min(600px,calc(100dvh - 64px))}
.result-viewer-inner{grid-template-columns:minmax(0,1.9fr) minmax(280px,1fr)}
.result-viewer-content{padding:52px 28px 28px}
.result-viewer-eyebrow{font-size:11px;margin-bottom:18px}
.result-viewer h2{font-size:40px;margin-bottom:18px}
.result-viewer-description{font-size:14px;line-height:23px;margin-bottom:22px}
.result-viewer-note{font-size:12px;line-height:20px;margin-top:18px}
}
.result-viewer-close svg{transition:transform 400ms ease;transform-origin:center}
@media(hover:hover){.result-viewer-close:hover svg{transform:rotate(90deg)}}
.result-viewer-close:focus-visible svg{transform:rotate(90deg)}
@media(prefers-reduced-motion:reduce){.result-viewer-close svg{transition:none}}

/* Fill the photo panel edge to edge without letterbox bands. */
.result-viewer-photo{object-fit:cover;object-position:center}

/* Match the bag: quarter-turn on click before closing. */
.result-viewer-close svg,.result-viewer-close:hover svg,.result-viewer-close:focus-visible svg{transform:none;transition:none}


/* Standard cursor with the corner magnifier restored. */
.result-open{cursor:auto}

.result-card[data-real-result="hydra"] .result-image>img{transform:rotate(180deg);object-fit:cover;object-position:center}

/* A little more breathing room at either end of the comparison switch. */
.result-switch{padding-left:8px;padding-right:8px}
