/* شاشة الإعدادات قبل الانضمام — «البطاقة» (٢٠٢٦/١٠/٢٦، اختيار المالك من ٣ اتّجاهات بـ_concepts/gi3)
   يمين: بطاقة اللعبة المرسومة (game-cards.js) · يسار: فقاعة كلمة الانضمام + طول اللعبة + الدخول + المتقدّمة مطويّة + زرّ البدء.
   الأرقام Oswald، أيقونات خطّيّة، بلا إيموجي. اللون --acc من اللعبة. */
#stage .gi2{--g2-gold:#ffc94a;--g2-gold2:#ffe39a;--g2-line:rgba(255,255,255,.1);
  flex:1;min-height:0;display:flex;overflow:auto;padding:clamp(16px,3vh,40px) clamp(16px,3vw,56px);
  background:radial-gradient(60% 70% at 72% 40%,color-mix(in srgb,var(--acc) 22%,transparent),transparent 70%),#060818;color:#fff;font-family:Cairo,system-ui,sans-serif;font-weight:800}
.gi2 .g2-in{margin:auto;display:grid;grid-template-columns:minmax(0,640px) clamp(300px,30vw,540px);gap:clamp(24px,3.4vw,64px);align-items:center;width:100%;justify-content:center}
.gi2 .ic{width:1.15em;height:1.15em;flex:none}

/* البطاقة */
.gi2 .g2-card{grid-column:2;grid-row:1;border-radius:30px;overflow:hidden;background:#0d1130;transform:rotate(-2deg);
  box-shadow:0 0 0 2px color-mix(in srgb,var(--acc) 70%,transparent),0 40px 80px rgba(0,0,0,.6),0 0 100px color-mix(in srgb,var(--acc) 30%,transparent)}
