/* Camera controls sit outside the photo; the guide never blocks the shutter. */
dialog.peony-camera { position:fixed; inset:0; width:100%; max-width:none; height:100dvh; max-height:none; margin:0; padding:0; border:0; border-radius:0; background:#11101c; color:#fff; overflow:hidden; box-shadow:none; }
dialog.peony-camera[open] { display:flex; flex-direction:column; }
.peony-camera::backdrop { background:#11101c; }
.peony-camera-head { display:grid; grid-template-columns:minmax(70px,1fr) auto minmax(70px,1fr); align-items:center; padding:calc(8px + env(safe-area-inset-top)) 16px 8px; gap:8px; flex:none; }
.peony-camera-head h2 { font:600 17px/1.25 -apple-system,BlinkMacSystemFont,sans-serif; text-align:center; color:#fff; margin:0; letter-spacing:0; }
.peony-camera button { -webkit-tap-highlight-color:transparent; touch-action:manipulation; cursor:pointer; }
.peony-camera-cancel { min-height:44px; background:transparent; border:0; color:#fff; font:500 16px -apple-system,BlinkMacSystemFont,sans-serif; padding:0; text-align:left; box-shadow:none; justify-self:start; }
.peony-camera-stage { min-height:0; flex:1; position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center; background:#08080d; }
.peony-camera video { display:block; width:100%; height:100%; object-fit:contain; }
.peony-camera-hand { position:absolute; height:75%; max-height:600px; width:auto; max-width:80%; fill:none; stroke:rgba(255,255,255,.38); stroke-width:1.7; stroke-dasharray:5 10; filter:drop-shadow(0 1px 3px rgba(0,0,0,.6)); pointer-events:none; }
.peony-camera-position { position:absolute; bottom:10px; left:12px; right:12px; margin:0 auto; width:fit-content; max-width:calc(100% - 24px); border-radius:16px; padding:10px 16px; background:rgba(20,16,35,.70); color:#fff; text-align:center; font:500 14px/1.4 -apple-system,BlinkMacSystemFont,sans-serif; backdrop-filter:blur(12px); }
.peony-camera-position small { display:block; margin-top:2px; color:#e4dfee; font:400 12px/1.35 -apple-system,BlinkMacSystemFont,sans-serif; }
.peony-camera-target { position:absolute; width:36px; height:36px; border:2px solid white; border-radius:50%; box-shadow:0 0 0 1px #3339; pointer-events:none; }
.peony-camera-controls { flex:none; display:flex; align-items:center; flex-direction:column; gap:12px; padding:16px 20px calc(16px + env(safe-area-inset-bottom)); }
.peony-camera-cue { color:#f2daff; text-align:center; min-height:20px; font:600 15px/1.3 -apple-system,BlinkMacSystemFont,sans-serif; margin:0; }
.peony-camera-shutter { width:76px; height:76px; border:3px solid #fff; border-radius:50%; padding:5px; display:grid; place-items:center; background:transparent; box-shadow:none; flex:none; }
.peony-camera-shutter span { width:100%; height:100%; border-radius:50%; background:#fff; display:block; }
.peony-camera-shutter:disabled { opacity:.35; cursor:wait; }
.peony-camera-shutter:active:not(:disabled) span { background:#ecc7ff; transform:scale(.95); }
.peony-camera-note { margin:0; color:#c8c2d7; font:400 12px/1.4 -apple-system,BlinkMacSystemFont,sans-serif; text-align:center; }
.peony-camera button:focus-visible { outline:3px solid #d8acff; outline-offset:4px; }
@media(min-width:700px) { .peony-camera-head { padding-left:32px; padding-right:32px; } .peony-camera-stage { max-width:900px; width:100%; align-self:center; } }
@media(max-height:600px) { .peony-camera-head { padding-top:env(safe-area-inset-top); padding-bottom:0; } .peony-camera-controls { gap:6px; padding-top:8px; padding-bottom:calc(8px + env(safe-area-inset-bottom)); } .peony-camera-shutter { width:56px; height:56px; } .peony-camera-note { display:none; } .peony-camera-position { font-size:12px; padding:6px 10px; bottom:4px; } }

.peony-camera-flip { position:absolute; top:12px; right:12px; min-height:44px; border:1px solid #ffffff55; border-radius:24px; padding:8px 14px; color:#fff; background:#17112299; font:500 13px -apple-system,BlinkMacSystemFont,sans-serif; backdrop-filter:blur(12px); }

.peony-camera-auto { display:flex; align-items:center; gap:10px; min-height:44px; color:#fff; font:500 14px/1.35 -apple-system,BlinkMacSystemFont,sans-serif; cursor:pointer; }
.peony-camera-auto input { accent-color:#cf95f5; width:22px; height:22px; margin:0; }
.peony-camera-auto input:focus-visible { outline:3px solid #d8acff; outline-offset:4px; }
.peony-camera[data-ready="true"] .peony-camera-cue { color:#b8f1d8; }
@media(max-height:600px) { .peony-camera-auto { min-height:32px; font-size:12px; } }