.privileges{--bronze-start:#5a473f;--bronze-end:#9e6d5a;--silver-start:#51535c;--silver-end:#858997;--gold-start:#554e40;--gold-end:#938562;--diamond-start:#484955;--diamond-end:#7c7f9b;--current-start:var(--silver-start);--current-end:var(--silver-end);--current-gradient:radial-gradient(ellipse at 100% 0%, var(--current-end), transparent 80%), linear-gradient(110deg, #302e2d, var(--current-start));color:rgb(var(--color-dark-100))}.privileges :is([data-tier=green],[data-tier=bronze]){--pill-start:var(--bronze-start);--pill-end:var(--bronze-end);--gem-size:210px;--gem-top:-75px;--gem-right:-40px;--status-gradient:radial-gradient(ellipse at 100% 0%, var(--pill-end), transparent 80%), linear-gradient(110deg, #302e2d, var(--pill-start))}.privileges :is([data-tier=pro],[data-tier=silver]){--pill-start:var(--silver-start);--pill-end:var(--silver-end);--gem-size:158px;--gem-top:-45px;--gem-right:-19px;--status-gradient:radial-gradient(ellipse at 100% 0%, var(--pill-end), transparent 80%), linear-gradient(110deg, #302e2d, var(--pill-start))}.privileges :is([data-tier=premium],[data-tier=gold]){--pill-start:var(--gold-start);--pill-end:var(--gold-end);--gem-size:168px;--gem-top:-50px;--gem-right:-25px;--status-gradient:radial-gradient(ellipse at 100% 0%, var(--pill-end), transparent 80%), linear-gradient(110deg, #302e2d, var(--pill-start))}.privileges [data-tier=diamond]{--pill-start:var(--diamond-start);--pill-end:var(--diamond-end);--gem-size:173px;--gem-top:-55px;--gem-right:-39px;--status-gradient:radial-gradient(ellipse at 100% 0%, var(--pill-end), transparent 80%), linear-gradient(110deg, #302e2d, var(--pill-start))}.privileges-heading{text-align:center;padding:12px 0 26px}.privileges-heading p{color:rgb(var(--color-dark-400));margin:0 0 10px;font-size:14px}.rovno-app .privileges-heading h2{letter-spacing:-.035em;max-width:18ch;margin:0 auto;font-size:clamp(26px,5vw,36px);line-height:1.15}.privileges-selector{flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:16px;display:flex}.privileges-selector button{background:var(--rovno-sheet);overflow-wrap:anywhere;border-radius:999px;min-height:36px;padding:7px 18px;font-size:14px;font-weight:700}.privileges-selector button[aria-pressed=true]{background:linear-gradient(105deg, var(--pill-start), var(--pill-end));color:#fff}.privileges-carousel-frame{--carousel-bleed:16px;margin-inline:calc(-1 * var(--carousel-bleed));position:relative}.privileges-carousel{padding:35px var(--carousel-bleed) 4px;scroll-snap-type:x mandatory;scroll-behavior:auto;scrollbar-width:none;gap:12px;display:flex;overflow-x:auto}.privileges-carousel-frame:before,.privileges-carousel-frame:after{content:"";width:var(--carousel-bleed);z-index:3;pointer-events:none;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);position:absolute;inset-block:0}.privileges-carousel-frame:before{left:0;-webkit-mask-image:linear-gradient(90deg,#000,#0000);mask-image:linear-gradient(90deg,#000,#0000)}.privileges-carousel-frame:after{right:0;-webkit-mask-image:linear-gradient(270deg,#000,#0000);mask-image:linear-gradient(270deg,#000,#0000)}@media (width>=900px){.privileges-carousel-frame{--carousel-bleed:48px}}.privileges-carousel::-webkit-scrollbar{display:none}.privileges-status{scroll-snap-align:center;background:var(--rovno-sheet);border-radius:24px;flex-direction:column;flex:0 0 100%;min-width:0;display:flex}.privileges-status-main{color:#fff;background:#2c2c2d;border-radius:24px;flex:1;align-items:flex-start;min-height:112px;padding:18px 20px;display:flex;position:relative}.privileges-status-copy{z-index:1;flex:1;min-width:0;position:relative}.rovno-app .privileges-status h3{color:#fff;overflow-wrap:anywhere;align-items:center;gap:10px;max-width:calc(100% - 88px);margin:0 0 10px;font-size:20px;font-weight:700;line-height:1.15;display:flex}.privileges-status-main p{color:#e2e5e9;max-width:calc(100% - 64px);margin:0;font-size:16px;line-height:20px}.privileges-gem{z-index:2;right:calc(var(--gem-right) * .8);top:calc(var(--gem-top) * .8);width:calc(var(--gem-size) * .8);height:calc(var(--gem-size) * .8);-o-object-fit:contain;object-fit:contain;pointer-events:none;position:absolute}.privileges-status-caption{min-height:50px;color:rgb(var(--color-dark-400));overflow-wrap:anywhere;margin:0;padding:14px 20px;font-size:16px;line-height:22px}.rovno-app .privileges-benefits-title{text-align:center;margin:26px 0 16px;font-size:20px;font-weight:600}.privileges-benefits{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.privileges-benefit{background:var(--rovno-sheet);overflow-wrap:anywhere;border-radius:24px;flex-direction:column;gap:10px;padding:22px;display:flex}.privileges-benefit:only-child,.privileges-tariffs{grid-column:1/-1}.privileges-benefit>strong{font-size:22px;font-weight:600;line-height:1.25}.privileges-benefit>span{color:rgb(var(--color-dark-400));font-size:14px;line-height:1.5}.privileges-periods{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;display:grid}.privileges-period{background:rgba(var(--color-accent-500), .07);text-align:center;border-radius:16px;padding:16px 10px}.privileges-period strong{color:rgb(var(--color-dark-100));font-size:25px;font-weight:700;display:block}.privileges-period span{color:rgb(var(--color-dark-400));margin-top:4px;font-size:13px;display:block}.privileges-conditions{background:var(--rovno-sheet);border-radius:24px;margin-top:16px}.rovno-app .privileges-conditions h3{margin:0;padding:22px 22px 14px;font-size:20px;font-weight:600}.privileges-conditions-body{padding:0 22px 22px;font-size:14px;line-height:1.5}.privileges-conditions-body>p{color:rgb(var(--color-dark-400));margin:0 0 18px}.privileges-spending{flex-wrap:wrap;justify-content:space-between;gap:6px 12px;margin-top:10px;display:flex}.privileges-spending strong{font-variant-numeric:tabular-nums;font-weight:500}.privileges-progress{background:rgba(var(--color-dark-700), .35);border-radius:999px;height:6px;margin:14px 0;overflow:hidden}.privileges-progress span{border-radius:inherit;background:rgb(var(--color-accent-500));height:100%;display:block}.privileges-selector button:focus-visible,.privileges-status-caption:focus-visible,.privileges-carousel:focus-visible{outline:2px solid rgb(var(--color-accent-500));outline-offset:3px}@media (width<=380px){.privileges-selector button{padding-inline:10px;font-size:13px}}@media (width<=600px){.privileges-periods{grid-template-columns:repeat(2,minmax(0,1fr))}}.privileges-status{isolation:isolate;position:relative}.privileges-status[data-current=false]{background:var(--current-gradient)}.privileges-status[data-current=true] .privileges-status-main{background:var(--status-gradient)}.privileges-status-main,.privileges-status-caption{z-index:1;position:relative}.privileges-status-caption{background:0 0}button.privileges-status-caption{text-align:left;color:#fff;border-radius:0 0 24px 24px;justify-content:space-between;align-items:center;gap:12px;width:100%;display:flex}button.privileges-status-caption>span[aria-hidden]{opacity:.65;font-size:22px;line-height:22px}.privileges-status:before,.privileges-status[data-current=true] .privileges-status-main:before{content:"";z-index:0;border-radius:inherit;pointer-events:none;opacity:.13;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.5' filter='url(%23n)'/%3E%3C/svg%3E");position:absolute;inset:0}.privileges:is([data-current-tier=green],[data-current-tier=bronze]){--current-start:var(--bronze-start);--current-end:var(--bronze-end)}.privileges:is([data-current-tier=pro],[data-current-tier=silver]){--current-start:var(--silver-start);--current-end:var(--silver-end)}.privileges:is([data-current-tier=premium],[data-current-tier=gold]){--current-start:var(--gold-start);--current-end:var(--gold-end)}.privileges[data-current-tier=diamond]{--current-start:var(--diamond-start);--current-end:var(--diamond-end)}

.privileges {container-type:inline-size;--carousel-width:100vw}
.privileges-carousel-frame {--carousel-bleed:calc((var(--carousel-width) - 100cqw)/2);width:var(--carousel-width);margin-inline:calc(-1 * var(--carousel-bleed))}
.privileges-status {flex-basis:100cqw}
@media (min-width:900px) {.privileges-carousel-frame {--carousel-bleed:calc((var(--carousel-width) - 100cqw)/2)}}
@media (min-width:1024px) {.privileges {--carousel-width:calc(100vw - 232px)}}

.privileges-gem{right:-2px;top:-32px;width:96px;height:auto;filter:none}.privileges-status[data-current='false'] .privileges-status-main{background:#2c2c2d}

.privileges-tariff-summary { flex-direction: row; align-items: center; gap: 20px; }
.privileges-tariff-summary > strong { font-size: 38px; font-weight: 700; white-space: nowrap; }
.privileges-tariff-summary > div { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.privileges-tariff-summary > div > strong { font-size: 18px; font-weight: 600; }
.privileges-tariff-summary > div > span { color: rgb(var(--color-dark-400)); font-size: 13px; line-height: 1.5; }

.rovno-app:has(.privileges) > .rovno-glass-backdrop::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 380px;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(ellipse 70% 100% at 50% 0%, #b49a626b, #987a4529 40%, transparent 78%);
}
.light .rovno-app:has(.privileges) > .rovno-glass-backdrop::before {
  background: radial-gradient(ellipse 70% 100% at 50% 0%, #c9a56b47, #c9a56b1f 40%, transparent 78%);
}
.rovno-app:has(.privileges) .app-mobile-header { background: transparent; }
@media (min-width: 1024px) {
  .rovno-app:has(.privileges) > .rovno-glass-backdrop::before { left: 232px; }
}


.rovno-app:has(.privileges) > .rovno-glass-backdrop::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 315px;
  z-index: -1;
  pointer-events: none;
  background: url("/images/loyalty/privileges-spotlight.svg") center top / 100% 100% no-repeat, linear-gradient(to bottom, #000 0%, #000 64%, transparent 100%);
}
.light .rovno-app:has(.privileges) > .rovno-glass-backdrop::before {
  background: url("/images/loyalty/privileges-spotlight.svg") center top / 100% 100% no-repeat;
  opacity: .45;
}
.rovno-app:has(.privileges) .app-mobile-header { background: transparent; }
@media (min-width: 1024px) {
  .rovno-app:has(.privileges) > .rovno-glass-backdrop::before { left: 232px; }
}


.rovno-app:has(.privileges) > .rovno-glass-backdrop::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 315px;
  z-index: -1;
  pointer-events: none;
  background: url("/images/loyalty/privileges-spotlight-v2.svg") center top / 100% 100% no-repeat, linear-gradient(to bottom, #000 0%, #000 64%, transparent 100%);
}
.light .rovno-app:has(.privileges) > .rovno-glass-backdrop::before {
  background: url("/images/loyalty/privileges-spotlight-v2.svg") center top / 100% 100% no-repeat;
  opacity: .45;
}
.rovno-app:has(.privileges) .app-mobile-header { background: transparent; }
@media (min-width: 1024px) {
  .rovno-app:has(.privileges) > .rovno-glass-backdrop::before { left: 232px; }
}


.rovno-app .privileges-status[data-current='false'] .privileges-status-main{background-color:#2c2c2d;background-image:none}
