/* app-shell.css - 画面いっぱいの表示・没入モード・アプリ設定・案内バナー・釣り画面 */
/* 1) 常時: 見出しと足元の飾りを外し、上部バーの実寸を引いた残りを全部ゲームへ */
.fs-layout .world-heading,.fs-layout .world-footer{display:none!important}
.fs-layout .world-section{padding:0!important;display:flex;flex-direction:column}
.fs-layout #canvas-wrap{flex:1 1 auto;height:auto!important;min-height:0;border-radius:0!important;border:0!important;margin:0!important;box-shadow:none!important}
@media(min-width:981px){
  .fs-layout .workspace{height:calc(100dvh - var(--topbar-h,86px))!important;gap:0!important;padding:0!important}
  .fs-layout.panels-hidden .workspace{grid-template-columns:0 minmax(0,1fr) 0!important}
  .fs-layout.panels-hidden .resident-panel,.fs-layout.panels-hidden .tools-panel{display:none!important}
  .desktop-only{display:inline-flex}
}
@media(max-width:980px){
  .fs-layout .workspace{height:calc(100dvh - var(--topbar-h,72px) - var(--nav-h,72px))!important}
  .desktop-only{display:none!important}
}
/* カメラ列に足したボタン */
.camera-controls .shell-cam{font-size:20px}

