/* responsive-shell-sidebar pattern — §157 (v0.5.3) per FEEDBACK-06 §3 */

/* Breakpoint: 900px. Below → drawer mode; above → inline mode. */
.wide-only { display: contents; }
.narrow-only { display: none; }

@media (max-width: 900px) {
  .wide-only { display: none; }
  .narrow-only { display: block; }
}

/* Pattern shell — replace with your app's grid */
.shell {
  display: grid;
  grid-template-columns: 240px 1fr 320px;
  gap: var(--a-space-3);
  height: 100vh;
  padding: var(--a-space-3);
  box-sizing: border-box;
}

@media (max-width: 900px) {
  .shell {
    grid-template-columns: 1fr;
  }
}

.toolbar {
  display: none;
}

@media (max-width: 900px) {
  .toolbar {
    display: flex;
    gap: var(--a-space-2);
    padding-bottom: var(--a-space-2);
    border-bottom: 1px solid var(--md-sys-color-neutral-outline);
  }
}
