/* ==========================================================================
   ELDERCS – Concurs lunar (lo usan la pagina publica /concurs/ y el panel)
   Todo va dentro de .ec-concurs para no chocar con los estilos del panel.
   ========================================================================== */
@property --cc-ray-a { syntax: '<angle>'; initial-value: 0deg; inherits: false; }

.ec-concurs {
    --cs-orange: #e58d27;
    --gold: #ffd24a;
    --silver: #d3dae2;
    --bronze: #d0803f;
    --ok: #3ddc84;
    --danger: #ff4d4d;
    --card: rgba(10, 10, 12, 0.86);
    color: #fff;
    font-family: 'Rajdhani', sans-serif;
    font-size: 16px;
    line-height: 1.4;
}
.ec-concurs *, .ec-concurs *::before, .ec-concurs *::after { box-sizing: border-box; }
.ec-concurs h2, .ec-concurs h3, .ec-concurs p, .ec-concurs ul { margin: 0; padding: 0; }
.ec-concurs ul { list-style: none; }
.ec-concurs a { text-decoration: none; color: inherit; }
.ec-concurs .cc-section { width: 100%; max-width: 1100px; margin: 0 auto 34px; }

/* ---------- Glass card base ---------- */
.ec-concurs .cc-box {
    background: var(--card); backdrop-filter: blur(14px);
    border: 1px solid rgba(229, 141, 39, 0.28); border-radius: 12px;
}

