:root{
    --pink:#f4c5d2;
    --pink-2:#fff0f6;
    --coral:#ef8a74;
    --ink:#26314b;
    --white: rgba(255,255,255,0.90);
    --muted:#7f7684;

    --shadow: 0 18px 55px rgba(0,0,0,.18);
    --shadow-soft: 0 12px 30px rgba(0,0,0,.12);

    --radius-xl: 26px;
    --radius-lg: 20px;
    --radius-md: 14px;

    --max: 1200px;
    --fluid-gutter: clamp(12px, 4vw, 28px);
    --fluid-content: min(var(--max), calc(100vw - (var(--fluid-gutter) * 2)));
    --fluid-modal-pad: clamp(12px, 4vw, 24px);
    --contact-modal-scale: 1;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
    margin:0;
    color:var(--ink);
    background:linear-gradient(180deg, #fff 0%, var(--pink-2) 40%, #fff 100%);
    font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans";
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

body:has(.hero--page),
body:has(.pd){
    background:linear-gradient(135deg, #ffd6e5 0%, #ffedf4 50%, #ffd6e5 100%) fixed;
    background-size:cover;
}

body:has(.cart-page),
body:has(.pp-page){
    background:
            radial-gradient(circle at 14% 18%, rgba(244,176,197,.18), rgba(244,176,197,0) 28%),
            radial-gradient(circle at 86% 76%, rgba(239,138,116,.10), rgba(239,138,116,0) 22%),
            linear-gradient(180deg, #fff 0%, var(--pink-2) 40%, #fff 100%);
}

.layout:has(.hero--page),
.layout:has(.pd),
.layout:has(.cart-page),
.layout:has(.pp-page){
    background:transparent;
}

.layout:has(.hero--page) .layout__content,
.layout:has(.pd) .layout__content,
.layout:has(.cart-page) .layout__content,
.layout:has(.pp-page) .layout__content{
    background:transparent;
}

.ui-toggle{ position:fixed; left:-9999px; }

input[type="checkbox"]:not(.ui-toggle):not(.check__input){
    -webkit-appearance:none;
    appearance:none;
    width:20px;
    height:20px;
    min-width:20px;
    min-height:20px;
    margin:0;
    border-radius:50%;
    border:1.5px solid rgba(196,84,135,.34);
    background:rgba(255,255,255,.96);
    box-shadow: inset 0 1px 2px rgba(255,255,255,.75), 0 6px 16px rgba(196,84,135,.12);
    display:inline-grid;
    place-items:center;
    cursor:pointer;
    transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

input[type="checkbox"]:not(.ui-toggle):not(.check__input)::after{
    content:"";
    width:9px;
    height:9px;
    border-radius:50%;
    background:linear-gradient(180deg, #f3a1c0, #ef8a74);
    transform:scale(0);
    transition:transform .15s ease;
}

input[type="checkbox"]:not(.ui-toggle):not(.check__input):checked{
    border-color:rgba(196,84,135,.55);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.75), 0 8px 18px rgba(196,84,135,.18);
}

input[type="checkbox"]:not(.ui-toggle):not(.check__input):checked::after{
    transform:scale(1);
}

input[type="checkbox"]:not(.ui-toggle):not(.check__input):hover{
    transform:translateY(-1px);
    border-color:rgba(196,84,135,.48);
}

input[type="checkbox"]:not(.ui-toggle):not(.check__input):focus-visible{
    outline:none;
    box-shadow:0 0 0 4px rgba(196,84,135,.18), 0 8px 18px rgba(196,84,135,.18);
}

.center{ text-align:center; }
.muted{ color: var(--muted); font-size:13px; }

.topbar{
    position: sticky;
    top: 0;
    z-index: 2000;
    isolation: isolate;
    pointer-events: auto;

    background: rgba(255,255,255,.86);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(0,0,0,.06);
    height: 72px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 clamp(12px, 3.2vw, 20px);
}

.topbar__left, .topbar__right{
    display:flex;
    align-items:center;
    gap:14px;
}

.topbar__right{
    margin-left:auto;
}

.brand{
    display:inline-flex;
    align-items:baseline;
    text-decoration:none;
    letter-spacing:.5px;
    font-weight:800;
    user-select:none;
    font-size:22px;
}
.brand__pink{ color:#c45487; }
.brand__dark{ color:var(--ink); }

.icon-btn{
    width:40px;
    height:40px;
    border-radius:999px;
    border:1px solid rgba(0,0,0,.08);
    background:var(--white);
    display:grid;
    place-items:center;
    cursor:pointer;
    box-shadow: 0 8px 18px rgba(0,0,0,.06);
    transition: transform .12s ease, filter .12s ease, box-shadow .12s ease;
    -webkit-tap-highlight-color: transparent;
}
.icon-btn:hover{
    transform: translateY(-1px);
    filter: brightness(1.02);
    box-shadow: 0 12px 24px rgba(0,0,0,.08);
}
.icon-btn:active{ transform: translateY(0); }
.icon-btn:disabled{ opacity:.6; cursor:not-allowed; transform:none; }

.icon-btn svg{ width:20px; height:20px; color:var(--ink); }

a.icon-btn{ position: relative; z-index: 2; }

.icon-btn--tiny{
    width:36px;
    height:36px;
}

.wishlist-heart{
    position:relative;
    overflow:hidden;
    isolation:isolate;
}

.wishlist-heart svg{
    color:inherit;
    transform-origin:center;
    position:relative;
    z-index:2;
}

.wishlist-heart svg path{
    fill:transparent;
    stroke:currentColor;
    transition:fill .22s ease, stroke .22s ease;
}

.wishlist-heart::before,
.wishlist-heart::after{
    content:"";
    position:absolute;
    border-radius:inherit;
    opacity:0;
    pointer-events:none;
}

.wishlist-heart::before{
    inset:18%;
    background:
            radial-gradient(circle at 50% 42%, rgba(255,255,255,.92) 0 14%, rgba(255,255,255,0) 15%),
            radial-gradient(circle, rgba(255,126,184,.42) 0%, rgba(229,22,117,.24) 46%, rgba(229,22,117,0) 72%);
    transform:scale(.2);
    z-index:1;
}

.wishlist-heart::after{
    inset:-22%;
    background:radial-gradient(circle, rgba(229,22,117,.28) 0%, rgba(255,159,198,.18) 42%, rgba(229,22,117,0) 72%);
    transform:scale(.35);
    z-index:0;
}

.wishlist-heart[aria-pressed="true"],
.wishlist-heart.is-active{
    color:#e51675;
    border-color:rgba(229,22,117,.30);
    background:linear-gradient(180deg, rgba(255,245,249,.98), rgba(255,224,236,.95));
    box-shadow:0 12px 26px rgba(229,22,117,.16);
}

.wishlist-heart[aria-pressed="true"] svg path,
.wishlist-heart.is-active svg path{
    fill:currentColor;
}

.wishlist-heart.is-pop svg{
    animation:wishlistHeartPop .64s cubic-bezier(.18, 1.42, .3, 1);
}

.wishlist-heart.is-pop svg path{
    animation:wishlistHeartFill .62s cubic-bezier(.2, .95, .22, 1) both;
}

.wishlist-heart.is-pop::before{
    animation:wishlistHeartSweetFill .62s ease-out both;
}

.wishlist-heart.is-pop::after{
    animation:wishlistHeartBurst .62s ease-out both;
}

.cart-pop{
    --cart-spark-delay:0ms;
    --cart-spark-x:0%;
    --cart-spark-y:0%;
    --cart-spark-scale:1;
    position:relative;
    overflow:hidden;
    isolation:isolate;
    transform-origin:center;
    -webkit-tap-highlight-color:transparent;
}

.cart-pop > svg,
.cart-pop > span:not(.cart-pop__fx){
    position:relative;
    z-index:2;
}

.cart-pop::before,
.cart-pop::after{
    content:"";
    position:absolute;
    pointer-events:none;
    border-radius:inherit;
}

.cart-pop::before{
    inset:-45% -70%;
    z-index:1;
    background:linear-gradient(110deg, transparent 35%, rgba(255,255,255,.68) 48%, transparent 62%);
    opacity:0;
    transform:translateX(-62%) rotate(7deg);
}

.cart-pop::after{
    inset:-20%;
    z-index:0;
    background:
            radial-gradient(circle at 50% 50%, rgba(255,255,255,.92) 0 9%, rgba(255,255,255,0) 10%),
            radial-gradient(circle, rgba(229,22,117,.30) 0%, rgba(239,138,116,.18) 36%, rgba(229,22,117,0) 72%);
    opacity:0;
    transform:scale(.36);
}

.cart-pop__fx{
    display:block;
    position:absolute;
    inset:0;
    z-index:3;
    pointer-events:none;
}

.cart-pop__spark{
    --cart-spark-delay:0ms;
    --cart-spark-x:0%;
    --cart-spark-y:0%;
    --cart-spark-scale:1;
    position:absolute;
    left:50%;
    top:50%;
    width:7px;
    height:7px;
    border-radius:999px;
    background:linear-gradient(180deg, #fff, #ff9fc6 45%, #ef8a74);
    box-shadow:0 0 0 2px rgba(255,255,255,.74), 0 8px 16px rgba(229,22,117,.22);
    opacity:0;
    transform:translate(-50%, -50%) scale(.45);
}

.cart-pop.is-pop{
    animation:cartButtonBloom .72s cubic-bezier(.18, 1.18, .24, 1) both;
}

.cart-pop.is-pop::before{
    animation:cartButtonShine .72s ease-out both;
}

.cart-pop.is-pop::after{
    animation:cartButtonAura .72s ease-out both;
}

.cart-pop.is-pop > svg{
    animation:cartIconTuck .72s cubic-bezier(.18, 1.22, .28, 1) both;
}

.cart-pop.is-pop .cart-pop__spark{
    animation:cartSparkFly .62s cubic-bezier(.18, .92, .28, 1) var(--cart-spark-delay, 0ms) both;
}

@keyframes wishlistHeartPop{
    0%{ transform:scale(.72) rotate(-8deg); }
    45%{ transform:scale(1.28) rotate(5deg); }
    72%{ transform:scale(.96) rotate(-2deg); }
    100%{ transform:scale(1) rotate(0deg); }
}

@keyframes wishlistHeartFill{
    0%{
        fill:transparent;
        stroke:currentColor;
        stroke-width:2.2px;
    }
    35%{
        fill:rgba(255,159,198,.58);
        stroke:#f04f95;
    }
    100%{
        fill:#e51675;
        stroke:#e51675;
        stroke-width:2px;
    }
}

@keyframes wishlistHeartSweetFill{
    0%{
        opacity:0;
        transform:scale(.2);
    }
    32%{
        opacity:.92;
        transform:scale(.92);
    }
    100%{
        opacity:0;
        transform:scale(1.32);
    }
}

@keyframes wishlistHeartBurst{
    0%{
        opacity:0;
        transform:scale(.35);
    }
    34%{
        opacity:1;
    }
    100%{
        opacity:0;
        transform:scale(1.18);
    }
}

.vault-badge{
    width:44px;
    height:44px;
    border-radius:999px;
    border:1px solid rgba(196,84,135,.35);
    background: radial-gradient(circle at 30% 25%, rgba(255,255,255,.96) 0%, var(--pink-2) 58%, rgba(255,255,255,.98) 100%);
    display:grid;
    place-items:center;
    cursor:pointer;
    position:relative;
    box-shadow: 0 10px 24px rgba(196,84,135,.10);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.vault-badge svg{
    width:20px;
    height:20px;
    color:#c45487;
    position:relative;
    z-index:1;
    transform:translateY(.5px);
    filter:drop-shadow(0 2px 6px rgba(196,84,135,.12));
}
.vault-badge__dot{
    position:absolute;
    right:6px;
    top:6px;
    width:9px;
    height:9px;
    border-radius:50%;
    background:#ef8a74;
    box-shadow:0 0 0 3px rgba(255,255,255,.94), 0 6px 14px rgba(239,138,116,.24);
}

.layout { flex: 1; display: flex; flex-direction: column; min-height: calc(100vh - 72px); }
.layout__content { flex: 1; }

.screen_img{
    position:relative;
    z-index:0;
    height:min(72vh, 680px);
    min-height:420px;
    overflow:hidden;
}
.screen_img__img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position: 50% 20%;
}

.screen_img__overlay{
    position:absolute;
    inset:0;
    display:grid;
    place-items:center;
    text-align:center;
    padding:30px 18px;
    background:
            linear-gradient(90deg, rgba(255,255,255,.35) 0%, rgba(255,255,255,.05) 50%, rgba(255,255,255,.35) 100%),
            radial-gradient(circle at 50% 55%, rgba(255,255,255,.55) 0%, rgba(255,255,255,.08) 60%, rgba(255,255,255,.08) 100%);
    pointer-events: none;
}
.screen_img__overlay .btn{ pointer-events: auto; }

.screen_img__title{
    margin:0;
    font-family: ui-serif, Georgia, "Times New Roman", serif;
    font-weight:700;
    font-size: clamp(34px, 5vw, 64px);
    line-height:1.03;
    color:#1a1a22;
    text-shadow: 0 12px 40px rgba(0,0,0,.10);
}
.screen_img__subtitle{
    margin:10px 0 18px;
    color:rgba(0,0,0,.60);
    max-width:560px;
    font-size:14px;
}

.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    border-radius:999px;
    padding:12px 18px;
    text-decoration:none;
    font-weight:800;
    letter-spacing:.3px;
    border:1px solid transparent;
    cursor:pointer;
    user-select:none;
    transition: transform .12s ease, filter .12s ease;
}
.btn:hover{ transform: translateY(-1px); filter: brightness(1.02); }
.btn:active{ transform: translateY(0); }

.btn--pink{
    background:#c45487;
    color:#fff;
    box-shadow: 0 14px 30px rgba(196,84,135,.22);
}
.btn--dark{
    background:#1b275c;
    color:#fff;
    box-shadow: 0 14px 30px rgba(0,0,0,.18);
}
.btn--full{
    width:100%;
    border-radius:12px;
    padding:12px 14px;
}

.section{
    padding: clamp(48px, 8vw, 64px) var(--fluid-gutter) clamp(32px, 5vw, 40px);
    background: var(--pink-2);
}
.section__head{
    text-align:center;
    margin:0 auto 28px;
    width: var(--fluid-content);
    max-width:100%;
}
.section__title{
    margin:0;
    font-family: ui-serif, Georgia, "Times New Roman", serif;
    font-size:24px;
}
.section__sub{
    margin:6px 0 0;
    color: var(--muted);
    font-size:13px;
}

.cards{
    width: var(--fluid-content);
    max-width:100%;
    margin:0 auto;
    display:grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap:22px;
    padding:0;
}

.card{
    position:relative;
    background:rgba(255,255,255,.92);
    border:1px solid rgba(0,0,0,.06);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-soft);
    overflow:hidden;
}

.badge{
    position:absolute;
    left:14px;
    top:14px;
    background:#0f1014;
    color:#fff;
    padding:6px 10px;
    font-size:11px;
    font-weight:900;
    border-radius:999px;
    letter-spacing:.7px;
    opacity:.92;
    z-index:2;
}

.card__wish{
    position:absolute;
    right:14px;
    top:14px;
    width:34px;
    height:34px;
    border-radius:999px;
    border:1px solid rgba(0,0,0,.10);
    background:rgba(255,255,255,.90);
    display:grid;
    place-items:center;
    cursor:pointer;
    z-index:2;
    color:#1a1a22;
    transition: transform .12s ease, filter .12s ease;
}
.card__wish:hover{ transform: translateY(-1px); filter: brightness(1.02); }
.card__wish:active{ transform: translateY(0); }
.card__wish svg{ width:18px; height:18px; color:inherit; }

.card__media{ display:block; padding:18px 18px 10px; text-decoration:none; }
.card__titleLink{ color:inherit; text-decoration:none; }
.card__titleLink:hover{ color:#c45487; }
.card__media img{
    width:100%;
    height:180px;
    object-fit:cover;
    border-radius:18px;
    background:#f3f3f6;
}
.card__body{
    padding:10px 18px 18px;
    text-align:center;
}
.card__meta{
    font-size:11px;
    letter-spacing:1.6px;
    color: rgba(0,0,0,.45);
}
.card__title{
    margin:6px 0 4px;
    font-family: ui-serif, Georgia, "Times New Roman", serif;
    font-size:18px;
}
.card__price{
    color:#64abd9;
    font-weight:900;
    margin-bottom:10px;
}

.footer{
    background: rgba(0, 0, 0, 0.52);
    color:#fff;
    padding:40px 18px;
    display:grid;
    grid-template-columns: 1.2fr 2fr;
    gap:26px;
}
.footer__logo{ font-size:22px; }
.footer__text{
    margin:8px 0 0;
    color: rgba(255,255,255,.70);
    font-size:13px;
    max-width:360px;
}
.footer__cols{
    display:grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap:18px;
}
.footer__col h4{
    margin:0 0 10px;
    font-family: ui-serif, Georgia, "Times New Roman", serif;
}
.footer__col a{
    display:block;
    color: rgba(255,255,255,.72);
    text-decoration:none;
    padding:6px 0;
    font-size:13px;
}
.footer__col a:hover{ color:#fff; }

.backdrop{
    position:fixed;
    inset:0;
    background: rgba(0,0,0,.35);
    backdrop-filter: blur(10px);
    opacity:0;
    pointer-events:none;
    transition: opacity .22s ease;
    z-index:1500;
}

#navToggle:checked ~ .backdrop[for="navToggle"],
#favToggle:checked ~ .backdrop[for="favToggle"],
#cartToggle:checked ~ .backdrop[for="cartToggle"],
#profileToggle:checked ~ .backdrop[for="profileToggle"],
#vaultToggle:checked ~ .backdrop[for="vaultToggle"],
#catModalToggle:checked ~ .backdrop[for="catModalToggle"],
#contactModalToggle:checked ~ .backdrop[for="contactModalToggle"]{
    opacity:1;
    pointer-events:auto;
}

.cat-submenu{
    display:none;
    padding:4px 8px 8px 24px;
}

.cat-item:hover > .cat-submenu,
.cat-item:focus-within > .cat-submenu{
    display:block;
}

.cat-submenu__link{
    display:flex;
    align-items:center;
    gap:8px;
    padding:6px 8px;
    text-decoration:none;
    color:var(--ink);
    border-radius:10px;
    font-size:14px;
}
.cat-submenu__link:hover{ background: rgba(196,84,135,.08); }

.cat-submenu__dot{
    width:6px;
    height:6px;
    border-radius:50%;
    background:#c45487;
    opacity:.75;
}

.drawer{
    position:fixed;
    top:0;
    bottom:0;
    width:min(360px, 86vw);
    z-index:1600;
    pointer-events:none;
}

.drawer__panel{
    height:100%;
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(10px);
    border:1px solid rgba(0,0,0,.08);
    box-shadow: var(--shadow);
    display:flex;
    flex-direction:column;
    transform: translateX(-110%);
    transition: transform .26s ease;
    pointer-events:auto;
}

.drawer--left{ left:0; }
.drawer--right{ right:0; width:min(380px, 90vw); }
.drawer--right .drawer__panel{ transform: translateX(110%); }

.drawer__top{
    height:72px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 14px 0 16px;
    border-bottom:1px solid rgba(0,0,0,.06);
}
.drawer__brand{ font-size:20px; }
.drawer__title{ font-weight:900; font-size:16px; }

.drawer__nav{
    padding:10px 12px 16px;
    overflow:auto;
}

.drawer__link{
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px 10px;
    border-radius:12px;
    text-decoration:none;
    color: var(--ink);
    font-weight:650;
    font-size:14px;
}
.drawer__link:hover{ background: rgba(196,84,135,.08); }
.drawer__link--primary{ background: rgba(196,84,135,.10); }

.dot{
    width:8px;
    height:8px;
    border-radius:50%;
    background:#c45487;
    opacity:.75;
}

.drawer__sectionTitle{
    margin:14px 10px 6px;
    color: rgba(0,0,0,.45);
    font-weight:900;
    font-size:11px;
    letter-spacing:1.2px;
}

.drawer__content{
    padding:14px 16px 16px;
    overflow:auto;
    flex: 1;
}

.mini-list{ margin:12px 0 16px; display:grid; gap:10px; }
.mini-item{
    display:flex;
    gap:10px;
    align-items:center;
    background: rgba(196,84,135,.06);
    border:1px solid rgba(196,84,135,.12);
    border-radius:14px;
    padding:10px;
}
.mini-item__thumb{
    width:44px;
    height:44px;
    border-radius:12px;
    background: linear-gradient(135deg, #fff, var(--pink-2));
    border:1px solid rgba(0,0,0,.06);
    object-fit: cover;
    object-position: center;
    flex: 0 0 44px;
}
.mini-item__body{
    min-width: 0;
    flex: 1;
}
.mini-item__link{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
    flex:1;
    color:inherit;
    text-decoration:none;
}
.mini-item__link:hover .mini-item__name,
.mini-item__link:focus-visible .mini-item__name{
    color: var(--pink);
}
.mini-item__state{
    margin-top:6px;
    display:inline-flex;
    align-items:center;
    padding:4px 8px;
    border-radius:999px;
    background: rgba(196,84,135,.12);
    color: var(--pink);
    font-size:11px;
    font-weight:800;
}
.mini-item__name{
    font-weight:850;
    font-size:13px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mini-item__meta{
    color: var(--muted);
    font-size: 12px;
    margin-top: 3px;
}
.mini-item__price{
    color:#c45487;
    font-weight:900;
    font-size:13px;
    white-space: nowrap;
}
.mini-item__actions{
    display:flex;
    gap:8px;
    align-items:center;
    margin-left: auto;
    flex-wrap:wrap;
    justify-content:flex-end;
}
.mini-item__iconBtn{
    width:44px;
    height:44px;
    border:none;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}
.mini-item__iconBtn svg{
    width:20px;
    height:20px;
}
.mini-item__iconBtn:hover,
.mini-item__iconBtn:focus-visible{
    transform: translateY(-1px);
}
.mini-item__iconBtn--cart{
    background: var(--ink);
    color:#fff;
    box-shadow: 0 10px 24px rgba(31, 40, 58, .18);
}
.mini-item__iconBtn--remove{
    background: rgba(255,255,255,.9);
    color: var(--pink);
    border:1px solid rgba(196,84,135,.18);
}
.mini-item__iconBtn:disabled{
    opacity:.65;
    cursor:wait;
    transform:none;
}

@media (max-width: 640px){
    .mini-item--wishlist{
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .mini-item--wishlist .mini-item__actions{
        width: 100%;
        margin-left: 0;
    }
}
.cart-summary{
    margin: 12px 0 16px;
    background: rgba(0,0,0,.03);
    border:1px solid rgba(0,0,0,.06);
    border-radius:14px;
    padding:10px;
}
.cart-summary .row{
    display:flex;
    justify-content:space-between;
    padding:8px 6px;
    font-size:13px;
}

.modal--cat{
    z-index: 1750;
}

.drawer__actions{
    padding: 12px 16px 16px;
    border-top: 1px solid rgba(0,0,0,.06);
    background: rgba(255,255,255,.86);
}

#navToggle:checked ~ .drawer--left .drawer__panel{ transform: translateX(0); }

#favToggle:checked ~ #wishlistDrawer .drawer__panel,
#favToggle:checked ~ .drawer--fav .drawer__panel{ transform: translateX(0); }

#cartToggle:checked ~ #cartDrawer .drawer__panel,
#cartToggle:checked ~ .drawer--cart .drawer__panel{ transform: translateX(0); }

.modal{
    position:fixed;
    inset:0;
    display:grid;
    place-items:center;
    z-index:1700;
    opacity:0;
    pointer-events:none;
    transition: opacity .22s ease;
    padding:var(--fluid-modal-pad);
}

.modal__card{
    width: min(520px, calc(100vw - (var(--fluid-gutter) * 2)));
    max-width:100%;
    max-height: calc(100dvh - (var(--fluid-modal-pad) * 2));
    background: rgba(255,255,255,.94);
    border:1px solid rgba(0,0,0,.08);
    border-radius:30px;
    box-shadow: var(--shadow);
    padding:18px 18px 16px;
    position:relative;
    overflow:auto;
    scrollbar-gutter: stable;
}

.modal__card--small{ width:min(440px, calc(100vw - (var(--fluid-gutter) * 2))); }

.modal__close{
    position:absolute;
    right:14px;
    top:14px;
    width:38px;
    height:38px;
    border-radius:999px;
    border:1px solid rgba(0,0,0,.10);
    background: rgba(255,255,255,.90);
    display:grid;
    place-items:center;
    cursor:pointer;
}

.modal__close svg{ width:18px; height:18px; color: var(--ink); }

#profileToggle:checked ~ #profileModal{ opacity:1; pointer-events:auto; }
#vaultToggle:checked ~ #vaultModal{ opacity:1; pointer-events:auto; }

#catModalToggle:checked ~ #catModal{
    opacity: 1;
    pointer-events: auto;
}

#contactModalToggle:checked ~ #contactModal{
    opacity:1;
    pointer-events:auto;
}

#catModal .modal__card{
    width:min(700px, calc(100vw - (var(--fluid-gutter) * 2)));
    padding:22px 20px 18px;
    border-radius:32px;
    border:0;
    background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,245,249,.94));
    box-shadow:
            0 28px 60px rgba(17,17,17,.14),
            0 12px 28px rgba(196,84,135,.08);
}

.cat-modal__head{
    padding:8px 8px 14px;
}

.cat-modal__title{
    margin:0;
    font-size:22px;
    letter-spacing:-.02em;
}

.cat-modal__sub{
    margin:6px 0 0;
    color:rgba(27,27,34,.58);
}

.cat-modal-form{
    display:grid;
    gap:14px;
    padding:8px;
    margin-top:2px;
    border-radius:22px;
    background:rgba(255,255,255,.74);
    border:1px solid rgba(196,84,135,.10);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.72);
}

.cat-modal-form .field{
    display:grid;
    gap:8px;
}

.cat-modal-form .field__label{
    font-size:11px;
    font-weight:900;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:rgba(27,27,34,.50);
}

.cat-input{
    appearance:none;
    -webkit-appearance:none;
    width:100%;
    min-width:0;
    min-height:52px;
    padding:0 16px;
    border-radius:16px;
    border:1px solid rgba(17,17,17,.10);
    background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,247,250,.94));
    color:var(--ink);
    font-size:15px;
    font-weight:700;
    outline:none;
    box-shadow:0 10px 24px rgba(17,17,17,.05);
    transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease, background-color .18s ease;
}

.cat-input::placeholder{
    color:rgba(27,27,34,.36);
    font-weight:600;
}

select.cat-input{
    padding-right:44px;
    background:
            linear-gradient(45deg, transparent 50%, rgba(196,84,135,.72) 50%),
            linear-gradient(135deg, rgba(196,84,135,.72) 50%, transparent 50%),
            linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,247,250,.94));
    background-position:
            calc(100% - 22px) calc(50% - 3px),
            calc(100% - 16px) calc(50% - 3px),
            0 0;
    background-size:6px 6px, 6px 6px, 100% 100%;
    background-repeat:no-repeat;
    cursor:pointer;
}

.cat-input:hover{
    border-color:rgba(196,84,135,.22);
    box-shadow:0 14px 28px rgba(196,84,135,.08);
}

.cat-input:focus{
    border-color:rgba(196,84,135,.34);
    box-shadow:0 0 0 4px rgba(196,84,135,.10), 0 14px 30px rgba(196,84,135,.10);
}

.cat-modal-actions{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
    margin-top:2px;
}

.cat-modal-actions .btn{
    min-height:50px;
    border-radius:16px;
}

.cat-modal-actions .btn:not(.btn--dark){
    border:1px solid rgba(17,17,17,.08);
    background:rgba(255,255,255,.84);
}

.cat-msg{
    min-height:20px;
    padding:2px 2px 0;
    font-size:13px;
    line-height:1.5;
}

.cat-modal__tip{
    margin:10px 8px 2px;
    padding:10px 12px;
    border-radius:16px;
    background:rgba(255,255,255,.68);
    border:1px dashed rgba(196,84,135,.18);
    color:rgba(27,27,34,.56);
    line-height:1.6;
}

.modal--contact{
    z-index:1750;
}

#contactModal .modal__card{
    width:min(560px, 94vw);
    max-width:calc(100vw - (var(--fluid-gutter) * 2));
    padding:24px 22px 20px;
    border-radius:34px;
    background:
            radial-gradient(circle at 14% 16%, rgba(255,180,214,.24), rgba(255,180,214,0) 28%),
            radial-gradient(circle at 88% 84%, rgba(255,120,176,.18), rgba(255,120,176,0) 30%),
            linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,244,248,.96));
    box-shadow:
            0 32px 70px rgba(17,17,17,.16),
            0 14px 34px rgba(196,84,135,.10);
    transform-origin:center center;
    transform:scale(var(--contact-modal-scale, 1));
    transition:transform .18s ease;
}

.contact-modal__head{
    padding:8px 10px 14px;
}

.contact-modal__badge{
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:0 12px;
    border-radius:999px;
    border:1px solid rgba(196,84,135,.16);
    background:rgba(255,255,255,.78);
    color:#c45487;
    font-size:11px;
    font-weight:900;
    letter-spacing:.18em;
    text-transform:uppercase;
}

.contact-modal__title{
    margin:14px 0 0;
    font-size:30px;
    letter-spacing:-.03em;
}

.contact-modal__sub{
    margin:8px 0 0;
    max-width:420px;
    color:rgba(27,27,34,.58);
    line-height:1.65;
}

.contact-modal-form{
    display:grid;
    gap:14px;
    padding:12px;
    border-radius:26px;
    background:rgba(255,255,255,.76);
    border:1px solid rgba(196,84,135,.10);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.78);
}

.contact-modal__metaRow{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    flex-wrap:wrap;
}

.contact-modal__pill{
    display:inline-flex;
    align-items:center;
    min-height:32px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(196,84,135,.08);
    border:1px solid rgba(196,84,135,.14);
    color:#be2263;
    font-size:12px;
    font-weight:800;
}

.contact-modal__limit{
    margin-left:auto;
    color:rgba(27,27,34,.44);
    font-size:12px;
    font-weight:700;
}

.contact-textarea{
    width:100%;
    min-height:190px;
    padding:16px 18px;
    border-radius:22px;
    border:1px solid rgba(17,17,17,.10);
    background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,247,250,.94));
    color:var(--ink);
    font:inherit;
    font-size:15px;
    line-height:1.7;
    resize:vertical;
    outline:none;
    box-shadow:0 12px 28px rgba(17,17,17,.05);
    transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease, background-color .18s ease;
}

.contact-textarea::placeholder{
    color:rgba(27,27,34,.38);
}

.contact-textarea:hover{
    border-color:rgba(196,84,135,.22);
    box-shadow:0 14px 30px rgba(196,84,135,.08);
}

.contact-textarea:focus{
    border-color:rgba(196,84,135,.34);
    box-shadow:0 0 0 4px rgba(196,84,135,.10), 0 14px 34px rgba(196,84,135,.10);
}

.contact-modal__note{
    padding:10px 14px;
    border-radius:16px;
    background:rgba(255,255,255,.68);
    border:1px dashed rgba(196,84,135,.18);
    color:rgba(27,27,34,.58);
    font-size:13px;
    line-height:1.6;
}

.contact-modal__footerRow{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.contact-modal__status{
    min-height:20px;
    font-size:13px;
    line-height:1.5;
}

.contact-modal__status.is-error{
    color:#c13b55;
}

.contact-modal__status.is-success{
    color:#0d8f67;
}

.contact-modal__count{
    color:rgba(27,27,34,.44);
    font-size:12px;
    font-weight:800;
    white-space:nowrap;
}

.contact-modal-actions{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
    margin-top:2px;
}

.contact-modal-actions .btn{
    min-height:52px;
    border-radius:18px;
}

.contact-modal-actions .btn:not(.btn--dark){
    border:1px solid rgba(17,17,17,.08);
    background:rgba(255,255,255,.84);
}

@media (max-width: 980px){
    .cards{ grid-template-columns: 1fr; max-width:520px; }
    .footer{ grid-template-columns: 1fr; }
    .footer__cols{ grid-template-columns: 1fr; }
}

@media (max-width: 640px){
    #catModal .modal__card{
        width:min(100%, calc(100vw - (var(--fluid-gutter) * 2)));
        padding:20px 16px 16px;
    }

    .cat-modal-actions{
        grid-template-columns:1fr;
    }

    #contactModal .modal__card{
        width:min(96vw, 520px);
        padding:20px 16px 16px;
    }

    .contact-modal__title{
        font-size:26px;
    }

    .contact-modal__footerRow{
        align-items:flex-start;
        flex-direction:column;
    }

    .contact-modal-actions{
        grid-template-columns:1fr;
    }

    .contact-textarea{
        min-height:170px;
    }
}

.cookie-lock { overflow: hidden; }

.cookie-wall{
    position: fixed;
    inset: 0;
    display: none;
    z-index: 9999;
}
.cookie-wall.is-open{ display:block; }

.cookie-wall__backdrop{
    position:absolute;
    inset:0;
    background: rgba(0,0,0,0.5);
    backdrop-filter: blur(12px);
}

.cookie-wall__dialog{
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    background:white;
    padding: 60px 70px;
    border-radius: 25px;
    width: 90%;
    max-width: 600px;
    text-align:center;
    box-shadow: 0 40px 80px rgba(0,0,0,0.2);
    animation: cookieFadeIn 0.6s ease;
}

.cookie-wall__badge{
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 2px;
    color: #c45487;
    margin-bottom: 20px;
}

.cookie-wall__title{
    font-size: 30px;
    margin-bottom: 20px;
    color: var(--ink);
}

.cookie-wall__text{
    color: rgba(0,0,0,0.65);
    margin-bottom: 40px;
    line-height: 1.6;
}

.cookie-wall__actions{
    display:flex;
    justify-content:center;
    gap: 20px;
    flex-wrap: wrap;
}

.cookie-wall__link{
    text-decoration:none;
    color:#c45487;
    font-weight: 700;
}

@keyframes cookieFadeIn{
    from { opacity: 0; transform: translate(-50%, -40%); }
    to   { opacity: 1; transform: translate(-50%, -50%); }
}

.lang-switcher{
    position: relative;
    display:flex;
    align-items:center;
    gap:10px;
    margin-right: 8px;
    min-height: 44px;
    padding: 6px 14px 6px 10px;
    border-radius: 999px;
    border: 1px solid rgba(196,84,135,.18);
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,241,247,.94));
    box-shadow: 0 14px 30px rgba(196,84,135,.10);
    transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease, background .14s ease;
}

.lang-switcher:hover,
.lang-switcher.is-open{
    transform: translateY(-1px);
    border-color: rgba(196,84,135,.28);
    box-shadow: 0 18px 34px rgba(196,84,135,.14);
}

.lang-switcher__icon{
    display:grid;
    place-items:center;
    width:28px;
    height:28px;
    border-radius:50%;
    background: linear-gradient(180deg, rgba(255,182,215,.42), rgba(255,231,240,.92));
    color:#c45487;
    font-size:13px;
    line-height:1;
    flex: 0 0 auto;
    box-shadow: inset 0 0 0 1px rgba(196,84,135,.10);
}

.lang-switcher__trigger{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    min-width: 96px;
    padding: 0 28px 0 0;
    border: none;
    background: transparent;
    color: var(--ink);
    font-size: 13px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: .01em;
    cursor: pointer;
    outline: none;
}

.lang-switcher__current{
    display:block;
    text-align:left;
    white-space:nowrap;
}

.lang-switcher__native{
    position:absolute;
    width:1px;
    height:1px;
    opacity:0;
    pointer-events:none;
}

.lang-switcher::after{
    content: "";
    position:absolute;
    right: 15px;
    top: 50%;
    width: 8px;
    height: 8px;
    border-right: 2px solid rgba(27,27,34,.58);
    border-bottom: 2px solid rgba(27,27,34,.58);
    transform: translateY(-65%) rotate(45deg);
    pointer-events:none;
    transition: transform .14s ease, border-color .14s ease;
}

.lang-switcher:focus-within{
    border-color: rgba(196,84,135,.34);
    box-shadow: 0 0 0 4px rgba(196,84,135,.10), 0 18px 34px rgba(196,84,135,.14);
}

.lang-switcher:focus-within::after,
.lang-switcher:hover::after,
.lang-switcher.is-open::after{
    border-color: rgba(196,84,135,.72);
}

.lang-switcher.is-open::after{
    transform: translateY(-35%) rotate(-135deg);
}

.lang-switcher__menu{
    position:absolute;
    top: calc(100% + 12px);
    right: 0;
    z-index: 35;
    min-width: 180px;
    padding: 8px;
    border-radius: 22px;
    border: 1px solid rgba(196,84,135,.16);
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,246,250,.96));
    box-shadow: 0 24px 48px rgba(35,31,39,.14);
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px) scale(.98);
    pointer-events: none;
    transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
}

.lang-switcher.is-open .lang-switcher__menu{
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

.lang-switcher:focus-within .lang-switcher__menu{
    opacity:1;
    visibility:visible;
    transform:translateY(0) scale(1);
    pointer-events:auto;
}

.lang-switcher__option{
    display:flex;
    align-items:center;
    width:100%;
    min-height: 44px;
    padding: 0 14px;
    border: none;
    border-radius: 14px;
    background: transparent;
    color: var(--ink);
    font-size: 14px;
    font-weight: 700;
    text-decoration:none;
    text-align: left;
    cursor: pointer;
    transition: background .14s ease, color .14s ease, transform .14s ease;
}

.lang-switcher__option:hover,
.lang-switcher__option:focus-visible{
    background: linear-gradient(180deg, rgba(255,239,246,.96), rgba(255,231,240,.92));
    color: #b81e61;
    outline: none;
}

.lang-switcher__option.is-active{
    background: linear-gradient(180deg, rgba(255,225,237,.98), rgba(255,239,246,.96));
    color: #b81e61;
    box-shadow: inset 0 0 0 1px rgba(196,84,135,.12);
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (max-width: 640px){
    .lang-switcher{
        margin-right: 0;
        min-height: 40px;
        padding: 5px 12px 5px 8px;
        gap: 8px;
    }

    .lang-switcher__icon{
        width: 24px;
        height: 24px;
        font-size: 11px;
    }

    .lang-switcher__trigger{
        min-width: 78px;
        font-size: 12px;
        padding-right: 22px;
    }

    .lang-switcher::after{
        right: 13px;
        width: 7px;
        height: 7px;
    }

    .lang-switcher__menu{
        min-width: 160px;
        top: calc(100% + 10px);
        padding: 7px;
        border-radius: 18px;
    }

    .lang-switcher__option{
        min-height: 40px;
        font-size: 13px;
        border-radius: 12px;
    }
}
.modal__card--vault{
    width:min(620px, calc(100vw - (var(--fluid-gutter) * 2)));
    max-height: calc(100dvh - (var(--fluid-modal-pad) * 2));
    padding:clamp(20px, 4.4vw, 30px) clamp(14px, 4vw, 28px) clamp(18px, 3.6vw, 22px);
    border-radius:clamp(24px, 5vw, 34px);
    border:0;
    background:
            radial-gradient(circle at 50% 8%, rgba(255,255,255,1) 0%, rgba(255,255,255,.94) 18%, rgba(255,255,255,0) 42%),
            radial-gradient(circle at 14% 18%, rgba(255,126,182,.22), transparent 34%),
            radial-gradient(circle at 86% 76%, rgba(255,92,170,.24), transparent 32%),
            linear-gradient(165deg, rgba(255,252,254,.99) 0%, rgba(255,238,246,.98) 48%, rgba(255,219,232,.96) 100%);
    box-shadow:
            0 42px 88px rgba(190,24,93,.24),
            0 20px 42px rgba(17,17,17,.10);
    overflow:hidden;
}

#vaultModal .modal__card--vault{
    transform: translateY(36px);
}

.modal__card--vault::before{
    content:"";
    position:absolute;
    inset:0;
    background:
            radial-gradient(circle at top center, rgba(255,255,255,.92), transparent 44%),
            radial-gradient(circle at 22% 30%, rgba(255,207,229,.46), transparent 34%),
            radial-gradient(circle at 78% 72%, rgba(255,171,210,.40), transparent 30%),
            linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0));
    pointer-events:none;
}

