/* ===== ثيم العرش الحديدي - فولاذ داكن وضوء جليدي =====
   الفكرة: حديد العرش الأسود بإضاءة باردة. بلا أحمر وبلا ذهب في العناوين؛ الذهب خافت ومحجوز للتيجان والمميّز. */
:root{
  --iron-0:#06080b;--iron-1:#0b0f14;--iron-2:#121820;--iron-3:#1b2430;
  --steel:#8d99a8;--steel-l:#c9d2dd;--bone:#ece8df;
  --ac:#8fb8e3;--ac-l:#c3dcf3;--ac-d:#4d7eab;
  --royal:#c9a45c;
  --forge:linear-gradient(180deg,rgba(25,33,45,.9),rgba(10,14,20,.95));
  --glass:var(--forge);--line:rgba(143,184,227,.2);
  --parch:#ece8df;--gold:#8fb8e3;--gold-l:#c3dcf3;--gold-d:#4d7eab;--text:#e6e9ee;--muted:#8f9bab;
}
body{background:var(--iron-0)}
body::before{background:
  radial-gradient(ellipse at 14% -12%,rgba(79,120,170,.2) 0%,transparent 55%),
  radial-gradient(ellipse at 100% 112%,rgba(46,70,104,.22) 0%,transparent 52%),
  repeating-linear-gradient(115deg,rgba(255,255,255,.011) 0 2px,transparent 2px 9px),
  var(--iron-0)}
body::after{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;box-shadow:inset 0 0 150px rgba(0,0,0,.8)}
:focus-visible{outline:2px solid var(--ac-l);outline-offset:2px}

/* العناوين: عاجي هادئ، بلا تدرّج ذهبي ولا ظلال متوهجة */
h1,h2,h3{background:none;-webkit-text-fill-color:currentColor;color:var(--bone);text-shadow:none;filter:none}
html[lang=en] h1,html[lang=en] h2,html[lang=en] h3{letter-spacing:.035em}
.card h2::after{content:'';display:block;height:1px;margin-top:10px;background:linear-gradient(90deg,var(--ac-d),transparent 70%);opacity:.6}

