:root{--pp-bg-0:#f2f6fb;--pp-bg-1:#fff;--pp-bg-soft:#f7faff;--pp-bg-muted:#eef3fa;--pp-text-0:#0f172a;--pp-text-1:#334155;--pp-text-2:#64748b;--pp-line:#1e4e8b2e;--pp-line-strong:#1e4e8b52;--pp-primary:#0f6cbd;--pp-primary-hover:#0d5fa8;--pp-primary-active:#0a4f8b;--pp-success:#0f8a4b;--pp-danger:#c62828;--pp-warning:#c67d00;--pp-shadow-card:0 14px 30px #092a4e14;--pp-shadow-elevated:0 16px 40px #092a4e24;--pp-radius-s:10px;--pp-radius-m:14px;--pp-radius-l:18px;--pp-space-1:8px;--pp-space-2:12px;--pp-space-3:16px;--pp-space-4:20px;--pp-space-5:24px;--pp-space-6:32px;--pp-transition-fast:.16s;--pp-transition-normal:.22s;--pp-shell-radial-left:#2f81e438;--pp-shell-radial-right:#4992dd38;--pp-shell-gradient-start:#f9fbfe;--pp-shell-gradient-end:#ecf3fa;--pp-hero-bg-start:#fffffff2;--pp-hero-bg-end:#f5fbffe0;--pp-hint-bg:#eff8ffbf;--pp-nav-bg:#ffffffe0;--pp-nav-link-hover-border:#0f6cbd33;--pp-nav-link-hover-bg:#dbedffb3;--pp-nav-active-end:#0c599d;--pp-nav-active-shadow:#0f6cbd52;--pp-card-bg:#fffffff2;--pp-input-bg:#fff;--pp-focus-ring:#0f6cbd33;--pp-focus-ring-strong:#0f6cbd3d;--pp-button-gradient-end:#0c5ca3;--pp-button-gradient-hover-end:#0a538f;--pp-button-gradient-active-end:#094578;--pp-button-shadow:#0f6cbd42;--pp-plan-hover-border:#0f6cbd59;--pp-plan-active-border:#0f6cbd6b;--pp-plan-active-halo:#0f6cbd24;--pp-table-head-bg:#f0f6ff;--pp-table-line:#93c5fd47;--pp-table-row-hover:#dbeafe59;--pp-step-active-border:#0f6cbd66;--pp-step-active-bg:#eaf4ff;--pp-guide-risk-border:#c6282847;--pp-guide-risk-bg:#fff6f6;--pp-alert-border:#0f6cbd40;--pp-alert-bg:#ebf5ffd1;--pp-link-btn-bg:#fff;--pp-guide-link-bg:#fff;--pp-faq-bg:#fff;--pp-qrcode-mask-bg:#0f172a85}.dark .payment-portal-shell{--pp-bg-0:#07070b;--pp-bg-1:#11101b;--pp-bg-soft:#171428;--pp-bg-muted:#1d1830;--pp-text-0:#f4efff;--pp-text-1:#d6cafb;--pp-text-2:#a79bcf;--pp-line:#b87cff42;--pp-line-strong:#ffd4476b;--pp-primary:#b87cff;--pp-primary-hover:#c99cff;--pp-primary-active:#9861e8;--pp-success:#31d9a2;--pp-danger:#ff6b87;--pp-warning:#ffd447;--pp-shadow-card:0 16px 36px #06050f85;--pp-shadow-elevated:0 20px 52px #080614ad;--pp-shell-radial-left:#b87cff42;--pp-shell-radial-right:#ffd44733;--pp-shell-gradient-start:#08070d;--pp-shell-gradient-end:#11101a;--pp-hero-bg-start:#1c142deb;--pp-hero-bg-end:#0b0a13f0;--pp-hint-bg:#271c3f99;--pp-nav-bg:#0d0b16d6;--pp-nav-link-hover-border:#b87cff70;--pp-nav-link-hover-bg:#b87cff24;--pp-nav-active-end:#8a53da;--pp-nav-active-shadow:#b87cff6b;--pp-card-bg:#110e1ee6;--pp-input-bg:#13101feb;--pp-focus-ring:#ffd4475c;--pp-focus-ring-strong:#ffd4476b;--pp-button-gradient-end:#8852d7;--pp-button-gradient-hover-end:#9d69ef;--pp-button-gradient-active-end:#7145bd;--pp-button-shadow:#b87cff61;--pp-plan-hover-border:#ffd44770;--pp-plan-active-border:#b87cff94;--pp-plan-active-halo:#b87cff47;--pp-table-head-bg:#291c43c2;--pp-table-line:#b87cff3d;--pp-table-row-hover:#b87cff1f;--pp-step-active-border:#ffd4478f;--pp-step-active-bg:#ffd44721;--pp-guide-risk-border:#ff6b8780;--pp-guide-risk-bg:#401624b8;--pp-alert-border:#b87cff6b;--pp-alert-bg:#1e1530cc;--pp-link-btn-bg:#0e0c16eb;--pp-guide-link-bg:#0f0d18eb;--pp-faq-bg:#0f0d18eb;--pp-qrcode-mask-bg:#05050abd}.dark .payment-portal-dialog{--pp-bg-1:#11101b;--pp-bg-soft:#171428;--pp-text-0:#f4efff;--pp-text-2:#a79bcf;--pp-line:#b87cff42;--pp-primary:#b87cff}.payment-portal-shell{min-height:var(--cch-viewport-height,100vh);color:var(--pp-text-0);background:radial-gradient(1000px 580px at 0% -20%, var(--pp-shell-radial-left), transparent 55%), radial-gradient(940px 520px at 100% -10%, var(--pp-shell-radial-right), transparent 50%), linear-gradient(180deg, var(--pp-shell-gradient-start) 0%, var(--pp-shell-gradient-end) 100%)}.payment-portal-main{width:100%;max-width:1220px;padding:var(--pp-space-4) var(--pp-space-3) var(--pp-space-6);margin-inline:auto}.payment-portal-header{gap:var(--pp-space-3);margin-bottom:var(--pp-space-2);display:grid}.payment-portal-hero{justify-content:space-between;align-items:flex-start;gap:var(--pp-space-3);padding:var(--pp-space-5);border:1px solid var(--pp-line);border-radius:var(--pp-radius-l);background:linear-gradient(140deg, var(--pp-hero-bg-start), var(--pp-hero-bg-end));box-shadow:var(--pp-shadow-card);flex-wrap:wrap;display:flex}.payment-portal-title{letter-spacing:.01em;color:var(--pp-text-0);margin:0;font-size:2rem;line-height:1.15}.payment-portal-subtitle{margin-top:var(--pp-space-1);max-width:700px;color:var(--pp-text-2);font-size:.98rem}.payment-portal-hint{border:1px dashed var(--pp-line-strong);border-radius:var(--pp-radius-m);min-width:220px;max-width:360px;padding:var(--pp-space-3);background:var(--pp-hint-bg);color:var(--pp-text-1);font-size:.9rem;line-height:1.55}.portal-nav{border:1px solid var(--pp-line);background:var(--pp-nav-bg);width:100%;box-shadow:var(--pp-shadow-card);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:999px;overflow-x:auto}.portal-nav-desktop{margin-left:0}.portal-nav-list{align-items:center;gap:6px;min-width:max-content;margin:0;padding:8px;list-style:none;display:flex}.portal-nav-link{min-height:40px;color:var(--pp-text-1);transition:all var(--pp-transition-fast) ease;border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;padding:0 16px;font-size:.9rem;font-weight:600;text-decoration:none;display:inline-flex}.portal-nav-link:hover{border-color:var(--pp-nav-link-hover-border);color:var(--pp-primary);background:var(--pp-nav-link-hover-bg)}.portal-nav-link.is-active{border-color:var(--pp-primary);color:#fff;background:linear-gradient(180deg, var(--pp-primary) 0%, var(--pp-nav-active-end) 100%);box-shadow:0 10px 18px var(--pp-nav-active-shadow)}.portal-mobile-nav-trigger{flex-shrink:0}.portal-mobile-nav-dialog{box-shadow:var(--pp-shadow-elevated);overflow:hidden}.portal-mobile-nav-header{border-bottom:1px solid var(--pp-line);background:radial-gradient(160px 120px at 100% 0%, var(--pp-shell-radial-right), transparent 70%), linear-gradient(180deg, var(--pp-bg-1) 0%, var(--pp-bg-soft) 100%);justify-content:space-between;align-items:flex-start;gap:12px;padding:20px 18px 16px;display:flex}.portal-mobile-nav-eyebrow{color:var(--pp-text-2);margin:0;font-size:.78rem}.portal-mobile-nav-title{color:var(--pp-text-0);margin-top:6px;font-size:1.1rem}.portal-mobile-nav-body{padding:16px}.portal-mobile-nav{border-radius:20px;overflow:visible}.portal-mobile-nav-list{flex-direction:column;align-items:stretch;gap:10px;min-width:0;padding:10px}.portal-mobile-nav .portal-nav-link{border-radius:14px;justify-content:flex-start;width:100%;min-height:48px;padding:0 16px}.payment-portal-shell [data-slot=card]{border-color:var(--pp-line);border-radius:var(--pp-radius-l);background:var(--pp-card-bg);box-shadow:var(--pp-shadow-card)}.payment-portal-shell [data-slot=card-title]{color:var(--pp-text-0)}.payment-portal-shell [data-slot=input]{border-color:var(--pp-line);border-radius:var(--pp-radius-s);background:var(--pp-input-bg);min-height:42px;transition:all var(--pp-transition-fast) ease}.payment-portal-shell [data-slot=input]:focus-visible{border-color:var(--pp-primary);box-shadow:0 0 0 3px var(--pp-focus-ring)}.payment-portal-shell [data-slot=button]{border-radius:var(--pp-radius-s);min-height:40px;transition:transform var(--pp-transition-fast) ease, box-shadow var(--pp-transition-fast) ease, background var(--pp-transition-fast) ease}.payment-portal-shell [data-slot=button]:focus-visible{box-shadow:0 0 0 3px var(--pp-focus-ring-strong);outline:none}.payment-portal-shell [data-slot=button].bg-primary{background:linear-gradient(180deg, var(--pp-primary) 0%, var(--pp-button-gradient-end) 100%);box-shadow:0 12px 22px var(--pp-button-shadow)}.payment-portal-shell [data-slot=button].bg-primary:hover{background:linear-gradient(180deg, var(--pp-primary-hover) 0%, var(--pp-button-gradient-hover-end) 100%)}.payment-portal-shell [data-slot=button].bg-primary:active{background:linear-gradient(180deg, var(--pp-primary-active) 0%, var(--pp-button-gradient-active-end) 100%)}.payment-portal-shell [data-slot=button]:disabled{opacity:.6;cursor:not-allowed}.payment-portal-shell [data-slot=badge]{border-radius:999px}.portal-page{gap:var(--pp-space-4);display:grid}.portal-grid-2{gap:var(--pp-space-4);grid-template-columns:1.2fr .8fr;display:grid}.portal-session-bar{border:1px solid var(--pp-line);background:var(--pp-bg-soft);border-radius:12px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;display:flex}.portal-session-title{color:var(--pp-text-2);font-size:.82rem}.portal-session-subtitle{color:var(--pp-text-0);margin-top:4px;font-size:.95rem;font-weight:600}.portal-session-actions{flex-wrap:wrap;gap:8px;display:flex}.portal-metric-grid{gap:var(--pp-space-3);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.portal-metric-card{border:1px solid var(--pp-line);border-radius:var(--pp-radius-m);padding:var(--pp-space-3);background:var(--pp-bg-soft)}.portal-metric-label{color:var(--pp-text-2);font-size:.85rem}.portal-metric-value{color:var(--pp-text-0);margin-top:6px;font-size:1.5rem;font-weight:700}.portal-status-tag{border:1px solid #0000;border-radius:999px;align-items:center;gap:6px;padding:4px 10px;font-size:.76rem;font-weight:700;display:inline-flex}.portal-status-tag.pending{color:#854d0e;background:#fff7d6;border-color:#f7d789}.portal-status-tag.processing{color:#1d4ed8;background:#e8f2ff;border-color:#9ec5ff}.portal-status-tag.success{color:#0f6d3c;background:#ddf8e8;border-color:#8ad5ad}.portal-status-tag.danger{color:#a32020;background:#fee8e8;border-color:#f4aaaa}.portal-empty{border:1px dashed var(--pp-line-strong);border-radius:var(--pp-radius-m);padding:var(--pp-space-5);text-align:center;color:var(--pp-text-2);background:var(--pp-bg-soft)}.portal-empty-action{margin-top:var(--pp-space-3)}.portal-link-btn{border-radius:var(--pp-radius-s);border:1px solid var(--pp-line-strong);min-height:42px;color:var(--pp-text-1);background:var(--pp-link-btn-bg);transition:all var(--pp-transition-fast) ease;justify-content:center;align-items:center;padding:0 16px;font-weight:600;text-decoration:none;display:inline-flex}.portal-link-btn:hover{border-color:var(--pp-primary);color:var(--pp-primary)}.portal-flow{gap:var(--pp-space-2);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.portal-flow-item{border:1px solid var(--pp-line);border-radius:var(--pp-radius-s);background:var(--pp-bg-soft);color:var(--pp-text-1);align-items:center;gap:8px;padding:10px 12px;font-size:.88rem;display:flex}.portal-flow-index{border:1px solid var(--pp-line-strong);border-radius:999px;justify-content:center;align-items:center;width:24px;height:24px;font-size:.78rem;font-weight:700;display:inline-flex}.portal-plan-grid{gap:var(--pp-space-3);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.portal-plan-item{border:1px solid var(--pp-line);border-radius:var(--pp-radius-l);background:var(--pp-bg-1);height:100%;padding:var(--pp-space-4);transition:transform var(--pp-transition-fast) ease, box-shadow var(--pp-transition-fast) ease, border-color var(--pp-transition-fast) ease;flex-direction:column;display:flex}.portal-plan-item:hover{box-shadow:var(--pp-shadow-elevated);border-color:var(--pp-plan-hover-border);transform:translateY(-2px)}.portal-plan-item.is-active{border-color:var(--pp-plan-active-border);box-shadow:0 0 0 2px var(--pp-plan-active-halo), var(--pp-shadow-card)}.portal-plan-top{justify-content:space-between;align-items:flex-start;gap:var(--pp-space-2);display:flex}.portal-plan-title{margin:0;font-size:1.2rem}.portal-plan-desc{color:var(--pp-text-2);min-height:44px;margin-top:8px;font-size:.9rem;line-height:1.5}.portal-plan-price{margin-top:var(--pp-space-3);align-items:baseline;gap:6px;display:flex}.portal-plan-price-main{font-size:2.2rem;font-weight:800;line-height:1}.portal-plan-price-period{color:var(--pp-text-2);font-size:1rem}.portal-plan-origin{color:var(--pp-text-2);margin-top:6px;font-size:.84rem;text-decoration:line-through}.portal-plan-save{color:var(--pp-success);margin-top:4px;font-size:.84rem;font-weight:600}.portal-plan-divider{border-top:1px dashed var(--pp-line);margin:var(--pp-space-3) 0}.portal-plan-features{color:var(--pp-text-1);gap:8px;margin:0;padding:0;font-size:.9rem;list-style:none;display:grid}.portal-plan-features li:before{content:"✓";color:var(--pp-primary);margin-right:8px;font-weight:700}.portal-plan-footer{padding-top:var(--pp-space-3);margin-top:auto}.portal-table-wrap{border:1px solid var(--pp-line);border-radius:var(--pp-radius-m);overflow-x:auto}.portal-table{border-collapse:collapse;width:100%;min-width:760px}.portal-table thead{background:var(--pp-table-head-bg)}.portal-table th,.portal-table td{border-bottom:1px solid var(--pp-table-line);text-align:left;white-space:nowrap;padding:12px 14px}.portal-table tbody tr:hover{background:var(--pp-table-row-hover)}.portal-step-track{gap:var(--pp-space-2);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.portal-step{border:1px solid var(--pp-line);border-radius:var(--pp-radius-s);background:var(--pp-bg-soft);color:var(--pp-text-2);padding:10px 12px;font-size:.86rem}.portal-step.is-active{border-color:var(--pp-step-active-border);color:var(--pp-primary);background:var(--pp-step-active-bg);font-weight:700}.portal-guide-layout{gap:var(--pp-space-3);grid-template-columns:280px minmax(0,1fr);display:grid}.portal-guide-toc{align-self:start;position:sticky;top:16px}.portal-guide-toc-list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.portal-guide-toc-link{border:1px solid var(--pp-line);border-radius:var(--pp-radius-s);color:var(--pp-text-1);background:var(--pp-guide-link-bg);padding:10px 12px;font-size:.9rem;text-decoration:none;display:block}.portal-guide-toc-link:hover{border-color:var(--pp-primary);color:var(--pp-primary)}.portal-guide-risk{border-color:var(--pp-guide-risk-border)!important;background:var(--pp-guide-risk-bg)!important}.portal-faq-item{border:1px solid var(--pp-line);border-radius:var(--pp-radius-s);background:var(--pp-faq-bg);padding:10px 12px}.portal-faq-item+.portal-faq-item{margin-top:10px}.portal-faq-item summary{cursor:pointer;font-weight:600}.portal-faq-item p{color:var(--pp-text-2);margin-top:8px;font-size:.9rem;line-height:1.55}.payment-portal-shell [role=alert]{border-color:var(--pp-alert-border);background:var(--pp-alert-bg)}.payment-portal-shell [role=alert].text-destructive{background:#fef2f2e6;border-color:#dc26266b}.portal-pay-qrcode-wrap{justify-content:center;align-items:center;width:224px;min-height:224px;margin:0 auto;display:flex;position:relative}.portal-pay-qrcode-mask{background:var(--pp-qrcode-mask-bg);color:#fff;border-radius:.5rem;justify-content:center;align-items:center;font-size:1.25rem;font-weight:700;display:flex;position:absolute;inset:0}.dark .payment-portal-shell .portal-status-tag.pending{color:#ffdf77;background:#ffd4472e;border-color:#ffd44775}.dark .payment-portal-shell .portal-status-tag.processing{color:#d9b8ff;background:#b87cff33;border-color:#b87cff80}.dark .payment-portal-shell .portal-status-tag.success{color:#7eecc9;background:#31d9a229;border-color:#31d9a275}.dark .payment-portal-shell .portal-status-tag.danger{color:#ff9ab0;background:#ff6b8729;border-color:#ff6b8770}@media (max-width:1200px){.portal-plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.portal-grid-2,.portal-guide-layout{grid-template-columns:1fr}.portal-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.portal-guide-toc{position:static}}@media (max-width:767px){.payment-portal-main{padding:var(--pp-space-3) var(--pp-space-2) var(--pp-space-5)}.payment-portal-shell [data-slot=button]{min-height:42px}.payment-portal-hero{padding:var(--pp-space-4)}.payment-portal-title{font-size:1.5rem}.portal-page{gap:var(--pp-space-3)}.portal-session-bar{padding:12px}.portal-session-actions{width:100%}.portal-session-actions>*{flex:1 1 0}.portal-link-btn{width:100%;padding:0 14px}.portal-plan-grid,.portal-metric-grid,.portal-flow,.portal-step-track{grid-template-columns:1fr}.portal-table{min-width:680px}}