/* *
 * ID-GUESS CSS — Master Blueprint (V2.3)
 * [PROPORTIONAL DESIGN] */
.id-guess { --idg-transition: cubic-bezier(0.34, 1.56, 0.64, 1); --idg-order-color: var(--order-color, #6c63ff); --idg-card-bg: #000; --idg-card-radius: 12px; --idg-card-border: 1px solid rgba(255, 255, 255, 0.1); --idg-card-shadow: 0 10px 30px rgba(0, 0, 0, 0.5); --idg-player-info-gap: 0; --idg-player-info-top: 5cqi; --idg-player-info-right: 5.1cqi; --idg-player-name-font: 7.2cqi; --idg-title-row-gap: 1.4cqi; --idg-title-row-margin-top: 1.5cqi; --idg-title-row-badge-offset: -0.68cqi; --idg-title-row-no-badge-margin-top: 1.4cqi; --idg-title-font: 3.2cqi; --idg-title-height: 5.2cqi; --idg-title-padding-x: 2.7cqi; --idg-title-border: 0.35cqi; --idg-title-border-color: rgba(255, 255, 255, 0.4); --idg-title-bg: rgba(0, 0, 0, 0.9); --idg-title-radius: 0.6cqi; --idg-title-letter-spacing: 0; --idg-rank-size: 24.8cqi; --idg-rank-bottom: 1.5cqi; --idg-rank-right: 4.2cqi; --idg-favorite-size: 6.8cqi; --idg-premium-top: 15px; --idg-premium-left: 15px; position: relative; background: var(--idg-card-bg); border-radius: var(--idg-card-radius); overflow: hidden; box-shadow: var(--idg-card-shadow); border: var(--idg-card-border); /* CONTAINER:SELF-REF */ container-type: inline-size; container-name: idg; transform: translate3d(0, 0, 0); backface-visibility: hidden; will-change: transform, opacity; }
/* FORMATS DE BASE */
.id-guess--mini { width: 100%; max-width: 584px; aspect-ratio: 21 / 9; }
.id-guess--maxi { width: 100%; max-width: 400px; aspect-ratio: 1 / 1; }
.id-guess__container { position: relative; width: 100%; height: 100%; }
.id-guess__fused-image { width: 100%; height: 100%; object-fit: cover; display: block; transform: translate3d(0, 0, 0); backface-visibility: hidden; }
body.is-safari-browser .id-guess__fused-image, body.is-safari-browser .id-guess__aura-canvas, body.is-safari-browser .id-guess__layer img { image-rendering: -webkit-optimize-contrast !important; image-rendering: crisp-edges !important; }
/* LAYOUT LIVE */
.id-guess__live-layers { position: relative; width: 100%; height: 100%; }
.id-guess__layer { position: absolute; inset: 0; pointer-events: none; }
.id-guess__layer img, .id-guess__aura-canvas { width: 100%; height: 100%; object-fit: contain; }
/* ALIGNEMENTS LIVE MINI */
.id-guess--mini.id-guess--live .id-guess__aura-canvas { width: 140cqi; height: 140cqi; left: -40cqi; top: -46cqi; }
.id-guess--mini.id-guess--live .id-guess__layer--char img { height: 180%; width: auto; position: absolute; left: 38%; top: -5%; transform: translateX(-50%); }
/* OVERLAY:UI */
.id-guess__ui-overlay { position: absolute; inset: 0; z-index: 50; pointer-events: none; }
.id-guess__ui-shadow { position: absolute; inset: 0; background: linear-gradient(to right, transparent 47.48%, rgba(0, 0, 0, 0.1) 60.5%, rgba(0, 0, 0, 0.8)); }
.id-guess__player-info { position: absolute; top: var(--idg-player-info-top, 5cqi); right: var(--idg-player-info-right, 5.1cqi); display: flex; flex-direction: column; align-items: flex-end; gap: var(--idg-player-info-gap, 0); z-index: 60; transform: translate3d(0, 0, 0); backface-visibility: hidden; }
.id-guess__name { font-family: "Kanit", sans-serif; font-weight: 900; font-size: var(--idg-player-name-font, 7.2cqi); color: #fff; text-transform: uppercase; line-height: 0.85; text-shadow: 0 4px 15px rgba(0, 0, 0, 0.8); transform: translate3d(0, 0, 0); backface-visibility: hidden; }
.id-guess__title-row { display: inline-flex; align-items: center; justify-content: flex-end; gap: var(--idg-title-row-gap, 1.4cqi); margin-top: var(--idg-title-row-margin-top, 1.5cqi); transform: translate3d(0, 0, 0); backface-visibility: hidden; }
.id-guess__title-row--has-badge { transform: translateY(var(--idg-title-row-badge-offset, -0.68cqi)); }
.id-guess__title-row--no-badge { transform: none; margin-top: var(--idg-title-row-no-badge-margin-top, 1.4cqi); }
.id-guess__title { font-family: "Kanit", sans-serif; font-weight: 800; font-size: var(--idg-title-font, 3.2cqi); padding: 0 var(--idg-title-padding-x, 2.7cqi) 0 var(--idg-title-padding-x, 2.7cqi); height: var(--idg-title-height, 5.2cqi); display: inline-flex; align-items: center; justify-content: center; border: var(--idg-title-border, 0.35cqi) solid var(--idg-title-border-color, rgba(255, 255, 255, 0.4)); border-radius: var(--idg-title-radius, 0.6cqi); background: var(--idg-title-bg, rgba(0, 0, 0, 0.9)); text-transform: uppercase; color: var(--title-color, #fff); letter-spacing: var(--idg-title-letter-spacing, 0); line-height: 1; transform: translate3d(0, 0, 0); backface-visibility: hidden; }
.id-guess__rank-badge { position: absolute; bottom: var(--idg-rank-bottom, 1.5cqi); right: var(--idg-rank-right, 4.2cqi); display: flex; flex-direction: column; align-items: center; gap: 0.3cqi; }
.id-guess__rank-badge img { width: var(--idg-rank-size, 24.8cqi); height: var(--idg-rank-size, 24.8cqi); object-fit: contain; filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.8)); transform: translate3d(0, 0, 0); backface-visibility: hidden; }
.id-guess__rank-badge-status {display: inline-flex; align-items: center; justify-content: center; gap: 0.25cqi; white-space: nowrap; font-family: "Kanit", sans-serif; font-size: 0.8cqi; font-weight: 600; letter-spacing: 0.08em; line-height: 1.1; color: #d1d5db;  margin-top: -10px; }
.id-guess__rank-badge-text { color: #d1d5db; font-size: 8px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; }
.id-guess__rank-badge-pill { width: 6px; height: 6px; border-radius: 50%; background: #4ade80; animation: pulse-glow 2s infinite; display: inline-block; }
.id-guess__favorite-badge { width: var(--idg-favorite-size, 6.8cqi); height: var(--idg-favorite-size, 6.8cqi); display: inline-flex; align-items: center; justify-content: center; background: transparent; border: none; border-radius: 0; box-shadow: none; overflow: visible; transform: translate3d(0,0,0); backface-visibility: hidden; z-index: 61; flex-shrink: 0; }
.id-guess__favorite-badge img { width: var(--idg-favorite-size, 6.8cqi); height: var(--idg-favorite-size, 6.8cqi); object-fit: contain; filter: drop-shadow(0 0 5px rgba(0,0,0,0.45)); transform: translate3d(0, 0, 0); backface-visibility: hidden; }
.id-guess__premium-wrapper { position: absolute; top: var(--idg-premium-top, 15px); left: var(--idg-premium-left, 15px); display: flex; flex-direction: column; align-items: center; z-index: 50; }
.id-guess__premium-badge { background: #f59e0b; color: #000; font-family: "Kanit", sans-serif; font-weight: 900; font-size: 10px; /* FALLBACK:px */ font-size: 1.7cqi; padding: 2px 8px; /* FALLBACK:px */ padding: 0.3cqi 1.3cqi; border-radius: 4px; /* FALLBACK:px */ border-radius: 0.6cqi; letter-spacing: 1px; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5); z-index: 20; }
.id-guess__premium-pass-image { width: 40px; height: 40px; object-fit: contain; z-index: 21; margin-top: -10px; }
.id-guess.order-theme-ombres { background: #030305; border-color: rgba(255, 255, 255, 0.08); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.78), inset 0 0 32px rgba(0, 0, 0, 0.7); }
.id-guess.order-theme-ombres .id-guess__fused-image { filter: grayscale(1) brightness(0.78) contrast(1.22); -webkit-filter: grayscale(1) brightness(0.78) contrast(1.22); opacity: 0.92; }
.id-guess.order-theme-ombres .id-guess__layer--decor img, .id-guess.order-theme-ombres .id-guess__aura-canvas { filter: grayscale(1) brightness(0.38) contrast(1.45); -webkit-filter: grayscale(1) brightness(0.38) contrast(1.45); opacity: 0.48; }
.id-guess.order-theme-ombres .id-guess__layer--char img { filter: grayscale(1) brightness(0.34) contrast(1.65) drop-shadow(0 16px 22px rgba(0, 0, 0, 0.95)); -webkit-filter: grayscale(1) brightness(0.34) contrast(1.65) drop-shadow(0 16px 22px rgba(0, 0, 0, 0.95)); opacity: 0.88; }
.id-guess.order-theme-ombres .id-guess__ui-shadow { background: linear-gradient(to right, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.42) 50%, rgba(0, 0, 0, 0.92) 100%); }