/* Maqalati Plus — Public Design System · unified with admin-panel.css.
   Delivered as a standalone asset so shared-hosting installs need no Vite rebuild. */
:root {
  --front-primary:#6154dc;
  --front-primary-dark:#483dc2;
  --front-secondary:#12a4bc;
  --front-ink:#202a42;
  --front-muted:#69778e;
  --front-line:#e5e9f2;
  --front-bg:#f5f7fc;
  --front-surface:#fff;
  --front-surface-alt:#f6f8fd;
  --front-gradient:linear-gradient(125deg,#6154dc 0%,#625de0 51%,#12a4bc 100%);
  --front-shadow:0 12px 36px rgba(27,43,78,.062);
  --front-shadow-hover:0 22px 50px rgba(52,58,125,.14);
  --front-radius:20px;
  color-scheme:light;
}
html.dark {
  --front-primary:#a49aff;
  --front-primary-dark:#cbc5ff;
  --front-secondary:#57d7e8;
  --front-ink:#edf1ff;
  --front-muted:#acb8d0;
  --front-line:#34415c;
  --front-bg:#101829;
  --front-surface:#1b263b;
  --front-surface-alt:#23314a;
  --front-gradient:linear-gradient(125deg,#3b2d94 0%,#423b96 55%,#126c85 100%);
  --front-shadow:0 14px 34px rgba(0,0,0,.18);
  --front-shadow-hover:0 22px 52px rgba(0,0,0,.28);
  color-scheme:dark;
}
html {scroll-behavior:smooth;}
html,body {overflow-x:clip;}
body.site-amiri.front-shell {margin:0;background:var(--front-bg) !important;color:var(--front-ink);font-size:1.13rem;line-height:1.75;min-height:100vh;text-align:start;}
.front-shell *, .front-shell *::before,.front-shell *::after {box-sizing:border-box;}
.front-shell a {text-decoration:none; color:inherit;}
.front-shell a:hover {color:var(--front-primary);}
.front-shell button {cursor:pointer;}
.front-shell :is(a,button,input,select,textarea):focus-visible {outline:3px solid var(--front-secondary);outline-offset:3px;}
.front-shell img,.front-shell video,.front-shell iframe {max-width:100%;}
.front-shell img {display:block;}
.front-shell .text-primary {color:var(--front-primary) !important;}
.front-shell .bg-primary {background:var(--front-primary) !important;}
.front-shell .border-primary {border-color:var(--front-primary) !important;}
.front-shell .text-secondary {color:var(--front-ink) !important;}
.front-shell .bg-secondary {background:var(--front-ink) !important;}
.front-shell [x-cloak] {display:none !important;}
.site-container {width:min(100% - 2.5rem,1250px);margin-inline:auto;}
.front-skip-link {position:fixed;inset-block-start:-100px;inset-inline-start:1rem;z-index:99999;background:var(--front-primary);color:white !important;padding:.7rem 1rem;border-radius:12px;}
.front-skip-link:focus {inset-block-start:.5rem;}
/* Header / navigation */
.front-header {position:sticky;inset-block-start:0;z-index:1000;background:var(--front-surface);border-block-end:1px solid var(--front-line);box-shadow:0 4px 28px rgba(37,45,90,.035);}
.front-header-main {min-height:91px;display:flex;align-items:center;justify-content:space-between;gap:clamp(1rem,2.4vw,2.5rem);}
.front-brand {display:inline-flex;align-items:center;gap:.85rem;max-width:45%;min-width:0;flex-shrink:0;}
.front-brand-logo,.front-brand-mark {width:52px;height:52px;flex:none;border-radius:16px;object-fit:cover;box-shadow:0 6px 19px rgba(97,84,220,.16);}
.front-brand-mark {background:linear-gradient(145deg,#6154dc,#12a4bc);display:grid;place-items:center;color:#fff;font-size:1.35rem;}
.front-brand-copy {display:grid;line-height:1.2;min-width:0;}
.front-brand-copy strong {font-size:clamp(1.45rem,2.2vw,2rem);color:var(--front-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.front-brand-copy small {font-size:.85rem;color:var(--front-muted);margin-block-start:.25rem;}
.front-header-search,.front-mobile-search {height:48px;max-width:430px;flex:1;display:flex;align-items:center;gap:.65rem;border:1px solid var(--front-line);background:var(--front-surface-alt);border-radius:14px;padding:.25rem .8rem;transition:border-color .2s,box-shadow .2s;}
.front-header-search:focus-within,.front-mobile-search:focus-within {border-color:var(--front-primary);box-shadow:0 0 0 4px rgba(97,84,220,.10);}
.front-header-search > i {font-size:.95rem;color:var(--front-muted);}
.front-header-search input,.front-mobile-search input {border:0 !important;outline:0 !important;box-shadow:none !important;background:transparent !important;color:var(--front-ink) !important;flex:1;min-width:0;height:100%;padding:0 !important;font-size:1rem !important;}
.front-header-search input::placeholder,.front-mobile-search input::placeholder {color:var(--front-muted);}
.front-header-search button,.front-mobile-search button {background:var(--front-primary);border:0;color:#fff;padding:.28rem 1.15rem;min-height:36px;border-radius:10px;font-size:.99rem;}
.front-header-actions {display:flex;align-items:center;gap:.6rem;flex-shrink:0;}
.front-icon-button {width:46px;height:46px;display:grid;place-items:center;border:1px solid var(--front-line);border-radius:14px;background:var(--front-surface-alt);color:var(--front-ink);transition:all .2s;}
.front-icon-button:hover {background:var(--front-primary);border-color:var(--front-primary);color:white;}
.front-menu-toggle {display:none;}
.front-nav-wrap {border-block-start:1px solid var(--front-line);}
.front-nav {display:flex;align-items:center;gap:.12rem;min-height:54px;flex-wrap:wrap;}
.front-nav-link {display:flex;align-items:center;gap:.44rem;padding:.55rem .85rem;border-radius:10px;white-space:nowrap;font-size:1.02rem;font-weight:700;color:var(--front-ink);transition:background .2s,color .2s;}
.front-nav-link:hover,.front-nav-link.is-active {background:var(--front-surface-alt);color:var(--front-primary);}
.front-nav-dropdown {position:relative;}
.front-nav-submenu {position:absolute;inset-block-start:100%;inset-inline-start:0;min-width:215px;display:none;padding:.45rem;background:var(--front-surface);border:1px solid var(--front-line);box-shadow:var(--front-shadow-hover);border-radius:14px;z-index:1001;}
.front-nav-dropdown:hover .front-nav-submenu,.front-nav-dropdown:focus-within .front-nav-submenu {display:grid;}
.front-nav-submenu a {padding:.55rem .75rem;border-radius:9px;font-size:.95rem;}
.front-nav-submenu a:hover {background:var(--front-surface-alt);}
.front-mobile-nav {background:var(--front-surface);border-block-start:1px solid var(--front-line);box-shadow:var(--front-shadow);max-height:calc(100dvh - 75px);overflow-y:auto;}
.front-mobile-nav > .site-container {display:grid;gap:.15rem;padding-block:.9rem 1.5rem;}
.front-mobile-nav a {padding:.5rem .75rem;border-radius:9px;font-size:1.06rem;}
.front-mobile-nav a:hover {background:var(--front-surface-alt);}
.front-mobile-nav .front-mobile-subitem {padding-inline-start:1.8rem;color:var(--front-muted);font-size:.98rem;}
.front-mobile-search {max-width:none;width:100%;margin-block:.25rem .65rem;}
/* Page shell and sections */
.front-main {min-height:55vh;padding-block:1.45rem 3rem;}
.front-content-layout {display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:2rem;align-items:start;}
.front-primary-column {min-width:0;}
.front-section {margin-block:0 3rem;}
.front-section-heading {display:flex;align-items:end;justify-content:space-between;gap:.8rem;border-block-end:1px solid var(--front-line);padding-block:0 1rem;margin-block-end:1.35rem;}
.front-section-label {color:var(--front-primary);font-size:.96rem;font-weight:700;}
.front-section-heading h2 {position:relative;font-size:clamp(1.5rem,2.4vw,2rem);margin:.05rem 0 0;color:var(--front-ink) !important;font-weight:700;line-height:1.4;}
.front-section-more {display:inline-flex;align-items:center;gap:.5rem;color:var(--front-primary) !important;font-size:.99rem;font-weight:700;white-space:nowrap;}
.front-section-decoration {display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--front-surface);color:var(--front-primary);border:1px solid var(--front-line);}
.front-article-grid,.front-featured-grid,.front-media-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.3rem;}
.front-pagination {margin-block-start:1.5rem;}
.front-pagination nav {max-width:100%;overflow-x:auto;padding:.5rem;}
.front-pagination a,.front-pagination span {border-color:var(--front-line);}
/* Editorial cards — shared by listing, home, search, categories and writers */
.front-post-card,.front-media-card,.front-person-card {display:flex;flex-direction:column;min-width:0;border:1px solid var(--front-line);border-radius:var(--front-radius);background:var(--front-surface);box-shadow:var(--front-shadow);overflow:hidden;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;}
.front-post-card:hover,.front-media-card:hover,.front-person-card:hover {transform:translateY(-4px);border-color:rgba(97,84,220,.32);box-shadow:var(--front-shadow-hover);}
.front-post-media {height:auto;aspect-ratio:1.7/1;display:block;position:relative;overflow:hidden;background:linear-gradient(145deg,#34377e,#137e99);}
.front-post-media img,.front-media-stage img {width:100%;height:100% !important;object-fit:cover;transition:transform .55s ease;}
.front-post-card:hover .front-post-media img,.front-media-card:hover .front-media-stage img {transform:scale(1.045);}
.front-media-placeholder {width:100%;height:100%;display:grid;place-items:center;color:rgba(255,255,255,.6);font-size:3rem;background:linear-gradient(145deg,#3b347e,#18758b);}
.front-post-category {position:absolute;inset-block-end:.85rem;inset-inline-start:.85rem;background:rgba(255,255,255,.95);color:#4d42bd;border-radius:999px;padding:.18rem .72rem;font-size:.92rem;font-weight:700;max-width:calc(100% - 1.7rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.front-post-body {display:flex;flex:1;flex-direction:column;padding:1.2rem 1.2rem 1rem;min-width:0;}
.front-post-eyebrow {display:flex;align-items:center;gap:.45rem;color:var(--front-primary);font-size:.91rem;font-weight:700;}
.front-eyebrow-line {width:16px;height:3px;border-radius:3px;background:var(--front-secondary);}
.front-post-title {font-size:1.47rem !important;line-height:1.45 !important;font-weight:700 !important;color:var(--front-ink) !important;margin:.45rem 0;overflow-wrap:anywhere;}
.front-post-title a:hover {color:var(--front-primary);}
.front-post-excerpt {color:var(--front-muted);font-size:1.08rem;line-height:1.78;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:.35rem 0 1rem;}
.front-post-bottom {margin-block-start:auto;padding-block-start:.85rem;border-block-start:1px solid var(--front-line);display:flex;align-items:center;gap:.6rem;justify-content:space-between;}
.front-post-meta {display:flex;gap:.6rem 1rem;flex-wrap:wrap;color:var(--front-muted);font-size:.88rem;min-width:0;}
.front-post-meta :is(time,a) {display:inline-flex;gap:.32rem;align-items:center;min-width:0;}
.front-post-arrow {width:33px;height:33px;border-radius:10px;flex-shrink:0;display:grid;place-items:center;background:var(--front-surface-alt);color:var(--front-primary) !important;transition:background .2s;}
.front-post-arrow:hover {background:rgba(97,84,220,.16);}
.front-post-card--hero {grid-column:1 / -1;display:grid;grid-template-columns:1.1fr 1fr;min-height:290px;}
.front-post-card--hero .front-post-media {height:100%;aspect-ratio:auto;min-height:280px;}
.front-post-card--hero .front-post-body {padding:clamp(1.2rem,3vw,2rem);}
.front-post-card--hero .front-post-title {font-size:clamp(1.65rem,2.6vw,2.2rem) !important;}
/* Sidebar */
.front-sidebar {display:grid;gap:1.4rem;min-width:0;}
.front-sidebar-card {border:1px solid var(--front-line);border-radius:var(--front-radius);background:var(--front-surface);box-shadow:var(--front-shadow);padding:1.15rem;min-width:0;}
.front-sidebar-ad .ad-content {max-width:100%;overflow:hidden;}
.front-sidebar-ad .ad-content :is(img,iframe,video) {max-width:100%;}
.front-sidebar-head {display:flex;gap:.65rem;align-items:center;margin-block-end:1.1rem;}
.front-sidebar-head h2 {font-size:1.35rem !important;color:var(--front-ink) !important;margin:0;}
.front-sidebar-icon {width:37px;height:37px;border-radius:11px;display:grid;place-items:center;background:var(--front-surface-alt);color:var(--front-primary);}
.front-popular-list {display:grid;}
.front-popular-item {display:flex;gap:.8rem;align-items:flex-start;padding:.85rem 0;border-block-end:1px solid var(--front-line);}
.front-popular-item:last-child {border-block-end:0;padding-block-end:0;}
.front-popular-rank {font-size:1.4rem;font-weight:700;color:var(--front-secondary);line-height:1.2;opacity:.85;}
.front-popular-text {display:grid;gap:.25rem;min-width:0;}
.front-popular-text strong {font-size:1.04rem;line-height:1.55;font-weight:700;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.front-popular-text small,.front-sidebar-author small {color:var(--front-muted);font-size:.86rem;}
.front-tag-cloud {display:flex;flex-wrap:wrap;gap:.5rem;}
.front-tag-cloud a {border:1px solid var(--front-line);border-radius:999px;background:var(--front-surface-alt);padding:.28rem .75rem;font-size:.95rem;color:var(--front-primary);transition:all .2s;}
.front-tag-cloud a:hover {background:var(--front-primary);color:#fff;border-color:var(--front-primary);}
.front-sidebar-authors {display:grid;gap:.5rem;}
.front-sidebar-author {display:flex;gap:.65rem;align-items:center;padding:.5rem;border-radius:12px;transition:background .2s;}
.front-sidebar-author:hover {background:var(--front-surface-alt);}
.front-sidebar-author img {width:46px;height:46px !important;object-fit:cover;border-radius:50%;flex:none;}
.front-sidebar-author > span {display:grid;min-width:0;flex:1;}
.front-sidebar-author strong {font-size:1.02rem;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.front-sidebar-author > i {font-size:.75rem;color:var(--front-muted);}
.front-sidebar-more {display:flex;justify-content:space-between;align-items:center;margin-block-start:1rem;padding-block-start:.7rem;border-block-start:1px solid var(--front-line);color:var(--front-primary) !important;font-weight:700;font-size:1rem;}
/* Media, people, search and reading */
.front-media-card {min-width:0;}
.front-media-stage {display:block;position:relative;aspect-ratio:16 / 10;overflow:hidden;background:#131d2d;}
.front-media-stage :is(iframe,video) {height:100%;width:100%;object-fit:cover;}
.front-paper-card .front-media-stage {aspect-ratio:3/4;}
.front-media-details {display:grid;gap:.3rem;padding:1rem 1.15rem;}
.front-media-details h3 {font-size:1.25rem !important;margin:0;line-height:1.4 !important;color:var(--front-ink) !important;}
.front-media-details p,.front-media-label {font-size:.95rem;color:var(--front-muted);}
.front-media-label {color:var(--front-primary);font-weight:700;}
.front-page-banner {position:relative;overflow:hidden;border:1px solid var(--front-line);border-radius:22px;background:linear-gradient(110deg,rgba(97,84,220,.10),rgba(18,164,188,.08)),var(--front-surface);padding:clamp(1.5rem,3vw,2.4rem);margin-block-end:1.7rem;}
.front-page-banner::before {content:"";position:absolute;inset-inline-end:-70px;inset-block-start:-80px;width:250px;height:250px;border:1px solid rgba(97,84,220,.13);border-radius:50%;pointer-events:none;}
.front-page-banner .front-section-label {display:block;margin-block-end:.35rem;}
.front-page-banner h1 {font-size:clamp(1.9rem,3.7vw,2.8rem) !important;margin:0;color:var(--front-ink) !important;line-height:1.36 !important;}
.front-page-banner p {color:var(--front-muted);margin:.55rem 0 0;font-size:1.05rem;}
.front-list-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.3rem;}
.front-subcategory-list {display:flex;flex-wrap:wrap;gap:.7rem;margin-block:0 1.5rem;}
.front-subcategory-list a {padding:.4rem .9rem;border-radius:12px;border:1px solid var(--front-line);background:var(--front-surface);color:var(--front-ink);font-weight:700;}
.front-subcategory-list a:hover {border-color:var(--front-primary);color:var(--front-primary);}
.front-empty-state {background:var(--front-surface);border:1px dashed var(--front-line);border-radius:20px;padding:clamp(2rem,5vw,4rem);text-align:center;color:var(--front-muted);}
.front-empty-state i {display:block;font-size:2.3rem;color:var(--front-primary);margin-block-end:.5rem;}
.front-person-card {align-items:center;text-align:center;padding:1.4rem;}
.front-person-card img {width:105px;height:105px !important;border-radius:50%;object-fit:cover;border:4px solid var(--front-surface);box-shadow:0 6px 20px rgba(26,35,76,.12);}
.front-person-card h2 {font-size:1.5rem !important;color:var(--front-ink) !important;margin:1rem 0 .2rem;}
.front-person-card p {color:var(--front-muted);margin:0;}
.front-person-card .front-person-meta {display:flex;gap:1rem;flex-wrap:wrap;justify-content:center;color:var(--front-muted);font-size:.92rem;margin:.8rem 0;}
.front-person-card .front-person-link {margin-block-start:auto;display:block;width:100%;border:1px solid var(--front-line);border-radius:11px;padding:.4rem .7rem;color:var(--front-primary);font-weight:700;}
.front-person-card .front-person-link:hover {background:var(--front-surface-alt);}
.front-content-panel {background:var(--front-surface);border:1px solid var(--front-line);border-radius:24px;box-shadow:var(--front-shadow);padding:clamp(1.1rem,3vw,2.8rem);}
.front-content-panel .prose {max-width:none;color:var(--front-ink);font-size:1.23rem;line-height:2.1;overflow-wrap:anywhere;}
.front-content-panel .prose :is(p,li,blockquote){line-height:2.1;}
.front-content-panel .prose :is(a){color:var(--front-primary);}
.front-content-panel .prose :is(img,table,iframe){max-width:100%;}
.front-content-panel .prose img {height:auto;}
.front-content-panel .prose table {display:block;overflow-x:auto;}
.front-content-panel .prose :is(h1,h2,h3,h4){color:var(--front-ink);}
.front-content-panel .prose blockquote {border-inline-start:4px solid var(--front-primary);background:var(--front-surface-alt);border-radius:10px;padding:.55rem 1rem;}
.front-article-cover {width:100%;max-height:520px;object-fit:cover;border-radius:17px;margin-block-end:1.35rem;}
.front-article-title {color:var(--front-ink) !important;font-size:clamp(1.9rem,4vw,3rem) !important;line-height:1.43 !important;}
.front-article-intro {border-inline-start:4px solid var(--front-secondary);padding-inline-start:1rem;color:var(--front-muted);font-size:1.22rem;}
.front-share-box,.front-comments-box {border:1px solid var(--front-line);border-radius:22px;background:var(--front-surface);padding:clamp(1.1rem,3vw,2rem);box-shadow:var(--front-shadow);}
.front-comments-box input,.front-comments-box textarea,.front-shell .front-search-input {background:var(--front-surface-alt) !important;color:var(--front-ink) !important;border:1px solid var(--front-line) !important;border-radius:12px !important;padding:.65rem .85rem !important;}
.front-comments-box input:focus,.front-comments-box textarea:focus,.front-shell .front-search-input:focus {border-color:var(--front-primary) !important;box-shadow:0 0 0 3px rgba(97,84,220,.12) !important;}
.front-shell .front-breadcrumb {display:flex;gap:.55rem;align-items:center;flex-wrap:wrap;color:var(--front-muted);font-size:.96rem;margin-block-end:1.4rem;}
.front-shell .front-breadcrumb a:hover {color:var(--front-primary);}
.front-shell .front-search-form {display:flex;gap:.6rem;flex-wrap:wrap;margin-block:1.3rem 1.8rem;}
.front-search-form input {flex:1;min-width:170px;}
.front-search-form button {background:var(--front-primary);color:#fff;border-radius:12px;padding:.6rem 1.6rem;border:0;}
/* Legacy pages: match their existing utility-markup to the shared brand */
.front-shell :is(.bg-white\/80,.bg-white\/70,.bg-white\/85,.bg-white\/60,.bg-white) {background-color:var(--front-surface) !important;}
html.dark .front-shell :is(.dark\:bg-slate-800\/50,.dark\:bg-slate-800\/40,.dark\:bg-slate-800\/60,.dark\:bg-slate-800) {background-color:var(--front-surface) !important;}
html.dark .front-shell :is(.text-slate-900,.text-slate-800,.text-gray-800,.text-gray-700,.dark\:text-white) {color:var(--front-ink) !important;}
html.dark .front-shell :is(.text-gray-500,.text-slate-500,.text-gray-600,.text-slate-600) {color:var(--front-muted) !important;}
.front-shell .front-legacy-card {background:var(--front-surface);border:1px solid var(--front-line);box-shadow:var(--front-shadow);border-radius:var(--front-radius);overflow:hidden;transition:all .2s;}
.front-shell .front-legacy-card:hover {box-shadow:var(--front-shadow-hover);transform:translateY(-3px);}
/* Footer */
.front-footer {margin-block-start:2rem;background:#18223a;color:#d5deed;border-block-start:4px solid #6154dc;}
.front-footer-grid {display:grid;grid-template-columns:1.55fr 1fr 1fr 1fr;gap:2.5rem;padding-block:3.4rem 2.6rem;}
.front-footer-brand {display:inline-flex;align-items:center;gap:.7rem;color:#fff !important;font-size:1.65rem;font-weight:700;}
.front-footer-brand .front-brand-mark {width:44px;height:44px;font-size:1rem;}
.front-footer h2 {font-size:1.3rem !important;color:#fff !important;margin:0 0 1rem;}
.front-footer p {font-size:1.02rem;line-height:1.9;color:#aebbd2;}
.front-footer-about p {max-width:350px;margin-block:.75rem 1rem;}
.front-footer-links {display:grid;gap:.38rem;}
.front-footer-links a,.front-footer-email {display:inline-flex;align-items:center;font-size:1.04rem;color:#bdc9da !important;}
.front-footer a:hover {color:#fff !important;}
.front-footer-social {display:flex;align-items:center;flex-wrap:wrap;gap:.55rem;}
.front-footer-social a {width:37px;height:37px;border:1px solid #3a4560;border-radius:10px;display:grid;place-items:center;color:#d4dded !important;}
.front-footer-social a:hover {background:#6154dc;border-color:#6154dc;}
.front-footer-bottom {border-block-start:1px solid #38445e;padding-block:1.2rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:.8rem;color:#aebbd2;font-size:.94rem;}
/* Modal styles previously isolated in a Blade push */
.front-shell .glass-modal {background:var(--front-surface);color:var(--front-ink);backdrop-filter:blur(18px);border:1px solid var(--front-line);border-radius:20px;box-shadow:0 28px 80px rgba(0,0,0,.3);}
.front-shell .glass-overlay {background:rgba(9,13,30,.73);backdrop-filter:blur(5px);}
.front-shell .pdf-frame {width:100%;height:min(75vh,900px);border:0;border-radius:12px;}
body.modal-open {overflow:hidden;}
/* Existing breaking news bar must remain readable after global-link styling */
.front-shell .no-global-link,.front-shell .no-global-link:hover {color:#fff !important;}
@media(max-width:1140px){
  .front-nav-wrap {display:none;}
  .front-menu-toggle {display:grid;}
  .front-header-main {min-height:75px;}
  .front-header-search {max-width:380px;}
  .front-footer-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:1020px){
  .front-content-layout {grid-template-columns:minmax(0,1fr);}
  .front-sidebar {grid-template-columns:repeat(2,minmax(0,1fr));}
  .front-sidebar-ad {grid-column:1 / -1;}
  .front-list-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:720px){
  .site-container {width:min(100% - 1.6rem,1250px);}
  .front-header-search {display:none;}
  .front-brand {max-width:calc(100% - 112px);}
  .front-brand-logo,.front-brand-mark {width:44px;height:44px;border-radius:12px;}
  .front-brand-copy strong {font-size:1.5rem;}
  .front-brand-copy small {font-size:.75rem;}
  .front-icon-button {width:42px;height:42px;}
  .front-main {padding-block:1.1rem 2.5rem;}
  .front-welcome {padding:1.55rem;border-radius:20px;min-height:245px;margin-block-end:1.7rem;}
  .front-welcome h1 {font-size:2.05rem;}
  .front-welcome p {font-size:1.05rem;}
  .front-article-grid,.front-featured-grid,.front-media-grid,.front-list-grid {grid-template-columns:1fr;gap:1rem;}
  .front-post-card--hero {grid-template-columns:1fr;}
  .front-post-card--hero .front-post-media {height:auto;aspect-ratio:1.7/1;min-height:0;}
  .front-post-card--hero .front-post-title {font-size:1.55rem !important;}
  .front-sidebar {grid-template-columns:1fr;}
  .front-footer-grid {grid-template-columns:1fr;gap:1.6rem;padding-block:2.3rem 2rem;}
  .front-section {margin-block-end:2.25rem;}
  .front-section-heading {align-items:center;}
  .front-section-more {font-size:.9rem;}
  .front-article-title {font-size:2rem !important;}
}
@media(prefers-reduced-motion:reduce){
  html {scroll-behavior:auto;}
  .front-shell *, .front-shell *::before,.front-shell *::after {animation-duration:.01ms !important;transition-duration:.01ms !important;}
}
/* Writer profile */
.front-author-hero {display:flex;align-items:center;gap:2rem;}
.front-author-hero > img {width:140px;height:140px !important;border-radius:50%;object-fit:cover;flex-shrink:0;border:5px solid var(--front-surface);box-shadow:var(--front-shadow-hover);}
.front-author-hero > div {position:relative;z-index:1;min-width:0;}
.front-author-hero p {margin:.2rem 0 .65rem;}
.front-author-social {display:flex;gap:.55rem;flex-wrap:wrap;margin-top:.7rem;}
.front-author-social a {width:36px;height:36px;display:grid;place-items:center;background:var(--front-surface);border:1px solid var(--front-line);border-radius:10px;color:var(--front-primary);}
@media(max-width:600px){.front-author-hero {flex-direction:column;align-items:flex-start;gap:1rem;}.front-author-hero > img {width:100px;height:100px !important;}}
/* Article detail, comments and sharing */
.front-reading-article {max-width:920px;margin-inline:auto;}
.front-reading-meta {display:flex;align-items:center;flex-wrap:wrap;gap:.7rem 1.2rem;color:var(--front-muted);font-size:.98rem;margin-block-end:1rem;}
.front-reading-meta a:hover {color:var(--front-primary);}
.front-reading-badge {border-radius:999px;padding:.24rem .9rem;background:var(--front-surface-alt);border:1px solid var(--front-line);color:var(--front-primary) !important;font-weight:700;}
.front-article-figure {margin:1.5rem 0;}
.front-reading-article .front-article-intro {margin:1.3rem 0;}
.front-article-tags {display:flex;gap:.55rem;flex-wrap:wrap;padding-block:1.2rem;border-block-start:1px solid var(--front-line);margin-top:2rem;}
.front-article-tags a {background:var(--front-surface-alt);padding:.2rem .75rem;color:var(--front-primary);font-size:.99rem;border-radius:999px;border:1px solid var(--front-line);}
.front-article-tags a:hover {background:var(--front-primary);color:white;}
.front-article-ad {margin-block-start:2rem;}
.front-reading-secondary {max-width:920px;margin:2rem auto 0;}
.front-share-actions {display:flex;gap:.65rem;flex-wrap:wrap;}
.front-share-actions :is(a,button) {display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:42px;padding:.4rem 1rem;border:0;border-radius:12px;color:#fff !important;font-size:1rem;font-weight:700;transition:filter .18s,transform .18s;}
.front-share-actions :is(a,button):hover {filter:brightness(1.07);transform:translateY(-2px);}
.front-share-whatsapp {background:#178b53;}
.front-share-facebook {background:#2361c9;}
.front-share-x {background:#262b39;}
.front-share-telegram {background:#238abd;}
.front-share-copy {background:#6154dc;}
.front-comment {display:flex;gap:.75rem;padding-block:1rem;border-bottom:1px solid var(--front-line);}
.front-comment-initial {flex:none;width:38px;height:38px;display:grid;place-items:center;background:var(--front-surface-alt);color:var(--front-primary);border-radius:11px;font-size:1.3rem;font-weight:700;}
.front-comment > div:last-child {min-width:0;}
.front-comment strong {display:block;color:var(--front-ink);font-weight:700;}
.front-comment time {color:var(--front-muted);font-size:.88rem;}
.front-comment p {font-size:1.07rem;line-height:1.85;overflow-wrap:anywhere;margin:.35rem 0 0;white-space:pre-wrap;}
.front-muted-note {color:var(--front-muted);}
.front-comment-form-title {margin:1.5rem 0 .8rem;font-size:1.48rem;color:var(--front-ink);}
.front-comment-form {display:grid;gap:1rem;}
.front-comment-form-row {display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
.front-comment-form label {display:block;color:var(--front-ink);font-weight:700;font-size:1.02rem;margin-bottom:.4rem;}
.front-comment-form input,.front-comment-form textarea {width:100%;font-size:1.05rem;}
.front-submit {justify-self:start;border:none;color:#fff;background:linear-gradient(120deg,#6154dc,#12a4bc);padding:.5rem 1.6rem;border-radius:12px;font-weight:700;display:inline-flex;align-items:center;gap:.65rem;}
.front-form-message,.front-form-errors {border-radius:12px;padding:.8rem 1rem;margin-block:.8rem;}
.front-form-message {border:1px solid #7ac9aa;background:#e5f7ed;color:#17623f;}
.front-form-errors {border:1px solid #e0a2aa;background:#fff0f1;color:#8c2b3c;}
.front-paper-link {display:inline-flex;align-items:center;gap:.5rem;color:var(--front-primary) !important;font-weight:700;margin-block-start:.4rem;}
.front-media-stage--video {aspect-ratio:16/9;}
@media(max-width:640px){.front-comment-form-row{grid-template-columns:1fr;}.front-reading-article{padding:1.1rem;}}

/* Editorial refinement: clean hierarchy, no promotional hero. */
.front-main {padding-block:1.45rem 3rem;}
.front-content-layout {gap:clamp(1rem,2.5vw,2rem);}
.front-section {margin-block-end:2.2rem;}
.front-section-heading {padding-block-end:.75rem;margin-block-end:1rem;}
.front-section-heading h2 {font-size:clamp(1.35rem,2.1vw,1.85rem);margin:0;}
.front-post-card,.front-media-card,.front-person-card {border-radius:16px;}
.front-post-body {padding:1rem;}
.front-post-title {font-size:1.35rem !important;line-height:1.48 !important;margin:0 0 .5rem;}
.front-post-excerpt {font-size:1rem;line-height:1.7;margin:0 0 .85rem;-webkit-line-clamp:2;}
.front-post-bottom {padding-block-start:.65rem;}
.front-post-media {aspect-ratio:16 / 9;}
.front-post-card--hero .front-post-title {font-size:1.65rem !important;}
.front-page-banner {padding:1.2rem 1.5rem;margin-bottom:1.3rem;}
.front-page-banner h1 {margin:0;font-size:clamp(1.6rem,3vw,2.2rem);}
.front-page-banner p {margin:.35rem 0 0;}
.front-mobile-nav[hidden] {display:none !important;}
.front-brand-copy strong {font-weight:700;}
.front-shell .front-readable-body {overflow-wrap:anywhere;}
.front-shell .front-readable-body :is(img,iframe,video,table) {max-width:100%;}
.front-shell .front-readable-body table {display:block;overflow-x:auto;}
@media(max-width:720px){
  .site-container {width:calc(100% - 1.25rem);}
  .front-header-main {min-height:64px;gap:.45rem;}
  .front-brand {gap:.55rem;max-width:calc(100% - 100px);}
  .front-brand-logo,.front-brand-mark {width:39px;height:39px;border-radius:10px;}
  .front-brand-copy strong {font-size:1.26rem;line-height:1.3;}
  .front-header-actions {gap:.35rem;}
  .front-icon-button {width:40px;height:40px;border-radius:11px;}
  .front-main {padding-block:.95rem 2rem;}
  .front-section {margin-bottom:1.7rem;}
  .front-section-heading h2 {font-size:1.45rem;}
  .front-section-more {font-size:.89rem;}
  .front-page-banner {padding:1rem;border-radius:14px;}
  .front-article-grid,.front-featured-grid,.front-media-grid,.front-list-grid {gap:.75rem;}
  .front-post-card:not(.front-post-card--hero) {flex-direction:row;min-height:112px;align-items:stretch;}
  .front-post-card:not(.front-post-card--hero) > .front-post-media {height:auto;aspect-ratio:auto;width:112px;flex:0 0 112px;}
  .front-post-card:not(.front-post-card--hero) .front-post-category {inset-block-end:.4rem;inset-inline-start:.35rem;max-width:calc(100% - .7rem);padding:.1rem .35rem;font-size:.71rem;}
  .front-post-card:not(.front-post-card--hero) .front-post-body {padding:.7rem .75rem;}
  .front-post-card:not(.front-post-card--hero) .front-post-title {font-size:1.12rem !important;line-height:1.45 !important;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:0 0 .35rem;}
  .front-post-card:not(.front-post-card--hero) .front-post-excerpt {display:none;}
  .front-post-card:not(.front-post-card--hero) .front-post-bottom {border:0;padding-top:.25rem;}
  .front-post-card:not(.front-post-card--hero) .front-post-arrow {display:none;}
  .front-post-card:not(.front-post-card--hero) .front-post-meta {font-size:.78rem;line-height:1.3;gap:.25rem .55rem;}
  .front-post-card--hero .front-post-title {font-size:1.38rem !important;}
  .front-post-card--hero .front-post-excerpt {display:none;}
  .front-sidebar {gap:1rem;}
  .front-share-actions {gap:.45rem;}
  .front-share-actions :is(a,button) {flex:1;min-width:calc(50% - .5rem);padding:.35rem .5rem;}
  .front-readable-body {font-size:1.09rem;line-height:1.95;}
  .front-reading-article {padding:.95rem !important;}
  .front-reading-article .front-article-title {font-size:1.8rem !important;}
  .front-footer-grid {gap:1.2rem;}
  .front-footer-bottom {font-size:.85rem;}
}
@media(max-width:380px){
  .front-post-card:not(.front-post-card--hero) > .front-post-media {width:96px;flex-basis:96px;}
  .front-post-card:not(.front-post-card--hero) .front-post-title {font-size:1.04rem !important;}
  .front-brand-copy strong {font-size:1.14rem;}
  .front-section-heading h2 {font-size:1.3rem;}
}
@media(hover:none){.front-post-card:hover,.front-media-card:hover,.front-person-card:hover {transform:none;}}


/* ================================================================
   MAQALATI COMFORTABLE COMPACT UI — 2026-10-24
   Less decoration, denser lists, unchanged comfortable article reading.
   All dimensions are scoped to the public shell and preserve RTL.
   ================================================================ */
body.front-shell {
  --front-radius: 13px;
  --front-shadow: 0 3px 13px rgba(27,43,78,.035);
  --front-shadow-hover: 0 8px 23px rgba(27,43,78,.085);
  font-size: 1.09rem;
  line-height: 1.68;
}
html.dark body.front-shell {
  --front-shadow: 0 3px 14px rgba(0,0,0,.13);
  --front-shadow-hover: 0 7px 21px rgba(0,0,0,.21);
}
.front-shell .site-container { width: min(100% - 2rem, 1190px); }
.front-shell .front-header-main { min-height: 70px; gap: 1rem; }
.front-shell .front-brand { gap: .65rem; }
.front-shell .front-brand-logo, .front-shell .front-brand-mark { width: 43px; height: 43px; border-radius: 11px; box-shadow: none; }
.front-shell .front-brand-copy strong { font-size: clamp(1.35rem, 2vw, 1.7rem); }
.front-shell .front-brand-copy small { margin-block-start: .1rem; font-size: .78rem; }
.front-shell .front-header-search { height: 44px; max-width: 390px; border-radius: 10px; }
.front-shell .front-header-search button { min-height: 36px; }
.front-shell .front-icon-button { width: 44px; height: 44px; border-radius: 10px; }
.front-shell .front-nav { min-height: 42px; gap: .1rem; }
.front-shell .front-nav-link { padding: .38rem .75rem; font-size: .98rem; border-radius: 8px; }
.front-shell .front-main { padding-block: 1rem 1.8rem; }
.front-shell .front-content-layout { grid-template-columns: minmax(0, 1fr) 280px; gap: 1.2rem; }
.front-shell .front-section { margin-block-end: 1.6rem; }
.front-shell .front-section-heading { align-items: center; margin-block-end: .75rem; padding-block-end: .55rem; }
.front-shell .front-section-heading h2 { font-size: clamp(1.35rem, 2vw, 1.62rem); line-height: 1.35; }
.front-shell .front-section-label { font-size: .84rem; }
.front-shell .front-section-more { font-size: .9rem; }
.front-shell .front-article-grid, .front-shell .front-featured-grid, .front-shell .front-media-grid { gap: .85rem; }
.front-shell .front-list-grid { gap: .85rem; }
.front-shell .front-post-card, .front-shell .front-media-card, .front-shell .front-person-card { border-radius: 13px; }
.front-shell .front-post-card:hover, .front-shell .front-media-card:hover, .front-shell .front-person-card:hover { transform: translateY(-2px); }
.front-shell .front-post-media { aspect-ratio: 1.95 / 1; }
.front-shell .front-post-category { inset-block-end: .5rem; inset-inline-start: .5rem; padding: .08rem .55rem; font-size: .82rem; }
.front-shell .front-post-body { padding: .75rem .85rem .7rem; }
.front-shell .front-post-title { font-size: 1.25rem !important; line-height: 1.43 !important; margin: 0 0 .32rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.front-shell .front-post-excerpt { font-size: .98rem; line-height: 1.62; margin: 0 0 .55rem; -webkit-line-clamp: 2; }
.front-shell .front-post-bottom { gap: .35rem; padding-block-start: .48rem; }
.front-shell .front-post-meta { font-size: .83rem; gap: .25rem .65rem; line-height: 1.45; }
.front-shell .front-post-arrow { width: 30px; height: 30px; border-radius: 8px; }
.front-shell .front-post-card--hero { min-height: 225px; grid-template-columns: 1.07fr 1fr; }
.front-shell .front-post-card--hero .front-post-media { min-height: 225px; height: 100%; aspect-ratio: auto; }
.front-shell .front-post-card--hero .front-post-body { padding: clamp(.9rem, 2vw, 1.35rem); }
.front-shell .front-post-card--hero .front-post-title { font-size: clamp(1.42rem, 2.25vw, 1.72rem) !important; }
.front-shell .front-sidebar { gap: .85rem; }
.front-shell .front-sidebar-card { border-radius: 13px; padding: .85rem; }
.front-shell .front-sidebar-head { margin-block-end: .6rem; gap: .5rem; }
.front-shell .front-sidebar-head h2 { font-size: 1.22rem !important; }
.front-shell .front-sidebar-icon { width: 33px; height: 33px; border-radius: 9px; }
.front-shell .front-popular-item { gap: .55rem; padding-block: .55rem; }
.front-shell .front-popular-rank { font-size: 1.2rem; }
.front-shell .front-popular-text strong { font-size: .99rem; line-height: 1.45; }
.front-shell .front-tag-cloud { gap: .36rem; }
.front-shell .front-tag-cloud a { padding: .18rem .52rem; font-size: .88rem; }
.front-shell .front-sidebar-author { padding: .3rem .35rem; }
.front-shell .front-sidebar-author img { width: 40px; height: 40px !important; }
.front-shell .front-sidebar-more { margin-block-start: .7rem; padding-block-start: .5rem; }
.front-shell .front-media-details { gap: .2rem; padding: .75rem .9rem; }
.front-shell .front-media-details h3 { font-size: 1.16rem !important; line-height: 1.4 !important; margin: 0; }
.front-shell .front-media-details p { margin: 0; line-height: 1.55; }
.front-shell .front-page-banner { padding: .95rem 1.2rem; margin-block-end: 1rem; border-radius: 13px; }
.front-shell .front-page-banner::before { display: none; }
.front-shell .front-page-banner h1 { font-size: clamp(1.48rem, 2.55vw, 1.98rem) !important; }
.front-shell .front-page-banner p { font-size: .99rem; margin-block-start: .25rem; }
.front-shell .front-subcategory-list { gap: .4rem; margin-block-end: 1rem; }
.front-shell .front-subcategory-list a { padding: .25rem .65rem; border-radius: 9px; }
.front-shell .front-person-card { padding: 1rem; }
.front-shell .front-person-card img { width: 84px; height: 84px !important; }
.front-shell .front-person-card h2 { margin-block: .65rem .15rem; font-size: 1.3rem !important; }
.front-shell .front-person-card .front-person-meta { margin: .45rem 0; }
.front-shell .front-content-panel { border-radius: 15px; padding: clamp(1.2rem, 2.5vw, 2rem); }
/* Reading content stays spacious even though listing cards are denser. */
.front-shell .front-reading-article { max-width: 800px; }
.front-shell .front-content-panel .prose { font-size: 1.2rem; line-height: 1.95; }
.front-shell .front-content-panel .prose :is(p, li, blockquote) { line-height: 1.95; }
.front-shell .front-article-title { font-size: clamp(1.75rem, 3vw, 2.45rem) !important; line-height: 1.45 !important; }
.front-shell .front-article-cover { max-height: 430px; border-radius: 12px; margin-block-end: 1rem; }
.front-shell .front-reading-meta, .front-shell .front-article-figure { margin-block-end: .8rem; }
.front-shell .front-article-intro { font-size: 1.14rem; }
.front-shell .front-reading-secondary { max-width: 800px; margin-block-start: 1.2rem; }
.front-shell .front-share-box, .front-shell .front-comments-box { border-radius: 14px; padding: clamp(1rem, 2.2vw, 1.35rem); }
.front-shell .front-comment { padding-block: .65rem; }
.front-shell .front-comment-form { gap: .7rem; }
.front-shell .front-comment-form-row { gap: .7rem; }
.front-shell .front-comment-form :is(input, textarea) { min-height: 44px; }
.front-shell .front-share-actions :is(a, button) { min-height: 44px; border-radius: 10px; }
.front-shell .front-footer { margin-block-start: 1.25rem; border-block-start-width: 2px; }
.front-shell .front-footer-grid { gap: 1.4rem; padding-block: 2rem 1.5rem; }
.front-shell .front-footer h2 { font-size: 1.15rem !important; margin-block-end: .55rem; }
.front-shell .front-footer p { font-size: .98rem; line-height: 1.65; }
.front-shell .front-footer-about p { margin-block: .5rem .6rem; }
.front-shell .front-footer-links { gap: .2rem; }
.front-shell .front-footer-links a { font-size: .98rem; }
.front-shell .front-footer-bottom { padding-block: .75rem; }
@media (max-width: 1140px) {
  .front-shell .front-header-main { min-height: 64px; }
  .front-shell .front-mobile-nav { max-height: calc(100dvh - 64px); }
}
@media (max-width: 1020px) {
  .front-shell .front-content-layout { grid-template-columns: minmax(0,1fr); gap: .85rem; }
  .front-shell .front-sidebar { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 720px) {
  .front-shell .site-container { width: calc(100% - 1.25rem); }
  .front-shell .front-header-main { min-height: 60px; gap: .4rem; }
  .front-shell .front-brand-logo, .front-shell .front-brand-mark { width: 37px; height: 37px; }
  .front-shell .front-brand-copy strong { font-size: 1.24rem; }
  .front-shell .front-brand-copy small { font-size: .73rem; }
  .front-shell .front-icon-button { width: 44px; height: 44px; }
  .front-shell .front-main { padding-block: .7rem 1.35rem; }
  .front-shell .front-section { margin-block-end: 1.15rem; }
  .front-shell .front-section-heading { margin-block-end: .55rem; padding-block-end: .42rem; }
  .front-shell .front-section-heading h2 { font-size: 1.35rem; }
  .front-shell .front-article-grid, .front-shell .front-featured-grid,
  .front-shell .front-media-grid, .front-shell .front-list-grid { grid-template-columns: 1fr; gap: .55rem; }
  .front-shell .front-post-card:not(.front-post-card--hero) { min-height: 104px; }
  .front-shell .front-post-card:not(.front-post-card--hero) > .front-post-media { width: 108px; flex: 0 0 108px; aspect-ratio: auto; }
  .front-shell .front-post-card:not(.front-post-card--hero) .front-post-body { padding: .55rem .65rem; }
  .front-shell .front-post-card:not(.front-post-card--hero) .front-post-title { font-size: 1.1rem !important; line-height: 1.38 !important; margin-block-end: .2rem; }
  .front-shell .front-post-card:not(.front-post-card--hero) .front-post-category { display: none; }
  .front-shell .front-post-card:not(.front-post-card--hero) .front-post-meta { font-size: .78rem; }
  .front-shell .front-post-card--hero { grid-template-columns: 1fr; min-height: 0; }
  .front-shell .front-post-card--hero .front-post-media { min-height: 0; height: auto; aspect-ratio: 2.05 / 1; }
  .front-shell .front-post-card--hero .front-post-body { padding: .7rem .8rem; }
  .front-shell .front-post-card--hero .front-post-title { font-size: 1.32rem !important; }
  .front-shell .front-sidebar { grid-template-columns: 1fr; gap: .65rem; }
  .front-shell .front-page-banner { padding: .7rem .8rem; margin-block-end: .8rem; }
  .front-shell .front-page-banner h1 { font-size: 1.48rem !important; }
  .front-shell .front-page-banner p { font-size: .96rem; }
  .front-shell .front-content-panel { padding: 1rem; }
  .front-shell .front-reading-article { padding: 1rem !important; }
  .front-shell .front-article-title, .front-shell .front-reading-article .front-article-title { font-size: 1.7rem !important; }
  .front-shell .front-content-panel .prose { font-size: 1.16rem; line-height: 1.94; }
  .front-shell .front-content-panel .prose :is(p, li, blockquote) { line-height: 1.94; }
  .front-shell .front-share-actions { gap: .4rem; }
  .front-shell .front-footer-grid { gap: 1rem; padding-block: 1.35rem; }
  .front-shell .front-footer-bottom { padding-block: .65rem; }
}
@media (max-width: 380px) {
  .front-shell .front-post-card:not(.front-post-card--hero) > .front-post-media { width: 96px; flex-basis: 96px; }
  .front-shell .front-post-card:not(.front-post-card--hero) .front-post-title { font-size: 1.06rem !important; }
  .front-shell .front-brand-copy strong { font-size: 1.15rem; }
}
@media (hover: none) {
  .front-shell .front-post-card:hover, .front-shell .front-media-card:hover, .front-shell .front-person-card:hover { transform: none; }
}
