/**
 * Liver UI + LP demo — Manager基準 · 二次テキスト15–25%縮小
 * 唯一ソース: shared/ui-shell（sync:ui-shell → website / dashboard）
 * Load AFTER kpi-numeric-fit.css / mobile-demo-align.css / liver-secondary-readable.css
 *
 * 維持: KPI数値 · 勝率 · ダイヤ · TOPギフター
 * 縮小: ライバー名 · 対戦相手名 · PK/VS履歴メタ · 日時 · ID · 補足テキスト · ギフター一覧(実アプリ)
 */

@media (max-width: 960px) {
  /* ── ページ余白 ── */
  #liver-shell.mobile-tab-mode .phone-tab-page,
  .phone--demo .phone-tab-page,
  #liver-shell.mobile-tab-mode .phone-tab-page--gift,
  .phone--demo .phone-tab-page--gift,
  #liver-shell.mobile-tab-mode .phone-tab-page--mypage,
  .phone--demo .phone-tab-page--mypage {
    gap: 0.38rem;
    padding-bottom: 0.25rem;
  }

  /* ── 1. 画面タイトル（現行 1.44rem → −18% ≈ 1.18rem） ── */
  #liver-shell.mobile-tab-mode .phone-tab-title,
  #lp-phone-demo .phone-tab-title,
  .phone--demo .phone-tab-title {
    font-size: 1.18rem !important;
    font-weight: 700;
    line-height: 1.25;
    margin: 0 0 0.1rem;
  }

  /* ── セクション見出し（Manager liver-section__desc 相当） ── */
  #liver-shell.mobile-tab-mode .phone-section-label,
  #lp-phone-demo .phone-section-label,
  .phone--demo .phone-section-label {
    margin: 0.2rem 0 0.12rem;
    font-size: 0.72rem !important;
    font-weight: 600;
    letter-spacing: 0.05em;
    color: rgba(255, 255, 255, 0.42);
  }

  #liver-shell.mobile-tab-mode .phone-section-label small,
  .phone--demo .phone-section-label small {
    font-size: 0.62rem;
  }

  /* ── 2. KPIカード — ラベル/説明縮小 · 高さ−25% · 数字維持 ── */
  #liver-shell.mobile-tab-mode .phone-pk-hero,
  .phone--demo .phone-pk-hero {
    padding: 0.45rem 0.4rem;
    border-radius: 12px;
  }

  #liver-shell.mobile-tab-mode .phone-pk-hero__label,
  .phone--demo .phone-pk-hero__label {
    font-size: 0.72rem;
    line-height: 1.35;
  }

  #liver-shell.mobile-tab-mode .phone-vs-hero,
  .phone--demo .phone-vs-hero {
    padding: 0.5rem 0.4rem 0.45rem;
    border-radius: 12px;
  }

  #liver-shell.mobile-tab-mode .phone-vs-hero__eyebrow,
  .phone--demo .phone-vs-hero__eyebrow,
  #liver-shell.mobile-tab-mode .phone-vs-hero__tagline,
  .phone--demo .phone-vs-hero__tagline {
    font-size: 0.72rem;
    margin: 0 0 0.12rem;
    line-height: 1.35;
  }

  #liver-shell.mobile-tab-mode .phone-vs-hero__tagline,
  .phone--demo .phone-vs-hero__tagline {
    margin-top: 0.2rem;
  }

  #liver-shell.mobile-tab-mode .phone-pk-career,
  .phone--demo .phone-pk-career,
  #liver-shell.mobile-tab-mode .phone-mypage-career__cell,
  .phone--demo .phone-mypage-career__cell {
    padding: 0.28rem 0.25rem;
    border-radius: 8px;
  }

  #liver-shell.mobile-tab-mode .phone-pk-career__label,
  .phone--demo .phone-pk-career__label,
  #liver-shell.mobile-tab-mode .phone-mypage-career__label,
  .phone--demo .phone-mypage-career__label {
    font-size: 0.6rem;
    margin-bottom: 0.06rem;
    line-height: 1.25;
  }

  #liver-shell.mobile-tab-mode .phone-kpi,
  .phone--demo .phone-kpi {
    padding: 0.38rem 0.42rem;
    border-radius: 10px;
  }

  #liver-shell.mobile-tab-mode .phone-kpi__label,
  #lp-phone-demo .phone-kpi__label,
  .phone--demo .phone-kpi__label {
    font-size: 0.6rem !important;
    margin-bottom: 0.08rem;
    line-height: 1.25;
  }

  #liver-shell.mobile-tab-mode .phone-kpi__sub,
  .phone--demo .phone-kpi__sub {
    font-size: 0.62rem;
    margin-top: 0.08rem;
    line-height: 1.35;
  }

  #liver-shell.mobile-tab-mode .phone-stat-row div,
  .phone--demo .phone-stat-row div {
    padding: 0.28rem 0.2rem;
    border-radius: 8px;
  }

  #liver-shell.mobile-tab-mode .phone-stat-row small,
  .phone--demo .phone-stat-row small {
    font-size: 0.6rem;
    margin-top: 0.06rem;
    line-height: 1.25;
  }

  #liver-shell.mobile-tab-mode .phone-pk-career-grid,
  .phone--demo .phone-pk-career-grid,
  #liver-shell.mobile-tab-mode .phone-mypage-career,
  .phone--demo .phone-mypage-career,
  #liver-shell.mobile-tab-mode .phone-stat-row,
  .phone--demo .phone-stat-row {
    gap: 0.28rem;
  }

  /* 実アプリ KPI（mobile-tab-mode） */
  #liver-shell.mobile-tab-mode .pk-career,
  #liver-shell.mobile-tab-mode .pk-recent,
  #liver-shell.mobile-tab-mode .pk-opponents,
  #liver-shell.mobile-tab-mode .gift-panel,
  #liver-shell.mobile-tab-mode .gift-total-banner {
    padding: 0.4rem 0.45rem;
    border-radius: 10px;
  }

  #liver-shell.mobile-tab-mode .pk-career__cell {
    padding: 0.32rem 0.28rem;
  }

  #liver-shell.mobile-tab-mode .pk-career__label {
    font-size: 0.6rem;
    line-height: 1.25;
  }

  #liver-shell.mobile-tab-mode .pk-page__title,
  #liver-shell.mobile-tab-mode .gift-panel__title {
    font-size: 0.72rem;
    margin-bottom: 0.35rem;
  }

  #liver-shell.mobile-tab-mode .gift-total-banner__label {
    font-size: 0.72rem;
  }

  #liver-shell.mobile-tab-mode .gift-total-banner__month {
    font-size: 0.62rem;
  }

  #liver-shell.mobile-tab-mode .gift-hero-card {
    padding: 0.4rem 0.42rem;
    min-height: 0;
  }

  #liver-shell.mobile-tab-mode .gift-hero-card__label {
    font-size: 0.6rem;
  }

  #liver-shell.mobile-tab-mode .gift-hero-card__meta {
    font-size: 0.62rem;
  }

  /* ── 3. 履歴系 — 1件あたりの高さ縮小 ── */
  #liver-shell.mobile-tab-mode .phone-pk-list,
  .phone--demo .phone-pk-list,
  #liver-shell.mobile-tab-mode .phone-rank-list,
  .phone--demo .phone-rank-list,
  #liver-shell.mobile-tab-mode .phone-vs-recent-rivals,
  .phone--demo .phone-vs-recent-rivals,
  #liver-shell.mobile-tab-mode .phone-vs-opponent-list,
  .phone--demo .phone-vs-opponent-list {
    gap: 0.22rem;
  }

  #liver-shell.mobile-tab-mode .phone-pk-row,
  .phone--demo .phone-pk-row {
    gap: 0.22rem 0.3rem;
    padding: 0.28rem 0.35rem;
    border-radius: 7px;
  }

  #liver-shell.mobile-tab-mode .phone-pk-row small,
  .phone--demo .phone-pk-row small {
    font-size: 0.77rem;
    line-height: 1.3;
  }

  /* TOPギフター — 現状維持（縮小しない） */

  #liver-shell.mobile-tab-mode .phone-vs-recent-rivals li,
  .phone--demo .phone-vs-recent-rivals li {
    padding: 0.26rem 0.35rem;
    font-size: 0.92rem;
    border-radius: 7px;
  }

  #liver-shell.mobile-tab-mode .phone-vs-recent-rivals em,
  .phone--demo .phone-vs-recent-rivals em {
    font-size: 0.62rem;
  }

  #liver-shell.mobile-tab-mode .phone-vs-opponent__name,
  .phone--demo .phone-vs-opponent__name {
    font-size: 0.93rem;
  }

  #liver-shell.mobile-tab-mode .phone-vs-opponent__stat,
  .phone--demo .phone-vs-opponent__stat {
    font-size: 0.77rem;
  }

  #liver-shell.mobile-tab-mode .pk-recent-row,
  #liver-shell.mobile-tab-mode .pk-opponent-row {
    padding: 0.32rem 0.38rem;
    border-radius: 7px;
  }

  #liver-shell.mobile-tab-mode .pk-opponent-row__name,
  #liver-shell.mobile-tab-mode .pk-recent-row__meta,
  #liver-shell.mobile-tab-mode .pk-opponent-row__meta,
  #liver-shell.mobile-tab-mode .gift-rank-row__name,
  #liver-shell.mobile-tab-mode .gift-rank-row__meta,
  #liver-shell.mobile-tab-mode .gift-history-row__meta {
    font-size: 0.77rem;
    line-height: 1.3;
  }

  #liver-shell.mobile-tab-mode .gift-rank-row {
    padding: 0.28rem 0.35rem;
    gap: 0.35rem;
  }

  #liver-shell.mobile-tab-mode .gift-rank-row__rank {
    font-size: 0.93rem;
    min-width: 1.5rem;
  }

  /* ホーム · ライバー名 */
  #liver-shell.mobile-tab-mode .home-profile-strip__name,
  #lp-phone-demo .home-profile-strip__name,
  .phone--demo .home-profile-strip__name {
    font-size: 1.15rem !important;
  }

  #liver-shell.mobile-tab-mode .home-profile-strip__handle,
  #lp-phone-demo .home-profile-strip__handle,
  .phone--demo .home-profile-strip__handle {
    font-size: 0.77rem;
  }

  /* ── 4. マイページ — プロフィールコンパクト ── */
  #liver-shell.mobile-tab-mode .phone-mypage-hero,
  .phone--demo .phone-mypage-hero {
    padding: 0.42rem 0.45rem;
    gap: 0.4rem;
    border-radius: 12px;
  }

  #liver-shell.mobile-tab-mode .phone-mypage-hero__avatar,
  .phone--demo .phone-mypage-hero__avatar {
    width: 2rem;
    height: 2rem;
    font-size: 0.72rem;
  }

  #liver-shell.mobile-tab-mode .phone-mypage-hero__name,
  #lp-phone-demo .phone-mypage-hero__name,
  .phone--demo .phone-mypage-hero__name {
    font-size: 1.15rem !important;
    font-weight: 800;
    line-height: 1.2;
  }

  #liver-shell.mobile-tab-mode .phone-mypage-hero__league,
  .phone--demo .phone-mypage-hero__league {
    font-size: 0.62rem;
    padding: 0.06rem 0.28rem;
  }

  #liver-shell.mobile-tab-mode .phone-mypage-hero__meta,
  .phone--demo .phone-mypage-hero__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.1rem 0.32rem;
    margin-top: 0.06rem;
  }

  #liver-shell.mobile-tab-mode .phone-mypage-hero__meta .phone-mypage-hero__handle,
  #liver-shell.mobile-tab-mode .phone-mypage-hero__meta .phone-mypage-hero__agency,
  #liver-shell.mobile-tab-mode .phone-mypage-hero__meta .phone-mypage-hero__plan,
  .phone--demo .phone-mypage-hero__meta .phone-mypage-hero__handle,
  .phone--demo .phone-mypage-hero__meta .phone-mypage-hero__agency,
  .phone--demo .phone-mypage-hero__meta .phone-mypage-hero__plan {
    margin: 0;
    font-size: 0.77rem;
    line-height: 1.35;
    color: rgba(255, 255, 255, 0.48);
  }

  #liver-shell.mobile-tab-mode .phone-mypage-hero__meta .phone-mypage-hero__agency,
  .phone--demo .phone-mypage-hero__meta .phone-mypage-hero__agency {
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
    padding: 0.06rem 0.28rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.65);
    font-weight: 600;
  }

  #liver-shell.mobile-tab-mode .phone-mypage-hero__meta .phone-mypage-hero__plan,
  .phone--demo .phone-mypage-hero__meta .phone-mypage-hero__plan {
    color: rgba(255, 255, 255, 0.55);
  }

  /* レガシー（meta ラップ前のフォールバック） */
  #liver-shell.mobile-tab-mode .phone-mypage-hero__body > .phone-mypage-hero__handle:not(.phone-mypage-hero__meta *),
  .phone--demo .phone-mypage-hero__body > .phone-mypage-hero__handle:not(.phone-mypage-hero__meta *) {
    margin: 0.06rem 0 0;
    font-size: 0.62rem;
  }

  #liver-shell.mobile-tab-mode .phone-mypage-quick__btn,
  .phone--demo .phone-mypage-quick__btn {
    padding: 0.28rem 0.15rem;
    font-size: 0.62rem;
    gap: 0.08rem;
    border-radius: 8px;
  }

  #liver-shell.mobile-tab-mode .phone-mypage-quick__btn span:first-child,
  .phone--demo .phone-mypage-quick__btn span:first-child {
    font-size: 0.72rem;
  }

  #liver-shell.mobile-tab-mode .phone-mypage-card,
  .phone--demo .phone-mypage-card {
    padding: 0.42rem 0.45rem;
    border-radius: 10px;
  }

  #liver-shell.mobile-tab-mode .phone-mypage-card__label,
  .phone--demo .phone-mypage-card__label {
    font-size: 0.6rem;
    margin-bottom: 0.15rem;
    letter-spacing: 0.04em;
  }

  #liver-shell.mobile-tab-mode .phone-mypage-card__name,
  .phone--demo .phone-mypage-card__name {
    font-size: 0.92rem;
    line-height: 1.25;
  }

  #liver-shell.mobile-tab-mode .phone-mypage-meta,
  .phone--demo .phone-mypage-meta {
    gap: 0.22rem;
  }

  #liver-shell.mobile-tab-mode .phone-mypage-meta__row,
  .phone--demo .phone-mypage-meta__row {
    font-size: 0.72rem;
    gap: 0.35rem;
  }

  #liver-shell.mobile-tab-mode .phone-mypage-meta__row dt,
  .phone--demo .phone-mypage-meta__row dt {
    font-size: 0.62rem;
  }

  #liver-shell.mobile-tab-mode .phone-mypage-stat,
  .phone--demo .phone-mypage-stat {
    padding: 0.28rem 0.25rem;
  }

  #liver-shell.mobile-tab-mode .phone-mypage-stat__label,
  .phone--demo .phone-mypage-stat__label {
    font-size: 0.6rem;
  }

  /* 実アプリ mypage-card */
  #liver-shell.mobile-tab-mode .mypage-card {
    padding: 0.42rem 0.45rem;
    border-radius: 10px;
  }

  #liver-shell.mobile-tab-mode .mypage-card__label {
    font-size: 0.6rem;
    margin-bottom: 0.15rem;
  }

  #liver-shell.mobile-tab-mode .mypage-meta__row dt {
    font-size: 0.62rem;
  }

  #liver-shell.mobile-tab-mode .mypage-meta__row dd {
    font-size: 0.72rem;
  }

  #liver-shell.mobile-tab-mode .mypage-meta {
    gap: 0.22rem;
  }

  /* トレンドタブ · チャートラベル */
  #liver-shell.mobile-tab-mode .phone-trend-tab,
  .phone--demo .phone-trend-tab {
    font-size: 0.62rem;
    padding: 0.12rem 0.35rem;
  }

  #liver-shell.mobile-tab-mode .phone-bar-labels,
  .phone--demo .phone-bar-labels {
    font-size: 0.62rem;
    padding: 0.08rem 0 0.12rem;
  }

  #liver-shell.mobile-tab-mode .phone-mini-bars--demo,
  .phone--demo .phone-mini-bars--demo {
    height: 2rem;
  }

  /* ── 維持: KPI数値 · 勝率 · ダイヤ · TOPギフター ── */
  #liver-shell.mobile-tab-mode .phone-pk-hero__val,
  #lp-phone-demo .phone-pk-hero__val,
  .phone--demo .phone-pk-hero__val,
  #liver-shell.mobile-tab-mode .phone-vs-hero__count,
  #lp-phone-demo .phone-vs-hero__count,
  .phone--demo .phone-vs-hero__count {
    font-size: 1.55rem !important;
  }

  #liver-shell.mobile-tab-mode .phone-kpi__val,
  #liver-shell.mobile-tab-mode .phone-kpi__val--num,
  #lp-phone-demo .phone-kpi__val--num,
  .phone--demo .phone-kpi__val,
  .phone--demo .phone-kpi__val--num {
    font-size: clamp(0.85rem, 4.5vw, 1.1rem) !important;
  }

  #liver-shell.mobile-tab-mode .phone-stat-row span,
  #lp-phone-demo .phone-stat-row span,
  .phone--demo .phone-stat-row span,
  #liver-shell.mobile-tab-mode .phone-pk-career__val,
  .phone--demo .phone-pk-career__val,
  #liver-shell.mobile-tab-mode .phone-mypage-career__val,
  .phone--demo .phone-mypage-career__val,
  #liver-shell.mobile-tab-mode .pk-career__value,
  #liver-shell.mobile-tab-mode .pk-recent-row__vs,
  #liver-shell.mobile-tab-mode .gift-rank-row__diamonds,
  #liver-shell.mobile-tab-mode .gift-history-row__diamonds,
  #liver-shell.mobile-tab-mode .phone-mypage-card__id,
  .phone--demo .phone-mypage-card__id {
    /* 数値 · ダイヤ — 縮小対象外 */
  }

  #liver-shell.mobile-tab-mode .phone-pk-row span:nth-child(2),
  .phone--demo .phone-pk-row span:nth-child(2) {
    font-size: 1.1rem !important;
  }

  #liver-shell.mobile-tab-mode .phone-rank-list:not(.phone-rank-list--compact) li,
  #lp-phone-demo .phone-rank-list:not(.phone-rank-list--compact) li,
  .phone--demo .phone-rank-list:not(.phone-rank-list--compact) li {
    font-size: 1.16rem !important;
    padding: 0.4rem 0.45rem;
  }

  #liver-shell.mobile-tab-mode .phone-rank-list:not(.phone-rank-list--compact) li > span:nth-child(2),
  .phone--demo .phone-rank-list:not(.phone-rank-list--compact) li > span:nth-child(2) {
    font-size: inherit !important;
  }

  #liver-shell.mobile-tab-mode .phone-rank-list:not(.phone-rank-list--compact) em,
  .phone--demo .phone-rank-list:not(.phone-rank-list--compact) em {
    font-size: 1.04rem !important;
  }
}
