/* Fridge display (Samsung Family Hub 2018, 1080 × 1920 portrait, old Tizen browser).
   Everything is fully opaque – the browser draws see-through layers with fewer colours. */
@font-face {
  font-family: 'IBM Plex Sans';
  src: url('/assets/fonts/plex-sans-600.woff2') format('woff2');
  font-weight: 600;
}
html,
body {
  margin: 0;
  height: 100%;
  overflow: hidden;
  background: #000;
  color: #f0c46a;
  font-family: 'IBM Plex Sans', 'Segoe UI', sans-serif;
  -webkit-user-select: none;
  user-select: none;
}
#hdr {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 7vh;
  background: #000;
}
#logo {
  height: 5vh;
  width: auto;
  display: block;
  margin: 0.7vh auto 0;
}
#stage {
  position: absolute;
  top: 7vh;
  left: 0;
  right: 0;
  bottom: 14vh; /* set from KIOSK_BOTTOM_INSET */
  background: #000;
}
#slide {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.pic {
  position: absolute;
  overflow: hidden;
  background: #111;
  border-radius: 0.8vh;
}
.pic canvas,
.pic img {
  position: absolute;
  left: 0;
  top: 0;
  display: block;
}
/* Chips: black box, orange text – the same look everywhere */
.chip {
  position: absolute;
  background: #000;
  color: #f0c46a;
  font-weight: 600;
  line-height: 1.2;
  padding: 0.3em 0.75em;
  border: 1.5px solid #f0c46a;
  border-radius: 999px;
  white-space: nowrap;
}
.bar {
  position: absolute;
  height: 0.5em;
  border: 1.5px solid #f0c46a;
  border-radius: 0.4em;
  background: #000;
  overflow: hidden;
}
.bar span {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background: #f0c46a;
}
.paused-card .bar span {
  background: #8a8f9c;
}
#empty {
  position: absolute;
  left: 0;
  right: 0;
  top: 35%;
  text-align: center;
  font-size: 3vh;
  color: #98a1b8;
  display: none;
}

/* Public copy (port 8487): same dark grey as the newsletter. The fridge keeps black. */
body.grey,
body.grey #hdr,
body.grey #stage {
  background: #282a2d;
}
body.grey #hdr {
  height: 10vh;
}
body.grey #logo {
  height: 7.4vh;
  margin-top: 1.2vh;
}
body.grey #stage {
  top: 10vh;
}