.wp-block-group.has-global-padding.is-layout-constrained.wp-block-group-is-layout-constrained {
	margin-top:0px !important; margin-block-start: 0rem !important;
}
.has-global-padding {
  padding-right:0px !important;
  padding-left:0px !important; margin-block-start: 0rem !important;
}

#toybox-app-container {
	height: 100vh;
	width: 100%;
	padding: 0px;
	margin: 0px;
	position: fixed;
	left: 0px;
	top: 0px;
    margin-block-start: 0rem !important;
}

 #toybox-app-container { position: relative; width: 100%; height: 100vh !important; min-height:  100vh !important; background: #e5f2ff; 
   overflow: hidden; border-radius: 12px; font-family: sans-serif; }
 
 
 /* ... existing CSS ... */
 .preview-mode #tb-header, .preview-mode #tb-footer { display: none !important; }
 .preview-mode #tb-preview-tools { display: flex; }
 .preview-mode #tb-exit-btn { display: block; }
 .is-playing #tb-preview-tools { display: none !important; }
 
 /* STRICT HIDER FOR VISITORS */
 .hide-ui #tb-header, 
 .hide-ui #tb-footer, 
 .hide-ui #tb-preview-tools, 
 .hide-ui #tb-exit-btn { 
	 display: none !important; 
 }
 
 #toybox-app {
   margin-block-start: 0rem !important;
 }
 /* ... rest of the PHP ... */
 /* Ensure the visitor sees a clean game screen */
 .visitor-locked #toybox-app {
     border-radius: 0;
     position: fixed;
     top: 0; left: 0;
     width: 100vw; height: 100vh;
     z-index: 99999;margin-block-start: 0rem !important;
 }
 
 /* Hide WordPress admin bar for a true game feel if needed */
 .visitor-locked #wpadminbar { display: none !important; }
 :root { --glass: rgba(255, 255, 255, 0.85); --border: rgba(0, 0, 0, 0.1); --accent: #3b82f6; --danger: #ef4444; --paint: #f472b6; --floor: #10b981; }
 
 /* Fullscreen layout for single game pages */
 .single-toybox_game #toybox-app {
     position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
     z-index: 9999; border-radius: 0;     margin-block-start: 0rem !important;
 }
 p {
 display: flex;
 margin-block-start: 0 !important;
 margin-block-end: 0 !important;
 margin-inline-start: 0px;
 margin-inline-end: 0px; 
 }
 
#preview-tools p  .btn{
   margin: 0px 4px;
 }
 #toybox-app { position: relative; width: 100%; height: 100vh; background: #f1f5f9; overflow: hidden; font-family: sans-serif; }
 #tb-viewport { position: absolute; top:0; left:0; width:100%; height:100%; z-index: 1; }
 canvas { display: block; outline: none; }
 .glass { background: #fffde8;  backdrop-filter: blur(11px);
   -webkit-backdrop-filter: blur(11px); /* Safari */ border: 1px solid var(--border); border-radius: 16px; pointer-events: auto; }
 
 /* Build Mode UI */
 #ui-header { position: absolute; bottom: 12px; left: 12px; right: 12px; z-index: 10; display: flex; flex-direction: column; gap: 10px; pointer-events: none; }
 .wrapper { gap:10px; display: flex; justify-content: space-evenly; align-items: center; width: 100%; }
 .controls-group { display: flex; gap: 6px; align-items: center; pointer-events: auto; padding: 6px; }
 .palette-row { display: flex; align-items: center; gap: 8px; width: 100%; padding: 6px 12px; }
 .palette-container { flex: 1; display: flex; align-items: center; gap: 10px; overflow-x: auto; scrollbar-width: none; overflow-y: hidden; }
 
 .btn { height: 42px; min-width: 42px; padding: 0 12px; border-radius: 10px; border: none; background: rgba(0,0,0,0.05); color: #64748b; cursor: pointer; display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 14px; }

 .c-dot { min-width: 32px; height: 32px; border-radius: 50%; border: 2px solid rgba(0,0,0,0.1); cursor: pointer; }
 .c-dot.active { border-color: var(--accent); transform: scale(1); }
 
 /* Preview Mode UI */
 #preview-tools { position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); display: none; gap: 8px; padding: 10px; z-index: 1000; border-radius: 20px; }
 #btn-exit-preview { position: absolute; top: 20px; right: 20px; z-index: 1001; display: none; background: var(--danger); color: white; width: 50px; height: 50px; border-radius: 50%; border: none; cursor: pointer; font-size: 20px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); }
 #btn-exit-preview.active { 
    display: flex !important;  /* Changed from 'none' - but you need this to show it */
    align-items: center;  /* Center vertically */
    justify-content: center;  /* Center horizontally */
 }
 /* UI States */
 .preview-active #preview-tools, .preview-active #btn-exit-preview { display: flex; }
 .preview-active #ui-header, .preview-active #presets-tray { display: none !important; }
 
 /* Visitor lockdown: Hide everything except the game canvas */
 .visitor-locked #preview-tools, .visitor-locked #btn-exit-preview, .visitor-locked #ui-header, .visitor-locked #presets-tray { display: none !important; }
 
 #presets-tray { position: absolute; bottom: 72px; left: 12px; right: 12px; height: auto; z-index: 10; display: flex; gap: 10px; padding: 10px; overflow-x: auto; scrollbar-width: none; align-items: center;  }
 #presets-tray.show {
   display: flex;
 }
 #toybox-app { 
     touch-action: none; 
     overscroll-behavior: none; 
     position: relative; 
     overflow: hidden; 
 }
 #tb-viewport canvas { 
     display: block; 
     touch-action: none; 
     user-select: none; 
     -webkit-tap-highlight-color: transparent; 
 }
 
 #presets-tray {
   display: none;
 }
 #presets-tray.show {
   display: flex;
 }
 

 .visitor-locked.preview-active   #preview-tools, .visitor-locked.preview-active  #ui-header,.visitor-locked.preview-active  #presets-tray {
    opacity: 0;
  }
  
   
  /* CSS */
  .btn {
    padding: 12px 26px;
    border: 0; 
    transition: all 150ms ease-in-out;
  
    border-radius: 8px;
    font-weight: 600;
  text-wrap: nowrap;
    color: #000;
  
    border-radius: 10px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 70.48%, #FFF 93.62%, rgba(255, 255, 255, 0.00) 100%), linear-gradient(180deg, rgba(30, 54, 87, 0.00) 0%, rgba(30, 54, 87, 0.01) 100%), #FAFAFA;
    border: none;
    box-shadow: rgba(0, 0, 0, 0.08) 0 0 0 1px, rgba(0, 0, 0, 0.08) 0 -2px 1px 0 inset, rgba(255, 255, 255, 0.5) 0 2px 1px 0 inset, 0 2px 5px -1px rgba(0, 0, 0, 0.05), 0 1px 3px -1px rgba(0, 0, 0, 0.3);
    text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.12);
  }
  
  .btn:hover {
    background-color: #F5F5F5;
  }
  
  .btn:active, .btn.active {
    background-color: #F1F1F1;
    box-shadow: rgba(0, 0, 0, 0.08) 0 0 0 1px, rgba(0, 0, 0, 0.08) 0 1px 1px 0 inset, rgba(255, 255, 255, 0.1) 0 2px 1px 0 inset, 0 2px 5px -1px rgba(0, 0, 0, 0.05);
  }