/* v1.82 — Trophées GME (maquette dorée validée). Préfixe gt-. Bandeau sombre identique en mode clair et sombre (exclu de build-dark-css). */
.gt-host { --g1: #ffe59a; --g2: #f6c453; --g3: #b9861f; --g4: #7a5410; padding: 16px 24px 0; font-family: 'Barlow', 'Segoe UI', sans-serif }
.gt-host:empty { display: none }
.gt { position: relative; border-radius: 16px; padding: 2px; overflow: hidden; isolation: isolate; height: 128px; perspective: 900px }
.gt + .gt { margin-top: 10px }
.gt::before { content: ''; position: absolute; width: 2400px; height: 2400px; left: calc(50% - 1200px); top: calc(50% - 1200px); z-index: -2; background: conic-gradient(var(--g3), var(--g1), #e11d24, var(--g2), var(--g4), var(--g1), var(--g3)); animation: gt-spin 6s linear infinite }
@keyframes gt-spin { to { transform: rotate(360deg) } }
.gt-in { position: relative; height: 100%; border-radius: 14px; display: grid; grid-template-columns: 345px minmax(0, 1fr) 260px; gap: 18px; align-items: center; padding: 0 20px; overflow: hidden; color: #eef2f8; transition: transform .25s ease-out;
  background: radial-gradient(520px 170px at 9% 50%, rgba(246,196,83,.26), transparent 60%), radial-gradient(420px 160px at 100% 100%, rgba(225,29,36,.2), transparent 60%), linear-gradient(120deg, #0b1220, #131c30 55%, #0b1220) }
.gt-in::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(110deg, transparent 35%, rgba(255,240,200,.16) 50%, transparent 65%); background-size: 250% 100%; animation: gt-sheen 4.5s ease-in-out infinite }
@keyframes gt-sheen { 0% { background-position: 130% 0 } 60%, 100% { background-position: -30% 0 } }
.gt-fx, .gt-boom { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0 }
.gt-boom { z-index: 3 }
.gt-glow { position: absolute; inset: 0; pointer-events: none; z-index: 0; background: radial-gradient(280px 130px at var(--mx, 50%) var(--my, 50%), rgba(255,229,154,.2), transparent 70%); opacity: 0; transition: opacity .3s }
.gt:hover .gt-glow { opacity: 1 }
.gt-who > div:last-child { min-width: 0; overflow: hidden }
.gt-who { display: flex; align-items: center; gap: 16px; position: relative; z-index: 1; min-width: 0 }
.gt-kick { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font: 700 10.5px 'Barlow Semi Condensed', sans-serif; letter-spacing: .09em; text-transform: uppercase; color: var(--g2) }
.gt-nm { font: 800 25px/1.05 'Barlow Semi Condensed', sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.gt-nm span, .gt-gold { background: linear-gradient(100deg, var(--g3), var(--g1) 45%, #fff 50%, var(--g1) 55%, var(--g3)); background-size: 250% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: gt-sheen 3.6s ease-in-out infinite }
.gt-sub { color: #b9c3d6; font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.gt-role { display: inline-flex; align-items: center; gap: 5px; margin-top: 4px; font: 800 9.5px 'Barlow Semi Condensed', sans-serif; letter-spacing: .14em; padding: 2px 9px 2px 6px; border-radius: 20px; color: #3a2606; background: linear-gradient(180deg, var(--g1), var(--g2)); box-shadow: 0 3px 10px rgba(246,196,83,.45); white-space: nowrap }
/* emblèmes */
.gt-emb { position: relative; width: 86px; height: 86px; flex: none; display: grid; place-items: center }
.gt-rays { position: absolute; inset: -18px; border-radius: 50%; background: repeating-conic-gradient(rgba(255,229,154,.32) 0 6deg, transparent 6deg 18deg); -webkit-mask: radial-gradient(circle, #000 30%, transparent 70%); mask: radial-gradient(circle, #000 30%, transparent 70%); animation: gt-spin 14s linear infinite }
.gt-ring { position: absolute; inset: 4px; border-radius: 50%; background: conic-gradient(var(--g1), var(--g3), var(--g2), var(--g1)); animation: gt-spin 7s linear infinite; box-shadow: 0 0 26px rgba(246,196,83,.6) }
.gt-core { position: absolute; inset: 22px; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 35% 30%, #23314f, #0b1220 70%) }
.gt-core-m { inset: 9px }
.gt-core svg { width: 38px; height: 38px; filter: drop-shadow(0 0 6px rgba(246,196,83,.7)) }
.gt-cog .gt-core svg { width: 28px; height: 28px }
.gt-top { position: absolute; left: 50%; top: -14px; transform: translateX(-50%); width: 30px; animation: gt-bob 2.4s ease-in-out infinite; filter: drop-shadow(0 3px 6px rgba(246,196,83,.7)); z-index: 2 }
@keyframes gt-bob { 50% { transform: translateX(-50%) translateY(-4px) rotate(-5deg) } }
.gt-ini { position: absolute; right: -4px; bottom: -2px; z-index: 2; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font: 800 11px 'Barlow Semi Condensed', sans-serif; color: #3a2606; background: linear-gradient(180deg, var(--g1), var(--g2)); border: 2px solid #0b1220 }
.gt-cogwheel { position: absolute; inset: 0; width: 100%; height: 100%; animation: gt-spin 9s linear infinite; color: var(--g2); filter: drop-shadow(0 0 8px rgba(246,196,83,.6)) }
.gt-shield { position: absolute; inset: 2px 8px 0; width: calc(100% - 16px); height: calc(100% - 2px); filter: drop-shadow(0 4px 14px rgba(246,196,83,.55)) }
.gt-picto { position: absolute; inset: 0; display: grid; place-items: center; padding-bottom: 12px }
.gt-picto svg { width: 36px; height: 36px; filter: drop-shadow(0 0 6px rgba(246,196,83,.6)); animation: gt-tip 3.2s ease-in-out infinite; transform-origin: 50% 80% }
@keyframes gt-tip { 0%, 70%, 100% { transform: none } 80% { transform: rotate(-12deg) translateY(-2px) } 90% { transform: rotate(4deg) } }
.gt-stars { position: absolute; left: 50%; bottom: 8px; transform: translateX(-50%); display: flex; gap: 3px; z-index: 2 }
.gt-stars i { width: 9px; height: 9px; background: var(--g1); clip-path: polygon(50% 0, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%); animation: gt-tw 1.8s ease-in-out infinite; animation-delay: calc(var(--i) * .22s) }
@keyframes gt-tw { 50% { transform: scale(.55); opacity: .5 } }
/* chiffres */
.gt-mid { position: relative; z-index: 1; display: grid; gap: 8px; min-width: 0 }
.gt-kpis { display: flex; gap: 7px; min-width: 0; overflow: hidden }
.gt-k { padding: 5px 10px; border-radius: 10px; background: rgba(255,255,255,.05); border: 1px solid rgba(246,196,83,.22); min-width: 86px; animation: gt-kin .6s cubic-bezier(.2,.8,.2,1) both; animation-delay: calc(var(--i) * 90ms) }
@keyframes gt-kin { from { opacity: 0; transform: translateY(12px) scale(.96) } }
.gt-k small { display: block; font-size: 10px; color: #93a0b8; text-transform: uppercase; letter-spacing: .06em; white-space: nowrap }
.gt-k b { font: 800 18px/1.15 'Barlow Semi Condensed', sans-serif; font-variant-numeric: tabular-nums; white-space: nowrap; color: #fff }
.gt-k.gt-hi { border-color: var(--g2); box-shadow: 0 0 18px -6px var(--g2), inset 0 0 12px -8px var(--g2) } .gt-k.gt-hi b { color: var(--g1) }
.gt-prime { display: flex; align-items: center; gap: 10px; flex-wrap: nowrap; min-width: 0 }
.gt-pb { display: inline-flex; align-items: center; gap: 8px; padding: 4px 12px 4px 6px; border-radius: 30px; border: 1px solid rgba(246,196,83,.55); background: linear-gradient(90deg, rgba(246,196,83,.18), rgba(246,196,83,.04)); animation: gt-pulse 2.4s ease-in-out infinite; white-space: nowrap }
@keyframes gt-pulse { 50% { box-shadow: 0 0 0 4px rgba(246,196,83,.1), 0 0 22px rgba(246,196,83,.4) } }
.gt-coin { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font: 800 11px 'Barlow Semi Condensed', sans-serif; color: #3a2606; background: radial-gradient(circle at 35% 30%, #fff3c4, var(--g2) 60%, var(--g3)); animation: gt-flip 2.6s ease-in-out infinite }
@keyframes gt-flip { 0%, 70%, 100% { transform: rotateY(0) } 85% { transform: rotateY(180deg) } }
.gt-pb small { color: #d8c79a; font-size: 11px } .gt-pb b { font: 800 16px 'Barlow Semi Condensed', sans-serif; font-variant-numeric: tabular-nums }
.gt-cd { font: 700 12px 'Barlow Semi Condensed', sans-serif; color: #b9c3d6; white-space: nowrap; font-variant-numeric: tabular-nums; overflow: hidden; text-overflow: ellipsis } .gt-cd b { color: #fff }
.gt-up { font: 700 12px Barlow, sans-serif; color: #7dffb5; white-space: nowrap } .gt-up.gt-down { color: #ffb3b7 }
/* classement */
.gt-rk { position: relative; z-index: 1; display: grid; gap: 5px; min-width: 0 }
.gt-rk h4 { margin: 0; font: 700 10.5px 'Barlow Semi Condensed', sans-serif; letter-spacing: .18em; color: #93a0b8; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.gt-r { display: grid; grid-template-columns: 16px minmax(0, 1fr) auto; gap: 0 8px; align-items: center; font-size: 12.5px; animation: gt-rin .7s cubic-bezier(.2,.8,.2,1) both; animation-delay: calc(.2s + var(--i) * 130ms) }
@keyframes gt-rin { from { opacity: 0; transform: translateX(18px) } }
.gt-r i { font: 800 13px 'Barlow Semi Condensed', sans-serif; font-style: normal; color: #7d8aa3 } .gt-r.gt-g i { color: var(--g2) }
.gt-r span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis } .gt-r span em { font-style: normal; color: #7d8aa3; font-size: 11px }
.gt-r b { font: 700 12.5px 'Barlow Semi Condensed', sans-serif; white-space: nowrap; color: #fff }
.gt-t { grid-column: 2 / 4; height: 4px; border-radius: 2px; background: rgba(255,255,255,.07); overflow: hidden }
.gt-t u { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #8f0b12, #ff2a35); animation: gt-grow 1.6s cubic-bezier(.2,.8,.2,1) forwards; animation-delay: calc(.4s + var(--i) * 130ms) }
.gt-r.gt-g .gt-t u { background: linear-gradient(90deg, var(--g3), var(--g1)); box-shadow: 0 0 8px rgba(246,196,83,.7) }
@keyframes gt-grow { to { width: var(--w) } }
.gt-r.gt-me { background: rgba(62,139,255,.12); border-radius: 6px; padding: 1px 4px; margin: 0 -4px }
.gt-empty { font-size: 12px; color: #7d8aa3 }
/* carrousel */
.gt-car { position: relative }
.gt-slide { position: absolute; inset: 0; opacity: 0; transform: rotateX(-14deg) translateY(16px); transform-origin: 50% 0; transition: opacity .7s, transform .7s cubic-bezier(.2,.8,.2,1); pointer-events: none }
.gt-slide.gt-on { position: relative; opacity: 1; transform: none; pointer-events: auto }
.gt-dots { display: flex; gap: 6px; justify-content: center; margin-top: 8px }
.gt-dots button { border: 0; cursor: pointer; height: 6px; width: 22px; border-radius: 3px; background: #c9d1dc; padding: 0; position: relative; overflow: hidden; transition: width .3s }
html[data-theme="dark"] .gt-dots button { background: #26324a }
.gt-dots button.gt-on { width: 46px }
.gt-dots button.gt-on::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, var(--g3), var(--g1)); transform-origin: 0 50%; animation: gt-prog var(--gt-int, 8s) linear forwards }
@keyframes gt-prog { from { transform: scaleX(0) } }
.gt-paused .gt-dots button.gt-on::after { animation-play-state: paused }
@media (max-width: 1180px) { .gt-in { grid-template-columns: 290px minmax(0, 1fr) 220px; gap: 14px } }
@media (max-width: 1000px) { .gt { height: auto } .gt-in { grid-template-columns: 1fr; padding: 16px; gap: 12px } .gt-kpis { flex-wrap: wrap } .gt-prime { flex-wrap: wrap } }
@media (max-width: 700px) { .gt-host { padding: 12px 12px 0 } }
@media (prefers-reduced-motion: reduce) { .gt *, .gt::before, .gt-in::after, .gt-dots button::after { animation: none !important; transition: none !important } .gt-t u { width: var(--w) } }
@media print { .gt-host { display: none } }
/* réglages */
.gt-set-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px }
.gt-roles { display: flex; flex-wrap: wrap; gap: 6px 14px }
.gt-box { padding: 12px; border-radius: 10px; border: 1px solid var(--line, #e4e8ef); display: grid; gap: 10px }
.gt-files { display: grid; gap: 6px }
.gt-file { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(160px, 1fr); gap: 10px; align-items: center; font-size: 12.5px; padding: 6px 8px; border-radius: 8px; background: var(--bg-soft, #f6f8fb) }
html[data-theme="dark"] .gt-file { background: #111a2b }
@media (max-width: 800px) { .gt-file { grid-template-columns: 1fr } }