.modal__card--vault > *{
    position:relative;
    z-index:1;
}

.modal__card--vault .modal__close{
    right:16px;
    top:16px;
    width:42px;
    height:42px;
    border:0;
    background: rgba(255,255,255,.94);
    box-shadow: 0 10px 24px rgba(196,84,135,.10);
}

.modal__card--vault .btn--full{
    min-height:56px;
    border-radius:18px;
}

.modal__card--vault .btn--dark{
    background:#2a2231;
    box-shadow: 0 16px 30px rgba(31,22,37,.18);
}

.vault-head{
    display:grid;
    justify-items:center;
    gap:clamp(8px, 1.8vw, 10px);
    padding:0 0 clamp(14px, 3vw, 20px);
    text-align:center;
}

.vault-icon{
    width:clamp(58px, 16vw, 74px);
    height:clamp(58px, 16vw, 74px);
    display:grid;
    place-items:center;
    border-radius:50%;
    border:0;
    background: linear-gradient(180deg, #ffffff 0%, #fff6fa 100%);
    box-shadow: 0 16px 34px rgba(196,84,135,.14);
    font-size:clamp(24px, 7vw, 30px);
    position:relative;
}

.vault-icon::after{
    content:none;
}

.vault-title{
    margin:0;
    font-size:clamp(26px, 7.2vw, 42px);
    line-height:.95;
    letter-spacing:-.05em;
    background: linear-gradient(180deg, #b61663 0%, #ee5a9f 56%, #ff9ec8 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.vault-sub{
    margin:0;
    color: rgba(0,0,0,.52);
    font-size:clamp(11px, 2.8vw, 13px);
    line-height:1.55;
    text-transform:uppercase;
    letter-spacing:clamp(.08em, .45vw, .15em);
    font-weight:900;
}

.vault-guest{
    display:grid;
    gap:16px;
}

.vault-guest .muted{
    padding:0 12px;
    color: rgba(0,0,0,.64);
    line-height:1.7;
}

.vault-shell{
    display:grid;
    gap:clamp(14px, 2.8vw, 18px);
}

.vault-stats--grid{
    display:grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:0;
    position:relative;
    border-radius:clamp(18px, 4.4vw, 24px);
    background:#fff;
    border:0;
    box-shadow: 0 18px 36px rgba(17,17,17,.06);
    overflow:hidden;
}

.vault-stats--grid::after{
    content:none;
}

.vault-stats--grid .vault-statCard{
    padding:clamp(14px, 2.8vw, 18px);
    border:none;
    background:transparent;
    box-shadow:none;
    text-align:center;
}

.vault-statCard__label,
.vault-metaCard__label,
.vault-progress__label{
    font-size:11px;
    font-weight:900;
    letter-spacing:.16em;
    color: rgba(0,0,0,.44);
    text-transform:uppercase;
}

.vault-statCard__value{
    margin-top:12px;
    display:flex;
    align-items:baseline;
    justify-content:center;
    gap:6px;
    font-size:clamp(24px, 7vw, 36px);
    font-weight:1000;
    color: var(--ink);
    line-height:1;
}

.vault-statCard__value span:last-child{
    font-size:clamp(12px, 3vw, 14px);
    font-weight:900;
    color: rgba(0,0,0,.55);
}

.vault-statCard__value--accent{
    color:#059669;
}

.vault-tierCard{
    position:relative;
    --vault-tier-circle-size: clamp(46px, 14vw, 58px);
    --vault-tier-rail-height: clamp(8px, 2.2vw, 12px);
    --vault-tier-rail-inset: clamp(18px, 6vw, 52px);
    padding:4px clamp(0px, 2vw, 10px) 0;
}

.vault-tierCard__rail,
.vault-tierCard__fill{
    position:absolute;
    left:var(--vault-tier-rail-inset);
    right:auto;
    width:calc(100% - (var(--vault-tier-rail-inset) * 2));
    top:calc((var(--vault-tier-circle-size) / 2) - (var(--vault-tier-rail-height) / 2));
    height:var(--vault-tier-rail-height);
    border-radius:999px;
}

.vault-tierCard__rail{
    background: linear-gradient(90deg, rgba(223, 56, 128, .10), rgba(255,255,255,.92) 50%, rgba(223, 56, 128, .10));
    box-shadow: none;
}

.vault-tierCard__fill{
    width:0;
    background: linear-gradient(90deg, #ff95c3 0%, #ff5c9d 52%, #cb5df5 100%);
    box-shadow: 0 8px 20px rgba(196,84,135,.18);
}

.vault-tierCard__steps{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap:clamp(4px, 1.4vw, 8px);
}

.vault-tierCard__step{
    text-align:center;
    opacity:.56;
    transition: transform .28s ease, opacity .28s ease;
}

.vault-tierCard__circle{
    width:var(--vault-tier-circle-size);
    height:var(--vault-tier-circle-size);
    margin:0 auto clamp(6px, 1.8vw, 8px);
    display:grid;
    place-items:center;
    border-radius:50%;
    border:0;
    background: linear-gradient(180deg, #ffffff 0%, #fff4f9 100%);
    box-shadow: 0 10px 22px rgba(17,17,17,.10);
    overflow:hidden;
}

.vault-tierCard__gem{
    display:block;
    width:clamp(30px, 9vw, 40px);
    height:clamp(30px, 9vw, 40px);
    object-fit:contain;
    opacity:.46;
    filter: saturate(.72) contrast(.9) brightness(.98) drop-shadow(0 2px 4px rgba(144, 85, 138, .10));
    transform: scale(.92) translateZ(0);
    transition: opacity .22s ease, filter .22s ease, transform .22s ease;
}

.vault-tierCard__gem--pearl{
    width:clamp(28px, 8vw, 36px);
    height:clamp(28px, 8vw, 36px);
    filter: saturate(.72) contrast(1.02) brightness(.98) drop-shadow(0 2px 4px rgba(197, 177, 191, .12));
}

.vault-tierCard__gem--amethyst,
.vault-tierCard__gem--rose{
    width:clamp(32px, 9.4vw, 42px);
    height:clamp(32px, 9.4vw, 42px);
}

.vault-tierCard__gem--diamond{
    width:clamp(34px, 10vw, 44px);
    height:clamp(34px, 10vw, 44px);
    filter: saturate(.72) contrast(.94) brightness(.98) drop-shadow(0 2px 4px rgba(119, 154, 190, .10));
}

.vault-tierCard__name{
    font-size:clamp(10px, 2.8vw, 12px);
    font-weight:900;
    line-height:1.15;
    letter-spacing:.05em;
    text-transform:uppercase;
    color:#8f7f89;
}

.vault-tierCard__meta{
    margin-top:4px;
    display:inline-block;
    padding:2px clamp(5px, 1.6vw, 8px);
    border-radius:999px;
    background:#fff;
    border:0;
    color:#b09aa5;
    font-size:clamp(10px, 2.4vw, 11px);
    font-weight:800;
    box-shadow: 0 8px 18px rgba(17,17,17,.06);
}

.vault-tierCard__step.is-earned,
.vault-tierCard__step.is-current{
    opacity:1;
}

.vault-tierCard__step.is-earned .vault-tierCard__gem{
    opacity:.88;
    filter: saturate(1.04) contrast(1.06) brightness(1.02) drop-shadow(0 4px 8px rgba(183, 71, 132, .14));
    transform: scale(.98) translateZ(0);
}

.vault-tierCard__step.is-current .vault-tierCard__gem{
    opacity:1;
    filter: saturate(1.26) contrast(1.18) brightness(1.04) drop-shadow(0 6px 12px rgba(183, 46, 116, .22));
    transform: scale(1.05) translateY(-1px) translateZ(0);
}

.vault-tierCard__step.is-current .vault-tierCard__gem--pearl{
    filter: contrast(1.24) brightness(1.08) drop-shadow(0 6px 12px rgba(194, 148, 178, .26));
}

.vault-tierCard__step.is-current .vault-tierCard__gem--diamond{
    filter: saturate(1.16) contrast(1.14) brightness(1.05) drop-shadow(0 6px 12px rgba(104, 160, 220, .20));
}

.vault-tierCard__step.is-earned .vault-tierCard__circle{
    background: radial-gradient(circle at 30% 30%, #fff, #ffe4f0);
    color:#c22f75;
}

.vault-tierCard__step.is-current{
    transform: none;
}

.vault-tierCard__step.is-current .vault-tierCard__circle{
    background: radial-gradient(circle at 30% 30%, #fff, #ffd4e7);
    color:#9f1551;
    box-shadow: 0 16px 30px rgba(196,84,135,.24);
}

.vault-metaCard,
.vault-progressCard{
    border-radius:22px;
    border:0;
    box-shadow: 0 16px 34px rgba(17,17,17,.06);
}

.vault-metaCard{
    padding:clamp(12px, 3vw, 16px);
    display:grid;
    grid-template-columns:1fr;
    align-items:center;
    gap:0;
    border:0;
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,244,248,.96));
}

.vault-metaCard__content{
    min-width:0;
}

.vault-metaCard__row{
    display:grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:clamp(10px, 2vw, 12px);
}

.vault-metaCard__item{
    padding:clamp(10px, 2.8vw, 14px);
    border-radius:18px;
    background: rgba(255,255,255,.82);
    border:0;
    box-shadow: 0 10px 22px rgba(17,17,17,.05);
}

.vault-metaCard__value{
    margin-top:8px;
    font-size:clamp(20px, 5.8vw, 22px);
    font-weight:1000;
    color: var(--ink);
}

.vault-progressCard{
    position:relative;
    overflow:hidden;
    margin:clamp(2px, .8vw, 4px) 0 clamp(6px, 1.4vw, 8px);
    padding:clamp(6px, 1.8vw, 8px) clamp(10px, 3vw, 12px) clamp(8px, 2vw, 10px);
    border:0;
    background: linear-gradient(160deg, rgba(255,255,255,.99), rgba(255,248,251,.98) 54%, rgba(255,241,247,.96) 100%);
    box-shadow:
            0 16px 32px rgba(31,22,37,.06),
            inset 0 1px 0 rgba(255,255,255,.92);
}

.vault-progressCard::before{
    content:"";
    position:absolute;
    inset:0;
    background:
            radial-gradient(circle at 14% 18%, rgba(255,229,240,.52), transparent 26%),
            radial-gradient(circle at 86% 18%, rgba(255,192,221,.24), transparent 24%),
            linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,0));
    pointer-events:none;
}

.vault-progress__top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.vault-progress__top > div:first-child{
    display:grid;
    gap:2px;
    min-width:0;
}

.vault-progress__label{
    color: rgba(35,31,39,.62);
}

.vault-progress__value{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:clamp(58px, 16vw, 66px);
    padding:clamp(5px, 1.6vw, 6px) clamp(8px, 2vw, 10px) clamp(6px, 1.8vw, 7px);
    border-radius:13px;
    border:0;
    background: rgba(255,255,255,.96);
    box-shadow:
            inset 0 1px 0 rgba(255,255,255,.96),
            0 8px 18px rgba(196,84,135,.06);
    font-size:clamp(21px, 2.7vw, 26px);
    font-weight:1000;
    color: var(--ink);
    line-height:1;
    letter-spacing:-.04em;
    transition: transform .2s ease, box-shadow .2s ease;
}

.vault-progress__hint{
    margin-top:0;
    color: rgba(35,31,39,.76);
    font-size:clamp(11px, 2.8vw, 12px);
    line-height:1.35;
}

.vault-progress__bar{
    position:relative;
    margin-top:6px;
    height:clamp(10px, 4.6vw, 28px);
    padding:2px;
    border-radius:999px;
    border:0;
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(236,228,235,.96));
    overflow:hidden;
    box-shadow:
            inset 0 1px 2px rgba(255,255,255,.96),
            inset 0 -3px 8px rgba(58,36,49,.06),
            0 6px 14px rgba(196,84,135,.04);
}

.vault-progress__bar::before{
    content:"";
    position:absolute;
    inset:2px;
    border-radius:999px;
    background:
            linear-gradient(180deg, rgba(255,255,255,.46), rgba(255,255,255,0) 44%),
            linear-gradient(90deg, rgba(255,255,255,.12), rgba(234,227,233,.03) 32%, rgba(255,255,255,.12) 100%);
    pointer-events:none;
}

.vault-progress__fill{
    position:relative;
    height:100%;
    border-radius:999px;
    background:
            linear-gradient(180deg, rgba(255,255,255,.26), rgba(255,255,255,0) 48%),
            linear-gradient(90deg, #ffc3de 0%, #ff8abd 32%, #ff5d9c 66%, #d96dff 100%);
    box-shadow:
            inset 0 1px 2px rgba(255,255,255,.38),
            0 8px 18px rgba(196,84,135,.20),
            0 0 16px rgba(236,116,189,.14);
    transition:
            width 920ms cubic-bezier(.22, 1, .36, 1),
            filter .24s ease,
            box-shadow .24s ease,
            transform .24s ease;
    will-change: width;
    overflow:hidden;
    animation: vaultProgressPulse 3.8s ease-in-out infinite;
}

.vault-progress__fill::before{
    content:none;
}

.vault-progress__fill::after{
    content:"";
    position:absolute;
    inset:0;
    background: linear-gradient(90deg, transparent 0%, rgba(255,214,232,.06) 28%, rgba(255,255,255,.28) 50%, rgba(255,207,228,.08) 72%, transparent 100%);
    transform:translateX(-100%);
    animation: vaultProgressSheen 2.8s ease-in-out infinite;
    pointer-events:none;
}

.vault-progressCard:hover .vault-progress__value{
    transform: translateY(-1px);
    box-shadow:
            inset 0 1px 0 rgba(255,255,255,.94),
            0 12px 24px rgba(196,84,135,.10);
}

.vault-progressCard:hover .vault-progress__fill{
    filter: saturate(1.08) brightness(1.03);
    box-shadow:
            inset 0 1px 2px rgba(255,255,255,.38),
            0 10px 22px rgba(196,84,135,.24),
            0 0 20px rgba(236,116,189,.18);
}

.vault-closeBtn{
    margin-top:8px;
}

@keyframes vaultStripeShift{
    from{ background-position: 0 0; }
    to{ background-position: 32px 0; }
}

@keyframes vaultProgressSheen{
    from{ transform:translateX(-100%); }
    to{ transform:translateX(100%); }
}

@keyframes vaultProgressPulse{
    0%,100%{
        box-shadow:
                inset 0 1px 2px rgba(255,255,255,.48),
                0 8px 18px rgba(196,84,135,.22),
                0 0 18px rgba(255,154,198,.16);
    }
    50%{
        box-shadow:
                inset 0 1px 2px rgba(255,255,255,.52),
                0 10px 22px rgba(196,84,135,.28),
                0 0 22px rgba(255,154,198,.24);
    }
}

@media (max-width: 640px){
    .modal__card--vault{
        width:min(100%, calc(100vw - (var(--fluid-gutter) * 2)));
        padding:clamp(18px, 5vw, 24px) clamp(12px, 4vw, 16px) clamp(14px, 4vw, 16px);
    }

    #vaultModal .modal__card--vault{
        transform: translateY(22px);
    }

    .vault-icon{
        width:clamp(56px, 18vw, 64px);
        height:clamp(56px, 18vw, 64px);
        font-size:clamp(24px, 7vw, 26px);
    }

    .vault-title{
        font-size:clamp(24px, 8vw, 28px);
    }

    .vault-stats--grid,
    .vault-metaCard__row{
        grid-template-columns: 1fr;
    }

    .vault-stats--grid::after{
        display:none;
    }

    .vault-statCard__value,
    .vault-progress__value{
        font-size:clamp(24px, 8vw, 28px);
    }

    .vault-progress__top{
        align-items:flex-start;
    }

    .vault-progress__value{
        min-width:clamp(54px, 16vw, 58px);
        padding:6px 9px 7px;
        border-radius:12px;
    }

    .vault-progressCard{
        margin:2px 0 6px;
        padding:5px 10px 7px;
    }

    .vault-progress__bar{
        margin-top:6px;
        height:10px;
    }

    .vault-tierCard{
        padding-inline:0;
    }

    .vault-tierCard__rail,
    .vault-tierCard__fill{
        left:var(--vault-tier-rail-inset);
        right:auto;
        width:calc(100% - (var(--vault-tier-rail-inset) * 2));
    }

    .vault-tierCard__fill{
        width:0;
    }

    .vault-tierCard{
        --vault-tier-circle-size: clamp(48px, 16vw, 54px);
        --vault-tier-rail-inset: clamp(18px, 6vw, 26px);
    }

    .vault-tierCard__steps{
        gap:clamp(4px, 2vw, 6px);
    }
    .vault-tierCard__circle{
        margin-bottom:8px;
    }

    .vault-tierCard__gem{
        width:clamp(32px, 11vw, 38px);
        height:clamp(32px, 11vw, 38px);
    }

    .vault-tierCard__gem--pearl{
        width:clamp(28px, 10vw, 34px);
        height:clamp(28px, 10vw, 34px);
    }

    .vault-tierCard__gem--diamond{
        width:clamp(34px, 12vw, 40px);
        height:clamp(34px, 12vw, 40px);
    }

    .vault-tierCard__name{
        font-size:10px;
    }

    .vault-tierCard__meta{
        padding:2px 6px;
        font-size:10px;
    }

    .vault-metaCard{
        grid-template-columns:1fr;
        text-align:center;
    }
}

.topbar{
    height: 78px;
    padding: 0 26px;
    background: rgba(255,255,255,.92);
    box-shadow: 0 10px 36px rgba(17,17,17,.06);
}

.topbar__left,
.topbar__right{
    gap: 16px;
}

.brand{
    font-size: 24px;
    letter-spacing: .2px;
}

.icon-btn{
    width: 44px;
    height: 44px;
    background: rgba(255,255,255,.94);
    border-color: rgba(17,17,17,.06);
}

.btn{
    min-height: 48px;
    padding: 13px 20px;
    box-shadow: 0 12px 28px rgba(17,17,17,.08);
}

.btn--soft,
.btn:not(.btn--pink):not(.btn--dark):not(.btn--danger){
    background: rgba(255,255,255,.84);
    border-color: rgba(17,17,17,.08);
    color: var(--ink);
}

.btn--full{
    min-height: 52px;
    border-radius: 16px;
}

.layout__content{
    padding-bottom: 32px;
}

.section{
    padding: 72px 22px 54px;
    background: transparent;
}

.section__head{
    margin-bottom: 32px;
}

.section__title{
    font-size: clamp(32px, 3.4vw, 54px);
    line-height: 1;
    letter-spacing: -.04em;
    color: #17141a;
}

.section__sub{
    margin-top: 10px;
    font-size: 15px;
    line-height: 1.65;
}

.card{
    background: rgba(255,255,255,.84);
    border-color: rgba(17,17,17,.07);
    box-shadow: 0 20px 48px rgba(17,17,17,.08);
}

.footer{
    margin-top: auto;
    background: linear-gradient(180deg, rgba(34,31,37,.72), rgba(28,25,31,.92));
    padding: 42px 24px 50px;
    grid-template-columns: minmax(0, 1fr);
    gap: 22px;
}

.footer__brand,
.footer__cols{
    width: var(--fluid-content);
    max-width:100%;
    margin: 0 auto;
}

.footer__cols{
    grid-template-columns: 1.1fr 1fr 1fr;
    gap: 28px;
}

.footer__col a{
    padding: 7px 0;
}

.drawer__panel{
    background: rgba(255,255,255,.95);
}

.drawer__nav{
    padding: 14px 14px 20px;
}

.drawer__link{
    min-height: 46px;
    border: 1px solid transparent;
    transition: transform .14s ease, background .14s ease, border-color .14s ease;
}

.drawer__link:hover{
    transform: translateX(2px);
    border-color: rgba(196,84,135,.10);
}

.drawer__link--primary{
    border-color: rgba(196,84,135,.12);
    box-shadow: 0 12px 24px rgba(196,84,135,.08);
}

.mini-list{
    gap: 12px;
}

.mini-item{
    align-items: flex-start;
    gap: 12px;
    padding: 12px;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(255,245,249,.82));
}

.mini-item__thumb{
    width: 58px;
    height: 58px;
    flex-basis: 58px;
    border-radius: 16px;
    box-shadow: 0 10px 24px rgba(17,17,17,.08);
}

.mini-item__name{
    font-size: 14px;
}

.mini-item__meta{
    font-size: 12px;
    line-height: 1.5;
}

.mini-item__actions{
    gap: 6px;
}

.mini-item__iconBtn{
    width: 40px;
    height: 40px;
}

.cart-summary{
    background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(250,246,248,.82));
    border-radius: 18px;
    padding: 12px;
}

.modal{
    padding: 24px;
}

.modal__card{
    background: rgba(255,255,255,.97);
    box-shadow: 0 28px 70px rgba(17,17,17,.16);
}

@media (max-width: 980px){
    .topbar{
        padding: 0 16px;
    }

    .footer__cols{
        grid-template-columns: 1fr;
        gap: 18px;
    }
}

@media (max-width: 640px){
    .section{
        padding: 44px 14px 34px;
    }

    .section__title{
        font-size: 34px;
    }

    .topbar{
        height: 74px;
        padding: 0 12px;
    }

    .brand{
        font-size: 22px;
    }

    .icon-btn,
    .vault-badge{
        width: 42px;
        height: 42px;
    }

    .mini-item{
        padding: 10px;
    }
}

.cookie-wall__backdrop{
    background: rgba(13, 12, 17, 0.58);
    backdrop-filter: blur(16px);
}

.cookie-wall__dialog{
    padding: 46px 42px 34px;
    max-width: 640px;
    border-radius: 32px;
    border: 1px solid rgba(255,255,255,.55);
    background:
            radial-gradient(circle at top, rgba(253,232,238,.85), transparent 32%),
            linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,250,252,.96));
    box-shadow: 0 36px 90px rgba(0,0,0,.24);
}

.cookie-wall__badge{
    margin-bottom: 18px;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .24em;
}

.cookie-wall__title{
    margin: 0 0 18px;
    font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans";
    font-size: clamp(34px, 3vw, 46px);
    line-height: 1.02;
    letter-spacing: -.05em;
}

.cookie-wall__text{
    max-width: 34ch;
    margin: 0 auto 34px;
    font-size: 19px;
    line-height: 1.7;
    color: rgba(27,27,34,.68);
}

.cookie-wall__actions{
    align-items: center;
    gap: 16px;
}

.cookie-wall__actions .btn{
    min-width: 170px;
    min-height: 56px;
    padding: 0 24px;
    border-radius: 999px;
    font-size: 18px;
    font-weight: 900;
    box-shadow: 0 16px 36px rgba(196,84,135,.22);
}

.cookie-wall__link{
    display: inline-flex;
    align-items: center;
    min-height: 56px;
    padding: 0 6px;
    font-size: 18px;
    font-weight: 900;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
    color: #c45487;
}

.cookie-wall__link:hover{
    color: #b4175a;
}

@media (max-width: 640px){
    .cookie-wall__dialog{
        width: calc(100% - 24px);
        padding: 30px 22px 24px;
        border-radius: 26px;
    }

    .cookie-wall__title{
        font-size: 28px;
    }

    .cookie-wall__text{
        font-size: 16px;
        margin-bottom: 24px;
    }

    .cookie-wall__actions{
        flex-direction: column;
        align-items: stretch;
    }

    .cookie-wall__actions .btn,
    .cookie-wall__link{
        width: 100%;
        justify-content: center;
    }
}

.cookie-wall__actions{
    justify-content:center;
}

.cookie-wall__actions .btn{
    margin-inline:auto;
}

body{
    background: linear-gradient(180deg, #fffdfd 0%, #fff8fb 32%, #ffffff 100%);
}

.layout__content{
    padding-bottom: 0;
}

.screen_img{
    position: relative;
    min-height: clamp(520px, 76vh, 760px);
    height: auto;
    display: grid;
    place-items: center;
    isolation: isolate;
    overflow: hidden;
    background:
            radial-gradient(circle at 50% 30%, rgba(255,255,255,0.98), rgba(255,255,255,0.92) 16%, rgba(255,255,255,0) 31%),
            radial-gradient(circle at top left, rgba(255,255,255,0.82), rgba(255,255,255,0) 34%),
            radial-gradient(circle at 12% 18%, rgba(255,94,165,0.30), rgba(255,94,165,0) 36%),
            radial-gradient(circle at 88% 76%, rgba(255,66,149,0.28), rgba(255,66,149,0) 32%),
            linear-gradient(140deg, #fff7fb 0%, #ffdce9 48%, #ff9ec6 100%);
}

.screen_img__bg{
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.screen_img__blob{
    position: absolute;
    width: clamp(360px, 44vw, 620px);
    height: clamp(360px, 44vw, 620px);
    border-radius: 50%;
    filter: blur(58px);
    opacity: .68;
    animation: homeHeroSmokeFloat 12s ease-in-out infinite;
}

.screen_img__blob--1{
    left: -150px;
    top: -170px;
    background: radial-gradient(circle at 30% 30%, rgba(255,74,153,0.72), rgba(255,182,215,0.58) 42%, rgba(255,255,255,0) 72%);
}

.screen_img__blob--2{
    right: -200px;
    bottom: -220px;
    background: radial-gradient(circle at 60% 40%, rgba(255,98,170,0.68), rgba(255,210,229,0.56) 46%, rgba(255,255,255,0) 74%);
    animation-delay: -3.2s;
}

.screen_img__blob--3{
    left: 50%;
    top: -140px;
    width: clamp(320px, 38vw, 520px);
    height: clamp(320px, 38vw, 520px);
    transform: translateX(-50%);
    background: radial-gradient(circle at 50% 46%, rgba(255,255,255,0.92), rgba(255,229,240,0.52) 36%, rgba(255,255,255,0) 72%);
    filter: blur(46px);
    opacity: .78;
    animation: homeHeroSmokeCenter 15s ease-in-out infinite;
}

.screen_img__grain{
    position: absolute;
    inset: 0;
    background:
            radial-gradient(circle at 10% 20%, rgba(0,0,0,.06) 0 1px, transparent 2px 100%),
            radial-gradient(circle at 70% 80%, rgba(0,0,0,.05) 0 1px, transparent 2px 100%),
            radial-gradient(circle at 40% 60%, rgba(0,0,0,.04) 0 1px, transparent 2px 100%),
            radial-gradient(circle at 80% 30%, rgba(0,0,0,.05) 0 1px, transparent 2px 100%);
    background-size: 180px 180px;
    opacity: .12;
    mix-blend-mode: soft-light;
}

.screen_img__overlay{
    position: relative;
    z-index: 1;
    width: min(960px, calc(100vw - (var(--fluid-gutter) * 2)));
    max-width:100%;
    padding: clamp(92px, 14vw, 120px) clamp(12px, 3vw, 24px) clamp(96px, 14vw, 124px);
    background: none;
}

.screen_img__overlay::before{
    content: "";
    position: absolute;
    inset: -36px -28px -44px;
    border-radius: 999px;
    background: radial-gradient(circle at center, rgba(255,255,255,1), rgba(255,255,255,0.96) 24%, rgba(255,255,255,0.80) 42%, rgba(255,255,255,0.30) 58%, rgba(255,255,255,0) 78%);
    filter: blur(26px);
    z-index: -1;
    pointer-events: none;
}

.screen_img__overlay::after{
    content: none;
}

.screen_img__overlay > div{
    position: relative;
    width: min(720px, 100%);
    margin: 0 auto;
}

.screen_img__title{
    font-size: clamp(52px, 7vw, 94px);
    line-height: .96;
    letter-spacing: -.065em;
    color: #1f1721;
    text-shadow: 0 16px 40px rgba(255,255,255,.26);
}

.screen_img__subtitle{
    margin: 18px auto 26px;
    max-width: 700px;
    font-size: clamp(18px, 2vw, 24px);
    line-height: 1.55;
    color: rgba(31,23,33,.78);
}

.screen_img .btn{
    min-width: 220px;
    min-height: 56px;
    border-radius: 999px;
    box-shadow: 0 18px 38px rgba(196,84,135,.20);
}

#bestsellers{
    position: relative;
    padding: clamp(58px, 9vw, 86px) var(--fluid-gutter) clamp(52px, 8vw, 72px);
    background: #ffffff;
}

#bestsellers::before{
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: min(380px, calc(100vw - (var(--fluid-gutter) * 4)));
    height: 1px;
    transform: translateX(-50%);
    background: linear-gradient(90deg, rgba(196,84,135,0), rgba(196,84,135,.38), rgba(196,84,135,0));
}

#bestsellers .section__head{
    width: var(--fluid-content);
    max-width:100%;
    padding-top: 8px;
}

#bestsellers .section__title{
    font-size: clamp(34px, 3.6vw, 54px);
}

#bestsellers .section__sub{
    color: rgba(31,23,33,.62);
}

#bestsellers code{
    padding: 2px 8px;
    border-radius: 999px;
    background: rgba(255,236,244,.92);
    color: #c32267;
    font-size: .92em;
}

#bestsellers .cards{
    padding-bottom: 8px;
}

#bestsellers .cards > .muted{
    grid-column: 1 / -1;
    width: 100%;
    margin: 0;
    padding: 42px 0 20px;
    text-align: center;
    font-size: 16px;
}

.card{
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,247,250,.92));
}

.footer{
    margin-top: 0;
    padding: clamp(24px, 4vw, 28px) var(--fluid-gutter) calc(36px + env(safe-area-inset-bottom));
    position: relative;
    overflow: hidden;
    background:
            radial-gradient(circle at 50% 24%, rgba(255,255,255,0.94), rgba(255,255,255,0.76) 18%, rgba(255,255,255,0) 42%),
            radial-gradient(circle at 12% 24%, rgba(255,94,165,0.24), rgba(255,94,165,0) 34%),
            radial-gradient(circle at 88% 72%, rgba(255,66,149,0.22), rgba(255,66,149,0) 30%),
            linear-gradient(140deg, #fff7fb 0%, #ffdce9 48%, #ff9ec6 100%);
    border-top: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: clamp(14px, 3vw, 18px);
}

.footer__logo{
    text-decoration: none;
    font-size: 24px;
    order: 1;
    margin-left: 0;
    margin-right: 0;
    flex: 0 0 auto;
}

.footer__logo--textOnly{
    display:inline-flex;
    align-items:center;
    gap:0;
}

.footer__contact{
    appearance:none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 clamp(18px, 4vw, 24px);
    border-radius: 999px;
    border: 0;
    background: linear-gradient(180deg, var(--pp-pink), var(--pp-coral));
    color: #fff;
    font:inherit;
    font-weight: 800;
    text-decoration: none;
    cursor:pointer;
    order: 2;
    margin-left: auto;
    flex: 0 0 auto;
    box-shadow: 0 16px 32px rgba(239,138,116,.20);
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.footer__contact:hover{
    transform: translateY(-1px);
    filter: brightness(1.03);
    box-shadow: 0 18px 36px rgba(239,138,116,.24);
}

@keyframes homeHeroSmokeFloat{
    0%,100%{ transform: translateY(0) translateX(0) scale(1); }
    50%{ transform: translateY(14px) translateX(8px) scale(1.02); }
}

@keyframes homeHeroSmokeCenter{
    0%,100%{ transform: translateX(-50%) translateY(0) scale(1); }
    50%{ transform: translateX(-50%) translateY(18px) scale(1.06); }
}

@media (max-width: 980px){
    .screen_img__blob--1{
        left: -180px;
        top: -150px;
    }

    .screen_img__blob--2{
        right: -180px;
        bottom: -180px;
    }

    .screen_img__overlay{
        width: min(100%, calc(100vw - (var(--fluid-gutter) * 2)));
        padding: clamp(88px, 12vw, 108px) clamp(12px, 2.6vw, 18px) clamp(92px, 12vw, 112px);
    }

    .footer{
        padding-inline: 18px;
    }
}

@media (max-width: 640px){
    .screen_img{
        min-height: 500px;
    }

    .screen_img__blob{
        width: clamp(280px, 74vw, 390px);
        height: clamp(280px, 74vw, 390px);
    }

    .screen_img__blob--1{
        left: -120px;
        top: -110px;
    }

    .screen_img__blob--2{
        right: -130px;
        bottom: -140px;
    }

    .screen_img__blob--3{
        top: -78px;
        width: clamp(260px, 68vw, 360px);
        height: clamp(260px, 68vw, 360px);
    }

    .screen_img__overlay{
        padding: 92px clamp(10px, 3vw, 14px) 96px;
    }

    .screen_img__title{
        font-size: clamp(42px, 14vw, 62px);
    }

    .screen_img__subtitle{
        font-size: 17px;
    }

    #bestsellers{
        padding: 58px var(--fluid-gutter) 52px;
    }

    .footer{
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        text-align: left;
        padding: 24px var(--fluid-gutter) calc(32px + env(safe-area-inset-bottom));
    }

    .footer__contact{
        width: auto;
        margin-left: auto;
    }
}

.layout{
    min-height: calc(100dvh - 78px);
}

.layout__content{
    width: 100%;
    padding-bottom: 0;
}

.topbar__actions{
    display:flex;
    align-items:center;
    gap:16px;
}

.drawer__quickLinks{
    display:none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:10px;
    margin: 14px 0 18px;
}

@media (max-width: 980px){
    .topbar__actions{
        display:none;
    }

    .drawer__quickLinks{
        display:grid;
    }
}

.drawer__quickLink{
    appearance:none;
    min-height:46px;
    padding: 0 14px;
    border-radius:16px;
    border:1px solid rgba(17,17,17,.08);
    background: rgba(255,255,255,.82);
    box-shadow: 0 10px 24px rgba(17,17,17,.06);
    color: var(--ink);
    font: inherit;
    font-size:14px;
    font-weight:800;
    text-decoration:none;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    cursor:pointer;
    transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}

.drawer__quickLink:hover,
.drawer__quickLink:focus-visible{
    transform: translateY(-1px);
    border-color: rgba(196,84,135,.26);
    box-shadow: 0 14px 28px rgba(196,84,135,.10);
    outline:none;
}

.drawer__quickLink--primary{
    background: linear-gradient(180deg, rgba(255,236,244,.96), rgba(255,246,250,.94));
    border-color: rgba(196,84,135,.18);
    color:#b4175a;
}

.screen_img__content{
    position: relative;
    width: min(720px, 100%);
    margin: 0 auto;
}

@media (max-width: 720px){
    .topbar{
        padding: 0 12px;
        gap: 10px;
    }

    .topbar__left{
        min-width: 0;
        gap: 12px;
    }

    .topbar__right{
        flex: 0 0 auto;
        gap: 10px;
    }

    .brand{
        font-size: clamp(20px, 6.8vw, 24px);
    }

    .lang-switcher{
        margin-right: 0;
        max-width: 156px;
        min-width: 0;
        padding-right: 34px;
    }

    .lang-switcher__trigger{
        min-width: 0;
        padding-right: 14px;
    }

    .lang-switcher__current{
        max-width: 72px;
        overflow:hidden;
        text-overflow:ellipsis;
    }

    .screen_img__overlay{
        width: min(100%, calc(100vw - (var(--fluid-gutter) * 2)));
        padding: 88px clamp(8px, 2.8vw, 10px) 92px;
    }

    .screen_img__overlay::before{
        inset: -24px -12px -28px;
    }

    .screen_img__content{
        width: min(100%, 320px);
    }

    .screen_img .btn{
        width: min(100%, 220px);
        min-width: 0;
    }

    .drawer--left{
        top: 86px;
        left: 12px;
        right: 12px;
        bottom: auto;
        width: auto;
        z-index: 1900;
    }

    .drawer--left .drawer__panel{
        height: min(calc(100dvh - 104px), 560px);
        border-radius: 26px;
        transform: translateY(-120%);
        opacity: 0;
        transition: transform .26s ease, opacity .22s ease;
    }

    .drawer--left .drawer__top{
        height: 66px;
        padding: 0 12px 0 14px;
    }

    .drawer--left .drawer__nav{
        padding: 12px 12px 16px;
    }

    #navToggle:checked ~ .drawer--left .drawer__panel{
        transform: translateY(0);
        opacity: 1;
    }
}

@media (max-width: 440px){
    .drawer__quickLinks{
        grid-template-columns: 1fr;
    }

    .drawer--left{
        top: 82px;
        left: 10px;
        right: 10px;
    }

    .drawer--left .drawer__panel{
        height: min(calc(100dvh - 96px), 520px);
        border-radius: 22px;
    }
}

:root{
    --pp-pink:#f4b0c5;
    --pp-pink-soft:#fff0f6;
    --pp-fuchsia:#cc5a8c;
    --pp-fuchsia-deep:#c45487;
    --pp-fuchsia-soft:#e5a1b4;
    --pp-coral:#ef8a74;
    --pp-coral-deep:#dd705c;
    --pp-coral-soft:#ffe2dc;
    --pp-blue:#9acbe7;
    --pp-cream:#efcfab;
    --pp-ice:#f7f8fc;
    --pp-navy:#1b275c;
    --pp-gold:#f1c24e;
    --pp-lilac:#b59fde;
    --pp-mint:#bcebd9;
    --pp-olive:#879b53;
    --pp-grey:#b4afb2;
}

