:root{ --ink:#1A1A1A; --paper:#FFFFFF; }
*{box-sizing:border-box; margin:0; padding:0;}
html,body{width:100%; height:100%; background:#000; overflow:hidden;
  font-family:'Noto Sans KR','Apple SD Gothic Neo','Malgun Gothic',sans-serif; color:#fff;}

#scaler{position:absolute; top:50%; left:50%; transform-origin:center center;}
/* 가로 FHD (1920 x 1080, 현장 설치 방향 기본) · 세로는 설정에서 전환(setOrient가 인라인 style로 교체) */
#stage{width:1920px; height:1080px; background:#0a0a0a; position:relative; overflow:hidden;
  box-shadow:0 20px 80px rgba(0,0,0,.5);}

#cv{position:absolute; inset:0; width:100%; height:100%; display:block;}

/* 웹캠 입력 (MediaPipe 전용 — 화면엔 안 보임) */
#cam{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; pointer-events:none;}

/* 시작 / 로딩 오버레이 */
#overlay{position:absolute; inset:0; z-index:10; background:#0a0a0a;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:40px; text-align:center;}
#overlay.hide{display:none;}
#overlay .ttl{font-size:64px; font-weight:800; color:#fff; letter-spacing:-.01em;}
#overlay .ttl small{display:block; margin-top:20px; font-size:28px; font-weight:500; color:#999; letter-spacing:.02em;}
#startBtn{font-size:36px; font-weight:800; color:#111; background:#fff; border:none;
  border-radius:90px; padding:30px 80px; cursor:pointer; transition:transform .15s;}
#startBtn:active{transform:scale(.96);}
#loading{font-size:30px; color:#999;}
#loading.hide{display:none;}
#err{position:absolute; bottom:40px; left:0; right:0; text-align:center; color:#e74c3c; font-size:22px; padding:0 40px;}

/* ---------- 키오스크 가드: 텍스트 선택·이미지 드래그·롱프레스 콜아웃 방지 (전시 무인 운영) ---------- */
body { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
img, video, canvas, svg { -webkit-user-drag: none; }