/**
 * 首页局部定位补丁（2026-10-08 placement patch）
 *
 * 加载顺序：main.css → plaque-frame.css → desk-music.css → 本文件（见 front-page.php）。
 * 版本号取文件 mtime（functions.php angus_inst_asset_ver），改文件即自动刷新缓存。
 *
 * 1. 桌面动态蟹：仅一只，.angus-room 直接子元素；脚底落电脑右侧/笔筒左侧桌面；
 *    原地小幅跳动，不跨画面、不变色（desk-crab-cut.png 晴雨同一张红蟹）。
 * 2. 欢迎气泡：下移至桌面附近、动态蟹上方。
 * 3. 六个栏目画框：移除叠加木框（.rp-frame），复用背景烘焙白板，
 *    画芯 + HTML 标题嵌入其纸面；六板各自按 1536×1024 背景实测落位（晴雨几何一致）。
 * 4. 音乐盒：移出烘焙手机（手机在 L12–22.5% / T78–83.5%），落电脑右下与右侧书堆之间空桌面。
 *
 * 仅桌面端（>860px）；移动端沿用原有布局。
 */

@media (min-width: 861px) {

  .angus-room { position: relative; isolation: isolate; overflow: hidden; }

  /* ---------- 1. 桌面动态蟹 ---------- */
  .angus-room > .room-crab {
    position: absolute !important;
    left: 66% !important; right: auto !important;
    top: auto !important; bottom: 24% !important;
    width: 7% !important;
    transform: none !important; filter: none !important;
    z-index: 4 !important; pointer-events: none;
  }
  .angus-room > .room-crab img {
    display: block; width: 100% !important; height: auto !important; max-width: 100%;
    animation: angus-desk-hop 3.2s ease-in-out infinite !important;
    transform-origin: 50% 100%;
    filter: none !important;
  }

  /* ---------- 2. 欢迎气泡（动态蟹上方、桌面附近） ---------- */
  .angus-room > .room-bubble {
    left: 63% !important; top: auto !important; bottom: 34% !important;
    width: 13.5% !important; box-sizing: border-box;
    transform: rotate(1deg) !important; z-index: 4;
  }

  /* ---------- 3. 六栏目画框：复用背景白板，移除叠加木框 ---------- */
  .room-plaque .rp-frame { display: none !important; }

  /* 六板实测（背景 1536×1024，晴雨几何一致，外扩 ≤0.05% 盖住抗锯齿边） */
  .rp-teaching  { left: 44.45% !important; top: 12.45% !important; width: 8.95% !important; height: 12.35% !important; }
  .rp-products  { left: 61.10% !important; top: 10.05% !important; width: 7.80% !important; height: 13.45% !important; }
  .rp-resources { left: 74.25% !important; top: 10.10% !important; width: 7.85% !important; height: 12.65% !important; }
  .rp-blog      { left: 47.25% !important; top: 29.45% !important; width: 7.55% !important; height: 12.00% !important; }
  .rp-about     { left: 62.27% !important; top: 29.05% !important; width: 7.30% !important; height: 12.35% !important; }
  .rp-contact   { left: 74.64% !important; top: 28.55% !important; width: 7.68% !important; height: 12.70% !important; }

  /* 画芯 + 标题嵌入白板纸面（画芯上区 / 标题下区；单个板如需微调在此覆写） */
  .room-plaque .rp-art { left: 6%; top: 11%; width: 88%; height: 53%; }
  .room-plaque .rp-cap { left: 4%; right: 4%; top: 67%; bottom: 5%; }

  /* ---------- 4. 音乐盒（避开烘焙手机，落电脑右下空桌面） ---------- */
  .angus-room > .desk-music {
    left: 73% !important; top: 77% !important;
    right: auto !important; bottom: auto !important;
    width: 7.5% !important; z-index: 4;
  }
}

/* 螃蟹原地小跳（脚底不离桌面太远） */
@keyframes angus-desk-hop {
  0%, 35%, 70%, 100% { transform: translateY(0); }
  18% { transform: translateY(-6%); }
  52% { transform: translateY(-4%); }
}
@media (prefers-reduced-motion: reduce) {
  .angus-room > .room-crab img { animation: none !important; }
}

/* ============================================================
   学员入口（原品牌锚点 → 学员登录 / 我的空间）
   锚徽章下方加可见文字标签，未登录=学员登录，已登录=我的空间
   ============================================================ */
.room-bottomnav .rbn-anchor {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  text-decoration: none;
}
.room-bottomnav .rbn-anchor .rbn-anchor-cap {
  font-family: var(--font-hand, "Caveat", cursive);
  font-size: clamp(12px, 1.05vw, 17px);
  font-weight: 600;
  color: #fdf8ec;
  text-shadow: 0 1px 3px rgba(30, 22, 12, .55);
  line-height: 1.1;
  white-space: nowrap;
  transition: color .18s ease;
}
.room-bottomnav .rbn-anchor:hover .rbn-anchor-cap { color: var(--yellow, #ffd66b); }

/* 手机端：锚点原被隐藏 → 恢复为一张「学员登录」栏目卡（与底部栏目卡同款） */
@media (max-width: 860px) {
  .angus-room .room-bottomnav .rbn-anchor {
    display: flex;
    flex-direction: row; align-items: center; gap: 12px;
    width: auto; margin: 0;
    padding: 11px 16px 11px 12px;
    background: #fff; border: 1px solid var(--line);
    border-left: 5px solid #193565;
    border-radius: 14px; box-shadow: var(--shadow-sm);
    transition: none;
  }
  .angus-room .room-bottomnav .rbn-anchor img { width: 40px; height: 40px; object-fit: contain; flex: none; }
  .angus-room .room-bottomnav .rbn-anchor .rbn-anchor-cap {
    font-size: 17px; font-weight: 700;
    color: var(--blue-ink, #193565); text-shadow: none;
  }
}