body{
    background: linear-gradient(180deg, var(--pp-ice) 0%, var(--pp-pink-soft) 34%, #ffffff 100%);
}

.topbar{
    background: rgba(247,248,252,.88);
    border-bottom-color: rgba(38,49,75,.06);
}

.btn--pink{
    background: linear-gradient(180deg, var(--pp-pink), var(--pp-coral));
    color:#fff;
    border:0;
    box-shadow: 0 16px 32px rgba(239,138,116,.20);
}

.btn--dark{
    background: linear-gradient(180deg, var(--pp-pink), var(--pp-coral));
    color:#fff;
    border:0;
    box-shadow: 0 16px 32px rgba(239,138,116,.20);
}

.btn--soft{
    background: linear-gradient(180deg, rgba(244,176,197,.92), rgba(239,138,116,.92));
    border:0;
    color:#fff;
    box-shadow: 0 14px 28px rgba(239,138,116,.18);
}

.brand{
    align-items:center;
    gap:10px;
}

.brand__mark{
    width:42px;
    height:auto;
    max-height:64px;
    object-fit:contain;
    box-shadow:none;
    flex:0 0 auto;
}

.brand__wordmark{
    display:inline-flex;
    align-items:baseline;
    gap:.18em;
    font-family:"Palatino Linotype", "Book Antiqua", Georgia, serif;
    font-size:clamp(18px, 2vw, 24px);
    font-weight:900;
    letter-spacing:.08em;
    line-height:1;
    text-transform:uppercase;
    white-space:nowrap;
}

.brand__pink{
    color:var(--pp-fuchsia-deep) !important;
}

.brand__pact{
    color:var(--pp-fuchsia-deep) !important;
}

.footer__logo .brand__wordmark{
    font-size:clamp(20px, 2.1vw, 26px);
}

.drawer__brand .brand__wordmark{
    font-size:20px;
}

.vault-badge{
    border-color:rgba(196,84,135,.18);
    background:
            radial-gradient(circle at 26% 22%, rgba(255,255,255,.98) 0%, rgba(255,255,255,.82) 20%, rgba(255,255,255,0) 38%),
            linear-gradient(180deg, rgba(246,199,213,.42), rgba(251,241,244,.86));
    box-shadow:
            0 14px 28px rgba(196,84,135,.14),
            inset 0 1px 0 rgba(255,255,255,.88);
    overflow:visible;
}

.vault-badge svg{
    width:18px;
    height:18px;
    color:var(--pp-fuchsia-deep);
}

.vault-badge__dot{
    background:linear-gradient(180deg, var(--pp-pink), var(--pp-coral));
    box-shadow:0 0 0 3px rgba(255,255,255,.95), 0 8px 16px rgba(239,138,116,.24);
}

.vault-badge:hover{
    transform:translateY(-2px) scale(1.03);
    border-color:rgba(196,84,135,.28);
    box-shadow:
            0 18px 34px rgba(196,84,135,.18),
            inset 0 1px 0 rgba(255,255,255,.92);
}

.vault-badge:hover svg{
    transform:translateY(.5px) scale(1.04);
}

#vaultToggle:checked ~ header .vault-badge{
    border-color:rgba(196,84,135,.30);
    background:
            radial-gradient(circle at 24% 20%, rgba(255,255,255,.98) 0%, rgba(255,255,255,.84) 18%, rgba(255,255,255,0) 38%),
            linear-gradient(180deg, rgba(246,199,213,.54), rgba(253,240,244,.98));
    box-shadow:
            0 20px 38px rgba(196,84,135,.20),
            inset 0 1px 0 rgba(255,255,255,.94);
}

#vaultToggle:checked ~ header .vault-badge svg{
    color:var(--pp-fuchsia);
}

.drawer__quickLink--primary,
.drawer__link--primary{
    background:rgba(196,84,135,.10);
}

.cat-submenu__dot,
.dot{
    background:var(--pp-fuchsia);
}

.screen_img__title,
#bestsellers .section__title{
    color:var(--pp-fuchsia-deep);
}

.screen_img .btn--pink,
#bestsellers .btn--dark{
    background:linear-gradient(180deg, var(--pp-pink), var(--pp-coral));
    color:#fff;
    border:0;
    box-shadow:0 18px 38px rgba(239,138,116,.24);
}

#bestsellers .card__title,
#bestsellers .card__titleLink,
#bestsellers .card__price{
    color:var(--pp-fuchsia-deep);
}

#bestsellers .card__titleLink:hover{
    color:var(--pp-fuchsia);
}

.vault-icon{
    width:104px;
    height:104px;
    font-size:52px;
    line-height:1;
    background:radial-gradient(circle at center, #fff 0%, #fff3f7 52%, #ffffff 100%);
    border:2px solid rgba(196,84,135,.14);
    box-shadow:0 18px 34px rgba(196,84,135,.12);
}

.vault-title{
    color:var(--pp-fuchsia-deep);
}

.vault-sub{
    color:rgba(35,31,39,.58);
}

.vault-statCard__value{
    font-size: clamp(32px, 4vw, 38px);
}

.vault-statCard--coins .vault-statCard__value{
    color:var(--pp-fuchsia);
}

.vault-statCard--value .vault-statCard__value,
.vault-statCard__value--accent{
    color:var(--pp-blue) !important;
}

.vault-tierCard__circle{
    border:2px solid rgba(196,84,135,.10);
    box-shadow:0 12px 26px rgba(196,84,135,.08);
}

#vault-tier-pearl .vault-tierCard__circle{
    border-color:rgba(226,162,192,.48);
}

#vault-tier-amethyst .vault-tierCard__circle{
    border-color:rgba(181,159,222,.40);
}

#vault-tier-rose .vault-tierCard__circle{
    border-color:rgba(239,138,116,.44);
}

#vault-tier-diamond .vault-tierCard__circle{
    border-color:rgba(154,203,231,.44);
}

.vault-tierCard__name{
    color:var(--pp-coral);
    font-size:12px;
    font-weight:900;
}

.vault-tierCard__meta{
    color:rgba(35,31,39,.56);
}

.vault-metaCard{
    position:relative;
    overflow:hidden;
}

.vault-metaCard__ribbon{
    position:absolute;
    top:14px;
    right:14px;
    padding:7px 14px;
    border-radius:999px 999px 8px 999px;
    background:linear-gradient(180deg, var(--pp-coral), var(--pp-coral-deep));
    color:#fff;
    font-size:11px;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
    box-shadow:0 12px 24px rgba(239,138,116,.24);
}

.vault-metaCard__content{
    padding-top:18px;
}

.vault-metaCard__label,
.vault-metaCard__value{
    color:var(--pp-fuchsia);
}

.vault-progress__label{
    color:var(--pp-fuchsia);
    font-size:15px;
    font-weight:900;
}

.vault-progress__hint{
    font-size:14px;
}

.vault-progress__value{
    color:var(--pp-fuchsia);
    font-size:24px;
    font-weight:1000;
}

.vault-progress__fill,
.vault-tierCard__fill{
    background:linear-gradient(90deg, var(--pp-pink), var(--pp-fuchsia));
}

.contact-modal__badge{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:0;
    background:transparent;
    border:0;
    color:var(--pp-fuchsia-deep);
    font-size:13px;
    letter-spacing:.04em;
}

.contact-modal__badgeMark{
    width:40px;
    height:40px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:14px;
    background:linear-gradient(180deg, var(--pp-coral), var(--pp-coral-deep));
    color:#fff;
    font-weight:1000;
    box-shadow:0 14px 28px rgba(239,138,116,.22);
}

.contact-modal__badgeText{
    font-weight:900;
}

.contact-modal__badgeLogo{
    width:40px;
    height:40px;
    display:block;
    object-fit:contain;
}

.contact-modal__title{
    color:var(--pp-fuchsia-deep);
}

.contact-modal__sub{
    color:rgba(35,31,39,.60);
}

.contact-modal-form .field{
    gap:10px;
}

.contact-modal-form .field__label{
    color:var(--pp-fuchsia);
    font-size:13px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.contact-textarea{
    min-height:220px;
    padding-top:16px;
    border-color:rgba(196,84,135,.18);
}

.contact-textarea:focus{
    border-color:rgba(196,84,135,.34);
    box-shadow:0 0 0 4px rgba(196,84,135,.10);
}

.contact-modal-actions .btn.btn--dark{
    background:linear-gradient(180deg, var(--pp-coral), var(--pp-coral-deep));
    color:#fff;
    border:0;
    box-shadow:0 16px 30px rgba(239,138,116,.22);
}

.contact-modal-actions .btn:not(.btn--dark){
    background:rgba(255,255,255,.92);
    border:1px solid rgba(35,31,39,.08);
}

@media (max-width: 640px){
    .brand__mark{
        width:34px;
        height:auto;
        max-height:52px;
        flex-basis:auto;
    }

    .vault-icon{
        width:88px;
        height:88px;
        font-size:42px;
    }

    .vault-metaCard__ribbon{
        top:12px;
        right:12px;
    }
}

.vault-badge{
    width:44px;
    height:44px;
    border-radius:999px;
    border:1px solid rgba(217,31,107,.35);
    background: radial-gradient(circle at 30% 25%, #fff 0%, var(--pink-2) 60%, #fff 100%);
    display:grid;
    place-items:center;
    cursor:pointer;
    position:relative;
    box-shadow: 0 10px 24px rgba(217,31,107,.10);
    transition:none;
    transform:none;
    overflow:visible;
}

.vault-badge svg{
    width:20px;
    height:20px;
    color:#d91f6b;
    position:static;
    z-index:auto;
    transform:none;
    filter:none;
}

.vault-badge__dot{
    position:absolute;
    right:6px;
    top:6px;
    width:9px;
    height:9px;
    border-radius:50%;
    background:#d91f6b;
    box-shadow:0 0 0 3px rgba(217,31,107,.18);
}

.vault-badge:hover{
    transform:none;
    border-color:rgba(217,31,107,.35);
    box-shadow:0 10px 24px rgba(217,31,107,.10);
}

.vault-badge:hover svg{
    transform:none;
}

#vaultToggle:checked ~ header .vault-badge{
    border-color:rgba(217,31,107,.35);
    background: radial-gradient(circle at 30% 25%, #fff 0%, var(--pink-2) 60%, #fff 100%);
    box-shadow: 0 10px 24px rgba(217,31,107,.10);
}

#vaultToggle:checked ~ header .vault-badge svg{
    color:#d91f6b;
}

.vault-icon{
    width:clamp(58px, 16vw, 74px);
    height:clamp(58px, 16vw, 74px);
    display:grid;
    place-items:center;
    border-radius:50%;
    border:4px solid #fff;
    background: linear-gradient(180deg, #ffffff 0%, #fff6fa 100%);
    box-shadow: 0 16px 34px rgba(217,31,107,.14);
    font-size:clamp(24px, 7vw, 30px);
    line-height:normal;
    position:relative;
}

.vault-icon::after{
    content:"";
    position:absolute;
    inset:-7px;
    border-radius:50%;
    border:1px solid rgba(217,31,107,.18);
}

.vault-title{
    margin:0;
    font-size:clamp(26px, 7.2vw, 42px);
    line-height:.95;
    letter-spacing:-.05em;
    color:initial;
    background: linear-gradient(180deg, #b61663 0%, #ee5a9f 56%, #ff9ec8 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.vault-sub{
    margin:0;
    color: rgba(0,0,0,.52);
    font-size:clamp(11px, 2.8vw, 13px);
    line-height:1.55;
    text-transform:uppercase;
    letter-spacing:clamp(.08em, .45vw, .15em);
    font-weight:900;
}

.vault-guest{
    display:grid;
    gap:16px;
}

.vault-guest .muted{
    padding:0 12px;
    color: rgba(0,0,0,.64);
    line-height:1.7;
}

.vault-shell{
    display:grid;
    gap:clamp(14px, 2.8vw, 18px);
}

.vault-stats--grid{
    display:grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:0;
    position:relative;
    border-radius:clamp(18px, 4.4vw, 24px);
    background:#fff;
    border:1px solid rgba(255,255,255,.96);
    box-shadow: 0 18px 36px rgba(17,17,17,.06);
    overflow:hidden;
}

.vault-stats--grid::after{
    content:"";
    position:absolute;
    left:50%;
    top:18px;
    bottom:18px;
    width:1px;
    background: linear-gradient(180deg, transparent, rgba(0,0,0,.12), transparent);
}

.vault-stats--grid .vault-statCard{
    padding:clamp(14px, 2.8vw, 18px);
    border:none;
    background:transparent;
    box-shadow:none;
    text-align:center;
}

.vault-statCard__label,
.vault-metaCard__label,
.vault-progress__label{
    font-size:11px;
    font-weight:900;
    letter-spacing:.16em;
    color: rgba(0,0,0,.44);
    text-transform:uppercase;
}

.vault-statCard__value{
    margin-top:12px;
    display:flex;
    align-items:baseline;
    justify-content:center;
    gap:6px;
    font-size:clamp(24px, 7vw, 36px);
    font-weight:1000;
    color: var(--ink);
    line-height:1;
}

.vault-statCard--coins .vault-statCard__value{
    color: var(--ink);
}

.vault-statCard__value span:last-child{
    font-size:clamp(12px, 3vw, 14px);
    font-weight:900;
    color: rgba(0,0,0,.55);
}

.vault-statCard--value .vault-statCard__value,
.vault-statCard__value--accent{
    color:#059669 !important;
}

.vault-tierCard{
    position:relative;
    --vault-tier-circle-size: clamp(46px, 14vw, 58px);
    --vault-tier-rail-height: clamp(8px, 2.2vw, 12px);
    --vault-tier-rail-inset: clamp(18px, 6vw, 52px);
    padding:4px clamp(0px, 2vw, 10px) 0;
}

.vault-tierCard__rail,
.vault-tierCard__fill{
    position:absolute;
    left:var(--vault-tier-rail-inset);
    right:auto;
    width:calc(100% - (var(--vault-tier-rail-inset) * 2));
    top:calc((var(--vault-tier-circle-size) / 2) - (var(--vault-tier-rail-height) / 2));
    height:var(--vault-tier-rail-height);
    border-radius:999px;
}

.vault-tierCard__rail{
    background: linear-gradient(90deg, rgba(223, 56, 128, .10), rgba(255,255,255,.92) 50%, rgba(223, 56, 128, .10));
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.72);
}

.vault-tierCard__fill{
    width:0;
    background: linear-gradient(90deg, #ff95c3 0%, #ff5c9d 52%, #cb5df5 100%);
    box-shadow: 0 8px 20px rgba(217,31,107,.18);
}

.vault-tierCard__steps{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap:clamp(4px, 1.4vw, 8px);
}

.vault-tierCard__step{
    text-align:center;
    opacity:.56;
    transition: transform .28s ease, opacity .28s ease;
}

.vault-tierCard__circle{
    width:var(--vault-tier-circle-size);
    height:var(--vault-tier-circle-size);
    margin:0 auto clamp(6px, 1.8vw, 8px);
    display:grid;
    place-items:center;
    border-radius:50%;
    border:clamp(3px, 1vw, 5px) solid #e7e2e8;
    background: linear-gradient(180deg, #ffffff 0%, #fff4f9 100%);
    box-shadow: 0 10px 22px rgba(17,17,17,.10);
    overflow:hidden;
}

.vault-tierCard__gem{
    display:block;
    width:clamp(30px, 9vw, 40px);
    height:clamp(30px, 9vw, 40px);
    object-fit:contain;
    opacity:.46;
    filter: saturate(.72) contrast(.9) brightness(.98) drop-shadow(0 2px 4px rgba(144, 85, 138, .10));
    transform: scale(.92) translateZ(0);
    transition: opacity .22s ease, filter .22s ease, transform .22s ease;
}

.vault-tierCard__gem--pearl{
    width:clamp(28px, 8vw, 36px);
    height:clamp(28px, 8vw, 36px);
    filter: saturate(.72) contrast(1.02) brightness(.98) drop-shadow(0 2px 4px rgba(197, 177, 191, .12));
}

.vault-tierCard__gem--amethyst,
.vault-tierCard__gem--rose{
    width:clamp(32px, 9.4vw, 42px);
    height:clamp(32px, 9.4vw, 42px);
}

.vault-tierCard__gem--diamond{
    width:clamp(34px, 10vw, 44px);
    height:clamp(34px, 10vw, 44px);
    filter: saturate(.72) contrast(.94) brightness(.98) drop-shadow(0 2px 4px rgba(119, 154, 190, .10));
}

.vault-tierCard__name{
    font-size:clamp(10px, 2.8vw, 12px);
    font-weight:900;
    line-height:1.15;
    letter-spacing:.05em;
    text-transform:uppercase;
    color:#8f7f89;
}

.vault-tierCard__meta{
    margin-top:4px;
    display:inline-block;
    padding:2px clamp(5px, 1.6vw, 8px);
    border-radius:999px;
    background:#fff;
    border:1px solid rgba(0,0,0,.06);
    color:#b09aa5;
    font-size:clamp(10px, 2.4vw, 11px);
    font-weight:800;
}

.vault-tierCard__step.is-earned,
.vault-tierCard__step.is-current{
    opacity:1;
}

.vault-tierCard__step.is-earned .vault-tierCard__gem{
    opacity:.88;
    filter: saturate(1.04) contrast(1.06) brightness(1.02) drop-shadow(0 4px 8px rgba(183, 71, 132, .14));
    transform: scale(.98) translateZ(0);
}

.vault-tierCard__step.is-current .vault-tierCard__gem{
    opacity:1;
    filter: saturate(1.26) contrast(1.18) brightness(1.04) drop-shadow(0 6px 12px rgba(183, 46, 116, .22));
    transform: scale(1.05) translateY(-1px) translateZ(0);
}

.vault-tierCard__step.is-current .vault-tierCard__gem--pearl{
    filter: contrast(1.24) brightness(1.08) drop-shadow(0 6px 12px rgba(194, 148, 178, .26));
}

.vault-tierCard__step.is-current .vault-tierCard__gem--diamond{
    filter: saturate(1.16) contrast(1.14) brightness(1.05) drop-shadow(0 6px 12px rgba(104, 160, 220, .20));
}

.vault-tierCard__step.is-earned .vault-tierCard__circle{
    border-color:#f3b2cf;
    background: radial-gradient(circle at 30% 30%, #fff, #ffe4f0);
    color:#c22f75;
}

.vault-tierCard__step.is-current{
    transform:none;
}

.vault-tierCard__step.is-current .vault-tierCard__circle{
    border-color:#d91f6b;
    background: radial-gradient(circle at 30% 30%, #fff, #ffd4e7);
    color:#9f1551;
    box-shadow: 0 16px 30px rgba(217,31,107,.24);
}

.vault-metaCard,
.vault-progressCard{
    border-radius:22px;
    border:1px solid rgba(255,255,255,.96);
    box-shadow: 0 16px 34px rgba(17,17,17,.06);
}

.vault-metaCard{
    position:static;
    overflow:visible;
    padding:clamp(12px, 3vw, 16px);
    display:grid;
    grid-template-columns:1fr;
    align-items:center;
    gap:0;
    border:2px dashed rgba(244,160,196,.72);
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,244,248,.96));
}

.vault-metaCard__content{
    min-width:0;
    padding-top:0;
}

.vault-metaCard__row{
    display:grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:clamp(10px, 2vw, 12px);
}

.vault-metaCard__item{
    padding:clamp(10px, 2.8vw, 14px);
    border-radius:18px;
    background: rgba(255,255,255,.82);
    border:1px solid rgba(0,0,0,.06);
}

.vault-metaCard__label{
    color: rgba(0,0,0,.44);
}

.vault-metaCard__value{
    margin-top:8px;
    font-size:clamp(20px, 5.8vw, 22px);
    font-weight:1000;
    color: var(--ink);
}

.vault-progressCard{
    position:relative;
    overflow:hidden;
    margin:clamp(2px, .8vw, 4px) 0 clamp(6px, 1.4vw, 8px);
    padding:clamp(6px, 1.8vw, 8px) clamp(10px, 3vw, 12px) clamp(8px, 2vw, 10px);
    border:1px solid rgba(255,255,255,.98);
    background: linear-gradient(160deg, rgba(255,255,255,.99), rgba(255,248,251,.98) 54%, rgba(255,241,247,.96) 100%);
    box-shadow:
            0 16px 32px rgba(31,22,37,.06),
            inset 0 1px 0 rgba(255,255,255,.92);
}

.vault-progressCard::before{
    content:"";
    position:absolute;
    inset:0;
    background:
            radial-gradient(circle at 14% 18%, rgba(255,229,240,.52), transparent 26%),
            radial-gradient(circle at 86% 18%, rgba(255,192,221,.24), transparent 24%),
            linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,0));
    pointer-events:none;
}

.vault-progress__top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.vault-progress__top > div:first-child{
    display:grid;
    gap:2px;
    min-width:0;
}

.vault-progress__label{
    color: rgba(35,31,39,.62);
}

.vault-progress__value{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:clamp(58px, 16vw, 66px);
    padding:clamp(5px, 1.6vw, 6px) clamp(8px, 2vw, 10px) clamp(6px, 1.8vw, 7px);
    border-radius:13px;
    border:1px solid rgba(217,31,107,.12);
    background: rgba(255,255,255,.96);
    box-shadow:
            inset 0 1px 0 rgba(255,255,255,.96),
            0 8px 18px rgba(217,31,107,.06);
    font-size:clamp(21px, 2.7vw, 26px);
    font-weight:1000;
    color: var(--ink);
    line-height:1;
    letter-spacing:-.04em;
    transition: transform .2s ease, box-shadow .2s ease;
}

.vault-progress__hint{
    margin-top:0;
    color: rgba(35,31,39,.76);
    font-size:clamp(11px, 2.8vw, 12px);
    line-height:1.35;
}

.vault-progress__bar{
    position:relative;
    margin-top:6px;
    height:clamp(10px, 4.6vw, 28px);
    padding:2px;
    border-radius:999px;
    border:1px solid rgba(217,31,107,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(236,228,235,.96));
    overflow:hidden;
    box-shadow:
            inset 0 1px 2px rgba(255,255,255,.96),
            inset 0 -3px 8px rgba(58,36,49,.06),
            0 6px 14px rgba(217,31,107,.04);
}

.vault-progress__bar::before{
    content:"";
    position:absolute;
    inset:2px;
    border-radius:999px;
    background:
            linear-gradient(180deg, rgba(255,255,255,.46), rgba(255,255,255,0) 44%),
            linear-gradient(90deg, rgba(255,255,255,.12), rgba(234,227,233,.03) 32%, rgba(255,255,255,.12) 100%);
    pointer-events:none;
}

.vault-progress__fill{
    position:relative;
    height:100%;
    border-radius:999px;
    background:
            linear-gradient(180deg, rgba(255,255,255,.26), rgba(255,255,255,0) 48%),
            linear-gradient(90deg, #ffc3de 0%, #ff8abd 32%, #ff5d9c 66%, #d96dff 100%);
    box-shadow:
            inset 0 1px 2px rgba(255,255,255,.38),
            0 8px 18px rgba(217,31,107,.20),
            0 0 16px rgba(236,116,189,.14);
    transition:
            width 920ms cubic-bezier(.22, 1, .36, 1),
            filter .24s ease,
            box-shadow .24s ease,
            transform .24s ease;
    will-change: width;
    overflow:hidden;
    animation: vaultProgressPulse 3.8s ease-in-out infinite;
}

.vault-progress__fill::before{
    content:none;
}

.vault-progress__fill::after{
    content:"";
    position:absolute;
    inset:0;
    background: linear-gradient(90deg, transparent 0%, rgba(255,214,232,.06) 28%, rgba(255,255,255,.28) 50%, rgba(255,207,228,.08) 72%, transparent 100%);
    transform:translateX(-100%);
    animation: vaultProgressSheen 2.8s ease-in-out infinite;
    pointer-events:none;
}

.vault-progressCard:hover .vault-progress__value{
    transform: translateY(-1px);
    box-shadow:
            inset 0 1px 0 rgba(255,255,255,.94),
            0 12px 24px rgba(217,31,107,.10);
}

.vault-progressCard:hover .vault-progress__fill{
    filter: saturate(1.08) brightness(1.03);
    box-shadow:
            inset 0 1px 2px rgba(255,255,255,.38),
            0 10px 22px rgba(217,31,107,.24),
            0 0 20px rgba(236,116,189,.18);
}

.vault-closeBtn{
    margin-top:8px;
}

@media (max-width: 640px){
    .vault-icon{
        width:clamp(56px, 18vw, 64px);
        height:clamp(56px, 18vw, 64px);
        font-size:clamp(24px, 7vw, 26px);
    }

    .vault-title{
        font-size:clamp(24px, 8vw, 28px);
    }

    .vault-stats--grid,
    .vault-metaCard__row{
        grid-template-columns:1fr;
    }

    .vault-stats--grid::after{
        display:none;
    }

    .vault-statCard__value,
    .vault-progress__value{
        font-size:clamp(24px, 8vw, 28px);
    }

    .vault-progress__top{
        align-items:flex-start;
    }

    .vault-progress__value{
        min-width:clamp(54px, 16vw, 58px);
        padding:6px 9px 7px;
        border-radius:12px;
    }

    .vault-progressCard{
        margin:2px 0 6px;
        padding:5px 10px 7px;
    }

    .vault-progress__bar{
        margin-top:6px;
        height:10px;
    }

    .vault-tierCard{
        padding-inline:0;
        --vault-tier-circle-size: clamp(48px, 16vw, 54px);
        --vault-tier-rail-inset: clamp(18px, 6vw, 26px);
    }

    .vault-tierCard__rail,
    .vault-tierCard__fill{
        left:var(--vault-tier-rail-inset);
        right:auto;
        width:calc(100% - (var(--vault-tier-rail-inset) * 2));
    }

    .vault-tierCard__fill{
        width:0;
    }

    .vault-tierCard__steps{
        gap:clamp(4px, 2vw, 6px);
    }

    .vault-tierCard__circle{
        margin-bottom:8px;
    }

    .vault-tierCard__gem{
        width:clamp(32px, 11vw, 38px);
        height:clamp(32px, 11vw, 38px);
    }

    .vault-tierCard__gem--pearl{
        width:clamp(28px, 10vw, 34px);
        height:clamp(28px, 10vw, 34px);
    }

    .vault-tierCard__gem--diamond{
        width:clamp(34px, 12vw, 40px);
        height:clamp(34px, 12vw, 40px);
    }

    .vault-tierCard__name{
        font-size:10px;
    }

    .vault-tierCard__meta{
        padding:2px 6px;
        font-size:10px;
    }

    .vault-metaCard{
        grid-template-columns:1fr;
        text-align:center;
    }
}

.vault-badge{
    border-color:rgba(196,84,135,.20);
    background:
            radial-gradient(circle at 28% 24%, rgba(255,255,255,.98) 0%, rgba(255,255,255,.84) 18%, rgba(255,255,255,0) 36%),
            linear-gradient(180deg, rgba(246,199,213,.44), rgba(251,241,244,.92));
    box-shadow:
            0 14px 30px rgba(196,84,135,.14),
            inset 0 1px 0 rgba(255,255,255,.90);
    transition: box-shadow .2s ease, border-color .2s ease;
}

.vault-badge__logo{
    width:22px;
    height:auto;
    max-height:32px;
    object-fit:contain;
    display:block;
    position:relative;
    z-index:1;
    background:transparent;
    filter:none;
}

.vault-badge__dot{
    right:5px;
    top:5px;
    width:10px;
    height:10px;
    background:linear-gradient(180deg, var(--pp-pink), var(--pp-coral));
    box-shadow:0 0 0 3px rgba(255,255,255,.96), 0 8px 16px rgba(239,138,116,.24);
}

.vault-badge:hover{
    transform:none;
    border-color:rgba(196,84,135,.28);
    box-shadow:
            0 18px 36px rgba(196,84,135,.18),
            inset 0 1px 0 rgba(255,255,255,.94);
}

#vaultToggle:checked ~ header .vault-badge{
    border-color:rgba(196,84,135,.30);
    box-shadow:
            0 18px 36px rgba(196,84,135,.18),
            inset 0 1px 0 rgba(255,255,255,.94);
}

.vault-head{
    gap:12px;
    padding-bottom:22px;
}

.vault-icon{
    width:104px;
    height:104px;
    font-size:52px;
    line-height:1;
    background:radial-gradient(circle at center, #fff 0%, #fff3f7 52%, #ffffff 100%);
    border:2px solid rgba(196,84,135,.14);
    box-shadow:0 18px 34px rgba(196,84,135,.12);
}

.vault-icon::after{
    inset:-8px;
    border-color:rgba(196,84,135,.16);
}

#vaultModal[data-vault-level="pearl"] .vault-icon{
    border-color:rgba(226,162,192,.42);
    box-shadow:0 18px 34px rgba(226,162,192,.18);
}

#vaultModal[data-vault-level="amethyst"] .vault-icon{
    border-color:rgba(181,159,222,.42);
    box-shadow:0 18px 34px rgba(181,159,222,.18);
}

#vaultModal[data-vault-level="rose_quartz"] .vault-icon{
    border-color:rgba(239,138,116,.44);
    box-shadow:0 18px 34px rgba(239,138,116,.20);
}

#vaultModal[data-vault-level="diamond"] .vault-icon{
    border-color:rgba(154,203,231,.46);
    box-shadow:0 18px 34px rgba(154,203,231,.18);
}

.vault-title{
    color:var(--pp-fuchsia-deep);
}

.vault-sub{
    color:rgba(35,31,39,.58);
}

.vault-stats--grid{
    border-radius:24px;
}

.vault-statCard__value{
    font-size:clamp(32px, 4vw, 38px);
}

.vault-statCard--coins .vault-statCard__label,
.vault-statCard--coins .vault-statCard__value{
    color:var(--pp-fuchsia);
}

.vault-statCard--value .vault-statCard__label,
.vault-statCard--value .vault-statCard__value,
.vault-statCard__value--accent{
    color:var(--pp-blue) !important;
}

.vault-tierCard{
    padding-top:2px;
}

.vault-tierCard__fill{
    background:linear-gradient(90deg, var(--pp-pink), var(--pp-fuchsia));
    box-shadow:0 8px 20px rgba(196,84,135,.18);
}

.vault-tierCard__step{
    --vault-tier-ring: rgba(196,84,135,.18);
    --vault-tier-emoji: var(--pp-fuchsia);
    --vault-tier-bg: rgba(255,255,255,.98);
}

#vault-tier-pearl{
    --vault-tier-ring: rgba(226,162,192,.55);
    --vault-tier-emoji: #de9fbe;
    --vault-tier-bg: rgba(255,248,251,.98);
}

#vault-tier-amethyst{
    --vault-tier-ring: rgba(181,159,222,.52);
    --vault-tier-emoji: #a78ed6;
    --vault-tier-bg: rgba(249,246,255,.98);
}

#vault-tier-rose{
    --vault-tier-ring: rgba(239,138,116,.58);
    --vault-tier-emoji: #d47c9c;
    --vault-tier-bg: rgba(255,246,249,.98);
}

#vault-tier-diamond{
    --vault-tier-ring: rgba(154,203,231,.58);
    --vault-tier-emoji: #74b8df;
    --vault-tier-bg: rgba(246,252,255,.98);
}

.vault-tierCard__circle{
    border:3px solid var(--vault-tier-ring);
    background:var(--vault-tier-bg);
    box-shadow:0 12px 26px rgba(196,84,135,.08);
}

.vault-tierCard__gem{
    display:block;
    width:clamp(30px, 9vw, 40px);
    height:clamp(30px, 9vw, 40px);
    object-fit:contain;
    opacity:1;
    filter:drop-shadow(0 3px 8px rgba(17,17,17,.08));
    transform:scale(.98) translateZ(0);
    transition:transform .22s ease, filter .22s ease, opacity .22s ease;
}

.vault-tierCard__gem--pearl{
    width:clamp(28px, 8vw, 36px);
    height:clamp(28px, 8vw, 36px);
}

.vault-tierCard__gem--amethyst,
.vault-tierCard__gem--rose{
    width:clamp(32px, 9.4vw, 42px);
    height:clamp(32px, 9.4vw, 42px);
}

.vault-tierCard__gem--diamond{
    width:clamp(34px, 10vw, 44px);
    height:clamp(34px, 10vw, 44px);
}

.vault-tierCard__name{
    color:var(--pp-coral);
    font-size:12px;
    font-weight:900;
}

.vault-tierCard__meta{
    color:rgba(35,31,39,.56);
}

.vault-tierCard__step.is-current .vault-tierCard__circle{
    border-color:var(--vault-tier-ring);
    box-shadow:0 16px 30px rgba(196,84,135,.16);
}

.vault-tierCard__step.is-current .vault-tierCard__gem{
    transform:scale(1.1) translateY(-1px);
    filter:drop-shadow(0 6px 12px rgba(17,17,17,.12));
}

.vault-tierCard__step.is-earned .vault-tierCard__gem{
    opacity:.92;
}

.vault-metaCard{
    position:relative;
    overflow:hidden;
}

.vault-metaCard__ribbon{
    position:absolute;
    top:14px;
    right:14px;
    padding:7px 14px;
    border-radius:999px 999px 8px 999px;
    background:linear-gradient(180deg, var(--pp-coral), var(--pp-coral-deep));
    color:#fff;
    font-size:11px;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
    box-shadow:0 12px 24px rgba(239,138,116,.24);
}

.vault-metaCard__content{
    padding-top:18px;
}

.vault-metaCard__label,
.vault-metaCard__value{
    color:var(--pp-fuchsia);
}

.vault-progress__label{
    color:var(--pp-fuchsia);
    font-size:15px;
    font-weight:900;
}

.vault-progress__hint{
    font-size:14px;
}

.vault-progress__value{
    color:var(--pp-fuchsia);
    font-size:24px;
    font-weight:1000;
}

.vault-progress__fill{
    background:
            linear-gradient(180deg, rgba(255,255,255,.26), rgba(255,255,255,0) 48%),
            linear-gradient(90deg, var(--pp-pink) 0%, #ff8abd 32%, #ff5d9c 66%, var(--pp-fuchsia) 100%);
}

@media (max-width: 640px){
    .vault-badge__logo{
        width:20px;
        height:auto;
        max-height:30px;
    }

    .vault-icon{
        width:88px;
        height:88px;
        font-size:42px;
    }

    .vault-metaCard__ribbon{
        top:12px;
        right:12px;
    }

    .vault-tierCard__gem{
        width:clamp(32px, 11vw, 38px);
        height:clamp(32px, 11vw, 38px);
    }

    .vault-tierCard__gem--pearl{
        width:clamp(28px, 10vw, 34px);
        height:clamp(28px, 10vw, 34px);
    }

    .vault-tierCard__gem--diamond{
        width:clamp(34px, 12vw, 40px);
        height:clamp(34px, 12vw, 40px);
    }
}

.vault-icon{
    position:relative;
    overflow:visible;
    isolation:isolate;
}

.vault-icon__image{
    width:clamp(46px, 12vw, 56px);
    height:clamp(46px, 12vw, 56px);
    object-fit:contain;
    filter:none;
    transform:translateZ(0);
    transition:transform .28s ease, filter .28s ease;
}

#vaultModal[data-vault-level="pearl"] .vault-icon__image{
    width:clamp(42px, 11vw, 50px);
    height:clamp(42px, 11vw, 50px);
}

#vaultModal[data-vault-level="amethyst"] .vault-icon__image,
#vaultModal[data-vault-level="rose_quartz"] .vault-icon__image{
    width:clamp(46px, 12vw, 56px);
    height:clamp(46px, 12vw, 56px);
}

#vaultModal[data-vault-level="diamond"] .vault-icon__image{
    width:clamp(50px, 13vw, 60px);
    height:clamp(50px, 13vw, 60px);
}

#vaultModal[data-vault-level="pearl"] .vault-icon{
    background:radial-gradient(circle at center, #fff 0%, #fff4f9 54%, #ffffff 100%);
}

#vaultModal[data-vault-level="amethyst"] .vault-icon{
    background:radial-gradient(circle at center, #fff 0%, #f8f4ff 54%, #ffffff 100%);
}

#vaultModal[data-vault-level="rose_quartz"] .vault-icon{
    background:radial-gradient(circle at center, #fff 0%, #fff0f5 54%, #ffffff 100%);
}

#vaultModal[data-vault-level="diamond"] .vault-icon{
    background:radial-gradient(circle at center, #fff 0%, #f2faff 54%, #ffffff 100%);
}

.vault-tierCard__step{
    --vault-level-ring:#d91f6b;
    --vault-level-glow:rgba(217,31,107,.28);
    --vault-level-surface:#ffdbe9;
}

#vault-tier-pearl{
    --vault-level-ring:#e6a2c0;
    --vault-level-glow:rgba(230,162,192,.36);
    --vault-level-surface:#fff0f7;
}

#vault-tier-amethyst{
    --vault-level-ring:#b59fde;
    --vault-level-glow:rgba(181,159,222,.34);
    --vault-level-surface:#f4edff;
}

#vault-tier-rose{
    --vault-level-ring:#ef7fb1;
    --vault-level-glow:rgba(239,127,177,.34);
    --vault-level-surface:#fff0f7;
}

#vault-tier-diamond{
    --vault-level-ring:#9acbe7;
    --vault-level-glow:rgba(154,203,231,.36);
    --vault-level-surface:#eff9ff;
}

.vault-tierCard__circle{
    position:relative;
    overflow:visible;
}

.vault-tierCard__circle::before{
    content:"";
    position:absolute;
    inset:-8px;
    border-radius:50%;
    opacity:0;
    transform:scale(.9);
    pointer-events:none;
    transition:opacity .28s ease, transform .28s ease;
}

.vault-tierCard__step.is-current{
    opacity:1;
}

.vault-tierCard__step.is-current .vault-tierCard__circle{
    border-color:var(--vault-level-ring);
    background:radial-gradient(circle at 30% 30%, #ffffff 0%, var(--vault-level-surface) 76%);
    box-shadow:
            0 0 0 4px rgba(255,255,255,.96),
            0 18px 36px rgba(17,17,17,.08),
            0 0 26px var(--vault-level-glow);
    animation:vault-tier-current-pulse 2.2s ease-in-out infinite;
}

.vault-tierCard__step.is-current .vault-tierCard__circle::before{
    opacity:1;
    transform:scale(1);
    box-shadow:
            0 0 0 8px var(--vault-level-glow),
            0 0 28px 4px var(--vault-level-glow);
}

.vault-tierCard__step.is-current .vault-tierCard__gem{
    transform:scale(1.12) translateY(-2px) translateZ(0);
    filter:drop-shadow(0 8px 16px var(--vault-level-glow));
    animation:vault-tier-gem-float 2.2s ease-in-out infinite;
}

.vault-tierCard__step.is-current .vault-tierCard__name,
.vault-tierCard__step.is-current .vault-tierCard__meta{
    color:var(--pp-fuchsia-deep);
}

@keyframes vault-tier-current-pulse{
    0%, 100%{
        transform:translateY(0) scale(1);
        box-shadow:
                0 0 0 4px rgba(255,255,255,.96),
                0 18px 36px rgba(17,17,17,.08),
                0 0 18px var(--vault-level-glow);
    }
    50%{
        transform:translateY(-1px) scale(1.035);
        box-shadow:
                0 0 0 5px rgba(255,255,255,.96),
                0 22px 42px rgba(17,17,17,.10),
                0 0 30px var(--vault-level-glow);
    }
}

@keyframes vault-tier-gem-float{
    0%, 100%{
        transform:scale(1.1) translateY(-1px) translateZ(0);
    }
    50%{
        transform:scale(1.15) translateY(-4px) translateZ(0);
    }
}

@media (max-width: 640px){
    .vault-icon__image{
        width:clamp(42px, 13vw, 50px);
        height:clamp(42px, 13vw, 50px);
    }

    #vaultModal[data-vault-level="diamond"] .vault-icon__image{
        width:clamp(46px, 14vw, 54px);
        height:clamp(46px, 14vw, 54px);
    }

    .vault-tierCard__step.is-current .vault-tierCard__circle::before{
        inset:-6px;
    }
}