/* الشريط العلوي */
.nav{background:linear-gradient(180deg,rgba(17,23,31,.95),rgba(7,10,14,.93));border-bottom:1px solid rgba(143,184,227,.22);box-shadow:0 8px 30px rgba(0,0,0,.55)}
.logo{color:var(--bone);text-shadow:none}
.logo i{filter:drop-shadow(0 2px 6px rgba(0,0,0,.6))}
.navlinks a{color:var(--steel-l)}
.navlinks a:hover,.navlinks a.on{background:rgba(143,184,227,.12);color:#fff}
.promo{background:linear-gradient(90deg,#0f2036,#1b3b61 50%,#0f2036);border-bottom:1px solid rgba(143,184,227,.25);letter-spacing:0;color:#e6eef8}
.promo b{color:#fff}

/* البطاقات: صفائح فولاذ */
.card{position:relative;background:var(--forge);border:1px solid rgba(143,184,227,.2);border-radius:14px;
  box-shadow:0 14px 44px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.06),inset 0 0 0 1px rgba(0,0,0,.55)}
.card::before,.card::after{display:none}

/* الأزرار */
.btn{border-radius:10px;letter-spacing:.2px;text-shadow:none}
.btn.gold{background:linear-gradient(180deg,#d4e7f9 0%,#8db6df 55%,#5f8dba 100%);border:1px solid #e3f0fc;color:#07111c;box-shadow:0 3px 0 #2d4e70,0 8px 20px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.65)}
.btn.gold:hover{filter:brightness(1.07);box-shadow:0 3px 0 #2d4e70,0 0 0 3px rgba(143,184,227,.22),0 8px 22px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.7)}
.btn.gold:active{transform:translateY(2px);box-shadow:0 1px 0 #2d4e70,0 4px 12px rgba(0,0,0,.55)}
.btn.ghost,.btn.frost{background:linear-gradient(180deg,rgba(52,64,80,.5),rgba(16,21,29,.82));border:1px solid rgba(143,184,227,.3);color:var(--steel-l);box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 4px 14px rgba(0,0,0,.5)}
.btn.ghost:hover,.btn.frost:hover{border-color:var(--ac-l);color:#fff}

/* الرئيسية: العرش مضاء ببرودة، بلا جمر */
.hero2 h1{background:none;-webkit-text-fill-color:currentColor;color:#f4f1ea;text-shadow:0 3px 34px rgba(0,0,0,.75);filter:none;letter-spacing:0}
html[lang=en] .hero2 h1{letter-spacing:.02em}
.hero2 .lead{color:#b7c1ce;text-shadow:0 2px 16px #000}

/* ===== واجهة اللعبة ===== */
.glass{background:var(--forge)!important;border:1px solid rgba(143,184,227,.26)!important;box-shadow:0 12px 40px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.06),inset 0 0 0 1px rgba(0,0,0,.5)!important}
.gbtn.gld{background:linear-gradient(180deg,#d4e7f9,#8db6df 55%,#5f8dba)!important;color:#07111c!important;border-color:#e3f0fc!important;box-shadow:0 3px 0 #2d4e70,0 6px 16px rgba(0,0,0,.5)}
.gbtn.red{background:linear-gradient(180deg,#8f6137,#4c2f17)!important;border-color:#d9a972!important;color:#fff7ea!important;box-shadow:0 3px 0 #2a1808,0 6px 16px rgba(0,0,0,.5)}
.famcard{border-radius:12px;background:linear-gradient(180deg,rgba(32,42,56,.9),rgba(10,14,20,.95))!important}
.famcard.mine{box-shadow:0 0 0 2px var(--ac-l),0 0 26px rgba(143,184,227,.3)!important}

/* مهام اللعبة */
#quests{position:fixed;inset-inline-start:12px;bottom:178px;width:min(290px,calc(100vw - 24px));z-index:20;border-radius:12px;font-size:12.5px;overflow:hidden;
  background:var(--forge);border:1px solid rgba(143,184,227,.3);box-shadow:0 10px 34px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.06)}
#quests.hidden{display:none}
#quests .qh{display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;background:linear-gradient(180deg,rgba(143,184,227,.16),rgba(143,184,227,.03));border-bottom:1px solid rgba(143,184,227,.2)}
#quests .qh b{color:var(--bone);font-family:var(--display)}#quests .qh span{margin-inline-start:auto;color:var(--steel-l)}#quests .qh i{font-style:normal;color:var(--ac-l)}
#quests .q{display:grid;grid-template-columns:26px 1fr auto;gap:2px 8px;align-items:center;padding:7px 12px;border-bottom:1px solid rgba(255,255,255,.06)}
#quests .q:last-child{border-bottom:0}#quests .qi{font-size:18px;grid-row:span 2}
#quests .qt{font-weight:700;color:#e6e9ee;line-height:1.3}#quests .pbar{height:6px;margin-top:4px}
#quests small{color:var(--steel-l);font-weight:700}#quests em{grid-column:2/4;font-style:normal;color:var(--ac-l);font-size:11px;opacity:.9}
@media(max-width:700px){#quests{bottom:auto;top:70px;inset-inline-start:8px;width:min(240px,60vw)}}

/* ===== أيقونات SVG (game-icons.net - CC BY 3.0) ===== */
.ico{display:inline-flex;align-items:center;justify-content:center;vertical-align:-.2em;line-height:1}
.icsvg{width:1.15em;height:1.15em;fill:currentColor;flex:none;filter:drop-shadow(0 1px 1px rgba(0,0,0,.5))}
.sigil{display:inline-block;vertical-align:-.32em;flex:none;filter:drop-shadow(0 2px 3px rgba(0,0,0,.55))}
.hs-dot{color:#fff}
.hs-dot .icsvg{width:66%;height:66%;fill:#fff;filter:drop-shadow(0 0 1px #000) drop-shadow(0 1px 2px rgba(0,0,0,.8))}
.hotspot.castle .hs-dot .icsvg{width:72%;height:72%}
.hotspot.dead .hs-dot .icsvg{fill:#bfeaff}
.hs-dot.lt .icsvg{fill:#10151c;filter:drop-shadow(0 0 1px rgba(255,255,255,.75))}
.pennant .sg .sigil,.hbtn .sg .sigil{width:1.5em;height:1.5em;vertical-align:middle}
.fam .sigil{width:1.5em;height:1.5em;vertical-align:-.45em;margin-inline-end:2px}
.credits-ic{font-size:12px;opacity:.65;text-align:center;padding:10px 12px}
.credits-ic a{color:inherit;text-decoration:underline}

/* ===== المدن: تظهر من بعيد ===== */
.hotspot.city{z-index:7}
#viewport[data-lod="0"] .hotspot.city{display:flex!important}
.hotspot.city .hs-dot{width:24px;height:24px;border-width:2px;box-shadow:0 0 0 2px rgba(255,255,255,.1),0 0 6px var(--c)}
.hotspot.city .hs-dot::after{display:block;inset:-5px;border:1.5px solid var(--c);opacity:.5;animation:none}
.hotspot.city .hs-label{display:block;font-size:11.5px;padding:0 7px;border-color:rgba(143,184,227,.5)}
#viewport[data-lod="0"] .hotspot.city .hs-label .g{display:none}
#viewport[data-lod="2"] .hotspot.city .hs-dot{width:28px;height:28px}
.cityperk{border-color:rgba(143,184,227,.45)!important;background:linear-gradient(180deg,rgba(143,184,227,.1),rgba(143,184,227,.02))!important}

/* ===== معسكر الحصار على الخريطة ===== */
.hs-camp{position:absolute;top:-17px;inset-inline-start:-18px;display:flex;align-items:center;gap:2px;padding:1px 5px 1px 3px;border-radius:9px;background:rgba(8,11,16,.92);border:1.5px solid var(--c,#aaa);font-size:10.5px;font-weight:800;color:#fff;line-height:1.4;pointer-events:none;box-shadow:0 2px 6px rgba(0,0,0,.6)}
.hs-camp .icsvg{width:13px;height:13px;fill:var(--c,#ddd)}
.hs-camp.mine{box-shadow:0 0 0 2px rgba(255,255,255,.35),0 2px 8px rgba(0,0,0,.7);animation:campPulse 2s ease-in-out infinite}
@keyframes campPulse{50%{transform:scale(1.12)}}
@media(prefers-reduced-motion:reduce){.hs-camp.mine{animation:none}}

/* ===== لوحات التعزيز والحروب ===== */
.reinf{border-color:rgba(143,184,227,.4)!important}
.siegebox{border-color:#b98d58!important;background:linear-gradient(180deg,rgba(185,141,88,.14),rgba(185,141,88,.02))!important}
.warbox .warrow{padding:8px 0;border-top:1px solid rgba(255,255,255,.07)}
.warbox .warrow:first-of-type{border-top:0}
.warbox .vs{opacity:.7;padding:0 4px}

/* ===== الكروت: ميداليات أيقونات بلون الندرة ===== */
.cmed{display:grid;place-items:center;width:54px;height:54px;margin:2px auto 4px;border-radius:50%;
  background:radial-gradient(circle at 50% 38%,color-mix(in srgb,var(--c) 34%,#0d131b),#0b1017 72%);border:2px solid var(--c);
  box-shadow:inset 0 0 14px color-mix(in srgb,var(--c) 28%,transparent),0 3px 10px rgba(0,0,0,.55)}
.cmed .icsvg{width:62%;height:62%;fill:color-mix(in srgb,var(--c) 55%,#fff);filter:drop-shadow(0 1px 2px rgba(0,0,0,.7))}
.hcard{background:linear-gradient(180deg,#1b2532 0%,#0c1119 100%)!important;border:1px solid rgba(255,255,255,.13)!important;border-top:3px solid var(--c)!important;box-shadow:0 10px 24px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.06)}
.hcard[data-r=rare]{box-shadow:0 10px 24px rgba(0,0,0,.6),0 0 16px rgba(79,163,224,.22)}
.hcard[data-r=epic]{box-shadow:0 10px 24px rgba(0,0,0,.6),0 0 20px rgba(180,107,224,.32)}
.hcard[data-r=legendary]{box-shadow:0 10px 24px rgba(0,0,0,.6),0 0 24px rgba(240,180,41,.4)}
.hcard b{color:var(--bone)}
.hcard em::before{content:'◆ ';font-size:8px;vertical-align:1px}
.bigcard{background:linear-gradient(180deg,#1b2532,#0b1017)!important;border:1px solid rgba(255,255,255,.14)!important;border-top:4px solid var(--c)!important}
.bigcard .cmed{width:96px;height:96px;margin-bottom:8px}
.bigcard b{color:var(--bone)}

/* بقايا الأحمر: ألوان الحرب صارت نحاسية دافئة وخافتة */
.pbar.odds{background:#5b4330}
.log.war{border-color:#c79a62;background:rgba(150,104,52,.16)}
.hotspot.reach .hs-dot{outline-color:rgba(255,183,102,.72)}
.mp.p{background:linear-gradient(160deg,rgba(60,92,132,.45),rgba(12,18,26,.75))}
.bar.loss{background:#5b4330}

/* الجوال: أزرار الشريط العلوي في سطر واحد */
@media(max-width:560px){
  .nav .navright{gap:6px}
  .nav .navright a,.nav .navright button{white-space:nowrap;padding:7px 10px;font-size:13px;line-height:1.25}
  .nav .logo{font-size:17px;gap:6px}
  .nav .logo svg,.nav .logo .icsvg{width:26px;height:26px}
}

/* السلبي/الخطأ/التحذير: عنبري هادئ بدل الأحمر */
:root{--neg:#ffb766;--neg-bg:rgba(150,104,52,.22)}
.bad,.bad2,.err,.chip .dn,.mini.bad,.box.bad{color:var(--neg)!important}
.err{font-weight:700}
.live{color:var(--neg)}.live::before{background:var(--neg)}
#conn{background:#5b4330;border-color:#d9a972;color:#fff7ea}
.tag.playing{background:var(--neg-bg);color:var(--neg)}
.plan li.no::before{color:#7f8da0}
.rbtn .badge{background:#c79a62;color:#1a1208}
.hotspot.reach .hs-dot{outline-color:var(--neg)}
.log.war{border-color:#c79a62}
.pbar.odds{background:#5b4330}

/* اختيار نوع الغرفة (عامة/خاصة) */
.vis{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 12px}
.vis button{display:flex;flex-direction:column;align-items:center;gap:3px;padding:10px 8px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(143,184,227,.22);color:var(--text);font:inherit;font-weight:800;cursor:pointer;text-align:center;line-height:1.3}
.vis button small{font-weight:500;font-size:11.5px;color:var(--muted);line-height:1.4}
.vis button.on{border-color:var(--ac-l);background:rgba(143,184,227,.14);box-shadow:0 0 0 1px var(--ac-l) inset}
.vis button:focus-visible{outline:2px solid var(--ac-l);outline-offset:2px}
.pill{white-space:nowrap}

/* ===== بطاقات السيناريوهات ===== */
.scgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:10px;margin:6px 0 10px}
.sccard{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:start;padding:12px 12px 11px;border-radius:14px;border:1px solid rgba(143,184,227,.22);background:linear-gradient(180deg,rgba(26,36,50,.85),rgba(12,17,24,.9));color:inherit;font:inherit;cursor:default;transition:transform .15s,border-color .15s,box-shadow .15s}
.sccard.can{cursor:pointer}.sccard.can:hover{transform:translateY(-2px);border-color:rgba(143,184,227,.55)}
.sccard.on{border-color:#8fb8e3;background:linear-gradient(180deg,rgba(46,90,140,.55),rgba(14,22,32,.95));box-shadow:0 0 0 1px rgba(143,184,227,.5),0 10px 26px rgba(40,90,150,.35)}
.sccard .sci{font-size:26px;line-height:1}.sccard .scn{font-weight:800;font-size:14.5px;line-height:1.25}.sccard .sct{font-size:12px;color:var(--muted);line-height:1.35}
.sccard .scth{font-size:13px;opacity:.9;letter-spacing:2px;margin-top:2px}
.sccard .scck{position:absolute;top:9px;inset-inline-end:10px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:#8fb8e3;color:#07111c;font-weight:900;font-size:12px}
.scdet{border:1px solid rgba(143,184,227,.2);border-radius:14px;padding:12px 14px;background:rgba(8,12,18,.55);margin-bottom:10px}
.scdet .scdt{font-size:16px;margin-bottom:4px}.scdet p{margin:0 0 8px;font-size:13.5px;line-height:1.75;color:#c8d1dd}
.scfx b{font-size:12.5px;color:#c3dcf3}.scfx ul{margin:4px 0 0;padding:0;list-style:none;display:grid;gap:3px}
.scfx li{font-size:13px;padding-inline-start:20px;position:relative;color:#d7dee8}.scfx li::before{content:'✓';position:absolute;inset-inline-start:2px;color:#8fe0b4;font-weight:900}
.scwarn{margin-top:8px;padding:7px 10px;border-radius:9px;background:rgba(255,183,102,.12);border:1px solid rgba(255,183,102,.4);color:#ffcf99;font-size:12.5px}
.modetog{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:14px;border:1px solid rgba(143,184,227,.22);background:rgba(8,12,18,.55);margin-bottom:10px}
.modetog .mti{font-size:24px}.modetog .mtt{flex:1;min-width:0}.modetog .mtt b{display:block;font-size:14.5px}.modetog .mtt>span{font-size:12px;color:var(--muted);line-height:1.5;display:block}
.sw{position:relative;width:46px;height:26px;border-radius:99px;border:1px solid rgba(143,184,227,.4);background:rgba(255,255,255,.08);cursor:default;flex:none;padding:0}
.sw.can{cursor:pointer}.sw::after{content:'';position:absolute;top:2px;inset-inline-start:2px;width:20px;height:20px;border-radius:50%;background:#9aa8ba;transition:inset-inline-start .15s,background .15s}
.sw.on{background:rgba(70,130,190,.6);border-color:#8fb8e3}.sw.on::after{inset-inline-start:22px;background:#e3f0fc}
.thrrow{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:2px 0 8px}
.modetog.slim{padding:8px 10px;gap:9px;margin-bottom:6px}.modetog.slim .mti{font-size:20px}
.garrbtns{display:inline-flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}
.speedbox{padding:10px 14px 12px;border-radius:14px;border:1px solid rgba(143,184,227,.22);background:rgba(8,12,18,.55);margin-bottom:10px}
.speedbox .mtt b{display:block;font-size:14.5px}.speedbox .mtt>span{font-size:12px;color:var(--muted);line-height:1.5}
.sprow{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.spb{flex:1 1 56px;min-width:54px;display:flex;flex-direction:column;align-items:center;gap:1px;padding:7px 6px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);color:inherit;font:inherit;cursor:default}
.spb b{font-size:14px}.spb small{font-size:11px;color:var(--muted)}
.spb.can{cursor:pointer}.spb.can:hover{border-color:#8fb8e3}.spb.on{border-color:var(--gold-l,#e8c872);background:rgba(232,200,114,.16)}.spb:disabled{opacity:1}
.thrchip{display:flex;align-items:center;gap:6px;padding:6px 11px;border-radius:99px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);color:inherit;font:inherit;font-size:13px;cursor:default}
.thrchip.can{cursor:pointer}.thrchip.on{border-color:#8fb8e3;background:rgba(70,130,190,.28)}.thrchip.auto{border-style:dashed}
.mixbar{display:flex;height:9px;border-radius:6px;overflow:hidden;margin:6px 0 4px;background:rgba(255,255,255,.08)}
.mixbar i{display:block;height:100%}.mixbar .c{background:#d9a35f}.mixbar .i{background:#7fa6d4}.mixbar .a{background:#7fc79a}
.mixleg{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:12px;color:#c8d1dd}
.realtag{display:inline-block!important;width:auto!important;font-size:11px;font-weight:800;padding:2px 8px;border-radius:99px;border:1px solid rgba(143,224,180,.5);color:#8fe0b4;margin-inline-start:6px}
/* الشخصيات والتاج والتبعية */
.chr{margin-top:5px;font-size:12.5px;font-weight:800;color:#dbe7f4}
.rtag{display:inline-block;margin-top:4px;padding:2px 9px;border-radius:99px;font-size:11px;font-weight:800;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06)}
.rtag.k{border-color:rgba(232,196,96,.6);color:#f0d68a}.rtag.v{border-color:rgba(143,184,227,.55);color:#c3dcf3}.rtag.i{border-color:rgba(231,120,120,.5);color:#f2b4b4}
.hbtn .chr{display:block;font-size:11.5px;margin-top:3px;font-weight:700;color:#cfdcec}
.kbadge{font-style:normal;margin-inline:3px;font-size:13px}
.vas{font-size:12px;margin-inline-start:4px;opacity:.9;white-space:nowrap}
.kingline{font-weight:900;font-size:15px;color:#f0d68a;margin-bottom:4px}
.kgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:6px;margin:8px 0}
.kk{display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);font-size:12.5px;min-width:0}
.kk b{flex:1;min-width:0;line-height:1.2;font-weight:700}.kk i{font-style:normal}
.kk.me{border-color:rgba(130,215,160,.65);background:rgba(90,180,130,.16)}.kk.banner{border-color:rgba(143,184,227,.7);background:rgba(70,130,190,.2)}.kk.part{border-color:rgba(232,196,96,.55);background:rgba(200,160,60,.12)}
.vrow{padding:8px 0;border-top:1px solid rgba(255,255,255,.08)}.vrow:first-of-type{border-top:0}
.vrow .ord{justify-content:flex-start;gap:6px;flex-wrap:wrap;margin-top:6px}
.spnow{margin-top:6px;font-size:13px;color:var(--muted)}.spnow b{color:var(--gold-l,#e8c872);font-size:15px}
.spb{flex:1 1 52px}
.spcustom{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:10px}
.unitsw{display:inline-flex;border:1px solid rgba(255,255,255,.2);border-radius:10px;overflow:hidden}
.unitsw button{background:rgba(0,0,0,.35);color:var(--muted);border:0;padding:6px 10px;font-family:inherit;font-size:13px;cursor:pointer}
.unitsw button.on{background:rgba(232,200,114,.2);color:#fff}
