/* Photo first: real image proportions and spatial transitions. */
:root{scrollbar-gutter:stable}
.menu summary{display:grid;place-items:center;padding:0}
.menu summary svg{width:23px;height:23px;fill:currentColor}
.editable-title{display:flex;align-items:center;gap:12px;max-width:660px}
.editable-title .title-input{padding:0;margin:5px 0 9px}
.editable-title label{flex-shrink:0;width:44px;height:44px;display:grid;place-items:center;color:#647087;cursor:text;border-radius:50%}
.editable-title label:hover{background:#e9edf5}
.editable-title svg{width:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}
.shot-view{position:relative;background:#e9edf3;border:1px solid #e3e7ee;transition:box-shadow .25s,background .25s}
.shot-view img,.shot-view:hover img{object-fit:contain;transform:none}
.shot-view:hover{box-shadow:0 10px 30px #172a4612;background:#e2e8f0}
.shot-series{position:absolute;bottom:10px;left:10px;display:flex;align-items:center;gap:5px;padding:5px 9px;border:1px solid #ffffff6e;background:#ffffffec;backdrop-filter:blur(12px);color:#34445d;border-radius:10px;font-size:12px;font-weight:750;box-shadow:0 3px 12px #00000010}
.shot-series svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6}
.shot-copy{display:flex;justify-content:space-between;gap:8px;min-height:30px}
.shot-copy span{font-size:11px}
.shot-copy span:last-child:not(:first-child){color:#748096}
.viewer-open{overflow:hidden}
.review-dialog{width:1180px;max-width:calc(100vw - 48px);max-height:calc(100svh - 48px);margin:auto;padding:24px 28px 18px;border-radius:30px;overflow:auto;background:#fafbfd;border:1px solid #ffffff;box-shadow:0 36px 130px #0e1a3d40;overscroll-behavior:contain}
.review-dialog::backdrop{background:#17264052;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.viewer-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:20px}
.viewer-heading{min-width:0}
.viewer-heading p{font-size:11px;text-transform:uppercase;letter-spacing:1.7px;color:#6a7890;margin:0 0 5px;font-weight:650}
.viewer-heading h2{font-size:23px;font-weight:650;letter-spacing:-.8px;line-height:1.3;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.viewer-top-actions,.variant-nav,.viewer-photo-nav{display:flex;align-items:center;gap:7px;flex-shrink:0}
.viewer-icon{border:0;display:grid;place-items:center;background:#e9edf3;color:#56647b;width:44px;height:44px;border-radius:50%;padding:11px;transition:background .18s,transform .18s;flex-shrink:0}
.viewer-icon:hover:not(:disabled){background:#dfe6f0;color:#233954}
.viewer-icon:active:not(:disabled){transform:scale(.92)}
.viewer-icon:disabled{opacity:.3;cursor:default}
.review-dialog svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.viewer-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;align-items:start}
.viewer-layout.has-variants{grid-template-columns:minmax(0,1fr) 232px}
.viewer-main{min-width:0}
.viewer-stage{height:clamp(240px,57svh,650px);position:relative;display:flex;align-items:center;justify-content:center;background:#edf0f4;border-radius:19px;overflow:hidden;touch-action:pan-y}
.viewer-image{width:100%;height:100%;position:relative;display:flex;align-items:center;justify-content:center;transform-origin:center;will-change:transform}
.viewer-image img{width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none;pointer-events:none}
.viewer-flying-image{position:fixed;object-fit:contain;z-index:5;pointer-events:none;transform-origin:top left;will-change:transform}
.viewer-preview-label{position:absolute;top:14px;left:14px;background:#ffffffeb;backdrop-filter:blur(10px);border:1px solid #ffffff80;border-radius:20px;font-size:11px;color:#53627a;padding:7px 12px;pointer-events:none}
.viewer-action-area{padding:18px 0 2px;min-height:91px}
.viewer-actions{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap}
.viewer-actions .button{display:flex;justify-content:center;align-items:center;gap:8px;min-height:46px;padding:12px 18px;border-radius:14px;font-size:13px;transition:background .18s,transform .18s,box-shadow .18s}
.viewer-actions .button:active{transform:scale(.97)}
.viewer-selected{display:flex;align-items:center;gap:6px;font-size:13px;color:#276449;margin-right:4px}
.viewer-selected svg{width:18px;height:18px}
.viewer-action-hint{font-size:11px;line-height:1.5;color:#6d7a8e;text-align:center;margin:9px 0 0}
.viewer-announcement{display:block;font-size:11px;color:#315bf6;text-align:center;min-height:15px;line-height:1.3;margin-top:3px}
.variant-rail{min-width:0;display:flex;flex-direction:column;height:clamp(240px,57svh,650px)}
.variant-heading{padding:4px 0 13px;display:flex;flex-wrap:wrap;gap:9px;align-items:center;justify-content:space-between}
.variant-heading h3{margin:0;font-size:14px;font-weight:700;letter-spacing:-.3px;display:flex;gap:8px;align-items:center}
.variant-heading h3 span{font-size:10px;color:#63748a;background:#e9eef5;border-radius:7px;padding:3px 6px;font-weight:600}
.variant-heading p{font-size:11px;color:#6c7b91;margin:5px 0 0;line-height:1.5}
.variant-nav .viewer-icon{width:44px;height:44px;background:transparent;border:1px solid #e0e5ed}
.variant-list{display:flex;flex-direction:column;gap:13px;overflow:auto;padding:4px 6px 12px 4px;scroll-snap-type:y proximity;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#cad3e1 transparent}
.variant-card{flex-shrink:0;display:block;width:100%;padding:5px;text-align:left;background:#ffffff;border:1px solid #e4e8ee;border-radius:17px;scroll-snap-align:start;transition:border-color .18s,box-shadow .18s,background .18s}
.variant-card:hover{border-color:#b9c8e5;box-shadow:0 5px 15px #243f680b}
.variant-card.active{border-color:#315bf6;box-shadow:0 0 0 2px #315bf623;background:#f4f7ff}
.variant-photo{display:block;position:relative;aspect-ratio:1.6;background:#e9edf3;border-radius:12px;overflow:hidden}
.variant-photo img{display:block;width:100%;height:100%;object-fit:contain}
.variant-check{position:absolute;right:7px;bottom:7px;background:#315bf6;color:#fff;width:23px;height:23px;border-radius:50%;display:grid;place-items:center;box-shadow:0 1px 6px #13285822}
.variant-check svg{width:14px;height:14px;stroke-width:2}
.variant-caption{display:flex;justify-content:space-between;gap:5px;font-size:10px;line-height:1.4;color:#8290a3;padding:9px 5px 4px}
.variant-caption>span:first-child{color:#3c4c65;font-weight:650}
.viewer-bottom{border-top:1px solid #e5eaf1;display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:12px;margin-top:6px}
.viewer-bottom>span{font-size:11px;line-height:1.6;color:#758196;max-width:520px}
.viewer-photo-nav>span{font-size:11px;min-width:54px;text-align:center;color:#6f7d92;font-variant-numeric:tabular-nums}
.viewer-feedback{text-align:center;margin-top:8px}
.viewer-feedback>.text-button{font-size:11px;padding:10px}
.viewer-feedback .reason-picker{justify-content:center;padding:6px 0}
.viewer-feedback .reason-picker button{min-height:44px}
.viewer-finished{padding:45px 15px;text-align:center}
.viewer-finished h2{font-size:26px;letter-spacing:-.6px}
.viewer-finished p{color:#6b7890;font-size:14px;line-height:1.7}
.viewer-finished-mark{display:grid;place-items:center;border-radius:50%;background:#edf3ff;color:var(--blue);width:64px;height:64px;margin:auto}
.viewer-finished-mark svg{width:30px;height:30px}
.preview-missing{font-size:13px;color:#6c7891}
.review-dialog button:focus-visible,.shot-view:focus-visible{outline:3px solid #315bf6;outline-offset:4px}
@media(min-width:1500px){.review-dialog{width:1320px}.viewer-layout.has-variants{grid-template-columns:minmax(0,1fr) 250px}}
@media(max-width:760px){
 .review-dialog{width:100%;max-width:100%;max-height:calc(100dvh - 12px);margin:auto 0 0;padding:17px 16px max(12px,env(safe-area-inset-bottom));border-radius:26px 26px 0 0}
 .viewer-top{padding-bottom:15px;gap:10px}.viewer-heading h2{font-size:20px;letter-spacing:-.7px}.viewer-heading p{font-size:9px;letter-spacing:1.3px}.viewer-top-actions{gap:6px}
 .viewer-layout,.viewer-layout.has-variants{display:flex;flex-direction:column;gap:0}.viewer-main{width:100%;display:contents}
 .viewer-stage{height:clamp(210px,42dvh,480px);width:100%;border-radius:16px;order:0}
 .variant-rail{height:auto;width:calc(100% + 8px);margin:0 -4px;order:1;padding-top:12px}.variant-heading{padding:0 4px 8px;flex-wrap:nowrap}.variant-heading h3{font-size:12px}.variant-heading p{display:none}.variant-nav{gap:4px}.variant-nav .viewer-icon{width:44px;height:44px;padding:11px}
 .variant-list{flex-direction:row;gap:10px;padding:4px 4px 9px;scroll-snap-type:x proximity;scroll-padding-inline:4px;scrollbar-width:none}.variant-card{width:139px;border-radius:13px;padding:4px;scroll-snap-align:center}.variant-photo{border-radius:9px;aspect-ratio:1.6}.variant-caption{display:block;font-size:9px;padding:6px 4px 2px}.variant-caption>span{display:block}
 .viewer-action-area{order:2;padding-top:13px;min-height:0;width:100%}.viewer-actions{gap:8px;flex-wrap:nowrap}.viewer-actions .button{flex:1;padding:12px 10px;font-size:12px;min-width:0;line-height:1.4}.viewer-actions .button svg{width:17px;height:17px}.viewer-selected{font-size:11px;white-space:nowrap}.viewer-action-hint{font-size:10px;margin-top:8px}.viewer-announcement{font-size:10px;min-height:0;margin-top:4px}.viewer-announcement:empty{display:none}
 .viewer-bottom{margin-top:12px;gap:8px;padding-top:8px}.viewer-bottom>span{font-size:10px;max-width:170px}.viewer-photo-nav{gap:2px}.viewer-photo-nav>span{min-width:42px;font-size:10px}.viewer-photo-nav .viewer-icon{background:transparent}.viewer-feedback{margin-top:0}.viewer-preview-label{top:10px;left:10px;font-size:10px;padding:6px 10px}
 .shot-copy{flex-wrap:wrap;gap:1px;padding-top:7px}.shot-copy span{font-size:10px}.shot-series{bottom:8px;left:8px;font-size:10px;padding:4px 7px}
}
@media(max-height:650px) and (max-width:760px){.viewer-stage{height:32dvh;min-height:160px}.variant-photo{aspect-ratio:2}.variant-card{width:125px}.viewer-top{padding-bottom:10px}.variant-rail{padding-top:6px}.viewer-action-area{padding-top:8px}.viewer-bottom>span{display:none}.viewer-bottom{justify-content:center}}
@media(prefers-reduced-motion:reduce){.shot-view,.viewer-icon,.variant-card,.viewer-actions .button{transition:none}.viewer-image{will-change:auto}.variant-list{scroll-behavior:auto}}