/* 全局：深蓝底、米色纸，竖屏 */
:root {
  --ink: #1d2536; --ink-2: #232c42; --ink-3: #2a3450;
  --cream: #f1e8d4; --cream-dim: #aeb6c9; --tx-dim: #8b93a8;
  --paper: #efe6cf; --paper-2: #e6dabc; --tx-ink: #403a2c; --tx-ink-2: #6f6650;
  --line-brown: #b7a480; --gold: #c9b489; --seal: #a5433a;
  --f-cn: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', 'SimSun', serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body { background: #151b29; color: var(--cream); font-family: var(--f-cn); -webkit-tap-highlight-color: transparent; }
#app {
  position: relative; max-width: 480px; height: 100%; margin: 0 auto; overflow: hidden;
  background: radial-gradient(closest-side at 50% 40%, var(--ink-2), var(--ink) 80%, #151b29);
}
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
.screen { min-height: 100%; }

.zb-title { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 0 16px; }
.zb-title h1 { font-size: 34px; font-weight: 600; letter-spacing: 10px; text-indent: 10px; }
.zb-title-en { font-size: 11px; letter-spacing: 4px; color: var(--tx-dim); }
.zb-title-btns { margin-top: 40px; display: flex; flex-direction: column; gap: 12px; width: 220px; }
.zb-end { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 28px; padding: 0 16px; }
.zb-end p { font-size: 22px; letter-spacing: 8px; text-indent: 8px; }
.zb-end .zb-who { font-size: 18px; letter-spacing: 4px; text-indent: 0; color: var(--cream-dim); }

.zb-toast {
  position: fixed; left: 50%; top: 22%; transform: translateX(-50%); z-index: 50;
  padding: 8px 16px; border-radius: 4px; background: rgba(239, 230, 207, .95); color: var(--tx-ink);
  font-size: 14px; letter-spacing: 1px; white-space: nowrap; box-shadow: 0 4px 18px rgba(0, 0, 0, .35);
  animation: zbToastIn .25s ease both;
}
.zb-toast.out { opacity: 0; transition: opacity .3s; }
@keyframes zbToastIn { from { opacity: 0; transform: translate(-50%, 8px); } to { opacity: 1; transform: translate(-50%, 0); } }
