.api-code-page{position:relative;isolation:isolate;min-height:100vh;display:grid;place-items:center;overflow:hidden;padding:48px 20px;background:radial-gradient(circle at 17% 9%,rgba(75,238,114,.18),transparent 29%),radial-gradient(circle at 92% 62%,rgba(48,173,83,.22),transparent 34%),linear-gradient(135deg,#06241c 0%,#031a18 46%,#082b20 100%)}
.api-code-page::before,.api-code-page::after{content:"";position:absolute;z-index:-1;background-repeat:no-repeat;background-size:100% 100%}.api-code-page::before{left:0;bottom:0;width:385px;height:456px;background-image:url("../images/code-console/background-left.png")}.api-code-page::after{right:0;top:0;width:412px;height:390px;background-image:url("../images/code-console/background-right.png")}
.api-code-card{position:relative;width:min(710px,100%);min-height:745px;padding:46px 52px 34px;border:1px solid rgba(113,255,169,.66);border-radius:30px;color:#f2fbf6;background:linear-gradient(155deg,rgba(13,70,49,.91),rgba(2,39,34,.96) 45%,rgba(8,62,43,.93));box-shadow:0 32px 100px rgba(0,0,0,.48),0 0 42px rgba(51,235,117,.13),inset 0 1px rgba(255,255,255,.08);backdrop-filter:blur(18px)}
.api-code-card::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:radial-gradient(circle at 13% 4%,rgba(70,246,126,.12),transparent 32%),radial-gradient(circle at 100% 100%,rgba(125,255,108,.1),transparent 36%)}.api-code-card>*{position:relative;z-index:1}
.api-code-brand{display:flex;align-items:center;gap:22px;margin-bottom:36px}.api-code-logo{display:block;width:86px;height:86px;flex:0 0 auto;filter:drop-shadow(0 12px 24px rgba(112,255,103,.2))}.api-code-brand-copy{min-width:0}.api-code-brand h1{margin:10px 0 0;font-size:clamp(27px,4vw,38px);line-height:1.2;letter-spacing:.01em}.api-code-brand .eyebrow{color:#c9ff67;letter-spacing:.34em;line-height:1.5}.api-code-trust{display:grid;justify-items:center;gap:6px;margin-left:auto;color:#76998e;text-align:center}.api-code-trust img{width:42px;height:42px}.api-code-trust small{font-size:10px;line-height:1.65}
.api-code-field{display:flex;align-items:center;gap:18px;min-height:110px;padding:20px;margin-top:16px;border:1px solid rgba(117,201,170,.22);border-radius:18px;background:rgba(14,66,53,.54);box-shadow:inset 0 1px rgba(255,255,255,.025)}.api-code-field>div{min-width:0;flex:1}.api-code-field span,.api-code-field strong{display:block}.api-code-field>div>span{margin-bottom:7px;color:#abc5bc;font-size:12px;line-height:1.5}.api-code-field strong{font-size:19px;line-height:1.35;overflow-wrap:anywhere}.api-code-field-icon{display:grid!important;place-items:center;width:54px;height:54px;flex:0 0 auto;border-radius:13px;background:rgba(103,181,151,.18)}.api-code-field-icon img{width:29px;height:29px}
.api-code-card .copy-btn{display:inline-flex;align-items:center;gap:7px;flex:none;min-height:45px;padding:0 17px;border-color:#9be74e;border-radius:13px;color:#c7ff65;background:rgba(151,230,65,.08);font-weight:800}.api-code-card .copy-btn img{width:20px;height:20px}
.api-code-status{display:flex;align-items:center;gap:15px;min-height:72px;padding:16px 6px 7px}.api-code-status-icon{display:grid;place-items:center;width:39px;height:39px;border-radius:50%;background:rgba(116,183,158,.18)}.api-code-status-icon img{width:24px;height:24px}.api-code-status small{color:#d9e9e3;font-size:13px;font-weight:700;line-height:1.5}.api-code-status strong{display:inline-flex;align-items:center;gap:9px;max-width:calc(100% - 170px);padding:9px 17px;border-radius:999px;font-size:13px;line-height:1.5;overflow-wrap:anywhere}.api-code-status-dot{width:8px;height:8px;flex:0 0 auto;border-radius:50%}.api-code-status.is-waiting strong{color:#76f4ae;background:rgba(6,121,78,.58)}.api-code-status.is-waiting .api-code-status-dot{background:#39ec91;box-shadow:0 0 10px #39ec91}.api-code-status.is-success strong{color:#caff8c;background:rgba(81,155,52,.42)}.api-code-status.is-success .api-code-status-dot{background:#a8ff68;box-shadow:0 0 10px #a8ff68}.api-code-status.is-error strong{color:#ffd0c5;background:rgba(167,55,43,.42)}.api-code-status.is-error .api-code-status-dot{background:#ff8068;box-shadow:0 0 10px #ff8068}
.api-code-result{position:relative;padding:25px 20px;margin:15px 0 0;border:1px solid rgba(153,242,82,.45);border-radius:18px;text-align:center;background:linear-gradient(145deg,rgba(146,239,75,.12),rgba(22,100,72,.34))}.api-code-result span{display:block;color:#b5d4c7;font-size:12px}.api-code-result strong{display:block;margin:10px 0 16px;color:#c9ff67;font:800 clamp(36px,8vw,56px)/1 "SFMono-Regular",Consolas,monospace;letter-spacing:7px;overflow-wrap:anywhere}.api-code-2fa{border-color:rgba(153,242,82,.3)}
.api-code-form{display:grid;gap:20px;margin-top:20px}.api-code-form label{display:grid;gap:12px;min-height:116px;padding:17px 18px 14px;border-radius:18px;background:rgba(8,51,43,.64)}.api-code-label{display:flex;align-items:center;gap:11px;color:#d4e9e0;font-size:13px;font-weight:700;line-height:1.5}.api-code-label img{width:23px;height:23px}.api-code-form input{width:100%;padding:16px 18px;border:1px solid rgba(155,213,191,.32);border-radius:13px;color:#f3fff9;background:rgba(21,75,63,.56);outline:none;font-size:15px;line-height:1.45}.api-code-form input::placeholder{color:#78968b}.api-code-form input:focus{border-color:#8eef75;box-shadow:0 0 0 3px rgba(106,242,118,.1)}
.api-code-submit{display:flex!important;align-items:center;justify-content:center;gap:12px;width:100%;min-height:70px;border:1px solid #ceff8b!important;border-radius:16px!important;color:#062117!important;background:linear-gradient(100deg,#c8ff63,#59ed75)!important;box-shadow:0 10px 26px rgba(96,239,105,.25),inset 0 1px rgba(255,255,255,.48);font-size:18px!important;font-weight:900!important}.api-code-submit:hover{filter:brightness(1.07);transform:translateY(-1px)}.api-code-submit img{width:28px;height:28px}
.api-code-ad{display:flex;align-items:center;gap:14px;min-height:74px;margin-top:26px;padding:19px 21px;border-radius:15px;color:#d3e6dd;background:linear-gradient(90deg,rgba(17,100,72,.75),rgba(17,78,65,.66));font-size:12px;line-height:1.55}.api-code-ad>img{width:25px;height:25px}.api-code-ad span{color:#caff75;font-size:14px;font-weight:900}.api-code-ad i{width:1px;height:28px;background:rgba(206,255,221,.2)}
.api-code-security{display:flex;align-items:center;justify-content:center;gap:8px;padding-top:22px;margin:26px 0 0;border-top:1px solid rgba(156,215,193,.18);color:#78968c;text-align:center;font-size:10px}.api-code-security img{width:20px;height:20px}
.merchant-code-card{min-height:auto}.merchant-code-form{margin-top:8px}.merchant-access-remembered{display:flex;align-items:center;gap:13px;padding:15px 18px;border:1px solid rgba(116,235,157,.24);border-radius:15px;color:#d7ece3;background:rgba(16,96,68,.42)}.merchant-access-remembered>img{width:30px;height:30px}.merchant-access-remembered strong,.merchant-access-remembered span{display:block}.merchant-access-remembered strong{font-size:13px}.merchant-access-remembered span{margin-top:3px;color:#85a99b;font-size:11px}
@media(max-width:720px){.api-code-page{display:block;min-height:100dvh;padding:0;background:#07231b}.api-code-page::before,.api-code-page::after{display:none}.api-code-card{width:100%;min-height:100dvh;padding:28px 18px 22px;border:0;border-radius:0;box-shadow:none}.api-code-brand{gap:14px;margin-bottom:25px}.api-code-logo{width:61px;height:61px}.api-code-brand h1{margin-top:5px;font-size:24px}.api-code-brand .eyebrow{font-size:8px;letter-spacing:.25em}.api-code-trust{display:none}.api-code-field{min-height:auto;padding:15px}.api-code-field-icon{width:45px;height:45px}.api-code-field-icon img{width:25px;height:25px}.api-code-field strong{font-size:16px}.api-code-status{padding:15px 2px 4px}.api-code-status strong{max-width:calc(100% - 130px);padding:7px 12px}.api-code-result strong{font-size:clamp(34px,12vw,50px);letter-spacing:4px}.api-code-form label{min-height:auto}.api-code-submit{min-height:56px;font-size:16px!important}.api-code-ad{margin-top:18px}}
@media(max-width:390px){.api-code-brand h1{font-size:21px}.api-code-field{align-items:flex-start;flex-wrap:wrap}.api-code-field>div{width:calc(100% - 64px)}.api-code-field .copy-btn{width:100%;justify-content:center}.api-code-status{align-items:flex-start;flex-wrap:wrap}.api-code-status strong{max-width:calc(100% - 52px);margin-left:52px;margin-top:-9px}.api-code-form label{padding:14px 13px}.api-code-ad{align-items:flex-start;flex-wrap:wrap}.api-code-ad i{display:none}}