/* Candidate additions use the current site's palette and typography. */
.zm-real-page{display:grid;grid-template-columns:1.15fr .85fr;gap:32px;align-items:center;background:#eef2ef;border:1px solid #dbdcd2;border-radius:20px;padding:28px!important}
.zm-real-page h2,.zm-next-worksheet h2{color:#173b4b;font-size:clamp(24px,3vw,31px);line-height:1.5}
.zm-real-page p{line-height:1.9;margin-block:14px 24px}
.zm-real-page-image{display:block;max-inline-size:290px;justify-self:center;box-shadow:0 12px 32px #173b4b1a;background:#fff}
.zm-real-page-image img{display:block;inline-size:100%;block-size:auto}
.zm-sample-link{display:block;margin-block-start:18px;color:#7b3546;font-weight:700}
.zm-next-worksheet{padding:24px;border:1px solid #dbdcd2;border-radius:18px;background:#f3f1ea;margin-block:24px}
.zm-work-field{display:block;margin-block:18px;font-weight:700}
.zm-work-field input,.zm-work-field textarea{box-sizing:border-box;display:block;inline-size:100%;max-inline-size:100%;margin-block-start:7px;padding:12px;border:1px solid #8b999b;border-radius:8px;font:inherit;font-weight:400;background:#FFFEFA;color:#173b4b;min-block-size:48px}
.zm-work-actions,.zm-work-suggestions{display:flex;gap:10px;flex-wrap:wrap;margin-block-start:16px}
.zm-work-suggestions button{white-space:normal;max-inline-size:100%;min-block-size:44px}
.zm-hero-sound{position:absolute;inset-inline-start:14px;inset-block-end:14px;z-index:4;border:1px solid #ffffff88;border-radius:30px;background:#173b4bee;color:#FFFEFA;padding:8px 16px;min-block-size:44px;font:700 15px/1.5 inherit;cursor:pointer}
#library-selected{max-inline-size:1100px;margin-inline:auto;padding-inline:16px;overflow:hidden;color:#173b4b}
#library-selected .zm-feature-layout{align-items:center}
#library-selected .zm-fan-card{background:#FFFEFA;overflow:hidden}
#library-selected .zm-feature-controls,#library-selected .zm-feature-dots{display:flex;align-items:center;justify-content:center;gap:12px}
#library-selected .zm-feature-dots button{border:0;border-radius:24px;background:#dbdcd2;min-block-size:36px;cursor:pointer}
#library-selected .zm-feature-dots button[aria-pressed=true]{background:#7b3546}
#library-selected .zm-feature-detail a{color:#7b3546;font-weight:700}
#library-selected [data-feature-announcement]{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:640px){.zm-real-page{grid-template-columns:1fr;gap:24px;padding:22px 18px!important}.zm-real-page-image{max-inline-size:235px}.zm-next-worksheet{padding:18px 14px}.zm-real-page .zm-btn,.zm-work-actions .zm-btn{inline-size:100%;text-align:center}.zm-hero-sound{font-size:13px;inset-block-end:10px;inset-inline-start:10px}#library-selected .zm-feature-controls{display:none}}
@media print{.zm-work-suggestions,.zm-work-actions,.zm-hero-sound{display:none!important}.zm-next-worksheet{break-inside:avoid;border:1px solid #999;background:#fff}.zm-work-field input,.zm-work-field textarea{border:0;background:#fff}}
.library-browser:has(.zm-library-hand) .zrd-swipe-controls{display:none!important}
#article-grid.zm-library-hand{display:block!important;position:relative;overflow:hidden!important;min-height:0;scroll-snap-type:none!important;touch-action:pan-y pinch-zoom;padding:0!important;isolation:isolate;cursor:grab}
#article-grid.zm-library-hand .article-card{position:absolute!important;left:50%;top:20px;inline-size:360px!important;max-inline-size:74%!important;min-inline-size:0!important;margin:0!important;transform-origin:50% 105%;transition:transform .32s cubic-bezier(.22,.8,.25,1),opacity .16s;box-shadow:0 20px 30px -20px #173b4b99;scroll-snap-align:none!important}
#article-grid.zm-library-hand .article-card[hidden]{display:none!important}
#article-grid.zm-library-hand .card-picture{display:block;pointer-events:auto}
#article-grid.zm-library-hand img{-webkit-user-drag:none;user-select:none}
#article-grid.zm-library-hand.is-dragging .article-card{transition:none!important}
.zm-library-hand-controls{display:flex;justify-content:center;align-items:center;gap:24px;margin-block:0 30px}
.zm-library-hand-controls button{font:inherit;color:#173b4b;background:#FFFEFA;border:1px solid #dbdcd2;border-radius:24px;min-height:44px;padding:8px 20px;cursor:pointer}
@media(max-width:600px){#article-grid.zm-library-hand .article-card{max-inline-size:78%!important}.zm-library-hand-controls{gap:18px}}
@media(prefers-reduced-motion:reduce){#article-grid.zm-library-hand .article-card{transition:none!important}}
.zm-newsletter-offer{box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr) 210px;gap:36px;align-items:center;background:#f3f1ea;border:1px solid #d8ddd7;border-radius:22px;padding:34px;margin-block:36px;color:#173b4b;max-inline-size:100%;scroll-margin-block-start:100px}
.zm-newsletter-offer *{box-sizing:border-box}
.zm-newsletter-offer .zm-newsletter-eyebrow{font-size:14px;font-weight:700;color:#7b3546;margin:0 0 8px}
.zm-newsletter-offer h2{font-size:clamp(24px,3vw,32px);line-height:1.45;color:#173b4b;margin:0 0 14px}
.zm-newsletter-offer p{line-height:1.85;margin-block:10px 16px}
.zm-newsletter-offer ul{list-style:none;margin:14px 0 22px;padding:0;display:grid;gap:6px}
.zm-newsletter-offer li:before{content:'✓';color:#7b3546;font-weight:700;margin-inline-end:9px}
.zm-newsletter-open,.zm-newsletter-download>a{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-block-size:50px;padding:13px 22px;border:0;border-radius:12px;background:#7b3546;color:#FFFEFA!important;font:700 17px/1.6 inherit;text-decoration:none!important;cursor:pointer}
.zm-newsletter-open:hover,.zm-newsletter-download>a:hover{background:#612a38}
.zm-newsletter-offer :is(a,button):focus-visible{outline:3px solid #173b4b;outline-offset:4px}
.zm-newsletter-offer .zm-newsletter-note{font-size:13px;line-height:1.8;color:#526568;margin-block:12px 0}
.zm-newsletter-paper{display:block;background:#FFFEFA;transform:rotate(-3deg);padding:9px;border:1px solid #d8ddd7;border-radius:7px;box-shadow:0 15px 26px -15px #173b4b70;text-decoration:none;color:#7b3546;max-inline-size:210px;justify-self:center}
.zm-newsletter-paper img{display:block;inline-size:100%;block-size:auto}
.zm-newsletter-paper span{display:block;text-align:center;padding:9px 0 2px;font-weight:700;font-size:14px}
.zm-newsletter-join{grid-column:1/-1;border-block-start:1px solid #d8ddd7;padding-block-start:24px;min-inline-size:0}
.zm-newsletter-join[hidden]{display:none!important}
.zm-newsletter-join h3{font-size:22px;line-height:1.6;margin:0;color:#173b4b}
.zm-newsletter-download{padding:22px;background:#FFFEFA;border-radius:14px;margin-block-end:26px}
.zm-newsletter-form{max-inline-size:640px;margin-inline:auto}
.zm-newsletter-frame-slot iframe{display:block;inline-size:100%;block-size:720px;border:0;background:#fff;border-radius:14px}
.zm-newsletter-note a{color:#7b3546;text-decoration:underline}
@media(max-width:640px){.zm-newsletter-offer{grid-template-columns:minmax(0,1fr);padding:24px 18px;gap:24px;margin-block:26px}.zm-newsletter-paper{max-inline-size:156px;grid-row:1}.zm-newsletter-offer h2{font-size:26px}.zm-newsletter-open{inline-size:100%;font-size:16px}.zm-newsletter-copy ul{font-size:15px}.zm-newsletter-frame-slot iframe{block-size:830px}.zm-newsletter-download{padding:18px 14px}}
@media print{.zm-newsletter-offer{display:none!important}}
/* Theme article typography must not add article-heading spacing to this compact offer. */
.zm-newsletter-offer h2{font-size:clamp(24px,3vw,32px)!important;line-height:1.45!important;margin:0 0 14px!important}
.zm-newsletter-offer .zm-newsletter-eyebrow{font-size:14px!important;margin:0 0 10px!important;color:#7b3546!important}
.zm-newsletter-offer .zm-newsletter-note{font-size:13px!important;margin:12px 0 0!important;line-height:1.8!important}
.zm-newsletter-open{font-family:inherit;font-size:17px;font-weight:700;line-height:1.6}
@media(max-width:640px){.zm-newsletter-offer{position:relative}.zm-newsletter-paper{position:absolute;inset-inline-end:18px;inset-block-start:22px;inline-size:84px;padding:5px;transform:rotate(-3deg)}.zm-newsletter-paper span{display:none}.zm-newsletter-copy>.zm-newsletter-eyebrow,.zm-newsletter-copy>h2{margin-inline-end:108px!important}.zm-newsletter-offer h2{font-size:24px!important;min-block-size:104px}.zm-newsletter-copy>p:not(.zm-newsletter-note):not(.zm-newsletter-eyebrow){font-size:16px!important;line-height:1.85!important}.zm-newsletter-offer ul{margin-block:12px 18px!important;gap:4px}.zm-newsletter-open{font-size:15px}}

/* The transformed hand owns horizontal gestures; the page retains vertical scroll.
   Override the older, more-specific native-scroll library selector, regardless of load order. */
[data-zrd-library] #article-grid.zrd-swipe-ready.zm-library-hand{
 display:block!important;
 touch-action:pan-y pinch-zoom!important;
 user-select:none;
}

/* library integration */
/* Uses the existing Tajawal, ivory, ink and burgundy identity. */
.zml-practical,.zmc-next{border-inline-start:4px solid #8c263b;padding:1rem 1.2rem;background:#f5f0e7;margin-block:1.3rem;border-radius:0 12px 12px 0}
.zmc-next h2,.zml-practical h2{font-size:1.2em;margin-block:0 .5rem}
.zmc-next p:last-child,.zml-practical p:last-child{margin-bottom:0}
.zmc-flow{list-style:none;padding:0;display:grid;gap:.75rem;counter-reset:stage;margin-block:1rem 1.5rem}
.zmc-flow li{counter-increment:stage;position:relative;border:1px solid #d9d3c7;border-radius:12px;padding:1rem 3.3rem 1rem 1rem;background:#fffefa}
.zmc-flow li:before{content:counter(stage);position:absolute;right:.9rem;top:1rem;width:1.7rem;height:1.7rem;border-radius:50%;background:#173042;color:#fff;text-align:center;line-height:1.7rem}
.zmc-flow strong,.zmc-flow span{display:block}.zmc-flow span{font-size:.95em;margin-top:.25rem}
.zmc-pnp-choice{border-block-end:1px solid #d9d3c7;padding-block:1rem}.zmc-pnp-choice summary{font-weight:700;font-size:1.15em;cursor:pointer;padding:.7rem .2rem;min-height:44px}
.zmc-pnp-choice[open]{padding-bottom:1.5rem}.zmc-status{display:inline-block;font-size:.9em;background:#f4ede0;border-radius:5px;padding:.2rem .5rem;color:#173042}
.zmc-note{font-size:.95em;color:#48545b}.zmc-links{display:flex;gap:.6rem 1.2rem;flex-wrap:wrap;margin-block:.7rem}.zmc-links a{min-height:44px;display:inline-flex;align-items:center}
.zmc-reading{max-width:760px;margin:auto;padding:1.2rem;line-height:1.9;font-size:19px}.zmc-reading img{max-width:100%;height:auto}.zmc-reading h1{line-height:1.45}.zmc-reading h2{scroll-margin-top:100px;line-height:1.5;margin-top:2rem}.zmc-reading li{margin-block:.55rem}
.zmc-library-more{display:block;margin:.7rem 0;padding:.5rem;min-height:44px}.zmc-reader-close{position:sticky;top:0;z-index:3;background:#fffefa;padding:.5rem;border-bottom:1px solid #d9d3c7}.zmc-reader-close button{font:inherit;min-height:44px;cursor:pointer}
.zmc-mobile-filter{display:none}.zmc-pnp-steps label{display:flex;align-items:flex-start;gap:.6rem;cursor:pointer;padding:.3rem 0}.zmc-pnp-steps input{flex:0 0 20px;width:20px;height:20px;margin-top:.4rem;accent-color:#8c263b}
@media(max-width:849px){.library-intro{padding-block:1rem!important;gap:.7rem!important}.library-intro>img{max-height:110px;width:100%;object-fit:cover}.library-intro h1{font-size:1.65rem!important}.library-intro p{font-size:1rem;line-height:1.65}.zmc-mobile-filter{display:grid;gap:.3rem;margin-block:.8rem}.zmc-mobile-filter select{font:inherit;background:#fffefa;color:#173042;border:1px solid #173042;border-radius:10px;padding:.6rem;min-height:48px;width:100%}[data-zrd-library] [aria-label="مسارات القراءة"]{display:none!important}.zmc-reading{font-size:18px;padding:1rem}.zmc-reading h1{font-size:1.6rem}.zmc-flow li{padding-inline-start:3rem;padding-inline-end:.8rem}.zml-practical,.zmc-next{padding:1rem}.zmc-pnp-choice summary{font-size:1.05em}}
@media(prefers-reduced-motion:reduce){.zmc-flow *{scroll-behavior:auto}}
/* «ورقة الطريق» top band (owner 28 Oct 2026): ivory card, gold thread, site tokens; burgundy only for the selected topic.
   One movement, on tap only (the true/false card opens like a page); none with reduced motion. */
.zm-band.zm-band-smart{background:var(--mist,#EEF2EF);border-block-end:1px solid var(--line,#DBDCD2);color:var(--ink,#173B4B)}
.zm-band-smart .zm-wrap{display:block;padding-block:12px}
.zm-paper{position:relative;display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;background:var(--paper,#FFFEFA);border:1px solid var(--line,#DBDCD2);border-radius:14px;padding:12px 18px 12px 14px;color:var(--ink,#173B4B);text-decoration:none;box-shadow:0 12px 20px -18px #173B4B80}
.zm-paper::before{content:"";position:absolute;inset-inline-start:0;top:12px;bottom:12px;width:3px;border-radius:3px;background:#B98A3C}
a.zm-paper:hover .zm-paper-text{text-decoration:underline;text-underline-offset:4px}
.zm-paper-text{flex:1 1 220px;font-size:15px;line-height:1.65}
.zm-paper-cta{font-weight:700;white-space:nowrap}
.zm-resume .zm-paper-text{flex-basis:100%}
.zm-thread{flex:1 1 160px;display:flex;justify-content:space-between;align-items:center;height:14px;background:linear-gradient(#B98A3C,#B98A3C) center/100% 2px no-repeat}
.zm-thread i{width:11px;height:11px;border-radius:50%;background:var(--paper,#FFFEFA);border:2px solid #B98A3C;box-sizing:border-box}
.zm-thread i.done{background:#B98A3C}
.zm-thread i.now{width:14px;height:14px;background:var(--ink,#173B4B);border-color:var(--ink,#173B4B);box-shadow:0 0 0 4px #B98A3C40}
.zm-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.zm-cal{flex:none;display:grid;width:54px;border:1px solid var(--line,#DBDCD2);border-radius:10px;overflow:hidden;background:#fff;text-align:center}
.zm-cal b{font-size:24px;line-height:1.35;color:var(--ink,#173B4B)}
.zm-cal small{background:var(--ink,#173B4B);color:#fff;font-size:11px;line-height:1.8}
.zm-left{display:block;font-weight:700}
.zm-fold{display:block}
.zm-kicker{font-size:13px;font-weight:700;color:var(--muted,#546570)}
.zm-claim{margin:2px 0 10px;font-size:16px;font-weight:700;line-height:1.6}
.zm-myth-btn{font:inherit;font-size:14px;min-height:40px;padding:4px 18px;border-radius:999px;border:1.5px solid var(--ink,#173B4B);background:transparent;color:var(--ink,#173B4B);cursor:pointer}
.zm-fold-inside{margin-top:10px;padding-top:10px;border-top:1px dashed #B98A3C;display:grid;gap:8px;transform-origin:top center}
.zm-fold-inside[hidden]{display:none}
.zm-answer{display:flex;justify-content:space-between;gap:10px;color:var(--ink,#173B4B);text-decoration:none;font-weight:700;line-height:1.65}
.zm-share{justify-self:start;color:var(--ink,#173B4B);font-size:14px;text-decoration:underline;text-underline-offset:4px}
@media(prefers-reduced-motion:no-preference){.zm-fold.is-open .zm-fold-inside{animation:zm-unfold 380ms cubic-bezier(.22,.8,.25,1)}}
@keyframes zm-unfold{from{transform:perspective(700px) rotateX(-80deg);opacity:0}to{transform:none;opacity:1}}
.zm-smart-tools{display:flex;justify-content:space-between;gap:8px;margin-top:6px}
.zm-smart-open,.zm-smart-hide{font:inherit;font-size:14px;min-height:40px;padding:0 2px;border:0;background:transparent;color:var(--ink,#173B4B);text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.zm-smart-topics{margin-top:4px;display:grid;gap:8px}
.zm-smart-topics[hidden]{display:none}
.zm-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.zm-chips button{font:inherit;font-size:15px;min-height:40px;padding:4px 14px;border-radius:999px;border:1.5px solid var(--ink,#173B4B);background:var(--paper,#FFFEFA);color:var(--ink,#173B4B);cursor:pointer}
.zm-chips button[aria-pressed="true"]{background:var(--primary,#7B3546);border-color:var(--primary,#7B3546);color:#fff;font-weight:700}
.zm-topic-answer{display:grid;gap:6px}
.zm-topic-answer a{display:flex;justify-content:space-between;gap:10px;align-items:baseline;padding:8px 12px;border-radius:10px;background:var(--paper,#FFFEFA);border:1px solid var(--line,#DBDCD2);color:var(--ink,#173B4B);text-decoration:none;font-size:15px;line-height:1.6}
.zm-smart :focus-visible{outline:3px solid #B98A3C;outline-offset:2px}
/* The old band greys its links when the notice is expired («.zm-band[data-state=expired] a»); not inside the card. */
.zm-band.zm-band-smart[data-state] .zm-smart a{color:var(--ink,#173B4B);font-weight:400;width:auto}
.zm-band.zm-band-smart[data-state] .zm-smart a.zm-paper{display:flex;width:100%}
.zm-band.zm-band-smart[data-state] .zm-smart .zm-answer{display:flex;font-weight:700}
.zm-band.zm-band-smart[data-state] .zm-smart .zm-share{display:inline;justify-self:start}
.zm-band.zm-band-smart[data-state] .zm-smart .zm-topic-answer a{display:flex}
/* Library card motion (owner rule, 28 Oct 2026): same glide as the home «مواضيع مختارة» cards on every width.
   Must beat «body.zl-chrome #main .article-card» (1,2,1), which left desktop with a border-color transition only. */
body #main #article-grid.zm-library-hand .article-card{transition:transform 340ms cubic-bezier(.22,.8,.25,1),opacity 180ms linear}
body #main #article-grid.zm-library-hand.is-dragging .article-card{transition:none}
@media(prefers-reduced-motion:reduce){body #main #article-grid.zm-library-hand .article-card{transition:none!important}}

/* EE doors drawing: fixed open box, no fold (owner 28 Oct 2026) */
.cc-visual .cc-visual-box{border:1px solid var(--line);border-radius:14px;margin-block:14px;overflow:hidden}
.cc-visual .cc-visual-flow{margin:0;padding:12px 16px;color:var(--primary);font-size:16px;font-weight:700;border-block-end:1px solid var(--line)}
@media(max-width:600px){.cc-visual .cc-visual-flow{font-size:14px;padding-inline:10px}}

/* Guide card (owner 28 Oct 2026): one per page, after the answer; the page picture fades out so only its start shows */
.zm-gcard{display:grid;grid-template-columns:180px 1fr;gap:16px;align-items:start;margin-block:24px;padding:16px;background:var(--paper,#FFFEFA);border:1px solid var(--line,#E3DDD0);border-inline-start:3px solid #B98A3C;border-radius:12px;text-align:start}
.zm-gcard-pic{position:relative;display:block;overflow:hidden;border:1px solid var(--line,#E3DDD0);border-radius:6px;background:#fff}
.zm-gcard-pic img{display:block;width:100%;height:auto}
.zm-gcard-pic::after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(rgba(255,254,250,0),var(--paper,#FFFEFA))}
.zm-gcard-body p{margin:0}
.zm-gcard-kicker{font-size:14px;color:#6B5B3E}
.zm-gcard-line{margin-block:6px 10px!important;font-size:17px;line-height:1.75;color:var(--ink,#173747);font-weight:500}
.zm-gcard-links{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px}
.zm-gcard-links a{color:var(--ink,#173747);font-weight:700;text-underline-offset:4px}
.zm-gcard-buy{display:inline-block;padding:9px 16px;border:1.5px solid var(--ink,#173747);border-radius:999px;text-decoration:none}
.zm-gcard-buy:hover,.zm-gcard-buy:focus-visible{background:var(--ink,#173747);color:#fff!important}
.zm-gcard-gift{margin-block-start:8px!important;font-size:14px;color:#5A6A72}
details .zm-gcard{margin-block:18px 6px}
@media(max-width:600px){.zm-gcard{grid-template-columns:1fr;gap:12px;padding:14px}.zm-gcard-pic{height:132px}.zm-gcard-pic img{height:100%;object-fit:cover;object-position:top}.zm-gcard-line{font-size:16px}}

/* Review 28 Oct 2026: phones — the floating stack («اسألني», «التطبيق», bottom bar) must not cover first choices, answers or the buy button */
@media(max-width:760px){
 .zm-totop-row,.zm-totop{display:none!important}
 html:not(.zm-scrolled) #zm-ask-launch,html.zm-buying #zm-ask-launch{opacity:0;visibility:hidden;pointer-events:none}
 #zm-ask-launch{transition:opacity .2s linear,visibility .2s}
 main#main,#main{padding-bottom:calc(120px + env(safe-area-inset-bottom,0px))}
}
@media(prefers-reduced-motion:reduce){#zm-ask-launch{transition:none}}
.zm-jump{margin:6px 0 14px;font-size:16px}
.zm-jump a{color:var(--ink,#173747);font-weight:700;text-underline-offset:4px}
/* Library: the full list is for phones only; desktop keeps the deck */
@media(min-width:761px){.zmc-all-articles{display:none}}
.zmc-all-articles{margin:18px 16px 8px;padding:12px 16px;border:1px solid var(--line,#DBDCD2);border-radius:12px;background:var(--paper,#FFFEFA)}
.zmc-all-articles summary{cursor:pointer;font-weight:700;color:var(--ink,#173747);min-height:44px;display:flex;align-items:center}
.zmc-all-articles h3{font-size:15px;color:#6B5B3E;margin:14px 0 6px}
.zmc-all-articles ul{margin:0;padding-inline-start:18px}
.zmc-all-articles li{margin:0 0 8px;line-height:1.6}
.zmc-all-articles a{color:var(--ink,#173747)}
/* Guide card on pages where it sits straight in <main> (points): same side margin as elsewhere */
main>.zm-gcard{margin-inline:16px}
@media(min-width:900px){main>.zm-gcard{max-width:860px;margin-inline:auto}}
.zm-gcard-links a{min-height:44px;display:inline-flex;align-items:center}
/* Owner 28 Oct «لون الازرار خليه عنابي»: WordPress pages (home, /pricing/) used navy for every button, so the main
   action matched the navy sections behind it. Main action burgundy like the platform's zm-btn-primary; the second
   choice on a navy section is a light outline; outline buttons on light backgrounds keep zl-chrome's navy outline. */
body.zl-chrome #main .btn:not(.btn-outline),body.zl-chrome #main .button:not(.outline):not(.light):not(.outline-light):not(.amazon),body.zl-chrome #main .wp-block-button__link{background:#7B3546;border-color:#7B3546;color:#fff}
body.zl-chrome #main .btn:not(.btn-outline):hover,body.zl-chrome #main .button:not(.outline):not(.light):not(.outline-light):not(.amazon):hover,body.zl-chrome #main .wp-block-button__link:hover{background:#642a39;border-color:#642a39;color:#fff}
body.zl-chrome #main .button.light,body.zl-chrome #main .button.outline-light,body.zl-chrome #main .button.amazon{background:transparent;border-color:rgba(255,255,255,.85);color:#fff}
body.zl-chrome #main .button.light:hover,body.zl-chrome #main .button.outline-light:hover,body.zl-chrome #main .button.amazon:hover{background:rgba(255,255,255,.12);border-color:#fff;color:#fff}
/* emil-design-eng review (28 Oct): colour change eases in, a press feels heard, hover only on real pointers. */
body.zl-chrome #main .btn,body.zl-chrome #main .button,body.zl-chrome #main .wp-block-button__link{transition:background-color 160ms ease,border-color 160ms ease,transform 160ms cubic-bezier(.23,1,.32,1)}
body.zl-chrome #main .btn:active,body.zl-chrome #main .button:active,body.zl-chrome #main .wp-block-button__link:active{transform:scale(.97)}
@media (prefers-reduced-motion:reduce){body.zl-chrome #main .btn:active,body.zl-chrome #main .button:active,body.zl-chrome #main .wp-block-button__link:active{transform:none}}
/* taste-skill review 29 Oct (owner approved): calmer layout, fewer hairlines, floating buttons off the start of Arabic lines. */
/* Questions and paths: centre article + rail; the rail becomes a soft panel. The EE doors box is not touched. */
@media (min-width:1024px){
 .zm-qgrid{justify-content:center;grid-template-columns:minmax(0,680px) 280px;column-gap:64px}
 .zm-qgrid>.zm-rail{background:#F3F1EA;border-radius:12px;padding:18px 20px;align-self:start}
 .zm-rail a{display:block;padding:6px 0;font-size:16px;color:var(--ink,#173747);text-decoration:none}
 .zm-rail a:hover,.zm-rail a:focus-visible,.zm-rail a[aria-current]{color:#7B3546;text-decoration:underline;text-underline-offset:4px}
}
/* Step and toggle titles stand clear of body text (were 19px against 18px). */
.zm-pstep>details>summary,.zm-qgrid details.zm-toggle>summary{font-size:21px;line-height:1.45}
/* Fill instead of hairline boxes. */
.zm-tiles .zm-tile,.zm-qgrid details.zm-toggle{background:#F3F1EA;border:0;box-shadow:none}
.zm-qgrid details.zm-toggle{border-radius:12px;padding-inline:16px}
.zm-qgrid details.zm-toggle+details.zm-toggle{margin-top:8px}
.zm-tiles .zm-tile:hover,.zm-tiles .zm-tile:focus-visible{background:color-mix(in srgb,#173747 7%,#FFFEFA)}
.zm-tiles .zm-tile:focus-visible{outline:2px solid #173747;outline-offset:3px}
/* Home situation grid: equal heights; the general «not sure» card closes the second row. */
.zm-tiles.zm-home{align-items:stretch}
.zm-tiles.zm-home>li>a.zm-tile{height:100%}
/* Owner selection, 30 Oct: restore white/navy home topic buttons. */
.zm-tiles.zm-home .zm-tile{background:#fff;color:var(--ink,#173B4B);border:1px solid var(--line,#DBDCD2);box-shadow:none}
.zm-tiles.zm-home .zm-tile:hover,.zm-tiles.zm-home .zm-tile:focus-visible{background:#fff;border-color:var(--ink,#173B4B)}
.zmc-library-more[hidden]{display:none}
@media (min-width:1024px){.zm-tiles.zm-home>li:last-child{grid-column:span 2}}
/* Phones: «التطبيق» becomes a round icon stacked above «اسألني» on the left, where Arabic lines end. */
@media (max-width:760px){
 .zm-dock{right:auto;left:12px;bottom:calc(57px + 12px + 60px + env(safe-area-inset-bottom,0px))}
 .zm-dock-btn{width:48px;height:48px;padding:0;border-radius:999px;font-size:0;justify-content:center}
 .zm-dock-btn svg{width:26px;height:26px}
 html{scroll-padding-bottom:140px}
}
/* /pricing/ desktop: section title on the right stays in view, its content beside it, centred on the page. */
@media (min-width:1024px){
 body.zl-chrome #main .zm-guide-page>.zm-release-section:has(>h2):not(.zm-guide-film):not(.zm-guide-final){max-width:none;margin-inline:0;display:grid;grid-template-columns:minmax(0,300px) minmax(0,680px);column-gap:72px;justify-content:center;align-items:start}
 body.zl-chrome #main .zm-guide-page>.zm-release-section:has(>h2):not(.zm-guide-film):not(.zm-guide-final)>h2{grid-column:1;grid-row:1/span 30;position:sticky;top:96px;margin:0;font-size:30px;line-height:1.3}
 body.zl-chrome #main .zm-guide-page>.zm-release-section:has(>h2):not(.zm-guide-film):not(.zm-guide-final)>:not(h2){grid-column:2}
 body.zl-chrome #main .zm-guide-page>.zm-release-section:not(:has(>h2)):not(.zm-guide-film):not(.zm-guide-final){margin-inline:auto;max-width:760px}
}

/* Journey review 29 Oct 2026 (FIX-LIST-AR.md, owner answers OWNER-DECISIONS-AR.md) */
/* 25: primary buttons are burgundy on zaitalmaple; buying pages keep their single buy button as the only strong one. */
html:not(.zm-buying) .zm-btn:not(.zm-btn-ghost){background:var(--primary,#7B3546);border-color:var(--primary,#7B3546);color:#fff}
@media (hover:hover) and (pointer:fine){html:not(.zm-buying) .zm-btn:not(.zm-btn-ghost):hover{background:var(--primary-hover,#622537);border-color:var(--primary-hover,#622537)}}
/* 24 (owner «ب»): the floating install button and «اسألني» slide away while reading down and come back on the way up. */
.zm-dock,#zm-ask-launch,.zr-ask-launch{transition:transform .2s cubic-bezier(.23,1,.32,1),opacity .2s ease}
html.zm-scroll-down .zm-dock,html.zm-scroll-down #zm-ask-launch,html.zm-scroll-down .zr-ask-launch{transform:translateY(160%)}
@media (prefers-reduced-motion:reduce){.zm-dock,#zm-ask-launch,.zr-ask-launch{transition:none}}
/* 14, 10, 19, 26: short link lists and lines added to paths. */
.zmc-alt-links{list-style:none;margin:10px 0;padding:0;display:grid;gap:6px}
.zmc-alt-links a,.zmc-steplinks a{display:inline-flex;align-items:center;min-height:44px;color:var(--primary,#7B3546);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.zmc-steplinks{display:flex;flex-wrap:wrap;gap:4px 16px;margin:10px 0}
.zmc-steplinks .zmc-chip{padding:0 14px;border:1.5px solid var(--primary,#7B3546);border-radius:999px;text-decoration:none}
.zmc-both{margin:12px 0;padding:12px 14px;background:var(--mist,#f3f0e7);border-radius:10px}
.zmc-both .zm-go{display:inline-flex;align-items:center;min-height:44px}
.zmc-path-group{font-size:20px;margin:28px 0 10px}
.zmc-path-banner{max-width:820px;margin:24px auto;padding:20px;background:#f3f0e7;border-radius:12px}
.zmc-next .zmc-links{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px}
.zm-rexpired{color:var(--primary,#7B3546);font-weight:700}
/* 11: finder «غيّر» and step links are real touch targets. */
.zm-finder a:not(.zm-tile){min-height:44px;display:inline-flex;align-items:center}
/* Part D (29 Oct 2026): study-cost comparison on /path/study/ and the new paths' tables. Stacked cards, no page scroll at 320. */
.zsc-pof{margin:14px 0;padding:14px 16px;background:var(--mist,#f3f0e7);border-radius:12px}
.zsc-pof ul{margin:6px 0;padding-inline-start:20px}
.zsc-note{font-weight:700}
.zsc-cards{list-style:none;margin:0;padding:0;display:grid;gap:12px}
@media (min-width:760px){.zsc-cards{grid-template-columns:1fr 1fr}}
.zsc-card{padding:14px 16px;border:1px solid #e3ddd0;border-radius:12px;background:#fffefa;min-width:0;overflow-wrap:anywhere}
.zsc-card h4{margin:0 0 6px;font-size:17px;line-height:1.5}
.zsc-meta{display:flex;flex-wrap:wrap;gap:4px 10px;margin:0 0 6px;font-size:15px;color:#4a5a62}
.zsc-tag{padding:0 8px;border-radius:999px;background:#f4e6e9;color:var(--primary,#7B3546);font-weight:700}
.zsc-program{margin:0 0 6px;font-size:15px}
.zsc-figs{margin:0}.zsc-figs div{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2px 12px;padding:4px 0;border-top:1px dashed #e3ddd0}
.zsc-figs dt{font-size:15px}.zsc-figs dd{margin:0;font-weight:700}
.zsc-src a{display:inline-flex;align-items:center;min-height:44px}
body[data-slug="trades"] main [role="region"],body[data-slug="french"] main [role="region"]{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
body[data-slug="trades"] main table,body[data-slug="french"] main table{width:100%;table-layout:fixed;border-collapse:collapse}
body[data-slug="trades"] main td,body[data-slug="trades"] main th,body[data-slug="french"] main td,body[data-slug="french"] main th{overflow-wrap:anywhere;word-break:break-word;padding:6px;vertical-align:top;text-align:start}
body[data-slug="trades"] main .cc-definition,body[data-slug="french"] main .cc-definition{min-width:0;max-width:100%}
body[data-slug="trades"] .zm-pbody,body[data-slug="french"] .zm-pbody,body[data-slug="trades"] .zm-pstep details,body[data-slug="french"] .zm-pstep details{min-width:0}

/* Part E (29 Oct 2026) */
/* 11: the «غيّر» link next to the saved answers is a real touch target. */
.zm-answers a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding-inline:6px}
/* 27: sticky step line on phones, under the sticky header; the repeated step list in the side rail goes on phones. */
.zm-stepbar{display:none}
@media (max-width:767px){.zm-stepbar{display:block;position:sticky;top:57px;z-index:15;margin:0 -16px 8px;padding:8px 16px;font-size:15px;font-weight:700;background:var(--paper,#FFFEFA);border-block-end:1px solid var(--line,#e3ddd0)}
 .zm-rail nav[aria-label="خطوات المسار"]{display:none}}
/* 15: /pnp/ filter chips. */
.zmc-pnp-filter{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.zmc-pnp-filter .zm-chipbtn{min-height:44px}
.zmc-pnp-filter .zm-chipbtn[aria-pressed="true"]{background:var(--primary,#7B3546);border-color:var(--primary,#7B3546);color:#fff}
.zmc-pnp-count{flex-basis:100%;margin:4px 0 0;font-size:15px}
/* 9: profession box on the licensed-profession path. */
.zmc-prof{margin:14px 0;padding:14px 16px;background:var(--mist,#f3f0e7);border-radius:12px}
.zmc-prof h2{font-size:19px;margin:0 0 6px}.zmc-prof ul{margin:6px 0;padding-inline-start:20px}
.zmc-prof a{display:inline-flex;align-items:center;min-height:44px;color:var(--primary,#7B3546);font-weight:700}
/* FIX-LIST 22 (29 Oct 2026): province tables and the one next-step button in the new library articles.
   Below 700px each row becomes a card with its column label, so nothing scrolls sideways at 320px. */
.zml-reading .zml-table{width:100%;min-width:0;max-width:100%;border-collapse:collapse;margin-block:1rem;font-size:.95em;table-layout:fixed}
.zml-reading .zml-table th,.zml-reading .zml-table td{border:1px solid #d9d3c7;padding:.55rem .6rem;text-align:start;vertical-align:top;overflow-wrap:anywhere}
.zml-reading .zml-table th{background:#f5f0e7;color:#17354A}
@media (max-width:700px){.zml-reading .zml-table thead{display:none}.zml-reading .zml-table,.zml-reading .zml-table tbody,.zml-reading .zml-table tr,.zml-reading .zml-table td{display:block;width:100%;min-width:0}.zml-reading .zml-table tr{border:1px solid #d9d3c7;border-radius:12px;margin-block-end:.8rem;padding:.4rem .7rem;background:#fffefa}.zml-reading .zml-table td{border:0;padding:.35rem 0}.zml-reading .zml-table td::before{content:attr(data-label);display:block;font-weight:700;color:#17354A}}
.zml-reading .zml-cta a,.zml-reading .zml-cta a:visited{display:inline-flex;align-items:center;min-height:44px;padding:.6rem 1.1rem;border-radius:10px;background:var(--primary,#7B3546);color:#fff!important;text-decoration:none!important;font-weight:700}
@media (hover:hover) and (pointer:fine){.zml-reading .zml-cta a:hover{background:var(--primary-hover,#622537)}}
.zml-reading .zml-practical h3{margin-block-start:0}
/* Library humanize pass (29 Oct 2026): any table in an article body ignores the WP theme minimum width. */
.zml-reading table{min-width:0;max-width:100%}
/* Council 29 Oct: keep the icon, enlarge its actual touch target. */
button.zm-hv-play,button.zm-hv-pause{min-width:44px!important;min-height:44px!important}
@media(max-width:700px){.zgs-article-toc summary{min-height:44px;padding:10px 12px;cursor:pointer}.zml-sources a{display:inline-block;padding-block:8px}}

/* Home payment announcement: quiet, dismissible, no prices. */
.zmp-home-notice{margin-block:20px 24px;color:#173B4B}
.zmp-home-notice[hidden],.zmp-home-notice-close[hidden]{display:none!important}
.zmc-reading .zmp-home-notice{display:none!important}
.zmp-home-notice-inner{position:relative;display:flex;align-items:center;gap:24px;padding:22px 28px;background:#173B4B;border:1px solid #C8AE76;border-radius:14px;box-shadow:0 8px 20px #173b4b12;color:#FFFEFA}
.zmp-home-notice-book{flex:0 0 auto;width:76px;height:auto;border-radius:2px 5px 5px 2px;transform:perspective(500px) rotateY(-12deg) rotate(-5deg);box-shadow:5px 4px 0 #d3c5a9,10px 9px 16px #071c2980}
.zmp-home-notice-inner{overflow:hidden;isolation:isolate}
.zmp-home-notice-inner::after{content:"";position:absolute;inset:-50% -35%;pointer-events:none;background:linear-gradient(110deg,transparent 43%,#fff4d032 49%,transparent 56%);opacity:0;transform:translateX(70%);z-index:-1}
@keyframes zmp-notice-arrive{from{opacity:.7;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes zmp-book-settle{from{transform:perspective(500px) rotateY(-24deg) rotate(-8deg) translateY(6px)}to{transform:perspective(500px) rotateY(-12deg) rotate(-5deg) translateY(0)}}
@keyframes zmp-light-pass{0%{opacity:0;transform:translateX(70%)}20%{opacity:.65}75%{opacity:.65}100%{opacity:0;transform:translateX(-70%)}}
@media(prefers-reduced-motion:no-preference){.zmp-revealed .zmp-home-notice-inner{animation:zmp-notice-arrive 500ms cubic-bezier(.2,.8,.2,1) both}.zmp-revealed .zmp-home-notice-book{animation:zmp-book-settle 700ms cubic-bezier(.16,1,.3,1) both}.zmp-revealed .zmp-home-notice-inner::after{animation:zmp-light-pass 900ms 100ms cubic-bezier(.22,.61,.36,1) both}}
.zmp-home-notice-copy{flex:1;min-width:0}
.zmp-home-notice-copy p{margin:0;line-height:1.6;font-size:21px;color:#FFFEFA}
.zmp-home-notice-copy p+p{margin-top:4px}
.zmp-home-notice-copy .zmp-home-notice-new{display:inline-block;font-size:13px;font-weight:700;padding:1px 9px;margin-inline-end:6px;border-radius:5px;background:#E8C77E;color:#173B4B;vertical-align:middle}
.zmp-home-notice-copy .zmp-home-notice-methods{font-size:18px;color:#F2DCAB;margin-top:8px}
.zmp-home-notice-link{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:8px 20px;background:#E8C77E;color:#173B4B!important;border-radius:8px;text-decoration:none;font-weight:800;white-space:nowrap;transition:transform 180ms cubic-bezier(.2,.8,.2,1)}
.zmp-home-notice-link:hover{background:#F2DCAB}
.zmp-home-notice-close{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;min-height:44px;border:0;background:transparent;color:#FFFEFA;cursor:pointer;border-radius:8px}
.zmp-home-notice-close:hover{background:#ffffff18}
.zmp-home-notice a:focus-visible,.zmp-home-notice button:focus-visible{outline:3px solid #FFFEFA;outline-offset:3px;transition:none}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.zmp-home-notice-link:hover:not(:focus-visible){transform:translateY(-2px)}.zmp-home-notice-link:active:not(:focus-visible){transform:scale(.98)}}
@media(prefers-reduced-motion:reduce){.zmp-home-notice-link{transition:none;transform:none}.zmp-home-notice-book{transform:none}}
@media(max-width:800px){.zmp-home-notice-inner{display:grid;grid-template-columns:58px minmax(0,1fr);gap:16px;padding:24px 18px 16px}.zmp-home-notice-book{width:54px;grid-column:1;grid-row:1}.zmp-home-notice-copy{grid-column:2;grid-row:1;padding-inline-end:14px}.zmp-home-notice-copy p{font-size:19px}.zmp-home-notice-copy .zmp-home-notice-methods{font-size:16px}.zmp-home-notice-close{position:absolute;inset-inline-end:0;top:0;width:44px}.zmp-home-notice-link{grid-column:1/-1}}

.zgs-page{max-width:760px;margin:0 auto;padding:24px 20px 48px;line-height:1.85}.zgs-page h1{font-size:clamp(25px,5vw,36px);line-height:1.4}.zgs-page h2{font-size:22px;margin-block:24px 8px}.zgs-page p{margin-block:12px}.zgs-page a,.zgs-page summary{min-height:44px;display:inline-flex;align-items:center}.zgs-page summary{display:list-item;cursor:pointer;padding:10px 0}.zgs-page details{border-block:1px solid #ddd4ce;margin-block:20px;padding:8px 0}.zgs-examples section{border-inline-start:3px solid #7b3546;padding-inline-start:16px;margin-block:28px}.zgs-value{background:#f5efeb;padding:20px;border-radius:12px;margin-block:28px}.zgs-original{max-width:100%;height:auto;display:block}.zgs-picks{padding-inline-start:20px}.zgs-page dt{font-weight:700}.zgs-page dd{margin:0 0 16px}.zgs-page bdi{display:inline-block}.zgs-dialog{width:min(850px,calc(100vw - 16px));max-width:none;height:calc(100dvh - 24px);max-height:none;border:1px solid #d8cdc7;padding:0;background:#fffefa;border-radius:14px;overflow:hidden}.zgs-dialog::backdrop{background:#24161ab3}.zgs-dialog-bar{height:62px;display:flex;justify-content:space-between;align-items:center;padding:8px 16px;gap:12px;border-bottom:1px solid #ddd4ce}.zgs-dialog-bar button{min-height:44px;padding:8px 14px;font:inherit;background:#7b3546;color:white;border:0;border-radius:8px;cursor:pointer}.zgs-dialog iframe{width:100%;height:calc(100% - 62px);border:0;display:block}.zgs-dialog :focus-visible,.zgs-page :focus-visible{outline:3px solid #7b3546;outline-offset:3px}.zm-guide-page .zgs-early{margin-block:12px}.zm-guide-page .zgs-early a{min-height:44px;display:inline-flex;align-items:center}.zgs-includes{font-size:15px;line-height:1.8}.zgs-includes summary{cursor:pointer;min-height:44px;padding-block:10px}
.zgs-embedded .zm-header,.zgs-embedded .zm-menu-panel,.zgs-embedded .zm-footer,.zgs-embedded .zm-bottom,.zgs-embedded .zm-dock,.zgs-embedded #zm-ask-launch,.zgs-embedded #zm-ask-dialog{display:none!important}.zgs-embedded body{padding-bottom:0!important}.zgs-embedded .zgs-page{padding-top:12px}
@media(max-width:360px){.zgs-dialog-bar{padding-inline:10px;gap:8px;font-size:15px}.zgs-dialog-bar strong{white-space:nowrap}.zgs-dialog-bar button{white-space:nowrap;padding-inline:10px;font-size:14px;flex-shrink:0}}

/* Refine the existing ivory/navy identity. No global type or component reset. */
.zn-shortcuts{display:flex;align-items:center;gap:8px 20px;flex-wrap:wrap;margin-block:18px 8px}
.zn-shortcuts p{margin:0;font-weight:700}.zn-shortcuts a,.zn-unsure a{display:inline-flex;align-items:center;min-height:44px;line-height:1.6;text-underline-offset:5px}
.zn-unsure{margin-block:8px 0}.zn-reading{margin-block:32px}.zn-reading-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.zn-reading-list article{min-width:0}.zn-reading-list img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:12px}.zn-reading-list h3{font-size:21px;margin-block:12px 6px;line-height:1.5}.zn-reading-list a{color:#173B4B;text-decoration:none}.zn-reading-list a:hover h3{text-decoration:underline;text-underline-offset:5px}.zn-reading-list p{margin:0;color:#425b65;line-height:1.8}.zn-reading>p{margin-top:18px}
.zn-library-choice{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 18px;margin-block:12px 20px}.zn-library-choice p{margin:0;color:#425b65}.zn-library-choice button{font:inherit;min-height:44px;padding:8px 14px;border:1px solid #173B4B;border-radius:8px;color:#173B4B;background:#FFFEFA;cursor:pointer}.zn-library-choice button:focus-visible,.zn-reading-list a:focus-visible,.zn-shortcuts a:focus-visible{outline:3px solid #7B3546;outline-offset:4px}
.zpr-delete{font:inherit;background:transparent;color:#173B4B;border:0;min-height:44px;padding:8px 12px;text-decoration:underline;text-underline-offset:4px;cursor:pointer}.zpr-delete:focus-visible,.zpr-undo:focus-visible{outline:3px solid #7B3546;outline-offset:3px}.zpr-removal{margin-block:14px;padding:14px;background:#f5efe6;border-radius:10px}.zpr-removal[hidden]{display:none}.zpr-removal p{margin:0 0 10px}.zpr-removal button{font:inherit;min-height:44px;padding:8px 14px;border:1px solid #173B4B;border-radius:8px;background:#FFFEFA;color:#173B4B;margin-inline-end:10px;cursor:pointer}.zpr-removal [data-confirm]{background:#7B3546;color:#FFFEFA;border-color:#7B3546}.zpr-empty{padding:14px 0}.zpt-item>.zpr-delete{display:block;margin-inline-start:auto}
@media(max-width:849px){.library-intro{gap:14px!important;padding-block:22px!important}.library-intro img{max-height:130px;object-fit:cover}.library-intro h1{font-size:28px!important;margin-block:0 10px!important}.library-intro p{font-size:18px!important;margin:0}.zn-library-choice{margin-block:8px 16px}.zn-shortcuts{display:block}.zn-shortcuts a{display:flex}.zn-reading-list{grid-template-columns:1fr;gap:22px}.zn-reading-list article{display:grid;grid-template-columns:minmax(0,1fr) 1.4fr;column-gap:16px}.zn-reading-list article>a{display:contents}.zn-reading-list img{grid-column:1;grid-row:1/3;align-self:start}.zn-reading-list h3{grid-column:2;margin:0;font-size:20px}.zn-reading-list p{grid-column:2;font-size:16px}.zn-home-hero .zm-slogan{margin-bottom:6px}.zn-home-hero{padding-bottom:12px}.zmp-home-notice{margin-block:14px 28px}}
/* One stronger, finite book entrance. Readable before JS; reduced-motion has no entrance. */
@keyframes zn-book-arrive{0%{transform:perspective(650px) translateY(20px) rotateY(-55deg) rotate(-10deg);filter:brightness(.7)}65%{transform:perspective(650px) translateY(-3px) rotateY(3deg) rotate(-3deg);filter:brightness(1.1)}100%{transform:perspective(650px) rotateY(-12deg) rotate(-5deg);filter:brightness(1)}}
@keyframes zn-banner-arrive{from{opacity:.8;transform:translateY(18px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:no-preference){.zmp-revealed .zmp-home-notice-inner{animation:zn-banner-arrive 680ms cubic-bezier(.16,1,.3,1) both}.zmp-revealed .zmp-home-notice-book{animation:zn-book-arrive 1100ms cubic-bezier(.16,1,.3,1) both}.zmp-revealed .zmp-home-notice-inner::after{animation:zmp-light-pass 1250ms 220ms ease-out both}}
@media(prefers-reduced-motion:reduce){.zmp-revealed .zmp-home-notice-inner,.zmp-revealed .zmp-home-notice-book,.zmp-revealed .zmp-home-notice-inner::after{animation:none!important;transform:none;filter:none}}

/* November council refinement: existing Tajawal / warm paper / ink identity. */
.zm-guide-page .zm-guide-lead{max-inline-size:27ch;text-wrap:balance}
.zm-guide-page .zm-product-proof-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(24px,4vw,48px);align-items:center}
.zm-guide-page .zm-product-proof-layout figure{margin:0;min-inline-size:0}
.zm-guide-page .zm-product-proof-layout img{display:block;inline-size:100%;block-size:auto;object-fit:contain}
.zm-guide-page .zm-product-proof-layout figcaption{font-size:16px;line-height:1.7;margin-block-start:12px;color:#495b64}
.zm-guide-page .zm-product-proof-layout p{max-inline-size:65ch}
.zm-guide-page .zm-product-more-samples{margin-block-start:24px;border-block-start:1px solid #dbdcd2}
.zm-guide-page .zm-product-more-samples>summary{padding-block:16px;font-weight:700}
.zm-guide-page .zm-product-sample-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;padding-block:16px}
.zm-guide-page .zm-product-sample-options article{min-inline-size:0}
.zm-guide-page .zm-product-sample-options img{display:block;inline-size:100%;max-block-size:230px;object-fit:contain}
.zm-guide-page .zm-product-sample-options h3{margin-block:20px 8px}
.zm-guide-page .zm-product-sample-options a,.zm-guide-page .zm-guide-inside a,.zgs-page .zgs-next a{display:inline-flex;align-items:center;min-block-size:44px;text-underline-offset:4px}
.zm-guide-page .zm-product-difference{margin:0}
.zm-guide-page .zm-product-difference>div{display:grid;grid-template-columns:minmax(150px,1fr) minmax(0,3fr);gap:24px;padding-block:20px;border-block-start:1px solid #dbdcd2}
.zm-guide-page .zm-product-difference dt{font-weight:700;color:#173b4b}
.zm-guide-page .zm-product-difference dd{margin:0;max-inline-size:65ch}
.zm-guide-page .zm-guide-film>details>summary{font-size:22px;font-weight:700;padding-block:16px}
.zm-guide-page .zm-guide-inside>details>summary{padding-block:12px}
.zm-guide-page :is(h1,h2,h3),.zgs-page :is(h1,h2,h3){text-wrap:balance}
.zm-guide-page :is(a,summary):focus-visible,.zgs-page :is(a,summary):focus-visible{outline:3px solid #173b4b;outline-offset:4px}
.zm-guide-page ::selection,.zgs-page ::selection{background:#dce8e3;color:#173b4b}
.zm-gcard .zm-gcard-title{font-size:19px;line-height:1.6;margin:0 0 8px;color:#173b4b}
.zm-gcard .zm-gcard-buy[hidden]{display:none!important}
/* One contextual product area. The original banner keeps its close + measurement. */
.zm-gcard-with-payment #local-payment-notice{grid-column:1/-1;inline-size:100%;max-inline-size:none;margin:4px 0 0;padding:0}
.zm-gcard-with-payment .zmp-home-notice-inner{display:flex;flex-wrap:wrap;gap:12px;padding:16px 0 0;border:0;border-block-start:1px solid #dbdcd2;border-radius:0;background:transparent;box-shadow:none;color:#173b4b;overflow:visible;animation:none}
.zm-gcard-with-payment .zmp-home-notice-inner::after,.zm-gcard-with-payment .zmp-home-notice-book,.zm-gcard-with-payment .zmp-home-notice-copy>p:first-child{display:none}
.zm-gcard-with-payment .zmp-home-notice-copy{flex:1 1 200px;padding:0}
.zm-gcard-with-payment .zmp-home-notice-copy .zmp-home-notice-methods{margin:0;color:#173b4b;font-size:16px;line-height:1.7}
.zm-gcard-with-payment .zmp-home-notice-link{white-space:normal;min-block-size:44px;font-size:16px}
.zm-gcard-with-payment .zmp-home-notice-close{position:static;inset:auto;color:#173b4b;min-inline-size:44px}
.zm-gcard-with-payment .zmp-home-notice-close:hover{background:#eef2ef}
.zm-gcard-with-payment .zmp-home-notice a:focus-visible,.zm-gcard-with-payment .zmp-home-notice button:focus-visible{outline-color:#173b4b}
.zgs-page .zgs-pdf-help{margin-block:28px}
.zgs-page .zgs-pdf-help summary{min-block-size:44px;padding-block:10px;cursor:pointer;font-weight:700}
.zgs-page .zgs-next{border-block-start:1px solid #dbdcd2;padding-block-start:16px}
@media(max-width:700px){
 .zm-guide-page .zm-product-proof-layout,.zm-guide-page .zm-product-sample-options,.zm-guide-page .zm-product-difference>div{grid-template-columns:minmax(0,1fr)}
 .zm-guide-page .zm-product-proof-layout{gap:16px}
 .zm-guide-page .zm-product-difference>div{gap:8px}
 .zm-guide-page .zm-product-proof-layout .btn{white-space:normal;min-block-size:48px;text-align:center;line-height:1.7}
}

/* Scoped book showcase: original navy/gold, real cover, one finite entrance. */
.zmp-cinema{scroll-margin-top:90px}
/* Article reading controls style paragraphs broadly. Keep the advert hierarchy local. */
#local-payment-notice.zmp-cinema .zmp-book-title{font-size:17px!important;line-height:1.6}
#local-payment-notice.zmp-cinema .zmp-promise,#local-payment-notice.zmp-cinema .zmp-promise strong{font-size:clamp(23px,2.4vw,30px)!important;line-height:1.45}
#local-payment-notice.zmp-cinema .zmp-benefit{font-size:17px!important;line-height:1.8}
#local-payment-notice.zmp-cinema .zmp-home-notice-methods{font-size:18px!important;line-height:1.8}
#local-payment-notice.zmp-cinema .zmp-home-notice-link{text-decoration:none!important}
@media(max-width:520px){#local-payment-notice.zmp-cinema .zmp-book-title{font-size:15px!important}#local-payment-notice.zmp-cinema .zmp-promise,#local-payment-notice.zmp-cinema .zmp-promise strong{font-size:22px!important}#local-payment-notice.zmp-cinema .zmp-benefit{font-size:15px!important;line-height:1.7}#local-payment-notice.zmp-cinema .zmp-home-notice-methods{font-size:16px!important}}
.zm-gcard-with-payment .zmp-book-stage,.zm-gcard-with-payment .zmp-book-title,.zm-gcard-with-payment .zmp-promise,.zm-gcard-with-payment .zmp-benefit{display:none}
.zmp-cinema .zmp-home-notice-inner{display:grid;grid-template-columns:150px minmax(0,1fr) auto;gap:30px;padding:30px 34px;background:#173B4B;border:0;border-radius:16px;box-shadow:0 12px 28px #173b4b22;overflow:hidden;isolation:isolate}
.zmp-cinema .zmp-home-notice-inner::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,#234e60 0%,transparent 52%,#102d3a 100%);z-index:-1;pointer-events:none}
.zmp-cinema .zmp-home-notice-inner::after{display:none}
.zmp-book-stage{perspective:900px;display:grid;justify-items:center;gap:13px;padding:8px 4px;transform:rotateX(var(--zmp-x,0deg)) rotateY(var(--zmp-y,0deg));transition:transform 220ms cubic-bezier(.16,1,.3,1)}
.zmp-book-object{position:relative;width:118px;aspect-ratio:900/1273;transform-style:preserve-3d;transform:rotateY(-17deg) rotateZ(-4deg);box-shadow:12px 15px 24px #071c2966}
.zmp-book-object::before{content:"";position:absolute;inset:2px -8px 2px 0;background:#d5cbb6;border-inline-end:3px solid #fbf5e7;transform:translateZ(-7px);border-radius:3px}
.zmp-book-gloss{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 20%,#ffffff4a 48%,transparent 70%);opacity:0;transform:translateX(80%)}
.zmp-cinema .zmp-home-notice-book{display:block;width:100%;height:auto;margin:0;border-radius:2px;transform:translateZ(1px);box-shadow:none;filter:none}
.zmp-digital{font-size:12px;color:#F2DCAB;letter-spacing:.02em;line-height:1.4}
.zmp-cinema .zmp-home-notice-copy{padding:0;min-width:0}
.zmp-cinema .zmp-book-title{font-size:17px;font-weight:600;color:#F2DCAB;margin:0 0 5px}
.zmp-cinema .zmp-promise{font-size:clamp(23px,2.4vw,30px);line-height:1.45;margin:0;text-wrap:balance}
.zmp-cinema .zmp-benefit{font-size:17px;line-height:1.8;margin:10px 0 0;color:#f7f2e6;max-width:45ch}
.zmp-cinema .zmp-home-notice-methods{font-size:18px;line-height:1.8;margin:12px 0 0;color:#F2DCAB}
.zmp-cinema .zmp-home-notice-link{gap:14px;align-self:center;font-size:17px;white-space:normal;text-align:center;min-height:50px;max-width:230px;padding:11px 20px;background:#E8C77E;color:#173B4B!important}
.zmp-cinema .zmp-home-notice-close{position:absolute;top:4px;inset-inline-end:4px;width:44px;min-height:44px}
.zmp-cinema .zmp-home-notice-copy p+p{margin-top:8px}
.zmp-cinema.zmp-revealed .zmp-home-notice-inner,.zmp-cinema.zmp-revealed .zmp-home-notice-book{animation:none!important}
.zmp-guide-calm{padding:22px 0;margin-block:28px 12px;border-block-start:1px solid #d4ddd8;color:#173B4B;background:transparent}
.zmp-guide-calm h2{font-size:21px;margin:0 0 8px}.zmp-guide-calm p{font-size:17px;line-height:1.8;margin:0 0 8px}.zmp-guide-calm a{display:inline-flex;align-items:center;min-height:44px;text-underline-offset:4px}
.zmp-guide-calm a:focus-visible{outline:3px solid #7B3546;outline-offset:4px}
@media(max-width:900px){.zmp-cinema .zmp-home-notice-inner{grid-template-columns:124px minmax(0,1fr);gap:12px 24px;padding:28px 24px 22px}.zmp-cinema .zmp-home-notice-link{grid-column:2;justify-self:start;max-width:none}.zmp-book-stage{grid-row:1/3;grid-column:1}.zmp-cinema .zmp-home-notice-copy{grid-column:2;grid-row:1}}
@media(max-width:520px){.zmp-cinema .zmp-home-notice-inner{grid-template-columns:88px minmax(0,1fr);gap:14px 16px;padding:32px 18px 18px}.zmp-book-stage{grid-row:1;padding:8px 0}.zmp-book-object{width:76px}.zmp-cinema .zmp-book-title{font-size:15px}.zmp-cinema .zmp-promise{font-size:22px}.zmp-cinema .zmp-benefit{font-size:15px;line-height:1.7}.zmp-cinema .zmp-home-notice-methods{font-size:16px;line-height:1.8}.zmp-cinema .zmp-home-notice-link{grid-column:1/-1;justify-self:stretch;font-size:17px;min-height:50px}.zmp-digital{font-size:11px}.zmp-cinema .zmp-home-notice-copy p+p{margin-top:7px}}
@media(prefers-reduced-motion:reduce){.zmp-cinema *,.zmp-cinema *::before,.zmp-cinema *::after{animation:none!important;transition:none!important}.zmp-book-stage,.zmp-book-object{transform:none!important}.zmp-book-gloss{display:none}}

/* Read first, expand deliberately. Existing Tajawal / navy / ivory identity. */
main details > summary.zc-summary {
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  min-block-size:44px; box-sizing:border-box; padding:12px 14px;
  cursor:pointer; list-style:none; color:#173B4B;
  border-block-end:1px solid #D9DED9; background:#F5F5EF;
  border-radius:8px; line-height:1.65;
}
main details > summary.zc-summary::-webkit-details-marker {display:none}
main .zc-summary .zm-pm, main .zc-summary .st-chevron {display:none!important}
main .zc-summary > .zc-cue {
  display:inline-flex; align-items:center; gap:5px; flex:0 0 auto;
  margin-inline-start:auto; font-size:13px; font-weight:600; color:#365D64;
  line-height:1.5; white-space:nowrap;
}
main .zc-summary > .zc-cue .zc-close {display:none}
main details[open] > .zc-summary > .zc-cue .zc-open {display:none}
main details[open] > .zc-summary > .zc-cue .zc-close {display:inline}
main details[open] > .zc-summary > .zc-cue .zc-chevron {transform:rotate(180deg)}
main .zc-summary:focus-visible {outline:3px solid #823C4E;outline-offset:3px}
main details.zc-disclosure {margin-block:18px; border:0; padding:0; background:transparent}
main .zc-fold-body {padding:12px 4px 4px}
main .zc-fold-body > section,main .zc-fold-body > aside {margin-block:0 16px}
main .zc-fold-body a {text-underline-offset:.2em}
main .zc-fold-body li + li {margin-block-start:10px}
main .zc-fold-body .zm-sources {padding-inline-start:22px}
main .zc-fold-body .zm-next {box-shadow:none}
main [id] {scroll-margin-block-start:100px}
@media(max-width:520px){
 main details > summary.zc-summary {gap:8px;padding:12px;font-size:17px}
 main .zc-fold-body {padding-inline:2px}
 main .zc-summary > .zc-cue {font-size:12px}
}
@media(hover:hover){main .zc-summary:hover {background:#EBEFE9}}
@media(prefers-reduced-motion:reduce){main .zc-chevron {transition:none}}

/* Replace known older disclosure icons only where our cue is present. */
main .toc > summary.zc-summary::after,
main .zpr-more > summary.zc-summary::after {content:none!important;display:none!important}
main bdi[dir="ltr"] {unicode-bidi:isolate}

main .zc-term-name {display:block;text-align:start;font-size:16px;margin-block:4px 10px;line-height:1.65}
main .zc-map-guide {margin-block:20px;padding:16px;background:#F5F5EF;border-radius:8px}
main .zc-map-guide p:last-child {margin-block-end:0}

/* WordPress article containers use content-box; the home-width banner must
   stay within its article column instead of inheriting full-width offsets. */
#article-body #local-payment-notice {
  box-sizing:border-box;inline-size:100%;max-inline-size:100%;
  margin-inline:0;padding-inline:0;overflow:clip;
}
#article-body #local-payment-notice * {box-sizing:border-box}

/* Actual cover + actual sample, hinged leaves; scoped to the guide banner. */
#local-payment-notice.zmp-livebook .zmp-home-notice-inner {grid-template-columns:210px minmax(0,1fr) auto;gap:26px;overflow:hidden}
#local-payment-notice.zmp-livebook .zmp-book-stage {display:flex;flex-direction:column;align-items:center;justify-content:center;perspective:850px;transform:none!important;padding:10px 0;min-width:0}
.zmb-volume {direction:ltr;position:relative;width:108px;height:153px;flex:none;transform-style:preserve-3d;transform:translateX(44px) rotateX(7deg) rotateY(-14deg) rotateZ(-3deg);margin-block:4px 14px}
.zmb-paper {position:absolute;inset:0;background:#fffcf2;border-radius:2px 4px 4px 2px;box-shadow:5px 7px 0 #e6decc,7px 9px 0 #bfb39a,12px 18px 24px #061b2680;transform:translateZ(-2px)}
.zmb-paper img {width:100%;height:100%;object-fit:cover;display:block;border-radius:inherit}
.zmb-leaf {position:absolute;inset:0;transform-origin:0 50%;transform-style:preserve-3d;transform:rotateY(0deg);pointer-events:none}
.zmb-leaf:nth-of-type(2){transform:translateZ(1px)}
.zmb-leaf:nth-of-type(3){transform:translateZ(2px)}
.zmb-cover {transform:translateZ(3px)}
.zmb-face {position:absolute;inset:0;backface-visibility:hidden;overflow:hidden;background:#fffdf7;border-radius:2px 4px 4px 2px}
.zmb-face img {display:block;width:100%;height:100%;object-fit:cover}
.zmb-face::after {content:"";position:absolute;inset:0;background:linear-gradient(90deg,#132d3e22,transparent 12%,transparent 90%,#9c8c6e18);pointer-events:none}
.zmb-back {transform:rotateY(180deg);background:#f7f1e5}
.zmb-cover .zmb-back {background:#173b4b;border:1px solid #c4a16a}
.zmb-cover .zmb-back::before {content:"";position:absolute;inset:9px;border:1px solid #c4a16a60}
.zmb-replay {display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:4px 10px;margin:0;border:0;border-radius:6px;background:transparent;color:#f2dcab;font:inherit;font-size:13px;cursor:pointer;touch-action:manipulation}
.zmb-replay svg {width:17px;height:17px;flex:none;stroke:currentColor;fill:none;stroke-width:1.6}
.zmb-replay:focus-visible {outline:2px solid #f2dcab;outline-offset:3px}
.zmb-replay:hover {background:#ffffff12}
#local-payment-notice.zmp-livebook .zmp-digital {margin:0;font-size:12px}
#local-payment-notice.zmp-livebook.zmp-revealed .zmp-home-notice-inner,#local-payment-notice.zmp-livebook.zmp-revealed .zmp-home-notice-inner::after {animation:none!important}
@media(max-width:900px){#local-payment-notice.zmp-livebook .zmp-home-notice-inner{grid-template-columns:180px minmax(0,1fr);gap:16px 22px}.zmb-volume{width:102px;height:144px}}
@media(max-width:520px){#local-payment-notice.zmp-livebook .zmp-home-notice-inner{grid-template-columns:142px minmax(0,1fr);gap:8px 12px;padding:28px 16px 16px}.zmb-volume{width:66px;height:94px;transform:translateX(20px) rotateX(7deg) rotateY(-14deg) rotateZ(-3deg);margin-block:10px}.zmb-replay{font-size:12px;padding-inline:0}#local-payment-notice.zmp-livebook .zmp-book-stage{grid-row:1;padding:0}#local-payment-notice.zmp-livebook .zmp-home-notice-link{grid-column:1/-1}#local-payment-notice.zmp-livebook .zmp-promise,#local-payment-notice.zmp-livebook .zmp-promise strong{font-size:21px!important}}
@media(max-width:350px){#local-payment-notice.zmp-livebook .zmp-home-notice-inner{grid-template-columns:108px minmax(0,1fr);gap:10px}.zmb-volume{width:54px;height:77px}.zmb-replay{font-size:11px}#local-payment-notice.zmp-livebook .zmp-promise,#local-payment-notice.zmp-livebook .zmp-promise strong{font-size:19px!important}}
@media(prefers-reduced-motion:reduce){.zmb-volume{transform:translateX(10px)!important}.zmb-leaf{transform:none!important}.zmb-replay{display:none!important}}
.zm-gcard-with-payment #local-payment-notice.zmp-livebook .zmp-book-stage{display:none!important}

/* Round3 full results: in-flow, mobile-first; no overlay or clipped result list. */
main .zc-search-page{width:100%;max-width:960px;margin-inline:auto;position:relative}
main .zc-search-page>label{display:block;font-weight:700;margin-block:1rem .5rem}
main .zc-search-page .zm-search-row{display:flex;gap:.5rem;align-items:stretch}
main .zc-search-page input{min-width:0;flex:1;width:auto}
main .zc-search-page .zm-drop{display:block!important;position:static!important;inset:auto!important;max-height:none!important;overflow:visible!important;box-shadow:none!important;width:100%;border:0;background:transparent;margin-block-start:1rem}
main .zc-search-page .zm-results{max-height:none;overflow:visible;padding:0;list-style:none}
main .zc-search-page .zm-result a{display:block;padding:1rem;border-bottom:1px solid #deded6;overflow-wrap:anywhere}
.zc-next-reading{padding:.75rem 0}.zc-next-reading a{text-decoration:underline;text-underline-offset:.2em}
/* Glossary has a complete linked contents list; its generated excerpt map repeats the same paragraphs. */
body:has([data-zrd-save="immigration-glossary"]) .zrd-concept{display:none}

/* Nov 3: a larger real book; all layout changes remain inside this banner. */
#local-payment-notice.zmp-book-refined .zmp-home-notice-inner{grid-template-columns:300px minmax(0,1fr) auto;gap:24px}
#local-payment-notice.zmp-book-refined .zmp-book-stage{min-height:238px;perspective:1100px;padding:12px 0 0}
.zmp-book-refined .zmb-volume{width:140px;height:198px;transform:rotateX(6deg) rotateY(-12deg) rotateZ(-2deg);margin:4px 0 18px}
.zmp-book-refined .zmb-paper{border-radius:2px 5px 5px 2px;background:#fdfaf1;box-shadow:1px 1px 0 #e5ddcc,2px 2px 0 #fffcf3,3px 3px 0 #cfc5b3,4px 4px 0 #fffcf3,5px 5px 0 #cfc5b3,6px 6px 0 #fffcf3,7px 7px 0 #143441,10px 13px 17px #04151a88}
.zmp-book-refined .zmb-face{border-radius:1px 4px 4px 1px}
.zmp-book-refined .zmb-face::after{background:linear-gradient(90deg,#26392c35 0,transparent 9%,transparent 92%,#9c8c6e16);box-shadow:inset 0 0 0 1px #d2bea332}
.zmp-book-refined .zmb-cover .zmb-face{box-shadow:inset 3px 0 4px #0009,1px 0 1px #e7c983;border:1px solid #c4a16a60}
.zmp-book-refined .zmb-cover .zmb-back{border:0;background:#fffdf7}
.zmp-book-refined .zmb-cover .zmb-back::before{display:none}
#local-payment-notice.zmp-book-refined .zmp-digital{color:#e8d5ac;font-size:13px;letter-spacing:0}
@media(max-width:1000px){#local-payment-notice.zmp-book-refined .zmp-home-notice-inner{grid-template-columns:270px minmax(0,1fr)}#local-payment-notice.zmp-book-refined .zmp-home-notice-link{grid-column:1/-1}}
@media(max-width:600px){#local-payment-notice.zmp-book-refined .zmp-home-notice-inner{grid-template-columns:minmax(0,1fr);gap:12px;padding:28px 22px 22px;text-align:center}#local-payment-notice.zmp-book-refined .zmp-book-stage{grid-column:1;grid-row:1;min-height:198px;padding:0}.zmp-book-refined .zmb-volume{width:116px;height:164px;margin:0 0 18px}#local-payment-notice.zmp-book-refined .zmp-home-notice-copy{grid-column:1;grid-row:2;padding:0}#local-payment-notice.zmp-book-refined .zmp-home-notice-link{grid-column:1;grid-row:3;width:100%}#local-payment-notice.zmp-book-refined .zmp-promise,#local-payment-notice.zmp-book-refined .zmp-promise strong{font-size:23px!important}}
@media(prefers-reduced-motion:reduce){.zmp-book-refined .zmb-volume{transform:rotateZ(-2deg)!important}.zmp-book-refined .zmb-leaf{transform:rotateY(0deg)!important}}
/* This article already has a practical linked contents section; omit only its duplicated generated map. */
body:has([data-zrd-save="language-clb"]) .zrd-concept{display:none}

/* 4 Nov 2026 fix release (FIX-PLAN ج): one floating layer on every page. «اسألني» and «ثبّت» sit above the bottom bar
   (bar + 12px + safe area), stack on the inline end without touching, and leave completely while reading down. */
:root{--fab-bar:0px;--fab-gap:calc(var(--fab-bar) + 12px + env(safe-area-inset-bottom,0px))}
@media (max-width:1023px){:root{--fab-bar:var(--bar,56px)}}
html body #zm-ask-launch.zr-ask-launch{left:auto;right:auto;bottom:auto;inset-inline-start:auto;inset-inline-end:12px;inset-block-end:var(--fab-gap)}
html body .zm-dock{left:auto;right:auto;bottom:auto;inset-inline-start:auto;inset-inline-end:12px;inset-block-end:calc(var(--fab-gap) + 54px + 10px)}
@media (max-width:849px){html body .zm-dock{inset-block-end:calc(var(--fab-gap) + 48px + 10px)}}
html body .zm-dock .zm-dock-btn{width:48px;height:48px;min-height:48px;padding:0;border-radius:999px;font-size:0;justify-content:center}
html body .zm-dock .zm-dock-btn svg{width:26px;height:26px}
html body .zm-dock,html body #zm-ask-launch.zr-ask-launch{transition:transform .2s cubic-bezier(.23,1,.32,1),opacity .2s ease,visibility 0s linear 0s}
html.zm-scroll-down body #zm-ask-launch.zr-ask-launch{transform:translateY(calc(100% + var(--fab-gap) + 8px));opacity:0;visibility:hidden;pointer-events:none;transition:transform .2s cubic-bezier(.23,1,.32,1),opacity .2s ease,visibility 0s linear .2s}
html.zm-scroll-down body .zm-dock{transform:translateY(calc(100% + var(--fab-gap) + 66px));opacity:0;visibility:hidden;pointer-events:none;transition:transform .2s cubic-bezier(.23,1,.32,1),opacity .2s ease,visibility 0s linear .2s}
@media (prefers-reduced-motion:reduce){html body .zm-dock,html body #zm-ask-launch.zr-ask-launch,html.zm-scroll-down body .zm-dock,html.zm-scroll-down body #zm-ask-launch.zr-ask-launch{transition:none}}
html.zm-buying body #zm-ask-launch.zr-ask-launch{opacity:0;visibility:hidden;pointer-events:none}
/* FIX-PLAN و: no automatic dark inversion; forced colours keep the logo and show the chosen item. */
:root{color-scheme:only light}
@media (forced-colors:active){.zm-logo img,.zm-brand img{mix-blend-mode:normal}[aria-current="page"],[aria-current="true"],[aria-selected="true"],.is-active{outline:3px solid Highlight;outline-offset:2px}.zms,.zms-badge{forced-color-adjust:none}}
/* hero film: the large corner on the far side of the caption in RTL */
.zm-herovid{border-radius:14px;border-end-end-radius:80px}
/* home tiles: 3 + 3 on wide screens, no empty cell */
@media (min-width:1024px){.zm-tiles.zm-home{grid-template-columns:repeat(3,minmax(0,1fr))}html body .zm-tiles.zm-home>li:last-child{grid-column:auto}}
/* banner button keeps one line */
.zmp-home-notice-link{white-space:nowrap}
.zmp-home-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin:0}
.zmp-home-actions .zm-btn{white-space:nowrap}
/* one guide block: the sample is the burgundy button, the price page a plain link next to it */
#local-payment-notice .zmp-home-actions .zmp-home-notice-link{background:transparent!important;border:0!important;box-shadow:none!important;color:#FFFEFA!important;text-decoration:underline;text-underline-offset:.25em;padding-inline:0!important;min-height:44px;width:auto!important}
a[data-read]{text-decoration:none;cursor:pointer}

/* 4 Nov 2026 fix release (FIX-PLAN ب): the full stamp lands once at most 132px wide, then a 44px ink badge sits in the step head
   next to its title (never cut). Completion boxes look the same on every path. */
.zms{--zms-s:9.75px}
.zms-slot{padding:8px 4px 12px;padding-inline-end:clamp(2.6rem,10vw,3.6rem)}
.zms-name{-webkit-line-clamp:3}
@media (max-width:360px){.zms{--zms-s:9px}.zms-slot{padding-inline-end:2.6rem}}
.zms-badge{display:inline-flex;flex:0 0 44px;width:44px;height:44px;margin-inline-start:8px;vertical-align:middle;transform:rotate(-6deg)}
.zms-badge svg{width:100%;height:100%;display:block}
@media (min-width:1024px){.zms-badge{flex-basis:48px;width:48px;height:48px}}
summary .zms-badge{order:0}
.cc-review{display:flex;gap:12px;align-items:center;padding:12px;background:var(--mist,#EEF2EF);border-radius:8px;margin-block:16px;min-height:48px;cursor:pointer;font-size:16px;line-height:1.6}
.cc-review input{width:22px;height:22px;accent-color:var(--primary,#7B3546);flex-shrink:0;margin:0}
.zpt-back{font-weight:400;text-decoration:underline;text-underline-offset:.2em}
.zmc-save{margin-block:20px;padding:16px;border:1px solid var(--line,#DBDCD2);border-radius:12px;background:var(--paper,#FFFEFA)}
.zmc-save-note{margin:10px 0 0;font-size:16px;color:var(--muted,#546570)}
.zmc-new-links{margin-block:12px}

/* 4 Nov 2026 fix2 (C1 #14, #15, R3 P3): one focus ring everywhere, ivory on the navy banner; three surfaces
   (paper #FFFEFA, sand #F3F1EA, mist #EEF2EF); one fold indicator; no list numbers beside the step number. */
:root{--focus:#173B4B}
html body :focus-visible{outline:3px solid var(--focus)!important;outline-offset:2px!important}
html body :is(#local-payment-notice,.zmp-home-notice-inner) :focus-visible{outline-color:#FFFEFA!important}
summary:has(> .zc-cue)::after{display:none!important;content:none!important}
html body a.zm-tile,html body a.zm-gcard-pic{background:#FFFEFA}
html body summary.zc-summary,html body .zm-licensing-ref,html body .zmc-next{background:#F3F1EA}
ol.zm-psteps{list-style:none}
.zm-answers[hidden],.zm-answers:has([data-answers-text]:empty){display:none!important}
.zmc-prof{margin-block:12px 18px}
/* fix8 (5 Nov 2026): the guide banner follows its own width, not the window's. A WordPress article column (about 600-640px on a
   desktop) took the 3-column desktop grid (300px book + auto actions) and left the copy 0px wide, one letter per line; the home at
   1024px left it 178px. Three columns only when the banner is wide (1048px and up), book + copy in the middle with the actions below
   (where the tablet layout already puts them), stacked when narrow (the same stacked layout the phone already shows). Layout only: colours, book, motion, close button and analytics unchanged. */
#local-payment-notice.zmp-cinema:not(.zm-gcard-with-payment *){container:zmp-guide-banner/inline-size}
@container zmp-guide-banner (min-width:1048px){
 #local-payment-notice.zmp-book-refined .zmp-home-notice-inner{grid-template-columns:300px minmax(260px,1fr) auto}
 #local-payment-notice.zmp-book-refined .zmp-book-stage{grid-column:1;grid-row:1}
 #local-payment-notice.zmp-book-refined .zmp-home-notice-copy{grid-column:2;grid-row:1}
 #local-payment-notice.zmp-book-refined .zmp-home-notice-inner>:is(.zmp-home-actions,.zmp-home-notice-link),
 #local-payment-notice.zmp-book-refined .zmp-action-flow>.zmp-home-notice-link{grid-column:3;grid-row:1}
}
@container zmp-guide-banner (min-width:600px) and (max-width:1047.98px){
 #local-payment-notice.zmp-book-refined .zmp-home-notice-inner{grid-template-columns:270px minmax(0,1fr)}
 #local-payment-notice.zmp-book-refined .zmp-book-stage{grid-column:1;grid-row:1/3}
 #local-payment-notice.zmp-book-refined .zmp-home-notice-copy{grid-column:2;grid-row:1}
 /* as the tablet layout already places them: the home's two actions under the copy, an article's single button across the bottom */
 #local-payment-notice.zmp-book-refined .zmp-home-notice-inner>.zmp-home-actions{grid-column:2;grid-row:2}
 #local-payment-notice.zmp-book-refined .zmp-home-notice-inner>.zmp-home-notice-link,
 #local-payment-notice.zmp-book-refined .zmp-action-flow>.zmp-home-notice-link{grid-column:1/-1;grid-row:3;justify-self:start;max-width:none}
}
@container zmp-guide-banner (min-width:600px) and (max-width:639.98px){
 #local-payment-notice.zmp-book-refined .zmp-home-notice-inner{grid-template-columns:240px minmax(0,1fr)}
}
/* before the book script has run (or without it) the cover image stays in its 150px column; the actions still go below */
@container zmp-guide-banner (min-width:600px) and (max-width:1047.98px){
 #local-payment-notice.zmp-cinema:not(.zmp-book-refined) .zmp-home-notice-inner{grid-template-columns:150px minmax(0,1fr)}
 #local-payment-notice.zmp-cinema:not(.zmp-book-refined) .zmp-book-stage{grid-column:1;grid-row:1/3}
 #local-payment-notice.zmp-cinema:not(.zmp-book-refined) .zmp-home-notice-copy{grid-column:2;grid-row:1}
 #local-payment-notice.zmp-cinema:not(.zmp-book-refined) .zmp-home-notice-inner>:is(.zmp-home-actions,.zmp-home-notice-link),
 #local-payment-notice.zmp-cinema:not(.zmp-book-refined) .zmp-action-flow>.zmp-home-notice-link{grid-column:2;grid-row:2;justify-self:start}
}
@container zmp-guide-banner (max-width:599.98px){
 #local-payment-notice.zmp-book-refined .zmp-home-notice-inner{grid-template-columns:minmax(0,1fr);gap:12px;padding:28px 22px 22px;text-align:center}
 #local-payment-notice.zmp-book-refined .zmp-book-stage{grid-column:1;grid-row:1;min-height:198px;padding:0}
 .zmp-book-refined .zmb-volume{width:116px;height:164px;margin:0 0 18px}
 #local-payment-notice.zmp-book-refined .zmp-home-notice-copy{grid-column:1;grid-row:2;padding:0}
 #local-payment-notice.zmp-book-refined .zmp-home-notice-inner>:is(.zmp-home-actions,.zmp-home-notice-link),
 #local-payment-notice.zmp-book-refined .zmp-action-flow>.zmp-home-notice-link{grid-column:1;grid-row:3}
 #local-payment-notice.zmp-book-refined .zmp-home-notice-inner>.zmp-home-notice-link,
 #local-payment-notice.zmp-book-refined .zmp-action-flow>.zmp-home-notice-link{width:100%}
 #local-payment-notice.zmp-book-refined .zmp-promise,#local-payment-notice.zmp-book-refined .zmp-promise strong{font-size:23px!important}
}
/* fix9 (5 Nov 2026): the guide banner #local-payment-notice in the owner's approved animated design (guide-banner-concept-20261105,
   portable banner.css: same look, beats, timing, wide and compact designs and poster), scoped to the banner so the earlier banner
   rules and the WordPress theme do not reach it. Navy band, gold kicker and price, burgundy #7B3546 on the main button only, Tajawal.
   The wide design from 760px of banner width (container query), the compact one below it. */
#local-payment-notice.zgb-host[hidden]{display:none!important}
#local-payment-notice .zgb{
 --zgb-ivory:#fffefa;--zgb-navy:#173b4b;--zgb-ink:#173747;--zgb-gold:#e8c77e;--zgb-burgundy:#7b3546;--zgb-soft:#d6dfe1;
 --zgb-travel:cubic-bezier(.45,0,.1,1);--zgb-arrive:cubic-bezier(.25,.8,.25,1);
 --p-left:24px;--p-top:40px;--p-w:190px;--p-h:269px;--s1-x:52px;--s1-y:8px;--s2-x:98px;--s2-y:18px;--out-x:-300px;--out-y:20px;
 container:zgb/inline-size;position:relative;box-sizing:border-box;overflow:hidden;margin:0;padding:0;border:0;border-radius:20px;
 background:linear-gradient(115deg,#1a4152 0%,var(--zgb-navy) 45%,var(--zgb-ink) 100%);color:var(--zgb-ivory);
 font-family:'Tajawal','Segoe UI',Tahoma,sans-serif;text-align:start;box-shadow:none}
#local-payment-notice .zgb *,#local-payment-notice .zgb *::before,#local-payment-notice .zgb *::after{box-sizing:border-box}
#local-payment-notice .zgb__inner{display:flex;flex-direction:column;margin:0;padding:0;background:none;border:0;min-height:0}
#local-payment-notice .zgb__inner::before,#local-payment-notice .zgb__inner::after{content:none}
/* copy: real text, real links */
#local-payment-notice .zgb__copy{display:grid;justify-items:start;text-align:start;padding:0 24px 26px;margin:0;color:var(--zgb-ivory)}
#local-payment-notice .zgb__copy p{margin:0;margin-bottom:0!important;padding:0;max-width:none;color:inherit;font-family:inherit}   /* the article column's own paragraph spacing stays out */
#local-payment-notice .zgb__copy .zgb__kicker{color:var(--zgb-gold);font-size:13px;font-weight:500;line-height:1.4}
#local-payment-notice .zgb__copy .zgb__title{margin-top:6px;font-size:22px;font-weight:800;line-height:1.35;color:var(--zgb-ivory)}
#local-payment-notice .zgb__copy .zgb__kicker+.zgb__title{margin-top:6px}
#local-payment-notice .zgb__copy .zgb__title:first-child{margin-top:0}
#local-payment-notice .zgb__copy .zgb__promise{margin-top:10px;color:var(--zgb-soft);font-size:15px;line-height:1.65}
#local-payment-notice .zgb__copy .zgb__benefit{margin-top:6px;color:var(--zgb-soft);font-size:15px;line-height:1.65}
#local-payment-notice .zgb__copy .zgb__methods{margin-top:6px;color:var(--zgb-gold);font-size:14px;line-height:1.5}
#local-payment-notice .zgb__copy .zgb__methods span{color:inherit}
#local-payment-notice .zgb__new{display:inline-block;padding:2px 9px 1px;margin-inline-end:4px;border-radius:6px;background:var(--zgb-gold);color:var(--zgb-ink);font-size:13px;font-weight:800;line-height:1.5;vertical-align:.12em}
#local-payment-notice .zgb__keep{white-space:nowrap}
#local-payment-notice .zgb__copy .zgb__actions{display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin-top:16px}
#local-payment-notice .zgb__cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;max-width:100%;margin:0;padding:0 22px;border:0;border-radius:10px;
 background:var(--zgb-burgundy)!important;color:#fff!important;font-size:16px;font-weight:700;line-height:1.2;text-align:center;text-decoration:none!important;white-space:normal;
 box-shadow:none;transform:none;transition:background-color .16s ease,transform .16s ease-out}
#local-payment-notice .zgb__cta:hover{background:#6c2e3d!important;transform:none}
#local-payment-notice .zgb__cta:active{transform:scale(.97)}
#local-payment-notice .zgb__link{display:inline;min-height:0;margin:0;padding:0;border:0;border-radius:0;background:transparent!important;color:var(--zgb-ivory)!important;
 font-size:15px;font-weight:700;line-height:1.5;text-decoration:none!important;white-space:nowrap;box-shadow:none;transform:none;transition:none}
#local-payment-notice .zgb__link:hover{text-decoration:underline!important;text-underline-offset:4px;transform:none;background:transparent!important}
#local-payment-notice .zgb__cta:focus-visible,#local-payment-notice .zgb__link:focus-visible{outline:2px solid var(--zgb-gold);outline-offset:3px}
/* the visual: a design-sized stage scaled to its box */
#local-payment-notice .zgb__visual{--zgb-w:358;--zgb-h:334;position:relative;order:-1;overflow:hidden;margin:0;padding:0;height:calc(var(--zgb-h) * var(--k, 1) * 1px)}
#local-payment-notice .zgb__stage{position:absolute;top:0;left:50%;width:calc(var(--zgb-w) * 1px);height:calc(var(--zgb-h) * 1px);margin:0;transform-origin:50% 0;
 transform:translateX(-50%) scale(var(--k, 1));direction:ltr}
#local-payment-notice .zgb__glow{position:absolute;inset:0;background:radial-gradient(70% 45% at 40% 30%,rgba(255,254,250,.07),transparent 70%)}
#local-payment-notice .zgb__deck{position:absolute;inset:0;-webkit-mask-image:linear-gradient(to bottom,#000 0,#000 272px,transparent 316px);mask-image:linear-gradient(to bottom,#000 0,#000 272px,transparent 316px)}
#local-payment-notice .zgb__page{position:absolute;left:var(--p-left);top:var(--p-top);width:var(--p-w);height:var(--p-h);margin:0;padding:0;border:0;border-radius:4px;background:var(--zgb-ivory);
 box-shadow:0 0 0 1px rgba(255,254,250,.16),0 22px 44px -16px rgba(4,16,22,.7);transform-origin:50% 70%;--x:0px;--y:0px;--r:0deg;
 transform:translate(var(--x),var(--y)) rotate(var(--r));will-change:transform;transition:transform .82s var(--zgb-travel)}
#local-payment-notice .zgb__page img{display:block;width:100%;height:100%;max-width:none;margin:0;padding:0;border:0;border-radius:inherit;box-shadow:none;object-fit:cover;-webkit-user-select:none;user-select:none}
#local-payment-notice .zgb__page::after{content:'';position:absolute;inset:0;border-radius:inherit;background:var(--zgb-ink);opacity:0;transition:opacity .6s ease}
#local-payment-notice .zgb__page[data-back]::after{opacity:.3}
#local-payment-notice .zgb__page[data-slot='1']{--x:var(--s1-x);--y:var(--s1-y);--r:3.5deg}
#local-payment-notice .zgb__page[data-slot='2']{--x:var(--s2-x);--y:var(--s2-y);--r:7deg}
#local-payment-notice .zgb__page[data-slot='out']{--x:var(--out-x);--y:var(--out-y);--r:-9deg;transition-duration:.74s}
/* the ringed row: step 6 on page 108 */
#local-payment-notice .zgb__ring{position:absolute;left:6.4%;top:47.1%;width:88%;height:6.5%;border:2px solid var(--zgb-gold);border-radius:5px;background:rgba(232,199,126,.16);
 opacity:0;transform:scale(1.04);transition:opacity .22s ease,transform .32s var(--zgb-arrive)}
#local-payment-notice .zgb__ring[data-on]{opacity:1;transform:none}
/* the price, centred on the cover's corner */
#local-payment-notice .zgb__price{position:absolute;top:0;right:0;translate:50% -50%;display:inline-flex;align-items:baseline;gap:6px;padding:7px 13px 6px;border-radius:999px;
 background:var(--zgb-gold);color:var(--zgb-ink);font-size:14px;font-weight:800;line-height:1.3;white-space:nowrap;direction:rtl;box-shadow:0 10px 24px -10px rgba(4,16,22,.75);
 opacity:0;transform:translateY(-6px) scale(.94);will-change:transform;transition:opacity .14s ease,transform .2s var(--zgb-arrive)}
#local-payment-notice .zgb__price[data-on]{opacity:1;transform:none;transition-duration:.22s,.6s}
#local-payment-notice .zgb__price b{direction:ltr;unicode-bidi:isolate;font-size:17px;font-weight:800;color:inherit}
/* the quoted line */
#local-payment-notice .zgb__note{position:absolute;left:150px;top:204px;width:184px;display:grid;justify-items:start;gap:6px;padding:12px 14px 11px;border-radius:12px;
 background:var(--zgb-ivory);color:var(--zgb-ink);text-align:start;direction:rtl;box-shadow:0 0 0 1px rgba(10,30,40,.12),0 18px 36px -14px rgba(4,16,22,.75);
 opacity:0;transform:translateX(-10px) scale(.97);will-change:transform;transform-origin:0 50%;transition:opacity .16s ease,transform .3s var(--zgb-travel);z-index:30}
#local-payment-notice .zgb__note[data-on]{opacity:1;transform:none;transition:opacity .3s ease,transform .55s var(--zgb-arrive)}
#local-payment-notice .zgb__pill{padding:3px 9px 2px;border-radius:6px;background:#9a6a3a;color:var(--zgb-ivory);font-size:12px;font-weight:700;line-height:1.4}
#local-payment-notice .zgb__line{font-size:14px;font-weight:700;line-height:1.5}
#local-payment-notice .zgb__ref{color:#5a6e76;font-size:12px;line-height:1.4}
/* the leader from the ring to the card: a hairline that draws, a dot on the row */
#local-payment-notice .zgb__leader{position:absolute;z-index:25;left:178px;top:184px;width:1.5px;height:20px;background:var(--zgb-gold);transform-origin:50% 100%;transform:scaleY(0);transition:transform .25s ease-in-out}
#local-payment-notice .zgb__leader::before{content:'';position:absolute;left:50%;top:0;width:7px;height:7px;border-radius:50%;background:var(--zgb-gold);box-shadow:0 0 0 2px var(--zgb-ink);translate:-50% -50%;opacity:0;transition:opacity .2s ease}
#local-payment-notice .zgb__leader[data-on]{transform:none;transition:transform .5s var(--zgb-travel) .15s}
#local-payment-notice .zgb__leader[data-on]::before{opacity:1;transition-delay:.55s}
/* the close button: this page view only (no storage) */
#local-payment-notice .zgb__close{position:absolute;z-index:40;top:6px;inset-inline-end:6px;display:grid;place-items:center;width:44px;height:44px;min-height:44px;flex:none;margin:0;padding:0;border:0;border-radius:10px;
 background:rgba(23,59,75,.55);color:var(--zgb-ivory);cursor:pointer;transition:background-color .16s ease}
#local-payment-notice .zgb__close[hidden]{display:none!important}
#local-payment-notice .zgb__close:hover{background:rgba(255,254,250,.14)}
#local-payment-notice .zgb__close svg{display:block;width:20px;height:20px}
/* a reset snaps without transitions (out of view, or a stop) */
#local-payment-notice .zgb[data-snap] .zgb__stage *{transition:none!important}
/* a tablet-width compact keeps the actions on one line */
@container zgb (min-width:480px) and (max-width:759.98px){
 #local-payment-notice .zgb__copy .zgb__actions{flex-direction:row;flex-wrap:wrap;align-items:center;gap:14px 22px}
}
/* wide: copy at the inline start, the deck beside it */
@container zgb (min-width:760px){
 #local-payment-notice .zgb__inner{flex-direction:row;align-items:stretch;min-height:300px}
 #local-payment-notice .zgb__copy{flex:0 0 auto;width:min(400px,44%);align-content:center;padding:36px 0;padding-inline-start:48px}
 #local-payment-notice .zgb__copy .zgb__kicker{font-size:14px}
 #local-payment-notice .zgb__copy .zgb__title{font-size:27px}
 #local-payment-notice .zgb__copy .zgb__promise,#local-payment-notice .zgb__copy .zgb__benefit{font-size:16px;line-height:1.7}
 #local-payment-notice .zgb__copy .zgb__actions{flex-direction:row;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:18px}
 #local-payment-notice .zgb__visual{--zgb-w:560;--zgb-h:360;order:0;flex:1 1 auto;height:auto;min-height:calc(var(--zgb-h) * var(--k, 1) * 1px)}
 #local-payment-notice .zgb__stage{top:auto;bottom:0;left:auto;right:32px;transform-origin:100% 100%;transform:scale(var(--k, 1));
  --p-left:56px;--p-top:44px;--p-w:250px;--p-h:354px;--s1-x:62px;--s1-y:12px;--s2-x:116px;--s2-y:26px;--out-x:-410px;--out-y:26px}
 #local-payment-notice .zgb__glow{background:radial-gradient(60% 70% at 32% 40%,rgba(255,254,250,.07),transparent 70%)}
 #local-payment-notice .zgb__deck{-webkit-mask-image:none;mask-image:none}
 #local-payment-notice .zgb__price{padding:8px 16px 7px;font-size:16px}
 #local-payment-notice .zgb__price b{font-size:19px}
 #local-payment-notice .zgb__note{left:364px;top:166px;width:196px;padding:14px 16px 13px}
 #local-payment-notice .zgb__line{font-size:15px}
 #local-payment-notice .zgb__leader{left:292px;top:221.5px;width:72px;height:1.5px;transform-origin:100% 50%;transform:scaleX(0)}
 #local-payment-notice .zgb__leader::before{left:0;top:50%}
 #local-payment-notice .zgb__close{background:transparent}
 #local-payment-notice .zgb__close:hover{background:rgba(255,254,250,.1)}
}
/* reduced motion (the visitor's own device setting): the poster only, nothing moves */
@media (prefers-reduced-motion:reduce){
 #local-payment-notice .zgb .zgb__stage *{transition:none!important}
 #local-payment-notice .zgb__cta{transition:none}
}
/* fix10 (9 Nov 2026, owner «كمل باقي الاصلاحات»): the mobile UX committee's platform fixes
   (outputs/committees-20261109/1-mobile-ux-design/REPORT-AR.md). Appended to integration.css (platform pages) and combined.css
   (WordPress pages and the home). Selectors carry html/body so they win over the files loaded after these two. */

/* 1. Calculator /points/: the next button stays tappable; a short message names the missing answer; the score is the hero. */
html body [data-zm-tool] .zm-btn[data-tool-next][aria-disabled="true"]{opacity:.55;filter:saturate(.35);box-shadow:none;cursor:pointer}
html body [data-zm-tool] .zm-tool-missing{margin:14px 0 0;font-weight:700;color:#173747}
html body [data-zm-tool] .zm-tool-missing:empty{margin:0}
html body [data-zm-tool] .zm-tool-need{margin:10px 0 0;padding:10px 14px;border:1px solid #e6d3ad;border-radius:10px;background:#fbf4e6;color:#173747;font-weight:700;line-height:1.6}
html body [data-zm-tool] .zm-score-hero{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;margin-block:6px 10px;color:#173747}
html body [data-zm-tool] .zm-score-hero > bdi{font-size:56px;line-height:1.05;font-weight:800;color:#173747;font-variant-numeric:tabular-nums}
html body [data-zm-tool] .zm-score-unit{font-size:20px;font-weight:700;color:#173747}

/* 2. «اسألني» on phones: a 48px circle, 16px above the bottom bar (and the safe area), faded out while reading down instead of
   sliding under the bar; hidden on the calculator, the guide samples and the buying pages. */
@media (max-width:849px){
 html:root{--fab-gap:calc(var(--fab-bar) + 1px + 16px + env(safe-area-inset-bottom,0px))}
 html:root body #zm-ask-launch.zr-ask-launch{width:48px;height:48px;min-height:48px;padding:0;gap:0;justify-content:center;border-radius:50%}
 html:root body #zm-ask-launch.zr-ask-launch img{width:44px;height:44px}
 html:root body #zm-ask-launch.zr-ask-launch span{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
 html:root.zm-scroll-down body #zm-ask-launch.zr-ask-launch{transform:none}
 html:root:not(.zm-noask):not(.zm-buying) body main#main{padding-bottom:max(calc(120px + env(safe-area-inset-bottom,0px)),calc(var(--fab-gap) + 48px + 16px))}
}
html:root.zm-noask body #zm-ask-launch.zr-ask-launch{display:none}

/* 3. Search boxes: an empty box reads right to left, so the Arabic hint starts at its first word instead of being cut. */
html[dir="rtl"] input[dir="auto"]:placeholder-shown{direction:rtl;text-align:right}
html[dir="rtl"] input[type="search"]{text-overflow:ellipsis}

/* 6. Home first screen on phones: the story video is a 150px strip and the gaps around it are tighter, so the first two choices
   show on the first screen at 360x780 with the slogan line kept (owner 9 Nov: «السطر ده شعار»). Text and its sizes are unchanged. */
@media (max-width:600px){
 html body .zn-home-hero{padding-bottom:4px}
 html body .zn-home-hero .zm-intro{margin-bottom:4px}
 html body .zn-home-hero .zm-herovid{aspect-ratio:auto;height:150px;min-height:0;margin-top:10px}
 html body .zn-home-hero .zm-herovid video{object-position:65% 45%}
 html body .zm-finder#finder{padding-top:12px}
 html body .zm-finder #finder-h{margin-bottom:8px}
}

/* 7. Readable fold labels and 44px stand-alone links. */
html body main .zc-summary > .zc-cue,html body .zgs-page .zc-summary > .zc-cue{font-size:14px}
html body .zm-jump > a,html body #local-payment-notice .zgb__link,html body .zmc-links > a,html body a.zm-textlink[href="/#finder"],
html body .zn-shortcuts > a,html body .zn-unsure > a{min-height:44px;display:inline-flex;align-items:center}
/* fix13 UX (9 Nov 2026, owner «ادخل الاصلاحات الخفيفة والمناسبة اما الحركات التقيلة استبعدها»): light fixes from the design and
   motion review (outputs/design-motion-review-20261109/REPORT-AR.md). Appended to reader.css and combined.css (platform pages, and
   WordPress pages through the footer chrome). CSS first; transform and opacity only; every motion is off with reduced motion. */

/* 1. A guide card stands in for the banner on this page (data-zm-card-here, written into the page at build time with
      guide-cards.js's own rule), so the banner never takes space in the first paint; guide-cards.js still hides it as before. */
html body #local-payment-notice[data-zm-card-here]{display:none!important}

/* 3. Tajawal's local stand-in while the web font loads: Segoe UI scaled to Tajawal's width on long Arabic lines and set to
      Tajawal's own ascent and descent (measured in Chrome on the release's woff2 files against Segoe UI: long paragraphs 100% regular
      and 105.5% bold; ascent 1.02em and descent 0.38em regular, 1.07em and 0.41em bold), so the swap moves the text as little as
      possible. font-display stays as it is. */
@font-face{font-family:"Tajawal Fallback";src:local("Segoe UI"),local("SegoeUI");font-weight:100 500;size-adjust:100%;ascent-override:102%;descent-override:38%;line-gap-override:0%}
@font-face{font-family:"Tajawal Fallback";src:local("Segoe UI Bold"),local("SegoeUI-Bold");font-weight:600 900;size-adjust:105.5%;ascent-override:101.4%;descent-override:38.9%;line-gap-override:0%}
html body[data-page-type],html body :is(.zm-skip,.zm-header,.zm-menu-panel,.zm-footer,.zm-bottom){font-family:Tajawal,"Tajawal Fallback","Segoe UI",Tahoma,sans-serif}
html body .zm-qgrid article :is(.q-picker button,.q-jnav button,.q-jtoggle),html body .zm-qgrid article ol.zm-steps>li::before{font-family:Tajawal,"Tajawal Fallback",sans-serif}

/* 4. Page to page: a short cross-fade (220ms, ease-out); the header and the bottom bar stay put; a question opened from a list
      carries its title into the page's heading. Browsers without cross-document view transitions simply load the page. */
@media (prefers-reduced-motion:no-preference){
 @view-transition{navigation:auto}
 html body .zm-header{view-transition-name:zm-header}
 html body .zm-bottom{view-transition-name:zm-bottom}
 html body[data-page-type="q"] main h1{view-transition-name:zm-qtitle}
 ::view-transition-old(root),::view-transition-new(root){animation-duration:.22s;animation-timing-function:cubic-bezier(.23,1,.32,1)}
 ::view-transition-group(zm-qtitle){animation-duration:.22s;animation-timing-function:cubic-bezier(.23,1,.32,1)}
 ::view-transition-old(zm-qtitle),::view-transition-new(zm-qtitle){animation-duration:.22s;height:100%;object-fit:contain;object-position:right center}
}

/* 5. A 3px reading bar along the bottom of the header on long reading pages (question pages, the notices page, WordPress
      articles): it follows the page's own scroll in CSS and moves by transform only. Not where a step bar already shows progress. */
@supports (animation-timeline:scroll()){
 @media (prefers-reduced-motion:no-preference){
  html body:is([data-page-type="q"],[data-page-type="notice"],.single-post):not(:has(.zm-stepbar)) .zm-header::after{content:"";position:absolute;inset-inline:0;bottom:-1px;height:3px;background:#173747;transform:scaleX(0);transform-origin:left center;animation:zm-read-bar linear both;animation-timeline:scroll(root block);pointer-events:none}
  html[dir="rtl"] body:is([data-page-type="q"],[data-page-type="notice"],.single-post) .zm-header::after{transform-origin:right center}
 }
}
@keyframes zm-read-bar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media print{html body .zm-header::after{display:none}}

/* 1b. /points/: the guide card goes into a slot kept for it under the calculator (its height measured at each screen width), so
       the calculator page does not move when the card arrives. ux13.js releases the slot if no card comes. */
html body main>.zm-gslot{display:block;margin:24px 16px}
html body main>.zm-gslot{min-height:462px}
@media (max-width:374px){html body main>.zm-gslot{min-height:490px}}
@media (max-width:339px){html body main>.zm-gslot{min-height:517px}}
@media (min-width:480px){html body main>.zm-gslot{min-height:435px}}
@media (min-width:540px){html body main>.zm-gslot{min-height:381px}}
@media (min-width:601px){html body main>.zm-gslot{min-height:300px}}
@media (min-width:768px){html body main>.zm-gslot{min-height:244px}}
@media (min-width:900px){html body main>.zm-gslot{max-width:860px;margin-inline:auto}}

/* 6. Calculator result: a thin bar under the CRS number (out of 1200); app.js fills it once with the count. */
html body [data-zm-tool] .zm-score-bar{display:block;height:4px;margin-block:0 12px;border-radius:4px;background:var(--line,#DBDCD2);overflow:hidden}
html body [data-zm-tool] .zm-score-bar>i{display:block;height:100%;border-radius:4px;background:#173747;transform-origin:right center}
html[dir="ltr"] body [data-zm-tool] .zm-score-bar>i{transform-origin:left center}
html body [data-zm-tool] .zm-score-hero>bdi.zm-counting{display:inline-block;text-align:end}

/* 7. Path steps: the tick draws itself (250ms) when a step is marked done, and the phones' step bar fills with the steps done.
      The box keeps its size and the site's selected colour; ux13.js adds the drawing only where it runs. */
html body main label.cc-review.zm-cdraw{position:relative}
html body main label.cc-review.zm-cdraw>input[type=checkbox]{appearance:none;-webkit-appearance:none;box-sizing:border-box;width:22px;height:22px;margin:0;flex-shrink:0;border:2px solid var(--primary,#7B3546);border-radius:6px;background:var(--paper,#FFFEFA);cursor:pointer;transition:background-color .15s ease}
html body main label.cc-review.zm-cdraw>input[type=checkbox]:checked{background:var(--primary,#7B3546)}
html body main label.cc-review.zm-cdraw>input[type=checkbox]:focus-visible{outline:3px solid #173747;outline-offset:2px}
html body main label.cc-review.zm-cdraw>.zm-ccheck{position:absolute;inset-inline-start:12px;top:50%;width:22px;height:22px;margin-top:-11px;pointer-events:none;fill:none;stroke:#FFFEFA;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
html body main label.cc-review.zm-cdraw>.zm-ccheck path{stroke-dasharray:20;stroke-dashoffset:20;transition:stroke-dashoffset .25s cubic-bezier(.23,1,.32,1)}
html body main label.cc-review.zm-cdraw>input:checked+.zm-ccheck path{stroke-dashoffset:0}
html body .zm-stepbar{--zm-done:0}
html body .zm-stepbar::after{content:"";position:absolute;inset-inline:0;bottom:-1px;height:3px;background:#173747;transform:scaleX(var(--zm-done));transform-origin:right center;pointer-events:none}
html[dir="ltr"] body .zm-stepbar::after{transform-origin:left center}
html body .zm-stepbar[data-zm-fill]::after{transition:transform .3s cubic-bezier(.23,1,.32,1)}
@media (prefers-reduced-motion:reduce){
 html body main label.cc-review.zm-cdraw>.zm-ccheck path,html body main label.cc-review.zm-cdraw>input[type=checkbox],html body .zm-stepbar[data-zm-fill]::after{transition:none}
}
@media print{html body main label.cc-review.zm-cdraw>.zm-ccheck{display:none}}

/* 8. Folds open and close with a short height animation (200ms) where the browser can animate to auto; elsewhere they open at
      once, as today. Limited to the page's own folds (main), and only once the page has loaded (ux13.js sets zm-folds), so folds
      that the page's scripts open or close while loading do not slide. */
@supports selector(::details-content){
 @media (prefers-reduced-motion:no-preference){
  html.zm-folds body main details{interpolate-size:allow-keywords}
  html.zm-folds body main details::details-content{block-size:0;overflow-y:clip;transition:block-size .2s cubic-bezier(.23,1,.32,1),content-visibility .2s allow-discrete}
  html.zm-folds body main details[open]::details-content{block-size:auto}
 }
}

/* 9. Wide screens: «اسألني» and the install button are one column of two 48px circles in the corner (the page's side margin from
      1280px up), so they no longer cover the last row of cards; «اسألني» shows its name on hover or keyboard focus. The install
      button stays hidden on wide screens after its first close (zm-app.js). */
@media (min-width:850px){
 html:root body #zm-ask-launch.zr-ask-launch{width:48px;height:48px;min-height:48px;padding:0;gap:0;justify-content:center;border-radius:50%}
 html:root body #zm-ask-launch.zr-ask-launch img{width:44px;height:44px}
 html:root body #zm-ask-launch.zr-ask-launch span{position:absolute;inset-inline-end:calc(100% + 8px);top:50%;width:auto;height:auto;margin:0;padding:6px 12px;transform:translateY(-50%);overflow:visible;clip:auto;clip-path:none;white-space:nowrap;border:1px solid #e3cbd0;border-radius:999px;background:#fffcf7;color:#7b3546;font-size:15px;line-height:1.3;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s ease,visibility 0s linear .15s}
 html:root body #zm-ask-launch.zr-ask-launch:is(:hover,:focus-visible) span{opacity:1;visibility:visible;transition:opacity .15s ease,visibility 0s}
 html body .zm-dock{inset-block-end:calc(var(--fab-gap) + 48px + 10px)}
 html.zm-dock-closed body .zm-dock[data-zm-dock]{display:none}
}
@media (min-width:850px) and (prefers-reduced-motion:reduce){html:root body #zm-ask-launch.zr-ask-launch span{transition:none}}

/* 10. Wide screens, question pages: the picture under the short answer is at most 220px tall, whole (never cropped), centred. */
@media (min-width:1024px){
 html body .zm-qgrid article .q-hero img{width:auto;max-width:100%;max-height:220px;margin-inline:auto}
}