/* ==========================================================================
   Riwaya Editorial — main stylesheet
   Written with logical properties (inline-start/end) so the layout mirrors
   correctly with dir="rtl" / dir="ltr". RTL-only tweaks live in rtl.css.
   ========================================================================== */

/* ---- Fonts (bundled, SIL OFL 1.1; no external requests) ------------------- */
@font-face{font-family:"IBM Plex Sans Arabic";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Sans Arabic";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Sans Arabic";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Sans Arabic";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-arabic-400-normal.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"IBM Plex Sans Arabic";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-arabic-500-normal.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"IBM Plex Sans Arabic";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-arabic-700-normal.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"Amiri";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/amiri-arabic-400-normal.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"Amiri";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/amiri-arabic-700-normal.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}

/* ---- Design tokens --------------------------------------------------------- */
:root{
  /* Palette: warm ivory + deep charcoal, emerald accent, muted gold detail */
  --bg:#f8f4ec; --surface:#fffdf8; --surface-2:#f1ebdf;
  --text:#211f1b; --muted:#6a645a; --border:#e3dccd; --border-strong:#cfc5b0;
  --accent:#0b6b57; --accent-ink:#ffffff;
  --accent-soft:#e1efe9;
  --gold:#a8812c; --gold-soft:#f3e9cf;
  --focus:#0b6b57;
  --shadow-sm:0 1px 2px rgba(33,31,27,.06),0 1px 1px rgba(33,31,27,.04);
  --shadow-md:0 8px 24px -8px rgba(33,31,27,.18),0 2px 6px rgba(33,31,27,.06);

  /* Type */
  --font-sans:"IBM Plex Sans Arabic","Segoe UI",Tahoma,"Noto Sans Arabic",system-ui,-apple-system,sans-serif;
  --font-serif:"Amiri","Traditional Arabic","Noto Naskh Arabic","Times New Roman",serif;

  /* Space & shape */
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-5:1.5rem; --space-6:2rem; --space-7:3rem; --space-8:4.5rem;
  --radius-sm:8px; --radius:12px; --radius-lg:20px;
  --container:1180px; --gutter:clamp(1rem,4vw,2rem);
  --header-h:64px;
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* Dark: warm charcoal, never pure black */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]):not([data-reading]){
    --bg:#14120f; --surface:#1c1915; --surface-2:#25211b;
    --text:#ece6d8; --muted:#a39b8b; --border:#332e26; --border-strong:#4a4338;
    --accent-soft:#16312a; --gold:#d6b05c; --gold-soft:#332a14; --focus:#5ad0a9;
    --shadow-sm:0 1px 2px rgba(0,0,0,.4); --shadow-md:0 10px 28px -10px rgba(0,0,0,.6);
    color-scheme:dark;
  }
}
:root[data-theme="dark"],:root[data-reading="dark"]{
  --bg:#14120f; --surface:#1c1915; --surface-2:#25211b;
  --text:#ece6d8; --muted:#a39b8b; --border:#332e26; --border-strong:#4a4338;
  --accent-soft:#16312a; --gold:#d6b05c; --gold-soft:#332a14; --focus:#5ad0a9;
  --shadow-sm:0 1px 2px rgba(0,0,0,.4); --shadow-md:0 10px 28px -10px rgba(0,0,0,.6);
  color-scheme:dark;
}
:root[data-reading="light"]{
  --bg:#f8f4ec; --surface:#fffdf8; --surface-2:#f1ebdf;
  --text:#211f1b; --muted:#6a645a; --border:#e3dccd; --border-strong:#cfc5b0;
  --accent-soft:#e1efe9; --gold:#a8812c; --gold-soft:#f3e9cf; --focus:#0b6b57;
  --shadow-sm:0 1px 2px rgba(33,31,27,.06); --shadow-md:0 8px 24px -8px rgba(33,31,27,.18);
  color-scheme:light;
}
:root[data-reading="sepia"]{
  --bg:#f1e6cd; --surface:#f7eed8; --surface-2:#eadcbd;
  --text:#3d2f1d; --muted:#6e5b3f; --border:#dccda9; --border-strong:#c6b48a;
  --accent:#7a4f14; --accent-ink:#fff; --accent-soft:#ecdcb6; --gold:#8a5a1c; --gold-soft:#ecdcb6; --focus:#7a4f14;
  --shadow-sm:0 1px 2px rgba(61,47,29,.1); --shadow-md:0 8px 24px -8px rgba(61,47,29,.25);
  color-scheme:light;
}
@supports (color:color-mix(in srgb,red,blue)){
  :root{--accent-soft:color-mix(in srgb,var(--accent) 12%,var(--surface))}
  :root[data-theme="dark"],:root[data-reading="dark"]{--accent-soft:color-mix(in srgb,var(--accent) 18%,var(--surface))}
  :root[data-reading="sepia"]{--accent-soft:color-mix(in srgb,var(--accent) 14%,var(--surface))}
}

