app-referral-calculator{display:block}app-referral-calculator .rc{border:1px solid var(--mg-stroke);background:var(--mg-surface);min-width:0;box-shadow:var(--mg-shadow);border-radius:22px;padding:1.75rem}app-referral-calculator .rc-modes{flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem;display:flex}app-referral-calculator .rc-mode{border:1px solid var(--mg-stroke);color:var(--mg-text);font:inherit;cursor:pointer;background:0 0;border-radius:999px;padding:.55rem 1rem;font-size:.88rem;font-weight:500;transition:background .2s,border-color .2s,color .2s}app-referral-calculator .rc-mode:hover{border-color:var(--mg-brand-alt)}app-referral-calculator .rc-mode--on{background:var(--mg-brand);border-color:var(--mg-brand);color:var(--mg-on-brand)}app-referral-calculator .rc-mode:focus-visible,app-referral-calculator .rc-slider:focus-visible,app-referral-calculator .rc-amount input:focus-visible{outline:2px solid var(--mg-focus);outline-offset:3px}app-referral-calculator .rc-label{color:var(--mg-muted);margin-bottom:.4rem;font-size:.82rem;font-weight:600;display:block}app-referral-calculator .rc-amount{color:var(--mg-text);border-bottom:2px solid var(--mg-stroke);align-items:baseline;gap:.35rem;margin-bottom:1.25rem;font-size:clamp(1.8rem,4vw,2.4rem);font-weight:700;display:flex}app-referral-calculator .rc-amount input{width:100%;min-width:0;font:inherit;color:inherit;background:0 0;border:0;flex:1;padding:.1rem 0 .3rem}app-referral-calculator .rc-slider{appearance:none;background:linear-gradient(to right, var(--mg-brand) var(--fill), var(--mg-stroke) var(--fill));cursor:pointer;border-radius:999px;width:100%;min-width:0;height:6px;display:block}app-referral-calculator .rc-slider::-webkit-slider-thumb{-webkit-appearance:none;background:var(--mg-surface);border:3px solid var(--mg-brand);width:22px;height:22px;box-shadow:var(--mg-shadow);border-radius:50%}app-referral-calculator .rc-slider::-moz-range-thumb{background:var(--mg-surface);border:3px solid var(--mg-brand);border-radius:50%;width:18px;height:18px}app-referral-calculator .rc-scale{color:var(--mg-muted);justify-content:space-between;margin-top:.5rem;font-size:.78rem;display:flex}app-referral-calculator .rc-result{background:linear-gradient(135deg, var(--mg-brand) 0%, var(--mg-tertiary) 100%);color:var(--mg-on-brand);border-radius:16px;gap:.15rem;margin-top:1.5rem;padding:1.25rem 1.4rem;display:grid}app-referral-calculator .rc-result-label{opacity:.85;font-size:.85rem}app-referral-calculator .rc-result-value{letter-spacing:-.02em;font-size:clamp(2rem,5vw,2.8rem);font-weight:700;line-height:1.1}app-referral-calculator .rc-result-note{opacity:.9;font-size:.85rem}@media (width<=560px){app-referral-calculator .rc{padding:1.25rem}}app-referral-calculator .rc-label-note{background:var(--mg-brand-soft);color:var(--mg-brand-deep);border-radius:6px;margin-left:.35rem;padding:.1rem .45rem;font-weight:700}html.theme-dark app-referral-calculator .rc-label-note{color:var(--mg-text);background:color-mix(in srgb, var(--mg-brand) 45%, transparent)}app-referral .rf-hero{background:radial-gradient(60rem 26rem at 85% -10%, rgba(var(--mg-wash-rgb), .12), transparent 60%), linear-gradient(180deg, var(--mg-hero-wash-1), var(--mg-hero-wash-2));border-bottom:1px solid var(--mg-stroke);padding:3.5rem 0 3rem;position:relative}app-referral .rf-hero-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:center;gap:2.5rem 3.5rem;display:grid}app-referral .rf-accent{color:var(--mg-brand-ink);background-image:var(--mg-accent-mark);-webkit-box-decoration-break:clone;box-decoration-break:clone}app-referral .rf-hero .pg-lead{max-width:36rem;margin-top:1.1rem}app-referral .rf-hero-note{color:var(--mg-muted);margin:1rem 0 0;font-size:.9rem}app-referral .rf-hero-note a{color:var(--mg-link);font-weight:600}app-referral .rf-stack{border:1px solid var(--mg-stroke);background:var(--mg-surface);box-shadow:var(--mg-shadow-lg);border-radius:24px;gap:.6rem;padding:1.4rem;display:grid}app-referral .rf-stack-head{color:var(--mg-muted);align-items:center;gap:.55rem;margin-bottom:.3rem;font-size:.92rem;display:flex}app-referral .rf-stack-head b{color:var(--mg-text)}app-referral .rf-dot{background:var(--mg-brand);width:9px;height:9px;box-shadow:0 0 0 5px rgba(var(--mg-glow-rgb), .15);border-radius:50%}app-referral .rf-stack-row{background:color-mix(in srgb, var(--mg-brand) 5%, var(--mg-surface));animation:rf-rise .6s var(--pg-ease) both;animation-delay:calc(var(--i) * .12s + .15s);border-radius:14px;justify-content:space-between;align-items:center;gap:1rem;padding:.85rem 1rem;display:flex}app-referral .rf-stack-row span{color:var(--mg-text);font-weight:600;display:grid}app-referral .rf-stack-row small{color:var(--mg-muted);font-size:.8rem;font-weight:400}app-referral .rf-stack-row b{color:var(--mg-success);font-variant-numeric:tabular-nums;font-size:1.05rem}app-referral .rf-stack-total{border-top:1px dashed var(--mg-stroke);color:var(--mg-muted);justify-content:space-between;align-items:baseline;margin-top:.4rem;padding:1rem 1rem .2rem;font-size:.9rem;display:flex}app-referral .rf-stack-total b{color:var(--mg-brand-ink);font-variant-numeric:tabular-nums;font-size:1.6rem}@keyframes rf-rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){app-referral .rf-stack-row{animation:none}}app-referral .rf-steps{counter-reset:none;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem;margin:0;padding:0;list-style:none;display:grid}app-referral .rf-step{border:1px solid var(--mg-stroke);border-radius:var(--pg-radius);background:var(--mg-surface);padding:1.6rem;position:relative}app-referral .rf-step-n{background:var(--mg-brand);width:2.4rem;height:2.4rem;color:var(--mg-on-brand);border-radius:50%;place-items:center;margin-bottom:1rem;font-weight:700;display:inline-grid}app-referral .rf-step:last-child{border-color:color-mix(in srgb, var(--mg-brand) 40%, var(--mg-stroke));background:color-mix(in srgb, var(--mg-brand) 5%, var(--mg-surface))}app-referral .rf-step p{color:var(--mg-muted);margin:.5rem 0 0;line-height:1.6}app-referral .rf-ways{grid-template-columns:1.3fr 1fr 1fr;gap:1.25rem;display:grid}app-referral .rf-way{border:1px solid var(--mg-stroke);border-radius:var(--pg-radius);background:var(--mg-surface);padding:1.6rem}app-referral .rf-way p{color:var(--mg-muted);margin:.5rem 0 0;line-height:1.6}app-referral .rf-way-rate{letter-spacing:-.03em;color:var(--mg-brand-ink);margin-bottom:.8rem;font-size:clamp(2.4rem,5vw,3.2rem);font-weight:700;line-height:1;display:block}app-referral .rf-way--main{background:linear-gradient(140deg, var(--mg-brand) 0%, var(--mg-tertiary) 100%);color:var(--mg-on-brand);border-color:#0000}app-referral .rf-way--main .rf-way-rate,app-referral .rf-way--main .pg-h3,app-referral .rf-way--main p{color:var(--mg-on-brand)}app-referral .rf-way--main p{opacity:.9}app-referral .rf-calc-grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:start;gap:2rem 3rem;display:grid}app-referral .rf-story{margin:0;padding:0;list-style:none;position:relative}app-referral .rf-story:before{content:"";background:color-mix(in srgb, var(--mg-brand) 30%, var(--mg-stroke));width:2px;position:absolute;top:14px;bottom:14px;left:11px}app-referral .rf-story li{border-bottom:1px solid var(--mg-stroke);color:var(--mg-muted);grid-template-columns:11rem minmax(0,1fr) auto;align-items:baseline;gap:.4rem 1.5rem;padding:1rem 0 1rem 2.4rem;display:grid;position:relative}app-referral .rf-story li:last-child{border-bottom:0}app-referral .rf-story li:before{content:"";background:var(--mg-surface);border:3px solid var(--mg-brand);border-radius:50%;width:16px;height:16px;position:absolute;top:1.25rem;left:4px}app-referral .rf-story-who{color:var(--mg-text);font-weight:600}app-referral .rf-story b{color:var(--mg-success);white-space:nowrap;font-variant-numeric:tabular-nums}app-referral .rf-faq{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:2rem 3rem;display:grid}@media (width<=960px){app-referral .rf-hero-grid,app-referral .rf-calc-grid,app-referral .rf-faq,app-referral .rf-steps,app-referral .rf-ways{grid-template-columns:minmax(0,1fr)}}@media (width<=640px){app-referral .rf-hero{padding:2.25rem 0 2rem}app-referral .rf-story li{grid-template-columns:1fr}app-referral .rf-story b{white-space:normal}}app-referral .rf-note{max-width:40rem;margin-top:1.1rem}app-referral .rf-note--above{margin:0 0 1rem}app-referral .rf-ways-top{max-width:40rem;margin-top:1.25rem}app-referral .rf-stack-head--next{margin-top:.6rem}