/* ---------- Header ---------- */
.ec-concurs .cc-head { text-align: center; margin-bottom: 26px; }
.ec-concurs .cc-trophy {
    font-size: clamp(2rem, 5vw, 3rem); color: var(--gold);
    filter: drop-shadow(0 0 14px rgba(255, 210, 74, .55));
    animation: cc-float 3s ease-in-out infinite;
}
@keyframes cc-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
.ec-concurs .cc-title {
    margin-top: 10px !important;
    font-family: 'Orbitron', sans-serif; font-weight: 900; letter-spacing: 4px; text-transform: uppercase;
    font-size: clamp(1.4rem, 4.6vw, 3rem); color: transparent !important;
    background-image: linear-gradient(100deg, #fff 0%, #fff 40%, #ffe7a8 47%, var(--gold) 50%, #ffe7a8 53%, #fff 60%, #fff 100%);
    background-size: 250% 100%; -webkit-background-clip: text; background-clip: text;
    animation: cc-shine 5s linear infinite;
    filter: drop-shadow(0 0 12px rgba(229, 141, 39, .25));
}
@keyframes cc-shine { from { background-position: 150% 0; } to { background-position: -100% 0; } }
.ec-concurs .cc-sub { margin-top: 6px !important; font-family: 'Orbitron', sans-serif; color: var(--cs-orange); letter-spacing: 6px; font-weight: 700; font-size: clamp(.85rem, 2vw, 1.1rem); }
.ec-concurs .cc-prizes-strip { margin-top: 16px; display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
.ec-concurs .cc-prize-chip {
    display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 999px;
    background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .12); font-weight: 700;
}
.ec-concurs .cc-prize-chip .n { font-family: 'Orbitron', sans-serif; font-size: .8rem; }
.ec-concurs .cc-prize-chip.p1 { border-color: rgba(255, 210, 74, .5); } .ec-concurs .cc-prize-chip.p1 .n { color: var(--gold); }
.ec-concurs .cc-prize-chip.p2 { border-color: rgba(211, 218, 226, .4); } .ec-concurs .cc-prize-chip.p2 .n { color: var(--silver); }
.ec-concurs .cc-prize-chip.p3 { border-color: rgba(208, 128, 63, .45); } .ec-concurs .cc-prize-chip.p3 .n { color: var(--bronze); }

/* ---------- Countdown ---------- */
.ec-concurs .cc-countdown { max-width: 720px; margin: 0 auto 34px; padding: 26px 24px 22px; text-align: center; position: relative; overflow: hidden; }
.ec-concurs .cc-cd-label { font-size: .85rem; letter-spacing: 3px; text-transform: uppercase; color: rgba(255, 255, 255, .65); font-weight: 700; }
.ec-concurs .cc-cd-label i { color: var(--cs-orange); margin-right: 6px; }
.ec-concurs .cc-urgent-tag {
    display: none; margin: 0 auto 10px; width: max-content; padding: 4px 12px; border-radius: 6px;
    font-family: 'Orbitron', sans-serif; font-size: .75rem; font-weight: 900; letter-spacing: 3px;
    background: var(--danger); color: #fff; animation: cc-blink 1s steps(2, start) infinite;
}
@keyframes cc-blink { to { opacity: .35; } }
.ec-concurs .cc-timer { display: flex; justify-content: center; gap: 12px; margin: 16px 0 14px; }
.ec-concurs .cc-unit {
    min-width: 84px; padding: 12px 8px 8px; border-radius: 10px; perspective: 400px;
    background: linear-gradient(180deg, rgba(229, 141, 39, .14), rgba(229, 141, 39, .04));
    border: 1px solid rgba(229, 141, 39, .35);
}
.ec-concurs .cc-num {
    display: block; font-family: 'Orbitron', sans-serif; font-weight: 900; font-size: clamp(1.6rem, 5vw, 2.6rem);
    color: var(--cs-orange); font-variant-numeric: tabular-nums; text-shadow: 0 0 16px rgba(229, 141, 39, .45);
}
.ec-concurs .cc-num.flip { animation: cc-flip .45s ease; }
@keyframes cc-flip {
    0% { transform: rotateX(0); } 45% { transform: rotateX(-90deg); opacity: .3; } 55% { transform: rotateX(90deg); opacity: .3; } 100% { transform: rotateX(0); }
}
.ec-concurs .cc-lbl { display: block; margin-top: 2px; font-size: .72rem; letter-spacing: 2px; text-transform: uppercase; color: rgba(255, 255, 255, .5); }
.ec-concurs .cc-dates { font-weight: 700; letter-spacing: .5px; }
.ec-concurs .cc-dates i { color: var(--cs-orange); margin-right: 6px; }
.ec-concurs .cc-progress { margin: 14px auto 0; max-width: 520px; }
.ec-concurs .cc-progress-bar { height: 8px; border-radius: 6px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.ec-concurs .cc-progress-bar span {
    display: block; height: 100%; width: 0; border-radius: 6px;
    background: linear-gradient(90deg, var(--cs-orange), #ffc66b); box-shadow: 0 0 12px rgba(229, 141, 39, .6);
    transition: width 1.2s ease; position: relative; overflow: hidden;
}
.ec-concurs .cc-progress-bar span::after {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .55), transparent);
    animation: cc-sweep 2.2s linear infinite;
}
@keyframes cc-sweep { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
.ec-concurs .cc-progress-txt { margin-top: 6px; font-size: .85rem; color: rgba(255, 255, 255, .55); }
.ec-concurs .cc-note { margin-top: 14px !important; color: rgba(255, 255, 255, .7); line-height: 1.6; font-size: .98rem; }
.ec-concurs .cc-note strong { color: var(--cs-orange); }
/* last 24h */
.ec-concurs.is-urgent .cc-countdown { border-color: rgba(255, 77, 77, .65); box-shadow: 0 0 0 1px rgba(255, 77, 77, .25), 0 0 40px -6px rgba(255, 77, 77, .45); animation: cc-pulse-red 1.6s ease-in-out infinite; }
.ec-concurs.is-urgent .cc-urgent-tag { display: block; }
.ec-concurs.is-urgent .cc-unit { border-color: rgba(255, 77, 77, .5); background: linear-gradient(180deg, rgba(255, 77, 77, .16), rgba(255, 77, 77, .04)); }
.ec-concurs.is-urgent .cc-num { color: #ff6b5b; text-shadow: 0 0 18px rgba(255, 77, 77, .65); }
@keyframes cc-pulse-red { 0%, 100% { box-shadow: 0 0 0 1px rgba(255, 77, 77, .25), 0 0 30px -8px rgba(255, 77, 77, .4); } 50% { box-shadow: 0 0 0 1px rgba(255, 77, 77, .45), 0 0 46px -4px rgba(255, 77, 77, .7); } }
/* ended */
.ec-concurs .cc-ended { display: none; }
.ec-concurs.is-ended .cc-live-only { display: none !important; }
.ec-concurs.is-ended .cc-ended { display: block; }
.ec-concurs .cc-ended-icon { font-size: 2.6rem; color: var(--gold); filter: drop-shadow(0 0 16px rgba(255, 210, 74, .7)); animation: cc-float 2.6s ease-in-out infinite; }
.ec-concurs .cc-ended-title { margin-top: 8px; font-family: 'Orbitron', sans-serif; font-weight: 900; font-size: clamp(1.2rem, 3vw, 1.8rem); letter-spacing: 3px; text-transform: uppercase; }
.ec-concurs .cc-ended-text { margin-top: 8px !important; color: rgba(255, 255, 255, .7); }

/* ---------- "Unde esti tu?" ---------- */
.ec-concurs .cc-me { max-width: 860px; margin: 0 auto 30px; padding: 14px 18px; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; justify-content: center; text-align: center; }
.ec-concurs .cc-me:empty { display: none; }
.ec-concurs .cc-me-avatar { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; border: 2px solid var(--cs-orange); box-shadow: 0 0 12px rgba(229, 141, 39, .5); }
.ec-concurs .cc-me-pos { font-family: 'Orbitron', sans-serif; font-weight: 900; font-size: 1.6rem; color: var(--cs-orange); text-shadow: 0 0 14px rgba(229, 141, 39, .5); }
.ec-concurs .cc-me-text { font-size: 1.02rem; color: rgba(255, 255, 255, .8); text-align: left; }
.ec-concurs .cc-me-text strong { color: #fff; }
.ec-concurs .cc-me-text .gap { color: var(--ok); font-weight: 700; }
.ec-concurs .cc-me-bar { flex-basis: 100%; height: 6px; border-radius: 4px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.ec-concurs .cc-me-bar span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--ok), #9cf5c3); transition: width 1s ease; }
.ec-concurs .cc-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 9px;
    padding: 11px 20px; border-radius: 8px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; font-size: .9rem;
    border: 1px solid var(--cs-orange); color: #fff; background: rgba(229, 141, 39, .12);
    transition: background .2s ease, transform .2s ease, box-shadow .2s ease; cursor: pointer;
}
.ec-concurs .cc-btn:hover { background: rgba(229, 141, 39, .28); transform: translateY(-2px); box-shadow: 0 8px 22px -8px rgba(229, 141, 39, .7); }
.ec-concurs .cc-btn.primary { background: var(--cs-orange); color: #0a0a0c; }
.ec-concurs .cc-btn.primary:hover { filter: brightness(1.1); background: var(--cs-orange); }

/* ---------- Live pill ---------- */
.ec-concurs .cc-live-row { text-align: center; margin-bottom: 18px; }
.ec-concurs .cc-live-pill {
    display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 999px;
    font-size: .82rem; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
    background: rgba(255, 77, 77, .1); border: 1px solid rgba(255, 77, 77, .4); color: #ff8a8a;
}
.ec-concurs .cc-live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--danger); animation: cc-ping 1.5s infinite; }
@keyframes cc-ping { 0% { box-shadow: 0 0 0 0 rgba(255, 77, 77, .7); } 80%, 100% { box-shadow: 0 0 0 9px rgba(255, 77, 77, 0); } }
.ec-concurs .cc-updated { display: block; margin-top: 6px; font-size: .78rem; color: rgba(255, 255, 255, .4); }

/* ---------- Podium ---------- */
.ec-concurs .cc-podium { position: relative; display: grid; grid-template-columns: 1fr 1.12fr 1fr; gap: 20px; align-items: end; padding-top: 78px; }
.ec-concurs .cc-pcard { z-index: 1; }
.ec-concurs .cc-pcard {
    --metal: var(--cs-orange);
    position: relative; text-align: center; padding: 34px 18px 18px;
    background: linear-gradient(180deg, rgba(20, 18, 16, .95), rgba(10, 10, 12, .92));
    border: 1px solid color-mix(in srgb, var(--metal) 45%, transparent); border-radius: 14px;
    box-shadow: 0 20px 50px -18px color-mix(in srgb, var(--metal) 50%, transparent);
    opacity: 0; transform: translateY(70px);
}
.ec-concurs .cc-pcard.r1 { --metal: var(--gold); padding-top: 46px; padding-bottom: 26px; }
.ec-concurs .cc-pcard.r2 { --metal: var(--silver); }
.ec-concurs .cc-pcard.r3 { --metal: var(--bronze); }
.ec-concurs .cc-podium.risen .cc-pcard { animation: cc-rise .9s cubic-bezier(.2, 1.3, .4, 1) forwards; }
.ec-concurs .cc-podium.risen .cc-pcard.r3 { animation-delay: .05s; }
.ec-concurs .cc-podium.risen .cc-pcard.r2 { animation-delay: .3s; }
.ec-concurs .cc-podium.risen .cc-pcard.r1 { animation-delay: .6s; }
@keyframes cc-rise { to { opacity: 1; transform: translateY(0); } }
.ec-concurs .cc-pcard:hover { transform: translateY(-6px) !important; transition: transform .25s ease; }
/* metal ray around the card */
.ec-concurs .cc-ray { position: absolute; inset: -1px; border-radius: 15px; pointer-events: none; filter: drop-shadow(0 0 6px var(--metal)); }
.ec-concurs .cc-ray > i {
    position: absolute; inset: 0; border-radius: inherit; padding: 2px;
    background: conic-gradient(from var(--cc-ray-a), transparent 0deg 280deg, color-mix(in srgb, var(--metal) 30%, transparent) 300deg, var(--metal) 340deg, #fff 356deg, transparent 360deg);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
            mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite: exclude;
    animation: cc-ray-spin 5s linear infinite;
}
.ec-concurs .cc-pcard.r1 .cc-ray > i { animation-duration: 3.6s; padding: 2.5px; }
.ec-concurs .cc-pcard.r2 .cc-ray > i { animation-delay: -1.7s; }
.ec-concurs .cc-pcard.r3 .cc-ray > i { animation-delay: -3.1s; }
@keyframes cc-ray-spin { to { --cc-ray-a: 360deg; } }
.ec-concurs .cc-medal {
    position: absolute; top: -17px; left: 50%; transform: translateX(-50%);
    min-width: 46px; padding: 5px 12px; border-radius: 999px; z-index: 2;
    font-family: 'Orbitron', sans-serif; font-weight: 900; font-size: .9rem;
    background: var(--metal); color: #121212; box-shadow: 0 0 18px color-mix(in srgb, var(--metal) 70%, transparent);
}
.ec-concurs .cc-crown {
    position: absolute; top: -62px; left: 50%; transform: translateX(-50%); z-index: 2;
    font-size: 2.1rem; color: var(--gold); filter: drop-shadow(0 0 12px rgba(255, 210, 74, .9));
    animation: cc-crown 2.6s ease-in-out infinite;
}
@keyframes cc-crown { 0%, 100% { transform: translate(-50%, 0) rotate(-6deg); } 50% { transform: translate(-50%, -8px) rotate(6deg); } }
.ec-concurs .cc-avatar-wrap { position: relative; width: 104px; height: 104px; margin: 0 auto 12px; }
.ec-concurs .cc-pcard.r1 .cc-avatar-wrap { width: 128px; height: 128px; }
.ec-concurs .cc-avatar-wrap::before {
    content: ""; position: absolute; inset: -5px; border-radius: 50%;
    background: conic-gradient(var(--metal), transparent 35%, var(--metal) 50%, transparent 85%, var(--metal));
    animation: cc-spin 4s linear infinite;
}
@keyframes cc-spin { to { transform: rotate(360deg); } }
.ec-concurs .cc-avatar { position: relative; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; border: 3px solid #0d0d0f; background: #1a1a1d; }
.ec-concurs .cc-pname { font-size: 1.25rem; font-weight: 700; word-break: break-word; }
.ec-concurs .cc-pcard.r1 .cc-pname { font-size: 1.45rem; }
.ec-concurs .cc-pname a:hover { color: var(--metal); text-shadow: 0 0 12px var(--metal); }
.ec-concurs .cc-plabel { margin-top: 4px; font-size: .72rem; letter-spacing: 2px; text-transform: uppercase; color: rgba(255, 255, 255, .45); }
.ec-concurs .cc-ppoints { display: flex; align-items: center; justify-content: center; gap: 8px; font-family: 'Orbitron', sans-serif; font-weight: 900; font-size: 1.5rem; color: var(--metal); text-shadow: 0 0 16px color-mix(in srgb, var(--metal) 60%, transparent); }
.ec-concurs .cc-pcard.r1 .cc-ppoints { font-size: 1.9rem; }
.ec-concurs .cc-ppoints img { height: 26px; }
.ec-concurs .cc-pdiv { height: 1px; margin: 14px 0; background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--metal) 45%, transparent), transparent); }
.ec-concurs .cc-pstats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.ec-concurs .cc-pstat b { display: block; font-size: 1.1rem; }
.ec-concurs .cc-pstat small { font-size: .7rem; letter-spacing: 1.5px; text-transform: uppercase; color: rgba(255, 255, 255, .45); }
.ec-concurs .cc-pprize {
    margin-top: 14px; padding: 10px; border-radius: 9px; font-family: 'Orbitron', sans-serif; font-weight: 900; font-size: 1.15rem;
    color: var(--metal); background: color-mix(in srgb, var(--metal) 12%, transparent); border: 1px solid color-mix(in srgb, var(--metal) 40%, transparent);
}
.ec-concurs .cc-pprize small { display: block; margin-top: 2px; font-family: 'Rajdhani', sans-serif; font-size: .8rem; letter-spacing: 1px; font-weight: 700; opacity: .8; }
.ec-concurs .cc-pprize i { margin-right: 6px; }
.ec-concurs .cc-pempty { padding: 26px 0 10px; color: rgba(255, 255, 255, .45); }
.ec-concurs .cc-pempty i { display: block; font-size: 2rem; margin-bottom: 10px; color: color-mix(in srgb, var(--metal) 60%, transparent); }

/* rank change arrows */
.ec-concurs .cc-move {
    position: absolute; top: 10px; right: 10px; padding: 2px 7px; border-radius: 5px; font-size: .78rem; font-weight: 700;
    color: var(--ok); background: rgba(61, 220, 132, .12); border: 1px solid rgba(61, 220, 132, .45);
    animation: cc-pop .5s cubic-bezier(.2, 1.6, .4, 1), cc-glow-ok 1.2s ease-in-out 3;
}
.ec-concurs .cc-move.down { color: #ff8a8a; background: rgba(255, 77, 77, .12); border-color: rgba(255, 77, 77, .45); animation: cc-pop .5s cubic-bezier(.2, 1.6, .4, 1); }
@keyframes cc-pop { from { transform: scale(0); } to { transform: scale(1); } }
@keyframes cc-glow-ok { 50% { box-shadow: 0 0 14px rgba(61, 220, 132, .8); } }

/* ---------- Top 4-10 ---------- */
.ec-concurs .cc-list { margin-top: 26px; padding: 6px 0; overflow: hidden; }
.ec-concurs .cc-list:empty { display: none; }
.ec-concurs .cc-row {
    position: relative; display: grid; grid-template-columns: 54px 44px 1fr auto auto; align-items: center; gap: 14px;
    padding: 10px 18px; border-bottom: 1px solid rgba(255, 255, 255, .06); transition: background .2s ease;
}
.ec-concurs .cc-row:last-child { border-bottom: 0; }
.ec-concurs .cc-row:hover { background: rgba(229, 141, 39, .07); }
.ec-concurs .cc-row.is-me { background: rgba(61, 220, 132, .08); box-shadow: inset 3px 0 0 var(--ok); }
.ec-concurs .cc-row-pos { font-family: 'Orbitron', sans-serif; font-weight: 900; color: rgba(255, 255, 255, .55); font-size: 1.05rem; }
.ec-concurs .cc-row-av { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; border: 2px solid rgba(229, 141, 39, .4); background: #1a1a1d; }
.ec-concurs .cc-row-name { font-weight: 700; font-size: 1.05rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ec-concurs .cc-row-name small { display: block; font-weight: 400; color: rgba(255, 255, 255, .45); font-size: .85rem; }
.ec-concurs .cc-row-name small.near { color: var(--ok); font-weight: 700; }
.ec-concurs .cc-row-kd { color: rgba(255, 255, 255, .55); font-size: .9rem; white-space: nowrap; }
.ec-concurs .cc-row-pts { font-family: 'Orbitron', sans-serif; font-weight: 900; color: var(--cs-orange); white-space: nowrap; }
.ec-concurs .cc-row .cc-move { position: static; margin-left: 8px; }

/* ---------- Server / CTA ---------- */
.ec-concurs .cc-cta { display: flex; justify-content: center; align-items: center; gap: 14px; flex-wrap: wrap; }
.ec-concurs .cc-server {
    display: inline-flex; align-items: center; gap: 12px; padding: 8px 10px 8px 16px; border-radius: 999px;
    background: var(--card); border: 1px solid rgba(229, 141, 39, .3);
}
.ec-concurs .cc-server-dot { width: 9px; height: 9px; border-radius: 50%; background: #777; }
.ec-concurs .cc-server.on .cc-server-dot { background: var(--ok); animation: cc-ping-ok 1.8s infinite; }
@keyframes cc-ping-ok { 0% { box-shadow: 0 0 0 0 rgba(61, 220, 132, .6); } 80%, 100% { box-shadow: 0 0 0 9px rgba(61, 220, 132, 0); } }
.ec-concurs .cc-server-txt { font-weight: 700; }
.ec-concurs .cc-server-txt strong { color: var(--cs-orange); }
.ec-concurs .cc-server-txt span { color: rgba(255, 255, 255, .5); font-weight: 400; }

/* ---------- Ultimul concurs ---------- */
.ec-concurs .cc-last { padding: 26px 22px; position: relative; overflow: hidden; }
.ec-concurs .cc-last::before {
    content: ""; position: absolute; inset: 0 0 auto; height: 2px;
    background: linear-gradient(90deg, transparent, var(--gold), transparent);
}
.ec-concurs .cc-sec-head { text-align: center; margin-bottom: 20px; }
.ec-concurs .cc-kicker { color: var(--cs-orange); font-size: .8rem; font-weight: 700; letter-spacing: 4px; text-transform: uppercase; }
.ec-concurs .cc-sec-head h2 { margin-top: 6px !important; font-family: 'Orbitron', sans-serif; font-size: clamp(1.2rem, 3vw, 1.8rem); letter-spacing: 3px; text-transform: uppercase; color: #fff !important; }
.ec-concurs .cc-sec-head p { margin-top: 6px !important; color: rgba(255, 255, 255, .55); }
.ec-concurs .cc-last-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.ec-concurs .cc-wcard {
    --metal: var(--gold);
    position: relative; text-align: center; padding: 18px 12px 14px; border-radius: 12px;
    background: linear-gradient(180deg, color-mix(in srgb, var(--metal) 9%, transparent), rgba(10, 10, 12, .6));
    border: 1px solid color-mix(in srgb, var(--metal) 40%, transparent);
    transition: transform .25s ease, box-shadow .25s ease;
}
.ec-concurs .cc-wcard:hover { transform: translateY(-4px); box-shadow: 0 14px 30px -12px color-mix(in srgb, var(--metal) 70%, transparent); }
.ec-concurs .cc-wcard.r2 { --metal: var(--silver); } .ec-concurs .cc-wcard.r3 { --metal: var(--bronze); }
.ec-concurs .cc-wcard .cc-wplace { font-family: 'Orbitron', sans-serif; font-weight: 900; color: var(--metal); font-size: .85rem; letter-spacing: 2px; }
.ec-concurs .cc-wcard img { width: 70px; height: 70px; border-radius: 50%; object-fit: cover; margin: 10px auto 8px; display: block; border: 3px solid var(--metal); box-shadow: 0 0 16px color-mix(in srgb, var(--metal) 55%, transparent); background: #1a1a1d; }
.ec-concurs .cc-wcard .cc-wname { font-weight: 700; font-size: 1.08rem; word-break: break-word; }
.ec-concurs .cc-wcard .cc-wpts { color: rgba(255, 255, 255, .55); font-size: .9rem; }
.ec-concurs .cc-wcard .cc-wprize { margin-top: 8px; display: inline-block; padding: 4px 12px; border-radius: 6px; font-weight: 700; color: var(--metal); background: color-mix(in srgb, var(--metal) 12%, transparent); }

/* ---------- Regulament ---------- */
.ec-concurs .cc-rules { padding: 28px 24px 22px; }
.ec-concurs .cc-rules h3 { margin: 20px 0 12px !important; padding-bottom: 8px; border-bottom: 1px solid rgba(229, 141, 39, .2); color: var(--cs-orange) !important; font-size: .9rem; letter-spacing: 3px; text-transform: uppercase; font-weight: 700; }
.ec-concurs .cc-rules h3 i { margin-right: 8px; }
.ec-concurs .cc-rules li {
    display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; margin-bottom: 8px; border-radius: 8px;
    background: rgba(255, 255, 255, .03); border: 1px solid rgba(255, 255, 255, .07); transition: border-color .2s ease, transform .2s ease;
}
.ec-concurs .cc-rules li:hover { border-color: rgba(229, 141, 39, .4); transform: translateX(4px); }
.ec-concurs .cc-rules li i { color: var(--cs-orange); width: 20px; text-align: center; margin-top: 3px; flex-shrink: 0; }
.ec-concurs .cc-rules li.danger { border-color: rgba(255, 77, 77, .3); background: rgba(255, 77, 77, .05); }
.ec-concurs .cc-rules li.danger i, .ec-concurs .cc-rules li.danger strong { color: #ff7a7a; }
.ec-concurs .cc-rules-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 6px; }
.ec-concurs .cc-rules-foot { margin-top: 18px !important; text-align: center; color: var(--cs-orange); letter-spacing: 1px; }

/* ---------- Error ---------- */
.ec-concurs .cc-error { padding: 22px; text-align: center; color: rgba(255, 255, 255, .7); grid-column: 1 / -1; }
.ec-concurs .cc-error i { color: var(--cs-orange); margin-right: 8px; }
.ec-concurs .cc-error a { color: var(--cs-orange); font-weight: 700; }

/* ---------- Scroll reveal ---------- */
.ec-concurs .cc-reveal { opacity: 0; translate: 0 30px; transition: opacity .7s ease, translate .7s cubic-bezier(.2, .7, .2, 1); }
.ec-concurs .cc-reveal.in { opacity: 1; translate: 0 0; }

/* ---------- Confetti ---------- */
#ccConfetti { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 2000; }

/* ---------- Responsive ---------- */
@media (max-width: 760px) {
    .ec-concurs .cc-podium { grid-template-columns: 1fr; gap: 46px; max-width: 380px; margin: 0 auto; padding-top: 80px; }
    .ec-concurs .cc-pcard.r1 { order: 1; } .ec-concurs .cc-pcard.r2 { order: 2; } .ec-concurs .cc-pcard.r3 { order: 3; }
    .ec-concurs .cc-row { grid-template-columns: 40px 38px 1fr auto; gap: 10px; padding: 10px 12px; }
    .ec-concurs .cc-row-kd { display: none; }
    .ec-concurs .cc-last-grid { grid-template-columns: 1fr; }
    .ec-concurs .cc-rules-actions { grid-template-columns: 1fr; }
    .ec-concurs .cc-unit { min-width: 64px; }
    .ec-concurs .cc-timer { gap: 8px; }
    .ec-concurs .cc-me-text { text-align: center; }
}


/* ==========================================================================
   v2 – efectos extra
   ========================================================================== */

/* ---------- Focos de luz detras del 1o ---------- */
.ec-concurs .cc-spotlight {
    position: absolute; left: 50%; top: 10px; width: 640px; height: 640px; margin-left: -320px;
    pointer-events: none; z-index: 0;
    background: repeating-conic-gradient(from 0deg, rgba(255, 210, 74, .16) 0deg 7deg, transparent 7deg 22deg);
    -webkit-mask: radial-gradient(circle, #000 0%, rgba(0, 0, 0, .55) 32%, transparent 62%);
            mask: radial-gradient(circle, #000 0%, rgba(0, 0, 0, .55) 32%, transparent 62%);
    animation: cc-spin 40s linear infinite;
    opacity: 0; transition: opacity 1.2s ease .8s;
}
.ec-concurs .cc-podium.risen .cc-spotlight { opacity: 1; }
@media (max-width: 760px) { .ec-concurs .cc-spotlight { top: -60px; width: 460px; height: 460px; margin-left: -230px; } }

/* ---------- Chispas doradas que suben desde el 1o ---------- */
.ec-concurs .cc-sparks { position: absolute; inset: 0; pointer-events: none; overflow: visible; }
.ec-concurs .cc-sparks i {
    position: absolute; bottom: 30%; width: 4px; height: 4px; border-radius: 50%;
    background: #ffe7a0; box-shadow: 0 0 8px 2px rgba(255, 210, 74, .9);
    opacity: 0; animation: cc-rise-spark 3.4s ease-in infinite;
}
@keyframes cc-rise-spark {
    0% { opacity: 0; transform: translate(0, 0) scale(.6); }
    15% { opacity: 1; }
    100% { opacity: 0; transform: translate(var(--dx, 10px), -230px) scale(1.1); }
}

/* ---------- Distancia entre puestos ---------- */
.ec-concurs .cc-gap { margin-top: 10px; font-size: .85rem; font-weight: 700; letter-spacing: .5px; color: rgba(255, 255, 255, .6); }
.ec-concurs .cc-gap b { color: var(--ok); }
.ec-concurs .cc-gap.tight b { color: #ff8a5b; animation: cc-blink 1.2s steps(2, start) infinite; }

/* ---------- Lista 4-10: entrada, barra y VIP FREE ---------- */
.ec-concurs .cc-row { transition: background .2s ease, transform .25s ease, box-shadow .25s ease; }
.ec-concurs .cc-row:hover { transform: translateX(6px); box-shadow: inset 3px 0 0 var(--cs-orange); }
.ec-concurs .cc-list.enter .cc-row { opacity: 0; transform: translateX(-30px); animation: cc-row-in .55s cubic-bezier(.2, .8, .2, 1) forwards; animation-delay: calc(var(--i) * 70ms); }
@keyframes cc-row-in { to { opacity: 1; transform: none; } }
.ec-concurs .cc-row-bar { display: block; height: 3px; margin-top: 5px; border-radius: 2px; background: rgba(255, 255, 255, .07); overflow: hidden; max-width: 320px; }
.ec-concurs .cc-row-bar span { display: block; height: 100%; width: 0; border-radius: 2px; background: linear-gradient(90deg, var(--cs-orange), #ffc66b); transition: width 1.2s cubic-bezier(.2, .8, .2, 1); }
.ec-concurs .cc-vip {
    display: inline-block; margin-left: 8px; padding: 1px 7px; border-radius: 4px; vertical-align: 2px;
    font-family: 'Orbitron', sans-serif; font-size: .6rem; font-weight: 900; letter-spacing: 1px;
    color: #0a0a0c; background: linear-gradient(110deg, #ffd24a, #e58d27, #ffd24a); background-size: 200% 100%;
    animation: cc-shine 3s linear infinite; box-shadow: 0 0 10px rgba(229, 141, 39, .45);
}

/* ---------- Cuenta atras: ":" que parpadean y temblor en la ultima hora ---------- */
.ec-concurs .cc-sep {
    align-self: center; margin-top: -18px; font-family: 'Orbitron', sans-serif; font-weight: 900; font-size: 2rem;
    color: var(--cs-orange); animation: cc-blink 1s steps(2, start) infinite;
}
.ec-concurs.is-urgent .cc-sep { color: #ff6b5b; }
.ec-concurs .cc-countdown.shake { animation: cc-shake .6s ease; }
@keyframes cc-shake {
    0%, 100% { transform: translateX(0); }
    15%, 55% { transform: translateX(-7px) rotate(-.6deg); }
    35%, 75% { transform: translateX(7px) rotate(.6deg); }
}
@media (max-width: 760px) { .ec-concurs .cc-sep { display: none; } }

/* ---------- "In forma azi" ---------- */
.ec-concurs .cc-hot { padding: 22px; position: relative; overflow: hidden; }
.ec-concurs .cc-hot::before { content: ""; position: absolute; inset: 0 0 auto; height: 2px; background: linear-gradient(90deg, transparent, #ff6a2b, transparent); }
.ec-concurs .cc-hot-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.ec-concurs .cc-hot-card {
    display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 10px;
    background: linear-gradient(110deg, rgba(255, 106, 43, .12), rgba(10, 10, 12, .5));
    border: 1px solid rgba(255, 106, 43, .35); transition: transform .25s ease, box-shadow .25s ease;
}
.ec-concurs .cc-hot-card:hover { transform: translateY(-3px); box-shadow: 0 12px 26px -12px rgba(255, 106, 43, .8); }
.ec-concurs .cc-hot-card img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; border: 2px solid #ff6a2b; background: #1a1a1d; }
.ec-concurs .cc-hot-name { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ec-concurs .cc-hot-gain { font-family: 'Orbitron', sans-serif; font-weight: 900; color: #ff8a4c; text-shadow: 0 0 12px rgba(255, 106, 43, .6); }
.ec-concurs .cc-hot-gain small { font-family: 'Rajdhani', sans-serif; font-weight: 700; color: rgba(255, 255, 255, .5); letter-spacing: 1px; }
.ec-concurs .cc-hot-fire { margin-left: auto; font-size: 1.4rem; color: #ff6a2b; animation: cc-flame 1.4s ease-in-out infinite; }
@keyframes cc-flame { 0%, 100% { transform: scale(1) rotate(-4deg); filter: drop-shadow(0 0 4px #ff6a2b); } 50% { transform: scale(1.15) rotate(4deg); filter: drop-shadow(0 0 12px #ffb02b); } }
@media (max-width: 760px) { .ec-concurs .cc-hot-grid { grid-template-columns: 1fr; } }


/* ---------- Rayo naranja que recorre el borde de los recuadros (como en el panel) ---------- */
@property --cc-bray-a { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
.ec-concurs .cc-box, .ec-concurs .cc-server { position: relative; }
.ec-concurs .cc-bray {
    position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 3;
    filter: drop-shadow(0 0 5px rgba(229, 141, 39, .85)) drop-shadow(0 0 12px rgba(229, 141, 39, .35));
}
.ec-concurs .cc-bray > i {
    position: absolute; inset: 0; border-radius: inherit; padding: 1.5px;
    background: conic-gradient(from var(--cc-bray-a), transparent 0deg 285deg, rgba(229, 141, 39, .15) 300deg, rgba(229, 141, 39, .85) 340deg, #ffe3b0 356deg, transparent 360deg);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
            mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite: exclude;
    animation: cc-bray-spin var(--cc-bray-speed, 7s) linear infinite;
    animation-delay: var(--cc-bray-delay, 0s);
}
@keyframes cc-bray-spin { to { --cc-bray-a: 360deg; } }
.ec-concurs .cc-box:hover > .cc-bray > i, .ec-concurs .cc-server:hover > .cc-bray > i { animation-duration: 2.6s; }
/* en las ultimas 24 h, el rayo de la cuenta atras es rojo */
.ec-concurs.is-urgent .cc-countdown > .cc-bray { filter: drop-shadow(0 0 6px rgba(255, 77, 77, .9)); }
.ec-concurs.is-urgent .cc-countdown > .cc-bray > i {
    background: conic-gradient(from var(--cc-bray-a), transparent 0deg 285deg, rgba(255, 77, 77, .2) 300deg, rgba(255, 77, 77, .9) 340deg, #ffd0c8 356deg, transparent 360deg);
    animation-duration: 3s;
}

/* ---------------- concurso anterior / excluidos / reset ---------------- */
.ec-concurs .cc-head-extra { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: 14px; }
.ec-concurs .cc-last-btn { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 999px; font-weight: 700; font-size: 14px; letter-spacing: .3px;
  color: #ffd24a !important; text-decoration: none !important; background: rgba(255, 210, 74, .08); border: 1px solid rgba(255, 210, 74, .4); transition: transform .2s, box-shadow .2s, background .2s; }
.ec-concurs .cc-last-btn:hover { transform: translateY(-2px); background: rgba(255, 210, 74, .16); box-shadow: 0 8px 22px -10px rgba(255, 210, 74, .8); }
.ec-concurs .cc-last-btn[hidden], .ec-concurs .cc-reset-note[hidden] { display: none; }
.ec-concurs .cc-reset-note { font-size: 14px; color: rgba(255, 255, 255, .8); padding: 8px 14px; border-radius: 10px; background: rgba(229, 141, 39, .1); border: 1px dashed rgba(229, 141, 39, .45); }
.ec-concurs .cc-reset-note i { color: #e58d27; margin-right: 6px; }
.ec-concurs .cc-excl { padding: 22px; position: relative; overflow: hidden; }
.ec-concurs .cc-excl::before { content: ""; position: absolute; inset: 0 0 auto; height: 2px; background: linear-gradient(90deg, transparent, #ffd24a, transparent); }
.ec-concurs .cc-excl-list { display: flex; flex-direction: column; gap: 8px; }
.ec-concurs .cc-excl-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 14px; border-radius: 12px; text-decoration: none !important; color: #fff !important;
  background: rgba(255, 255, 255, .03); border: 1px solid rgba(255, 210, 74, .18); opacity: .85; transition: opacity .2s, background .2s; }
.ec-concurs .cc-excl-row:hover { opacity: 1; background: rgba(255, 210, 74, .06); }
.ec-concurs .cc-excl-row img { width: 38px; height: 38px; border-radius: 10px; filter: grayscale(.35); }
.ec-concurs .cc-excl-name { font-weight: 700; font-size: 16px; }
.ec-concurs .cc-excl-tag { font-size: 12px; font-weight: 700; letter-spacing: .4px; color: #ffb4b4; background: rgba(255, 80, 80, .12); border: 1px solid rgba(255, 80, 80, .35); padding: 2px 8px; border-radius: 6px; }
.ec-concurs .cc-excl-tag i { margin-right: 4px; }
.ec-concurs .cc-excl-last { font-size: 12px; color: #ffd24a; background: rgba(255, 210, 74, .1); padding: 2px 8px; border-radius: 6px; }
.ec-concurs .cc-excl-pts { margin-left: auto; font-family: Orbitron, sans-serif; font-size: 14px; color: rgba(255, 255, 255, .7); }
.ec-concurs .cc-excl-pts small { font-family: inherit; font-size: 11px; opacity: .6; }
@media (max-width: 640px) { .ec-concurs .cc-excl-tag { font-size: 0; padding: 3px 6px; } .ec-concurs .cc-excl-tag i { font-size: 12px; margin: 0; } }