body{
    background:linear-gradient(180deg, #fffafc 0%, #fff0f6 38%, #ffffff 100%);
}

.btn--pink,
.btn--dark,
.btn--soft,
.cat-modal-actions .btn,
.contact-modal-actions .btn,
.drawer__quickLink--primary{
    background:linear-gradient(180deg, var(--pp-pink), var(--pp-coral)) !important;
    color:#fff !important;
    border:0 !important;
    box-shadow:0 16px 32px rgba(239,138,116,.20) !important;
}

.btn--pink:hover,
.btn--dark:hover,
.btn--soft:hover,
.cat-modal-actions .btn:hover,
.contact-modal-actions .btn:hover,
.drawer__quickLink--primary:hover{
    filter:brightness(1.03);
}

.screen_img__content{
    display:grid;
    gap:16px;
}

.screen_img__title{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:baseline;
    gap:0 .22em;
    font-size:clamp(40px, 5vw, 68px);
    line-height:.9;
    letter-spacing:-.06em;
    text-transform:uppercase;
}

.screen_img__titleWord{
    display:inline-block;
}

.screen_img__titleWord--pink{
    color:#ff4f9a;
}

.screen_img__titleWord--coral{
    color:#f08f8b;
}

.screen_img__subtitle{
    margin:0 auto 10px;
    max-width:560px;
    font-size:clamp(15px, 1.55vw, 19px);
    line-height:1.55;
    color:rgba(196,84,135,.88);
}

#bestsellers{
    margin-top:clamp(-42px, -4vw, -24px);
    padding-top:clamp(78px, 10vw, 102px);
    border-radius:clamp(34px, 5vw, 56px) clamp(34px, 5vw, 56px) 0 0;
    background:
            linear-gradient(180deg, rgba(255,255,255,.97), #ffffff 32%),
            radial-gradient(circle at top center, rgba(255,214,229,.55), rgba(255,214,229,0) 38%);
    box-shadow:0 -24px 54px rgba(255,255,255,.52);
}

#bestsellers::before{
    top:18px;
    height:2px;
}

#bestsellers .section__head{
    text-align:center;
}

#bestsellers .section__title{
    font-size:clamp(30px, 3vw, 48px);
}

#bestsellers .badge{
    display:none;
}

#bestsellers .card__title{
    font-family:"Palatino Linotype", "Book Antiqua", Georgia, serif;
    font-size:clamp(23px, 2.25vw, 30px);
    line-height:1.02;
    letter-spacing:-.03em;
}

#bestsellers .card__titleLink{
    font-family:inherit;
    color:#bf4a84;
}

#bestsellers .card__price{
    color:#64abd9;
}

.vault-head{
    gap:10px;
    padding-bottom:16px;
}

.vault-icon{
    width:88px;
    height:88px;
    box-shadow:0 14px 28px rgba(196,84,135,.10);
}

#vaultModal[data-vault-level="diamond"] .vault-icon{
    background:radial-gradient(circle at center, #ffffff 0%, #eff9ff 58%, #f7fdff 100%);
    border-color:rgba(92,173,219,.68);
    box-shadow:0 18px 34px rgba(92,173,219,.24);
}

.vault-title{
    font-size:clamp(28px, 4vw, 34px);
    line-height:1.02;
}

.vault-sub{
    max-width:40ch;
    font-size:14px;
}

#vault-tier-diamond{
    --vault-tier-ring:#5eb7e4;
    --vault-tier-emoji:#45a8dd;
    --vault-tier-bg:rgba(241,251,255,.99);
    --vault-level-ring:#5eb7e4;
    --vault-level-glow:rgba(94,183,228,.42);
    --vault-level-surface:#eefaff;
}

.vault-progress__label{
    font-size:17px;
}

.vault-progress__hint{
    font-size:16px;
    font-weight:800;
    color:rgba(196,84,135,.82);
}

.vault-progress__value{
    font-size:30px;
}

@media (max-width: 720px){
    .screen_img__content{
        gap:12px;
    }

    .screen_img__title{
        font-size:clamp(34px, 10vw, 48px);
    }

    .screen_img__subtitle{
        max-width:34ch;
        font-size:15px;
    }

    #bestsellers{
        margin-top:-24px;
        padding-top:64px;
    }
}

@media (max-width: 640px){
    .vault-head{
        padding-bottom:14px;
    }

    .vault-icon{
        width:78px;
        height:78px;
    }

    .vault-progress__label{
        font-size:15px;
    }

    .vault-progress__hint{
        font-size:14px;
    }

    .vault-progress__value{
        font-size:26px;
    }
}

body:has(#bestsellers){
    background:linear-gradient(135deg, #ffd6e5 0%, #ffedf4 50%, #ffd6e5 100%) fixed;
    background-size:cover;
}

.screen_img{
    background:transparent;
}

.screen_img__bg{
    display:none;
}

.screen_img__overlay{
    display:grid;
    place-items:center;
    width:100%;
    max-width:none;
    margin:0;
    padding:clamp(88px, 11vw, 124px) clamp(18px, 4vw, 40px) clamp(52px, 7vw, 72px);
}

.screen_img__content{
    display:grid;
    gap:14px;
    width:min(760px, 100%);
    max-width:100%;
    margin:0 auto;
    justify-items:center;
    text-align:center;
}

.screen_img__title{
    display:block;
    margin:0 auto;
    width:min(100%, 16ch);
    max-width:100%;
    font-size:clamp(24px, 4vw, 62px);
    line-height:1;
    letter-spacing:-.04em;
    text-transform:none;
    white-space:normal;
    justify-self:center;
    text-align:center;
    transform:none;
    text-shadow:0 18px 42px rgba(255,255,255,.28);
}

.screen_img__title br{
    display:block;
}

.screen_img__subtitle{
    display:block;
    margin:0 auto;
    max-width:min(560px, 100%);
    font-size:clamp(15px, 1.7vw, 20px);
    line-height:1.55;
    color:rgba(196,84,135,.88);
    text-align:center;
}

.topbar .icon-btn,
.topbar .vault-badge{
    background:transparent;
    border-color:transparent;
    box-shadow:none;
}

.topbar .icon-btn:hover,
.topbar .icon-btn:focus-visible,
.topbar .icon-btn:active,
.topbar .vault-badge:hover,
.topbar .vault-badge:focus-visible,
#vaultToggle:checked ~ header .vault-badge{
    background:transparent;
    border-color:transparent;
    box-shadow:none;
    filter:none;
}

.topbar .vault-badge__dot{
    box-shadow:none;
}

header.topbar{
    transition:transform .22s ease, opacity .22s ease, visibility .22s ease;
}

#vaultToggle:checked ~ header.topbar{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(calc(-100% - 12px));
}

#contactModalToggle:checked ~ header.topbar{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(calc(-100% - 12px));
}

body:has(#profileToggle:checked) header.topbar,
body:has(#vaultToggle:checked) header.topbar,
body:has(#loungeInfoToggle:checked) header.topbar,
body:has(#catModalToggle:checked) header.topbar,
body:has(#contactModalToggle:checked) header.topbar{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(calc(-100% - 12px));
}

.backToTop{
    position:fixed;
    right:clamp(16px, 2.5vw, 28px);
    bottom:calc(10px + env(safe-area-inset-bottom, 0px));
    z-index:1210;
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    border:1px solid rgba(226, 109, 161, .42);
    border-radius:999px;
    color:#c7448a;
    background:rgba(255, 255, 255, .92);
    box-shadow:0 18px 38px rgba(162, 53, 112, .18);
    cursor:pointer;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(12px) scale(.96);
    transition:opacity .18s ease, visibility .18s ease, transform .18s ease, background .18s ease, color .18s ease;
    -webkit-backdrop-filter:blur(14px);
    backdrop-filter:blur(14px);
}

.layout:has(#bestsellers) ~ .backToTop,
.layout:has(.pd) ~ .backToTop,
.layout:has(.cart-page) ~ .backToTop{
    bottom:calc(92px + env(safe-area-inset-bottom, 0px));
}

.backToTop svg{
    width:22px;
    height:22px;
}

.backToTop.is-visible{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0) scale(1);
}

.backToTop:hover,
.backToTop:focus-visible{
    color:#fff;
    background:linear-gradient(135deg, #ed8bb9, #f2786e);
    border-color:transparent;
    outline:none;
}

body:has(#navToggle:checked) .backToTop,
body:has(#favToggle:checked) .backToTop,
body:has(#cartToggle:checked) .backToTop,
body:has(#profileToggle:checked) .backToTop,
body:has(#vaultToggle:checked) .backToTop,
body:has(#loungeInfoToggle:checked) .backToTop,
body:has(#catModalToggle:checked) .backToTop,
body:has(#contactModalToggle:checked) .backToTop{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
}

@media (max-width:760px){
    .backToTop{
        right:14px;
        bottom:calc(10px + env(safe-area-inset-bottom, 0px));
        width:44px;
        height:44px;
    }

    .layout:has(#bestsellers) ~ .backToTop,
    .layout:has(.pd) ~ .backToTop,
    .layout:has(.cart-page) ~ .backToTop{
        bottom:calc(86px + env(safe-area-inset-bottom, 0px));
    }

    .backToTop svg{
        width:20px;
        height:20px;
    }
}

#bestsellers{
    margin-top:-34px;
    padding-top:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
}

#bestsellers::before{
    display:none;
}

#productsGrid.cards{
    display:grid;
    grid-template-columns:minmax(0, 1fr);
    gap:clamp(20px, 3vw, 30px);
}

#bestsellers .section__head{
    margin-top:-20px;
    margin-bottom:34px;
}

#bestsellers .section__title{
    font-size:clamp(42px, 4.4vw, 68px);
    line-height:.92;
}

.bestseller-group{
    display:grid;
    gap:18px;
}

.bestseller-group__head{
    display:flex;
    justify-content:center;
}

.bestseller-group__link{
    display:inline-flex;
    justify-content:center;
    padding:0;
    text-decoration:none;
    border-radius:0;
    background:transparent;
    border:0;
    box-shadow:none;
    transition:transform .16s ease, color .16s ease;
}

.bestseller-group__link:hover{
    transform:translateY(-1px);
    color:var(--pp-fuchsia);
}

.bestseller-group__title{
    margin:0;
    font-family:"Palatino Linotype", "Book Antiqua", Georgia, serif;
    font-size:clamp(24px, 2.6vw, 34px);
    line-height:1.05;
    color:var(--pp-fuchsia-deep);
}

.bestseller-group__grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:22px;
    align-items:stretch;
}

.bestseller-group__grid[data-remainder="1"] > .card:last-child{
    grid-column:2;
}

.bestseller-group__grid[data-remainder="2"] > .card:nth-last-child(2){
    grid-column:1;
}

.bestseller-group__grid[data-remainder="2"] > .card:last-child{
    grid-column:3;
}

#bestsellers .card{
    background:rgba(255,255,255,.86);
    border:1px solid rgba(196,84,135,.10);
    box-shadow:0 20px 40px rgba(196,84,135,.08);
}

.badge--bestseller{
    display:none !important;
}

#bestsellers .badge--bestseller{
    display:none !important;
}

.card[data-bestseller="true"]{
    background:linear-gradient(180deg, rgba(255,248,228,.99), rgba(247,226,189,.98));
    border-color:rgba(225,182,109,.44);
    box-shadow:0 24px 48px rgba(216,169,98,.24);
}

.card[data-bestseller="true"] .card__body{
    background:linear-gradient(180deg, rgba(255,249,232,.99), rgba(249,231,200,.98));
}

.card[data-bestseller="true"] .card__media{
    background:linear-gradient(180deg, rgba(255,250,237,.99), rgba(250,234,205,.97));
}

.card[data-bestseller="true"] .card__media img{
    box-shadow:0 12px 28px rgba(200,154,84,.18);
}

#bestsellers .muted{
    margin:0;
    text-align:center;
}

.layout:has(#bestsellers),
.layout:has(#bestsellers) .layout__content,
.layout:has(#bestsellers) .section,
.layout:has(#bestsellers) #bestsellers,
.layout:has(#bestsellers) .screen_img,
.layout:has(#bestsellers) #productsGrid,
.layout:has(#bestsellers) .bestseller-group{
    background:transparent;
}

.layout:has(#bestsellers) .footer{
    background:transparent;
    box-shadow:none;
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:1200;
    padding:18px clamp(18px, 3vw, 30px) calc(18px + env(safe-area-inset-bottom));
    pointer-events:none;
}

.layout:has(#bestsellers) .layout__content{
    padding-bottom:calc(108px + env(safe-area-inset-bottom));
}

.layout:has(#bestsellers) .footer__logo,
.layout:has(#bestsellers) .footer__contact{
    pointer-events:auto;
}

.layout:has(#bestsellers) .footer__logo{
    filter:none;
}

.layout:has(#bestsellers) .footer__contact{
    box-shadow:0 18px 34px rgba(239,138,116,.26);
}

.layout:has(.hero--page) .footer,
.layout:has(.pd) .footer,
.layout:has(.cart-page) .footer{
    background:transparent;
    box-shadow:none;
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:1200;
    padding:18px clamp(18px, 3vw, 30px) calc(18px + env(safe-area-inset-bottom));
    pointer-events:none;
}

.layout:has(.hero--page) .layout__content,
.layout:has(.pd) .layout__content,
.layout:has(.cart-page) .layout__content{
    padding-bottom:calc(108px + env(safe-area-inset-bottom));
}

.layout:has(.hero--page) .footer__logo,
.layout:has(.hero--page) .footer__contact,
.layout:has(.pd) .footer__logo,
.layout:has(.pd) .footer__contact,
.layout:has(.cart-page) .footer__logo,
.layout:has(.cart-page) .footer__contact{
    pointer-events:auto;
}

.layout:has(.hero--page) .footer__logo,
.layout:has(.pd) .footer__logo,
.layout:has(.cart-page) .footer__logo{
    filter:none;
}

.layout:has(.hero--page) .footer__contact,
.layout:has(.pd) .footer__contact,
.layout:has(.cart-page) .footer__contact{
    box-shadow:0 18px 34px rgba(239,138,116,.26);
}

@media (max-width: 980px){
    .screen_img__content{
        width:100%;
        max-width:none;
    }

    .screen_img__title{
        font-size:clamp(24px, 4.8vw, 62px);
    }

    .bestseller-group__grid{
        grid-template-columns:minmax(0, 1fr);
    }

    .bestseller-group__grid > .card{
        grid-column:auto !important;
        width:min(100%, 420px);
        margin:0 auto;
    }
}

@media (max-width: 720px){
    .screen_img__overlay{
        padding:88px clamp(14px, 4vw, 18px) 72px;
    }

    .screen_img__content{
        width:100%;
        max-width:none;
    }

    .screen_img__title{
        font-size:clamp(18px, 4.4vw, 34px);
    }

    #bestsellers{
        margin-top:0;
        padding-top:0;
    }

    .layout:has(#bestsellers) .layout__content{
        padding-bottom:calc(96px + env(safe-area-inset-bottom));
    }

    .layout:has(#bestsellers) .footer{
        padding:14px 16px calc(14px + env(safe-area-inset-bottom));
    }

    .layout:has(.hero--page) .layout__content,
    .layout:has(.pd) .layout__content,
    .layout:has(.cart-page) .layout__content{
        padding-bottom:calc(96px + env(safe-area-inset-bottom));
    }

    .layout:has(.hero--page) .footer,
    .layout:has(.pd) .footer,
    .layout:has(.cart-page) .footer{
        padding:14px 16px calc(14px + env(safe-area-inset-bottom));
    }
}

@media (max-width: 480px){
    .screen_img__title{
        font-size:clamp(16px, 4.8vw, 26px);
        transform:none;
    }

    .layout:has(#bestsellers) .layout__content{
        padding-bottom:calc(88px + env(safe-area-inset-bottom));
    }

    .layout:has(#bestsellers) .footer{
        padding:12px 14px calc(12px + env(safe-area-inset-bottom));
    }

    .layout:has(#bestsellers) .footer__contact{
        min-height:44px;
        padding:0 18px;
    }

    .layout:has(.hero--page) .layout__content,
    .layout:has(.pd) .layout__content,
    .layout:has(.cart-page) .layout__content{
        padding-bottom:calc(88px + env(safe-area-inset-bottom));
    }

    .layout:has(.hero--page) .footer,
    .layout:has(.pd) .footer,
    .layout:has(.cart-page) .footer{
        padding:12px 14px calc(12px + env(safe-area-inset-bottom));
    }

    .layout:has(.hero--page) .footer__contact,
    .layout:has(.pd) .footer__contact,
    .layout:has(.cart-page) .footer__contact{
        min-height:44px;
        padding:0 18px;
    }
}

.modal__card--vault .vault-head{
    display:none;
}

#vaultModal[data-vault-level="diamond"] .vault-icon{
    background:radial-gradient(circle at 32% 26%, #ffffff 0%, #eef9ff 42%, #d8f2ff 78%, #ffffff 100%);
    border-color:rgba(69,168,221,.82);
    box-shadow:0 20px 38px rgba(69,168,221,.30);
}

#vault-tier-diamond{
    --vault-tier-ring:#45a8dd;
    --vault-tier-emoji:#2f97d6;
    --vault-tier-bg:rgba(236,248,255,.99);
    --vault-level-ring:#45a8dd;
    --vault-level-glow:rgba(69,168,221,.44);
    --vault-level-surface:#eaf7ff;
}

.vault-tierCard__name{
    font-size:14px;
    font-weight:900;
}

.vault-tierCard__meta{
    font-size:13px;
}

.vault-progress__label{
    color:var(--pp-fuchsia);
    font-size:18px;
    font-weight:900;
}

.vault-progress__hint{
    font-size:17px;
    font-weight:850;
    color:rgba(196,84,135,.86);
}

.vault-progress__value{
    color:var(--pp-fuchsia);
    font-size:32px;
    font-weight:1000;
}

.screen_img__overlay{
    gap:14px;
}

@media (max-width: 900px){
    .topbar .brand__wordmark{
        display:none;
    }
}

@media (max-width: 980px){
    .screen_img__title{
        transform:none;
    }
}

@media (max-width: 720px){
    .screen_img__title{
        font-size:clamp(20px, 6vw, 42px);
        transform:none;
    }
}

@media (max-width: 640px){
    .drawer__brand .brand__wordmark,
    .footer__logo .brand__wordmark{
        font-size:18px;
    }

    .vault-tierCard__name{
        font-size:13px;
    }

    .vault-tierCard__meta{
        font-size:12px;
    }
}

@media (max-width: 480px){
    .screen_img__title{
        font-size:clamp(18px, 5.4vw, 30px);
    }
}

body:has(.cart-page){
    background:linear-gradient(135deg, #ffd6e5 0%, #ffedf4 50%, #ffd6e5 100%) fixed;
    background-size:cover;
}

.screen_img__overlay{
    place-content:center;
    padding:clamp(96px, 12vw, 132px) clamp(18px, 4vw, 40px) clamp(84px, 10vw, 112px);
}

.screen_img__content{
    width:min(920px, 100%);
    gap:18px;
}

.screen_img__title{
    width:min(100%, 18em);
    font-size:clamp(34px, 5.6vw, 82px);
    line-height:.94;
    text-align:center;
}

@media (max-width: 720px){
    .screen_img__overlay{
        padding:92px clamp(14px, 4vw, 18px) 84px;
    }

    .screen_img__title{
        width:min(100%, 16em);
        font-size:clamp(26px, 8vw, 54px);
    }
}

@media (max-width: 480px){
    .screen_img__title{
        width:min(100%, 14em);
        font-size:clamp(22px, 7vw, 38px);
    }
}

.screen_img__content{
    width:min(1240px, 100%);
    display:grid;
    gap:clamp(14px, 2.2vw, 22px);
    justify-items:center;
    text-align:center;
    margin:0 auto;
}

.screen_img__title{
    display:inline-block;
    width:auto;
    max-width:100%;
    white-space:normal;
    text-wrap:balance;
    overflow-wrap:break-word;
    font-size:clamp(32px, 5.6vw, 82px);
    margin:0 auto;
    text-align:center;
    justify-self:center;
    transform:none;
}

.screen_img__subtitle{
    margin:0 auto;
    max-width:min(620px, 100%);
    text-align:center;
    justify-self:center;
}

@media (max-width: 720px){
    .screen_img__content{
        width:min(100%, 920px);
    }

    .screen_img__title{
        font-size:clamp(22px, 5.8vw, 48px);
    }
}

@media (max-width: 480px){
    .screen_img__content{
        width:100%;
    }

    .screen_img__title{
        font-size:clamp(16px, 4.9vw, 26px);
        transform:none;
    }
}

html{
    --home-hero-title-size: clamp(34px, 4.8vw, 68px);
    --home-hero-title-size-sm: clamp(25px, 4.5vw, 50px);
}

.screen_img__overlay{
    padding:clamp(84px, 10vw, 120px) clamp(18px, 4vw, 40px) clamp(58px, 7vw, 86px);
}

.screen_img__content{
    width:min(1700px, calc(100vw - 24px));
    gap:clamp(12px, 2vw, 18px);
    transform:none;
}

.screen_img__title{
    inline-size:100%;
    max-inline-size:none;
    margin-inline:auto;
    justify-self:center;
    text-align:center;
    font-size: var(--home-hero-title-size);
    white-space:nowrap;
    overflow-wrap:normal;
    word-break:normal;
    hyphens:auto;
    text-wrap:wrap;
}

.screen_img__title br{
    display:block;
}

@media (max-width: 1100px){
    .screen_img__title{
        white-space:normal;
        text-wrap:balance;
    }
}

.screen_img__subtitle{
    max-inline-size:min(52ch, calc(100vw - 120px));
    line-height:1.6;
}

#bestsellers{
    padding-top:clamp(8px, 2vw, 20px);
}

#bestsellers .section__head{
    width:min(980px, calc(100vw - 48px));
    margin:0 auto clamp(26px, 4vw, 34px);
}

#bestsellers .section__title{
    font-size:clamp(36px, 3.8vw, 56px);
    line-height:.96;
    text-wrap:balance;
}

#productsGrid.cards{
    width:min(1280px, calc(100vw - 48px));
    max-width:100%;
    margin:0 auto;
}

.cards__status{
    grid-column:1 / -1;
    margin:0;
    text-align:center;
}

.bestseller-group{
    width:min(1280px, 100%);
    max-width:100%;
    margin:0 auto;
    gap:16px;
}

.bestseller-group__title{
    text-wrap:balance;
}

@media (max-width: 720px){
    .screen_img__overlay{
        padding:92px 14px 56px;
    }

    .screen_img__content{
        width:min(100%, calc(100vw - 28px));
        transform:none;
    }

    .screen_img__title{
        font-size: var(--home-hero-title-size-sm);
        max-inline-size:calc(100vw - 28px);
    }
}

.topbar .brand__pink{
    color:#f2a8cb !important;
}

.topbar .brand__pact{
    color:#c45487 !important;
}

.footer__logo{
    gap:0;
}

.footer__logo .brand__wordmark{
    display:none;
}

#vaultModal{
    --vault-head-ring:#f3bed3;
    --vault-head-glow:rgba(242,168,203,.42);
    --vault-head-surface:radial-gradient(circle at 30% 30%, #ffffff 0%, #fff3f8 70%, #ffffff 100%);
}

#vaultModal[data-vault-level="pearl"]{
    --vault-head-ring:#efbfd4;
    --vault-head-glow:rgba(239,191,212,.42);
    --vault-head-surface:radial-gradient(circle at 30% 30%, #ffffff 0%, #fff5fa 72%, #ffffff 100%);
}

#vaultModal[data-vault-level="amethyst"]{
    --vault-head-ring:#c7a4ff;
    --vault-head-glow:rgba(167,127,255,.34);
    --vault-head-surface:radial-gradient(circle at 30% 30%, #ffffff 0%, #f7f1ff 72%, #ffffff 100%);
}

#vaultModal[data-vault-level="rose_quartz"]{
    --vault-head-ring:#ef7bad;
    --vault-head-glow:rgba(239,123,173,.38);
    --vault-head-surface:radial-gradient(circle at 30% 30%, #ffffff 0%, #fff0f6 72%, #ffffff 100%);
}

#vaultModal[data-vault-level="diamond"]{
    --vault-head-ring:#6db9e4;
    --vault-head-glow:rgba(109,185,228,.34);
    --vault-head-surface:radial-gradient(circle at 30% 30%, #ffffff 0%, #eef9ff 72%, #ffffff 100%);
}

.modal__card--vault .vault-head{
    display:grid;
    justify-items:center;
    gap:12px;
    padding:4px 0 22px;
    text-align:center;
}

.modal__card--vault .vault-title{
    margin:0;
    font-size:clamp(28px, 4vw, 36px);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    width:fit-content;
    max-width:100%;
    text-align:center;
    line-height:1.05;
    text-wrap:balance;
}

.modal__card--vault .vault-title::before,
.modal__card--vault .vault-title::after{
    content:"💎";
    flex:0 0 auto;
    font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif;
    font-size:clamp(18px, 2vw, 24px);
    line-height:1;
    text-shadow:
            0 0 14px rgba(214,237,255,.72),
            0 8px 18px rgba(109,185,228,.26);
    transform:translateY(-1px);
}

#vaultModal .modal__card--vault .vault-icon{
    position:relative;
    width:96px;
    height:96px;
    display:grid;
    place-items:center;
    border-radius:30px;
    border:2px solid var(--vault-head-ring);
    background:var(--vault-head-surface);
    box-shadow:
            0 18px 38px rgba(17,17,17,.10),
            0 0 34px var(--vault-head-glow);
}

#vaultModal .modal__card--vault .vault-icon::before{
    content:none;
}

#vaultModal .modal__card--vault .vault-icon__image{
    width:clamp(56px, 12vw, 66px);
    height:clamp(56px, 12vw, 66px);
    filter:none;
}

#vaultModal[data-vault-level="pearl"] .modal__card--vault .vault-icon__image{
    width:clamp(54px, 11.5vw, 62px);
    height:clamp(54px, 11.5vw, 62px);
}

.modal__card--vault .vault-sub{
    margin:0;
    font-size:12px;
    font-weight:900;
    letter-spacing:.16em;
    text-transform:uppercase;
    color:rgba(196,84,135,.78);
}

@media (max-width: 640px){
    .modal__card--vault .vault-head{
        padding-bottom:18px;
    }

    .modal__card--vault .vault-title{
        gap:10px;
    }

    .modal__card--vault .vault-title::before,
    .modal__card--vault .vault-title::after{
        font-size:18px;
    }

    #vaultModal .modal__card--vault .vault-icon{
        width:84px;
        height:84px;
        border-radius:26px;
    }
}

.modal__card--vault .vault-title::before,
.modal__card--vault .vault-title::after{
    content:"\01F48E";
}

#vaultModal[data-vault-level="diamond"] .modal__card--vault .vault-icon{
    color:#7ebee3;
}

#vaultModal[data-vault-level="diamond"] .modal__card--vault .vault-icon__image{
    display:none;
}

#vaultModal[data-vault-level="diamond"] .modal__card--vault .vault-icon::after{
    content:"\01F48E";
    font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif;
    font-size:clamp(34px, 8vw, 44px);
    line-height:1;
    text-shadow:
            0 0 14px rgba(214,237,255,.84),
            0 10px 20px rgba(109,185,228,.34);
    transform:translateY(-1px);
}

#vault-tier-diamond .vault-tierCard__gem--diamond{
    display:none;
}

#vault-tier-diamond .vault-tierCard__circle{
    color:#7abbe2;
}

#vault-tier-diamond .vault-tierCard__circle::after{
    content:"\01F48E";
    font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif;
    font-size:clamp(18px, 4.5vw, 26px);
    line-height:1;
    text-shadow:
            0 0 12px rgba(214,237,255,.78),
            0 6px 12px rgba(109,185,228,.26);
    transform:translateY(-1px);
}

#vault-tier-diamond.vault-tierCard__step.is-current .vault-tierCard__circle::after{
    text-shadow:
            0 0 16px rgba(214,237,255,.94),
            0 8px 16px rgba(109,185,228,.34);
}

@media (max-width: 640px){
    #vaultModal[data-vault-level="diamond"] .modal__card--vault .vault-icon::after{
        font-size:30px;
    }
}

.modal__card--vault .vault-title::before,
.modal__card--vault .vault-title::after,
#vaultModal[data-vault-level="diamond"] .modal__card--vault .vault-icon::after,
#vault-tier-diamond .vault-tierCard__circle::after{
    content:none !important;
}

.vault-title__emoji{
    flex:0 0 auto;
    font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif;
    font-size:clamp(18px, 2vw, 24px);
    line-height:1;
    text-shadow:
            0 0 14px rgba(214,237,255,.72),
            0 8px 18px rgba(109,185,228,.26);
    transform:translateY(-1px);
}

#vaultModal .modal__card--vault .vault-icon__emoji[hidden]{
    display:none !important;
}

#vaultModal .modal__card--vault .vault-icon__emoji{
    font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif;
    font-size:clamp(34px, 8vw, 44px);
    line-height:1;
    text-shadow:
            0 0 14px rgba(214,237,255,.84),
            0 10px 20px rgba(109,185,228,.34);
    transform:translateY(-1px);
}

.vault-tierCard__emoji{
    display:none;
}

#vault-tier-diamond .vault-tierCard__gem--diamond{
    display:none !important;
}

#vault-tier-diamond .vault-tierCard__circle{
    color:#7abbe2;
}

#vault-tier-diamond .vault-tierCard__emoji--diamond{
    display:block;
    font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif;
    font-size:clamp(18px, 4.5vw, 26px);
    line-height:1;
    text-shadow:
            0 0 12px rgba(214,237,255,.78),
            0 6px 12px rgba(109,185,228,.26);
    transform:translateY(-1px);
}

#vault-tier-diamond.vault-tierCard__step.is-current .vault-tierCard__emoji--diamond{
    text-shadow:
            0 0 16px rgba(214,237,255,.94),
            0 8px 16px rgba(109,185,228,.34);
}

@media (max-width: 640px){
    .vault-title__emoji{
        font-size:18px;
    }

    #vaultModal .modal__card--vault .vault-icon__emoji{
        font-size:30px;
    }

    #vault-tier-diamond .vault-tierCard__emoji--diamond{
        font-size:20px;
    }
}

.vault-title__emoji{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:28px;
    height:28px;
    font-size:0 !important;
    line-height:0 !important;
    text-shadow:none !important;
}

.vault-title__emoji::before{
    content:"\1F48E";
    font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif;
    font-size:24px;
    line-height:1;
}

#vaultModal .modal__card--vault .vault-icon__emoji{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:100%;
    font-size:0 !important;
    line-height:0 !important;
    text-shadow:none !important;
}

#vaultModal .modal__card--vault .vault-icon__emoji::before{
    content:"\1F48E";
    font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif;
    font-size:44px;
    line-height:1;
}

#vault-tier-diamond .vault-tierCard__emoji--diamond{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:100%;
    font-size:0 !important;
    line-height:0 !important;
    text-shadow:none !important;
}

#vault-tier-diamond .vault-tierCard__emoji--diamond::before{
    content:"\1F48E";
    font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif;
    font-size:26px;
    line-height:1;
}

#vaultModal[data-vault-level="pearl"] .modal__card--vault .vault-icon__image{
    display:none;
}

#vaultModal[data-vault-level="pearl"] .modal__card--vault .vault-icon::after{
    content:"";
    width:30px;
    height:40px;
    border-radius:48% 48% 46% 46% / 42% 42% 58% 58%;
    background:
            radial-gradient(circle at 34% 28%, rgba(255,255,255,.98) 0 22%, rgba(255,255,255,0) 23% 100%),
            radial-gradient(circle at 36% 34%, #ffffff 0%, #fff8fb 42%, #f1e4ee 72%, #d8c1d2 100%);
    box-shadow:
            inset 6px -4px 10px rgba(203,172,192,.28),
            inset -4px 3px 8px rgba(255,255,255,.82),
            0 10px 18px rgba(209,178,196,.20);
    transform:translateY(-1px);
}

@media (max-width: 640px){
    .vault-title__emoji{
        width:22px;
        height:22px;
    }

    .vault-title__emoji::before{
        font-size:18px;
    }

    #vaultModal .modal__card--vault .vault-icon__emoji::before{
        font-size:30px;
    }

    #vault-tier-diamond .vault-tierCard__emoji--diamond::before{
        font-size:20px;
    }

    #vaultModal[data-vault-level="pearl"] .modal__card--vault .vault-icon::after{
        width:26px;
        height:34px;
    }
}

.vault-title__emoji{
    width:auto !important;
    height:auto !important;
    font-size:24px !important;
    line-height:1 !important;
    text-shadow:
            0 0 14px rgba(214,237,255,.72),
            0 8px 18px rgba(109,185,228,.26) !important;
}

.vault-title__emoji::before{
    content:none !important;
}

#vaultModal .modal__card--vault .vault-icon__emoji{
    width:auto !important;
    height:auto !important;
    font-size:44px !important;
    line-height:1 !important;
    text-shadow:
            0 0 14px rgba(214,237,255,.84),
            0 10px 20px rgba(109,185,228,.34) !important;
}

#vaultModal .modal__card--vault .vault-icon__emoji::before{
    content:none !important;
}

#vault-tier-diamond .vault-tierCard__emoji--diamond{
    width:auto !important;
    height:auto !important;
    font-size:26px !important;
    line-height:1 !important;
    text-shadow:
            0 0 12px rgba(214,237,255,.78),
            0 6px 12px rgba(109,185,228,.26) !important;
}

#vault-tier-diamond .vault-tierCard__emoji--diamond::before{
    content:none !important;
}

#vaultModal[data-vault-level="pearl"] .modal__card--vault .vault-icon__image{
    display:block !important;
    width:48px !important;
    height:48px !important;
    margin:0 auto;
}

#vaultModal[data-vault-level="pearl"] .modal__card--vault .vault-icon::after{
    content:none !important;
}

@media (max-width: 640px){
    .vault-title__emoji{
        font-size:18px !important;
    }

    #vaultModal .modal__card--vault .vault-icon__emoji{
        font-size:30px !important;
    }

    #vault-tier-diamond .vault-tierCard__emoji--diamond{
        font-size:20px !important;
    }

    #vaultModal[data-vault-level="pearl"] .modal__card--vault .vault-icon__image{
        width:42px !important;
        height:42px !important;
    }
}

.screen_img__content{
    width:min(1700px, calc(100vw - 24px)) !important;
    justify-items:center !important;
}

.screen_img__title{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:0 !important;
    inline-size:100% !important;
    max-inline-size:none !important;
    margin:0 auto !important;
    text-align:center !important;
    line-height:.94 !important;
    white-space:normal !important;
}

.screen_img__titleLine{
    display:block !important;
    width:fit-content !important;
    max-width:none !important;
    margin:0 auto !important;
    white-space:nowrap !important;
}

@media (max-width: 1100px){
    .screen_img__titleLine{
        width:auto !important;
        max-width:100% !important;
        white-space:normal !important;
        text-wrap:balance !important;
    }
}

#bestsellers .bestseller-group__grid{
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:22px;
    align-items:stretch;
}

#bestsellers .card{
    position:relative;
    min-width:0;
    padding-bottom:56px;
    border-radius:28px;
    background:#fff;
    border:1px solid rgba(0,0,0,.06);
    box-shadow:0 20px 48px rgba(17,17,17,.10);
    overflow:hidden;
    transition:transform .16s ease, box-shadow .16s ease;
}

#bestsellers .card:hover{
    transform:translateY(-3px);
    box-shadow:0 28px 60px rgba(17,17,17,.12);
}

#bestsellers .card__media{
    position:relative;
    display:block;
    width:100%;
    padding:0;
    aspect-ratio:1 / 1.06;
    overflow:hidden;
    text-decoration:none;
    background:linear-gradient(180deg, rgba(255,255,255,.95), rgba(249,241,245,.92));
    border-bottom:1px solid rgba(0,0,0,.06);
}

#bestsellers .card__img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:transform .22s ease;
}

#bestsellers .card:hover .card__img{
    transform:scale(1.02);
}

#bestsellers .card__tools{
    position:absolute;
    top:12px;
    right:12px;
    left:auto;
    display:flex;
    gap:8px;
    z-index:5;
}

#bestsellers .card__tools .icon-btn{
    width:40px;
    height:40px;
    border-radius:999px;
    border:1px solid rgba(0,0,0,.10);
    background:rgba(255,255,255,.92);
    display:grid;
    place-items:center;
    color:#c45487;
    box-shadow:0 10px 22px rgba(0,0,0,.10);
}

#bestsellers .card__tools .icon-btn svg{
    width:18px;
    height:18px;
    color:inherit;
}

#bestsellers .card__body{
    padding:18px 18px 22px;
    min-width:0;
    text-align:left;
}

#bestsellers .card__top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

#bestsellers .card__top > div{
    min-width:0;
}

#bestsellers .card__title{
    margin:0;
    font-family:ui-serif, Georgia, "Times New Roman", serif;
    font-size:22px;
    line-height:1.2;
    color:#c45487;
    max-width:100%;
    overflow-wrap:anywhere;
    word-break:break-word;
}

#bestsellers .card__titleLink{
    color:inherit;
    text-decoration:none;
}

#bestsellers .card__titleLink:hover{
    color:var(--pp-fuchsia);
}

#bestsellers .card__desc{
    margin:8px 0 0;
    color:#776772;
    font-size:14px;
    line-height:1.5;
    overflow:hidden;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:3;
    line-clamp:3;
    overflow-wrap:anywhere;
    word-break:break-word;
}

#bestsellers .card__actions{
    display:flex;
    align-items:center;
    gap:10px;
    margin-top:18px;
}

#bestsellers .card__cta{
    width:100%;
    background:linear-gradient(180deg, var(--pp-pink), var(--pp-coral));
    color:#fff;
    border:0;
    box-shadow:0 16px 30px rgba(239,138,116,.22);
}

#bestsellers .card__price{
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    align-items:baseline;
    gap:6px;
    margin:0;
    padding:8px 12px;
    border-radius:999px;
    border:1px solid rgba(100,171,217,.18);
    background:rgba(255,255,255,.92);
    white-space:nowrap;
    font-weight:900;
    color:#64abd9;
}

#bestsellers .card__priceCur{
    color:rgba(100,171,217,.78);
    font-size:12px;
    font-weight:800;
}

#bestsellers .card[data-bestseller="true"]{
    background:linear-gradient(180deg, rgba(255,248,228,.99), rgba(247,226,189,.98));
    border-color:rgba(225,182,109,.44);
    box-shadow:0 24px 52px rgba(216,169,98,.24);
}

#bestsellers .card[data-bestseller="true"] .card__body{
    background:linear-gradient(180deg, rgba(255,249,232,.99), rgba(249,231,200,.98));
}

