.reference{margin-top:28px;padding-top:24px;border-top:1px solid var(--line)}
.reference-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.reference-label{margin:0 0 4px;color:var(--accent);font-size:12px;font-weight:700}
.reference h2{margin:0;font-size:18px}
.reference-badge{padding:4px 8px;border-radius:4px;background:#e6edf3;color:#526171;font-size:12px;white-space:nowrap}
.reference-image-button{width:100%;margin-top:14px;padding:0;border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#11151b;color:#fff;cursor:zoom-in}
.reference-image-button img{display:block;width:100%;height:auto;max-height:430px;object-fit:contain}
.reference-image-button span{display:block;padding:9px;font-size:12px}
.reference-caption{margin:12px 0 0;color:#303b46;font-size:16px;line-height:1.8;font-weight:500}
.reference-pending{margin-top:14px;padding:22px;border:1px dashed #aeb9c3;background:#f8fafb;text-align:center}
.reference-pending strong{font-size:14px}.reference-pending p{margin:7px 0 0;color:var(--muted);font-size:13px;line-height:1.7}
.image-modal{position:fixed;inset:0;z-index:20;padding:24px;background:rgba(10,14,19,.84);display:grid;place-items:center}
.image-modal[hidden]{display:none}.image-modal-panel{width:min(100%,900px);max-height:calc(100vh - 48px);overflow:auto;background:#fff;border-radius:8px}
.image-modal-head{height:52px;padding:0 14px 0 18px;display:flex;align-items:center;justify-content:space-between}.image-modal-head h2{margin:0;font-size:15px}
.image-modal-head button{width:36px;height:36px;border:0;background:transparent;color:#34404c;font-size:28px;cursor:pointer}.image-modal-panel img{display:block;width:100%;height:auto}
body.modal-open{overflow:hidden}
.code-row{display:flex;align-items:center;justify-content:center;gap:14px;width:100%;min-height:88px}
.otp-display{width:330px;height:88px;display:grid;place-items:center;border:1px solid #cdd8e3;border-radius:6px;background:#f8fafc;overflow:hidden}
.copy-button{width:128px;height:44px;flex:0 0 128px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--accent);border-radius:6px;background:var(--accent);color:#fff;font:700 14px/1 Inter,"Microsoft YaHei",system-ui,sans-serif;letter-spacing:0;cursor:pointer;transition:background-color .15s,border-color .15s,color .15s,transform .08s}
.copy-button:hover:not(:disabled){border-color:var(--accent-dark);background:var(--accent-dark);color:#fff}
.copy-button:focus-visible{outline:3px solid rgba(25,114,210,.24);outline-offset:2px}
.copy-button:active:not(:disabled){transform:translateY(1px);background:#0f4f95;border-color:#0f4f95}
.copy-button:disabled{cursor:default;color:#8c98a3;background:#f2f4f6;border-color:#d7dde2}
.copy-button .copy-icon{font-size:18px;color:currentColor}.copy-label{font-size:14px;font-weight:700;letter-spacing:0;color:currentColor;white-space:nowrap}
@media(max-width:520px){.code-row{flex-direction:column;gap:10px;min-height:130px}.otp-display{width:100%;height:76px}.copy-button{width:128px;height:42px;flex-basis:42px}.copy-label{font-size:13px}}
footer{color:#46515c;font-size:15px;line-height:1.7;font-weight:500}
@media(max-width:520px){.reference{margin-top:22px}.reference-image-button img{max-height:none}.image-modal{padding:12px}.image-modal-panel{max-height:calc(100vh - 24px)}}
