.payment-page{min-height:100vh;background:var(--bg);color:var(--text)}.payment-navbar{background:#080a0df2;backdrop-filter:blur(16px);border-bottom:1px solid var(--line);padding:16px 24px}.navbar-logo{font-family:var(--serif);font-size:24px;letter-spacing:6px;font-weight:700;text-decoration:none;color:var(--gold)}.navbar-logo .logo-aka{color:var(--text)}.navbar-logo .logo-doris{color:var(--gold)}.payment-container{max-width:1200px;margin:40px auto;padding:0 24px;display:grid;grid-template-columns:1.5fr 1fr;gap:32px}.payment-card{background:var(--bg1);border:1px solid var(--line);border-radius:24px;padding:40px}.payment-header h1{font-family:var(--serif);font-size:32px;margin:0 0 8px}.payment-subtitle{color:var(--muted);margin:0}.order-summary{background:#c9a84c0d;border:1px solid rgba(201,168,76,.2);border-radius:20px;padding:24px;margin:24px 0}.order-item{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line)}.order-total{display:flex;justify-content:space-between;padding-top:16px;font-size:18px;font-weight:700}.total-amount{color:var(--gold);font-family:var(--serif);font-size:28px}.btn-pay{width:100%;padding:16px;background:linear-gradient(135deg,var(--gold-3),var(--gold));color:#000;font-weight:800;font-size:16px;border:none;border-radius:12px;cursor:pointer;transition:all .3s}.btn-pay:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 30px #c9a84c4d}.btn-pay:disabled{opacity:.6;cursor:not-allowed}.error-message{background:#ef44441a;border:1px solid rgba(239,68,68,.3);color:#ef4444;padding:12px;border-radius:8px;margin-top:16px}.test-cards{background:#2ae8c80d;border:1px dashed rgba(42,232,200,.3);padding:12px;border-radius:8px;margin:16px 0}.test-label{color:var(--teal);font-weight:700;margin:0 0 8px}.test-cards code{display:block;text-align:center;font-family:monospace;background:#0003;padding:8px;border-radius:6px}.security-badges{display:flex;justify-content:center;gap:16px;margin:24px 0;padding:16px 0;border-top:1px solid var(--line)}.security-badges span{font-size:12px;color:var(--muted)}.payment-note{text-align:center;font-size:12px;color:var(--soft)}.payment-sidebar{display:flex;flex-direction:column;gap:24px}.security-info{background:var(--bg1);border:1px solid var(--line);border-radius:16px;padding:24px}.security-info h4{margin:0 0 12px}.security-info ul{list-style:none;padding:0;margin:0}.security-info li{padding:6px 0;color:var(--muted)}.success-container,.failure-container{display:flex;justify-content:center;padding:60px 24px}.success-card,.failure-card{background:var(--bg1);border:1px solid var(--line);border-radius:24px;padding:48px;max-width:600px;width:100%;text-align:center}.success-icon,.failure-icon{font-size:80px;margin-bottom:24px}.success-message,.failure-message{font-size:16px;color:var(--muted);margin:24px 0;line-height:1.6}.order-details{background:#ffffff08;border:1px solid var(--line);border-radius:16px;padding:24px;margin:24px 0;text-align:left}.detail-row{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line)}.detail-row:last-child{border-bottom:none}.detail-row .amount{color:var(--gold);font-family:var(--serif);font-size:24px}.action-buttons{display:flex;flex-direction:column;gap:12px;margin:24px 0}.btn-primary,.btn-secondary,.btn-ghost{padding:14px 24px;border-radius:12px;font-weight:700;text-decoration:none;display:inline-block;cursor:pointer;border:none}.btn-primary{background:linear-gradient(135deg,var(--gold-3),var(--gold));color:#000}.btn-secondary{background:#ffffff1a;color:var(--text)}.btn-ghost{background:transparent;color:var(--gold);border:1px solid var(--gold)}.info-box{background:#2ae8c80d;border:1px solid rgba(42,232,200,.3);border-radius:12px;padding:16px;margin-top:24px}.solutions{background:#ffffff08;border:1px solid var(--line);border-radius:16px;padding:24px;margin:24px 0;text-align:left}.solutions ul{list-style:none;padding:0;margin:12px 0 0}.solutions li{padding:8px 0;color:var(--muted)}.loading-spinner{width:20px;height:20px;border:2px solid rgba(0,0,0,.2);border-top-color:#000;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 768px){.payment-container{grid-template-columns:1fr}.action-buttons{flex-direction:column}}