/* R201: friendly error toasts + iPad / touch layer. Every rule sits behind html.r201-* (set by r201.js) or .r201-* classes
 * that only r201.js creates, so the kill switch (public/brand/r201/flags.json {"all":0}) returns the page to exactly how it was. */

/* ── errors: what / why / fix + one action, inside the existing toast ── */
.toast.r201-toast .toast-msg { display: block; line-height: 1.45; }
.toast.r201-toast .r201-w { font-weight: 700; }
.toast.r201-toast .r201-y { opacity: .86; }
.toast.r201-toast .r201-f { display: block; margin-top: 4px; opacity: .96; }
.toast.r201-toast .r201-act {
  display: flex; width: fit-content; align-items: center; justify-content: center; margin-top: 10px;
  min-height: 36px; padding: 0 14px; border-radius: 10px; border: 1px solid currentColor;
  background: transparent; color: inherit; font: inherit; font-weight: 700; font-size: 13px; cursor: pointer;
}
.toast.r201-toast .r201-act:hover { background: rgba(255, 255, 255, .08); }
.toast.r201-toast .r201-act:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
html.r201-touch .toast.r201-toast .r201-act { min-height: 44px; padding: 0 18px; }
html.r201-touch .toast .toast-close { min-width: 44px !important; min-height: 44px !important; }

/* ── tablet: 44 px touch targets (Apple HIG) ── */
html.r201-ipad .sidebar .nav-item { min-height: 44px !important; }
html.r201-ipad :is(.btn, .sl-btn, .r187-btn, .r86-btn, .r93-btn, .stb-btn, .sb-row button):not(.r92-hit):not(.r201-skip) { min-height: 44px !important; }
html.r201-ipad #content select:not([multiple]), html.r201-ipad .modal select:not([multiple]) { min-height: 44px !important; }
html.r201-ipad #content .muted > a, html.r201-ipad #content a.muted { display: inline-flex; align-items: center; min-height: 44px !important; }
html.r201-ipad .r181-ob { min-width: 44px !important; }
html.r201-ipad .r181-help, html.r201-ipad .r157-b { min-width: 44px !important; min-height: 44px !important; }
html.r201-ipad .r6-has-pill .nav-item, html.r201-ipad .nav .nav-item { touch-action: manipulation; }
html.r201-ipad button, html.r201-ipad [role=button], html.r201-ipad .nav-item { -webkit-tap-highlight-color: rgba(124, 92, 255, .18); touch-action: manipulation; }
/* sliders: a native slider gets a 44 px tall touch strip (the drawn track stays thin); a custom thin one gets padding */
html.r201-ipad input[type=range].r201-rng { height: 44px; min-height: 44px !important; touch-action: none; }
html.r201-ipad input[type=range].r201-rngc { box-sizing: content-box; padding-block: var(--r201-pad, 14px); background-clip: content-box; touch-action: none; }
html.r201-ipad .modal .modal-footer .btn, html.r201-ipad #app-dialog button { min-height: 44px !important; min-width: 88px !important; }

/* ── tablet studio: Preview and Program side by side whenever there is room for two usable monitors ── */
@media (max-width: 1299px) {
  html.r201-ipad .live-studio { grid-template-columns: minmax(0, 1fr) !important; }
}
html.r201-ipad .live-video-area { container-type: inline-size; container-name: r201mon; }
@container r201mon (min-width: 640px) {
  html.r201-ipad #studio-monitor-row, html.r201-ipad #podcast-monitor-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
  /* the take / cut bar sits under BOTH monitors (on a narrow screen it is placed between them) */
  html.r201-ipad #studio-monitor-row > .r157-bar, html.r201-ipad #podcast-monitor-row > .r157-bar { order: 9 !important; grid-column: 1 / -1 !important; }
}
/* the take / cut bar: tap targets, no accidental text selection while switching fast */
html.r201-ipad .r157-bar { -webkit-user-select: none; user-select: none; }
html.r201-ipad .r157-bar button { min-height: 44px !important; }
html.r201-ipad #studio-cam-grid > *, html.r201-ipad #live-media-strip > *, html.r201-ipad #live-media-strip-main > *, html.r201-ipad #podcast-media-strip > * { touch-action: manipulation; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
html.r201-ipad #studio-preview-pane, html.r201-ipad #live-preview, html.r201-ipad #podcast-preview-wrap { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }