/* ═══ تتبّع الورق — «سجّادة السدو» (البادئة ts-) — لوحة ١٩٢٠×١٠٨٠ (W5K) ═══
   هويّتها: سدو بدوي — أحمر عنّابي وكريمي وبرتقالي وأسود، الورق منسوج والزوج يبقى بصورة صاحبه. */
.ts-cv{background:#2a2118}
.ts-floor{position:absolute;inset:0;background:radial-gradient(ellipse 1300px 760px at 40% 50%,rgba(255,220,160,.2),transparent 70%),repeating-linear-gradient(0deg,#3a2d20 0 3px,#2f2419 3px 90px)}
.ts-rug{left:50px;top:40px;width:1330px;height:1000px;border-radius:10px;padding:96px 40px;
 background:repeating-linear-gradient(90deg,rgba(0,0,0,.1) 0 2px,transparent 2px 6px),#9c1f24;box-shadow:0 26px 60px rgba(0,0,0,.6)}
.ts-fr{position:absolute;left:0;right:0;height:84px;background:
  conic-gradient(from -45deg at 50% 100%,#f4ead6 90deg,transparent 0) 0 16px/56px 26px repeat-x,
  conic-gradient(from 135deg at 50% 0,#c8323a 90deg,transparent 0) 28px 42px/56px 26px repeat-x,
  linear-gradient(#14110f 0 6px,#e08a1e 6px 14px,#14110f 14px 70px,#e08a1e 70px 78px,#14110f 78px)}
.ts-fr.t{top:0}.ts-fr.b{bottom:0}
.ts-grid{display:grid;grid-template-columns:repeat(var(--cols,5),1fr);grid-template-rows:repeat(var(--rows,4),1fr);gap:16px;height:100%}
.ts-c{position:relative;container-type:size;border-radius:16px;display:grid;place-items:center;
 background:conic-gradient(from 135deg at 50% 50%,#9c1f24 90deg,transparent 0) 50% 50%/40cqmin 40cqmin no-repeat,
  repeating-linear-gradient(45deg,transparent 0 12px,rgba(20,17,15,.14) 12px 14px),#f4ead6;
 border:6px solid #14110f;box-shadow:0 8px 0 rgba(0,0,0,.35)}
.ts-c>b{font-size:42cqmin;line-height:1;color:#14110f;background:#f4ead6;border-radius:50%;width:62cqmin;height:62cqmin;display:grid;place-items:center;border:5px solid #14110f}
.ts-c.flip{animation:tsFlip .32s ease}
@keyframes tsFlip{0%{transform:scaleX(1)}50%{transform:scaleX(.05)}100%{transform:scaleX(1)}}
.ts-c.open{background:#fff;border-color:#e08a1e;box-shadow:0 0 0 6px rgba(224,138,30,.5),0 8px 0 rgba(0,0,0,.35)}
.ts-f{display:grid;place-items:center;width:64cqmin;height:64cqmin}
.ts-f svg{width:100%;height:100%}
.ts-c.open>b{position:absolute;right:6px;top:6px;width:28cqmin;height:28cqmin;font-size:19cqmin;border-width:3px}
.ts-c.sel{box-shadow:0 0 0 8px #ffd24a,0 0 40px #ffd24a,0 8px 0 rgba(0,0,0,.35);animation:w5pulse 1.2s infinite}
.ts-c.done{background:rgba(0,0,0,.28);border:4px dashed rgba(244,234,214,.5);box-shadow:none;display:flex;align-items:center;justify-content:center;gap:6cqmin}
.ts-c.done .w5a{--avs:48cqmin}
.ts-c.done .ts-f{width:34cqmin;height:34cqmin;opacity:.9}
.ts-side{right:50px;top:40px;width:440px;height:1000px;border-radius:22px;background:linear-gradient(#4a3524,#33241a);border:5px solid #1c130c;padding:26px;display:flex;flex-direction:column;gap:12px}
.ts-side>small{font-size:28px;color:#e9c97a}
.ts-turn{height:108px;border:4px solid #e08a1e!important;--avs:80px}.ts-turn b{font-size:42px!important}
.ts-hint{display:block;margin-top:10px;font-size:26px;color:#f4ead6;text-align:center;padding:8px;border-radius:12px;background:rgba(0,0,0,.3)}
.ts-hint.two{background:#e08a1e;color:#14110f}
#tmMsg{font-size:23px;color:#f4ead6;line-height:1.5;min-height:70px}
#tmMsg b{color:#ffd27a}
.ts-side h4{font-size:30px;color:#e9c97a;margin-top:6px;display:flex;justify-content:space-between;align-items:center}
.ts-side h4 span{font-size:22px;color:#f4ead6}.ts-side h4 span b{font-size:30px;color:#fff}
.ts-score{display:flex;flex-direction:column;gap:8px;min-height:0;overflow:hidden}
.ts-score>div{display:flex;align-items:center;gap:12px;height:60px;padding:0 12px;border-radius:14px;background:rgba(0,0,0,.35);flex:none;--avs:46px}
.ts-score b{font-size:26px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ts-score i{font-size:40px;color:#e9c97a}
.ts-score .on{outline:3px solid #e08a1e}
.ts-score u{text-decoration:none;color:#c9b48c;font-size:20px;text-align:center}
.ts-clock{margin-top:auto;display:flex;align-items:baseline;justify-content:center;gap:10px;font-size:30px;color:#f4ead6}
.ts-clock i{font-size:64px;color:#fff}
.ts-clock.hot i{color:#ff6a4a;animation:w5blink .6s infinite}

/* الجوال الطولي: لوحة ١٠٨٠×١٩٢٠ — السجّادة فوق والجانب تحت، والصفوف والأعمدة تتبادل */
.ts-cv.port .ts-rug{left:40px;top:40px;width:1000px;height:1250px;padding:96px 34px}
.ts-cv.port .ts-grid{grid-template-columns:repeat(var(--rows,4),1fr);grid-template-rows:repeat(var(--cols,5),1fr)}
.ts-cv.port .ts-side{right:40px;top:1320px;width:1000px;height:560px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto 1fr auto;column-gap:24px}
.ts-cv.port .ts-side>small{grid-column:1;grid-row:1}
.ts-cv.port #tmTurn{grid-column:1;grid-row:2}
.ts-cv.port #tmMsg{grid-column:1;grid-row:3}
.ts-cv.port .ts-clock{grid-column:1;grid-row:4}
.ts-cv.port .ts-side h4{grid-column:2;grid-row:1}
.ts-cv.port .ts-score{grid-column:2;grid-row:2/5}
