/* Centrowanie wrappera niezależnie od motywu */
.cw-board-wrap{
  display:inline-flex;                 /* było: block */
  align-items:center;
  justify-content:center;
  margin-left:auto!important;
  margin-right:auto!important;
  float:none!important;
  align-self:center!important;         /* gdy rodzic jest flex/grid */
}

/* Gdy motyw wymusza justyfikację w prawo w mobilu – reset */
html.is-mobile .cw-container,
html.is-mobile .cw-app{
  display:flex;
  justify-content:center!important;
  text-align:initial!important;
  padding-left:0; padding-right:0;
}

/* MOBILE ONLY */
html.is-mobile .cw-board-wrap{
  width: min(calc(100vw - 2*var(--cw-pad)), calc(var(--vh) - 220px), var(--cw-board-max));
  aspect-ratio: 1 / 1;
}
@media (max-width:768px){
  html.is-mobile .cw-board-wrap{
    width: min(calc(100vw - 2*var(--cw-pad)), calc(var(--vh) - 280px), var(--cw-board-max));
  }
}

/* centrowanie i bezpieczne strefy */
.cw-app{
  padding: env(safe-area-inset-top) env(safe-area-inset-right)
           env(safe-area-inset-bottom) env(safe-area-inset-left);
}
html.is-mobile .cw-board-wrap{ margin-inline:auto; }
.cw-app { position: relative; } /* dla wariantu 'floating' */

/* DESKTOP: reset kwadratu i sztucznej wysokości (anti-gap) */
@media (min-width:901px){
  .cw-board-wrap{
    aspect-ratio: auto !important;
    width: fit-content !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }
  /* wyłącz potencjalne hacki ::before/::after (padding-bottom:100%) */
  .cw-board-wrap::before,
  .cw-board-wrap::after{
    content:none !important;
    display:none !important;
    height:0 !important;
    padding:0 !important;
  }
}

/* Fullscreen przycisk */
button.cw-fullscreen-toggle{
  display: inline-block !important;
  position: absolute;
  left: 20px;   /* JS i tak nadpisze wg PREFS */
  top:  20px;
  z-index: 10000; /* ponad planszą */
}
