:root{--ui-ink:#203a46;--ui-paper:#fffaf0;--ui-line:#d8c8a9;--ui-gold:#cfaa6d}button,select{min-height:44px;box-sizing:border-box}button{touch-action:manipulation}button:focus-visible,select:focus-visible{outline:3px solid #46a8ad;outline-offset:3px}.ui-icon{width:20px;height:20px;flex-shrink:0;vertical-align:middle}button .ui-icon+span{margin-left:8px}button{font-family:inherit}button[hidden],[hidden]{display:none!important}#viewport-container{height:100dvh}.hud-top{padding:12px;gap:8px;align-items:flex-start;position:relative;z-index:50}.hud-top-right{gap:6px;flex-wrap:nowrap;position:relative;z-index:50;pointer-events:auto}.hud-spot-banner{padding:10px 12px;max-width:220px;border-radius:14px}.spot-text strong{font-size:13px}#spotDesc,.hud-controls-help,.hud-speech-bubble small,.touch-stick-label,.stick-guide,#btnTouchDeliver,#town-objective{display:none}.hud-pill{padding:8px 10px;min-height:40px;font-size:13px}.hud-top-right>.hud-pill:nth-child(2){display:none}#menu-open{width:48px;height:48px;padding:10px;border:1px solid var(--ui-line);border-radius:13px;color:var(--ui-ink);background:var(--ui-paper);pointer-events:auto;touch-action:manipulation;position:relative;z-index:50;-webkit-tap-highlight-color:transparent}.hud-speech-bubble{display:none;padding:10px 14px;font-size:13px;max-width:340px}.hud-speech-bubble.visible{display:block}.hud-bottom{bottom:24px;pointer-events:none}.adventure-panel{display:none}#game-menu{width:min(390px,calc(100vw - 24px));padding:20px;border:1px solid var(--ui-line);border-radius:22px;background:var(--ui-paper);color:var(--ui-ink);max-height:85dvh;overflow:auto;box-sizing:border-box}dialog::backdrop{background:#132a3955}.menu-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.menu-heading h2{margin:0;font-size:19px}#menu-close{width:44px;border:0;background:transparent;color:inherit}#menu-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}#menu-actions button{display:flex;align-items:center;text-align:left;padding:10px;border:1px solid var(--ui-line);border-radius:12px;background:#fffdf7;color:var(--ui-ink);font-size:12px}#menu-settings{display:flex;gap:12px;margin-top:18px}#menu-settings label{flex:1;font-size:12px}#menu-settings select{display:block;width:100%;margin-top:6px;background:white;color:var(--ui-ink);border:1px solid var(--ui-line);border-radius:9px;padding:8px}#race-start,#town-talk,#enter-boutique-prompt{position:absolute;left:50%;right:auto;bottom:30px;transform:translateX(-50%);max-width:90%;width:max-content;min-height:48px;box-sizing:border-box;padding:10px 16px;border:1px solid var(--ui-gold);border-radius:14px;background:var(--ui-paper);color:var(--ui-ink);font-size:13px;pointer-events:auto;z-index:50;touch-action:manipulation;-webkit-tap-highlight-color:transparent}#enter-boutique-prompt small{display:none}#enter-boutique-prompt strong{font-size:13px}#race-hud{top:76px;right:12px;width:182px;padding:12px;border-radius:14px}#race-stop{pointer-events:auto;font-size:11px;margin-top:8px;padding:8px;color:#fff;background:transparent;border:1px solid #ffffff55;border-radius:9px}#race-hud strong{font-size:21px}#race-order{font-size:11px}#race-arrow .ui-icon{width:26px;height:26px}#town-hud{top:76px;right:12px;width:auto;max-width:200px;padding:10px 12px}#town-direction{margin-top:0}#town-hud strong{margin-bottom:0}.title-sub{font-size:11px;letter-spacing:.25em}.title-main{font-size:clamp(27px,5vw,48px)}.title-desc{font-size:13px}.title-card{padding:20px;max-width:360px}.title-actions button{font-size:14px;padding:13px 20px;min-height:48px}.title-actions button>span{font-size:inherit}.title-footer{font-size:10px}dialog{max-height:85dvh;overflow:auto;box-sizing:border-box}#coat-colors{border:0;padding:0;margin:12px 0}#coat-colors legend{font-size:12px;margin-bottom:8px}#coat-options{display:flex;gap:6px;flex-wrap:wrap}#coat-options button{border:2px solid transparent;background:var(--coat);color:#203a46;min-width:52px}#coat-options button[aria-pressed=true]{border-color:#203a46;box-shadow:0 0 0 2px white}#wardrobe-dialog button{min-height:44px}.wear-card{min-width:0}#quest-banner{top:76px;font-size:12px}#quest-banner small{display:none}
@media(max-width:650px){.hud-top{padding:calc(8px + env(safe-area-inset-top)) 8px 8px}.hud-spot-banner{max-width:170px;padding:10px}.spot-text strong{font-size:11px}.spot-icon{display:none}.hud-pill{font-size:12px;padding:8px}.title-desc{display:none}.title-header{margin-bottom:16px}.title-card{padding:16px;width:min(310px,90vw)}.title-main{font-size:27px}.title-actions{gap:8px}.title-footer{display:none}#touch-controls{padding:0;bottom:calc(14px + env(safe-area-inset-bottom));left:16px;right:16px}.touch-stick-zone{width:104px;height:104px}.touch-stick-knob{width:40px;height:40px}.knob-icon{display:none}.touch-actions{gap:8px}.touch-action-row{gap:10px}.touch-btn,.touch-btn-run,.touch-btn-jump{width:52px;height:52px;min-width:44px;min-height:44px;padding:6px;border-radius:50%;font-size:10px}.touch-btn .ui-icon{width:20px;height:20px}.touch-btn span{display:none}.touch-stick-wrapper{gap:0}#race-start,#town-talk,#enter-boutique-prompt{bottom:calc(132px + env(safe-area-inset-bottom));font-size:12px}#race-hud{top:calc(66px + env(safe-area-inset-top));right:8px;width:145px;padding:9px}#race-hud strong{font-size:19px}#race-checkpoint,#race-time,#race-distance{font-size:10px}#race-direction{padding:6px 0;gap:5px}#race-order{display:none}#race-stop{min-height:44px;margin-top:0}#town-hud{top:calc(66px + env(safe-area-inset-top));right:8px;max-width:165px;font-size:11px}#town-hud strong{font-size:12px}.hud-bottom{position:absolute;bottom:calc(200px + env(safe-area-inset-bottom));left:12px;right:12px}.hud-speech-bubble{font-size:12px;padding:9px 12px}#wardrobe-dialog{max-height:49dvh;padding:12px;inset:auto 8px calc(8px + env(safe-area-inset-bottom)) 8px}#wardrobe-items{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.wardrobe-note{display:none}#race-preview,#race-result,#town-dialog{width:calc(100vw - 24px);padding:18px}#race-preview h2,#race-result h2{font-size:20px}#race-preview p{font-size:12px}#quest-banner{top:68px;max-width:70%;padding:8px}#transient-objective{top:120px}}
@media(pointer:coarse) and (max-height:500px){.title-header{margin-bottom:8px}.title-sub,.title-desc{display:none}.title-main{font-size:24px}.title-card{padding:10px}.title-actions{gap:4px}.title-actions button{padding:8px;min-height:44px}.hud-bottom{bottom:130px}#race-start,#town-talk,#enter-boutique-prompt{bottom:16px}#race-order{display:none}#race-hud{top:64px;padding:8px}#wardrobe-dialog{width:48vw;inset:8px 8px 8px auto;max-height:calc(100dvh - 16px)}#touch-controls .touch-stick-zone{width:96px;height:96px}}
#minimap{position:absolute;left:12px;top:130px;width:160px;background:#203741e8;border:1px solid #d8c8a9;border-radius:12px;overflow:hidden;pointer-events:none}#minimap canvas{width:100%;height:auto;display:block}#minimap span{display:block;text-align:center;font-size:9px;color:#e7e1d1;padding:4px}#cafe-enter{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);padding:10px 16px;border:1px solid #cfaa6d;border-radius:14px;background:#fffaf0;color:#203a46;pointer-events:auto;z-index:36}#cafe-hud{position:absolute;inset:0;z-index:40;pointer-events:none}#cafe-hud>strong{position:absolute;top:16px;left:16px;padding:12px 16px;background:#fffaf0;border-radius:14px;color:#503d2c;font-size:14px}#cafe-hud>span{position:absolute;top:64px;left:18px;font-size:11px;color:#503d2c}#cafe-exit{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);pointer-events:auto;background:#fffaf0;color:#503d2c;border:1px solid #cfaa6d;border-radius:12px;padding:10px 16px}#cafe-hud #btnTouchJump,#cafe-hud #btnTouchRun,#cafe-hud #btnTouchInteract{display:none}#cafe-hud #touch-controls{z-index:41}
#title-overlay{background:linear-gradient(to bottom, rgba(16,25,45,0.85) 0%, rgba(16,25,45,0) 40%, rgba(16,25,45,0) 60%, rgba(16,25,45,0.7) 100%);pointer-events:auto}
#title-overlay.hidden{pointer-events:none}
#transient-objective{position:absolute;top:160px;left:50%;transform:translateX(-50%);background:rgba(23,40,43,0.80);border:1px solid #cfaa6d;border-radius:14px;padding:8px 18px;color:#fffaf0;text-align:center;pointer-events:none;z-index:100;backdrop-filter:blur(4px);animation:pop-in 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275)}
#transient-objective h2{margin:0;font-size:14px;font-weight:500;letter-spacing:0.5px}
@keyframes pop-in{0%{opacity:0;transform:translate(-50%,20px) scale(0.9)}100%{opacity:1;transform:translate(-50%,0) scale(1)}}
.transient-fade-out{animation:fade-out 0.8s forwards}
@keyframes fade-out{to{opacity:0}}
@media(max-width:650px){#minimap{left:8px;top:calc(85px + env(safe-area-inset-top));width:90px}#minimap span{font-size:8px}#cafe-enter{bottom:calc(132px + env(safe-area-inset-bottom));font-size:12px}#cafe-exit{bottom:calc(132px + env(safe-area-inset-bottom))}#cafe-hud>strong{top:calc(8px + env(safe-area-inset-top));left:8px}}
@media(max-height:500px){#minimap{width:80px}#minimap span{display:none}#cafe-enter,#cafe-exit{bottom:18px}}
/* Reset the old top anchor: top + bottom stretched the former prompt div. */
#enter-boutique-prompt{top:auto;height:44px;min-height:44px;max-height:44px;max-width:calc(100vw - 32px);width:max-content;padding:0 14px;gap:8px;animation:none;line-height:1.2;font-size:12px;white-space:nowrap;box-shadow:0 4px 15px #18283333}#enter-boutique-prompt .ui-icon{width:18px;height:18px}#enter-boutique-prompt span{margin:0;font-size:12px;color:inherit}
#scene{touch-action:none}#cafe-camera-controls{position:absolute;right:12px;top:12px;display:flex;gap:5px;pointer-events:auto}#cafe-camera-controls button{height:44px;width:44px;border:1px solid #d8c8a9;background:#fffaf0;color:#503d2c;border-radius:12px}#coffee-status{position:absolute;left:16px;top:88px;max-width:calc(100vw - 32px);padding:8px 12px;border-radius:10px;background:#fffaf0e8;color:#503d2c;font-size:12px}#coffee-talk{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);pointer-events:auto;padding:10px 16px;border:1px solid #cfaa6d;border-radius:12px;background:#fffaf0;color:#503d2c;white-space:nowrap}#coffee-panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:auto;width:min(360px,calc(100vw - 24px));max-height:85dvh;overflow:auto;box-sizing:border-box;background:#fff9ed;color:#503d2c;border:1px solid #cdb18a;border-radius:20px;padding:20px;box-shadow:0 20px 80px #20140b55}.coffee-heading{display:flex;justify-content:space-between;align-items:center;gap:10px}.coffee-heading h2{font-size:18px;margin:0}#coffee-cancel{border:0;background:transparent;color:inherit;width:44px;height:44px}#coffee-tip,#coffee-feedback{font-size:12px;line-height:1.7}#coffee-machine{display:flex;align-items:center;justify-content:center;gap:18px;height:65px;color:#947042}#coffee-machine .ui-icon{width:42px;height:42px;transform:rotate(var(--turn,0deg))}#coffee-meter{height:28px;background:#e4d8c3;border-radius:14px;position:relative;overflow:hidden;margin:14px 0}#coffee-zone{position:absolute;top:0;bottom:0;background:#c5a25d}#coffee-needle{position:absolute;top:0;bottom:0;width:4px;background:#314d4c;transform:translateX(-50%)}#coffee-action{width:100%;border:0;border-radius:12px;background:#284f4c;color:#fff;padding:12px;font-size:14px}#cafe-hud:has(#coffee-panel:not([hidden])) #touch-controls{visibility:hidden}
@media(max-width:650px){#cafe-camera-controls{top:calc(8px + env(safe-area-inset-top));right:8px;gap:3px}#cafe-camera-controls button{width:44px}#cafe-hud>strong{font-size:11px;padding:12px 10px}#cafe-hud>span{top:62px;font-size:10px;left:12px}#coffee-status{left:8px;top:82px;font-size:11px;max-width:calc(100vw - 16px)}#coffee-talk{bottom:calc(132px + env(safe-area-inset-bottom));font-size:12px}#coffee-panel{padding:14px}.coffee-heading h2{font-size:16px}}
@media(max-height:500px){#coffee-panel{max-height:94dvh;padding:10px 16px}#coffee-machine{height:34px}#coffee-machine .ui-icon{width:28px;height:28px}#coffee-tip,#coffee-feedback{margin:6px 0}#coffee-meter{margin:8px 0}#coffee-talk{bottom:18px}}
#weather-status{position:absolute;left:12px;top:235px;padding:6px 10px;border:1px solid #ffffff55;border-radius:9px;background:#334954de;color:#f3f7fa;font-size:11px;pointer-events:none}@media(max-width:650px){#weather-status{left:8px;top:calc(177px + env(safe-area-inset-top));font-size:10px}}

/* Cathedral shares the compact interior controls. */
#cathedral-enter{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);padding:10px 16px;border:1px solid #cfaa6d;border-radius:14px;background:#fffaf0;color:#203a46;pointer-events:auto;z-index:36}#cathedral-hud{position:absolute;inset:0;z-index:40;pointer-events:none}#cathedral-hud>strong{position:absolute;top:16px;left:16px;padding:12px 16px;background:#fffaf0;border-radius:14px;color:#503d2c;font-size:14px}#cathedral-hud>span{position:absolute;top:64px;left:18px;font-size:11px;color:#503d2c}#cathedral-exit{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);pointer-events:auto;background:#fffaf0;color:#503d2c;border:1px solid #cfaa6d;border-radius:12px;padding:10px 16px}#cathedral-hud #btnTouchJump,#cathedral-hud #btnTouchRun,#cathedral-hud #btnTouchInteract{display:none}#cathedral-hud #touch-controls{z-index:41}
@media(max-width:650px){#cathedral-enter{bottom:calc(132px + env(safe-area-inset-bottom));font-size:12px}#cathedral-exit{bottom:calc(132px + env(safe-area-inset-bottom))}#cathedral-hud>strong{top:calc(8px + env(safe-area-inset-top));left:8px}}
@media(max-height:500px){#cathedral-enter,#cathedral-exit{bottom:18px}}
#cathedral-camera-controls{position:absolute;right:12px;top:12px;display:flex;gap:5px;pointer-events:auto}#cathedral-camera-controls button{height:44px;width:44px;border:1px solid #d8c8a9;background:#fffaf0;color:#503d2c;border-radius:12px}
@media(max-width:650px){#cathedral-camera-controls{top:calc(8px + env(safe-area-inset-top));right:8px;gap:3px}#cathedral-camera-controls button{width:44px}#cathedral-hud>strong{font-size:11px;padding:12px 10px}#cathedral-hud>span{top:62px;font-size:10px;left:12px}}

#cathedral-enter{top:auto;height:44px;max-width:calc(100vw - 32px);white-space:nowrap}#cathedral-enter:disabled{opacity:.7}#cathedral-hud #btnTouchDeliver{display:none}

#cathedral-exit{top:auto;min-height:44px;white-space:nowrap}@media(max-width:360px){#cathedral-hud>strong{font-size:9px;padding:12px 7px}}
/* Shared interior camera and compact exploration event. */
#cafe-hud>strong,#cathedral-hud>strong{max-width:calc(100vw - 216px);box-sizing:border-box;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#cafe-camera-controls,#cathedral-camera-controls{gap:3px}#cafe-camera-controls button,#cathedral-camera-controls button{width:40px;height:44px}
#cathedral-quest-status{position:absolute;top:88px;left:16px;padding:8px 12px;background:#fffaf0eb;border:1px solid #dbc79c;border-radius:10px;color:#503d2c;font-size:12px}
#cathedral-quest-notice{position:absolute;top:132px;left:16px;max-width:min(380px,calc(100vw - 56px));padding:12px;background:#fffaf0f2;color:#503d2c;border-radius:12px;font-size:13px;line-height:1.7}
#cathedral-interact{position:absolute;top:auto;bottom:28px;left:50%;transform:translateX(-50%);max-width:calc(100vw - 24px);min-height:44px;white-space:nowrap;border:1px solid #cfaa6d;border-radius:12px;background:#fffaf0;color:#503d2c;padding:10px 14px;pointer-events:auto}
#cafe-hud #btnTouchDeliver{display:none}
@media(max-width:650px){#cafe-camera-controls,#cathedral-camera-controls{top:calc(8px + env(safe-area-inset-top));right:8px}#cafe-camera-controls button,#cathedral-camera-controls button{width:44px}#cafe-hud>strong,#cathedral-hud>strong{max-width:calc(100vw - 204px);font-size:10px;padding:12px 8px}#cathedral-quest-status{top:calc(80px + env(safe-area-inset-top));left:8px;font-size:11px}#cathedral-quest-notice{top:calc(119px + env(safe-area-inset-top));left:8px;font-size:12px}#cathedral-interact{bottom:calc(132px + env(safe-area-inset-bottom));font-size:12px}}
@media(max-height:500px){#cafe-hud>span,#cathedral-hud>span{display:none}#cathedral-quest-status{top:62px}#cathedral-quest-notice{top:100px;max-width:300px}#cathedral-interact{bottom:18px}}

/* ── iOS/iPad タッチ対応: HUD内の全インタラクティブ要素を統一 ──
   重要: ここで position を指定してはいけない。
   これらの多くは position:absolute で画面下部中央などに固定されており、
   relative に上書きすると flex アイテムに落ちてレイアウトが崩壊する。
   タッチ性能に必要なのは pointer-events / touch-action / z-index だけ。 */
#explore-hud button,
#explore-hud [role="button"],
#explore-hud a,
.hud-btn-menu,
.hud-pill,
#btnAudio,
#btnDelivery,
#hudTitleBtn,
#hudPadToggleBtn,
#race-start,
#race-stop,
#town-talk,
#enter-boutique-prompt,
#cafe-enter, #cafe-exit,
#cathedral-enter, #cathedral-exit,
#cathedral-interact,
#festival-interact,
#boutique-nudge {
  pointer-events: auto;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  z-index: 50;
}

/* hud-btn-menu 群（タイトル・ブティック・音など）も同様 */
.hud-btn-menu {
  min-height: 44px;
  min-width: 44px;
}

/* ══════════════════════════════════════════════════════
   iOS 15.0〜15.3 互換 & レイアウト整理
   ══════════════════════════════════════════════════════ */

/* ── dvh フォールバック ────────────────────────────────
   dvh は Safari 15.4 以降。先に vh を書き、@supports で上書きする。 */
#viewport-container { height: 100vh; }
#game-menu          { max-height: 85vh; }
dialog              { max-height: 85vh; }
#coffee-panel       { max-height: 85vh; }
#wardrobe-dialog    { max-height: calc(100vh - 40px); }
#race-preview, #race-result, #town-dialog { max-height: 90vh; }
@supports (height: 100dvh) {
  #viewport-container { height: 100dvh; }
  #game-menu          { max-height: 85dvh; }
  dialog              { max-height: 85dvh; }
  #coffee-panel       { max-height: 85dvh; }
  #wardrobe-dialog    { max-height: calc(100dvh - 40px); }
  #race-preview, #race-result, #town-dialog { max-height: 90dvh; }
}
@media(max-width:650px){
  #wardrobe-dialog { max-height: 49vh; }
  @supports (height: 100dvh) { #wardrobe-dialog { max-height: 49dvh; } }
}
@media(max-height:500px){
  #wardrobe-dialog { max-height: calc(100vh - 16px); }
  #coffee-panel    { max-height: 94vh; }
  @supports (height: 100dvh) {
    #wardrobe-dialog { max-height: calc(100dvh - 16px); }
    #coffee-panel    { max-height: 94dvh; }
  }
}

/* ── 画面下部中央プロンプトの排他表示 ──────────────────
   複数の「〜に入る」ボタンが同時に出ると重なるため、
   JS 側で優先度の低いものにこのクラスを付けて隠す。 */
.prompt-suppressed { display: none !important; }

/* ── レース中は住民HUDを下へ逃がす（右上の重なり回避）── */
body.is-racing #town-hud { top: calc(66px + env(safe-area-inset-top, 0px) + 158px); }

/* ── クエストバナー: position 未指定で top が効いていなかった ──
   fadeInDown の transform が中央寄せを打ち消すのでアニメは切る。 */
#quest-banner {
  position: absolute; top: 76px; left: 50%;
  transform: translateX(-50%);
  animation: none; z-index: 34;
}
@media(max-width:650px){ #quest-banner { top: calc(62px + env(safe-area-inset-top, 0px)); } }

/* ── ロックオンリング: JS が画面座標を直接セットする ── */
#lockon-hud {
  position: fixed; left: 0; top: 0;
  transform: translate(-50%, -50%);
  will-change: transform, left, top;
}

/* ── LOCK ボタン: 夜間だけ出す ── */
#btn-lockon { display: none; }
body.is-night #btn-lockon { display: flex; }

/* ══ <dialog> フォールバック用スタイル（iOS 15.0〜15.3）══
   dialog-compat.js が html.dlg-fallback を付けたときだけ適用。 */
.dlg-fallback dialog{
  display:none;
  position:fixed;
  left:50%; top:50%;
  transform:translate(-50%,-50%);
  margin:0;
  border:0;
  background:#fff;
  color:#19243b;
  box-sizing:border-box;
  overflow:auto;
  z-index:1000;
}
.dlg-fallback dialog[open]{display:block;}
.dlg-fallback .dlg-fallback-backdrop{
  position:fixed; inset:0;
  background:rgba(16,26,44,.70);
  z-index:999;
}
.dlg-fallback .dlg-fallback-backdrop[hidden]{display:none;}
.dlg-fallback.dlg-modal-open,
.dlg-fallback.dlg-modal-open body{overflow:hidden;}
/* 画面右寄せレイアウトのダイアログは inset 指定を尊重する */
.dlg-fallback #wardrobe-dialog{left:auto; top:auto; transform:none;}
@media(max-width:650px){
  .dlg-fallback dialog{width:calc(100vw - 24px);}
  .dlg-fallback #wardrobe-dialog{width:auto;}
}