/**
 * Sasterawan — Front-end design system
 *
 * Editorial, asymmetric layout (oversized display type set off-axis, generous
 * margins, pull-quote rhythm) in a Malaysiana palette: nila (indigo) ink,
 * kunyit (turmeric) gold thread, kapas (cotton) paper. Rounded corners and
 * 999px pills throughout; awan larat scrollwork and pucuk rebung triangles
 * as the only ornament. Built for https://menj.my — Di Bawah Permukaan.
 *
 * Layers that load after this file and may override tokens:
 *   fonts/jawi.css       self-hosted Jawi face (Dubidam Arabic)
 *   fonts/local.css      self-hosted Sabon Next (body) and Special Elite (accent)
 *   fonts/sabon.css      self-hosted body face (Sabon Next LT)
 *   times/times.css      ink by time of day (on <html>)
 *   schemes/*.css        paper by user-chosen scheme (on <body>)
 *   forms/*.css          per-literary-form typography
 *   fonts/*.css          optional body-font override
 *
 * Fonts: Fraunces (display), EB Garamond (body), Jost (UI) via Google Fonts
 * when remote fonts are enabled — see inc/setup/enqueue.php.
 */

/* ═══════════════════════════════════════════════════════════
   TOKENS
   ═══════════════════════════════════════════════════════════ */

:root {
    /* Paper & ink */
    --bwp-bg:            #fdfcf8;   /* putih — warm white paper */
    --bwp-bg-subtle:     #f3f0e7;   /* kapas — tinted panel */
    --bwp-bg-raised:     #ffffff;   /* cards */
    --bwp-text:          #151b3d;
    --bwp-text-mid:      #2b3254;
    --bwp-muted:         #6b6450;   /* 5.6:1 on white */
    --bwp-accent:        #c9971c;   /* kunyit — thread, never body text */
    --bwp-link:          #1f3fa8;   /* biru diraja */
    --bwp-link-hover:    #162e80;
    --bwp-rubric:        #a3261e;   /* merah rubrik — initials, labels */
    --bwp-border:        #dcd7c8;
    --bwp-border-faint:  #ebe8df;
    --bwp-border-ink:    #151b3d;
    --bwp-ui-border:     #9e9681;   /* 3:1 for control outlines */
    --bwp-ornament:      #c9971c;
    --bwp-stone:         #cfc9b6;
    --bwp-progress:      #c9971c;
    --bwp-badge:         #a3261e;   /* rubrik — default form badge */
    --bwp-badge-ink:     #fbf4ea;
    --bwp-on-accent:     #1a1f3a;
    --bwp-on-ink:        #fdfcf8;

    /* Shape */
    --bwp-radius-sm:  12px;
    --bwp-radius:     20px;
    --bwp-radius-lg:  28px;
    --bwp-pill:       999px;
    --bwp-shadow:     0 2px 8px rgba(26,31,58,.08);
    --bwp-shadow-lg:  0 10px 30px rgba(26,31,58,.12);

    /* Type */
    --bwp-font:          'EB Garamond', Georgia, 'Times New Roman', serif;
    --bwp-font-display:  'Fraunces', 'EB Garamond', Georgia, serif;
    --bwp-font-ui:       'Jost', system-ui, sans-serif;
    --bwp-font-jawi:     'Noto Naskh Arabic', 'Amiri', 'Scheherazade New', serif;
    --bwp-font-jawa:     'Noto Sans Javanese', sans-serif;
    --bwp-font-mono:     'Special Elite', 'Courier New', monospace;
    --bwp-font-brand:    'Fraunces', Georgia, serif;   /* Kagnue when local.css is present */
    --bwp-font-script:   'Segoe Script', cursive;       /* Ferments when local.css is present */
    --bwp-font-script:   'Ferments', 'Segoe Script', cursive;
    --bwp-font-size:     1.125rem;
    --bwp-lh:            1.75;
    --bwp-measure:       40em;
    --bwp-gutter:        clamp(1rem, 3.5vw, 4rem); /* one page gutter for header, content and footer */

    /* Legacy aliases used by form stylesheets */
    --bwp-teal:        #1f3fa8;
    --bwp-teal-deep:   #10183f;
    --bwp-gold:        #c9971c;
    --bwp-gold-dim:    #9a7416;
    --bwp-gold-light:  #e3c46a;
    --bwp-cream:       #f3f0e7;
    --bwp-ink:         var(--bwp-text);
    --bwp-paper:       var(--bwp-bg);
}

/* ═══════════════════════════════════════════════════════════
   RESET & BASE
   ═══════════════════════════════════════════════════════════ */

*, *::before, *::after { box-sizing: border-box; }

html {
    overflow-y: scroll;
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    background: var(--bwp-bg);
    color: var(--bwp-text);
    font-family: var(--bwp-font);
    font-size: var(--bwp-font-size);
    line-height: var(--bwp-lh);
    font-feature-settings: 'kern', 'liga', 'onum';
    -webkit-font-smoothing: antialiased;
    transition: background-color .25s ease, color .25s ease;
}

a { color: var(--bwp-link); text-decoration: none; transition: color .18s; }
a:hover { color: var(--bwp-link-hover); }
img { max-width: 100%; height: auto; display: block; }
iframe, video, embed, object, svg { max-width: 100%; }
.bwp-work__content table { display: block; max-width: 100%; overflow-x: auto; }


h1, h2, h3, h4 {
    font-family: var(--bwp-font-display);
    font-weight: 400;
    line-height: 1.08;
    letter-spacing: -.005em;
    margin: 0 0 .5em;
    color: var(--bwp-text);
}
/* type roles: Kagnue carries h1/h2 (section and title-page level), Fraunces the rest */
h1, h2 { font-family: var(--bwp-font-brand); letter-spacing: 0; line-height: 1.05; }

::selection { background: var(--bwp-accent); color: var(--bwp-on-accent); }

/* ═══════════════════════════════════════════════════════════
   ACCESSIBILITY
   ═══════════════════════════════════════════════════════════ */

.bwp-skip-link {
    position: absolute; left: 1rem; top: -4rem;
    padding: .7em 1.2em;
    background: var(--bwp-text); color: var(--bwp-on-ink);
    border-radius: var(--bwp-pill);
    font-family: var(--bwp-font-ui); font-size: .9rem;
    z-index: 1000;
    transition: top .15s;
}
.bwp-skip-link:focus { top: 1rem; color: var(--bwp-on-ink); outline: 2px solid var(--bwp-accent); outline-offset: 2px; }

