<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>📊 政策速递</title>
    <style>
        * { margin: 0; padding: 0; box-sizing: border-box; }
        body {
            font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Helvetica Neue', sans-serif;
            background: linear-gradient(180deg, #0a0a1a 0%, #0d1b2a 100%);
            color: #e0e0e0;
            min-height: 100vh;
            max-width: 420px;
            margin: 0 auto;
            padding: 16px 16px 32px;
            -webkit-font-smoothing: antialiased;
        }

        /* 顶部标题 */
        .header {
            text-align: center;
            padding: 20px 0 16px;
        }
        .header h1 {
            font-size: 22px;
            background: linear-gradient(135deg, #00d2ff, #a855f7);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            letter-spacing: 1px;
        }
        .header .date {
            color: #666;
            font-size: 12px;
            margin-top: 4px;
        }

        /* 概览条 */
        .overview {
            display: flex;
            gap: 10px;
            margin-bottom: 20px;
        }
        .overview .pill {
            flex: 1;
            text-align: center;
            padding: 12px 0;
            border-radius: 12px;
            background: rgba(255,255,255,0.04);
            border: 1px solid rgba(255,255,255,0.06);
        }
        .pill .num {
            font-size: 28px;
            font-weight: 700;
            line-height: 1;
        }
        .pill .lbl {
            font-size: 11px;
            color: #888;
            margin-top: 4px;
        }
        .pill.green .num { color: #00e676; }
        .pill.red .num { color: #ff5252; }
        .pill.yellow .num { color: #ffd740; }

        /* 一句话总结 */
        .verdict {
            background: linear-gradient(135deg, rgba(0,230,118,0.12), rgba(0,210,255,0.08));
            border: 1px solid rgba(0,230,118,0.2);
            border-radius: 14px;
            padding: 14px 16px;
            margin-bottom: 20px;
            text-align: center;
            font-size: 15px;
            font-weight: 600;
            color: #00e676;
        }
        .verdict .sub {
            font-size: 12px;
            color: #888;
            font-weight: 400;
            margin-top: 4px;
        }

        /* 政策卡片 */
        .card {
            background: linear-gradient(135deg, #151525, #1a1a30);
            border-radius: 14px;
            padding: 16px;
            margin-bottom: 12px;
            border: 1px solid rgba(255,255,255,0.05);
            position: relative;
            overflow: hidden;
        }
        .card::before {
            content: '';
            position: absolute;
            left: 0; top: 0; bottom: 0;
            width: 4px;
        }
        .card.up::before { background: #00e676; }
        .card.down::before { background: #ff5252; }
        .card.flat::before { background: #ffd740; }

        .card-top {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 8px;
        }
        .tag {
            font-size: 11px;
            padding: 3px 10px;
            border-radius: 20px;
            font-weight: 500;
        }
        .tag.monetary { background: #1565c0; color: #fff; }
        .tag.fiscal { background: #7b1fa2; color: #fff; }
        .tag.industry { background: #2e7d32; color: #fff; }
        .tag.geopolitical { background: #e65100; color: #fff; }
        .tag.regulation { background: #c62828; color: #fff; }
        .tag.trade { background: #ef6c00; color: #fff; }

        .signal {
            font-size: 11px;
            font-weight: 600;
            padding: 3px 10px;
            border-radius: 20px;
        }
        .signal.bullish { background: rgba(0,230,118,0.15); color: #00e676; }
        .signal.bearish { background: rgba(255,82,82,0.15); color: #ff5252; }
        .signal.mixed { background: rgba(255,215,64,0.15); color: #ffd740; }

        .card-title {
            font-size: 15px;
            font-weight: 600;
            line-height: 1.5;
            margin-bottom: 10px;
        }

        .card-impact {
            display: flex;
            flex-direction: column;
            gap: 4px;
        }
        .card-impact .row {
            font-size: 12px;
            display: flex;
            align-items: flex-start;
            gap: 6px;
        }
        .card-impact .label {
            color: #888;
            white-space: nowrap;
            min-width: 36px;
        }
        .card-impact .val {
            color: #ccc;
            line-height: 1.4;
        }
        .card-impact .val.green { color: #00e676; }
        .card-impact .val.red { color: #ff5252; }

        /* 板块总结 */
        .sector-summary {
            margin-top: 20px;
            background: linear-gradient(135deg, #151525, #1a1a30);
            border-radius: 14px;
            padding: 16px;
            border: 1px solid rgba(255,255,255,0.05);
        }
        .sector-summary h3 {
            font-size: 14px;
            color: #888;
            margin-bottom: 12px;
        }
        .sector-row {
            display: flex;
            align-items: center;
            padding: 8px 0;
            border-bottom: 1px solid rgba(255,255,255,0.03);
        }
        .sector-row:last-child { border-bottom: none; }
        .sector-name {
            width: 60px;
            font-size: 13px;
            color: #aaa;
        }
        .sector-bar-wrap {
            flex: 1;
            height: 8px;
            background: rgba(255,255,255,0.05);
            border-radius: 4px;
            overflow: hidden;
            margin: 0 10px;
        }
        .sector-bar {
            height: 100%;
            border-radius: 4px;
            transition: width 0.6s ease;
        }
        .sector-bar.positive { background: linear-gradient(90deg, #00e676, #00c853); }
        .sector-bar.negative { background: linear-gradient(90deg, #ff5252, #d32f2f); }
        .sector-score {
            width: 32px;
            text-align: right;
            font-size: 12px;
            font-weight: 600;
        }
        .sector-score.positive { color: #00e676; }
        .sector-score.negative { color: #ff5252; }

        /* 底部 */
        .footer {
            text-align: center;
            color: #333;
            font-size: 11px;
            margin-top: 24px;
            padding-bottom: 20px;
        }
    </style>
</head>
<body>

    <div class="header">
        <h1>📰 政策速递</h1>
        <div class="date">2026年5月29日 · 国内+国际</div>
    </div>

    <!-- 概览 -->
    <div class="overview">
        <div class="pill green">
            <div class="num">4</div>
            <div class="lbl">🟢 利好</div>
        </div>
        <div class="pill red">
            <div class="num">1</div>
            <div class="lbl">🔴 利空</div>
        </div>
        <div class="pill yellow">
            <div class="num">2</div>
            <div class="lbl">🟡 中性</div>
        </div>
    </div>

    <!-- 一句话总结 -->
    <div class="verdict">
        📊 今日偏多，消费+科技双线受益
        <div class="sub">美联储鸽派 + 国内扩消费 + 央企加码研发</div>
    </div>

    <!-- 政策卡片 -->
    <div class="card up">
        <div class="card-top">
            <span class="tag monetary">货币政策</span>
            <span class="signal bullish">▲ 利好</span>
        </div>
        <div class="card-title">🇺🇸 美联储会议纪要释放鸽派信号</div>
        <div class="card-impact">
            <div class="row"><span class="label">利好</span><span class="val green">新兴市场 · 黄金 · 科技股</span></div>
            <div class="row"><span class="label">利空</span><span class="val red">美元</span></div>
        </div>
    </div>

    <div class="card up">
        <div class="card-top">
            <span class="tag fiscal">财政政策</span>
            <span class="signal bullish">▲ 利好</span>
        </div>
        <div class="card-title">🇨🇳 中央加力扩围提振消费</div>
        <div class="card-impact">
            <div class="row"><span class="label">利好</span><span class="val green">消费股 · 零售 · 家电 · 汽车</span></div>
            <div class="row"><span class="label">利空</span><span class="val">无</span></div>
        </div>
    </div>

    <div class="card up">
        <div class="card-top">
            <span class="tag fiscal">财政政策</span>
            <span class="signal bullish">▲ 利好</span>
        </div>
        <div class="card-title">🇨🇳 化债加力带动投资稳增长</div>
        <div class="card-impact">
            <div class="row"><span class="label">利好</span><span class="val green">基建 · 地方城投 · 银行</span></div>
        </div>
    </div>

    <div class="card down">
        <div class="card-top">
            <span class="tag geopolitical">地缘政治</span>
            <span class="signal bearish">▼ 利空</span>
        </div>
        <div class="card-title">🇺🇸 美将对巴西征收40%关税</div>
        <div class="card-impact">
            <div class="row"><span class="label">利空</span><span class="val red">巴西企业 · 大宗贸易</span></div>
            <div class="row"><span class="label">利好</span><span class="val green">替代供应链</span></div>
        </div>
    </div>

    <div class="card up">
        <div class="card-top">
            <span class="tag industry">产业政策</span>
            <span class="signal bullish">▲ 利好</span>
        </div>
        <div class="card-title">🇨🇳 商务部支持经开区算力基建</div>
        <div class="card-impact">
            <div class="row"><span class="label">利好</span><span class="val green">数据中心 · 云计算 · 半导体</span></div>
        </div>
    </div>

    <div class="card up">
        <div class="card-top">
            <span class="tag fiscal">财政政策</span>
            <span class="signal bullish">▲ 利好</span>
        </div>
        <div class="card-title">🇨🇳 央企基础研究投入加码</div>
        <div class="card-impact">
            <div class="row"><span class="label">利好</span><span class="val green">科技央企 · 芯片 · AI</span></div>
        </div>
    </div>

    <div class="card flat">
        <div class="card-top">
            <span class="tag geopolitical">地缘政治</span>
            <span class="signal mixed">◆ 中性</span>
        </div>
        <div class="card-title">🇺🇸 美官员计划下周访华</div>
        <div class="card-impact">
            <div class="row"><span class="label">偏多</span><span class="val green">贸易缓和预期 · 出口企业</span></div>
        </div>
    </div>

    <!-- 板块影响 -->
    <div class="sector-summary">
        <h3>📊 板块影响指数</h3>
        <div class="sector-row">
            <span class="sector-name">消费</span>
            <div class="sector-bar-wrap"><div class="sector-bar positive" style="width:90%"></div></div>
            <span class="sector-score positive">+85</span>
        </div>
        <div class="sector-row">
            <span class="sector-name">科技</span>
            <div class="sector-bar-wrap"><div class="sector-bar positive" style="width:78%"></div></div>
            <span class="sector-score positive">+75</span>
        </div>
        <div class="sector-row">
            <span class="sector-name">基建</span>
            <div class="sector-bar-wrap"><div class="sector-bar positive" style="width:72%"></div></div>
            <span class="sector-score positive">+70</span>
        </div>
        <div class="sector-row">
            <span class="sector-name">黄金</span>
            <div class="sector-bar-wrap"><div class="sector-bar positive" style="width:68%"></div></div>
            <span class="sector-score positive">+65</span>
        </div>
        <div class="sector-row">
            <span class="sector-name">半导体</span>
            <div class="sector-bar-wrap"><div class="sector-bar positive" style="width:62%"></div></div>
            <span class="sector-score positive">+60</span>
        </div>
        <div class="sector-row">
            <span class="sector-name">银行</span>
            <div class="sector-bar-wrap"><div class="sector-bar positive" style="width:55%"></div></div>
            <span class="sector-score positive">+55</span>
        </div>
        <div class="sector-row">
            <span class="sector-name">出口</span>
            <div class="sector-bar-wrap"><div class="sector-bar negative" style="width:35%"></div></div>
            <span class="sector-score negative">-35</span>
        </div>
    </div>

    <div class="footer">Powered by Hermes Agent · 政策新闻监控</div>

</body>
</html>
