/* ══════════════════════════════════════════════════════════════
   «اسم حيوان جماد» — لوحة المطار (٢٠٢٦/١٠/٢٧)
   حروف تنقلب (split-flap): أسود مطفي، أصفر كهرماني للكتابة، أبيض للعناوين،
   أخضر = مقبول، ذهبي = انفرد، كهرماني باهت = مكرّرة، أحمر = مرفوضة.
   كلّ المقاسات بوحدات الحاوية (xg) ⇒ تكبر مع الشاشة. البادئة sf-
   ══════════════════════════════════════════════════════════════ */
#stage.xg-on.xg-sf{padding:0!important}
.sf{
  --amb:#ffc93c; --amb2:#ffdf7a; --ok:#41e08a; --bad:#ff5468; --gold:#ffd24a;
  --tile:#17191f; --tile2:#0c0d11; --line:#2b2f38; --txt:#f3f1ea;
  position:relative;gap:2cqh;padding:2.4cqh 2.4cqw 2.4cqh;overflow:hidden;
  background:
    radial-gradient(120% 70% at 50% -10%,rgba(98,140,255,.18),transparent 60%),
    radial-gradient(80% 60% at 50% 120%,rgba(255,190,60,.08),transparent 70%),
    linear-gradient(180deg,#0d1018,#07080c);
  color:var(--txt);font-family:Cairo,system-ui,sans-serif;
}
/* إضاءة سقف الصالة */
.sf-hall{position:absolute;inset:0 0 auto 0;height:1.4cqh;display:flex;justify-content:space-around;pointer-events:none}
.sf-hall i{width:22%;height:100%;border-radius:0 0 8px 8px;background:linear-gradient(90deg,transparent,rgba(210,225,255,.55),transparent);
  box-shadow:0 0 4cqh 1.4cqh rgba(150,180,255,.12)}
.sf-ic{width:1.1em;height:1.1em;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.16em}
.sf-ic.pl{fill:currentColor;stroke:none}

/* ── الرأس ── */
.sf-top{position:relative;flex:0 0 auto;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:stretch;gap:1.4cqw;margin-top:.6cqh}
.sf-top > *{border-radius:1.6cqh;background:linear-gradient(180deg,#1a1d25,#101217);box-shadow:inset 0 0 0 1px var(--line),0 .8cqh 2cqh rgba(0,0,0,.45)}
.sf-brand{display:flex;align-items:center;gap:1cqw;padding:1.2cqh 1.6cqw}
.sf-brand .sf-ic{width:5.4cqh;height:5.4cqh;color:var(--amb);transform:scaleX(-1)}
.sf-brand small{display:block;font-size:max(12px,1.9cqh);font-weight:800;color:#9aa3b5;letter-spacing:.5px}
.sf-brand b{display:block;font-size:max(17px,3.4cqh);font-weight:900;line-height:1.15;white-space:nowrap}
.sf-ask{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.3em .5em;padding:1cqh 2cqw;text-align:center;
  font-size:max(16px,3.3cqh);font-weight:900;line-height:1.35}
.sf-ask b{color:var(--amb)}
.sf-ask em{font-style:normal;color:#aab3c4;font-size:.8em}
.sf-hl{display:inline-grid;place-items:center;min-width:1.5em;padding:0 .2em;border-radius:.25em;color:#111!important;background:var(--amb);box-shadow:0 0 1.4cqh rgba(255,201,60,.45)}
.sf-gate,.sf-dep{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:.8cqh 1.6cqw;min-width:12cqh}
.sf-gate small,.sf-dep small{font-size:max(11px,1.7cqh);font-weight:800;color:#9aa3b5;white-space:nowrap}
.sf-gate b,.sf-dep b{font-size:max(22px,5cqh);line-height:1;font-weight:900;color:var(--amb);font-variant-numeric:tabular-nums;font-family:Oswald,Cairo,sans-serif}
.sf-gate i{font-style:normal;font-size:max(11px,1.7cqh);color:#aab3c4;font-weight:800}
.sf-dep{min-width:15cqh}
.sf-bar{display:block;width:100%;height:.7cqh;min-height:4px;margin-top:.7cqh;border-radius:9px;background:rgba(255,255,255,.08);overflow:hidden}
.sf-bar u{display:block;height:100%;background:linear-gradient(90deg,var(--amb),var(--amb2));transform-origin:right;transition:transform .9s linear}
.sf-dep.warn b{color:var(--bad);animation:sfBlink .5s steps(2) infinite}
.sf-dep.warn .sf-bar u{background:var(--bad)}
@keyframes sfBlink{50%{opacity:.35}}

/* ── الوسط: الحرف + اللوحة ── */
.sf-main{position:relative;flex:1 1 auto;min-height:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:2.2cqw}
.sf-letterbox{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.6cqh;padding:2cqh 2cqw;border-radius:2.4cqh;
  background:linear-gradient(180deg,#14161d,#0c0d12);box-shadow:inset 0 0 0 1px var(--line),inset 0 2cqh 4cqh rgba(0,0,0,.4)}
.sf-letterbox > small{font-size:max(14px,2.6cqh);font-weight:900;color:#9aa3b5;letter-spacing:1px}
.sf-eg{margin:0;max-width:30cqh;text-align:center;display:flex;flex-direction:column;gap:.3cqh}
.sf-eg small{font-size:max(11px,1.8cqh);font-weight:800;color:#8d96a8}
.sf-eg b{font-size:max(14px,2.5cqh);font-weight:900;color:var(--amb2)}
.sf-eg i{font-style:normal;font-size:max(10px,1.6cqh);color:#7d8698;font-weight:700}

/* بلاطة الحرف المنقلب */
.sf-flap{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;
  border-radius:.9cqh;background:linear-gradient(180deg,#22252d 0,var(--tile) 49.4%,var(--tile2) 50.6%,#15171c 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05),inset 0 -.4cqh .8cqh rgba(0,0,0,.5),0 .4cqh .8cqh rgba(0,0,0,.5);
  color:var(--amb);font-weight:900;transform-origin:50% 50%}
.sf-flap::after{content:"";position:absolute;inset:calc(50% - 1px) 0 auto 0;height:2px;background:#050608;box-shadow:0 1px 0 rgba(255,255,255,.05)}
.sf-flap::before{content:"";position:absolute;inset:calc(50% - 4px) -2px auto;height:8px;
  background:linear-gradient(90deg,#3a3e48 0 4px,transparent 4px calc(100% - 4px),#3a3e48 calc(100% - 4px));pointer-events:none}
.sf-flap > span{position:relative;z-index:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;padding:0 .3em}
.sf-flap.flip{animation:sfFlip .26s cubic-bezier(.3,.7,.4,1)}
@keyframes sfFlip{0%{transform:perspective(60cqh) rotateX(80deg);filter:brightness(.55)}100%{transform:none;filter:none}}
.sf-flap.big{width:min(30cqh,24cqw);aspect-ratio:1/1.15;font-size:min(23cqh,18cqw);line-height:1;border-radius:1.8cqh}
.sf-flap.big > span{padding:0}
.sf-flap.big.land{box-shadow:inset 0 0 0 2px rgba(255,201,60,.5),0 0 5cqh rgba(255,201,60,.28),0 .6cqh 1.2cqh rgba(0,0,0,.6)}

/* اللوحة */
.sf-board{--cols:minmax(0,1.35fr) repeat(var(--n,3),minmax(0,1fr)) minmax(0,.78fr);
  min-height:0;display:flex;flex-direction:column;gap:.9cqh;padding:1.6cqh 1.4cqw;border-radius:2.4cqh;
  background:linear-gradient(180deg,#121419,#090a0d);box-shadow:inset 0 0 0 1px var(--line),inset 0 0 0 .7cqh #1b1e25,0 1.2cqh 3cqh rgba(0,0,0,.5)}
.sf-cols{display:grid;grid-template-columns:var(--cols);gap:.7cqw;padding:0 .4cqw .8cqh;border-bottom:2px solid #2a2e37}
.sf-ch{display:flex;align-items:center;justify-content:center;gap:.4em;min-width:0;font-size:max(13px,2.5cqh);font-weight:900;color:#e9ecf3;white-space:nowrap}
.sf-ch .sf-ic{color:var(--amb);width:1.25em;height:1.25em}
.sf-ch.who,.sf-ch.st{color:#8d96a8;font-size:max(12px,2cqh)}
.sf-ch.who{justify-content:flex-start}
.sf-num{font-style:normal;display:inline-grid;place-items:center;width:1.4em;height:1.4em;border-radius:.35em;background:#2a2e37;color:var(--amb);font-size:.75em;font-family:Oswald,Cairo,sans-serif}
.sf-rows{flex:1 1 auto;min-height:0;display:grid;grid-auto-rows:calc((100% - 8 * .8cqh) / 9);gap:.8cqh;overflow:hidden;align-content:start}
.sf-row{display:grid;grid-template-columns:var(--cols);gap:.7cqw;align-items:stretch;min-height:0;padding:0 .4cqw}
.sf-row.in{animation:sfRowIn .35s ease-out}
@keyframes sfRowIn{from{opacity:0;transform:translateY(-1.2cqh)}}
.sf-who{display:flex;align-items:center;gap:.7cqw;min-width:0}
.sf-who .av{width:min(4.4cqh,40px)!important;height:min(4.4cqh,40px)!important;flex:0 0 auto}
.sf-who b{min-width:0;font-size:max(13px,2.5cqh);font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-dot{width:1.6cqh;height:1.6cqh;border-radius:50%;background:#2a2e37;flex:0 0 auto}
.sf-row.sf-blank .sf-who b{color:#6e7687;font-weight:800}
.sf-cell{display:flex;min-width:0}
.sf-cell .sf-flap{flex:1;font-size:max(13px,2.7cqh)}
.sf-cell.sf-nil .sf-flap{color:#3a3f4a}
.sf-cell.ok .sf-flap{color:#d8ffe8;box-shadow:inset 0 0 0 2px rgba(65,224,138,.55)}
.sf-cell.solo .sf-flap{color:#1a1200;background:linear-gradient(180deg,#ffe28a 0,var(--gold) 49.4%,#e8b62c 50.6%,#ffd24a 100%);box-shadow:0 0 2cqh rgba(255,210,74,.4)}
.sf-cell.dup .sf-flap{color:#b29454;box-shadow:inset 0 0 0 2px rgba(255,201,60,.25)}
.sf-cell.out .sf-flap{color:#ff98a5;box-shadow:inset 0 0 0 2px rgba(255,84,104,.55)}
.sf-cell.out .sf-flap > span{text-decoration:line-through 2px}
.sf-tag{display:flex;align-items:center;justify-content:center;gap:.4em;min-width:0;border-radius:.9cqh;font-size:max(12px,2.1cqh);font-weight:900;white-space:nowrap}
.sf-tag.wait{color:#7d8698;background:rgba(255,255,255,.04)}
.sf-tag.dupt{color:#e8c46a;background:rgba(255,201,60,.08)}
.sf-tag.ok{color:#0b2a17;background:var(--ok)}
.sf-tag.ok b{font-size:1.25em;font-family:Oswald,Cairo,sans-serif}
.sf-tag.ok i{font-style:normal;display:inline-flex;align-items:center;gap:.2em;padding:.05em .4em;border-radius:.5em;background:#0b2a17;color:var(--gold)}
.sf-tag.ok i .sf-ic{fill:currentColor;stroke:none}
.sf-tag.no{color:#ffd2d8;background:rgba(255,84,104,.18)}
.sf-foot{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:1cqw;min-height:2.6cqh;padding:0 .4cqw;font-size:max(12px,2.1cqh);font-weight:800;color:#8d96a8}
.sf-foot b{color:var(--amb);font-family:Oswald,Cairo,sans-serif;font-size:1.2em}
.sf-more{color:#aab3c4}

/* ── شاشة التقييم بنفس اللوحة ── */
.sf .sf-judge.on{position:absolute;inset:2.4cqh 2.4cqw;z-index:5;display:flex;max-height:none;border-radius:2.4cqh;
  background:#06070a;box-shadow:inset 0 0 0 1px var(--line),0 2cqh 5cqh rgba(0,0,0,.6)}
.sf .aj-card{flex:1;min-height:0;display:flex;flex-direction:column;gap:1.4cqh;padding:2.4cqh 2cqw;background:none;border:0;box-shadow:none;max-width:none;width:100%}
.sf .aj-t{font-size:max(18px,3.6cqh);color:#fff}
.sf .aj-n{font-size:max(13px,2.2cqh);color:var(--amb)}
.sf .aj-tip{font-size:max(12px,1.9cqh);color:#9aa3b5}
.sf .aj-list{flex:1;min-height:0;overflow:auto}
.sf .aj-row,.sf .ajf-row{background:#12141a;border:1px solid var(--line);border-radius:1.4cqh}
.sf .aj-who b,.sf .ajf-who b{font-size:max(13px,2.2cqh)}
.sf .aj-a{background:linear-gradient(180deg,#22252d 0,var(--tile) 49.4%,var(--tile2) 50.6%,#15171c 100%);border-radius:.8cqh}
.sf .aj-a .aj-w{color:var(--amb);font-size:max(13px,2.2cqh)}
.sf .aj-a.yes{box-shadow:inset 0 0 0 2px rgba(65,224,138,.6)}
.sf .aj-a.no{box-shadow:inset 0 0 0 2px rgba(255,84,104,.6)}
.sf .aj-a.no .aj-w{text-decoration:line-through;color:#ff98a5}
.sf .aj-known{font-size:.75em;color:#8d96a8;font-weight:800}

/* ── شاشات صغيرة / طوليّة ── */
@container (max-aspect-ratio: 1/1){
  .sf-top{grid-template-columns:minmax(0,1fr) auto auto}
  .sf-brand{display:none}
  .sf-main{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}
  .sf-letterbox{flex-direction:row;padding:1.2cqh 3cqw}
  .sf-flap.big{width:15cqh;font-size:12cqh}
  .sf-eg{max-width:none}
}
.sf-row.sf-blank{opacity:.5}
.sf-row.sf-blank:first-child{opacity:.85}

.sf .aj-list{display:flex;flex-direction:column;gap:1cqh}
.sf .ajf-row{position:relative;display:flex;align-items:center;gap:1.4cqw;padding:1.2cqh 1.4cqw;overflow:hidden;flex:0 0 auto}
.sf .ajf-bg{position:absolute;inset:0;pointer-events:none;opacity:.22;background:var(--own-img) center var(--own-y,50%)/cover no-repeat}
.sf .ajf-row:not(.has-bnr) .ajf-bg{display:none}
.sf .ajf-who{position:relative;flex:0 0 22%;min-width:0;display:flex;align-items:center;gap:.8cqw}
.sf .ajf-who .av{width:min(5cqh,46px)!important;height:min(5cqh,46px)!important;flex:0 0 auto}
.sf .ajf-who b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf .ajf-ws{position:relative;flex:1;min-width:0;display:flex;flex-wrap:wrap;gap:.8cqh .6cqw}
.sf .aj-btns .btn-primary{background:linear-gradient(180deg,var(--amb2),var(--amb));color:#1a1200;border:0}
/* السطور الفاضية بنفس مقاس السطور الحقيقيّة */
.sf-row.sf-blank .sf-cell .sf-flap{min-height:100%}
