/*
 * CALIBRO 8108 · workbench planimetria 2D
 * Il viewport e lo stage sono separati: lo stage viene trasformato da JS,
 * mentre comandi, dettaglio e messaggi restano stabili e leggibili.
 */
.fpm-shell {
  --fpm-ink: var(--text-primary, #071c24);
  --fpm-muted: var(--text-secondary, #51636a);
  --fpm-border: var(--border, #c7d0d0);
  --fpm-border-soft: #dfe6e5;
  --fpm-page: #f4f1e9;
  --fpm-surface: #ffffff;
  --fpm-surface-soft: #f4f7f6;
  --fpm-surface-blue: #eaf3f8;
  --fpm-blue: #286f9e;
  --fpm-blue-dark: #174d70;
  --fpm-room-fill: rgba(40, 111, 158, .06);
  --fpm-room-fill-active: rgba(40, 111, 158, .14);
  --fpm-room-fill-draft: rgba(40, 111, 158, .15);
  --fpm-room-fill-verified: rgba(20, 107, 76, .06);
  --fpm-room-fill-manual: rgba(134, 90, 8, .13);
  --fpm-green: #146b4c;
  --fpm-green-soft: #e9f5ef;
  --fpm-amber: #865a08;
  --fpm-amber-soft: #fff4dc;
  --fpm-danger: #8a2626;
  --fpm-focus: #0b73b2;
  --fpm-shadow-sm: 0 3px 12px rgba(7, 28, 36, .08);
  --fpm-shadow-lg: 0 18px 48px rgba(7, 28, 36, .20);
  container: floorplan / inline-size;
  display: grid;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  gap: 1rem;
  color: var(--fpm-ink);
  font-family: var(--font-family, Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
}

.fpm-shell *,
.fpm-shell *::before,
.fpm-shell *::after {
  box-sizing: border-box;
}

.fpm-shell button,
.fpm-shell input,
.fpm-shell select {
  font: inherit;
}

.fpm-shell button {
  min-height: 2.75rem;
  border: 1px solid var(--fpm-border);
  border-radius: .5rem;
  background: var(--fpm-surface);
  color: var(--fpm-ink);
  padding: .55rem .8rem;
  font-weight: 720;
  line-height: 1.25;
  cursor: pointer;
  transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease, color .16s ease;
}

.fpm-shell button:not(.fpm-object):not(.fpm-marker):not(.fpm-corner):not(.primary):not(.danger) {
  background: var(--fpm-surface) !important;
  color: var(--fpm-ink) !important;
}

.fpm-shell button.primary {
  border-color: var(--fpm-ink) !important;
  background: var(--fpm-ink) !important;
  color: #fff !important;
}

.fpm-shell button.danger {
  border-color: #c98f8f !important;
  background: #fff !important;
  color: var(--fpm-danger) !important;
}

.fpm-shell button:hover:not(:disabled):not(.fpm-marker):not(.fpm-corner) {
  border-color: #809397;
  box-shadow: 0 2px 8px rgba(7, 28, 36, .11);
}

.fpm-shell button.primary:hover:not(:disabled) {
  border-color: #123b49 !important;
  background: #123b49 !important;
}

.fpm-shell button:disabled {
  opacity: .52;
  cursor: not-allowed;
  box-shadow: none !important;
}

.fpm-shell button:focus-visible,
.fpm-shell input:focus-visible,
.fpm-shell select:focus-visible,
.fpm-shell summary:focus-visible,
.fpm-viewport:focus-visible {
  outline: 3px solid var(--fpm-focus);
  outline-offset: 2px;
}

.fpm-header,
.fpm-toolbar,
.fpm-progress,
.fpm-queue-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  flex-wrap: wrap;
}

.fpm-header {
  align-items: flex-end;
}

.fpm-header > div {
  min-width: 0;
}

.fpm-header h2,
.fpm-header p,
.fpm-detail h3,
.fpm-correction-copy h3 {
  margin: .18rem 0;
}

.fpm-header h2 {
  font-size: clamp(1.55rem, 2.2vw, 2.15rem);
  line-height: 1.08;
  letter-spacing: -.025em;
}

.fpm-header p {
  max-width: 62rem;
  color: var(--fpm-muted);
  line-height: 1.48;
}

.fpm-eyebrow {
  color: #49636e;
  font-size: .7rem;
  font-weight: 850;
  letter-spacing: .09em;
  line-height: 1.25;
  text-transform: uppercase;
}

.fpm-progress {
  padding: .72rem .9rem;
  border: 1px solid var(--fpm-border);
  border-radius: .7rem;
  background: var(--fpm-surface);
  box-shadow: var(--fpm-shadow-sm);
}

.fpm-progress span {
  color: var(--fpm-muted);
}

.fpm-progress span strong,
.fpm-progress > strong {
  color: var(--fpm-ink);
}

.fpm-progress progress {
  flex: 1 1 14rem;
  min-width: 10rem;
  height: .45rem;
  border: 0;
  border-radius: 999px;
  overflow: hidden;
  accent-color: var(--fpm-green);
}

.fpm-toolbar {
  padding: .75rem;
  border: 1px solid #d7dfdf;
  border-radius: .75rem;
  background: #edf2f2;
}

.fpm-toolbar label {
  display: grid;
  gap: .28rem;
  color: #425860;
  font-size: .76rem;
  font-weight: 780;
}

.fpm-toolbar select {
  min-width: 13rem;
  min-height: 2.75rem;
  border: 1px solid var(--fpm-border);
  border-radius: .5rem;
  background: #fff;
  color: var(--fpm-ink);
  padding: .45rem 2.2rem .45rem .65rem;
}

.fpm-create,
.fpm-manual {
  border: 1px solid var(--fpm-border);
  border-radius: .7rem;
  background: var(--fpm-surface);
  box-shadow: var(--fpm-shadow-sm);
  padding: .82rem;
}

.fpm-create summary,
.fpm-manual summary {
  border-radius: .25rem;
  font-weight: 820;
  cursor: pointer;
}

.fpm-upload,
.fpm-manual form,
.fpm-attachments form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  gap: .72rem;
  margin-top: .8rem;
}

.fpm-upload label,
.fpm-manual label,
.fpm-attachments label,
.fpm-inline-form label,
.fpm-edit-form label,
.fpm-profile-form label {
  display: grid;
  gap: .3rem;
  min-width: 0;
  color: #40555d;
  font-size: .75rem;
  font-weight: 780;
}

.fpm-upload input,
.fpm-manual input,
.fpm-manual select,
.fpm-attachments input,
.fpm-inline-form input,
.fpm-inline-form select,
.fpm-edit-form input,
.fpm-edit-form select,
.fpm-profile-form input,
.fpm-profile-form textarea {
  width: 100%;
  min-width: 0;
  min-height: 2.7rem;
  border: 1px solid var(--fpm-border);
  border-radius: .5rem;
  background: #fff;
  color: var(--fpm-ink);
  padding: .5rem .6rem;
}

.fpm-profile-form textarea {
  min-height: 6.5rem;
  resize: vertical;
  font: inherit;
  line-height: 1.45;
}

.fpm-upload p {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--fpm-muted);
  line-height: 1.45;
}

.fpm-layout {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(15rem, 17rem) minmax(0, 1fr);
  grid-template-areas: "queue canvas";
  gap: 1rem;
  align-items: start;
  min-width: 0;
  max-width: 100%;
}

.fpm-queue {
  grid-area: queue;
  min-width: 0;
  max-height: min(74dvh, 50rem);
  overflow-x: hidden;
  overflow-y: auto;
  border: 1px solid var(--fpm-border);
  border-radius: .75rem;
  background: var(--fpm-surface);
  box-shadow: var(--fpm-shadow-sm);
  scrollbar-gutter: stable;
}

.fpm-queue-head {
  position: sticky;
  z-index: 4;
  top: 0;
  align-items: stretch;
  padding: .8rem;
  border-bottom: 1px solid var(--fpm-border-soft);
  background: rgba(255, 255, 255, .97);
  backdrop-filter: blur(8px);
}

.fpm-queue-title {
  display: flex;
  flex: 1 1 100%;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  min-width: 0;
}

.fpm-queue-title strong {
  line-height: 1.25;
}

.fpm-queue-title span {
  display: grid;
  min-width: 2rem;
  height: 2rem;
  place-items: center;
  border-radius: 999px;
  background: #dce8e8;
  font-weight: 850;
}

.fpm-shell .fpm-queue-toggle {
  display: none;
}

.fpm-queue-body {
  min-width: 0;
}

.fpm-shell .fpm-add-object {
  width: 100%;
  min-height: 2.35rem;
  padding: .42rem .65rem;
  font-size: .76rem;
}

.fpm-queue-create {
  display: grid;
  gap: .55rem;
  padding: .8rem;
  border-bottom: 1px solid var(--fpm-border-soft);
  background: var(--fpm-surface-soft);
}

.fpm-queue-create > p {
  margin: 0;
  color: var(--fpm-muted);
  font-size: .76rem;
  line-height: 1.4;
}

.fpm-shell .fpm-object {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  width: 100%;
  min-height: 4.45rem;
  align-items: center;
  gap: .68rem;
  border: 0 !important;
  border-bottom: 1px solid var(--fpm-border-soft) !important;
  border-radius: 0 !important;
  background:
    linear-gradient(90deg, var(--fpm-object-soft, transparent), transparent 42%),
    #fff !important;
  color: var(--fpm-ink) !important;
  padding: .72rem .7rem !important;
  text-align: left;
  white-space: normal;
  box-shadow: inset 4px 0 var(--fpm-object-color, var(--fpm-blue));
}

.fpm-shell .fpm-object:hover {
  background:
    linear-gradient(90deg, var(--fpm-object-soft-strong, #f3f7f6), transparent 58%),
    #fff !important;
}

.fpm-shell .fpm-object.is-selected {
  background:
    linear-gradient(90deg, var(--fpm-object-soft-strong, #e8f4f0), transparent 72%),
    #fff !important;
  box-shadow: inset 5px 0 var(--fpm-object-color, var(--fpm-blue));
}

.fpm-object > span {
  display: grid;
  min-width: 0;
  gap: .16rem;
}

.fpm-object strong {
  overflow-wrap: anywhere;
  font-size: .84rem;
  line-height: 1.28;
  white-space: normal;
}

.fpm-object small {
  overflow-wrap: anywhere;
  color: var(--fpm-muted);
  font-size: .71rem;
  line-height: 1.34;
  white-space: normal;
}

/* Colonna operativa: resta disponibile su desktop, torna nel flusso su mobile. */
.fpm-canvas-column {
  grid-area: canvas;
  position: sticky;
  top: .75rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto auto minmax(0, auto);
  grid-template-areas:
    "maptools"
    "correction"
    "map";
  align-self: start;
  min-width: 0;
  max-width: 100%;
  gap: .65rem;
}

.fpm-map-tools {
  grid-area: maptools;
  display: flex;
  min-width: 0;
  align-items: center;
  gap: .55rem .75rem;
  flex-wrap: wrap;
  padding: .58rem .65rem;
  border: 1px solid var(--fpm-border);
  border-radius: .7rem;
  background: rgba(255, 255, 255, .98);
  box-shadow: var(--fpm-shadow-sm);
}

.fpm-view-status {
  display: flex;
  min-width: 8.5rem;
  align-items: center;
  gap: .55rem;
  padding-right: .2rem;
}

.fpm-view-status > span:last-child {
  display: grid;
  min-width: 0;
}

.fpm-view-status small {
  color: var(--fpm-muted);
  font-size: .64rem;
  font-weight: 780;
  letter-spacing: .07em;
  line-height: 1.1;
  text-transform: uppercase;
}

.fpm-view-status strong {
  overflow: hidden;
  font-size: .78rem;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fpm-view-dot {
  width: .65rem;
  height: .65rem;
  flex: 0 0 .65rem;
  border: 2px solid #667b82;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 0 3px #e7ecec;
}

.fpm-view-dot.is-working {
  border-color: var(--fpm-green);
  background: var(--fpm-green);
  box-shadow: 0 0 0 3px var(--fpm-green-soft);
}

.fpm-view-dot.is-candidate {
  border-color: var(--fpm-amber);
  background: #d89a1b;
  box-shadow: 0 0 0 3px #fff0c8;
}

.fpm-zoom-controls,
.fpm-source-controls,
.fpm-compare-switch,
.fpm-correction-actions {
  display: flex;
  align-items: center;
  gap: .4rem;
  flex-wrap: wrap;
}

.fpm-zoom-controls {
  margin-left: auto;
  padding: .2rem;
  border: 1px solid var(--fpm-border-soft);
  border-radius: .58rem;
  background: var(--fpm-surface-soft);
}

.fpm-zoom-controls output {
  min-width: 3.6rem;
  color: #2f4852;
  font-size: .76rem;
  font-weight: 820;
  text-align: center;
}

.fpm-shell .fpm-map-tools button {
  min-height: 2.35rem;
  padding: .42rem .65rem;
  font-size: .74rem;
}

.fpm-shell .fpm-map-tools .fpm-tool-icon {
  display: grid;
  width: 2.35rem;
  min-width: 2.35rem;
  padding: 0;
  place-items: center;
  font-size: 1.25rem;
  line-height: 1;
}

.fpm-source-controls {
  margin-left: auto;
}

.fpm-correction-panel {
  grid-area: correction;
  display: grid;
  grid-template-columns: minmax(12rem, .65fr) minmax(24rem, 1.85fr);
  gap: .8rem 1rem;
  align-items: center;
  min-width: 0;
  padding: .85rem;
  border: 1px solid #aac1ca;
  border-left: 4px solid var(--fpm-blue);
  border-radius: .7rem;
  background: #f3f8fa;
  box-shadow: var(--fpm-shadow-sm);
}

.fpm-correction-panel.is-active {
  grid-template-columns: minmax(14rem, 1fr) minmax(10rem, .4fr) auto;
  border-color: #d1ae69;
  border-left-color: var(--fpm-amber);
  background: #fff9ec;
}

.fpm-correction-panel.is-candidate {
  grid-template-columns: minmax(14rem, 1fr) auto auto;
  border-color: #86b29f;
  border-left-color: var(--fpm-green);
  background: #eff8f3;
}

.fpm-correction-copy {
  min-width: 0;
}

.fpm-correction-copy h3 {
  font-size: 1rem;
  line-height: 1.25;
}

.fpm-correction-copy p {
  margin: .28rem 0 0;
  color: var(--fpm-muted);
  font-size: .77rem;
  line-height: 1.45;
}

.fpm-correction-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .55rem;
  min-width: 0;
}

.fpm-shell .fpm-correction-options button {
  display: grid;
  min-width: 0;
  min-height: 5.4rem;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas:
    "icon title"
    "copy copy";
  align-content: start;
  align-items: start;
  gap: .32rem .55rem;
  overflow: hidden;
  padding: .62rem;
  text-align: left;
  white-space: normal !important;
}

.fpm-correction-options button:hover:not(:disabled) {
  border-color: var(--fpm-blue);
  background: #eef7fb !important;
}

.fpm-option-icon {
  grid-area: icon;
  display: grid;
  width: 2rem;
  height: 2rem;
  align-self: start;
  place-items: center;
  border-radius: .5rem;
  background: #dcecf3;
  color: var(--fpm-blue-dark);
  font-size: 1.15rem;
}

.fpm-correction-options strong {
  grid-area: title;
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: .76rem;
  line-height: 1.25;
  white-space: normal !important;
}

.fpm-correction-options small {
  grid-area: copy;
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--fpm-muted);
  font-size: .66rem;
  font-weight: 550;
  line-height: 1.3;
  padding-top: .08rem;
  white-space: normal !important;
}

.fpm-style-choice {
  display: grid;
  gap: .3rem;
  color: #40555d;
  font-size: .73rem;
  font-weight: 780;
}

.fpm-style-choice select {
  min-height: 2.65rem;
  border: 1px solid var(--fpm-border);
  border-radius: .5rem;
  background: #fff;
  color: var(--fpm-ink);
  padding: .45rem .55rem;
}

.fpm-correction-actions {
  justify-content: flex-end;
}

.fpm-compare-switch {
  padding: .2rem;
  border: 1px solid #b8cbc2;
  border-radius: .6rem;
  background: #fff;
}

.fpm-compare-switch button,
.fpm-correction-actions button {
  min-height: 2.55rem;
  white-space: nowrap;
}

.fpm-review-note {
  max-width: 14rem;
  margin: 0;
  color: #335a49;
  font-size: .74rem;
  font-weight: 760;
  line-height: 1.35;
}

.fpm-original-preserved {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .65rem;
  padding-top: .65rem;
  border-top: 1px solid #cadadd;
  color: #38515a;
  font-size: .74rem;
  font-weight: 760;
}

.fpm-stage-wrap {
  grid-area: map;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-width: 0;
  max-width: 100%;
  min-height: 0;
  overflow: hidden;
  border: 1px solid #aebbbc;
  border-radius: .75rem;
  background: var(--fpm-surface);
  box-shadow: 0 8px 26px rgba(7, 28, 36, .13);
}

.fpm-stage-help {
  position: relative;
  z-index: 3;
  min-height: 2.8rem;
  margin: 0;
  padding: .7rem .82rem;
  border-bottom: 1px solid #b9d0dc;
  border-left: 4px solid var(--fpm-blue);
  background: var(--fpm-surface-blue);
  color: #173f57;
  font-size: .78rem;
  line-height: 1.42;
}

.fpm-stage-wrap.is-placement-mode .fpm-stage-help {
  border-left-color: var(--fpm-amber);
  background: var(--fpm-amber-soft);
  color: #563d0b;
}

/*
 * Il viewport ritaglia lo stage trasformato da JS. touch-action:none consente
 * allo stesso gestore di interpretare trascinamento e pinch su Android/iOS.
 */
.fpm-viewport {
  position: relative;
  min-width: 0;
  max-width: 100%;
  height: clamp(28rem, 68dvh, 50rem);
  min-height: 20rem;
  overflow: hidden;
  border: 0;
  background-color: #dfe6e5;
  background-image:
    linear-gradient(45deg, rgba(7, 28, 36, .035) 25%, transparent 25%),
    linear-gradient(-45deg, rgba(7, 28, 36, .035) 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, rgba(7, 28, 36, .035) 75%),
    linear-gradient(-45deg, transparent 75%, rgba(7, 28, 36, .035) 75%);
  background-position: 0 0, 0 8px, 8px -8px, -8px 0;
  background-size: 16px 16px;
  box-shadow: inset 0 0 0 1px rgba(7, 28, 36, .08);
  cursor: grab;
  touch-action: none;
  user-select: none;
  overscroll-behavior: contain;
  contain: layout paint;
}

.fpm-viewport:active,
.fpm-viewport.is-zoomed:active {
  cursor: grabbing;
}

.fpm-stage-wrap.is-placement-mode .fpm-viewport,
.fpm-stage-wrap.is-placement-mode .fpm-stage {
  cursor: crosshair;
}

.fpm-stage {
  --fpm-marker-inverse: 1;
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  min-height: 0;
  overflow: visible;
  border: 0;
  background: #fff;
  line-height: 0;
  transform-origin: 0 0;
  will-change: transform;
}

.fpm-stage.is-placement-mode {
  box-shadow: inset 0 0 0 5px var(--fpm-green);
}

.fpm-stage.is-boundary-mode {
  box-shadow: inset 0 0 0 5px var(--fpm-blue);
}

.fpm-stage-wrap.is-boundary-mode .fpm-stage-help {
  border-left-color: var(--fpm-blue);
  background: #eef7fb;
  color: #173f57;
}

.fpm-stage-wrap.is-boundary-mode .fpm-viewport,
.fpm-stage-wrap.is-boundary-mode .fpm-stage {
  cursor: crosshair;
}

.fpm-stage > img {
  position: absolute;
  z-index: 0;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: fill;
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
}

.fpm-grid {
  position: absolute;
  z-index: 2;
  inset: 0;
  background-image:
    linear-gradient(to right, rgba(7, 28, 36, .24) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(7, 28, 36, .24) 1px, transparent 1px),
    linear-gradient(to right, rgba(7, 28, 36, .16) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(7, 28, 36, .16) 1px, transparent 1px);
  background-size:
    calc(400% / var(--fpm-columns)) calc(400% / var(--fpm-rows)),
    calc(400% / var(--fpm-columns)) calc(400% / var(--fpm-rows)),
    calc(100% / var(--fpm-columns)) calc(100% / var(--fpm-rows)),
    calc(100% / var(--fpm-columns))
    calc(100% / var(--fpm-rows));
  pointer-events: none;
}

.fpm-grid-coordinates {
  position: absolute;
  z-index: 6;
  inset: 0;
  overflow: hidden;
  color: #071c24;
  font-size: .58rem;
  font-weight: 850;
  line-height: 1;
  pointer-events: none;
}

.fpm-grid-axis {
  position: absolute;
  inset: 0;
}

.fpm-grid-axis span {
  position: absolute;
  display: grid;
  min-width: 1.05rem;
  height: 1rem;
  padding: 0 .12rem;
  place-items: center;
  border: 1px solid rgba(7, 28, 36, .28);
  border-radius: .2rem;
  background: rgba(255, 255, 255, .88);
  box-shadow: 0 1px 2px rgba(7, 28, 36, .14);
  transform-origin: top left;
}

.fpm-grid-axis.is-columns span {
  top: .18rem;
  transform: translateX(-50%) scale(var(--fpm-marker-inverse, 1));
  transform-origin: top center;
}

.fpm-grid-axis.is-rows span {
  left: .18rem;
  min-width: 0;
  height: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-shadow:
    -1px -1px 0 #fff,
    1px -1px 0 #fff,
    -1px 1px 0 #fff,
    1px 1px 0 #fff,
    0 0 4px #fff;
  transform: translateY(-50%) scale(var(--fpm-marker-inverse, 1));
  transform-origin: left center;
}

.fpm-room-layer {
  position: absolute;
  z-index: 4;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.fpm-room-shape {
  fill: var(--fpm-object-soft, var(--fpm-room-fill));
  stroke: var(--fpm-object-color, var(--fpm-blue));
  stroke-width: .006;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
  pointer-events: visiblePainted;
  cursor: pointer;
  transition: fill .15s ease, stroke .15s ease;
}

.fpm-stage.is-placement-mode .fpm-room-shape,
.fpm-stage.is-boundary-mode .fpm-room-shape {
  pointer-events: none;
}

.fpm-room-shape:hover,
.fpm-room-shape:focus-visible,
.fpm-room-shape.is-selected {
  fill: var(--fpm-object-soft-strong, var(--fpm-room-fill-active));
  stroke: var(--fpm-object-color, #123f5c);
  outline: none;
}

.fpm-room-shape:focus-visible {
  filter: drop-shadow(0 0 4px #fff) drop-shadow(0 0 3px var(--fpm-focus));
}

.fpm-room-shape.is-verified {
  fill: var(--fpm-object-soft, var(--fpm-room-fill-verified));
  stroke: var(--fpm-object-color, var(--fpm-green));
}

.fpm-room-shape.is-rejected {
  stroke: var(--fpm-object-color, #b75d16);
  stroke-dasharray: .014 .009;
}

.fpm-room-shape.is-draft {
  fill: var(--fpm-object-soft-strong, var(--fpm-room-fill-draft));
  stroke: var(--fpm-object-color, var(--fpm-blue-dark));
  stroke-dasharray: .015 .008;
  pointer-events: none;
}

.fpm-room-shape.is-draft.is-manual {
  fill: var(--fpm-object-soft-strong, var(--fpm-room-fill-manual));
  stroke: var(--fpm-object-color, var(--fpm-amber));
}

.fpm-shell button.fpm-room-handle {
  position: absolute;
  z-index: 9;
  display: grid;
  width: 2.6rem;
  height: 2.6rem;
  min-width: 2.6rem !important;
  min-height: 2.6rem !important;
  padding: 0 !important;
  place-items: center;
  border: 3px solid #fff !important;
  border-radius: 50% !important;
  background: var(--fpm-blue-dark) !important;
  color: #fff !important;
  font-size: .69rem;
  line-height: 1;
  touch-action: none;
  transform: translate(-50%, -50%) scale(var(--fpm-marker-inverse, 1)) !important;
  transform-origin: center;
  box-shadow: 0 0 0 3px var(--fpm-blue), 0 5px 14px rgba(7, 28, 36, .30);
}

.fpm-shell button.fpm-room-handle:hover,
.fpm-shell button.fpm-room-handle:active {
  transform: translate(-50%, -50%) scale(var(--fpm-marker-inverse, 1)) !important;
  box-shadow: 0 0 0 4px #fff, 0 0 0 8px var(--fpm-blue), 0 5px 16px rgba(7, 28, 36, .36);
}

.fpm-stage-wrap.is-previewing-source .fpm-grid,
.fpm-stage-wrap.is-previewing-source .fpm-grid-coordinates {
  opacity: .38;
}

.fpm-gesture-hint {
  min-height: 1.9rem;
  margin: 0;
  padding: .43rem .72rem;
  border-top: 1px solid var(--fpm-border-soft);
  background: #f7f9f8;
  color: #53676e;
  font-size: .68rem;
  font-weight: 680;
  line-height: 1.25;
  text-align: center;
}

.fpm-icon {
  display: block;
  width: 1.12rem;
  height: 1.12rem;
  flex: 0 0 auto;
}

.fpm-icon.is-filled {
  fill: currentColor;
  stroke: none;
}

.fpm-symbol,
.fpm-marker {
  display: grid;
  place-items: center;
  border: 2px solid #fff !important;
  color: #fff;
  font-style: normal;
  font-weight: 900;
}

.fpm-symbol {
  width: 2.1rem;
  height: 2.1rem;
  flex: 0 0 2.1rem;
  box-shadow: 0 2px 5px rgba(7, 28, 36, .16);
}

/*
 * Lo stage viene scalato; l'inverso annulla lo zoom sul marcatore.
 * La trasformazione resta identica in hover/active, quindi il punto non salta.
 */
.fpm-shell button.fpm-marker {
  position: absolute;
  z-index: 5;
  width: 2.75rem;
  height: 2.75rem;
  min-width: 2.75rem !important;
  min-height: 2.75rem !important;
  padding: 0 !important;
  transform: translate(-50%, -50%) scale(var(--fpm-marker-inverse, 1)) !important;
  transform-origin: center;
  box-shadow: 0 3px 10px rgba(7, 28, 36, .40);
  transition: box-shadow .15s ease, filter .15s ease !important;
  will-change: transform;
}

.fpm-marker:not(.is-environment) .fpm-icon {
  width: 1.72rem;
  height: 1.72rem;
  filter: none;
  stroke-width: 2.6;
  transition: filter .15s ease;
}

.fpm-shell button.fpm-marker:hover:not(:disabled),
.fpm-shell button.fpm-marker:active:not(:disabled) {
  transform: translate(-50%, -50%) scale(var(--fpm-marker-inverse, 1)) !important;
}

.fpm-shell button.fpm-marker:hover:not(:disabled) {
  filter: brightness(1.08);
  box-shadow: 0 0 0 3px #fff, 0 0 0 6px rgba(7, 28, 36, .55), 0 5px 15px rgba(7, 28, 36, .34);
}

.fpm-shell button.fpm-marker.is-selected {
  z-index: 7;
  box-shadow: 0 0 0 3px #fff, 0 0 0 7px var(--fpm-ink), 0 5px 16px rgba(7, 28, 36, .36);
}

.fpm-shell button.fpm-marker.is-draft {
  z-index: 8;
  outline: 3px dashed var(--fpm-ink);
  outline-offset: 5px;
  box-shadow: 0 0 0 3px #fff, 0 5px 16px rgba(7, 28, 36, .38);
}

.fpm-marker.is-verified::after {
  content: "✓";
  position: absolute;
  top: -.48rem;
  right: -.42rem;
  display: grid;
  width: 1.25rem;
  height: 1.25rem;
  place-items: center;
  border: 2px solid #fff;
  border-radius: 50%;
  background: var(--fpm-green);
  color: #fff;
  font-size: .68rem;
  font-weight: 900;
  line-height: 1;
}

.fpm-symbol.is-environment,
.fpm-marker.is-environment {
  border-radius: 50% !important;
  background: var(--fpm-object-color, #286f9e) !important;
}

.fpm-symbol.is-equipment,
.fpm-marker.is-equipment {
  --fpm-category-color: #5d428d;
}

.fpm-symbol.is-fire_safety,
.fpm-marker.is-fire_safety {
  --fpm-category-color: #9b3028;
}

.fpm-symbol.is-first_aid,
.fpm-marker.is-first_aid {
  --fpm-category-color: #146b4c;
}

.fpm-symbol.is-electrical,
.fpm-marker.is-electrical {
  --fpm-category-color: #755400;
}

.fpm-symbol.is-emergency,
.fpm-marker.is-emergency {
  --fpm-category-color: #a53e12;
}

.fpm-symbol.is-other,
.fpm-marker.is-other {
  --fpm-category-color: #46545b;
}

.fpm-symbol:not(.is-environment),
.fpm-marker:not(.is-environment) {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--fpm-object-color, var(--fpm-category-color)) !important;
}

.fpm-symbol:not(.is-environment) {
  box-shadow: none;
}

.fpm-marker:not(.is-environment) {
  box-shadow: none !important;
}

.fpm-symbol:not(.is-environment) .fpm-icon {
  width: 1.35rem;
  height: 1.35rem;
  filter: none;
  stroke-width: 2.6;
}

.fpm-shell button.fpm-marker:not(.is-environment):hover:not(:disabled),
.fpm-shell button.fpm-marker:not(.is-environment):active:not(:disabled),
.fpm-shell button.fpm-marker:not(.is-environment).is-selected,
.fpm-shell button.fpm-marker:not(.is-environment).is-draft {
  box-shadow: none;
  filter: none;
}

.fpm-shell button.fpm-marker:not(.is-environment).is-draft {
  outline: 0;
}

.fpm-shell button.fpm-marker:not(.is-environment):hover .fpm-icon,
.fpm-shell button.fpm-marker:not(.is-environment).is-selected .fpm-icon,
.fpm-shell button.fpm-marker:not(.is-environment).is-draft .fpm-icon {
  filter: drop-shadow(0 1px 1px rgba(7, 28, 36, .34));
  stroke-width: 2.85;
}

.fpm-marker:not(.is-environment).is-verified::after {
  top: -.22rem;
  right: -.12rem;
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--fpm-green);
  font-size: .9rem;
  text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
}

.fpm-correction-overlay {
  position: absolute;
  z-index: 9;
  inset: 0;
  pointer-events: none;
}

.fpm-correction-overlay svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.fpm-correction-overlay polygon {
  fill: rgba(20, 107, 76, .16);
  stroke: #08734d;
  stroke-width: .006;
  vector-effect: non-scaling-stroke;
}

.fpm-shell button.fpm-corner {
  position: absolute;
  z-index: 10;
  display: grid;
  width: 2.75rem;
  height: 2.75rem;
  min-width: 2.75rem;
  min-height: 2.75rem;
  padding: 0;
  place-items: center;
  border: 3px solid #fff;
  border-radius: 50%;
  background: var(--fpm-green);
  color: #fff;
  font-size: .78rem;
  font-weight: 900;
  line-height: 1;
  pointer-events: auto;
  touch-action: none;
  transform: translate(-50%, -50%) scale(var(--fpm-marker-inverse, 1));
  transform-origin: center;
  box-shadow: 0 0 0 3px var(--fpm-green), 0 5px 14px rgba(7, 28, 36, .32);
  transition: box-shadow .15s ease !important;
}

.fpm-shell button.fpm-corner:hover:not(:disabled),
.fpm-shell button.fpm-corner:active:not(:disabled) {
  transform: translate(-50%, -50%) scale(var(--fpm-marker-inverse, 1));
  box-shadow: 0 0 0 4px #fff, 0 0 0 8px var(--fpm-green), 0 5px 16px rgba(7, 28, 36, .38);
}

.fpm-stage.is-preview-error {
  min-height: 22rem;
  cursor: default;
  background: linear-gradient(135deg, #f7faf9, #e9efef);
}

.fpm-stage.is-preview-error > .fpm-grid,
.fpm-stage.is-preview-error > .fpm-grid-coordinates,
.fpm-stage.is-preview-error > .fpm-marker,
.fpm-stage.is-preview-error > .fpm-room-layer,
.fpm-stage.is-preview-error > .fpm-room-handle,
.fpm-stage.is-preview-error > .fpm-correction-overlay {
  display: none;
}

.fpm-preview-error {
  position: absolute;
  z-index: 12;
  inset: 0;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: .55rem;
  padding: 2rem;
  background: rgba(247, 250, 249, .96);
  color: #32464e;
  line-height: 1.45;
  text-align: center;
}

.fpm-preview-error[hidden] {
  display: none;
}

.fpm-preview-error span {
  font-size: 2rem;
}

.fpm-preview-error p {
  max-width: 26rem;
  margin: 0;
}

/* Stesso grid-area della mappa: overlay su desktop, contenuto normale su mobile. */
.fpm-detail {
  --fpm-detail-x: 0px;
  --fpm-detail-y: 0px;
  grid-area: map;
  position: relative;
  z-index: 20;
  align-self: start;
  justify-self: end;
  width: min(22rem, calc(100% - 1.5rem));
  max-height: min(43rem, calc(68dvh - 1.5rem));
  margin: 4.2rem .75rem .75rem;
  overflow: auto;
  padding: 1rem;
  border: 1px solid var(--fpm-border);
  border-left: 5px solid var(--fpm-object-color, var(--fpm-border));
  border-radius: .72rem;
  background: rgba(255, 255, 255, .98);
  box-shadow: var(--fpm-shadow-lg);
  scrollbar-gutter: stable;
  transform: translate3d(var(--fpm-detail-x), var(--fpm-detail-y), 0);
  will-change: transform;
}

.fpm-detail.is-environment {
  width: min(26rem, calc(100% - 1.5rem));
}

.fpm-detail.is-moving {
  box-shadow: 0 18px 44px rgba(7, 28, 36, .28);
  user-select: none;
}

.fpm-detail-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .75rem;
  padding-bottom: .75rem;
  border-bottom: 1px solid var(--fpm-border-soft);
}

.fpm-detail-head > div:first-child {
  min-width: 0;
}

.fpm-detail-head-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: .35rem;
}

.fpm-shell button.fpm-detail-drag {
  display: inline-flex;
  width: 3.2rem;
  min-width: 3.2rem;
  min-height: 2.75rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .04rem;
  padding: .2rem .28rem !important;
  border-color: #aebfc3 !important;
  background: #f4f8f7 !important;
  color: #29434c !important;
  cursor: grab;
  touch-action: none;
}

.fpm-shell button.fpm-detail-drag:active,
.fpm-detail.is-moving .fpm-detail-drag {
  border-color: var(--fpm-object-color, var(--fpm-blue)) !important;
  background: #e6f1ee !important;
  cursor: grabbing;
}

.fpm-detail-drag > span {
  color: var(--fpm-object-color, var(--fpm-blue));
  font-size: 1.2rem;
  line-height: 1;
}

.fpm-detail-drag > small {
  color: inherit;
  font-size: .57rem;
  font-weight: 800;
  line-height: 1;
}

.fpm-detail-head .fpm-eyebrow {
  color: var(--fpm-object-color, var(--fpm-muted));
}

.fpm-profile-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .7rem;
  align-items: start;
  margin-top: .8rem;
  padding: .72rem;
  border: 1px solid #c8d7da;
  border-radius: .62rem;
  background: #f5f9f8;
}

.fpm-profile-summary p {
  margin: .2rem 0 0;
  color: #243d46;
  font-size: .78rem;
  line-height: 1.48;
  white-space: pre-wrap;
}

.fpm-profile-summary small {
  display: block;
  margin-top: .4rem;
  color: var(--fpm-muted);
  font-size: .68rem;
  line-height: 1.38;
}

.fpm-profile-form {
  display: grid;
  gap: .7rem;
  margin-top: .8rem;
  padding: .82rem;
  border: 1px solid #7fa99c;
  border-radius: .65rem;
  background: #f1f8f5;
  box-shadow: inset 3px 0 0 var(--fpm-green);
}

.fpm-profile-form-head {
  display: flex;
  justify-content: space-between;
  gap: .7rem;
  align-items: flex-start;
}

.fpm-profile-form-head strong {
  display: block;
  margin-top: .12rem;
  font-size: .84rem;
}

.fpm-profile-form > p {
  margin: 0;
  color: var(--fpm-muted);
  font-size: .7rem;
  line-height: 1.42;
}

.fpm-detail h3 {
  overflow-wrap: anywhere;
  font-size: 1rem;
  line-height: 1.28;
}

.fpm-shell .fpm-detail-close {
  display: grid;
  width: 2.75rem;
  min-width: 2.75rem !important;
  min-height: 2.75rem !important;
  flex: 0 0 2.75rem;
  padding: .2rem !important;
  place-items: center;
  font-size: 1.32rem;
  font-weight: 450;
}

.fpm-shell button.fpm-detail-photo-preview {
  position: relative;
  display: block;
  width: 100%;
  min-height: 8.4rem;
  margin-top: .8rem;
  overflow: hidden;
  padding: 0 !important;
  border-color: #aebfc3 !important;
  border-radius: .62rem !important;
  background: #dce6e8 !important;
  color: #fff !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .35);
}

.fpm-primary-photo {
  position: relative;
  margin-top: .8rem;
}

.fpm-primary-photo .fpm-detail-photo-preview {
  margin-top: 0 !important;
}

.fpm-detail-photo-preview img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .18s ease;
}

.fpm-detail-photo-preview > span {
  position: absolute;
  right: .5rem;
  bottom: .5rem;
  left: .5rem;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: .6rem;
  padding: .48rem .55rem;
  border-radius: .42rem;
  background: rgba(7, 28, 36, .88);
  text-align: left;
}

.fpm-detail-photo-preview strong,
.fpm-detail-photo-preview small {
  display: block;
  color: #fff;
  line-height: 1.25;
}

.fpm-detail-photo-preview strong {
  font-size: .74rem;
}

.fpm-detail-photo-preview small {
  font-size: .65rem;
}

.fpm-shell button.fpm-detail-photo-preview:hover img {
  transform: scale(1.025);
}

.fpm-meta {
  display: grid;
  margin: .8rem 0;
}

.fpm-meta > div {
  display: grid;
  gap: .18rem;
  padding: .55rem 0;
  border-bottom: 1px solid var(--fpm-border-soft);
}

.fpm-meta dt {
  color: #526b78;
  font-size: .65rem;
  font-weight: 820;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.fpm-meta dd {
  margin: 0;
  font-size: .8rem;
  font-weight: 720;
  line-height: 1.38;
}

.fpm-source-note {
  margin: .8rem 0;
  padding: .7rem;
  border-left: 3px solid #78909a;
  background: var(--fpm-surface-soft);
  color: #32464e;
  font-size: .77rem;
  line-height: 1.45;
}

.fpm-warning,
.fpm-error {
  padding: .8rem;
  border-left: 4px solid var(--fpm-amber);
  background: var(--fpm-amber-soft);
  color: #573d0c;
}

.fpm-error {
  margin: 1rem;
}

.fpm-error p {
  margin: .4rem 0;
}

.fpm-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .5rem;
  margin-top: 1rem;
}

.fpm-actions button {
  width: 100%;
  min-width: 0;
  font-size: .76rem;
  white-space: normal;
}

.fpm-actions .danger {
  grid-column: 1 / -1;
}

.fpm-placement-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.fpm-room-choice,
.fpm-boundary-editor,
.fpm-icon-picker {
  display: grid;
  gap: .65rem;
  margin-top: .85rem;
  padding: .75rem;
  border: 1px solid #b9ccd4;
  border-radius: .65rem;
  background: #f3f8fa;
}

.fpm-room-choice strong,
.fpm-boundary-status strong,
.fpm-icon-picker strong {
  display: block;
  font-size: .82rem;
  line-height: 1.35;
}

.fpm-room-choice p {
  margin: .22rem 0 0;
  color: var(--fpm-muted);
  font-size: .73rem;
  line-height: 1.42;
}

.fpm-room-choice .fpm-actions,
.fpm-boundary-editor .fpm-actions {
  margin-top: 0;
}

.fpm-boundary-status {
  display: flex;
  align-items: center;
  gap: .62rem;
}

.fpm-boundary-status > span:last-child {
  display: grid;
  gap: .12rem;
}

.fpm-boundary-status small {
  color: var(--fpm-muted);
  font-size: .69rem;
  line-height: 1.3;
}

.fpm-boundary-swatch {
  width: 2rem;
  height: 1.35rem;
  flex: 0 0 2rem;
  border: 3px dashed var(--fpm-blue);
  border-radius: .25rem;
  background: rgba(40, 111, 158, .10);
}

.fpm-boundary-swatch.is-manual {
  border-color: var(--fpm-amber);
  background: rgba(134, 90, 8, .10);
}

.fpm-attachments {
  display: grid;
  gap: .55rem;
  margin-top: 1rem;
  padding-top: .75rem;
  border-top: 1px solid var(--fpm-border-soft);
}

.fpm-room-checklist {
  display: grid;
  gap: .55rem;
  margin-top: 1rem;
  padding: .85rem;
  border: 1px solid var(--fpm-border-soft);
  border-radius: .7rem;
  background: rgba(255, 255, 255, .72);
}

.fpm-room-checklist h4,
.fpm-room-checklist p { margin: 0; }
.fpm-room-checklist p { font-size: .76rem; line-height: 1.45; }
.fpm-room-checklist-note { color: var(--fpm-muted); }
.fpm-room-checklist-alert { color: #9a3412; }
.fpm-room-checklist-feedback { color: #155e43; }
.fpm-room-checklist-feedback.is-error { color: #9a3412; }
.fpm-room-checklist-scope { border: 1px solid var(--fpm-border-soft); border-radius: .45rem; }
.fpm-room-checklist-scope summary { cursor: pointer; padding: .55rem .65rem; font-size: .76rem; font-weight: 700; }
.fpm-room-checklist-scope summary small { color: var(--fpm-muted); font-weight: 400; }
.fpm-room-checklist-scope ul { list-style: none; margin: 0; padding: 0 .65rem .4rem; }
.fpm-room-checklist-scope li { display: flex; justify-content: space-between; gap: .6rem; padding: .5rem 0; border-top: 1px solid var(--fpm-border-soft); font-size: .73rem; }
.fpm-room-checklist-scope li > span:first-child { min-width: 0; }
.fpm-room-checklist-scope li strong,
.fpm-room-checklist-scope li small,
.fpm-room-checklist-state span { display: block; }
.fpm-room-checklist-scope li small,
.fpm-room-checklist-state span { margin-top: .15rem; color: var(--fpm-muted); font-size: .68rem; }
.fpm-room-checklist-state { flex: 0 0 7.5rem; text-align: right; font-weight: 700; }
.fpm-room-photo-link { display: grid; gap: .5rem; margin-top: .3rem; padding-top: .7rem; border-top: 1px solid var(--fpm-border-soft); }
.fpm-room-photo-link > strong { font-size: .79rem; }
.fpm-room-photo-link label { display: grid; gap: .2rem; font-size: .72rem; font-weight: 700; }
.fpm-room-photo-link select { min-width: 0; max-width: 100%; width: 100%; }
.fpm-room-photo-link p { color: var(--fpm-muted); }
.fpm-room-photo-link button { justify-self: start; }

@media (max-width: 540px) {
  .fpm-room-checklist-scope li { display: grid; gap: .2rem; }
  .fpm-room-checklist-state { text-align: left; }
}

.fpm-attachments h4,
.fpm-attachments p {
  margin: 0;
}

.fpm-attachments .fpm-primary-photo-note {
  color: var(--fpm-muted);
  font-size: .72rem;
  line-height: 1.4;
}

.fpm-attachments a {
  display: block;
  overflow-wrap: anywhere;
}

.fpm-attachment-actions {
  display: grid;
  gap: .5rem;
  margin-top: .2rem;
}

.fpm-attachment-actions button {
  width: 100%;
}

.fpm-attachment-form label small {
  color: var(--fpm-muted);
  font-size: .67rem;
  font-weight: 600;
}

.fpm-upload-queue {
  display: grid;
  gap: .42rem;
  padding: .55rem;
  border: 1px solid #cfdbde;
  border-radius: .5rem;
  background: #f7faf9;
}

.fpm-upload-queue[hidden] {
  display: none;
}

.fpm-upload-queue > div {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .22rem .55rem;
  overflow: hidden;
  padding: .38rem .42rem .5rem;
  border-radius: .38rem;
  background: #fff;
}

.fpm-upload-queue span,
.fpm-upload-queue span strong,
.fpm-upload-queue span small {
  display: block;
  min-width: 0;
}

.fpm-upload-queue span strong {
  overflow: hidden;
  font-size: .68rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fpm-upload-queue span small,
.fpm-upload-queue em {
  color: var(--fpm-muted);
  font-size: .62rem;
  font-style: normal;
}

.fpm-upload-queue > div > i {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 3px;
  background: #dfe9e7;
}

.fpm-upload-queue > div > i b {
  display: block;
  height: 100%;
  background: var(--fpm-green);
  transition: width .12s linear;
}

.fpm-upload-queue .is-complete em { color: #176247; }
.fpm-upload-queue .is-error em { color: #9c2e2e; }
.fpm-upload-queue .is-error > i b { background: #b23a3a; }

.fpm-mobile-capture {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 9rem;
  gap: .8rem;
  align-items: center;
  margin-top: .25rem;
  padding: .75rem;
  border: 1px solid #7bada1;
  border-radius: .65rem;
  background: linear-gradient(145deg, #eff8f5, #fff);
}

.fpm-mobile-capture-copy strong {
  display: block;
  margin-top: .16rem;
  font-size: .84rem;
}

.fpm-mobile-capture-copy p {
  margin: .3rem 0 .55rem;
  color: #385159;
  font-size: .72rem;
  line-height: 1.45;
}

.fpm-mobile-capture > img {
  width: 9rem;
  height: 9rem;
  padding: .35rem;
  border: 1px solid #c6d8d4;
  border-radius: .45rem;
  background: #fff;
}

.fpm-capture-status {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  color: #176247;
  font-size: .68rem;
  font-weight: 780;
}

.fpm-capture-status i {
  width: .5rem;
  height: .5rem;
  border-radius: 50%;
  background: #23a979;
  box-shadow: 0 0 0 .22rem rgba(35, 169, 121, .15);
  animation: fpmCapturePulse 1.7s ease-in-out infinite;
}

.fpm-mobile-capture-actions {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .45rem;
}

.fpm-mobile-capture-actions a,
.fpm-mobile-capture-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 2.55rem;
  padding: .5rem .65rem;
  border: 1px solid var(--fpm-border);
  border-radius: .48rem;
  background: #fff;
  color: var(--fpm-ink);
  font-size: .7rem;
  font-weight: 800;
  text-align: center;
  text-decoration: none;
}

.fpm-mobile-capture.is-success,
.fpm-mobile-capture.is-expired {
  grid-template-columns: auto minmax(0, 1fr) auto;
}

.fpm-mobile-capture.is-success { border-color: #76aa91; background: #eef8f2; }
.fpm-mobile-capture.is-expired { border-color: #d2af67; background: #fff8e7; }
.fpm-mobile-capture-icon { color: #176247; font-size: 1.4rem; font-weight: 900; }

@keyframes fpmCapturePulse {
  50% { opacity: .45; transform: scale(.8); }
}

.fpm-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .65rem;
}

.fpm-section-title > div {
  min-width: 0;
}

.fpm-section-title > span {
  flex: 0 0 auto;
  padding: .24rem .45rem;
  border-radius: 999px;
  background: #e4ecec;
  color: #344b54;
  font-size: .66rem;
  font-weight: 800;
}

.fpm-photo-gallery {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .45rem;
}

.fpm-photo-entry {
  position: relative;
  min-width: 0;
  min-height: 5.2rem;
}

.fpm-photo-entry .fpm-photo {
  width: 100%;
  height: 100%;
}

.fpm-shell button.fpm-photo {
  position: relative;
  min-height: 5.2rem;
  overflow: hidden;
  padding: 0 !important;
  border-color: #bac7c8 !important;
  background: #e7eded !important;
}

.fpm-shell button.fpm-photo.is-primary {
  grid-column: 1 / -1;
  min-height: 10.5rem;
}

.fpm-photo img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.fpm-photo span {
  position: absolute;
  right: .35rem;
  bottom: .35rem;
  left: .35rem;
  overflow: hidden;
  padding: .35rem .45rem;
  border-radius: .35rem;
  background: rgba(7, 28, 36, .88);
  color: #fff;
  font-size: .65rem;
  line-height: 1.2;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fpm-document-list {
  display: grid;
  gap: .35rem;
}

.fpm-document-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .4rem;
  align-items: stretch;
}

.fpm-document-list a {
  padding: .48rem .55rem;
  border: 1px solid var(--fpm-border-soft);
  border-radius: .45rem;
  background: var(--fpm-surface-soft);
  font-size: .74rem;
  font-weight: 700;
}

.fpm-shell button.fpm-attachment-delete {
  min-height: 2.35rem;
  padding: .38rem .58rem !important;
  border-color: #c97979 !important;
  background: #fff7f5 !important;
  color: #8b2828 !important;
  font-size: .68rem;
  font-weight: 820;
}

.fpm-shell button.fpm-attachment-delete:hover,
.fpm-shell button.fpm-attachment-delete:focus-visible {
  border-color: #9f3636 !important;
  background: #ffe9e5 !important;
  color: #711d1d !important;
}

.fpm-shell button.fpm-attachment-delete.is-overlay {
  position: absolute;
  z-index: 4;
  top: .42rem;
  right: .42rem;
  min-height: 2rem;
  padding: .28rem .46rem !important;
  border-color: rgba(255, 255, 255, .86) !important;
  background: rgba(128, 28, 28, .94) !important;
  color: #fff !important;
  box-shadow: 0 2px 8px rgba(7, 28, 36, .24);
}

.fpm-icon-picker {
  border-color: #cfc4df;
  background: #f8f5fb;
}

.fpm-icon-picker .fpm-section-title > button {
  min-height: 2.3rem;
  flex: 0 0 auto;
  padding: .4rem .58rem;
  font-size: .7rem;
}

.fpm-icon-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .45rem;
}

.fpm-shell button.fpm-icon-choice {
  --fpm-category-color: #5d428d;
  display: grid;
  min-width: 0;
  min-height: 5.2rem;
  align-content: center;
  justify-items: center;
  gap: .38rem;
  padding: .55rem .35rem !important;
  background: #fff !important;
  color: var(--fpm-ink) !important;
  text-align: center;
}

.fpm-shell button.fpm-icon-choice.is-current {
  border-color: var(--fpm-object-color, var(--fpm-category-color)) !important;
  box-shadow: inset 0 0 0 2px var(--fpm-object-color, var(--fpm-category-color));
}

.fpm-icon-choice i {
  display: grid;
  width: 2.35rem;
  height: 2.35rem;
  place-items: center;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--fpm-object-color, var(--fpm-category-color));
}

.fpm-icon-choice.is-equipment { --fpm-category-color: #5d428d; }
.fpm-icon-choice.is-fire_safety { --fpm-category-color: #9b3028; }
.fpm-icon-choice.is-first_aid { --fpm-category-color: #146b4c; }
.fpm-icon-choice.is-electrical { --fpm-category-color: #755400; }
.fpm-icon-choice.is-emergency { --fpm-category-color: #a53e12; }
.fpm-icon-choice.is-other { --fpm-category-color: #46545b; }

.fpm-icon-choice .fpm-icon {
  width: 1.72rem;
  height: 1.72rem;
  filter: none;
  stroke-width: 2.6;
}

.fpm-icon-choice span {
  overflow-wrap: anywhere;
  font-size: .64rem;
  line-height: 1.25;
}

.fpm-photo-viewer {
  position: fixed;
  z-index: 14000;
  inset: 0;
  display: grid;
  align-items: center;
  justify-items: center;
  padding: clamp(1rem, 3vw, 3rem);
  background: rgba(7, 28, 36, .88);
  backdrop-filter: blur(5px);
}

.fpm-photo-viewer figure {
  display: grid;
  width: min(72rem, 100%);
  max-height: calc(100dvh - 4rem);
  grid-template-rows: minmax(0, 1fr) auto;
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: .8rem;
  background: #fff;
  box-shadow: 0 22px 70px rgba(0, 0, 0, .45);
}

.fpm-photo-viewer figure > img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: calc(100dvh - 9rem);
  object-fit: contain;
  background: #13272f;
}

.fpm-photo-viewer figcaption {
  display: flex;
  align-items: center;
  gap: .5rem 1rem;
  flex-wrap: wrap;
  padding: .75rem 1rem;
  color: var(--fpm-ink);
  line-height: 1.35;
}

.fpm-photo-viewer figcaption span {
  min-width: 0;
  flex: 1 1 14rem;
  color: var(--fpm-muted);
  overflow-wrap: anywhere;
}

.fpm-photo-viewer figcaption a {
  font-weight: 750;
}

.fpm-shell button.fpm-photo-viewer-close {
  position: fixed;
  z-index: 1;
  top: max(1rem, env(safe-area-inset-top));
  right: max(1rem, env(safe-area-inset-right));
  display: grid;
  width: 3rem;
  height: 3rem;
  min-width: 3rem;
  min-height: 3rem;
  padding: 0;
  place-items: center;
  border-color: rgba(255, 255, 255, .65);
  background: #fff !important;
  color: var(--fpm-ink) !important;
  font-size: 1.5rem;
}

.fpm-shell button.fpm-photo-viewer-nav {
  position: fixed;
  z-index: 2;
  top: 50%;
  display: grid;
  width: 3.25rem;
  height: 3.25rem;
  min-width: 3.25rem;
  min-height: 3.25rem;
  padding: 0;
  place-items: center;
  border-color: rgba(255, 255, 255, .72);
  background: #fff !important;
  color: var(--fpm-ink) !important;
  font-size: 2rem;
  transform: translateY(-50%);
}

.fpm-photo-viewer-nav.is-previous {
  left: max(1rem, env(safe-area-inset-left));
}

.fpm-photo-viewer-nav.is-next {
  right: max(1rem, env(safe-area-inset-right));
}

.fpm-detail .fpm-attachments form {
  grid-template-columns: 1fr;
}

.fpm-detail .fpm-attachments form button {
  justify-self: start;
}

/* Durante il puntamento lasciamo libera quasi tutta la superficie utile. */
.fpm-stage-wrap.is-placement-mode ~ .fpm-detail {
  width: min(19rem, calc(100% - 1.5rem));
  max-height: none;
}

.fpm-stage-wrap.is-placement-mode ~ .fpm-detail > .fpm-meta,
.fpm-stage-wrap.is-placement-mode ~ .fpm-detail > .fpm-source-note,
.fpm-stage-wrap.is-placement-mode ~ .fpm-detail > .fpm-warning,
.fpm-stage-wrap.is-placement-mode ~ .fpm-detail > .fpm-primary-photo,
.fpm-stage-wrap.is-placement-mode ~ .fpm-detail > .fpm-profile-summary,
.fpm-stage-wrap.is-placement-mode ~ .fpm-detail > .fpm-profile-form,
.fpm-stage-wrap.is-placement-mode ~ .fpm-detail > .fpm-icon-picker,
.fpm-stage-wrap.is-placement-mode ~ .fpm-detail > .fpm-record-actions,
.fpm-stage-wrap.is-placement-mode ~ .fpm-detail > .fpm-unplace-confirm,
.fpm-stage-wrap.is-placement-mode ~ .fpm-detail > .fpm-delete-confirm,
.fpm-stage-wrap.is-placement-mode ~ .fpm-detail > .fpm-attachments {
  display: none;
}

.fpm-stage-wrap.is-boundary-mode ~ .fpm-detail {
  width: min(20rem, calc(100% - 1.5rem));
  max-height: none;
}

.fpm-stage-wrap.is-boundary-mode ~ .fpm-detail > .fpm-meta,
.fpm-stage-wrap.is-boundary-mode ~ .fpm-detail > .fpm-source-note,
.fpm-stage-wrap.is-boundary-mode ~ .fpm-detail > .fpm-warning,
.fpm-stage-wrap.is-boundary-mode ~ .fpm-detail > .fpm-primary-photo,
.fpm-stage-wrap.is-boundary-mode ~ .fpm-detail > .fpm-profile-summary,
.fpm-stage-wrap.is-boundary-mode ~ .fpm-detail > .fpm-profile-form,
.fpm-stage-wrap.is-boundary-mode ~ .fpm-detail > .fpm-record-actions,
.fpm-stage-wrap.is-boundary-mode ~ .fpm-detail > .fpm-unplace-confirm,
.fpm-stage-wrap.is-boundary-mode ~ .fpm-detail > .fpm-icon-picker,
.fpm-stage-wrap.is-boundary-mode ~ .fpm-detail > .fpm-delete-confirm,
.fpm-stage-wrap.is-boundary-mode ~ .fpm-detail > .fpm-attachments {
  display: none;
}

.fpm-inline-form,
.fpm-edit-form {
  display: grid;
  gap: .65rem;
}

.fpm-edit-form > p {
  margin: .2rem 0;
  color: var(--fpm-muted);
  font-size: .77rem;
  line-height: 1.42;
}

.fpm-form-actions,
.fpm-record-actions {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
}

.fpm-form-actions button,
.fpm-record-actions button {
  flex: 1 1 8rem;
  min-width: 0;
  white-space: normal;
}

.fpm-record-actions {
  margin-top: .65rem;
  padding-top: .65rem;
  border-top: 1px solid var(--fpm-border-soft);
}

.fpm-delete-confirm,
.fpm-attachment-delete-confirm,
.fpm-unplace-confirm {
  display: grid;
  gap: .45rem;
  margin-top: .75rem;
  padding: .75rem;
  border: 1px solid #d8a4a4;
  border-radius: .55rem;
  background: #fff4f2;
}

.fpm-attachment-delete-confirm {
  margin-top: .35rem;
  padding: .75rem;
}

.fpm-attachment-delete-confirm > div:first-child {
  display: grid;
  gap: .28rem;
}

.fpm-attachment-delete-confirm label {
  display: grid;
  gap: .3rem;
  color: #4f3434;
  font-size: .7rem;
  font-weight: 800;
}

.fpm-attachment-delete-confirm textarea {
  width: 100%;
  min-height: 5.5rem;
  resize: vertical;
  border: 1px solid #c99a9a;
  border-radius: .45rem;
  padding: .58rem .62rem;
  background: #fff;
  color: var(--fpm-ink);
  font: inherit;
  font-size: .76rem;
  line-height: 1.42;
}

.fpm-unplace-confirm {
  border-color: #d6bd79;
  background: #fff9e9;
}

.fpm-delete-confirm p,
.fpm-attachment-delete-confirm p,
.fpm-unplace-confirm p {
  margin: 0;
  font-size: .77rem;
  line-height: 1.42;
}

.fpm-legend {
  display: flex;
  align-items: center;
  gap: .55rem .75rem;
  overflow-x: auto;
  padding: .6rem .75rem;
  border: 1px solid var(--fpm-border);
  border-radius: .7rem;
  background: var(--fpm-surface);
  box-shadow: var(--fpm-shadow-sm);
  scrollbar-width: thin;
}

.fpm-legend-copy {
  display: grid;
  flex: 0 0 auto;
  gap: .1rem;
}

.fpm-legend-copy strong {
  font-size: .78rem;
}

.fpm-legend-copy small {
  color: var(--fpm-muted);
  font-size: .58rem;
  font-weight: 650;
  white-space: nowrap;
}

.fpm-legend > span {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: .38rem;
  color: var(--fpm-muted);
  font-size: .7rem;
  font-weight: 650;
  white-space: nowrap;
}

.fpm-legend .fpm-symbol {
  width: 1.65rem;
  height: 1.65rem;
  min-width: 1.65rem;
  border-width: 1px !important;
}

.fpm-legend .fpm-icon {
  width: .92rem;
  height: .92rem;
}

.fpm-no-plan,
.fpm-loading,
.fpm-empty {
  padding: 2rem;
  border: 1px dashed #aebdc4;
  background: var(--fpm-surface-soft);
  color: var(--fpm-muted);
  text-align: center;
}

/* Pseudo-fullscreen: nessuna Fullscreen API, quindi resta compatibile con i portali incorporati. */
body.fpm-map-fullscreen {
  overflow: hidden !important;
}

/* At compact desktop widths the backend sidebar has its own stacking layer.
   Lift the content layer while the map is fullscreen so its fixed canvas can
   cover the sidebar as well, without changing the normal portal navigation. */
body.fpm-map-fullscreen .shell > .content {
  position: relative;
  z-index: 31;
}

.fpm-canvas-column.is-fullscreen {
  position: fixed !important;
  z-index: 12000;
  inset: 0;
  grid-template-rows: auto auto minmax(0, 1fr);
  width: 100vw;
  max-width: none;
  height: 100dvh;
  max-height: none;
  padding: clamp(.5rem, 1.2vw, 1rem);
  overflow: hidden;
  background: var(--fpm-page);
}

.fpm-canvas-column.is-fullscreen .fpm-map-tools {
  box-shadow: 0 5px 20px rgba(7, 28, 36, .12);
}

.fpm-canvas-column.is-fullscreen .fpm-stage-wrap {
  height: 100%;
  min-height: 0;
}

.fpm-canvas-column.is-fullscreen .fpm-viewport {
  height: 100%;
  min-height: 0;
}

.fpm-canvas-column.is-fullscreen .fpm-detail {
  max-height: calc(100dvh - 10rem);
}

@container floorplan (max-width: 70rem) {
  .fpm-map-tools {
    align-items: stretch;
  }

  .fpm-source-controls {
    flex: 1 1 100%;
    justify-content: flex-end;
    margin-left: 0;
  }

  .fpm-correction-panel,
  .fpm-correction-panel.is-active,
  .fpm-correction-panel.is-candidate {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .fpm-correction-options,
  .fpm-original-preserved {
    grid-column: 1 / -1;
  }

  .fpm-correction-panel.is-active .fpm-correction-actions,
  .fpm-correction-panel.is-candidate .fpm-correction-actions {
    grid-column: 1 / -1;
  }
}

@container floorplan (max-width: 54rem) {
  .fpm-layout {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "canvas"
      "queue";
  }

  .fpm-queue {
    max-height: 18rem;
  }

  .fpm-shell .fpm-queue-toggle {
    display: inline-grid;
    flex: 1 1 9rem;
    place-items: center;
  }

  .fpm-queue.is-collapsed {
    max-height: none;
    overflow: visible;
  }

  .fpm-queue.is-collapsed .fpm-queue-body {
    display: none;
  }

  .fpm-queue.is-collapsed .fpm-queue-head {
    border-bottom: 0;
  }

  .fpm-canvas-column {
    position: static;
    top: auto;
    grid-template-rows: auto auto auto auto;
    grid-template-areas:
      "maptools"
      "correction"
      "map"
      "detail";
  }

  .fpm-canvas-column.is-fullscreen {
    position: fixed !important;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
  }

  .fpm-detail {
    grid-area: detail;
    position: relative;
    width: 100%;
    max-height: none;
    margin: 0;
    justify-self: stretch;
    border-radius: .75rem;
    box-shadow: var(--fpm-shadow-sm);
    transform: none !important;
    will-change: auto;
  }

  .fpm-detail.is-environment {
    width: 100%;
  }

  .fpm-shell button.fpm-detail-drag {
    display: none;
  }

  .fpm-canvas-column.is-fullscreen .fpm-detail {
    max-height: min(34dvh, 22rem);
  }

  .fpm-viewport {
    height: clamp(23rem, 62dvh, 38rem);
  }

  .fpm-correction-panel,
  .fpm-correction-panel.is-active,
  .fpm-correction-panel.is-candidate {
    grid-template-columns: minmax(0, 1fr);
  }

  .fpm-correction-options,
  .fpm-original-preserved,
  .fpm-correction-panel.is-active .fpm-correction-actions,
  .fpm-correction-panel.is-candidate .fpm-correction-actions {
    grid-column: 1;
  }

  .fpm-correction-actions {
    justify-content: flex-start;
  }

  .fpm-original-preserved {
    align-items: flex-start;
    flex-direction: column;
  }
}

@container floorplan (max-width: 40rem) {
  .fpm-map-tools {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .fpm-view-status,
  .fpm-zoom-controls,
  .fpm-source-controls {
    width: 100%;
    margin-left: 0;
  }

  .fpm-zoom-controls {
    display: grid;
    grid-template-columns: 2.35rem minmax(3.5rem, 1fr) 2.35rem repeat(2, auto);
  }

  .fpm-source-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .fpm-source-controls button:only-child {
    grid-column: 1 / -1;
  }

  .fpm-correction-options {
    grid-template-columns: minmax(0, 1fr);
  }

  .fpm-shell .fpm-correction-options button {
    min-height: 4.65rem;
  }

  .fpm-compare-switch,
  .fpm-correction-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .fpm-compare-switch button,
  .fpm-correction-actions button {
    width: 100%;
    min-width: 0;
    white-space: normal;
  }
}

@media (max-width: 560px) {
  .fpm-header {
    align-items: flex-start;
  }

  .fpm-header > button {
    width: 100%;
  }

  .fpm-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .fpm-toolbar label,
  .fpm-toolbar select {
    width: 100%;
    min-width: 0;
  }

  .fpm-progress progress {
    order: 3;
    flex-basis: 100%;
  }

  .fpm-upload,
  .fpm-attachments form {
    grid-template-columns: minmax(0, 1fr);
  }

  .fpm-profile-summary {
    grid-template-columns: minmax(0, 1fr);
  }

  .fpm-profile-summary > button {
    width: 100%;
  }

  .fpm-mobile-capture {
    grid-template-columns: minmax(0, 1fr);
    text-align: center;
  }

  .fpm-mobile-capture > img {
    justify-self: center;
    width: min(12rem, 72vw);
    height: auto;
    aspect-ratio: 1;
  }

  .fpm-mobile-capture-actions,
  .fpm-mobile-capture.is-success,
  .fpm-mobile-capture.is-expired {
    grid-template-columns: minmax(0, 1fr);
  }

  .fpm-legend {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: visible;
  }

  .fpm-legend-copy {
    grid-column: 1 / -1;
  }

  .fpm-legend-copy small {
    white-space: normal;
  }

  .fpm-legend > span {
    min-width: 0;
    white-space: normal;
  }

  .fpm-form-actions,
  .fpm-record-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .fpm-form-actions button,
  .fpm-record-actions button {
    width: 100%;
  }

  .fpm-icon-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .fpm-photo-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .fpm-photo-viewer {
    padding: 4.5rem .7rem 1rem;
  }

  .fpm-photo-viewer figure {
    max-height: calc(100dvh - 5.5rem);
  }

  .fpm-photo-viewer figure > img {
    max-height: calc(100dvh - 11rem);
  }

  .fpm-photo-viewer figcaption {
    align-items: flex-start;
    flex-direction: column;
  }

  .fpm-shell button.fpm-photo-viewer-nav {
    top: auto;
    bottom: max(1rem, env(safe-area-inset-bottom));
    transform: none;
  }

  .fpm-viewport {
    height: clamp(21rem, 58dvh, 32rem);
    min-height: 19rem;
  }

  .fpm-zoom-controls {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .fpm-zoom-controls button[data-fpm-action="zoom-out"] {
    grid-column: 1;
    justify-self: start;
  }

  .fpm-zoom-controls output {
    grid-column: 2 / 6;
  }

  .fpm-zoom-controls button[data-fpm-action="zoom-in"] {
    grid-column: 6;
    justify-self: end;
  }

  .fpm-zoom-controls button[data-fpm-action="fit-view"],
  .fpm-zoom-controls button[data-fpm-action="toggle-fullscreen"] {
    width: 100%;
    min-width: 0;
    white-space: normal;
  }

  .fpm-zoom-controls button[data-fpm-action="fit-view"] {
    grid-column: 1 / 4;
  }

  .fpm-zoom-controls button[data-fpm-action="toggle-fullscreen"] {
    grid-column: 4 / 7;
  }
}

.fpm-report-panel {
  display: grid;
  gap: .75rem;
  margin: 0 0 1rem;
  padding: 1rem;
  border: 1px solid color-mix(in srgb, var(--fpm-blue) 30%, var(--fpm-border));
  border-radius: 1rem;
  background: color-mix(in srgb, var(--fpm-blue) 5%, var(--fpm-surface));
}

.fpm-report-panel h3,
.fpm-report-panel p { margin: 0; }

.fpm-report-current,
.fpm-report-preview {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .65rem;
  padding: .75rem;
  border-radius: .75rem;
  background: var(--fpm-surface);
}

.fpm-report-current .fpm-eyebrow { width: 100%; }
.fpm-report-actions { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .65rem; }
.fpm-report-review { display: flex; flex: 1 1 24rem; align-items: flex-end; gap: .65rem; }
.fpm-report-review label { flex: 1; }
.fpm-report-review textarea { width: 100%; }
.fpm-report-message {
  padding: .65rem .75rem;
  border-radius: .65rem;
  background: var(--fpm-green-soft);
  color: var(--fpm-green);
  font-weight: 700;
}

@media (max-width: 720px) {
  .fpm-report-current,
  .fpm-report-preview,
  .fpm-report-review { align-items: stretch; flex-direction: column; }
  .fpm-report-actions button,
  .fpm-report-preview button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .fpm-shell *,
  .fpm-shell *::before,
  .fpm-shell *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

@media (forced-colors: active) {
  .fpm-view-dot,
  .fpm-symbol,
  .fpm-marker,
  .fpm-corner,
  .fpm-room-handle,
  .fpm-room-shape {
    forced-color-adjust: none;
  }

  .fpm-grid {
    opacity: .35;
  }
}