#photoEditor{width:min(620px,calc(100% - 28px));box-sizing:border-box}
#photoEditor[open]{display:flex;flex-direction:column;height:90dvh;overflow:hidden}
#photoEditor h2{margin:0 0 12px}
.photo-controls{overflow-y:auto;min-height:0;flex:1;padding:0 4px}
#photoCanvas{display:block;max-width:100%;max-height:46dvh;flex-shrink:0;width:auto;height:auto;margin:0 auto;background:#171c20;touch-action:none;cursor:grab}
#photoCanvas:focus-visible{outline:3px solid #41bfa5;outline-offset:3px}
#photoEditor select{width:100%;min-height:44px;margin:8px 0 12px}
.photo-tools,.photo-actions,#mediaPreview figcaption{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.photo-tools button,#mediaPreview button{font-size:.85rem;padding:8px 12px;min-height:44px}
#photoAdjustments label{display:block;margin-top:12px}
#photoAdjustments output{float:right;font-variant-numeric:tabular-nums}
#photoAdjustments input[type=range]{width:100%;padding:0;min-height:36px;accent-color:#2f9e87}
#photoEditor summary{cursor:pointer;min-height:44px;line-height:44px}
.photo-actions{background:#fff;padding:12px 0 0;margin-bottom:0;justify-content:flex-end;flex-shrink:0}
#mediaPreview figcaption{white-space:normal;align-items:center;padding:8px}
#mediaPreview{display:grid;grid-template-columns:1fr;overflow:visible}
#mediaPreview figure{min-width:0;margin:0}
#photoCompare[aria-pressed=true]{outline:3px solid #2f9e87}
.photo-crop-stage{position:relative;align-self:center;flex-shrink:0;max-width:calc(100% - 24px);margin:12px;isolation:isolate}
.photo-crop-box{position:absolute;border:2px solid white;box-sizing:border-box;pointer-events:none;outline:1px solid #263c48;box-shadow:0 0 0 500px #0007;clip-path:inset(-500px);}
.photo-crop-mask{position:absolute;inset:0;overflow:hidden;pointer-events:none}
#photoEditor .photo-crop-handle{position:absolute;transform:translate(-50%,-50%);width:44px;height:44px;min-height:44px;padding:0;border:0;background:transparent;touch-action:none;z-index:2;cursor:move;user-select:none;-webkit-user-select:none}
.photo-crop-handle::after{content:'';position:absolute;inset:13px;background:white;border:2px solid #263c48;border-radius:3px;pointer-events:none}
.photo-crop-handle:focus-visible{outline:3px solid #41bfa5;outline-offset:-3px}
