/* Terrain Bellerose — éditeur de plan v7 (scope local) */

/* Éditeur Bellerose — jamais de barre de navigation admin en bas (layout.php ou app) */
body.cj-app--bellerose-editor .cj-bottom-nav,
body.cj-app:has(.cj-page--bellerose) .cj-bottom-nav {
    display: none !important;
}

body.cj-app--bellerose-editor .cj-shell,
body.cj-app:has(.cj-page--bellerose) .cj-shell {
    padding-bottom: 0 !important;
}

body.cj-app--bellerose-editor,
body.cj-app:has(.cj-page--bellerose) {
    --cj-nav-h: 0px;
}

/* Application Android / PWA autonome (?mobile=1) — sans navigation admin */
body.cj-app--bellerose-standalone {
    --cj-nav-h: 0px;
}

body.cj-app--bellerose-standalone .cj-shell {
    padding-bottom: 0;
}

body.cj-app--bellerose-standalone .cj-bottom-nav,
body.cj-app--bellerose-standalone .cj-topbar,
body.cj-app--bellerose-standalone .cj-menu-panel {
    display: none !important;
}

body.cj-app--bellerose-standalone .cj-bottom-nav,
body.cj-app--bellerose-standalone .cj-topbar,
body.cj-app--bellerose-standalone .cj-menu-panel {
    display: none !important;
}

.cj-bel-app-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-height: 48px;
    padding: calc(0.35rem + var(--cj-safe-top, 0px)) 0.75rem 0.35rem;
    background: #1a365d;
    color: #fff;
    position: sticky;
    top: 0;
    z-index: 40;
}

.cj-bel-app-topbar__title {
    font-weight: 600;
    font-size: 1rem;
}

.cj-bel-app-topbar__actions {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    font-size: 0.85rem;
}

