/* Qabas clarity layer (2026-10-09): hierarchy only — no new colors, no identity changes.
   Uses existing tokens (--pm-*, --up, --text-*). Mobile-first; desktop layout stays as is. */

/* ---- shared heading/spacing tokens (all qx pages) ---- */
:root{--cl-h1:700 22px/1.4 var(--pm-font,var(--font-display));--cl-h2:700 18px/1.45 var(--pm-font,var(--font-display));--cl-h3:600 15px/1.5 var(--pm-font,var(--font-display));--cl-gap:18px;--cl-pad:14px}
@media (max-width:760px){
  :root{--qh1:var(--cl-h1);--qh2:var(--cl-h2);--qh3:var(--cl-h3)}
  html body .qx .sec-head h2,html body .qx .wd-section-title h2,html body .qx .symbol-section-head h2,html body .qx .sp-home-head h2,html body .qx .s-sec>h2{font:var(--cl-h2)!important;letter-spacing:0!important}
  html body .qx .page-hero h1,html body .qx .hero-head h1{font:var(--cl-h1)!important}
  html body .qx .sec-head h3,html body .qx .night h3{font:var(--cl-h3)!important}
  html body .qx main>.block,html body .qx main>section,html body .qx main>.cols{margin-top:var(--cl-gap)}
  html body .qx .symbol-section-head p,html body .qx .wd-section-title p{display:none}
}

