/* i18n (0.14) — a translation into another target language. Only pages carrying a
   `target_locale` get these classes (document.js `applyTarget260`); the Persian page has
   none of them and renders exactly as before. Fonts are the reader's system fonts for the
   script; no new font files are shipped (Windows, macOS, Android and Linux all carry one). */
.paper.target-ltr260,.paper.target-ltr260 figcaption,.paper.target-ltr260 .labels,
.paper.target-ltr260 .toc-row,.paper.target-ltr260 .label-row>[dir=ltr]{direction:ltr;text-align:left}
.paper.target-ltr260 .image-label,.paper.target-ltr260 .label-ink9{direction:ltr}
.paper[data-font260=latin],.paper[data-font260=cyrillic]{font-family:"Segoe UI",Roboto,"Noto Sans","Helvetica Neue",Arial,sans-serif}
.paper[data-font260=arabic]{font-family:NotoNaskhArabic,"Noto Naskh Arabic",Amiri,Tahoma,serif}
.paper[data-font260=nastaliq]{font-family:"Noto Nastaliq Urdu","Jameel Noori Nastaleeq","Urdu Typesetting",NotoNaskhArabic,serif;line-height:2.2}
.paper[data-font260=hebrew]{font-family:"Segoe UI","Noto Sans Hebrew",Arial,"Times New Roman",sans-serif}
.paper[data-font260=devanagari]{font-family:"Nirmala UI","Noto Sans Devanagari",Mangal,"Kohinoor Devanagari",sans-serif}
.paper[data-font260=cjk-sc]{font-family:"Microsoft YaHei","PingFang SC","Noto Sans CJK SC","Noto Sans SC","Source Han Sans SC",sans-serif;line-break:strict;word-break:normal}
.paper[data-font260=cjk-tc]{font-family:"Microsoft JhengHei","PingFang TC","Noto Sans CJK TC","Noto Sans TC","Source Han Sans TC",sans-serif;line-break:strict}
.paper[data-font260=cjk-jp]{font-family:"Yu Gothic","Meiryo","Hiragino Sans","Noto Sans CJK JP","Noto Sans JP",sans-serif;line-break:strict}
.paper[data-font260=korean]{font-family:"Malgun Gothic","Apple SD Gothic Neo","Noto Sans CJK KR","Noto Sans KR",sans-serif;word-break:keep-all}
/* 0.16.0 — Greek and Thai targets (system fonts again: Segoe UI and Leelawadee UI on Windows, the Noto families elsewhere).
   Thai writes no spaces between words; Chromium breaks Thai lines with its dictionary, so nothing is forced here. */