/* ---- Base ------------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-block-start:calc(var(--header-h) + 1rem)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-sans);font-size:1rem;line-height:1.75;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-wrap:anywhere}
img,svg,video{max-width:100%;height:auto}
h1,h2,h3,h4{line-height:1.4;margin:0 0 .5em;font-weight:700;color:var(--text);font-family:var(--font-heading,var(--font-sans))}
p{margin:0 0 1em}
a{color:var(--accent);text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{text-decoration-thickness:2px}
ul,ol{margin:0;padding:0;list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:4px}
::selection{background:var(--accent);color:var(--accent-ink)}
bdi,[dir="ltr"]{unicode-bidi:isolate}

.screen-reader-text{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.skip-link:focus{position:fixed;inset-block-start:8px;inset-inline-start:8px;width:auto;height:auto;margin:0;padding:.6rem 1rem;clip:auto;clip-path:none;background:var(--accent);color:var(--accent-ink);z-index:1000;border-radius:var(--radius-sm)}
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.center{text-align:center}
.site-main{min-height:60vh}
.no-js [hidden]:not(.keep-hidden){}
.icon{flex:none;vertical-align:-.2em}
.sep{opacity:.5;margin-inline:.4em}

/* ---- Buttons ------------------------------------------------------------------ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:44px;padding:.55rem 1.15rem;border:1px solid transparent;border-radius:999px;background:var(--surface-2);color:var(--text);font-weight:500;font-size:.95rem;line-height:1.3;text-decoration:none;cursor:pointer;transition:background-color .2s var(--ease),border-color .2s var(--ease),transform .2s var(--ease),box-shadow .2s var(--ease)}
.btn:hover{text-decoration:none;transform:translateY(-1px)}
.btn:active{transform:none}
.btn--primary{background:var(--accent);color:var(--accent-ink)}
.btn--primary:hover{box-shadow:var(--shadow-md);filter:brightness(1.06)}
.btn--accent{background:var(--gold);color:#fff}
:root[data-theme="dark"] .btn--accent,:root[data-reading="dark"] .btn--accent{color:#1b1608}
.btn--ghost{background:transparent;border-color:var(--border-strong);color:var(--text)}
.btn--ghost:hover{background:var(--surface-2)}
.btn--sm{min-height:38px;padding:.35rem .9rem;font-size:.88rem}
.btn--lg{min-height:50px;padding:.7rem 1.6rem;font-size:1rem}
.btn.is-disabled{opacity:.45;pointer-events:none}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:0;border-radius:var(--radius-sm);background:transparent;color:var(--text);cursor:pointer;transition:background-color .2s}
.icon-btn:hover{background:var(--surface-2)}
.icon-btn--round{border-radius:50%;background:var(--surface);border:1px solid var(--border-strong);box-shadow:var(--shadow-sm)}

/* ---- Badges / chips ----------------------------------------------------------- */
.badge{display:inline-flex;align-items:center;padding:.1rem .65rem;border-radius:999px;font-size:.78rem;font-weight:500;line-height:1.7;text-decoration:none;white-space:nowrap}
.badge--genre{background:var(--accent-soft);color:var(--accent)}
a.badge--genre:hover{background:var(--accent);color:var(--accent-ink);text-decoration:none}
.badge--status{background:var(--gold);color:#fff}
:root[data-theme="dark"] .badge--status,:root[data-reading="dark"] .badge--status{color:#1b1608}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]):not([data-reading]) .badge--status{color:#1b1608}}
.badge--muted{background:var(--surface-2);color:var(--muted)}
.chip-list{display:flex;flex-wrap:wrap;gap:.5rem}
.chip-list--center{justify-content:center;margin-block-start:var(--space-5)}
.chip{display:inline-block;padding:.35rem .95rem;border:1px solid var(--border-strong);border-radius:999px;color:var(--text);text-decoration:none;font-size:.9rem}
.chip:hover{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.eyebrow{display:inline-flex;align-items:center;gap:.4rem;margin:0 0 .6rem;color:var(--gold);font-weight:700;font-size:.85rem;letter-spacing:.02em}

/* ---- Header --------------------------------------------------------------------- */
.site-header{position:relative;background:color-mix(in srgb,var(--surface) 92%,transparent);border-block-end:1px solid var(--border);z-index:50}
@supports not (color:color-mix(in srgb,red,blue)){.site-header{background:var(--surface)}}
.has-sticky-header .site-header{position:sticky;inset-block-start:0;-webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px)}
.admin-bar.has-sticky-header .site-header{inset-block-start:32px}
@media (max-width:782px){.admin-bar.has-sticky-header .site-header{inset-block-start:46px}}
.header-inner{display:flex;align-items:center;gap:var(--space-3);min-height:var(--header-h)}
.brand{flex:none;display:flex;align-items:center}
.brand__link{display:inline-flex;align-items:center;gap:.6rem;color:var(--text);text-decoration:none;font-weight:700;font-size:1.25rem}
.brand__mark{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--accent);color:var(--accent-ink);font-size:1.15rem;line-height:1}
.brand-icon{display:inline-flex;align-items:center;justify-content:center;flex:none;width:var(--brand-icon-size,36px);height:var(--brand-icon-size,36px);color:var(--accent)}
.brand-icon__svg,.brand-icon--inline svg{width:100%;height:100%;display:block}
.brand-icon--img{width:auto;max-width:calc(var(--brand-icon-size,36px)*4)}
.brand-icon--img img{display:block;height:var(--brand-icon-size,36px);width:auto;max-width:100%;object-fit:contain}
.brand-icon--mask{background-color:var(--accent);-webkit-mask:var(--brand-icon-url) center/contain no-repeat;mask:var(--brand-icon-url) center/contain no-repeat}
.primary-nav{flex:1;min-width:0}
.header-actions{display:flex;align-items:center;gap:.25rem;margin-inline-start:auto}
.nav-toggle{display:none}

.primary-nav .menu{display:flex;align-items:center;gap:.15rem;flex-wrap:wrap}
.primary-nav .menu a{display:inline-flex;align-items:center;gap:.25rem;padding:.45rem .8rem;border-radius:999px;color:var(--text);text-decoration:none;font-weight:500;font-size:.95rem}
.primary-nav .menu a:hover{background:var(--surface-2)}
.primary-nav .current-menu-item>a,.primary-nav .current-menu-ancestor>a,.primary-nav .current_page_item>a{background:var(--accent-soft);color:var(--accent)}
.menu-item-has-children{position:relative}
.menu-caret{width:14px;height:14px}
.sub-menu{position:absolute;inset-inline-start:0;inset-block-start:100%;min-width:200px;padding:.4rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-md);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .18s,transform .18s,visibility .18s;z-index:60}
.menu-item-has-children:hover>.sub-menu,.menu-item-has-children:focus-within>.sub-menu{opacity:1;visibility:visible;transform:none}
.sub-menu a{display:flex!important;border-radius:var(--radius-sm)!important;width:100%}

