/* «سباق الكلمات» — حلبة السباق (٢٠٢٦/١٠/١٦ بطلب المالك: «يبيله تصميم»).
   إشارة انطلاق ٣ لمبات، الكلمة على بوّابة نهاية بمربّعات، ومنصّة للثلاثة الأوائل. شكل فقط. */
.xg-wr .xg{--gold:#ffc94a;--silver:#dfe7f2;--bronze:#e39a5a;position:relative;overflow:hidden;
  background:radial-gradient(80% 60% at 50% 20%,#1b3a5c 0%,#0d1c33 55%,#060d1a 100%)}
/* مضمار: خطوط حارات ثابتة تحت */
.xg-wr .xg::before{content:'';position:absolute;left:-10%;right:-10%;bottom:-6%;height:46%;pointer-events:none;
  transform:perspective(50cqh) rotateX(55deg);transform-origin:50% 100%;
  background:repeating-linear-gradient(90deg,transparent 0 11.6%,rgba(255,255,255,.35) 11.6% 12%),linear-gradient(0deg,#b8342a,#8a2219)}
.xg-wr .xg > *{position:relative;z-index:1}
.xg-wr .xg-title b{font-size:max(28px,7cqh);color:#fff;text-shadow:0 .1em 0 #0b2a4a,0 0 .5em rgba(255,201,74,.35)}
.xg-wr .xg-title small{color:#ffe6a6;font-weight:900;font-size:max(14px,2.4cqh)}
.xg-wr .xg-clock{background:conic-gradient(var(--gold) calc(var(--p) * 360deg),rgba(255,255,255,.1) 0)}
.wr-main{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.6cqh}

/* إشارة الانطلاق */
.wr-start{display:flex;flex-direction:column;align-items:center;gap:2.4cqh}
.wr-lights{display:flex;gap:3cqh;padding:2.4cqh 3.4cqh;border-radius:4cqh;background:linear-gradient(180deg,#1b1f29,#0b0d12);
  box-shadow:0 0 0 .6cqh #2c3240,0 2cqh 5cqh rgba(0,0,0,.6)}
.wr-lights i{width:15cqh;height:15cqh;border-radius:50%;background:#2a1414;box-shadow:inset 0 -1cqh 2cqh rgba(0,0,0,.6);transition:background .15s,box-shadow .15s}
.wr-lights i.red{background:radial-gradient(circle at 40% 35%,#ffb3b3,#ff2d2d 45%,#9e0d0d);box-shadow:0 0 5cqh rgba(255,45,45,.85)}
.wr-lights i.green{background:radial-gradient(circle at 40% 35%,#c8ffd6,#2ee66b 45%,#0b8a37);box-shadow:0 0 6cqh rgba(46,230,107,.9)}
.wr-go{font-size:max(36px,11cqh);font-weight:900;line-height:1;color:#fff;text-shadow:0 .08em 0 #0b2a4a}
.wr-go.on{color:#5dff8f;animation:xgPop .4s}
.wr-start small{font-size:max(15px,2.8cqh);font-weight:900;color:#ffe6a6}

/* بوّابة النهاية بالكلمة */
.wr-gate{display:flex;align-items:stretch;border-radius:2.6cqh;overflow:hidden;background:#fff;
  box-shadow:0 0 0 .8cqh rgba(255,255,255,.18),0 3cqh 6cqh rgba(0,0,0,.55);animation:xgPop .45s}
.wr-chk{width:7cqh;background:repeating-conic-gradient(#111 0 25%,#fff 0 50%) 0 0/3.5cqh 3.5cqh}
.wr-word{padding:1.4cqh 5cqw;font-size:clamp(44px,16cqh,170px);line-height:1.15;font-weight:900;color:#0d1c33;letter-spacing:.02em}

/* المنصّة: الثاني · الأوّل · الثالث */
.wr-pod{display:grid;grid-template-columns:repeat(3,minmax(0,24cqw));align-items:end;gap:1.6cqw}
.wr-pl{display:flex;flex-direction:column;align-items:center;gap:1cqh;min-width:0}
.wr-who{display:flex;flex-direction:column;align-items:center;gap:.5cqh;min-width:0;max-width:100%;opacity:.5;transition:opacity .3s,transform .4s}
.wr-pl.in .wr-who{opacity:1;animation:wrUp .5s cubic-bezier(.3,1.5,.5,1)}
.wr-who .av{width:max(44px,9cqh)!important;height:max(44px,9cqh)!important}
.wr-q{display:grid;place-items:center;width:max(44px,9cqh);height:max(44px,9cqh);border-radius:50%;border:3px dashed rgba(255,255,255,.35);font-size:max(20px,4cqh);font-weight:900;color:rgba(255,255,255,.5)}
.wr-who b{font-size:max(16px,3.2cqh);font-weight:900;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wr-who i{font-style:normal;font-size:max(13px,2.3cqh);font-weight:900;color:#bfe3ff;direction:rtl}
.wr-blk{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3cqh;border-radius:1.6cqh 1.6cqh 0 0;color:#1a1200}
.wr-blk em{font-style:normal;font-size:max(26px,6cqh);font-weight:900;line-height:1}
.wr-blk u{text-decoration:none;font-size:max(14px,2.6cqh);font-weight:900;direction:ltr}
.s1 .wr-blk{height:17cqh;background:linear-gradient(180deg,#fff1b8,var(--gold))}
.s2 .wr-blk{height:13.5cqh;background:linear-gradient(180deg,#fff,var(--silver))}
.s3 .wr-blk{height:11.5cqh;background:linear-gradient(180deg,#ffd9b8,var(--bronze))}
.wr-pl:not(.in) .wr-blk{filter:saturate(.35) brightness(.7)}

.wr-rest{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.8cqh 1cqw;max-width:90%;min-height:5cqh}
.wr-rest > span{font-size:max(14px,2.5cqh);font-weight:900;color:#ffe6a6}
.wr-rest em{display:flex;align-items:center;gap:.4em;font-style:normal;padding:.3em .8em .3em .4em;border-radius:999px;background:rgba(255,255,255,.1)}
.wr-rest em b{font-size:max(13px,2.3cqh);font-weight:900}
.wr-wait{font-size:max(16px,3cqh)!important;color:#fff!important;opacity:.85}
@keyframes wrUp{0%{transform:translateY(4cqh);opacity:0}100%{transform:none;opacity:1}}

@container (max-aspect-ratio: 1/1){
  .wr-pod{grid-template-columns:repeat(3,minmax(0,30cqw))}
  .wr-lights i{width:11cqh;height:11cqh}
}
