
:root{
  --unpe-red:#E14631;
  --unpe-green:#095228;
  --unpe-gold:#7A6200;
  --unpe-night:#031D0E;
  --unpe-cream:#FFF9EC;
}
html{scroll-behavior:smooth}
.unpe-live-wrap{max-width:1180px;margin:auto;padding:32px 0}
.unpe-live-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:28px}
.unpe-kicker{font-size:12px;letter-spacing:.18em;font-weight:800;color:var(--unpe-accent,var(--unpe-gold))}
.unpe-live-head h2{font-size:clamp(38px,5vw,64px);line-height:1;margin:8px 0 0;color:var(--unpe-title,var(--unpe-cream))}
.unpe-live-head h2 em{font-style:normal;color:var(--unpe-accent,var(--unpe-gold))}
.unpe-auto{font-size:12px;color:#cbd9cf}
.unpe-stream-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.unpe-stream-card{overflow:hidden;border-radius:18px;background:var(--unpe-card,#073a1d);border:1px solid rgba(255,255,255,.08);color:white;text-decoration:none;box-shadow:0 16px 45px rgba(0,0,0,.18);transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}
.unpe-stream-card:hover{transform:translateY(-7px);box-shadow:0 24px 60px rgba(0,0,0,.3);border-color:rgba(122,98,0,.75)}
.unpe-stream-card.is-live{border-color:rgba(225,70,49,.65)}
.unpe-stream-visual{height:190px;background:#095228 center/cover no-repeat;position:relative}
.unpe-status,.unpe-viewers{position:absolute;top:14px;padding:7px 10px;border-radius:7px;font-size:11px;font-weight:800;backdrop-filter:blur(8px)}
.unpe-status{left:14px;background:rgba(3,29,14,.82)}
.is-live .unpe-status{background:var(--unpe-live,var(--unpe-red))}
.unpe-viewers{right:14px;background:rgba(3,29,14,.82)}
.unpe-stream-body{padding:20px}
.unpe-stream-body h3{font-size:24px;margin:0 0 7px;color:#fff}
.unpe-game{color:var(--unpe-accent,#e4c966);font-weight:700;margin:0 0 8px}
.unpe-title{color:var(--unpe-text,#d6e0d9);min-height:42px;margin:0 0 16px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.unpe-watch{font-size:12px;font-weight:900;letter-spacing:.05em;color:var(--unpe-button,#fff)}
.unpe-notice{padding:18px;border-radius:12px;background:#073a1d;color:#fff}
.unpe-logo-float{text-align:center}
.unpe-logo-float img{width:min(430px,90%);height:auto;filter:drop-shadow(0 24px 30px rgba(0,0,0,.28));animation:unpeFloat 4.5s ease-in-out infinite}
@keyframes unpeFloat{0%,100%{transform:translateY(0) rotate(-.5deg)}50%{transform:translateY(-13px) rotate(.5deg)}}
.unpe-reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.unpe-reveal.is-visible{opacity:1;transform:none}
.unpe-hover{transition:transform .28s ease,box-shadow .28s ease}
.unpe-hover:hover{transform:translateY(-6px)}
.unpe-snow{pointer-events:none;position:fixed;inset:0;z-index:20;overflow:hidden}
.unpe-flake{position:absolute;top:-20px;color:rgba(255,255,255,.55);animation:unpeSnow linear forwards;user-select:none}
@keyframes unpeSnow{to{transform:translate3d(var(--drift),105vh,0) rotate(360deg);opacity:.08}}
@media(max-width:900px){.unpe-stream-grid{grid-template-columns:1fr 1fr}.unpe-live-head{align-items:flex-start;flex-direction:column}.unpe-auto{display:none}}
@media(max-width:620px){.unpe-stream-grid{grid-template-columns:1fr}.unpe-stream-visual{height:210px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.unpe-logo-float img{animation:none}.unpe-reveal{opacity:1;transform:none;transition:none}.unpe-snow{display:none}}

.unpe-donation{max-width:900px;margin:0 auto;text-align:center;color:#fff;padding:28px 18px}
.unpe-donation-kicker{font-size:13px;font-weight:900;letter-spacing:.18em;margin-bottom:12px}
.unpe-donation-amount{font-size:clamp(30px,5vw,54px);font-weight:800;margin-bottom:18px}
.unpe-donation-amount span{opacity:.72;font-weight:600}
.unpe-progress-track{height:18px;border-radius:999px;background:rgba(255,255,255,.18);overflow:hidden}
.unpe-progress-track span{display:block;height:100%;border-radius:inherit;background:var(--unpe-progress,#E14631);transition:width 1s cubic-bezier(.2,.7,.2,1)}
.unpe-progress-pct{margin-top:8px;font-weight:800}
.unpe-donation-text{opacity:.85;margin:16px auto 20px}
.unpe-donation-button{display:inline-block;padding:13px 24px;border-radius:10px;background:var(--unpe-progress,#E14631);color:#fff!important;text-decoration:none!important;font-weight:900;transition:transform .25s ease}
.unpe-donation-button:hover{transform:translateY(-3px)}

/* V1.5 — cagnotte individuelle Streamlabs Charity */
.unpe-stream-mainlink{display:block;color:inherit;text-decoration:none!important}
.unpe-stream-name-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:7px}
.unpe-stream-name-row h3{min-width:0;margin-bottom:0}
.unpe-charity-amount{flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;padding:7px 9px;border-radius:999px;background:rgba(122,98,0,.2);border:1px solid rgba(228,201,102,.45);color:#fff!important;text-decoration:none!important;font-size:12px;font-weight:900;white-space:nowrap}
.unpe-charity-amount:hover{background:rgba(122,98,0,.38)}
.unpe-card-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:14px}
.unpe-watch{text-decoration:none!important}
.unpe-donate-small{display:inline-flex;align-items:center;padding:8px 10px;border-radius:8px;background:var(--unpe-live,var(--unpe-red));color:#fff!important;text-decoration:none!important;font-size:11px;font-weight:900;letter-spacing:.04em}
.unpe-donate-small:hover{transform:translateY(-2px)}
@media(max-width:380px){.unpe-stream-name-row{flex-direction:column}.unpe-charity-amount{align-self:flex-start}}
