/* 游戏大厅：紧凑横幅 + 主题卡片网格 */
.hall { padding: 22px 28px 32px; }
.hall-flash { margin-bottom: 14px; padding: 10px 14px; border-radius: 12px; background: #fff7e6; color: #9a6400; font-size: 13px; }

.hall-hero { position: relative; height: 240px; border-radius: 22px; overflow: hidden; background-color: #518fea; background-size: cover; background-position: center 12%; padding: 0 40px; display: flex; align-items: center; color: #fff; }
.hall-hero h1 { font-size: 30px; font-weight: 850; letter-spacing: -.5px; text-shadow: 0 2px 10px #2965bd40; }
.hall-hero p { font-size: 14px; margin-top: 8px; opacity: .95; text-shadow: 0 1px 8px #2867b980; }
.hall-hero-btns { display: flex; gap: 10px; margin-top: 20px; flex-wrap: wrap; }
.hall-hero-btns .home-btn { height: 42px; padding: 0 20px; border-radius: 11px; font-size: 14px; }
.home-btn--white { background: #fff; color: #2b61be; box-shadow: 0 3px 0 #d7e5f7; }
.home-btn--white:hover { color: #214f9d; background: #f8fbff; }

.hall-head { display: flex; align-items: baseline; gap: 12px; margin: 26px 2px 14px; scroll-margin-top: 16px; }
.hall-head h2 { font-size: 20px; font-weight: 800; color: var(--text); }
.hall-head span { font-size: 12px; color: var(--text-muted); }

.hall-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px; }
.hall-card { display: flex; flex-direction: column; border: 1px solid #e6ebf3; border-radius: 16px; overflow: hidden; background: #fff; color: var(--text); transition: transform .2s, box-shadow .2s, border-color .2s; }
.hall-card:hover { transform: translateY(-3px); border-color: #c5d6f4; box-shadow: 0 10px 24px #274d8a12; color: var(--text); }
.hall-card-art { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: #fff5e5; }
.hall-card-art img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.hall-card:hover .hall-card-art img { transform: scale(1.04); }
.hall-card-body { padding: 11px 14px 12px; display: grid; gap: 6px; }
.hall-card-body b { font-size: 15px; font-weight: 750; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hall-card-meta { display: flex; align-items: center; gap: 6px; }
.hall-card-meta .home-tag { font-size: 11px; padding: 1px 8px; }
.hall-card-meta small { font-size: 12px; color: var(--text-muted); }
.hall-card-meta i { margin-left: auto; font-size: 12px; color: #9aaac2; transition: transform .2s, color .2s; }
.hall-card:hover .hall-card-meta i { color: var(--primary); transform: translateX(3px); }

@media (max-width: 900px) {
  .hall { padding: 14px 16px 24px; }
  .hall-hero { height: 190px; padding: 0 22px; border-radius: 18px; background-position: 70% 30%; }
  .hall-hero h1 { font-size: 21px; }
  .hall-hero p { font-size: 12px; }
  .hall-hero-btns .home-btn { height: 38px; padding: 0 14px; font-size: 13px; }
  .hall-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .hall-card-body { padding: 9px 10px 10px; }
  .hall-card-body b { font-size: 14px; }
}

/* 教学工具页 */
.tool-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
.tool-card { --c: #5b8def; --bg: #eef4ff; display: flex; align-items: center; gap: 14px; padding: 18px; border: 1px solid #e6ebf3; border-radius: 16px; background: #fff; color: var(--text); transition: transform .2s, box-shadow .2s, border-color .2s; }
.tool-card:hover { transform: translateY(-3px); border-color: var(--c); box-shadow: 0 10px 24px #274d8a12; color: var(--text); }
.tool-card-icon { width: 58px; height: 58px; flex-shrink: 0; border-radius: 16px; background: var(--bg); display: grid; place-items: center; font-size: 30px; }
.tool-card-body { min-width: 0; display: grid; gap: 3px; }
.tool-card-body b { font-size: 16px; font-weight: 800; }
.tool-card-body small { font-size: 12px; color: var(--text-muted); }
.tool-card > i { margin-left: auto; color: #9aaac2; font-size: 13px; }
.tool-card:hover > i { color: var(--c); }
.tool-dianming { --c: #f08a3c; --bg: #fff1e3; }
.tool-zuoye { --c: #2fa877; --bg: #e7f7ef; }
.tool-jishiqi { --c: #7a68e0; --bg: #f0edfd; }
@media (max-width: 900px) { .tool-grid { grid-template-columns: 1fr; gap: 10px; } .tool-card { padding: 14px; } }
.hall-head a { color: var(--primary); }
.hall-empty-btns { display: flex; gap: 10px; justify-content: center; margin-top: 14px; }
