:root{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:#e5e7eb;background:radial-gradient(circle at 20% 20%,#152238 0%,#0b1220 40%,#070b14 100%)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 20% 20%,#152238 0%,#0b1220 40%,#070b14 100%)}.page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:30px 24px}.card{width:100%;max-width:980px;border-radius:20px;padding:30px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.card.modern{background:linear-gradient(165deg,rgba(17,24,39,.92),rgba(15,23,42,.95));border:1px solid rgba(148,163,184,.18);box-shadow:0 20px 60px #00000073}.card h1{margin:0 0 12px;font-size:38px;line-height:1.1;color:#f8fafc}.title-row{display:flex;align-items:baseline;justify-content:space-between;gap:14px}.title-amount{color:#f8fafc;font-size:30px;font-weight:800;line-height:1;white-space:nowrap}.subtitle{margin:0 0 16px;color:#cbd5e1;line-height:1.5;font-size:22px;max-width:900px}.bank-row{display:flex;gap:12px;margin-bottom:16px;flex-wrap:wrap}.bank-pill{display:inline-flex;align-items:center;gap:9px;border:1px solid rgba(148,163,184,.25);border-radius:999px;padding:8px 12px;background:rgba(15,23,42,.7)}.bank-pill img{width:20px;height:20px}.bank-pill span{color:#f1f5f9;font-size:15px;font-weight:600}.bank-choice{margin-bottom:20px}.bank-row-select{gap:16px}.bank-select-btn{flex:1;min-width:140px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:16px 20px;border-radius:16px;border:1px solid rgba(148,163,184,.35);background:rgba(30,41,59,.85);color:#f1f5f9;font-size:17px;font-weight:600;cursor:pointer;transition:background .15s,border-color .15s}.bank-select-btn:hover:not(:disabled){background:rgba(51,65,85,.95);border-color:#e2e8f059}.bank-select-btn:disabled{opacity:.45;cursor:not-allowed}.bank-select-btn img{width:28px;height:28px}.loader-wrap.compact{margin-top:14px;padding:12px}.warning{background:rgba(254,243,199,.12);border:1px solid rgba(251,191,36,.45);color:#fde68a;border-radius:12px;padding:12px 14px;margin-bottom:10px;line-height:1.45;font-size:15px}.warning.compact{margin-top:8px;margin-bottom:0;font-size:14px}.warning-red{background:rgba(239,68,68,.12);border-color:#f8717180;color:#fecaca}.top-grid{margin-top:18px;display:grid;grid-template-columns:minmax(360px,1.2fr) minmax(260px,1fr);gap:14px;align-items:start}.block{border-radius:16px;border:1px solid rgba(148,163,184,.2);background:rgba(2,6,23,.45);padding:14px}.block-title{color:#f8fafc;font-size:17px;font-weight:700;margin-bottom:12px}.steps ol{margin:0;padding-left:22px;color:#e2e8f0;line-height:1.5;font-size:19px}.steps li+li{margin-top:10px}.meta-card{margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:12px}.meta-item{border-radius:14px;border:1px solid rgba(148,163,184,.2);background:rgba(2,6,23,.55);padding:12px}.meta-item span{display:block;color:#94a3b8;font-size:13px;margin-bottom:5px}.meta-item strong{color:#f8fafc;font-size:24px;line-height:1.1;display:block;overflow-wrap:anywhere}.amount{font-size:22px;font-weight:700;margin-top:16px}.meta{color:#4b5563;margin-top:6px}.qr-wrap{position:relative;margin-top:0;background:#fff;border-radius:18px;display:flex;align-items:center;justify-content:center;padding:24px;min-height:360px;border:1px solid rgba(148,163,184,.45)}.qr-save-fab{position:absolute;top:10px;right:10px;width:34px;height:34px;border-radius:999px;border:1px solid rgba(15,23,42,.25);background:rgba(15,23,42,.88);color:#f8fafc;font-size:18px;line-height:1;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 6px 18px #0f172a3d}.qr-save-fab:hover{background:rgba(37,99,235,.92)}.actions{margin-top:16px;display:flex;gap:10px;flex-wrap:wrap}.btn{display:inline-block;background:linear-gradient(135deg,#2563eb,#3b82f6);color:#f8fafc;text-decoration:none;border-radius:14px;padding:11px 16px;border:0;cursor:pointer;font-weight:650;font-size:15px}.btn.btn-secondary{background:rgba(15,23,42,.8);border:1px solid rgba(148,163,184,.35)}.state{margin-top:16px;color:#e2e8f0;font-size:15px}.state.error{color:#fecaca}.loader-wrap{margin-top:18px;padding:18px;border-radius:14px;border:1px solid rgba(148,163,184,.2);background:rgba(15,23,42,.35);display:flex;align-items:center;gap:10px}.spinner{width:18px;height:18px;border:2px solid rgba(148,163,184,.35);border-top-color:#22c55e;border-radius:50%;animation:spin .9s linear infinite}.state.success{color:#166534;font-weight:600}.result{margin-top:14px;border-radius:16px;border:1px solid transparent;padding:14px 16px}.result-title{font-size:18px;font-weight:700;margin-bottom:4px}.result-subtitle{font-size:14px;line-height:1.4}.result-success{background:rgba(34,197,94,.15);border-color:#22c55e80;color:#bbf7d0}.result-canceled{background:rgba(239,68,68,.14);border-color:#f8717173;color:#fecaca}.cancel-screen{max-width:760px;border:1px solid rgba(248,113,113,.28)}.success-screen{max-width:760px;border:1px solid rgba(34,197,94,.34)}.cancel-badge{display:inline-block;margin-bottom:12px;border-radius:999px;border:1px solid rgba(248,113,113,.45);background:rgba(127,29,29,.45);color:#fecaca;font-size:13px;font-weight:700;letter-spacing:.01em;padding:6px 10px}.success-badge{display:inline-block;margin-bottom:12px;border-radius:999px;border:1px solid rgba(74,222,128,.55);background:rgba(20,83,45,.45);color:#bbf7d0;font-size:13px;font-weight:700;letter-spacing:.01em;padding:6px 10px}.cancel-subtitle{max-width:100%}.cancel-meta{margin-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:12px}@media (max-width: 1024px){.card{max-width:900px;padding:26px}.card h1{font-size:34px}.title-amount{font-size:26px}.subtitle{font-size:20px}.steps ol{font-size:17px}.meta-item strong{font-size:24px}}@media (max-width: 760px){.page{padding:18px 12px;align-items:flex-start}.card{padding:16px;border-radius:16px}.card h1{font-size:30px}.title-row{flex-direction:column;align-items:flex-start;gap:8px}.title-amount{font-size:24px}.subtitle{font-size:17px}.top-grid{grid-template-columns:1fr;gap:10px}.steps ol{font-size:16px}.meta-card,.cancel-meta{grid-template-columns:1fr}.meta-item strong{font-size:22px}.qr-wrap{min-height:280px;padding:16px}}@keyframes spin{to{transform:rotate(360deg)}}
