.wp-block-cpb-coloring-page { box-sizing:border-box; margin:0 auto; }
.cpb-controls{ display:flex; flex-direction:column; align-items:center; justify-content:center; margin-bottom:12px; }
.cpb-row{ display:flex; align-items:center; justify-content:center; gap:12px; padding:8px; flex-wrap:wrap; max-width:1200px; margin:0 auto; }
.cpb-row-top{ background: rgba(251,247,239,0.98); border-radius:12px; box-shadow: 0 6px 18px rgba(0,0,0,0.08); padding:12px; width:100%; box-sizing:border-box; }
.cpb-row-bottom{ background: rgba(251,247,239,0.98); border-radius:12px; box-shadow: 0 6px 18px rgba(0,0,0,0.08); padding:10px; margin-top:8px; width:100%; box-sizing:border-box; }
.cpb-wrapper{ width:100%; max-width:100%; position:relative; background:#fff; overflow:hidden; }
.cpb-svg-container{ width:100%; display:block; }
.cpb-svg-container svg{ width:100%; height:auto; display:block; pointer-events:none; user-select:none; }
.cpb-canvas{ position:absolute; left:0; top:0; display:block; }
.cpb-preset{ width:36px; height:36px; border-radius:8px; border:2px solid rgba(0,0,0,0.06); cursor:pointer; }
.cpb-custom{ display:flex; align-items:center; gap:8px; }
.cpb-custom-swatch{ width:36px; height:36px; border-radius:6px; border:2px solid rgba(0,0,0,0.06); background:#000; }
.cpb-color-picker{ width:44px; height:36px; border:none; background:transparent; }
.cpb-brush-label{ display:flex; align-items:center; gap:8px; font-size:14px; color:#333; }
.cpb-brush{ width:160px; }
.cpb-row-bottom button{ padding:8px 12px; border-radius:8px; border:none; background:#fff; cursor:pointer; box-shadow: 0 2px 6px rgba(0,0,0,0.06); }
.cpb-row-bottom button:hover{ transform:translateY(-1px); }
.cpb-preset:focus, .cpb-custom-swatch:focus{ outline:none; box-shadow:0 0 0 3px rgba(0,0,0,0.08); }
.cpb-tooltip{ display:none; position:fixed; z-index:1000; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.4); }
.cpb-tooltip-inner{ background:#fff; margin:6% auto; padding:16px; width:90%; max-width:560px; border-radius:8px; }
.cpb-warning{ padding:1em; background:#fff4e5; border:1px solid #e0b96a; border-radius:6px; color:#6a4b0f; text-align:center; }
/* Wide/full breakout overrides to force theme breakout when selected */
.wp-block-cpb-coloring-page.alignwide, body .wp-block[data-align="wide"].wp-block-cpb-coloring-page, .wp-block[data-align="wide"].wp-block-cpb-coloring-page {
  width: 100% !important;
  max-width: 1200px !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
  box-sizing: border-box !important;
}
.wp-block-cpb-coloring-page.alignfull, body .wp-block[data-align="full"].wp-block-cpb-coloring-page, .wp-block[data-align="full"].wp-block-cpb-coloring-page {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}
@media (max-width:600px){ .cpb-brush{ width:100px; } .cpb-preset{ width:30px; height:30px; } .cpb-custom-swatch{ width:30px; height:30px; } .cpb-row-top{ padding:8px; } .cpb-row-bottom{ padding:6px; } }