.theme-icon{display:inline-flex}
.theme-icon--sun{display:none}
:root[data-theme="dark"] .theme-icon--moon,:root[data-reading="dark"] .theme-icon--moon{display:none}
:root[data-theme="dark"] .theme-icon--sun,:root[data-reading="dark"] .theme-icon--sun{display:inline-flex}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]):not([data-reading]) .theme-icon--moon{display:none}
  :root:not([data-theme="light"]):not([data-reading]) .theme-icon--sun{display:inline-flex}
}

.search-panel{border-block-start:1px solid var(--border);background:var(--surface);padding-block:var(--space-4)}
.search-panel[hidden]{display:none}
.search-form{display:flex;gap:.5rem;max-width:640px;margin-inline:auto}
.search-form__input{flex:1;min-width:0;min-height:46px;padding:.5rem 1.1rem;border:1px solid var(--border-strong);border-radius:999px;background:var(--bg);color:var(--text)}
.search-form__input::placeholder{color:var(--muted)}

@media (max-width:900px){
  .nav-toggle{display:inline-flex}
  .brand{margin-inline-end:auto}
  .header-actions{margin-inline-start:0}
  .primary-nav{position:absolute;inset-inline:0;inset-block-start:100%;background:var(--surface);border-block-end:1px solid var(--border);box-shadow:var(--shadow-md);padding:var(--space-3) var(--gutter) var(--space-4);display:none;max-height:calc(100vh - var(--header-h));overflow:auto}
  .primary-nav.is-open,.no-js .primary-nav{display:block}
  .primary-nav .menu{flex-direction:column;align-items:stretch;gap:.1rem}
  .primary-nav .menu a{padding:.75rem .9rem;border-radius:var(--radius-sm)}
  .sub-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;background:transparent;padding:0 var(--space-4) 0 0;padding-inline:var(--space-4) 0;min-width:0}
  .menu-caret{display:none}
}

