/* ============================================================
   קידפודיה v2 — מערכת העיצוב של האתר (סביב מנוע הגלילה)
   פונטים: Secular One (כותרות) + Rubik (טקסט) — עצמאיים, בלי CDN
   ============================================================ */

:root {
  --pk-bg: #0F0C22;
  --pk-panel: #191434;
  --pk-panel-2: #221B45;
  --pk-ink: #FFF7EA;
  --pk-ink-soft: #C3BBE4;
  --pk-teal: #5EEAD4;
  --pk-amber: #FFC36B;
  --pk-display: 'Secular One', 'Rubik', system-ui, sans-serif;
  --pk-body: 'Rubik', system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--pk-bg); color: var(--pk-ink); font-family: var(--pk-body); }

/* ---------- הדר צף ---------- */
.pk-header {
  position: fixed; top: 14px; right: 0; left: 0; z-index: 60;
  display: flex; align-items: center; gap: 14px;
  direction: rtl;
  padding: 0 clamp(14px, 3vw, 36px);
  pointer-events: none;
}
.pk-header > * { pointer-events: auto; }
.pk-brand {
  display: flex; align-items: center; gap: 10px; text-decoration: none;
  padding: 8px 16px 8px 18px; border-radius: 999px;
  background: color-mix(in srgb, var(--pk-panel) 72%, transparent);
  border: 1px solid color-mix(in srgb, var(--pk-teal) 22%, transparent);
  backdrop-filter: blur(12px);
  box-shadow: 0 4px 24px rgba(0,0,0,.35);
}
.pk-brand__moon {
  width: 26px; height: 26px; border-radius: 50%;
  background: radial-gradient(circle at 34% 32%, #fff9e8 0%, var(--pk-amber) 45%, #b46ef0 100%);
  box-shadow: 0 0 14px 2px color-mix(in srgb, var(--pk-amber) 55%, transparent);
}
.pk-brand__name { font-family: var(--pk-display); font-size: 1.22rem; color: var(--pk-ink); letter-spacing: .01em; }

.pk-nav {
  display: flex; gap: 2px; margin-inline: auto;
  padding: 6px; border-radius: 999px;
  background: color-mix(in srgb, var(--pk-panel) 72%, transparent);
  border: 1px solid color-mix(in srgb, var(--pk-teal) 18%, transparent);
  backdrop-filter: blur(12px);
  box-shadow: 0 4px 24px rgba(0,0,0,.35);
  max-width: min(72vw, 720px); overflow-x: auto; scrollbar-width: none;
}
.pk-nav::-webkit-scrollbar { display: none; }
.pk-nav a {
  font-family: var(--pk-body); font-weight: 500; font-size: .92rem;
  color: var(--pk-ink-soft); text-decoration: none; white-space: nowrap;
  padding: 8px 15px; border-radius: 999px;
  transition: color .25s, background .25s, box-shadow .25s;
}
.pk-nav a:hover { color: var(--pk-ink); background: color-mix(in srgb, var(--pk-teal) 14%, transparent); }
.pk-nav a.is-active {
  color: #10251f; background: var(--pk-teal);
  box-shadow: 0 0 18px color-mix(in srgb, var(--pk-teal) 45%, transparent);
}
.pk-login {
  font-family: var(--pk-body); font-weight: 600; font-size: .9rem;
  color: var(--pk-ink); text-decoration: none; white-space: nowrap;
  padding: 9px 18px; border-radius: 999px;
  border: 1.5px solid color-mix(in srgb, var(--pk-amber) 55%, transparent);
  background: color-mix(in srgb, var(--pk-panel) 60%, transparent);
  backdrop-filter: blur(12px);
  transition: background .25s, box-shadow .25s;
}
.pk-login:hover { background: color-mix(in srgb, var(--pk-amber) 22%, transparent); box-shadow: 0 0 18px color-mix(in srgb, var(--pk-amber) 35%, transparent); }

@media (max-width: 860px) {
  .pk-header { top: 10px; gap: 8px; }
  .pk-nav { max-width: 58vw; }
  .pk-login { display: none; }
}

/* ---------- התאמות RTL ועיצוב למנוע הגלילה ---------- */
.sw-root .sw-topbar { display: none; }                     /* ההדר שלנו במקום */
.sw-root .sw-copylayer { direction: rtl; }
.sw-root .sw-copylayer::before { display: none; }           /* בלי הכהיה — התמונה מנצחת */
.sw-root .sw-copy {                                         /* כרטיס זכוכית קומפקטי מימין */
  left: auto; right: clamp(18px, 4vw, 56px);
  text-align: right;
  width: min(30vw, 400px);
  padding: 22px 26px;
  border-radius: 24px;
  background: color-mix(in srgb, var(--pk-bg) 52%, transparent);
  border: 1px solid color-mix(in srgb, var(--sw-accent) 30%, transparent);
  backdrop-filter: blur(14px);
  box-shadow: 0 10px 40px rgba(0,0,0,.35);
}
/* בזמן שמסך הפתיחה (המפה המקורית) מוצג — הכיתוב של המנוע מוסתר */
body.pk-at-top .sw-copylayer { opacity: 0; transition: opacity .3s; }
.sw-root .sw-copy__title { font-family: var(--pk-display); font-weight: 400; letter-spacing: 0; }
.sw-root .sw-copy__num { direction: ltr; unicode-bidi: isolate; }
.sw-root .sw-btn--primary {
  background: var(--sw-accent) !important; color: #131024 !important;
  font-weight: 700 !important; border: 0 !important;
  box-shadow: 0 0 20px color-mix(in srgb, var(--sw-accent) 45%, transparent);
}
.sw-root .sw-btn--primary:hover { filter: brightness(1.1); }
.sw-root .sw-copy__eyebrow { letter-spacing: .06em; }
.sw-root .sw-copy__tags { justify-content: flex-start; }
.sw-root .sw-copy__cta { justify-content: flex-start; }
.sw-root .sw-btn { font-family: var(--pk-body); font-weight: 600; }
.sw-root .sw-route { left: 18px; right: auto; }             /* מסילת המסע לצד שמאל */
@media (max-width: 860px) {
  .sw-root .sw-copy { left: clamp(14px,4vw,40px); right: clamp(14px,4vw,40px); width: auto; }
}

/* ---------- שכבת הפתיחה: המפה המקורית + ברוכים הבאים + איים נדלקים ---------- */
.pk-hero-layer { position: fixed; inset: 0; z-index: 22; transition: opacity .25s linear; }
/* בזמן המסע שכבת הפתיחה מוסתרת לגמרי — לא צובעת, לא תופסת זיכרון גרפי */
.pk-hero-layer.is-off { pointer-events: none; visibility: hidden; }
.pk-herobg {                                   /* המשך שמיים מטושטש סביב המפה המלאה */
  position: absolute; inset: -4%;
  background-size: cover; background-position: center;
  filter: blur(30px) brightness(.72) saturate(1.05);
  transform: scale(1.06);
}
.pk-heromap-wrap {                              /* עוטף בגודל cover מלא; ה־JS קובע את המלבן */
  position: absolute;
  transform-origin: center center; will-change: transform;
}
.pk-heromap { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.pk-cut {
  position: absolute; opacity: 0; pointer-events: none;
  transition: opacity .3s, transform .45s cubic-bezier(.34,1.56,.64,1), filter .3s;
  filter: drop-shadow(0 0 0 transparent);
  will-change: opacity, transform;
}
.pk-cut.is-on {
  opacity: 1; transform: scale(1.07);
  filter: brightness(1.06)
          drop-shadow(0 0 26px color-mix(in srgb, var(--cut-accent) 65%, transparent))
          drop-shadow(0 0 60px color-mix(in srgb, var(--cut-accent) 30%, transparent));
}
/* הנוף הריק של מסך הפתיחה — מתקרב ונמוג בצלילה אל המפה */
.pk-vista {
  position: absolute; inset: 0; pointer-events: none;
  background-size: cover; background-position: center 30%;
  transform-origin: center 42%; will-change: transform, opacity;
}
/* שטיפת אור רכה בגוון הזוהר — רגע "המעבר דרך הענן" */
.pk-wash {
  position: absolute; inset: -10%; pointer-events: none; opacity: 0;
  background: radial-gradient(58% 52% at 50% 42%,
    rgba(255, 250, 238, .95) 0%, rgba(94, 234, 212, .5) 46%, rgba(94, 234, 212, 0) 76%);
  filter: blur(26px); will-change: opacity;
}
.pk-welcome {
  position: absolute; left: 50%; top: 45%;
  transform: translate(-50%, -50%);
  text-align: center; direction: rtl; width: min(92vw, 820px);
  will-change: transform, opacity; pointer-events: none;
}
.pk-welcome .pk-eyebrow {
  font-family: var(--pk-display); font-size: clamp(1.05rem, 1.7vw, 1.4rem);
  letter-spacing: .06em; margin: 0 0 6px; color: #CDE8E2;
  text-shadow: 0 2px 16px rgba(20, 10, 40, .8);
}
.pk-welcome h1 {
  font-family: var(--pk-display); font-weight: 400;
  font-size: clamp(2.7rem, 6.4vw, 5rem); margin: 0; color: #FFF7EA;
  text-shadow: 0 3px 26px rgba(20, 10, 40, .75), 0 0 70px rgba(255, 195, 107, .3);
}
.pk-welcome .pk-sub {
  font-size: clamp(1.05rem, 1.9vw, 1.5rem); font-weight: 500;
  margin: 14px 0 0; color: #FFEFD2;
  text-shadow: 0 2px 18px rgba(20, 10, 40, .8);
}
.pk-welcome .pk-hint2 {
  display: inline-block; margin-top: clamp(26px, 5vh, 54px);
  font-size: clamp(.9rem, 1.3vw, 1.05rem); color: #C3BBE4;
  text-shadow: 0 2px 14px rgba(20, 10, 40, .9);
  animation: pk-bob 2.4s ease-in-out infinite;
}
@keyframes pk-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(7px); } }
@media (prefers-reduced-motion: reduce) { .pk-welcome .pk-hint2 { animation: none; } }
/* כותרת קטנה מעל המפה — נראית רק בעצירת המפה */
.pk-map-title {
  position: absolute; top: clamp(72px, 10vh, 112px); left: 50%;
  transform: translateX(-50%) translateY(-8px);
  font-family: var(--pk-display); font-size: clamp(1.05rem, 1.7vw, 1.4rem);
  color: #FFF7EA; white-space: nowrap;
  padding: 9px 22px; border-radius: 999px;
  background: color-mix(in srgb, var(--pk-bg) 62%, transparent);
  border: 1.5px solid rgba(94, 234, 212, .4);
  box-shadow: 0 0 22px rgba(94, 234, 212, .18);
  backdrop-filter: blur(10px);
  opacity: 0; pointer-events: none; transition: opacity .35s, transform .35s;
}
.pk-map-title.is-on { opacity: 1; transform: translateX(-50%) translateY(0); }
@media (max-width: 860px) { .pk-welcome { top: 42%; } }

