/* The scene and team panel scroll independently on desktop. */
@media (min-width:701px) {
  main {height:calc(100dvh - 86px);min-height:620px;overflow:hidden}
  .office-main {min-height:0}
  .scene-shell {min-height:280px}
  .right-panel {overflow-y:auto;scrollbar-width:thin;scrollbar-color:#35434e transparent}
  .right-panel > * {flex-shrink:0}
  .person-row {padding:9px 0}
  .person-avatar {height:34px}
  .stats {margin:22px 0}
  .daily-note {margin-top:17px}
  .scene-bottom {padding:12px 16px}
  .scene-hint {display:block;max-width:none;line-height:1.6}
  .scene-hint svg {vertical-align:middle;margin-right:6px}
}
@media (min-width:701px) and (max-width:950px) {
  main {height:calc(100dvh - 70px)}
  .simulation-bar {padding:12px;gap:8px}
}
@media (min-width:701px) and (max-height:760px) {
  .office-main {padding-top:22px}
  .page-heading {margin-bottom:19px}
  h1 {margin-top:9px}
  .main-footer {padding:14px 0}
  .simulation-bar {padding:12px 14px}
}
@media (max-width:700px) {
  .simulation-bar {flex-direction:column;align-items:stretch}
  .sim-controls {flex:none}
  .page-heading {position:relative}
  .page-heading > div {min-width:0;width:100%}
  .demo-badge {position:absolute;top:0;right:0}
  .page-heading .eyebrow {padding-right:30px}
  .sun-mark {display:none}
}
@media (max-width:430px) {
  .sim-controls {min-width:0;width:100%;gap:2px}
  .sim-controls .control-divider {display:none}
  .sim-controls .play-button {min-width:65px;padding:8px}
  .sim-controls select {max-width:96px}
  .sim-controls .speed-button,.sim-controls .icon-btn {width:24px}
}