.bwp-screen-reader-text, .screen-reader-text {
    position: absolute !important; width: 1px; height: 1px;
    padding: 0; margin: -1px; overflow: hidden;
    clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

:focus-visible { outline: 2px solid var(--bwp-link); outline-offset: 3px; border-radius: 4px; }
a:focus-visible, button:focus-visible { border-radius: var(--bwp-pill); }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ═══════════════════════════════════════════════════════════
   PILL PRIMITIVES
   One vocabulary reused by nav, badges, tags, chips, buttons.
   ═══════════════════════════════════════════════════════════ */

.bwp-pill,
.bwp-badge,
.bwp-tag,
.bwp-analytics__item,
.bwp-toc__cat,
.bwp-toc__year,
.bwp-related__item a,
.bwp-archive-list__meta > span,
.bwp-page-links span,
.bwp-page-links a,
.nav-links .page-numbers,
.bwp-nav__list a,
.bwp-footer-nav__list a {
    display: inline-flex; align-items: center; gap: .45em;
    font-family: var(--bwp-font-ui);
    font-size: .68rem; font-weight: 500;
    letter-spacing: .1em; text-transform: uppercase;
    line-height: 1;
    padding: .55em .95em;
    border-radius: var(--bwp-pill);
    border: 1px solid var(--bwp-border);
    color: var(--bwp-text);
    background: transparent;
    white-space: nowrap;
    text-decoration: none;
}

/* filled variants */
.bwp-badge {
    background: var(--bwp-badge); color: var(--bwp-badge-ink);
    border-color: transparent; font-weight: 600;
}
.bwp-badge--sm { font-size: .6rem; padding: .45em .8em; }

/* per-form badge colours */
.bwp-badge--puisi      { background: #1f3fa8; }
.bwp-badge--syair      { background: #a3261e; }
.bwp-badge--karmina    { background: #c9971c; color: #1a1f3a; }
.bwp-badge--hikayat    { background: #6b4a2e; }
.bwp-badge--cerpen     { background: #2d5a6e; }
.bwp-badge--novel      { background: #1f4d3f; }
.bwp-badge--nukilan    { background: #5a4a7a; }
.bwp-badge--ratapan    { background: #3a3f5c; }
.bwp-badge--esei       { background: #4a4a4a; }
.bwp-badge--memoir     { background: #8b6b4a; }
.bwp-badge--terjemahan { background: #2f5d50; }

.bwp-tag {
    background: var(--bwp-bg-subtle); border-color: transparent;
}
.bwp-tag:hover { background: var(--bwp-text); color: var(--bwp-on-ink); }
.bwp-tag--lg { font-size: .9rem; padding: .6em 1.2em; text-transform: none; letter-spacing: .02em; font-family: var(--bwp-font-display); }

.bwp-analytics__item,
.bwp-toc__cat,
.bwp-toc__year,
.bwp-archive-list__meta > span {
    color: var(--bwp-muted);
}

/* buttons */
.bwp-btn,
.bwp-search-form__btn,
.bwp-share__btn,
.comment-respond .submit {
    display: inline-flex; align-items: center; justify-content: center; gap: .5em;
    font-family: var(--bwp-font-ui); font-size: .72rem; font-weight: 600;
    letter-spacing: .1em; text-transform: uppercase;
    min-height: 44px; padding: 0 1.4em;
    border-radius: var(--bwp-pill); border: none;
    background: var(--bwp-text); color: var(--bwp-on-ink);
    cursor: pointer;
    transition: background .18s, color .18s, transform .18s;
}
.bwp-btn:hover,
.bwp-search-form__btn:hover,
.bwp-share__btn:hover,
.comment-respond .submit:hover { background: var(--bwp-link); color: var(--bwp-on-ink); }
.bwp-btn--accent { background: var(--bwp-accent); color: var(--bwp-on-accent); }
.bwp-btn--ghost  { background: transparent; color: var(--bwp-text); border: 1px solid var(--bwp-ui-border); }

/* inputs */
.bwp-search-form__input,
.bwp-cf-input,
.bwp-cf-textarea {
    font-family: var(--bwp-font); font-size: 1rem;
    color: var(--bwp-text); background: var(--bwp-bg-raised);
    border: 1px solid var(--bwp-ui-border);
    border-radius: var(--bwp-pill);
    padding: .7em 1.2em; min-height: 44px;
    width: 100%;
}
.bwp-cf-textarea { border-radius: var(--bwp-radius); resize: vertical; }
.bwp-search-form__input:focus,
.bwp-cf-input:focus,
.bwp-cf-textarea:focus { outline: 2px solid var(--bwp-link); outline-offset: 1px; border-color: transparent; }

/* ═══════════════════════════════════════════════════════════
   PAGE FRAME
   ═══════════════════════════════════════════════════════════ */

.bwp-page-wrap {
    /* full-width layout: the pill header, cover, cards and footer span the
       viewport between fluid gutters; body text keeps its own measure */
    max-width: none;
    margin: 0 auto;
    padding: 0 var(--bwp-gutter) 1rem;
    animation: bwp-in .35s ease both;
}
@keyframes bwp-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.bwp-main { display: block; }

/* ═══════════════════════════════════════════════════════════
   SITE HEADER — indigo pill bar (brackets the page with the footer)
   lockup: mark · site name · Jawi  |  text nav with a gold dot
   ═══════════════════════════════════════════════════════════ */

.bwp-site-header {
    --h-ink: #f6f1e4; --h-dim: #c7bd9f; --h-gold: #e0b344;
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-areas: "brand nav";
    align-items: center;
    gap: 0 2rem;
    margin: 1rem 0 clamp(2rem, 5vw, 3.25rem);
    padding: 0 1.6rem 0 .7rem;
    min-height: 64px;
    border-radius: var(--bwp-pill);
    background: #1a2a6c;
    color: var(--h-ink);
}
.bwp-brand { grid-area: brand; display: inline-flex; align-items: center; gap: .8rem; color: var(--h-ink); min-height: 64px; }
.bwp-brand:hover { color: var(--h-gold); }
.bwp-brand__mark { width: 48px; height: 48px; flex: none; }
.bwp-brand__text { display: flex; align-items: baseline; gap: .8rem; flex-wrap: wrap; }
.bwp-site-header__title {
    margin: 0;
    font-family: var(--bwp-font-brand);
    font-size: 1.2rem; font-weight: 400; letter-spacing: .01em;
    line-height: 1; color: inherit; white-space: nowrap;
}
.bwp-site-header__jawi { font-family: var(--bwp-font-jawi); font-size: 1rem; line-height: 1; color: var(--h-gold); white-space: nowrap; }
.bwp-site-header__tagline, .bwp-site-header__section, .bwp-site-header__band { display: none; }
.bwp-site-header--front .bwp-site-header__title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.bwp-site-header--front .bwp-site-header__jawi { font-size: 1.45rem; }

.bwp-nav-toggle { display: none; }
.bwp-nav { grid-area: nav; }
.bwp-nav__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 1.5rem; }
@media screen and (min-width: 48em) and (max-width: 66em) {
    .bwp-site-header { gap: 0 1rem; }
    .bwp-nav__list { gap: 0 .7rem; }
    .bwp-nav__list a { font-size: .58rem; letter-spacing: .08em; }
    .bwp-site-header__jawi { font-size: .9rem; }
    .bwp-site-header--front .bwp-site-header__jawi { font-size: 1rem; }
    .bwp-site-header { padding-right: 1.2rem; }
    /* inner pages: the Latin name alone fits the pill beside the menu */
    .bwp-site-header:not(.bwp-site-header--front) .bwp-site-header__jawi { display: none; }
}
.bwp-nav__list li { margin: 0; position: relative; }
.bwp-nav__list a {
    display: inline-flex; align-items: center; gap: .45em;
    padding: 0; min-height: 44px;
    border: none; border-radius: 0; background: transparent;
    font-family: var(--bwp-font-ui); font-size: .68rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase;
    color: var(--h-ink); white-space: nowrap;
    transition: color .15s;
}
.bwp-nav__list a::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--h-gold); opacity: 0; transform: scale(.4); transition: opacity .15s, transform .15s; }
.bwp-nav__list a:hover { color: var(--h-gold); }
.bwp-nav__list a:hover::before { opacity: .6; transform: none; }
.bwp-nav__list .current-menu-item > a::before,
.bwp-nav__list .current_page_item > a::before,
.bwp-nav__list .current-menu-ancestor > a::before { opacity: 1; transform: none; }

/* dropdowns */
.bwp-nav__list .sub-menu {
    display: none; position: absolute; top: calc(100% + 2px); left: -1rem;
    min-width: 12em; margin: 0; padding: 6px; list-style: none;
    background: var(--bwp-bg-raised); border: 1px solid var(--bwp-border);
    border-radius: var(--bwp-radius); box-shadow: var(--bwp-shadow-lg);
    z-index: 50;
}
.bwp-nav__list li:hover > .sub-menu,
.bwp-nav__list li:focus-within > .sub-menu,
.bwp-nav__list li[data-touch-open="1"] > .sub-menu { display: block; }
.bwp-nav__list .sub-menu a { display: flex; width: 100%; white-space: normal; padding: .6em 1rem; border-radius: var(--bwp-radius-sm); color: var(--bwp-text); min-height: 40px; }
.bwp-nav__list .sub-menu a::before { display: none; }
.bwp-nav__list .sub-menu a:hover { background: var(--bwp-bg-subtle); color: var(--bwp-link); }

/* category blurb under the header on single works */

/* ═══════════════════════════════════════════════════════════
   FRONT PAGE — hero + jalur pills + table of contents
   ═══════════════════════════════════════════════════════════ */

.bwp-book-title {
    position: relative;
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 1rem 1.5rem;
    align-items: end;
    padding: clamp(1rem, 3vw, 2.5rem) 0 clamp(1.5rem, 3vw, 2.5rem);
    margin-bottom: 1.75rem;
    border-bottom: 1px solid var(--bwp-text);
    overflow: hidden;
}
.bwp-book-title__jawi {
    position: absolute; right: -.05em; top: 0;
    font-family: var(--bwp-font-jawi);
    font-size: clamp(6rem, 15vw, 12rem); line-height: 1.1;
    color: var(--bwp-link); opacity: .055;
    pointer-events: none; user-select: none; white-space: nowrap;
}
.bwp-book-title { container-type: inline-size; }
.bwp-book-title__name {
    grid-column: 1 / span 12;
    /* one line at every width: sized against the hero's own width */
    font-family: var(--bwp-font-brand);
    font-size: clamp(1.5rem, 8.5cqw, 6.2rem);
    line-height: 1; letter-spacing: 0;
    margin: 0;
    white-space: nowrap;
    position: relative;
}
.bwp-book-title__name em { font-style: italic; font-weight: 300; }
.bwp-book-title__meta {
    grid-column: 1 / span 12;
    display: flex; flex-wrap: wrap; gap: .3rem 0; position: relative; margin: .4rem 0 0;
    font-family: var(--bwp-font-ui); font-size: .66rem;
    letter-spacing: .16em; text-transform: uppercase; color: var(--bwp-muted);
}
.bwp-book-title__meta span + span::before { content: '·'; margin: 0 .6em; color: var(--bwp-accent); }
@media screen and (min-width: 52em) {
    .bwp-book-title__name { grid-column: 1 / span 12; }
    .bwp-book-title__meta { grid-column: 1 / span 7; grid-row: 2; }
    .bwp-book-title__jawi { right: 0; top: 50%; transform: translateY(-58%); font-size: clamp(6rem, 12vw, 10.5rem); }
}

/* cover variant: the front page opens like the jacket of an anthology —
   imprint line and Jawi seal at the head, title, author and edition line at the foot */
.bwp-book-title--cover,
.bwp-opening--cover {
    --c-ink: #fdfcf8; --c-dim: rgba(253, 252, 248, .78); --c-gold: #e3b84a;
    isolation: isolate;
    display: flex; flex-direction: column; justify-content: space-between; align-items: stretch;
    min-height: clamp(360px, 40vw, 560px);
    border-bottom: 0; border-radius: 40px;
    padding: clamp(1.4rem, 2.6vw, 2.2rem) clamp(1.25rem, 3.5vw, 3rem) clamp(1.6rem, 3vw, 2.6rem);
    margin-bottom: clamp(1.5rem, 3vw, 2.25rem);
    background: #1a2a6c; color: var(--c-ink);
}
.bwp-book-title__img,
.bwp-opening__img {
    position: absolute; inset: 0; z-index: -2;
    width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%;
    display: block;
}
.bwp-book-title--cover::after,
.bwp-opening--cover::after {
    content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background:
        radial-gradient(120% 90% at 50% 45%, rgba(10, 18, 54, 0) 45%, rgba(10, 18, 54, .42) 100%),
        linear-gradient(180deg, rgba(10, 18, 54, .28) 0%, rgba(10, 18, 54, .14) 30%, rgba(10, 18, 54, .22) 55%, rgba(10, 18, 54, .82) 100%),
        linear-gradient(90deg, rgba(10, 18, 54, .32) 0%, rgba(10, 18, 54, 0) 55%);
}
.bwp-book-title__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; position: relative; }
.bwp-book-title__kicker {
    font-family: var(--bwp-font-ui); font-size: .66rem; letter-spacing: .22em; text-transform: uppercase;
    color: var(--c-gold); padding-top: .35rem; white-space: nowrap;
}
.bwp-book-title__seal { font-family: var(--bwp-font-jawi); font-size: clamp(1.3rem, 2.2vw, 1.9rem); line-height: 1; color: var(--c-gold); white-space: nowrap; }
.bwp-book-title__block { position: relative; display: block; }
.bwp-book-title--cover .bwp-book-title__name { color: var(--c-ink); text-shadow: 0 2px 18px rgba(6, 10, 30, .45); }
.bwp-book-title__author {
    margin: 1.1rem 0 0; padding-top: 1rem; max-width: 36rem;
    border-top: 1px solid var(--c-gold);
    font-family: var(--bwp-font); font-size: clamp(.92rem, 1.25vw, 1.08rem); letter-spacing: .14em; text-transform: uppercase;
    color: var(--c-ink);
}
.bwp-book-title--cover .bwp-book-title__meta { color: var(--c-dim); margin-top: .55rem; }
.bwp-book-title--cover .bwp-book-title__meta span + span::before { color: var(--c-gold); }
html.bwp-night .bwp-book-title--cover, html.bwp-night .bwp-opening--cover { background: #0e1636; }
@media screen and (max-width: 51.99em) {
    .bwp-book-title--cover { min-height: 0; aspect-ratio: 4 / 3; border-radius: 28px; }
    .bwp-opening--cover { min-height: 0; aspect-ratio: 16 / 10; border-radius: 28px; }
    .bwp-book-title--cover .bwp-book-title__img, .bwp-opening__img { object-position: 50% 20%; }
    .bwp-book-title__author { font-size: .72rem; letter-spacing: .12em; }
    .bwp-book-title__seal { font-size: 1.15rem; }
}
@media screen and (max-width: 40em) {
    .bwp-book-title--cover { aspect-ratio: 4 / 5; }
    .bwp-opening--cover { aspect-ratio: 4 / 4.4; }
    .bwp-book-title__kicker { font-size: .58rem; letter-spacing: .18em; }
    .bwp-book-title__seal { font-size: 1rem; }
}

/* title page with a cover: a work's featured image, or a strand/form's bundled plate */
.bwp-opening--cover { min-height: clamp(300px, 32vw, 440px); border-color: transparent; justify-content: space-between; gap: 1.25rem; }
.bwp-opening--cover .bwp-opening__kicker,
.bwp-opening--cover .bwp-opening__seal { color: var(--c-gold); }
.bwp-opening--cover .bwp-work__title,
.bwp-opening--cover .bwp-archive-header__title { color: var(--c-ink); text-shadow: 0 2px 18px rgba(6, 10, 30, .45); }
.bwp-opening--cover .bwp-work__meta,
.bwp-opening--cover .bwp-archive-header__desc { border-top-color: rgba(253, 252, 248, .28); color: var(--c-dim); }
.bwp-opening--cover .bwp-citation-label { color: var(--c-dim); }
.bwp-opening--cover .bwp-analytics__item,
.bwp-opening--cover .bwp-analytics__cat { background: rgba(253, 252, 248, .12); border-color: rgba(253, 252, 248, .22); color: var(--c-ink); }
.bwp-opening--cover .bwp-opening__foot { display: flex; flex-direction: column; gap: .9rem; position: relative; }
.bwp-opening__blurb { margin: 0; font-style: italic; font-size: 1rem; line-height: 1.5; color: var(--bwp-muted); max-width: 40em; }
.bwp-opening--cover .bwp-opening__blurb { color: var(--c-dim); }
.bwp-opening__credit {
    margin: 0; font-family: var(--bwp-font-ui); font-size: .58rem; letter-spacing: .12em; text-transform: uppercase;
    color: var(--c-dim); opacity: .85;
}
.bwp-opening__credit a { color: inherit; text-decoration: underline; text-underline-offset: .15em; }

/* jalur tema — categories as pills, generated by index.php */
.bwp-jalur {
    display: flex; flex-wrap: wrap; gap: .4rem; align-items: center;
    margin: 0 0 2.5rem;
    padding: 0; list-style: none;
}
.bwp-jalur__label {
    font-family: var(--bwp-font-ui); font-size: .62rem; font-weight: 600; letter-spacing: .18em;
    text-transform: uppercase; color: var(--bwp-rubric); margin-right: .4rem;
}
.bwp-jalur__link {
    display: inline-flex; align-items: center; gap: .5em;
    font-family: var(--bwp-font-ui); font-size: .7rem; font-weight: 500;
    letter-spacing: .08em; text-transform: uppercase;
    padding: .7em 1.1em; min-height: 36px;
    border-radius: var(--bwp-pill);
    background: var(--bwp-bg-subtle); color: var(--bwp-text);
    transition: background .15s, color .15s;
}
.bwp-jalur__link:hover { background: var(--bwp-text); color: var(--bwp-on-ink); }
.bwp-jalur__count {
    font-size: .62rem; padding: .25em .6em; border-radius: var(--bwp-pill);
    background: var(--bwp-bg-raised); color: var(--bwp-muted);
}
.bwp-jalur__link:hover .bwp-jalur__count { background: rgba(255,255,255,.15); color: inherit; }

/* Mukadimah excerpt — set as an epigraph under the half-title */
@media screen and (min-width: 52em) {
            }

/* Pintu masuk — two rows of pills, one label column */
.bwp-pintu { display: flex; flex-direction: column; gap: .6rem; margin: 0 0 3rem; padding: 1.1rem 1.25rem; border-radius: var(--bwp-radius-lg); background: var(--bwp-bg-raised); border: 1px solid var(--bwp-border-faint); position: relative; overflow: hidden; }
/* kawung — the Javanese batik motif, faint behind the pintu panel */
.bwp-pintu::before { content: ''; position: absolute; inset: 0; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'><g fill='none' stroke='%23c9971c' stroke-width='1'><ellipse cx='24' cy='6' rx='7' ry='11'/><ellipse cx='24' cy='42' rx='7' ry='11'/><ellipse cx='6' cy='24' rx='11' ry='7'/><ellipse cx='42' cy='24' rx='11' ry='7'/></g><circle cx='24' cy='24' r='1.6' fill='%23a3261e'/></svg>") 0 0 / 48px 48px; opacity: .16; pointer-events: none; mask-image: linear-gradient(90deg, transparent 35%, #000 100%); -webkit-mask-image: linear-gradient(90deg, transparent 35%, #000 100%); }
.bwp-pintu > * { position: relative; }
.bwp-pintu .bwp-jalur { margin: 0; }
.bwp-jalur__label { min-width: 3.4em; }
.bwp-jalur__link--outline { background: transparent; border: 1px solid var(--bwp-border); }
.bwp-jalur__link--outline .bwp-jalur__count { background: var(--bwp-bg-subtle); }

/* Karya terbaharu — the newest work as an opening page */
.bwp-featured { margin: 0 0 3rem; padding: 2rem clamp(1.25rem, 3vw, 2.5rem) 2.25rem; border-radius: var(--bwp-radius-lg); background: var(--bwp-bg-subtle) url('../img/textures/manuscript.jpg') right -4rem top -2rem / 60% auto no-repeat; position: relative; overflow: hidden; }
.bwp-featured::before {
    content: ''; position: absolute; inset: 0; pointer-events: none;
    /* fade the manuscript texture into the card's own surface so every scheme and night mode keep their contrast */
    background: linear-gradient(90deg, var(--bwp-bg-subtle) 42%, rgba(243, 240, 231, .78) 70%, rgba(243, 240, 231, .55));
    background: linear-gradient(90deg, var(--bwp-bg-subtle) 42%, color-mix(in srgb, var(--bwp-bg-subtle) 78%, transparent) 70%, color-mix(in srgb, var(--bwp-bg-subtle) 55%, transparent));
}
html.bwp-night .bwp-featured::before,
body.bwp-scheme-night .bwp-featured::before { background: linear-gradient(90deg, var(--bwp-bg-subtle) 42%, rgba(23, 29, 61, .82) 70%, rgba(23, 29, 61, .6)); }
.bwp-featured > * { position: relative; }
.bwp-featured__kicker { margin: 0 0 1.25rem; font-family: var(--bwp-font-ui); font-size: .64rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--bwp-rubric); }
.bwp-featured__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1.5rem 2rem; align-items: start; }
.bwp-featured__head { grid-column: 1 / span 12; display: flex; flex-direction: column; gap: .9rem; }
.bwp-featured__title { margin: 0; font-family: var(--bwp-font-brand); font-size: clamp(1.9rem, 3.4vw, 3rem); line-height: 1.02; letter-spacing: 0; text-wrap: pretty; }
.bwp-featured__title a { color: var(--bwp-text); }
.bwp-featured__title a:hover { color: var(--bwp-link); }
.bwp-featured__dateline { margin: 0; font-family: var(--bwp-font-display); font-style: italic; font-size: 1rem; color: var(--bwp-muted); }
.bwp-featured__body { grid-column: 1 / span 12; font-size: 1.2rem; line-height: 1.7; color: var(--bwp-text-mid); }
.bwp-featured__body p { margin: 0 0 1.1em; }
.bwp-featured__body--verse p { font-size: 1.25rem; line-height: 1.65; }
.bwp-featured__more { display: inline-flex; align-items: center; gap: .5em; font-family: var(--bwp-font-ui); font-size: .68rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--bwp-link); border-bottom: 1px solid var(--bwp-accent); padding-bottom: .2em; }
.bwp-featured__more:hover { color: var(--bwp-text); }
@media screen and (min-width: 52em) {
    .bwp-featured__head { grid-column: 1 / span 5; position: sticky; top: 1.5rem; }
    .bwp-featured__body { grid-column: 7 / span 6; padding-top: .3rem; }
}

.bwp-toc-header {
    display: flex; align-items: center; gap: 1rem;
    font-family: var(--bwp-font-brand); font-size: 1.7rem; margin: 0 0 1.25rem;
}
.bwp-toc-header::after {
    content: ''; flex: 1 1 0; height: 1px; background: var(--bwp-border);
}

/* grouped TOC → cards in two columns on wide screens */
@media screen and (min-width: 52em) {
    .bwp-toc-wrap { columns: 2; column-gap: 1.25rem; }
}
.bwp-toc-group {
    background: var(--bwp-bg-raised);
    border: 1px solid var(--bwp-border-faint);
    border-radius: var(--bwp-radius-lg);
    padding: 1.4rem 1.5rem 1rem;
    margin-bottom: 1.25rem;
    break-inside: avoid;
}
.bwp-toc-group__heading {
    display: flex; align-items: center; gap: .7rem;
    font-family: var(--bwp-font-brand); font-size: 1.3rem; margin: 0 0 .6rem;
}
.bwp-toc-group__label { flex: none; }
.bwp-toc-group__heading::after {
    content: ''; order: 2; flex: 1 1 0; height: 1px; background: var(--bwp-border-faint);
}
.bwp-toc-group__count {
    order: 3; flex: none;
    font-family: var(--bwp-font-ui); font-size: .62rem; letter-spacing: .12em;
    padding: .35em .8em; border-radius: var(--bwp-pill);
    border: 1px solid var(--bwp-border); color: var(--bwp-muted);
}
.bwp-toc-group__desc {
    margin: -.2rem 0 .9rem; font-style: italic; font-size: .98rem; color: var(--bwp-muted);
}

.bwp-toc { list-style: none; margin: 0; padding: 0; }
.bwp-toc__item { border-top: 1px solid var(--bwp-border-faint); }
.bwp-toc__item:first-child { border-top: none; }
.bwp-toc__link {
    display: flex; flex-wrap: wrap; align-items: baseline; gap: .35rem .6rem;
    padding: .75rem .6rem;
    margin: 0 -.6rem;
    border-radius: var(--bwp-radius-sm);
    color: var(--bwp-text);
    transition: background .15s;
}
.bwp-toc__link:hover { background: var(--bwp-bg-subtle); color: var(--bwp-text); }
.bwp-toc__title { font-family: var(--bwp-font-display); font-size: 1.18rem; line-height: 1.2; flex: 1 1 12em; min-width: 0; }
.bwp-toc__year { margin-left: auto; }
.bwp-toc__excerpt {
    display: block; padding: 0 .6rem .8rem; margin-top: -.3rem;
    font-style: italic; font-size: .95rem; color: var(--bwp-muted);
}
.bwp-toc__thumb { width: 72px; height: 72px; object-fit: cover; border-radius: var(--bwp-radius-sm); flex: none; }
.bwp-toc__body { display: flex; flex-wrap: wrap; align-items: baseline; gap: .35rem .6rem; flex: 1 1 0; min-width: 0; }
.bwp-toc__item--has-thumb .bwp-toc__excerpt { padding-left: calc(72px + 1.2rem); }

/* flat TOC layouts */
body.bwp-toc-grid .bwp-toc { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
body.bwp-toc-grid .bwp-toc__item,
body.bwp-toc-masonry .bwp-toc__item {
    border: 1px solid var(--bwp-border-faint); border-radius: var(--bwp-radius);
    background: var(--bwp-bg-raised); padding: .4rem .8rem;
}
body.bwp-toc-masonry .bwp-toc { position: relative; }
body.bwp-toc-masonry .bwp-toc__item { width: 49%; margin-bottom: .75rem; }
@media (max-width: 36em) {
    body.bwp-toc-grid .bwp-toc { grid-template-columns: 1fr; }
    body.bwp-toc-masonry .bwp-toc__item { width: 100%; }
}

/* pagination */
.nav-links, .bwp-page-links { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: center; margin: 2rem auto; }
.nav-links .page-numbers.current, .bwp-page-links > span { background: var(--bwp-text); color: var(--bwp-on-ink); border-color: transparent; }
.nav-links a.page-numbers:hover, .bwp-page-links a:hover { background: var(--bwp-bg-subtle); }
.nav-links .page-numbers { min-height: 40px; min-width: 40px; justify-content: center; }
.bwp-inf-status {
    text-align: center; font-family: var(--bwp-font-ui); font-size: .72rem;
    letter-spacing: .1em; text-transform: uppercase; color: var(--bwp-muted);
    padding: 1.5rem 0 2rem; min-height: 2em;
}

/* ═══════════════════════════════════════════════════════════
   ORNAMENTS — awan larat (scroll) and pucuk rebung (triangles)
   ═══════════════════════════════════════════════════════════ */

.bwp-ornament {
    display: flex; justify-content: center; align-items: center; gap: 1rem;
    margin: 2.5rem auto; color: var(--bwp-ornament);
    font-size: 1rem; line-height: 1;
}
.bwp-ornament::before, .bwp-ornament::after {
    content: ''; width: 5rem; max-width: 20vw; height: 1px; background: var(--bwp-border);
}
.bwp-ornament svg { width: auto; height: 1.2em; }
.bwp-rule { border: 0; height: 1px; background: var(--bwp-border); margin: 2.5rem auto; max-width: var(--bwp-measure); }

/* ═══════════════════════════════════════════════════════════
   SINGLE WORK — asymmetric opening, then a reading column
   ═══════════════════════════════════════════════════════════ */

.bwp-single { position: relative; }

/* ── Title page: every work, page and archive opens the same way ──
   a rounded paper panel: kicker and Jawi seal at the head, Kagnue title,
   chips beneath a hairline — the inside counterpart of the front-page jacket */
.bwp-opening {
    position: relative;
    display: flex; flex-direction: column; gap: 1.1rem;
    padding: clamp(1.3rem, 2.4vw, 2rem) clamp(1.25rem, 3.5vw, 3rem) clamp(1.2rem, 2.2vw, 1.8rem);
    margin-bottom: clamp(1.75rem, 3vw, 2.5rem);
    background: var(--bwp-bg-subtle);
    border: 1px solid var(--bwp-border);
    border-radius: 40px;
    overflow: hidden;
}
.bwp-opening__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; min-height: 1.4rem; }
.bwp-opening__kicker {
    margin: 0; padding-top: .3rem;
    font-family: var(--bwp-font-ui); font-size: .66rem; font-weight: 600;
    letter-spacing: .22em; text-transform: uppercase; color: var(--bwp-rubric);
    white-space: nowrap;
}
.bwp-opening__seal {
    margin-left: auto;
    font-family: var(--bwp-font-jawi); font-size: clamp(1.3rem, 2.2vw, 1.9rem); line-height: 1;
    color: var(--bwp-accent); white-space: nowrap;
}
.bwp-work__title,
.bwp-archive-header__title {
    margin: 0;
    font-family: var(--bwp-font-brand);
    font-size: clamp(2rem, 4.6vw, 4.4rem);
    line-height: 1.02; letter-spacing: 0; font-weight: 400;
    text-wrap: pretty;
}
.bwp-work__meta {
    display: flex; flex-wrap: wrap; align-items: center; gap: .7rem 1rem;
    padding-top: 1rem; border-top: 1px solid var(--bwp-border);
}
.bwp-work__meta:empty { display: none; }
.bwp-citation-label {
    margin: 0;
    font-family: var(--bwp-font-ui); font-size: .66rem; letter-spacing: .2em;
    text-transform: uppercase; color: var(--bwp-muted);
}
.bwp-opening--page { gap: .9rem; }
@media screen and (max-width: 40em) {
    .bwp-opening { border-radius: 28px; gap: .9rem; }
    .bwp-work__title, .bwp-archive-header__title { font-size: 1.6rem; }
    .bwp-opening__kicker { font-size: .58rem; letter-spacing: .18em; }
    .bwp-opening__seal { font-size: 1.1rem; }
}

/* ── Work layout: text column with the apparatus beside it on wide screens ──
   Fills the full-width page instead of leaving paper either side of a centred column. */
.bwp-work__layout { display: block; }
.bwp-work__aside > :first-child { margin-top: 0; }
@media screen and (min-width: 64em) {
    .bwp-work__layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) clamp(20rem, 30vw, 28rem);
        gap: 0 clamp(2rem, 4vw, 4rem);
        align-items: start;
    }
    /* the text starts where the title does: inset by the opening panel's own padding */
    .bwp-work__main { --bwp-measure: 44em; min-width: 0; padding-left: clamp(1.25rem, 3.5vw, 3rem); }
    /* per-form sheets centre .bwp-work__content with margin-left:auto; this outranks them */
    body[class] .bwp-work__layout .bwp-work__main > * { margin-left: 0; }
    .bwp-work__aside { position: sticky; top: 1.25rem; }
    .bwp-work__aside .bwp-colophon,
    .bwp-work__aside .bwp-related { max-width: none; margin-left: 0; margin-right: 0; }
    .bwp-work__aside .bwp-colophon { margin-top: 0; }
    .bwp-work__aside .bwp-related { margin-top: 1.25rem; }
    .bwp-work__main .bwp-tags,
    .bwp-work__main .bwp-share { justify-content: flex-start; }
}
/* tighter vertical rhythm throughout */
.bwp-tags { margin-top: 1.75rem; }
.bwp-featured { margin-bottom: 2rem; }

.bwp-author-card {
    padding: 1.25rem 1.4rem 1.3rem; border-radius: var(--bwp-radius-lg);
    background: var(--bwp-bg-subtle); border: 1px solid var(--bwp-border);
}
.bwp-author-card__head { display: flex; align-items: center; gap: 1rem; }
.bwp-author-card .bwp-portrait { flex: none; }
.bwp-author-card__names { display: flex; flex-direction: column; gap: .25rem; min-width: 0; }
.bwp-author-card__name { font-family: var(--bwp-font-display); font-size: 1.15rem; line-height: 1.1; }
.bwp-author-card__role { font-family: var(--bwp-font-ui); font-size: .6rem; letter-spacing: .18em; text-transform: uppercase; color: var(--bwp-muted); }
.bwp-author-card__tagline { margin: 1rem 0 0; font-style: italic; color: var(--bwp-text-mid); font-size: 1rem; line-height: 1.5; }
.bwp-author-card__social { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--bwp-border); }
.bwp-author-card .bwp-social { justify-content: flex-start; }
.bwp-work__aside .bwp-author-card { margin-top: 1.5rem; }
@media screen and (min-width: 64em) { .bwp-work__aside .bwp-author-card { margin-top: 0; } }

/* analytics bar → chips */
.bwp-analytics { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.bwp-analytics__cat { background: var(--bwp-bg-subtle); border-color: transparent; color: var(--bwp-text); }

/* reading column */
.bwp-author-note,
.bwp-dedication,
.bwp-epigraph,
.bwp-featured-image,
.bwp-terjemahan,
.bwp-work__content,
.bwp-tags,
.bwp-share,
.bwp-colophon,
.bwp-related,
.bwp-comments,
.bwp-page-links,
.bwp-foreword__content,
.bwp-colophon-page__content,
.bwp-edit-link,
.bwp-sidebar,
.bwp-footer-widgets {
    max-width: var(--bwp-measure);
    margin-left: auto; margin-right: auto;
}

.bwp-work__content {
    font-size: 1.2rem;
    line-height: var(--bwp-lh);
    color: var(--bwp-text-mid);
    overflow-wrap: break-word;
    hyphens: auto;
}
.bwp-work__content p { margin: 0 0 1.1em; }
.bwp-work__content h2, .bwp-work__content h3 { margin-top: 1.8em; }
.bwp-work__content blockquote {
    margin: 1.6em 0; padding: 1.2em 1.5em;
    border-radius: var(--bwp-radius);
    background: var(--bwp-bg-subtle);
    font-family: var(--bwp-font-display); font-style: italic; font-size: 1.15em; line-height: 1.4;
}
.bwp-work__content a { text-decoration: underline; text-underline-offset: .18em; text-decoration-thickness: 1px; text-decoration-color: var(--bwp-accent); }
.bwp-work__content figure { margin: 1.6em 0; }
.bwp-work__content img { border-radius: var(--bwp-radius); }
.bwp-work__content hr { border: 0; height: 22px; margin: 2.5em auto; width: 200px; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='22' viewBox='0 0 200 22'><path d='M4 12c10-12 20-12 30 0s20 12 30 0 20-12 30 0 20 12 30 0 20-12 30 0' fill='none' stroke='%23c9971c' stroke-width='1.3'/></svg>") center / contain no-repeat; }

/* drop cap — rounded ink tile */
.bwp-dropcap-cerpen.bwp-form-cerpen   .bwp-work__content > p:first-of-type::first-letter,
.bwp-dropcap-novel.bwp-form-novel     .bwp-work__content > p:first-of-type::first-letter,
.bwp-dropcap-hikayat.bwp-form-hikayat .bwp-work__content > p:first-of-type::first-letter,
.bwp-dropcap-memoir.bwp-form-memoir   .bwp-work__content > p:first-of-type::first-letter,
.bwp-dropcap-esei.bwp-form-esei       .bwp-work__content > p:first-of-type::first-letter,
.bwp-dropcap-nukilan.bwp-form-nukilan .bwp-work__content > p:first-of-type::first-letter,
.bwp-dropcap-force-on                 .bwp-work__content > p:first-of-type::first-letter {
    float: left;
    font-family: var(--bwp-dropcap-font, var(--bwp-font-display));
    font-weight: 500;
    font-size: 3.6em; line-height: .8;
    padding: .18em .2em .1em .18em;
    margin: .1em .35em 0 0;
    border-radius: .3em .3em .3em .08em;
    background: var(--bwp-rubric); color: var(--bwp-on-ink);
}
.bwp-dropcap-force-off .bwp-work__content > p:first-of-type::first-letter {
    float: none; font-size: inherit; padding: 0; margin: 0; background: none; color: inherit; border-radius: 0;
}

/* apparatus blocks */
.bwp-author-note {
    margin-bottom: 1.75rem; padding: 1.1rem 1.4rem;
    background: var(--bwp-bg-subtle); border-radius: var(--bwp-radius);
}
.bwp-author-note__heading {
    margin: 0 0 .35rem; font-family: var(--bwp-font-ui); font-size: .62rem;
    font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--bwp-rubric);
}
.bwp-author-note__text { font-style: italic; color: var(--bwp-text-mid); }
.bwp-author-note__text p { margin: 0; }

.bwp-dedication { text-align: center; font-family: var(--bwp-font-script, cursive); font-style: italic; font-size: 1.5rem; color: var(--bwp-link); margin-bottom: 1.5rem; }

.bwp-epigraph {
    text-align: center; margin-bottom: 2.25rem; max-width: 28em;
    font-family: var(--bwp-font-display); font-style: italic; font-size: 1.2rem; line-height: 1.5;
    color: var(--bwp-text-mid);
}
.bwp-epigraph__text { margin: 0; }
.bwp-epigraph__source {
    display: block; margin-top: .5rem;
    font-family: var(--bwp-font-ui); font-style: normal; font-size: .66rem;
    letter-spacing: .16em; text-transform: uppercase; color: var(--bwp-muted);
}

.bwp-featured-image { margin-bottom: 2rem; }
.bwp-featured-image img { width: 100%; border-radius: var(--bwp-radius-lg); }
.bwp-featured-image__caption { margin-top: .5rem; font-size: .9rem; font-style: italic; color: var(--bwp-muted); text-align: center; }

/* translation apparatus */
.bwp-terjemahan {
    display: flex; flex-direction: column; gap: .6rem;
    margin-bottom: 2rem; padding: 1.1rem 1.4rem;
    border: 1px dashed var(--bwp-accent); border-radius: var(--bwp-radius);
}
.bwp-terjemahan__label {
    font-family: var(--bwp-font-ui); font-size: .62rem; font-weight: 600;
    letter-spacing: .2em; text-transform: uppercase; color: var(--bwp-rubric);
}
.bwp-terjemahan__source { margin: 0; font-family: var(--bwp-font-mono); font-size: .9rem; color: var(--bwp-text-mid); }
.bwp-terjemahan__note { margin: 0; font-style: italic; font-size: 1rem; color: var(--bwp-text-mid); }

/* tags */
.bwp-tags { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; margin-top: 2.5rem; }

/* share row */
.bwp-share { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: center; align-items: center; margin-top: 1.5rem; }
.bwp-share__label { font-family: var(--bwp-font-ui); font-size: .62rem; letter-spacing: .18em; text-transform: uppercase; color: var(--bwp-muted); margin-right: .3rem; }
.bwp-share__btn { background: transparent; color: var(--bwp-text); border: 1px solid var(--bwp-border); min-height: 40px; padding: 0 1em; font-size: .66rem; }
.bwp-share__btn:hover { background: var(--bwp-text); color: var(--bwp-on-ink); }
.bwp-copy-tip {
    position: fixed; left: 50%; bottom: 5.5rem; transform: translate(-50%, 10px);
    padding: .6em 1.2em; border-radius: var(--bwp-pill);
    background: var(--bwp-text); color: var(--bwp-bg);
    font-family: var(--bwp-font-ui); font-size: .75rem; letter-spacing: .08em;
    opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; z-index: 120;
}
.bwp-copy-tip--visible { opacity: 1; transform: translate(-50%, 0); }

/* colophon → card of pills */
.bwp-colophon {
    margin-top: 2rem; padding: 1.25rem 1.4rem;
    background: var(--bwp-bg-subtle); border-radius: var(--bwp-radius-lg);
    text-align: left;
}
.bwp-colophon .bwp-ornament { display: none; }
.bwp-colophon > :first-child { margin-top: 0; }
.bwp-colophon .bwp-ornament { margin: 0 0 .9rem; justify-content: flex-start; }
.bwp-colophon .bwp-ornament::before { display: none; }
.bwp-colophon__line {
    display: inline-flex; align-items: center; gap: .4em;
    margin: 0 .3rem .4rem 0;
    padding: .5em .95em;
    border-radius: var(--bwp-pill);
    background: var(--bwp-bg-raised);
    font-family: var(--bwp-font-ui); font-size: .7rem; letter-spacing: .06em;
    color: var(--bwp-text);
}
.bwp-colophon__line em { font-family: var(--bwp-font-mono); font-style: normal; font-size: 1.05em; letter-spacing: 0; }
.bwp-colophon__line--dateline { font-family: var(--bwp-font-display); font-size: 1.05rem; letter-spacing: 0; font-style: italic; background: transparent; padding-left: 0; display: flex; width: 100%; }
.bwp-colophon__notes {
    margin: .8rem 0 0; padding: .9rem 1.1rem;
    background: var(--bwp-bg-raised); border-radius: var(--bwp-radius);
    font-size: .98rem; line-height: 1.6; color: var(--bwp-text-mid);
}
.bwp-colophon__notes-heading { margin: 0 0 .3rem; font-family: var(--bwp-font-ui); font-size: .62rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--bwp-muted); }
.bwp-colophon__notes-text { font-style: italic; }

/* related works */
.bwp-related { margin-top: 1.5rem; }
.bwp-related__heading {
    font-family: var(--bwp-font-ui); font-size: .62rem; font-weight: 600;
    letter-spacing: .2em; text-transform: uppercase; color: var(--bwp-rubric); margin: 0 0 .7rem;
}
.bwp-related__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.bwp-related__item a {
    font-family: var(--bwp-font-display); font-size: 1rem; letter-spacing: 0; text-transform: none;
    padding: .55em 1.1em; background: var(--bwp-bg-subtle); border-color: transparent; white-space: normal;
}
.bwp-related__item a:hover { background: var(--bwp-text); color: var(--bwp-on-ink); }
.bwp-related__year { font-family: var(--bwp-font-ui); font-size: .66rem; color: var(--bwp-muted); }
.bwp-related__item a:hover .bwp-related__year { color: inherit; opacity: .8; }


/* pages (page.php, foreword, colophon page) */
.bwp-edit-link { text-align: center; margin-top: 2rem; }
.bwp-edit-link a { font-family: var(--bwp-font-ui); font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; }

/* ═══════════════════════════════════════════════════════════
   SHORTCODES & BLOCKS
   ═══════════════════════════════════════════════════════════ */

.bwp-petikan {
    margin: 1.8em 0; padding: 1.3em 1.6em;
    border-radius: var(--bwp-radius-lg); background: var(--bwp-bg-raised); border: 1px solid var(--bwp-border-faint);
    font-family: var(--bwp-font-display); font-style: italic; font-size: 1.15em; line-height: 1.45;
}
.bwp-petikan__source { display: block; margin-top: .7em; font-family: var(--bwp-font-ui); font-style: normal; font-size: .66rem; letter-spacing: .16em; text-transform: uppercase; color: var(--bwp-muted); }

.bwp-istilah { border-bottom: 1px dotted var(--bwp-accent); cursor: help; position: relative; }
.bwp-istilah__tip {
    position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translateX(-50%);
    width: max-content; max-width: 18em; padding: .6em .9em;
    background: var(--bwp-text); color: var(--bwp-bg);
    font-family: var(--bwp-font-ui); font-size: .78rem; line-height: 1.4; text-align: left;
    border-radius: var(--bwp-radius-sm); box-shadow: var(--bwp-shadow-lg);
    opacity: 0; pointer-events: none; transition: opacity .15s; z-index: 30; white-space: normal;
}
.bwp-istilah:hover .bwp-istilah__tip, .bwp-istilah:focus .bwp-istilah__tip { opacity: 1; }

.bwp-bait { display: flex; gap: 1em; margin: 0 0 1em; }
.bwp-bait__num {
    flex: none; width: 2em; height: 2em; border-radius: var(--bwp-pill);
    border: 1px solid var(--bwp-border); display: flex; align-items: center; justify-content: center;
    font-family: var(--bwp-font-ui); font-size: .66rem; color: var(--bwp-muted);
}
.bwp-vnum { font-family: var(--bwp-font-ui); font-size: .6em; vertical-align: super; color: var(--bwp-accent); margin-right: .3em; }

.bwp-chapter { margin: 2.5em 0; }
.bwp-chapter__num {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 2.4em; height: 2.4em; padding: 0 .8em; border-radius: var(--bwp-pill);
    background: var(--bwp-link); color: var(--bwp-on-ink);
    font-family: var(--bwp-font-display); font-size: 1rem; margin-bottom: .6em;
}
.bwp-chapter__title { display: block; font-family: var(--bwp-font-display); font-size: 1.6em; line-height: 1.1; margin-bottom: .6em; }

/* ═══════════════════════════════════════════════════════════
   ARCHIVE / SEARCH / 404
   ═══════════════════════════════════════════════════════════ */

.bwp-archive-header .bwp-ornament { display: none; }
.bwp-archive-header__taxlabel { margin: 0; }
.bwp-archive-header--search .bwp-tag--lg,
.bwp-archive-header--tag .bwp-tag--lg { all: unset; font: inherit; color: inherit; }
.bwp-archive-header--search .bwp-tag--lg::before { content: '\201C'; color: var(--bwp-accent); }
.bwp-archive-header--search .bwp-tag--lg::after  { content: '\201D'; color: var(--bwp-accent); }
.bwp-archive-header__desc { max-width: 40em; font-size: 1.1rem; font-style: italic; color: var(--bwp-muted); margin: 0; padding-top: 1rem; border-top: 1px solid var(--bwp-border); }

.bwp-archive-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }
.bwp-archive-list__item {
    padding: 1rem 1.3rem; border: 1px solid var(--bwp-border-faint); border-radius: var(--bwp-radius);
    background: var(--bwp-bg-raised);
}
.bwp-archive-list__title { font-family: var(--bwp-font-display); font-size: 1.35rem; line-height: 1.15; color: var(--bwp-text); display: block; margin-bottom: .5rem; }
.bwp-archive-list__title:hover { color: var(--bwp-link); }
.bwp-archive-list__meta { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; }
body.bwp-archive-grid .bwp-archive-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body.bwp-archive-masonry .bwp-archive-list { display: block; position: relative; }
body.bwp-archive-masonry .bwp-archive-list__item { width: 49%; margin-bottom: .75rem; }
@media (max-width: 36em) {
    body.bwp-archive-grid .bwp-archive-list { grid-template-columns: 1fr; }
    body.bwp-archive-masonry .bwp-archive-list__item { width: 100%; }
}

.bwp-empty-state { text-align: center; padding: 3rem 0; }
.bwp-404 .bwp-ornament { display: none; }
.bwp-404__title { font-family: var(--bwp-font-brand); font-size: clamp(2rem, 4.6vw, 4.4rem); line-height: 1.02; margin: 0; }
.bwp-404__desc { margin: 0; padding-top: 1rem; border-top: 1px solid var(--bwp-border); font-style: italic; color: var(--bwp-muted); max-width: 40em; }
.bwp-404 .bwp-search-form { max-width: 28rem; margin: .25rem 0 0; }

/* search form */
.bwp-search-form { display: flex; gap: .5rem; align-items: center; max-width: 32em; margin: 0 auto; }
.bwp-search-form__input { flex: 1 1 0; min-width: 0; }
.bwp-sidebar { margin-top: 3rem; }
.bwp-sidebar .widget-title, .bwp-footer-widget__title {
    font-family: var(--bwp-font-ui); font-size: .62rem; font-weight: 600; letter-spacing: .2em;
    text-transform: uppercase; color: var(--bwp-muted); text-align: center; margin: 0 0 .8rem;
}

/* ═══════════════════════════════════════════════════════════
   COMMENTS
   ═══════════════════════════════════════════════════════════ */

.bwp-comments { margin-top: 3.5rem; padding-top: 2rem; border-top: 1px solid var(--bwp-border); }
.bwp-comments__heading { display: flex; align-items: center; gap: .6rem; font-size: 1.5rem; margin-bottom: 1.25rem; }
.bwp-comments__count { font-family: var(--bwp-font-ui); font-size: .62rem; letter-spacing: .12em; padding: .35em .8em; border-radius: var(--bwp-pill); border: 1px solid var(--bwp-border); color: var(--bwp-muted); }
.bwp-comment-list, .bwp-comment-list .children { list-style: none; margin: 0; padding: 0; }
.bwp-comment-list .children { margin-left: 2rem; }
.bwp-comment__body { padding: 1rem 1.2rem; margin-bottom: .75rem; border-radius: var(--bwp-radius); background: var(--bwp-bg-raised); border: 1px solid var(--bwp-border-faint); }
.bwp-comment__header { display: flex; align-items: center; gap: .8rem; margin-bottom: .6rem; }
.bwp-comment__avatar img { width: 40px; height: 40px; border-radius: var(--bwp-pill); }
.bwp-comment__author { font-family: var(--bwp-font-display); font-size: 1.05rem; }
.bwp-comment__date { display: block; font-family: var(--bwp-font-ui); font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; color: var(--bwp-muted); }
.bwp-comment__content { font-size: 1.05rem; color: var(--bwp-text-mid); }
.bwp-comment__content p:last-child { margin-bottom: 0; }
.bwp-comment__actions { display: flex; gap: .5rem; margin-top: .5rem; font-family: var(--bwp-font-ui); font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; }
.bwp-comment__pending { color: var(--bwp-muted); font-size: .9rem; }
.bwp-comment-nav { display: flex; justify-content: space-between; font-family: var(--bwp-font-ui); font-size: .72rem; margin: 1rem 0; }
.bwp-cf-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 36em) { .bwp-cf-row { grid-template-columns: 1fr; } }
.bwp-cf-field { display: flex; flex-direction: column; gap: .3rem; margin-bottom: 1rem; }
.bwp-cf-field--full { grid-column: 1 / -1; }
.bwp-cf-label { font-family: var(--bwp-font-ui); font-size: .66rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--bwp-text); }
.bwp-cf-required { color: var(--bwp-badge); }
.bwp-cf-note { font-size: .9rem; color: var(--bwp-muted); font-style: italic; }
.bwp-cf-cookie-label { display: flex; gap: .5rem; align-items: flex-start; font-size: .95rem; color: var(--bwp-text-mid); }
.comment-respond .comment-reply-title { font-size: 1.3rem; }

/* ═══════════════════════════════════════════════════════════
   FOOTER — full-bleed nila band
   sign-off → lockup | menu pills → copyright · glyphs · credit
   Sits outside .bwp-page-wrap; the inner container shares its
   max-width and gutters so content stays on the page grid.
   ═══════════════════════════════════════════════════════════ */

.bwp-footer-widgets { margin-top: 3rem; }

.bwp-site-footer {
    --f-ink:   #f6f1e4;
    --f-dim:   #c7bd9f;
    --f-gold:  #e0b344;
    --f-line:  rgba(246, 241, 228, .16);
    /* a rounded panel inside the page gutters, not a hard-edged band */
    max-width: none;
    margin: 3rem var(--bwp-gutter) 1.25rem;
    padding: 3rem clamp(1.5rem, 4vw, 3.5rem) 1.5rem;
    border-radius: var(--bwp-radius-lg);
    background: #1a2a6c;
    color: var(--f-ink);
}
@media screen and (min-width: 52em) { .bwp-site-footer { border-radius: 40px; } }
.bwp-site-footer__inner { max-width: none; }
.bwp-site-footer a { color: var(--f-ink); }
.bwp-site-footer__inner {
    margin: 0 auto;
    display: flex; flex-direction: column; align-items: stretch; gap: 2.25rem;
}

/* 1 · sign-off | identity */
.bwp-site-footer__top { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 2rem 3rem; align-items: center; }
.bwp-site-footer__sign { display: flex; flex-direction: column; gap: .7rem; max-width: 38em; }
.bwp-site-footer__identity { display: flex; align-items: center; justify-content: flex-end; gap: 1.4rem; }
.bwp-site-footer__identity .bwp-site-footer__mark { width: 96px; height: 96px; flex: none; }
.bwp-site-footer__identity-text { display: flex; flex-direction: column; align-items: flex-end; text-align: right; gap: .2rem; }
.bwp-site-footer__initial { display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: var(--bwp-pill); background: #f6f1e4; color: #1a2a6c; font-family: var(--bwp-font-display); font-style: italic; font-size: 1.6rem; box-shadow: inset 0 0 0 2px rgba(224, 179, 68, .9); }
.bwp-site-footer__identity .bwp-site-footer__jawi { font-size: clamp(2.2rem, 3.4vw, 3rem); line-height: 1.2; margin: 0 0 .2rem; text-align: right; }
.bwp-site-footer__identity .bwp-site-footer__anthology { font-family: var(--bwp-font-brand); font-size: clamp(1.4rem, 2vw, 1.9rem); line-height: 1; white-space: nowrap; }
.bwp-site-footer__jawa { font-family: var(--bwp-font-jawa); font-size: 1.35rem; line-height: 1.5; color: #d4cdb9; margin: 0 0 .4rem; }
.bwp-site-footer__tagline { font-family: var(--bwp-font-ui); font-size: .64rem; letter-spacing: .2em; text-transform: uppercase; color: var(--f-dim); margin-top: .5rem; }
.bwp-site-footer__lead {
    margin: 0;
    font-family: var(--bwp-font-script); font-style: italic; font-weight: 400;
    font-size: clamp(1.7rem, 2.8vw, 2.45rem); line-height: 1.3; letter-spacing: 0;
    white-space: pre-line;
    color: var(--f-gold); text-wrap: pretty;
}
.bwp-site-footer__sub { margin: 0; max-width: 34em; font-size: 1.15rem; line-height: 1.55; color: #d4cdb9; }

/* 2 · lockup | menu */
.bwp-site-footer__row {
    display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap;
    padding-top: 2rem; border-top: 1px solid var(--f-line);
}
.bwp-site-footer__lockup { display: inline-flex; align-items: center; gap: .9rem; }
.bwp-site-footer__author { font-family: var(--bwp-font-display); font-size: 1.2rem; line-height: 1.05; }
.bwp-site-footer__role { font-family: var(--bwp-font-ui); font-size: .6rem; letter-spacing: .18em; text-transform: uppercase; color: var(--f-dim); margin-top: .25rem; }
.bwp-site-footer__mark { width: 44px; height: 44px; flex: none; border-radius: var(--bwp-pill); }
.bwp-site-footer__names { display: flex; flex-direction: column; }
.bwp-site-footer__anthology { font-family: var(--bwp-font-display); font-size: 1.45rem; line-height: 1; }
.bwp-site-footer__jawi { margin-top: .15rem; font-family: var(--bwp-font-jawi); font-size: 1.1rem; line-height: 1.4; color: var(--f-gold); text-align: left; }
.bwp-footer-nav__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .3rem; }
.bwp-footer-nav__list a { min-height: 38px; padding: 0 1.05em; border-color: rgba(246, 241, 228, .28); color: var(--f-ink); }
.bwp-footer-nav__list a:hover { background: var(--f-ink); color: #1a2a6c; border-color: transparent; }

/* 3 · hairline row */
.bwp-site-footer__bottom {
    display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem;
    padding-top: 1.1rem; border-top: 1px solid var(--f-line);
    font-family: var(--bwp-font-ui); font-size: .64rem; letter-spacing: .14em; text-transform: uppercase;
    color: var(--f-dim);
}
.bwp-site-footer__copyright { margin: 0; font-family: var(--bwp-font); font-size: .95rem; letter-spacing: 0; text-transform: none; color: #d4cdb9; }
.bwp-site-footer__copyright p { margin: 0; display: inline; }
.bwp-site-footer__credit { margin: 0; text-align: right; }
.bwp-site-footer__credit a, .bwp-site-footer__copyright a { color: var(--f-ink); }

/* social glyphs — borderless in the footer */
.bwp-social { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .15rem; justify-content: center; }
.bwp-social__item { margin: 0; }
.bwp-social__link {
    display: inline-flex; align-items: center; justify-content: center;
    width: 36px; height: 36px; border-radius: var(--bwp-pill);
    color: var(--f-dim, var(--bwp-muted));
    transition: background .15s, color .15s;
}
.bwp-social__link svg { width: 16px; height: 16px; }
.bwp-social__link:hover { background: rgba(246, 241, 228, .1); color: var(--f-ink, var(--bwp-text)); }
.bwp-social--collapsible .bwp-social__item:nth-child(n+9) { display: none; }
.bwp-social--collapsible.bwp-social--expanded .bwp-social__item:nth-child(n+9) { display: block; }
.bwp-social__toggle {
    height: 36px; padding: 0 .9em; border-radius: var(--bwp-pill);
    border: 1px solid rgba(246, 241, 228, .28); background: transparent; color: var(--f-dim);
    font-family: var(--bwp-font-ui); font-size: .62rem; letter-spacing: .1em; cursor: pointer;
}

@media (max-width: 52em) {
    .bwp-site-footer { padding-top: 2.5rem; }
    .bwp-site-footer__inner { gap: 1.75rem; }
    .bwp-site-footer__row { padding-top: 1.5rem; }
    /* stacked footer: the identity block (mark, titles, tagline) opens the footer; the sign-off follows */
    .bwp-site-footer__top { display: flex; flex-direction: column; align-items: flex-start; gap: 1.75rem; }
    .bwp-site-footer__identity { order: -1; flex-direction: row; align-items: center; justify-content: flex-start; gap: 1.1rem; }
    .bwp-site-footer__identity .bwp-site-footer__mark { width: 72px; height: 72px; }
    .bwp-site-footer__identity-text { align-items: flex-start; text-align: left; }
    .bwp-site-footer__identity .bwp-site-footer__jawi { text-align: left; }
    .bwp-site-footer__bottom { grid-template-columns: 1fr; }
    .bwp-site-footer__credit { text-align: left; }
    .bwp-social { justify-content: flex-start; }
}

/* ═══════════════════════════════════════════════════════════
   PORTRAIT MEDALLION — CSS duotone (nila ink, kapas light)
   Grayscale photo screened over indigo: shadows stay nila, skin and
   shirt lift to kapas. A faint ketupat lattice sits behind.
   ═══════════════════════════════════════════════════════════ */

.bwp-portrait {
    position: relative; display: inline-flex; overflow: hidden; flex: none;
    border-radius: var(--bwp-pill);
    background: #1a2a6c;
    box-shadow: inset 0 0 0 2px rgba(224, 179, 68, .9);
    isolation: isolate;
}
/* layer 1: grayscale photo screened over nila → blacks become nila */
.bwp-portrait img {
    display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 15%;
    transform: scale(var(--bwp-portrait-zoom, 1.6)); transform-origin: 50% 18%;
    filter: grayscale(1) contrast(1.2) brightness(1.02);
    mix-blend-mode: screen;
}
/* layer 2: kapas multiplied on top → whites become kapas, nila stays nila */
.bwp-portrait::after {
    content: ''; position: absolute; inset: 0; border-radius: inherit;
    background:
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'><path d='M12 0L24 12 12 24 0 12z' fill='none' stroke='%231a2a6c' stroke-opacity='.10' stroke-width='.8'/></svg>") 0 0 / 24px 24px,
        #f6f1e4;
    mix-blend-mode: multiply; pointer-events: none;
}
/* a pre-made duotone (the bundled medallion) must not be blended again */
.bwp-portrait img[src$="portrait.png"] { filter: none; mix-blend-mode: normal; transform: none; object-position: 50% 50%; }
.bwp-portrait:has(img[src$="portrait.png"])::after { display: none; }
.bwp-portrait--sm { width: 56px; height: 56px; }
.bwp-portrait--md { width: 120px; height: 120px; box-shadow: inset 0 0 0 3px rgba(224, 179, 68, .9); }
.bwp-portrait--lg { width: 240px; height: 240px; border-radius: 48% 48% 48% 48% / 42% 42% 56% 56%; box-shadow: inset 0 0 0 4px rgba(224, 179, 68, .9); }
.bwp-site-footer .bwp-portrait { box-shadow: inset 0 0 0 2px rgba(224, 179, 68, .9), 0 0 0 4px rgba(246, 241, 228, .08); }

/* ═══════════════════════════════════════════════════════════
   FLOATING CONTROLS — progress, night toggle, back to top
   ═══════════════════════════════════════════════════════════ */

.bwp-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 200; background: transparent; }
.bwp-progress__bar { height: 100%; width: 0; background: var(--bwp-progress); border-radius: 0 var(--bwp-pill) var(--bwp-pill) 0; transition: width .1s linear; }

.bwp-night-toggle {
    position: fixed;
    bottom: max(1.25rem, env(safe-area-inset-bottom, 0px));
    right:  max(1.25rem, env(safe-area-inset-right, 0px));
    width: 44px; height: 44px;
    border: 1px solid var(--bwp-ui-border); border-radius: var(--bwp-pill);
    background: var(--bwp-bg-raised); color: var(--bwp-link);
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; box-shadow: var(--bwp-shadow); z-index: 100;
    transition: background .2s, color .2s, transform .2s;
}
.bwp-night-toggle:hover { transform: translateY(-2px); box-shadow: var(--bwp-shadow-lg); }
.bwp-night-toggle__moon { display: none; }
body.bwp-night .bwp-night-toggle__sun  { display: none; }
body.bwp-night .bwp-night-toggle__moon { display: block; }

.bwp-back-to-top {
    position: fixed;
    bottom: calc(max(1.25rem, env(safe-area-inset-bottom, 0px)) + 44px + .6rem);
    right:  max(1.25rem, env(safe-area-inset-right, 0px));
    width: 44px; height: 44px; padding: 0;
    border: none; border-radius: var(--bwp-pill);
    background: var(--bwp-text); color: var(--bwp-bg);
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; z-index: 90;
    opacity: 0; transform: translateY(8px); pointer-events: none;
    transition: opacity .2s, transform .2s;
}
.bwp-back-to-top.is-visible { opacity: .85; transform: none; pointer-events: auto; }
.bwp-back-to-top:hover, .bwp-back-to-top:focus-visible { opacity: 1; }

.bwp-work__content p.bwp-stanza-focus { outline: 2px solid var(--bwp-accent); outline-offset: 6px; border-radius: 4px; }

/* ═══════════════════════════════════════════════════════════
   NIGHT MODE (reader toggle) — re-inks everything
   Set on <html> by the preload script, mirrored on <body> by JS.
   Kept at a single specificity level that beats scheme compounds.
   ═══════════════════════════════════════════════════════════ */

html.bwp-night body,
body.bwp-night {
    --bwp-bg:            #0f1430;
    --bwp-bg-subtle:     #171d3d;
    --bwp-bg-raised:     #131838;
    --bwp-text:          #ece6d6;
    --bwp-text-mid:      #d4cdb9;
    --bwp-muted:         #b3a785;
    --bwp-accent:        #e0b344;
    --bwp-link:          #9ab8e8;
    --bwp-link-hover:    #c3d6f5;
    --bwp-border:        #2a3156;
    --bwp-border-faint:  #1f2548;
    --bwp-border-ink:    #ece6d6;
    --bwp-ui-border:     #6c7398;
    --bwp-ornament:      #e0b344;
    --bwp-stone:         #3a4268;
    --bwp-progress:      #e0b344;
    --bwp-badge-ink:     #fbf4ea;
    --bwp-on-ink:        #0f1430;
    --bwp-shadow:        0 2px 8px rgba(0,0,0,.35);
    --bwp-shadow-lg:     0 10px 30px rgba(0,0,0,.45);
    --bwp-teal:          #9ab8e8;
    --bwp-gold:          #e0b344;
    --bwp-gold-dim:      #b8923a;
    --bwp-gold-light:    #f0d27a;
    --bwp-cream:         #171d3d;
}
html.bwp-night .bwp-badge, body.bwp-night .bwp-badge { filter: brightness(1.45) saturate(.85); }
html.bwp-night .bwp-badge--karmina, body.bwp-night .bwp-badge--karmina { color: #0f1430; filter: none; }

/* OS dark preference, honoured only when the reader has not chosen and no light scheme is pinned */
@media (prefers-color-scheme: dark) {
    html:not([data-bwp-night="0"]) body:not(.bwp-scheme-cream):not(.bwp-scheme-dusk):not(.bwp-night) {
        --bwp-bg:            #0f1430;
        --bwp-bg-subtle:     #171d3d;
        --bwp-bg-raised:     #131838;
        --bwp-text:          #ece6d6;
        --bwp-text-mid:      #d4cdb9;
        --bwp-muted:         #b3a785;
        --bwp-accent:        #e0b344;
        --bwp-link:          #9ab8e8;
        --bwp-link-hover:    #c3d6f5;
        --bwp-border:        #2a3156;
        --bwp-border-faint:  #1f2548;
        --bwp-border-ink:    #ece6d6;
        --bwp-ui-border:     #6c7398;
        --bwp-ornament:      #e0b344;
        --bwp-stone:         #3a4268;
        --bwp-progress:      #e0b344;
        --bwp-on-ink:        #0f1430;
    }
}

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════ */

/* ── Tablet: 36em–52em ───────────────────────────────────── */
@media screen and (min-width: 36em) and (max-width: 52em) {
    .bwp-work__opening, .bwp-book-title { gap: 1rem; }
    :root { --bwp-measure: 34em; }
}

/* ── Phone: ≤36em ────────────────────────────────────────── */
@media screen and (max-width: 36em) {
    :root { --bwp-font-size: 1.0625rem; --bwp-lh: 1.7; }

    .bwp-site-header {
        grid-template-columns: 1fr auto;
        grid-template-areas: "brand toggle" "nav nav";
        gap: 0 .75rem;
        margin: .75rem 0 1.75rem;
        padding: 0 .6rem 0 .5rem;
        min-height: 56px;
        border-radius: 28px;
    }
    .bwp-brand { min-height: 56px; gap: .6rem; }
    .bwp-brand__mark { width: 40px; height: 40px; }
    .bwp-site-header__title { font-size: 1.02rem; }
    .bwp-site-header__jawi { display: none; }
    .bwp-site-header--front .bwp-site-header__jawi { display: inline; font-size: 1.25rem; }

    .bwp-nav-toggle {
        grid-area: toggle; align-self: center;
        display: inline-flex; align-items: center; gap: .5em;
        min-height: 38px; padding: 0 1em;
        border: 1px solid rgba(246, 241, 228, .35); border-radius: var(--bwp-pill);
        background: transparent; color: var(--h-ink);
        font-family: var(--bwp-font-ui); font-size: .64rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
        cursor: pointer;
    }
    .bwp-nav { grid-area: nav; display: none; padding: 0 .4rem .6rem; }
    .bwp-nav.is-open { display: block; }
    .bwp-nav__list { flex-direction: column; gap: 0; padding: 4px 0 0; border-top: 1px solid rgba(246, 241, 228, .18); }
    .bwp-nav__list a { width: 100%; min-height: 44px; padding: 0 .6rem; }
    .bwp-nav__list .sub-menu { position: static; display: block; box-shadow: none; border: none; background: transparent; padding: 0 0 0 1rem; }
    .bwp-nav__list .sub-menu a { color: var(--h-ink); }

    .bwp-book-title { padding-top: .5rem; }
    .bwp-book-title__jawi { font-size: 7rem; top: -.2em; }
    .bwp-work__content { font-size: 1.1rem; }
    .bwp-toc-group { padding: 1.1rem 1rem .6rem; border-radius: var(--bwp-radius); }
    .bwp-toc__link { padding: .7rem .4rem; margin: 0 -.4rem; row-gap: .5rem; }
    .bwp-toc__title { flex-basis: 100%; }
    .bwp-toc__year { margin-left: 0; }
    .bwp-toc__excerpt { padding: 0 .4rem .7rem; }
    .bwp-colophon { padding: 1.1rem 1.1rem; border-radius: var(--bwp-radius); }

    .bwp-night-toggle { width: 40px; height: 40px; bottom: max(.75rem, env(safe-area-inset-bottom, 0px)); right: max(.75rem, env(safe-area-inset-right, 0px)); }
    .bwp-back-to-top { display: none; }
    .bwp-istilah__tip { left: 0; transform: none; max-width: 14em; }
    .bwp-bait__num { width: 1.8em; height: 1.8em; }
}

/* ═══════════════════════════════════════════════════════════
   PRINT
   ═══════════════════════════════════════════════════════════ */

@media print {
    body { background: #fff; color: #000; font-size: 11pt; }
    .bwp-nav, .bwp-nav-toggle, .bwp-footer-nav, .bwp-social, .bwp-share, .bwp-night-toggle, .bwp-back-to-top,
    .bwp-progress, .bwp-comments, .bwp-related, .bwp-jalur { display: none !important; }
    .bwp-page-wrap { max-width: none; padding: 0; animation: none; }
    .bwp-book-title__jawi { display: none; }
    .bwp-work__title { font-size: 24pt; text-align: left; }
    .bwp-work__content a { color: #000; text-decoration: none; }
    .bwp-work__content a[href^="http"]::after { content: " (" attr(href) ")"; font-size: .8em; color: #555; }
    .bwp-colophon, .bwp-toc-group { background: none; border: 1px solid #999; }
}