/* ---- Sections --------------------------------------------------------------------- */
.page-wrap{padding-block:var(--space-5) var(--space-7)}
.page-wrap--narrow{max-width:860px}
.home-section{margin-block:var(--space-7)}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-4);margin-block-end:var(--space-4);padding-block-end:var(--space-3);border-block-end:1px solid var(--border)}
.section-head__title{position:relative;margin:0;font-size:clamp(1.25rem,1.05rem + .8vw,1.65rem);padding-inline-start:.9rem}
.section-head__title::before{content:"";position:absolute;inset-inline-start:0;inset-block:.25em;width:4px;border-radius:4px;background:linear-gradient(var(--accent),var(--gold))}
.section-head__link{display:inline-flex;align-items:center;gap:.25rem;font-size:.92rem;font-weight:500;text-decoration:none;white-space:nowrap}
.section-head__link .icon{width:16px;height:16px}
.admin-hint{margin:var(--space-4) 0 0;padding:.75rem 1rem;border:1px dashed var(--border-strong);border-radius:var(--radius);color:var(--muted);font-size:.9rem}

/* ---- Cover + cards ------------------------------------------------------------------ */
.cover{position:relative;display:block;aspect-ratio:3/4;overflow:hidden;border-radius:var(--radius);background:var(--surface-2);box-shadow:var(--shadow-sm);isolation:isolate}
.cover::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08),inset 4px 0 8px -4px rgba(0,0,0,.25);pointer-events:none}
.cover__img{display:block;width:100%;height:100%;object-fit:cover}
.cover__fallback{position:absolute;inset:0;display:grid;place-items:center;padding:12%;text-align:center;color:#fff;background:linear-gradient(155deg,var(--c1),var(--c2))}
.cover__fallback::before{content:"";position:absolute;inset:8%;border:1px solid rgba(255,255,255,.35);border-radius:6px}
.cover__fallback-title{position:relative;font-weight:700;font-size:clamp(.9rem,.7rem + 1vw,1.25rem);line-height:1.5;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.cover__fallback[data-variant="0"]{--c1:#0b6b57;--c2:#074036}
.cover__fallback[data-variant="1"]{--c1:#7a2e3b;--c2:#4a1521}
.cover__fallback[data-variant="2"]{--c1:#8a6a1f;--c2:#4f3a0c}
.cover__fallback[data-variant="3"]{--c1:#2f4a6b;--c2:#16263d}
.cover__fallback[data-variant="4"]{--c1:#5a3d78;--c2:#2d1b42}
.cover__fallback[data-variant="5"]{--c1:#3d4a3a;--c2:#1c261b}

.novel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--space-5) var(--space-4)}
@media (min-width:640px){.novel-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:var(--space-6) var(--space-4)}}
.novel-grid--compact{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
.novel-card{display:flex;flex-direction:column;gap:.7rem;height:100%}
.novel-card__cover{position:relative;display:block;border-radius:var(--radius);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.novel-card__cover:hover{transform:translateY(-4px)}
.novel-card__cover:hover .cover{box-shadow:var(--shadow-md)}
.novel-card__cover .badge--status{position:absolute;inset-block-start:8px;inset-inline-start:8px;z-index:2;box-shadow:var(--shadow-sm)}
.novel-card__title{margin:0;font-size:1rem;line-height:1.5}
.novel-card__title a{color:var(--text);text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.novel-card__title a:hover{color:var(--accent)}
.novel-card__author{margin:0;color:var(--muted);font-size:.85rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.novel-card__meta,.novel-card__latest{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;font-size:.8rem;color:var(--muted)}
.novel-card__latest{flex-direction:column;align-items:flex-start;gap:0}
.novel-card__latest a{color:var(--accent);text-decoration:none;font-weight:500;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.novel-card__latest a:hover{text-decoration:underline}
.novel-card__time{color:var(--muted)}

/* ---- Hero / featured ------------------------------------------------------------------- */
.hero{padding-block:var(--space-5) 0}
.hero__frame{position:relative}
.hero__track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:var(--radius-lg);outline-offset:4px}
.hero__track::-webkit-scrollbar{display:none}
.hero-slide{position:relative;flex:0 0 100%;scroll-snap-align:center;overflow:hidden;background:var(--surface-2);isolation:isolate}
.hero-slide__bg{position:absolute;inset:-30px;background-size:cover;background-position:center;filter:blur(36px) saturate(1.2);opacity:.38;z-index:-2}
.hero-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,color-mix(in srgb,var(--bg) 20%,transparent),color-mix(in srgb,var(--bg) 70%,transparent));z-index:-1}
.hero-slide__inner{display:grid;grid-template-columns:minmax(120px,240px) 1fr;gap:clamp(1rem,4vw,3rem);align-items:center;padding:clamp(1rem,4vw,2.75rem)}
.hero-slide__cover{display:block;border-radius:var(--radius)}
.hero-slide__cover .cover{box-shadow:var(--shadow-md);border-radius:var(--radius)}
.hero-slide__title{font-size:clamp(1.4rem,1.1rem + 1.6vw,2.25rem);margin-block-end:.3em}
.hero-slide__title a{color:inherit;text-decoration:none}
.hero-slide__author{margin:0 0 .75rem;color:var(--muted)}
.hero-slide__badges{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1rem}
.hero-slide__desc{max-width:58ch;color:var(--text);opacity:.88;margin-block-end:1.25rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.hero-slide__actions{display:flex;flex-wrap:wrap;gap:.6rem}
.hero__controls{position:absolute;inset-block-end:1rem;inset-inline-end:1rem;display:flex;gap:.4rem}
@media (max-width:640px){
  .hero-slide__inner{grid-template-columns:104px 1fr;gap:1rem;align-items:start;padding:1rem}
  .hero-slide__desc{-webkit-line-clamp:2;font-size:.92rem;margin-block-end:.9rem}
  .hero-slide__author{font-size:.9rem;margin-block-end:.4rem}
  .hero__controls{display:none}
  .hero-slide__actions .btn--ghost{display:none}
}

/* ---- Popular ranking ----------------------------------------------------------------------- */
.home-section--popular{padding:var(--space-5);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg)}
.home-section--popular .section-head{border-color:var(--border)}
.rank-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:.25rem var(--space-6);counter-reset:none}
.rank-item{display:flex;align-items:center;gap:var(--space-3);padding:.7rem 0;border-block-end:1px solid var(--border)}
.rank-item__no{flex:none;width:2ch;font-size:1.6rem;font-weight:700;color:var(--gold);text-align:center;font-variant-numeric:tabular-nums;line-height:1}
.rank-item:nth-child(n+4) .rank-item__no{color:var(--muted);font-size:1.3rem}
.rank-item__cover{flex:none;width:56px}
.rank-item__body{min-width:0}
.rank-item__title{margin:0;font-size:.98rem;line-height:1.5}
.rank-item__title a{color:var(--text);text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rank-item__title a:hover{color:var(--accent)}
.rank-item__meta{display:flex;flex-wrap:wrap;gap:.2rem .8rem;margin:0;font-size:.82rem;color:var(--muted)}
.stat{display:inline-flex;align-items:center;gap:.3rem}
.stat .icon{width:15px;height:15px}

/* ---- Genres -------------------------------------------------------------------------------------- */
.genre-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.75rem}
.genre-card{display:flex;flex-direction:column;gap:.15rem;padding:.9rem 1.1rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);text-decoration:none;color:var(--text);position:relative;overflow:hidden;transition:border-color .2s,transform .2s var(--ease),box-shadow .2s}
.genre-card::before{content:"";position:absolute;inset-block:0;inset-inline-start:0;width:3px;background:var(--gold);transform:scaleY(0);transform-origin:top;transition:transform .25s var(--ease)}
.genre-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:var(--shadow-sm);text-decoration:none}
.genre-card:hover::before{transform:scaleY(1)}
.genre-card__name{font-weight:700}
.genre-card__count{font-size:.8rem;color:var(--muted)}

/* ---- Continue reading strip -------------------------------------------------------------------- */
.continue{margin-block-start:var(--space-5)}
.continue__card{display:flex;align-items:center;gap:var(--space-4);padding:.9rem 1.2rem;background:var(--accent-soft);border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);border-radius:var(--radius)}
.continue__text{flex:1;min-width:0}
.continue__text strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.continue__text span{font-size:.85rem;color:var(--muted)}

/* ---- Archive header + filter bar ------------------------------------------------------------------ */
.archive-head{margin-block:var(--space-3) var(--space-5)}
.archive-head__title{font-size:clamp(1.5rem,1.2rem + 1.5vw,2.2rem);margin-block-end:.2em}
.archive-head__count{margin:0;color:var(--muted);font-size:.95rem}
.archive-head__desc{max-width:70ch;color:var(--muted);margin-block-end:.5rem}
.filter-bar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--space-3) var(--space-4);padding:var(--space-4);margin-block-end:var(--space-6);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}
.filter-bar__field{display:flex;flex-direction:column;gap:.25rem;min-width:140px;flex:1 1 140px}
.filter-bar label{font-size:.8rem;color:var(--muted);font-weight:500}
.filter-bar select,.chapters__search,.comment-form input[type=text],.comment-form input[type=email],.comment-form input[type=url],.comment-form textarea{width:100%;min-height:42px;padding:.45rem .8rem;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--bg);color:var(--text)}
.filter-bar__actions{display:flex;gap:.5rem}
@media (max-width:640px){.filter-bar__actions{width:100%}.filter-bar__actions .btn{flex:1}}

