:root{
  --bg:#0D0D1A; --card:rgba(255,255,255,.045); --line:rgba(255,255,255,.1);
  --pink:#FF0066; --orange:#FF6600; --muted:rgba(255,255,255,.62);
  --ok:#3DDC84; --warn:#FFB020; --err:#FF5A7A;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:var(--bg);color:#fff;min-height:100vh;line-height:1.6;position:relative;overflow-x:hidden}
body::before{content:"";position:fixed;top:-160px;right:-160px;width:420px;height:420px;background:radial-gradient(circle,rgba(255,0,102,.28),transparent 70%);pointer-events:none;z-index:0}
body::after{content:"";position:fixed;bottom:-200px;left:-160px;width:420px;height:420px;background:radial-gradient(circle,rgba(255,102,0,.16),transparent 70%);pointer-events:none;z-index:0}
a{color:inherit;text-decoration:none}
[hidden]{display:none!important}

.topbar{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:18px 6%;border-bottom:1px solid var(--line);background:rgba(13,13,26,.8);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.logo{font-size:22px;font-weight:900;background:linear-gradient(90deg,var(--pink),var(--orange));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.topbar .secure{font-size:12px;color:var(--muted)}

.wrap{position:relative;z-index:1;max-width:560px;margin:0 auto;padding:28px 18px 50px}
h1{font-size:28px;font-weight:900;line-height:1.2;margin-bottom:6px}
h2{font-size:16px;font-weight:800;margin-bottom:14px}
p{color:var(--muted);font-size:14px}
.lead{margin-bottom:6px}

.steps{display:flex;gap:8px;margin:18px 0 22px}
.step{flex:1;font-size:11px;font-weight:700;color:var(--muted);padding-top:8px;border-top:3px solid var(--line)}
.step.active{color:#fff;border-top-color:var(--pink)}
.step.done{color:var(--ok);border-top-color:var(--ok)}

.card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:20px;margin-bottom:16px}
.row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14px}
.row:last-child{border-bottom:none}
.row .label{color:var(--muted);flex-shrink:0}
.row .value{font-weight:700;text-align:right;word-break:break-all}
.value-wrap{display:flex;align-items:center;gap:8px;min-width:0}
.copy-btn{background:rgba(255,255,255,.08);border:1px solid var(--line);color:#fff;font-size:11px;font-weight:700;padding:6px 10px;border-radius:8px;cursor:pointer;flex-shrink:0;font-family:inherit}
.copy-btn:active{transform:scale(.96)}
.price{font-size:32px;font-weight:900;background:linear-gradient(90deg,var(--pink),var(--orange));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

.badge{display:inline-block;font-size:11px;font-weight:800;padding:5px 12px;border-radius:20px}
.badge.pending{background:rgba(255,176,32,.14);color:var(--warn)}
.badge.review{background:rgba(66,165,245,.14);color:#6EB6FF}
.badge.approved{background:rgba(61,220,132,.14);color:var(--ok)}
.badge.rejected{background:rgba(255,90,122,.14);color:var(--err)}

.notice{border-radius:14px;padding:14px 16px;font-size:13px;margin-bottom:16px;border:1px solid}
.notice.info{background:rgba(66,165,245,.08);border-color:rgba(66,165,245,.3);color:#BFE0FF}
.notice.warn{background:rgba(255,176,32,.08);border-color:rgba(255,176,32,.3);color:#FFD98A}
.notice.error{background:rgba(255,90,122,.08);border-color:rgba(255,90,122,.3);color:#FFC2CE}
.notice.ok{background:rgba(61,220,132,.08);border-color:rgba(61,220,132,.3);color:#B5F2CF}

.field{margin-bottom:16px}
.field > label{display:block;font-size:12px;font-weight:700;color:var(--muted);margin-bottom:6px}
.input{width:100%;padding:14px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:#fff;font-size:15px;font-family:inherit}
.input:focus{outline:none;border-color:var(--pink);box-shadow:0 0 0 3px rgba(255,0,102,.15)}
.drop{display:block;border:2px dashed rgba(255,255,255,.2);border-radius:14px;padding:22px 14px;text-align:center;cursor:pointer;color:var(--muted);font-size:13px;transition:.2s}
.drop:hover{border-color:var(--pink);color:#fff}
.drop input{display:none}
.preview{display:block;max-width:100%;max-height:220px;margin:14px auto 0;border-radius:12px;border:1px solid var(--line)}
.form-error{color:var(--err);font-size:13px;margin:-4px 0 14px}

.btn{display:block;width:100%;border:none;border-radius:14px;padding:16px;font-size:15px;font-weight:800;color:#fff;cursor:pointer;background:linear-gradient(90deg,var(--pink),var(--orange));box-shadow:0 10px 28px rgba(255,0,102,.3);font-family:inherit;text-align:center}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn.ghost{background:rgba(255,255,255,.08);box-shadow:none;border:1px solid var(--line)}
.btn + .btn{margin-top:10px}

.center{text-align:center}
.big-icon{font-size:56px;margin:10px 0 14px}
.spinner{width:34px;height:34px;border-radius:50%;border:3px solid rgba(255,255,255,.15);border-top-color:var(--pink);animation:spin .8s linear infinite;margin:50px auto 14px}
@keyframes spin{to{transform:rotate(360deg)}}

.footer{position:relative;z-index:1;text-align:center;font-size:12px;color:rgba(255,255,255,.4);padding:0 18px 30px}
.footer a{color:rgba(255,255,255,.6);margin:0 8px}
@media(min-width:600px){h1{font-size:32px}}