/* Two fixed separation settings leave the model unobstructed. */
.slice-control {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 137px;
  height: 58px;
  padding: 5px;
  bottom: 68px;
  left: 50%;
  border: 1px solid #d8e3d7;
  border-radius: 16px;
  background: #fbfdf8ec;
  box-shadow: 0 5px 24px #254b3010;
  backdrop-filter: blur(12px);
  transition: bottom .8s cubic-bezier(.22,.68,.26,1), background .3s ease;
}

.separation-option {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  flex: 1;
  min-width: 0;
  height: 46px;
  padding: 4px;
  border: 1px solid transparent;
  border-radius: 11px;
  color: #819486;
  background: transparent;
  cursor: pointer;
  transition: color .18s ease, background .18s ease, border-color .18s ease;
}

.separation-option .icon { width: 18px; height: 18px; }
.separation-label { font-size: 9px; line-height: 1.15; letter-spacing: .3px; }
.separation-option:hover { color: #236f62; background: #edf3e9; }
.separation-option[aria-pressed="true"] { background: #e2eee4; color: #1e786c; border-color: #c1d9ca; }
.separation-option:focus-visible { outline: 2px solid #398a79; outline-offset: 2px; }

/* The floor labels and two settings remain available during presentation. */
.app-header,
.viewport-heading,
.viewport-topbar,
.viewport-corner,
.navigation-hint,
.viewport-status {
  transition: opacity .8s ease, transform .8s cubic-bezier(.22,.68,.26,1), visibility 0s;
}

body.presentation-mode .workspace { inset: 0; }
body.presentation-mode .app-header,
body.presentation-mode .viewport-heading,
body.presentation-mode .viewport-topbar {
  opacity: 0;
  transform: translateY(-24px);
  visibility: hidden;
  pointer-events: none;
  transition-delay: 0s, 0s, .8s;
}

body.presentation-mode .app-header { transform: translateY(-100%); }
body.presentation-mode .viewport-corner,
body.presentation-mode .navigation-hint,
body.presentation-mode .viewport-status {
  opacity: 0;
  transform: translateY(20px);
  visibility: hidden;
  pointer-events: none;
  transition-delay: 0s, 0s, .8s;
}

body.presentation-mode .slice-control { bottom: 22px; background: #fbfdf8c9; }

@media (max-width: 600px) {
  .slice-control { width: 129px; height: 55px; bottom: 67px; padding: 4px; gap: 4px; left: 50%; }
  .separation-option { height: 45px; }
  body.presentation-mode .slice-control { bottom: 19px; }
}

/* Keep the explicitly requested presentation entrance visible. */
@media (prefers-reduced-motion: reduce) {
  .app-header, .viewport-heading, .viewport-topbar, .viewport-corner,
  .navigation-hint, .viewport-status { transition-duration: .8s, .8s, 0s !important; }
  body.presentation-mode .app-header,
  body.presentation-mode .viewport-heading,
  body.presentation-mode .viewport-topbar,
  body.presentation-mode .viewport-corner,
  body.presentation-mode .navigation-hint,
  body.presentation-mode .viewport-status { transition-delay: 0s, 0s, .8s; }
}