/* ---- logos: no white square until a real logo has loaded ---- */
.qx .logo img{background:transparent}
.qx .logo img.cl-ok{background:#fff}
.qx .logo img[hidden]{display:none!important}

/* ---- home (mobile): opportunities first ---- */
@media (max-width:760px){
  body[data-qx-page="home"] .pm-hero{padding:14px 16px 12px!important;min-height:0!important;margin-bottom:6px!important}
  body[data-qx-page="home"] .pm-hero .pm-hero-arc,body[data-qx-page="home"] .pm-hero .pm-hero-sub,body[data-qx-page="home"] .pm-hero .pm-hero-cta,body[data-qx-page="home"] .pm-hero .pm-hero-kicker{display:none!important}
  body[data-qx-page="home"] .pm-hero h1{margin:0!important;font-size:22px!important;line-height:1.35!important}
  body[data-qx-page="home"] .pm-hero .pm-hero-status{margin-top:8px!important;padding:0!important;min-height:0!important;background:none!important;border:0!important;box-shadow:none!important}
  body[data-qx-page="home"] .pm-hero .pm-hero-status .sessionline{display:flex!important;flex-direction:row!important;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 10px;font-size:12px;padding:0!important;margin:0!important;min-height:0!important;background:none!important;border:0!important;box-shadow:none!important}
  body[data-qx-page="home"] .pm-hero .pm-hero-status .sessionline *{margin-top:0!important}
  body[data-qx-page="home"] #wd-opportunities{margin-top:4px!important;padding-top:12px!important}
  body[data-qx-page="home"] #wd-opportunities>.wd-kicker{display:none}
  body[data-qx-page="home"] #wd-opportunities .prov{font-size:11.5px;gap:4px 10px;margin:4px 0 6px}
  body[data-qx-page="home"] .cl-indices{margin:var(--cl-gap) 16px 0}
  .cl-more{margin:var(--cl-gap) 12px 0;border:1px solid var(--pm-glass-line,rgba(170,192,255,.16));border-radius:18px;background:var(--pm-glass-flat,rgba(20,32,88,.52))}
  .cl-more>summary{display:flex;align-items:center;gap:10px;padding:14px 16px;cursor:pointer;list-style:none;font:var(--cl-h3);color:var(--pm-ink-1,#F4F7FF)}
  .cl-more>summary::-webkit-details-marker{display:none}
  .cl-more>summary small{margin-inline-start:auto;color:var(--text-3);font-size:12px;font-weight:500}
  .cl-more>summary::after{content:'+';font:700 18px/1 var(--pm-num,inherit);color:var(--pm-gold,#F2C46B)}
  .cl-more[open]>summary::after{content:'−'}
  .cl-more>.cl-more-body{padding:0 0 10px}
  .cl-more>.cl-more-body>*{margin-top:12px}
}

/* ---- cards: price/decision dominant, max 2 badges ---- */
.qx .opp .cl-hide{display:none!important}
.qx .opp.cl-open .cl-hide{display:inline-flex!important}
.qx .opp.cl-open .qx-card-split-warning.cl-hide{display:inline-block!important}
.qx .opp .cl-plus{cursor:pointer;font:600 11.5px/1 var(--pm-num,inherit);padding:4px 9px;border-radius:999px;border:1px solid var(--line-2,rgba(150,172,255,.26));background:transparent;color:var(--text-2,#A2B7DC)}
.qx .opp .opp-tags{flex-wrap:wrap;gap:6px}
@media (max-width:760px){
  .qx .opp .opp-tags .chip,.qx .opp .qx-card-split-warning,.qx .opp .qx-news-badge{font-size:11.5px}
  body[data-qx-page="radar"] .qx .opp .gain b{font-size:40px;line-height:1.05}
  .qx .opp .state strong{font-size:15px}
  .qx .opp .last b{font-size:16px}
}

/* ---- scope distinction: «الآن» vs «مراقبة» ---- */
.cl-scope-note{display:flex;align-items:center;gap:8px;margin:8px 0 4px;padding:8px 12px;border-radius:12px;font-size:12.5px;line-height:1.5;color:var(--text-2,#A2B7DC);background:rgba(9,16,52,.45);border:1px solid var(--line-1,rgba(150,172,255,.14))}
.cl-scope-note b{color:var(--pm-ink-1,#F4F7FF);font-weight:700}
.cl-scope-note i{flex:none;width:8px;height:8px;border-radius:50%;background:var(--up,#4AE2AC);box-shadow:0 0 0 4px var(--up-tint,rgba(74,226,172,.13))}
.cl-scope-note.is-watch i{background:transparent;border:2px dashed var(--text-2,#A2B7DC);box-shadow:none;width:10px;height:10px}
.cl-scope-note.is-archive i{background:var(--text-3,#8FA5CC);box-shadow:none}
body[data-cl-scope="watch"] .qx .opp{border-style:dashed!important;border-color:var(--line-3,rgba(150,172,255,.42))!important}
body[data-cl-scope="watch"] .qx .opp .opp-id::after{content:'مراقبة';flex:0 0 auto!important;width:auto!important;min-width:0!important;max-width:max-content;align-self:flex-start;white-space:nowrap;padding:3px 8px;border-radius:8px;font-size:11px;font-weight:700;color:var(--text-2,#A2B7DC);border:1px dashed var(--line-3,rgba(150,172,255,.42))}
body[data-cl-scope="current"] .qx .opp{border-top-color:var(--up,#4AE2AC)}

/* ---- symbol (mobile): «ماذا يرى قبس الآن؟» + levels next to the chart ---- */
.cl-glance{order:-2;margin:0 0 12px;padding:12px 14px;border-radius:16px;background:var(--pm-glass-flat,rgba(20,32,88,.52));border:1px solid var(--pm-glass-line,rgba(170,192,255,.16))}
.cl-glance>span{display:block;font-size:11.5px;color:var(--text-3,#8FA5CC);font-weight:600}
.cl-glance>strong{display:block;margin-top:2px;font:var(--cl-h3);color:var(--pm-ink-1,#F4F7FF)}
.cl-glance>p{margin:4px 0 0;font-size:12.5px;color:var(--text-2,#A2B7DC);line-height:1.6}
.cl-glance .cl-levels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:10px}
.cl-glance .cl-levels div{padding:6px 8px;border-radius:10px;background:rgba(9,16,52,.55);text-align:center}
.cl-glance .cl-levels small{display:block;font-size:10.5px;color:var(--text-3,#8FA5CC)}
.cl-glance .cl-levels b{font:700 14px/1.3 var(--pm-num,inherit);color:var(--pm-ink-1,#F4F7FF)}
.cl-glance a{display:inline-block;margin-top:8px;font-size:12px;color:var(--pm-gold,#F2C46B)}
@media (max-width:760px){
  body[data-qx-page="symbol"] .s-top-redesign{padding-bottom:10px!important}
  body[data-qx-page="symbol"] .s-hero{gap:8px!important}
  body[data-qx-page="symbol"] #sec-chart .symbol-section-head{margin-bottom:6px}
  body[data-qx-page="symbol"] #sec-chart .symbol-section-head .eyebrow,body[data-qx-page="symbol"] #sec-chart .symbol-section-head h2{display:none}
  body[data-qx-page="symbol"] #sec-chart{padding-top:10px!important}
  .cl-glance{position:relative;padding:10px 12px;margin-bottom:10px}
  .cl-glance a{position:absolute;top:9px;inset-inline-end:12px;margin:0}
  .cl-glance .cl-levels{margin-top:8px}
  .cl-glance .cl-levels div{padding:4px 6px}
}
@media (min-width:761px){.cl-glance{display:none}}

/* ---- /splits: history table without horizontal scroll on mobile ---- */
@media (max-width:640px){
  .sp-hist-table{overflow-x:visible}
  .sp-hist-head{display:none!important}
  .sp-hist-row{min-width:0!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;row-gap:4px}
  .sp-hist-row>[role="cell"]:nth-child(n+4){font-size:11px}
  .sp-hist-row>[role="cell"]:nth-child(4)::before{content:'بعد يوم ';color:var(--text-3,#8FA5CC)}
  .sp-hist-row>[role="cell"]:nth-child(5)::before{content:'بعد 5 أيام ';color:var(--text-3,#8FA5CC)}
  .sp-hist-row>[role="cell"]:nth-child(6)::before{content:'بعد 20 يومًا ';color:var(--text-3,#8FA5CC)}
}

/* ---- live bars: smooth marker moves, muted state when no live price ---- */
.track-span,.track-fill,.track-tick,.track-now,.ember,.range-bar u,.range-bar i,.reasoning-frame u{transition:left .6s ease,width .6s ease}
.journey-line .now{transition:left .6s ease,background-color .3s}
.track.is-muted .track-bar{opacity:.4}
.track.is-muted .track-legend::after{content:'لا سعر حي الآن — المؤشر متوقف';grid-column:1/-1;text-align:center;font-size:10.5px;color:var(--text-3,#8FA5CC)}
.range-bar.is-muted{opacity:.4}.range-bar.is-muted i{display:none}
.journey-map.is-muted .journey-line .now{display:none}
.journey-map.is-muted .journey-now-label b{color:var(--text-3,#8FA5CC)}
.journey-map.is-below .journey-line .now{background:var(--down,#FC7690)}

/* ---- level tiles: no half-width orphan (odd last tile spans the row, pairs stay halves) ---- */
.level-signals>.level-signal:last-child{grid-column:auto}
.level-signals>.level-signal:only-child,.level-signals>.level-signal:last-child:nth-child(odd){grid-column:1/-1}

/* premarket nav: 7 items — desktop labels stay on one line */
@media(min-width:760px){.qx .topnav a span{white-space:nowrap}}
.qx .tabbar a[href="/premarket"] span{white-space:nowrap;font-size:10px;letter-spacing:-.01em}
.qx .tabbar a[href="/splits"] span,.qx .tabbar a[href="/split-followup"] span{font-size:10px;line-height:1.25;white-space:normal;text-align:center}

/* grok-20261017 (T8): mobile home — keep a compact value line + CTAs, remove the empty title row,
   and stop index prices from running under the sparkline. Rollback: delete this block. */
@media (max-width:760px){
  body[data-qx-page="home"] .pm-hero .pm-hero-sub{display:block!important;margin:8px auto 0!important;font-size:13.5px!important;line-height:1.7!important;max-width:34em}
  body[data-qx-page="home"] .pm-hero .pm-hero-cta{display:flex!important;gap:8px!important;margin-top:12px!important}
  body[data-qx-page="home"] .pm-hero .pm-hero-cta a{padding:9px 16px!important;font-size:13px!important;min-height:0!important}
}
@media (max-width:1079px){
  body[data-qx-page="home"] .qx .hero-top:has(#qx-hero-text:empty){display:flex;align-items:center;gap:8px;padding-inline:var(--gutter,16px)}
  body[data-qx-page="home"] .qx .hero-top:has(#qx-hero-text:empty) .hero-tools{order:1;flex:1;min-width:0;padding:0}
  body[data-qx-page="home"] .qx .hero-top:has(#qx-hero-text:empty) .hero-head{order:2;flex:0 0 auto;padding:0;gap:0}
  body[data-qx-page="home"] .qx .hero-top:has(#qx-hero-text:empty) .hero-head h1{display:none}
}
@media (max-width:759px){
  #qx-indices .ix{padding-inline-end:10px!important;padding-bottom:30px!important}
  #qx-indices .spark-slot{top:auto!important;bottom:6px!important;transform:none!important;inset-inline:10px!important;width:auto!important;height:20px!important}
}

/* grok-20261017 (T6): CSP is style-src 'self', so the earlier inline style="margin-inline-end:8px" on
   #qx-scr-add was blocked by the browser. Same spacing, from a stylesheet. */
.qx #qx-scr-add{margin-inline-end:8px}

/* deploy3 (2026-10-17): rules moved out of JS-injected <style> elements, which CSP style-src 'self' blocks */
.sp-level{border:1px solid var(--line,#8884);border-inline-start:3px solid #d9a441;border-radius:10px;padding:.5rem .7rem;margin:0 0 .6rem}.sp-level.sp-high{border-inline-start-color:#e07a3f}.sp-level.sp-severe{border-inline-start-color:#d64545}.sp-level b{font-family:var(--font-ar)}.sp-level ul{margin:.3rem 0 0;padding-inline-start:1.1rem;font-size:.8rem;line-height:1.7}
.sd-kind{font-size:.78rem;opacity:.72;margin:.35rem 0 .6rem;line-height:1.7}.sd-machine{font-style:normal;font-size:.72rem;padding:.05rem .45rem;border-radius:999px;border:1px solid currentColor;opacity:.7}
/* gauge colour fallback by band class (inline --gauge-color is applied via data-qs hydrator) */
.moment-gauge.up{--gauge-color:var(--up)}.moment-gauge.down{--gauge-color:var(--down)}.moment-gauge.watch{--gauge-color:var(--warn)}
/* deploy4 (2026-10-17): lightweight-charts 4.2.3 injects a <style> for its TradingView attribution logo,
   which CSP style-src 'self' blocks; same rules copied verbatim so the required attribution renders as designed */
a#tv-attr-logo{--fill:#131722;--stroke:#fff;position:absolute;left:10px;bottom:10px;height:19px;width:35px;margin:0;padding:0;border:0;z-index:3;}a#tv-attr-logo[data-dark]{--fill:#D1D4DC;--stroke:#131722;}
/* deploy5 (2026-10-17e): opportunity-card overflow fix. The deploy2 peak line made the .gain column
   take the whole card so .last ('آخر سعر' + sparkline) collapsed to 0px and spilled into the next card.
   .gain now shrinks, .last keeps its own auto column, and each card clips as a safety net
   (the carousel scrolls on .deck, not on .opp). */
.qx .opp{overflow:hidden;grid-template-columns:minmax(0,1fr)}
.qx .opp>*,.qx .opp .opp-native-open>*{min-width:0}
.qx .opp .opp-native-open{grid-template-columns:minmax(0,1fr)}
.qx .opp .opp-foot{min-width:0;flex-wrap:wrap}
.qx .opp .opp-main{min-width:0}
.qx .opp .gain{min-width:0}
.qx .opp .last{min-width:0}
.qx .opp .gain .pm-peak.pm-peak-sub{display:block;width:auto;min-width:0;margin:6px 0 0;line-height:1.5}
.qx .opp .gain .pm-peak.pm-peak-sub span{display:inline;color:var(--text-3,#9AA8CC);font-size:11.5px;font-weight:500}
.qx .opp .gain .pm-peak.pm-peak-sub b{display:inline-block;margin-inline-start:4px;color:var(--text-2,#B9C6E6);text-shadow:none}
/* deploy5: phones/tablets (<=759px, the site's mobile breakpoint) — stack the price row under the change figure so neither column can squeeze or
   overlap the other, and let the route chips take their own row under the ticker. */
@media (max-width:759px){
.qx .opp .opp-main{grid-template-columns:minmax(0,1fr);gap:8px}
.qx .opp .last{grid-template-columns:minmax(0,1fr) auto;align-items:end;justify-items:stretch;gap:10px;width:100%}
.qx .opp .last .spark-slot{width:100%;max-width:none;min-width:0}
.qx .opp .last>span:not(.spark-slot){white-space:nowrap;justify-self:end}
.qx .opp .opp-id{grid-template-columns:auto minmax(0,1fr)}
.qx .opp .opp-id .opp-tags{grid-column:1/-1;flex-direction:row;justify-content:flex-start;align-items:center}
}

/* ===== grok-20261017f (UX6): proof first, indices after board, genuinely-empty sections hidden ===== */
.qx section.qx-blank[hidden]{display:none!important}
.qx .hero .proof.proof-top{margin:10px var(--gutter,16px) 6px}
.qx .hero .proof.proof-top .txt>span{line-height:1.55}
@media (min-width:760px){
  .pm-home .qx #wd-opportunities + .marketrow.pm-indices-row{margin:26px auto 30px!important}
}
@media (min-width:1080px){
  .workspace-home .qx #qx-harvest .harvest-v2>.best{grid-row:span 2}
  .workspace-home .qx #qx-harvest .harvest-v2>.harvest-unknown,.workspace-home .qx #qx-harvest .harvest-v2>.harvest-note{align-self:start}
  .pm-home .qx .wd-reading-grid .stack>.wd-monitor.qx-blank + .pm-cal{grid-row:1/span 2;align-self:start}
}
/* «تقاطعات تستحق انتباهك»: a single item keeps a card width instead of stretching across the row */
.qx #qx-attention .intel{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));align-items:start}
@media (max-width:759px){
  .qx #qx-attention .intel{grid-template-columns:minmax(0,1fr)}
  body[data-qx-page="home"] #qx-main>.cl-direct{margin:var(--cl-gap,14px) 12px 0}
}

/* Z5/Z15: a recorded entry confirmation separate from the radar nomination and older execution engine. */
.qx .zcombo-confirmation{display:grid;gap:4px;margin:9px 0;padding:9px 11px;border:1px solid rgba(33,193,151,.47);border-radius:12px;background:rgba(10,116,89,.13);color:#dcfff3;line-height:1.5}
.qx .zcombo-confirmation b{font-size:.84rem;font-weight:750}
.qx .zcombo-confirmation small{font-size:.76rem;color:#a7d5c8;unicode-bidi:plaintext}

.qx .microflow-mark{display:grid;gap:3px;margin:8px 0;padding:8px 10px;border:1px solid rgba(148,163,184,.32);border-radius:11px;background:rgba(70,82,105,.13);color:#d7e5f1}
.qx .microflow-mark.is-absorption{border-color:rgba(250,151,66,.55);background:rgba(145,83,20,.17);color:#ffdab0}
.qx .microflow-mark.is-eating{border-color:rgba(52,211,153,.50);background:rgba(22,139,107,.15);color:#b1f6d9}
.qx .microflow-mark b{font-size:.83rem}
.qx .microflow-mark small{font-size:.74rem;opacity:.88}