:root{--bg:#f5f4f0;--card:#fff;--card2:#faf9f6;--ink:#17150f;--mute:#6b675e;--line:#e6e2d8;--up:#11834a;--down:#c43a2c;--r:14px;
--gold:var(--acc,#d4af37);--gold-ink:color-mix(in srgb,var(--gold) 62%,#000);--gold-soft:color-mix(in srgb,var(--gold) 12%,#fff);--shadow:0 1px 2px rgba(23,21,15,.04),0 4px 14px rgba(23,21,15,.04)}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:76px}
body{background:var(--bg);color:var(--ink);font-family:"IBM Plex Sans Arabic",Tahoma,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
.num{font-variant-numeric:tabular-nums;direction:ltr;unicode-bidi:isolate;display:inline-block}
.ann{background:var(--gold);color:#111;text-align:center;padding:8px 16px;font-size:.9rem;font-weight:500}
/* nav */
.nav{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.navin{max-width:1180px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0}
.brand img{height:38px;width:auto;border-radius:8px}
.mark{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--gold);color:#111;font-size:1rem}
.sn{display:block;font-weight:700;font-size:1.02rem;line-height:1.2}
.tag{display:block;font-size:.74rem;color:var(--mute)}
.links{display:flex;gap:2px;margin-inline-start:auto}
.links a{text-decoration:none;font-size:.9rem;color:var(--mute);padding:7px 11px;border-radius:8px}
.links a:hover{color:var(--ink);background:var(--card2)}
.acts{display:flex;gap:6px}
.ib{font:inherit;font-size:.85rem;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:10px;min-width:38px;height:38px;padding:0 10px;display:inline-grid;place-items:center;text-decoration:none;cursor:pointer}
.ib:hover{border-color:var(--gold)}
.mb{display:none}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
@media (max-width:900px){
  .links{display:none;position:absolute;inset-inline:0;top:100%;flex-direction:column;background:#fff;box-shadow:var(--shadow);border-bottom:1px solid var(--line);padding:8px 12px 14px}
  .links.open{display:flex}.links a{padding:11px 12px;font-size:1rem}
  .acts{margin-inline-start:auto}.mb{display:inline-grid}.tag{display:none}
}
/* layout */
.wrap{max-width:1180px;margin:0 auto;padding:0 16px 40px;display:grid;gap:18px}
.hero{padding:34px 0 8px;display:grid;gap:8px;justify-items:start}
.pill{display:inline-flex;align-items:center;gap:8px;font-size:.8rem;font-weight:500;color:var(--gold-ink);background:var(--gold-soft);border:1px solid color-mix(in srgb,var(--gold) 35%,transparent);padding:4px 12px;border-radius:99px}
.hero h1{color:var(--ink);font-size:clamp(1.8rem,5vw,2.8rem);line-height:1.15;font-weight:700;letter-spacing:-.01em}
.upd{color:var(--mute);font-size:.9rem}
.dot{width:8px;height:8px;border-radius:50%;background:var(--mute)}
.dot.on{background:var(--up);animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--up) 60%,transparent)}70%{box-shadow:0 0 0 7px transparent}100%{box-shadow:0 0 0 0 transparent}}
@media (prefers-reduced-motion:reduce){.dot.on{animation:none}html{scroll-behavior:auto}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.ch{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;padding:16px 18px 12px}
.ch h2,.sh h2{font-size:1.12rem;font-weight:700}
.sub{color:var(--mute);font-size:.82rem}
.sh{display:grid;gap:2px;padding:6px 2px 10px}
.note{color:var(--mute);font-size:.8rem;padding:10px 18px 14px}
.tbar{display:flex;justify-content:space-between;gap:10px;padding:8px 18px;background:var(--card2);border-top:1px solid var(--line);font-size:.82rem;color:var(--mute)}
.live{display:inline-flex;align-items:center;gap:6px;color:var(--up);font-size:.78rem}
.live::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
/* tables */
.tw{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:.94rem}
th,td{padding:12px 18px;border-top:1px solid var(--line);white-space:nowrap}
thead th{color:var(--mute);font-weight:500;font-size:.78rem;text-align:end;background:var(--card2)}
thead th:first-child,tbody th{text-align:start}
tbody th{font-weight:500}
td{text-align:end}
td b{color:var(--gold-ink);font-weight:700}
tbody tr:hover{background:var(--card2)}
.an{display:block}.as{display:block;font-size:.72rem;color:var(--mute);direction:ltr;text-align:start;unicode-bidi:plaintext}
.up{color:var(--up)}.down{color:var(--down)}.na{color:var(--mute)}
/* stats */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px;background:var(--line);border-top:1px solid var(--line)}
.stats>div{background:var(--card);padding:16px 18px;display:grid;gap:2px}
.stats .now{background:var(--gold-soft)}
.sl{font-size:.78rem;color:var(--mute)}
.stats b{font-size:1.6rem;font-weight:700;line-height:1.2}
.stats .now b{color:var(--gold-ink)}
.su{font-size:.8rem;color:var(--mute)}
/* country cards */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.cty{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:14px 16px;display:grid;gap:4px;transition:border-color .2s}
.cty:hover{border-color:var(--gold)}
.ct{display:flex;justify-content:space-between;align-items:center}
.cp{font-size:1.5rem;font-weight:700;color:var(--gold-ink);line-height:1.3}
.cs{display:flex;justify-content:space-between;gap:8px;font-size:.78rem;color:var(--mute);border-top:1px solid var(--line);padding-top:8px;margin-top:4px}
.cs .num{color:var(--ink)}
/* calculator */
.cg{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;padding:0 18px 14px;align-items:end}
.cg label{display:grid;gap:5px;font-size:.8rem;color:var(--mute)}
.cg input[type=number],.cg select{font:inherit;font-size:.95rem;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 12px;width:100%}
.cbx{display:flex!important;align-items:center;gap:8px;min-height:44px;color:var(--ink)!important;font-size:.88rem!important}
.cr{border-top:1px solid var(--line)}
.cv{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:16px 18px;background:var(--gold-soft)}
.cv b{font-size:1.7rem;color:var(--gold-ink)}
.cl{display:flex;justify-content:space-between;padding:10px 18px;border-top:1px solid var(--line);font-size:.9rem;color:var(--mute)}
.cl .num{color:var(--ink)}
/* misc */
.prose{padding:6px 20px 18px}
.prose h1{font-size:1.4rem;margin:14px 0 6px}
.prose h2{font-size:1.1rem;margin:18px 0 6px;color:var(--gold-ink)}
.prose p{margin:0 0 10px;max-width:75ch;color:color-mix(in srgb,var(--ink) 85%,var(--mute))}
.contact{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:0 18px 18px}
.btn{font:inherit;color:var(--ink);background:var(--card2);border:1px solid var(--line);border-radius:10px;padding:9px 16px;text-decoration:none;display:inline-block}
.btn.gold{background:var(--gold);border-color:var(--gold);color:#17150f;font-weight:500}
.ad{text-align:center}.ad span{display:block;font-size:.7rem;color:var(--mute);margin-bottom:4px}
/* footer */
.foot{border-top:3px solid var(--gold);background:#17150f;color:#fff}
.foot .fin{color:#b9b4a8}.foot .sn,.foot .share span{color:#fff}.foot .fl a:hover,.foot .share a:hover{color:var(--gold)}
.fin{max-width:1180px;margin:0 auto;padding:28px 16px 32px;display:grid;gap:14px;color:var(--mute);font-size:.88rem}
.fl,.share{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center}
.fl a,.share a{text-decoration:none}.fl a:hover,.share a:hover{color:var(--gold-ink)}
.share span{color:var(--ink);font-weight:500}
.fine{font-size:.78rem}
.hero{border-bottom:1px solid var(--line);padding-bottom:18px}
.ch{border-bottom:1px solid var(--line)}
.ch+.tw table thead th,.ch+div .tw thead th{border-top:0}
/* mobile: everything fits without sideways scrolling */
@media (max-width:640px){
  .wrap{padding:0 10px 32px;gap:14px}
  .hero{padding:14px 2px 12px;gap:4px}
  .hero h1{font-size:1.45rem}
  .ch{padding:12px 12px 10px}.ch h2,.sh h2{font-size:1rem}
  .tbar,.note{padding-inline:12px}
  table{font-size:.84rem}
  th,td{padding:10px 8px}
  th:first-child,td:first-child{padding-inline-start:12px}
  th:last-child,td:last-child{padding-inline-end:12px}
  tbody th{white-space:normal;line-height:1.35}
  thead th{white-space:normal;font-size:.72rem}
  :is(#metalst,#oilt,#fxt) :is(th,td):nth-child(2){display:none}
  .as{font-size:.66rem}
  .stats{grid-template-columns:repeat(3,1fr)}
  .stats>div{padding:12px 10px}
  .stats b{font-size:1.05rem}
  .sl{font-size:.7rem}
  .cards{grid-template-columns:repeat(2,1fr);gap:10px}
  .cty{padding:12px}.cp{font-size:1.2rem}.cs{flex-direction:column;gap:2px}
  .cg{padding:0 12px 12px;grid-template-columns:repeat(2,1fr)}
  .cv,.cl{padding-inline:12px}.cv b{font-size:1.35rem}
}
/* ticker */
.ticker{background:#17150f;color:#f3eee2;overflow:hidden;white-space:nowrap;border-bottom:1px solid #000;font-size:.82rem}
.tk{display:inline-flex;gap:28px;padding:7px 0;animation:tkl 60s linear infinite;will-change:transform}
[dir=rtl] .tk{animation-name:tkr}
.ticker:hover .tk{animation-play-state:paused}
.ti{display:inline-flex;gap:6px;align-items:baseline}.ti b{font-weight:500;color:var(--gold)}.ti small{color:#a39d90}
.ti .up{color:#5fd896}.ti .down{color:#ff8a7e}
@keyframes tkl{to{transform:translateX(-50%)}}@keyframes tkr{to{transform:translateX(50%)}}
@media (prefers-reduced-motion:reduce){.tk{animation:none}}
/* history */
.rg{display:flex;gap:4px;background:var(--card2);border:1px solid var(--line);border-radius:10px;padding:3px}
.rg button{font:inherit;font-size:.78rem;border:0;background:none;color:var(--mute);padding:5px 10px;border-radius:7px;cursor:pointer;min-height:30px}
.rg button.on{background:#fff;color:var(--ink);box-shadow:var(--shadow);font-weight:500}
.chart{position:relative;padding:8px 8px 0}
.chart svg{display:block;touch-action:pan-y}
.ax{font-size:11px;fill:var(--mute);font-family:inherit}
.tip{display:none;position:absolute;top:6px;background:#17150f;color:#fff;border-radius:8px;padding:6px 10px;font-size:.78rem;pointer-events:none;width:130px}
.tip span,.tip b{display:block}
.ch.sub2{border-top:1px solid var(--line)}
/* chips, posts, faq, forms */
.chips{display:flex;flex-wrap:wrap;gap:8px;padding:14px 18px}
.chips a{text-decoration:none;font-size:.86rem;background:var(--card2);border:1px solid var(--line);padding:7px 12px;border-radius:99px}
.chips a:hover{border-color:var(--gold);color:var(--gold-ink)}
.posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.post{display:grid;gap:6px;align-content:start;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;text-decoration:none;box-shadow:var(--shadow)}
.post b{font-size:1.02rem;line-height:1.4}.post span{color:var(--mute);font-size:.88rem}.post .rm{color:var(--gold-ink);font-weight:500}
.post:hover{border-color:var(--gold)}
.faq details{border-top:1px solid var(--line);padding:0 18px}
.faq summary{cursor:pointer;padding:14px 0;font-weight:500;list-style:none;display:flex;justify-content:space-between;gap:10px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--gold-ink);font-size:1.2rem;line-height:1}
.faq details[open] summary::after{content:"−"}
.faq p{padding:0 0 14px;color:var(--mute)}
.form{display:grid;gap:12px;padding:18px}
.form label{display:grid;gap:5px;font-size:.85rem;color:var(--mute)}
.form input,.form textarea{font:inherit;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 12px;width:100%}
.form button{justify-self:start;cursor:pointer;border:0;min-height:44px;padding:10px 28px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.msg{margin:18px;padding:12px 14px;border-radius:10px}.msg.ok{background:#e4f5ea;color:#11834a}.msg.er{background:#fdeaea;color:#c43a2c}
.narrow{max-width:860px}
.fcols{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}
.fcols b{color:#fff;display:block;margin-bottom:6px}
.fv{display:grid;gap:4px}.fv a{text-decoration:none;font-size:.85rem}.fv a:hover{color:var(--gold)}
.tgb{justify-self:start}
@media (max-width:640px){.chips{padding:12px}.rg button{padding:5px 8px}.ch{align-items:center}}
/* gold gram table (navy + gold) */
.gt{--nv:#1f2d4a;--gd:#b89b5e;--gl:#c9cfd9;width:100%;max-width:780px;margin-inline:auto;border:1px solid var(--gl);border-radius:10px;overflow:hidden;background:#fff;box-shadow:var(--shadow)}
.gt-h{background:var(--nv);color:#fff;text-align:center;font-size:1.35rem;font-weight:700;padding:16px 12px;line-height:1.35}
.gtt{width:100%;border-collapse:collapse;table-layout:fixed;font-size:1rem}
.gtt th,.gtt td{border:1px solid var(--gl);border-top:0;padding:14px 10px;text-align:center;white-space:normal;vertical-align:middle;background:none}
.gtt tr>*:first-child{border-inline-start:0}.gtt tr>*:last-child{border-inline-end:0}
.gt-bar th{background:var(--gd);color:var(--nv);font-weight:500;font-size:.98rem;border-color:color-mix(in srgb,var(--nv) 35%,var(--gd))}
.gt-cols th{background:#edf0f4;color:var(--nv);font-weight:500;font-size:.95rem}
.gtt tbody th{color:var(--nv);font-weight:500}
.gtt tbody td{color:var(--nv);font-weight:700;font-size:1.12rem}
.gtt tbody tr:nth-child(even){background:#f6f7f9}
.gtt tbody tr:hover{background:#eef1f5}
.gt-f{background:#edf0f4;border-top:1px solid var(--gl);text-align:center;padding:14px 12px;font-size:.95rem;color:#6a7385}
.gt-f p+p{color:var(--nv);font-weight:500;margin-top:2px}
@media (max-width:640px){.gt-h{font-size:1.12rem;padding:13px 10px}.gtt{font-size:.86rem}.gtt th,.gtt td{padding:11px 6px}.gt-bar th,.gt-cols th{font-size:.8rem}.gtt tbody td{font-size:.95rem}.gt-f{font-size:.82rem}}
.gtt tr>*:first-child{width:40%}
.gt-bar .num{white-space:nowrap}
a.cty{text-decoration:none;color:inherit}
.adimg img{max-width:100%;height:auto;border-radius:10px;display:block;margin:0 auto}
/* article content */
.prose h3{font-size:1rem;margin:14px 0 6px}
.prose ul,.prose ol{margin:0 0 12px;padding-inline-start:22px;color:color-mix(in srgb,var(--ink) 85%,var(--mute))}
.prose li{margin-bottom:4px}
.prose blockquote{margin:12px 0;padding:10px 16px;border-inline-start:3px solid var(--gold);background:var(--gold-soft);border-radius:8px}
.prose img{max-width:100%;height:auto;border-radius:12px;display:block;margin:12px auto}
.prose figure{margin:14px 0}
.prose a{color:var(--gold-ink)}
.cover{width:100%;max-height:420px;object-fit:cover;border-radius:var(--r);border:1px solid var(--line)}
.post.has{padding-top:0;overflow:hidden}
.pimg{width:calc(100% + 32px);margin:0 -16px 6px;aspect-ratio:1200/630;object-fit:cover;display:block;background:var(--card2)}
.chips.flat{padding:0}
.chips a.on{background:var(--ink);color:#fff;border-color:var(--ink)}