/* ---------- אזורי לחיצה על מפת ההירו ---------- */
.pk-spots { position: fixed; inset: 0; z-index: 24; pointer-events: none; transition: opacity .45s; }
.pk-spots.is-hidden { opacity: 0; }
.pk-spots.is-hidden .pk-spot { pointer-events: none !important; }
.pk-spot {
  position: absolute; pointer-events: auto; cursor: pointer;
  border: 0; padding: 0; background: transparent;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  transition: transform .35s cubic-bezier(.34,1.56,.64,1);
}
.pk-spot::before {                                           /* הילת הזוהר */
  content: ""; position: absolute; inset: -6%;
  border-radius: 50%;
  background: radial-gradient(ellipse at center,
    color-mix(in srgb, var(--spot-accent) 34%, transparent) 0%,
    color-mix(in srgb, var(--spot-accent) 14%, transparent) 45%, transparent 72%);
  opacity: 0; transition: opacity .35s;
}
.pk-spot:hover, .pk-spot:focus-visible { transform: scale(1.06); }
.pk-spot:hover::before, .pk-spot:focus-visible::before { opacity: 1; }
.pk-spot__name {
  font-family: var(--pk-display); font-size: clamp(.85rem, 1.35vw, 1.15rem);
  color: #fff; white-space: nowrap;
  padding: 7px 16px; border-radius: 999px;
  background: color-mix(in srgb, var(--pk-bg) 68%, transparent);
  border: 1.5px solid color-mix(in srgb, var(--spot-accent) 75%, transparent);
  box-shadow: 0 0 16px color-mix(in srgb, var(--spot-accent) 40%, transparent);
  backdrop-filter: blur(8px);
  opacity: 0; transform: translateY(8px); transition: opacity .3s, transform .3s;
}
.pk-spot:hover .pk-spot__name, .pk-spot:focus-visible .pk-spot__name { opacity: 1; transform: translateY(0); }
@media (max-width: 860px) { .pk-spots { display: none; } } /* במובייל המסע בגלילה + כפתורי הכניסה */