.paper[data-font260=greek]{font-family:"Segoe UI",Roboto,"Noto Sans","Noto Sans Greek","Helvetica Neue",Arial,"DejaVu Sans",sans-serif}
.paper[data-font260=thai]{font-family:"Leelawadee UI",Leelawadee,Thonburi,"Noto Sans Thai","Noto Sans Thai UI",Tahoma,Loma,sans-serif;line-height:1.75}
.paper[data-font260] .image-label{font-family:inherit}
.paper.target-ltr260[lang=de-DE]{hyphens:auto}
/* the reading-language selector in the translation pane's title */
.window-head h2 .target260-select{width:auto;min-width:6.5em;max-width:12em;font:inherit;font-size:12px;margin-inline-end:8px;padding:0 6px;
 height:24px;min-height:0;line-height:22px;box-sizing:border-box;flex-shrink:0;align-self:center;vertical-align:middle;
 border-radius:8px;border:1px solid var(--control-border112,rgba(255,255,255,.22));background:var(--surface,#1d1f1b);color:inherit}
/* deep check I8: a figure label of another target is set in that target's typeface, not the
   Persian reading font (`document.css` pins it with !important; a Persian page has no data-font260) */
.paper[data-font260] .image-label,.paper[data-font260] .label-ink9{font-family:inherit!important}
/* owner's decision (after the 0.14.0 deep check): on a phone the translation pane's title words
   give their place to the reading-language selector; the pane tab already names the language */
@media (max-width:700px){.window-head h2 .target-title260{display:none}.window-head h2 .target260-select{margin-inline-end:0;min-width:0;max-width:6em}}
/* the title words beside the list give way (…) before the list does */
.window-head h2 .target-title260{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 0.14.2 (owner's report: the list and the «saved» badge under it, and a plain open list) — the
   reading language is a chip that also carries the page's status as a coloured dot, and opens a
   menu of our own. The native list stays in the page as the value holder, out of sight. */
.window-head h2 .target260-select{position:absolute!important;width:1px!important;min-width:0!important;height:1px!important;padding:0!important;margin:0!important;
 border:0!important;overflow:hidden;clip-path:inset(50%);opacity:0;pointer-events:none}
.window-head h2:has(#target260btn) #pageStatus{position:absolute!important;width:1px!important;min-width:0!important;height:1px!important;padding:0!important;
 overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.target-chip260{display:inline-flex;align-items:center;gap:6px;flex-shrink:0;align-self:center;vertical-align:middle;height:26px;max-width:13em;
 margin-inline-end:8px;padding-block:0;padding-inline:8px 6px;box-sizing:border-box;border-radius:999px;cursor:pointer;
 font:inherit;font-size:12.5px;font-weight:600;line-height:1;color:var(--text);
 border:1px solid color-mix(in srgb,var(--gold) 45%,transparent);
 background:linear-gradient(180deg,color-mix(in srgb,var(--gold) 14%,var(--card)),color-mix(in srgb,var(--gold) 4%,var(--card)));
 box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 10%,transparent),0 1px 2px #0003;transition:border-color .15s,box-shadow .15s,transform .1s}
.target-chip260:hover{border-color:var(--gold);box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 12%,transparent),0 0 0 3px color-mix(in srgb,var(--gold) 16%,transparent)}
.target-chip260:active{transform:translateY(1px)}
.target-chip260:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.target-chip260[aria-expanded=true]{border-color:var(--gold);background:color-mix(in srgb,var(--gold) 20%,var(--card))}
.target-chip260 .name260{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.target-chip260 .short260{display:none;white-space:nowrap}
.target-chip260 .chev260{width:12px;height:12px;flex:none;fill:none;stroke:var(--gold);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .18s}
.target-chip260[aria-expanded=true] .chev260{transform:rotate(180deg)}
/* the status dot: saved = green, translating = a breathing gold, needs review / error = red, not translated = an empty ring */
.dot260{width:8px;height:8px;flex:none;border-radius:50%;box-sizing:border-box;border:1.5px solid var(--muted);background:transparent}
[data-status=saved]>.dot260,.state260[data-status=saved] i{border-color:var(--green);background:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 22%,transparent)}
[data-status=running]>.dot260,.state260[data-status=running] i{border-color:var(--gold);background:var(--gold);animation:breathe260 1.4s ease-in-out infinite}
[data-status=error]>.dot260,[data-status=review]>.dot260,.state260[data-status=error] i,.state260[data-status=review] i{border-color:var(--red);background:var(--red);box-shadow:0 0 0 3px color-mix(in srgb,var(--red) 22%,transparent)}
@keyframes breathe260{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--gold) 55%,transparent)}50%{box-shadow:0 0 0 5px color-mix(in srgb,var(--gold) 0%,transparent)}}
@media (max-width:700px){.target-chip260{margin-inline-end:0;max-width:7.5em;padding-inline:7px 5px}.target-chip260 .name260{display:none}.target-chip260 .short260{display:inline}}
/* the menu */
.target-menu260{position:fixed;z-index:1200;width:300px;max-width:calc(100vw - 16px);display:flex;flex-direction:column;overflow:hidden;box-sizing:border-box;
 color:var(--text);background:color-mix(in srgb,var(--card) 94%,transparent);backdrop-filter:blur(14px) saturate(1.2);
 border:1px solid color-mix(in srgb,var(--gold) 38%,transparent);border-radius:14px;
 box-shadow:0 18px 48px #0006,0 2px 8px #0003,inset 0 1px 0 color-mix(in srgb,#fff 7%,transparent);
 font-size:13px;line-height:1.45;animation:menuin260 .16s cubic-bezier(.2,.8,.3,1);transform-origin:top center}
@keyframes menuin260{from{opacity:0;transform:translateY(-4px) scale(.97)}to{opacity:1;transform:none}}
.target-menu260 .head260{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px 8px}
.target-menu260 .head260 b{font-size:13px;color:var(--gold)}
.target-menu260 .state260{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--muted);white-space:nowrap}
.target-menu260 .state260 i{width:7px;height:7px;border-radius:50%;box-sizing:border-box;border:1.5px solid var(--muted)}
.target-menu260 .find260{margin:0 10px 6px;padding:7px 12px;padding-inline-start:30px;min-height:0;height:34px;box-sizing:border-box;width:auto;border-radius:10px;font:inherit;font-size:13px;
 color:var(--text);background:var(--input) no-repeat;background-size:14px;background-position:right 10px center;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23b89549' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='7' cy='7' r='4.5'/%3E%3Cpath d='M10.5 10.5L14 14'/%3E%3C/svg%3E");
 border:1px solid color-mix(in srgb,var(--line) 80%,transparent);outline:none}
