.serviumwp-builder.serviumwp-builder--canvas {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(18rem, 2fr);
    gap: clamp(1rem, 3vw, 3rem);
    max-width: var(--servium-canvas-max-width, 1440px);
    align-items: start;
}
.serviumwp-builder--canvas > .serviumwp-builder-form { min-width: 0; }
.servium-canvas { position: sticky; top: var(--servium-canvas-sticky-top, 2rem); min-width: 0; }
.servium-canvas[hidden], .servium-canvas [hidden] { display: none !important; }
.servium-canvas__views { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.servium-canvas__views button {font: inherit;padding: .5rem .8rem;border: 1px solid #77777742;border-radius: .25rem;background: #fff;color: #222;cursor: pointer;}
.servium-canvas__views button[aria-pressed="true"] { background: #222; color: #fff; }
.servium-canvas__views button:focus-visible { outline: 3px solid #2171b5; outline-offset: 3px; }
.servium-canvas__preloader { position: relative; display: flex; width: 100%; min-height: 8rem; align-items: center; justify-content: center; gap: .65rem; overflow: hidden; padding: 2rem 1rem; background: #e5e7eb; color: #646970; }
.servium-canvas__preloader::before { position: absolute; inset: 0; content: ''; background: linear-gradient(100deg, transparent 20%, rgba(255,255,255,.5) 45%, transparent 70%); transform: translateX(-100%); animation: servium-canvas-shimmer 1.4s ease-in-out infinite; }
.servium-canvas__preloader>* { position: relative; z-index: 1; }
.servium-canvas__preloader-spinner { width: 1.15rem; height: 1.15rem; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: servium-canvas-spin .8s linear infinite; }
@keyframes servium-canvas-spin { to { transform: rotate(360deg); } }
@keyframes servium-canvas-shimmer { to { transform: translateX(100%); } }
.servium-canvas__stage { position: relative; display: grid; overflow: hidden; }
.servium-canvas__footer { margin-top: .5rem; }
.servium-canvas__declaration { margin: 0 0 .35rem; }
.servium-canvas__frame { position: relative; grid-area: 1 / 1; width: 100%; height: 100%; overflow: hidden; isolation: isolate; }
.servium-canvas__frame--incoming, .servium-canvas__component-overlay { grid-area: 1 / 1; }
.servium-canvas__component-overlay { position: absolute; inset: 0; isolation: isolate; pointer-events: none; }
.servium-canvas__transition-outgoing, .servium-canvas__transition-incoming {
    transition: opacity var(--servium-canvas-transition-duration, 220ms) ease;
    will-change: opacity;
}
.servium-canvas__transition-incoming { opacity: 0; }
.servium-canvas__transition-outgoing.is-active {
    opacity: 0;
    transition-delay: var(--servium-canvas-transition-out-delay, 60ms);
}
.servium-canvas__transition-incoming.is-active { opacity: 1; }
.servium-canvas__component, .servium-canvas__material, .servium-canvas__layer {
    position: absolute; inset: 0; width: 100% !important; height: 100%; margin: 0; padding: 0; border: 0;
}
.servium-canvas__component { isolation: isolate; }
.servium-canvas__material { mask-size: 100% 100%; -webkit-mask-size: 100% 100%; mask-repeat: no-repeat; -webkit-mask-repeat: no-repeat; mask-mode: alpha; transition: background-color var(--servium-canvas-transition-duration, 220ms) ease; }
.servium-canvas img.servium-canvas__layer { display: block; max-width: none; object-fit: fill; border-radius: 0; box-shadow: none; }
.servium-canvas__texture, .servium-canvas__shadow { mix-blend-mode: multiply; }
.servium-canvas__highlight { mix-blend-mode: screen; }
.servium-canvas__status { margin: 0; font-size: .9rem; }
.servium-canvas__status:empty { display: none; }
@media (prefers-reduced-motion: reduce) {
    .servium-canvas__transition-outgoing, .servium-canvas__transition-incoming { transition: none; }
}
@media (max-width: 760px) {
    .serviumwp-builder.serviumwp-builder--canvas { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
    body .serviumwp-builder.serviumwp-builder--canvas > .servium-canvas {position: static;height: auto !important;top: 73px !important;background: transparent !important;}
    body .servium-canvas__stage {max-width: 32rem;margin-inline: auto;border-bottom-left-radius: 10px !important;border-bottom-right-radius: 10px !important;}
}