@font-face {
  font-family: "ALKATIP Basma";
  src: url("./assets/fonts/alkatip-basma.woff2") format("woff2"),
       url("https://db.onlinewebfonts.com/t/3c16518f40da2fc2901f37666c0556a7.woff2") format("woff2"),
       url("https://db.onlinewebfonts.com/t/3c16518f40da2fc2901f37666c0556a7.woff") format("woff"),
       url("https://db.onlinewebfonts.com/t/3c16518f40da2fc2901f37666c0556a7.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
.alkatip-basma { font-family: "ALKATIP Basma", serif; direction: rtl; unicode-bidi: embed; line-height: 2.2; }
:root {
  --body-font: "ALKATIP Basma", "Noto Naskh Arabic", serif;
  --display-font: var(--body-font);
  --book-font: var(--body-font);
}
body { font-size: max(14px, calc(14 * var(--unit))); line-height: 1.8; }
h1, h2, .cover-title, .cover-byline, .editorial-label, .leaf-kicker { letter-spacing: normal; }
.welcome h1 { line-height: 1.25; }
.welcome p, .feature-copy p, .book-label, .detail-information p, .library-intro p { font-size: max(14px, calc(14 * var(--unit))); }
.feature-copy h2, .catalogue-card h2, .featured-pick strong { line-height: 1.45; }
.cover-title { font-size: 14cqi; line-height: 1.26; }
.cover-byline { font-size: 6.5cqi; }
.cover-series { letter-spacing: normal; }
body[data-view="home"] { background: linear-gradient(270deg, var(--outer-cream) 58.14%, var(--outer-paper) 58.14%); }
body[data-view="home"] .app-frame { background: linear-gradient(270deg, var(--frame-cream) 58.85%, var(--frame-paper) 58.85%); }
body[data-view="home"] .app { background: linear-gradient(270deg, var(--cream) 59%, var(--paper) 59%); }
body[data-view="library"] { background: linear-gradient(270deg, var(--outer-paper) 42.94%, var(--outer-cream) 42.94%); }
body[data-view="library"] .app-frame { background: linear-gradient(270deg, var(--frame-paper) 42.4%, var(--frame-cream) 42.4%); }
body[data-view="library"] .app { background: linear-gradient(270deg, var(--paper) 42.2%, var(--cream) 42.2%); }
.rail::after { inset-inline: auto 0; }
.popover { right: auto; inset-inline-end: 0; }
.popover :is(a,button,span) { text-align: start; }
.search-results { left: auto; inset-inline: 0 auto; }
.navigation-menu { left: auto; inset-inline: calc(65 * var(--unit)) auto; }
.filter-search .icon { left: auto; inset-inline-start: 10px; }
.catalogue-save.icon-button { right: auto; inset-inline-end: 14px; }
:is(.section-link,.start-button,.library-controls,.calendar-controls,.reader-back,.reader-page-button) .icon { transform: scaleX(-1); }
.book-spread, .book-spread-next { direction: ltr; }
.book-leaf, .book-cover-intro { direction: rtl; }
@media (min-width: 761px) {
  .book-leaf--left { grid-area: 1 / 1; }
  .book-leaf--right, .book-cover-intro { grid-area: 1 / 2; }
}
.book-leaf .chapter { line-height: 2.2; }
.book-stage.is-closed::before { right: calc(50% - 2px); left: max(-8px, calc(50% - var(--cover-width) - 8px)); }
.book-stage.is-turning::before { left: -8px; right: -8px; }
.book-board { justify-self: end; }
.book-corner--next { left: 0; right: auto; }
.book-corner--previous { right: 0; left: auto; }
.book-corner--next::before { left: 0; right: auto; transform: scaleX(-1); }
.book-corner--previous::before { right: 0; left: auto; transform: none; }
.reader-page-caption > span:first-child, .home-goal-progress > span, .tracking-summary > span:last-child { direction: ltr; unicode-bidi: isolate; }
@media (max-width: 760px) {
  body[data-view="home"] .app { background: var(--cream); }
  body[data-view="library"] .app { background: var(--paper); }
  .book-stage.is-closed::before { left: -5px; right: -5px; }
  .rail-link-label { font-size: 12px; }
  .search-form input::placeholder { font-size: 13px; }
}

.highlight-swatch { width: 25px; height: 25px; border: 1px solid #61534766; border-radius: 50%; background: var(--swatch); flex: 0 0 auto; }
.chapter mark[data-color] { color: #251d24; background: #f1cf62; }
.chapter mark[data-color="pink"] { background: #eea2ba; }
.chapter mark[data-color="green"] { background: #98c7a4; }
.chapter mark[data-color="blue"] { background: #97b9e8; }
.saved-ink { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; }
.saved-ink:empty { display: none; }
.ink-page-button { position: absolute; inset: auto auto 12px 50px; z-index: 2; display: grid; place-items: center; width: 33px; height: 33px; border: 0; border-radius: 50%; color: var(--reader-text-color); background: #a0834830; }
.ink-page-button .icon { width: 16px; height: 16px; }
.drawing-dialog { width: min(460px, calc(100vw - 20px)); }
.drawing-paper { position: relative; overflow: hidden; border-radius: 7px; border: 1px solid var(--line); aspect-ratio: 360 / 440; max-height: 55dvh; margin: 8px 0; background: #fff7e7; }
.drawing-paper > .cover-face { position: absolute; inset: 0; }
.drawing-text { padding: 8%; font-size: 15px; overflow-wrap: anywhere; }
.drawing-text h2 { margin-block: 7px; }
.drawing-surface { position: absolute; inset: 0; touch-action: none; cursor: crosshair; }
.drawing-surface svg, .journal-ink svg { display: block; width: 100%; height: 100%; pointer-events: none; }
.drawing-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.journal-ink { height: 110px; margin-block: 8px; border: 1px solid var(--line); border-radius: 5px; background: #fff6e4; }
.chapter [data-paragraph] { overflow-wrap: anywhere; }
@media (max-width: 400px) { .selection-tools { gap: 2px; } .selection-tools .icon-button { width: 27px; } .highlight-swatch { width: 22px; height: 22px; } }