/* =====================================================================
   전역 운영 UI — 커서 토스트 · 종료 확인창 (scripts/operator.js)

   ⚠ 이 레이어는 #stage 밖에 있다. 스테이지는 contain-fit 으로 축소되지만
      운영 UI 는 실제 화면 크기 그대로여야 43"/49" 어디서든 같게 읽힌다.
   ⚠ 평소에는 DOM 자체가 없다 (필요할 때 만든다) — 시안 대조(parity)에 끼지 않는다.
   ===================================================================== */

.operator {
  position: fixed;
  inset: 0;
  z-index: 9000;
  pointer-events: none;             /* 토스트만 떠 있을 때 손님 터치를 막지 않는다 */
  font-family: var(--f-sans);
}

.operator.is-open {
  pointer-events: auto;
  background: rgba(24, 21, 16, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ── 토스트 (커서 온/오프 알림) ── */
.operator-toast {
  position: absolute;
  top: 24px;
  left: 50%;
  transform: translate(-50%, -12px);
  padding: 10px 20px;
  border-radius: 999px;
  background: rgba(24, 21, 16, 0.82);
  color: #FFFEF6;
  font-size: 18px;
  letter-spacing: -0.02em;
  white-space: nowrap;
  opacity: 0;
  transition: opacity 180ms ease, transform 180ms ease;
}

.operator-toast.is-on {
  opacity: 1;
  transform: translate(-50%, 0);
}

/* ── 종료 확인창 ── */
.operator-dialog {
  width: min(560px, 84vw);
  padding: 40px 40px 28px;
  border-radius: 24px;
  background: var(--paper, #FFFEF6);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
  text-align: center;
  color: var(--ink, #585243);
}

.operator-dialog__title {
  margin: 0 0 12px;
  font-size: 30px;
  font-weight: 700;
  letter-spacing: -0.03em;
}

.operator-dialog__note {
  margin: 0 0 28px;
  font-size: 17px;
  line-height: 1.6;
  color: var(--sub, #6E644E);
}

.operator-dialog__actions {
  display: flex;
  gap: 14px;
  justify-content: center;
}

.operator-btn {
  min-width: 150px;
  padding: 18px 24px;
  border: 0;
  border-radius: 14px;
  background: var(--nav, #DFD9CB);
  color: var(--ink-btn, #5E5341);
  font-family: inherit;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.02em;
  cursor: inherit;                  /* 커서 온/오프는 body 인라인 스타일이 정한다 */
}

.operator-btn--danger {
  background: var(--btn, #5E5341);
  color: var(--btn-label, #E2DDD7);
}

.operator-btn.is-press { transform: translateY(2px); }

.operator-dialog__auto {
  margin: 20px 0 0;
  font-size: 15px;
  color: var(--muted, #787878);
}