.pagination{margin-block-start:var(--space-7)}
.pagination ul{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center}
.pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding-inline:.6rem;border:1px solid var(--border-strong);border-radius:var(--radius-sm);color:var(--text);text-decoration:none;font-weight:500;background:var(--surface)}
.pagination a.page-numbers:hover{border-color:var(--accent);color:var(--accent)}
.pagination .page-numbers.current{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.pagination .page-numbers.dots{border:0;background:transparent}
.pagination .icon{width:18px;height:18px}

/* ---- Breadcrumbs ----------------------------------------------------------------------------------- */
.breadcrumbs{margin-block-end:var(--space-4);font-size:.85rem;color:var(--muted)}
.breadcrumbs ol{display:flex;flex-wrap:wrap;gap:.1rem .2rem;align-items:center}
.breadcrumbs li{display:inline-flex;align-items:center;max-width:100%}
.breadcrumbs li:not(:last-child)::after{content:"‹";margin-inline:.55rem;opacity:.6}
.riwaya-ltr .breadcrumbs li:not(:last-child)::after{content:"›"}
.breadcrumbs a{color:var(--muted);text-decoration:none}
.breadcrumbs a:hover{color:var(--accent);text-decoration:underline}
.breadcrumbs [aria-current="page"]{color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60vw}

/* ---- Novel page ------------------------------------------------------------------------------------- */
.novel-hero{display:grid;grid-template-columns:minmax(150px,300px) 1fr;gap:clamp(1.25rem,4vw,3rem);align-items:start;margin-block-end:var(--space-7)}
.novel-hero__cover .cover{box-shadow:var(--shadow-md)}
.novel-hero__title{font-size:clamp(1.6rem,1.2rem + 2vw,2.5rem);margin-block-end:.25em}
.novel-hero__author{margin:0 0 .9rem;color:var(--muted);font-size:1.05rem}
.novel-hero__badges{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1.1rem}
.stats{display:flex;flex-wrap:wrap;gap:var(--space-3) var(--space-6);margin:0 0 1.25rem;padding:.9rem 0;border-block:1px solid var(--border)}
.stats__item dt{display:flex;align-items:center;gap:.35rem;font-size:.8rem;color:var(--muted)}
.stats__item dt .icon{width:15px;height:15px}
.stats__item dd{margin:0;font-weight:700}
.novel-hero__excerpt{max-width:68ch;font-size:1.05rem}
.synopsis{max-width:68ch;margin-block-end:1.25rem}
.synopsis summary{display:inline-flex;align-items:center;gap:.35rem;cursor:pointer;color:var(--accent);font-weight:500;list-style:none}
.synopsis summary::-webkit-details-marker{display:none}
.synopsis .icon{width:16px;height:16px;transition:transform .2s}
.synopsis[open] .icon{transform:rotate(180deg)}
.synopsis__less{display:none}
.synopsis[open] .synopsis__less{display:inline}
.synopsis[open] .synopsis__more{display:none}
.synopsis__body{margin-block-start:.75rem;padding:1rem 1.25rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}
.novel-hero__actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-block-end:1rem}
.novel-hero__source{margin:1rem 0 0;font-size:.85rem;color:var(--muted)}
.share{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;margin-block-start:.5rem}
.share__status{font-size:.82rem;color:var(--accent);min-width:1px}
@media (max-width:720px){
  .novel-hero{grid-template-columns:1fr;text-align:start}
  .novel-hero__cover{width:min(56vw,240px);margin-inline:auto}
  .novel-hero__actions .btn{flex:1 1 auto}
}

