/* ============ 首页：背景完整显示（不裁剪）+ 手绘按钮 ============ */
#view-home {
  padding: 0;
  justify-content: flex-end;
  /* 图片四周不裁切：留白处用同色暖米黄补，接缝落在图的上/下边缘色上 */
  background-color: #F5E1C8;
  background-image:
    url(../img/home-bg.jpg),
    linear-gradient(180deg, #F8E2C5 0%, #F6E1C9 55%, #F4E7D2 100%);
  background-repeat: no-repeat, no-repeat;
  background-position: center center, center center;
  background-size: contain, 100% 100%;
}

.home-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  /* 图片按 contain 居中后下方会有一条留白；按钮正好停在图片下边缘上方 */
  padding-bottom: calc(var(--safe-b) + max(2vh, (100vh - 177.78vw) / 2 + 2vh));
}

/* ---------- 主按钮：朱砂暖橙，压金边 ---------- */
.home-btn-main {
  width: 62vw; max-width: 290px; height: 56px;
  font-size: 19.5px;
  color: #FFF6E6;
  background:
    radial-gradient(130% 170% at 50% -40%, rgba(255, 214, 160, .55) 0%, rgba(255, 214, 160, 0) 58%),
    linear-gradient(180deg, #E8663A 0%, #D24A22 52%, #B93A18 100%);
  border: 1.5px solid rgba(233, 200, 120, .85);
  box-shadow:
    0 10px 22px rgba(160, 62, 26, .32),
    inset 0 0 0 3px rgba(255, 240, 215, .16),
    inset 0 1px 0 rgba(255, 235, 200, .6),
    inset 0 -3px 8px rgba(120, 40, 12, .35);
  text-shadow: 0 1px 2px rgba(120, 40, 12, .45);
}

/* ---------- 次按钮：纸白描金，两个字并排 ---------- */
.home-row {
  display: flex;
  gap: 12px;
  width: 62vw; max-width: 290px;
}
.home-btn-ghost {
  flex: 1; height: 42px;
  font-size: 14.5px;
  color: #6E4A2E;
  background: linear-gradient(180deg, rgba(255, 253, 246, .96), rgba(248, 238, 220, .96));
  border: 1.5px solid rgba(201, 162, 60, .75);
  box-shadow:
    0 5px 14px rgba(140, 100, 50, .18),
    inset 0 1px 0 rgba(255, 255, 255, .95);
}

/* ---------- 通用 ---------- */
.home-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-song);
  letter-spacing: .18em;
  text-indent: .18em;
  border-radius: 999px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
}
.home-btn:active {
  transform: translateY(1px) scale(.985);
  filter: brightness(.97);
  box-shadow: 0 3px 8px rgba(140, 80, 40, .22), inset 0 1px 3px rgba(120, 70, 30, .18);
}
.home-btn.is-disabled {
  opacity: .55;
  filter: grayscale(.4);
}