/* The illustration's styles are deliberately isolated from Bootstrap/admin pages. */
.df-isometric {
    --df-scene-green: #075443;
    position: relative;
    display: block;
    width: 100%;
    min-width: 0;
    margin: 0 0 28px;
    overflow: hidden;
    border: 1px solid #dbe9df;
    border-radius: 28px;
    background: #edf4ef;
    isolation: isolate;
}
.df-isometric *, .df-isometric *::before, .df-isometric *::after { box-sizing: border-box; }
.df-isometric__art { display: block; width: 100%; aspect-ratio: 1280 / 740; }
.df-isometric__art > img, .df-isometric__art > svg { display: block; width: 100%; height: auto; margin: 0; }
.df-isometric__art > svg { overflow: hidden; }
/* The complete scene scales to the screen; no automatic camera zoom or pan. */
.df-isometric[data-scene-compact="true"] .df-world-shadow,
.df-isometric[data-scene-compact="true"] .df-isometric__art > svg [filter] {
    filter: none;
}
@media (max-width: 619.98px) {
    .df-isometric[data-scene-ready] .df-world-label { font-size: 16px; }
}
.df-isometric__toggle {
    position: absolute;
    right: 18px;
    bottom: 16px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 11px;
    border: 1px solid #cce1d4;
    border-radius: 20px;
    background: #fff9ef;
    color: #075443;
    font: 500 11px/1.4 'Segoe UI', Arial, sans-serif;
    cursor: pointer;
}
.df-isometric__toggle[hidden] { display: none !important; }
.df-isometric__toggle:hover { background: #e1f3e8; }
.df-isometric__toggle:focus-visible { outline: 3px solid #008e70; outline-offset: 3px; }
.df-isometric__toggle svg { width: 12px; height: 12px; fill: currentColor; }
.df-isometric__sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (max-width: 767.98px) {
    .df-isometric { margin-bottom: 20px; border-radius: 20px; }
    .df-isometric__toggle { right: 9px; bottom: 8px; padding: 5px 8px; font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
    .df-isometric *, .df-isometric *::before, .df-isometric *::after { animation: none !important; transition: none !important; }
}
