*{box-sizing:border-box}html{direction:rtl}
body{margin:0;background:var(--paper);color:var(--ink);font:400 var(--t-body)/var(--lh-body) var(--f-body)}
h1,h2,h3{font-family:var(--f-display);line-height:var(--lh-tight);margin:0;font-weight:800}
h1{font-size:var(--t-hero)}h2{font-size:var(--t-h2)}h3{font-size:var(--t-h3);font-weight:700}
p{margin:0}a{color:inherit}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:6px}
.wrap{max-width:1160px;margin:0 auto;padding:0 var(--gap)}
/* أزرار */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:var(--tap);padding:0 var(--s5);
 border:var(--bw) solid var(--ink);border-radius:var(--r-pill);background:var(--sun);color:var(--ink);font:600 1rem var(--f-body);text-decoration:none;cursor:pointer;
 transition:transform var(--d2) var(--ease-pop),background var(--d1)}
.btn:hover{transform:translateY(-3px) rotate(var(--tilt))}.btn:active{transform:scale(.96)}
.btn.sec{background:var(--card)}.btn.tang{background:var(--tang)}
/* وسوم */
.tag{display:inline-flex;align-items:center;min-height:28px;padding:0 var(--s3);border:var(--bw) solid var(--ink);border-radius:var(--r-pill);font-size:var(--t-tag);font-weight:500;background:var(--card)}
.tag.sun{background:var(--sun-s)}.tag.mint{background:var(--mint-s)}.tag.berry{background:var(--berry-s)}.tag.sky{background:var(--sky-s)}.tag.tang{background:var(--tang-s)}
/* بطاقة الحكاية */
.story{position:relative;display:flex;flex-direction:column;gap:var(--s4);padding:var(--pad);border:var(--bw) solid var(--ink);border-radius:var(--r-l);background:var(--c,var(--card));color:var(--ink);text-decoration:none;
 transition:transform var(--d2) var(--ease-pop)}
.story:hover{transform:translateY(-4px) rotate(var(--tilt))}
.story .art{border:var(--bw) solid var(--ink);border-radius:var(--r-m);background:var(--card);display:grid;place-items:center;aspect-ratio:16/10;overflow:hidden}
.story .art svg{width:min(70%,220px);height:auto}
.story .kicker{font-size:var(--t-tag);font-weight:600;color:var(--ink-2)}
.story h3{font-size:var(--t-h2)}
.story .tags{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:auto}
.story .more{font-weight:600;display:inline-flex;gap:var(--s2);align-items:center}
.story.big{display:grid;gap:var(--s5)}
@media(min-width:820px){.story.big{grid-template-columns:1.1fr .9fr;align-items:center}.story.big .art{aspect-ratio:4/3;order:2}}
/* ملصق إحصاء */
.sticker{display:inline-grid;place-items:center;text-align:center;padding:var(--s4) var(--s5);border:var(--bw) solid var(--ink);border-radius:var(--r-m);background:var(--c,var(--sun));transform:rotate(var(--tilt))}
.sticker b{font:800 2rem/1 var(--f-display)}.sticker span{font-size:var(--t-small)}
/* رأس الفصل */
.chapter{display:flex;align-items:center;gap:var(--s4);margin:var(--s8) 0 var(--s5)}
.chapter .no{display:grid;place-items:center;width:56px;height:56px;border:var(--bw) solid var(--ink);border-radius:50%;background:var(--sun);font:800 1.5rem var(--f-display);flex:none}
.chapter .rule{flex:1;height:0;border-top:var(--bw) dashed var(--ink)}
/* الشريط العلوي */
.nav{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);padding:var(--s4) 0}
.logo{display:inline-flex;align-items:center;gap:var(--s3);font:800 1.5rem var(--f-display);text-decoration:none}
.logo i{display:grid;place-items:center;width:44px;height:44px;border:var(--bw) solid var(--ink);border-radius:14px;background:var(--tang);font-style:normal;transform:rotate(var(--tilt))}
/* لوحة (قول الكاتب) */
.say{position:relative;padding:var(--s5);border:var(--bw) solid var(--ink);border-radius:var(--r-l);background:var(--card);font-size:1.15rem}
.say::after{content:"";position:absolute;inset-inline-start:36px;bottom:-14px;width:24px;height:24px;background:var(--card);border-inline-end:var(--bw) solid var(--ink);border-bottom:var(--bw) solid var(--ink);transform:rotate(45deg)}
/* الشبكة المتنوعة (ليست كلها طولية) */
.grid{display:grid;gap:var(--gap);grid-template-columns:1fr}
@media(min-width:640px){.grid{grid-template-columns:repeat(2,1fr)}.grid>.w6,.grid>.w4{grid-column:span 2}}
@media(min-width:1000px){.grid{grid-template-columns:repeat(6,1fr)}.grid>.w2{grid-column:span 2}.grid>.w3{grid-column:span 3}.grid>.w4{grid-column:span 4}.grid>.w6{grid-column:span 6}}
/* حقل وتصفية */
.field{min-height:var(--tap);padding:0 var(--s4);border:var(--bw) solid var(--ink);border-radius:var(--r-m);background:var(--card);font:400 1rem var(--f-body);color:var(--ink)}
.chips{display:flex;gap:var(--s2);overflow-x:auto;padding-bottom:var(--s2)}
.chips .tag{white-space:nowrap;cursor:pointer;min-height:var(--tap)}
.chips .tag[aria-pressed=true]{background:var(--ink);color:var(--card)}
/* ظهور القصة عند التمرير */
.rise{animation:rise var(--d3) var(--ease-out) both}@keyframes rise{from{opacity:0;transform:translateY(18px)}}
footer.end{margin:var(--s8) 0 var(--s7);padding:var(--s6);border:var(--bw) solid var(--ink);border-radius:var(--r-l);background:var(--sun);display:flex;flex-wrap:wrap;gap:var(--s4);justify-content:space-between;align-items:center}