/* ═══════════════════════════════════════════════════════════════════════════
   📣 SkilliAds v3 — popup · top banner · inline card · the admin studio
   Loaded by index.html, trade.html and admin.html so one look ships everywhere.
   ═══════════════════════════════════════════════════════════════════════════ */
.ska-pop, .ska-banner, .ska-card, .ska-pop *, .ska-banner *, .ska-card * { box-sizing: border-box; }
.ska-pop, .ska-banner, .ska-card { font-family: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, sans-serif; -webkit-font-smoothing: antialiased; }

/* ── themes ─────────────────────────────────────────────────────────────────── */
[data-theme="teal"]     { --ska-bg1:#071923; --ska-bg2:#0b2734; --ska-edge:rgba(46,213,166,.38); --ska-glow:rgba(46,213,166,.28); --ska-acc1:#5ef0c8; --ska-acc2:#3fd0ff; --ska-txt:#f4fbff; --ska-dim:rgba(220,236,245,.72); --ska-box:rgba(255,255,255,.05); --ska-line:rgba(255,255,255,.1); --ska-cta-bg:linear-gradient(90deg,#2ee6a8,#30d5e8); --ska-cta-fg:#04251f; --ska-cta-glow:rgba(46,230,168,.45); --ska-t-regular:#2ed5a6; --ska-t-premium:#4aa8ff; --ska-t-lifetime:#f7b731; --ska-urg:#ff6b8b; }
[data-theme="fire"]     { --ska-bg1:#7f1d05; --ska-bg2:#c33a10; --ska-edge:#ff9a4a; --ska-glow:rgba(255,120,40,.45); --ska-acc1:#ffd166; --ska-acc2:#ff9a2e; --ska-txt:#fff; --ska-dim:rgba(255,236,224,.78); --ska-box:rgba(70,10,0,.32); --ska-line:rgba(255,200,160,.28); --ska-cta-bg:#fff; --ska-cta-fg:#c2410c; --ska-cta-glow:rgba(255,255,255,.35); --ska-t-regular:#8b6bff; --ska-t-premium:#ff8a3d; --ska-t-lifetime:#ffd166; --ska-urg:#ffd166; }
[data-theme="ocean"]    { --ska-bg1:#071230; --ska-bg2:#0d2a6b; --ska-edge:rgba(96,165,250,.45); --ska-glow:rgba(59,130,246,.35); --ska-acc1:#93c5fd; --ska-acc2:#38bdf8; --ska-txt:#f2f7ff; --ska-dim:rgba(214,228,255,.74); --ska-box:rgba(255,255,255,.05); --ska-line:rgba(160,190,255,.16); --ska-cta-bg:linear-gradient(90deg,#3b82f6,#2563eb); --ska-cta-fg:#fff; --ska-cta-glow:rgba(59,130,246,.5); --ska-t-regular:#60a5fa; --ska-t-premium:#f7b731; --ska-t-lifetime:#34d399; --ska-urg:#ff8fa3; }
[data-theme="royal"]    { --ska-bg1:#1a0b3a; --ska-bg2:#3b1a8a; --ska-edge:rgba(167,139,250,.45); --ska-glow:rgba(139,92,246,.4); --ska-acc1:#e9d5ff; --ska-acc2:#f0abfc; --ska-txt:#fbf7ff; --ska-dim:rgba(233,224,255,.74); --ska-box:rgba(255,255,255,.06); --ska-line:rgba(200,180,255,.18); --ska-cta-bg:linear-gradient(90deg,#f0abfc,#a78bfa); --ska-cta-fg:#2a0a4a; --ska-cta-glow:rgba(167,139,250,.5); --ska-t-regular:#c4b5fd; --ska-t-premium:#f0abfc; --ska-t-lifetime:#fcd34d; --ska-urg:#fda4af; }
[data-theme="gold"]     { --ska-bg1:#1a1204; --ska-bg2:#3a2a08; --ska-edge:rgba(250,204,21,.5); --ska-glow:rgba(250,204,21,.32); --ska-acc1:#fde68a; --ska-acc2:#f59e0b; --ska-txt:#fffbea; --ska-dim:rgba(255,244,214,.74); --ska-box:rgba(255,255,255,.05); --ska-line:rgba(250,204,21,.2); --ska-cta-bg:linear-gradient(90deg,#fde047,#f59e0b); --ska-cta-fg:#2a1a00; --ska-cta-glow:rgba(250,204,21,.45); --ska-t-regular:#fde68a; --ska-t-premium:#fbbf24; --ska-t-lifetime:#fff; --ska-urg:#fca5a5; }
[data-theme="midnight"] { --ska-bg1:#05070f; --ska-bg2:#10162a; --ska-edge:rgba(255,255,255,.16); --ska-glow:rgba(255,255,255,.12); --ska-acc1:#fff; --ska-acc2:#9db4ff; --ska-txt:#f5f7ff; --ska-dim:rgba(220,228,255,.7); --ska-box:rgba(255,255,255,.05); --ska-line:rgba(255,255,255,.12); --ska-cta-bg:#fff; --ska-cta-fg:#0b1020; --ska-cta-glow:rgba(255,255,255,.3); --ska-t-regular:#9db4ff; --ska-t-premium:#fff; --ska-t-lifetime:#fde68a; --ska-urg:#fca5a5; }

/* ── POPUP ──────────────────────────────────────────────────────────────────── */
.ska-pop { position: fixed; inset: 0; z-index: 100200; display: flex; align-items: center; justify-content: center; padding: 14px; background: rgba(2,6,18,.72); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); opacity: 0; transition: opacity .25s ease; overflow: hidden; }
.ska-pop.is-open { opacity: 1; }
.ska-pop.is-inline { position: relative; inset: auto; z-index: auto; padding: 0; background: none; backdrop-filter: none; -webkit-backdrop-filter: none; opacity: 1; overflow: visible; }
.ska-pop-card { position: relative; width: min(470px, 100%); max-height: calc(100vh - 28px); overflow: auto; overscroll-behavior: contain; scrollbar-width: none; padding: 26px 22px 20px; border-radius: 24px; color: var(--ska-txt); text-align: center;
  background: radial-gradient(120% 90% at 50% 0%, var(--ska-bg2), var(--ska-bg1) 70%); border: 1.5px solid var(--ska-edge);
  box-shadow: 0 30px 80px -30px rgba(0,0,0,.9), 0 0 0 1px rgba(255,255,255,.04) inset, 0 0 60px -20px var(--ska-glow); transform: translateY(14px) scale(.98); transition: transform .3s cubic-bezier(.2,.8,.2,1); }
.ska-pop-card::-webkit-scrollbar { display: none; }
.ska-pop.is-open .ska-pop-card, .ska-pop.is-inline .ska-pop-card { transform: none; }
.ska-pop[data-theme="fire"] .ska-pop-card { background: radial-gradient(120% 80% at 50% 0%, #e0561c, #b02f0c 55%, #7a1a05); border-color: #ffab5e; box-shadow: 0 0 0 4px rgba(255,140,60,.18), 0 30px 80px -30px rgba(0,0,0,.9); }
.ska-spark { position: absolute; font-style: normal; color: var(--ska-acc1); opacity: .75; font-size: 16px; pointer-events: none; animation: skaTwinkle 2.6s ease-in-out infinite; }
.ska-spark.s1 { left: 14px; top: 14px; } .ska-spark.s2 { right: 52px; top: 22px; font-size: 12px; animation-delay: .8s; } .ska-spark.s3 { left: 22px; bottom: 16px; font-size: 13px; animation-delay: 1.5s; }
@keyframes skaTwinkle { 0%,100% { opacity:.35; transform:scale(.8) rotate(0deg); } 50% { opacity:1; transform:scale(1.15) rotate(20deg); } }
.ska-x { position: absolute; right: 12px; top: 12px; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--ska-line); background: rgba(255,255,255,.08); color: var(--ska-txt); font-weight: 700; font-size: 15px; line-height: 1; cursor: pointer; display: grid; place-items: center; z-index: 3; transition: background .15s, transform .15s; }
.ska-x:hover { background: rgba(255,255,255,.18); transform: scale(1.06); }
.ska-kicker { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border-radius: 999px; font-weight: 800; font-size: 11px; line-height: 1; letter-spacing: .12em; text-transform: uppercase; color: var(--ska-acc1); background: color-mix(in srgb, var(--ska-acc1) 12%, transparent); border: 1px solid color-mix(in srgb, var(--ska-acc1) 45%, transparent); margin: 6px 0 14px; }
.ska-kicker i { width: 13px; height: 13px; display: inline-flex; } .ska-kicker i svg { width: 100%; height: 100%; }
/* v51 — a NARROW card (a small phone, the studio's phone preview): the centred kicker kept running under ✕ and the sparkle beside it.
   It now keeps 50px clear on both sides (✕ takes 48) and may wrap; that sparkle steps aside. */
.ska-pop-card { container-type: inline-size; container-name: skapop; }
@container skapop (max-width: 380px) {
  .ska-kicker { max-width: calc(100% - 100px); line-height: 1.25; text-align: center; }
  .ska-spark.s2 { display: none; }
}
.ska-h { margin: 0 0 10px; font-weight: 900; line-height: 1.02; letter-spacing: -.01em; text-transform: uppercase; }
.ska-h span { display: block; font-size: clamp(30px, 8.6vw, 42px); color: var(--ska-txt); }
.ska-h em { display: block; font-style: normal; font-size: clamp(30px, 8.6vw, 42px); background: linear-gradient(90deg, var(--ska-acc1), var(--ska-acc2)); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
.ska-pop[data-theme="fire"] .ska-h em { background: linear-gradient(90deg, #ffe08a, #ff9a2e); -webkit-background-clip: text; background-clip: text; }
.ska-sub { margin: 0 0 18px; color: var(--ska-dim); font-size: 14px; line-height: 1.45; }
.ska-tiers { display: grid; gap: 12px; margin: 4px 0 14px; text-align: center; }
.ska-tier { position: relative; padding: 14px 14px 12px; border-radius: 16px; background: var(--ska-box); border: 1.5px solid color-mix(in srgb, var(--tc, var(--ska-acc1)) 45%, transparent); box-shadow: 0 10px 30px -18px color-mix(in srgb, var(--tc, var(--ska-acc1)) 60%, transparent), inset 0 1px 0 rgba(255,255,255,.06); }
.ska-tier[data-tier="regular"]  { --tc: var(--ska-t-regular); }
.ska-tier[data-tier="premium"]  { --tc: var(--ska-t-premium); }
.ska-tier[data-tier="lifetime"] { --tc: var(--ska-t-lifetime); }
.ska-tier-n { font-weight: 800; font-size: 12px; line-height: 1.2; letter-spacing: .12em; text-transform: uppercase; color: var(--tc); display: flex; align-items: center; justify-content: center; gap: 6px; flex-wrap: wrap; }
.ska-tier-n i { font-style: normal; } .ska-tier-n u { text-decoration: none; }
.ska-tier-p { margin-top: 8px; display: flex; align-items: center; justify-content: center; gap: 9px; flex-wrap: wrap; }
.ska-tier-p s { color: var(--ska-dim); font-weight: 600; font-size: 16px; opacity: .8; }
.ska-tier-p em { width: 16px; height: 16px; display: inline-flex; color: var(--tc); } .ska-tier-p em svg { width: 100%; height: 100%; }
.ska-tier-p strong { font-size: clamp(22px, 6vw, 26px); font-weight: 900; letter-spacing: -.01em; color: var(--ska-txt); }
.ska-tier-note { margin-top: 10px; padding: 8px 10px; border-radius: 10px; font-size: 12px; font-weight: 600; color: var(--tc); background: color-mix(in srgb, var(--tc) 10%, transparent); border: 1px solid color-mix(in srgb, var(--tc) 35%, transparent); }
.ska-badge { position: absolute; left: 50%; top: -11px; transform: translateX(-50%); padding: 4px 12px; border-radius: 999px; font-weight: 900; font-size: 10px; line-height: 1; letter-spacing: .14em; text-transform: uppercase; color: #1a1200; background: linear-gradient(90deg, #fde047, #f59e0b); box-shadow: 0 6px 16px -6px rgba(245,158,11,.8); white-space: nowrap; z-index: 1; }
/* fire: solid gradient plan cards like the reference */
.ska-pop[data-theme="fire"] .ska-tier { background: linear-gradient(135deg, color-mix(in srgb, var(--tc) 55%, #3a0f04), color-mix(in srgb, var(--tc) 30%, #7a2408)); border-color: color-mix(in srgb, var(--tc) 70%, #fff); }
.ska-pop[data-theme="fire"] .ska-tier-n { color: #fff; } .ska-pop[data-theme="fire"] .ska-tier-p s { color: rgba(255,255,255,.7); }
.ska-pop[data-theme="fire"] .ska-tier[data-tier="regular"] { background: linear-gradient(120deg, #6a3fd6, #3a7bd5); }
.ska-pop[data-theme="fire"] .ska-tier[data-tier="premium"] { background: linear-gradient(120deg, #c8471c, #e8702e); }
.ska-pop[data-theme="fire"] .ska-tier[data-tier="lifetime"] { background: linear-gradient(120deg, #a36a00, #e1a11c); }
.ska-urgency { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0 0 14px; padding: 10px 12px; border-radius: 12px; font-size: 12.5px; font-weight: 700; color: var(--ska-urg); background: color-mix(in srgb, var(--ska-urg) 10%, transparent); border: 1px solid color-mix(in srgb, var(--ska-urg) 38%, transparent); }
.ska-urgency i { width: 15px; height: 15px; display: inline-flex; flex: none; } .ska-urgency i svg { width: 100%; height: 100%; }
.ska-ends { margin: 0 0 14px; padding: 14px 12px 12px; border-radius: 16px; background: var(--ska-box); border: 1px solid var(--ska-line); }
.ska-ends-k { display: flex; align-items: center; justify-content: center; gap: 6px; font-weight: 800; font-size: 11px; line-height: 1; letter-spacing: .14em; text-transform: uppercase; color: var(--ska-urg); }
.ska-pop[data-theme="teal"] .ska-ends-k { color: #ff8fa3; }
.ska-ends-k i { width: 13px; height: 13px; display: inline-flex; } .ska-ends-k i svg { width: 100%; height: 100%; }
.ska-ends-d { margin-top: 8px; font-weight: 900; font-size: clamp(18px, 5.4vw, 22px); line-height: 1.1; letter-spacing: .04em; color: var(--ska-txt); }
.ska-cd { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.ska-cd > div { padding: 10px 4px 8px; border-radius: 12px; background: rgba(0,0,0,.28); border: 1px solid var(--ska-line); }
.ska-cd b { display: block; font-weight: 900; font-size: clamp(22px, 6.4vw, 28px); line-height: 1; font-variant-numeric: tabular-nums; color: var(--ska-txt); }
.ska-cd span { display: block; margin-top: 5px; font-weight: 700; font-size: 9.5px; line-height: 1; letter-spacing: .14em; text-transform: uppercase; color: var(--ska-dim); }
.ska-contact { margin: 0 0 12px; font-size: 12.5px; color: var(--ska-dim); }
.ska-cta { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; padding: 15px 16px; border-radius: 14px; text-decoration: none; font-weight: 900; font-size: 14px; line-height: 1; letter-spacing: .1em; text-transform: uppercase; color: var(--ska-cta-fg); background: var(--ska-cta-bg); box-shadow: 0 16px 34px -14px var(--ska-cta-glow); transition: transform .15s, filter .15s; }
.ska-cta:hover { transform: translateY(-1px); filter: brightness(1.05); }
.ska-cta-ar { width: 16px; height: 16px; display: inline-flex; flex: none; color: currentColor; opacity: .85; } .ska-cta-ar svg { width: 100%; height: 100%; }
.ska-cta-ar.r { display: none; }
.ska-pop[data-theme="teal"] .ska-cta-ar.r { display: inline-flex; }
.ska-cta-top { margin: 0 0 16px; }
.ska-cta-2 { margin-top: 10px; background: transparent; color: var(--ska-txt); border: 1.5px solid var(--ska-line); box-shadow: none; }
.ska-foot { margin: 12px 0 0; font-size: 11px; color: var(--ska-dim); opacity: .8; }

/* ── TOP BANNER ─────────────────────────────────────────────────────────────── */
.ska-banner { position: relative; width: 100%; padding: 14px 44px 14px 14px; color: var(--ska-txt); text-align: center; background: linear-gradient(180deg, var(--ska-bg2), var(--ska-bg1)); border-bottom: 1px solid var(--ska-edge); box-shadow: 0 18px 40px -30px var(--ska-glow); transition: opacity .22s, transform .22s; }
.ska-banner[data-theme="fire"] { background: linear-gradient(180deg, #4a1204, #2a0a03); }
.ska-banner .ska-x { top: 10px; right: 10px; width: 30px; height: 30px; font-size: 12px; }
.ska-banner-top { display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; }
.ska-pill { display: inline-flex; align-items: center; gap: 5px; padding: 5px 11px; border-radius: 999px; font-weight: 900; font-size: 10.5px; line-height: 1; letter-spacing: .12em; text-transform: uppercase; color: #1a0e00; background: linear-gradient(90deg, #ffb347, #ff7a1a); }
.ska-banner[data-kind="feature"] .ska-pill { color: #04251f; background: linear-gradient(90deg, #5ef0c8, #3fd0ff); }
.ska-banner-k { font-weight: 800; font-size: 11px; line-height: 1; letter-spacing: .14em; text-transform: uppercase; color: var(--ska-acc1); }
.ska-banner-h { margin-top: 8px; font-weight: 900; font-size: clamp(17px, 4.6vw, 22px); line-height: 1.15; letter-spacing: -.01em; }
.ska-banner-h em { font-style: normal; color: var(--ska-acc1); }
.ska-banner[data-theme="fire"] .ska-banner-h em, .ska-banner[data-theme="ocean"] .ska-banner-h em { color: #ffcf5c; }
.ska-banner-sub { margin: 6px auto 0; max-width: 640px; font-size: 13px; color: var(--ska-dim); }
.ska-banner-tiers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 12px auto 0; max-width: 760px; }
.ska-bt { position: relative; padding: 10px 6px 9px; border-radius: 12px; background: rgba(255,255,255,.05); border: 1px solid var(--ska-line); display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; }
.ska-bt[data-tier="regular"]  { --tc: var(--ska-t-regular); }
.ska-bt[data-tier="premium"]  { --tc: var(--ska-t-premium); }
.ska-bt[data-tier="lifetime"] { --tc: var(--ska-t-lifetime); }
.ska-bt .ska-badge { top: -9px; font-size: 8.5px; padding: 3px 8px; }
.ska-bt-n { font-weight: 800; font-size: 9.5px; line-height: 1.2; letter-spacing: .1em; text-transform: uppercase; color: var(--tc); text-align: center; overflow-wrap: anywhere; }
.ska-bt-p { display: flex; align-items: baseline; gap: 5px; flex-wrap: wrap; justify-content: center; font-variant-numeric: tabular-nums; }
.ska-bt-p s { font-size: 11px; color: var(--ska-dim); } .ska-bt-p i { font-style: normal; font-size: 11px; color: var(--ska-dim); }
.ska-bt-p b { font-size: clamp(14px, 4.2vw, 19px); font-weight: 900; color: var(--tc); }
.ska-bt-c { font-weight: 700; font-size: 9px; line-height: 1; letter-spacing: .12em; color: var(--ska-dim); }
.ska-bt-off { margin-top: 2px; padding: 3px 8px; border-radius: 999px; font-weight: 800; font-size: 9px; line-height: 1; letter-spacing: .08em; color: var(--tc); background: color-mix(in srgb, var(--tc) 14%, transparent); border: 1px solid color-mix(in srgb, var(--tc) 40%, transparent); }
.ska-banner-cta { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.ska-soc { display: inline-flex; align-items: center; gap: 7px; padding: 9px 16px; border-radius: 999px; font-weight: 800; font-size: 12px; line-height: 1; text-decoration: none; color: #fff; transition: transform .15s, filter .15s; }
.ska-soc:hover { transform: translateY(-1px); filter: brightness(1.06); }
.ska-soc svg { width: 15px; height: 15px; }
.ska-soc.wa { background: #22c55e; color: #052e16; } .ska-soc.tg { background: #2f9de8; } .ska-soc.go { background: var(--ska-cta-bg); color: var(--ska-cta-fg); }
.ska-soc.go .ska-cta-ar { width: 14px; height: 14px; }
.ska-banner.is-gone, .ska-card.is-gone { opacity: 0; transform: translateY(-6px); pointer-events: none; }
@media (max-width: 520px) {
  .ska-banner { padding: 12px 40px 12px 10px; }
  .ska-banner-tiers { gap: 6px; }
  .ska-bt { padding: 8px 4px 7px; border-radius: 10px; }
  .ska-bt-p s { font-size: 10px; } .ska-bt-p b { font-size: 14px; }
  .ska-soc { padding: 8px 12px; font-size: 11px; }
}

/* ── INLINE CARD ────────────────────────────────────────────────────────────── */
.ska-card { position: relative; display: flex; gap: 16px; align-items: flex-start; padding: 20px 46px 20px 20px; border-radius: 18px; color: var(--ska-txt); text-align: left; background: linear-gradient(135deg, var(--ska-bg2), var(--ska-bg1)); border: 1px solid var(--ska-edge); box-shadow: 0 20px 50px -30px rgba(0,0,0,.8), 0 0 40px -22px var(--ska-glow); transition: opacity .22s, transform .22s; }
.ska-card + .ska-card { margin-top: 12px; }
.ska-card .ska-x { top: 10px; right: 10px; width: 30px; height: 30px; font-size: 12px; }
.ska-card-ic { flex: none; width: 64px; height: 64px; border-radius: 16px; display: grid; place-items: center; color: var(--ska-acc1); background: color-mix(in srgb, var(--ska-acc1) 12%, transparent); border: 1.5px solid color-mix(in srgb, var(--ska-acc1) 45%, transparent); box-shadow: 0 12px 30px -16px var(--ska-glow); }
.ska-card-ic svg { width: 34px; height: 34px; }
.ska-card-b { min-width: 0; flex: 1; }
.ska-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.ska-chip { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 999px; font-weight: 800; font-size: 9.5px; line-height: 1; letter-spacing: .14em; text-transform: uppercase; }
.ska-chip.c1 { color: #5ef0c8; background: rgba(46,213,166,.12); border: 1px solid rgba(46,213,166,.4); }
.ska-chip.c2 { color: #fbbf24; background: rgba(245,158,11,.12); border: 1px solid rgba(245,158,11,.4); }
.ska-card-h { margin: 0 0 6px; font-weight: 900; font-size: clamp(18px, 4.8vw, 23px); line-height: 1.15; letter-spacing: -.01em; }
.ska-card-h em { font-style: normal; background: linear-gradient(90deg, var(--ska-acc1), var(--ska-acc2)); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
.ska-card-p { margin: 0 0 12px; font-size: 13px; line-height: 1.5; color: var(--ska-dim); }
.ska-card-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ska-card-meta > span { display: inline-flex; align-items: center; gap: 5px; padding: 6px 10px; border-radius: 999px; font-weight: 700; font-size: 11px; line-height: 1; white-space: nowrap; color: var(--ska-dim); background: rgba(255,255,255,.05); border: 1px solid var(--ska-line); }
.ska-card-meta > span svg { width: 12px; height: 12px; } .ska-card-meta > span b { color: var(--ska-txt); } .ska-card-meta > span u { text-decoration: none; color: var(--ska-acc1); }
.ska-btn { display: inline-flex; align-items: center; gap: 7px; padding: 9px 14px; border-radius: 999px; text-decoration: none; font-weight: 800; font-size: 12px; line-height: 1.2; text-align: center; color: var(--ska-cta-fg); background: var(--ska-cta-bg); box-shadow: 0 12px 26px -12px var(--ska-cta-glow); transition: transform .15s; }
.ska-btn:hover { transform: translateY(-1px); } .ska-btn svg { width: 13px; height: 13px; }
@media (max-width: 560px) {
  .ska-card { padding: 16px 40px 16px 14px; gap: 12px; }
  .ska-card-ic { width: 50px; height: 50px; border-radius: 13px; } .ska-card-ic svg { width: 26px; height: 26px; }
}
#skilli-ads-card[hidden], #skilli-ads-banner[hidden] { display: none; }
#skilli-ads-card { margin: 0 auto 18px; }
@media (prefers-reduced-motion: reduce) { .ska-spark { animation: none; } }

/* ── ADMIN STUDIO ───────────────────────────────────────────────────────────── */
.adm-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 440px); gap: 18px; align-items: start; }
@media (max-width: 1100px) { .adm-wrap { grid-template-columns: minmax(0, 1fr); } .adm-preview { position: static; } }
.adm-group { border: 1px solid var(--line, rgba(120,150,220,.2)); border-radius: 14px; padding: 12px 14px; margin: 0 0 12px; background: rgba(255,255,255,.02); }
.adm-group > h3 { margin: 0 0 8px; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: #9fb4d8; display: flex; align-items: center; gap: 8px; }
.adm-group > h3 small { margin-left: auto; font-weight: 500; text-transform: none; letter-spacing: 0; color: #7f8fb0; }
.adm-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; margin-bottom: 8px; }
.adm-row .field { margin: 0; } .adm-row label { display: block; font-size: 11.5px; color: #9fb4d8; margin-bottom: 4px; }
.adm-checks { display: flex; gap: 14px; flex-wrap: wrap; padding: 4px 0; }
.adm-checks label { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; cursor: pointer; }
.adm-tier { display: grid; grid-template-columns: 28px minmax(120px, 1.2fr) minmax(90px, 1fr) minmax(90px, 1fr) 64px; gap: 8px; align-items: center; padding: 8px 0; border-top: 1px solid rgba(255,255,255,.06); }
.adm-tier:first-of-type { border-top: 0; }
.adm-tier .adm-off { font-weight: 800; font-size: 12px; line-height: 1; color: #5ef0c8; text-align: center; }
.adm-tier-x { grid-column: 2 / -1; display: grid; grid-template-columns: minmax(120px, .8fr) minmax(160px, 1.6fr); gap: 8px; }
@media (max-width: 640px) { .adm-tier { grid-template-columns: 28px 1fr 1fr; } .adm-tier .adm-off { grid-column: 3; } .adm-tier > :nth-child(4) { grid-column: 2; } .adm-tier-x { grid-column: 1 / -1; grid-template-columns: 1fr; } }
.adm-themes { display: flex; gap: 8px; flex-wrap: wrap; }
.adm-theme { position: relative; width: 84px; height: 54px; border-radius: 12px; border: 2px solid transparent; cursor: pointer; background: linear-gradient(135deg, var(--ska-bg2), var(--ska-bg1)); color: var(--ska-txt); font-weight: 800; font-size: 10px; line-height: 1; letter-spacing: .08em; text-transform: uppercase; display: grid; place-items: end start; padding: 6px; }
.adm-theme::after { content: ""; position: absolute; right: 8px; top: 8px; width: 12px; height: 12px; border-radius: 50%; background: linear-gradient(90deg, var(--ska-acc1), var(--ska-acc2)); }
.adm-theme.is-on { border-color: #5ef0c8; box-shadow: 0 0 0 3px rgba(94,240,200,.2); }
.adm-preview { position: sticky; top: 14px; }
.adm-ptabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.adm-ptab { padding: 7px 12px; border-radius: 999px; border: 1px solid rgba(120,150,220,.3); background: rgba(255,255,255,.03); color: #c7d5f0; font-weight: 700; font-size: 12px; line-height: 1; cursor: pointer; }
.adm-ptab.is-on { background: #2f5cff; border-color: #2f5cff; color: #fff; }
.adm-ptab.dev { margin-left: auto; } .adm-ptab.dev + .adm-ptab.dev { margin-left: 0; }
.adm-frame { border-radius: 18px; background: #050b1c url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cpath d='M0 20h40M20 0v40' stroke='rgba(255,255,255,.035)'/%3E%3C/svg%3E"); border: 1px solid rgba(120,150,220,.2); padding: 14px; overflow: auto; max-height: 78vh; }
.adm-frame.is-phone { width: min(390px, 100%); margin: 0 auto; }
.adm-frame .ska-banner { border-radius: 14px; }
.adm-list { display: grid; gap: 10px; }
.adm-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 12px 14px; border-radius: 14px; border: 1px solid rgba(120,150,220,.2); background: rgba(255,255,255,.025); }
.adm-item.is-off { opacity: .6; } .adm-item.is-editing { border-color: #5ef0c8; box-shadow: 0 0 0 2px rgba(94,240,200,.15); }
.adm-item-t { font-weight: 800; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.adm-item-t .sw { width: 12px; height: 12px; border-radius: 50%; background: linear-gradient(135deg, var(--ska-bg2), var(--ska-acc1)); flex: none; }
.adm-item-m { margin-top: 4px; font-size: 12px; color: #9fb4d8; display: flex; gap: 6px; flex-wrap: wrap; }
.adm-item-m span { padding: 2px 8px; border-radius: 999px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); }
.adm-item-m span.ok { color: #5ef0c8; } .adm-item-m span.warn { color: #fbbf24; } .adm-item-m span.off { color: #fda4af; }
.adm-item-a { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.adm-item-a button { padding: 6px 10px; font-size: 12px; }
.adm-starts { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.adm-start { display: inline-flex; align-items: center; gap: 8px; padding: 9px 13px; border-radius: 12px; border: 1px solid rgba(120,150,220,.3); background: rgba(255,255,255,.03); color: #e6eeff; font-weight: 700; font-size: 12.5px; line-height: 1; cursor: pointer; }
.adm-start i { width: 14px; height: 14px; border-radius: 4px; background: linear-gradient(135deg, var(--ska-bg2), var(--ska-acc1)); }
.adm-start:hover { border-color: #5ef0c8; }
.adm-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-top: 10px; padding: 10px 0 4px; }

@media (max-width: 430px) { .ska-cta { font-size: 12.5px; letter-spacing: .06em; padding: 14px 12px; gap: 8px; } .ska-pop-card { padding: 24px 16px 18px; } .ska-tier { padding: 12px 10px 10px; } }

/* ── p6 — 10 more colours ── */
[data-theme="emerald"]    { --ska-bg1:#03140d; --ska-bg2:#065f46; --ska-edge:rgba(52,211,153,.45); --ska-glow:rgba(16,185,129,.35); --ska-acc1:#a7f3d0; --ska-acc2:#34d399; --ska-txt:#f0fdf8; --ska-dim:rgba(209,250,229,.74); --ska-box:rgba(255,255,255,.05); --ska-line:rgba(167,243,208,.18); --ska-cta-bg:linear-gradient(90deg,#34d399,#10b981); --ska-cta-fg:#022c22; --ska-cta-glow:rgba(16,185,129,.45); --ska-t-regular:#6ee7b7; --ska-t-premium:#93c5fd; --ska-t-lifetime:#fde68a; --ska-urg:#fda4af; }
[data-theme="ruby"]       { --ska-bg1:#1a0307; --ska-bg2:#7f1d1d; --ska-edge:rgba(248,113,113,.48); --ska-glow:rgba(239,68,68,.35); --ska-acc1:#fecaca; --ska-acc2:#f87171; --ska-txt:#fff5f5; --ska-dim:rgba(254,226,226,.76); --ska-box:rgba(255,255,255,.06); --ska-line:rgba(254,202,202,.2); --ska-cta-bg:linear-gradient(90deg,#f87171,#dc2626); --ska-cta-fg:#fff; --ska-cta-glow:rgba(239,68,68,.45); --ska-t-regular:#fca5a5; --ska-t-premium:#fde68a; --ska-t-lifetime:#fff; --ska-urg:#fde68a; }
[data-theme="rose"]       { --ska-bg1:#24051a; --ska-bg2:#831843; --ska-edge:rgba(244,114,182,.48); --ska-glow:rgba(236,72,153,.35); --ska-acc1:#fbcfe8; --ska-acc2:#f472b6; --ska-txt:#fff5fa; --ska-dim:rgba(252,231,243,.76); --ska-box:rgba(255,255,255,.06); --ska-line:rgba(251,207,232,.2); --ska-cta-bg:linear-gradient(90deg,#f9a8d4,#ec4899); --ska-cta-fg:#3b0420; --ska-cta-glow:rgba(236,72,153,.45); --ska-t-regular:#f9a8d4; --ska-t-premium:#c4b5fd; --ska-t-lifetime:#fde68a; --ska-urg:#fde68a; }
[data-theme="aqua"]       { --ska-bg1:#021a22; --ska-bg2:#0e7490; --ska-edge:rgba(34,211,238,.5); --ska-glow:rgba(6,182,212,.35); --ska-acc1:#a5f3fc; --ska-acc2:#22d3ee; --ska-txt:#f0fdff; --ska-dim:rgba(207,250,254,.76); --ska-box:rgba(255,255,255,.06); --ska-line:rgba(165,243,252,.2); --ska-cta-bg:linear-gradient(90deg,#67e8f9,#06b6d4); --ska-cta-fg:#042f3a; --ska-cta-glow:rgba(6,182,212,.45); --ska-t-regular:#67e8f9; --ska-t-premium:#a5b4fc; --ska-t-lifetime:#fde68a; --ska-urg:#fda4af; }
[data-theme="lime"]       { --ska-bg1:#0b1402; --ska-bg2:#365314; --ska-edge:rgba(163,230,53,.5); --ska-glow:rgba(132,204,22,.35); --ska-acc1:#ecfccb; --ska-acc2:#a3e635; --ska-txt:#f7fee7; --ska-dim:rgba(236,252,203,.76); --ska-box:rgba(255,255,255,.05); --ska-line:rgba(217,249,157,.2); --ska-cta-bg:linear-gradient(90deg,#bef264,#84cc16); --ska-cta-fg:#1a2e05; --ska-cta-glow:rgba(132,204,22,.45); --ska-t-regular:#bef264; --ska-t-premium:#67e8f9; --ska-t-lifetime:#fde68a; --ska-urg:#fda4af; }
[data-theme="indigo"]     { --ska-bg1:#0a0a2a; --ska-bg2:#312e81; --ska-edge:rgba(129,140,248,.5); --ska-glow:rgba(99,102,241,.38); --ska-acc1:#e0e7ff; --ska-acc2:#818cf8; --ska-txt:#f5f7ff; --ska-dim:rgba(224,231,255,.74); --ska-box:rgba(255,255,255,.06); --ska-line:rgba(199,210,254,.18); --ska-cta-bg:linear-gradient(90deg,#818cf8,#6366f1); --ska-cta-fg:#fff; --ska-cta-glow:rgba(99,102,241,.5); --ska-t-regular:#a5b4fc; --ska-t-premium:#f0abfc; --ska-t-lifetime:#fde68a; --ska-urg:#fda4af; }
[data-theme="slate"]      { --ska-bg1:#0b0f17; --ska-bg2:#1e293b; --ska-edge:rgba(148,163,184,.4); --ska-glow:rgba(148,163,184,.22); --ska-acc1:#f1f5f9; --ska-acc2:#94a3b8; --ska-txt:#f8fafc; --ska-dim:rgba(226,232,240,.72); --ska-box:rgba(255,255,255,.05); --ska-line:rgba(226,232,240,.14); --ska-cta-bg:#f1f5f9; --ska-cta-fg:#0f172a; --ska-cta-glow:rgba(241,245,249,.3); --ska-t-regular:#cbd5e1; --ska-t-premium:#93c5fd; --ska-t-lifetime:#fde68a; --ska-urg:#fca5a5; }
[data-theme="neon"]       { --ska-bg1:#030303; --ska-bg2:#10101c; --ska-edge:rgba(57,255,20,.5); --ska-glow:rgba(57,255,20,.3); --ska-acc1:#39ff14; --ska-acc2:#ff2bd6; --ska-txt:#f7fff5; --ska-dim:rgba(230,255,225,.72); --ska-box:rgba(255,255,255,.05); --ska-line:rgba(57,255,20,.2); --ska-cta-bg:linear-gradient(90deg,#39ff14,#00e5ff); --ska-cta-fg:#021a02; --ska-cta-glow:rgba(57,255,20,.45); --ska-t-regular:#39ff14; --ska-t-premium:#00e5ff; --ska-t-lifetime:#ff2bd6; --ska-urg:#ff2bd6; }
[data-theme="copper"]     { --ska-bg1:#160b05; --ska-bg2:#6b3416; --ska-edge:rgba(234,159,99,.5); --ska-glow:rgba(217,119,6,.32); --ska-acc1:#fed7aa; --ska-acc2:#ea9f63; --ska-txt:#fff8f1; --ska-dim:rgba(254,234,214,.76); --ska-box:rgba(255,255,255,.05); --ska-line:rgba(254,215,170,.2); --ska-cta-bg:linear-gradient(90deg,#f6b37f,#c2672e); --ska-cta-fg:#2a1003; --ska-cta-glow:rgba(217,119,6,.45); --ska-t-regular:#fdba74; --ska-t-premium:#fde68a; --ska-t-lifetime:#fff; --ska-urg:#fecaca; }
[data-theme="pearl"]      { --ska-bg1:#eef2f7; --ska-bg2:#ffffff; --ska-edge:rgba(15,23,42,.14); --ska-glow:rgba(37,99,235,.18); --ska-acc1:#2563eb; --ska-acc2:#7c3aed; --ska-txt:#0f172a; --ska-dim:rgba(15,23,42,.66); --ska-box:rgba(15,23,42,.04); --ska-line:rgba(15,23,42,.1); --ska-cta-bg:linear-gradient(90deg,#2563eb,#7c3aed); --ska-cta-fg:#fff; --ska-cta-glow:rgba(37,99,235,.4); --ska-t-regular:#0284c7; --ska-t-premium:#7c3aed; --ska-t-lifetime:#b45309; --ska-urg:#e11d48; }
/* ── p6 — holidays & seasons: the pop-up's three sparkles become the holiday's emoji ── */
[data-theme="newyear"]    { --ska-bg1:#05050f; --ska-bg2:#1e1b4b; --ska-edge:rgba(253,230,138,.5); --ska-glow:rgba(250,204,21,.3); --ska-acc1:#fde68a; --ska-acc2:#e9d5ff; --ska-txt:#fffdf5; --ska-dim:rgba(254,243,199,.74); --ska-box:rgba(255,255,255,.06); --ska-line:rgba(253,230,138,.2); --ska-cta-bg:linear-gradient(90deg,#fde68a,#f5c542); --ska-cta-fg:#1c1400; --ska-cta-glow:rgba(250,204,21,.45); --ska-t-regular:#c4b5fd; --ska-t-premium:#fde68a; --ska-t-lifetime:#fff; --ska-urg:#fda4af; --ska-deco:"🎆"; }
[data-theme="lunarnewyear"]{ --ska-bg1:#2a0202; --ska-bg2:#b91c1c; --ska-edge:rgba(253,224,71,.55); --ska-glow:rgba(234,179,8,.35); --ska-acc1:#fef08a; --ska-acc2:#fbbf24; --ska-txt:#fffbeb; --ska-dim:rgba(254,243,199,.8); --ska-box:rgba(60,0,0,.3); --ska-line:rgba(253,224,71,.28); --ska-cta-bg:linear-gradient(90deg,#fde047,#f59e0b); --ska-cta-fg:#450a0a; --ska-cta-glow:rgba(250,204,21,.45); --ska-t-regular:#fef08a; --ska-t-premium:#fde68a; --ska-t-lifetime:#fff; --ska-urg:#fef08a; --ska-deco:"🧧"; }
[data-theme="valentine"]  { --ska-bg1:#2a0510; --ska-bg2:#9f1239; --ska-edge:rgba(251,113,133,.55); --ska-glow:rgba(244,63,94,.4); --ska-acc1:#ffe4e6; --ska-acc2:#fb7185; --ska-txt:#fff1f2; --ska-dim:rgba(255,228,230,.8); --ska-box:rgba(255,255,255,.07); --ska-line:rgba(254,205,211,.25); --ska-cta-bg:linear-gradient(90deg,#fda4af,#f43f5e); --ska-cta-fg:#fff; --ska-cta-glow:rgba(244,63,94,.5); --ska-t-regular:#fda4af; --ska-t-premium:#f9a8d4; --ska-t-lifetime:#fde68a; --ska-urg:#fde68a; --ska-deco:"💖"; }
[data-theme="carnival"]   { --ska-bg1:#1a0533; --ska-bg2:#7e22ce; --ska-edge:rgba(250,204,21,.5); --ska-glow:rgba(217,70,239,.38); --ska-acc1:#fde047; --ska-acc2:#22d3ee; --ska-txt:#fdf4ff; --ska-dim:rgba(250,232,255,.8); --ska-box:rgba(255,255,255,.07); --ska-line:rgba(253,224,71,.22); --ska-cta-bg:linear-gradient(90deg,#fde047,#f472b6,#22d3ee); --ska-cta-fg:#2e0a4a; --ska-cta-glow:rgba(217,70,239,.5); --ska-t-regular:#22d3ee; --ska-t-premium:#f472b6; --ska-t-lifetime:#fde047; --ska-urg:#fde047; --ska-deco:"🎭"; }
[data-theme="stpatrick"]  { --ska-bg1:#021a0c; --ska-bg2:#15803d; --ska-edge:rgba(134,239,172,.5); --ska-glow:rgba(34,197,94,.35); --ska-acc1:#bbf7d0; --ska-acc2:#facc15; --ska-txt:#f0fdf4; --ska-dim:rgba(220,252,231,.78); --ska-box:rgba(255,255,255,.06); --ska-line:rgba(187,247,208,.22); --ska-cta-bg:linear-gradient(90deg,#4ade80,#16a34a); --ska-cta-fg:#022c12; --ska-cta-glow:rgba(34,197,94,.45); --ska-t-regular:#86efac; --ska-t-premium:#facc15; --ska-t-lifetime:#fff; --ska-urg:#fde68a; --ska-deco:"☘️"; }
[data-theme="easter"]     { --ska-bg1:#241a3d; --ska-bg2:#6d5aa8; --ska-edge:rgba(251,207,232,.5); --ska-glow:rgba(196,181,253,.38); --ska-acc1:#fbcfe8; --ska-acc2:#bfdbfe; --ska-txt:#fdfaff; --ska-dim:rgba(243,232,255,.8); --ska-box:rgba(255,255,255,.08); --ska-line:rgba(251,207,232,.24); --ska-cta-bg:linear-gradient(90deg,#fbcfe8,#c4b5fd); --ska-cta-fg:#2e1065; --ska-cta-glow:rgba(196,181,253,.5); --ska-t-regular:#bfdbfe; --ska-t-premium:#fbcfe8; --ska-t-lifetime:#fef08a; --ska-urg:#fecdd3; --ska-deco:"🐣"; }
[data-theme="eid"]        { --ska-bg1:#031319; --ska-bg2:#0f4c5c; --ska-edge:rgba(253,230,138,.48); --ska-glow:rgba(45,212,191,.3); --ska-acc1:#fde68a; --ska-acc2:#5eead4; --ska-txt:#f5fffd; --ska-dim:rgba(204,251,241,.76); --ska-box:rgba(255,255,255,.06); --ska-line:rgba(253,230,138,.2); --ska-cta-bg:linear-gradient(90deg,#fde68a,#d4a72c); --ska-cta-fg:#1c1400; --ska-cta-glow:rgba(250,204,21,.4); --ska-t-regular:#5eead4; --ska-t-premium:#fde68a; --ska-t-lifetime:#fff; --ska-urg:#fda4af; --ska-deco:"🌙"; }
[data-theme="mothers"]    { --ska-bg1:#2b0a1f; --ska-bg2:#9d174d; --ska-edge:rgba(249,168,212,.52); --ska-glow:rgba(236,72,153,.38); --ska-acc1:#fce7f3; --ska-acc2:#f9a8d4; --ska-txt:#fff5fa; --ska-dim:rgba(252,231,243,.8); --ska-box:rgba(255,255,255,.07); --ska-line:rgba(249,168,212,.24); --ska-cta-bg:linear-gradient(90deg,#fbcfe8,#f472b6); --ska-cta-fg:#500724; --ska-cta-glow:rgba(236,72,153,.5); --ska-t-regular:#f9a8d4; --ska-t-premium:#e9d5ff; --ska-t-lifetime:#fde68a; --ska-urg:#fde68a; --ska-deco:"🌸"; }
[data-theme="fathers"]    { --ska-bg1:#050d1c; --ska-bg2:#1e3a8a; --ska-edge:rgba(147,197,253,.5); --ska-glow:rgba(59,130,246,.35); --ska-acc1:#dbeafe; --ska-acc2:#93c5fd; --ska-txt:#f5f9ff; --ska-dim:rgba(219,234,254,.78); --ska-box:rgba(255,255,255,.06); --ska-line:rgba(191,219,254,.2); --ska-cta-bg:linear-gradient(90deg,#93c5fd,#3b82f6); --ska-cta-fg:#071a3d; --ska-cta-glow:rgba(59,130,246,.5); --ska-t-regular:#93c5fd; --ska-t-premium:#a7f3d0; --ska-t-lifetime:#fde68a; --ska-urg:#fca5a5; --ska-deco:"👔"; }
[data-theme="jamaica"]    { --ska-bg1:#030603; --ska-bg2:#0b3d1a; --ska-edge:rgba(252,209,22,.55); --ska-glow:rgba(0,155,58,.38); --ska-acc1:#fcd116; --ska-acc2:#22c55e; --ska-txt:#fbfff6; --ska-dim:rgba(236,252,203,.78); --ska-box:rgba(255,255,255,.06); --ska-line:rgba(252,209,22,.24); --ska-cta-bg:linear-gradient(90deg,#fcd116,#009b3a); --ska-cta-fg:#04140a; --ska-cta-glow:rgba(252,209,22,.45); --ska-t-regular:#22c55e; --ska-t-premium:#fcd116; --ska-t-lifetime:#fff; --ska-urg:#fcd116; --ska-deco:"🇯🇲"; }
[data-theme="july4"]      { --ska-bg1:#07102b; --ska-bg2:#1e3a8a; --ska-edge:rgba(248,113,113,.5); --ska-glow:rgba(239,68,68,.32); --ska-acc1:#ffffff; --ska-acc2:#f87171; --ska-txt:#f8fbff; --ska-dim:rgba(226,232,255,.78); --ska-box:rgba(255,255,255,.06); --ska-line:rgba(255,255,255,.16); --ska-cta-bg:linear-gradient(90deg,#ef4444,#b91c1c); --ska-cta-fg:#fff; --ska-cta-glow:rgba(239,68,68,.5); --ska-t-regular:#93c5fd; --ska-t-premium:#f87171; --ska-t-lifetime:#fff; --ska-urg:#fca5a5; --ska-deco:"🎇"; }
[data-theme="summer"]     { --ska-bg1:#04222e; --ska-bg2:#0e7490; --ska-edge:rgba(253,224,71,.5); --ska-glow:rgba(251,191,36,.3); --ska-acc1:#fde047; --ska-acc2:#fb923c; --ska-txt:#f0fdff; --ska-dim:rgba(207,250,254,.8); --ska-box:rgba(255,255,255,.07); --ska-line:rgba(253,224,71,.22); --ska-cta-bg:linear-gradient(90deg,#fde047,#fb923c); --ska-cta-fg:#3a1a00; --ska-cta-glow:rgba(251,146,60,.45); --ska-t-regular:#67e8f9; --ska-t-premium:#fde047; --ska-t-lifetime:#fff; --ska-urg:#fecaca; --ska-deco:"☀️"; }
[data-theme="halloween"]  { --ska-bg1:#0b0512; --ska-bg2:#3b0d4a; --ska-edge:rgba(249,115,22,.55); --ska-glow:rgba(249,115,22,.35); --ska-acc1:#fdba74; --ska-acc2:#f97316; --ska-txt:#fff7ed; --ska-dim:rgba(254,215,170,.78); --ska-box:rgba(255,255,255,.05); --ska-line:rgba(253,186,116,.22); --ska-cta-bg:linear-gradient(90deg,#fb923c,#ea580c); --ska-cta-fg:#1a0700; --ska-cta-glow:rgba(249,115,22,.5); --ska-t-regular:#c4b5fd; --ska-t-premium:#fb923c; --ska-t-lifetime:#a3e635; --ska-urg:#a3e635; --ska-deco:"🎃"; }
[data-theme="diwali"]     { --ska-bg1:#1c0702; --ska-bg2:#7c2d12; --ska-edge:rgba(253,230,138,.55); --ska-glow:rgba(251,191,36,.38); --ska-acc1:#fde68a; --ska-acc2:#f472b6; --ska-txt:#fffbeb; --ska-dim:rgba(254,243,199,.8); --ska-box:rgba(255,255,255,.06); --ska-line:rgba(253,230,138,.24); --ska-cta-bg:linear-gradient(90deg,#fde68a,#f472b6); --ska-cta-fg:#3b0a1c; --ska-cta-glow:rgba(251,191,36,.5); --ska-t-regular:#f9a8d4; --ska-t-premium:#fde68a; --ska-t-lifetime:#fff; --ska-urg:#fde68a; --ska-deco:"🪔"; }
[data-theme="thanksgiving"]{ --ska-bg1:#170b03; --ska-bg2:#78350f; --ska-edge:rgba(251,191,36,.5); --ska-glow:rgba(217,119,6,.35); --ska-acc1:#fed7aa; --ska-acc2:#f59e0b; --ska-txt:#fffaf0; --ska-dim:rgba(254,235,200,.78); --ska-box:rgba(255,255,255,.05); --ska-line:rgba(254,215,170,.2); --ska-cta-bg:linear-gradient(90deg,#fbbf24,#d97706); --ska-cta-fg:#2a1200; --ska-cta-glow:rgba(217,119,6,.45); --ska-t-regular:#fdba74; --ska-t-premium:#fde68a; --ska-t-lifetime:#fff; --ska-urg:#fecaca; --ska-deco:"🍂"; }
[data-theme="blackfriday"]{ --ska-bg1:#000000; --ska-bg2:#18181b; --ska-edge:rgba(250,204,21,.55); --ska-glow:rgba(250,204,21,.25); --ska-acc1:#ffffff; --ska-acc2:#facc15; --ska-txt:#ffffff; --ska-dim:rgba(228,228,231,.75); --ska-box:rgba(255,255,255,.05); --ska-line:rgba(255,255,255,.14); --ska-cta-bg:#facc15; --ska-cta-fg:#000; --ska-cta-glow:rgba(250,204,21,.45); --ska-t-regular:#e4e4e7; --ska-t-premium:#facc15; --ska-t-lifetime:#fff; --ska-urg:#f87171; --ska-deco:"🛍️"; }
[data-theme="cybermonday"]{ --ska-bg1:#020617; --ska-bg2:#0c1a4b; --ska-edge:rgba(103,232,249,.55); --ska-glow:rgba(232,121,249,.32); --ska-acc1:#67e8f9; --ska-acc2:#e879f9; --ska-txt:#f0fbff; --ska-dim:rgba(207,250,254,.76); --ska-box:rgba(255,255,255,.05); --ska-line:rgba(103,232,249,.22); --ska-cta-bg:linear-gradient(90deg,#22d3ee,#d946ef); --ska-cta-fg:#fff; --ska-cta-glow:rgba(34,211,238,.5); --ska-t-regular:#67e8f9; --ska-t-premium:#e879f9; --ska-t-lifetime:#fde68a; --ska-urg:#f0abfc; --ska-deco:"💻"; }
[data-theme="hanukkah"]   { --ska-bg1:#061033; --ska-bg2:#1d4ed8; --ska-edge:rgba(226,232,240,.55); --ska-glow:rgba(147,197,253,.38); --ska-acc1:#e0e7ff; --ska-acc2:#cbd5e1; --ska-txt:#f8fafc; --ska-dim:rgba(224,231,255,.8); --ska-box:rgba(255,255,255,.07); --ska-line:rgba(226,232,240,.22); --ska-cta-bg:linear-gradient(90deg,#f1f5f9,#cbd5e1); --ska-cta-fg:#0b1d4d; --ska-cta-glow:rgba(226,232,240,.4); --ska-t-regular:#bfdbfe; --ska-t-premium:#e2e8f0; --ska-t-lifetime:#fde68a; --ska-urg:#fda4af; --ska-deco:"🕎"; }
[data-theme="christmas"]  { --ska-bg1:#04190c; --ska-bg2:#14532d; --ska-edge:rgba(248,113,113,.55); --ska-glow:rgba(239,68,68,.35); --ska-acc1:#fecaca; --ska-acc2:#ef4444; --ska-txt:#f8fff9; --ska-dim:rgba(220,252,231,.8); --ska-box:rgba(255,255,255,.06); --ska-line:rgba(254,202,202,.22); --ska-cta-bg:linear-gradient(90deg,#ef4444,#b91c1c); --ska-cta-fg:#fff; --ska-cta-glow:rgba(239,68,68,.5); --ska-t-regular:#86efac; --ska-t-premium:#fca5a5; --ska-t-lifetime:#fde68a; --ska-urg:#fde68a; --ska-deco:"🎄"; }
[data-theme="boxingday"]  { --ska-bg1:#140726; --ska-bg2:#5b21b6; --ska-edge:rgba(244,114,182,.5); --ska-glow:rgba(168,85,247,.38); --ska-acc1:#f5d0fe; --ska-acc2:#f472b6; --ska-txt:#fdf4ff; --ska-dim:rgba(245,208,254,.78); --ska-box:rgba(255,255,255,.07); --ska-line:rgba(245,208,254,.22); --ska-cta-bg:linear-gradient(90deg,#f0abfc,#a855f7); --ska-cta-fg:#2e0a4a; --ska-cta-glow:rgba(168,85,247,.5); --ska-t-regular:#f0abfc; --ska-t-premium:#c4b5fd; --ska-t-lifetime:#fde68a; --ska-urg:#fde68a; --ska-deco:"🎁"; }
.ska-pop:is([data-theme="newyear"],[data-theme="lunarnewyear"],[data-theme="valentine"],[data-theme="carnival"],[data-theme="stpatrick"],[data-theme="easter"],[data-theme="eid"],[data-theme="mothers"],[data-theme="fathers"],[data-theme="jamaica"],[data-theme="july4"],[data-theme="summer"],[data-theme="halloween"],[data-theme="diwali"],[data-theme="thanksgiving"],[data-theme="blackfriday"],[data-theme="cybermonday"],[data-theme="hanukkah"],[data-theme="christmas"],[data-theme="boxingday"]) .ska-spark { font-size: 0 !important; opacity: .9; }
.ska-pop:is([data-theme="newyear"],[data-theme="lunarnewyear"],[data-theme="valentine"],[data-theme="carnival"],[data-theme="stpatrick"],[data-theme="easter"],[data-theme="eid"],[data-theme="mothers"],[data-theme="fathers"],[data-theme="jamaica"],[data-theme="july4"],[data-theme="summer"],[data-theme="halloween"],[data-theme="diwali"],[data-theme="thanksgiving"],[data-theme="blackfriday"],[data-theme="cybermonday"],[data-theme="hanukkah"],[data-theme="christmas"],[data-theme="boxingday"]) .ska-spark::before { content: var(--ska-deco, ""); font-size: 22px; line-height: 1; }
.ska-pop:is([data-theme="newyear"],[data-theme="lunarnewyear"],[data-theme="valentine"],[data-theme="carnival"],[data-theme="stpatrick"],[data-theme="easter"],[data-theme="eid"],[data-theme="mothers"],[data-theme="fathers"],[data-theme="jamaica"],[data-theme="july4"],[data-theme="summer"],[data-theme="halloween"],[data-theme="diwali"],[data-theme="thanksgiving"],[data-theme="blackfriday"],[data-theme="cybermonday"],[data-theme="hanukkah"],[data-theme="christmas"],[data-theme="boxingday"]) .ska-spark.s2::before { font-size: 16px; }
.ska-pop:is([data-theme="newyear"],[data-theme="lunarnewyear"],[data-theme="valentine"],[data-theme="carnival"],[data-theme="stpatrick"],[data-theme="easter"],[data-theme="eid"],[data-theme="mothers"],[data-theme="fathers"],[data-theme="jamaica"],[data-theme="july4"],[data-theme="summer"],[data-theme="halloween"],[data-theme="diwali"],[data-theme="thanksgiving"],[data-theme="blackfriday"],[data-theme="cybermonday"],[data-theme="hanukkah"],[data-theme="christmas"],[data-theme="boxingday"]) .ska-spark.s3::before { font-size: 18px; }
.adm-theme::before { content: var(--ska-deco, none); position: absolute; left: 7px; top: 6px; font-size: 15px; line-height: 1; }
/* the light theme's dark boxes and close button */
.ska-pop[data-theme="pearl"] .ska-cd > div { background: rgba(15,23,42,.05); }
[data-theme="pearl"] .ska-x { background: rgba(15,23,42,.06); }
/* p6 — 36 swatches: a touch wider and tighter so one-word holidays (THANKSGIVING) fit on their line */
.adm-theme { width: 100px; font-size: 9.5px; letter-spacing: .03em; line-height: 1.15; }
.theme-group-h + .adm-theme { margin-left: 0; }
