/* ── 安全约束 ───────────────────────────────────────────────
   癫痫: 零闪烁、无频闪、无高对比快切、所有过渡 >=400ms
   焦虑/OCD: 无红色警报、无计时、无扣分、无失败音效
   配色一律低饱和
   ──────────────────────────────────────────────────────── */
:root{
  --sky-top:#d6e8f2; --sky-bot:#eef5f8;
  --ink:#3f4a52;
  --btn-wave:#8fbf7f;   /* 柔和绿 */
  --btn-fist:#7fa8cf;   /* 柔和蓝 */
  --btn-touch:#c2bcb4;  /* 柔和灰，不是红 —— 它不是"错误按钮" */
  --btn-go:#8fbf7f;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{
  margin:0;padding:0;height:100%;overflow:hidden;
  background:linear-gradient(180deg,var(--sky-top),var(--sky-bot));
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  color:var(--ink);
  touch-action:manipulation;               /* 禁双击缩放 */
  -webkit-user-select:none;user-select:none;
  overscroll-behavior:none;                /* 禁下拉刷新，防误触退出 */
}
#scene{position:fixed;inset:0;width:100%;height:100%;display:block}

/* 字幕 —— 顶部，不遮挡 3D */
.caption{
  position:fixed;left:0;right:0;
  top:calc(env(safe-area-inset-top,0px) + 18px);
  padding:0 24px;text-align:center;
  font-size:clamp(19px,5.2vw,26px);font-weight:600;line-height:1.45;
  text-shadow:0 1px 3px rgba(255,255,255,.9);
  opacity:0;transition:opacity .5s ease-in-out;  /* 慢淡入，非闪烁 */
  pointer-events:none;
}
.caption.show{opacity:1}

/* 选择按钮 —— 底部，拇指区 */
.choices{
  position:fixed;left:0;right:0;
  bottom:calc(env(safe-area-inset-bottom,0px) + 20px);
  padding:0 20px;display:flex;flex-direction:column;gap:14px;
}
.big-btn{
  width:100%;min-height:92px;               /* >=88px 触摸目标 */
  border:none;border-radius:22px;
  font-size:23px;font-weight:700;color:#fff;
  display:flex;align-items:center;justify-content:center;gap:14px;
  box-shadow:0 4px 14px rgba(0,0,0,.13);
  transition:transform .4s ease-in-out,opacity .4s ease-in-out;  /* >=400ms */
  cursor:pointer;
}
.big-btn .ico{font-size:38px;line-height:1}
.big-btn:active{transform:scale(.97)}       /* 轻微，无颜色跳变 */
.btn-wave{background:var(--btn-wave)}
.btn-fist{background:var(--btn-fist)}
.btn-touch{background:var(--btn-touch)}
.btn-go{background:var(--btn-go)}

/* 起始页 */
.overlay{
  position:fixed;inset:0;z-index:10;
  background:linear-gradient(180deg,var(--sky-top),var(--sky-bot));
  display:flex;align-items:center;justify-content:center;
  transition:opacity .6s ease-in-out;
}
.overlay.gone{opacity:0;pointer-events:none}
.start-inner{text-align:center;padding:0 34px;width:100%;max-width:460px}
.start-emoji{font-size:88px;margin-bottom:6px}
.start-inner h1{font-size:40px;margin:0 0 34px;font-weight:800;letter-spacing:.5px}

.endbar{
  position:fixed;left:0;right:0;
  bottom:calc(env(safe-area-inset-bottom,0px) + 20px);
  padding:0 20px;transition:opacity .5s ease-in-out;
}
.hidden{opacity:0;pointer-events:none}

/* 进度：交到几个朋友 */
.stars{
  position:fixed;left:0;right:0;
  top:calc(env(safe-area-inset-top,0px) + 62px);
  text-align:center;font-size:30px;letter-spacing:8px;
  pointer-events:none;text-shadow:0 1px 3px rgba(255,255,255,.9);
}
/* 上下文动作按钮 —— 同一时刻只有一个，不是多选题 */
.btn-act{background:#7fa8cf}

/* 抬头看路按钮 —— 屏幕中部偏右，拇指够得到，不挡主按钮 */
.lookup{
  position:fixed;right:20px;
  bottom:calc(env(safe-area-inset-bottom,0px) + 136px);
  width:72px;height:72px;border-radius:36px;
  background:rgba(28,34,40,.74);color:#fff;font-size:31px;line-height:1;
  border:2px solid rgba(255,255,255,.5);
  box-shadow:0 4px 16px rgba(0,0,0,.28);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  transition:opacity .45s ease-in-out,transform .45s ease-in-out;
  cursor:pointer;z-index:5;
}
.lookup:active{transform:scale(.94)}
.lookup.hidden{opacity:0;pointer-events:none}