/* ===== 自定义国旗图标 CSS（完整版，不依赖任何外部文件） ===== */

/* 基础样式 */
.fi {
    display: inline-block;
    width: 20px;
    height: 15px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    flex-shrink: 0;
}

/* ===== 所有国旗的内联 SVG 数据 ===== */

.fi-us {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 480'%3E%3Cpath fill='%23bd3d44' d='M0 0h640v480H0'/%3E%3Cpath stroke='%23fff' stroke-width='37' d='M0 55.3h640M0 129h640M0 203h640M0 277h640M0 351h640M0 425h640'/%3E%3Cpath fill='%23192f5d' d='M0 0h348.6v240H0'/%3E%3Cg fill='%23fff'%3E%3Cg id='d'%3E%3Cg id='c'%3E%3Cg id='b'%3E%3Cpath id='a' d='M0 0v8.5l7.3-4.7L0 0z' transform='rotate(22.5)'/%3E%3Cuse href='%23a' transform='rotate(45)'/%3E%3Cuse href='%23a' transform='rotate(67.5)'/%3E%3Cuse href='%23a' transform='rotate(90)'/%3E%3Cuse href='%23a' transform='rotate(112.5)'/%3E%3Cuse href='%23a' transform='rotate(135)'/%3E%3Cuse href='%23a' transform='rotate(157.5)'/%3E%3Cuse href='%23a' transform='rotate(180)'/%3E%3Cuse href='%23a' transform='rotate(202.5)'/%3E%3Cuse href='%23a' transform='rotate(225)'/%3E%3Cuse href='%23a' transform='rotate(247.5)'/%3E%3Cuse href='%23a' transform='rotate(270)'/%3E%3Cuse href='%23a' transform='rotate(292.5)'/%3E%3Cuse href='%23a' transform='rotate(315)'/%3E%3Cuse href='%23a' transform='rotate(337.5)'/%3E%3C/g%3E%3Ccircle cx='24' cy='24' r='3'/%3E%3C/g%3E%3Cuse href='%23c' x='50'/%3E%3Cuse href='%23c' x='100'/%3E%3Cuse href='%23c' x='150'/%3E%3Cuse href='%23c' x='200'/%3E%3Cuse href='%23c' x='250'/%3E%3Cuse href='%23c' x='300'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.fi-cn {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 480'%3E%3Cpath fill='%23de2910' d='M0 0h640v480H0'/%3E%3Cg fill='%23ffde00'%3E%3Cpath d='M90 40l8.4 25h27.4l-21.8 15.8 8.2 25.4-21.8-16L69 105.9 47.8 90l-21.6 16.2 8.2-25.4L12.6 65h27.4z'/%3E%3Cpath d='M212.2 81.3l5.3 16.2h17.2l-13.7 9.7 5.1 16.1-13.7-10-13.6 10.3 5.2-16.2-13.7-9.8h17.3zm-93.9 71.2l5.3 16.2h17.2l-13.7 9.7 5.1 16.1-13.7-10-13.6 10.3 5.2-16.2-13.7-9.8h17.3zm138.4-20.3l5.3 16.2h17.2l-13.7 9.7 5.1 16.1-13.7-10-13.6 10.3 5.2-16.2-13.7-9.8h17.3zm-115 66.8l5.3 16.2h17.2l-13.7 9.7 5.1 16.1-13.7-10-13.6 10.3 5.2-16.2-13.7-9.8h17.3zm183.4-83.2l6.6-15.7 17.4.8-13.9 10.2 7.2 15.4-15.7-6.2-15.8 6.4 7.2-15.4-13.9-10.2z'/%3E%3C/g%3E%3C/svg%3E");
}

.fi-tw {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect width='900' height='600' fill='%23fe0000'/%3E%3Crect x='0' y='0' width='600' height='400' fill='%23000095'/%3E%3Ccircle cx='300' cy='200' r='140' fill='%23fff'/%3E%3Ccircle cx='300' cy='200' r='110' fill='%23fe0000'/%3E%3C/svg%3E");
}

.fi-it {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect width='300' height='600' fill='%23009246'/%3E%3Crect x='300' width='300' height='600' fill='%23fff'/%3E%3Crect x='600' width='300' height='600' fill='%23ce2b37'/%3E%3C/svg%3E");
}

.fi-in {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect width='900' height='200' fill='%23ff9933'/%3E%3Crect y='200' width='900' height='200' fill='%23fff'/%3E%3Crect y='400' width='900' height='200' fill='%23138808'/%3E%3Ccircle cx='450' cy='300' r='60' fill='%23138808'/%3E%3Ccircle cx='450' cy='300' r='55' fill='%23fff'/%3E%3Ccircle cx='450' cy='300' r='50' fill='%23138808'/%3E%3C/svg%3E");
}

.fi-bd {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect width='900' height='600' fill='%23006a4e'/%3E%3Ccircle cx='430' cy='300' r='180' fill='%23f42a41'/%3E%3C/svg%3E");
}

.fi-id {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect width='900' height='300' fill='%23ce1126'/%3E%3Crect y='300' width='900' height='300' fill='%23fff'/%3E%3C/svg%3E");
}

.fi-fr {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 480'%3E%3Cpath fill='%23000' d='M0 0h213.3v480H0'/%3E%3Cpath fill='%23fff' d='M213.3 0h213.3v480H213.3'/%3E%3Cpath fill='%23ce1126' d='M426.7 0H640v480H426.7'/%3E%3C/svg%3E");
}

.fi-es {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 750 500'%3E%3Crect width='750' height='500' fill='%23c60b1e'/%3E%3Crect width='750' height='166.7' y='166.7' fill='%23ffc400'/%3E%3Crect width='750' height='166.7' y='333.3' fill='%23c60b1e'/%3E%3C/svg%3E");
}

.fi-pt {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 400'%3E%3Crect width='600' height='400' fill='%23006000'/%3E%3Crect width='400' height='400' fill='%23da291c'/%3E%3Ccircle cx='300' cy='200' r='120' fill='%23ffb300'/%3E%3Ccircle cx='300' cy='200' r='90' fill='%23da291c'/%3E%3C/svg%3E");
}

.fi-de {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 600'%3E%3Crect width='1000' height='200' fill='%23000'/%3E%3Crect y='200' width='1000' height='200' fill='%23dd0000'/%3E%3Crect y='400' width='1000' height='200' fill='%23ffce00'/%3E%3C/svg%3E");
}

.fi-sa {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 750 500'%3E%3Crect width='750' height='500' fill='%231d8a42'/%3E%3Cpath d='M0 250l112.5-75 112.5 75-112.5 75z' fill='%23fff'/%3E%3Cpath d='M112.5 250l112.5-75 112.5 75-112.5 75z' fill='%23fff'/%3E%3C/svg%3E");
}

.fi-ru {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect width='900' height='200' fill='%23fff'/%3E%3Crect y='200' width='900' height='200' fill='%230052b5'/%3E%3Crect y='400' width='900' height='200' fill='%23d52b1e'/%3E%3C/svg%3E");
}

.fi-jp {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect width='900' height='600' fill='%23fff'/%3E%3Ccircle cx='450' cy='300' r='200' fill='%23bc002d'/%3E%3C/svg%3E");
}

.fi-kr {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect width='900' height='600' fill='%23fff'/%3E%3Ccircle cx='450' cy='300' r='200' fill='%23cd2e3a'/%3E%3Ccircle cx='450' cy='300' r='150' fill='%23fff'/%3E%3C/svg%3E");
}