@media (min-width: 681px) and (max-width: 980px) {
  header { gap: 14px; }
  nav { gap: 18px; }
}

.hall-page { max-width: 820px; margin: 0 auto; }
.hall-intro { text-align: center; margin: 8px 0 36px; }
.hall-intro .eyebrow { margin: 0 0 12px; }
.hall-feature { min-height: 470px; padding: 32px 24px 38px; border: 1px solid #343b3d; border-radius: 18px; text-align: center; background: radial-gradient(ellipse at 50% 48%, #273428 0, #1a1f1e 45%, #16191b 100%); }
.hall-kicker { display: block; color: var(--lime); letter-spacing: 2px; font-size: 11px; font-weight: 700; }
.hall-user { margin: 20px 0 3px; font-size: 26px; letter-spacing: -.5px; }
.hall-rarity { margin: 0 0 24px; color: var(--rarity); font-size: 13px; font-weight: 700; }
.hall-hero-card { display: flex; justify-content: center; }
.hall-hero-card .card-v3 { width: 268px; max-width: 100%; cursor: pointer; }
.hall-page .card-v3:hover { transform: none; }
.hall-page .count-badge { display: none; }
.hall-rule { margin: 19px 0 0; color: #929b98; font-size: 11px; line-height: 1.8; }
.hall-detail-owner { margin: 0 0 18px; text-align: center; color: var(--lime) !important; font-size: 13px !important; }
.hall-detail-hint { max-width: 270px; margin: 18px auto 0; text-align: center; font-size: 12px !important; }
dialog .hall-detail-card { touch-action: none; }
#modal { max-height: calc(100dvh - 32px); overflow-y: auto; overscroll-behavior: contain; }
.hall-empty { display: grid; place-items: center; min-height: 330px; color: #b8c0b8; font-size: 14px; }
.hall-timeline { margin-top: 70px; }
.hall-list-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; padding-bottom: 18px; border-bottom: 1px solid #39403e; }
.hall-list-heading .eyebrow { margin: 0 0 7px; }
.hall-list-heading h2 { margin: 0; font-size: 22px; }
.hall-list-heading > span { color: var(--muted); font-size: 12px; }
.hall-row { display: grid; grid-template-columns: minmax(100px, 1fr) minmax(130px, 1.4fr) 68px; align-items: center; gap: 18px; min-height: 104px; padding: 14px 16px; border-bottom: 1px solid #2b3031; }
.hall-row-user { color: #c6cdc6; font-size: 13px; overflow-wrap: anywhere; }
.hall-row-name { font-size: 15px; font-weight: 600; }
.hall-thumb { width: 62px; height: 87px; overflow: hidden; pointer-events: none; }
.hall-thumb .card-v3 { width: 62px; min-width: 62px; height: 87px; padding: 3px; border-radius: 5px; box-shadow: none; }
.hall-thumb .card__face { border-radius: 3px; }
.hall-thumb .card__art { inset: 2px; border-radius: 2px; font-size: 30px; }
.hall-thumb .card__top, .hall-thumb .card__bottom, .hall-thumb .card-status-badge { display: none; }
.hall-thumb .card-image { object-fit: cover; }
.hall-list-empty { padding: 40px 16px; color: var(--muted); text-align: center; font-size: 13px; }

@media (max-width: 680px) {
  header { height: auto; min-height: 96px; flex-wrap: wrap; padding-top: 10px; gap: 5px 10px; }
  header nav { order: 3; flex-basis: 100%; width: 100%; height: 38px; justify-content: center; gap: clamp(13px, 5vw, 28px); }
  header nav button { height: 38px; white-space: nowrap; }
  .hall-intro { margin-top: 3px; }
  .hall-intro .sub { max-width: 320px; margin: auto; }
  .hall-feature { min-height: 440px; padding: 26px 16px; }
  .hall-timeline { margin-top: 52px; }
  .hall-row { grid-template-columns: minmax(65px, 1fr) minmax(90px, 1.4fr) 56px; gap: 9px; min-height: 88px; padding: 11px 3px; }
  .hall-row-user { font-size: 12px; }
  .hall-row-name { font-size: 13px; }
  .hall-thumb { width: 52px; height: 73px; }
  .hall-thumb .card-v3 { width: 52px; min-width: 52px; height: 73px; }
}