:root {
    --start-theme-admin-bar-height: 0px;
    --start-theme-editor-bar-height: 0px;
    --start-theme-chrome-offset: 0px;
    --start-theme-preview-width: 100%;
    --start-editor-context-bar-active-size: 0px;
    --start-editor-ruler-active-size: 0px;
    --start-editor-chrome-stack-size: var(--start-theme-chrome-offset, 0px);
    --start-workspace-layer-active-width: 0px;
    --start-theme-editor-motion: 180ms cubic-bezier(.22, 1, .36, 1);
}

html.start-visual-editor-has-admin-bar,
html.start-theme-contract-has-admin-bar {
    --start-theme-admin-bar-height: 50px;
    --start-theme-chrome-offset: 50px;
}

.start-theme-editor-slot,
[data-start-theme-editor-slot] {
    position: relative;
    z-index: auto;
    display: block;
    width: 100%;
    height: 0;
    min-height: 0;
    margin: 0;
    padding: 0;
    overflow: visible;
    pointer-events: none;
    background: transparent;
}

.start-workspace,
[data-start-workspace] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    width: 100%;
    min-width: 0;
    min-height: 0;
    margin: 0;
    padding: 0;
}

.start-workspace__layer-host,
[data-start-visual-layer-host] {
    display: none;
    width: 0;
    min-width: 0;
    min-height: 0;
}

.start-canvas,
[data-start-canvas] {
    grid-column: 1;
    width: 100%;
    min-width: 0;
    min-height: 0;
    margin: 0;
    padding: 0;
}

.start-canvas-theme,
[data-start-canvas-theme] {
    position: relative;
    container-name: start-canvas-theme;
    container-type: inline-size;
}

[data-start-theme-sticky="header"] {
    --start-theme-sticky-top: var(--start-theme-chrome-offset, 0px);
}

html.start-visual-editor-mode [data-start-workspace] {
    grid-template-columns: var(--start-workspace-layer-active-width, 0px) minmax(0, 1fr);
    transition: grid-template-columns var(--start-theme-editor-motion);
}

html.start-visual-editor-mode [data-start-visual-layer-host] {
    display: block;
    grid-column: 1;
    width: var(--start-workspace-layer-active-width, 0px);
    transition: width var(--start-theme-editor-motion);
}

html.start-visual-editor-mode [data-start-canvas] {
    --start-theme-chrome-offset: var(--start-editor-chrome-stack-size, var(--start-theme-admin-bar-height, 50px));
    grid-column: 2;
    width: min(var(--start-theme-preview-width, 100%), 100%);
    max-width: 100%;
    min-width: 0;
    margin-block: 0;
    margin-inline: auto;
    min-height: calc(100dvh - var(--start-editor-chrome-stack-size, var(--start-theme-chrome-offset, 50px)));
    background: #ffffff;
    box-shadow: var(--start-editor-shell-shadow, 5px 0 35px rgba(15, 23, 42, .11));
    transition: width var(--start-theme-editor-motion), box-shadow var(--start-theme-editor-motion);
}

@media (prefers-reduced-motion: reduce) {
    html.start-visual-editor-mode [data-start-workspace],
    html.start-visual-editor-mode [data-start-visual-layer-host],
    html.start-visual-editor-mode [data-start-canvas] {
        transition: none;
    }
}

/* Canonical Text Element box. Theme supplies typography only; the Element owns box normalization. */
[data-start-visual-object="text"] {
    display: inline-block;
    inline-size: var(--start-visual-text-frame-inline-size, fit-content);
    width: var(--start-visual-text-frame-inline-size, fit-content);
    min-inline-size: 0;
    min-width: 0;
    max-inline-size: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
    overflow: visible;
    vertical-align: top;
}

/* Editor-only adaptation for Themes that use the generic fixed-header placeholder contract. */
html.start-visual-editor-mode .start-site-fixed-placeholder,
html.start-visual-editor-mode .start-site-fixed-placeholder.is-active {
    display: none;
    height: 0;
    min-height: 0;
    max-height: 0;
}

html.start-visual-editor-mode body.start-site-threshold-fixed .start-site-header.start-site-shell-ready.is-start-fixed {
    position: sticky;
    top: var(--start-theme-chrome-offset, 0px);
    left: auto;
    right: auto;
    width: 100%;
}