/* v27 – čitelnější kostka, odehraný čas, větší tresty a rozbalovací panel */
.display .boardCenter{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  gap:.55vh;
  padding-bottom:1vh!important;
}

.display .boardCenter #bPeriod{
  margin:0!important;
  padding:.42vh 1.05vw!important;
  font-size:1.72vw!important;
  line-height:1.05;
}

.display #bElapsed{
  min-width:13.5vw;
  height:4.8vh;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.55vw;
  padding:.2vh .8vw;
  border:3px solid #baffd7;
  border-radius:.75vw;
  background:linear-gradient(180deg,#16a763,#087944);
  box-shadow:0 5px 14px #0008,inset 0 0 0 2px #48d991;
  color:#fff;
  white-space:nowrap;
}

.display #bElapsed small{
  font-size:.72vw;
  font-weight:900;
  letter-spacing:.08em;
}

.display #bElapsed strong{
  font:900 2.05vw/1 Arial Black,Arial,sans-serif;
  font-variant-numeric:tabular-nums;
}

.display .boardCenter #bClock{
  width:17.5vw!important;
  height:8.2vh!important;
  margin:0!important;
  background:linear-gradient(180deg,#252a31,#050608)!important;
  border-color:#f4f6f8!important;
  box-shadow:0 6px 16px #000b,inset 0 0 0 2px #525a64!important;
  color:#fff!important;
  font-size:5vw!important;
}

.display #scoreStrip:after{
  top:2.2vh!important;
  height:18vh!important;
  max-height:18vh!important;
}

.display .boardPenalties{
  min-height:9.2vh!important;
  gap:.85vw!important;
}

.display .boardPenalties span{
  min-height:7.2vh!important;
  padding:.65vh 1.15vw!important;
  border-width:4px!important;
  border-radius:.8vw!important;
  font-size:2.15vw!important;
  line-height:1!important;
  gap:.9vw!important;
}

.display .boardPenalties span b{
  font-size:1.9vw!important;
}

.clockPanel .elapsedBox{
  order:initial;
  margin:10px auto 8px;
}

.clockPanel #clock{
  margin:10px 0 18px;
}

.sidebarToggle{
  margin-bottom:8px;
  border:1px solid #ffffff24!important;
  background:#ffffff0d!important;
  color:#fff!important;
}

body.sidebarCollapsed .layout{grid-template-columns:72px 1fr}
body.sidebarCollapsed aside{padding-left:8px;padding-right:8px}
body.sidebarCollapsed aside button{padding-left:0;padding-right:0;text-align:center;font-size:20px}
body.sidebarCollapsed aside button span{display:none}
body.sidebarCollapsed .directorPlayer{left:72px}

#directorFolderLoop{
  margin-left:auto;
  border-color:#45cf8c!important;
  background:linear-gradient(135deg,#168a58,#0d6d43)!important;
  color:#fff!important;
  white-space:nowrap;
}

@media(max-width:950px){
  body.sidebarCollapsed .layout{grid-template-columns:72px 1fr}
  #directorFolderLoop{width:100%;margin-left:0}
}

@media(max-width:620px){
  .sidebarToggle{display:none}
  body.sidebarCollapsed .layout{display:block}
  body.sidebarCollapsed .directorPlayer{left:0}
}
