.bb-cle{font-family:system-ui,-apple-system,Segoe UI,sans-serif;border:1px solid #d8d8d8;padding:14px;background:#fff;color:#222}.bb-cle *{box-sizing:border-box}.bb-cle-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.bb-cle button{border:1px solid #0b5ed7;background:#0d6efd;color:#fff;border-radius:4px;padding:6px 10px;cursor:pointer}.bb-cle button:hover{background:#0b5ed7}.bb-cle-panel{border:1px solid #bfd2f3;background:#f5f9ff;padding:10px;margin-bottom:12px}.bb-cle-panel button{margin:3px}.bb-cle-main{display:grid;grid-template-columns:1fr 1fr;gap:16px}.bb-cle h4{margin:0 0 8px}.bb-cle-canvas,.bb-cle-preview{min-height:220px;border:1px dashed #aaa;padding:10px;background:#fafafa;overflow:auto}.bb-cle-preview{transition:max-width .2s;margin:auto;position:sticky;top:20px;z-index:5;max-height:80vh}.bb-cle-device-desktop{max-width:100%}.bb-cle-device-tablet{max-width:768px}.bb-cle-device-mobile{max-width:390px}.bb-cle-grid{background-image:linear-gradient(to right,rgba(13,110,253,.12) 1px,transparent 1px);background-size:calc(100% / 12) 100%}.bb-cle-row{border:1px solid #9db4d4;background:#f5f9ff;margin:8px 0;padding:8px}.bb-cle-drag-handle{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:4px;background:#0d6efd;color:#fff;cursor:grab;font-weight:700}.bb-cle-drag-handle:active{cursor:grabbing}.bb-cle-row-head,.bb-cle-col-head{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:8px}.bb-cle input,.bb-cle select{min-width:96px;max-width:100%;padding:4px;border:1px solid #bbb;border-radius:3px}.bb-cle-cols{display:grid;gap:8px}.bb-cle-col{min-height:80px;border:1px solid #c9c9c9;background:white;padding:8px}.bb-cle-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:8px 0;font-size:12px}.bb-cle-options label{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.bb-cle-options input[type=checkbox]{min-width:0}.bb-cle-col textarea,.bb-cle-panel textarea{width:100%;min-height:54px;border:1px solid #ccc;border-radius:3px;padding:6px}.bb-cle-content-extra{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.bb-cle-content-extra textarea{grid-column:1/-1}.bb-cle-output{margin-top:14px;display:grid;gap:6px}.bb-cle-output textarea{width:100%;min-height:170px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}.bb-cle-rendered .rg_ly-row,.bb-cle-preview .rg_ly-row{display:flex;flex-wrap:wrap;gap:var(--rg-ly-gap,16px);margin:var(--rg-ly-mg-d,0 0 12px);padding:var(--rg-ly-p-d,0);background-repeat:no-repeat}.bb-cle-rendered .rg_ly-col,.bb-cle-preview .rg_ly-col{padding:var(--rg-ly-p-d,10px);margin:var(--rg-ly-mg-d,0);border:1px solid #ddd;background-repeat:no-repeat;min-height:54px;flex:0 0 var(--rg-ly-d,100%);display:flex;justify-content:var(--rg-ly-ah,start);align-items:var(--rg-ly-av,start)}.bb-cle-rendered .rg_ly-col img,.bb-cle-preview .rg_ly-col img{max-width:100%;height:auto}.bb-cle-rendered .rg_ly-button,.bb-cle-preview .rg_ly-button{display:inline-block;padding:.7em 1.1em;background:#0d6efd;color:#fff;text-decoration:none;border-radius:4px}.bb-cle-preview .rg_ly-row{position:relative;outline:2px dashed var(--rg-ly-marker,rgba(13,110,253,.35));outline-offset:2px}.bb-cle-preview .rg_ly-row:nth-child(3n+1){background-color:rgba(13,110,253,.06)}.bb-cle-preview .rg_ly-row:nth-child(3n+2){background-color:rgba(25,135,84,.07)}.bb-cle-preview .rg_ly-row:nth-child(3n+3){background-color:rgba(255,193,7,.10)}.bb-cle-preview .rg_ly-row:before{content:"Zeile";position:absolute;top:2px;right:4px;font-size:10px;background:#fff;border:1px solid #d8d8d8;border-radius:3px;padding:1px 4px;color:#555}.bb-cle-rendered .rg_ly-repeat,.bb-cle-preview .rg_ly-repeat{display:flex;flex-wrap:wrap;width:100%}.bb-cle-rendered .rg_ly-repeat-item,.bb-cle-preview .rg_ly-repeat-item{box-sizing:border-box;flex:0 0 calc(100% / var(--rg-ly-repeat-d,3));max-width:calc(100% / var(--rg-ly-repeat-d,3));padding:6px}.bb-cle-repeat{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:6px}.bb-cle-box{margin:6px 0}.bb-cle-box summary{cursor:pointer;color:#0d6efd}.bb-cle-rendered .rg_ly-break,.bb-cle-preview .rg_ly-break{flex:0 0 100%;width:100%;height:0;padding:0!important;margin:0!important}.bb-cle-rendered .rg_ly-break-t,.bb-cle-preview .rg_ly-break-t,.bb-cle-rendered .rg_ly-break-m,.bb-cle-preview .rg_ly-break-m{display:none}.bb-cle-rendered .rg_ly-row-grid>.rg_ly-break,.bb-cle-preview .rg_ly-row-grid>.rg_ly-break{grid-column:1/-1}.bb-cle-rendered .rg_ly-hide-desktop,.bb-cle-preview .rg_ly-hide-desktop{display:none!important}.bb-cle-device-tablet .rg_ly-row{gap:var(--rg-ly-gap,16px);margin:var(--rg-ly-mg-t,var(--rg-ly-mg-d,0 0 12px));padding:var(--rg-ly-p-t,var(--rg-ly-p-d,0))}.bb-cle-device-tablet .rg_ly-col{flex-basis:var(--rg-ly-t,var(--rg-ly-d,100%));margin:var(--rg-ly-mg-t,var(--rg-ly-mg-d,0));padding:var(--rg-ly-p-t,var(--rg-ly-p-d,10px))}.bb-cle-device-tablet .rg_ly-hide-desktop{display:flex!important}.bb-cle-device-tablet .rg_ly-hide-tablet{display:none!important}.bb-cle-device-tablet .rg_ly-break-d{display:none}.bb-cle-device-tablet .rg_ly-break-t{display:block}.bb-cle-device-tablet .rg_ly-repeat-item{flex-basis:calc(100% / var(--rg-ly-repeat-t,2));max-width:calc(100% / var(--rg-ly-repeat-t,2))}.bb-cle-device-mobile .rg_ly-row{gap:var(--rg-ly-gap,16px);margin:var(--rg-ly-mg-m,var(--rg-ly-mg-t,var(--rg-ly-mg-d,0 0 10px)));padding:var(--rg-ly-p-m,var(--rg-ly-p-t,var(--rg-ly-p-d,0)))}.bb-cle-device-mobile .rg_ly-col{flex-basis:var(--rg-ly-m,100%);margin:var(--rg-ly-mg-m,var(--rg-ly-mg-t,var(--rg-ly-mg-d,0)));padding:var(--rg-ly-p-m,var(--rg-ly-p-t,var(--rg-ly-p-d,10px)))}.bb-cle-device-mobile .rg_ly-hide-desktop,.bb-cle-device-mobile .rg_ly-hide-tablet{display:flex!important}.bb-cle-device-mobile .rg_ly-hide-mobile{display:none!important}.bb-cle-device-mobile .rg_ly-break-t{display:none}.bb-cle-device-mobile .rg_ly-break-m{display:block}.bb-cle-device-mobile .rg_ly-repeat-item{flex-basis:calc(100% / var(--rg-ly-repeat-m,1));max-width:calc(100% / var(--rg-ly-repeat-m,1))}@media(max-width:900px){.bb-cle-main{grid-template-columns:1fr}.bb-cle-options{grid-template-columns:1fr 1fr}.bb-cle-content-extra{grid-template-columns:1fr}.bb-cle-repeat{grid-template-columns:1fr 1fr}}@media(max-width:768px){.bb-cle-options{grid-template-columns:1fr}.bb-cle-repeat{grid-template-columns:1fr}.bb-cle-rendered .rg_ly-row{gap:var(--rg-ly-gap,16px);margin:var(--rg-ly-mg-m,var(--rg-ly-mg-t,var(--rg-ly-mg-d,0 0 10px)));padding:var(--rg-ly-p-m,var(--rg-ly-p-t,var(--rg-ly-p-d,0)))}.bb-cle-rendered .rg_ly-col{flex-basis:var(--rg-ly-m,100%);margin:var(--rg-ly-mg-m,var(--rg-ly-mg-t,var(--rg-ly-mg-d,0)));padding:var(--rg-ly-p-m,var(--rg-ly-p-t,var(--rg-ly-p-d,10px)))}.bb-cle-rendered .rg_ly-hide-mobile{display:none!important}.bb-cle-rendered .rg_ly-break-d,.bb-cle-rendered .rg_ly-break-t{display:none}.bb-cle-rendered .rg_ly-break-m{display:block}.bb-cle-rendered .rg_ly-repeat-item{flex-basis:calc(100% / var(--rg-ly-repeat-m,1));max-width:calc(100% / var(--rg-ly-repeat-m,1))}}
/* v0.5 additions */
.bb-cle-row.is-selected,.bb-cle-col.is-selected{box-shadow:0 0 0 2px #0d6efd inset}.bb-cle-row:nth-child(4n+1){border-left:6px solid #0d6efd}.bb-cle-row:nth-child(4n+2){border-left:6px solid #198754}.bb-cle-row:nth-child(4n+3){border-left:6px solid #ffc107}.bb-cle-row:nth-child(4n+4){border-left:6px solid #6f42c1}.bb-cle-col{border-top:4px solid var(--bb-cle-marker,#20c997)}.bb-cle-preview .rg_ly-col-grid,.bb-cle-rendered .rg_ly-col-grid{display:grid}.bb-cle-preview .rg_ly-row-grid,.bb-cle-rendered .rg_ly-row-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr))}.bb-cle-preview .rg_ly-equal,.bb-cle-rendered .rg_ly-equal{align-items:stretch}.bb-cle-preview .rg_ly-sticky,.bb-cle-rendered .rg_ly-sticky{position:sticky;top:var(--rg-ly-sticky-top,80px)}.bb-cle-preview .rg_ly-repeat,.bb-cle-rendered .rg_ly-repeat{gap:var(--rg-ly-repeat-gap,0)}.bb-cle-preview .rg_ly-col{outline:1px solid var(--rg-ly-marker,rgba(0,0,0,.15));outline-offset:-1px}.bb-cle-preview .rg_ly-col[draggable]{cursor:grab}.bb-cle-preview .rg_ly-repeat-equal .rg_ly-repeat-item,.bb-cle-rendered .rg_ly-repeat-equal .rg_ly-repeat-item{display:flex;align-items:stretch}.bb-cle-preview .rg_ly-repeat-autofill .rg_ly-repeat,.bb-cle-rendered .rg_ly-repeat-autofill .rg_ly-repeat{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.bb-cle-preview .rg_ly-repeat-masonry .rg_ly-repeat,.bb-cle-rendered .rg_ly-repeat-masonry .rg_ly-repeat{column-count:var(--rg-ly-repeat-d,3);display:block}.bb-cle-preview .rg_ly-repeat-masonry .rg_ly-repeat-item,.bb-cle-rendered .rg_ly-repeat-masonry .rg_ly-repeat-item{break-inside:avoid;max-width:none;width:100%;margin-bottom:var(--rg-ly-repeat-gap,0)}.bb-cle-preview .rg_ly-col:hover,.bb-cle-rendered .rg_ly-col:hover{background-color:var(--rg-ly-hover-bg,inherit);box-shadow:var(--rg-ly-hover-shadow,none);transform:scale(var(--rg-ly-hover-scale,1));transition:.2s}.bb-cle-preview .rg_ly-divider-line,.bb-cle-rendered .rg_ly-divider-line{border-bottom:1px solid currentColor}.bb-cle-preview .rg_ly-divider-slant,.bb-cle-rendered .rg_ly-divider-slant{clip-path:polygon(0 0,100% 0,100% calc(100% - 24px),0 100%)}.bb-cle-preview .rg_ly-divider-zigzag:after,.bb-cle-rendered .rg_ly-divider-zigzag:after{content:"";display:block;height:12px;background:linear-gradient(135deg,currentColor 25%,transparent 25%) 0 0/16px 16px}.bb-cle-preview .rg_ly-divider-wave,.bb-cle-rendered .rg_ly-divider-wave{border-radius:0 0 50% 50%/0 0 8% 8%}@media(max-width:1024px){.bb-cle-device-tablet .rg_ly-repeat-masonry .rg_ly-repeat{column-count:var(--rg-ly-repeat-t,2)}}@media(max-width:768px){.bb-cle-device-mobile .rg_ly-repeat-masonry .rg_ly-repeat{column-count:var(--rg-ly-repeat-m,1)}}

/* v0.7 refinements */
.bb-cle-main > section:nth-child(2){position:sticky;top:20px;align-self:start;z-index:10;max-height:calc(100vh - 40px)}
.bb-cle-preview{position:relative;top:auto;max-height:calc(100vh - 90px)}
.bb-cle-device-toggle{display:flex;align-items:center;gap:8px;grid-column:1/-1;white-space:nowrap;flex-wrap:wrap}
.bb-cle-device-toggle>span{font-weight:600;color:#333}.bb-cle-device-toggle label{display:inline-flex;align-items:center;gap:4px;margin:0}
.bb-cle input[type=color]{min-width:34px;width:38px;height:30px;padding:1px;border:1px solid #bbb;background:#fff;cursor:pointer}
.bb-cle label:has(input[type=color]){gap:5px}
.bb-cle-col{border-top-color:var(--bb-cle-marker,#20c997)}
.bb-cle-preview .rg_ly-col,.bb-cle-rendered .rg_ly-col{border-color:var(--rg-ly-marker,#ddd)}
.bb-cle-preview .rg_ly-col{border-top:4px solid var(--rg-ly-marker,#20c997);outline-color:var(--rg-ly-marker,rgba(0,0,0,.15))}
.bb-cle-preview .rg_ly-row{outline-color:var(--rg-ly-marker,rgba(13,110,253,.35))}
.bb-cle-preview .rg_ly-row-grid,.bb-cle-rendered .rg_ly-row-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr))}
.bb-cle-preview .rg_ly-row-grid>.rg_ly-col,.bb-cle-rendered .rg_ly-row-grid>.rg_ly-col{flex:initial;grid-column:span var(--rg-ly-grid-d,12)}
.bb-cle-device-tablet .rg_ly-row-grid>.rg_ly-col{grid-column:span var(--rg-ly-grid-t,var(--rg-ly-grid-d,6))}
.bb-cle-device-mobile .rg_ly-row-grid>.rg_ly-col{grid-column:span var(--rg-ly-grid-m,12)}
@media(max-width:768px){.bb-cle-rendered .rg_ly-row-grid>.rg_ly-col{grid-column:span var(--rg-ly-grid-m,12)}}

/* Final refinements */
.bb-cle-main{align-items:start;overflow:visible}
.bb-cle-main>section:nth-child(2){position:sticky!important;top:24px;align-self:start;z-index:999;max-height:calc(100vh - 48px);overflow:visible}
.bb-cle-preview{position:relative!important;top:auto!important;max-height:calc(100vh - 105px);overflow:auto}
.bb-cle-col{border-top:4px solid var(--bb-cle-marker,#20c997)!important}
.bb-cle-preview .rg_ly-col{border-top-color:var(--rg-ly-marker,#20c997)!important}
.bb-cle-preview .rg_ly-col,.bb-cle-rendered .rg_ly-col{border-color:var(--rg-ly-marker,#ddd)}

/* v0.8 sticky-preview fix: CSS-sticky bleibt als Fallback, JS setzt bei Bedarf fixed positioning. */
.bb-cle-main{align-items:start!important;overflow:visible!important}
.bb-cle-preview-section{position:sticky!important;top:24px!important;align-self:start!important;z-index:9999!important;overflow:visible!important}
.bb-cle-preview-section.bb-cle-is-fixed{position:fixed!important;top:24px!important;left:var(--bb-cle-fixed-left,auto)!important;width:var(--bb-cle-fixed-width,420px)!important;z-index:99999!important;background:#fff;padding:0 0 10px 0;box-shadow:0 8px 24px rgba(0,0,0,.12)}
.bb-cle-preview-section.bb-cle-is-fixed .bb-cle-preview{max-height:calc(100vh - 95px)!important;overflow:auto!important}
.bb-cle-preview .rg_ly-col{border-top-color:var(--rg-ly-marker,#20c997)!important}
@media(max-width:900px){.bb-cle-preview-section,.bb-cle-preview-section.bb-cle-is-fixed{position:relative!important;top:auto!important;left:auto!important;width:auto!important;box-shadow:none!important}}

/* Final sticky fix: echte Floating-Preview außerhalb aller Beaver-Wrapper. */
.bb-cle-floating-preview{display:none;position:fixed;top:24px;right:24px;width:420px;max-width:calc(100vw - 48px);max-height:calc(100vh - 48px);z-index:2147483000;background:#fff;border:1px solid #d8d8d8;border-radius:6px;box-shadow:0 12px 35px rgba(0,0,0,.22);padding:10px;overflow:hidden}
.bb-cle-floating-preview.is-visible{display:block}
.bb-cle-floating-preview h4{margin:0 0 8px;font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:14px;color:#222}
.bb-cle-floating-preview .bb-cle-preview{max-height:calc(100vh - 92px)!important;overflow:auto!important;margin:0!important;position:relative!important;top:auto!important;background:#fafafa}
@media(max-width:900px){.bb-cle-floating-preview{display:none!important}}

/* v0.9 UI/refactor refinements */
.bb-cle-preview-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.bb-cle-preview-devices{display:inline-flex;gap:6px;align-items:center}
.bb-cle-col{border-top-color:var(--bb-cle-marker,#20c997)!important}
.bb-cle-rendered .rg_ly-row,.bb-cle-preview .rg_ly-row{gap:var(--rg-ly-gap-d,16px)}
.bb-cle-device-tablet .rg_ly-row{gap:var(--rg-ly-gap-t,var(--rg-ly-gap-d,16px))}
.bb-cle-device-mobile .rg_ly-row{gap:var(--rg-ly-gap-m,var(--rg-ly-gap-t,var(--rg-ly-gap-d,16px)))}
.bb-cle-rendered .rg_ly-repeat,.bb-cle-preview .rg_ly-repeat{gap:var(--rg-ly-repeat-gap-d,0)}
.bb-cle-device-tablet .rg_ly-repeat{gap:var(--rg-ly-repeat-gap-t,var(--rg-ly-repeat-gap-d,0))}
.bb-cle-device-mobile .rg_ly-repeat{gap:var(--rg-ly-repeat-gap-m,var(--rg-ly-repeat-gap-t,var(--rg-ly-repeat-gap-d,0)))}
.bb-cle-preview .rg_ly-fill-last>.rg_ly-col,.bb-cle-rendered .rg_ly-fill-last>.rg_ly-col{max-width:100%}
.bb-cle-preview .rg_ly-fill-last>.rg_ly-col:last-child,.bb-cle-rendered .rg_ly-fill-last>.rg_ly-col:last-child{flex-grow:1}
.bb-cle-preview .rg_ly-row-grid.rg_ly-fill-last>.rg_ly-col:last-child,.bb-cle-rendered .rg_ly-row-grid.rg_ly-fill-last>.rg_ly-col:last-child{grid-column-end:-1}
.bb-cle-floating-preview .rg_ly-row{gap:var(--rg-ly-gap-d,16px)}
.bb-cle-floating-preview .bb-cle-device-tablet .rg_ly-row{gap:var(--rg-ly-gap-t,var(--rg-ly-gap-d,16px))}
.bb-cle-floating-preview .bb-cle-device-mobile .rg_ly-row{gap:var(--rg-ly-gap-m,var(--rg-ly-gap-t,var(--rg-ly-gap-d,16px)))}