/* Line 1928 — Studio Expression Lab. Phone first (375 px), two columns from 900 px. */
.expression-lab { max-width: 1120px; margin: 0 auto; padding: 16px; color: #1f2430; }
.expression-lab__nav a { font-size: 14px; }
.expression-lab__title { font-size: 1.5rem; margin: 12px 0 8px; }
.expression-lab__lead { font-size: 1rem; line-height: 1.5; margin: 0 0 8px; }
.expression-lab__source { font-size: 13px; color: #5b6275; margin: 0 0 16px; }
.expression-lab__h2 { font-size: 1.1rem; margin: 0 0 10px; }
.expression-lab__stage-wrap, .expression-lab__controls, .expression-lab__save, .expression-lab__empty {
  background: #fff; border: 1px solid #e3e6ee; border-radius: 12px; padding: 14px; margin: 0 0 16px;
}
.expression-lab__states, .expression-lab__features { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.expression-lab__states button, .expression-lab__features button, .expression-lab__secondary {
  min-height: 44px; padding: 8px 14px; border-radius: 999px; border: 1px solid #c9cedb; background: #f6f7fb; color: #1f2430; font-size: 15px;
}
.expression-lab__states button[aria-pressed="true"], .expression-lab__features button[aria-pressed="true"] {
  background: #1f3a8a; border-color: #1f3a8a; color: #fff;
}
.expression-lab__stage { position: relative; width: 100%; max-width: 480px; margin: 0 auto; aspect-ratio: 1 / 1;
  background: #f3f4f8; border-radius: 10px; overflow: hidden; cursor: crosshair; }
.expression-lab__stage canvas { position: absolute; inset: 0; }
.expression-lab__boxes-layer { position: absolute; inset: 0; pointer-events: none; }
.expression-lab__box { position: absolute; border: 2px dashed rgba(31, 58, 138, .55); border-radius: 6px; }
.expression-lab__box[data-selected] { border-style: solid; border-color: #d9480f; }
.expression-lab__state-note { font-size: 14px; color: #3d4455; margin: 10px 0 0; min-height: 2.8em; }
.expression-lab__controls label { display: block; font-size: 14px; margin: 10px 0 4px; }
.expression-lab__controls input[type="range"] { width: 100%; min-height: 32px; }
.expression-lab__mode { border: 0; padding: 0; margin: 14px 0 8px; }
.expression-lab__mode legend { font-size: 14px; font-weight: 600; margin-bottom: 4px; }
.expression-lab__mode label { display: flex; gap: 8px; align-items: flex-start; line-height: 1.4; }
.expression-lab__boxes { display: flex !important; gap: 8px; align-items: center; }
.expression-lab__primary { display: inline-block; min-height: 44px; padding: 10px 18px; border-radius: 10px; border: 0;
  background: #1f3a8a; color: #fff; font-size: 16px; text-decoration: none; }
.expression-lab__primary:disabled { opacity: .5; }
.expression-lab__status { font-size: 14px; margin: 10px 0; min-height: 1.4em; }
.expression-lab__status[data-error] { color: #b42318; }
.expression-lab__facts { display: grid; grid-template-columns: max-content 1fr; gap: 4px 12px; font-size: 13px; overflow-wrap: anywhere; }
.expression-lab__facts dt { font-weight: 600; }
.expression-lab__consent { display: flex; gap: 8px; align-items: flex-start; margin: 12px 0; font-size: 14px; line-height: 1.4; }
@media (min-width: 900px) {
  .expression-lab { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); column-gap: 20px; align-items: start; }
  .expression-lab__nav, .expression-lab__title, .expression-lab__lead, .expression-lab__source, .expression-lab__empty { grid-column: 1 / -1; }
  .expression-lab__stage-wrap { grid-row: span 2; }
  .expression-lab__title { font-size: 1.8rem; }
}
