/* Editor della piantina (v2): schermo intero, barra in alto, strumenti in basso (telefono) o a sinistra (computer),
   pannello delle proprietà sotto il pollice o a destra. Si appoggia a .fp-fs-card (scheda fissa a schermo intero). */

.fps, .fps-insp, .fps-sheet {
    --fps-surface: #ffffff;
    --fps-surface-2: #f5f2ec;
    --fps-line: rgba(120, 100, 70, 0.22);
    --fps-text: #292524;
    --fps-soft: #78716c;
    --fps-accent: var(--accent-to);
    --fps-accent-bg: color-mix(in srgb, var(--accent-to) 13%, transparent);
    --fps-danger: #dc2626;
    --fps-shadow: 0 1px 2px rgba(41, 26, 3, .06), 0 10px 26px -8px rgba(41, 26, 3, .22);
    color: var(--fps-text);
    --fps-font: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
    font-family: var(--fps-font);
}
.dark .fps, .dark .fps-insp, .dark .fps-sheet {
    --fps-surface: #0f172a;
    --fps-surface-2: #1e293b;
    --fps-line: rgba(148, 163, 184, 0.22);
    --fps-text: #e2e8f0;
    --fps-soft: #94a3b8;
    --fps-danger: #f87171;
    --fps-shadow: 0 1px 2px rgba(2, 6, 23, .5), 0 12px 28px -8px rgba(2, 6, 23, .7);
}
.fps-insp, .fps-sheet { font-family: var(--fps-font); }
.fp-fs-card.glass-panel.fps { background: #f3f1ec; z-index: 45; }
.dark .fp-fs-card.glass-panel.fps { background: #020617; }
html.lite-motion .fp-fs-card.glass-panel.fps { background: #f3f1ec; }
html.lite-motion.dark .fp-fs-card.glass-panel.fps { background: #020617; }

/* ---------- barra in alto ---------- */
.fps-head { flex: 0 0 auto; background: var(--fps-surface); border-bottom: 1px solid var(--fps-line); }
.fps-top { display: flex; align-items: center; gap: 6px; padding: 8px 10px; min-height: 58px; }
.fps-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px; flex: 0 0 auto;
    min-width: 44px; height: 44px; padding: 0 10px; border-radius: 14px; border: 1px solid var(--fps-line);
    background: var(--fps-surface); color: var(--fps-text); font: 700 12px/1 var(--fps-font); cursor: pointer;
    -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
.fps-btn:disabled { opacity: .35; cursor: default; }
.fps-btn.ghost { border-color: transparent; background: transparent; }
.fps-btn.primary { border: 0; color: #fff; padding: 0 16px; font-size: 13px; background: var(--accent-gradient); box-shadow: 0 6px 16px -6px color-mix(in srgb, var(--accent-to) 70%, transparent); }
.fps-btn.danger { color: var(--fps-danger); }
.fps-btn.on { background: var(--fps-accent-bg); border-color: color-mix(in srgb, var(--accent-to) 55%, transparent); color: var(--fps-accent); }
.fps-btn:active { transform: scale(.96); }
html.lite-motion .fps-btn:active { transform: none; opacity: .7; }
.fps-zone { position: relative; flex: 1 1 auto; min-width: 0; }
.fps .fps-zone select {
    background-image: none;
    appearance: none; -webkit-appearance: none; width: 100%; height: 44px; padding: 0 34px 0 14px; border-radius: 14px;
    border: 1px solid var(--fps-line); background: var(--fps-surface-2); color: var(--fps-text); font: 800 14px/1 var(--fps-font); text-overflow: ellipsis;
}
.fps-zone::after {
    content: ''; position: absolute; right: 14px; top: 50%; width: 7px; height: 7px; margin-top: -6px; pointer-events: none;
    border-right: 2px solid var(--fps-soft); border-bottom: 2px solid var(--fps-soft); transform: rotate(45deg);
}
.fps-strip { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 12px; background: var(--fps-accent-bg); font-size: 11px; font-weight: 700; color: var(--fps-accent); border-top: 1px solid var(--fps-line); }
.fps-strip button { border: 0; border-radius: 10px; padding: 8px 12px; font: 800 11px/1 var(--fps-font); cursor: pointer; }

@media (min-width: 640px) { .fps-zone { flex: 0 1 320px; margin-right: auto; } }

/* ---------- tela ---------- */
.fps-stage { position: relative; flex: 1 1 auto; min-height: 0; }
.fps-canvas { position: absolute; inset: 0; transition: padding-bottom .18s ease; }
.fps .fp-scroll { height: 100%; width: 100%; overflow: auto; border: 0; border-radius: 0; box-shadow: none; background: transparent; overscroll-behavior: contain; }
/* La piantina sta al centro di un'area più grande di lei: si può portare dove si vuole (due dita, «Sposta», spazio + trascina) */
.fps-pan { --padx: clamp(90px, 36vw, 560px); --pady: clamp(90px, 34vh, 460px); box-sizing: border-box; display: flex; align-items: center; justify-content: center; width: calc(100% + 2 * var(--padx)); min-height: calc(100% + 2 * var(--pady)); padding: var(--pady) var(--padx); }
.fps-pan > .fp-zoom-target { flex: none; }
.fps .fp-zoom-target { padding: 14px 14px 18px; }
.fps[data-pan="1"] .fp-zone-svg, .fps[data-pan="1"] .fp-zone-svg * { cursor: grab !important; }
.fps .fp-zone-svg { filter: drop-shadow(0 6px 18px rgba(41, 26, 3, .08)); }
.fps-subbar { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 10px 8px; min-height: 46px; }
.fps-subbar .grp { display: flex; align-items: center; gap: 6px; min-width: 0; }
.fps-subbar .fps-btn { height: 38px; min-width: 38px; padding: 0 10px; border-radius: 12px; }
.fps-subbar .fps-btn span { white-space: nowrap; }
.fps-subbar .grp:first-child { flex: 1 1 auto; min-width: 0; }
.fps-subbar .grp:last-child { flex: 0 0 auto; }
@media (max-width: 480px) { .fps-subbar .grp.dense .fps-btn:first-child span { display: none; } }
.fps-zoom-label { min-width: 46px; text-align: center; color: var(--fps-soft); font: 800 12px/1 var(--fps-font); font-variant-numeric: tabular-nums; }
.fps-hint {
    position: absolute; z-index: 4; left: 10px; right: 64px; bottom: 10px; pointer-events: none;
    padding: 8px 12px; border-radius: 12px; background: color-mix(in srgb, var(--fps-surface) 92%, transparent);
    border: 1px solid var(--fps-line); box-shadow: var(--fps-shadow); font-size: 11.5px; line-height: 1.35; font-weight: 600; color: var(--fps-soft);
}
.fps[data-insp="1"] .fps-hint { display: none; }

/* ---------- strumenti ---------- */
.fps-dock {
    flex: 0 0 auto; display: flex; gap: 2px; padding: 6px 8px calc(6px + env(safe-area-inset-bottom, 0px));
    background: var(--fps-surface); border-top: 1px solid var(--fps-line); position: relative; z-index: 6;
}
.fps-tool {
    flex: 1 1 0; min-width: 0; height: 56px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    border: 0; border-radius: 14px; background: transparent; color: var(--fps-soft); font: 700 9.5px/1 var(--fps-font); letter-spacing: -.01em; cursor: pointer;
    -webkit-tap-highlight-color: transparent; touch-action: manipulation; position: relative;
}
.fps-tool svg { width: 22px; height: 22px; flex: 0 0 auto; }
.fps-tool span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fps-tool.on { background: var(--fps-accent-bg); color: var(--fps-accent); }
.fps-tool.add { color: #fff; background: var(--accent-gradient); }
.fps-tool.add svg { stroke-width: 2.2; }
.fps-tool:active { transform: scale(.95); }
.fps-tool.sep { flex: 0 0 1px; height: 30px; align-self: center; background: var(--fps-line); border-radius: 1px; min-width: 1px; }
.fps-dock-title { display: none; }

/* ---------- pannello proprietà (sotto il pollice / a destra) ---------- */
.fps-insp {
    position: fixed; z-index: 130; left: 8px; right: 8px; bottom: calc(76px + env(safe-area-inset-bottom, 0px));
    max-height: 52vh; overflow-y: auto; padding: 12px 12px 10px; border-radius: 22px;
    background: var(--fps-surface); border: 1px solid var(--fps-line); box-shadow: var(--fps-shadow); color: var(--fps-text);
    max-width: 560px; margin: 0 auto; overscroll-behavior: contain;
}
.fps-insp.hidden { display: none; }
.fps-insp.min > :not(.fps-insp-head) { display: none; }
.fps-insp.min .fps-insp-head { margin-bottom: 0; }
.fps-insp.min #fps-i-min svg { transform: rotate(180deg); }
.fps-insp-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.fps-insp-icon { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 12px; background: var(--fps-surface-2); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.fps-insp-title { flex: 1 1 auto; min-width: 0; }
.fps-insp-title b { display: block; font-size: 15px; font-weight: 800; line-height: 1.15; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fps-insp-title small { display: block; margin-top: 2px; font-size: 11px; font-weight: 600; color: var(--fps-soft); }
.fps-actions { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.fps-act {
    flex: 1 1 0; min-width: 52px; height: 52px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
    border: 1px solid var(--fps-line); border-radius: 14px; background: var(--fps-surface-2); color: var(--fps-text);
    font: 700 10px/1 var(--fps-font); cursor: pointer; -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
.fps-act svg { width: 19px; height: 19px; }
.fps-act.danger { color: var(--fps-danger); }
.fps-act.on { background: var(--fps-accent-bg); color: var(--fps-accent); border-color: color-mix(in srgb, var(--accent-to) 55%, transparent); }
.fps-act:disabled { opacity: .35; }
.fps-act:active { transform: scale(.95); }
.fps-row { display: flex; align-items: center; gap: 10px; margin: 8px 0; }
.fps-row > label, .fps-lab { flex: 0 0 74px; font-size: 11px; font-weight: 700; color: var(--fps-soft); }
.fps-step { display: inline-flex; align-items: center; border: 1px solid var(--fps-line); border-radius: 14px; background: var(--fps-surface-2); overflow: hidden; }
.fps-step button { width: 44px; height: 44px; border: 0; background: transparent; color: var(--fps-text); font-size: 20px; font-weight: 700; cursor: pointer; touch-action: manipulation; }
.fps-step input { width: 44px; height: 44px; border: 0; background: transparent; text-align: center; font: 800 16px/1 var(--fps-font); color: var(--fps-text); -moz-appearance: textfield; }
.fps-step input::-webkit-outer-spin-button, .fps-step input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.fps-range { flex: 1 1 auto; min-width: 0; accent-color: var(--accent-to); height: 32px; }
.fps-val { flex: 0 0 auto; min-width: 42px; text-align: right; font: 800 12px/1 var(--fps-font); color: var(--fps-text); font-variant-numeric: tabular-nums; }
.fps-shapes { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; }
.fps-shapes button {
    height: 46px; border: 1.5px solid var(--fps-line); border-radius: 12px; background: var(--fps-surface-2); color: var(--fps-soft);
    display: flex; align-items: center; justify-content: center; cursor: pointer; touch-action: manipulation;
}
.fps-shapes button[aria-pressed="true"] { border-color: var(--accent-to); background: var(--fps-accent-bg); color: var(--fps-accent); }
.fps-seg { display: flex; padding: 3px; gap: 3px; border-radius: 14px; background: var(--fps-surface-2); border: 1px solid var(--fps-line); margin-bottom: 10px; }
.fps-seg button { flex: 1 1 0; height: 36px; border: 0; border-radius: 11px; background: transparent; color: var(--fps-soft); font: 800 12px/1 var(--fps-font); cursor: pointer; touch-action: manipulation; }
.fps-seg button[aria-pressed="true"] { background: var(--fps-surface); color: var(--fps-text); box-shadow: 0 1px 4px rgba(0, 0, 0, .16); }
.fps-note { margin: 8px 0 0; font-size: 11px; line-height: 1.4; color: var(--fps-soft); font-weight: 600; }
.fps-chips { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin-bottom: 8px; }
.fps-chip {
    display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 6px 2px 7px; border: 1.5px solid var(--fps-line); border-radius: 12px;
    background: var(--fps-surface-2); color: var(--fps-text); font: 700 9.5px/1.1 var(--fps-font); cursor: pointer; touch-action: manipulation; min-width: 0;
}
.fps-chip svg { width: 100%; height: 30px; border-radius: 6px; }
.fps-chip span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fps-chip[aria-pressed="true"] { border-color: var(--accent-to); background: var(--fps-accent-bg); color: var(--fps-accent); }
.fps-sub { margin: 10px 0 4px; font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--fps-soft); }
.fps-grid2 { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; }
.fps-grid2 .fps-act { min-width: 0; height: 44px; }

/* pavimenti: tipo, colore, trasparenza */
.fps-typerow { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 52px; padding: 6px 12px 6px 6px; margin-bottom: 4px; border: 1.5px solid var(--fps-line); border-radius: 15px; background: var(--fps-surface-2); color: var(--fps-text); cursor: pointer; text-align: left; touch-action: manipulation; font-family: var(--fps-font); }
.fps-typerow .pv { flex: 0 0 auto; width: 58px; height: 40px; border-radius: 10px; overflow: hidden; background: var(--fps-surface); }
.fps-typerow .pv svg { width: 100%; height: 100%; display: block; }
.fps-typerow .grow { flex: 1 1 auto; min-width: 0; }
.fps-typerow b { display: block; font-size: 14px; font-weight: 800; }
.fps-typerow small { display: block; margin-top: 2px; font-size: 11px; font-weight: 600; color: var(--fps-soft); }
.fps-sw { display: flex; flex-wrap: nowrap; gap: 0; margin: 0 -5px 2px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.fps-sw::-webkit-scrollbar { display: none; }
.fps-swatch { flex: 0 0 auto; }
.fps-swatch { position: relative; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; cursor: pointer; display: flex; align-items: center; justify-content: center; touch-action: manipulation; }
.fps-swatch i { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: var(--c, transparent); border: 2px solid var(--fps-line); font: 800 9px/1 var(--fps-font); font-style: normal; color: var(--fps-soft); box-sizing: border-box; }
.fps-swatch[aria-pressed="true"] i { border-color: var(--accent-to); box-shadow: 0 0 0 2.5px color-mix(in srgb, var(--accent-to) 35%, transparent); }
.fps-swatch.auto i { background: repeating-linear-gradient(135deg, var(--fps-surface-2) 0 5px, var(--fps-surface) 5px 10px); }
.fps-swatch.custom i { background: var(--c, conic-gradient(#e0605a, #e0c068, #7fae6a, #6fa8c4, #8a6fd0, #e0605a)); }
.fps-swatch.custom input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.fps-swatch:disabled { opacity: .4; }
.fps-pickbtn .ic.wide { width: 100%; height: 46px; }
.fps-pickbtn .ic.wide svg { width: 100%; height: 100%; border-radius: 9px; }
.fps-pickbtn[aria-pressed="true"] { border-color: var(--accent-to); background: var(--fps-accent-bg); }

/* scelta di cosa aggiungere */
.fps-pick { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.fps-pickbtn {
    min-height: 88px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; padding: 8px 4px;
    border: 1.5px solid var(--fps-line); border-radius: 15px; background: var(--fps-surface-2); color: var(--fps-text);
    font: 700 11px/1.15 var(--fps-font); text-align: center; cursor: pointer; touch-action: manipulation; min-width: 0;
}
.fps-pickbtn .ic { height: 40px; display: flex; align-items: center; justify-content: center; max-width: 100%; }
.fps-pickbtn svg { max-width: 100%; }
.fps-pickbtn:active { transform: scale(.96); border-color: var(--accent-to); }

/* ---------- foglio generico (Altro, Elementi, Modelli...) ---------- */
.fps-sheet-back { position: fixed; inset: 0; z-index: 134; background: rgba(0, 0, 0, .45); }
.fps-sheet-back.hidden { display: none; }
.fps-sheet {
    position: fixed; z-index: 135; left: 8px; right: 8px; bottom: calc(8px + env(safe-area-inset-bottom, 0px)); margin: 0 auto; max-width: 520px;
    max-height: 78vh; display: flex; flex-direction: column; border-radius: 24px; background: var(--fps-surface); color: var(--fps-text);
    border: 1px solid var(--fps-line); box-shadow: var(--fps-shadow);
}
.fps-sheet.hidden { display: none; }
.fps-sheet.dialog { top: 50%; bottom: auto; transform: translateY(-50%); max-height: 86vh; }
.fps-sheet-head { display: flex; align-items: center; gap: 8px; padding: 14px 14px 8px 18px; flex: 0 0 auto; }
.fps-sheet-head h3 { flex: 1 1 auto; margin: 0; font-size: 16px; font-weight: 800; }
.fps-sheet-body { padding: 4px 14px 16px; overflow-y: auto; overscroll-behavior: contain; }
.fps-sheet-foot { flex: 0 0 auto; padding: 10px 14px calc(14px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--fps-line); }
.fps-sheet-foot .fps-cta { margin-top: 0; }
.fps-menu { display: flex; flex-direction: column; }
.fps-menu button, .fps-menu .fps-menu-row {
    display: flex; align-items: center; gap: 12px; width: 100%; min-height: 52px; padding: 8px 6px; border: 0; background: transparent;
    color: var(--fps-text); font: 700 14px/1.2 var(--fps-font); text-align: left; cursor: pointer; border-radius: 12px; touch-action: manipulation;
}
.fps-menu button + button, .fps-menu button + .fps-menu-row { border-top: 1px solid var(--fps-line); border-radius: 0; }
.fps-menu svg { width: 22px; height: 22px; flex: 0 0 auto; color: var(--fps-soft); }
.fps-menu small { display: block; font-size: 11px; font-weight: 600; color: var(--fps-soft); margin-top: 2px; }
.fps-menu .grow { flex: 1 1 auto; min-width: 0; }
.fps-menu .danger, .fps-menu .danger svg { color: var(--fps-danger); }
.fps-switch { position: relative; width: 44px; height: 26px; border-radius: 13px; background: var(--fps-line); flex: 0 0 auto; transition: background .15s; }
.fps-switch::after { content: ''; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .3); transition: transform .15s; }
.fps-switch.on { background: var(--accent-gradient); }
.fps-switch.on::after { transform: translateX(18px); }

/* elenco elementi */
.fps-list { display: flex; flex-direction: column; gap: 2px; }
.fps-li { display: flex; align-items: center; gap: 8px; padding: 4px 4px 4px 6px; border-radius: 12px; min-height: 52px; border: 1.5px solid transparent; }
.fps-li.sel { background: var(--fps-accent-bg); border-color: color-mix(in srgb, var(--accent-to) 50%, transparent); }
.fps-li .ic { width: 38px; height: 38px; flex: 0 0 auto; border-radius: 10px; background: var(--fps-surface-2); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.fps-li .nm { flex: 1 1 auto; min-width: 0; text-align: left; border: 0; background: transparent; color: var(--fps-text); font: 700 13.5px/1.2 var(--fps-font); cursor: pointer; padding: 6px 4px; }
.fps-li .nm small { display: block; font-size: 10.5px; font-weight: 600; color: var(--fps-soft); }
.fps-li .mini { width: 40px; height: 40px; flex: 0 0 auto; border: 0; border-radius: 11px; background: transparent; color: var(--fps-soft); display: flex; align-items: center; justify-content: center; cursor: pointer; touch-action: manipulation; }
.fps-li .mini svg { width: 18px; height: 18px; }
.fps-li .mini.on { color: var(--fps-accent); background: var(--fps-accent-bg); }
.fps-li .mini:disabled { opacity: .25; }
.fps-group { margin: 12px 0 4px 4px; font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--fps-soft); }

/* modelli di sala */
.fps-tpls { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.fps-tpl { border: 1.5px solid var(--fps-line); border-radius: 16px; background: var(--fps-surface-2); padding: 8px; text-align: left; cursor: pointer; color: var(--fps-text); touch-action: manipulation; }
.fps-tpl svg { width: 100%; height: auto; display: block; border-radius: 10px; background: var(--fps-surface); }
.fps-tpl b { display: block; margin-top: 7px; font-size: 13px; font-weight: 800; }
.fps-tpl small { display: block; font-size: 10.5px; font-weight: 600; color: var(--fps-soft); }
.fps-tpl[aria-pressed="true"] { border-color: var(--accent-to); background: var(--fps-accent-bg); }
.fps-field { display: block; margin: 10px 0; font-size: 12px; font-weight: 700; color: var(--fps-soft); }
.fps-field input, .fps-field select {
    display: block; width: 100%; height: 46px; margin-top: 5px; padding: 0 12px; border-radius: 13px; border: 1px solid var(--fps-line);
    background: var(--fps-surface-2); color: var(--fps-text); font: 700 16px/1 var(--fps-font);
}
.fps-pre { margin: 8px 0; padding: 8px 10px; border-radius: 12px; background: var(--fps-surface-2); border: 1px solid var(--fps-line); font: 700 12px/1.5 var(--fps-font); max-height: 150px; overflow: auto; }
.fps-cta { width: 100%; height: 50px; border: 0; border-radius: 15px; color: #fff; background: var(--accent-gradient); font: 800 14px/1 var(--fps-font); cursor: pointer; margin-top: 8px; touch-action: manipulation; }
.fps-cta.alt { background: var(--fps-surface-2); color: var(--fps-text); border: 1px solid var(--fps-line); }
.fps-cta:disabled { opacity: .4; }

/* selezione sulla piantina */
.fps-sel-box { fill: color-mix(in srgb, var(--accent-to) 8%, transparent); stroke: var(--accent-to); stroke-width: 2; stroke-dasharray: 6 4; vector-effect: non-scaling-stroke; pointer-events: none; }
.fps-sel-dot { fill: #fff; stroke: var(--accent-to); stroke-width: 2.5; }
.fps-marquee { fill: color-mix(in srgb, var(--accent-to) 12%, transparent); stroke: var(--accent-to); stroke-width: 1.5; stroke-dasharray: 5 3; vector-effect: non-scaling-stroke; pointer-events: none; }
.fps-lock { pointer-events: none; }
.fp-floor-editable { cursor: grab; touch-action: none; }
.fps[data-tool="floor"] .fp-zone-svg { cursor: crosshair; }
.fps .fp-editable, .fps .fp-marker-editable { touch-action: none; }

/* computer (e telefono in orizzontale, poco alto): strumenti a sinistra, pannello a destra */
@media (min-width: 1024px), (min-width: 600px) and (max-height: 560px) {
    .fp-fs-card.glass-panel.fps { display: grid; grid-template-columns: 84px minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); }
    .fps-head { grid-column: 1 / -1; }
    .fps-stage { grid-column: 2; grid-row: 2; }
    .fps-dock {
        grid-column: 1; grid-row: 2; flex-direction: column; border-top: 0; border-right: 1px solid var(--fps-line);
        padding: 8px 6px; overflow-y: auto; gap: 4px;
    }
    .fps-tool { flex: 0 0 auto; height: 62px; }
    .fps-tool.sep { flex: 0 0 1px; width: 36px; height: 1px; margin: 4px auto; }
    .fps-insp { left: auto; right: 14px; top: 124px; bottom: 14px; width: 340px; max-height: none; margin: 0; max-width: none; }
    .fps-sheet { left: 96px; right: auto; bottom: 14px; width: 380px; margin: 0; }
    .fps-sheet.dialog { left: 50%; right: auto; width: 460px; top: 50%; bottom: auto; transform: translate(-50%, -50%); }
    .fps[data-insp="1"] .fps-canvas { padding-right: 360px; padding-bottom: 0 !important; }
    .fps-hint { right: auto; max-width: 420px; }
}
html.lite-motion .fps-canvas { transition: none; }

@media (max-height: 560px) {
    .fps-top { min-height: 52px; padding-top: 4px; padding-bottom: 4px; }
    .fps-subbar { min-height: 42px; padding-bottom: 4px; }
    .fps-tool { height: 38px !important; }
    .fps-tool span { display: none; }
    .fps-dock { padding: 6px !important; }
    .fps-insp { top: 104px !important; }
}