.ref-page .page-title{align-items:center;gap:var(--space-3);display:flex}.ref-page .page-title .material-symbols-outlined{color:var(--primary);font-size:24px}.ref-share-grid{gap:var(--space-5);margin-top:var(--space-5);grid-template-columns:1fr 1fr;display:grid}.ref-code-card,.ref-link-card{overflow:hidden}.ref-code-body,.ref-link-body{padding:var(--space-5);gap:var(--space-4);flex-direction:column;display:flex}.ref-code-display,.ref-link-display{align-items:center;gap:var(--space-3);background:var(--surface-container);border:1px solid var(--ghost-border);border-radius:var(--radius-sm);padding:var(--space-3) var(--space-4);display:flex;overflow:hidden}.ref-code-value{font-family:var(--font-mono);color:var(--primary);letter-spacing:.08em;flex:1;min-width:0;font-size:1.25rem;font-weight:700}.ref-link-value{font-family:var(--font-mono);color:var(--on-surface-variant);text-overflow:ellipsis;white-space:nowrap;background:0 0;flex:1;min-width:0;font-size:.7rem;overflow:hidden}.ref-copy-btn{border-radius:var(--radius-sm);font-family:var(--font-mono);background:var(--primary);color:var(--on-primary,#fff);cursor:pointer;white-space:nowrap;border:none;flex-shrink:0;align-items:center;gap:4px;padding:6px 14px;font-size:.6875rem;font-weight:600;transition:all .15s;display:inline-flex}.ref-copy-btn:hover:not(:disabled){filter:brightness(1.15);transform:translateY(-1px)}.ref-copy-btn:disabled{opacity:.4;cursor:not-allowed}.ref-share-x-btn{justify-content:center;align-items:center;gap:var(--space-2);padding:10px var(--space-4);border-radius:var(--radius-sm);font-family:var(--font-mono);background:var(--surface-container-high);color:var(--on-surface);border:1px solid var(--ghost-border);cursor:pointer;font-size:.75rem;font-weight:600;transition:all .15s;display:inline-flex}.ref-share-x-btn:hover:not(:disabled){background:var(--surface-container-highest);border-color:var(--outline-variant);transform:translateY(-1px)}.ref-share-x-btn:disabled{opacity:.4;cursor:not-allowed}.ref-stats-row{gap:var(--space-5);margin-top:var(--space-5);grid-template-columns:1fr 1fr;display:grid}.ref-stat-card{align-items:center;gap:var(--space-4);padding:var(--space-5);display:flex}.ref-stat-icon-wrap{border-radius:var(--radius-sm);background:linear-gradient(135deg,#4b8eff1f,#9333ea1f);border:1px solid #4b8eff26;flex-shrink:0;justify-content:center;align-items:center;width:48px;height:48px;display:flex}.ref-stat-icon-wrap .material-symbols-outlined{color:var(--primary);font-size:22px}.ref-stat-icon-xp{background:linear-gradient(135deg,#f59e0b1f,#fbbf241f)!important;border-color:#f59e0b26!important}.ref-stat-icon-xp .material-symbols-outlined{color:#f59e0b!important}.ref-stat-content{flex-direction:column;gap:2px;display:flex}.ref-stat-label{font-family:var(--font-mono);color:var(--outline);letter-spacing:.08em;text-transform:uppercase;font-size:.6rem;font-weight:600}.ref-stat-value{font-family:var(--font-display);color:var(--on-surface);font-size:1.5rem;font-weight:700}.ref-how-it-works{margin-top:var(--space-5);overflow:hidden}.ref-steps{padding:var(--space-5);gap:var(--space-5);flex-direction:column;display:flex}.ref-step{gap:var(--space-4);align-items:flex-start;display:flex}.ref-step-num{background:linear-gradient(135deg, var(--primary), #9333eacc);color:#fff;width:32px;height:32px;font-family:var(--font-mono);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.75rem;font-weight:700;display:flex}.ref-step-content h4{font-family:var(--font-display);color:var(--on-surface);margin:0 0 var(--space-1) 0;font-size:.9rem;font-weight:700}.ref-step-content p{font-family:var(--font-body);color:var(--on-surface-variant);margin:0;font-size:.8rem;line-height:1.6}.ref-connect-prompt{margin-top:var(--space-6);padding:var(--space-10) var(--space-6);text-align:center;align-items:center;gap:var(--space-4);flex-direction:column;display:flex}.ref-connect-icon{color:var(--outline);opacity:.5;font-size:48px!important}.ref-connect-title{font-family:var(--font-display);color:var(--on-surface);margin:0;font-size:1.2rem;font-weight:700}.ref-connect-desc{font-family:var(--font-body);color:var(--outline);max-width:400px;margin:0;font-size:.85rem;line-height:1.6}@media (max-width:768px){.ref-share-grid,.ref-stats-row{gap:var(--space-4);grid-template-columns:1fr}.ref-code-value{font-size:1rem}.ref-link-value{font-size:.6rem}.ref-code-display,.ref-link-display{flex-direction:column;align-items:stretch}.ref-copy-btn{justify-content:center;min-height:44px}.ref-share-x-btn{min-height:44px}.ref-stat-card{padding:var(--space-4)}.ref-stat-value{font-size:1.25rem}.ref-step{gap:var(--space-3)}}@property --ref-holo-angle{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes ref-holo-spin{0%{--ref-holo-angle:0deg}to{--ref-holo-angle:360deg}}@keyframes ref-card-enter{0%{opacity:0;filter:blur(6px);transform:translateY(18px)scale(.97)}to{opacity:1;filter:blur();transform:translateY(0)scale(1)}}@keyframes ref-gradient-border{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}@keyframes ref-shimmer-sweep{0%{transform:translate(-100%)skew(-15deg)}to{transform:translate(200%)skew(-15deg)}}@keyframes ref-green-pulse{0%,to{text-shadow:0 0 6px #3ce42f40}50%{text-shadow:0 0 14px #3ce42f80,0 0 28px #3ce42f26}}.ref-code-card{background:var(--glass-bg,#1e1e288c);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border,#ffffff0f);animation:ref-card-enter .5s var(--ease-out-expo) .1s both;position:relative;overflow:hidden}.ref-code-card:before{content:"";background:conic-gradient(from var(--ref-holo-angle), var(--primary) 0%, var(--secondary) 25%, #8b5cf6 50%, var(--primary) 75%, var(--secondary) 100%);height:2px;animation:4s linear infinite ref-holo-spin;position:absolute;top:0;left:0;right:0}.ref-link-card{background:var(--glass-bg,#1e1e288c);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border,#ffffff0f);animation:ref-card-enter .5s var(--ease-out-expo) .18s both;position:relative;overflow:hidden}.ref-link-card:before{content:"";background:linear-gradient(90deg, var(--primary), var(--secondary), #8b5cf6, var(--primary));background-size:200% 100%;height:2px;animation:3s infinite ref-gradient-border;position:absolute;top:0;left:0;right:0}.ref-copy-btn{border-radius:10px;padding:8px 18px;position:relative;overflow:hidden}.ref-copy-btn:after{content:"";background:linear-gradient(90deg,#0000,#ffffff2e,#0000);width:50%;height:100%;animation:2.5s ease-in-out infinite ref-shimmer-sweep;position:absolute;top:0;left:-100%}.ref-stat-card{background:var(--glass-bg,#1e1e288c);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border,#ffffff0f);transition:transform .3s var(--ease-out-expo), box-shadow .3s ease;border-radius:14px;padding:24px;position:relative;overflow:hidden}.ref-stat-card:before{content:"";background:linear-gradient(90deg, var(--primary), var(--secondary), #8b5cf6, var(--primary));background-size:200% 100%;height:2px;animation:3s infinite ref-gradient-border;position:absolute;top:0;left:0;right:0}.ref-stat-card:first-child{animation:ref-card-enter .5s var(--ease-out-expo) .26s both}.ref-stat-card:nth-child(2){animation:ref-card-enter .5s var(--ease-out-expo) .34s both}.ref-stat-card:hover{transform:translateY(-2px);box-shadow:0 8px 32px #4b8eff14}.ref-stat-value{transition:transform .25s var(--ease-out-expo), text-shadow .25s ease;cursor:default;font-size:1.5rem}.ref-stat-value:hover{text-shadow:0 0 12px #4b8eff4d,0 0 24px #4b8eff14;transform:scale(1.05)}.ref-stat-icon-xp+.ref-stat-content .ref-stat-value{color:#f59e0b;text-shadow:0 0 8px #f59e0b59,0 0 20px #f59e0b1a}.ref-how-it-works{background:var(--glass-bg,#1e1e288c);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border,#ffffff0f);animation:ref-card-enter .5s var(--ease-out-expo) .42s both;position:relative;overflow:hidden}.ref-how-it-works:before{content:"";background:linear-gradient(90deg, var(--primary), var(--secondary), #8b5cf6, var(--primary));background-size:200% 100%;height:2px;animation:3s infinite ref-gradient-border;position:absolute;top:0;left:0;right:0}.ref-step{transition:transform .25s var(--ease-out-expo), box-shadow .3s ease, background .2s ease;border-radius:10px;padding:14px}.ref-step:hover{background:#4b8eff0a;transform:translate(3px);box-shadow:0 2px 16px #4b8eff14,inset 0 0 0 1px #4b8eff1f}.ref-steps .ref-step:first-child{animation:ref-card-enter .4s var(--ease-out-expo) .5s both}.ref-steps .ref-step:nth-child(2){animation:ref-card-enter .4s var(--ease-out-expo) .58s both}.ref-steps .ref-step:nth-child(3){animation:ref-card-enter .4s var(--ease-out-expo) .66s both}.ref-steps .ref-step:nth-child(4){animation:ref-card-enter .4s var(--ease-out-expo) .74s both}.ref-stat-label{font-size:.72rem}.ref-code-value{font-size:1.25rem}.ref-link-value,.ref-copy-btn{font-size:.75rem}.ref-share-x-btn{border-radius:12px;padding:12px 24px;font-size:.75rem}.ref-step-content h4{font-size:.9rem}.ref-step-content p{font-size:.8rem}.ref-share-grid,.ref-stats-row{gap:24px;margin-top:24px}.ref-code-body,.ref-link-body{padding:24px}.ref-steps{gap:24px;padding:24px}.ref-share-x-btn{transition:all .25s var(--ease-out-expo);position:relative;overflow:hidden}.ref-share-x-btn:after{content:"";background:linear-gradient(90deg,#0000,#ffffff0f,#0000);width:50%;height:100%;transition:none;position:absolute;top:0;left:-100%}.ref-share-x-btn:hover:not(:disabled):after{animation:.8s ease-out forwards ref-shimmer-sweep}.ref-connect-prompt{background:var(--glass-bg,#1e1e288c);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border,#ffffff0f);animation:ref-card-enter .6s var(--ease-out-expo) both;border-radius:16px}