.et-vb-modal--variable-generator .et-vb-modal-body{padding:0}.et-vb-variable-generator{display:grid;grid-template-columns:320px 1fr;gap:0;background:var(--app-background)}.et-vb-variable-generator--sidebar-hidden{grid-template-columns:1fr}.et-vb-variable-generator-sidebar{border-right:1px solid var(--light-gray);padding:16px;overflow:auto;display:flex;flex-direction:column}.et-vb-variable-generator-sidebar-section-divider{border-top:1px solid var(--light-gray);margin:8px -16px 16px}.et-vb-variable-generator-intro{margin-bottom:16px;line-height:17px}.et-vb-variable-generator-inline-grid{display:flex;flex-direction:column;gap:8px}.et-vb-variable-generator-breakpoint{margin-bottom:16px}.et-vb-variable-generator-color-picker-field{width:100%}.et-vb-variable-generator-results{padding:16px;display:flex;flex-direction:column;gap:16px;overflow:auto}.et-vb-variable-generator-results-primary{background:var(--app-background);border:1px solid var(--light-gray);border-radius:3px;padding:16px;overflow-x:scroll}.et-vb-variable-generator-results-primary::-webkit-scrollbar{width:12px;cursor:initial;background:var(--app-background)}.et-vb-variable-generator-results-primary::-webkit-scrollbar-thumb{background:var(--dark-gray) !important;border-radius:12px;border:4px solid var(--app-background)}.et-vb-variable-generator-results-primary::-webkit-scrollbar-thumb:hover{background:var(--app-color) !important}.et-vb-variable-generator-results-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:16px}.et-vb-variable-generator-results-actions>div{display:flex;gap:8px;align-items:center}.et-vb-variable-generator-add-remove-row{display:flex;gap:8px;flex-wrap:wrap;align-self:flex-start}.et-vb-variable-generator-table{display:flex;flex-direction:column;gap:1rem}.et-vb-variable-generator-table.et-vb-variable-generator-table--cols-1 .et-vb-variable-generator-row{grid-template-columns:80px repeat(1, minmax(120px, 1fr))}.et-vb-variable-generator-table.et-vb-variable-generator-table--cols-2 .et-vb-variable-generator-row{grid-template-columns:80px repeat(2, minmax(120px, 1fr))}.et-vb-variable-generator-table.et-vb-variable-generator-table--cols-3 .et-vb-variable-generator-row{grid-template-columns:80px repeat(3, minmax(120px, 1fr))}.et-vb-variable-generator-table.et-vb-variable-generator-table--cols-4 .et-vb-variable-generator-row{grid-template-columns:80px repeat(4, minmax(120px, 1fr))}.et-vb-variable-generator-table.et-vb-variable-generator-table--cols-5 .et-vb-variable-generator-row{grid-template-columns:80px repeat(5, minmax(120px, 1fr))}.et-vb-variable-generator-table.et-vb-variable-generator-table--cols-6 .et-vb-variable-generator-row{grid-template-columns:80px repeat(6, minmax(120px, 1fr))}.et-vb-variable-generator-table.et-vb-variable-generator-table--cols-7 .et-vb-variable-generator-row{grid-template-columns:80px repeat(7, minmax(120px, 1fr))}.et-vb-variable-generator-row{display:grid;grid-template-columns:120px repeat(7, minmax(0, 1fr));gap:1.25rem 1.5rem;align-items:baseline;color:var(--dark-gray);white-space:nowrap}.et-vb-variable-generator-row-wrap{display:flex;flex-direction:column;gap:16px}.et-vb-variable-generator-row--head{color:var(--medium-gray);border-bottom:1px solid var(--light-gray);padding-bottom:8px}.et-vb-variable-generator-var{display:flex;align-items:center}.et-vb-variable-generator-var span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.et-vb-variable-generator-value{display:grid;grid-template-columns:3.5rem 1fr;align-items:baseline;gap:.5rem;min-width:0;color:var(--medium-gray)}.et-vb-variable-generator-value>span{min-width:0;white-space:nowrap}.et-vb-variable-generator-value .et-vb-variable-generator-preview{min-width:0}.et-vb-variable-generator-preview{min-height:1.5em;line-height:1.5em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.et-vb-variable-generator-preview--text{border:none;color:var(--dark-gray);font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif;font-weight:500}.et-vb-variable-generator-preview--box,.et-vb-variable-generator-preview--gap,.et-vb-variable-generator-preview--radius,.et-vb-variable-generator-preview--border,.et-vb-variable-generator-preview--width{width:100%;border:1px solid var(--app-color);border-radius:var(--border-radius);box-sizing:border-box;display:flex;flex-direction:row;align-items:stretch;overflow:hidden;position:relative;border-radius:3px}.et-vb-variable-generator-preview--box,.et-vb-variable-generator-preview--gap{background-color:color-mix(in srgb, var(--app-color) 18%, transparent)}.et-vb-variable-generator-preview--box>span,.et-vb-variable-generator-preview--gap>span{flex:1 1 0;min-width:0;height:2.5rem;border-radius:3px;position:relative;z-index:1;background-color:var(--app-background);border:1px solid color-mix(in srgb, var(--app-color) 50%, transparent)}.et-vb-variable-generator-preview--radius>span{height:6em}.et-vb-variable-generator-preview--border{border-radius:0}.et-vb-variable-generator-preview--border>span{height:6em}.et-vb-variable-generator-preview--width{align-items:center;padding:.375rem}.et-vb-variable-generator-preview--width>span{height:14px;max-width:100%;background:color-mix(in srgb, var(--app-color) 28%, transparent);border:1px solid color-mix(in srgb, var(--app-color) 50%, transparent)}.et-vb-variable-generator-css{margin:0;padding:8px 12px;color:var(--medium-gray);background:var(--dark-black);font-family:"SF Mono","Monaco","Inconsolata","Fira Code",monospace;white-space:pre-wrap;border-radius:3px}.et-vb-variable-generator-fluid-preview{padding-top:10px;display:flex;flex-direction:column;gap:8px}.et-vb-variable-generator-fluid-preview-root{background:var(--app-background);min-height:0}.et-vb-variable-generator-fluid-preview-frame,.et-vb-variable-generator-fluid-preview-iframe{width:100%;overflow:hidden;pointer-events:none}.et-vb-variable-generator-fluid-preview h3{font-size:12px}.et-vb-variable-generator-fluid-row{display:flex;flex-direction:column;gap:.2rem;min-width:0}.et-vb-variable-generator-fluid-row span{color:var(--medium-gray);font-family:ui-monospace,"SF Mono","Cascadia Code",Monaco,Consolas,monospace;font-size:12px}.et-vb-variable-generator-color-palette{display:flex;flex-direction:column;gap:16px}.et-vb-variable-generator-color-palette-group h4{margin:0 0 8px;padding:0;font-size:12px;color:var(--dark-gray)}.et-vb-variable-generator-color-palette-grid{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));gap:16px}.et-vb-variable-generator-color-palette-swatch{border-radius:3px;display:flex;flex-direction:column;gap:8px}.et-vb-variable-generator-color-palette-swatch>span{color:var(--medium-gray);font-size:12px;font-family:ui-monospace,"SF Mono","Cascadia Code",Monaco,Consolas,monospace}.et-vb-variable-generator-color-palette-chip{height:48px;border-radius:3px;background:var(--vg-palette-color)}.et-vb-variable-generator-color-palette-chip--checkerboard{background:linear-gradient(var(--vg-palette-color), var(--vg-palette-color)),repeating-conic-gradient(var(--light-gray) 0% 25%, var(--app-background) 0% 50%) 50%/6px 6px}.et-vb-variable-generator-color-style-guide{padding-top:10px;display:flex;flex-direction:column;gap:8px}.et-vb-variable-generator-color-style-guide h3{margin:0;font-size:12px;color:var(--dark-gray)}.et-vb-variable-generator-color-style-guide-grid{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));gap:16px}.et-vb-variable-generator-color-style-guide-card{border-radius:3px;padding:12px;min-height:100px;display:flex;flex-direction:column;justify-content:space-between}.et-vb-variable-generator-color-style-guide-card>strong{font-size:40px;line-height:1;font-weight:600}.et-vb-variable-generator-color-style-guide-card>span{font-size:11px;line-height:1.3;font-weight:500}.et-vb-variable-generator-color-style-guide-card--disabled{opacity:.45;filter:grayscale(100%)}.et-vb-variable-generator-color-style-guide-card--primary-light-on-primary{background-color:var(--vg-style-guide-primary-bg);color:var(--vg-style-guide-primary-light)}.et-vb-variable-generator-color-style-guide-card--secondary-light-on-secondary{background-color:var(--vg-style-guide-secondary-bg);color:var(--vg-style-guide-secondary-light)}.et-vb-variable-generator-color-style-guide-card--primary-dark-on-primary-light{background-color:var(--vg-style-guide-primary-light);color:var(--vg-style-guide-primary-dark)}.et-vb-variable-generator-color-style-guide-card--secondary-dark-on-secondary-light{background-color:var(--vg-style-guide-secondary-light);color:var(--vg-style-guide-secondary-dark)}.et-vb-variable-generator-color-style-guide-card--primary-on-primary-dark{background-color:var(--vg-style-guide-primary-dark);color:var(--vg-style-guide-primary-bg)}.et-vb-variable-generator-color-style-guide-card--secondary-on-secondary-dark{background-color:var(--vg-style-guide-secondary-dark);color:var(--vg-style-guide-secondary-bg)}.et-vb-variable-generator-color-style-guide-card--primary-dark-on-white{background-color:#fff;color:var(--vg-style-guide-primary-dark);border:1px solid var(--vg-style-guide-primary-dark)}.et-vb-variable-generator-color-style-guide-card--secondary-dark-on-white{background-color:#fff;color:var(--vg-style-guide-secondary-dark);border:1px solid var(--vg-style-guide-secondary-dark)}.et-vb-variable-generator-color-style-guide-card--primary-shade-on-primary-tone{background-color:var(--vg-style-guide-primary-tone);color:var(--vg-style-guide-primary-dark)}.et-vb-variable-generator-color-style-guide-card--secondary-shade-on-secondary-tone{background-color:var(--vg-style-guide-secondary-tone);color:var(--vg-style-guide-secondary-dark)}.et-vb-variable-generator-color-style-guide-card--tertiary-tint-on-tertiary{background-color:var(--vg-style-guide-tertiary-bg);color:var(--vg-style-guide-tertiary-light)}.et-vb-variable-generator-color-style-guide-card--tertiary-shade-on-tertiary-tint{background-color:var(--vg-style-guide-tertiary-light);color:var(--vg-style-guide-tertiary-dark)}.et-vb-variable-generator-color-style-guide-card--tertiary-shade-on-tertiary-tone{background-color:var(--vg-style-guide-tertiary-tone);color:var(--vg-style-guide-tertiary-dark)}.et-vb-variable-generator-color-style-guide-card--tertiary-on-tertiary-shade{background-color:var(--vg-style-guide-tertiary-dark);color:var(--vg-style-guide-tertiary-bg)}