/* ========================================================
   CHAOS CALL — モバイル軽量版 §13対応

   方針：
   Desktop = フル機能・フル演出
   Mobile  = LIVE/FEATURED・NEWS・GAMES/COMICS/STORE・
             ブログ記事一覧/詳細 のみ残す

   非表示にする要素：
   - HERO内の円形HUD（SYSTEM STATUS等の演出パネル）
   - NETWORK OVERVIEW パネル
   - WORLD MAP ANALYSIS
   - BLOG RANKING（ランキングUI）
   - COMMUNITY セクションの装飾（SNSリンクの簡易表示は残す）
   - 複雑なHUD演出・スキャンライン等のアニメーション全般
   ======================================================== */

@media (max-width: 768px) {

    /* --- HERO：円形HUDとNETWORK OVERVIEWを非表示 --- */
    .cc-hero__side,
    .cc-hud-circle,
    .cc-network-overview {
        display: none !important;
    }

    .cc-hero {
        min-height: auto;
    }

    .cc-hero__inner {
        grid-template-columns: 1fr;
        padding: 48px 20px;
    }

    .cc-hero__copy p {
        max-width: 100%;
    }

    /* --- HERO背景：動画/自動生成アニメーション/サイバーグリッドは
       重い演出のため軽量版では止め、下地のグラデーションのみ残す --- */
    .cc-hero__bg-video,
    .cc-hero__bg-canvas,
    .cc-hero__bg-grid {
        display: none !important;
    }
    .cc-hero__bg-image {
        animation: none !important;
    }

    /* --- LATEST NEWS + LIVE OPERATION は縦積みで維持 --- */
    .cc-news-live {
        grid-template-columns: 1fr;
        padding: 32px 20px;
        gap: 16px;
    }

    /* --- GAMES / COMICS / STORE は縦積み3枚で維持 --- */
    .cc-cards {
        grid-template-columns: 1fr;
        padding: 0 20px 32px;
        gap: 14px;
    }

    /* 縦積みだと横幅が広いので、テキスト制限とカード高さをモバイル向けに調整 */
    .cc-card {
        min-height: 170px;
    }
    .cc-card__body {
        max-width: 82%;
    }

    /* --- BLOG RANKING セクション自体を非表示 --- */
    .cc-ranking {
        display: none !important;
    }

    /* --- COMMUNITY：装飾を削ぎ落として簡易リンクのみ --- */
    .cc-community {
        padding: 20px;
        flex-direction: column;
        align-items: flex-start;
    }

    /* --- 複雑な演出系アニメーションを停止 --- */
    .cc-hud-circle::before,
    .cc-loading-spinner {
        animation: none !important;
    }

    /* --- 広告枠：モバイルではサイズを縮小 --- */
    .cc-ad-slot {
        min-height: 90px;
        font-size: 10px;
    }
}

/* body.cc-mobile-lite は functions.php の body_class フィルターで付与。
   JS側でのGA4ポーリング停止などの判定にも使用する（hud.js側でCC_HUD_DATA.isMobileを参照）。 */
