/* ゾンサバ こちらの都合の上書き(2026-09-13)
   ★ zonsaba-ui.css(Codex納品の皮)の**後**に読む。次の納品が来たら皮だけ差し替えて、ここは残す。
     ここに入れてよいのは「ゲームの都合で足した物」と「実機で崩れた所の直し」だけ。
     皮の作り込み(色・形・間)をここで上書きしない。 */

/* ---- 遊ぶ画面はスクロールしない ---- */
html,body{height:100%;overflow:hidden;overscroll-behavior:none;touch-action:none;
  -webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#app{height:100dvh}

/* ================= まだ届いていない絵の身代わり =================
   ★ここは**絵が全部そろったら丸ごと消してよい**。
     Codexの納品は少しずつ届くので、届いていない絵の所が「空っぽの穴」に見えないようにする。
     js/ui.js が読めなかった<img>に data-missing を付ける。 */
img[data-missing]{visibility:hidden}

/* 体の値の印(HP・スタミナ・空腹)は小さい丸で代用 */
#hud .vital img[data-missing]{visibility:visible;border-radius:50%}
#hud .vital[data-stat=hp] img[data-missing]{background:#dd6a62}
#hud .vital[data-stat=stamina] img[data-missing]{background:#92bed2}
#hud .vital[data-stat=hunger] img[data-missing]{background:#d4cbb8}

/* ★仮想スティックは見えないと遊べないので、必ず丸で代用する */
#hud .stick-base[data-missing]{visibility:visible;border-radius:50%;
  background:rgba(233,243,240,.07);border:1.5px solid rgba(233,243,240,.34)}
#hud .stick-knob[data-missing]{visibility:visible;border-radius:50%;
  background:rgba(233,243,240,.24);border:1.5px solid rgba(233,243,240,.55);
  box-shadow:0 3px 6px #0005}

/* 丸ボタンの絵が無い時は、字だけで読めるように少し大きくする */
#hud .round img[data-missing]+.action-label{font-size:13px}

/* 時間帯の絵(ui_time)が無い日は、空の四角を出さない(js/ui.js が body に印を付ける) */
body.no-ui-time #hud .day-icon{display:none}

/* ---- 危険の注意書き(皮には無いのでこちらで足す。上の帯の下・押せない) ---- */
#warn{position:absolute;left:0;right:0;top:calc(env(safe-area-inset-top,0px) + 74px);
  text-align:center;font-size:12px;font-weight:700;color:#ff8f88;
  text-shadow:0 1px 4px #000,0 0 10px #0008;pointer-events:none;min-height:16px;
  transition:opacity .2s}

/* ---- タイトル(皮には無い) ---- */
.cover{position:absolute;inset:0;background:#171e22;display:none;flex-direction:column;
  align-items:center;justify-content:center;gap:14px;padding:24px;text-align:center;z-index:8}
.cover.on{display:flex}
.cover h1{font-size:31px;letter-spacing:.16em;margin:0}
.cover .lead{font-size:13px;color:#bcc9c9;line-height:1.9;margin:0}
.cover .hint{font-size:11px;color:#8fa5ae;line-height:1.9;margin:0}
.cover .ver{font-size:10px;color:#5b6c72;position:absolute;bottom:calc(10px + env(safe-area-inset-bottom,0px))}
.prim{min-width:190px;min-height:58px;padding:15px 18px;border-radius:15px;
  border:1px solid #99b9b4;background:#42645e;color:#f3f5ed;font:inherit;font-size:16px}
.prim.ghost{min-width:150px;min-height:52px;font-size:13px;background:#2a3a40;border-color:#6e8087;color:#bcc9c9}

/* ---- 読み込み中(皮の物をそのまま使うが、消せるように) ---- */
#loading[hidden]{display:none}

/* ---- 一番狭い常態(390×664)。皮の位置を少しだけ上げる ---- */
@media (max-height:700px){
  #hud .interact{bottom:calc(var(--safe) + 40px)}
  #hud .push{bottom:calc(var(--safe) + 130px)}
  #hud .throw{bottom:calc(var(--safe) + 48px)}
  #hud .bag{bottom:calc(var(--safe) + 158px)}
  #hud .stick{bottom:calc(var(--safe) + 20px)}
  #hud .toast{bottom:calc(var(--safe) + 228px)}
  #warn{top:calc(env(safe-area-inset-top,0px) + 72px)}
}
