#pg-launch { margin: 0 0 .5rem; min-height: 44px; }
body:not([data-stage="2"]) #pg-launch, #pg-dialog [hidden] { display: none !important; }
#pg-dialog { width: min(48rem, calc(100% - 1rem)); max-height: 92vh; max-height: 92dvh; padding: clamp(.85rem, 3vw, 1.6rem); overflow-y: auto; }
#pg-dialog h2 { margin: 0 2rem .7rem 0; }
#pg-dialog p { margin: .6rem 0; }
#pg-pins { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin: .6rem 0; }
#pg-dialog :is(button:not(.dialog-close), summary, select, input) { min-height: 44px; }
#pg-pins button { padding: .3rem; line-height: 1.15; font-size: .88rem; }
#pg-pins [aria-pressed="true"] { background: #31443b; color: white; }
.pg-frame { display: grid; place-items: center; background: #eae5dc; border-radius: .5rem; overflow: hidden; }
#pg-image { display: block; max-width: 100%; max-height: 43vh; max-height: 43dvh; width: auto; height: auto; cursor: crosshair; touch-action: pinch-zoom; }
#pg-image:focus-visible { outline: 3px solid #005d85; outline-offset: -3px; }
.pg-fine { display: flex; align-items: center; gap: .75rem; }
.pg-fine > div { flex: 1; min-width: 0; }
#pg-lens { width: 70px; height: 70px; border-radius: 50%; border: 2px solid #857152; flex-shrink: 0; background: #eae5dc; }
#pg-dialog summary { cursor: pointer; padding: .6rem 0; }
#pg-dialog #pg-metrics select { width: 100%; max-width: 100%; font-size: 1rem; }
#pg-dims { margin-top: .6rem; }
.pg-actions { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .75rem; }
#pg-result { color: #31443b; font-weight: 700; }
#pg-result[data-error="true"] { color: #913b20; }