#bestsellers .card[data-bestseller="true"] .card__media{
    background:linear-gradient(180deg, rgba(255,250,237,.99), rgba(250,234,205,.97));
    border-bottom-color:rgba(225,182,109,.24);
}

#bestsellers .card[data-bestseller="true"] .card__price{
    color:#64abd9;
    border-color:rgba(100,171,217,.22);
    background:rgba(100,171,217,.12);
}

#bestsellers .card[data-bestseller="true"] .card__priceCur{
    color:rgba(100,171,217,.72);
}

@media (max-width: 980px){
    #bestsellers .bestseller-group__grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    #bestsellers .bestseller-group__grid > .card{
        grid-column:auto !important;
        width:100%;
        margin:0;
    }
}

@media (max-width: 640px){
    #bestsellers .bestseller-group__grid{
        grid-template-columns:1fr;
    }

    #bestsellers .card__body{
        padding:16px;
    }

    #bestsellers .card__title{
        font-size:20px;
    }
}

#vaultModal .modal__card--vault .vault-title{
    line-height:1.08 !important;
    padding-bottom:.12em;
}

#vaultModal .modal__card--vault .vault-head{
    gap:clamp(14px, 2.2vw, 18px);
}

#vaultModal .modal__card--vault .vault-metaCard{
    background:#fffafc !important;
    border-color:rgba(244,160,196,.82) !important;
    box-shadow:0 18px 36px rgba(196,84,135,.10) !important;
}

#vaultModal .modal__card--vault .vault-metaCard__item{
    background:#fff !important;
    border-color:rgba(196,84,135,.12) !important;
    box-shadow:0 10px 24px rgba(196,84,135,.06) !important;
}

#vaultModal .modal__card--vault .vault-metaCard__label{
    font-size:clamp(12px, 2.2vw, 14px) !important;
    letter-spacing:.16em !important;
}

#vaultModal .modal__card--vault .vault-metaCard__value{
    margin-top:10px !important;
    font-size:clamp(26px, 5vw, 34px) !important;
    line-height:1.08 !important;
}

#vaultModal .modal__card--vault .vault-progressCard{
    background:#fff8fb !important;
    border-color:rgba(255,255,255,.98) !important;
    box-shadow:0 18px 34px rgba(196,84,135,.10), inset 0 1px 0 rgba(255,255,255,.92) !important;
}

#vaultModal .modal__card--vault .vault-progressCard::before{
    content:none !important;
}

#vaultModal .modal__card--vault .vault-progress__label{
    font-size:clamp(16px, 2.8vw, 18px) !important;
    letter-spacing:.14em !important;
}

#vaultModal .modal__card--vault .vault-progress__hint{
    font-size:clamp(14px, 2.4vw, 16px) !important;
    line-height:1.4 !important;
}

#vaultModal .modal__card--vault .vault-progress__value{
    min-width:clamp(70px, 18vw, 84px) !important;
    font-size:clamp(24px, 4.6vw, 30px) !important;
}

#vaultModal .modal__card--vault .vault-progress__bar{
    background:#f6edf3 !important;
    border-color:rgba(196,84,135,.12) !important;
    box-shadow:
            inset 0 1px 2px rgba(255,255,255,.92),
            inset 0 -2px 6px rgba(58,36,49,.04),
            0 6px 14px rgba(196,84,135,.04) !important;
}

#vaultModal .modal__card--vault .vault-progress__bar::before{
    content:none !important;
}

#vaultModal .modal__card--vault{
    background:
            radial-gradient(circle at 18% 20%, rgba(255, 206, 228, .40), transparent 30%),
            radial-gradient(circle at 82% 80%, rgba(255, 190, 220, .34), transparent 28%),
            linear-gradient(180deg, rgba(255,250,252,.99) 0%, rgba(255,240,246,.98) 56%, rgba(255,228,239,.98) 100%) !important;
    box-shadow:
            0 30px 80px rgba(119, 58, 89, .24),
            0 0 0 1px rgba(255,255,255,.36) inset !important;
}

#vaultModal .modal__card--vault::before{
    background:
            radial-gradient(circle at top center, rgba(255,255,255,.84), transparent 40%),
            radial-gradient(circle at 20% 30%, rgba(255,190,220,.56), transparent 34%),
            radial-gradient(circle at 80% 72%, rgba(255,166,208,.52), transparent 30%),
            linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,0)) !important;
}

#vaultModal .modal__card--vault .vault-metaCard__content{
    padding-top:12px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__row{
    align-items:stretch !important;
}

#vaultModal .modal__card--vault .vault-metaCard__item{
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:flex-start !important;
    min-height:96px !important;
    padding:14px 16px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__label{
    margin:0 !important;
    line-height:1.12 !important;
}

#vaultModal .modal__card--vault .vault-metaCard__value{
    margin-top:8px !important;
    line-height:1.04 !important;
}

@media (max-width: 860px){
    #bestsellers .bestseller-group__grid{
        gap: clamp(14px, 2.4vw, 18px);
    }

    #bestsellers .card{
        border-radius: clamp(22px, 4vw, 28px);
        padding-bottom: clamp(48px, 8vw, 56px);
    }

    #bestsellers .card__media{
        aspect-ratio: 1 / 0.94;
    }

    #bestsellers .card__body{
        padding: clamp(14px, 2.6vw, 18px) clamp(14px, 2.6vw, 18px) clamp(18px, 3vw, 22px);
    }

    #bestsellers .card__title{
        font-size: clamp(18px, 3.3vw, 22px);
    }

    #bestsellers .card__desc{
        font-size: clamp(13px, 2vw, 14px);
    }

    #bestsellers .card__actions{
        margin-top: clamp(12px, 2vw, 16px);
    }

    #bestsellers .card__tools{
        top: clamp(10px, 1.8vw, 12px);
        right: clamp(10px, 1.8vw, 12px);
        gap: 6px;
    }

    #bestsellers .card__tools .icon-btn{
        width: clamp(34px, 5vw, 40px);
        height: clamp(34px, 5vw, 40px);
    }

    #bestsellers .card__tools .icon-btn svg{
        width: clamp(16px, 2.5vw, 18px);
        height: clamp(16px, 2.5vw, 18px);
    }

    #bestsellers .card__cta{
        min-height: clamp(42px, 6vw, 48px);
        font-size: clamp(14px, 2.1vw, 16px);
    }

    #bestsellers .card__price{
        right: clamp(10px, 1.8vw, 14px);
        bottom: clamp(10px, 1.8vw, 14px);
        padding: clamp(6px, 1.4vw, 8px) clamp(10px, 1.8vw, 12px);
        font-size: clamp(16px, 2.8vw, 20px);
    }

    #bestsellers .card__priceCur{
        font-size: clamp(11px, 1.6vw, 12px);
    }
}

@media (max-width: 640px){
    #bestsellers .bestseller-group__grid{
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 14px;
    }

    #bestsellers .bestseller-group__grid > .card{
        width: min(100%, clamp(268px, 84vw, 360px));
        margin-inline: auto;
    }

    #bestsellers .card__media{
        aspect-ratio: 1 / 0.9;
    }

    #bestsellers .card__body{
        padding: 14px 14px 18px;
    }

    #bestsellers .card__title{
        font-size: clamp(17px, 4.8vw, 20px);
    }

    #bestsellers .card__desc{
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }

    #bestsellers .card__price{
        padding: 6px 10px;
    }
}

.layout:has(.hero--page):not(:has(#bestsellers)) .footer,
.layout:has(.pd) .footer,
.layout:has(.cart-page) .footer,
.layout:has(.checkout-page) .footer,
.layout:has(.pp-page--profile) .footer{
    display:none !important;
}

.layout:has(.hero--page):not(:has(#bestsellers)) .layout__content,
.layout:has(.pd) .layout__content,
.layout:has(.cart-page) .layout__content,
.layout:has(.checkout-page) .layout__content,
.layout:has(.pp-page--profile) .layout__content{
    padding-bottom:0 !important;
}

#bestsellers .card{
    --card-side-inset:18px;
    --card-bottom-inset:18px;
    --card-cta-height:46px;
    --card-price-gap:8px;
    --card-reserved-space:132px;
    display:flex;
    flex-direction:column;
    padding-bottom:0;
    position:relative;
}

#bestsellers .card__body{
    display:flex;
    flex:1;
    flex-direction:column;
    padding-bottom:var(--card-reserved-space);
}

#bestsellers .card__actions{
    position:absolute;
    left:var(--card-side-inset);
    right:var(--card-side-inset);
    bottom:var(--card-bottom-inset);
    margin-top:0;
    padding-top:0;
}

#bestsellers .card__price{
    right:var(--card-side-inset);
    bottom:calc(var(--card-bottom-inset) + var(--card-cta-height) + var(--card-price-gap));
}

@media (max-width: 860px){
    #bestsellers .card{
        --card-side-inset:clamp(14px, 2.6vw, 18px);
        --card-bottom-inset:clamp(14px, 2.6vw, 18px);
        --card-cta-height:44px;
        --card-price-gap:7px;
        --card-reserved-space:124px;
    }
}

@media (max-width: 640px){
    #bestsellers .card{
        --card-side-inset:14px;
        --card-bottom-inset:14px;
        --card-cta-height:42px;
        --card-price-gap:6px;
        --card-reserved-space:116px;
    }
}

#vaultModal .modal__card--vault{
    --vault-modal-scale:1;
    width:min(640px, calc(100vw - (var(--fluid-gutter) * 2))) !important;
    max-height:none !important;
    padding:clamp(16px, 2.8vw, 28px) clamp(14px, 2.8vw, 28px) clamp(14px, 2.4vw, 22px) !important;
    overflow:visible !important;
    will-change:transform;
}

#vaultModal .modal__card--vault[data-fit-mode="zoom"]{
    transform:none !important;
}

#vaultModal .modal__card--vault[data-fit-mode="transform"]{
    transform:scale(var(--vault-modal-scale)) !important;
    transform-origin:top center !important;
}

#vaultModal .modal__card--vault .vault-head{
    gap:clamp(10px, 1.8vh, 16px) !important;
    padding-bottom:clamp(12px, 2vh, 18px) !important;
}

#vaultModal .modal__card--vault .vault-shell{
    gap:clamp(10px, 1.8vh, 16px) !important;
}

#vaultModal .modal__card--vault .vault-title{
    font-size:clamp(28px, 4.4vw, 40px) !important;
}

#vaultModal .modal__card--vault .vault-title__emoji{
    font-size:clamp(18px, 2.4vw, 26px) !important;
}

#vaultModal .modal__card--vault .vault-icon{
    width:clamp(72px, 14vw, 96px) !important;
    height:clamp(72px, 14vw, 96px) !important;
}

#vaultModal .modal__card--vault .vault-icon__image{
    width:clamp(44px, 8vw, 60px) !important;
    height:clamp(44px, 8vw, 60px) !important;
}

#vaultModal .modal__card--vault .vault-tierCard{
    --vault-tier-circle-size: clamp(42px, 10vw, 54px);
    --vault-tier-rail-inset: clamp(16px, 4vw, 28px);
}

#vaultModal .modal__card--vault .vault-statCard__value{
    font-size:clamp(24px, 4.6vw, 34px) !important;
}

#vaultModal .modal__card--vault .vault-metaCard__value{
    font-size:clamp(24px, 4.2vw, 32px) !important;
}

#vaultModal .modal__card--vault .vault-progress__value{
    min-width:clamp(64px, 14vw, 82px) !important;
    font-size:clamp(22px, 4vw, 28px) !important;
}

#vaultModal .modal__card--vault .vault-progress__hint{
    font-size:clamp(13px, 2.1vw, 15px) !important;
}

#vaultModal .modal__card--vault .vault-closeBtn{
    margin-top:4px !important;
}

@media (max-width: 720px), (max-height: 900px){
    #vaultModal .modal__card--vault{
        width:min(100%, calc(100vw - (var(--fluid-gutter) * 2))) !important;
        padding:14px 12px 12px !important;
    }

    #vaultModal .modal__card--vault .vault-head,
    #vaultModal .modal__card--vault .vault-shell{
        gap:8px !important;
    }

    #vaultModal .modal__card--vault .vault-title{
        font-size:clamp(24px, 5vw, 32px) !important;
        gap:8px !important;
    }

    #vaultModal .modal__card--vault .vault-title__emoji{
        font-size:16px !important;
        margin:0 !important;
    }

    #vaultModal .modal__card--vault .vault-sub{
        font-size:12px !important;
    }

    #vaultModal .modal__card--vault .vault-icon{
        width:60px !important;
        height:60px !important;
    }

    #vaultModal .modal__card--vault .vault-icon__image{
        width:34px !important;
        height:34px !important;
    }

    #vaultModal .modal__card--vault .vault-stats--grid,
    #vaultModal .modal__card--vault .vault-metaCard__row{
        grid-template-columns:1fr !important;
    }

    #vaultModal .modal__card--vault .vault-statCard{
        min-height:unset !important;
        padding:10px 12px !important;
    }

    #vaultModal .modal__card--vault .vault-statCard__label,
    #vaultModal .modal__card--vault .vault-metaCard__label,
    #vaultModal .modal__card--vault .vault-progress__label{
        font-size:10px !important;
        letter-spacing:.12em !important;
    }

    #vaultModal .modal__card--vault .vault-stats--grid::after{
        display:none !important;
    }

    #vaultModal .modal__card--vault .vault-statCard__value{
        font-size:clamp(20px, 4vw, 26px) !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard{
        --vault-tier-circle-size: 38px;
        --vault-tier-rail-inset: 14px;
        padding-top:0 !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__name{
        font-size:9px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__meta{
        font-size:9px !important;
        padding:2px 5px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__item{
        min-height:64px !important;
        padding:10px 12px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__value{
        margin-top:6px !important;
        font-size:clamp(20px, 4vw, 26px) !important;
    }

    #vaultModal .modal__card--vault .vault-progressCard{
        padding:8px 10px !important;
    }

    #vaultModal .modal__card--vault .vault-progress__top{
        align-items:flex-start;
        flex-direction:column;
    }

    #vaultModal .modal__card--vault .vault-progress__hint{
        font-size:11px !important;
        line-height:1.3 !important;
    }

    #vaultModal .modal__card--vault .vault-progress__value{
        min-width:56px !important;
        font-size:clamp(18px, 3.8vw, 24px) !important;
    }

    #vaultModal .modal__card--vault .vault-progress__bar{
        height:14px !important;
    }

    #vaultModal .modal__card--vault .btn--full{
        min-height:44px !important;
        border-radius:16px !important;
    }
}

@media (max-height: 820px){
    #vaultModal .modal__card--vault{
        padding:16px 14px 14px !important;
    }

    #vaultModal .modal__card--vault .vault-head,
    #vaultModal .modal__card--vault .vault-shell{
        gap:10px !important;
    }

    #vaultModal .modal__card--vault .vault-title{
        font-size:clamp(26px, 4vw, 34px) !important;
    }

    #vaultModal .modal__card--vault .vault-icon{
        width:72px !important;
        height:72px !important;
    }

    #vaultModal .modal__card--vault .vault-icon__image{
        width:42px !important;
        height:42px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__item{
        min-height:78px !important;
        padding:12px 14px !important;
    }

    #vaultModal .modal__card--vault .vault-progressCard{
        padding:10px 12px !important;
    }

    #vaultModal .modal__card--vault .vault-progress__bar{
        height:16px !important;
    }
}

@media (max-width: 440px), (max-height: 700px){
    #vaultModal .modal__card--vault{
        padding:12px 10px 10px !important;
    }

    #vaultModal .modal__card--vault .vault-title{
        font-size:clamp(22px, 6.8vw, 28px) !important;
        gap:8px !important;
    }

    #vaultModal .modal__card--vault .vault-title__emoji{
        font-size:15px !important;
        margin:0 !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard{
        --vault-tier-circle-size: 34px;
        --vault-tier-rail-inset: 12px;
    }

    #vaultModal .modal__card--vault .vault-tierCard__name{
        font-size:8px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__meta{
        font-size:8px !important;
        padding:1px 4px !important;
    }

    #vaultModal .modal__card--vault .vault-progress__value{
        min-width:52px !important;
    }
}

#vaultModal .modal__card--vault{
    background:
            radial-gradient(circle at 16% 18%, rgba(255,212,229,.54), transparent 28%),
            radial-gradient(circle at 84% 12%, rgba(255,255,255,.76), transparent 24%),
            radial-gradient(circle at 82% 80%, rgba(255,184,214,.30), transparent 26%),
            linear-gradient(180deg, rgba(255,252,253,.99), rgba(255,241,246,.98) 58%, rgba(255,231,240,.98) 100%) !important;
    border:1px solid rgba(255,255,255,.62) !important;
    box-shadow:
            0 36px 80px rgba(119,58,89,.24),
            inset 0 1px 0 rgba(255,255,255,.86) !important;
}

#vaultModal .modal__card--vault .vault-head{
    gap:10px !important;
    padding:24px 26px 18px !important;
    border-radius:30px !important;
    background:linear-gradient(135deg, rgba(255,236,244,.78), rgba(255,255,255,.92)) !important;
    border:1px solid rgba(196,84,135,.10) !important;
}

#vaultModal .modal__card--vault .vault-title{
    color:#cb4f8c !important;
    letter-spacing:-.03em !important;
}

#vaultModal .modal__card--vault .vault-sub{
    max-width:420px !important;
    margin-inline:auto !important;
    color:rgba(109,47,77,.72) !important;
}

#vaultModal .modal__card--vault .vault-shell{
    gap:18px !important;
}

#vaultModal .modal__card--vault .vault-stats--grid{
    gap:14px !important;
}

#vaultModal .modal__card--vault .vault-stats--grid::after{
    display:none !important;
}

#vaultModal .modal__card--vault .vault-statCard{
    min-height:112px !important;
    padding:18px 20px !important;
    border-radius:26px !important;
    border:1px solid rgba(196,84,135,.12) !important;
    background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,245,248,.88)) !important;
    box-shadow:0 16px 34px rgba(196,84,135,.10) !important;
}

#vaultModal .modal__card--vault .vault-statCard__label{
    color:rgba(122,59,88,.68) !important;
}

#vaultModal .modal__card--vault .vault-statCard__value{
    margin-top:10px !important;
    font-size:clamp(30px, 4vw, 40px) !important;
    line-height:1 !important;
    color:#cf4f91 !important;
}

#vaultModal .modal__card--vault .vault-statCard--value .vault-statCard__value,
#vaultModal .modal__card--vault .vault-statCard__value--accent{
    color:#79b4db !important;
}

#vaultModal .modal__card--vault .vault-tierCard{
    padding:22px 18px 16px !important;
    border-radius:28px !important;
    border:1px solid rgba(196,84,135,.10) !important;
    background:linear-gradient(180deg, rgba(255,255,255,.84), rgba(255,244,248,.70)) !important;
    box-shadow:0 16px 30px rgba(196,84,135,.08) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__name{
    color:#b8477e !important;
}

#vaultModal .modal__card--vault .vault-tierCard__meta{
    color:rgba(109,47,77,.70) !important;
    background:rgba(255,255,255,.70) !important;
}

#vaultModal .modal__card--vault .vault-metaCard,
#vaultModal .modal__card--vault .vault-progressCard{
    border-radius:28px !important;
    border:1px solid rgba(196,84,135,.12) !important;
    background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,246,249,.86)) !important;
    box-shadow:0 18px 36px rgba(196,84,135,.08) !important;
}

#vaultModal .modal__card--vault .vault-metaCard{
    padding:20px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__ribbon{
    top:16px !important;
    right:16px !important;
    padding:10px 14px !important;
    border-radius:999px !important;
    background:linear-gradient(180deg, #f3a1c0, #ef8a74) !important;
    box-shadow:0 14px 28px rgba(215,112,150,.20) !important;
}

#vaultModal .modal__card--vault .vault-metaCard__content{
    padding-top:8px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__row{
    gap:14px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__item{
    min-height:108px !important;
    padding:18px !important;
    border-radius:22px !important;
    border:1px solid rgba(196,84,135,.10) !important;
    background:rgba(255,255,255,.72) !important;
}

#vaultModal .modal__card--vault .vault-metaCard__label{
    color:rgba(122,59,88,.62) !important;
}

#vaultModal .modal__card--vault .vault-metaCard__value{
    font-size:clamp(28px, 4vw, 36px) !important;
    color:#bc467e !important;
}

#vaultModal .modal__card--vault .vault-progressCard{
    padding:20px !important;
}

#vaultModal .modal__card--vault .vault-progress__top{
    align-items:end !important;
    gap:18px !important;
}

#vaultModal .modal__card--vault .vault-progress__hint{
    color:rgba(109,47,77,.68) !important;
}

#vaultModal .modal__card--vault .vault-progress__value{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:48px !important;
    padding:0 16px !important;
    border-radius:999px !important;
    background:rgba(255,255,255,.76) !important;
    color:#cb4f8c !important;
}

#vaultModal .modal__card--vault .vault-closeBtn{
    min-height:58px !important;
    border-radius:20px !important;
    background:linear-gradient(180deg, #f5a1bf, #ef8a74) !important;
    color:#fff !important;
    border:0 !important;
    box-shadow:0 20px 36px rgba(215,112,150,.22) !important;
}

@media (max-width: 760px){
    #vaultModal .modal__card--vault .vault-head{
        padding:18px 16px 14px !important;
        border-radius:24px !important;
    }

    #vaultModal .modal__card--vault .vault-statCard,
    #vaultModal .modal__card--vault .vault-metaCard__item{
        min-height:unset !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard,
    #vaultModal .modal__card--vault .vault-progressCard{
        padding:16px !important;
        border-radius:22px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__row{
        gap:10px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__item{
        padding:14px !important;
        border-radius:18px !important;
    }

    #vaultModal .modal__card--vault .vault-progress__value{
        min-height:42px !important;
        padding:0 12px !important;
    }
}

#vaultModal .modal__card--vault{
    width:min(540px, calc(100vw - 28px)) !important;
    padding:16px 14px 14px !important;
}

#vaultModal .modal__card--vault .vault-head,
#vaultModal .modal__card--vault .vault-shell{
    gap:10px !important;
}

#vaultModal .modal__card--vault .vault-head{
    padding:18px 18px 14px !important;
}

#vaultModal .modal__card--vault .vault-title{
    font-size:clamp(24px, 3.4vw, 30px) !important;
}

#vaultModal .modal__card--vault .vault-title__emoji{
    font-size:15px !important;
    margin:0 !important;
}

#vaultModal .modal__card--vault .vault-sub{
    font-size:11px !important;
    letter-spacing:.18em !important;
    text-transform:uppercase !important;
}

#vaultModal .modal__card--vault .vault-icon{
    width:58px !important;
    height:58px !important;
}

#vaultModal .modal__card--vault .vault-icon__image{
    width:32px !important;
    height:32px !important;
}

#vaultModal .modal__card--vault .vault-stats--grid{
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
}

#vaultModal .modal__card--vault .vault-statCard{
    min-height:86px !important;
    padding:12px 14px !important;
    border-radius:22px !important;
}

#vaultModal .modal__card--vault .vault-statCard__label,
#vaultModal .modal__card--vault .vault-metaCard__label,
#vaultModal .modal__card--vault .vault-progress__label{
    font-size:10px !important;
    letter-spacing:.14em !important;
}

#vaultModal .modal__card--vault .vault-statCard__value{
    margin-top:8px !important;
    font-size:clamp(18px, 3.6vw, 24px) !important;
}

#vaultModal .modal__card--vault .vault-tierCard{
    --vault-tier-circle-size: 36px;
    --vault-tier-rail-inset: 14px;
    padding:8px 12px 10px !important;
    border-radius:22px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__name{
    font-size:8px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__meta{
    font-size:8px !important;
    padding:2px 4px !important;
}

#vaultModal .modal__card--vault .vault-metaCard{
    padding:12px !important;
    border-radius:24px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__content{
    padding-top:10px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__row{
    grid-template-columns:1fr 1fr !important;
    gap:12px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__item{
    min-height:90px !important;
    padding:14px 14px 12px !important;
    border-radius:18px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__value{
    margin-top:6px !important;
    font-size:clamp(18px, 3.8vw, 24px) !important;
}

#vaultModal .modal__card--vault .vault-progressCard{
    padding:12px 14px !important;
    border-radius:24px !important;
}

#vaultModal .modal__card--vault .vault-progress__top{
    align-items:flex-start !important;
}

#vaultModal .modal__card--vault .vault-progress__hint{
    font-size:11px !important;
    line-height:1.3 !important;
}

#vaultModal .modal__card--vault .vault-progress__value{
    min-width:62px !important;
    min-height:40px !important;
    font-size:clamp(18px, 3.8vw, 24px) !important;
}

#vaultModal .modal__card--vault .vault-progress__bar{
    height:14px !important;
}

#vaultModal .modal__card--vault .vault-closeBtn{
    min-height:46px !important;
    border-radius:16px !important;
}

@media (max-width: 600px){
    #vaultModal .modal__card--vault{
        width:min(100%, calc(100vw - 20px)) !important;
        padding:14px 10px 10px !important;
    }
}

#vaultModal .modal__card--vault{
    width:min(560px, calc(100vw - 24px)) !important;
    max-height:none !important;
    padding:clamp(14px, 2vw, 18px) clamp(12px, 2vw, 16px) clamp(12px, 1.8vw, 16px) !important;
    overflow:visible !important;
}

#vaultModal .modal__card--vault .vault-shell{
    gap:clamp(10px, 1.6vh, 16px) !important;
}

#vaultModal .modal__card--vault .vault-tierCard{
    margin-bottom:clamp(2px, .6vh, 5px) !important;
}

#vaultModal .modal__card--vault .vault-metaCard{
    margin-top:clamp(4px, .8vh, 8px) !important;
}

#vaultModal .modal__card--vault .vault-progressCard{
    margin-top:clamp(4px, .8vh, 8px) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__circle{
    position:relative;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
}

#vaultModal .modal__card--vault .vault-tierCard__gem{
    width:clamp(22px, 4.4vw, 34px) !important;
    height:clamp(22px, 4.4vw, 34px) !important;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%) scale(.94) !important;
    transform-origin:center center !important;
}

#vaultModal .modal__card--vault .vault-tierCard__gem--pearl{
    width:clamp(20px, 4vw, 30px) !important;
    height:clamp(20px, 4vw, 30px) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__gem--amethyst,
#vaultModal .modal__card--vault .vault-tierCard__gem--rose{
    width:clamp(24px, 4.8vw, 34px) !important;
    height:clamp(24px, 4.8vw, 34px) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__gem--diamond{
    width:clamp(24px, 4.8vw, 34px) !important;
    height:clamp(24px, 4.8vw, 34px) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-earned .vault-tierCard__gem{
    transform:translate(-50%, -50%) scale(1) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__gem{
    transform:translate(-50%, -50%) scale(1.06) !important;
}

@media (max-width: 720px), (max-height: 900px){
    #vaultModal .modal__card--vault{
        width:min(520px, calc(100vw - 18px)) !important;
    }

    #vaultModal .modal__card--vault .vault-shell{
        gap:10px !important;
    }
}

@media (max-width: 520px){
    #vaultModal .modal__card--vault{
        width:calc(100vw - 14px) !important;
        padding:12px 10px 10px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard{
        margin-bottom:6px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard{
        margin-top:8px !important;
    }

    #vaultModal .modal__card--vault .vault-progressCard{
        margin-top:10px !important;
    }
}

#vaultModal .modal__card--vault{
    background:linear-gradient(180deg, rgba(255,252,253,.99), rgba(255,241,246,.98) 58%, rgba(255,231,240,.98) 100%) !important;
}

#vaultModal .modal__card--vault::before{
    content:none !important;
    display:none !important;
    background:none !important;
}

#vaultModal .modal__card--vault .vault-head{
    margin-bottom:4px !important;
}

#vaultModal .modal__card--vault .vault-stats--grid{
    margin-top:6px !important;
    gap:12px !important;
}

#vaultModal .modal__card--vault .vault-shell{
    gap:12px !important;
}

#vaultModal .modal__card--vault .vault-tierCard{
    margin-top:2px !important;
    margin-bottom:4px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__rail,
#vaultModal .modal__card--vault .vault-tierCard__fill{
    top:calc((var(--vault-tier-circle-size) / 2) + 10px - (var(--vault-tier-rail-height) / 2)) !important;
}

@media (max-width: 720px), (max-height: 900px){
    #vaultModal .modal__card--vault .vault-head{
        margin-bottom:2px !important;
    }

    #vaultModal .modal__card--vault .vault-stats--grid{
        margin-top:4px !important;
        gap:10px !important;
    }

    #vaultModal .modal__card--vault .vault-shell{
        gap:10px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__rail,
    #vaultModal .modal__card--vault .vault-tierCard__fill{
        top:calc((var(--vault-tier-circle-size) / 2) + 8px - (var(--vault-tier-rail-height) / 2)) !important;
    }
}

.cat-item__row{
    display:flex;
    align-items:center;
    gap:10px;
}

.cat-item__main{
    flex:1;
    min-width:0;
}

.cat-item__delete,
.cat-item__edit{
    width:36px;
    height:36px;
    flex:0 0 36px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:12px;
    border:1px solid rgba(196,84,135,.16);
    background:rgba(255,255,255,.88);
    color:#c45487;
    cursor:pointer;
    box-shadow:0 8px 18px rgba(196,84,135,.08);
    transition:transform .16s ease, box-shadow .16s ease, background .16s ease;
}

.cat-item__delete:hover,
.cat-item__delete:focus-visible,
.cat-item__edit:hover,
.cat-item__edit:focus-visible{
    transform:translateY(-1px);
    background:rgba(255,240,246,.98);
    box-shadow:0 12px 22px rgba(196,84,135,.12);
}

.cat-item__delete:disabled,
.cat-item__edit:disabled{
    opacity:.65;
    cursor:wait;
    transform:none;
}

.cat-item__delete svg,
.cat-item__edit svg{
    width:16px;
    height:16px;
}

.cat-submenu__row{
    display:flex;
    align-items:center;
    gap:6px;
}

.cat-submenu__row .cat-submenu__link{
    flex:1;
    min-width:0;
}

.cat-item__delete--sub,
.cat-item__edit--sub{
    width:30px;
    height:30px;
    flex-basis:30px;
    border-radius:10px;
}

#vaultModal{
    place-items:center !important;
    padding:12px !important;
}

#vaultModal .modal__card--vault{
    width:min(92vw, 560px) !important;
    max-width:560px !important;
    max-height:calc(100dvh - 24px) !important;
    overflow:hidden !important;
    margin:0 auto !important;
    transform:scale(var(--vault-modal-scale, 1)) !important;
    transform-origin:center center !important;
}

#vaultModal .modal__card--vault .vault-head{
    gap:10px !important;
    padding:6px 0 18px !important;
}

#vaultModal .modal__card--vault .vault-title{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:clamp(8px, 1.7vw, 12px) !important;
    font-size:clamp(24px, 5vw, 40px) !important;
}

#vaultModal .modal__card--vault .vault-title__emoji{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:clamp(18px, 3.2vw, 24px) !important;
    height:clamp(18px, 3.2vw, 24px) !important;
    font-size:clamp(16px, 2.8vw, 22px) !important;
    line-height:1 !important;
    text-shadow:none !important;
    filter:none !important;
    transform:none !important;
}

#vaultModal .modal__card--vault .vault-shell{
    gap:12px !important;
}

#vaultModal .modal__card--vault .vault-statCard{
    min-height:clamp(82px, 14vw, 104px) !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:center !important;
    text-align:center !important;
    padding:clamp(12px, 2.6vw, 18px) !important;
}

#vaultModal .modal__card--vault .vault-statCard__label{
    font-size:clamp(11px, 2vw, 15px) !important;
    line-height:1.1 !important;
}

#vaultModal .modal__card--vault .vault-statCard__value{
    margin-top:clamp(6px, 1.4vw, 10px) !important;
    justify-content:center !important;
    font-size:clamp(26px, 6vw, 40px) !important;
    line-height:1 !important;
}

#vaultModal .modal__card--vault .vault-statCard__value span:last-child{
    font-size:clamp(12px, 2.5vw, 16px) !important;
}

#vaultModal .modal__card--vault .vault-tierCard{
    --vault-tier-circle-size: clamp(42px, 10vw, 56px) !important;
    --vault-tier-rail-height: clamp(8px, 1.8vw, 10px) !important;
    --vault-tier-rail-inset: clamp(14px, 3vw, 24px) !important;
    padding:clamp(8px, 1.8vw, 10px) clamp(8px, 2.4vw, 12px) 6px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__rail,
#vaultModal .modal__card--vault .vault-tierCard__fill{
    top:calc(10px + (var(--vault-tier-circle-size) / 2) - (var(--vault-tier-rail-height) / 2)) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
}

#vaultModal .modal__card--vault .vault-tierCard__circle{
    position:relative !important;
    width:var(--vault-tier-circle-size) !important;
    height:var(--vault-tier-circle-size) !important;
    min-width:var(--vault-tier-circle-size) !important;
    min-height:var(--vault-tier-circle-size) !important;
    display:grid !important;
    place-items:center !important;
    overflow:visible !important;
}

#vaultModal .modal__card--vault .vault-tierCard__circle::before,
#vaultModal .modal__card--vault .vault-tierCard__circle::after{
    content:none !important;
    display:none !important;
}

#vaultModal .modal__card--vault .vault-tierCard__icon{
    position:absolute !important;
    inset:0 !important;
    display:grid !important;
    place-items:center !important;
    width:100% !important;
    height:100% !important;
    pointer-events:none !important;
}

#vaultModal .modal__card--vault .vault-tierCard__gem{
    position:static !important;
    display:block !important;
    margin:0 !important;
    transform:none !important;
    object-fit:contain !important;
    opacity:1 !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-earned .vault-tierCard__circle,
#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__circle{
    box-shadow:0 10px 22px rgba(17,17,17,.10) !important;
    animation:none !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-earned .vault-tierCard__gem,
#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__gem{
    transform:none !important;
    filter:none !important;
    animation:none !important;
}

#vaultModal .modal__card--vault .vault-tierCard__icon--pearl{
    inset:0 !important;
}

#vaultModal .modal__card--vault .vault-tierCard__icon--pearl .vault-tierCard__gem--pearl,
#vaultModal .modal__card--vault .vault-tierCard__icon--amethyst .vault-tierCard__gem--amethyst,
#vaultModal .modal__card--vault .vault-tierCard__icon--rose .vault-tierCard__gem--rose{
    width:clamp(28px, 7vw, 38px) !important;
    height:clamp(28px, 7vw, 38px) !important;
}

#vaultModal .modal__card--vault #vault-tier-diamond .vault-tierCard__gem--diamond{
    display:none !important;
}

#vaultModal .modal__card--vault #vault-tier-diamond .vault-tierCard__icon--diamond{
    inset:0 !important;
}

#vaultModal .modal__card--vault .vault-tierCard__emoji--diamond{
    display:grid !important;
    place-items:center !important;
    width:100% !important;
    height:100% !important;
    font-size:clamp(24px, 6vw, 33px) !important;
    line-height:1 !important;
    text-shadow:none !important;
    filter:none !important;
    transform:none !important;
}

#vaultModal .modal__card--vault .vault-tierCard__name{
    margin-top:clamp(4px, 1vw, 6px) !important;
    font-size:clamp(10px, 2.4vw, 14px) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__meta{
    margin-top:clamp(4px, 1vw, 6px) !important;
    font-size:clamp(9px, 2vw, 12px) !important;
}

#vaultModal .modal__card--vault .vault-metaCard{
    padding:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}

#vaultModal .modal__card--vault .vault-metaCard__content{
    padding:0 !important;
}

#vaultModal .modal__card--vault .vault-metaCard__panel{
    position:relative !important;
    min-height:116px !important;
    padding:20px 20px 18px !important;
    border-radius:24px !important;
    border:2px dotted rgba(233, 168, 195, .95) !important;
    background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,244,248,.96)) !important;
    box-shadow:0 16px 34px rgba(17,17,17,.06) !important;
}

#vaultModal .modal__card--vault .vault-metaCard__ribbon{
    display:none !important;
}

#vaultModal .modal__card--vault .vault-metaCard__summary{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:20px !important;
    align-items:center !important;
    padding-top:10px !important;
    justify-items:center !important;
    height:100% !important;
}

#vaultModal .modal__card--vault .vault-metaCard__group{
    min-width:0 !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:center !important;
    text-align:center !important;
    align-self:center !important;
    justify-self:center !important;
}

#vaultModal .modal__card--vault .vault-metaCard__group--discount{
    padding-right:0 !important;
}

#vaultModal .modal__card--vault .vault-metaCard__group .vault-metaCard__label{
    font-size:15px !important;
    line-height:1.1 !important;
}

#vaultModal .modal__card--vault .vault-metaCard__group .vault-metaCard__value{
    font-size:32px !important;
    line-height:1.05 !important;
    margin-top:4px !important;
}

#vaultModal .modal__card--vault .vault-progressCard{
    padding:16px !important;
}

#vaultModal .modal__card--vault .vault-progress__top{
    display:grid !important;
    grid-template-columns:minmax(0, 1fr) auto !important;
    gap:10px !important;
    align-items:start !important;
}

#vaultModal .modal__card--vault .vault-progress__value{
    justify-self:end !important;
    align-self:start !important;
    min-width:84px !important;
    min-height:50px !important;
    padding:8px 16px !important;
    font-size:26px !important;
    line-height:1 !important;
}

#vaultModal .modal__card--vault .vault-progress__hint{
    overflow-wrap:anywhere !important;
}

#vaultModal .modal__card--vault .vault-progress__bar{
    height:22px !important;
    margin-top:10px !important;
}

#vaultModal .modal__card--vault .vault-progress__fill{
    min-width:18px !important;
}

@media (max-width: 640px){
    #vaultModal{
        padding:8px !important;
    }

    #vaultModal .modal__card--vault{
        width:calc(100vw - 16px) !important;
        max-height:calc(100dvh - 16px) !important;
    }

    #vaultModal .modal__card--vault .vault-title{
        gap:10px !important;
        font-size:clamp(28px, 8vw, 34px) !important;
    }

    #vaultModal .modal__card--vault .vault-title__emoji{
        width:20px !important;
        height:20px !important;
        font-size:18px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard{
        --vault-tier-circle-size: 48px !important;
        --vault-tier-rail-inset: 18px !important;
    }

    #vaultModal .modal__card--vault .vault-statCard{
        min-height:92px !important;
        padding:14px !important;
    }

    #vaultModal .modal__card--vault .vault-statCard__label{
        font-size:13px !important;
    }

    #vaultModal .modal__card--vault .vault-statCard__value{
        font-size:34px !important;
    }

    #vaultModal .modal__card--vault .vault-statCard__value span:last-child{
        font-size:15px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__rail,
    #vaultModal .modal__card--vault .vault-tierCard__fill{
        top:calc(10px + (var(--vault-tier-circle-size) / 2) - (var(--vault-tier-rail-height) / 2)) !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__circle{
        width:48px !important;
        height:48px !important;
        min-width:48px !important;
        min-height:48px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__icon--pearl .vault-tierCard__gem--pearl,
    #vaultModal .modal__card--vault .vault-tierCard__icon--amethyst .vault-tierCard__gem--amethyst,
    #vaultModal .modal__card--vault .vault-tierCard__icon--rose .vault-tierCard__gem--rose{
        width:32px !important;
        height:32px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__emoji--diamond{
        font-size:28px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__panel{
        min-height:108px !important;
        padding:18px 16px 16px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__summary{
        gap:14px !important;
        padding-top:8px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__group--discount{
        padding-right:0 !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__group .vault-metaCard__label{
        font-size:13px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__group .vault-metaCard__value{
        font-size:28px !important;
    }

    #vaultModal .modal__card--vault .vault-progress__value{
        min-width:72px !important;
        min-height:44px !important;
        padding:8px 14px !important;
        font-size:22px !important;
    }

    #vaultModal .modal__card--vault .vault-progress__bar{
        height:20px !important;
    }
}

#vaultModal .modal__card--vault .vault-title__emoji{
    color:#4aa8ff !important;
    -webkit-text-fill-color:#4aa8ff !important;
}

#vaultModal .modal__card--vault .vault-icon__emoji,
#vaultModal .modal__card--vault .vault-tierCard__emoji--diamond{
    color:#4aa8ff !important;
    -webkit-text-fill-color:#4aa8ff !important;
}

#vaultModal .modal__card--vault .vault-closeBtn{
    display:none !important;
}