.target-menu260[dir=ltr] .find260{background-position:left 10px center}
.target-menu260 .find260:focus{border-color:var(--gold);box-shadow:0 0 0 3px color-mix(in srgb,var(--gold) 18%,transparent)}
.target-menu260 .list260{overflow-y:auto;overscroll-behavior:contain;padding:2px 6px 6px;outline:none;flex:1 1 auto;min-height:0}
.target-menu260 .group260{position:sticky;top:0;z-index:1;padding:8px 8px 4px;font-size:11px;font-weight:600;letter-spacing:.02em;color:var(--muted);
 background:linear-gradient(color-mix(in srgb,var(--card) 96%,transparent) 70%,transparent)}
.target-menu260 .opt260{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:10px;cursor:pointer;position:relative;transition:background .1s}
.target-menu260 .opt260.active260{background:color-mix(in srgb,var(--gold) 13%,transparent)}
.target-menu260 .opt260.on260{background:color-mix(in srgb,var(--gold) 20%,transparent)}
.target-menu260 .opt260.on260::before{content:'';position:absolute;inset-inline-start:0;top:8px;bottom:8px;width:3px;border-radius:3px;background:var(--gold)}
.target-menu260 .glyph260{width:32px;height:32px;flex:none;display:grid;place-items:center;border-radius:9px;font-size:14px;font-weight:700;line-height:1;
 --hue:var(--gold);color:var(--hue);background:color-mix(in srgb,var(--hue) 15%,transparent);border:1px solid color-mix(in srgb,var(--hue) 30%,transparent)}
