:root{--brand-700: #4338ca;--brand-600: #4f46e5;--brand-500: #6366f1;--violet-600: #7c3aed;--violet-500: #8b5cf6;--ink-900: #0f172a;--ink-700: #334155;--ink-500: #64748b;--ink-400: #94a3b8;--ink-300: #cbd5e1;--line: #e8eaf3;--success: #16a34a;--success-soft: #eaf8f0;--warning: #b45309;--warning-soft: #fdf3e3;--danger: #dc2626;--danger-soft: #fdeeee;--brand-soft: #eef0fe;--radius-xl: 20px;--radius-lg: 14px;--radius-md: 10px;--shadow-card: 0 18px 48px -16px rgba(30, 27, 75, .35), 0 2px 6px rgba(15, 23, 42, .06);--gradient-brand: linear-gradient(135deg, var(--brand-600) 0%, var(--violet-600) 100%)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{min-height:100vh;min-height:100dvh;color:var(--ink-900);font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Helvetica Neue,Microsoft YaHei,system-ui,sans-serif;-webkit-font-smoothing:antialiased;background:radial-gradient(120% 60% at 85% -10%,#8b5cf68c,#8b5cf600 60%),radial-gradient(90% 50% at 0% 0%,#6366f180,#6366f100 55%),linear-gradient(168deg,#312e81,#4f46e5 46%,#7c3aed);background-attachment:fixed}#root{min-height:100vh;min-height:100dvh}.page{max-width:440px;margin:0 auto;padding:calc(44px + env(safe-area-inset-top)) 20px calc(40px + env(safe-area-inset-bottom))}.brand{text-align:center;margin-bottom:26px;color:#fff}.brand-mark{width:56px;height:56px;margin:0 auto 14px;border-radius:18px;display:flex;align-items:center;justify-content:center;background:#ffffff29;border:1px solid rgba(255,255,255,.28);box-shadow:0 10px 28px -8px #0f0a3c8c;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.brand h1{margin:0;font-size:30px;font-weight:700;letter-spacing:4px;text-shadow:0 2px 12px rgba(15,10,60,.35)}.slogan{margin:10px 0 0;color:#ffffffd1;font-size:14px;letter-spacing:1px}.card{background:#fff;border-radius:var(--radius-xl);padding:28px 22px;box-shadow:var(--shadow-card);animation:card-in .32s ease both}.card+.card{margin-top:16px}@keyframes card-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.card h2{margin:0 0 6px;font-size:19px;font-weight:700;letter-spacing:.5px}.card .card-sub{margin:0 0 20px;font-size:13px;color:var(--ink-500)}.card p{line-height:1.7}input{width:100%;padding:13px 14px;font-size:16px;color:var(--ink-900);background:#f8f9fd;border:1.5px solid var(--line);border-radius:var(--radius-lg);outline:none;transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}input::placeholder{color:var(--ink-400)}input:focus{border-color:var(--brand-500);background:#fff;box-shadow:0 0 0 4px #6366f124}.code-input{height:58px;text-align:center;font-size:20px;font-weight:600;letter-spacing:3px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}button{width:100%;margin-top:14px;padding:14px;font-size:16px;font-weight:600;font-family:inherit;border:none;border-radius:var(--radius-lg);cursor:pointer;transition:transform .12s ease,box-shadow .15s ease,opacity .15s ease;-webkit-tap-highlight-color:transparent}button:disabled{opacity:.55;cursor:default}button.primary{background:var(--gradient-brand);color:#fff;box-shadow:0 10px 22px -8px #6366f1a6}button.primary:not(:disabled):active{transform:scale(.975);box-shadow:0 4px 12px -6px #6366f18c}button.link{background:none;color:var(--brand-600);font-size:14px;font-weight:500;padding:10px}.error{color:var(--danger);font-size:13px;margin:10px 0 0}.hint{color:var(--ink-500);font-size:13px}.qr-box{position:relative;display:flex;justify-content:center;margin:18px 0 20px}.qr-frame{position:relative;padding:12px;border-radius:var(--radius-xl);background:#fff;border:1px solid var(--line);box-shadow:0 10px 30px -12px #1e1b4b40}.qr-frame img{display:block;border-radius:var(--radius-md)}.qr-placeholder{width:236px;height:236px;display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;background:var(--brand-soft);border-radius:var(--radius-md);color:var(--ink-500);font-size:13px}.qr-overlay{position:absolute;top:12px;right:12px;bottom:12px;left:12px;display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;border-radius:var(--radius-md);background:#ffffffe0;color:var(--ink-500);font-size:13px}.spinner{width:26px;height:26px;border-radius:50%;border:3px solid var(--brand-soft);border-top-color:var(--brand-600);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.status-row{display:flex;align-items:center;justify-content:center;gap:12px}.status-pill{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:999px;font-size:13px;font-weight:600}.status-pill:before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}.status-pill.is-waiting{color:var(--brand-600);background:var(--brand-soft)}.status-pill.is-waiting:before{animation:pulse 1.6s ease-in-out infinite}.status-pill.is-scanned{color:var(--warning);background:var(--warning-soft)}.status-pill.is-done{color:var(--success);background:var(--success-soft)}.status-pill.is-error{color:var(--danger);background:var(--danger-soft)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}.countdown-ring{position:relative;width:46px;height:46px;flex:none}.countdown-ring svg{display:block;transform:rotate(-90deg)}.countdown-ring .ring-track{stroke:var(--brand-soft)}.countdown-ring .ring-value{stroke:var(--brand-600);stroke-linecap:round;transition:stroke-dashoffset 1s linear,stroke .3s ease}.countdown-ring.is-low .ring-value{stroke:var(--danger)}.countdown-ring .ring-text{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:var(--ink-700);font-variant-numeric:tabular-nums}.countdown-ring.is-low .ring-text{color:var(--danger)}.verify-box{margin-top:18px;padding-top:18px;border-top:1px dashed var(--line)}.verify-box p{margin:0 0 12px;font-size:14px;color:var(--ink-700)}.member-card{padding:0;overflow:hidden}.member-head{padding:22px 22px 18px;background:var(--gradient-brand);color:#fff}.member-head .plan-name{margin:0;font-size:21px;font-weight:700;letter-spacing:1px;display:flex;align-items:center;gap:10px}.plan-badge{font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px;background:#ffffff38;border:1px solid rgba(255,255,255,.35)}.member-head .plan-expire{margin:8px 0 0;font-size:12px;color:#ffffffc7}.member-body{padding:18px 22px 8px}.quota-row{margin-bottom:16px}.quota-row .quota-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:7px;font-size:13px}.quota-row .quota-label{color:var(--ink-700);font-weight:500}.quota-row .quota-num{color:var(--ink-500);font-size:12px;font-variant-numeric:tabular-nums}.quota-row .quota-num strong{color:var(--ink-900);font-size:13px}.quota-bar{height:7px;border-radius:999px;background:#eef0f6;overflow:hidden}.quota-bar .quota-fill{height:100%;border-radius:999px;background:var(--gradient-brand);transition:width .5s ease}.quota-bar.is-low .quota-fill{background:linear-gradient(90deg,#f59e0b,#ef4444)}.member-empty{padding:22px;color:var(--ink-500);font-size:14px}.badge{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;font-size:13px;font-weight:600}.badge:before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}.badge.is-online{color:var(--success);background:var(--success-soft)}.badge.is-expired{color:var(--warning);background:var(--warning-soft)}.badge.is-offline{color:var(--ink-500);background:#f1f3f9}.section-title{margin:26px 0 12px;font-size:15px;font-weight:700;color:#ffffffeb;letter-spacing:.5px}.success-icon{display:flex;justify-content:center;margin:8px 0 20px}.success-icon svg{animation:pop-in .45s cubic-bezier(.34,1.56,.64,1) both}.success-icon .check-path{stroke-dasharray:60;stroke-dashoffset:60;animation:draw .5s ease .25s forwards}@keyframes pop-in{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes draw{to{stroke-dashoffset:0}}.success-title{text-align:center}.success-desc{text-align:center;color:var(--ink-500);font-size:14px;margin:4px 0 6px}.footer{margin-top:28px;text-align:center;font-size:12px;color:#ffffff8c;letter-spacing:.5px}
