/* غلاف javascript-logic-book — مستخرج آليًّا من styles.css الكاتب بـimport-standalone-book.php. لا يُحرَّر يدويًّا. */
@font-face{font-family:'Fira Code';font-style:normal;font-weight:400;font-display:swap;src:url('../assets/fonts/FiraCode-latin.woff2') format('woff2');unicode-range:U+0000-00FF}
.qtc-javascript-logic-book{--font-mono:'Fira Code', 'Courier New', monospace;--color-text-muted:#a8a29e;--color-primary:#f39c12;--font-sans:'Cairo', system-ui, sans-serif;font-family:var(--font-sans,'Cairo',system-ui,sans-serif);direction:rtl}
.qtc-javascript-logic-book .landing__cover{margin: 0 auto 1.75rem; display: flex; flex-direction: column; align-items: center; gap: .9rem;}
.qtc-javascript-logic-book .cover{--cover-w: 210px; --cover-h: 285px; position: relative; width: var(--cover-w); height: var(--cover-h); perspective: 1100px;}
.qtc-javascript-logic-book .cover__book{position: relative; width: 100%; height: 100%; transform: rotateY(16deg) rotateX(4deg); transform-style: preserve-3d; transition: transform .7s cubic-bezier(.22, 1, .36, 1);}
.qtc-javascript-logic-book .cover:hover .cover__book{transform: rotateY(0deg) rotateX(0deg) translateY(-6px);}
.qtc-javascript-logic-book .cover__spine{position: absolute; top: 0; right: -13px; width: 14px; height: 100%; border-radius: 0 5px 5px 0; background: linear-gradient(180deg, #b8720a, #8a5407 55%, #6a4005); box-shadow: inset 3px 0 6px rgba(0, 0, 0, .35);}
.qtc-javascript-logic-book .cover__face{position: relative; width: 100%; height: 100%; overflow: hidden; border-radius: 12px 4px 4px 12px; background: radial-gradient(120% 90% at 15% 0%, rgba(255, 255, 255, .3), transparent 60%), linear-gradient(155deg, #f7c948 0%, #f39c12 55%, #d9860b 100%); box-shadow: 0 22px 45px -12px rgba(140, 90, 0, .45), 0 3px 10px rgba(15, 23, 42, .18), inset 0 0 0 1px rgba(255, 255, 255, .2); padding: .9rem 1rem; display: flex; flex-direction: column; color: #1c1917;}
.qtc-javascript-logic-book .cover__dots{position: absolute; inset: 0; background-image: radial-gradient(rgba(0, 0, 0, .12) 1px, transparent 1.4px); background-size: 14px 14px; mask-image: radial-gradient(120% 80% at 80% 100%, #000, transparent 70%); -webkit-mask-image: radial-gradient(120% 80% at 80% 100%, #000, transparent 70%); pointer-events: none;}
.qtc-javascript-logic-book .cover__sheen{position: absolute; top: -60%; left: -70%; width: 55%; height: 220%; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .4), transparent); transform: rotate(18deg); animation: qtc-javascript-logic-book-cover-sheen 7s ease-in-out infinite; pointer-events: none;}
.qtc-javascript-logic-book .cover__term{background: #0b1220; border-radius: 8px; overflow: hidden; box-shadow: 0 8px 20px -6px rgba(0, 0, 0, .5); margin-bottom: auto; direction: ltr; text-align: left; font-family: var(--font-mono); font-size: .66rem; position: relative; z-index: 1;}
.qtc-javascript-logic-book .cover__term-bar{display: flex; gap: .3rem; padding: .35rem .5rem; background: #1e293b;}
.qtc-javascript-logic-book .cover__term-bar span{width: 7px; height: 7px; border-radius: 50%; background: #f87171;}
.qtc-javascript-logic-book .cover__term-bar span:nth-child(2){background: #fbbf24;}
.qtc-javascript-logic-book .cover__term-bar span:nth-child(3){background: #34d399;}
.qtc-javascript-logic-book .cover__term-body{padding: .5rem .6rem .55rem; color: #e2e8f0; line-height: 1.7;}
.qtc-javascript-logic-book .cover__p{color: #f7c948;}
.qtc-javascript-logic-book .cover__s{color: #86efac;}
.qtc-javascript-logic-book .cover__ln--out{color: #94a3b8; padding-left: .8rem;}
.qtc-javascript-logic-book .cover__cursor{display: inline-block; width: 7px; height: .85em; background: #f7c948; vertical-align: -2px; animation: qtc-javascript-logic-book-cover-blink 1s steps(1, end) infinite;}
.qtc-javascript-logic-book .cover__title{font-size: 1.9rem; font-weight: 800; line-height: 1.15; margin: .6rem 0 .35rem; direction: ltr; text-align: left; letter-spacing: -.02em; text-shadow: 0 2px 10px rgba(120, 70, 0, .2); position: relative; z-index: 1;}
.qtc-javascript-logic-book .cover__tag{align-self: flex-start; font-family: var(--font-mono); font-size: .68rem; font-weight: 700; letter-spacing: .1em; padding: .2rem .6rem; border-radius: 999px; border: 1px solid rgba(28, 25, 23, .4); background: rgba(255, 255, 255, .22); direction: ltr; position: relative; z-index: 1;}
.qtc-javascript-logic-book .cover__shadow{position: absolute; bottom: -16px; left: 8%; width: 84%; height: 22px; border-radius: 50%; background: rgba(140, 90, 0, .3); filter: blur(13px); transition: transform .7s cubic-bezier(.22, 1, .36, 1), opacity .7s;}
.qtc-javascript-logic-book .cover:hover .cover__shadow{transform: scale(.92); opacity: .75;}
.qtc-javascript-logic-book .cover__note{font-size: .78rem; color: var(--color-text-muted); display: flex; align-items: center; gap: .4rem;}
.qtc-javascript-logic-book .cover__note i{color: var(--color-primary);}
@media (prefers-reduced-motion: reduce){.qtc-javascript-logic-book .cover__sheen, .qtc-javascript-logic-book .cover__cursor, .qtc-javascript-logic-book .page{animation: none !important;}.qtc-javascript-logic-book .cover__book, .qtc-javascript-logic-book .cover__shadow, .qtc-javascript-logic-book .progress-bar__fill{transition: none !important;}}
@keyframes qtc-javascript-logic-book-cover-sheen{0%, 62% { left: -70%; } 88%, 100% { left: 130%; }}
@keyframes qtc-javascript-logic-book-cover-blink{50% { opacity: 0; }}