:root{font-family:Arial,Helvetica,sans-serif;color:#25313c;background:#f7f9fb}*{box-sizing:border-box}body{margin:0;line-height:1.4}.topbar{background:#fff;border-bottom:1px solid #dbe3e6;display:flex;justify-content:space-between;align-items:center;padding:16px max(22px,calc((100% - 1050px)/2))}.brand{font-size:19px;font-weight:700}.topbar-note{font-size:13px;color:#687985}.page{max-width:1050px;margin:auto;padding:27px 24px 60px}.page>h1{text-align:center;font-size:27px;margin:0 0 23px}.details-layout{display:grid;grid-template-columns:1fr 1fr;background:#fff;border:1px solid #dfe5e9;border-radius:12px;padding:24px;gap:28px;box-shadow:0 3px 16px #2233440c}.details-section{min-width:0}.sender{border-right:2px solid #d8e0e4;padding-right:28px}.details-section h2,.payment-section h2{font-size:19px;margin:0 0 20px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{min-width:0;display:flex;flex-direction:column;gap:6px;margin-bottom:17px}.field label,.upload-field label,.notify-options legend{font-size:13px;font-weight:600}.field input,.field textarea,.field select{border:1px solid #acb8c0;border-radius:5px;padding:10px;width:100%;background:#fff;font:inherit;font-size:14px;color:#25313c}.field textarea{min-height:115px;resize:vertical}.field input:focus,.field textarea:focus,.field select:focus{outline:2px solid #94bca4;outline-offset:1px}.field small,.upload-field small{font-size:11px;color:#687985}.image-preview{height:255px;border:2px solid #82909a;border-radius:5px;overflow:hidden;display:grid;place-items:center;background:#f9fbfc;margin-bottom:9px}.image-preview img{width:100%;height:100%;object-fit:contain}.preview-placeholder{text-align:center;color:#8997a0;display:flex;flex-direction:column;align-items:center;font-size:13px}.preview-symbol{font-size:90px;font-weight:200;line-height:1.15;color:#a8b1b9}.upload-field{display:flex;flex-direction:column;gap:4px;margin-bottom:16px}.upload-field input{max-width:100%;font-size:13px}.notify-options{border:0;padding:0;margin:0 0 20px}.notify-options legend{margin-bottom:10px}.notify-options label{font-size:13px;display:inline-flex;align-items:center;gap:5px;margin-right:15px;white-space:nowrap}.notify-options input,.terms input{accent-color:#44835a}.optional{font-weight:normal;color:#73818b;font-size:11px}.payment-section{max-width:460px;margin:25px auto 0}.payment-section h2{text-align:center;margin-bottom:15px}.payment-row{display:flex;gap:12px}.payment-row .field{flex:1}.payment-row .card-type{flex:0 0 35%}.payment-row .card-number{flex:1}.payment-row .expiration{flex:1.2}.payment-row .ccv{flex:.8}.payment-row .amount{flex:1.4}.terms{font-size:13px;display:flex;align-items:center;gap:8px;margin-top:4px}.terms a{color:inherit;text-decoration:underline}.terms-info{text-align:left;font-size:11px;color:#76858e;margin:8px 0 0}.primary-button{display:block;width:100%;padding:12px;margin-top:18px;background:#bde0b6;border:1px solid #588763;border-radius:5px;color:#203527;font-size:21px;font-weight:700;cursor:pointer}.primary-button:hover{background:#a8d6a0}.form-error{background:#fff0f1;border:1px solid #d9aab1;border-radius:6px;color:#a32b37;padding:12px;margin-top:13px;font-size:13px}.result-wrap{max-width:560px;margin:90px auto;padding:20px}.result-card{background:#fff;border:1px solid #dfe5e9;border-radius:14px;text-align:center;padding:48px 35px;box-shadow:0 8px 30px #18243b08}.result-icon{width:65px;height:65px;border-radius:50%;display:grid;place-items:center;margin:0 auto 20px;background:#e4f9eb;color:#138c4b;font-size:32px}.result-icon.error{background:#fff0f1;color:#c43e4e}.result-card h1{font-size:28px;margin:10px 0}.result-card p{color:#69768a}.result-card .primary-button{max-width:270px;margin:28px auto 0;text-decoration:none;font-size:16px}@media(max-width:720px){.details-layout{grid-template-columns:1fr}.sender{border-right:0;border-bottom:2px solid #d8e0e4;padding-right:0;padding-bottom:20px}.page{padding:22px 14px}.details-layout{padding:18px}.image-preview{height:230px}}@media(max-width:420px){.field-grid{grid-template-columns:1fr;gap:0}.notify-options label{margin-right:8px;font-size:12px}.payment-row{gap:8px}.field input,.field select{padding:8px 5px}.topbar-note{display:none}}
