/* Bookylens 0.8: calm gold glass, bounded motion, compact reading workspace. */
:root{--glass:rgba(36,37,31,.88);--glass-border:#d8b56970;--glass-shadow:0 20px 65px #0005,0 1px 0 #fff1 inset;--motion:.18s;--surface-glow:#dfbb6620}
:root[data-theme=light]{--glass:rgba(255,253,247,.9);--glass-border:#cba8547a;--glass-shadow:0 18px 60px #50340920,0 1px 0 #fff inset;--surface-glow:#bb852422}
:root[data-effects=off] *, :root[data-effects=off] *::before,:root[data-effects=off] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
:root[data-glass=off]{--glass:var(--panel,#24251f)}
:root[data-glass=off] .glass-window,:root[data-glass=off] dialog{backdrop-filter:none}
.btn{position:relative;isolation:isolate;transition:background-color var(--motion),box-shadow var(--motion),border-color var(--motion);gap:7px;line-height:1.45;box-sizing:border-box}
@media(hover:hover){.btn:hover{box-shadow:inset 0 1px 12px var(--surface-glow),0 0 12px var(--surface-glow);background-image:linear-gradient(115deg,transparent 25%,#e4c78122 52%,transparent 78%);background-size:200% 100%;animation:button-sheen .75s ease-out 1}}
@keyframes button-sheen{from{background-position:160% 0}to{background-position:-60% 0}}
.btn:active{filter:brightness(1.06)}.actions{gap:10px;flex-wrap:wrap;row-gap:10px}.field{margin-bottom:12px}.form-grid{gap:14px 18px}
#preferencesForm>.actions{margin-block:20px 24px}#preferencesForm+#v4Preferences,.card+.card{margin-top:14px}
.glass-window,dialog{background:var(--glass)!important;backdrop-filter:blur(22px) saturate(125%);border:1px solid var(--glass-border);border-radius:18px;box-shadow:var(--glass-shadow);color:var(--text);opacity:1}
dialog{padding:0;max-height:min(90dvh,1000px);width:min(920px,94vw);overflow:auto}dialog::backdrop{background:#10100d33;backdrop-filter:blur(2px)}
.modal-head,.float-head{position:sticky;top:0;z-index:8;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--glass-border);background:var(--glass);backdrop-filter:blur(18px);cursor:move;touch-action:none}
.modal-head h2,.float-head h2{margin:0;font-size:18px;min-width:0}.modal-body{padding:20px;min-width:0}.modal-foot{padding:0 20px 18px}.modal-foot:empty{display:none}
.window-controls{display:flex;gap:6px;flex:none}.icon-button{width:34px;height:34px;min-width:34px;min-height:34px;padding:6px;border-radius:50%;font-size:18px}.icon-button svg{width:18px;height:18px}.icon-button:focus-visible,.gold-trigger:focus-visible,.profile-tile:focus-visible{outline:3px solid #d4af5c;outline-offset:3px}
.glass-window.minimized>:not(.float-head):not(.window-head),dialog.minimized>:not(.modal-head){display:none!important}.glass-window.minimized{height:auto!important;min-height:0!important;width:260px!important;resize:none!important}/* 0.12.0 — `100vw` INCLUDES THE SCROLLBAR and `inset` does not.
   Reported with a screenshot of the book dialog maximised: a gap down one
   side and the other edge flush against the window. `inset:14px` already
   fixes both edges; giving a width as well overrode one of them, and
   `100vw - 28px` is wider than the space between them by exactly the
   scrollbar, so the box hung off the far side. In a right-to-left page the
   side that wins is the right one, which is what the screenshot shows.
   `width:auto` lets the two insets decide, so the margin is the same on
   every side whether a scrollbar is there or not — and it is a margin
   rather than nothing: «به نظرم نباید کامل به دیواره بچسبه». */
.glass-window.maximized,dialog.maximized{position:fixed!important;inset:14px!important;transform:none!important;width:auto!important;height:auto!important;max-width:none!important;max-height:none!important}
.quick-panel{padding:0;width:min(650px,94vw);max-height:85dvh;overflow:auto;resize:both;min-width:280px;min-height:110px}.quick-panel>textarea,.quick-panel>button,.quick-panel>#quickAnswer{margin:16px;width:calc(100% - 32px)}.quick-panel>button{width:auto}.quick-panel .paper{min-height:0}.scroll-top{position:sticky;bottom:10px;margin-inline-start:12px;z-index:8;float:left}
.selection-tools{gap:7px;max-width:calc(100vw - 24px);padding:8px;backdrop-filter:blur(18px)}.selection-tools .float-handle{cursor:move;touch-action:none}.selection-tools.minimized>[data-action]{display:none}.selection-tools .selection-restore{display:none}.selection-tools.minimized .selection-restore{display:inline-flex}
.profile-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:12px 6px;margin:12px 0}.profile-tile{appearance:none;position:relative;display:flex;flex-direction:column;gap:9px;min-width:0;min-height:132px;padding:16px;border:1px solid var(--glass-border);border-radius:14px;background:var(--glass);text-align:right;color:inherit;font:inherit;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s;transform-origin:center}
.profile-tile b{font-size:15px}.profile-tile small{font-size:12px;line-height:1.9;color:var(--muted)}.profile-tile[aria-checked=true]{transform:scale(1.025);background:linear-gradient(135deg,#cba34b30,#f4d88313);border:2px solid #bf953c;box-shadow:0 5px 18px #b58a2525}.profile-tile[aria-checked=true]::after{content:'✓';position:absolute;top:10px;left:10px;color:var(--gold)}
.profile-cost{margin-top:auto;font-size:11px;color:var(--gold)}.profile-setup-notice{padding:12px 14px;border-radius:10px;background:#c4983220;border:1px solid var(--glass-border)}.profile-model-preview{margin-top:18px}.profile-editor .actions{margin-block:14px}
.gold-select{display:inline-flex;min-width:0;position:relative;max-width:100%}.gold-select select{position:absolute!important;opacity:0;pointer-events:none;width:1px!important;height:1px!important}.gold-trigger{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;min-height:38px;padding:8px 12px;background:var(--glass);border:1px solid var(--glass-border);border-radius:10px;color:inherit;font:inherit;font-size:13px;cursor:pointer}.gold-trigger::after{content:'⌄';color:var(--gold)}.field>.gold-select{display:flex;width:100%}
.gold-options{position:fixed;z-index:10000;max-height:300px;overflow:auto;padding:6px;background:var(--glass);backdrop-filter:blur(22px);border:1px solid var(--glass-border);border-radius:12px;box-shadow:var(--glass-shadow);min-width:170px;direction:rtl}.gold-option{display:block;width:100%;border:0;background:transparent;color:inherit;text-align:right;font:inherit;font-size:13px;padding:10px;border-radius:7px;cursor:pointer}.gold-option[aria-selected=true]{background:linear-gradient(100deg,#cba64e,#e8ca80);color:#282015;font-weight:600}.gold-option:hover,.gold-option:focus-visible{outline:none;background:#c9a34b30}.gold-option[aria-selected=true]:hover{background:#ddbb6c}
/* 0.13.2 — THE READING ROUTE NO LONGER WEARS A DIFFERENT BAR.

   «در بخش میز مطالعه این بخش ایکون و ارتفاع بالای صفحه با بخش های دیگه متفاوته انگار فونتش
   کوچک تره … دقت کن ارتفاع نوار بالا و فونت bookylens در همه بخش ها باید در هدر یکسان باشه»

   The name never shrank. The BAR did: 58px everywhere and 48px here, with
   tighter padding, so the same wordmark sat in less room and read as smaller.
   Two bars is the fault, not either height.

   «از میز مطالعه کم نکن از صفحات دیگه کم کن و همه صفحات رو مطابق میز مطالعه کن» — so the
   48px the desk had is now the one height, `--topbar-h` is set once in
   style.css, and this file overrides NOTHING about the bar. The other routes
   give up 10px; the desk keeps the room it had.

   The tagline goes with it: «نوشته زیرش کتابخانه و ترجمه فارسی حذف بشه که
   فضا بیشتر به نوشته لوگو اختصاص پیدا کنه», and «فقط از هدر داخل پورتال کافیه» —
   so it is hidden in the portal header ONLY. The sign-in screen keeps its
   copy, and an administrator's site-branding tagline keeps working wherever
   else it is shown. */
.topbar .brand small{display:none}
/* 0.13.0 — «در بخش میز مطالعه این متن وجود نداره». It was hidden here to keep
   the reading bar at 48px, and the bar is worth keeping short — but the
   tagline is what tells a reader whose program this is, and it went missing
   on the one screen they spend all their time in. Shown at a smaller size
   instead of removed: wordmark 19px + tagline 11px + 8px padding is 38px,
   which still fits the 48px bar with room to spare. *//* 0.12.2 — «نوشتش خیلی چسبیده به کانتر بالایی». The reading route wears a
   48px bar to give the page more room, and the heading under it had 6px
   of air, which reads as touching. Ten more pixels costs a line of
   nothing and lets the title sit under the bar rather than against it. */
.reading .content{padding:16px 10px 6px}.reading .page-head{display:flex;align-items:center;gap:12px;margin-bottom:6px}.reading .page-head h1{font-size:15px}.reading .page-head p{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:55vw}
.reading #main>.card:has(#readingLayout){padding:5px 8px;margin:4px 0}.reading-tools{gap:6px;margin:4px 0}.reading-tools .btn,.reading-tools summary{min-height:32px;padding:5px 9px;font-size:12px}.reading .page-profile-bar{gap:7px;padding:5px 8px;margin:0 0 5px;flex-wrap:wrap}.page-profile-bar .btn{min-height:32px;font-size:12px}.page-profile-bar .model-status{max-width:270px;overflow:hidden;text-overflow:ellipsis}
.reader-window{position:relative;isolation:isolate}.window-head.compact-head{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:5px 7px!important}.window-head h2{font-size:13px;margin:0;white-space:nowrap;display:flex;gap:6px;align-items:center}.window-head .badge{font-size:10px;padding:4px}.window-head>.pane-nav{flex:1 1 auto;width:auto;min-width:0;max-width:100%;padding:0!important;justify-content:flex-end}.pane-nav{gap:4px!important}.pane-nav .btn{min-height:30px;padding:4px 6px;font-size:12px}.pane-nav input{width:43px!important;height:30px;min-height:30px}.pane-nav .zoom-percent{min-width:28px;font-size:10px}.pane-nav .btn svg{width:14px;height:14px}.pane-nav .btn[data-action=zoomActual]{display:none}
#translationActions{gap:6px;flex-wrap:nowrap}#translationActions .quick-export{width:116px;flex:0 0 116px}#translationActions .quick-export>summary{height:32px;box-sizing:border-box;padding:5px 8px;font-size:12px;white-space:nowrap}#translationActions [data-action=retranslate]{display:none}.pane-controls{display:flex;gap:3px;margin-inline-start:auto}.pane-controls .icon-button{width:28px;height:28px;min-height:28px;min-width:28px;padding:4px}.pane-controls [data-window=minimize],.pane-controls [data-window=maximize]{display:none}
.reader-window.floating{position:fixed!important;z-index:150;resize:both;overflow:hidden;min-width:300px;min-height:160px;box-shadow:var(--glass-shadow);border:1px solid var(--glass-border);border-radius:16px}.reader-window.floating .window-head{cursor:move;touch-action:none;background:var(--glass);backdrop-filter:blur(20px)}.reader-window.floating .pane-controls [data-window]{display:inline-flex}.reader-window.minimized .pane-nav,.reader-window.minimized #translationActions{display:none!important}.reader-window.minimized .paper-wrap,.reader-window.minimized .source-viewport{display:none!important}.pane-placeholder{border:1px dashed var(--glass-border);border-radius:14px;padding:25px;display:grid;place-items:center;text-align:center;min-width:0;color:var(--muted)}
.paper-wrap.retranslating::before,.paper-wrap.retranslating::after{display:none!important}.retranslation-veil{position:absolute;pointer-events:none;z-index:5;overflow:hidden;background:#d3b2630b;border:1px solid #d8b65c55;border-radius:0 0 12px 12px}.retranslation-veil::before{content:'';position:absolute;inset:-100%;background:linear-gradient(115deg,transparent 38%,#cbaa5210 44%,#e7d29628 50%,#cbaa5210 56%,transparent 62%);animation:reader-sheen 3.5s linear infinite}.retranslation-veil::after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 24px #caa14918}
:root[data-theme=light] .retranslation-veil{background:#bb882809;border-color:#af802976}:root[data-theme=light] .retranslation-veil::before{background:linear-gradient(115deg,transparent 38%,#b88b3c18 44%,#d3ad5750 50%,#b88b3c18 56%,transparent 62%)}
@keyframes reader-sheen{from{transform:translateX(-35%)}to{transform:translateX(35%)}}
.translation-wait{min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;color:var(--paper-note)}.waiting-book{width:58px;height:48px;border:2px solid var(--gold);border-radius:8px;position:relative;box-shadow:0 8px 24px #c5a24a20}.waiting-book::after{content:'';position:absolute;inset:4px 48% 4px 4px;border-inline-end:2px solid var(--gold);transform-origin:right;animation:page-breathe 1.8s ease-in-out infinite}.translation-wait p{font-size:14px;text-align:center}.wait-skeleton{width:65%;height:5px;border-radius:3px;background:#bc9b4324;animation:page-breathe 1.8s ease-in-out infinite}@keyframes page-breathe{50%{opacity:.4;transform:scaleX(.85)}}
.diff-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}.diff-pair .paper{width:100%!important;min-height:0;padding:12px;font-size:16px}.diff-old,.diff-new{min-width:0;border-inline-start:3px solid #c8625e;padding:8px}.diff-new{border-color:#62a475}.diff-pair .katex,.diff-pair .math-block{text-decoration:none}.version-diff del,.version-diff ins{text-decoration:none}.reference-source,[data-original-language]{direction:ltr!important;text-align:left!important;unicode-bidi:isolate}
.auth-card{width:min(1020px,94vw);grid-template-columns:1fr 1fr;border:1px solid var(--glass-border);border-radius:24px;overflow:hidden;box-shadow:var(--glass-shadow);background:var(--glass);backdrop-filter:blur(26px)}.auth-brand{background:radial-gradient(ellipse at 20% 20%,#ddba6133,transparent 70%);padding:38px;display:flex;flex-direction:column;justify-content:center}.auth-form{padding:38px}.auth-brand h2{font-size:23px}.auth-brand p{line-height:2;color:var(--muted)}.auth-brand .btn{margin-top:12px}.google-signin{width:100%;min-height:44px}.auth-divider{border-top:1px solid var(--glass-border);margin:22px 0}.auth-logo{width:60px;height:60px;object-fit:contain}.brand-logo{width:34px;height:34px;object-fit:contain}.site-preview{padding:18px;background:var(--glass);border:1px solid var(--glass-border);border-radius:12px}.site-preview img{width:48px;height:48px;object-fit:contain}.credit-only[hidden]{display:none!important}
/* 0.13.28 — THE READING TOOLBAR WRAPS AT EVERY DESKTOP WIDTH TOO.
   `.reading .reading-tools{flex-wrap:nowrap}` used to live in the block below,
   and between 1200px and about 1440px that row is wider than the content column
   it sits in: measured at 1400px it needed 1158px in 1120px, at 1200px 1158px in
   920px. A `nowrap` flex row in an RTL page puts the overflow past the START
   edge, so the controls at the end of the declared order were drawn at NEGATIVE
   x — «بیشتر» at x=-28 of 47px at 1400px, and at 1200px «بیشتر», «بازگشت به محل
   مطالعه» and «پژوهش و مطالعه» all off the page, with `elementFromPoint` at their
   centres returning nothing. The page's own horizontal scrollbar was always about
   10px short of the spill, so scrolling the desk sideways did not reach them
   either. The row had no `overflow-x` of its own above 700px, so there was nothing
   to scroll: `nowrap` here was a promise of a single line that the row could not
   keep.
   The row already wraps at 1190px and at every width below it, and wrapping is
   what it does again here — one rule removed rather than a scrolling affordance
   added, because a toolbar the reader has to drag sideways with a mouse is worse
   than a toolbar on two lines, and the 1190px behaviour is the one nobody has
   reported. The `flex-shrink:0` below stays: wrapping is how the row grows, not
   squeezing the buttons. */
@media(min-width:1200px){.window-head.compact-head{flex-wrap:nowrap}.window-head h2 .badge{max-width:80px;overflow:hidden;text-overflow:ellipsis}.reading-tools>.btn{flex-shrink:0}}
@media(max-width:1100px){.profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pane-nav{overflow:auto}.window-head h2 .badge{max-width:100px;overflow:hidden}.reading-tools{flex-wrap:wrap}}
@media(max-width:700px){dialog{width:100vw;max-width:100vw;max-height:94dvh;margin:auto 0 0;border-radius:22px 22px 0 0}.modal-head{padding:12px 16px;cursor:default}.modal-body{padding:16px}.modal-head .icon-button{width:40px;height:40px}.quick-panel{inset:auto 0 0!important;width:100%!important;max-width:100vw!important;max-height:88dvh;min-width:0;border-radius:22px 22px 0 0;resize:none}.quick-panel .float-head{cursor:default}.profile-grid{gap:12px}.profile-tile{padding:12px;min-height:142px}.profile-tile small{font-size:11px}.reading-tools .btn{min-height:38px}.pane-nav .btn{min-height:36px}.pane-nav input{min-height:36px}.window-head.compact-head{flex-wrap:wrap}.window-head .pane-nav{flex-basis:100%}.selection-tools{left:8px!important;right:8px!important;bottom:8px;transform:none!important;width:auto!important;max-width:none}.selection-tools .btn{min-height:40px}.selection-tools.minimized{left:auto!important;width:auto!important}.auth-card{grid-template-columns:1fr}.auth-brand{padding:24px;order:2}.auth-form{padding:24px}.auth-brand h1{display:none}.diff-pair{grid-template-columns:1fr}.reader-window.floating{inset:6px!important;width:calc(100vw - 12px)!important;height:calc(100dvh - 12px)!important;resize:none}.pane-placeholder{min-height:100px}}
@media(min-width:901px){.window-head.compact-head{height:48px;min-height:48px;box-sizing:border-box;flex-wrap:nowrap!important}.window-head>.pane-nav{flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden;flex:1 1 100px;min-width:80px}.window-head>.pane-nav>*{flex-shrink:0}.window-head h2{flex-shrink:0;font-size:12px}.window-head #translationActions{flex-shrink:0}.window-head .pane-controls{flex-shrink:0}.window-head h2 .badge{max-width:66px;overflow:hidden;text-overflow:ellipsis}.window-head h2 .badge{font-size:9px}}
.auth-form>[data-action=forgot]{margin-top:16px}.modal-body>.actions{margin-block:14px}.pane-nav::-webkit-scrollbar{height:3px}.pane-nav{scrollbar-width:thin}.reference-source{margin-block:8px}
.confirmation-close{position:sticky;top:0;display:flex;justify-content:flex-start;z-index:10;padding:8px;background:var(--glass)}

/* 0.11.45 — «بعضی از کارت های مدل ها فضای خالی زیادی دارن».

   `.profile-grid` is a grid and a grid's default `align-items` is `stretch`,
   so every card in a row is made as tall as the TALLEST card in that row. One
   profile with a long description — «نسبت طلایی ۲» runs to a full paragraph
   while most run to a line or two — therefore leaves its two row-mates with a
   band of nothing under their text, which is exactly what the screenshot
   shows. `start` lets each card be its own height. */
.profile-grid{align-items:start}

/* And the long one is still long. The description is how a reader chooses, so
   it is not thrown away: it is held to eight lines on a card that is merely
   being looked at, and shown in full on the card that is SELECTED — which is
   the moment the detail is actually wanted. With `align-items:start` the row
   does not jump when that happens; only that one card grows downward. */
.profile-tile small{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:8;line-clamp:8;overflow:hidden}
.profile-tile[aria-checked=true] small{display:block;-webkit-line-clamp:none;line-clamp:none;overflow:visible}
/* `display` has to go back to `block` here, not just the clamp to `none`.
   Chromium implements the standard `line-clamp`, which reports its display as
   `flow-root`; with the box still in clamping display the count was kept and
   the selected card stayed at eight lines. Measured, not assumed — the browser
   test counts the lines on both states. */

/* The icon sits on the same line as the name, at the size of the text beside
   it, and inherits `currentColor` like every other icon in the app. */
.profile-head143{display:flex;align-items:center;gap:8px;min-width:0}
.profile-head143 b{min-width:0}
.profile-icon143{width:20px;height:20px;flex:none;color:var(--gold,#bf953c);opacity:.9}
.profile-tile[aria-checked=true] .profile-icon143{opacity:1}
/* The tick of a selected card is drawn at the top-LEFT, and the head row is at
   the top-right; on a narrow card they would meet. */
.profile-tile[aria-checked=true] .profile-head143{padding-left:22px}
@media (prefers-reduced-motion:reduce){.profile-tile{transition:none}}