/* קטעי התוכן של הבית גולשים מעל הבמה הקבועה של המנוע: הפריים האחרון של
   המסע (שמי המטאורים) נשאר על המסך, והתוכן — שקטעו הראשון הוא "מטאורי
   ידע" עם אותו רקע בדיוק — מחליק מעליו. רקע אטום כדי שהבמה לא תציץ
   בין הקטעים. */
#world ~ main {
  position: relative;
  z-index: 15;
  /* שקוף בכוונה: הרקע האטום חי על הקטעים עצמם (team וכו'), כך שאזור
     ה-spacer של מטאורי הידע מגלה את שמי הווידאו הקבועים שמאחור */
}

/* ---------- פוטר ---------- */
.pk-footer {
  position: relative; z-index: 10; direction: rtl;
  background: linear-gradient(180deg, transparent 0%, #0B0919 26%, #080714 100%);
  padding: clamp(60px, 9vh, 110px) clamp(20px, 6vw, 80px) 34px;
  display: grid; gap: 40px;
}
.pk-footer__motto { font-family: var(--pk-display); font-size: clamp(1.5rem, 3vw, 2.3rem); color: var(--pk-ink); margin: 0; text-align: center; }
.pk-footer__cols { display: flex; flex-wrap: wrap; gap: 44px; justify-content: center; }
.pk-footer__col h4 { font-family: var(--pk-body); font-weight: 700; font-size: .85rem; letter-spacing: .1em; color: var(--pk-teal); margin: 0 0 12px; }
.pk-footer__col a { display: block; color: var(--pk-ink-soft); text-decoration: none; font-size: .92rem; padding: 3px 0; }
.pk-footer__col a:hover { color: var(--pk-ink); }
.pk-footer__copy { text-align: center; color: color-mix(in srgb, var(--pk-ink-soft) 55%, transparent); font-size: .8rem; }

/* ---------- עמודי משנה (אי / בקרוב) ---------- */
.pk-page { direction: rtl; min-height: 100vh; }
.pk-hero { position: relative; height: min(72vh, 760px); overflow: hidden; }
.pk-hero img { width: 100%; height: 100%; object-fit: cover; display: block; animation: pk-drift 18s ease-in-out infinite alternate; }
@keyframes pk-drift { from { transform: scale(1.02) translateY(0); } to { transform: scale(1.09) translateY(-1.4%); } }
@media (prefers-reduced-motion: reduce) { .pk-hero img { animation: none; } }
.pk-hero::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, color-mix(in srgb, var(--pk-bg) 34%, transparent) 0%, transparent 30%, transparent 52%, var(--pk-bg) 100%);
}
.pk-hero__copy { position: absolute; right: clamp(20px, 6vw, 90px); bottom: clamp(26px, 6vh, 70px); z-index: 2; max-width: 640px; }
.pk-hero__eyebrow { font-weight: 600; font-size: .9rem; letter-spacing: .08em; color: var(--island-accent, var(--pk-teal)); margin: 0 0 10px; }
.pk-hero__title { font-family: var(--pk-display); font-size: clamp(2.4rem, 6vw, 4.6rem); margin: 0; line-height: 1.02; text-shadow: 0 4px 30px rgba(0,0,0,.5); }
.pk-hero__tag { font-size: clamp(1rem, 1.6vw, 1.25rem); color: var(--pk-ink-soft); margin: 14px 0 0; text-shadow: 0 2px 14px rgba(0,0,0,.6); }
.pk-back {
  position: absolute; top: 86px; right: clamp(14px, 3vw, 36px); z-index: 5;
  display: inline-flex; align-items: center; gap: 8px;
  font-weight: 600; font-size: .9rem; color: var(--pk-ink); text-decoration: none;
  padding: 9px 18px; border-radius: 999px;
  background: color-mix(in srgb, var(--pk-bg) 55%, transparent);
  border: 1px solid color-mix(in srgb, var(--pk-ink) 22%, transparent);
  backdrop-filter: blur(10px);
}
.pk-back:hover { background: color-mix(in srgb, var(--pk-bg) 80%, transparent); }