/* Chapter list */
.chapters{margin-block-end:var(--space-7)}
.chapters__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-3);margin-block-end:var(--space-4)}
.chapters__title{margin:0;font-size:1.4rem}
.chapters__count{color:var(--muted);font-weight:500;font-size:1rem}
.chapters__tools{display:flex;gap:.5rem;align-items:center}
.chapters__tools[hidden]{display:none}
.chapters__search{width:min(260px,50vw)}
.chapter-list{display:grid;grid-template-columns:1fr;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);overflow:hidden}
@media (min-width:900px){.chapters .chapter-list{grid-template-columns:1fr 1fr}.chapters .chapter-list__item:nth-child(odd){border-inline-end:1px solid var(--border)}}
.chapter-list__item a{display:flex;align-items:center;gap:.9rem;padding:.8rem 1.1rem;color:var(--text);text-decoration:none;border-block-end:1px solid var(--border);transition:background-color .15s}
.chapter-list__item a:hover{background:var(--surface-2)}
.chapter-list__item.is-current a{background:var(--accent-soft);color:var(--accent);font-weight:700}
.chapter-list__item.is-read .chapter-list__num{background:var(--accent);color:var(--accent-ink)}
.chapter-list__num{flex:none;min-width:2.6rem;padding:.05rem .5rem;border-radius:999px;background:var(--surface-2);color:var(--muted);font-size:.8rem;font-weight:700;text-align:center;font-variant-numeric:tabular-nums}
.chapter-list__title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chapter-list__date{flex:none;font-size:.78rem;color:var(--muted)}
@media (max-width:520px){.chapter-list__date{display:none}}
.chapter-list--compact{border:0;border-radius:0;grid-template-columns:1fr!important}
.chapter-list--compact .chapter-list__item{border:0!important}
.chapter-empty{margin:var(--space-4) 0;color:var(--muted);text-align:center}
.chapters__more{display:flex;justify-content:center;margin-block-start:var(--space-4)}
.chapters__more [hidden]{display:none}
.chapters__noscript{color:var(--muted);text-align:center}

