🐴 Poník klub · Věrnostní program HighPony
Odměny za každý nákup
Za nákupy sbíráš XP a stoupáš v levelech, z objednávek otevíráš truhly, každý den si točíš kolem štěstí a sbíráš odznaky. Je to zdarma – stačí ti účet.
+100 XP Za založení účtu dostaneš hned +100 XP.
+800 XP
−10 %
🎁 Tajný dárek
Truhly
za objednávku od 600 Kč
Kolo štěstí
každý den jedno točení
Levely a XP
30 levelů s odměnami
Odznaky
12 odznaků ke sbírání
Jak se přidat
Tři kroky a jsi v klubu
1
Založ si účet
Je zdarma a máš ho za minutu. Poník klub najdeš v sekci Můj účet.
2
Nakupuj jako vždy
Za každý nákup dostaneš XP a za objednávku od 600 Kč i truhlu s odměnou.
3
Vybírej odměny
Slevy, dopravu zdarma, dárky a XP boosty najdeš v sekci Moje sbírka.
Truhly
Každá objednávka od 600 Kč otevře truhlu
Čím větší objednávka, tím lepší truhla – a tím větší odměny v ní. Klikni na truhlu a vyzkoušej si, jak se otevírá.
Bronzová truhla
od 600 Kč
+50 až +150 XP · XP boost ×1,5
Stříbrná truhla
od 1 200 Kč
+100 až +300 XP · XP boost ×2
Zlatá truhla
od 1 800 Kč
+200 až +600 XP · XP boost ×2
Smaragdová truhla
od 2 400 Kč
+350 až +1 000 XP · XP boost ×2,5
Diamantová truhla
od 3 000 Kč
+600 až +1 200 XP · Tajný dárek · XP boost ×3
Počítáme zboží po slevách, dopravu ne.
Ukázka
Diamantová truhla
Takhle se otevírá truhla k objednávce.
Otevřít truhlu
Tohle je jen ukázka. Skutečnou truhlu otevřeš po každé objednávce od 600 Kč.
Ukázka
-5 % 🎁 +50XP +20XP -10 % +30XP 🚚 Nic
Zatoč si
Tohle je jen ukázka. Naostro si zatočíš v profilu – jednou denně.
Kolo štěstí
Každý den jedno točení
Každý den si v profilu vyzvedneš denní odměnu a zatočíš si kolem štěstí – vyhrát můžeš XP, slevy, dopravu zdarma i dárky.
Denní odměna
1. den +10 XP 2. den +10 XP 3. den +15 XP 4. den +15 XP 5. den +20 XP 6. den +25 XP 7. den ✨ Týdenní kolo
Když si denní odměnu vyzvedneš 7 dní po sobě, zatočíš si i týdenním kolem – tam vyhrává každé políčko.
Moje sbírka
Všechny odměny na jednom místě
Co vyhraješ, najdeš v profilu v sekci Moje sbírka.
−10 % Slevové kupony Osobní kód se slevou. Klikneš na něj, zkopíruje se a použiješ ho v košíku.
🚚 Doprava zdarma Kupon, se kterým ti další objednávku pošleme zdarma.
🎁 Tajný dárek Přibalíme ho k tvé další objednávce.
×2 XP boost Zapneš si ho ve sbírce a za nákupy dostáváš víc XP.
Jak to funguje
Průvodce ti všechno ukáže
Návod ke všemu najdeš v profilu. Když něčemu nerozumíš, klikni na otazník vedle svého jména.
Časté otázky
Kolik stojí členství? Nic. Poník klub je zdarma pro každého, kdo u nás má účet.
Už u vás mám účet. Musím se do klubu přihlásit? Ne. Každý účet je v klubu automaticky – stačí se přihlásit a otevřít Můj účet.
Kde najdu svoje odměny? V profilu, v sekci Moje sbírka. Kupon zkopíruješ jedním kliknutím a použiješ ho v košíku.
Jak dostanu dárek? Přibalíme ho k tvé další objednávce – nemusíš nic dělat.
Přidej se do Poník klubu
Účet je zdarma a založíš si ho za minutu.
+100 XP Za založení účtu dostaneš hned +100 XP.
— the page explaining Poník klub (Frontend\Landing).
Printed inline by the shortcode. Every rule hangs on #hp-ponik-klub: the
id outranks the theme reset ([type=button] at 0,1,0 and its :hover at
0,2,0), the kit's link and heading colours and Elementor's widget rules,
so nothing here depends on load order. Glass panels carry an opaque base
(WebKit paints no backdrop-filter); no :has(). */
/* ---------- the page around it ---------- */
html body.hplp-page { background: #0e0f26; overflow-x: clip; }
/* Hello Elementor prints the page title above the content; the hero has its own h1. */
body.hplp-page .page-header .entry-title { display: none; }
/* The profile's painted backdrop (templates/scene.php), fixed behind the page. */
#hp-ponik-klub .hp-sky {
position: fixed; inset: 0; z-index: -3; pointer-events: none;
background:
radial-gradient(120% 60% at 50% 108%, rgba(255, 122, 217, .26), transparent 60%),
radial-gradient(70% 45% at 78% 90%, rgba(255, 194, 0, .14), transparent 60%),
linear-gradient(180deg, #0d0e22 0%, #1a1b3a 34%, #33245c 62%, #5c2d6e 80%, #8a3f76 92%, #b85a77 100%);
}
#hp-ponik-klub .hp-scene {
position: fixed; left: 0; right: 0; bottom: 0; z-index: -2; pointer-events: none;
width: 100%; height: 46vh; display: block; opacity: .9;
}
#hp-ponik-klub .hp-scene .tw { animation: hplpTwinkle 3.4s ease-in-out infinite alternate; }
#hp-ponik-klub .hp-scene .tw:nth-of-type(2n) { animation-delay: .9s; }
#hp-ponik-klub .hp-scene .tw:nth-of-type(3n) { animation-delay: 1.7s; animation-duration: 4.6s; }
@keyframes hplpTwinkle { from { opacity: .25; } to { opacity: 1; } }
#hp-ponik-klub .hp-vig {
position: fixed; inset: 0; z-index: -1; pointer-events: none;
background: radial-gradient(120% 90% at 50% 40%, transparent 55%, rgba(6, 6, 16, .6) 100%);
}
/* ---------- tokens + base ---------- */
#hp-ponik-klub {
--ink: #f4f2ff;
--ink-dim: rgba(244, 242, 255, .8);
--ink-faint: rgba(244, 242, 255, .6);
--cream: #ffe9b0;
--gold: #ffc200;
--gold-soft: #ffd75e;
--gold-edge: #9c6b00;
--pink: #f599ff;
--magenta: #ff7ad9;
--violet: #8b7bff;
--line: rgba(255, 255, 255, .2);
--line-soft: rgba(255, 255, 255, .12);
--display: "Titan One", "Sanchez", Georgia, serif;
--head: "Sanchez", Georgia, serif;
--body: "Domine", Georgia, serif;
--wood: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='340' height='150'%3E%3Cfilter id='w'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.011 0.21' numOctaves='3' seed='7'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0.22 0 0 0 0 0.12 0 0 0 0 0.04 0 0 0 0.75 0'/%3E%3C/filter%3E%3Crect width='340' height='150' filter='url(%23w)'/%3E%3C/svg%3E");
position: relative; z-index: 0;
max-width: 1180px; margin: 0 auto;
padding: clamp(10px, 2.4vw, 30px) clamp(16px, 3vw, 28px) clamp(48px, 7vw, 90px);
color: var(--ink); font-family: var(--body); font-size: 17px; line-height: 1.62;
text-align: left; -webkit-font-smoothing: antialiased;
}
#hp-ponik-klub *, #hp-ponik-klub *::before, #hp-ponik-klub *::after { box-sizing: border-box; }
#hp-ponik-klub img { max-width: 100%; height: auto; border: 0; border-radius: 0; box-shadow: none; }
#hp-ponik-klub p, #hp-ponik-klub ul, #hp-ponik-klub ol, #hp-ponik-klub figure, #hp-ponik-klub h1, #hp-ponik-klub h2, #hp-ponik-klub h3 { margin: 0; padding: 0; }
#hp-ponik-klub ul, #hp-ponik-klub ol { list-style: none; }
#hp-ponik-klub a { text-decoration: none; }
#hp-ponik-klub section[id] { scroll-margin-top: 110px; }
#hp-ponik-klub .hplp-staff { margin: 0 0 18px; padding: 12px 16px; border-radius: 12px; background: #ffc200; color: #2a1a00; font-family: var(--head); font-size: 15px; }
/* ---------- type ---------- */
#hp-ponik-klub .hplp-h1 {
font-family: var(--display); font-weight: 400; text-transform: uppercase;
font-size: clamp(44px, 6.6vw, 84px); line-height: .98; letter-spacing: .01em;
color: var(--gold); text-wrap: balance;
text-shadow: 0 5px 0 #8a5a00, 0 16px 34px rgba(0, 0, 0, .45);
margin: 18px 0 20px;
}
#hp-ponik-klub .hplp-h1.small { font-size: clamp(34px, 4.8vw, 60px); margin: 26px 0 14px; }
#hp-ponik-klub .hplp-h2 {
font-family: var(--display); font-weight: 400; text-transform: uppercase;
font-size: clamp(30px, 4.1vw, 50px); line-height: 1.04; letter-spacing: .01em;
color: var(--cream); text-wrap: balance;
text-shadow: 0 4px 0 rgba(110, 58, 0, .95), 0 12px 28px rgba(0, 0, 0, .4);
margin: 18px 0 14px;
}
#hp-ponik-klub .hplp-h3 {
font-family: var(--display); font-weight: 400; font-size: 19px; letter-spacing: .03em;
color: var(--gold-soft); margin: 26px 0 12px;
}
/* text over the painted backdrop: a soft shadow keeps it legible over the snow peak / the sun */
#hp-ponik-klub .hplp-lead { font-size: clamp(17px, 1.6vw, 19.5px); color: var(--ink-dim); max-width: 34em; text-shadow: 0 2px 14px rgba(8, 7, 26, .85); }
#hp-ponik-klub .hplp-text { color: var(--ink-dim); max-width: 38em; text-shadow: 0 2px 12px rgba(8, 7, 26, .8); }
#hp-ponik-klub .hplp-text.small { font-size: 15px; margin-top: 14px; }
#hp-ponik-klub .hplp-caption, #hp-ponik-klub .hplp-note {
font-family: var(--head); font-style: italic; font-size: 14.5px; color: rgba(255, 236, 200, .76);
}
#hp-ponik-klub .hplp-caption { text-align: center; margin-top: 16px; }
#hp-ponik-klub .hplp-head { text-align: center; display: flex; flex-direction: column; align-items: center; }
#hp-ponik-klub .hplp-head .hplp-text { margin: 0 auto; }
/* the pink pill over the hero (the launch e-mail's eyebrow) */
#hp-ponik-klub .hplp-pill {
display: inline-flex; align-items: center; gap: 9px; flex-wrap: wrap;
padding: 9px 20px; border: 2px solid var(--magenta); border-radius: 999px;
background: rgba(92, 10, 61, .5);
font-family: var(--display); font-size: 13.5px; letter-spacing: .12em; text-transform: uppercase; color: #ff9be4;
}
#hp-ponik-klub .hplp-pill-dot { opacity: .6; }
/* the wooden plate (the profile's section titles) */
#hp-ponik-klub .hplp-plate {
display: inline-flex; align-items: center; position: relative;
padding: 9px 27px 10px;
font-family: var(--display); font-weight: 400; font-size: 16px; letter-spacing: .05em; text-transform: uppercase;
color: var(--cream);
background:
linear-gradient(180deg, rgba(255, 236, 200, .15), rgba(0, 0, 0, 0) 32%, rgba(0, 0, 0, .22)),
var(--wood),
linear-gradient(180deg, #8a5426 0%, #6d3d17 55%, #57300f 100%);
background-size: auto, 340px 150px, auto;
background-blend-mode: normal, overlay, normal;
border-radius: 12px 9px 11px 8px / 9px 12px 8px 11px;
box-shadow: inset 0 2px 0 rgba(255, 225, 170, .28), inset 0 -3px 0 rgba(30, 15, 3, .5), inset 0 0 0 2px rgba(52, 28, 8, .65), 0 8px 20px rgba(0, 0, 0, .4);
text-shadow: 0 2px 0 rgba(30, 14, 2, .75), 0 0 16px rgba(255, 194, 0, .25);
transform: rotate(-1deg);
}
#hp-ponik-klub .hplp-plate::before, #hp-ponik-klub .hplp-plate::after {
content: ""; position: absolute; top: 50%; width: 6px; height: 6px; border-radius: 50%;
transform: translateY(-50%);
background: radial-gradient(circle at 34% 28%, #ffe9b0, #c98f3a 46%, #5f4113 82%);
box-shadow: 0 1px 2px rgba(0, 0, 0, .6);
}
#hp-ponik-klub .hplp-plate::before { left: 9px; }
#hp-ponik-klub .hplp-plate::after { right: 9px; }
/* ---------- buttons (the shop's gold slab) ---------- */
#hp-ponik-klub .hplp-btn,
#hp-ponik-klub .hplp-btn:visited {
-webkit-appearance: none; appearance: none;
display: inline-flex; align-items: center; justify-content: center; gap: 10px;
min-height: 56px; padding: 0 30px; margin: 0;
border: 0; border-radius: 16px;
font-family: var(--display); font-weight: 400; font-size: 17px; line-height: 1.1; letter-spacing: .05em; text-transform: uppercase; text-align: center; white-space: normal;
color: #2a1a00;
background-color: #ffc200;
background-image: linear-gradient(180deg, #ffe07a, #ffc200 55%, #f0a800);
box-shadow: 0 6px 0 var(--gold-edge), 0 16px 30px rgba(255, 194, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .6);
cursor: pointer; text-decoration: none;
transition: transform .12s ease, box-shadow .12s ease, filter .15s ease;
}
#hp-ponik-klub .hplp-btn:hover, #hp-ponik-klub .hplp-btn:focus {
color: #2a1a00; background-color: #ffc200; text-decoration: none;
transform: translateY(-2px);
box-shadow: 0 8px 0 var(--gold-edge), 0 20px 34px rgba(255, 194, 0, .3), inset 0 1px 0 rgba(255, 255, 255, .6);
}
#hp-ponik-klub .hplp-btn:active { transform: translateY(4px); box-shadow: 0 2px 0 var(--gold-edge), 0 8px 18px rgba(255, 194, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .6); }
#hp-ponik-klub .hplp-btn:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
#hp-ponik-klub .hplp-btn:disabled { filter: grayscale(.35) brightness(.85); cursor: default; transform: none; }
#hp-ponik-klub .hplp-btn.ghost, #hp-ponik-klub .hplp-btn.ghost:visited {
color: var(--ink); background-color: rgba(255, 255, 255, .07); background-image: none;
box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .34), 0 10px 24px rgba(0, 0, 0, .25);
}
#hp-ponik-klub .hplp-btn.ghost:hover, #hp-ponik-klub .hplp-btn.ghost:focus {
color: #fff; background-color: rgba(255, 255, 255, .14);
box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .6), 0 12px 26px rgba(0, 0, 0, .3);
}
#hp-ponik-klub .hplp-btn.pink, #hp-ponik-klub .hplp-btn.pink:hover, #hp-ponik-klub .hplp-btn.pink:focus {
color: #33052a; background-color: #ff7ad9;
background-image: linear-gradient(180deg, #ffc2ef, #ff7ad9 60%, #f052bd);
box-shadow: 0 6px 0 #9a1f74, 0 16px 30px rgba(255, 122, 217, .3), inset 0 1px 0 rgba(255, 255, 255, .6);
}
#hp-ponik-klub .hplp-btn.pink:active { box-shadow: 0 2px 0 #9a1f74, inset 0 1px 0 rgba(255, 255, 255, .6); }
#hp-ponik-klub .hplp-cta { display: flex; flex-wrap: wrap; gap: 16px 14px; margin-top: 30px; }
#hp-ponik-klub .hplp-bonus {
display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 22px;
font-family: var(--head); font-style: italic; font-size: 15px; color: rgba(255, 236, 200, .86);
}
#hp-ponik-klub .hplp-bonus-xp {
font-family: var(--display); font-style: normal; font-size: 14px; letter-spacing: .04em;
padding: 5px 12px; border-radius: 999px; color: #2b0e33;
background: linear-gradient(160deg, #ffb2ea, var(--magenta) 65%, #f052bd);
}
/* ---------- cards ---------- */
#hp-ponik-klub .hplp-card {
position: relative;
background:
linear-gradient(160deg, rgba(255, 255, 255, .13), rgba(255, 255, 255, .06) 60%, rgba(255, 255, 255, .04)),
linear-gradient(rgba(18, 17, 46, .9), rgba(12, 11, 32, .92));
border: 1px solid var(--line); border-radius: 24px;
box-shadow: 0 26px 70px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .16);
}
#hp-ponik-klub .hplp-sample {
position: absolute; top: 16px; right: 16px; z-index: 3;
padding: 4px 11px; border-radius: 999px; transform: rotate(3deg);
font-family: var(--display); font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase;
color: #33052a; background: linear-gradient(160deg, #ffb2ea, var(--magenta));
box-shadow: 0 6px 14px rgba(255, 122, 217, .3);
}
#hp-ponik-klub .hplp-sec { margin-top: clamp(70px, 10vw, 130px); }
#hp-ponik-klub .hplp-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 64px); align-items: center; }
#hp-ponik-klub .hplp-split.rev > :first-child { order: 0; }
#hp-ponik-klub .hplp-copy .hplp-plate { margin-left: 2px; }
/* ---------- hero ---------- */
#hp-ponik-klub .hplp-hero {
display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
gap: clamp(20px, 4vw, 56px); align-items: center;
padding-top: clamp(0px, 1.6vw, 18px);
}
#hp-ponik-klub .hplp-hero-art { position: relative; width: 100%; max-width: 540px; aspect-ratio: 1 / 1; margin: 0 auto; }
#hp-ponik-klub .hplp-glow {
position: absolute; inset: 6%; border-radius: 50%;
background: radial-gradient(circle, rgba(255, 194, 0, .34), rgba(255, 122, 217, .18) 45%, transparent 70%);
filter: blur(6px);
}
#hp-ponik-klub .hplp-rays {
position: absolute; inset: -4%; border-radius: 50%;
background: repeating-conic-gradient(from 0deg, rgba(255, 215, 94, .26) 0deg 8deg, transparent 8deg 22deg);
-webkit-mask: radial-gradient(circle, #000 18%, transparent 66%);
mask: radial-gradient(circle, #000 18%, transparent 66%);
animation: hplpSpin 40s linear infinite;
}
@keyframes hplpSpin { to { transform: rotate(360deg); } }
#hp-ponik-klub .hplp-art-chest {
position: absolute; left: 15%; top: 14%; width: 70%;
filter: drop-shadow(0 26px 30px rgba(0, 0, 0, .5));
animation: hplpBob 4.6s ease-in-out infinite;
}
@keyframes hplpBob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
#hp-ponik-klub .hplp-art-lvl {
position: absolute; left: 0; top: 2%; width: 27%;
filter: drop-shadow(0 12px 16px rgba(0, 0, 0, .45));
animation: hplpFloat 6s ease-in-out infinite;
}
#hp-ponik-klub .hplp-art-badge {
position: absolute; right: 2%; top: 4%; width: 22%;
filter: drop-shadow(0 12px 16px rgba(0, 0, 0, .45));
animation: hplpFloat 6.8s ease-in-out infinite reverse;
}
@keyframes hplpFloat { 0%, 100% { transform: translateY(0) rotate(-4deg); } 50% { transform: translateY(-12px) rotate(3deg); } }
#hp-ponik-klub .hplp-chip {
position: absolute; display: inline-flex; align-items: baseline; gap: 6px;
padding: 10px 16px; border-radius: 16px;
font-family: var(--display); font-size: 15px; letter-spacing: .04em; color: var(--ink);
background: linear-gradient(160deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .06)), linear-gradient(rgba(22, 20, 54, .94), rgba(16, 14, 40, .94));
border: 1px solid var(--line); box-shadow: 0 16px 34px rgba(0, 0, 0, .45);
animation: hplpFloat2 5.4s ease-in-out infinite;
}
#hp-ponik-klub .hplp-chip b { font-weight: 400; font-size: 24px; color: var(--gold); }
#hp-ponik-klub .hplp-chip-xp { left: 2%; bottom: 14%; }
#hp-ponik-klub .hplp-chip-coupon {
right: 4%; bottom: 6%; animation-delay: -2s;
background: linear-gradient(160deg, #ffe07a, #ffc200 60%, #f0a800); border: 2px dashed rgba(90, 50, 0, .55);
}
#hp-ponik-klub .hplp-chip-coupon b { color: #2a1a00; }
#hp-ponik-klub .hplp-chip-gift {
right: -2%; top: 40%; animation-delay: -3.6s; align-items: center;
color: #33052a; background: linear-gradient(160deg, #ffc2ef, var(--magenta) 65%, #f052bd); border: 0;
}
@keyframes hplpFloat2 { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
#hp-ponik-klub .hplp-spark {
position: absolute; width: 8px; height: 8px; border-radius: 50%;
background: #ffdf8a; box-shadow: 0 0 12px rgba(255, 194, 0, .95);
animation: hplpTw 2.8s ease-in-out infinite;
}
#hp-ponik-klub .hplp-spark.s1 { left: 30%; top: 12%; }
#hp-ponik-klub .hplp-spark.s2 { left: 74%; top: 30%; animation-delay: -.9s; }
#hp-ponik-klub .hplp-spark.s3 { left: 22%; top: 62%; animation-delay: -1.6s; width: 6px; height: 6px; }
#hp-ponik-klub .hplp-spark.s4 { left: 62%; top: 8%; animation-delay: -2.2s; width: 5px; height: 5px; }
@keyframes hplpTw { 0%, 100% { opacity: .2; transform: scale(.7); } 50% { opacity: 1; transform: scale(1.2); } }
/* ---------- the four parts ---------- */
#hp-ponik-klub .hplp-pillars {
display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px;
margin-top: clamp(40px, 6vw, 70px);
}
#hp-ponik-klub .hplp-pillar {
display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px;
padding: 20px 14px 18px; border-radius: 20px; color: var(--ink);
background: linear-gradient(160deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, .04)), linear-gradient(rgba(18, 17, 46, .78), rgba(18, 17, 46, .78));
border: 1px solid var(--line-soft);
transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
#hp-ponik-klub .hplp-pillar:hover, #hp-ponik-klub .hplp-pillar:focus { color: var(--ink); transform: translateY(-4px); border-color: rgba(255, 194, 0, .55); box-shadow: 0 18px 40px rgba(0, 0, 0, .4); }
#hp-ponik-klub .hplp-pillar:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
#hp-ponik-klub .hplp-pillar img { width: 64px; height: 64px; object-fit: contain; margin-bottom: 6px; filter: drop-shadow(0 8px 10px rgba(0, 0, 0, .4)); }
#hp-ponik-klub .hplp-pillar b { font-family: var(--display); font-weight: 400; font-size: 17px; letter-spacing: .03em; color: var(--cream); }
#hp-ponik-klub .hplp-pillar span { font-family: var(--head); font-style: italic; font-size: 14px; color: var(--ink-faint); }
#hp-ponik-klub .hplp-wheel-ico {
display: block; width: 58px; height: 58px; margin: 3px 0 9px; border-radius: 50%;
background: conic-gradient(#ffc200 0 45deg, #ff7ad9 0 90deg, #8a63ff 0 135deg, #f599ff 0 180deg, #e0a400 0 225deg, #d8388f 0 270deg, #5c46c9 0 315deg, #c96ad4 0);
box-shadow: 0 0 0 5px #5d3413, 0 0 0 7px #8a5426, 0 10px 16px rgba(0, 0, 0, .45);
position: relative;
}
#hp-ponik-klub .hplp-wheel-ico::after { content: ""; position: absolute; inset: 40%; border-radius: 50%; background: #ffc200; box-shadow: 0 0 0 2px #8a5d00; }
/* ---------- three steps ---------- */
#hp-ponik-klub .hplp-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 34px; counter-reset: none; }
#hp-ponik-klub .hplp-step {
position: relative; padding: 30px 24px 26px; border-radius: 22px;
background: linear-gradient(160deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .04)), linear-gradient(rgba(18, 17, 46, .8), rgba(18, 17, 46, .8));
border: 1px solid var(--line-soft);
}
#hp-ponik-klub .hplp-stepn {
display: inline-flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 50%;
font-family: var(--display); font-size: 24px; color: #2a1a00;
background: linear-gradient(180deg, #ffe07a, #ffc200 55%, #f0a800); box-shadow: 0 5px 0 var(--gold-edge);
}
#hp-ponik-klub .hplp-step h3 { font-family: var(--display); font-weight: 400; font-size: 21px; letter-spacing: .02em; color: var(--cream); margin: 18px 0 8px; }
#hp-ponik-klub .hplp-step p { color: var(--ink-dim); font-size: 16px; }
/* ---------- chests ---------- */
#hp-ponik-klub .hplp-tiers { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin-top: 36px; }
#hp-ponik-klub .hplp-tier,
#hp-ponik-klub .hplp-tier:hover,
#hp-ponik-klub .hplp-tier:focus {
-webkit-appearance: none; appearance: none;
display: flex; flex-direction: column; align-items: center; gap: 4px; width: 100%; height: 100%;
padding: 16px 10px 18px; margin: 0; border-radius: 20px; cursor: pointer;
font: inherit; line-height: 1.4; white-space: normal; color: var(--ink); text-align: center; text-transform: none; letter-spacing: normal;
background: linear-gradient(160deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .035)), linear-gradient(rgba(18, 17, 46, .82), rgba(18, 17, 46, .82));
border: 1px solid var(--line-soft);
transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
#hp-ponik-klub .hplp-tier:hover { transform: translateY(-4px); border-color: rgba(255, 194, 0, .45); box-shadow: 0 18px 38px rgba(0, 0, 0, .4); }
#hp-ponik-klub .hplp-tier[aria-pressed="true"] { border-color: var(--gold); box-shadow: 0 0 0 2px rgba(255, 194, 0, .45), 0 0 36px rgba(255, 194, 0, .25), 0 18px 38px rgba(0, 0, 0, .4); }
#hp-ponik-klub .hplp-tier:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
#hp-ponik-klub .hplp-tier img { width: 120px; height: 120px; object-fit: contain; filter: drop-shadow(0 12px 14px rgba(0, 0, 0, .45)); transition: transform .3s cubic-bezier(.3, 1.5, .5, 1); }
#hp-ponik-klub .hplp-tier:hover img { transform: translateY(-4px) rotate(-3deg) scale(1.05); }
#hp-ponik-klub .hplp-tier b { font-family: var(--head); font-weight: 400; font-size: 15px; color: var(--ink-dim); margin-top: 6px; }
#hp-ponik-klub .hplp-tier-min { font-family: var(--display); font-size: 20px; color: var(--gold); letter-spacing: .02em; }
#hp-ponik-klub .hplp-tier small { font-family: var(--head); font-style: italic; font-size: 12.5px; line-height: 1.4; color: var(--ink-faint); }
/* the chest popup, drawn in place (profile.css's .hp-mcard + carousel) */
#hp-ponik-klub .hplp-demo {
width: min(560px, 100%); margin: 34px auto 0; padding: 28px 24px 22px;
display: flex; flex-direction: column; align-items: center; text-align: center;
border-color: rgba(255, 194, 0, .4);
box-shadow: 0 26px 70px rgba(0, 0, 0, .45), 0 0 60px rgba(255, 194, 0, .14), inset 0 1px 0 rgba(255, 255, 255, .16);
}
#hp-ponik-klub .hplp-sub { font-family: var(--head); font-style: italic; font-size: 14px; color: rgba(255, 236, 200, .78); margin: 12px 0 2px; }
#hp-ponik-klub .hplp-chest-vis { position: relative; width: 200px; margin: 6px auto 4px; cursor: pointer; filter: drop-shadow(0 12px 20px rgba(0, 0, 0, .5)); transition: transform .35s cubic-bezier(.3, 1.5, .5, 1); }
#hp-ponik-klub .hplp-chest-vis:hover { transform: translateY(-6px) rotate(-3deg) scale(1.04); }
#hp-ponik-klub .hplp-chest-vis:focus-visible { outline: 3px solid var(--gold); outline-offset: 4px; border-radius: 20px; }
#hp-ponik-klub .hplp-crays {
position: absolute; inset: -22%; z-index: 0; border-radius: 50%;
background: repeating-conic-gradient(from 0deg, rgba(255, 215, 94, .4) 0deg 9deg, transparent 9deg 24deg);
-webkit-mask: radial-gradient(circle, #000 26%, transparent 68%); mask: radial-gradient(circle, #000 26%, transparent 68%);
opacity: .55; animation: hplpSpin 16s linear infinite;
}
#hp-ponik-klub .hplp-flash {
position: absolute; inset: -18%; z-index: 2; border-radius: 50%; opacity: 0; pointer-events: none;
background: radial-gradient(circle, rgba(255, 233, 176, .95), rgba(255, 194, 0, .4) 45%, transparent 70%);
}
#hp-ponik-klub .hplp-chest-vis.open .hplp-flash { animation: hplpFlash .9s ease-out; }
@keyframes hplpFlash { 0% { opacity: 0; transform: scale(.4); } 22% { opacity: 1; } 100% { opacity: 0; transform: scale(1.6); } }
#hp-ponik-klub .hplp-chest-img { position: relative; z-index: 1; display: block; width: 100%; height: auto; animation: hplpBob 4.5s ease-in-out infinite; }
#hp-ponik-klub .hplp-chest-vis.open .hplp-chest-img { animation: hplpBurst .7s cubic-bezier(.3, 1.6, .5, 1); }
@keyframes hplpBurst { 0% { transform: scale(1); } 30% { transform: scaleX(1.08) scaleY(.88); } 60% { transform: scaleX(.94) scaleY(1.12) translateY(-8px); } 100% { transform: scale(1.05) translateY(-3px); } }
#hp-ponik-klub .hplp-cspark { position: absolute; z-index: 2; width: 7px; height: 7px; border-radius: 50%; background: #ffdf8a; box-shadow: 0 0 10px rgba(255, 194, 0, .9); opacity: 0; pointer-events: none; }
#hp-ponik-klub .hplp-cspark.s1 { left: 24%; top: 30%; }
#hp-ponik-klub .hplp-cspark.s2 { left: 50%; top: 22%; }
#hp-ponik-klub .hplp-cspark.s3 { left: 74%; top: 30%; }
#hp-ponik-klub .hplp-cspark.s4 { left: 36%; top: 18%; width: 5px; height: 5px; }
#hp-ponik-klub .hplp-cspark.s5 { left: 63%; top: 16%; width: 5px; height: 5px; }
#hp-ponik-klub .hplp-chest-vis.open .hplp-cspark { animation: hplpSpark 1.1s ease-out forwards; }
#hp-ponik-klub .hplp-chest-vis.open .hplp-cspark.s2 { animation-delay: .1s; }
#hp-ponik-klub .hplp-chest-vis.open .hplp-cspark.s3 { animation-delay: .2s; }
#hp-ponik-klub .hplp-chest-vis.open .hplp-cspark.s4 { animation-delay: .32s; }
#hp-ponik-klub .hplp-chest-vis.open .hplp-cspark.s5 { animation-delay: .42s; }
@keyframes hplpSpark { 0% { opacity: 0; transform: translateY(10px); } 30% { opacity: 1; } 100% { opacity: 0; transform: translateY(-42px); } }
#hp-ponik-klub .hplp-carousel {
position: relative; width: 100%; height: 100px; margin: 10px 0 18px;
border-radius: 14px; background: rgba(10, 10, 26, .6);
border: 1px solid var(--line-soft); box-shadow: inset 0 4px 12px rgba(0, 0, 0, .5);
}
#hp-ponik-klub .hplp-cwin {
position: absolute; inset: 0; overflow: hidden; border-radius: inherit;
-webkit-mask: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
mask: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
}
#hp-ponik-klub .hplp-strip { display: flex; gap: 8px; position: absolute; left: 0; top: 9px; will-change: transform; }
#hp-ponik-klub .hplp-tile {
flex: 0 0 78px; height: 82px; border-radius: 12px;
display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
font-family: var(--display); color: #fff;
border: 1px solid rgba(255, 255, 255, .18);
background: var(--tbg, linear-gradient(160deg, #5a5a72, #3a3a50));
}
#hp-ponik-klub .hplp-tile b { font-size: 16.5px; font-weight: 400; }
#hp-ponik-klub .hplp-tile small { font-family: var(--body); font-size: 9.5px; opacity: .8; letter-spacing: .06em; }
#hp-ponik-klub .r-common { --tbg: linear-gradient(160deg, #5a5a72, #3a3a50); }
#hp-ponik-klub .r-uncommon { --tbg: linear-gradient(160deg, #57c785, #2e7d4f); }
#hp-ponik-klub .r-rare { --tbg: linear-gradient(160deg, #4f8fd6, #2a5aa8); }
#hp-ponik-klub .r-epic { --tbg: linear-gradient(160deg, #9a5bd6, #6b2ba8); }
#hp-ponik-klub .r-jackpot { --tbg: linear-gradient(160deg, #ffd75e, #e8a800); color: #2b1600; box-shadow: 0 0 16px rgba(255, 194, 0, .5); }
#hp-ponik-klub .hplp-tile.win { animation: hplpTilePulse 1.1s ease-in-out infinite; }
@keyframes hplpTilePulse { 0%, 100% { box-shadow: 0 0 10px rgba(255, 194, 0, .4); } 50% { box-shadow: 0 0 28px rgba(255, 194, 0, .95); } }
#hp-ponik-klub .hplp-cmark {
position: absolute; left: 50%; top: -3px; bottom: -3px; width: 2px; z-index: 2;
background: var(--gold); transform: translateX(-50%); box-shadow: 0 0 10px rgba(255, 194, 0, .8); pointer-events: none;
}
#hp-ponik-klub .hplp-result {
min-height: 1.6em; margin: 14px 0 0;
font-family: var(--display); font-size: 19px; letter-spacing: .02em; color: var(--gold-soft);
opacity: 0; transform: translateY(6px); transition: opacity .3s ease, transform .3s ease;
}
#hp-ponik-klub .hplp-result.show { opacity: 1; transform: none; }
#hp-ponik-klub .hplp-note { margin-top: 6px; max-width: 30em; }
/* ---------- levels ---------- */
#hp-ponik-klub .hplp-callout {
margin-top: 22px; padding: 16px 18px; border-radius: 16px; max-width: 38em;
background: rgba(255, 194, 0, .08); border: 1px solid rgba(255, 194, 0, .35);
color: var(--ink-dim); font-size: 16px;
}
#hp-ponik-klub .hplp-callout-k {
display: inline-block; margin-right: 6px; padding: 2px 10px; border-radius: 999px;
font-family: var(--display); font-size: 12.5px; letter-spacing: .06em; text-transform: uppercase;
color: #2a1a00; background: linear-gradient(180deg, #ffe07a, #ffc200);
}
#hp-ponik-klub .hplp-shot { position: relative; }
#hp-ponik-klub .hplp-shot img {
display: block; width: 100%; border-radius: 20px;
border: 1px solid rgba(255, 255, 255, .22);
box-shadow: 0 30px 70px rgba(0, 0, 0, .55), 0 0 0 6px rgba(255, 255, 255, .04);
transform: rotate(1.2deg);
}
#hp-ponik-klub .hplp-shot.tall { max-width: 380px; margin: 0 auto; }
#hp-ponik-klub .hplp-shot.tall img { transform: rotate(-1.4deg); }
#hp-ponik-klub .hplp-shot figcaption { margin-top: 16px; text-align: center; font-family: var(--head); font-style: italic; font-size: 14px; color: rgba(255, 236, 200, .72); }
#hp-ponik-klub .hplp-ladder {
position: relative; display: flex; align-items: flex-end; justify-content: space-between; gap: 10px;
margin-top: clamp(40px, 6vw, 64px); padding: 0 6px 6px;
}
#hp-ponik-klub .hplp-ladder::before {
content: ""; position: absolute; left: 4%; right: 4%; bottom: 40px; height: 4px; border-radius: 4px;
background: linear-gradient(90deg, rgba(139, 123, 255, .5), rgba(255, 122, 217, .6), rgba(255, 194, 0, .85));
}
#hp-ponik-klub .hplp-ladder li { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; flex: 1 1 0; min-width: 0; }
#hp-ponik-klub .hplp-ladder img { width: calc(58px + var(--i) * 10px); filter: drop-shadow(0 10px 14px rgba(0, 0, 0, .45)); }
#hp-ponik-klub .hplp-ladder span { font-family: var(--display); font-size: 13.5px; letter-spacing: .04em; color: var(--cream); white-space: nowrap; }
#hp-ponik-klub.hplp-js .hplp-ladder li { opacity: 0; transform: translateY(16px) scale(.9); transition: opacity .5s ease, transform .55s cubic-bezier(.3, 1.5, .5, 1); transition-delay: calc(var(--i) * 90ms); }
#hp-ponik-klub.hplp-js .hplp-ladder.in li { opacity: 1; transform: none; }
/* ---------- wheel + daily reward ---------- */
#hp-ponik-klub .hplp-wheel { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 30px 22px 22px; }
#hp-ponik-klub .hplp-wheel-stage { width: min(320px, 78vw); }
#hp-ponik-klub .hplp-wheel-stage svg { display: block; width: 100%; height: auto; }
#hp-ponik-klub .hplp-wheel-rot { transform-box: view-box; transform-origin: 110px 110px; }
#hp-ponik-klub .hplp-wheel.idle .hplp-wheel-rot { animation: hplpSway 3.6s ease-in-out infinite alternate; }
@keyframes hplpSway { from { transform: rotate(-5deg); } to { transform: rotate(5deg); } }
#hp-ponik-klub .hplp-wheel .hplp-btn { margin-top: 18px; }
#hp-ponik-klub .hplp-streak { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; }
#hp-ponik-klub .hplp-streak li {
display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
padding: 10px 4px 9px; border-radius: 14px; text-align: center; min-height: 86px;
background: linear-gradient(160deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .04)), linear-gradient(rgba(24, 22, 58, .9), rgba(24, 22, 58, .9));
border: 1px solid var(--line-soft);
}
#hp-ponik-klub .hplp-streak small { font-family: var(--head); font-style: italic; font-size: 11.5px; color: var(--ink-faint); }
#hp-ponik-klub .hplp-streak b { font-family: var(--display); font-weight: 400; font-size: 19px; color: var(--gold); line-height: 1.2; }
#hp-ponik-klub .hplp-streak span { font-family: var(--body); font-size: 10.5px; letter-spacing: .06em; color: var(--ink-dim); line-height: 1.25; }
#hp-ponik-klub .hplp-streak li.gold { background: linear-gradient(160deg, #ffe07a, #ffc200 60%, #f0a800); border-color: transparent; box-shadow: 0 0 26px rgba(255, 194, 0, .35); }
#hp-ponik-klub .hplp-streak li.gold small, #hp-ponik-klub .hplp-streak li.gold span { color: #4a2c00; }
/* ---------- badges ---------- */
/* rows of four (three, two) — a short last row sits in the middle */
#hp-ponik-klub .hplp-badges { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 36px; }
#hp-ponik-klub .hplp-badge { flex: 0 0 calc((100% - 3 * 14px) / 4);
display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px;
padding: 20px 14px 18px; border-radius: 20px;
background: linear-gradient(160deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .035)), linear-gradient(rgba(18, 17, 46, .82), rgba(18, 17, 46, .82));
border: 1px solid var(--line-soft);
transition: transform .2s ease, border-color .2s ease;
}
#hp-ponik-klub .hplp-badge:hover { transform: translateY(-4px); border-color: rgba(255, 194, 0, .4); }
#hp-ponik-klub .hplp-badge img { width: 96px; height: 96px; object-fit: contain; filter: drop-shadow(0 10px 12px rgba(0, 0, 0, .4)); margin-bottom: 4px; }
#hp-ponik-klub .hplp-badge b { font-family: var(--display); font-weight: 400; font-size: 16px; letter-spacing: .02em; color: var(--cream); }
#hp-ponik-klub .hplp-badge small { font-family: var(--head); font-style: italic; font-size: 13px; line-height: 1.4; color: var(--ink-faint); }
#hp-ponik-klub .hplp-xp {
margin-top: 6px; padding: 3px 11px; border-radius: 999px;
font-family: var(--display); font-size: 12.5px; letter-spacing: .04em; color: #2a1a00;
background: linear-gradient(180deg, #ffe07a, #ffc200);
}
/* ---------- the collection ---------- */
#hp-ponik-klub .hplp-rewards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 36px; }
#hp-ponik-klub .hplp-reward {
display: flex; align-items: center; gap: 18px; padding: 20px; border-radius: 20px;
background: linear-gradient(160deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .035)), linear-gradient(rgba(18, 17, 46, .82), rgba(18, 17, 46, .82));
border: 1px solid var(--line-soft);
}
#hp-ponik-klub .hplp-reward .val {
flex: 0 0 76px; height: 76px; border-radius: 18px;
display: flex; align-items: center; justify-content: center;
font-family: var(--display); font-size: 22px; letter-spacing: .01em;
box-shadow: 0 10px 22px rgba(0, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .5);
}
#hp-ponik-klub .hplp-reward .val.coupon { color: #2a1a00; background: linear-gradient(160deg, #ffe07a, #ffc200 60%, #f0a800); }
#hp-ponik-klub .hplp-reward .val.ship { font-size: 34px; background: linear-gradient(160deg, #8dffbc, #2fae6a); }
#hp-ponik-klub .hplp-reward .val.gift { font-size: 34px; background: linear-gradient(160deg, #ffb2ea, var(--magenta) 65%, #f052bd); }
#hp-ponik-klub .hplp-reward .val.boost { color: #06283a; font-size: 28px; background: linear-gradient(160deg, #b7f0ff, #4db6d9); }
#hp-ponik-klub .hplp-reward h3 { font-family: var(--display); font-weight: 400; font-size: 19px; letter-spacing: .02em; color: var(--cream); margin-bottom: 4px; }
#hp-ponik-klub .hplp-reward p { font-size: 15.5px; color: var(--ink-dim); }
/* ---------- the tour ---------- */
#hp-ponik-klub .hplp-help { display: flex; align-items: center; gap: 14px; margin-top: 22px; font-family: var(--head); font-style: italic; font-size: 15px; color: rgba(255, 236, 200, .82); }
#hp-ponik-klub .hplp-help img { width: 56px; height: 56px; border-radius: 50%; box-shadow: 0 0 0 3px #ff3d78, 0 8px 18px rgba(0, 0, 0, .4); }
/* ---------- FAQ ---------- */
#hp-ponik-klub .hplp-faq-list { max-width: 780px; margin: 30px auto 0; }
#hp-ponik-klub .hplp-faq details {
margin-top: 12px; border-radius: 18px;
background: linear-gradient(160deg, rgba(255, 255, 255, .09), rgba(255, 255, 255, .03)), linear-gradient(rgba(18, 17, 46, .82), rgba(18, 17, 46, .82));
border: 1px solid var(--line-soft);
}
#hp-ponik-klub .hplp-faq summary {
position: relative; list-style: none; cursor: pointer;
padding: 18px 56px 18px 22px;
font-family: var(--display); font-weight: 400; font-size: 17px; letter-spacing: .02em; color: var(--cream);
}
#hp-ponik-klub .hplp-faq summary::-webkit-details-marker { display: none; }
#hp-ponik-klub .hplp-faq summary::after {
content: "+"; position: absolute; right: 20px; top: 50%; transform: translateY(-50%);
width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
font-size: 20px; line-height: 1; color: #2a1a00; background: linear-gradient(180deg, #ffe07a, #ffc200);
}
#hp-ponik-klub .hplp-faq details[open] summary::after { content: "−"; }
#hp-ponik-klub .hplp-faq summary:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; border-radius: 18px; }
#hp-ponik-klub .hplp-faq details p { padding: 0 22px 20px; color: var(--ink-dim); font-size: 16px; }
/* ---------- the invitation again ---------- */
#hp-ponik-klub .hplp-final-card {
position: relative; overflow: hidden; text-align: center;
padding: clamp(34px, 5vw, 56px) clamp(18px, 4vw, 48px) clamp(34px, 5vw, 50px);
border-radius: 30px;
background:
radial-gradient(80% 70% at 50% 0%, rgba(255, 194, 0, .2), transparent 70%),
linear-gradient(160deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .04)),
linear-gradient(rgba(26, 18, 58, .94), rgba(16, 12, 40, .96));
border: 2px solid rgba(255, 194, 0, .5);
box-shadow: 0 30px 80px rgba(0, 0, 0, .5), 0 0 70px rgba(255, 194, 0, .16);
}
#hp-ponik-klub .hplp-final-card .hplp-lead { margin: 0 auto; }
#hp-ponik-klub .hplp-final-card .hplp-cta, #hp-ponik-klub .hplp-final-card .hplp-bonus { justify-content: center; }
#hp-ponik-klub .hplp-final-chests { display: flex; justify-content: center; align-items: flex-end; }
#hp-ponik-klub .hplp-final-chests img { width: clamp(62px, 11vw, 120px); margin: 0 -6px; filter: drop-shadow(0 12px 14px rgba(0, 0, 0, .5)); }
#hp-ponik-klub .hplp-final-chests img:nth-child(3) { width: clamp(84px, 15vw, 160px); position: relative; z-index: 1; }
/* ---------- reveal on scroll (JS adds .hplp-js; without JS all is shown) ---------- */
#hp-ponik-klub.hplp-js .hplp-rv { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .8s cubic-bezier(.2, .75, .2, 1); }
#hp-ponik-klub.hplp-js .hplp-rv.in { opacity: 1; transform: none; }
/* ---------- smaller screens ---------- */
@media (max-width: 1024px) {
#hp-ponik-klub .hplp-tiers { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#hp-ponik-klub .hplp-pillars { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#hp-ponik-klub .hplp-badge { flex-basis: calc((100% - 2 * 14px) / 3); }
}
@media (max-width: 820px) {
#hp-ponik-klub .hplp-hero { grid-template-columns: minmax(0, 1fr); }
#hp-ponik-klub .hplp-hero-art { max-width: 380px; margin-top: 6px; }
#hp-ponik-klub .hplp-split { grid-template-columns: minmax(0, 1fr); }
#hp-ponik-klub .hplp-split.rev > :first-child { order: 2; }
#hp-ponik-klub .hplp-steps { grid-template-columns: minmax(0, 1fr); }
#hp-ponik-klub .hplp-rewards { grid-template-columns: minmax(0, 1fr); }
#hp-ponik-klub .hplp-copy { text-align: center; display: flex; flex-direction: column; align-items: center; }
#hp-ponik-klub .hplp-copy .hplp-text, #hp-ponik-klub .hplp-copy .hplp-callout { margin-left: auto; margin-right: auto; }
#hp-ponik-klub .hplp-help { justify-content: center; text-align: left; }
}
@media (max-width: 600px) {
#hp-ponik-klub { font-size: 16px; }
#hp-ponik-klub .hplp-hero-copy { text-align: center; display: flex; flex-direction: column; align-items: center; }
#hp-ponik-klub .hplp-cta { flex-direction: column; align-items: stretch; width: 100%; }
#hp-ponik-klub .hplp-cta .hplp-btn { width: 100%; padding: 12px 18px; }
#hp-ponik-klub .hplp-bonus { justify-content: center; text-align: center; }
#hp-ponik-klub .hplp-pill { font-size: 11.5px; padding: 8px 14px; letter-spacing: .1em; justify-content: center; text-align: center; }
#hp-ponik-klub .hplp-pill-dot { display: none; }
#hp-ponik-klub .hplp-chip { padding: 8px 12px; font-size: 13px; }
#hp-ponik-klub .hplp-chip b { font-size: 19px; }
#hp-ponik-klub .hplp-chip-gift { right: 6%; top: 50%; }
#hp-ponik-klub .hplp-chip-xp { left: 0; bottom: 12%; }
#hp-ponik-klub .hplp-tiers { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
#hp-ponik-klub .hplp-tiers li:last-child { grid-column: 1 / -1; justify-self: center; width: calc(50% - 5px); }
#hp-ponik-klub .hplp-tier img { width: 96px; height: 96px; }
#hp-ponik-klub .hplp-pillars { gap: 10px; }
#hp-ponik-klub .hplp-pillar { padding: 16px 8px 14px; }
#hp-ponik-klub .hplp-pillar b { font-size: 15px; }
#hp-ponik-klub .hplp-pillar span { font-size: 12.5px; }
#hp-ponik-klub .hplp-demo { padding: 50px 14px 20px; }
#hp-ponik-klub .hplp-sample { top: 12px; right: 12px; }
#hp-ponik-klub .hplp-chest-vis { width: 170px; }
#hp-ponik-klub .hplp-ladder { flex-wrap: wrap; justify-content: center; row-gap: 18px; }
#hp-ponik-klub .hplp-ladder::before { display: none; }
#hp-ponik-klub .hplp-ladder li { flex: 0 0 22%; }
#hp-ponik-klub .hplp-ladder img { width: calc(46px + var(--i) * 4px); }
#hp-ponik-klub .hplp-streak { grid-template-columns: repeat(4, minmax(0, 1fr)); }
#hp-ponik-klub .hplp-streak li.gold { grid-column: span 1; }
#hp-ponik-klub .hplp-badges { gap: 10px; }
#hp-ponik-klub .hplp-badge { flex-basis: calc((100% - 10px) / 2); }
#hp-ponik-klub .hplp-badge { padding: 16px 10px 14px; }
#hp-ponik-klub .hplp-badge img { width: 76px; height: 76px; }
#hp-ponik-klub .hplp-reward { padding: 16px; gap: 14px; }
#hp-ponik-klub .hplp-reward .val { flex-basis: 62px; height: 62px; font-size: 18px; }
#hp-ponik-klub .hplp-faq summary { font-size: 15.5px; padding: 16px 52px 16px 18px; }
}
/* ---------- motion off ---------- */
@media (prefers-reduced-motion: reduce) {
#hp-ponik-klub *, #hp-ponik-klub *::before, #hp-ponik-klub *::after { animation: none !important; }
#hp-ponik-klub.hplp-js .hplp-rv, #hp-ponik-klub.hplp-js .hplp-ladder li { opacity: 1; transform: none; transition: none; }
}
🐴 Poník klub · Věrnostní program HighPony
Odměny za každý nákup
Za nákupy sbíráš XP a stoupáš v levelech, z objednávek otevíráš truhly, každý den si točíš kolem štěstí a sbíráš odznaky. Je to zdarma – stačí ti účet.
+100 XP Za založení účtu dostaneš hned +100 XP.
+800 XP
−10 %
🎁 Tajný dárek
Truhly
za objednávku od 600 Kč
Kolo štěstí
každý den jedno točení
Levely a XP
30 levelů s odměnami
Odznaky
12 odznaků ke sbírání
Jak se přidat
Tři kroky a jsi v klubu
1
Založ si účet
Je zdarma a máš ho za minutu. Poník klub najdeš v sekci Můj účet.
2
Nakupuj jako vždy
Za každý nákup dostaneš XP a za objednávku od 600 Kč i truhlu s odměnou.
3
Vybírej odměny
Slevy, dopravu zdarma, dárky a XP boosty najdeš v sekci Moje sbírka.
Truhly
Každá objednávka od 600 Kč otevře truhlu
Čím větší objednávka, tím lepší truhla – a tím větší odměny v ní. Klikni na truhlu a vyzkoušej si, jak se otevírá.
Bronzová truhla
od 600 Kč
+50 až +150 XP · XP boost ×1,5
Stříbrná truhla
od 1 200 Kč
+100 až +300 XP · XP boost ×2
Zlatá truhla
od 1 800 Kč
+200 až +600 XP · XP boost ×2
Smaragdová truhla
od 2 400 Kč
+350 až +1 000 XP · XP boost ×2,5
Diamantová truhla
od 3 000 Kč
+600 až +1 200 XP · Tajný dárek · XP boost ×3
Počítáme zboží po slevách, dopravu ne.
Ukázka
Diamantová truhla
Takhle se otevírá truhla k objednávce.
Otevřít truhlu
Tohle je jen ukázka. Skutečnou truhlu otevřeš po každé objednávce od 600 Kč.
Ukázka
-5 % 🎁 +50XP +20XP -10 % +30XP 🚚 Nic
Zatoč si
Tohle je jen ukázka. Naostro si zatočíš v profilu – jednou denně.
Kolo štěstí
Každý den jedno točení
Každý den si v profilu vyzvedneš denní odměnu a zatočíš si kolem štěstí – vyhrát můžeš XP, slevy, dopravu zdarma i dárky.
Denní odměna
1. den +10 XP 2. den +10 XP 3. den +15 XP 4. den +15 XP 5. den +20 XP 6. den +25 XP 7. den ✨ Týdenní kolo
Když si denní odměnu vyzvedneš 7 dní po sobě, zatočíš si i týdenním kolem – tam vyhrává každé políčko.
Moje sbírka
Všechny odměny na jednom místě
Co vyhraješ, najdeš v profilu v sekci Moje sbírka.
−10 % Slevové kupony Osobní kód se slevou. Klikneš na něj, zkopíruje se a použiješ ho v košíku.
🚚 Doprava zdarma Kupon, se kterým ti další objednávku pošleme zdarma.
🎁 Tajný dárek Přibalíme ho k tvé další objednávce.
×2 XP boost Zapneš si ho ve sbírce a za nákupy dostáváš víc XP.
Jak to funguje
Průvodce ti všechno ukáže
Návod ke všemu najdeš v profilu. Když něčemu nerozumíš, klikni na otazník vedle svého jména.
Časté otázky
Kolik stojí členství? Nic. Poník klub je zdarma pro každého, kdo u nás má účet.
Už u vás mám účet. Musím se do klubu přihlásit? Ne. Každý účet je v klubu automaticky – stačí se přihlásit a otevřít Můj účet.
Kde najdu svoje odměny? V profilu, v sekci Moje sbírka. Kupon zkopíruješ jedním kliknutím a použiješ ho v košíku.
Jak dostanu dárek? Přibalíme ho k tvé další objednávce – nemusíš nic dělat.
Přidej se do Poník klubu
Účet je zdarma a založíš si ho za minutu.
+100 XP Za založení účtu dostaneš hned +100 XP.
🐴 Poník klub · Věrnostní program HighPony
Odměny za každý nákup
Za nákupy sbíráš XP a stoupáš v levelech, z objednávek otevíráš truhly, každý den si točíš kolem štěstí a sbíráš odznaky. Je to zdarma – stačí ti účet.
+100 XP Za založení účtu dostaneš hned +100 XP.
+800 XP
−10 %
🎁 Tajný dárek
Truhly
za objednávku od 600 Kč
Kolo štěstí
každý den jedno točení
Levely a XP
30 levelů s odměnami
Odznaky
12 odznaků ke sbírání
Jak se přidat
Tři kroky a jsi v klubu
1
Založ si účet
Je zdarma a máš ho za minutu. Poník klub najdeš v sekci Můj účet.
2
Nakupuj jako vždy
Za každý nákup dostaneš XP a za objednávku od 600 Kč i truhlu s odměnou.
3
Vybírej odměny
Slevy, dopravu zdarma, dárky a XP boosty najdeš v sekci Moje sbírka.
Truhly
Každá objednávka od 600 Kč otevře truhlu
Čím větší objednávka, tím lepší truhla – a tím větší odměny v ní. Klikni na truhlu a vyzkoušej si, jak se otevírá.
Bronzová truhla
od 600 Kč
+50 až +150 XP · XP boost ×1,5
Stříbrná truhla
od 1 200 Kč
+100 až +300 XP · XP boost ×2
Zlatá truhla
od 1 800 Kč
+200 až +600 XP · XP boost ×2
Smaragdová truhla
od 2 400 Kč
+350 až +1 000 XP · XP boost ×2,5
Diamantová truhla
od 3 000 Kč
+600 až +1 200 XP · Tajný dárek · XP boost ×3
Počítáme zboží po slevách, dopravu ne.
Ukázka
Diamantová truhla
Takhle se otevírá truhla k objednávce.
Otevřít truhlu
Tohle je jen ukázka. Skutečnou truhlu otevřeš po každé objednávce od 600 Kč.
Ukázka
-5 % 🎁 +50XP +20XP -10 % +30XP 🚚 Nic
Zatoč si
Tohle je jen ukázka. Naostro si zatočíš v profilu – jednou denně.
Kolo štěstí
Každý den jedno točení
Každý den si v profilu vyzvedneš denní odměnu a zatočíš si kolem štěstí – vyhrát můžeš XP, slevy, dopravu zdarma i dárky.
Denní odměna
1. den +10 XP 2. den +10 XP 3. den +15 XP 4. den +15 XP 5. den +20 XP 6. den +25 XP 7. den ✨ Týdenní kolo
Když si denní odměnu vyzvedneš 7 dní po sobě, zatočíš si i týdenním kolem – tam vyhrává každé políčko.
Moje sbírka
Všechny odměny na jednom místě
Co vyhraješ, najdeš v profilu v sekci Moje sbírka.
−10 % Slevové kupony Osobní kód se slevou. Klikneš na něj, zkopíruje se a použiješ ho v košíku.
🚚 Doprava zdarma Kupon, se kterým ti další objednávku pošleme zdarma.
🎁 Tajný dárek Přibalíme ho k tvé další objednávce.
×2 XP boost Zapneš si ho ve sbírce a za nákupy dostáváš víc XP.
Jak to funguje
Průvodce ti všechno ukáže
Návod ke všemu najdeš v profilu. Když něčemu nerozumíš, klikni na otazník vedle svého jména.
Časté otázky
Kolik stojí členství? Nic. Poník klub je zdarma pro každého, kdo u nás má účet.
Už u vás mám účet. Musím se do klubu přihlásit? Ne. Každý účet je v klubu automaticky – stačí se přihlásit a otevřít Můj účet.
Kde najdu svoje odměny? V profilu, v sekci Moje sbírka. Kupon zkopíruješ jedním kliknutím a použiješ ho v košíku.
Jak dostanu dárek? Přibalíme ho k tvé další objednávce – nemusíš nic dělat.
Přidej se do Poník klubu
Účet je zdarma a založíš si ho za minutu.
+100 XP Za založení účtu dostaneš hned +100 XP.
— the page explaining Poník klub (Frontend\Landing).
Printed inline by the shortcode, after its markup. The chest popup and the
wheel are demos: the same strip / wedges and the same motion as the real
ones (profile.js), drawn with the real odds from the settings — and they
grant nothing (no request leaves this page). */
(function () {
'use strict';
var root = document.getElementById('hp-ponik-klub');
if (!root || root.getAttribute('data-ready')) { return; }
root.setAttribute('data-ready', '1');
if (document.body) { document.body.classList.add('hplp-page'); }
var C = {};
try {
var cfgEl = root.querySelector('script.hplp-cfg');
C = JSON.parse(cfgEl ? cfgEl.textContent : '{}') || {};
} catch (e) { C = {}; }
var T = C.t || {};
var reduce = !!(window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches);
function one(sel, el) { return (el || root).querySelector(sel); }
function all(sel, el) { return Array.prototype.slice.call((el || root).querySelectorAll(sel)); }
/* a weighted draw over the configured odds */
function pick(weights) {
var total = 0, i;
for (i = 0; i < weights.length; i++) { total += Math.max(0, +weights[i] || 0); }
if (total <= 0) { return Math.floor(Math.random() * weights.length); }
var r = Math.random() * total, acc = 0;
for (i = 0; i < weights.length; i++) {
acc += Math.max(0, +weights[i] || 0);
if (r < acc) { return i; }
}
return weights.length - 1;
}
/* ---------- reveal on scroll ---------- */
root.classList.add('hplp-js');
var rv = all('.hplp-rv');
if (!reduce && 'IntersectionObserver' in window) {
var io = new IntersectionObserver(function (entries) {
entries.forEach(function (en) {
if (en.isIntersecting) { en.target.classList.add('in'); io.unobserve(en.target); }
});
}, { rootMargin: '0px 0px -6% 0px', threshold: 0.01 });
rv.forEach(function (el) { io.observe(el); });
} else {
rv.forEach(function (el) { el.classList.add('in'); });
}
/* ---------- in-page links: glide, under the sticky header ---------- */
all('a[href^="#hplp-"]').forEach(function (a) {
a.addEventListener('click', function (e) {
var id = a.getAttribute('href').slice(1), t = document.getElementById(id);
if (!t) { return; }
e.preventDefault();
t.scrollIntoView({ behavior: reduce ? 'auto' : 'smooth', block: 'start' });
if (window.history && history.replaceKraj) { history.replaceKraj(null, '', '#' + id); }
});
});
/* ---------- the chest popup (profile.js: buildStrip / doOpenChest) ---------- */
var demo = one('.hplp-demo');
if (demo && C.chests && Object.keys(C.chests).length) {
var strip = one('.hplp-strip', demo), vis = one('.hplp-chest-vis', demo), img = one('.hplp-chest-img', demo),
title = one('.hplp-demo-title', demo), btn = one('.hplp-open', demo), res = one('.hplp-result', demo);
var TILE_W = 86, WIN_AT = 33, RARITY = ['r-common', 'r-uncommon', 'r-rare', 'r-epic', 'r-jackpot'];
var tier = C.chests[C.firstDemo] ? C.firstDemo : Object.keys(C.chests)[0];
var busy = false, done = false, side = 1, timers = [];
/* filler tiles are rarity-starved, whatever the real odds (as in the profile) */
function visual() {
var w = [62, 24, 9, 4, 1], r = Math.random() * 100, acc = 0;
for (var i = 0; i < w.length; i++) { acc += w[i]; if (r < acc) { return i; } }
return 0;
}
function build(win) {
var pool = C.chests[tier].tiles || [];
var special = {};
strip.innerHTML = '';
side = Math.random() < 0.5 ? -1 : 1;
if (win !== 4) {
special[WIN_AT + side] = Math.random() < 0.55 ? 4 : 3;
if (Math.random() < 0.45) { special[WIN_AT - side] = 3; }
}
for (var i = 0; i < 40; i++) {
var pi = i === WIN_AT ? win : (special[i] !== undefined ? special[i] : visual());
pi = Math.max(0, Math.min(pi, pool.length - 1));
var t = pool[pi] || ['', ''];
var d = document.createElement('div');
d.className = 'hplp-tile ' + RARITY[pi];
var b = document.createElement('b'), s = document.createElement('small');
b.textContent = t[0];
s.textContent = t[1];
d.appendChild(b);
d.appendChild(s);
strip.appendChild(d);
}
strip.style.transition = 'none';
strip.style.transform = 'translateX(0)';
}
function clearTimers() { timers.forEach(clearTimeout); timers = []; }
function setTier(key) {
if (!C.chests[key]) { return; }
clearTimers();
busy = false;
done = false;
tier = key;
var c = C.chests[key];
title.textContent = c.name;
if (img.getAttribute('src') !== c.big) { img.src = c.big; }
img.alt = c.name;
vis.classList.remove('open');
res.textContent = '';
res.classList.remove('show');
btn.disabled = false;
btn.textContent = T.open || '';
build(visual());
all('.hplp-tier').forEach(function (b) {
b.setAttribute('aria-pressed', b.getAttribute('data-tier') === key ? 'true' : 'false');
});
}
function open() {
if (busy) { return; }
if (done) { setTier(tier); }
busy = true;
btn.disabled = true;
btn.textContent = T.spinning || '';
var c = C.chests[tier], win = pick(c.weights || []);
build(win);
vis.classList.remove('open');
void vis.offsetWidth;
vis.classList.add('open');
var vw = strip.parentElement.clientWidth || 480;
/* landing well inside the winning tile — never on a border */
var jitter = (win !== 4 && Math.random() < 0.65) ? side * (10 + Math.random() * 8) : (Math.random() * 28) - 14;
var target = (WIN_AT * TILE_W + 39) - (vw / 2) + jitter;
var dur = reduce ? 0.35 : 6.4;
timers.push(setTimeout(function () {
strip.style.transition = 'transform ' + dur + 's cubic-bezier(.09,.72,.1,1)';
strip.style.transform = 'translateX(' + (-target) + 'px)';
}, reduce ? 30 : 380));
timers.push(setTimeout(function () {
var w = strip.children[WIN_AT];
if (w) { w.classList.add('win'); }
res.textContent = (c.wins && c.wins[win]) || '';
res.classList.add('show');
btn.textContent = T.again || '';
btn.disabled = false;
busy = false;
done = true;
}, reduce ? 500 : 7100));
}
btn.addEventListener('click', open);
vis.addEventListener('click', open);
vis.addEventListener('keydown', function (e) {
if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); open(); }
});
all('.hplp-tier').forEach(function (b) {
b.addEventListener('click', function () {
setTier(b.getAttribute('data-tier'));
var r = demo.getBoundingClientRect();
if (r.top > window.innerHeight * 0.55 || r.bottom < 0) {
demo.scrollIntoView({ behavior: reduce ? 'auto' : 'smooth', block: 'center' });
}
});
});
setTier(tier);
}
/* ---------- the daily wheel ---------- */
var wheel = one('.hplp-wheel');
var g = wheel ? one('#hplp-wheel-rot', wheel) : null;
if (wheel && g && C.wheel && C.wheel.prizes && C.wheel.prizes.length) {
var spin = one('.hplp-spin', wheel), wres = one('.hplp-result', wheel);
var rot = 0, wbusy = false;
spin.addEventListener('click', function () {
if (wbusy) { return; }
wbusy = true;
spin.disabled = true;
spin.textContent = T.spinning || '';
wres.classList.remove('show');
wres.textContent = '';
wheel.classList.remove('idle');
var n = C.wheel.prizes.length, seg = 360 / n, idx = pick(C.wheel.weights || []);
/* the pointer is at the top: bring the wedge's middle there, a little off-centre */
var want = (360 - (idx * seg + seg / 2) + (Math.random() - 0.5) * seg * 0.6) % 360;
if (want < 0) { want += 360; }
var cur = ((rot % 360) + 360) % 360, delta = want - cur;
if (delta < 0) { delta += 360; }
rot += 360 * (reduce ? 1 : 5) + delta;
var dur = reduce ? 0.4 : 5.2;
g.style.transition = 'transform ' + dur + 's cubic-bezier(.15,.62,.12,1)';
g.style.transform = 'rotate(' + rot + 'deg)';
setTimeout(function () {
wres.textContent = (C.wheel.wins && C.wheel.wins[idx]) || '';
wres.classList.add('show');
spin.disabled = false;
spin.textContent = T.spinAgain || '';
wbusy = false;
}, dur * 1000 + 150);
});
}
}());
Level 1
Level 5
Level 10
Level 15
Level 20
Level 25
Level 30
První krok
Tvoje první objednávka.
+100 XP
1 250 Kč
Objednávka za 1 250 Kč a víc.
+250 XP
2 500 Kč
Objednávka za 2 500 Kč a víc.
+500 XP
3 750 Kč
Objednávka za 3 750 Kč a víc.
+750 XP
Streaaks! 7
Vyzvedni si denní odměnu 7 dní v řadě.
+150 XP
Streaaks! 28
Vyzvedni si denní odměnu 28 dní v řadě.
+350 XP
Rastafarián I
Vyzkoušej 6 různých druhů květů.
+300 XP
Rastafarián II
Vyzkoušej 9 různých druhů květů.
+750 XP
Rastafarián III
Vyzkoušej 12 různých druhů květů.
+1 250 XP
Chodník slávy I
3 různé hvězdy ve sbírce.
+500 XP
Chodník slávy II
5 různých hvězd ve sbírce.
+950 XP
Chodník slávy III
Všech 8 hvězd ve sbírce.
+1 800 XP
Průvodce tě provede celým profilem za půl minuty.