/* 2) 没入モード: ゲームだけを画面いっぱいに */
.immersive .topbar,.immersive .mobile-nav{display:none!important}
@media(min-width:981px){.immersive .resident-panel,.immersive .tools-panel{display:none!important}}
.immersive #canvas-wrap{position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;z-index:40}
.immersive .resident-panel,.immersive .tools-panel{z-index:60}
.immersive .camera-controls{bottom:max(14px,env(safe-area-inset-bottom))!important}
.immersive-hud{position:fixed;z-index:45;top:max(10px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:6px;padding:5px 6px 5px 14px;border-radius:999px;background:rgba(255,253,248,.88);box-shadow:0 6px 24px #324e3930;backdrop-filter:blur(8px);font:600 13px/1 system-ui,sans-serif;color:#304940;white-space:nowrap}
.immersive-hud[hidden]{display:none}
.immersive-hud button{min-height:36px;min-width:36px;border:0;border-radius:999px;background:#edf1e5;color:#304940;font:inherit;padding:0 12px;cursor:pointer}
.immersive #notices{top:calc(max(10px,env(safe-area-inset-top)) + 52px)!important}

/* 3) アプリ設定ダイアログ */
.app-dialog{max-width:min(520px,94vw);width:100%;border:0;border-radius:22px;padding:0;box-shadow:0 18px 60px #324e3940;color:#304940;background:#fffdf8}
.app-dialog::backdrop{background:rgba(30,40,35,.45)}
.app-dialog .dialog-body{position:relative;padding:22px 22px 18px;max-height:84dvh;overflow:auto}
.app-dialog h2{margin:0 36px 14px 0;font-size:20px}
.app-dialog h3{margin:0 0 6px;font-size:15px}
.app-dialog p{margin:0 0 10px;font-size:14px;line-height:1.6}
.app-dialog-close{position:absolute;right:12px;top:12px;width:40px;height:40px;border-radius:50%;border:0;background:#edf1e5;font-size:20px;cursor:pointer}
.app-sec{border-top:1px solid #e4e5d9;padding:14px 0 6px}
.app-sec-warn{background:#fff4df;border:1px solid #e5bd80;border-radius:14px;padding:14px;margin-bottom:10px}
.app-row{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 10px}
.app-dialog button[data-shell],.shell-banner button{min-height:44px;padding:0 16px;border-radius:12px;border:1px solid #d9ddcf;background:#fff;color:#304940;font:600 14px/1.2 inherit;cursor:pointer}
.app-dialog button.primary,.shell-banner button.primary{background:#436b58;border-color:#436b58;color:#fff}
.app-howto{background:#edf1e5;border-radius:12px;padding:10px 12px}
.app-note{color:#718077;font-size:13px!important}
.app-state{color:#436b58;font-weight:700}

/* 4) 案内バナー(アプリ内ブラウザ / ホーム画面に追加) */
.shell-banner{position:fixed;z-index:70;left:50%;transform:translateX(-50%);bottom:calc(var(--nav-h,0px) + 12px + env(safe-area-inset-bottom));width:min(560px,calc(100vw - 20px));background:#fffdf8;border-radius:18px;box-shadow:0 12px 40px #324e3945;padding:12px 14px 4px;color:#304940}
.shell-banner p{margin:0 0 6px;font-size:14px;line-height:1.5}
.shell-banner-warn{background:#fff4df;border:1px solid #e5bd80}

/* 5) 釣り画面: 本編と同じ生成り・深緑・木の色 */
.fscene{position:fixed;inset:0;z-index:90;background:#376f75;color:#fffdf0;font-family:inherit;touch-action:manipulation;user-select:none;-webkit-user-select:none}
.fscene[hidden]{display:none}
.fscene-open{overflow:hidden}
.fs-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.fs-top{position:absolute;left:0;right:0;top:0;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:max(16px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) 16px max(20px,env(safe-area-inset-left));background:linear-gradient(#183d405e,#183d4000)}
.fs-title{font-size:16px;letter-spacing:.04em;text-shadow:0 1px 4px #183d40;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fs-close{flex-shrink:0;min-height:44px;border-radius:999px;border:1px solid #fffdf078;padding:0 18px;background:#fffdf0ed;color:#304940;font-weight:700;box-shadow:0 3px 12px #183d4020;cursor:pointer}
.fs-status{position:absolute;left:50%;top:calc(max(16px,env(safe-area-inset-top)) + 64px);transform:translateX(-50%);box-sizing:border-box;padding:10px 22px;border:1px solid #fffdf04d;border-radius:16px;background:#284d46ed;box-shadow:0 4px 18px #213e3826;font-size:17px;font-weight:700;line-height:1.5;text-align:center;width:max-content;max-width:min(600px,calc(100% - 32px))}
.fs-status[data-cue=nibble]{background:#f1dfb9;color:#3d4f3b;border-color:#fff2cf}
.fs-status[data-cue=bite]{background:#a63727;color:#fffdf0;border:2px solid #ffe7ac;box-shadow:0 0 0 4px #a6372733,0 4px 18px #213e3840}
.fs-status[data-cue=msg]{background:#fff8e6;color:#304940;border-color:#e4d4b0}
.fs-speed{position:absolute;left:50%;transform:translateX(-50%);top:calc(max(16px,env(safe-area-inset-top)) + 126px);display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap;max-width:calc(100% - 32px);width:max-content;padding:0 8px;border-radius:16px;background:#24463de6;font-size:13px;text-align:center}
.fs-speed:empty{display:none}
.fs-speed button{min-height:44px;border-radius:999px;border:0;padding:0 14px;background:#fffdf0;color:#304940;font-weight:700;cursor:pointer}
.fs-bottom{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;gap:10px;padding:30px max(20px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-bottom));background:linear-gradient(#193d3900,#193d398c 28%,#193d39db)}
.fs-hint{margin:0;font-size:13px;line-height:1.7;letter-spacing:.02em;text-align:center;max-width:560px;text-shadow:0 1px 3px #183d40}
.fs-strike{min-width:min(320px,80vw);min-height:64px;border-radius:20px;border:1px solid #eee1bd;background:#fff8e6;color:#304940;font-size:23px;font-weight:800;letter-spacing:.12em;box-shadow:0 5px 0 #b9c4a8,0 10px 24px #142e3940;cursor:pointer;transition:background .16s,box-shadow .16s}
.fs-strike.is-bite{background:#a63727;border:2px solid #ffe7ac;color:#fffdf0;box-shadow:0 5px 0 #682f29,0 0 0 5px #ffe7ac33,0 10px 24px #142e3940}
.fs-strike:active{transform:translateY(2px)}
.fs-strike:disabled{opacity:.55;box-shadow:none;cursor:default}
.fs-cancel{min-height:44px;border:0;background:none;color:#fffdf0;text-underline-offset:4px;text-decoration:underline;font-size:13px;cursor:pointer}
.fscene button:focus-visible{outline:3px solid #ffe9a5;outline-offset:5px}
@media(min-width:900px){.fs-top{padding-left:32px;padding-right:32px}.fs-bottom{gap:12px;padding-bottom:max(22px,env(safe-area-inset-bottom))}.fs-hint{font-size:14px}}
@media(max-width:480px){.fs-top{padding-left:16px;padding-right:16px}.fs-title{font-size:14px}.fs-close{padding:0 14px}.fs-status{font-size:15px;padding:10px 16px}.fs-hint{max-width:350px}.fs-bottom{gap:8px}.fs-strike{min-height:62px}}
@media(max-height:550px){.fs-status{top:64px;padding:6px 16px}.fs-speed{top:115px}.fs-bottom{padding-top:12px;gap:4px}.fs-hint{max-width:85vw;font-size:12px}.fs-strike{min-height:44px}.fs-cancel{min-height:32px}}
@media(prefers-reduced-motion:reduce){.fscene button{transition:none}.fs-strike:active{transform:none}}

.immersive-hud{max-width:calc(100vw - 16px);border-radius:18px}
.immersive-hud .ih-clock{white-space:normal;line-height:1.4;min-width:0;overflow-wrap:anywhere}
.immersive-hud button{flex-shrink:0}

/* 依頼#187: 右側のカメラ列は全画面ボタン(と設定⚙)だけを残し、視点を変えるボタンは隠す。
   ドラッグ・2本指・Q/Eキーでの視点操作はそのまま使える */
.camera-controls > button:not(.shell-cam):not(.cam-z){display:none!important}
/* 依頼#331: 画面の上下(Z軸)移動ボタン ⤒⤓ は隠さずに出す */
.camera-controls .cam-z{font-size:21px}
/* 依頼#334: 視点固定ボタン。固定中は色を反転して分かるように */
.camera-controls .cam-follow svg{display:block;margin:auto}.camera-controls .cam-follow[aria-pressed=true]{background:#405f56;color:#fff;border-color:#405f56}