/* ---- Generic content / posts ----------------------------------------------------------------------------- */
.entry-content{font-size:1.05rem;line-height:1.95}
.entry-content>*+*{margin-block-start:1.1em}
.entry-content img{border-radius:var(--radius-sm)}
.entry-content blockquote{margin-inline:0;padding-inline-start:1.2rem;border-inline-start:3px solid var(--gold);color:var(--muted)}
.entry-content a{text-decoration:underline}
.page-links{display:flex;gap:.5rem;margin-block-start:1.5rem;flex-wrap:wrap}
.page-links a,.page-links>span:not(.page-links-title){padding:.3rem .8rem;border:1px solid var(--border-strong);border-radius:var(--radius-sm)}
.post-list{display:grid;gap:var(--space-5)}
.post-item{display:flex;gap:var(--space-4);padding-block-end:var(--space-5);border-block-end:1px solid var(--border)}
.post-item__thumb{flex:none;width:160px}
.post-item__thumb img{border-radius:var(--radius-sm);width:100%;aspect-ratio:4/3;object-fit:cover}
.post-item__title{font-size:1.2rem;margin-block-end:.2em}
.post-item__title a{color:var(--text);text-decoration:none}
.post-item__meta{color:var(--muted);font-size:.85rem;margin-block-end:.4rem}
@media (max-width:560px){.post-item{flex-direction:column}.post-item__thumb{width:100%}}
.prose-page__image{margin:0 0 var(--space-5)}
.prose-page__image img{width:100%;border-radius:var(--radius)}

.empty-state{max-width:520px;margin:var(--space-7) auto;padding:var(--space-6) var(--space-5);text-align:center;background:var(--surface);border:1px dashed var(--border-strong);border-radius:var(--radius-lg)}
.empty-state__icon{width:44px;height:44px;color:var(--gold);margin-block-end:.5rem}
.empty-state__title{font-size:1.3rem}
.empty-state__text{color:var(--muted)}
.empty-state .search-form{margin-block:var(--space-4)}

/* ---- Comments ----------------------------------------------------------------------------------------- */
.comments{margin-block-start:var(--space-7);padding-block-start:var(--space-5);border-block-start:1px solid var(--border)}
.comments__title,.comment-reply-title{font-size:1.25rem}
.comment-list{display:grid;gap:var(--space-4);margin-block-end:var(--space-5)}
.comment-list .children{margin-inline-start:var(--space-5);margin-block-start:var(--space-4);display:grid;gap:var(--space-4)}
.comment-body{padding:var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}
.comment-meta{font-size:.82rem;color:var(--muted);margin-block-end:.5rem}
.comment-author .avatar{border-radius:50%;vertical-align:middle;margin-inline-end:.5rem}
.comment-form p{margin-block-end:.9rem}
.comment-form label{display:block;font-size:.85rem;color:var(--muted);margin-block-end:.2rem}

