/* ==========================================
   [V65.13] Mobile Responsive Design (细节打磨版)
   特性：隐藏赛道长度、图表空间优化、地图防裁剪
   ========================================== */
@media screen and (max-width: 999px) {
    
    /* --- 1. 全局布局 --- */
    body { 
        grid-template-rows: 44px 1fr 24px !important; 
        width: 100vw !important;
        max-width: 100vw !important;
        overflow-x: hidden !important;
    }
    header { padding: 0 8px; }
    .brand { font-size: 14px; }
    .live-badge { transform: scale(0.85); transform-origin: right center; }

    /* 上下分栏结构 - 保持单列 */
    .stage {
        grid-template-columns: 100% !important;
        grid-template-rows: 46vh 1fr !important; /* 地图占 46% */
        width: 100% !important;
        overflow-x: hidden !important;
    }

    /* --- 2. 列表行布局适配 (375px Challenge) --- */
    /* 目标：Left(160) + Widget(190) + Right(Rest) */
    
    /* [权重提升] 使用 html body 前缀以覆盖 JS 动态注入的 telemetry.css */
    
    html body .telemetry-row-context {
        padding: 0 2px !important; /* 极限压缩内边距 */
        justify-content: flex-start !important; /* [V65.15] 恢复默认的 Flex Start 对齐 */
    }

    /* 左侧列：增加至 160px，强制靠左 */
    html body .telemetry-row-context .col-left {
        width: 160px !important;
        flex: 0 0 160px !important;
        gap: 4px !important;
        margin-right: auto !important; /* [关键] 将 Widget 推向中间 */
    }
    /* 缩小左侧文字和排名 */
    html body .telemetry-row-context .rank-box { width: 20px !important; font-size: 16px !important; }
    html body .telemetry-row-context .driver-name { font-size: 13px !important; }
    
    /* 中间 Widget：增加至 190px (容纳 Gap)，绝对居中 */
    html body .telemetry-row-context .telemetry-widget {
        width: 190px !important;
        min-width: 190px !important;
        max-width: 190px !important;
        padding: 0 !important;
        gap: 2px !important;
        /* [V65.16] 绝对定位居中策略 */
        position: absolute !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        margin: 0 !important;
    }
    
    /* [离线模式适配] 扇区模块也要强制跟随 190px 并居中 */
    html body .telemetry-row-context .mod-sectors {
        width: 190px !important;
        min-width: 190px !important;
        max-width: 190px !important;
        /* [V65.16] 绝对定位居中策略 */
        position: absolute !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        margin: 0 !important;
    }
    /* 离线模式下，空间太小，隐藏 S1/S2/S3 的标签，只显示数字 */
    html body .telemetry-row-context .sec-label { display: block !important; }
    html body .telemetry-row-context .sector-box { 
        min-width: 0 !important; 
        padding: 0 4px !important; 
        flex: 1 !important;
    }
    html body .telemetry-row-context .sec-time { font-size: 13px !important; }

    /* 恢复 Gap 模块显示 (默认 Flex) */
    /* html body .telemetry-row-context .mod-gap { display: flex !important; } */
    /* 由于之前是 display:none，这里直接删除该规则即可，或者显式覆盖 */
    html body .telemetry-row-context .mod-gap { 
        display: flex !important; 
        width: 50px !important; /* 压缩 Gap 宽度以适应 190px */
    }
    /* 隐藏 Gap 内部的 Label 以节省空间 */
    html body .telemetry-row-context .gap-label { display: none !important; }
    
    /* 右侧列：占据剩余空间，强制靠右 */
    html body .telemetry-row-context .col-right {
        min-width: 0 !important;
        width: auto !important;
        flex: 1 !important;
        align-items: flex-end !important;
        margin-left: auto !important; /* [关键] 确保自己靠右 */
    }
    html body .telemetry-row-context .time-main { font-size: 16px !important; letter-spacing: 0 !important; }
    html body .telemetry-row-context .sub-label { display: none !important; } /* 隐藏标签以节省空间 */
    html body .telemetry-row-context .sub-value { font-size: 10px !important; }
    
    /* [V65.19] 架构级回滚与修复 */
    /* 1. 恢复 mod-status 到正常文档流，但使用相对定位微调 */
    html body .telemetry-row-context .mod-status {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important; /* 不再使用绝对定位飞来飞去 */
        left: auto !important;
        transform: none !important;
        margin-left: -10px !important; /* 紧贴左侧列 */
        margin-right: auto !important; /* 把它推向左边 */
        z-index: 20 !important;
        width: 30px !important;
        height: 100% !important;
        background: transparent !important;
    }

    /* 2. 中间 Widget 保持绝对居中 */
    html body .telemetry-row-context .telemetry-widget {
        width: 190px !important;
        min-width: 190px !important;
        max-width: 190px !important;
        padding: 0 !important;
        gap: 2px !important;
        
        position: absolute !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        margin: 0 !important;
        overflow: visible !important; /* 允许内部元素溢出 */
    }

    /* 3. 离线模式下的特殊处理：因为 mod-status 是 widget 的子元素 */
    /* 必须让 widget 内部的 flex 布局允许重叠或特定排列 */
    html body .telemetry-row-context .telemetry-widget {
        display: flex !important;
        justify-content: center !important; /* 让主要内容居中 */
        align-items: center !important;
    }
    
    /* 4. 将离线模式下的 mod-status 强行拉到 widget 的最右侧外 */
    html body .telemetry-row-context .telemetry-widget .mod-status {
        position: absolute !important;
        left: auto !important; /* 取消左侧定位 */
        right: -35px !important; /* 相对于 Widget 右边缘向右偏移 */
        top: 0 !important;
        transform: none !important;
        margin: 0 !important;
    }
    
    /* 微调左侧列，给 status 让出一点空间，防止极端情况下重叠 */
    html body .telemetry-row-context .col-left {
        /* 稍微减小左侧列宽度，避免与 status 撞车 */
        width: 130px !important; 
        flex: 0 0 130px !important;
    }

    /* --- 3. 地图面板 --- */
    .map-panel {
        order: 1; width: 100%;
        border-bottom: 1px solid var(--glass-border);
        position: relative !important;
        justify-content: center !important;
        align-items: center !important;
        padding: 0 !important;
        overflow: hidden;
    }
    
    /* [V65.14] 隐藏弹出地图按钮 */
    #btn-popout { display: none !important; }

    /* [适配] 新增 map-viewport 中间层适配 */
    #map-viewport {
        position: relative !important;
        width: 100% !important;
        height: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        overflow: hidden !important;
    }

    /* 图片限高适配 */
    #track-img {
        max-height: calc(46vh - 10px) !important; 
        width: auto !important; height: auto !important;
        display: block; margin: 0 !important;
        object-fit: contain;
    }
    
    #map-wrapper {
        display: inline-flex !important;
        position: relative !important;
        line-height: 0 !important;
        max-height: calc(46vh - 10px) !important;
        max-width: 100% !important;
        justify-content: center; 
        align-items: center;
    }

    /* --- 4. 赛道卡片 (优化：隐藏长度) --- */
    .track-info-card {
        top: 6px !important; left: 6px !important;
        transform: none !important; width: auto !important; max-width: 120px;
        height: 28px !important; padding: 0 8px !important;
        border-left-width: 3px !important;
        background: rgba(0, 0, 0, 0.4) !important; backdrop-filter: blur(2px);
        display: flex; flex-direction: column; justify-content: center;
        overflow: hidden; pointer-events: auto !important;
    }
    .track-info-card:active, .track-info-card:hover {
        height: auto !important; max-width: 260px;
        padding: 8px 12px !important; background: rgba(5, 5, 5, 0.95) !important; z-index: 1000;
    }
    
    .track-title { display: none; }
    .track-info-card:active .track-title, .track-info-card:hover .track-title { 
        display: block; font-size: 13px !important; margin-bottom: 4px; white-space: nowrap;
    }
    
    .track-title > span:nth-child(n+2) { display: none !important; }

    /* Session标签 */
    .session-label { 
        font-size: 11px !important; padding: 0 !important; border: none !important; 
        background: transparent !important; box-shadow: none !important; animation: none !important;
        display: flex; align-items: center;
    }
    .session-label::after { content: '▼'; font-size: 8px; margin-left: 4px; opacity: 0.5; }

    /* --- 5. 图表层布局 --- */
    #chart-speed { 
        top: 2px !important; height: 56% !important; 
        left: 2px !important; right: 2px !important; 
    }
    #chart-delta { 
        top: 58% !important; bottom: 20px !important; 
        left: 2px !important; right: 2px !important; 
    }
    .btn-close-chart { padding: 2px 6px; font-size: 9px; top: 0; right: 0; }

    /* --- 6. 其他组件 --- */
    .lb-panel { order: 2; width: 100%; border-right: none; }
    .tape-box { padding: 0 5px; }
    .tape-track-line::before, .tape-track-line::after { display: none; }
    .tape-marker.yellow-flag { display: none !important; }
    .log-window { display: none !important; }

    /* 隐藏旧版 Grid 布局规则 */
    .lb-grid.cols-2, .lb-grid.cols-3 { display: none !important; }
}