#vaultModal .modal__card--vault .vault-closeFab{
    position:absolute !important;
    top:clamp(6px, 1.4vw, 10px) !important;
    left:clamp(6px, 1.4vw, 10px) !important;
    right:auto !important;
    width:clamp(38px, 8vw, 48px) !important;
    height:clamp(38px, 8vw, 48px) !important;
    display:grid !important;
    place-items:center !important;
    border-radius:999px !important;
    border:1px solid rgba(240, 189, 209, .72) !important;
    background:
            radial-gradient(circle at 30% 28%, rgba(255,255,255,.98) 0%, rgba(255,255,255,.94) 36%, rgba(255,246,250,.96) 100%) !important;
    box-shadow:
            0 14px 30px rgba(196,84,135,.12),
            inset 0 1px 0 rgba(255,255,255,.72) !important;
    color:#9a7484 !important;
    cursor:pointer !important;
    backdrop-filter:blur(8px) !important;
    transition:background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease, border-color .2s ease !important;
    z-index:3 !important;
}

#vaultModal .modal__card--vault .vault-closeFab svg{
    width:clamp(16px, 3.4vw, 20px) !important;
    height:clamp(16px, 3.4vw, 20px) !important;
    color:currentColor !important;
    opacity:.92 !important;
}

#vaultModal .modal__card--vault .vault-closeFab:hover,
#vaultModal .modal__card--vault .vault-closeFab:focus-visible{
    background:linear-gradient(180deg, #ff9a8b 0%, #ff7f73 100%) !important;
    border-color:rgba(255,127,115,.84) !important;
    color:#ffffff !important;
    transform:translateY(-2px) scale(1.03) !important;
    box-shadow:
            0 16px 28px rgba(255,127,115,.28),
            0 6px 14px rgba(255,127,115,.18) !important;
}

#vaultModal .modal__card--vault .vault-closeFab:active{
    transform:translateY(0) scale(.98) !important;
}

@media (max-width: 640px){
    #vaultModal .modal__card--vault .vault-closeFab{
        top:8px !important;
        left:8px !important;
        width:42px !important;
        height:42px !important;
    }
}

#vaultModal .modal__card--vault .vault-stats--grid,
#vaultModal .modal__card--vault .vault-tierCard,
#vaultModal .modal__card--vault .vault-metaCard,
#vaultModal .modal__card--vault .vault-progressCard{
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
}

#vaultModal .modal__card--vault .vault-stats--grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    align-items:stretch !important;
}

#vaultModal .modal__card--vault .vault-stats--grid .vault-statCard{
    min-width:0 !important;
    min-height:104px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    box-sizing:border-box !important;
}

#vaultModal .modal__card--vault .vault-statCard__value{
    width:100% !important;
    justify-content:center !important;
    white-space:nowrap !important;
}

#vaultModal .modal__card--vault .vault-tierCard__meta{
    white-space:nowrap !important;
}

#vaultModal .modal__card--vault .vault-metaCard__panel,
#vaultModal .modal__card--vault .vault-progressCard{
    width:100% !important;
    box-sizing:border-box !important;
}

#vaultModal .modal__card--vault .vault-progressCard{
    min-height:116px !important;
    display:grid !important;
    align-content:center !important;
}

#contactModal{
    place-items:center !important;
    padding:clamp(8px, 2vh, 18px) var(--fluid-gutter) !important;
}

#contactModal .modal__card{
    width:min(640px, calc(100vw - (var(--fluid-gutter) * 2))) !important;
    max-height:calc(100dvh - clamp(16px, 4vh, 36px)) !important;
    overflow:hidden !important;
    scrollbar-gutter:auto !important;
    display:grid !important;
    grid-template-rows:auto minmax(0, 1fr) !important;
    align-content:center !important;
    padding:clamp(18px, 2.7vh, 24px) clamp(18px, 3vw, 28px) !important;
}

#contactModal .contact-modal__head,
#contactModal .contact-modal-form{
    width:100% !important;
    max-width:560px !important;
    justify-self:center !important;
}

#contactModal .contact-modal-form{
    min-height:0 !important;
    gap:clamp(10px, 1.7vh, 14px) !important;
}

#contactModal .contact-textarea{
    min-height:clamp(150px, 25dvh, 230px) !important;
    max-height:32dvh !important;
    resize:none !important;
}

#contactModal .contact-modal__note{
    padding-block:clamp(8px, 1.4vh, 10px) !important;
}

#contactModal .contact-modal-actions .btn{
    min-height:clamp(46px, 6.4vh, 52px) !important;
}

#vaultModal{
    place-items:center !important;
}

#vaultModal .modal__card--vault{
    width:min(640px, calc(100vw - 24px)) !important;
    max-width:640px !important;
    display:grid !important;
    justify-items:center !important;
}

#vaultModal .modal__card--vault .vault-head,
#vaultModal .modal__card--vault .vault-shell{
    width:100% !important;
    max-width:574px !important;
    justify-self:center !important;
}

#vaultModal .modal__card--vault{
    width:min(574px, calc(100vw - 24px)) !important;
    max-width:574px !important;
}

#vaultModal .modal__card--vault .vault-head,
#vaultModal .modal__card--vault .vault-shell{
    max-width:100% !important;
}

#vaultModal .modal__card--vault .vault-stats--grid{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    overflow:visible !important;
}

#vaultModal .modal__card--vault .vault-stats--grid .vault-statCard{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    padding-block:clamp(10px, 2.2vw, 16px) !important;
}

@media (max-width: 640px){
    #contactModal .modal__card{
        width:calc(100vw - 16px) !important;
        padding:16px !important;
    }

    #contactModal .contact-modal__head{
        padding:4px 4px 10px !important;
    }

    #contactModal .contact-modal__title{
        margin-top:10px !important;
    }

    #contactModal .contact-modal__footerRow{
        flex-direction:row !important;
        align-items:center !important;
    }

    #contactModal .contact-modal-actions{
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    }
}

#vaultModal,
#contactModal{
    transition:none !important;
}

#vaultModal .modal__card--vault,
#contactModal .modal__card--contact{
    transition:none !important;
    transform-origin:center center !important;
    will-change:auto !important;
}

#vaultModal .modal__card--vault{
    width:min(640px, calc(100vw - (var(--fluid-gutter) * 2))) !important;
    max-width:640px !important;
    padding:clamp(18px, 2.7vh, 24px) clamp(18px, 3vw, 28px) !important;
}

#vaultModal .modal__card--vault .vault-head,
#vaultModal .modal__card--vault .vault-shell{
    width:100% !important;
    max-width:560px !important;
    justify-self:center !important;
}

#vaultModal .modal__card--vault .vault-stats--grid,
#vaultModal .modal__card--vault .vault-tierCard,
#vaultModal .modal__card--vault .vault-metaCard,
#vaultModal .modal__card--vault .vault-progressCard{
    width:100% !important;
    max-width:100% !important;
    justify-self:stretch !important;
}

@media (max-width: 640px){
    #vaultModal .modal__card--vault{
        width:calc(100vw - 16px) !important;
        padding:16px !important;
    }
}

#vaultModal .modal__card--vault{
    --vault-inner-width:min(560px, 100%) !important;
    --vault-inner-shift:0px !important;
    grid-template-columns:1fr !important;
    justify-items:center !important;
    transform:scale(1) !important;
}

#vaultModal .modal__card--vault .vault-head,
#vaultModal .modal__card--vault .vault-shell{
    width:var(--vault-inner-width) !important;
    max-width:var(--vault-inner-width) !important;
    margin-inline:auto !important;
    transform:translateX(var(--vault-inner-shift)) !important;
}

#vaultModal .modal__card--vault .vault-shell{
    display:grid !important;
    justify-items:center !important;
}

#vaultModal .modal__card--vault .vault-stats--grid,
#vaultModal .modal__card--vault .vault-tierCard,
#vaultModal .modal__card--vault .vault-metaCard,
#vaultModal .modal__card--vault .vault-progressCard{
    width:100% !important;
    margin-inline:0 !important;
    justify-self:center !important;
}

#vaultModal .modal__card--vault .vault-stats--grid{
    gap:12px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__panel,
#vaultModal .modal__card--vault .vault-progressCard{
    padding-inline:18px !important;
}

.modal,
.modal__card,
.drawer__panel,
.language-menu,
.pp-selectbox__menu,
.cat-submenu,
.toast,
#vaultModal *,
#contactModal *{
    animation:none !important;
    transition:none !important;
}

@media (max-width: 640px){
    #vaultModal .modal__card--vault{
        --vault-inner-width:100% !important;
        --vault-inner-shift:0px !important;
    }
}

#vaultModal{
    padding-block:clamp(6px, 1.2dvh, 12px) !important;
}

#vaultModal .modal__card--vault{
    max-height:calc(100dvh - clamp(12px, 2.4dvh, 24px)) !important;
    overflow:hidden !important;
    align-content:start !important;
    padding-block:clamp(10px, 1.8dvh, 18px) !important;
}

#vaultModal .modal__card--vault .vault-head{
    gap:clamp(6px, 1.1dvh, 10px) !important;
    padding:clamp(4px, .8dvh, 8px) 0 clamp(8px, 1.2dvh, 12px) !important;
}

#vaultModal .modal__card--vault .vault-shell{
    gap:clamp(8px, 1.4dvh, 12px) !important;
}

#vaultModal .modal__card--vault .vault-title{
    font-size:clamp(32px, 5dvh, 48px) !important;
    line-height:1 !important;
}

#vaultModal .modal__card--vault .vault-icon{
    width:clamp(64px, 9dvh, 86px) !important;
    height:clamp(64px, 9dvh, 86px) !important;
}

#vaultModal[data-vault-level="pearl"] .modal__card--vault .vault-icon__image{
    width:clamp(38px, 5.8dvh, 48px) !important;
    height:clamp(38px, 5.8dvh, 48px) !important;
}

#vaultModal .modal__card--vault .vault-statCard{
    min-height:clamp(74px, 12dvh, 104px) !important;
    padding-block:clamp(10px, 1.6dvh, 16px) !important;
}

#vaultModal .modal__card--vault .vault-tierCard{
    --vault-tier-circle-size:clamp(42px, 7.5dvh, 56px) !important;
    padding-block:clamp(8px, 1.2dvh, 10px) 6px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__panel{
    min-height:clamp(92px, 15dvh, 116px) !important;
    padding-block:clamp(14px, 2dvh, 20px) !important;
}

#vaultModal .modal__card--vault .vault-progressCard{
    min-height:clamp(86px, 13dvh, 116px) !important;
    padding-block:clamp(12px, 1.8dvh, 16px) !important;
}

#vaultModal .modal__card--vault .vault-progress__bar{
    height:clamp(14px, 2.4dvh, 20px) !important;
    margin-top:clamp(6px, 1dvh, 10px) !important;
}

@media (max-height: 820px){
    #vaultModal .modal__card--vault{
        border-radius:26px !important;
        padding-top:10px !important;
        padding-bottom:10px !important;
    }

    #vaultModal .modal__card--vault .vault-title{
        font-size:38px !important;
    }

    #vaultModal .modal__card--vault .vault-sub{
        font-size:10px !important;
        letter-spacing:.12em !important;
    }

    #vaultModal .modal__card--vault .vault-statCard__value{
        font-size:34px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__group .vault-metaCard__value{
        font-size:28px !important;
    }

    #vaultModal .modal__card--vault .vault-progress__value{
        min-height:38px !important;
        font-size:22px !important;
        padding:7px 14px !important;
    }
}

@media (max-height: 720px){
    #vaultModal .modal__card--vault{
        max-height:calc(100dvh - 8px) !important;
    }

    #vaultModal .modal__card--vault .vault-head{
        gap:5px !important;
        padding-bottom:6px !important;
    }

    #vaultModal .modal__card--vault .vault-shell{
        gap:7px !important;
    }

    #vaultModal .modal__card--vault .vault-title{
        font-size:32px !important;
    }

    #vaultModal .modal__card--vault .vault-icon{
        width:58px !important;
        height:58px !important;
    }

    #vaultModal .modal__card--vault .vault-statCard{
        min-height:66px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__panel{
        min-height:82px !important;
    }

    #vaultModal .modal__card--vault .vault-progressCard{
        min-height:74px !important;
    }
}

#vaultModal .modal__card--vault{
    width:min(560px, calc(100vw - 24px)) !important;
    max-width:560px !important;
    padding-inline:18px !important;
}

#vaultModal .modal__card--vault .vault-head,
#vaultModal .modal__card--vault .vault-shell{
    width:100% !important;
    max-width:100% !important;
}

#vaultModal .modal__card--vault .vault-stats--grid{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    gap:12px !important;
    overflow:visible !important;
}

#vaultModal .modal__card--vault .vault-stats--grid .vault-statCard{
    background:rgba(255,255,255,.76) !important;
    border:1px solid rgba(196,84,135,.12) !important;
    border-radius:clamp(18px, 4vw, 24px) !important;
    box-shadow:0 18px 36px rgba(17,17,17,.06) !important;
}

@media (min-width: 641px){
    #vaultModal .modal__card--vault{
        --vault-inner-shift:9px !important;
    }

    #vaultModal .modal__card--vault .vault-head,
    #vaultModal .modal__card--vault .vault-shell{
        transform:translateX(var(--vault-inner-shift)) !important;
    }
}

@media (max-width: 640px){
    #vaultModal .modal__card--vault{
        width:calc(100vw - 16px) !important;
        padding-inline:12px !important;
        --vault-inner-shift:0px !important;
    }
}

#loungeInfoToggle:checked ~ .backdrop[for="loungeInfoToggle"]{
    opacity:1;
    pointer-events:auto;
}

#loungeInfoToggle:checked ~ #loungeInfoModal{
    opacity:1;
    pointer-events:auto;
}

.topbar__right{
    gap:14px;
    position:relative;
    z-index:3;
}

.lang-switcher{
    margin-right:14px !important;
    padding:6px 12px !important;
    gap:8px !important;
    z-index:4;
}

.lang-switcher.is-open{
    z-index:2600;
}

.lang-switcher__trigger{
    min-width:34px !important;
    justify-content:center !important;
    padding:0 18px 0 0 !important;
    font-size:20px !important;
}

.lang-switcher__current{
    line-height:1 !important;
}

.lang-switcher__menu{
    min-width:72px !important;
    padding:8px !important;
    z-index:2601 !important;
}

.lang-switcher__option{
    justify-content:center !important;
    min-height:42px !important;
    padding:0 !important;
    font-size:22px !important;
    text-align:center !important;
}

.lounge-pill{
    appearance:none;
    min-height:44px;
    padding:0 15px;
    border-radius:999px;
    border:1px solid rgba(196,84,135,.22);
    background:
            radial-gradient(circle at 22% 20%, rgba(255,255,255,.72), transparent 38%),
            linear-gradient(135deg, #f74f9f 0%, #c45487 54%, #ec7f72 100%);
    box-shadow:0 16px 34px rgba(196,84,135,.24);
    color:#fff;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    font-size:13px;
    font-weight:900;
    line-height:1.1;
    text-decoration:none;
    white-space:nowrap;
    cursor:pointer;
    transition:transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.lounge-pill:hover,
.lounge-pill:focus-visible{
    transform:translateY(-1px);
    box-shadow:0 20px 40px rgba(196,84,135,.30);
    filter:brightness(1.02);
    outline:none;
}

.lounge-pill--help{
    background:
            radial-gradient(circle at 22% 20%, rgba(255,255,255,.65), transparent 38%),
            linear-gradient(135deg, #d91f6b 0%, #a91558 100%);
    max-width:220px;
    white-space:normal;
    text-align:center;
}

.vault-statCard__expiry{
    margin-top:6px;
    color:#a76985;
    font-size:clamp(10px, 1.8vw, 12px);
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.modal__card--loungeInfo{
    width:min(680px, calc(100vw - 28px));
    max-height:calc(100dvh - 28px);
    overflow:auto;
    padding:clamp(18px, 4vw, 28px);
    border-radius:28px;
    border:1px solid rgba(196,84,135,.16);
    background:
            radial-gradient(circle at 18% 8%, rgba(255,206,226,.55), transparent 30%),
            radial-gradient(circle at 84% 22%, rgba(255,139,196,.24), transparent 28%),
            linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,244,249,.96));
    box-shadow:0 30px 80px rgba(42,10,27,.22);
}

.loungeInfo-closeFab{
    right:16px;
    top:16px;
}

.loungeInfo{
    display:grid;
    grid-template-columns:160px minmax(0, 1fr);
    gap:22px;
    align-items:start;
}

.loungeInfo__hero{
    min-height:260px;
    border-radius:6px;
    background:
            linear-gradient(rgba(245,180,207,.72), rgba(245,180,207,.72)),
            url("../images/logo.png");
    background-size:180px auto;
    background-repeat:repeat;
    background-position:center;
    opacity:.86;
    display:grid;
    place-items:center;
    overflow:hidden;
}

.loungeInfo__hero img{
    width:82px;
    opacity:.18;
}

.loungeInfo__copy{
    color:#25202a;
    font-size:14px;
    line-height:1.58;
}

.loungeInfo__copy p{
    margin:0 0 10px;
}

.loungeInfo__lead{
    font-size:17px;
    font-weight:900;
}

.loungeInfo__copy h3{
    margin:16px 0 8px;
    color:#17131b;
    font-size:15px;
    font-weight:950;
}

.loungeInfo__tiers{
    margin:0;
    padding:0;
    list-style:none;
    display:grid;
    gap:8px;
}

.loungeInfo__tiers li{
    display:grid;
    grid-template-columns:24px minmax(0, 1fr);
    gap:8px;
}

@media (max-width: 1180px){
    .lounge-pill{
        padding-inline:12px;
        font-size:12px;
    }

    .lounge-pill--help{
        max-width:180px;
    }
}

@media (max-width: 640px){
    .lang-switcher{
        margin-right:4px !important;
        padding:5px 10px !important;
    }

    .lang-switcher__trigger{
        min-width:30px !important;
        font-size:18px !important;
    }

    .loungeInfo{
        grid-template-columns:1fr;
    }

    .loungeInfo__hero{
        min-height:150px;
    }

    .modal__card--loungeInfo{
        width:calc(100vw - 16px);
        padding:18px 14px;
    }
}

.lounge-pill,
.lounge-pill--help,
.drawer__quickLink--lounge{
    background:
            radial-gradient(circle at 24% 20%, rgba(255,255,255,.60), rgba(255,255,255,0) 36%),
            linear-gradient(180deg, #f3a1c0 0%, #ef8a74 100%) !important;
    border-color:rgba(239,138,116,.24) !important;
    box-shadow:0 16px 34px rgba(239,138,116,.22) !important;
    color:#fff !important;
}

.lounge-pill--help{
    max-width:none;
    white-space:nowrap;
}

.modal__card--loungeInfo{
    width:min(900px, calc(100vw - 32px));
}

.loungeInfo{
    grid-template-columns:220px minmax(0, 1fr);
    gap:28px;
}

.loungeInfo__hero{
    min-height:330px;
}

.loungeInfo__copy{
    font-size:15px;
    line-height:1.62;
}

.loungeInfo__lead{
    font-size:19px;
    line-height:1.34;
}

@media (max-width: 640px){
    .drawer__quickLinks{
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    }

    .drawer__quickLinks > .drawer__quickLink:nth-child(1),
    .drawer__quickLinks > .drawer__quickLink:nth-child(2){
        min-height:50px;
        background:
                radial-gradient(circle at 24% 20%, rgba(255,255,255,.60), rgba(255,255,255,0) 36%),
                linear-gradient(180deg, #f3a1c0 0%, #ef8a74 100%) !important;
        border-color:rgba(239,138,116,.24) !important;
        box-shadow:0 16px 34px rgba(239,138,116,.22) !important;
        color:#fff !important;
    }

    .drawer__quickLinks > .drawer__quickLink:nth-child(1):hover,
    .drawer__quickLinks > .drawer__quickLink:nth-child(1):focus-visible,
    .drawer__quickLinks > .drawer__quickLink:nth-child(2):hover,
    .drawer__quickLinks > .drawer__quickLink:nth-child(2):focus-visible{
        background:
                radial-gradient(circle at 24% 20%, rgba(255,255,255,.66), rgba(255,255,255,0) 36%),
                linear-gradient(180deg, #f4a8c5 0%, #f0917c 100%) !important;
        color:#fff !important;
    }

    .drawer__quickLink--lounge{
        min-height:50px;
        padding-inline:8px;
        font-size:12px;
        line-height:1.15;
    }

    .drawer__quickLink--lounge span{
        white-space:normal;
    }

    .modal__card--loungeInfo{
        width:calc(100vw - 16px);
        max-height:calc(100dvh - 16px);
        padding:18px 14px;
    }

    .loungeInfo{
        grid-template-columns:1fr;
        gap:16px;
    }

    .loungeInfo__hero{
        min-height:170px;
    }
}

@media (max-width: 440px){
    .drawer__quickLinks{
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    }
}

.brand__pink,
.topbar .brand__pink,
.drawer__brand .brand__pink,
.footer__logo .brand__pink{
    color:#f2a4cc !important;
}

.brand__pact,
.topbar .brand__pact,
.drawer__brand .brand__pact,
.footer__logo .brand__pact{
    color:#c45487 !important;
}

.flag-icon{
    display:inline-block;
    width:24px;
    height:16px;
    flex:0 0 24px;
    position:relative;
    border-radius:2px;
    overflow:hidden;
    vertical-align:middle;
    box-shadow:0 0 0 1px rgba(27,27,34,.14), 0 1px 3px rgba(27,27,34,.12);
}

.lang-switcher__current.flag-icon{
    width:26px;
    height:18px;
    flex-basis:26px;
}

.lang-switcher__option .flag-icon{
    width:28px;
    height:19px;
}

.flag-icon--bg{
    background:linear-gradient(180deg, #ffffff 0 33.33%, #00966e 33.33% 66.66%, #d62612 66.66% 100%);
}

.flag-icon--de{
    background:linear-gradient(180deg, #000000 0 33.33%, #dd0000 33.33% 66.66%, #ffce00 66.66% 100%);
}

.flag-icon--es{
    background:linear-gradient(180deg, #aa151b 0 25%, #f1bf00 25% 75%, #aa151b 75% 100%);
}

.flag-icon--fr{
    background:linear-gradient(90deg, #0055a4 0 33.33%, #ffffff 33.33% 66.66%, #ef4135 66.66% 100%);
}

.flag-icon--it{
    background:linear-gradient(90deg, #009246 0 33.33%, #ffffff 33.33% 66.66%, #ce2b37 66.66% 100%);
}

.flag-icon--en{
    display:inline-grid;
    place-items:center;
    overflow:hidden;
    background:transparent url("https://www.emoji.co.uk/files/apple-emojis/flags-ios/1235-flag-of-great-britain.png") center / contain no-repeat;
    box-shadow:none;
}

.flag-icon--en::before{
    content:"";
}

.flag-icon.flag-icon--emoji,
.lang-switcher__current.flag-icon.flag-icon--emoji,
.lang-switcher__option .flag-icon.flag-icon--emoji{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    width:30px !important;
    height:22px !important;
    flex:0 0 30px !important;
    border-radius:0 !important;
    overflow:visible !important;
    background:none !important;
    box-shadow:none !important;
    font-size:21px !important;
    font-family:"Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif !important;
    line-height:1 !important;
    filter:none !important;
}

.lang-switcher__current.flag-icon.flag-icon--emoji{
    width:28px !important;
    height:22px !important;
    flex-basis:28px !important;
    font-size:20px !important;
}

.lang-switcher__option .flag-icon.flag-icon--emoji{
    font-size:23px !important;
}

.loungeInfo__hero{
    background-color:#f3dec7 !important;
    background-image:
            linear-gradient(rgba(243,222,199,.82), rgba(243,222,199,.82)),
            url("../images/logo.png") !important;
    background-size:auto, 170px auto !important;
    background-repeat:no-repeat, repeat !important;
    background-position:center, center !important;
}

.loungeInfo__hero img{
    display:none !important;
}

.drawer__link--handmade{
    min-height:46px !important;
    justify-content:center !important;
    margin-top:8px !important;
    padding:0 18px !important;
    border:1px solid rgba(137,0,71,.35) !important;
    border-radius:999px !important;
    background:
            radial-gradient(circle at 18% 20%, rgba(255,255,255,.58), rgba(255,255,255,0) 34%),
            linear-gradient(180deg, #f062aa 0%, #bc005d 45%, #890047 100%) !important;
    color:#fff !important;
    box-shadow:
            inset 0 2px 0 rgba(255,255,255,.34),
            inset 0 -6px 16px rgba(75,0,35,.20),
            0 14px 28px rgba(188,0,93,.24) !important;
    font-weight:950 !important;
    text-align:center !important;
    text-shadow:0 1px 8px rgba(0,0,0,.22) !important;
}

.drawer__link--handmade::before{
    content:"";
    position:absolute;
    left:18px;
    right:18px;
    top:5px;
    height:42%;
    border-radius:999px;
    background:linear-gradient(180deg, rgba(255,255,255,.42), rgba(255,255,255,0));
    pointer-events:none;
}

.drawer__link--handmade .dot{
    display:none;
}

.drawer__link--handmade:hover,
.drawer__link--handmade:focus-visible{
    background:
            radial-gradient(circle at 18% 20%, rgba(255,255,255,.64), rgba(255,255,255,0) 34%),
            linear-gradient(180deg, #f56eb4 0%, #ca0969 45%, #940052 100%) !important;
    transform:translateY(-1px);
}

.modal__card--loungeInfo{
    position:relative !important;
    width:min(910px, calc(100vw - 32px)) !important;
    overflow:auto !important;
    isolation:isolate !important;
    background:#f3dec7 !important;
}

.modal__card--loungeInfo::before{
    content:"";
    position:absolute;
    inset:-45%;
    z-index:-1;
    background-image:url("../images/logo.png");
    background-size:150px auto;
    background-repeat:repeat;
    background-position:left bottom;
    opacity:.105;
    transform:rotate(-34deg);
    transform-origin:center;
    pointer-events:none;
}

.modal__card--loungeInfo::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:linear-gradient(180deg, rgba(255,247,251,.82), rgba(255,240,247,.76));
    pointer-events:none;
}

.loungeInfo{
    display:block !important;
    max-width:720px !important;
    margin:0 auto !important;
    text-align:center !important;
}

.loungeInfo__hero{
    display:none !important;
}

.loungeInfo__copy{
    text-align:center !important;
    margin:0 auto !important;
}

.loungeInfo__tiers{
    justify-items:center !important;
}

.loungeInfo__tiers li{
    display:flex !important;
    align-items:flex-start !important;
    justify-content:center !important;
    max-width:640px !important;
    text-align:left !important;
}

#loungeInfoModal.modal--loungeInfo{
    padding:clamp(18px, 4vw, 34px) !important;
    overflow:hidden !important;
}

#loungeInfoModal .modal__card--loungeInfo{
    width:min(920px, calc(100vw - 44px)) !important;
    max-height:calc(100dvh - 52px) !important;
    overflow:hidden !important;
    padding:clamp(18px, 2.5vw, 28px) clamp(22px, 4vw, 54px) !important;
    border:1px solid rgba(196,84,135,.18) !important;
    border-radius:30px !important;
    background:
            radial-gradient(circle at 50% 30%, rgba(255,255,255,.98), rgba(255,255,255,.92) 16%, rgba(255,255,255,0) 31%),
            radial-gradient(circle at top left, rgba(255,255,255,.82), rgba(255,255,255,0) 34%),
            radial-gradient(circle at 12% 18%, rgba(244,169,193,0.28), rgba(244,169,193,0) 36%),
            radial-gradient(circle at 88% 76%, rgba(232,172,203,0.20), rgba(232,172,203,0) 32%),
            linear-gradient(140deg, #fff8fb 0%, #ffe7f1 48%, #f8c4da 100%) !important;
    box-shadow:0 30px 80px rgba(42,10,27,.24), inset 0 1px 0 rgba(255,255,255,.72) !important;
    scrollbar-width:none !important;
}

#loungeInfoModal .modal__card--loungeInfo::-webkit-scrollbar{
    display:none !important;
}

#loungeInfoModal .modal__card--loungeInfo::before{
    content:"" !important;
    position:absolute !important;
    inset:-18% !important;
    z-index:-1 !important;
    background-image:url("../images/logo.png") !important;
    background-repeat:repeat !important;
    background-size:88px auto !important;
    background-position:center !important;
    opacity:.065 !important;
    transform:rotate(-24deg) scale(1.08) !important;
    transform-origin:center !important;
    pointer-events:none !important;
}

#loungeInfoModal .modal__card--loungeInfo::after{
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    z-index:-1 !important;
    background:linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,244,249,.18)) !important;
    pointer-events:none !important;
}

#loungeInfoModal .loungeInfo{
    display:block !important;
    max-width:760px !important;
    margin:0 auto !important;
    text-align:center !important;
}

#loungeInfoModal .loungeInfo__hero{
    display:none !important;
}

#loungeInfoModal .loungeInfo__copy{
    margin:0 auto !important;
    color:#25202a !important;
    text-align:center !important;
    font-size:clamp(11px, 1vw, 13px) !important;
    line-height:1.34 !important;
}

#loungeInfoModal .loungeInfo__lead{
    margin:0 0 8px !important;
    font-size:clamp(16px, 1.6vw, 20px) !important;
    line-height:1.15 !important;
    font-weight:950 !important;
}

#loungeInfoModal .loungeInfo__copy p{
    margin:0 0 7px !important;
}

#loungeInfoModal .loungeInfo__copy h3{
    margin:10px 0 5px !important;
    color:#17131b !important;
    font-size:14px !important;
    line-height:1.2 !important;
    font-weight:950 !important;
}

#loungeInfoModal .loungeInfo__tiers{
    margin:0 !important;
    padding:0 !important;
    display:grid !important;
    gap:5px !important;
    justify-items:center !important;
}

#loungeInfoModal .loungeInfo__tiers li{
    display:flex !important;
    align-items:flex-start !important;
    justify-content:center !important;
    max-width:700px !important;
    line-height:1.3 !important;
    text-align:left !important;
}

#loungeInfoModal .loungeInfo-closeFab{
    right:16px !important;
    top:16px !important;
    background:rgba(255,255,255,.88) !important;
    border-color:rgba(196,84,135,.16) !important;
    box-shadow:0 12px 28px rgba(42,10,27,.12) !important;
}

@media (max-width:640px){
    #loungeInfoModal.modal--loungeInfo{
        padding:9px !important;
    }

    #loungeInfoModal .modal__card--loungeInfo{
        width:calc(100vw - 18px) !important;
        max-height:calc(100dvh - 18px) !important;
        padding:14px 11px !important;
        border-radius:22px !important;
    }

    #loungeInfoModal .modal__card--loungeInfo::before{
        background-size:66px auto !important;
    }

    #loungeInfoModal .loungeInfo__copy{
        font-size:10.5px !important;
        line-height:1.26 !important;
    }

    #loungeInfoModal .loungeInfo__lead{
        padding-inline:28px !important;
        font-size:14px !important;
    }

    #loungeInfoModal .loungeInfo__copy h3{
        margin:6px 0 4px !important;
        font-size:12px !important;
    }

    #loungeInfoModal .loungeInfo__tiers{
        gap:3px !important;
    }
}

.screen_img{
    position:relative;
    overflow:hidden;
}

.home-slideshow{
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    opacity:0;
    transition:opacity .45s ease;
    background:#fff7fa;
}

.home-slideshow.is-active{
    opacity:1;
}

.home-slideshow__slide{
    --focal-point:center;
    position:absolute;
    inset:0;
    opacity:0;
    transform:translateX(5%);
    transition:opacity .9s ease, transform .9s ease;
}

.home-slideshow__slide img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:var(--focal-point, center);
}

.home-slideshow__slide picture{
    display:block;
    width:100%;
    height:100%;
}

.home-slideshow__slide::after{
    content:"";
    position:absolute;
    inset:0;
    background:
            linear-gradient(180deg, rgba(255,235,244,.14), rgba(255,245,249,.08) 48%, rgba(255,222,236,.18)),
            linear-gradient(90deg, rgba(255,230,240,.22), rgba(255,255,255,0) 34%, rgba(255,230,240,.18));
}

.home-slideshow__slide.is-active{
    opacity:1;
    transform:translateX(0);
    z-index:1;
}

.home-slideshow__slide.is-exiting{
    opacity:0;
    transform:translateX(-5%);
    z-index:0;
}

.screen_img__bg,
.screen_img__overlay{
    position:relative;
    z-index:1;
}

.screen_img.has-slides .screen_img__bg{
    opacity:0;
}

.screen_img.has-slides .screen_img__overlay{
    background:none !important;
}

.screen_img.has-slides .screen_img__overlay::before,
.screen_img.has-slides .screen_img__overlay::after,
.screen_img.has-slides .home-slideshow__slide::after{
    content:none !important;
    display:none !important;
    background:none !important;
}

.screen_img.has-slides .screen_img__content{
    opacity:0;
    visibility:hidden;
    transform:translateY(10px);
    pointer-events:none;
}

.home-slides-admin{
    position:absolute;
    right:clamp(16px, 3vw, 34px);
    bottom:clamp(18px, 4vw, 44px);
    z-index:3;
    min-height:42px;
    padding:0 18px;
    border:0;
    border-radius:999px;
    background:linear-gradient(180deg, #f3a1c0, #ef8a74);
    color:#fff;
    font-weight:900;
    box-shadow:0 16px 34px rgba(156,42,68,.22);
    cursor:pointer;
}

.home-slide-modal{
    position:fixed;
    inset:0;
    z-index:2800;
    display:none;
    align-items:center;
    justify-content:center;
    padding:var(--fluid-gutter);
}

.home-slide-modal.is-open{
    display:flex;
}

.home-slide-modal__backdrop{
    position:absolute;
    inset:0;
    background:rgba(18,19,26,.42);
    backdrop-filter:blur(9px);
    -webkit-backdrop-filter:blur(9px);
}

.home-slide-modal__card{
    position:relative;
    z-index:1;
    width:min(680px, calc(100vw - (var(--fluid-gutter) * 2)));
    max-height:min(86vh, 760px);
    overflow:auto;
    border-radius:28px;
    border:1px solid rgba(156,42,68,.12);
    background:rgba(255,255,255,.97);
    box-shadow:0 30px 86px rgba(42,10,27,.22);
    padding:26px;
}

.home-slide-modal__close{
    position:absolute;
    top:16px;
    right:16px;
    width:40px;
    height:40px;
    border:1px solid rgba(17,17,17,.08);
    border-radius:999px;
    background:#fff;
    color:#9C2A44;
    display:grid;
    place-items:center;
    cursor:pointer;
}

.home-slide-modal__close svg{
    width:18px;
    height:18px;
}

.home-slide-modal__head{
    padding-right:52px;
}

.home-slide-modal__title{
    margin:0;
    font-family:ui-serif, Georgia, "Times New Roman", serif;
    font-size:clamp(30px, 4vw, 42px);
    line-height:1;
    color:#9C2A44;
}

.home-slide-modal__sub{
    margin:10px 0 0;
    color:#6d6673;
    line-height:1.55;
}

.home-slide-modal__form{
    margin-top:18px;
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr)) auto;
    gap:12px;
    align-items:center;
}

.home-slide-upload{
    min-height:48px;
    display:flex;
    align-items:center;
    gap:12px;
    padding:10px 14px;
    border:1px dashed rgba(156,42,68,.28);
    border-radius:16px;
    background:#fff6fa;
    color:#9C2A44;
    font-weight:900;
    cursor:pointer;
}

.home-slide-upload input{
    min-width:0;
    width:100%;
    color:#6d6673;
}

.home-slide-modal__status{
    min-height:24px;
    margin-top:10px;
    color:#9C2A44;
    font-weight:800;
}

.home-slide-list{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
    gap:12px;
    margin-top:12px;
}

.home-slide-list__empty{
    grid-column:1 / -1;
    margin:0;
    padding:16px;
    border-radius:16px;
    background:#fff6fa;
    color:#6d6673;
}

.home-slide-item{
    overflow:hidden;
    border-radius:18px;
    border:1px solid rgba(17,17,17,.08);
    background:#fff;
}

.home-slide-item__media{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1px;
    background:rgba(156,42,68,.10);
}

.home-slide-item__media img{
    display:block;
    width:100%;
    aspect-ratio:16 / 7;
    object-fit:cover;
}

.home-slide-item__media img:nth-child(2){
    aspect-ratio:9 / 14;
}

.home-slide-item__media span{
    min-height:100%;
    display:grid;
    place-items:center;
    padding:10px;
    color:#9C2A44;
    background:#fff6fa;
    font-size:12px;
    font-weight:900;
    text-align:center;
}

.home-slide-item__delete{
    width:100%;
    min-height:40px;
    border:0;
    background:#9C2A44;
    color:#fff;
    font-weight:900;
    cursor:pointer;
}

#bestsellers .bestseller-group__grid{
    justify-content:center;
}

.screen_img.has-slides + #bestsellers{
    margin-top:clamp(-56px, -5vw, -28px) !important;
    padding-top:clamp(92px, 11vw, 124px) !important;
}

#bestsellers .bestseller-group__grid[data-count="1"]{
    grid-template-columns:minmax(250px, 340px);
    gap:clamp(14px, 2vw, 18px);
}

#bestsellers .bestseller-group__grid[data-count="2"]{
    grid-template-columns:repeat(2, minmax(250px, 340px));
    gap:clamp(14px, 2vw, 18px);
}

#bestsellers .bestseller-group__grid[data-remainder="2"] > .card:nth-last-child(2),
#bestsellers .bestseller-group__grid[data-remainder="2"] > .card:last-child{
    grid-column:auto;
}

