stock/stock-html/static/css/responsive.css

/* ═══════════════════════════════════════
   responsive.css - PC / 桌面端适配
   手机端保持现有样式不变
   断点: 768px (PC 及以上应用以下样式)
   ═══════════════════════════════════════ */

@media (min-width: 768px) {
    /* ===== 主容器 ===== */
    .container {
        max-width: 880px;
        padding: 28px 32px;
        padding-top: max(28px, env(safe-area-inset-top));
    }
    
    /* ===== 标题栏 ===== */
    .title-bar {
        flex-direction: row;
        align-items: center;
        margin-bottom: 24px;
    }
    
    .title-bar h1 {
        font-size: 22px;
    }
    
    .main-title-date {
        font-size: 15px;
    }
    
    .current-model {
        margin-top: 6px;
        font-size: 13px;
    }
    
    /* ===== 导航标签 ===== */
    .nav-tabs {
        margin-bottom: 24px;
        padding: 6px;
    }
    
    .nav-tabs-compact .nav-tab {
        padding: 12px 20px;
        font-size: 14px;
    }
    
    .sub-tabs {
        margin-bottom: 20px;
        padding: 4px;
    }
    
    .sub-tab {
        padding: 12px 18px;
        font-size: 14px;
    }
    
    /* ===== 提醒汇总区 ===== */
    .alerts-summary.top-summary {
        padding: 16px 24px;
        gap: 12px 16px;
    }
    
    .alerts-summary.top-summary .summary-label {
        font-size: 12px;
    }
    
    .alerts-summary.top-summary .summary-value {
        font-size: 20px;
    }
    
    /* ===== 卡片与区块 ===== */
    .card,
    .input-section,
    .scan-results {
        padding: 24px;
        border-radius: 18px;
    }
    
    .recommendation-card {
        padding: 28px;
        border-radius: 20px;
    }
    
    .signal-details {
        grid-template-columns: repeat(4, 1fr);
        gap: 16px;
    }
    
    .signal-detail-item .value {
        font-size: 20px;
    }
    
    /* ===== 图表 ===== */
    .chart-container {
        height: 240px;
    }
    
    /* ===== 数据表格 ===== */
    .data-table {
        font-size: 13px;
    }
    
    .data-table th,
    .data-table td {
        padding: 14px 12px;
    }
    
    /* ===== 汇总网格 ===== */
    .summary-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 16px;
    }
    
    .summary-item {
        padding: 20px;
    }
    
    .summary-item .value {
        font-size: 22px;
    }
    
    /* ===== 弹窗 / 模态框 ===== */
    .login-modal {
        max-width: 420px;
    }
    
    .confirm-dialog {
        min-width: 360px;
        max-width: 480px;
    }
    
    .smart-result-modal {
        max-width: 540px;
    }
    
    /* ===== 扫描控制 ===== */
    .scan-control {
        gap: 14px;
    }
    
    .scan-source-select {
        flex: 0 0 180px;
    }
    
    .scan-btn {
        padding: 16px 32px;
        font-size: 15px;
    }
    
    /* ===== 扫描结果项 ===== */
    .scan-item {
        padding: 12px 0;
    }
    
    .scan-code {
        font-size: 14px;
        min-width: 60px;
    }
    
    .scan-name {
        font-size: 13px;
    }
    
    .scan-price,
    .scan-rate {
        font-size: 14px;
    }
    
    /* ===== 按钮 ===== */
    .analyze-btn {
        height: 48px;
        font-size: 15px;
    }
    
    /* ===== 技术信号 ===== */
    .tech-result-card {
        padding: 20px;
    }
    
    .tech-result-header h4 {
        font-size: 16px;
    }
    
    /* ===== 模拟交易 ===== */
    .sim-stats-card {
        padding: 20px;
    }
    
    .sim-stats-header h4 {
        font-size: 18px;
    }
    
    .sim-stats-grid {
        gap: 12px;
    }
    
    .sim-stat-value {
        font-size: 15px;
    }
    
    .sim-stat-label {
        font-size: 11px;
    }
    
    /* ===== 信号排名 ===== */
    .signal-rank-item {
        grid-template-columns: 28px 80px 48px 1fr;
        padding: 8px 12px;
        font-size: 13px;
    }
    
    /* ===== 输入组 ===== */
    .input-group label {
        font-size: 13px;
    }
    
    .input-group input {
        padding: 16px 18px;
        font-size: 15px;
    }
    
    /* ===== Toast ===== */
    .toast-container {
        max-width: 420px;
    }
}

/* 更大屏幕 (1200px+) 进一步放宽 */
@media (min-width: 1200px) {
    .container {
        max-width: 1000px;
        padding: 32px 40px;
    }
    
    .signal-details {
        grid-template-columns: repeat(4, 1fr);
    }
}