:root{color:#111;background:#f6f7fb;font-family:Arial,sans-serif}body{margin:0}a{color:inherit;text-decoration:none}.container{max-width:1100px;margin:0 auto;padding:24px}.nav{background:#fff;border-bottom:1px solid #e5e7eb;align-items:center;gap:12px;padding:16px 24px;display:flex;position:sticky;top:0}.nav a{border-radius:10px;padding:8px 12px}.card{background:#fff;border-radius:18px;padding:20px;box-shadow:0 2px 10px #0000000f}.grid{gap:16px;display:grid}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.btn{color:#fff;cursor:pointer;background:#111827;border:none;border-radius:12px;padding:10px 16px;display:inline-block}.btn.secondary{color:#111;background:#e5e7eb}.btn.disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.input,select{border:1px solid #d1d5db;border-radius:10px;width:100%;margin-top:6px;padding:10px 12px}.label{margin-bottom:12px;display:block}.badge{background:#eef2ff;border-radius:999px;padding:4px 8px;font-size:12px;display:inline-block}.table{border-collapse:collapse;width:100%}.table th,.table td{text-align:left;border-bottom:1px solid #e5e7eb;padding:10px}.hero{background:linear-gradient(135deg,#dbeafe,#ede9fe);padding:40px 24px}.code{color:#fff;background:#111827;border-radius:10px;padding:8px 10px;font-family:monospace;display:inline-block}@media (width<=800px){.grid-2,.grid-3{grid-template-columns:1fr}}.qrmail-page{justify-content:center;display:flex}.qrmail-card{background:#fff;border:1px solid #eaeaea;border-radius:16px;width:100%;max-width:420px;overflow:hidden;box-shadow:0 4px 15px #00000014}.qrmail-head{color:#fff;background:linear-gradient(135deg,#ff66a6,#ff80b5);justify-content:center;align-items:center;gap:8px;padding:16px 20px;display:flex}.qrmail-head-icon{font-size:20px;line-height:1}.qrmail-head-title{letter-spacing:.03em;margin:0;font-size:18px;font-weight:700}.qrmail-body{padding:22px 18px 24px}.qrmail-title-area{text-align:center;margin-bottom:16px}.qrmail-title-main{color:#e60073;background:linear-gradient(#0000 62%,#fff0f5 62%);padding:0 4px;font-size:16px;font-weight:700;display:inline-block}.qrmail-title-sub{margin-top:6px;font-size:15px;font-weight:700;display:block}.qrmail-recipient{color:#6b7280;margin:8px 0 0;font-size:13px}.qrmail-qr-section{border:2px solid #ff80b5;border-radius:12px;flex-direction:column;align-items:center;padding:36px 14px 16px;display:flex;position:relative}.qrmail-ribbon{color:#fff;white-space:nowrap;background:#ed4c8b;border-radius:0 0 12px 12px;padding:6px 20px;font-size:13px;font-weight:700;position:absolute;top:0;left:50%;transform:translate(-50%)}.qrmail-sparkle{font-size:16px;position:absolute;top:54%;transform:translateY(-50%)}.qrmail-sparkle.left{left:12px}.qrmail-sparkle.right{right:12px}.qrmail-qr-wrap{padding:12px;position:relative}.qrmail-corner{border-style:solid;border-color:#e60073;width:20px;height:20px;position:absolute}.qrmail-corner.tl{border-width:4px 0 0 4px;border-top-left-radius:8px;top:0;left:0}.qrmail-corner.tr{border-width:4px 4px 0 0;border-top-right-radius:8px;top:0;right:0}.qrmail-corner.bl{border-width:0 0 4px 4px;border-bottom-left-radius:8px;bottom:0;left:0}.qrmail-corner.br{border-width:0 4px 4px 0;border-bottom-right-radius:8px;bottom:0;right:0}.qrmail-code{letter-spacing:1px;color:#374151;word-break:break-all;text-align:center;margin:10px 0 0;font-size:14px;font-weight:700}.qrmail-expire{text-align:center;color:#e60073;margin:12px 0 0;font-size:13px;font-weight:700}.qrmail-section{margin-top:20px}.qrmail-section h3{text-align:center;color:#1f5fae;margin:0 0 10px;font-size:16px}.qrmail-section h3:after{content:"";background:#ff80b5;border-radius:3px;width:42px;height:3px;margin:8px auto 0;display:block}.qrmail-start-note{text-align:center;color:#333;margin:0 0 14px;font-size:14px;font-weight:700}.qrmail-steps{gap:8px;display:grid}.qrmail-steps div{background:#f8fbff;border:1px solid #d9e9f8;border-radius:10px;grid-template-columns:74px 1fr;align-items:center;gap:8px;padding:10px 12px;display:grid}.qrmail-steps b{color:#fff;background:#1f5fae;border-radius:999px;justify-content:center;align-items:center;min-height:28px;font-size:11px;display:inline-flex}.qrmail-steps span{font-size:12px;line-height:1.5}.qrmail-notes{background:#fff8fb;border:1px solid #ffd5e6;border-radius:10px;margin:0;padding:14px 16px 14px 34px;font-size:12px;line-height:1.7}.qrmail-notes li+li{margin-top:5px}.qrmail-contact-box{background:#f7f7f7;border-radius:10px;padding:14px 16px;font-size:12px;line-height:1.7}.qrmail-contact-box p{margin:0 0 10px}.qrmail-contact-link{text-align:center;color:#fff;word-break:break-all;background:#1f5fae;border-radius:8px;padding:11px 12px;font-weight:700;text-decoration:none;display:block}.qrmail-actions{text-align:center;margin-top:16px}.qrmail-copyright{text-align:center;color:#999;margin:22px 0 2px;font-size:10px}@media (width<=480px){.container{padding:0}.qrmail-card{box-shadow:none;border:0;border-radius:0}}