/* Tablet toolbar collapse support */
@media (min-width: 821px) and (max-width: 1180px) {
  .tool-rail-toggle {
    display: grid;
    min-height: 42px;
    padding: 4px 2px;
    color: #c89bae;
    background: #ea0a67;
    border: 1px solid #a90f4f;
    border-radius: 9px;
    font-size: 10px;
    line-height: 1.25;
    font-weight: 800;
  }

  .tool-rail-toggle span {
    white-space: normal;
    text-align: center;
  }

  .tool-rail.is-collapsed {
    min-height: 0;
    height: max-content;
    overflow: visible;
  }

  .tool-rail.is-collapsed .tool-button:not(.tool-rail-toggle),
  .tool-rail.is-collapsed .rail-spacer {
    display: none;
  }
}

/* On portrait tablets the rail starts collapsed so it cannot cover the canvas.
   Phones and desktop layouts keep their existing behavior. */
@media (min-width: 600px) and (max-width: 1180px) and (orientation: portrait) and (pointer: coarse) {
  .tool-rail.is-collapsed {
    position: relative;
    bottom: auto;
    min-height: 0;
    height: max-content;
    max-height: 54px;
    overflow: visible;
  }

  .tool-rail.is-collapsed .tool-rail-toggle {
    min-height: 42px;
  }
}