.ru-stage { background: #fff; color: #111; cursor: crosshair; touch-action: none; aspect-ratio: 16 / 9; border-radius: 4px; }
.ru-stage:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.ru-stage.is-full { cursor: crosshair; border-radius: 0; }
.ru-stage .fs-btn { right: 56px; bottom: 50px; }
.ru-read { margin: 10px 0; font-weight: 600; min-height: 1.6em; overflow-wrap: anywhere; }
.ru-sw { margin-top: 10px; }
.ru-status { margin: 0 0 10px; font-size: .92rem; padding: 8px 10px; border-radius: 10px; background: var(--bg); border: 1px solid var(--line); }
.ru-status.ok { border-color: #3a9a5b; }
.ru-status.warn { border-color: #d49a1a; }
.ru-cal .btn { margin-top: 10px; }
.ru-cal .seg { margin-top: 4px; }
.ru-nudge .btn { min-width: 48px; }
.ru-grid { display: grid; grid-template-columns: 1fr 120px; gap: 8px 10px; align-items: center; margin-top: 10px; }
.ru-grid label { font-weight: 600; font-size: .92rem; }
.ru-grid input { width: 100%; box-sizing: border-box; font: inherit; font-size: .95rem; color: var(--ink); background: var(--field); border: 1px solid var(--field-border); border-radius: 10px; padding: 7px 10px; min-height: 40px; }
.ru-reset { font-size: .85rem; min-height: 34px; padding: 4px 12px; }
.panel [hidden], .ru-stage [hidden] { display: none !important; }
.ru-exit { position: absolute; right: 56px; bottom: 50px; z-index: 7; display: none; align-items: center; gap: 4px;
  font: 600 14px/1 system-ui, sans-serif; padding: 10px 14px; min-height: 40px; border-radius: 999px; border: 0; background: rgba(0, 0, 0, .7); color: #fff; cursor: pointer; }
.ru-exit span { font-size: 18px; line-height: 14px; }
.is-full .ru-exit { display: inline-flex; }
.ru-stage.is-full .fs-btn { display: none; }
.ru-warn { position: absolute; left: 60px; right: 60px; top: 60px; z-index: 8; max-width: 520px; margin: 0 auto; padding: 12px 14px;
  background: #fff7e0; color: #2a2100; border: 2px solid #d49a1a; border-radius: 12px; box-shadow: 0 6px 24px rgba(0, 0, 0, .18); font-size: .95rem; cursor: default;
  max-height: calc(100% - 110px); overflow: auto; box-sizing: border-box; }
.ru-warn p { margin: 0 0 8px; }
.ru-warn .btn { min-height: 38px; padding: 6px 14px; font-size: .9rem; background: #fff; color: #16181d; border-color: #858b99; }
.ru-warn .btn.primary { background: #16181d; color: #fff; border-color: #16181d; }
.ru-calbar { position: absolute; left: 52px; bottom: 50px; z-index: 7; display: flex; align-items: center; gap: 6px;
  padding: 6px 8px 6px 14px; border-radius: 999px; background: rgba(20, 22, 28, .88); color: #fff; font: 600 14px/1 system-ui, sans-serif; cursor: default; white-space: nowrap; }
.ru-calbar .btn { min-height: 40px; min-width: 44px; padding: 6px 12px; background: #fff; color: #16181d; border-color: #fff; }
.ru-calbar .btn.primary { background: #2f5bd8; color: #fff; border-color: #2f5bd8; }
@media (max-width: 520px) {
  .ru-stage { aspect-ratio: 4 / 3; }
  .ru-stage .fs-btn span { display: none; }
  .ru-warn { left: 46px; right: 40px; top: 46px; font-size: .82rem; padding: 8px 10px; max-height: calc(100% - 60px); }
  .ru-warn .btn { min-height: 34px; padding: 4px 10px; font-size: .82rem; }
  .ru-warn .btn-row { gap: 6px; }
  .ru-calbar span { display: none; }
}