.xn-passport *{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
.xn-passport{
    background: #eef2f5;
    font-family: 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
    line-height: 1.5;
    color: #1a2c3e;
    padding: 32px 16px;
}
.xn-passport .doc-container{
    max-width: 1280px;
    margin: 0 auto;
    background: white;
    border-radius: 28px;
    box-shadow: 0 20px 35px -12px rgba(0,0,0,0.15);
    padding: 32px 32px 40px;
    transition: all 0.2s;
}

@media print {
.xn-passport{
        background: white;
        padding: 0;
    }
.xn-passport .doc-container{
        box-shadow: none;
        padding: 12.8px;
    }
.xn-passport .qr-code-area,.xn-passport .lang-selector{
        display: none;
    }
}
.xn-passport .header-main{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 24px;
    margin-bottom: 8px;
}
.xn-passport .header-left{
    flex: 1;
    min-width: 200px;
}
.xn-passport .qr-wrapper{
    flex-shrink: 0;
    text-align: right;
}
.xn-passport .qr-code-area{
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    background: #ffffff;
    border-radius: 16px;
    padding: 8px 10px 10px 10px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    border: 1px solid #e2edf2;
}
.xn-passport .qr-code-area img{
    width: 2.16cm;
    height: 2.16cm;
    border-radius: 8px;
    object-fit: contain;
}
.xn-passport .qr-label{
    font-size: 11.2px;
    color: #1f7b60;
    margin-top: 6px;
    font-weight: 600;
    background: #eff7f3;
    padding: 2px 8px;
    border-radius: 30px;
}
.xn-passport .lang-selector{
    background: white;
    border-radius: 40px;
    border: 1px solid #cbdde6;
    padding: 4.8px 12.8px;
    font-size: 12.8px;
    font-weight: 500;
    cursor: pointer;
    outline: none;
    color: #1f5e4b;
    min-width: 200px;
}
.xn-passport .subhead{
    color: #2c5a4a;
    border-bottom: 2px solid #cbdde6;
    padding-bottom: 12px;
    margin-bottom: 28.8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}
.xn-passport h1{
    font-size: 30.4px;
    font-weight: 700;
    color: #0b3b2f;
    border-left: 6px solid #2e7d64;
    padding-left: 16px;
    margin-bottom: 9.6px;
}
.xn-passport .h1-sub{
    font-size: 20.8px;
    font-weight: 500;
    display: inline-block;
    color: #2c5a4a;
}
.xn-passport h2{
    font-size: 24px;
    margin-top: 28.8px;
    margin-bottom: 16px;
    font-weight: 600;
    color: #1d5a48;
    border-bottom: 2px solid #d4e2e9;
    padding-bottom: 4.8px;
}
.xn-passport h3{
    font-size: 20px;
    margin: 19.2px 0 11.2px 0;
    font-weight: 600;
    color: #1d4e3f;
}
.xn-passport .two-column-layout{
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
    margin: 16px 0;
}
.xn-passport .left-col{
    flex: 1;
    min-width: 260px;
}
.xn-passport .right-col{
    flex: 1;
    min-width: 260px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.xn-passport .info-card{
    background: #f8fafc;
    border-radius: 20px;
    padding: 19.2px 24px;
    border: 1px solid #e2edf2;
    height: fit-content;
}
.xn-passport .spec-list{
    list-style: none;
    padding: 0;
}
.xn-passport .spec-list li{
    padding: 6.4px 0;
    border-bottom: 1px dashed #d0e0e8;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.xn-passport .spec-label{
    font-weight: 700;
    width: 180px;
    color: #1c5a48;
}
.xn-passport .spec-value{
    flex: 1;
    color: #1f2f3a;
}
.xn-passport .brand-value{
    word-break: break-word;
    white-space: normal;
    display: inline-block;
}
.xn-passport table{
    width: 100%;
    border-collapse: collapse;
    margin: 16px 0;
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
}
.xn-passport th,.xn-passport td{
    border: 1px solid #cfe2ea;
    padding: 11.2px 16px;
    text-align: left;
    vertical-align: top;
}
.xn-passport th{
    background: #e6f0f4;
    font-weight: 700;
    color: #124e3e;
}
.xn-passport .warning-box,.xn-passport .caution-box{
    border-radius: 20px;
    padding: 19.2px 24px;
    margin: 19.2px 0;
    background: #fff7e5;
    border-left: 6px solid #e67e22;
}
.xn-passport .caution-box{
    background: #fff1f0;
    border-left-color: #c0392b;
}
.xn-passport .warning-icon{
    font-weight: 800;
    font-size: 17.6px;
    margin-right: 8px;
}
.xn-passport .list-bullet{
    padding-left: 24px;
    margin: 11.2px 0;
}
.xn-passport .list-bullet li{
    margin: 8px 0;
}
.xn-passport .compliance-badge{
    background: #e2f0ea;
    padding: 12.8px 19.2px;
    border-radius: 18px;
    font-size: 14.4px;
    margin: 16px 0;
    border: 1px solid #bdd9cf;
}
.xn-passport hr{
    margin: 19.2px 0;
    border: none;
    height: 1px;
    background: linear-gradient(to right, #cce0e8, transparent);
}
.xn-passport footer{
    margin-top: 32px;
    padding-top: 16px;
    text-align: center;
    font-size: 12px;
    color: #5b7f8c;
    border-top: 1px solid #d4e2e9;
}
.xn-passport a{
    color: #1f7b60;
    text-decoration: none;
}
.xn-passport a:hover{
    text-decoration: underline;
}


@media (max-width: 680px) {
.xn-passport .doc-container{
        padding: 19.2px;
    }
.xn-passport .spec-label{
        width: 120px;
    }
.xn-passport h1{
        font-size: 24px;
    }
.xn-passport .h1-sub{
        font-size: 16px;
        display: block;
        margin-top: 3.2px;
    }
.xn-passport .header-main{
        flex-direction: column;
        align-items: stretch;
    }
.xn-passport .qr-wrapper{
        text-align: center;
        display: flex;
        justify-content: center;
    }
.xn-passport .lang-selector{
        width: 100%;
        margin-top: 8px;
    }
.xn-passport .two-column-layout{
        flex-direction: column;
    }
.xn-passport .marking-icons img,.xn-passport .warning-icon-right img{
        width: 2cm;
    }
}
.xn-passport .lang-switch-area{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
    margin-bottom: 16px;
}
.xn-passport .perf-table-note{
    font-size: 13.6px;
    margin-top: 8px;
    padding: 8px 0;
    color: #2c5a4a;
    background: #f9fbfd;
    border-left: 3px solid #2e7d64;
    padding-left: 16px;
}
.xn-passport .marking-icons{
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    align-items: center;
    justify-content: flex-start;
    margin: 16px 0 24px;
    background: #f9fdfe;
    padding: 16px;
    border-radius: 24px;
    border: 1px solid #e2edf2;
}
.xn-passport .marking-icons .icon-item{
    text-align: center;
    min-width: 100px;
}
.xn-passport .marking-icons img{
    width: 4cm;
    height: auto;
    object-fit: contain;
    display: block;
    margin: 0 auto;
}
.xn-passport .eu-representative-card{
    background: #f8fafc;
    border-radius: 20px;
    padding: 19.2px 24px;
    border: 1px solid #e2edf2;
}
.xn-passport .eu-representative-card h3{
    margin-top: 0;
}
.xn-passport .spec-list-eu{
    list-style: none;
    padding: 0;
}
.xn-passport .spec-list-eu li{
    padding: 6.4px 0;
    border-bottom: 1px dashed #d0e0e8;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.xn-passport .spec-label-eu{
    font-weight: 700;
    width: 150px;
    color: #1c5a48;
}
.xn-passport .battery-warning-blackbox{
    background-color: #000000;
    border-radius: 16px;
    padding: 24px;
    margin: 16px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    color: #ffffff;
}
.xn-passport .warning-text-section{
    flex: 2;
    min-width: 200px;
}
.xn-passport .warning-text-section .warning-head{
    background-color: #ffcc00;
    color: #000000;
    display: inline-block;
    padding: 3.2px 16px;
    font-weight: bold;
    font-size: 22.4px;
    margin-bottom: 12px;
    border-radius: 8px;
}
.xn-passport .warning-text-section .warning-head i{
    color: #000000;
    margin-right: 8px;
}
.xn-passport .warning-text-section .keep-out{
    font-weight: bold;
    font-size: 19.2px;
    margin: 8px 0;
    background: white;
    color: black;
    display: inline-block;
    padding: 1.6px 12.8px;
    border-radius: 6px;
}
.xn-passport .warning-text-section .warning-desc{
    font-size: 14.4px;
    line-height: 1.4;
    color: #eeeeee;
    background: white;
    color: black;
    padding: 4.8px 12.8px;
    border-radius: 6px;
    display: inline-block;
}
.xn-passport .warning-icon-right{
    flex: 0 0 auto;
}
.xn-passport .warning-icon-right img{
    width: 5cm;
    height: auto;
    display: block;
}

@media (max-width: 680px) {
.xn-passport .battery-warning-blackbox{
        flex-direction: column;
        align-items: flex-start;
    }
.xn-passport .warning-icon-right{
        align-self: center;
    }
.xn-passport .marking-icons img{
        width: 2cm;
    }
}
.xn-passport .file-links{
    margin: 16px 0 24px;
    background: #f1f6f9;
    padding: 16px;
    border-radius: 20px;
}
.xn-passport .file-links a{
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
}
.xn-passport .symbol-row{
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin: 16px 0;
}
.xn-passport .symbol-item{
    display: flex;
    align-items: center;
    gap: 24px;
}
.xn-passport .symbol-icon{
    flex-shrink: 0;
    width: 60px;
    text-align: center;
}
.xn-passport .symbol-icon img{
    max-width: 50px;
    max-height: 50px;
}
.xn-passport .symbol-text{
    flex: 1;
}
.xn-passport .qr-code-area{
    display: flex;
    flex-direction: column;
    align-items: center;    
    justify-content: center; 
}
.xn-passport #qrCodeContainer{
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;         
}




.xn-passport .lang-switch{
            position: absolute;
            top: 20px;
            right: 20px;
            display: flex;
            gap: 8px;
        }
.xn-passport .lang-btn{
            background: #f0f4f8;
            border: 1px solid #cbdde6;
            padding: 6px 12px;
            border-radius: 30px;
            cursor: pointer;
            font-size: 12.8px;
            transition: 0.2s;
        }
.xn-passport .lang-btn.active{
            background: #2e7d64;
            color: white;
            border-color: #2e7d64;
        }
.xn-passport .doc-container{
            position: relative;
        }
.xn-passport .search-area{
            margin: 24px 0;
            display: flex;
            justify-content: center;
        }
.xn-passport .search-box{
            width: 100%;
            max-width: 580px;
            padding: 12px 20px;
            font-size: 16px;
            border: 1px solid #cbdde6;
            border-radius: 40px;
            outline: none;
            transition: all 0.2s;
            background: white;
        }
.xn-passport .search-box:focus{
            border-color: #2e7d64;
            box-shadow: 0 0 0 3px rgba(46,125,100,0.2);
        }
.xn-passport .table-container{
            overflow-x: auto;
        }
.xn-passport .battery-table{
            width: 100%;
            border-collapse: collapse;
            margin: 16px 0;
            background: white;
            border-radius: 16px;
            overflow: hidden;
        }
.xn-passport .battery-table th,.xn-passport .battery-table td{
            border: 1px solid #cfe2ea;
            padding: 8px 12px;
            text-align: left;
            vertical-align: middle;
        }
.xn-passport .battery-table th{
            background: #e6f0f4;
            font-weight: 700;
            color: #124e3e;
        }
.xn-passport .download-link{
            color: #1f7b60;
            text-decoration: none;
            font-weight: 500;
            cursor: pointer;
            display: inline-flex;
            align-items: center;
            gap: 6px;
        }
.xn-passport .download-link:hover{
            text-decoration: underline;
        }
.xn-passport .detail-link{
            color: #1f7b60;
            text-decoration: none;
            font-weight: 500;
        }
.xn-passport .detail-link:hover{
            text-decoration: underline;
        }
.xn-passport .no-results{
            text-align: center;
            padding: 32px;
            color: #6c757d;
            font-style: italic;
        }
        @media (max-width: 680px) {
.xn-passport .battery-table th,.xn-passport .battery-table td{
                padding: 6px 8px;
                font-size: 13.6px;
            }
.xn-passport .search-box{
                max-width: 90%;
                padding: 10px 16px;
            }
.xn-passport .lang-switch{
                position: static;
                justify-content: flex-end;
                margin-bottom: 16px;
            }
.xn-passport .doc-container{
                padding-top: 16px;
            }
        }
    

.xn-passport .doc-grid{
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 19.2px;
            margin: 16px 0;
        }
.xn-passport .doc-grid>.info-card{ margin: 0; }
.xn-passport .doc-full{
            grid-column: 1 / -1;
        }
.xn-passport .doc-top-row{
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin: 9.6px 0 12.8px;
            flex-wrap: wrap;
            gap: 8px;
        }
.xn-passport .doc-no-area{
            color: #555;
            font-size: 15.2px;
            white-space: nowrap;
        }
.xn-passport .doc-table{ width: 100%; border-collapse: collapse; }
.xn-passport .doc-table td{ padding: 6.4px 9.6px; vertical-align: top; }
.xn-passport .doc-table tr{ border-bottom: 1px solid #eee; }
.xn-passport .doc-table tr:last-child{ border-bottom: none; }
.xn-passport .doc-label-col{ width: 180px; font-weight: bold; color: #444; }
.xn-passport .na-badge{
            display: inline-block;
            background: #e8e8e8;
            color: #666;
            padding: 2.4px 9.6px;
            border-radius: 12px;
            font-size: 13.6px;
            font-weight: normal;
            margin-left: 6.4px;
        }
.xn-passport .compliant-badge{
            display: inline-block;
            background: #d4edda;
            color: #155724;
            padding: 2.4px 9.6px;
            border-radius: 12px;
            font-size: 13.6px;
            font-weight: normal;
            margin-left: 6.4px;
        }
.xn-passport .signature-grid{
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 24px;
        }
.xn-passport .sig-card{
            background: #f8fafb;
            padding: 19.2px;
            border-radius: 10px;
            border: 1px solid #dce9ef;
        }
.xn-passport .sig-line{
            margin-top: 24px;
            border-bottom: 1px solid #333;
            width: 200px;
        }
.xn-passport .substance-table td{ padding: 4.8px 9.6px; }
.xn-passport .substance-table th{ text-align: left; padding: 4.8px 9.6px; background: #f5f5f5; }
.xn-passport .doc-image-caption{
            font-size: 13.6px;
            color: #888;
            margin-top: 4.8px;
            text-align: center;
        }
.xn-passport .related-docs-title{
            margin: 32px 0 8px;
            font-size: 20.8px;
            color: #333;
        }

        @media (max-width: 768px) {
.xn-passport .doc-grid{
                grid-template-columns: 1fr;
            }
.xn-passport .doc-label-col{ width: 120px; }
.xn-passport .signature-grid{
                grid-template-columns: 1fr;
            }
.xn-passport .doc-grid>.info-card{ order: 0; }
        }
    

.xn-passport .lang-switch a{text-decoration:none;font-family:Arial,sans-serif;font-size:12.8px;line-height:normal}
.xn-passport .qly-footer-menu{display:flex;justify-content:center;gap:12px;font-size:12px;text-align:center}
.xn-passport .qly-logo{max-width:150px;max-height:44px;object-fit:contain}
.xn-passport [hidden]{display:none!important}
.xn-passport .qly-banner{margin:24px 0}
.xn-passport .qly-banner img{max-width:100%;border-radius:16px}
.xn-passport #qly-document-dialog{margin:auto;max-width:min(92vw,480px);padding:32px;border:1px solid #cbdde6;border-radius:20px;color:#1a2c3e;box-shadow:0 20px 40px #0003}
.xn-passport #qly-document-dialog::backdrop{background:#1a2c3e88}
.xn-passport #qly-document-dialog p{margin:16px 0}
.xn-passport .qly-dialog-close{float:right;border:0;background:transparent;font-size:28.8px;cursor:pointer}
.xn-passport a:focus-visible,.xn-passport button:focus-visible,.xn-passport select:focus-visible{outline:3px solid #2e7d64;outline-offset:3px}
@media(prefers-reduced-motion:no-preference){
.xn-passport .battery-table tbody tr{transition:background-color .18s ease}
.xn-passport .battery-table tbody tr:hover{background-color:#f4faf7}
.xn-passport a,.xn-passport button{transition:color .18s ease,background-color .18s ease}
.xn-passport #qly-document-dialog[open]{animation:qly-enter .2s ease-out}
 @keyframes qly-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
}
@media(max-width:680px){
.xn-passport:lang(en) .spec-value{min-width:0;overflow-wrap:anywhere}
.xn-passport .doc-label-col{overflow-wrap:anywhere}
}
@media print{
.xn-passport .lang-switch,.xn-passport .qly-footer-menu{display:none}}
.xn-passport .lang-switch a:not(.active){color:#1a2c3e}
.xn-passport{padding:32px 16px}
@media print{
.xn-passport{padding:0}}

@media(max-width:340px){
.xn-passport .left-col,.xn-passport .right-col{min-width:0}
.xn-passport .spec-value{min-width:0;overflow-wrap:anywhere}}




@media(min-width:681px){
.xn-passport .qly-home .header-main h1{padding-right:225px}}
.xn-passport .qly-footer-menu{flex-wrap:wrap}
.xn-passport .qly-table-scroll{display:contents}
@media(max-width:680px){
.xn-passport .qly-table-scroll.is-overflowing{display:block;overflow-x:auto;overscroll-behavior-x:contain;margin:16px 0}
.xn-passport .qly-table-scroll.is-overflowing>table{margin:0}}
.xn-passport .doc-container>.qly-footer-menu{margin:12px 0 20px}

.xn-passport{padding:55px 0;background:#fff;font-family:inherit;color:#333;min-width:0}
.xn-passport .doc-container{border-radius:0;box-shadow:none;padding:0;max-width:1200px}
.xn-passport .lang-switch{position:static;justify-content:flex-end;margin-bottom:20px}
.xn-passport .qly-home .header-main h1{padding-right:0;color:#333}
.xn-passport .battery-table{width:100%;font-family:inherit}
.xn-passport .lang-btn,.xn-passport .download-link,.xn-passport .detail-link{font-family:inherit}
.xn-passport .lang-btn.active{background:#0576b9;border-color:#0576b9}
.xn-passport .qly-logo{display:none}
.xn-passport h1,.xn-passport h2,.xn-passport h3{font-family:inherit}
@media(max-width:950px){.xn-passport{padding:30px 0}.xn-passport .doc-container{padding:0 15px}}
@media print{.head-wrapper,.foot-wrapper,.scrollsidebar,#gotoTop{display:none!important}.xn-passport{padding:0}}

.xn-passport{font-size:16px}.xn-passport .header-left{min-width:0;overflow-wrap:anywhere}.xn-passport .left-col,.xn-passport .right-col{min-width:0}.xn-passport .doc-container{min-width:0;width:100%}.xn-passport .doc-table{overflow-wrap:anywhere}

.xn-passport .battery-table th{background:#e9f9fd;color:#333}.xn-passport .download-link,.xn-passport .detail-link{color:#009ac5}.xn-passport .lang-btn.active{background:#1bbce0;border-color:#1bbce0}.xn-passport .search-box:focus{border-color:#1bbce0;box-shadow:0 0 0 3px #1bbce01a}

.xn-passport .qly-family-tabs{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:-12px 0 28px}
.xn-passport .qly-family-tabs button{font:inherit;cursor:pointer}
.xn-passport .qly-home .lang-switch{position:static;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px;margin-bottom:20px}
@media(max-width:680px){.xn-passport .qly-family-tabs{margin:0 0 22px}.xn-passport .qly-home .lang-switch{justify-content:flex-start}.xn-passport .qly-home .lang-switch .lang-btn{font-size:12px;padding:6px 10px}}

@media(min-width:1200px){
 html:not([lang="zh-CN"]):not([lang="en-US"]) .xn-module-body .head-layout{display:flex;align-items:center;gap:20px;padding-right:190px}
 html:not([lang="zh-CN"]):not([lang="en-US"]) .xn-module-body .head-layout .logo{width:130px;flex:0 0 130px;margin-right:0}
 html:not([lang="zh-CN"]):not([lang="en-US"]) .xn-module-body .nav-bar{flex:1;min-width:0}
 html:not([lang="zh-CN"]):not([lang="en-US"]) .xn-module-body .nav{display:flex;align-items:center;white-space:nowrap}
 html:not([lang="zh-CN"]):not([lang="en-US"]) .xn-module-body .head-layout .nav>li{margin-right:12px}
 html:not([lang="zh-CN"]):not([lang="en-US"]) .xn-module-body .nav>li>a{font-size:12px}
}