#bestsellers .bestseller-group__grid[data-count="1"] > .card,
#bestsellers .bestseller-group__grid[data-count="2"] > .card{
    grid-column:auto;
}

#bestsellers .card,
#bestsellers .card[data-bestseller="true"]{
    background:#9C2A44;
    border-color:rgba(156,42,68,.32);
    box-shadow:0 24px 54px rgba(156,42,68,.24);
}

#bestsellers .card__body,
#bestsellers .card[data-bestseller="true"] .card__body{
    background:#9C2A44;
}

#bestsellers .card__media,
#bestsellers .card[data-bestseller="true"] .card__media{
    background:linear-gradient(180deg, #fff, #fff7fa);
    border-bottom-color:rgba(255,255,255,.22);
}

#bestsellers .card__title,
#bestsellers .card__titleLink{
    color:#FFE9A6;
}

#bestsellers .card__desc{
    color:rgba(255,255,255,.82);
}

#bestsellers .card__price,
#bestsellers .card[data-bestseller="true"] .card__price{
    color:#8c9fc9;
    border-color:rgba(255,255,255,.42);
    background:rgba(255,255,255,.88);
}

#bestsellers .card__priceCur,
#bestsellers .card[data-bestseller="true"] .card__priceCur{
    color:rgba(75,91,130,.72);
}

#bestsellers .card__tools .icon-btn{
    color:#9C2A44;
}

@media (max-width:640px){
    .home-slides-admin{
        right:14px;
        bottom:14px;
        min-height:38px;
        padding-inline:14px;
        font-size:13px;
    }

    .home-slide-modal__card{
        padding:20px 16px;
        border-radius:22px;
    }

    .home-slide-modal__form{
        grid-template-columns:1fr;
    }

    #bestsellers .bestseller-group__grid[data-count]{
        grid-template-columns:1fr;
    }
}

@media (max-width:640px){
    .screen_img.has-slides{
        min-height:calc(100dvh - 72px);
    }

    .home-slideshow__slide img{
        object-fit:contain;
        object-position:center center;
    }
}

#bestsellers .bestseller-group__title{
    max-width:100%;
    font-size:clamp(20px, 4.7vw, 28px) !important;
    line-height:1.05;
    white-space:nowrap;
    text-wrap:nowrap;
}

.lang-switcher .flag-icon,
.lang-switcher__current.flag-icon.flag-icon--emoji,
.lang-switcher__option .flag-icon.flag-icon--emoji{
    display:inline-block !important;
    width:30px !important;
    height:21px !important;
    flex:0 0 30px !important;
    border-radius:3px !important;
    overflow:hidden !important;
    box-shadow:0 0 0 1px rgba(27,27,34,.14), 0 1px 3px rgba(27,27,34,.12) !important;
    font-size:0 !important;
    line-height:0 !important;
}

.lang-switcher .flag-icon--en,
.lang-switcher .flag-icon--emoji.flag-icon--en{
    background:#012169 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 36'%3E%3CclipPath id='a'%3E%3Cpath d='M0 0h60v36H0z'/%3E%3C/clipPath%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23012169' d='M0 0h60v36H0z'/%3E%3Cpath stroke='%23fff' stroke-width='8' d='m0 0 60 36M60 0 0 36'/%3E%3Cpath stroke='%23C8102E' stroke-width='4.8' d='m0 0 60 36M60 0 0 36'/%3E%3Cpath stroke='%23fff' stroke-width='12' d='M30 0v36M0 18h60'/%3E%3Cpath stroke='%23C8102E' stroke-width='7.2' d='M30 0v36M0 18h60'/%3E%3C/g%3E%3C/svg%3E") center / cover no-repeat !important;
}

.lang-switcher .flag-icon--bg{ background:linear-gradient(180deg, #ffffff 0 33.33%, #00966e 33.33% 66.66%, #d62612 66.66% 100%) !important; }
.lang-switcher .flag-icon--de{ background:linear-gradient(180deg, #000000 0 33.33%, #dd0000 33.33% 66.66%, #ffce00 66.66% 100%) !important; }
.lang-switcher .flag-icon--es{ background:linear-gradient(180deg, #aa151b 0 25%, #f1bf00 25% 75%, #aa151b 75% 100%) !important; }
.lang-switcher .flag-icon--fr{ background:linear-gradient(90deg, #0055a4 0 33.33%, #ffffff 33.33% 66.66%, #ef4135 66.66% 100%) !important; }
.lang-switcher .flag-icon--it{ background:linear-gradient(90deg, #009246 0 33.33%, #ffffff 33.33% 66.66%, #ce2b37 66.66% 100%) !important; }
.lang-switcher .flag-icon.flag-icon--emoji.flag-icon--bg{ background:linear-gradient(180deg, #ffffff 0 33.33%, #00966e 33.33% 66.66%, #d62612 66.66% 100%) !important; }
.lang-switcher .flag-icon.flag-icon--emoji.flag-icon--de{ background:linear-gradient(180deg, #000000 0 33.33%, #dd0000 33.33% 66.66%, #ffce00 66.66% 100%) !important; }
.lang-switcher .flag-icon.flag-icon--emoji.flag-icon--es{ background:linear-gradient(180deg, #aa151b 0 25%, #f1bf00 25% 75%, #aa151b 75% 100%) !important; }
.lang-switcher .flag-icon.flag-icon--emoji.flag-icon--fr{ background:linear-gradient(90deg, #0055a4 0 33.33%, #ffffff 33.33% 66.66%, #ef4135 66.66% 100%) !important; }
.lang-switcher .flag-icon.flag-icon--emoji.flag-icon--it{ background:linear-gradient(90deg, #009246 0 33.33%, #ffffff 33.33% 66.66%, #ce2b37 66.66% 100%) !important; }

.lounge-pill--help{
    min-height:52px !important;
    width:min(168px, 22vw) !important;
    padding-inline:14px !important;
    justify-content:center;
    text-align:center;
}

.drawer--left .drawer__panel,
.drawer--left .drawer__nav,
.drawer--left #categoriesContainer{
    background:#fff !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
}

.drawer--left .drawer__link--handmade{
    background:linear-gradient(180deg, #f062aa 0%, #bc005d 45%, #890047 100%) !important;
    box-shadow:none !important;
}

.drawer--left .drawer__link--handmade::before{
    content:none !important;
    display:none !important;
}

.drawer--left .drawer__link--handmade:hover,
.drawer--left .drawer__link--handmade:focus-visible{
    background:linear-gradient(180deg, #f56eb4 0%, #ca0969 45%, #940052 100%) !important;
    box-shadow:none !important;
}

@media (max-width:640px){
    .drawer--left{
        top:72px !important;
        left:14px !important;
        right:14px !important;
        bottom:14px !important;
        width:auto !important;
    }

    .drawer--left .drawer__panel{
        height:calc(100dvh - 86px) !important;
        max-height:none !important;
        border-radius:24px 24px 30px 30px !important;
        overflow:hidden !important;
    }

    .drawer--left .drawer__nav{
        flex:1 1 auto !important;
        min-height:0 !important;
        padding-bottom:24px !important;
        overflow-y:auto !important;
        -webkit-overflow-scrolling:touch;
    }
}

@media (max-width:440px){
    .drawer--left{
        top:70px !important;
        left:12px !important;
        right:12px !important;
        bottom:12px !important;
    }

    .drawer--left .drawer__panel{
        height:calc(100dvh - 82px) !important;
        border-radius:22px 22px 28px 28px !important;
    }
}

#loungeInfoModal .modal__card--loungeInfo{
    width:min(680px, calc(100vw - 44px)) !important;
    min-height:min(560px, calc(100dvh - 52px)) !important;
    max-height:calc(100dvh - 52px) !important;
    overflow-y:auto !important;
    padding:clamp(22px, 3vw, 34px) clamp(24px, 4vw, 46px) !important;
}

#loungeInfoModal .loungeInfo{
    max-width:560px !important;
}

.lang-switcher__menu .lang-switcher__option.is-active{
    display:none !important;
}

.lang-switcher__menu .lang-switcher__option .flag-icon,
.lang-switcher__current.flag-icon{
    color:transparent !important;
    text-indent:-999px;
}

.screen_img.has-slides{
    width:100% !important;
}

.screen_img.has-slides,
.screen_img.has-slides .home-slideshow,
.screen_img.has-slides .home-slideshow__slide,
.screen_img.has-slides .home-slideshow__slide img{
    height:clamp(300px, 36vw, 540px) !important;
    min-height:300px !important;
    max-height:540px !important;
}

.screen_img.has-slides .home-slideshow__slide img{
    width:100% !important;
    max-width:100% !important;
    object-fit:contain !important;
    object-position:var(--focal-point, center) !important;
}

@supports (height:100dvh){
    .screen_img.has-slides,
    .screen_img.has-slides .home-slideshow,
    .screen_img.has-slides .home-slideshow__slide,
    .screen_img.has-slides .home-slideshow__slide img{
        height:clamp(300px, 36vw, 540px) !important;
        min-height:300px !important;
        max-height:540px !important;
    }
}

@media (max-width:760px){
    html.lang-menu-open .layout{
        transform:translateY(60px);
        transition:transform .18s ease;
    }

    .lang-switcher.is-open{
        z-index:2600;
    }

    .lang-switcher__menu{
        position:fixed !important;
        top:calc(72px + env(safe-area-inset-top, 0px)) !important;
        right:12px !important;
        left:auto !important;
        display:flex !important;
        align-items:center !important;
        gap:6px !important;
        min-width:0 !important;
        width:auto !important;
        max-width:calc(100vw - 24px) !important;
        padding:8px !important;
        border-radius:18px !important;
    }

    .lang-switcher__option{
        width:42px !important;
        min-width:42px !important;
        min-height:42px !important;
        padding:0 !important;
        justify-content:center !important;
        border-radius:12px !important;
    }

    .lang-switcher__option .flag-icon{
        width:28px !important;
        height:20px !important;
        flex-basis:28px !important;
    }
}

@media (max-width:640px){
    #loungeInfoModal.modal--loungeInfo{
        align-items:flex-start !important;
        overflow-y:auto !important;
        padding:12px 9px !important;
        -webkit-overflow-scrolling:touch;
    }

    #loungeInfoModal .modal__card--loungeInfo{
        max-height:none !important;
        min-height:0 !important;
        overflow-y:visible !important;
        scrollbar-width:auto !important;
    }

    #loungeInfoModal .modal__card--loungeInfo::-webkit-scrollbar{
        display:block !important;
        width:6px;
    }
}

.lang-switcher__menu{
    position:absolute !important;
    top:calc(100% + 12px) !important;
    right:0 !important;
    left:auto !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:6px !important;
    min-width:64px !important;
    width:auto !important;
    max-width:none !important;
    padding:8px !important;
    border-radius:20px !important;
    z-index:2601 !important;
}

.lang-switcher__option{
    width:48px !important;
    min-width:48px !important;
    min-height:42px !important;
    padding:0 !important;
    justify-content:center !important;
}

html.lang-menu-open .layout{
    transform:none !important;
}

#loungeInfoModal.modal--loungeInfo{
    align-items:center !important;
    justify-content:center !important;
    overflow:hidden !important;
    padding:clamp(14px, 3vw, 34px) !important;
}

#loungeInfoModal .modal__card--loungeInfo{
    width:min(820px, calc(100vw - 28px)) !important;
    min-height:min(680px, calc(100dvh - 28px)) !important;
    max-height:calc(100dvh - 28px) !important;
    overflow-y:auto !important;
}

#loungeInfoModal .loungeInfo{
    max-width:680px !important;
}

#loungeInfoModal .loungeInfo{
    display:flex !important;
    min-height:100% !important;
    max-width:100% !important;
    align-items:stretch !important;
}

#loungeInfoModal .loungeInfo__copy{
    width:100% !important;
    max-width:100% !important;
    min-height:100% !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:space-between !important;
    gap:clamp(10px, 1.5vw, 18px) !important;
    font-size:clamp(15px, 1.35vw, 19px) !important;
    line-height:1.45 !important;
}

#loungeInfoModal .loungeInfo__lead{
    font-size:clamp(22px, 2.2vw, 32px) !important;
    line-height:1.12 !important;
}

#loungeInfoModal .loungeInfo__copy h3{
    font-size:clamp(17px, 1.6vw, 23px) !important;
}

#loungeInfoModal .loungeInfo__tiers{
    gap:clamp(9px, 1.1vw, 14px) !important;
}

#loungeInfoModal .loungeInfo__tiers li{
    max-width:100% !important;
}

#loungeInfoModal .modal__card--loungeInfo{
    min-height:auto !important;
    padding-bottom:clamp(18px, 2.5vw, 30px) !important;
}

#loungeInfoModal .loungeInfo,
#loungeInfoModal .loungeInfo__copy{
    min-height:auto !important;
}

#loungeInfoModal .loungeInfo{
    display:block !important;
}

#loungeInfoModal .loungeInfo__copy{
    display:block !important;
    gap:0 !important;
    justify-content:flex-start !important;
}

#loungeInfoModal .loungeInfo-closeFab{
    width:42px !important;
    height:42px !important;
    right:clamp(14px, 2.4vw, 24px) !important;
    top:clamp(8px, 1.4vw, 14px) !important;
}

#loungeInfoModal .loungeInfo-closeFab svg{
    width:18px !important;
    height:18px !important;
}

html{
    text-rendering:optimizeLegibility;
    -webkit-font-smoothing:antialiased;
}

body{
    overflow-anchor:none;
}

img,
svg,
video,
canvas{
    backface-visibility:hidden;
    transform:translateZ(0);
}

.layout,
.layout__content,
.topbar,
.drawer__panel,
.modal__card,
.card,
.pp-card,
.checkout-page__card,
.checkout-page__guestCard,
.cart-page__itemRow,
.cart-page__summaryCard,
.cart-page__itemsCard,
.pd__panel,
.pd__galleryCard{
    backface-visibility:hidden;
}

.drawer__panel,
.modal__card,
.cookie-wall,
.home-slide-modal,
.pd-opinions,
.pd-custom,
.pd-custom-preview,
.cart-warning,
.pp-modal{
    will-change:auto !important;
}

.section__head,
.page__head,
.cart-page__head,
.checkout-page__head,
.pd__panel,
.pd__galleryCard,
.productsGrid,
#productsGrid,
#bestsellers,
.bestseller-group,
.card{
    opacity:1 !important;
    filter:none !important;
}

.screen_img::before,
.screen_img::after,
.screen_img__bg::before,
.screen_img__bg::after,
.screen_img__overlay::before,
.screen_img__overlay::after,
.vault-progress__bar::before,
.vault-progress__bar::after,
.vault-tierCard::before,
.vault-tierCard::after{
    animation:none !important;
}

@media (prefers-reduced-motion: no-preference){
    .drawer__panel,
    .modal__card{
        transition:
                transform .18s ease,
                opacity .18s ease,
                box-shadow .18s ease !important;
    }
}

.lounge-pill,
.lounge-pill--help{
    box-sizing:border-box !important;
    width:168px !important;
    min-height:52px !important;
    padding-inline:14px !important;
    justify-content:center !important;
    text-align:center !important;
}

@media (max-width:1180px){
    .lounge-pill,
    .lounge-pill--help{
        width:150px !important;
    }
}

header.topbar{
    position:sticky;
    top:0;
    z-index:2000;
    transition:transform .25s ease, opacity .25s ease;
    will-change:transform;
}

header.topbar.topbar--hidden{
    transform:translateY(-100%);
    opacity:.98;
    pointer-events:none;
}

html.lang-menu-open header.topbar{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:translateY(0) !important;
}

body.pp-overlay-open header.topbar,
body:has(#navToggle:checked) header.topbar,
body:has(#favToggle:checked) header.topbar,
body:has(#cartToggle:checked) header.topbar,
body:has(#profileToggle:checked) header.topbar,
body:has(#vaultToggle:checked) header.topbar,
body:has(#loungeInfoToggle:checked) header.topbar,
body:has(#catModalToggle:checked) header.topbar,
body:has(#contactModalToggle:checked) header.topbar{
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateY(calc(-100% - 12px)) !important;
}

.screen_img.has-slides{
    width:100vw !important;
    max-width:100vw !important;
    margin-left:calc(50% - 50vw) !important;
    margin-right:calc(50% - 50vw) !important;
    margin-top:0 !important;
    position:relative !important;
    z-index:0 !important;
}

.screen_img.has-slides,
.screen_img.has-slides .home-slideshow,
.screen_img.has-slides .home-slideshow__slide,
.screen_img.has-slides .home-slideshow__slide img{
    height:clamp(260px, 31vw, 480px) !important;
    min-height:260px !important;
    max-height:480px !important;
}

.screen_img.has-slides .home-slideshow__slide img{
    width:100vw !important;
    max-width:100vw !important;
    object-fit:contain !important;
    object-position:var(--focal-point, center) !important;
}

@media (max-width:760px){
    .screen_img.has-slides,
    .screen_img.has-slides .home-slideshow,
    .screen_img.has-slides .home-slideshow__slide,
    .screen_img.has-slides .home-slideshow__slide img{
        height:clamp(220px, 58vw, 360px) !important;
        min-height:220px !important;
        max-height:360px !important;
    }
}

#loungeInfoModal.modal--loungeInfo{
    align-items:center !important;
    justify-content:center !important;
}

#loungeInfoModal .modal__card--loungeInfo{
    height:auto !important;
    block-size:auto !important;
    min-height:0 !important;
    min-block-size:0 !important;
    max-height:calc(100dvh - 32px) !important;
    max-block-size:calc(100dvh - 32px) !important;
    padding-top:clamp(22px, 2.6vw, 34px) !important;
    padding-bottom:clamp(16px, 2vw, 24px) !important;
    overflow-y:auto !important;
}

#loungeInfoModal .loungeInfo,
#loungeInfoModal .loungeInfo__copy{
    display:block !important;
    height:auto !important;
    block-size:auto !important;
    min-height:0 !important;
    min-block-size:0 !important;
    max-height:none !important;
    max-block-size:none !important;
}

#loungeInfoModal .loungeInfo__copy{
    justify-content:flex-start !important;
    gap:0 !important;
}

#loungeInfoModal .loungeInfo__copy > :last-child{
    margin-bottom:0 !important;
}

#loungeInfoModal .loungeInfo-closeFab{
    position:absolute !important;
    width:36px !important;
    height:36px !important;
    top:6px !important;
    right:clamp(14px, 2.4vw, 24px) !important;
    z-index:5 !important;
}

#loungeInfoModal .loungeInfo-closeFab svg{
    width:16px !important;
    height:16px !important;
}

@media (max-width:640px){
    #loungeInfoModal .modal__card--loungeInfo{
        max-height:calc(100dvh - 18px) !important;
        max-block-size:calc(100dvh - 18px) !important;
        padding-top:28px !important;
        padding-bottom:16px !important;
    }

    #loungeInfoModal .loungeInfo-closeFab{
        width:34px !important;
        height:34px !important;
        top:5px !important;
        right:12px !important;
    }
}

.screen_img.has-slides,
.screen_img.has-slides .home-slideshow,
.screen_img.has-slides .home-slideshow__slide,
.screen_img.has-slides .home-slideshow__slide picture,
.screen_img.has-slides .home-slideshow__slide img{
    height:clamp(420px, 42vw, 560px) !important;
    min-height:420px !important;
    max-height:560px !important;
}

.screen_img.has-slides .home-slideshow__slide picture,
.screen_img.has-slides .home-slideshow__slide img{
    width:100% !important;
    max-width:100% !important;
}

.screen_img.has-slides .home-slideshow__slide img{
    object-fit:cover !important;
    object-position:var(--focal-point, center) !important;
}

@media (max-width:760px){
    .screen_img.has-slides,
    .screen_img.has-slides .home-slideshow,
    .screen_img.has-slides .home-slideshow__slide,
    .screen_img.has-slides .home-slideshow__slide picture,
    .screen_img.has-slides .home-slideshow__slide img{
        height:min(72vh, 540px) !important;
        min-height:430px !important;
        max-height:540px !important;
    }

    .screen_img.has-slides .home-slideshow__slide img{
        object-fit:cover !important;
        object-position:center !important;
    }
}

#vaultModal{
    place-items:center !important;
    padding:clamp(12px, 3vw, 28px) !important;
}

#vaultModal .modal__card--vault{
    --vault-inner-width:min(458px, 100%) !important;
    --vault-inner-shift:0px !important;
    width:min(510px, calc(100vw - 24px)) !important;
    max-width:510px !important;
    max-height:calc(100dvh - 28px) !important;
    overflow:auto !important;
    display:grid !important;
    justify-items:center !important;
    gap:10px !important;
    padding:18px 26px 24px !important;
    border-radius:30px !important;
    border:1px solid rgba(255,255,255,.82) !important;
    background:
            radial-gradient(circle at 50% 6%, rgba(255,255,255,.98) 0 18%, rgba(255,255,255,0) 42%),
            linear-gradient(180deg, rgba(255,250,253,.98), rgba(255,236,244,.97) 58%, rgba(255,222,234,.96)) !important;
    box-shadow:0 34px 78px rgba(87,53,70,.26) !important;
    transform:none !important;
    scrollbar-width:none !important;
}

#vaultModal .modal__card--vault::-webkit-scrollbar{
    display:none !important;
}

#vaultModal .modal__card--vault::before{
    content:none !important;
}

#vaultModal .modal__card--vault .vault-head,
#vaultModal .modal__card--vault .vault-shell{
    width:var(--vault-inner-width) !important;
    max-width:var(--vault-inner-width) !important;
    margin-inline:auto !important;
    transform:none !important;
}

#vaultModal .modal__card--vault .vault-head{
    display:grid !important;
    justify-items:center !important;
    gap:8px !important;
    padding:8px 20px 14px !important;
    border-radius:26px !important;
    border:1px solid rgba(236,181,205,.58) !important;
    background:linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,246,250,.70)) !important;
    box-shadow:none !important;
}

#vaultModal .modal__card--vault .vault-title{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;
    margin:0 !important;
    font-size:42px !important;
    line-height:1 !important;
    font-weight:1000 !important;
    letter-spacing:0 !important;
    color:#df4b96 !important;
    -webkit-text-fill-color:#df4b96 !important;
    background:none !important;
}

#vaultModal .modal__card--vault .vault-title__emoji{
    display:inline-flex !important;
    width:22px !important;
    height:22px !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:18px !important;
    color:#3298ef !important;
    -webkit-text-fill-color:#3298ef !important;
}

#vaultModal .modal__card--vault .vault-icon{
    width:84px !important;
    height:84px !important;
    border-radius:28px !important;
    border:1px solid rgba(229,95,156,.32) !important;
    background:linear-gradient(180deg, #fff, #fff5fa) !important;
    box-shadow:0 14px 28px rgba(203,79,145,.12) !important;
}

#vaultModal .modal__card--vault .vault-icon__image{
    width:42px !important;
    height:42px !important;
    object-fit:contain !important;
}

#vaultModal .modal__card--vault .vault-sub{
    margin:0 !important;
    color:#9f7087 !important;
    font-size:10px !important;
    font-weight:1000 !important;
    letter-spacing:.24em !important;
    text-transform:uppercase !important;
}

#vaultModal .modal__card--vault .vault-shell{
    display:grid !important;
    gap:14px !important;
    justify-items:stretch !important;
}

#vaultModal .modal__card--vault .vault-stats--grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:12px !important;
    width:100% !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    overflow:visible !important;
}

#vaultModal .modal__card--vault .vault-stats--grid::after{
    content:none !important;
}

#vaultModal .modal__card--vault .vault-statCard{
    min-height:110px !important;
    padding:18px 16px !important;
    border-radius:20px !important;
    border:1px solid rgba(243,212,226,.72) !important;
    background:rgba(255,255,255,.82) !important;
    box-shadow:0 16px 32px rgba(104,70,88,.06) !important;
    text-align:center !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
}

#vaultModal .modal__card--vault .vault-statCard__label,
#vaultModal .modal__card--vault .vault-metaCard__label,
#vaultModal .modal__card--vault .vault-progress__label{
    color:#aa7b93 !important;
    font-size:14px !important;
    font-weight:1000 !important;
    letter-spacing:.14em !important;
    text-transform:uppercase !important;
}

#vaultModal .modal__card--vault .vault-statCard__value{
    margin-top:14px !important;
    display:flex !important;
    align-items:baseline !important;
    justify-content:center !important;
    gap:6px !important;
    min-height:30px !important;
    color:#cc4d8d !important;
    font-size:30px !important;
    font-weight:1000 !important;
    line-height:1 !important;
}

#vaultModal .modal__card--vault .vault-statCard__value span:last-child{
    color:#6f6a72 !important;
    font-size:14px !important;
    font-weight:1000 !important;
}

#vaultModal .modal__card--vault .vault-statCard--value .vault-statCard__value,
#vaultModal .modal__card--vault .vault-statCard__value--accent{
    color:#6fb0d5 !important;
}

#vaultModal .modal__card--vault .vault-statCard__expiry{
    margin-top:8px !important;
    color:#bb668d !important;
    font-size:11px !important;
    font-weight:1000 !important;
    letter-spacing:.09em !important;
}

#vaultModal .modal__card--vault .vault-tierCard{
    --vault-tier-circle-size:52px !important;
    --vault-tier-rail-height:7px !important;
    --vault-tier-rail-inset:24px !important;
    width:100% !important;
    padding:10px 16px 12px !important;
    border-radius:20px !important;
    border:1px solid rgba(243,212,226,.72) !important;
    background:rgba(255,255,255,.72) !important;
    box-shadow:0 16px 32px rgba(104,70,88,.06) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__rail,
#vaultModal .modal__card--vault .vault-tierCard__fill{
    top:calc(10px + (var(--vault-tier-circle-size) / 2) - (var(--vault-tier-rail-height) / 2)) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__rail{
    background:linear-gradient(90deg, rgba(255,160,201,.18), rgba(255,255,255,.92), rgba(255,160,201,.18)) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__fill{
    background:linear-gradient(90deg, #f58cbd, #d5549c, #76b9e3) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__circle{
    width:var(--vault-tier-circle-size) !important;
    height:var(--vault-tier-circle-size) !important;
    min-width:var(--vault-tier-circle-size) !important;
    min-height:var(--vault-tier-circle-size) !important;
    margin:0 auto 8px !important;
    border-radius:999px !important;
    border:2px solid rgba(236,181,205,.72) !important;
    background:rgba(255,255,255,.72) !important;
    box-shadow:none !important;
    overflow:visible !important;
}

#vaultModal .modal__card--vault .vault-tierCard__gem{
    position:static !important;
    width:34px !important;
    height:34px !important;
    opacity:.72 !important;
    transform:none !important;
    filter:none !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-earned .vault-tierCard__gem,
#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__gem{
    opacity:1 !important;
    transform:none !important;
}

#vaultModal .modal__card--vault .vault-tierCard__emoji--diamond{
    color:#69b4df !important;
    -webkit-text-fill-color:#69b4df !important;
    font-size:30px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__name{
    color:#c67aa0 !important;
    font-size:13px !important;
    font-weight:1000 !important;
    letter-spacing:0 !important;
}

#vaultModal .modal__card--vault .vault-tierCard__meta{
    color:#b692a4 !important;
    background:#fff !important;
    font-size:11px !important;
    font-weight:1000 !important;
    padding:2px 6px !important;
}

#vaultModal .modal__card--vault .vault-metaCard{
    width:100% !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}

#vaultModal .modal__card--vault .vault-metaCard__content{
    padding:0 !important;
}

#vaultModal .modal__card--vault .vault-metaCard__panel{
    min-height:104px !important;
    padding:22px 20px !important;
    border-radius:20px !important;
    border:1px dashed rgba(230,118,168,.72) !important;
    background:rgba(255,255,255,.70) !important;
    box-shadow:none !important;
}

#vaultModal .modal__card--vault .vault-metaCard__summary{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    align-items:center !important;
    justify-items:center !important;
    gap:18px !important;
    height:100% !important;
    padding:0 !important;
}

#vaultModal .modal__card--vault .vault-metaCard__group{
    display:grid !important;
    justify-items:center !important;
    gap:10px !important;
    text-align:center !important;
}

#vaultModal .modal__card--vault .vault-metaCard__value{
    margin:0 !important;
    color:#cc4d8d !important;
    font-size:28px !important;
    font-weight:1000 !important;
    line-height:1 !important;
}

#vaultModal .modal__card--vault .vault-progressCard{
    width:100% !important;
    min-height:104px !important;
    padding:16px 18px !important;
    border-radius:18px !important;
    border:1px solid rgba(243,212,226,.72) !important;
    background:rgba(255,255,255,.82) !important;
    box-shadow:0 16px 32px rgba(104,70,88,.06) !important;
}

#vaultModal .modal__card--vault .vault-progress__top{
    display:grid !important;
    grid-template-columns:minmax(0, 1fr) auto !important;
    gap:12px !important;
    align-items:start !important;
}

#vaultModal .modal__card--vault .vault-progress__hint{
    margin-top:4px !important;
    color:#c0578c !important;
    font-size:12px !important;
    font-weight:800 !important;
}

#vaultModal .modal__card--vault .vault-progress__value{
    min-width:74px !important;
    min-height:44px !important;
    padding:0 16px !important;
    border-radius:999px !important;
    border:1px solid rgba(243,212,226,.90) !important;
    background:#fff !important;
    color:#cc4d8d !important;
    font-size:25px !important;
    font-weight:1000 !important;
}

#vaultModal .modal__card--vault .vault-progress__bar{
    height:17px !important;
    margin-top:12px !important;
    border:1px solid rgba(218,176,195,.72) !important;
    background:linear-gradient(180deg, #fff, #f7edf2) !important;
}

#vaultModal .modal__card--vault .vault-progress__fill{
    min-width:18px !important;
    background:linear-gradient(90deg, #ff93c5, #e15098) !important;
    animation:none !important;
}

#vaultModal .modal__card--vault .vault-closeBtn{
    display:none !important;
}

@media (max-width:560px){
    #vaultModal .modal__card--vault{
        width:calc(100vw - 14px) !important;
        padding:14px 16px 18px !important;
        border-radius:26px !important;
    }

    #vaultModal .modal__card--vault{
        --vault-inner-width:100% !important;
    }

    #vaultModal .modal__card--vault .vault-title{
        font-size:34px !important;
    }

    #vaultModal .modal__card--vault .vault-stats--grid{
        gap:10px !important;
    }

    #vaultModal .modal__card--vault .vault-statCard{
        min-height:96px !important;
        padding:14px 10px !important;
    }

    #vaultModal .modal__card--vault .vault-statCard__label,
    #vaultModal .modal__card--vault .vault-metaCard__label,
    #vaultModal .modal__card--vault .vault-progress__label{
        font-size:12px !important;
    }

    #vaultModal .modal__card--vault .vault-statCard__value{
        font-size:24px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard{
        --vault-tier-circle-size:46px !important;
        --vault-tier-rail-inset:18px !important;
        padding-inline:8px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__name{
        font-size:11px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__meta{
        font-size:10px !important;
    }
}

.topbar .lounge-pill{
    appearance:none !important;
    width:auto !important;
    min-width:132px !important;
    max-width:176px !important;
    min-height:44px !important;
    padding:0 16px !important;
    border-radius:999px !important;
    border:1px solid rgba(196,84,135,.22) !important;
    background:
            radial-gradient(circle at 22% 20%, rgba(255,255,255,.72), transparent 38%),
            linear-gradient(135deg, #f74f9f 0%, #c45487 54%, #ec7f72 100%) !important;
    box-shadow:0 16px 34px rgba(196,84,135,.24) !important;
    color:#fff !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
    font-size:13px !important;
    font-weight:900 !important;
    line-height:1.1 !important;
    text-align:center !important;
    text-decoration:none !important;
    white-space:nowrap !important;
    cursor:pointer !important;
    pointer-events:auto !important;
}

.topbar .lounge-pill--help{
    background:
            radial-gradient(circle at 22% 20%, rgba(255,255,255,.65), transparent 38%),
            linear-gradient(135deg, #d91f6b 0%, #a91558 100%) !important;
}

.topbar .lounge-pill--primary{
    background:
            radial-gradient(circle at 22% 20%, rgba(255,255,255,.72), transparent 38%),
            linear-gradient(135deg, #ff91b4 0%, #e4637b 100%) !important;
    box-shadow:0 16px 34px rgba(226,99,123,.24) !important;
}

.topbar .lounge-pill--help{
    background:
            radial-gradient(circle at 22% 20%, rgba(255,255,255,.72), transparent 38%),
            linear-gradient(135deg, #ff91b4 0%, #e4637b 100%) !important;
    box-shadow:0 16px 34px rgba(226,99,123,.24) !important;
}

.topbar .lounge-pill:hover,
.topbar .lounge-pill:focus-visible{
    transform:translateY(-1px) !important;
    filter:brightness(1.02) !important;
    box-shadow:0 20px 40px rgba(196,84,135,.30) !important;
    outline:none !important;
}

@media (max-width:980px){
    .topbar .lounge-pill{
        display:none !important;
    }
}

#vaultModal .modal__card--vault{
    --vault-inner-width:min(500px, 100%) !important;
    width:min(560px, calc(100vw - 24px)) !important;
    max-width:560px !important;
    padding:20px 30px 28px !important;
    background:
            radial-gradient(circle at 50% 5%, rgba(255,255,255,1) 0 18%, rgba(255,255,255,0) 42%),
            linear-gradient(180deg, rgba(255,248,252,.99), rgba(255,225,237,.99) 58%, rgba(255,205,224,.98)) !important;
    box-shadow:0 38px 84px rgba(126,62,92,.30) !important;
}

#vaultModal .modal__card--vault .vault-head{
    padding:12px 24px 18px !important;
    border-color:rgba(225,72,145,.28) !important;
    background:linear-gradient(180deg, rgba(255,255,255,.90), rgba(255,239,247,.82)) !important;
}

#vaultModal .modal__card--vault .vault-title{
    font-size:46px !important;
    color:#e04496 !important;
    -webkit-text-fill-color:#e04496 !important;
}

#vaultModal .modal__card--vault .vault-title__emoji{
    color:#178eea !important;
    -webkit-text-fill-color:#178eea !important;
}

#vaultModal .modal__card--vault .vault-icon{
    width:94px !important;
    height:94px !important;
    border-color:rgba(224,68,150,.44) !important;
    box-shadow:0 18px 34px rgba(203,63,139,.20) !important;
}

#vaultModal .modal__card--vault .vault-icon__image{
    width:56px !important;
    height:56px !important;
}

#vaultModal .modal__card--vault .vault-statCard,
#vaultModal .modal__card--vault .vault-tierCard,
#vaultModal .modal__card--vault .vault-progressCard{
    border-color:rgba(231,149,188,.78) !important;
    background:rgba(255,255,255,.88) !important;
}

#vaultModal .modal__card--vault .vault-statCard__label,
#vaultModal .modal__card--vault .vault-metaCard__label,
#vaultModal .modal__card--vault .vault-progress__label{
    color:#a95d83 !important;
}

#vaultModal .modal__card--vault .vault-statCard__value,
#vaultModal .modal__card--vault .vault-metaCard__value,
#vaultModal .modal__card--vault .vault-progress__value{
    color:#d3468f !important;
}

#vaultModal .modal__card--vault .vault-statCard--value .vault-statCard__value,
#vaultModal .modal__card--vault .vault-statCard__value--accent{
    color:#4fa3d0 !important;
}

#vaultModal .modal__card--vault .vault-progress__fill{
    background:linear-gradient(90deg, #ff72b4, #d7358d) !important;
}

@media (max-width:560px){
    #vaultModal .modal__card--vault{
        width:calc(100vw - 12px) !important;
        padding:16px 18px 20px !important;
    }

    #vaultModal .modal__card--vault .vault-title{
        font-size:36px !important;
    }

    #vaultModal .modal__card--vault .vault-icon{
        width:82px !important;
        height:82px !important;
    }

    #vaultModal .modal__card--vault .vault-icon__image{
        width:48px !important;
        height:48px !important;
    }
}

#vaultModal .modal__card--vault .vault-tierCard__rail{
    background:linear-gradient(90deg, rgba(255,232,243,.72), rgba(247,180,213,.86), rgba(255,232,243,.72)) !important;
    box-shadow:inset 0 1px 2px rgba(154,76,113,.10) !important;
    z-index:0 !important;
}

#vaultModal .modal__card--vault .vault-tierCard__fill{
    overflow:hidden !important;
    background:linear-gradient(90deg, #ff7abc 0%, #df3c95 54%, #5fb3df 100%) !important;
    box-shadow:0 0 18px rgba(223,60,149,.28), 0 8px 18px rgba(211,53,141,.22) !important;
    transition:width 900ms cubic-bezier(.22, 1, .36, 1) !important;
    animation:vault-tier-line-glow 3s ease-in-out infinite !important;
    z-index:0 !important;
}

#vaultModal .modal__card--vault .vault-tierCard__fill::after{
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    width:42% !important;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.70), transparent) !important;
    transform:translateX(-120%) !important;
    animation:vault-tier-line-sheen 2.8s ease-in-out infinite !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-earned .vault-tierCard__circle,
#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__circle{
    border-color:rgba(211,53,141,.58) !important;
    background:radial-gradient(circle at 30% 22%, #fff 0%, var(--vault-tier-bg) 62%, rgba(255,230,242,.98) 100%) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-earned .vault-tierCard__gem{
    opacity:.96 !important;
    filter:saturate(1.2) contrast(1.08) brightness(1.06) drop-shadow(0 6px 10px rgba(196,84,135,.18)) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-current{
    transform:translateY(-4px) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__circle{
    box-shadow:
            0 16px 30px rgba(211,53,141,.24),
            0 0 0 6px rgba(255,114,180,.18),
            inset 0 0 18px rgba(255,255,255,.90) !important;
    animation:vault-tier-current-pulse 2.25s ease-in-out infinite !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__gem{
    opacity:1 !important;
    width:42px !important;
    height:42px !important;
    max-width:42px !important;
    max-height:42px !important;
    filter:saturate(1.42) contrast(1.16) brightness(1.16) drop-shadow(0 9px 14px rgba(211,53,141,.30)) !important;
    transform:scale(1.16) !important;
    animation:vault-tier-gem-float 2.25s ease-in-out infinite !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-upcoming .vault-tierCard__gem,
#vaultModal .modal__card--vault .vault-tierCard__step.is-upcoming .vault-tierCard__emoji--diamond{
    opacity:.32 !important;
    filter:saturate(.55) contrast(.92) brightness(1.08) !important;
    transform:scale(.92) !important;
}

#vaultModal .modal__card--vault #vault-tier-pearl.is-current .vault-tierCard__circle{
    border-color:rgba(211,53,141,.70) !important;
    background:
            radial-gradient(circle at 30% 22%, #fff 0%, #ffe6f2 48%, #ffd0e5 100%) !important;
    box-shadow:
            0 18px 34px rgba(211,53,141,.28),
            0 0 0 7px rgba(255,114,180,.20),
            inset 0 0 20px rgba(255,255,255,.94) !important;
}

#vaultModal .modal__card--vault #vault-tier-pearl.is-current .vault-tierCard__gem--pearl{
    width:50px !important;
    height:50px !important;
    max-width:50px !important;
    max-height:50px !important;
    opacity:1 !important;
    filter:saturate(1.6) contrast(1.22) brightness(1.10) drop-shadow(0 10px 16px rgba(211,53,141,.34)) !important;
    transform:scale(1.20) !important;
}

#vaultModal .modal__card--vault #vault-tier-pearl.is-current .vault-tierCard__name,
#vaultModal .modal__card--vault #vault-tier-pearl.is-current .vault-tierCard__meta{
    color:#d7358d !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__emoji--diamond{
    color:#30a9e5 !important;
    font-size:39px !important;
    filter:saturate(1.35) contrast(1.12) brightness(1.12) drop-shadow(0 8px 12px rgba(48,169,229,.32)) !important;
    animation:vault-tier-gem-float 2.25s ease-in-out infinite !important;
}

@keyframes vault-tier-line-glow{
    0%, 100%{
        filter:saturate(1) brightness(1);
        box-shadow:0 0 16px rgba(223,60,149,.24), 0 8px 18px rgba(211,53,141,.18);
    }
    50%{
        filter:saturate(1.2) brightness(1.08);
        box-shadow:0 0 24px rgba(223,60,149,.36), 0 10px 22px rgba(95,179,223,.22);
    }
}

@keyframes vault-tier-line-sheen{
    0%, 28%{
        transform:translateX(-120%);
    }
    68%, 100%{
        transform:translateX(240%);
    }
}

#vaultModal {
    align-items: center !important;
    justify-items: center !important;
    padding: clamp(6px, 2vw, 14px) !important;
}

