/* Atlas data room — photo cropper dialog (/room/cropper.06bdfb3b.js). Loaded by /room and /room/admin; uses each surface's
   colour variables and .btn classes. The <dialog> sits in the top layer, above sheets and drawers. */
.crp{border:1px solid var(--line);border-radius:16px;background:var(--surface);color:var(--fg);padding:0;width:min(720px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;box-shadow:0 30px 80px -40px rgba(0,0,0,.6)}
.crp::backdrop{background:rgba(0,0,0,.55);backdrop-filter:blur(3px)}
.crp-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px 10px}
.crp-h b{font:600 16px/1.2 var(--sans)}
.crp-x{background:none;border:0;color:var(--muted);font-size:22px;line-height:1;cursor:pointer;padding:4px 8px;border-radius:8px}
.crp-x:hover{color:var(--fg);background:var(--sunk)}
.crp-b{display:grid;grid-template-columns:minmax(0,420px) minmax(200px,1fr);gap:18px;padding:6px 18px 10px;align-items:start}
.crp-stage{position:relative;width:100%;max-width:420px;aspect-ratio:1;background:var(--sunk);border-radius:12px;overflow:hidden;touch-action:none;cursor:grab;outline:none;user-select:none;-webkit-user-select:none}
.crp-stage:active{cursor:grabbing}
.crp-stage:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb,var(--fg) 70%,transparent)}
.crp-stage canvas{display:block;width:100%;height:100%}
.crp-hint{position:absolute;left:0;right:0;bottom:10px;margin:0;text-align:center;font:500 11px/1 var(--mono,ui-monospace,monospace);letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.75);pointer-events:none}
.crp-side{display:grid;gap:14px;align-content:start}
.crp-prev{display:flex;gap:12px;align-items:center}
.crp-prev canvas{width:64px;height:64px;border-radius:50%;flex:none;border:1px solid var(--line);background:var(--sunk)}
.crp-prev b{display:block;font:600 14px/1.3 var(--sans);overflow-wrap:anywhere}
.crp-prev small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.crp-zoom{display:grid;gap:6px;font:500 11px/1 var(--mono,ui-monospace,monospace);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.crp-zoom input{width:100%;accent-color:var(--fg)}
.crp-acts{display:flex;gap:8px;flex-wrap:wrap}
.crp-help{margin:0;color:var(--muted);font-size:12px;line-height:1.5}
.crp-f{display:flex;justify-content:flex-end;gap:8px;padding:10px 18px 18px}
@media (max-width:640px){
  .crp{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);border-radius:14px}
  .crp-b{grid-template-columns:1fr;padding-inline:14px}
  .crp-stage{max-width:none}
  .crp-h,.crp-f{padding-inline:14px}
  .crp-f .btn{flex:1}
}