/* 登入關卡與雲端存檔提示。版面以舞台座標（橫向 1600×900、直向 900×1600 起）設計，元件間距至少 6px。 */
.cloud-gate { position: absolute; inset: 0; display: grid; justify-items: center; align-content: center; gap: 22px; z-index: 5; padding: 40px 0 110px; }
.cloud-logo { width: 420px; filter: drop-shadow(0 14px 30px #000); }
.cloud-panel { width: 560px; padding: 34px 44px 28px; display: grid; gap: 12px; text-align: left;
  background: linear-gradient(#15110ee8, #0c0a08f2); box-shadow: 0 0 0 1px #000, 0 0 0 2px #6e5634, 0 26px 60px #000c; border-radius: 6px; }
.cloud-panel h2 { margin: 0; text-align: center; }
.cloud-panel .sub { margin: 0 0 6px; text-align: center; color: var(--ink); font: 17px/1.6 var(--tc); white-space: pre-line; }
.cloud-panel .field-label { margin: 8px 0 0; }
.cloud-panel .name-row input { min-width: 0; font-size: 19px; letter-spacing: 1px; }
.cloud-panel .btn-primary, .cloud-panel .ghost-btn { width: 100%; margin-top: 8px; }
.cloud-panel [data-part] { display: grid; gap: 8px; }
.cloud-panel [data-part][hidden] { display: none; }
.cloud-sent { margin: 0; color: var(--ink); font: 16px/1.6 var(--tc); }
.cloud-links, .cloud-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 22px; margin-top: 4px; }
.cloud-actions { flex-direction: column; align-items: stretch; gap: 10px; }
.cloud-actions .link-btn { align-self: center; }
.link-btn { padding: 8px 6px; background: none; border: 0; color: #d9c49a; font: 15px var(--tc); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.link-btn:hover, .link-btn:focus-visible { color: var(--gold2); }
.cloud-or { display: flex; align-items: center; gap: 12px; margin: 6px 0 0; color: var(--muted); font: 14px var(--tc); }
.cloud-or::before, .cloud-or::after { content: ''; flex: 1; height: 1px; background: #6e563480; }
.cloud-panel .field-error { margin: 2px 0 0; text-align: center; min-height: 22px; font: 15px/1.5 var(--tc); }
.cloud-panel .field-error.ok { color: var(--gold2); }
.cloud-note { margin: 2px 0 0; color: var(--muted); font: 13px/1.6 var(--tc); text-align: center; }
.cloud-gate .title-foot { position: absolute; }
.account-mail { min-width: 0; overflow-wrap: anywhere; color: var(--gold2); font: 15px var(--tc); }
.cloud-lost .modal-x { display: none; }
body.portrait .cloud-gate { padding: 80px 0 160px; gap: 30px; }
body.portrait .cloud-logo { width: 560px; }
body.portrait .cloud-panel { width: 740px; padding: 42px 54px 34px; gap: 16px; }
body.portrait .cloud-panel .sub, body.portrait .cloud-sent { font-size: 24px; }
body.portrait .cloud-panel .name-row input { font-size: 26px; padding: 18px 20px; }
body.portrait .cloud-or { font-size: 21px; }
body.portrait .link-btn { font-size: 24px; padding: 10px 8px; }
body.portrait .cloud-panel .field-error { font-size: 21px; }
body.portrait .cloud-note { font-size: 19px; }
/* 手機直向：舞台縮小約 0.43 倍，按鈕與標題要比一般畫面大，實際字級才看得清楚（不靠縮字塞版面）。 */
.cloud-panel h2 { font-size: 30px; }
body.portrait .cloud-panel h2 { font-size: 42px; line-height: 1.25; }
body.portrait .cloud-panel .btn-primary { --h: 84px; min-height: 84px; font-size: 26px; letter-spacing: 3px; }
body.portrait .cloud-panel .ghost-btn { --h: 72px; min-height: 72px; font-size: 24px; letter-spacing: 2px; }
body.portrait .cloud-panel .field-label { font-size: 20px; }
/* 「查看你的信箱」：全部置中；信箱地址單獨一行金色；兩個次要按鈕並排等寬。 */
.cloud-sent-step { justify-items: center; text-align: center; }
.cloud-envelope { width: 64px; height: 48px; fill: none; stroke: var(--gold); stroke-width: 2.2; stroke-linejoin: round; filter: drop-shadow(0 4px 10px #000); }
.cloud-sent-to { display: grid; gap: 6px; margin: 4px 0 0; color: var(--muted); font: 16px/1.5 var(--tc); }
.cloud-address { color: var(--gold2); font: 600 20px/1.4 var(--serif); letter-spacing: .5px; overflow-wrap: anywhere; }
.cloud-sent-step .cloud-sent { max-width: 420px; margin: 4px 0 6px; color: var(--ink); font: 16px/1.7 var(--tc); white-space: pre-line; }
.cloud-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; width: 100%; margin-top: 6px; }
.cloud-pair .ghost-btn { width: 100%; min-width: 0; margin-top: 0; }
body.portrait .cloud-envelope { width: 92px; height: 69px; }
body.portrait .cloud-sent-to { font-size: 23px; }
body.portrait .cloud-address { font-size: 30px; }
body.portrait .cloud-sent-step .cloud-sent { max-width: 600px; font-size: 24px; }
body.portrait .cloud-pair { gap: 16px; }
/* 驗證碼輸入：滿寬、數字置中放大並拉開字距，方便對照信中的號碼 */
.cloud-sent-step .field-label { justify-self: stretch; text-align: center; }
.cloud-sent-step .name-row { width: 100%; }
#cloud-code { text-align: center; font: 600 28px var(--serif); letter-spacing: 12px; padding-left: 28px; }
body.portrait #cloud-code { font-size: 40px; letter-spacing: 16px; padding-left: 36px; }
/* Google 登入：沿用遊戲的暗色金屬按鈕框（ghost-btn），只保留 Google 官方四色 G 標誌與文字，不另做亮色按鈕。 */
.cloud-panel .btn-google { display: flex; align-items: center; justify-content: center; gap: 16px; width: 100%; margin-top: 4px; color: #f0dcb2; font: 600 18px var(--tc); letter-spacing: 2px; text-transform: none; cursor: pointer; }
.btn-google .g-logo { flex: none; width: 24px; height: 24px; filter: drop-shadow(0 1px 2px #000a); }
.btn-google:hover, .btn-google:focus-visible { color: #fff3d6; filter: brightness(1.12); }
.btn-google:disabled, .cloud-panel button:disabled { opacity: .55; cursor: default; }
body.portrait .cloud-panel .btn-google { --h: 84px; min-height: 84px; gap: 22px; font-size: 26px; letter-spacing: 3px; }
body.portrait .btn-google .g-logo { width: 38px; height: 38px; }
/* 登入畫面底部的政策連結 */
.cloud-legal { margin: 0; text-align: center; color: var(--muted); font: 13px/1.8 var(--tc); }
.cloud-legal a { color: #d9c49a; text-underline-offset: 3px; padding: 4px 2px; }
.cloud-legal a:hover, .cloud-legal a:focus-visible { color: var(--gold2); }
body.portrait .cloud-legal { font-size: 19px; }