.rank-benefits-dialog { --rank-accent-rgb:242,200,75; width:min(980px,calc(100vw - 40px)); max-width:none; max-height:calc(100dvh - 48px); padding:0; border:1px solid rgba(var(--rank-accent-rgb),.35); border-radius:24px; color:#eaf0f4; background:#0b1017; box-shadow:0 30px 130px #000b,0 0 65px rgba(var(--rank-accent-rgb),.1); overflow:hidden; font-family:Poppins,sans-serif; }
.public-site.rank-dialog-open .nav { opacity:0; transform:translate3d(0,-100%,0); pointer-events:none; transition:none; }
.rank-benefits-dialog[open] { display:flex; flex-direction:column; animation:rank-dialog-enter .48s cubic-bezier(.16,1,.3,1) both; }
.rank-benefits-dialog::backdrop { background:#02050bd9; backdrop-filter:blur(9px); animation:rank-backdrop-enter .38s ease both; }
.rank-benefits-dialog.is-closing { pointer-events:none; animation:rank-dialog-exit .24s cubic-bezier(.4,0,1,1) both; }
.rank-benefits-dialog.is-closing::backdrop { animation:rank-backdrop-exit .24s ease both; }
.rank-dialog-header { position:relative; display:flex; align-items:center; gap:28px; padding:30px 64px 28px 34px; border-bottom:1px solid rgba(var(--rank-accent-rgb),.18); background:radial-gradient(ellipse at 4% 20%,rgba(var(--rank-accent-rgb),.2),transparent 65%),linear-gradient(120deg,#ffffff03,transparent); flex-shrink:0; }
.rank-dialog-emblem { position:relative; isolation:isolate; display:grid; place-items:center; flex:0 0 116px; height:116px; border-radius:50%; background:radial-gradient(circle,rgba(var(--rank-accent-rgb),.17),transparent 72%); }
.rank-dialog-emblem::before { content:""; position:absolute; inset:14%; z-index:0; border-radius:50%; background:radial-gradient(circle,rgba(var(--rank-accent-rgb),.24),rgba(var(--rank-accent-rgb),.07) 48%,transparent 72%); filter:blur(7px); animation:rank-emblem-aura 4.2s ease-in-out infinite; }
.rank-dialog-emblem::after { content:""; position:absolute; left:23%; right:23%; bottom:7%; z-index:0; height:10px; border-radius:50%; background:rgba(var(--rank-accent-rgb),.25); filter:blur(8px); animation:rank-emblem-shadow 4.2s ease-in-out infinite; }
.rank-dialog-emblem img { position:relative; z-index:1; width:108px; height:108px; object-fit:contain; filter:drop-shadow(0 8px 11px rgba(0,0,0,.48)) drop-shadow(0 0 12px rgba(var(--rank-accent-rgb),.2)); animation:rank-emblem-float 4.2s cubic-bezier(.45,.05,.55,.95) infinite; will-change:transform,filter; }
.rank-dialog-eyebrow { font-size:10px; letter-spacing:2px; color:rgb(var(--rank-accent-rgb)); font-weight:700; }
.rank-dialog-heading h2 { margin:6px 0; font-size:44px; line-height:1.15; color:rgb(var(--rank-accent-rgb)); }
.rank-dialog-heading h2 span { display:block; color:#edf3f5; font-size:18px; font-weight:500; margin-top:8px; }
.rank-dialog-heading p { margin:9px 0 0; color:#a8b4c1; font-size:12px; }
.rank-dialog-summary { max-width:620px; margin-top:10px; color:#d5dde5; font-size:13px; line-height:1.65; }
.rank-dialog-close { position:absolute; top:18px; right:18px; width:40px; height:40px; border:1px solid #ffffff1c; border-radius:12px; background:#ffffff05; color:#c8d2db; font-size:25px; cursor:pointer; transition:transform .28s cubic-bezier(.16,1,.3,1),border-color .25s ease,color .25s ease,background-color .25s ease; }
.rank-dialog-close:hover { transform:rotate(90deg) scale(1.08); border-color:rgba(var(--rank-accent-rgb),.65); color:rgb(var(--rank-accent-rgb)); background-color:rgba(var(--rank-accent-rgb),.08); }
.rank-dialog-close:active { transform:rotate(90deg) scale(.9); }
.rank-dialog-scroll { min-height:0; overflow:auto; overscroll-behavior:contain; padding:26px 32px; scrollbar-width:thin; scrollbar-color:rgba(var(--rank-accent-rgb),.5) #0b1017; }
.rank-highlight-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.rank-highlight-grid>div { border:1px solid rgba(var(--rank-accent-rgb),.23); border-radius:14px; padding:18px; background:linear-gradient(125deg,rgba(var(--rank-accent-rgb),.1),#ffffff02); animation:rank-highlight-enter .55s cubic-bezier(.16,1,.3,1) both; transition:transform .35s cubic-bezier(.16,1,.3,1),border-color .3s ease,box-shadow .3s ease; }
.rank-highlight-grid>div:nth-child(2) { animation-delay:70ms; }.rank-highlight-grid>div:nth-child(3) { animation-delay:140ms; }
.rank-highlight-grid>div:hover { transform:translateY(-4px); border-color:rgba(var(--rank-accent-rgb),.5); box-shadow:0 12px 30px rgba(var(--rank-accent-rgb),.08); }
.rank-highlight-grid span,.rank-highlight-grid small { display:block; color:#a9b7c4; font-size:10px; }
.rank-highlight-grid strong { display:block; margin:7px 0; font-size:clamp(18px,2.5vw,27px); color:rgb(var(--rank-accent-rgb)); }
.rank-dialog-filters { display:flex; flex-wrap:wrap; gap:7px; margin-top:26px; }
.rank-dialog-filters button { padding:9px 13px; border:1px solid #ffffff15; border-radius:99px; background:#ffffff04; color:#aeb9c6; font:inherit; font-size:11px; cursor:pointer; transition:transform .25s cubic-bezier(.16,1,.3,1),background .25s,color .25s,border-color .25s,box-shadow .25s; }
.rank-dialog-filters button:hover { transform:translateY(-2px); color:#f6f9fb; border-color:rgba(var(--rank-accent-rgb),.45); }
.rank-dialog-filters button:active { transform:scale(.92); }
.rank-dialog-filters button[aria-pressed=true] { background:rgb(var(--rank-accent-rgb)); border-color:transparent; color:#0b1017; font-weight:700; }
.rank-benefit-group h3 { display:flex; gap:12px; align-items:center; font-size:16px; margin:24px 0 13px; }
.rank-benefit-group h3>span { color:rgb(var(--rank-accent-rgb)); font-size:10px; letter-spacing:1px; border:1px solid rgba(var(--rank-accent-rgb),.2); padding:6px; border-radius:7px; }
.rank-benefit-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:12px; }
.rank-benefit-tile { position:relative; width:100%; overflow:hidden; padding:18px; border:1px solid #ffffff12; border-radius:14px; color:inherit; background:linear-gradient(135deg,#ffffff05,#ffffff01); appearance:none; font:inherit; text-align:left; cursor:pointer; animation:rank-tile-enter .44s cubic-bezier(.16,1,.3,1) both; animation-delay:var(--tile-delay,0ms); transition:transform .34s cubic-bezier(.16,1,.3,1),border-color .25s,box-shadow .25s,background-color .25s; }
.rank-benefit-tile:hover { transform:translateY(-3px); border-color:rgba(var(--rank-accent-rgb),.48); box-shadow:0 12px 32px rgba(var(--rank-accent-rgb),.09); }
.rank-tile-label { display:block; font-size:10px; text-transform:uppercase; letter-spacing:.8px; color:#9aa9b9; }
.rank-benefit-tile>strong { display:block; font-size:16px; margin:8px 0 14px; font-weight:600; line-height:1.5; overflow-wrap:anywhere; }
.rank-perk-help { width:100%; display:flex; justify-content:space-between; align-items:center; padding:12px 0 0; border:0; border-top:1px solid #ffffff0b; color:rgb(var(--rank-accent-rgb)); background:transparent; font:inherit; font-size:11px; text-align:left; transition:color .22s ease,transform .25s cubic-bezier(.16,1,.3,1); }
.rank-benefit-tile:hover .rank-perk-help,.rank-benefit-tile:focus-visible .rank-perk-help { color:#fff; transform:translateX(3px); }
.rank-benefit-tile:active { transform:translateY(-1px) scale(.985); }
.rank-perk-help span { transition:transform .3s cubic-bezier(.16,1,.3,1); }
.rank-benefit-tile:hover .rank-perk-help span,.rank-benefit-tile:focus-visible .rank-perk-help span { transform:translate(2px,-2px); }
.rank-exclusions { margin:24px 0 0; padding:16px; border:1px dashed #ffffff20; border-radius:12px; font-size:12px; color:#9eacbb; }
.rank-exclusions summary { cursor:pointer; }
.rank-exclusions ul { line-height:2; padding-left:18px; }
.rank-exclusions summary span,.rank-role-kits summary i { float:right; font-style:normal; transition:transform .34s cubic-bezier(.16,1,.3,1); }
.rank-exclusions[open] summary span,.rank-role-kits[open] summary i { transform:rotate(45deg); }
.rank-role-kits { margin-top:24px; border:1px solid rgba(var(--rank-accent-rgb),.2); border-radius:14px; background:rgba(var(--rank-accent-rgb),.025); overflow:hidden; }
.rank-role-kits>summary { list-style:none; padding:17px 18px; cursor:pointer; transition:background-color .25s ease,color .25s ease; }
.rank-role-kits>summary::-webkit-details-marker { display:none; }
.rank-role-kits>summary:hover { background:rgba(var(--rank-accent-rgb),.07); }
.rank-role-kits>summary span { display:block; color:rgb(var(--rank-accent-rgb)); font-size:9px; text-transform:uppercase; letter-spacing:1.3px; }
.rank-role-kits>summary strong { font-size:13px; }
.rank-role-kit-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:0 16px 16px; }
.rank-role-kit-grid article { padding:14px; border:1px solid #ffffff0e; border-radius:11px; background:#070b11aa; animation:rank-tile-enter .4s cubic-bezier(.16,1,.3,1) both; animation-delay:var(--tile-delay,0ms); }
.rank-role-kit-grid span { color:rgb(var(--rank-accent-rgb)); font-size:11px; font-weight:700; }
.rank-role-kit-grid p { margin:7px 0 0; color:#aebccb; font-size:11px; line-height:1.75; }
.rank-perk-popover { position:absolute; left:var(--perk-popover-left); top:var(--perk-popover-top); z-index:20; box-sizing:border-box; width:var(--perk-popover-width); max-width:calc(100% - 24px); max-height:min(320px,calc(100dvh - 32px)); padding:22px 46px 22px 22px; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:none; border:1px solid rgba(var(--rank-accent-rgb),.52); border-radius:18px; color:#ecf3f7; background:linear-gradient(145deg,rgba(var(--rank-accent-rgb),.1),transparent 38%),rgba(9,15,22,.985); box-shadow:0 24px 70px #000d,0 0 36px rgba(var(--rank-accent-rgb),.13),inset 0 1px 0 #ffffff0c; opacity:0; transform:translateY(9px) scale(.94); transform-origin:20% 20%; pointer-events:none; transition:opacity .2s ease,transform .38s cubic-bezier(.16,1,.3,1); }
.rank-perk-popover::-webkit-scrollbar { width:0; height:0; display:none; }
.rank-perk-popover[hidden] { display:none; }
.rank-perk-popover.is-visible { opacity:1; transform:none; pointer-events:auto; }
.rank-perk-popover.is-hiding { opacity:0; transform:translateY(6px) scale(.96); pointer-events:none; transition-duration:.17s; }
.rank-perk-popover::before { content:""; position:absolute; top:27px; width:12px; height:12px; border:inherit; background:#0d1720; transform:rotate(45deg); }
.rank-perk-popover.is-right::before { right:calc(100% - 6px); border-top:0; border-right:0; }
.rank-perk-popover.is-left::before { left:calc(100% - 6px); border-bottom:0; border-left:0; }
.rank-perk-popover>button { position:absolute; top:11px; right:11px; width:28px; height:28px; border:1px solid #ffffff17; border-radius:9px; color:#b8c5d1; background:#ffffff05; font-size:18px; cursor:pointer; transition:transform .25s ease,color .2s,border-color .2s; }
.rank-perk-popover>button:hover { transform:rotate(90deg); color:rgb(var(--rank-accent-rgb)); border-color:rgba(var(--rank-accent-rgb),.5); }
.rank-perk-popover-eyebrow { display:block; margin-bottom:6px; color:rgb(var(--rank-accent-rgb)); font-size:8px; font-weight:700; letter-spacing:1.5px; }
.rank-perk-popover-label { display:block; padding-right:8px; font-size:15px; line-height:1.4; }
.rank-perk-popover p { min-width:0; margin:11px 0 0; overflow-wrap:anywhere; color:#b7c3ce; font-size:12px; line-height:1.78; }
.rank-perk-popover p a { color:rgb(var(--rank-accent-rgb)); font-weight:700; text-decoration:underline; text-decoration-color:rgba(var(--rank-accent-rgb),.48); text-underline-offset:3px; transition:color .2s ease,text-decoration-color .2s ease,text-shadow .2s ease; }
.rank-perk-popover p a:hover,.rank-perk-popover p a:focus-visible { color:#fff; text-decoration-color:rgb(var(--rank-accent-rgb)); text-shadow:0 0 14px rgba(var(--rank-accent-rgb),.48); }
.rank-monthly-explainer { margin-top:16px; border:1px solid rgba(var(--rank-accent-rgb),.25); border-radius:14px; background:rgba(var(--rank-accent-rgb),.04); }
.rank-monthly-explainer>summary { padding:17px; display:flex; gap:12px; color:rgb(var(--rank-accent-rgb)); font-size:12px; cursor:pointer; }
.rank-monthly-explainer .rank-monthly-note { padding:0 18px 18px; font-size:12px; color:#b1bdca; line-height:1.8; }
.rank-monthly-explainer h3 { display:none; }
.rank-monthly-explainer a { color:rgb(var(--rank-accent-rgb)); }
.rank-dialog-footer { padding:16px 30px; border-top:1px solid #ffffff10; display:flex; align-items:center; justify-content:space-between; gap:12px; background:#0d141e; flex-shrink:0; }
.rank-dialog-footer>span { font-size:10px; color:#8d9aaa; }
.rank-dialog-footer kbd { padding:4px; border:1px solid #ffffff20; border-radius:4px; }
.rank-dialog-footer a { border:1px solid rgba(var(--rank-accent-rgb),.3); border-radius:10px; background:rgba(var(--rank-accent-rgb),.1); color:rgb(var(--rank-accent-rgb)); text-decoration:none; padding:12px 18px; font-size:12px; font-weight:600; transition:transform .28s cubic-bezier(.16,1,.3,1),box-shadow .28s ease,border-color .28s ease; }
.rank-dialog-footer a span { display:inline-block; margin-left:8px; }
.rank-dialog-footer a:hover { transform:translateY(-2px); border-color:rgba(var(--rank-accent-rgb),.7); box-shadow:0 8px 24px rgba(var(--rank-accent-rgb),.12); }
.rank-dialog-footer a:active { transform:scale(.95); }
.rank-benefits-dialog :is(button,a,summary):focus-visible { outline:2px solid rgb(var(--rank-accent-rgb)); outline-offset:3px; }
.rank-benefits-dialog :is(.rank-benefit-tile,.rank-dialog-footer a,.rank-dialog-close):hover { background-image:linear-gradient(115deg,transparent,rgba(var(--rank-accent-rgb),.13),transparent); }
@keyframes rank-dialog-enter { from { opacity:0; transform:translateY(22px) scale(.975); } to { opacity:1; transform:none; } }
@keyframes rank-dialog-exit { to { opacity:0; transform:translateY(12px) scale(.985); } }
@keyframes rank-backdrop-enter { from { opacity:0; } to { opacity:1; } }
@keyframes rank-backdrop-exit { to { opacity:0; backdrop-filter:blur(0); } }
@keyframes rank-tile-enter { from { opacity:0; translate:0 9px; } to { opacity:1; translate:0; } }
@keyframes rank-highlight-enter { from { opacity:0; transform:translateY(14px) scale(.96); } to { opacity:1; transform:none; } }
@keyframes rank-detail-reveal { from { opacity:0; transform:translateY(-7px); } to { opacity:1; transform:none; } }
@keyframes rank-emblem-float {
  0%,100% { transform:translate3d(0,3px,0) rotate(-.35deg); filter:drop-shadow(0 7px 10px rgba(0,0,0,.46)) drop-shadow(0 0 10px rgba(var(--rank-accent-rgb),.18)); }
  50% { transform:translate3d(0,-7px,0) rotate(.55deg); filter:drop-shadow(0 13px 14px rgba(0,0,0,.34)) drop-shadow(0 0 17px rgba(var(--rank-accent-rgb),.3)); }
}
@keyframes rank-emblem-aura { 0%,100% { opacity:.62; transform:scale(.92); } 50% { opacity:1; transform:scale(1.06); } }
@keyframes rank-emblem-shadow { 0%,100% { opacity:.72; transform:scaleX(1); } 50% { opacity:.38; transform:scaleX(.76); } }
@media(max-width:600px) {
 .rank-benefits-dialog { width:calc(100vw - 16px); max-height:calc(100dvh - 16px); border-radius:18px; }
 .rank-dialog-header { padding:23px 45px 20px 18px; gap:12px; }
 .rank-dialog-emblem { flex-basis:70px; height:80px; }.rank-dialog-emblem img { width:70px; height:80px; }
 .rank-dialog-eyebrow { font-size:8px; letter-spacing:1px; }.rank-dialog-heading h2 { font-size:30px; }.rank-dialog-heading h2 span { font-size:14px; }
 .rank-dialog-scroll { padding:18px 16px; }.rank-highlight-grid { gap:6px; }.rank-highlight-grid>div { padding:11px 8px; }.rank-highlight-grid strong { font-size:16px; overflow-wrap:anywhere; }.rank-highlight-grid span { font-size:8px; }
 .rank-benefit-grid,.rank-role-kit-grid { grid-template-columns:1fr; }.rank-dialog-footer { padding:12px 16px; justify-content:flex-end; }.rank-dialog-footer>span { display:none; }.rank-dialog-footer a { font-size:11px; padding:10px; }
}