#vaultModal .modal__card--vault {
    width: min(560px, calc(100vw - 16px)) !important;
    max-width: none !important;
    max-height: calc(100vh - 24px) !important;
    overflow-y: auto !important;
    padding: 18px !important;
    border-radius: 26px !important;
    border: 1px solid rgba(255, 210, 230, 0.65) !important;
    background: radial-gradient(circle at 20% 0%, rgba(255, 255, 255, 0.96), rgba(255, 232, 242, 0.90) 44%, rgba(255, 210, 230, 0.86) 100%) !important;
    box-shadow: 0 26px 70px rgba(75, 18, 42, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.78) !important;
    transform: none !important;
}

#vaultModal .modal__card--vault::before,
#vaultModal .modal__card--vault::after {
    content: none !important;
    display: none !important;
}

#vaultModal .modal__card--vault .vault-head,
#vaultModal .modal__card--vault .vault-shell {
    width: 100% !important;
    max-width: 100% !important;
    justify-self: stretch !important;
    margin-inline: 0 !important;
    transform: none !important;
}

#vaultModal .vault-head {
    display: grid !important;
    justify-items: center !important;
    align-content: center !important;
    gap: 12px !important;
    min-height: 226px !important;
    padding: 28px 18px 24px !important;
    border-radius: 24px !important;
    border: 1.5px solid rgba(230, 154, 188, 0.45) !important;
    background: rgba(255, 255, 255, 0.72) !important;
    box-shadow: 0 18px 38px rgba(196, 84, 135, 0.13) !important;
    text-align: center !important;
}

#vaultModal .vault-title {
    margin: 0 !important;
    font-size: clamp(32px, 7vw, 46px) !important;
    line-height: 1.05 !important;
    letter-spacing: -0.04em !important;
    color: #e64d9a !important;
    background: none !important;
    -webkit-text-fill-color: initial !important;
}

#vaultModal .vault-title::before,
#vaultModal .vault-title::after,
#vaultModal .vault-title__emoji {
    display: none !important;
    content: none !important;
}

#vaultModal .vault-icon {
    width: 92px !important;
    height: 92px !important;
    border-radius: 28px !important;
    border: 1px solid rgba(230, 154, 188, 0.45) !important;
    background: rgba(255, 255, 255, 0.88) !important;
    box-shadow: 0 12px 28px rgba(196, 84, 135, 0.12) !important;
    display: grid !important;
    place-items: center !important;
    overflow: hidden !important;
}

#vaultModal .vault-icon::before,
#vaultModal .vault-icon::after {
    content: none !important;
    display: none !important;
}

#vaultModal .vault-icon__image {
    display: block !important;
    width: 58px !important;
    height: 58px !important;
    max-width: 58px !important;
    max-height: 58px !important;
    object-fit: contain !important;
    margin: 0 !important;
    filter: none !important;
    transform: none !important;
}

#vaultModal .vault-sub {
    margin: 0 !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
    color: rgba(166, 82, 120, 0.78) !important;
}

#vaultModal .vault-guest {
    display: grid !important;
    gap: 14px !important;
    margin-top: 16px !important;
}

#vaultModal .vault-stats,
#vaultModal .vault-stats--grid,
#vaultModal .vault-tierCard,
#vaultModal .vault-metaCard,
#vaultModal .vault-progressCard {
    width: 100% !important;
    max-width: 100% !important;
    justify-self: stretch !important;
}

#vaultModal .vault-tierCard__step {
    transform: none !important;
}

#vaultModal .vault-tierCard__circle,
#vaultModal .vault-tierCard__gemWrap,
#vaultModal .vault-tierCard__icon {
    display: grid !important;
    place-items: center !important;
}

#vaultModal .vault-tierCard__circle {
    overflow: visible !important;
}

#vaultModal .vault-tierCard__gemWrap,
#vaultModal .vault-tierCard__icon {
    overflow: hidden !important;
    border-radius: 999px !important;
}

#vaultModal .vault-tierCard__gem {
    width: 32px !important;
    height: 32px !important;
    max-width: 32px !important;
    max-height: 32px !important;
    object-fit: contain !important;
    transform: none !important;
    animation: none !important;
}

#vaultModal .vault-tierCard__step.is-current .vault-tierCard__gem {
    width: 34px !important;
    height: 34px !important;
    max-width: 34px !important;
    max-height: 34px !important;
    transform: none !important;
    animation: none !important;
    filter: saturate(1.45) contrast(1.16) brightness(1.18) drop-shadow(0 6px 10px rgba(211, 53, 141, .22)) !important;
}

#vaultModal .vault-tierCard__emoji--diamond {
    font-size: 24px !important;
    line-height: 1 !important;
    transform: none !important;
    animation: none !important;
}

#vaultModal .vault-tierCard__step.is-current .vault-tierCard__emoji--diamond {
    font-size: 26px !important;
    filter: saturate(1.25) contrast(1.1) brightness(1.15) drop-shadow(0 6px 10px rgba(48, 169, 229, .22)) !important;
}

@media (max-width: 560px) {
    #vaultModal {
        align-items: center !important;
        justify-items: center !important;
        padding: 4px !important;
    }

    #vaultModal .modal__card--vault {
        width: calc(100vw - 8px) !important;
        max-width: none !important;
        max-height: calc(100vh - 12px) !important;
        margin: auto !important;
        padding: 10px !important;
        transform: none !important;
    }

    #vaultModal .modal__card--vault .vault-head {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 226px !important;
        align-content: center !important;
        justify-content: center !important;
        justify-items: center !important;
        padding: 22px 14px !important;
    }

    #vaultModal .vault-title {
        font-size: clamp(36px, 10vw, 42px) !important;
    }

    #vaultModal .vault-icon {
        width: 86px !important;
        height: 86px !important;
        border-radius: 26px !important;
    }

    #vaultModal .vault-icon__image {
        width: 52px !important;
        height: 52px !important;
        max-width: 52px !important;
        max-height: 52px !important;
    }

    #vaultModal .vault-tierCard__gem {
        width: 28px !important;
        height: 28px !important;
        max-width: 28px !important;
        max-height: 28px !important;
    }

    #vaultModal .vault-tierCard__step.is-current .vault-tierCard__gem {
        width: 30px !important;
        height: 30px !important;
        max-width: 30px !important;
        max-height: 30px !important;
    }

    #vaultModal .vault-tierCard__emoji--diamond {
        font-size: 23px !important;
    }

    #vaultModal .vault-tierCard__step.is-current .vault-tierCard__emoji--diamond {
        font-size: 24px !important;
    }
}

/* =========================================================
   FINAL OVERRIDE: Lounge tier taskbar + level states
   ========================================================= */

#vaultModal .vault-tierCard {
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 18px 26px 16px !important;
    overflow: visible !important;
    border-radius: 22px !important;
    background: rgba(255, 255, 255, 0.92) !important;
    border: 1px solid rgba(224, 67, 149, 0.22) !important;
    box-shadow: 0 14px 30px rgba(196, 84, 135, 0.10) !important;

    --vault-tier-circle-size: 58px !important;
    --vault-tier-rail-height: 8px !important;
    --vault-tier-rail-inset: 42px !important;
}

#vaultModal .vault-tierCard__rail {
    position: absolute !important;
    left: var(--vault-tier-rail-inset) !important;
    right: var(--vault-tier-rail-inset) !important;
    top: calc(18px + (var(--vault-tier-circle-size) / 2) - (var(--vault-tier-rail-height) / 2)) !important;
    height: var(--vault-tier-rail-height) !important;
    width: auto !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #f7d6e6 0%, #ffffff 50%, #f7d6e6 100%) !important;
    box-shadow: inset 0 1px 2px rgba(196, 84, 135, 0.12) !important;
    z-index: 1 !important;
}

#vaultModal .vault-tierCard__fill {
    position: absolute !important;
    left: var(--vault-tier-rail-inset) !important;
    right: auto !important;
    width: calc(100% - (var(--vault-tier-rail-inset) * 2)) !important;
    top: calc(18px + (var(--vault-tier-circle-size) / 2) - (var(--vault-tier-rail-height) / 2)) !important;
    height: var(--vault-tier-rail-height) !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #ff9ac6 0%, #e64d9a 55%, #b95cff 100%) !important;
    box-shadow: 0 0 18px rgba(230, 77, 154, 0.34), 0 6px 16px rgba(230, 77, 154, 0.24) !important;
    z-index: 2 !important;
    overflow: hidden !important;
    transform: scaleX(0);
    transform-origin: left center !important;
    transition: transform 650ms cubic-bezier(.22, 1, .36, 1) !important;
    animation: vault-tier-line-glow 3s ease-in-out infinite !important;
}

#vaultModal .vault-tierCard__fill::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    width: 40% !important;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.58), transparent) !important;
    transform: translateX(-120%) !important;
    animation: vault-tier-line-sheen 2.8s ease-in-out infinite !important;
}

#vaultModal .vault-tierCard__steps {
    position: relative !important;
    z-index: 3 !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 10px !important;
    align-items: start !important;
}

#vaultModal .vault-tierCard__step {
    text-align: center !important;
    opacity: 1 !important;
    transform: none !important;
}

/* Circle base */
#vaultModal .vault-tierCard__circle {
    width: var(--vault-tier-circle-size) !important;
    height: var(--vault-tier-circle-size) !important;
    margin: 0 auto 10px !important;
    border-radius: 999px !important;
    display: grid !important;
    place-items: center !important;
    overflow: hidden !important;
    background: #fff7fb !important;
    border: 2px solid rgba(244, 174, 207, 0.72) !important;
    box-shadow: 0 8px 18px rgba(196, 84, 135, 0.10) !important;
}

/* Upcoming / locked levels */
#vaultModal .vault-tierCard__step.is-upcoming .vault-tierCard__circle {
    background: #fff8fb !important;
    border-color: rgba(244, 174, 207, 0.45) !important;
    box-shadow: none !important;
}

#vaultModal .vault-tierCard__step.is-upcoming .vault-tierCard__gem,
#vaultModal .vault-tierCard__step.is-upcoming .vault-tierCard__emoji--diamond {
    opacity: 0.26 !important;
    filter: grayscale(0.35) saturate(0.55) brightness(1.18) !important;
}

/* Earned levels */
#vaultModal .vault-tierCard__step.is-earned .vault-tierCard__circle {
    background: radial-gradient(circle at 35% 25%, #ffffff 0%, #ffe1ef 100%) !important;
    border-color: rgba(230, 77, 154, 0.58) !important;
    box-shadow: 0 12px 26px rgba(230, 77, 154, 0.20) !important;
}

#vaultModal .vault-tierCard__step.is-earned .vault-tierCard__gem,
#vaultModal .vault-tierCard__step.is-earned .vault-tierCard__emoji--diamond {
    opacity: 1 !important;
    filter: saturate(1.25) contrast(1.08) brightness(1.08) drop-shadow(0 4px 8px rgba(196, 84, 135, 0.18)) !important;
}

/* Current level */
#vaultModal .vault-tierCard__step.is-current .vault-tierCard__circle {
    background: radial-gradient(circle at 35% 25%, #ffffff 0%, #ffd0e6 100%) !important;
    border-color: rgba(224, 67, 149, 0.85) !important;
    box-shadow:
            0 0 0 5px rgba(230, 77, 154, 0.16),
            0 0 24px rgba(255, 105, 180, 0.42),
            0 16px 32px rgba(230, 77, 154, 0.30),
            inset 0 0 18px rgba(255,255,255,.92) !important;
    animation: vault-tier-current-pulse 2.25s ease-in-out infinite !important;
}

#vaultModal .vault-tierCard__step.is-current .vault-tierCard__gem,
#vaultModal .vault-tierCard__step.is-current .vault-tierCard__emoji--diamond {
    opacity: 1 !important;
    filter: saturate(1.55) contrast(1.18) brightness(1.16) drop-shadow(0 7px 13px rgba(211, 53, 141, 0.32)) !important;
    animation: vault-tier-gem-float 2.25s ease-in-out infinite !important;
}

/* Icons sizes */
#vaultModal .vault-tierCard__gem {
    display: block !important;
    width: 36px !important;
    height: 36px !important;
    max-width: 36px !important;
    max-height: 36px !important;
    object-fit: contain !important;
    transform: none !important;
    animation: none !important;
}

#vaultModal .vault-tierCard__gem--pearl {
    width: 32px !important;
    height: 32px !important;
    max-width: 32px !important;
    max-height: 32px !important;
}

#vaultModal .vault-tierCard__gem--diamond {
    width: 38px !important;
    height: 38px !important;
    max-width: 38px !important;
    max-height: 38px !important;
}

#vaultModal .vault-tierCard__emoji--diamond {
    font-size: 28px !important;
    line-height: 1 !important;
    transform: none !important;
    animation: none !important;
}

#vaultModal .vault-tierCard__name {
    opacity: 1 !important;
    font-weight: 900 !important;
}

#vaultModal .vault-tierCard__meta {
    opacity: 1 !important;
}

/* Bottom progress card */
#vaultModal .vault-progressCard {
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 20px !important;
    padding: 18px 20px !important;
    border-radius: 24px !important;
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,247,251,.98)) !important;
    border: 1px solid rgba(224, 67, 149, 0.26) !important;
    box-shadow: 0 14px 30px rgba(196, 84, 135, 0.10) !important;
}

#vaultModal .vault-progress__bar {
    width: 100% !important;
    height: 18px !important;
    margin-top: 12px !important;
    padding: 3px !important;
    border-radius: 999px !important;
    overflow: hidden !important;
    background: linear-gradient(180deg, #ffffff, #f4edf1) !important;
    border: 1px solid rgba(196, 84, 135, 0.18) !important;
}

#vaultModal .vault-progress__fill {
    display: block !important;
    min-width: 4px !important;
    height: 100% !important;
    border-radius: 999px !important;
    opacity: 1 !important;
    visibility: visible !important;
    background: linear-gradient(90deg, #ff93c1 0%, #f04a9f 58%, #d93fd0 100%) !important;
    box-shadow: 0 8px 18px rgba(196, 84, 135, 0.22) !important;
}

/* Mobile */
@media (max-width: 560px) {
    #vaultModal .vault-tierCard {
        padding: 16px 16px 14px !important;
        --vault-tier-circle-size: 52px !important;
        --vault-tier-rail-height: 7px !important;
        --vault-tier-rail-inset: 28px !important;
    }

    #vaultModal .vault-tierCard__rail,
    #vaultModal .vault-tierCard__fill {
        top: calc(16px + (var(--vault-tier-circle-size) / 2) - (var(--vault-tier-rail-height) / 2)) !important;
    }

    #vaultModal .vault-tierCard__steps {
        gap: 6px !important;
    }

    #vaultModal .vault-tierCard__gem {
        width: 32px !important;
        height: 32px !important;
        max-width: 32px !important;
        max-height: 32px !important;
    }

    #vaultModal .vault-tierCard__gem--pearl {
        width: 29px !important;
        height: 29px !important;
        max-width: 29px !important;
        max-height: 29px !important;
    }

    #vaultModal .vault-tierCard__name {
        font-size: 12px !important;
        line-height: 1.1 !important;
    }

    #vaultModal .vault-tierCard__meta {
        font-size: 10px !important;
    }

    #vaultModal .vault-progressCard {
        margin-top: 18px !important;
        padding: 16px 18px !important;
    }
}

/* Lounge level tracker: restore the old active-level spotlight. */
#vaultModal .modal__card--vault .vault-tierCard{
    --vault-tier-circle-size:58px !important;
    --vault-tier-rail-height:7px !important;
    --vault-tier-rail-inset:46px !important;
    padding:24px 26px 18px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__rail,
#vaultModal .modal__card--vault .vault-tierCard__fill{
    top:calc(24px + (var(--vault-tier-circle-size) / 2) - (var(--vault-tier-rail-height) / 2)) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__rail{
    background:linear-gradient(90deg, rgba(255,228,241,.72), rgba(244,198,219,.82), rgba(255,244,249,.72)) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__fill{
    width:calc(100% - (var(--vault-tier-rail-inset) * 2)) !important;
    transform-origin:left center !important;
    background:linear-gradient(90deg, #e96da7 0%, #d64a95 70%, #b45cf2 100%) !important;
    box-shadow:0 0 18px rgba(199,91,169,.32), 0 8px 18px rgba(211,53,141,.20) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step{
    position:relative !important;
    min-height:96px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__circle{
    position:relative !important;
    overflow:visible !important;
    z-index:2 !important;
}

#vaultModal .modal__card--vault .vault-tierCard__circle::before,
#vaultModal .modal__card--vault .vault-tierCard__circle::after{
    content:"" !important;
    display:block !important;
    position:absolute !important;
    border-radius:999px !important;
    pointer-events:none !important;
}

#vaultModal .modal__card--vault .vault-tierCard__circle::before{
    inset:-6px !important;
    border:2px solid rgba(255,255,255,.86) !important;
    opacity:0 !important;
    transform:scale(.9) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__circle::after{
    inset:-14px !important;
    background:radial-gradient(circle, rgba(199,132,255,.28) 0%, rgba(214,74,149,.14) 46%, transparent 72%) !important;
    opacity:0 !important;
    z-index:-1 !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-current{
    transform:none !important;
    z-index:5 !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__circle{
    width:68px !important;
    height:68px !important;
    min-width:68px !important;
    min-height:68px !important;
    margin-top:-7px !important;
    margin-bottom:0 !important;
    border-color:rgba(177,119,255,.70) !important;
    background:radial-gradient(circle at 35% 25%, #fff 0%, #f3e9ff 58%, #ead9ff 100%) !important;
    box-shadow:
            0 0 0 7px rgba(205,174,255,.32),
            0 0 0 14px rgba(210,126,255,.14),
            0 18px 34px rgba(151,73,215,.28),
            inset 0 0 18px rgba(255,255,255,.94) !important;
    animation:vault-tier-current-pulse 2.2s ease-in-out infinite !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__circle::before{
    opacity:1 !important;
    transform:scale(1) !important;
    box-shadow:0 0 0 8px rgba(185,126,255,.20), 0 0 28px rgba(179,98,255,.42) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__circle::after{
    opacity:1 !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__gem,
#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__emoji--diamond{
    width:42px !important;
    height:42px !important;
    max-width:42px !important;
    max-height:42px !important;
    opacity:1 !important;
    transform:scale(1.08) translateY(-1px) !important;
    filter:saturate(1.45) contrast(1.14) brightness(1.12) drop-shadow(0 10px 18px rgba(150,73,215,.38)) !important;
    animation:vault-tier-gem-float 2.2s ease-in-out infinite !important;
}

#vaultModal .modal__card--vault #vault-tier-amethyst.is-current .vault-tierCard__name,
#vaultModal .modal__card--vault #vault-tier-amethyst.is-current .vault-tierCard__meta{
    color:#c05397 !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-upcoming .vault-tierCard__gem,
#vaultModal .modal__card--vault .vault-tierCard__step.is-upcoming .vault-tierCard__emoji--diamond{
    opacity:.42 !important;
}

#vaultModal .modal__card--vault .vault-icon{
    border-color:rgba(177,119,255,.54) !important;
    box-shadow:0 0 0 6px rgba(198,162,255,.14), 0 18px 34px rgba(151,73,215,.20) !important;
}

#vaultModal .modal__card--vault .vault-sub{
    color:#c05397 !important;
}

@media (max-width:560px){
    #vaultModal .modal__card--vault .vault-tierCard{
        --vault-tier-circle-size:52px !important;
        --vault-tier-rail-inset:28px !important;
        padding:20px 16px 14px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__rail,
    #vaultModal .modal__card--vault .vault-tierCard__fill{
        top:calc(20px + (var(--vault-tier-circle-size) / 2) - (var(--vault-tier-rail-height) / 2)) !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__circle{
        width:60px !important;
        height:60px !important;
        min-width:60px !important;
        min-height:60px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__gem,
    #vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__emoji--diamond{
        width:36px !important;
        height:36px !important;
        max-width:36px !important;
        max-height:36px !important;
    }
}

/* Final lounge fit pass: keep the full rewards card visible without scrolling. */
#vaultModal .modal__card--vault{
    max-height:calc(100dvh - 14px) !important;
    overflow:hidden !important;
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;
    padding:14px !important;
}

#vaultModal .vault-shell{
    display:grid !important;
    gap:10px !important;
    min-height:0 !important;
}

#vaultModal .modal__card--vault .vault-head{
    min-height:176px !important;
    gap:8px !important;
    padding:18px 14px 16px !important;
    border-radius:22px !important;
}

#vaultModal .modal__card--vault .vault-title{
    font-size:clamp(30px, 6.2vw, 42px) !important;
    letter-spacing:0 !important;
}

#vaultModal .modal__card--vault .vault-icon{
    width:76px !important;
    height:76px !important;
    border-radius:22px !important;
}

#vaultModal .modal__card--vault .vault-icon__image{
    width:46px !important;
    height:46px !important;
    max-width:46px !important;
    max-height:46px !important;
}

#vaultModal .modal__card--vault .vault-stats--grid{
    gap:10px !important;
}

#vaultModal .modal__card--vault .vault-statCard{
    min-height:92px !important;
    padding:16px 12px !important;
    border-radius:20px !important;
}

#vaultModal .modal__card--vault .vault-statCard__value{
    font-size:clamp(28px, 5vw, 36px) !important;
}

#vaultModal .modal__card--vault .vault-statCard__expiry{
    font-size:11px !important;
    line-height:1.15 !important;
}

#vaultModal .modal__card--vault .vault-tierCard{
    --vault-tier-circle-size:50px !important;
    --vault-tier-rail-height:6px !important;
    --vault-tier-rail-inset:42px !important;
    padding:16px 18px 12px !important;
    border-radius:20px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__rail,
#vaultModal .modal__card--vault .vault-tierCard__fill{
    top:calc(16px + (var(--vault-tier-circle-size) / 2) - (var(--vault-tier-rail-height) / 2)) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step{
    min-height:80px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__circle{
    margin-bottom:7px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__circle{
    width:62px !important;
    height:62px !important;
    min-width:62px !important;
    min-height:62px !important;
    margin-top:-6px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__gem,
#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__emoji--diamond{
    width:40px !important;
    height:40px !important;
    max-width:40px !important;
    max-height:40px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__name{
    font-size:11px !important;
    line-height:1.05 !important;
    letter-spacing:.06em !important;
}

#vaultModal .modal__card--vault .vault-tierCard__meta{
    font-size:9px !important;
    line-height:1 !important;
}

#vaultModal .modal__card--vault .vault-metaCard{
    padding:15px 14px !important;
    border-radius:20px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__summary{
    min-height:auto !important;
}

#vaultModal .modal__card--vault .vault-metaCard__label{
    font-size:12px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__value{
    font-size:clamp(24px, 4vw, 32px) !important;
}

#vaultModal .modal__card--vault .vault-progressCard{
    margin-top:0 !important;
    padding:14px 16px !important;
    border-radius:18px !important;
}

#vaultModal .modal__card--vault .vault-progress__top{
    gap:10px !important;
}

#vaultModal .modal__card--vault .vault-progress__value{
    min-width:82px !important;
    padding:8px 12px !important;
    font-size:28px !important;
}

#vaultModal .modal__card--vault .vault-progress__bar{
    height:13px !important;
    margin-top:10px !important;
}

#vaultModal .modal__card--vault .vault-closeBtn{
    display:none !important;
}

@media (max-width:560px){
    #vaultModal .modal__card--vault{
        width:calc(100vw - 8px) !important;
        max-height:calc(100dvh - 8px) !important;
        padding:9px !important;
        gap:8px !important;
    }

    #vaultModal .vault-shell{
        gap:8px !important;
    }

    #vaultModal .modal__card--vault .vault-head{
        min-height:156px !important;
        padding:14px 10px 12px !important;
    }

    #vaultModal .modal__card--vault .vault-title{
        font-size:clamp(28px, 9vw, 38px) !important;
    }

    #vaultModal .modal__card--vault .vault-icon{
        width:64px !important;
        height:64px !important;
        border-radius:20px !important;
    }

    #vaultModal .modal__card--vault .vault-icon__image{
        width:40px !important;
        height:40px !important;
        max-width:40px !important;
        max-height:40px !important;
    }

    #vaultModal .modal__card--vault .vault-statCard{
        min-height:82px !important;
        padding:12px 8px !important;
    }

    #vaultModal .modal__card--vault .vault-statCard__label,
    #vaultModal .modal__card--vault .vault-metaCard__label,
    #vaultModal .modal__card--vault .vault-progress__label{
        font-size:11px !important;
    }

    #vaultModal .modal__card--vault .vault-statCard__value{
        font-size:28px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard{
        --vault-tier-circle-size:44px !important;
        --vault-tier-rail-inset:26px !important;
        padding:14px 10px 10px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__rail,
    #vaultModal .modal__card--vault .vault-tierCard__fill{
        top:calc(14px + (var(--vault-tier-circle-size) / 2) - (var(--vault-tier-rail-height) / 2)) !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__steps{
        gap:4px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__step{
        min-height:72px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__circle{
        width:54px !important;
        height:54px !important;
        min-width:54px !important;
        min-height:54px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__gem,
    #vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__emoji--diamond{
        width:34px !important;
        height:34px !important;
        max-width:34px !important;
        max-height:34px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard{
        padding:12px 10px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__value{
        font-size:24px !important;
    }

    #vaultModal .modal__card--vault .vault-progressCard{
        padding:12px 12px !important;
    }

    #vaultModal .modal__card--vault .vault-progress__hint{
        font-size:11px !important;
    }

    #vaultModal .modal__card--vault .vault-progress__value{
        min-width:70px !important;
        font-size:24px !important;
        padding:7px 10px !important;
    }
}

@keyframes cartButtonBloom{
    0%{ transform:translateY(0) scale(1); filter:saturate(1); }
    18%{ transform:translateY(1px) scale(.96); filter:saturate(1.08); }
    48%{ transform:translateY(-2px) scale(1.045); filter:saturate(1.18) brightness(1.03); }
    72%{ transform:translateY(0) scale(.995); }
    100%{ transform:translateY(0) scale(1); filter:saturate(1); }
}

@keyframes cartButtonShine{
    0%{ opacity:0; transform:translateX(-64%) rotate(7deg); }
    24%{ opacity:.88; }
    100%{ opacity:0; transform:translateX(58%) rotate(7deg); }
}

@keyframes cartButtonAura{
    0%{ opacity:0; transform:scale(.36); }
    32%{ opacity:1; transform:scale(.78); }
    100%{ opacity:0; transform:scale(1.25); }
}

@keyframes cartIconTuck{
    0%{ transform:translateY(0) rotate(0deg) scale(1); }
    24%{ transform:translateY(3px) rotate(-5deg) scale(.9); }
    52%{ transform:translateY(-3px) rotate(5deg) scale(1.12); }
    100%{ transform:translateY(0) rotate(0deg) scale(1); }
}

@keyframes cartSparkFly{
    0%{
        opacity:0;
        transform:translate(-50%, -50%) scale(.42);
    }
    18%{
        opacity:1;
    }
    100%{
        opacity:0;
        transform:
                translate(calc(-50% + var(--cart-spark-x)), calc(-50% + var(--cart-spark-y)))
                scale(var(--cart-spark-scale, 1));
    }
}

/* Lounge smaller pass: more breathing room around the modal on laptop screens. */
#vaultModal .modal__card--vault{
    width:min(520px, calc(100vw - 24px)) !important;
    gap:8px !important;
    padding:12px !important;
    border-radius:22px !important;
}

#vaultModal .vault-shell{
    gap:8px !important;
}

#vaultModal .modal__card--vault .vault-head{
    min-height:148px !important;
    gap:6px !important;
    padding:14px 12px 12px !important;
    border-radius:20px !important;
}

#vaultModal .modal__card--vault .vault-title{
    font-size:clamp(28px, 5.2vw, 38px) !important;
}

#vaultModal .modal__card--vault .vault-icon{
    width:62px !important;
    height:62px !important;
    border-radius:18px !important;
}

#vaultModal .modal__card--vault .vault-icon__image{
    width:38px !important;
    height:38px !important;
    max-width:38px !important;
    max-height:38px !important;
}

#vaultModal .modal__card--vault .vault-sub{
    font-size:10px !important;
}

#vaultModal .modal__card--vault .vault-statCard{
    min-height:76px !important;
    padding:11px 10px !important;
    border-radius:18px !important;
}

#vaultModal .modal__card--vault .vault-statCard__label,
#vaultModal .modal__card--vault .vault-metaCard__label,
#vaultModal .modal__card--vault .vault-progress__label{
    font-size:11px !important;
}

#vaultModal .modal__card--vault .vault-statCard__value{
    font-size:clamp(25px, 4.2vw, 31px) !important;
}

#vaultModal .modal__card--vault .vault-statCard__expiry{
    font-size:10px !important;
}

#vaultModal .modal__card--vault .vault-tierCard{
    --vault-tier-circle-size:42px !important;
    --vault-tier-rail-height:5px !important;
    --vault-tier-rail-inset:36px !important;
    padding:12px 14px 9px !important;
    border-radius:18px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__rail,
#vaultModal .modal__card--vault .vault-tierCard__fill{
    top:calc(12px + (var(--vault-tier-circle-size) / 2) - (var(--vault-tier-rail-height) / 2)) !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step{
    min-height:66px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__circle{
    margin-bottom:5px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__circle{
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
    min-height:54px !important;
    margin-top:-5px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__gem,
#vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__emoji--diamond{
    width:34px !important;
    height:34px !important;
    max-width:34px !important;
    max-height:34px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__name{
    font-size:10px !important;
}

#vaultModal .modal__card--vault .vault-tierCard__meta{
    font-size:8px !important;
}

#vaultModal .modal__card--vault .vault-metaCard{
    padding:12px !important;
    border-radius:18px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__value{
    font-size:clamp(22px, 3.6vw, 28px) !important;
}

#vaultModal .modal__card--vault .vault-progressCard{
    padding:11px 12px !important;
    border-radius:17px !important;
}

#vaultModal .modal__card--vault .vault-progress__hint{
    font-size:10px !important;
}

#vaultModal .modal__card--vault .vault-progress__value{
    min-width:66px !important;
    padding:6px 9px !important;
    font-size:22px !important;
}

#vaultModal .modal__card--vault .vault-progress__bar{
    height:13px !important;
    margin-top:8px !important;
}

@media (max-width:560px){
    #vaultModal .modal__card--vault{
        width:calc(100vw - 12px) !important;
        padding:8px !important;
        gap:7px !important;
    }

    #vaultModal .vault-shell{
        gap:7px !important;
    }

    #vaultModal .modal__card--vault .vault-head{
        min-height:138px !important;
        padding:12px 8px 10px !important;
    }

    #vaultModal .modal__card--vault .vault-title{
        font-size:clamp(27px, 8.4vw, 34px) !important;
    }

    #vaultModal .modal__card--vault .vault-icon{
        width:56px !important;
        height:56px !important;
    }

    #vaultModal .modal__card--vault .vault-icon__image{
        width:34px !important;
        height:34px !important;
        max-width:34px !important;
        max-height:34px !important;
    }

    #vaultModal .modal__card--vault .vault-statCard{
        min-height:70px !important;
        padding:10px 7px !important;
    }

    #vaultModal .modal__card--vault .vault-statCard__value{
        font-size:25px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard{
        --vault-tier-circle-size:38px !important;
        --vault-tier-rail-inset:24px !important;
        padding:11px 8px 8px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__rail,
    #vaultModal .modal__card--vault .vault-tierCard__fill{
        top:calc(11px + (var(--vault-tier-circle-size) / 2) - (var(--vault-tier-rail-height) / 2)) !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__step{
        min-height:62px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__circle{
        width:48px !important;
        height:48px !important;
        min-width:48px !important;
        min-height:48px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__gem,
    #vaultModal .modal__card--vault .vault-tierCard__step.is-current .vault-tierCard__emoji--diamond{
        width:30px !important;
        height:30px !important;
        max-width:30px !important;
        max-height:30px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard,
    #vaultModal .modal__card--vault .vault-progressCard{
        padding:10px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__value{
        font-size:22px !important;
    }

    #vaultModal .modal__card--vault .vault-progress__value{
        min-width:60px !important;
        font-size:20px !important;
    }
}

/* Lounge balance pass: give Level/Discount the empty vertical space below the tier rail. */
#vaultModal .modal__card--vault .vault-metaCard{
    min-height:92px !important;
    padding:18px 16px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__content,
#vaultModal .modal__card--vault .vault-metaCard__panel,
#vaultModal .modal__card--vault .vault-metaCard__summary{
    height:100% !important;
}

#vaultModal .modal__card--vault .vault-metaCard__summary{
    align-items:center !important;
}

#vaultModal .modal__card--vault .vault-metaCard__label{
    font-size:13px !important;
    letter-spacing:.12em !important;
}

#vaultModal .modal__card--vault .vault-metaCard__value{
    font-size:clamp(28px, 4.4vw, 36px) !important;
    line-height:1.05 !important;
}

#vaultModal .modal__card--vault .vault-tierCard{
    margin-bottom:2px !important;
}

@media (max-width:560px){
    #vaultModal .modal__card--vault .vault-metaCard{
        min-height:84px !important;
        padding:16px 12px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__label{
        font-size:12px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__value{
        font-size:27px !important;
    }
}

/* Lounge tier field final size: add the missing lower breathing room. */
#vaultModal .modal__card--vault .vault-tierCard{
    min-height:118px !important;
    padding-bottom:22px !important;
}

/* Lounge hero icon polish: match the active tier marker for Diamond. */
#vaultModal[data-vault-level="diamond"] .modal__card--vault .vault-icon{
    width:70px !important;
    height:70px !important;
    border-radius:50% !important;
    border:4px solid rgba(211, 92, 244, .34) !important;
    background:
            radial-gradient(circle at 50% 48%, rgba(255,255,255,.98) 0 46%, rgba(250,231,255,.92) 66%, rgba(227,168,255,.70) 100%) !important;
    box-shadow:
            0 0 0 6px rgba(217, 112, 255, .14),
            0 0 0 13px rgba(217, 112, 255, .08),
            0 16px 32px rgba(122, 68, 184, .18) !important;
    overflow:visible !important;
}

#vaultModal[data-vault-level="diamond"] .modal__card--vault .vault-icon::after{
    content:"" !important;
    position:absolute !important;
    inset:-9px !important;
    border-radius:50% !important;
    border:2px solid rgba(206, 111, 255, .26) !important;
    box-shadow:0 0 18px rgba(204, 91, 244, .22) !important;
    pointer-events:none !important;
}

#vaultModal[data-vault-level="diamond"] .modal__card--vault .vault-icon__image{
    display:none !important;
    visibility:hidden !important;
}

#vaultModal[data-vault-level="diamond"] .modal__card--vault .vault-icon__emoji{
    display:grid !important;
    place-items:center !important;
    width:100% !important;
    height:100% !important;
    font-size:0 !important;
    line-height:0 !important;
    transform:none !important;
    position:relative !important;
    z-index:1 !important;
}

#vaultModal[data-vault-level="diamond"] .modal__card--vault .vault-icon__emoji::before{
    content:"\1F48E" !important;
    font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif !important;
    font-size:43px !important;
    line-height:1 !important;
    filter:saturate(1.22) contrast(1.08) brightness(1.06) drop-shadow(0 5px 10px rgba(48, 168, 230, .22)) !important;
    transform:translateY(-1px) !important;
}

@media (max-width:560px){
    #vaultModal[data-vault-level="diamond"] .modal__card--vault .vault-icon{
        width:62px !important;
        height:62px !important;
    }

    #vaultModal[data-vault-level="diamond"] .modal__card--vault .vault-icon__emoji{
        width:100% !important;
        height:100% !important;
        font-size:0 !important;
    }

    #vaultModal[data-vault-level="diamond"] .modal__card--vault .vault-icon__emoji::before{
        font-size:37px !important;
    }
}

#vaultModal .modal__card--vault .vault-tierCard__step{
    min-height:82px !important;
}

@media (max-width:560px){
    #vaultModal .modal__card--vault .vault-tierCard{
        min-height:108px !important;
        padding-bottom:20px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__step{
        min-height:76px !important;
    }
}

/* Lounge proportional polish: stronger tier labels and full-width level card. */
#vaultModal .modal__card--vault .vault-tierCard__name{
    font-size:12px !important;
    line-height:1.12 !important;
    letter-spacing:.045em !important;
}

#vaultModal .modal__card--vault .vault-tierCard__meta{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:17px !important;
    padding:3px 8px !important;
    font-size:10px !important;
    line-height:1 !important;
    border-radius:999px !important;
}

#vaultModal .modal__card--vault .vault-metaCard{
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
}

#vaultModal .modal__card--vault .vault-metaCard__content{
    width:100% !important;
    padding:0 !important;
}

#vaultModal .modal__card--vault .vault-metaCard__panel{
    width:100% !important;
    min-height:112px !important;
    padding:20px 18px !important;
    border-radius:20px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__summary{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:18px !important;
}

#vaultModal .modal__card--vault .vault-metaCard__value{
    font-size:clamp(31px, 4.8vw, 39px) !important;
}

@media (max-width:560px){
    #vaultModal .modal__card--vault .vault-tierCard__name{
        font-size:11px !important;
    }

    #vaultModal .modal__card--vault .vault-tierCard__meta{
        min-height:16px !important;
        padding:3px 6px !important;
        font-size:9px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard{
        padding:0 !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__panel{
        min-height:102px !important;
        padding:18px 12px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__summary{
        gap:12px !important;
    }

    #vaultModal .modal__card--vault .vault-metaCard__value{
        font-size:29px !important;
    }
}
