/* ═══ مين المختلف؟ (odd.js) — «لوحة تحقيق فلّينيّة» (٢٠٢٦/١٠/١٨، المالك: «كلّ وحدة تصميمها مختلف»)
   فلّين بنّي + صور بولارويد مثبّتة بدبابيس + أوراق لاصقة صفرا للتلميحات + خيوط حمرا + عدسة مكبّرة.
   النسخة الأولى (غرفة بلمبة): scratchpad odd.pre-cork.css ═══ */
.od{position:relative;overflow:hidden;font-weight:800;color:#2a1a08;
  background:
    radial-gradient(circle at 20% 30%,rgba(0,0,0,.12) 0 .25cqh,transparent .35cqh) 0 0/2.2cqh 2.2cqh,
    radial-gradient(circle at 70% 60%,rgba(255,255,255,.08) 0 .2cqh,transparent .3cqh) 0 0/1.7cqh 1.7cqh,
    radial-gradient(ellipse at 50% 40%,#b57a45 0%,#8d5a30 55%,#5e3a1c 100%);
  box-shadow:inset 0 0 0 1.4cqh #4a2c14,inset 0 0 6cqh rgba(0,0,0,.55)}
/* الخيوط الحمرا عبر اللوحة */
.od-string{position:absolute;height:.5cqh;background:linear-gradient(90deg,#b1121f,#e0303f,#b1121f);box-shadow:0 .3cqh .4cqh rgba(0,0,0,.35);pointer-events:none;z-index:1;transform-origin:0 50%}
.od-string.s1{top:30%;left:6%;width:60%;transform:rotate(9deg)}
.od-string.s2{top:62%;left:38%;width:55%;transform:rotate(-12deg)}
.od-pin{position:absolute;top:-1.2cqh;left:50%;width:2.6cqh;height:2.6cqh;border-radius:50%;transform:translateX(-50%);z-index:3;
  background:radial-gradient(circle at 35% 30%,#ff8a8a,#d0102a 55%,#7a0010);box-shadow:0 .5cqh .6cqh rgba(0,0,0,.5)}

/* الرأس: قصاصة ورق مثبّتة */
.od .xg-head{position:relative;z-index:4}
.od .xg-title{background:#f5ead2;padding:1cqh 3cqw;border-radius:.4cqh;transform:rotate(-1deg);box-shadow:0 1cqh 2cqh rgba(0,0,0,.35)}
.od .xg-title b{color:#7a1020;text-shadow:none;font-weight:900}
.od .xg-title small{color:#4a3418}
.od .xg-title small b{color:#b1121f;font-size:inherit;display:inline;text-shadow:none}
.od .xg-chip{background:#f9e27a;color:#3a2a00;border:0;border-radius:.3cqh;transform:rotate(3deg);box-shadow:0 .8cqh 1.6cqh rgba(0,0,0,.35)}
.od .xg-chip b{color:#3a2a00}
.od .xg-clock{filter:drop-shadow(0 .8cqh 1cqh rgba(0,0,0,.4))}

.od-stage{position:relative;z-index:2;flex:1 1 auto;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.od-host{position:relative;z-index:4;display:flex;gap:1cqw;justify-content:center;min-height:5cqh}
.od-host button{font:inherit;font-weight:900;font-size:max(14px,2.2cqh);padding:.8cqh 2cqw;border-radius:.4cqh;border:0;background:#f5ead2;color:#7a1020;cursor:pointer;box-shadow:0 .6cqh 1.2cqh rgba(0,0,0,.35);transform:rotate(-1deg)}
.od-host button:hover{background:#fff6e2}

/* الدخول: QR بولارويد + بطاقة فهرس */
.od-lobby{display:flex;align-items:center;gap:5cqw}
.od-qr{position:relative;display:flex;flex-direction:column;align-items:center;gap:1.4cqh;padding:2cqh 2cqh 3.6cqh;background:#fdfaf2;transform:rotate(-3deg);box-shadow:0 2cqh 4cqh rgba(0,0,0,.45)}
.od-qrc{width:min(34cqh,30cqw)!important;height:auto!important;image-rendering:pixelated}
.od-qr span{color:#3a2a10;font-size:max(13px,2cqh);direction:ltr}
.od-steps{position:relative;padding:3cqh 3cqw 2.4cqh;background:repeating-linear-gradient(180deg,#fffdf6 0 4.4cqh,#c9d8ef 4.4cqh 4.6cqh);border-top:1.2cqh solid #e8645f;transform:rotate(2deg);box-shadow:0 2cqh 4cqh rgba(0,0,0,.4);min-width:38cqw}
.od-steps h3{margin:0 0 1.4cqh;font-size:max(18px,3.4cqh);color:#7a1020}
.od-steps ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1.2cqh}
.od-steps li{display:flex;align-items:center;gap:1cqw;font-size:max(16px,2.9cqh);color:#2a1a08}
.od-steps em{font-style:normal;display:grid;place-items:center;width:4.6cqh;height:4.6cqh;border-radius:50%;border:.4cqh solid #b1121f;color:#b1121f;font-weight:900}
.od-count{margin-top:2cqh;display:flex;align-items:baseline;gap:1cqw}
.od-count b{font-size:8cqh;color:#b1121f;line-height:1}
.od-count small{font-size:max(14px,2.4cqh);color:#4a3418}
.od-faces{display:flex;flex-wrap:wrap;gap:.6cqw;max-width:40cqw;margin-top:1cqh}
.od-f{display:inline-flex;align-items:center;gap:.4cqw;padding:.3cqh .8cqw .3cqh .3cqw;border-radius:.3cqh;background:#f9e27a;color:#2a1a08;font-size:max(12px,1.8cqh);box-shadow:0 .3cqh .6cqh rgba(0,0,0,.25)}

/* التوزيع: ملفّات تنرمى على اللوحة */
.od-deal{text-align:center}
.od-cards{display:flex;justify-content:center;gap:1.4cqw;margin-bottom:2.4cqh}
.od-cards i{font-style:normal;font-size:11cqh;display:inline-grid;place-items:center;width:16cqh;height:20cqh;background:#e3c58d;border-radius:.6cqh;box-shadow:0 1.4cqh 2cqh rgba(0,0,0,.4);
  animation:odDeal .6s calc(var(--i) * .12s) both cubic-bezier(.2,1.5,.4,1);transform:rotate(calc((var(--i) - 2) * 6deg))}
@keyframes odDeal{from{transform:translateY(-30cqh) rotate(-30deg);opacity:0}}
.od-deal p{display:inline-block;font-size:max(20px,4.2cqh);line-height:1.5;background:#f5ead2;padding:1.6cqh 3cqw;transform:rotate(-1deg);box-shadow:0 1.4cqh 2.4cqh rgba(0,0,0,.35)}
.od-deal b{color:#b1121f}
.od-deal small{font-size:.6em;color:#4a3418}

/* المقاعد: صور بولارويد مثبّتة + ورقة لاصقة للتلميح */
.od-seats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(30cqw,max(150px,22cqh)),1fr));gap:3.4cqh 2cqw;width:100%;max-width:94cqw;align-content:center;padding-top:1cqh}
.od-s{position:relative;display:flex;flex-direction:column;align-items:center;gap:.4cqh;padding:1.4cqh 1.2cqh 1cqh;background:#fdfaf2;
  transform:rotate(var(--r,0deg));box-shadow:0 1.4cqh 2.4cqh rgba(0,0,0,.42);transition:opacity .3s,transform .3s,filter .3s}
.od-s>em{position:absolute;top:.8cqh;inset-inline-start:.8cqw;font-style:normal;font-size:max(14px,2.6cqh);font-weight:900;color:#b1121f;z-index:2}
.od-photo{position:relative;width:100%;display:grid;place-items:center;padding:1cqh 0;background:linear-gradient(180deg,#4b5d73,#2a3446)}
.od-s .av{width:max(44px,9cqh)!important;height:max(44px,9cqh)!important;font-size:max(22px,4.4cqh)!important}
.od-s>b{color:#2a1a08;font-size:max(14px,2.4cqh);max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.od-hint{position:relative;min-width:80%;text-align:center;padding:.8cqh 1cqw;background:#f9e27a;color:#2a1a08;font-size:max(16px,3cqh);font-weight:900;
  transform:rotate(calc(var(--r,0deg) * -1.6));box-shadow:0 .6cqh 1cqh rgba(0,0,0,.3);margin-top:.4cqh}
.od-hint i{font-style:normal;font-size:.7em;opacity:.6}
.od-hint:not(.on){background:#efe4c4;color:#9a8a68}
.od-hint.on{animation:odStick .4s cubic-bezier(.2,1.6,.4,1)}
@keyframes odStick{from{transform:scale(1.6) rotate(12deg);opacity:0}}
.od-old{color:#6a5634;font-size:max(11px,1.7cqh)}
.od-tag{font-size:max(12px,2cqh);color:#4a3418}
.od-s.dead{filter:grayscale(.85) brightness(.82)}
.od-s.dead .od-photo::after{content:"✖";position:absolute;font-size:9cqh;color:rgba(177,18,31,.85);font-weight:900}
.od-s.is-odd{box-shadow:0 0 0 .6cqh #b1121f,0 1.4cqh 2.4cqh rgba(0,0,0,.42)}
.od-seats.end .od-s.is-odd{filter:none;transform:rotate(var(--r,0deg)) scale(1.08)}
.od-seats.end .od-s.is-odd .od-photo::after{content:"";position:absolute;inset:-1cqh -1.4cqw;border:.6cqh solid #e0101f;border-radius:50%;transform:rotate(-8deg)}
.od-s.lead{box-shadow:0 0 0 .5cqh #ff8a3c,0 1.4cqh 2.4cqh rgba(0,0,0,.42)}
.od-v{position:absolute;top:-1.2cqh;inset-inline-end:-.6cqw;display:flex;align-items:center;gap:.3cqw;padding:.3cqh .8cqw;border-radius:99px;background:#b1121f;color:#fff;font-size:max(13px,2.2cqh);font-weight:900;z-index:4;box-shadow:0 .4cqh .8cqh rgba(0,0,0,.35)}
.od-v i{display:flex}
.od-v i .av{width:max(16px,2.4cqh)!important;height:max(16px,2.4cqh)!important;font-size:max(8px,1.2cqh)!important;margin-inline-start:-.4cqw}
.od-seats.dim .od-s:not(.accused){opacity:.3}
.od-s.accused{transform:rotate(0) scale(1.15);z-index:3;box-shadow:0 0 0 .6cqh #ff8a3c,0 3cqh 5cqh rgba(0,0,0,.5)}

/* الكشف: صورة المتّهم + عدسة تمرّ + دائرة حمرا أو شطب */
.od-news{display:flex;align-items:center;gap:5cqw}
.od-news:not(.reveal){flex-direction:column;gap:1cqh;background:#f5ead2;padding:3cqh 5cqw;transform:rotate(-1deg);box-shadow:0 2cqh 4cqh rgba(0,0,0,.4)}
.od-big{font-size:12cqh}
.od-news h2{font-size:max(22px,5cqh);margin:0;color:#7a1020}
.od-news p{font-size:max(16px,3cqh);color:#4a3418;margin:0}
.od-ko{position:relative;display:flex;flex-direction:column;align-items:center;gap:.8cqh;padding:2cqh 2cqh 1.4cqh;background:#fdfaf2;transform:rotate(-3deg);box-shadow:0 2.4cqh 4cqh rgba(0,0,0,.5)}
.od-ko .od-photo{padding:2cqh 4cqh}
.od-ko .av{width:max(90px,22cqh)!important;height:max(90px,22cqh)!important;font-size:max(44px,11cqh)!important}
.od-ko>b{font-size:max(20px,4cqh);color:#2a1a08}
.od-lens{position:absolute;font-style:normal;font-size:14cqh;top:10%;left:-20%;filter:drop-shadow(0 1cqh 1cqh rgba(0,0,0,.5));animation:odLens 1.4s ease-in-out forwards;z-index:5}
@keyframes odLens{0%{transform:translate(0,0) rotate(-10deg)}50%{transform:translate(60%,30%) rotate(8deg)}100%{transform:translate(120%,-10%) rotate(-6deg);opacity:0}}
.od-mark{position:absolute;inset:6% 4% 18%;pointer-events:none;z-index:4;opacity:0;animation:odMark .5s 1.3s forwards}
.od-news.hit .od-mark{border:1cqh solid #e0101f;border-radius:50%}
.od-news.miss .od-mark{background:linear-gradient(45deg,transparent 46%,#e0101f 46% 54%,transparent 54%),linear-gradient(-45deg,transparent 46%,#e0101f 46% 54%,transparent 54%)}
@keyframes odMark{from{opacity:0;transform:scale(1.4) rotate(-10deg)}to{opacity:1;transform:rotate(-6deg)}}
.od-note{display:flex;flex-direction:column;gap:1cqh;padding:3cqh 3cqw;background:#f9e27a;transform:rotate(3deg);box-shadow:0 2cqh 3cqh rgba(0,0,0,.4);opacity:0;animation:odNote .5s 1.6s forwards cubic-bezier(.2,1.5,.4,1)}
.od-note small{font-size:max(14px,2.4cqh);color:#4a3418}
.od-note b{font-size:max(24px,5.4cqh);color:#2a1a08}
.od-note span{font-size:max(22px,4.6cqh);font-weight:900;color:#b1121f}
.od-news.hit .od-note span{color:#1e7a34}
@keyframes odNote{from{opacity:0;transform:translateY(6cqh) rotate(12deg)}to{opacity:1;transform:rotate(3deg)}}

/* بطاقة الانتقال: ورقة تنلصق بالدبّوس */
.od-fx{position:absolute;inset:0;pointer-events:none;z-index:9;display:grid;place-items:center}
.od-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:1cqh;padding:4cqh 6cqw 3cqh;background:#f5ead2;color:#2a1a08;
  transform:rotate(-2deg);box-shadow:0 3cqh 6cqh rgba(0,0,0,.55);animation:odCard .45s cubic-bezier(.2,1.5,.4,1)}
.od-card::before{content:"";position:absolute;top:-1.2cqh;left:50%;width:3cqh;height:3cqh;border-radius:50%;transform:translateX(-50%);background:radial-gradient(circle at 35% 30%,#ff8a8a,#d0102a 55%,#7a0010)}
.od-card i{font-style:normal;font-size:10cqh}
.od-card b{font-size:max(26px,6cqh);color:#7a1020}
.od-card small{font-size:max(15px,2.6cqh);color:#4a3418}
.od-card.out{animation:odOut .4s forwards}
@keyframes odCard{from{transform:scale(.4) rotate(-20deg);opacity:0}}
@keyframes odOut{to{transform:translateY(-8cqh) rotate(6deg);opacity:0}}

/* النهاية: الكلمتين على ورقتين */
.od-words{display:flex;gap:3cqw;justify-content:center;margin-bottom:3cqh}
.od-words span{padding:1.4cqh 3cqw;font-size:max(20px,4.4cqh);font-weight:900;box-shadow:0 1.4cqh 2cqh rgba(0,0,0,.35)}
.od-words .g{background:#fdfaf2;color:#2a1a08;transform:rotate(-2deg)}
.od-words .o{background:#b1121f;color:#fff;transform:rotate(2deg)}
.od.win-g .xg-title{background:#e6f5d8}
.od.win-o .xg-title{background:#f8d6d6}

.od-mine{position:fixed;left:16px;top:42%;z-index:60;padding:10px 18px;border-radius:6px;background:#f9e27a;color:#2a1a08;font:900 16px Tajawal,system-ui,sans-serif;text-decoration:none;box-shadow:0 6px 20px rgba(0,0,0,.4)}
.od-err{display:grid;place-items:center;height:100%;text-align:center}

@container (max-aspect-ratio:1/1){
  .od-lobby,.od-news{flex-direction:column;gap:3cqh}
  .od-qrc{width:min(28cqh,56cqw)!important}
  .od-seats{grid-template-columns:repeat(auto-fit,minmax(36cqw,1fr))}
  .od-string{display:none}
}