.target-menu260 .glyph260[data-script=Arab]{--hue:#d4a24c}
.target-menu260 .glyph260[data-script=Hebr]{--hue:#7fa7e0}
.target-menu260 .glyph260[data-script=Latn]{--hue:#6fc3b2}
.target-menu260 .glyph260[data-script=Cyrl]{--hue:#b48fe0}
.target-menu260 .glyph260[data-script=Deva]{--hue:#e98f6a}
.target-menu260 .glyph260[data-script=Hans],.target-menu260 .glyph260[data-script=Hant]{--hue:#e57373}
.target-menu260 .glyph260[data-script=Jpan]{--hue:#f08fb0}
.target-menu260 .glyph260[data-script=Kore]{--hue:#6fa8dc}
:root[data-theme=light] .target-menu260 .glyph260{color:color-mix(in srgb,var(--hue) 70%,#000)}
.target-menu260 .words260{display:flex;flex-direction:column;min-width:0;flex:1}
.target-menu260 .pname260{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.target-menu260 .native260{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;unicode-bidi:isolate}
.target-menu260[dir=rtl] .native260{text-align:right}.target-menu260[dir=ltr] .native260{text-align:left}
.target-menu260 .ready260{width:7px;height:7px;flex:none;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 20%,transparent)}
.target-menu260 .tick260{width:16px;height:16px;flex:none;fill:none;stroke:var(--gold);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;visibility:hidden}
.target-menu260 .on260 .tick260{visibility:visible}
.target-menu260 .none260{margin:14px;color:var(--muted);text-align:center}
.target-menu260 .foot260{margin:0;padding:8px 14px 10px;font-size:11px;color:var(--muted);border-top:1px solid color-mix(in srgb,var(--line) 55%,transparent)}
/* a phone: a sheet from the bottom */
.shade260{position:fixed;inset:0;z-index:1199;background:#0007;animation:fade260 .16s ease-out}
@keyframes fade260{from{opacity:0}}
.target-menu260.sheet260{left:0!important;right:0;bottom:0;top:auto!important;width:auto;max-width:none;max-height:72vh;border-radius:18px 18px 0 0;
 padding-bottom:env(safe-area-inset-bottom);animation:sheet260 .2s cubic-bezier(.2,.8,.3,1);transform-origin:bottom center}
.target-menu260.sheet260::before{content:'';display:block;width:38px;height:4px;margin:8px auto 0;border-radius:4px;background:color-mix(in srgb,var(--muted) 55%,transparent)}
.target-menu260.sheet260 .opt260{padding:9px 8px}
@keyframes sheet260{from{transform:translateY(40%);opacity:.4}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.target-menu260,.shade260,.target-chip260 .chev260,[data-status=running]>.dot260{animation:none;transition:none}}
/* the title keeps one line: the chip, then the title words, which give way (…) first */
/* release11 stacks the pane title over its status badge (a column, at most 112px wide): that column
   is what put the badge under the old list. With the chip the status is the chip's dot, so the
   title is one row again — the chip, then the title words, which give way (…) first */
#readingPanes>.reader-window .bar11>h2:has(#target260btn),.window-head h2:has(#target260btn){display:flex!important;flex-direction:row!important;
 align-items:center!important;flex-wrap:nowrap;min-width:0;max-width:300px;white-space:nowrap}
.window-head h2:has(#target260btn) .target-title260{flex:0 1 auto;min-width:0}
/* a narrow pane hides the title row (release11 compact); the language chip stays reachable */
.reader-window[data-compact11=true] .bar11 h2:has(#target260btn){display:flex!important;max-width:240px}
/* 0.14.2 — the interface-language globe in the top bar (i18n_ui260.js) and its menu's extras */
.topbar .lang-top260{gap:5px;padding-inline:9px 10px;font-weight:700;letter-spacing:.03em}
.topbar .lang-top260 svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.topbar .lang-top260 .code260{font-size:11.5px;line-height:1;padding:3px 5px;border-radius:6px;color:var(--gold);background:color-mix(in srgb,var(--gold) 14%,transparent)}
.topbar .lang-top260[aria-expanded=true]{border-color:var(--gold);background:color-mix(in srgb,var(--gold) 16%,var(--card))}
.topbar .lang-top260.off260 .code260{color:var(--muted);background:color-mix(in srgb,var(--muted) 14%,transparent)}
/* a phone: the globe is only its code, and the actions sit closer, so the bar keeps its width
   (it overflowed a 430px screen by 16px) */
@media (max-width:700px){.topbar .lang-top260{padding-inline:5px;min-width:0}.topbar .lang-top260 svg{display:none}
 .topbar .top-actions:has(#portalLang260){gap:4px!important}}
.target-menu260 .dir260{flex:none;font-size:13px;color:var(--muted);opacity:.8}
.target-menu260 .exp260{flex:none;font-size:10px;padding:1px 6px;border-radius:999px;color:var(--gold);border:1px solid color-mix(in srgb,var(--gold) 40%,transparent)}
.target-menu260 .locked260{display:flex;align-items:center;gap:10px;margin:0 10px 8px;padding:8px 10px;border-radius:10px;font-size:12px;
 background:color-mix(in srgb,var(--gold) 10%,transparent);border:1px dashed color-mix(in srgb,var(--gold) 45%,transparent)}
.target-menu260 .locked260 span{flex:1}
.target-menu260 .locked260 .btn{min-height:28px;height:28px;padding:2px 10px;font-size:12px;flex:none}
.target-menu260.off260 .opt260{opacity:.5;cursor:default}
.target-menu260.off260 .opt260.active260{background:transparent}
/* 0.14.2 (contents audit 6) — the contents list reads in the book's translation language: the list
   takes that language's direction (a German list runs left to right, numbers at the right) and
   each title its own; Persian is right-aligned exactly as before */
.toc9-list .toc9-row>span{unicode-bidi:plaintext}
.toc9-list[dir=rtl] .toc9-row,.toc9-list[dir=rtl] .toc9-row>span{text-align:right}
.toc9-list[dir=ltr] .toc9-row,.toc9-list[dir=ltr] .toc9-row>span{text-align:left}
/* 0.14.2 — the album's language (a book translated into several languages) */
.album-lang262{display:inline-flex;align-items:center;gap:6px;font-size:12.5px}
.album-lang262 select{width:auto;min-height:0;height:30px;padding:2px 8px}