.cj-bel-app-topbar__user {
    opacity: 0.85;
    max-width: 8rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cj-bel-app-topbar__logout {
    color: #fff;
    text-decoration: none;
    padding: 0.35rem 0.55rem;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 6px;
}

.cj-bel-app-topbar__logout:hover,
.cj-bel-app-topbar__logout:focus {
    background: rgba(255, 255, 255, 0.12);
}

body.cj-app--bellerose-standalone .cj-main--bellerose-app {
    display: flex;
    flex-direction: column;
    height: calc(100dvh - 48px - var(--cj-safe-top, 0px) - var(--cj-safe-bottom, 0px));
    max-height: calc(100dvh - 48px - var(--cj-safe-top, 0px) - var(--cj-safe-bottom, 0px));
    overflow: hidden;
    padding-top: 0.25rem;
    padding-bottom: calc(0.2rem + var(--cj-safe-bottom, 0px));
}

body.cj-app--bellerose-standalone:has(.cj-page--bellerose) {
    overflow: hidden;
}

.cj-app--wide .cj-main {
    max-width: none;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

.cj-app:has(.cj-page--bellerose) {
    overflow: hidden;
}

.cj-app:has(.cj-page--bellerose) .cj-main {
    display: flex;
    flex-direction: column;
    height: calc(100dvh - 48px - var(--cj-nav-h, 64px) - var(--cj-safe-top, 0px) - var(--cj-safe-bottom, 0px));
    max-height: calc(100dvh - 48px - var(--cj-nav-h, 64px) - var(--cj-safe-top, 0px) - var(--cj-safe-bottom, 0px));
    overflow: hidden;
    padding-top: 0.25rem;
    padding-bottom: 0.2rem;
}

.cj-page--bellerose {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.cj-bellerose-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.25rem;
    flex-shrink: 0;
}

.cj-bellerose-header h1 {
    margin: 0;
    font-size: 1rem;
    line-height: 1.2;
}

.cj-bellerose-header .cj-sub,
.cj-bellerose-note,
.cj-bellerose-meta {
    display: none;
}

.cj-bellerose-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.22rem;
    flex-shrink: 0;
}

.cj-bellerose-toolbar--sticky {
    position: sticky;
    top: 0;
    z-index: 60;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 0.25rem 0.4rem;
    box-shadow: none;
}

.cj-bellerose-toolbar .cj-btn {
    padding: 0.28rem 0.45rem;
    font-size: 0.78rem;
    min-height: 1.85rem;
}

.cj-bel-toolbar-sep {
    width: 1px;
    height: 1.25rem;
    background: #cbd5e1;
    margin: 0 0.1rem;
}

.cj-bel-select {
    padding: 0.35rem 0.4rem;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    font-size: 0.8rem;
    background: #fff;
}

.cj-bel-toggle.is-on {
    background: #dbeafe;
    border-color: #2563eb;
    color: #1d4ed8;
}

.cj-bellerose-toolbar [data-tool].is-active {
    background: #2563eb;
    color: #fff;
    border-color: #1d4ed8;
}

.cj-belle-zoom {
    min-width: 3rem;
    text-align: center;
    font-size: 0.85rem;
    color: #475569;
}

.cj-bellerose-area-summary {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.75rem;
    padding: 0.25rem 0.55rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    flex-shrink: 0;
    overflow-x: auto;
}

.cj-bel-area-stat {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    gap: 0.3rem;
    white-space: nowrap;
}

.cj-bel-area-label {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #64748b;
}

.cj-bel-area-stat strong {
    font-size: 0.82rem;
    color: #0f172a;
}

.cj-bel-area-breakdown {
    display: none;
}

.cj-bellerose-status:empty,
.cj-bellerose-status:not(.is-ok):not(.is-err) {
    display: none;
}

.cj-bellerose-warnings[hidden] {
    display: none !important;
}

.cj-bellerose-editor {
    display: grid;
    grid-template-columns: minmax(168px, 210px) minmax(0, 1fr) minmax(150px, 200px);
    gap: 0.35rem;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.cj-bellerose-status.is-ok { color: #166534; }
.cj-bellerose-status.is-err { color: #b91c1c; }

.cj-bel-sync-banner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    padding: 0.45rem 0.65rem;
    background: #fff7ed;
    border: 1px solid #fb923c;
    border-radius: 8px;
    color: #9a3412;
    font-size: 0.85rem;
    flex-shrink: 0;
}

.cj-bel-sync-banner[hidden] {
    display: none !important;
}

.cj-bel-sync-banner .cj-btn {
    flex-shrink: 0;
}

.cj-bellerose-warnings {
    margin: 0;
    font-size: 0.82rem;
    color: #9a3412;
    background: #fff7ed;
    border: 1px solid #fb923c;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
    max-height: 9rem;
}

.cj-bel-warnings-hint {
    margin-left: auto;
    font-size: 0.72rem;
    color: #c2410c;
    opacity: 0.9;
}

.cj-bel-warn-item {
    display: block;
    width: 100%;
    text-align: left;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    padding: 0.15rem 0;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.cj-bel-warn-item:hover {
    color: #7c2d12;
}

.cj-bel-warnings-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0.45rem 0.75rem;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.cj-bel-warnings-summary:hover {
    background: rgba(251, 191, 36, 0.15);
}

.cj-bel-warnings-chevron {
    font-size: 0.7rem;
    transition: transform 0.15s ease;
}

.cj-bellerose-warnings:not(.is-collapsed) .cj-bel-warnings-chevron {
    transform: rotate(180deg);
}

.cj-bel-warnings-list {
    margin: 0;
    padding: 0 0.75rem 0.5rem 1.75rem;
    max-height: 7rem;
    overflow-y: auto;
    list-style: disc;
}

.cj-bellerose-warnings.is-collapsed .cj-bel-warnings-list {
    display: none;
}

.cj-bel-warnings-list li {
    margin: 0.15rem 0;
    line-height: 1.35;
}

.cj-bellerose-note,
.cj-bellerose-meta {
    display: none;
}

.cj-bellerose-editor.is-palette-collapsed {
    grid-template-columns: 0 minmax(0, 1fr) minmax(150px, 200px);
}

.cj-bellerose-editor.is-props-collapsed {
    grid-template-columns: minmax(150px, 180px) minmax(0, 1fr) 0;
}

.cj-bellerose-editor.is-palette-collapsed.is-props-collapsed {
    grid-template-columns: 0 minmax(0, 1fr) 0;
}

.cj-bellerose-editor.is-palette-collapsed .cj-bellerose-palette,
.cj-bellerose-editor.is-props-collapsed .cj-bellerose-props {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    overflow: hidden;
    padding: 0;
    border: 0;
    min-width: 0;
    width: 0;
    max-width: 0;
}

.cj-bel-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.35rem;
    margin-bottom: 0.35rem;
}

.cj-bel-panel-head h2 {
    margin: 0;
}

.cj-bel-panel-close {
    flex-shrink: 0;
    min-width: 2rem;
    padding: 0.2rem 0.4rem;
}

.cj-bel-panel-toggle:not(.is-on) {
    opacity: 0.7;
    background: #f1f5f9;
}

.cj-page--bellerose.is-plan-fullscreen {
    position: fixed;
    inset: 0;
    z-index: 1200;
    background: #f8fafc;
    padding: 0.35rem;
    min-height: 100vh;
    height: 100dvh;
    max-height: 100dvh;
    overflow: hidden;
}

body.cj-bel-fs-active {
    overflow: hidden;
}

body.cj-bel-fs-active .cj-topbar,
body.cj-bel-fs-active .cj-bottom-nav,
body.cj-bel-fs-active .cj-shell > header,
body.cj-bel-fs-active .cj-app-footer {
    display: none !important;
}

body.cj-bel-fs-active .cj-shell {
    padding-bottom: 0 !important;
}

body.cj-bel-fs-active .cj-main {
    height: 100dvh !important;
    max-height: 100dvh !important;
    padding: 0.35rem !important;
}

body.cj-bel-fs-active .cj-bellerose-header,
body.cj-bel-fs-active .cj-bellerose-area-summary {
    display: none;
}

.cj-page--bellerose.is-plan-fullscreen .cj-bellerose-editor {
    min-height: 0;
    flex: 1;
}

.cj-page--bellerose.is-plan-fullscreen .cj-bellerose-canvas-wrap {
    min-height: 0;
    height: 100%;
}

.cj-bel-touch-bar,
#cj-bel-touch-bar {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
}

.cj-bel-touch-btn {
    min-width: 2.6rem;
    min-height: 2.6rem;
    padding: 0.35rem 0.5rem;
    border: 0;
    border-radius: 999px;
    background: rgba(248, 250, 252, 0.12);
    color: #f8fafc;
    font-size: 1.05rem;
    cursor: pointer;
    touch-action: manipulation;
}

.cj-bel-touch-btn:hover,
.cj-bel-touch-btn.is-active {
    background: #ea580c;
    color: #fff;
}

.cj-bel-shortcuts-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 0.4rem;
    font-size: 0.88rem;
    color: #334155;
}

.cj-bel-shortcuts-list li {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.cj-bel-shortcuts-list kbd {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.6rem;
    padding: 0.2rem 0.45rem;
    border: 1px solid #cbd5e1;
    border-bottom-width: 2px;
    border-radius: 6px;
    background: #f8fafc;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.78rem;
    color: #0f172a;
}

.cj-bellerose-palette,
.cj-bellerose-props {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.65rem;
    overflow-y: auto;
    max-height: none;
    height: 100%;
    min-height: 0;
    transition: opacity 0.15s ease, visibility 0.15s ease;
}

.cj-bellerose-palette-group--sticky {
    position: sticky;
    top: -0.15rem;
    z-index: 2;
    background: #fff7ed;
    border: 1px solid #fdba74;
    border-radius: 8px;
    padding: 0.45rem 0.5rem 0.55rem;
    margin: 0 0 0.65rem;
}

/* Stationnement : pas sticky (évite de couper Place 40×8 / Camion). */
.cj-bellerose-palette-group--parking {
    background: #fff7ed;
    border: 1px solid #fdba74;
    border-radius: 8px;
    padding: 0.45rem 0.5rem 0.55rem;
    margin: 0 0 0.65rem;
}

.cj-bellerose-palette-group--parking h3,
.cj-bellerose-palette-group--sticky h3 {
    margin-top: 0;
    color: #c2410c;
}

.cj-bellerose-palette-group--parking .cj-btn {
    margin-bottom: 0.35rem;
}

.cj-bellerose-palette-group--parking .cj-bellerose-palette-hint {
    margin: 0.15rem 0 0.4rem;
}

.cj-btn--accent {
    background: #ea580c;
    border-color: #c2410c;
    color: #fff;
}

.cj-btn--accent:hover {
    background: #c2410c;
}

.cj-bellerose-palette h2,
.cj-bellerose-props h2 {
    margin: 0 0 0.5rem;
    font-size: 1rem;
}

.cj-bel-props-sub {
    margin: 0 0 0.5rem;
    font-size: 0.9rem;
}

.cj-bellerose-palette h3 {
    margin: 0.75rem 0 0.35rem;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #64748b;
}

.cj-bellerose-palette-hint {
    margin: 0 0 0.5rem;
    font-size: 0.78rem;
    color: #64748b;
}

.cj-bel-palette-item {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    width: 100%;
    margin: 0 0 0.35rem;
    padding: 0.45rem 0.5rem;
    text-align: left;
    font-size: 0.82rem;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    background: #f8fafc;
    cursor: pointer;
}

.cj-bel-palette-icon {
    flex-shrink: 0;
    width: 32px;
    height: 14px;
    border-radius: 2px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.cj-bel-palette-icon--container {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 8'%3E%3Crect width='40' height='8' rx='0.6' fill='%23dbeafe' stroke='%232563eb' stroke-width='0.5'/%3E%3Cg stroke='%2393c5fd' stroke-width='0.25'%3E%3Cline x1='4' y1='0.8' x2='4' y2='7.2'/%3E%3Cline x1='8' y1='0.8' x2='8' y2='7.2'/%3E%3Cline x1='12' y1='0.8' x2='12' y2='7.2'/%3E%3Cline x1='16' y1='0.8' x2='16' y2='7.2'/%3E%3Cline x1='20' y1='0.8' x2='20' y2='7.2'/%3E%3Cline x1='24' y1='0.8' x2='24' y2='7.2'/%3E%3Cline x1='28' y1='0.8' x2='28' y2='7.2'/%3E%3Cline x1='32' y1='0.8' x2='32' y2='7.2'/%3E%3Cline x1='36' y1='0.8' x2='36' y2='7.2'/%3E%3C/g%3E%3Crect x='1' y='1.6' width='3.2' height='4.8' fill='none' stroke='%231e40af' stroke-width='0.35'/%3E%3Cline x1='2.6' y1='1.6' x2='2.6' y2='6.4' stroke='%231e40af' stroke-width='0.25'/%3E%3C/svg%3E");
}

.cj-bel-palette-icon--container-20 {
    width: 22px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 8'%3E%3Crect width='20' height='8' rx='0.6' fill='%23dbeafe' stroke='%232563eb' stroke-width='0.5'/%3E%3Cg stroke='%2393c5fd' stroke-width='0.25'%3E%3Cline x1='3' y1='0.8' x2='3' y2='7.2'/%3E%3Cline x1='6' y1='0.8' x2='6' y2='7.2'/%3E%3Cline x1='9' y1='0.8' x2='9' y2='7.2'/%3E%3Cline x1='12' y1='0.8' x2='12' y2='7.2'/%3E%3Cline x1='15' y1='0.8' x2='15' y2='7.2'/%3E%3Cline x1='18' y1='0.8' x2='18' y2='7.2'/%3E%3C/g%3E%3Crect x='1' y='1.6' width='2.8' height='4.8' fill='none' stroke='%231e40af' stroke-width='0.35'/%3E%3C/svg%3E");
}

.cj-bel-palette-icon--parking {
    width: 12px;
    height: 28px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 40'%3E%3Crect width='10' height='40' rx='0.4' fill='rgba(251,146,60,0.12)' stroke='%23ea580c' stroke-width='0.9'/%3E%3C/svg%3E");
}

.cj-bel-palette-item:hover { background: #e2e8f0; }

.cj-bellerose-palette-actions {
    margin-top: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.cj-bel-align-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-bottom: 0.35rem;
}

.cj-btn--sm {
    padding: 0.25rem 0.4rem;
    font-size: 0.85rem;
    min-width: 2rem;
}

.cj-btn--block {
    width: 100%;
}

.cj-bellerose-canvas-wrap {
    position: relative;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
    min-height: 0;
    height: 100%;
    cursor: default;
}

.cj-bel-marquee {
    position: absolute;
    z-index: 8;
    border: 1.5px dashed #2563eb;
    background: rgba(37, 99, 235, 0.12);
    pointer-events: none;
    box-sizing: border-box;
}

.cj-bellerose-canvas-wrap.is-marquee {
    cursor: crosshair;
}

.cj-bellerose-canvas-wrap.is-select-tool .cj-bel-el:not(.is-locked) {
    cursor: move;
}

.cj-bellerose-canvas-wrap.is-placing {
    cursor: crosshair;
}

.cj-bellerose-canvas-wrap.is-placing .cj-bel-el.is-placement-preview,
.cj-bellerose-canvas-wrap.is-placing .cj-bel-measure.is-placement-preview {
    opacity: 0.62;
    pointer-events: none;
}

.cj-bel-el.is-placement-preview .cj-bel-el__rect,
.cj-bel-measure.is-placement-preview .cj-bel-measure-line {
    stroke-dasharray: 6 3;
}

.cj-bellerose-canvas-wrap.is-panning,
.cj-bellerose-canvas-wrap.is-space-pan.is-panning {
    cursor: grabbing;
}

.cj-bellerose-canvas-wrap.is-space-pan:not(.is-panning) {
    cursor: grab;
}

.cj-bellerose-canvas-wrap.is-hand-tool,
.cj-bellerose-canvas-wrap.is-hand-tool .cj-bel-el {
    cursor: grab;
}

.cj-bellerose-canvas-wrap.is-hand-tool.is-panning,
.cj-bellerose-canvas-wrap.is-hand-tool.is-panning .cj-bel-el {
    cursor: grabbing;
}

.cj-bel-btn-label {
    font-size: 0.75rem;
    margin-left: 0.15rem;
}

.cj-bel-compact-bar,
.cj-bel-bottom-nav,
.cj-bel-more-sheet,
.cj-bel-sheet-backdrop {
    display: none;
}

.cj-bel-mobile-bar {
    display: none;
    gap: 0.35rem;
    margin-bottom: 0.25rem;
}

.cj-bel-mobile-toggle {
    flex: 1;
    min-height: 2.5rem;
    font-size: 0.85rem;
}

.cj-bel-drag-info {
    position: absolute;
    top: 0.5rem;
    left: 0.5rem;
    z-index: 5;
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    background: rgba(15, 23, 42, 0.85);
    color: #f8fafc;
    border-radius: 4px;
    pointer-events: none;
}

.cj-bel-drag-info.is-follow {
    font-size: 1rem;
    font-weight: 700;
    padding: 0.4rem 0.7rem;
    z-index: 40;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.28);
}

.cj-bel-terrain-rotate-hit {
    fill: transparent;
    stroke: none;
    cursor: grab;
    pointer-events: all;
}

.cj-bel-terrain-rotate-handle {
    fill: #f59e0b;
    stroke: #fff;
    stroke-width: 2.5;
    cursor: grab;
    pointer-events: all;
}

.cj-bel-terrain-compass {
    pointer-events: none;
}

.cj-bel-terrain-compass__disc {
    fill: rgba(255, 255, 255, 0.96);
    stroke: #1e3a5f;
    stroke-width: 1.75;
}

.cj-bel-terrain-compass__ring {
    fill: none;
    stroke: #94a3b8;
    stroke-width: 0.8;
}

.cj-bel-terrain-compass__card {
    font-size: 8px;
    font-weight: 800;
    fill: #1e3a5f;
    pointer-events: none;
}

.cj-bel-terrain-compass__card--e {
    font-size: 7px;
    font-weight: 700;
    fill: #64748b;
}

.cj-bel-terrain-compass__needle {
    fill: #dc2626;
    stroke: #7f1d1d;
    stroke-width: 0.5;
}

.cj-bel-terrain-compass__hub {
    fill: #1e3a5f;
    stroke: #fff;
    stroke-width: 1;
}

.cj-bel-terrain-compass__deg {
    font-size: 11px;
    font-weight: 700;
    fill: #0f172a;
    paint-order: stroke fill;
    stroke: rgba(255, 255, 255, 0.95);
    stroke-width: 3px;
    pointer-events: none;
}

.cj-bel-dim-edge-sel {
    font-weight: 700;
    fill: #1d4ed8;
}

.cj-bel-legend {
    position: absolute;
    bottom: 0.5rem;
    right: 0.5rem;
    z-index: 5;
    padding: 0.35rem 0.5rem;
    font-size: 0.72rem;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
    pointer-events: auto;
    line-height: 1.35;
    max-width: 11rem;
    cursor: grab;
    user-select: none;
}

.cj-bel-legend.is-dragging {
    cursor: grabbing;
    opacity: 0.95;
}

.cj-bel-legend.is-collapsed .cj-bel-legend__list {
    display: none;
}

.cj-bel-legend__toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    width: 100%;
    border: 0;
    background: transparent;
    padding: 0;
    cursor: pointer;
    color: inherit;
    font: inherit;
    text-align: left;
}

.cj-bel-legend__title {
    font-weight: 700;
    font-size: 0.75rem;
    color: #0f172a;
}

.cj-bel-legend__chevron {
    font-size: 0.65rem;
    color: #64748b;
    transition: transform 0.15s ease;
}

.cj-bel-legend.is-collapsed .cj-bel-legend__chevron {
    transform: rotate(-90deg);
}

.cj-bel-legend__list {
    margin: 0.25rem 0 0;
    padding: 0;
    list-style: none;
}

.cj-bel-legend__list li {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin: 0.12rem 0;
    color: #334155;
}

.cj-bel-legend__swatch {
    display: inline-block;
    width: 14px;
    height: 10px;
    border-radius: 2px;
    flex-shrink: 0;
}

.cj-bel-legend__swatch--container {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 10'%3E%3Crect width='14' height='10' rx='1' fill='%23dbeafe' stroke='%232563eb' stroke-width='0.8'/%3E%3Cline x1='4' y1='1' x2='4' y2='9' stroke='%2393c5fd' stroke-width='0.6'/%3E%3Cline x1='8' y1='1' x2='8' y2='9' stroke='%2393c5fd' stroke-width='0.6'/%3E%3Cline x1='12' y1='1' x2='12' y2='9' stroke='%2393c5fd' stroke-width='0.6'/%3E%3Crect x='0.8' y='2' width='2.2' height='6' fill='none' stroke='%231e40af' stroke-width='0.6'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-color: transparent;
    border: none;
    width: 16px;
    height: 12px;
}

.cj-bel-legend__swatch--parking {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 14'%3E%3Crect width='10' height='14' rx='1' fill='%23fef9c3' stroke='%23ca8a04' stroke-width='0.7' stroke-dasharray='1.5 1'/%3E%3Crect x='1.5' y='4' width='7' height='8' rx='0.8' fill='%23fde047' stroke='%23a16207' stroke-width='0.5'/%3E%3Ctext x='5' y='10' text-anchor='middle' font-size='5' font-weight='700' fill='%23a16207'%3EP%3C/text%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-color: transparent;
    border: none;
    width: 12px;
    height: 14px;
}

.cj-bel-legend__swatch--mini {
    background: repeating-linear-gradient(45deg, rgba(251, 146, 60, 0.55), rgba(251, 146, 60, 0.55) 2px, rgba(234, 88, 12, 0.25) 2px, rgba(234, 88, 12, 0.25) 4px);
    border: 1.5px solid #ea580c;
}

.cj-bel-legend__swatch--circulation {
    background: #e2e8f0;
    border: 1px solid #94a3b8;
}

.cj-bel-legend__swatch--other {
    background: #f8fafc;
    border: 1px dashed #94a3b8;
}

.cj-bel-prop-type-block {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.cj-bel-prop-type-label {
    font-size: 0.8rem;
    font-weight: 600;
    color: #334155;
}

.cj-bel-prop-legend-type {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.cj-bel-prop-legend-btn {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    margin: 0;
    padding: 0.4rem 0.55rem;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    background: #fff;
    color: #0f172a;
    font: inherit;
    font-size: 0.82rem;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
}

.cj-bel-prop-legend-btn:hover {
    border-color: #94a3b8;
    background: #f8fafc;
}

.cj-bel-prop-legend-btn.is-active {
    border-color: #2563eb;
    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.2);
    background: #eff6ff;
    font-weight: 600;
}

.cj-bel-prop-legend-btn .cj-bel-legend__swatch {
    flex-shrink: 0;
}

.cj-bellerose-svg {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 480px;
    touch-action: none;
    user-select: none;
}

.cj-bel-terrain-bg { fill: #f1f5f9; }

.cj-bel-terrain-fill {
    fill: rgba(241, 245, 249, 0.5);
    stroke: none;
}

.cj-bel-terrain-outline {
    stroke: #1e293b;
    stroke-width: 3;
    fill: none;
}

.cj-bel-terrain-handle {
    fill: #2563eb;
    stroke: #fff;
    stroke-width: 2;
    cursor: grab;
    pointer-events: all;
}

.cj-bel-terrain-edge-hit {
    fill: rgba(37, 99, 235, 0.08);
    stroke: none;
    cursor: pointer;
    pointer-events: all;
}

.cj-bel-terrain-edge-hit.is-selected {
    fill: rgba(37, 99, 235, 0.18);
}

.cj-bel-terrain-edge-selected {
    stroke: #2563eb;
    stroke-width: 6;
    fill: none;
    pointer-events: none;
    vector-effect: non-scaling-stroke;
}

.cj-bel-entrance-gap {
    stroke: #16a34a;
    stroke-width: 4;
    stroke-dasharray: 8 4;
}

.cj-bel-entrance-marker .cj-bel-el__rect,
.cj-bel-entrance-marker rect {
    fill: rgba(34, 197, 94, 0.25);
    stroke: #16a34a;
    stroke-width: 2;
    pointer-events: none;
}

.cj-bel-entrance-handle {
    cursor: move;
    pointer-events: all;
}

.cj-bel-entrance-handle-dot {
    fill: #16a34a;
    stroke: #fff;
    stroke-width: 2;
    pointer-events: none;
}

.cj-bel-el__label.is-hidden-label {
    display: none;
}

.cj-bel-dim-label {
    font-size: 9px;
    fill: #475569;
    text-anchor: middle;
    pointer-events: none;
    paint-order: stroke fill;
    stroke: #fff;
    stroke-width: 3px;
    stroke-linejoin: round;
    font-weight: 600;
}

.cj-bel-dim-remain {
    fill: #15803d;
    font-size: 10px;
    font-weight: 700;
}

.cj-bel-dim-gap {
    fill: #0369a1;
    font-size: 10px;
    font-weight: 700;
}

.cj-bel-dim-gap--focus {
    fill: #0c4a6e;
    font-size: 11px;
}

.cj-bel-gap-line {
    stroke: #0284c7;
    stroke-width: 1.4;
    stroke-dasharray: 4 3;
    fill: none;
    opacity: 0.9;
}

.cj-bel-el__label {
    font-size: 10px;
    fill: #0f172a;
    pointer-events: none;
    text-anchor: middle;
    paint-order: stroke fill;
    stroke: rgba(255, 255, 255, 0.85);
    stroke-width: 2.5px;
    stroke-linejoin: round;
}

.cj-bel-lod-far {
    font-size: 8px;
    opacity: 0.92;
}

.cj-bel-lod-mid {
    font-size: 10px;
}

.cj-bel-lod-close {
    font-size: 11px;
}

.cj-bel-guide {
    stroke: #f472b6;
    stroke-width: 1;
    stroke-dasharray: 4 3;
    pointer-events: none;
}

.cj-bel-measure-line {
    stroke: #dc2626;
    stroke-width: 2;
    stroke-dasharray: 6 4;
    pointer-events: none;
}

.cj-bel-measure-line.is-preview {
    stroke: #f87171;
    opacity: 0.85;
}

.cj-bel-measure.is-selected .cj-bel-measure-line {
    stroke: #2563eb;
}

.cj-bel-measure-hit {
    stroke: transparent;
    fill: none;
    pointer-events: stroke;
}

.cj-bel-measure-handle {
    fill: #fff;
    stroke: #2563eb;
    stroke-width: 2;
    cursor: move;
}

.cj-bel-measure-pt {
    fill: #dc2626;
    stroke: #fff;
    stroke-width: 1;
    pointer-events: none;
}

.cj-bel-measure-label {
    font-size: 11px;
    fill: #b91c1c;
    font-weight: 600;
    text-anchor: middle;
    pointer-events: none;
    paint-order: stroke fill;
    stroke: #fff;
    stroke-width: 3px;
    stroke-linejoin: round;
}

.cj-bel-measure-label--remain {
    fill: #15803d;
    font-size: 12px;
    font-weight: 700;
}

.cj-bel-measure.is-selected .cj-bel-measure-label {
    fill: #1d4ed8;
}

.cj-bel-warn-overlay {
    fill: rgba(239, 68, 68, 0.15);
    stroke: #ef4444;
    stroke-width: 1;
    stroke-dasharray: 3 2;
}

.cj-bel-warn--overlap { fill: rgba(249, 115, 22, 0.2); stroke: #f97316; }
.cj-bel-warn--entrance { fill: rgba(220, 38, 38, 0.25); stroke: #dc2626; }

.cj-bel-el { cursor: move; }
.cj-bel-el.is-selected { filter: drop-shadow(0 0 2px #2563eb); }
.cj-bel-el.is-locked { cursor: not-allowed; opacity: 0.85; }

.cj-bel-el__rect { stroke-width: 1.5; }

.cj-bel-el--container .cj-bel-el__container-bg {
    fill: #dbeafe;
    stroke: #2563eb;
    stroke-width: 2;
}

.cj-bel-el--container[data-category="40_neuf"] .cj-bel-el__container-bg,
.cj-bel-container--40_neuf.cj-bel-el__container-bg { fill: #bbf7d0; stroke: #16a34a; }
.cj-bel-el--container[data-category="40_wwt"] .cj-bel-el__container-bg,
.cj-bel-container--40_wwt.cj-bel-el__container-bg { fill: #dbeafe; stroke: #2563eb; }
.cj-bel-el--container[data-category="40_cw"] .cj-bel-el__container-bg,
.cj-bel-container--40_cw.cj-bel-el__container-bg { fill: #bfdbfe; stroke: #1d4ed8; }
.cj-bel-el--container[data-category="40_open"] .cj-bel-el__container-bg,
.cj-bel-container--40_open.cj-bel-el__container-bg { fill: #e0e7ff; stroke: #4f46e5; }
.cj-bel-el--container[data-category="20_onetrip"] .cj-bel-el__container-bg,
.cj-bel-container--20_onetrip.cj-bel-el__container-bg { fill: #ccfbf1; stroke: #0d9488; }
.cj-bel-el--container[data-category="20_usage"] .cj-bel-el__container-bg,
.cj-bel-container--20_usage.cj-bel-el__container-bg { fill: #e2e8f0; stroke: #64748b; }

.cj-bel-corrug { stroke: rgba(37, 99, 235, 0.35); stroke-width: 1; }
.cj-bel-doors { fill: rgba(30, 64, 175, 0.08); stroke: #1e40af; stroke-width: 1; }
.cj-bel-door-split { stroke: #1e40af; stroke-width: 0.8; }
.cj-bel-casting { fill: #64748b; stroke: none; opacity: 0.75; }

.cj-bel-el--parking .cj-bel-el__parking-bg {
    fill: rgba(254, 249, 195, 0.45);
    stroke: #ca8a04;
    stroke-width: 1.5;
    stroke-dasharray: 5 3;
}

.cj-bel-el--parking .cj-bel-el__parking-bg--slot,
.cj-bel-el--parking .cj-bel-el__parking-bg--paint {
    fill: rgba(251, 146, 60, 0.07);
    stroke: #ea580c;
    stroke-width: 2.4;
    stroke-dasharray: none;
}

.cj-bel-el--parking.is-snap-target .cj-bel-el__parking-bg {
    fill: rgba(234, 88, 12, 0.18);
    stroke: #c2410c;
    stroke-width: 2.8;
    stroke-dasharray: none;
}

.cj-bel-slot-corner,
.cj-bel-paint-line {
    stroke: #f59e0b;
    stroke-width: 2.2;
    stroke-linecap: square;
    fill: none;
}

.cj-bel-slot-bay-line {
    stroke: #ea580c;
    stroke-width: 1.8;
    stroke-dasharray: none;
}

.cj-bel-slot-bay-label {
    fill: #c2410c;
    font-weight: 700;
    opacity: 0.85;
    pointer-events: none;
}

.cj-bel-parking-dim {
    fill: #c2410c;
    font-weight: 600;
    pointer-events: none;
    paint-order: stroke fill;
    stroke: #fff;
    stroke-width: 2.5px;
}

.cj-bel-truck-body { fill: #fde047; stroke: #a16207; stroke-width: 1; }
.cj-bel-truck-cab { fill: #eab308; stroke: #a16207; stroke-width: 0.8; }
.cj-bel-truck-wheel { fill: #334155; stroke: #fff; stroke-width: 0.5; }
.cj-bel-parking-p {
    font-size: 10px;
    font-weight: 700;
    fill: #a16207;
    pointer-events: none;
}

.cj-bel-guide-slot {
    fill: rgba(234, 88, 12, 0.14);
    stroke: #ea580c;
    stroke-width: 2;
    stroke-dasharray: 4 3;
}

.cj-bel-palette-icon--slot {
    width: 28px;
    height: 12px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 8'%3E%3Crect width='40' height='8' rx='0.4' fill='rgba(251,146,60,0.12)' stroke='%23ea580c' stroke-width='0.9'/%3E%3Cline x1='20' y1='0' x2='20' y2='8' stroke='%23f59e0b' stroke-width='0.7'/%3E%3C/svg%3E");
}

.cj-bel-palette-icon--parking {
    width: 12px;
    height: 28px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 40'%3E%3Crect width='10' height='40' rx='0.4' fill='rgba(251,146,60,0.12)' stroke='%23ea580c' stroke-width='0.9'/%3E%3C/svg%3E");
}

.cj-bel-dialog {
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    padding: 0;
    max-width: min(520px, 94vw);
    max-height: min(92vh, 720px);
    width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.2);
}

.cj-bel-dialog::backdrop {
    background: rgba(15, 23, 42, 0.45);
}

.cj-bel-dialog__form {
    padding: 1rem 1.1rem 1.1rem;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.cj-bel-dialog__form h3 {
    margin: 0;
    font-size: 1.05rem;
}

.cj-bel-dialog__hint {
    margin: 0;
    font-size: 0.82rem;
    color: #64748b;
}

.cj-bel-dialog__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.55rem 0.75rem;
}

.cj-bel-dialog__grid label,
.cj-bel-dialog__form > .cj-bel-checkbox-label {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.82rem;
    color: #334155;
}

.cj-bel-dialog__form > .cj-bel-checkbox-label {
    flex-direction: row;
    align-items: center;
}

.cj-bel-dialog__grid input,
.cj-bel-dialog__grid select {
    padding: 0.4rem 0.45rem;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    font: inherit;
}

.cj-bel-dialog__actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.25rem;
}

.cj-bel-legend__swatch--parking {
    background: rgba(251, 146, 60, 0.2);
    border: 2px solid #ea580c;
}

.cj-bel-el--container .cj-bel-el__rect:not(.cj-bel-el__container-bg) {
    fill: #dbeafe;
    stroke: #2563eb;
    stroke-width: 2;
}

.cj-bel-el--zone[data-subtype="mini_warehouse"] .cj-bel-el__rect,
.cj-bel-el--zone[data-subtype="mini_warehouse"] .cj-bel-el__rect[fill] {
    fill: url(#cj-bel-hatch-mini);
    stroke: #ea580c;
    stroke-width: 1.5;
}

.cj-bel-el__zone-title {
    font-weight: 700;
    fill: #0f172a;
    paint-order: stroke fill;
    stroke: rgba(255, 255, 255, 0.92);
    stroke-width: 3px;
}

.cj-bel-el--zone[data-subtype="circulation"] .cj-bel-el__rect,
.cj-bel-el--zone[data-category="circulation"] .cj-bel-el__rect {
    fill: url(#cj-bel-hatch-circulation);
    stroke: #94a3b8;
    stroke-width: 1;
    stroke-dasharray: none;
}

.cj-bel-el--zone:not([data-subtype="mini_warehouse"]):not([data-subtype="circulation"]) .cj-bel-el__rect,
.cj-bel-el--rectangle .cj-bel-el__rect {
    fill: rgba(148, 163, 184, 0.18);
    stroke: #64748b;
    stroke-dasharray: 6 3;
}

.cj-bel-el--boundary .cj-bel-el__line,
.cj-bel-el--line .cj-bel-el__line {
    stroke: #1e293b;
    stroke-width: 2;
    fill: none;
}

.cj-bel-el--annotation .cj-bel-el__rect,
.cj-bel-el--text .cj-bel-el__rect {
    fill: transparent;
    stroke: none;
}

.cj-bel-el--text .cj-bel-el__label,
.cj-bel-el--annotation .cj-bel-el__label {
    font-size: 12px;
    font-weight: 600;
}

.cj-bel-el__slot {
    font-size: 9px;
    font-weight: 600;
}

.cj-bel-scalebar-bg {
    fill: rgba(255, 255, 255, 0.88);
    stroke: #cbd5e1;
    stroke-width: 1;
}

.cj-bel-scalebar-line {
    stroke: #0f172a;
    stroke-width: 2.5;
}

.cj-bel-scalebar-tick {
    stroke: #0f172a;
    stroke-width: 2;
}

.cj-bel-scalebar-label {
    font-size: 10px;
    font-weight: 600;
    fill: #0f172a;
    text-anchor: middle;
    pointer-events: none;
}

.cj-bel-lock-icon {
    font-size: 10px;
    pointer-events: none;
    text-anchor: end;
}

.cj-bel-selection-box {
    fill: none;
    stroke: #2563eb;
    stroke-width: 2.5;
    stroke-dasharray: 5 3;
    pointer-events: none;
}

.cj-bel-rotate-handle {
    fill: #2563eb;
    stroke: #fff;
    stroke-width: 2;
    cursor: grab;
}

.cj-bel-resize-handle {
    fill: #fff;
    stroke: #2563eb;
    stroke-width: 1.5;
    cursor: nwse-resize;
}

.cj-bellerose-props-form {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.cj-bel-props-autosave-hint {
    margin: 0 0 0.25rem;
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.35;
}

.cj-bel-prop-spacing-block {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding: 0.45rem 0.5rem;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    background: #f8fafc;
}

.cj-bel-prop-spacing-hint {
    margin: 0;
    font-size: 0.72rem;
    color: #64748b;
    line-height: 1.35;
}

.cj-bellerose-props-form label {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    font-size: 0.82rem;
}

.cj-bel-checkbox-label {
    flex-direction: row !important;
    align-items: center;
    gap: 0.4rem !important;
}

.cj-bellerose-props-form input,
.cj-bellerose-props-form select {
    padding: 0.35rem 0.45rem;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    font-size: 0.85rem;
}

.cj-bellerose-props-empty {
    font-size: 0.85rem;
    color: #64748b;
    margin: 0;
}

.cj-bel-prop-area-info {
    margin: 0;
    font-size: 0.82rem;
    color: #475569;
    padding: 0.35rem 0.5rem;
    background: #f1f5f9;
    border-radius: 4px;
}

.cj-bellerose-scale {
    margin-top: 1rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e2e8f0;
}

.cj-bellerose-scale label {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.82rem;
}

@media (max-width: 900px) {
    .cj-bel-mobile-bar {
        display: flex;
    }

    .cj-bel-panel-toggle {
        display: none;
    }

    .cj-bellerose-editor,
    .cj-bellerose-editor.is-palette-collapsed,
    .cj-bellerose-editor.is-props-collapsed,
    .cj-bellerose-editor.is-palette-collapsed.is-props-collapsed {
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr;
        min-height: 420px;
    }

    .cj-bellerose-editor.is-palette-collapsed .cj-bellerose-palette,
    .cj-bellerose-editor.is-props-collapsed .cj-bellerose-props {
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
        width: auto;
        max-width: none;
        padding: 0.65rem;
        border: 1px solid #e2e8f0;
    }

    .cj-bellerose-palette,
    .cj-bellerose-props {
        display: none;
        max-height: min(48vh, 360px);
        position: relative;
        z-index: 6;
        box-shadow: 0 4px 16px rgba(15, 23, 42, 0.12);
        order: 2;
    }

    .cj-bellerose-palette.is-open,
    .cj-bellerose-props.is-open {
        display: block;
        visibility: visible;
        opacity: 1;
        width: auto;
        max-width: none;
        pointer-events: auto;
    }

    .cj-bellerose-canvas-wrap {
        order: -1;
        min-height: 58vh;
    }

    .cj-bellerose-toolbar .cj-bel-btn-label {
        display: none;
    }

    .cj-bellerose-toolbar #cj-bel-tool-terrain {
        position: sticky;
        left: 0;
        z-index: 2;
        background: #fff;
        box-shadow: 4px 0 8px rgba(15, 23, 42, 0.08);
        font-weight: 700;
    }

    .cj-bellerose-toolbar #cj-bel-tool-terrain .cj-bel-btn-label {
        display: inline;
        font-size: 0.78rem;
        font-weight: 700;
        margin-left: 0.15rem;
    }

    .cj-bellerose-toolbar {
        gap: 0.25rem;
    }

    .cj-bellerose-area-summary {
        gap: 0.75rem 1rem;
    }

    .cj-bel-warnings-list {
        max-height: 5rem;
    }

    .cj-bel-legend {
        font-size: 0.68rem;
        max-width: 9.5rem;
    }

    .cj-page--bellerose.is-plan-fullscreen .cj-bellerose-canvas-wrap {
        min-height: calc(100vh - 8rem);
    }
}

@media (max-width: 640px) {
    .cj-bellerose-header h1 {
        font-size: 1.15rem;
    }

    .cj-bellerose-svg {
        min-height: 52vh;
    }

    .cj-bellerose-canvas-wrap {
        min-height: 52vh;
    }

    .cj-bel-edge-dock {
        bottom: 4.1rem;
    }

    .cj-bel-drag-info.is-follow {
        font-size: 1.15rem;
        padding: 0.5rem 0.8rem;
    }

    .cj-bel-autosave-hint {
        display: none;
    }
}

/* PlanCour terrain edges + mobile dock (bellerose-editor.css?v=50) */
@media (min-width: 901px) {
    .cj-bel-touch-bar {
        display: none;
    }

    .cj-bel-edge-dock {
        max-width: 22rem;
        left: auto;
        right: 0.75rem;
        bottom: 0.75rem;
    }
}

.cj-bel-mobile-toggle.is-on {
    background: #dbeafe;
    border-color: #2563eb;
    color: #1d4ed8;
}

.cj-bel-terrain-edge-block {
    display: grid;
    gap: 0.5rem;
    padding: 0.65rem 0.55rem 0.7rem;
    margin-bottom: 0.35rem;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
    background: #eff6ff;
}

.cj-bel-terrain-edge-block label {
    min-height: auto;
}

.cj-bel-terrain-edge-block input {
    min-height: 44px;
    font-size: 16px;
}

.cj-bel-terrain-edge-block .cj-btn {
    min-height: 2.5rem;
}

.cj-bel-edge-dock {
    position: absolute;
    left: 0.5rem;
    right: 0.5rem;
    bottom: 3.6rem;
    z-index: 28;
    padding: 0.65rem 0.7rem 0.75rem;
    background: rgba(255, 255, 255, 0.97);
    border: 1px solid #93c5fd;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.18);
}

.cj-bel-edge-dock__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.4rem;
}

.cj-bel-edge-dock__close {
    border: 0;
    background: #e2e8f0;
    border-radius: 6px;
    width: 2rem;
    height: 2rem;
    cursor: pointer;
    font-size: 1rem;
}

.cj-bel-edge-dock__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.45rem;
}

.cj-bel-edge-dock__grid label {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: #334155;
}

.cj-bel-edge-dock__grid input {
    min-height: 44px;
    font-size: 16px;
    padding: 0.35rem 0.45rem;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
}

.cj-bel-edge-dock__hint {
    margin: 0.35rem 0 0.45rem;
    font-size: 0.72rem;
    color: #64748b;
}

.cj-bel-edge-dock__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.4rem;
}

.cj-bel-edge-dock__actions .cj-btn {
    min-height: 44px;
    font-size: 0.82rem;
}

.cj-bel-edge-dock__actions .cj-bel-btn-reset,
.cj-bel-edge-dock__actions #cj-bel-edge-dock-redraw {
    grid-column: 1 / -1;
}

.cj-bel-btn-reset {
    background: #fef2f2;
    border-color: #fecaca;
    color: #991b1b;
}

.cj-bel-tool--terrain {
    font-weight: 700;
}

.cj-bel-touch-btn--terrain {
    padding-left: 0.7rem;
    padding-right: 0.7rem;
    font-weight: 700;
    font-size: 0.85rem;
    white-space: nowrap;
}

.cj-bel-mobile-terrain {
    flex: 1.15;
    font-weight: 700;
}

@media (max-width: 900px) {
    .cj-bellerose-toolbar {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
        padding-bottom: 4px;
        margin-bottom: 0.15rem;
        scrollbar-width: thin;
    }

    .cj-bellerose-toolbar .cj-btn,
    .cj-bellerose-toolbar .cj-bel-select {
        flex-shrink: 0;
        scroll-snap-align: start;
        min-height: var(--cj-touch-min, 44px);
        min-width: var(--cj-touch-min, 44px);
        padding: 0.35rem 0.55rem;
        font-size: 0.82rem;
    }

    .cj-bel-toolbar-sep {
        flex-shrink: 0;
        height: 1.75rem;
    }

    .cj-bel-mobile-bar {
        display: flex;
        position: sticky;
        bottom: 0;
        z-index: 55;
        gap: 0.5rem;
        margin: 0 -0.25rem 0.35rem;
        padding: 0.35rem 0.25rem calc(0.35rem + var(--cj-safe-bottom, 0px));
        background: var(--cj-bg, #f4f6f9);
        border-top: 1px solid #e2e8f0;
    }

    .cj-bel-mobile-toggle {
        flex: 1;
        min-height: var(--cj-touch-min, 44px);
        font-size: 0.9rem;
        font-weight: 700;
    }

    .cj-bellerose-palette,
    .cj-bellerose-props {
        max-height: min(42vh, 320px);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .cj-bellerose-props-form input,
    .cj-bellerose-props-form select {
        min-height: 44px;
        font-size: 16px;
    }

    .cj-bel-touch-bar,
    #cj-bel-touch-bar {
        display: none !important;
    }

    .cj-bel-touch-btn {
        flex-shrink: 0;
        min-width: var(--cj-touch-min, 44px);
        min-height: var(--cj-touch-min, 44px);
        font-size: 1.1rem;
    }

    .cj-bellerose-canvas-wrap {
        padding-bottom: 3.5rem;
    }

    .cj-bellerose-toolbar--sticky {
        top: calc(var(--cj-safe-top, 0px));
    }
}

@media (max-width: 640px) {
    .cj-bellerose-toolbar .cj-btn[id="cj-bel-fullscreen"],
    .cj-bellerose-toolbar .cj-btn[id="cj-bel-shortcuts"],
    .cj-bellerose-toolbar .cj-btn[id="cj-bel-pack-zero"],
    .cj-bellerose-toolbar .cj-btn[id="cj-bel-zoom-selection"] {
        display: none;
    }
}


/* Mobile-first PlanCour editor chrome (phone / Capacitor WebView) */
@media (max-width: 900px) {
    html.cj-plancour-html:has(.cj-page--bellerose),
    body.cj-app--plan-editor,
    body.cj-app--yardplan-editor,
    body.cj-app:has(.cj-page--bellerose) {
        height: 100%;
        height: 100dvh;
        overflow: hidden;
    }

    body.cj-app--plan-editor .cj-bel-app-topbar,
    body.cj-app--yardplan-editor .cj-bel-app-topbar,
    body.cj-app--plan-standalone:has(.cj-page--bellerose) .cj-bel-app-topbar,
    body.cj-app--bellerose-standalone:has(.cj-page--bellerose) .cj-bel-app-topbar {
        display: none;
    }

    /* Ne pas forcer 100dvh sur .cj-main si la topbar admin reste : ça coupe la bottom-nav. */
    body.cj-app--plan-editor .cj-shell,
    body.cj-app--yardplan-editor .cj-shell,
    body.cj-app:has(.cj-page--bellerose) .cj-shell {
        display: flex !important;
        flex-direction: column !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        overflow: hidden !important;
        padding: 0 !important;
    }

    /* Sur Bellerose admin : la compact-bar remplace la topbar Menu. */
    body.cj-app--bellerose-editor:has(.cj-page--bellerose) .cj-topbar,
    body.cj-app--bellerose-editor:has(.cj-page--bellerose) .cj-menu-panel,
    body.cj-app--bellerose-editor:has(.cj-page--bellerose) .cj-bottom-nav {
        display: none !important;
    }

    body.cj-app--plan-editor .cj-main,
    body.cj-app--yardplan-editor .cj-main,
    .cj-app:has(.cj-page--bellerose) .cj-main,
    body.cj-app--bellerose-standalone .cj-main--bellerose-app,
    body.cj-app--plan-standalone .cj-main--plan-app {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        height: auto !important;
        max-height: none !important;
        padding: 0 !important;
        overflow: hidden !important;
        display: flex !important;
        flex-direction: column !important;
    }

    .cj-page--bellerose {
        gap: 0;
        height: 100%;
        max-height: 100dvh;
        padding-left: var(--cj-safe-left, 0px);
        padding-right: var(--cj-safe-right, 0px);
    }

    .cj-bellerose-header,
    .cj-bellerose-toolbar,
    .cj-bel-mobile-bar,
    .cj-bel-touch-bar,
    .cj-bellerose-note,
    .cj-bellerose-meta,
    .cj-bel-edge-dock {
        display: none !important;
    }

    .cj-bel-compact-bar {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        align-items: center;
        gap: 0.45rem;
        flex-shrink: 0;
        min-height: 48px;
        padding: calc(0.3rem + var(--cj-safe-top, 0px)) 0.55rem 0.3rem;
        background: #1a365d;
        color: #fff;
        z-index: 10060 !important;
        position: relative;
    }

    .cj-bel-compact-back {
        flex-shrink: 0;
        min-height: 44px;
        min-width: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0 0.55rem;
        color: #fff;
        text-decoration: none;
        font-size: 0.82rem;
        font-weight: 700;
        border: 1px solid rgba(255, 255, 255, 0.35);
        border-radius: 8px;
        white-space: nowrap;
    }

    .cj-bel-compact-meta {
        flex: 1;
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 0.05rem;
    }

    .cj-bel-compact-name {
        font-size: 0.92rem;
        line-height: 1.2;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .cj-bel-compact-save {
        font-size: 0.72rem;
        opacity: 0.88;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .cj-bel-compact-more {
        flex-shrink: 0;
        min-width: 44px;
        min-height: 44px;
        border: 0;
        border-radius: 8px;
        background: rgba(255, 255, 255, 0.12);
        color: #fff;
        font-size: 1.35rem;
        line-height: 1;
        cursor: pointer;
    }

    .cj-bellerose-area-summary {
        flex-shrink: 0;
        margin: 0;
        padding: 0.15rem 0.55rem;
        border: 0;
        border-radius: 0;
        border-bottom: 1px solid #e2e8f0;
        gap: 0.55rem;
        background: #f8fafc;
    }

    .cj-bel-area-label {
        font-size: 0.62rem;
    }

    .cj-bel-area-stat strong {
        font-size: 0.75rem;
    }

    .cj-bellerose-status {
        position: absolute;
        left: 0.5rem;
        right: 0.5rem;
        top: calc(48px + var(--cj-safe-top, 0px) + 1.7rem);
        z-index: 20;
        margin: 0;
        padding: 0.3rem 0.5rem;
        font-size: 0.75rem;
        background: rgba(255, 255, 255, 0.92);
        border-radius: 8px;
        pointer-events: none;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.12);
    }

    .cj-page--bellerose {
        position: relative;
    }

    .cj-bellerose-warnings {
        flex-shrink: 0;
        max-height: 4.5rem;
        overflow: auto;
        font-size: 0.75rem;
    }

    .cj-bel-bottom-nav {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        flex-shrink: 0;
        z-index: 10060 !important;
        position: relative;
        background: #0f172a;
        color: #f8fafc;
        padding: 0.2rem 0.15rem calc(0.25rem + var(--cj-safe-bottom, 0px));
        border-top: 1px solid #1e293b;
        transform: none !important;
    }

    .cj-bel-bottom-nav__btn {
        flex: 1;
        min-height: 44px;
        min-width: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 0.05rem;
        border: 0;
        background: transparent;
        color: #e2e8f0;
        font-size: 0.62rem;
        font-weight: 700;
        line-height: 1.1;
        cursor: pointer;
        touch-action: manipulation;
        border-radius: 8px;
        padding: 0.15rem 0.1rem;
    }

    .cj-bel-bottom-nav__btn span[aria-hidden="true"] {
        font-size: 1.15rem;
        line-height: 1;
    }

    .cj-bel-bottom-nav__btn.is-active,
    .cj-bel-bottom-nav__btn.is-on {
        background: #ea580c;
        color: #fff;
    }

    .cj-bel-sheet-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 70;
        background: rgba(15, 23, 42, 0.45);
    }

    .cj-bel-sheet-backdrop[hidden] {
        display: none !important;
    }

    .cj-bellerose-palette,
    .cj-bellerose-props,
    .cj-bellerose-editor.is-palette-collapsed .cj-bellerose-palette,
    .cj-bellerose-editor.is-props-collapsed .cj-bellerose-props {
        display: flex;
        flex-direction: column;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 80;
        width: auto;
        max-width: none;
        max-height: min(68vh, 32rem);
        margin: 0;
        padding: 0.65rem 0.75rem calc(0.85rem + var(--cj-safe-bottom, 0px));
        border: 0;
        border-radius: 16px 16px 0 0;
        background: #fff;
        box-shadow: 0 -8px 28px rgba(15, 23, 42, 0.22);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        transform: translateY(110%);
        visibility: hidden;
        pointer-events: none;
        opacity: 1;
        transition: transform 0.22s ease, visibility 0.22s;
    }

    .cj-bellerose-palette.is-open,
    .cj-bellerose-props.is-open {
        transform: translateY(0);
        visibility: visible;
        pointer-events: auto;
    }

    .cj-bel-more-sheet {
        display: flex;
        flex-direction: column;
        gap: 0.55rem;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 85;
        max-height: min(72vh, 34rem);
        padding: 0.4rem 0.75rem calc(0.85rem + var(--cj-safe-bottom, 0px));
        background: #fff;
        border-radius: 16px 16px 0 0;
        box-shadow: 0 -8px 28px rgba(15, 23, 42, 0.22);
        overflow-y: auto;
    }

    .cj-bel-more-sheet[hidden] {
        display: none !important;
    }

    .cj-bel-more-sheet__handle {
        width: 2.5rem;
        height: 4px;
        margin: 0.15rem auto 0.2rem;
        border-radius: 99px;
        background: #cbd5e1;
    }

    .cj-bel-more-sheet__head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.5rem;
    }

    .cj-bel-more-sheet__head h2 {
        margin: 0;
        font-size: 1rem;
    }

    .cj-bel-more-sheet__stats {
        margin: 0;
        font-size: 0.75rem;
        color: #475569;
    }

    .cj-bel-more-sheet__group {
        display: flex;
        flex-wrap: wrap;
        gap: 0.4rem;
    }

    .cj-bel-more-sheet__group .cj-btn,
    .cj-bel-more-logout {
        min-height: 44px;
        min-width: 44px;
        font-size: 0.85rem;
    }

    .cj-bel-more-logout {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        color: inherit;
    }

    .cj-bel-legend {
        top: 0.45rem;
        right: 0.45rem;
        bottom: auto;
        left: auto;
        z-index: 12;
        font-size: 0.68rem;
        max-width: 9rem;
    }

    .cj-bellerose-props-form input,
    .cj-bellerose-props-form select,
    .cj-bel-terrain-edge-block input {
        min-height: 44px;
        font-size: 16px;
    }

    .cj-bel-palette-item,
    .cj-bellerose-palette .cj-btn,
    .cj-bel-panel-close {
        min-height: 44px;
    }

    .cj-bellerose-editor {
        flex: 1;
        min-height: 0;
        grid-template-columns: 1fr;
        grid-template-rows: minmax(0, 1fr);
    }

    .cj-bellerose-canvas-wrap {
        order: 0;
        min-height: 0 !important;
        height: 100% !important;
        border-radius: 0;
    }

    .cj-bellerose-svg {
        min-height: 0 !important;
        height: 100%;
    }

    .cj-page--bellerose.is-plan-fullscreen .cj-bellerose-canvas-wrap {
        min-height: 0;
        height: 100%;
    }
}

/* Hard kill removed — fixe mobile-nav-click 2026-09-04. */

/* mobile-nav-click 2026-09-04 — garantir compact-bar + bottom tools cliquables */
@media (max-width: 900px) {
    .cj-bel-compact-bar,
    .cj-bel-compact-bar a,
    .cj-bel-compact-bar button,
    .cj-bel-bottom-nav,
    .cj-bel-bottom-nav__btn {
        pointer-events: auto !important;
        touch-action: manipulation;
    }
    .cj-bel-bottom-nav__btn {
        min-height: 44px !important;
    }
    /* Standalone : pas de double topbar */
    body.cj-app--bellerose-standalone .cj-bel-app-topbar {
        display: none !important;
    }
}