/* ---- Footer ---------------------------------------------------------------------------------------------- */
.site-footer{margin-block-start:var(--space-8);background:var(--surface);border-block-start:1px solid var(--border)}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:var(--space-6);padding-block:var(--space-7) var(--space-6)}
.footer-title{font-size:1.05rem;margin-block-end:.8rem}
.footer-text{color:var(--muted);max-width:46ch}
.footer-col .menu{display:grid;gap:.45rem}
.footer-col .menu a{color:var(--muted);text-decoration:none}
.footer-col .menu a:hover{color:var(--accent);text-decoration:underline}
.social-links{display:flex;flex-wrap:wrap;gap:.5rem;margin-block-start:1rem}
.social-links a{display:inline-block;padding:.3rem .85rem;border:1px solid var(--border-strong);border-radius:999px;font-size:.85rem;color:var(--text);text-decoration:none}
.social-links a:hover{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.footer-bottom{border-block-start:1px solid var(--border);font-size:.85rem;color:var(--muted)}
.footer-bottom__inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem;padding-block:var(--space-4)}
.footer-bottom p{margin:0}
.to-top{display:inline-flex;align-items:center;gap:.3rem;color:var(--muted);text-decoration:none}
.to-top .icon{width:16px;height:16px}
@media (max-width:760px){.footer-grid{grid-template-columns:1fr 1fr}.footer-col--about{grid-column:1/-1}}

/* ---- Small utilities ---------------------------------------------------------------------------------------- */
.toast{position:fixed;inset-block-end:1.25rem;inset-inline:0;margin-inline:auto;width:fit-content;max-width:90vw;padding:.6rem 1.2rem;background:var(--text);color:var(--bg);border-radius:999px;font-size:.9rem;z-index:200}
@media print{.site-header,.site-footer,.reader__toolbar,.reader__nav,.share,.reader-settings,.comments,.hero__controls{display:none!important}body{background:#fff;color:#000}}


/* ---- v1.1: settings-driven additions (no effect with default settings) ------------------------ */
#page-top{display:block;height:0;outline:0}
.footer-extra{flex:1 1 100%;order:3;font-size:.85rem}
.footer-extra p{margin:0}
.footer-widgets{padding-block-end:var(--space-6)}
.footer-grid--cols-1{grid-template-columns:1fr}
.footer-grid--cols-2{grid-template-columns:1.6fr 1fr}
.footer-grid--cols-0{display:none}

/* Floating back-to-top button */
.btt{position:fixed;inset-block-end:var(--btt-offset,24px);z-index:90;display:inline-grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--border-strong);border-radius:50%;background:var(--surface);color:var(--text);box-shadow:var(--shadow-md);cursor:pointer;opacity:0;transform:translateY(8px);transition:opacity .2s var(--ease),transform .2s var(--ease)}
.btt[hidden]{display:none}
.btt.is-visible{opacity:1;transform:none}
.btt:hover{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btt--end{inset-inline-end:var(--btt-offset,24px)}
.btt--start{inset-inline-start:var(--btt-offset,24px)}
@media (max-width:640px){.btt--no-mobile{display:none!important}}
@media (prefers-reduced-motion:reduce){.btt{transition:none}}

/* Sidebar layout */
.widget{margin-block-end:var(--space-5);padding:var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}
.widget-title{font-size:1rem;margin-block-end:.6rem}
.widget ul{display:grid;gap:.35rem}
.widget a{color:var(--text)}
.footer-widgets .widget{background:transparent;border:0;padding:0}
.has-sidebar{display:grid;grid-template-columns:minmax(0,1fr) var(--sidebar-w,300px);gap:var(--space-6);align-items:start}
.has-sidebar--start .sidebar{order:-1}
@media (max-width:900px){.has-sidebar{grid-template-columns:minmax(0,1fr)}.has-sidebar--start .sidebar{order:0}}
.home-widgets{margin-block:var(--space-5)}

/* Per-device switches */
@media (max-width:640px){
  .hide-sm{display:none!important}
  .sticky-off-mobile .site-header{position:relative}
  .grid-m1 .novel-grid{grid-template-columns:1fr}
  .grid-m2 .novel-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid-m3 .novel-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
