/* EducTools Game Studio — เกมท่าทาง (ขยับตัว อ้าปาก พูดตอบ) v1.43.0 */

/* ---------- ข้อความความเป็นส่วนตัวหน้าเริ่มเกม ---------- */
.camera-privacy-note{display:flex;align-items:flex-start;gap:10px;max-width:520px;margin:12px auto 0;padding:10px 14px;border:1px solid #cfe9db;border-radius:14px;background:#effaf4;color:#1f4d37;text-align:left;font-size:.9rem;line-height:1.5}
.camera-privacy-note>span:first-child{font-size:1.2rem;line-height:1.2}
.camera-privacy-note b{display:block;color:#13432c}

/* ---------- เวที AR ท่าทาง ---------- */
.gesture-stage video#arVideo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gesture-stage video#arVideo.mirrored{transform:scaleX(-1)}
.gesture-question{position:absolute;z-index:6;top:clamp(70px,11vh,96px);left:50%;width:min(760px,calc(100% - 32px));transform:translateX(-50%);padding:14px 20px;border-radius:22px;background:rgba(22,18,52,.62);color:#fff;text-align:center;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);pointer-events:none}
.gesture-question>span{display:inline-block;margin-bottom:4px;padding:2px 10px;border-radius:999px;background:rgba(255,255,255,.16);font-size:.85rem;font-weight:700}
.gesture-question>div{display:flex;align-items:center;justify-content:center;gap:12px}
.gesture-question .ar-question-emoji{font-size:clamp(2.2rem,6vw,3.4rem);line-height:1}
.gesture-question h2{margin:0;font-size:clamp(1.3rem,3.2vw,2.3rem);line-height:1.25}

.gesture-zones{position:absolute;z-index:6;right:16px;bottom:clamp(16px,4vh,32px);left:16px;display:flex;justify-content:space-between;gap:16px;pointer-events:none}
.gesture-zone{position:relative;display:grid;justify-items:center;gap:2px;width:min(32%,300px);min-height:clamp(150px,26vh,230px);padding:16px 14px 26px;border:4px solid rgba(255,255,255,.8);border-radius:26px;background:rgba(255,255,255,.9);color:#1d1a3a;box-shadow:0 10px 30px rgba(0,0,0,.25);pointer-events:auto;transition:transform .15s ease,border-color .15s ease,background-color .15s ease}
.gesture-zone-emoji{font-size:clamp(2.6rem,7vw,4.4rem);line-height:1.1}
.gesture-zone b{font-size:clamp(1.25rem,3vw,1.9rem);line-height:1.2}
.gesture-zone small{color:#55527a;font-size:.86rem;font-weight:600}
.gesture-zone.is-aiming{border-color:#ffd84d;transform:scale(1.04)}
.gesture-zone.correct{border-color:#22c55e;background:#effdf4}
.gesture-zone.wrong{border-color:#ef4444;background:#fff1f1}
.gesture-zone:disabled{cursor:default}
.gesture-meter{position:absolute;right:16px;bottom:12px;left:16px;height:10px;overflow:hidden;border-radius:999px;background:#e7e4f7}
.gesture-meter span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ffd84d,#ff9f1c);transition:width .08s linear}
.gesture-coach{position:absolute;z-index:7;bottom:clamp(180px,32vh,280px);left:50%;max-width:calc(100% - 40px);transform:translateX(-50%);padding:8px 16px;border-radius:999px;background:rgba(22,18,52,.78);color:#fff;font-weight:700;text-align:center;pointer-events:none}
.gesture-coach:empty{display:none}

/* ---------- เกมพูดตอบ ---------- */
.speak-game{display:grid;justify-items:center;gap:14px;text-align:center}
.speak-game .question-card{width:100%}
.speak-listen{margin-top:8px;padding:6px 14px;border:1px solid #d9d2ff;border-radius:999px;background:#fff;color:#5434df;font-weight:700}
.speak-visual{font-size:clamp(4.5rem,16vw,8rem);line-height:1.05}
.speak-mic{display:grid;justify-items:center;gap:4px;min-width:220px;padding:18px 26px;border:0;border-radius:999px;background:linear-gradient(135deg,#6d4aff,#9b5cff);color:#fff;box-shadow:0 6px 0 #4325c4;transition:transform .12s ease,box-shadow .12s ease}
.speak-mic span{font-size:2.6rem;line-height:1}
.speak-mic b{font-size:1.15rem}
.speak-mic:active{transform:translateY(4px);box-shadow:0 2px 0 #4325c4}
.speak-mic.is-listening{background:linear-gradient(135deg,#e5484d,#ff7a59);box-shadow:0 6px 0 #b42318;animation:speak-pulse 1.1s ease-in-out infinite}
.speak-mic:disabled{opacity:.6}
@keyframes speak-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
.speak-heard{min-height:1.6em;margin:0;font-size:1.1rem;font-weight:700;color:#3b3663}
.speak-tries{display:flex;gap:8px}
.speak-tries i{width:14px;height:14px;border-radius:50%;background:#d9d2ff}
.speak-tries i.is-used{background:#e5484d}
.speak-judge[hidden],.speak-mic[hidden]{display:none!important}
.speak-judge{display:grid;gap:8px;padding:12px 16px;border:1px dashed #c9bdfc;border-radius:16px;background:#faf8ff}
.speak-judge p{margin:0;font-weight:700}
.speak-judge>div{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.speak-judge-toggle{font-size:.9rem}

@media (max-width:760px){
  .gesture-zone{width:46%;min-height:140px}
  .gesture-zone small{display:none}
  .gesture-coach{bottom:170px;font-size:.9rem}
}
@media (prefers-reduced-motion:reduce){
  .gesture-zone,.gesture-meter span,.speak-mic{transition:none}
  .speak-mic.is-listening{animation:none}
}

/* v1.45.0 ปุ่มเสริมบนหน้าเล่น (มอบหมาย พิมพ์ คัดลอก) */
.play-action-form{display:inline-flex;margin:0}
.play-action-form .play-action{font:inherit;cursor:pointer}
/* v1.45.0 โหมดประหยัดเครื่อง */
.lite-mode-toggle{display:flex;align-items:flex-start;gap:10px;max-width:520px;margin:10px auto 0;padding:10px 14px;border:1px dashed #cbd5e1;border-radius:14px;background:#f8fafc;color:#334155;text-align:left;font-size:.88rem;line-height:1.5;cursor:pointer}
.lite-mode-toggle input{width:20px;height:20px;margin-top:2px;flex:none;accent-color:#4f46e5}
.lite-mode-toggle b{display:block;color:#1e293b}