.gi2 .g2-poster{position:relative;isolation:isolate;aspect-ratio:4/5;display:flex;flex-direction:column;justify-content:flex-end;gap:10px;padding:clamp(18px,3vh,32px);background:#07061f}
.gi2 .g2-art{position:absolute;inset:0;z-index:-2}
.gi2 .g2-art svg{width:100%;height:100%;display:block}
.gi2 .g2-poster::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(7,6,31,.96) 0%,rgba(7,6,31,.7) 22%,transparent 42%)}
.gi2 .g2-k{align-self:flex-start;padding:5px 14px;border-radius:99px;background:rgba(0,0,0,.4);box-shadow:inset 0 0 0 1px rgba(255,255,255,.25);font-size:clamp(13px,1.6vh,16px);font-weight:900}
.gi2 .g2-t{font-size:clamp(40px,6.6vh,84px);font-weight:900;line-height:1.02;color:var(--g2-gold);text-shadow:0 6px 30px rgba(0,0,0,.6)}
.gi2 .g2-st{display:flex;flex-wrap:wrap;gap:10px}
.gi2 .g2-st span{display:flex;flex-direction:column;align-items:center;min-width:74px;padding:8px 12px;border-radius:14px;background:rgba(0,0,0,.4);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.gi2 .g2-st b{font:700 clamp(20px,2.8vh,30px)/1 Oswald,Cairo,sans-serif;color:var(--g2-gold)}
.gi2 .g2-st small{font-size:12px;color:rgba(255,255,255,.7);white-space:nowrap;font-weight:800}
.gi2 .g2-desc{margin:0;padding:16px 22px 20px;color:rgba(255,255,255,.72);font-size:clamp(14px,1.8vh,18px);line-height:1.6;font-weight:800}

/* الجانب */
.gi2 .g2-side{grid-column:1;grid-row:1;display:flex;flex-direction:column;gap:clamp(12px,1.8vh,20px);background:none;border:0;box-shadow:none;padding:0;margin:0;max-width:none}
.gi2 .g2-bub{display:flex;align-items:center;gap:12px;padding:12px 18px;border-radius:20px 20px 6px 20px;background:#fff;color:#111;box-shadow:0 12px 30px rgba(0,0,0,.4)}
.gi2 .g2-bub .ic{width:38px;height:38px;padding:8px;border-radius:50%;flex:none;color:#fff;background:linear-gradient(135deg,#7bd3ff,#b27bff)}
.gi2 .g2-bub small{display:block;font-size:12.5px;color:#555;font-weight:800}
.gi2 .g2-bub b{display:block;font-size:clamp(24px,3.2vh,34px);font-weight:900;line-height:1.1}
.g2p .g2-h3{display:flex;align-items:center;justify-content:space-between;font-size:16px;color:var(--g2-gold);font-weight:900;margin:0 0 8px}
.g2p .g2-rst{border:0;background:none;color:rgba(255,255,255,.55);font:inherit;font-size:13px;cursor:pointer;display:flex;align-items:center;gap:6px}
.g2p .g2-rst:hover{color:#fff}
.g2p .g2-fl{display:flex;flex-direction:column;gap:8px}
.g2p .g2-f{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 14px;border-radius:14px;background:rgba(255,255,255,.045);box-shadow:inset 0 0 0 1px var(--g2-line)}
.g2p .g2-f > label{display:flex;align-items:center;gap:10px;font-size:clamp(14px,1.7vh,18px);font-weight:900;min-width:0}
.g2p .g2-f > label .ic{color:var(--acc);width:22px;height:22px}
.g2p .g2-f.warn{background:rgba(255,77,94,.08);box-shadow:inset 0 0 0 1px rgba(255,77,94,.45);flex-wrap:wrap}
.g2p .g2-f.warn em{flex-basis:100%;font-style:normal;font-size:12.5px;line-height:1.5;color:#ffb3bb;font-weight:800}
.g2p .g2-step{display:flex;align-items:center;gap:6px;background:rgba(0,0,0,.35);border-radius:12px;padding:4px}
.g2p .g2-step button{width:34px;height:34px;border:0;border-radius:9px;background:rgba(255,255,255,.08);color:#fff;font-size:20px;font-weight:900;cursor:pointer;line-height:1}
.g2p .g2-step button:hover{background:var(--acc)}
.g2p .g2-num{min-width:44px;text-align:center;font:700 clamp(18px,2.4vh,26px)/1 Oswald,Cairo,sans-serif}
.g2p .g2-step small{font-size:12px;color:rgba(255,255,255,.6)}
.g2p .g2-seg{display:flex;gap:4px;background:rgba(0,0,0,.35);border-radius:12px;padding:4px}
.g2p .g2-seg button{flex:1;border:0;background:none;padding:7px 14px;border-radius:9px;font:inherit;font-size:14px;font-weight:900;color:rgba(255,255,255,.62);cursor:pointer;white-space:nowrap}
.g2p .g2-seg button.on{background:var(--acc);color:#fff;box-shadow:0 4px 14px color-mix(in srgb,var(--acc) 50%,transparent)}
.g2p .g2-seg.big button{padding:12px;font-size:17px}
.g2p .g2-f input[type=text]{width:160px;padding:9px 14px;border-radius:12px;border:0;background:rgba(0,0,0,.35);color:#fff;font:inherit;box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--acc) 60%,transparent);font-size:18px;font-weight:900;text-align:center}
.g2p .g2-f select{padding:9px 12px;border-radius:12px;border:0;background:#141a40;color:#fff;font:inherit;font-weight:900}
.g2p .g2-f .gift-pick{background:rgba(0,0,0,.35)}
.g2p .g2-adv{border-radius:16px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px var(--g2-line)}
.g2p .g2-adv summary{display:flex;align-items:center;gap:10px;padding:12px 16px;cursor:pointer;font-size:16px;font-weight:900;list-style:none}
.g2p .g2-adv summary::-webkit-details-marker{display:none}
.g2p .g2-adv summary i{font-style:normal;font-size:12px;color:rgba(255,255,255,.6);background:rgba(255,255,255,.08);padding:1px 8px;border-radius:99px}
.g2p .g2-adv summary .ar{margin-inline-start:auto;transition:transform .2s}
.g2p .g2-adv[open] summary .ar{transform:rotate(180deg)}
.g2p .g2-adv .g2-fl{padding:0 12px 12px}
.gi2 #bigStart.g2-go{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;border:0;cursor:pointer;border-radius:18px;height:clamp(58px,7.4vh,76px);
  background:linear-gradient(180deg,var(--g2-gold2),var(--g2-gold));color:#2a1800;font:900 clamp(22px,3vh,30px) Cairo,sans-serif;
  box-shadow:0 10px 30px rgba(255,201,74,.35),inset 0 -4px 0 rgba(0,0,0,.15);transition:transform .15s}
.gi2 #bigStart.g2-go:hover{transform:translateY(-2px)}
.gi2 #bigStart.g2-go .ic{width:1em;height:1em;fill:currentColor;stroke:none}

/* حركة البطاقة (خفيفة — transform بس) */
.gi2 .cg-aim{animation:cgAim 2.4s ease-in-out infinite}
@keyframes cgAim{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
.gi2 .cg-wheel{animation:cgSpin 60s linear infinite}
@keyframes cgSpin{to{transform:translate(300px,330px) rotate(360deg)}}
.gi2 .cg-wheel{transform:translate(300px,330px)}
.gi2 .cg-gn{font:700 34px Oswald,sans-serif;fill:#8d97d8;text-anchor:middle}
.gi2 .cg-fn{font:700 46px Oswald,sans-serif;fill:#3a4aa8;opacity:.5;text-anchor:middle}
.gi2 .cg-q{font:700 90px Oswald,sans-serif;fill:#ffc94a;text-anchor:middle}
.gi2 .cg-num{font:700 64px Oswald,sans-serif;fill:#121a4a;text-anchor:middle}
body.perf-lite .gi2 .cg-aim,body.perf-lite .gi2 .cg-wheel{animation:none}
@media (prefers-reduced-motion:reduce){.gi2 .cg-aim,.gi2 .cg-wheel{animation:none}}

/* الهديّة اليوميّة ما تطلع فوق شاشة الإعدادات */
body:has(#stage .gintro) .dg{display:none!important}

/* شاشة ضيّقة: البطاقة فوق والإعدادات تحت */
@media (max-width:900px){
  .gi2 .g2-in{grid-template-columns:minmax(0,560px)}
  .gi2 .g2-card{grid-column:1;grid-row:1;transform:none;max-width:420px;justify-self:center;width:100%}
  .gi2 .g2-side{grid-column:1;grid-row:2}
  .g2p .g2-f{flex-wrap:wrap}
}
/* شاشات قصيرة (لابتوب ٧٦٨): البطاقة على قدّ الارتفاع والحقول أرصّ عشان زرّ البدء يبان بلا تمرير */
@media (min-width:901px) and (max-height:860px){
  .gi2 .g2-in{grid-template-columns:minmax(0,600px) min(30vw,calc((100dvh - 250px) * .72),540px)}
  .gi2 .g2-side{gap:10px}
  .g2p .g2-f{padding:7px 12px}
  .gi2 .g2-bub{padding:8px 14px}
  .g2p .g2-seg.big button{padding:9px}
  .gi2 .g2-desc{padding:10px 18px 12px;font-size:14px}
  .gi2 #bigStart.g2-go{height:56px}
}
@media (max-width:900px){ .gi2 .g2-t{font-size:clamp(30px,10vw,56px)} }

/* الكرسي الذهبي (الكراسي، إعداد golden) — رقم الكرسي ذهبي */
.chair-number.gold{background:linear-gradient(180deg,#ffe39a,#ffc94a)!important;color:#2a1800!important;box-shadow:0 0 0 3px #fff,0 0 24px rgba(255,201,74,.9)!important}
.mc-seat.gold .mc-num{background:linear-gradient(180deg,#ffe39a,#ffc94a);color:#2a1800;box-shadow:0 0 18px rgba(255,201,74,.9)}

/* نافذة كاملة على الشاشة مثل «جدار الشرف» (٢٠٢٦/١٠/٢٦) */
#stage .gi2{position:fixed;inset:0;z-index:58;width:100vw;height:100dvh;border-radius:0}
body.gi2-open{overflow:hidden}
body.gi2-open #toolrail,body.gi2-open #brandmark,body.gi2-open #stageBar,body.gi2-open #joinfeed{display:none !important}
.gi2 .g2-back{position:absolute;top:clamp(12px,2vh,22px);inset-inline-start:clamp(14px,2vw,30px);z-index:2;display:flex;align-items:center;gap:8px;
  padding:9px 16px;border:0;border-radius:12px;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);color:rgba(255,255,255,.8);
  font:900 15px Cairo,sans-serif;cursor:pointer}
.gi2 .g2-back:hover{background:rgba(255,255,255,.14);color:#fff}
.gi2 .g2-back .ic{transform:rotate(-90deg)}
@media (min-width:901px) and (max-height:860px){
  .gi2 .g2-in{grid-template-columns:minmax(0,600px) min(30vw,calc((100dvh - 120px) * .66),540px)}
}

/* ══ (٢٠٢٦/١٠/٢٦) الحقول بشكل g2 بكلّ مكان: شاشة الإعدادات + لوحة الإعدادات وسط اللعب + نافذة إعدادات اللعبة ══ */
.g2p{color:#fff;font-family:Cairo,system-ui,sans-serif;font-weight:800}
.g2p .ic{width:1.15em;height:1.15em;flex:none}
.g2p .g2-f.wide{flex-wrap:wrap}
.g2p .g2-f.wide .g2-seg{flex-basis:100%}
.g2-panel{display:flex;flex-direction:column;gap:10px;--g2-line:rgba(255,255,255,.1)}
.g2-panel .g2-f{flex-wrap:wrap;gap:8px 12px}
.g2-panel .g2-f > label{font-size:15px}
.g2-panel .g2-seg{flex:1 1 100%}
.g2-panel .g2-seg button{padding:7px 8px;font-size:13px}
.g2-panel .g2-step{margin-inline-start:auto}
.g2-panel .g2-f input[type=text]{width:100%}
.g2-panel .g2-f select{flex:1 1 100%}
#gdCfg .g2-panel{background:none;padding:0;box-shadow:none;border:0}
.mo .g2-panel,.modal .g2-panel{margin:10px 0}

/* البطاقة العامّة: الرسمة كاملة بلون اللعبة */
.gi2 .g2-card .g2-art svg{display:block}

/* ══ «ما فيه أحد يلعب للحين» — نافذة كاملة بنفس الشكل (٢٠٢٦/١٠/٢٦) ══ */
.ns2 .ns-side{gap:clamp(12px,1.8vh,18px)}
.ns2 .ns-head{display:flex;align-items:center;gap:14px}
.ns2 .ns-head > .ic{width:54px;height:54px;padding:12px;border-radius:16px;background:rgba(255,77,94,.14);color:#ff8a94;box-shadow:inset 0 0 0 2px rgba(255,77,94,.35)}
.ns2 .ns-head b{display:block;font-size:clamp(24px,3.4vh,36px);font-weight:900;line-height:1.15}
.ns2 .ns-head small{display:block;font-size:clamp(14px,1.8vh,17px);color:rgba(255,255,255,.7);font-weight:800;margin-top:4px}
.ns2 .ns-o{display:flex;flex-direction:column;gap:14px;width:100%;padding:18px;border-radius:20px;border:0;text-align:start;color:#fff;font:inherit;
  background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.ns2 .ns-o.live{background:linear-gradient(180deg,color-mix(in srgb,var(--acc) 20%,rgba(255,255,255,.04)),rgba(255,255,255,.04));box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--acc) 55%,transparent)}
.ns2 .ns-o-t{display:flex;align-items:center;gap:12px}
.ns2 .ns-o-t > .ic{width:44px;height:44px;padding:9px;border-radius:14px;background:rgba(255,255,255,.08);color:var(--acc)}
.ns2 .ns-o-t b{display:block;font-size:clamp(19px,2.6vh,24px);font-weight:900}
.ns2 .ns-o-t small{display:block;font-size:14px;color:rgba(255,255,255,.68);font-weight:800}
.ns2 .ns-row{display:flex;align-items:center;gap:8px;padding:6px;border-radius:16px;background:rgba(0,0,0,.35)}
.ns2 .ns-at{padding:0 4px 0 8px;font:700 22px Oswald,sans-serif;color:rgba(255,255,255,.5)}
.ns2 .ns-row input{flex:1;min-width:0;border:0;background:none;color:#fff;font:900 clamp(18px,2.4vh,22px) Cairo,sans-serif;padding:8px 4px;outline:none;direction:ltr;text-align:right}
.ns2 .ns-go{flex:none;border:0;border-radius:12px;padding:12px 24px;background:linear-gradient(180deg,#ffe39a,#ffc94a);color:#2a1800;font:900 18px Cairo,sans-serif;cursor:pointer}
.ns2 .ns-st{margin:0;font-size:14px;font-weight:900;min-height:1.2em;color:rgba(255,255,255,.7)}
.ns2 .ns-st.err{color:#ff8a94}.ns2 .ns-st.wait{color:#ffe48a}
.ns2 .ns-or{display:flex;align-items:center;gap:12px;color:rgba(255,255,255,.45);font-weight:900}
.ns2 .ns-or::before,.ns2 .ns-or::after{content:"";flex:1;height:1px;background:rgba(255,255,255,.14)}
.ns2 .ns-o.sim{flex-direction:row;align-items:center;justify-content:space-between;cursor:pointer;transition:transform .15s,background .15s}
.ns2 .ns-o.sim:hover{background:rgba(255,255,255,.1);transform:translateY(-2px)}
.ns2 .ns-arrow .ic{width:34px;height:34px;padding:8px;border-radius:50%;background:var(--acc);color:#fff;fill:currentColor;stroke:none}
.g2-panel .g2-seg button{flex:1 1 0;min-width:0;white-space:normal;line-height:1.25;padding:7px 4px}
.gi2 *,.gi2 *::before,.gi2 *::after,.g2p *{box-sizing:border-box}
@media (max-width:600px){ .ns2 .ns-o{padding:14px} .ns2 .ns-go{padding:10px 16px;font-size:16px} .ns2 .ns-head b{font-size:22px} }
/* أصناف ns-o القديمة (style.css) تحدّ العرض ٢٨٠ — نلغيها بالشاشة الجديدة */
.ns2 .ns-o{max-width:none;margin:0;flex:none;transform:none}
.ns2 .ns-row{max-width:100%}
.ns2 .ns-row input{width:0}
.ns2 .ns-o.live{align-items:stretch;cursor:default}

/* ══ بطاقة صفحة الألعاب بالرسمة (٢٠٢٦/١٠/٢٧ تجربة) — الرسمة فوق والاسم على طرفها ══ */
.gcard.has-art{padding:0!important;gap:0!important;overflow:hidden;display:flex;flex-direction:column;aspect-ratio:262/317;min-height:0}
.gcard.has-art .gc-art{position:relative;display:block;flex:1 1 auto;min-height:0;margin:7px 7px 0;border-radius:18px;overflow:hidden;background:#07061f;
  box-shadow:0 0 0 1px rgba(150,225,255,.25),0 8px 20px rgba(0,0,0,.4)}
.gcard.has-art .gc-art svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.gcard.has-art .gc-art::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,6,31,.92) 0%,rgba(7,6,31,.45) 30%,transparent 55%)}
.gcard.has-art .gc-at{position:relative;z-index:2;margin:-58px 18px 0;display:flex;flex-direction:column;align-items:flex-start;gap:4px;pointer-events:none}
.gcard.has-art .gc-k{padding:2px 10px;border-radius:99px;font-size:11px;font-weight:900;background:rgba(0,0,0,.45);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);color:#fff}
.gcard.has-art .gc-at b{font-size:clamp(20px,1.6vw,26px);font-weight:900;line-height:1.1;color:#ffd24a;text-shadow:0 3px 14px rgba(0,0,0,.7)}
.gcard.has-art .gc-d{padding:8px 16px 0;font-size:12.5px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;flex:0 0 auto}
.gcard.has-art .gc-foot{padding:8px 10px 10px;margin-top:0;flex:0 0 auto}
.gcard.has-art .gc-new,.gcard.has-art .gc-maint{z-index:3}
.gcard.has-art:hover .gc-art svg{transform:scale(1.04);transition:transform .4s}
.gcard.has-art .gc-lock,.gcard.has-art .gc-mine{position:absolute;z-index:3;top:16px;left:16px;display:grid;place-items:center;padding:6px;border-radius:12px;background:rgba(0,0,0,.55);color:#fff;font-size:12px;font-weight:900}
.gcard.has-art.locked .gc-art svg{filter:saturate(.55) brightness(.75)}

/* (٢٠٢٦/١٠/٢٧) الرسمة كصورة — نفس قصّ الـSVG (xMidYMin slice) */
.ca-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0;display:block;user-select:none}
.gcard.has-art:hover .gc-art .ca-img{transform:scale(1.04);transition:transform .4s}
.gcard.has-art.locked .gc-art .ca-img{filter:saturate(.55) brightness(.75)}