.pk-section { padding: clamp(30px, 5vh, 60px) clamp(20px, 6vw, 90px) clamp(60px, 8vh, 100px); }
.pk-section h2 { font-family: var(--pk-display); font-size: clamp(1.5rem, 2.6vw, 2.2rem); margin: 0 0 6px; }
.pk-section .pk-sub { color: var(--pk-ink-soft); margin: 0 0 30px; max-width: 70ch; line-height: 1.65; }

.pk-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 18px; }
.pk-card {
  position: relative; border-radius: 20px; overflow: hidden; cursor: pointer;
  background: linear-gradient(160deg, var(--pk-panel-2), var(--pk-panel));
  border: 1px solid color-mix(in srgb, var(--island-accent, var(--pk-teal)) 20%, transparent);
  padding: 18px; min-height: 150px;
  display: flex; flex-direction: column; justify-content: space-between; gap: 18px;
  transition: transform .3s, box-shadow .3s, border-color .3s;
}
.pk-card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--island-accent, var(--pk-teal)) 55%, transparent);
  box-shadow: 0 14px 34px rgba(0,0,0,.4), 0 0 22px color-mix(in srgb, var(--island-accent, var(--pk-teal)) 18%, transparent);
}
.pk-card__num { font-family: var(--pk-display); font-size: .8rem; color: color-mix(in srgb, var(--island-accent, var(--pk-teal)) 80%, #fff); letter-spacing: .1em; }
.pk-card__title { font-weight: 600; font-size: 1.04rem; line-height: 1.4; margin: 6px 0 0; color: var(--pk-ink); }
.pk-card__meta { display: flex; align-items: center; justify-content: space-between; }
.pk-card__dur { font-size: .8rem; color: var(--pk-ink-soft); }
.pk-card__play {
  width: 42px; height: 42px; border-radius: 50%; border: 0; cursor: pointer;
  background: var(--island-accent, var(--pk-teal)); color: #10130f;
  display: grid; place-items: center; font-size: 1rem;
  box-shadow: 0 0 16px color-mix(in srgb, var(--island-accent, var(--pk-teal)) 45%, transparent);
  transition: transform .25s;
}
.pk-card:hover .pk-card__play { transform: scale(1.12); }
.pk-note { margin-top: 26px; color: var(--pk-ink-soft); font-size: .95rem; display: flex; align-items: center; gap: 10px; }

/* בקרוב */
.pk-soon { min-height: 100vh; display: grid; place-items: center; text-align: center; padding: 100px 24px 60px;
  background: radial-gradient(ellipse at 50% 0%, #241B4D 0%, var(--pk-bg) 55%); }
.pk-soon h1 { font-family: var(--pk-display); font-size: clamp(2.4rem, 6vw, 4.4rem); margin: 0; }
.pk-soon p { color: var(--pk-ink-soft); font-size: clamp(1rem, 1.7vw, 1.25rem); max-width: 46ch; line-height: 1.7; margin: 18px auto 0; }
.pk-soon .pk-soon__badge {
  display: inline-block; margin-bottom: 22px; padding: 8px 20px; border-radius: 999px;
  font-weight: 600; font-size: .9rem; color: var(--pk-amber);
  border: 1.5px solid color-mix(in srgb, var(--pk-amber) 50%, transparent);
  background: color-mix(in srgb, var(--pk-amber) 10%, transparent);
}
.pk-soon a.pk-cta {
  display: inline-block; margin-top: 34px; text-decoration: none;
  font-family: var(--pk-body); font-weight: 700; color: #0f241f;
  background: var(--pk-teal); padding: 13px 30px; border-radius: 999px;
  box-shadow: 0 0 24px color-mix(in srgb, var(--pk-teal) 45%, transparent);
}

/* ================================================================
   תוספות המיזוג (2026-07-20) — חיות רק באתר הממוזג (site/)
   ================================================================ */

/* --- מגן: האיפוס הגלובלי של v1 (*{padding:0}) דורס את עיצוב המנוע,
       שעטוף בשכבת cascade נמוכה. משחזרים כאן את מה שנפגע. --- */
.sw-root .sw-route { padding: 18px 10px; }
.sw-root .sw-route__label { padding: 5px 11px; }
/* ריווח ברירת-המחדל של כפתור — בזכותו הנקודה צמודה לקו מימין (המראה של v2) */
.sw-root .sw-route__dot { padding: 1px 6px; }
.sw-root .sw-nav__item { padding: 7px 14px; }

/* --- Drop-Down של איי פודיה בתוך ההדר --- */
.pk-dd { position: relative; }
/* כפתור הדרופ-דאון — שיבוט מדויק של לשונית pk-nav a, כולל הזוהר במצב פעיל */
.pk-dd__btn {
  font-family: var(--pk-body); font-weight: 500; font-size: .92rem;
  color: var(--pk-ink-soft); background: none; border: 0; cursor: pointer;
  white-space: nowrap; padding: 8px 15px; border-radius: 999px;
  transition: color .25s, background .25s, box-shadow .25s;
}
.pk-dd__btn:hover { color: var(--pk-ink); background: color-mix(in srgb, var(--pk-teal) 14%, transparent); }
.pk-dd__btn.is-active {
  color: #10251f; background: var(--pk-teal);
  box-shadow: 0 0 18px color-mix(in srgb, var(--pk-teal) 45%, transparent);
}
.pk-dd__menu {
  /* חי ישירות תחת body (ה-pk-nav חותך גלישה, וה-backdrop-filter שלו
     כולא אפילו position:fixed); ממוקם מתחת לכפתור ב-JS בעת הפתיחה */
  position: fixed; min-width: 230px; z-index: 70;
  display: none; flex-direction: column; gap: 2px; padding: 10px;
  background: color-mix(in srgb, #0F0C22 88%, transparent);
  border: 1px solid rgba(94, 234, 212, .25); border-radius: 18px;
  backdrop-filter: blur(14px); box-shadow: 0 14px 40px rgba(7, 5, 20, .55);
  direction: rtl; text-align: right;
}
.pk-dd__menu.is-open { display: flex; }
.pk-dd__item {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 12px; border-radius: 12px; color: #FFF7EA;
  font-size: .95rem; text-decoration: none; transition: background .2s;
}
.pk-dd__item:hover { background: rgba(94, 234, 212, .12); }
.pk-dd__dot { width: 10px; height: 10px; border-radius: 50%; flex: none; box-shadow: 0 0 8px currentColor; }

/* --- עצירת האי: שלט העצירה של v1 ("השלט הקסום" מ-journey.css) מחליף
       לגמרי את כרטיסי המנוע — הכרטיסים כבויים, והשלט מנוהל ב-home-world --- */
.sw-root .sw-copylayer { display: none; }

/* --- אשכול הפעולות בהדר: חיפוש · מטבעות · התחברות (2026-07-20) --- */
.pk-actions { display: flex; align-items: center; gap: 10px; }
.pk-icon-btn {
  width: 38px; height: 38px; border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--pk-teal) 22%, transparent);
  background: color-mix(in srgb, var(--pk-panel) 72%, transparent);
  backdrop-filter: blur(12px);
  display: grid; place-items: center; cursor: pointer;
  color: var(--pk-ink-soft); padding: 0;
  transition: color .25s, border-color .25s, box-shadow .25s;
}
.pk-icon-btn svg { width: 17px; height: 17px; }
.pk-icon-btn:hover {
  color: var(--pk-teal);
  border-color: color-mix(in srgb, var(--pk-teal) 55%, transparent);
  box-shadow: 0 0 16px color-mix(in srgb, var(--pk-teal) 30%, transparent);
}
.pk-coins {
  display: flex; align-items: center; gap: 7px;
  padding: 7px 15px; border-radius: 999px;
  background: color-mix(in srgb, var(--pk-panel) 72%, transparent);
  border: 1px solid color-mix(in srgb, var(--pk-amber) 32%, transparent);
  backdrop-filter: blur(12px);
  font-weight: 600; font-size: .92rem; color: #FFEFD2;
}
.pk-coin {
  width: 16px; height: 16px; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #FFE7A8, #FFB84D 55%, #E08A2E);
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .22), 0 0 10px rgba(255, 184, 107, .45);
}
@media (max-width: 860px) { .pk-coins, .pk-icon-btn { display: none; } }