:root { color-scheme:light; --canvas:#f6f5f0; --surface:#fffefa; --ink:#20372e; --muted:#758078; --line:#e3e7df; --accent:#2d5b46; --soft:#e9eee5; --danger:#9e4141; font-family:Inter, 'Segoe UI', system-ui, sans-serif; font-size:14px; color:var(--ink); background:var(--canvas); }
* { box-sizing:border-box; } body { margin:0; min-width:300px; } button,input,textarea,select { font:inherit; } a { color:inherit; text-decoration:none; } button { color:inherit; cursor:pointer; background:none; border:0; } button:disabled { opacity:.45; cursor:default; } button:not(:disabled):hover { filter:brightness(.94); } h1,h2,h3,p { margin:0; } [hidden] { display:none !important; } svg { width:20px; height:20px; flex-shrink:0; vertical-align:middle; } :focus-visible { outline:2px solid #6ca486; outline-offset:4px; } h1:focus { outline:0; } .sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; } .skip-link { position:fixed; top:-100px; left:10px; z-index:100; padding:12px; background:var(--surface); } .skip-link:focus { top:10px; }
.sidebar { position:fixed; width:218px; inset:0 auto 0 0; background:#183e30; color:#e6ece4; padding:37px 19px 24px; display:flex; flex-direction:column; z-index:5; } .brand { display:flex; align-items:center; gap:11px; width:fit-content; } .brand span { font-size:27px; font-weight:650; letter-spacing:-1.5px; } .brand svg { width:27px; height:27px; } .sidebar .brand { padding-inline:14px; margin-bottom:66px; } .sidebar nav { display:grid; gap:7px; } .sidebar nav a,.settings-link { display:flex; align-items:center; gap:13px; padding:13px 15px; font-size:13px; color:#bdcec1; border-radius:9px; min-height:46px; } .sidebar nav a[aria-current] { background:#315440; color:#fff; } .sidebar nav a:hover,.settings-link:hover { background:#254b38; } .settings-link { margin-top:auto; }
.workspace { margin-left:218px; } .main-content { max-width:1420px; padding:58px clamp(30px,5vw,82px) 70px; margin:auto; } .mobile-header,.mobile-nav { display:none; } .view-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:36px; } h1 { font:500 clamp(30px,3vw,40px)/1.2 Georgia,'Times New Roman',serif; letter-spacing:-1.3px; } .button { display:inline-flex; gap:8px; align-items:center; justify-content:center; border:1px solid var(--line); background:var(--surface); border-radius:8px; padding:10px 16px; min-height:39px; font-size:12px; font-weight:550; } .button svg { width:16px; height:16px; } .button.primary { background:var(--accent); color:#fff; border-color:var(--accent); } .icon-button { display:inline-grid; place-items:center; width:34px; height:34px; padding:7px; border-radius:7px; flex-shrink:0; } .icon-button:hover { background:#ffffff0d; } .icon-button svg { width:17px; height:17px; }
.continue-card { display:flex; align-items:center; gap:23px; padding:26px 30px; border-radius:13px; background:#e6ecdf; margin-bottom:38px; } .continue-mark { display:grid; place-items:center; width:53px; height:62px; background:#365c45; color:#edf2e8; border-radius:3px 8px 8px 3px; box-shadow:inset 4px 0 #203c2c; } .continue-card>div:nth-child(2) { flex:1; min-width:0; } .eyebrow { color:var(--muted); font-size:9px; font-weight:600; letter-spacing:.11em; line-height:1.5; } .continue-card .eyebrow { color:#54715a; } .continue-card h2 { font:500 21px/1.4 Georgia,serif; margin:5px 0; overflow-wrap:anywhere; } .continue-card p { color:#6b7b6a; font-size:11px; } .library-controls { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:30px; border-bottom:1px solid var(--line); } .tabs { display:flex; gap:24px; } .tabs button { color:var(--muted); padding:13px 1px 16px; font-size:12px; border-bottom:2px solid transparent; } .tabs button.selected { border-color:var(--accent); color:var(--ink); } input,textarea { background:var(--surface); border:1px solid var(--line); padding:11px 13px; border-radius:7px; color:var(--ink); min-width:0; } .library-controls input { width:190px; font-size:11px; margin-bottom:12px; } input::placeholder,textarea::placeholder { color:#98a096; }
.source-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(155px,1fr)); gap:32px 28px; } .source-card { min-width:0; max-width:260px; } .book-cover { display:flex; flex-direction:column; align-items:flex-start; padding:25px 21px 20px 25px; width:100%; aspect-ratio:.72; border-radius:3px 9px 9px 3px; background:#365746; color:#f1efde; text-align:left; box-shadow:inset 7px 0 #0002,2px 5px 9px #1c33201b; position:relative; overflow:hidden; } .book-cover:after { content:''; position:absolute; inset:8px 8px 8px 14px; border:1px solid #f6f0d51f; pointer-events:none; } .cover-emblem { opacity:.6; margin-bottom:auto; } .cover-emblem svg { width:20px; height:20px; } .cover-title { font:22px/1.22 Georgia,serif; overflow-wrap:anywhere; display:-webkit-box; -webkit-line-clamp:5; -webkit-box-orient:vertical; overflow:hidden; margin-block:18px; letter-spacing:-.4px; } .cover-rule { height:1px; width:28px; background:currentColor; opacity:.4; margin-bottom:13px; } .cover-format { font-size:8px; letter-spacing:.16em; opacity:.65; } .cover-1 { background:#93674d; } .cover-2 { background:#3a5368; } .cover-3 { background:#776448; } .cover-4 { background:#69536a; } .source-details h2 { margin-top:16px; font-size:12px; font-weight:550; line-height:1.5; } .text-button { padding:0; text-align:left; font:inherit; line-height:inherit; } .source-meta { display:flex; justify-content:space-between; align-items:center; margin-top:6px; color:var(--muted); font-size:10px; } .source-meta .icon-button { width:26px; height:28px; padding:6px; } .source-meta .icon-button svg { width:13px; height:13px; } .is-starred svg { fill:#c0a563; color:#a18a50; } .remove-book { opacity:0; } .source-card:hover .remove-book,.remove-book:focus-visible { opacity:1; } .empty-state { display:flex; align-items:center; flex-direction:column; gap:22px; padding:90px 20px; border:1px dashed #d1d9cb; border-radius:14px; } .empty-icon { color:#81967a; } .empty-icon svg { width:38px; height:38px; stroke-width:1.2; } .empty-state h2 { font:25px Georgia,serif; }
.is-reading { overflow:hidden; background:#142c23; } .reader-layout { height:100dvh; display:grid; grid-template-rows:39px minmax(0,1fr) 45px; background:#18362a; color:#dce6db; } .reader-top { display:flex; align-items:center; gap:9px; padding:0 12px; background:#153024; border-bottom:1px solid #ffffff08; } .reader-top h1 { flex:1; font:400 11px/1.3 'Segoe UI',sans-serif; letter-spacing:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; opacity:.7; } .reader-top output { font:10px ui-monospace,monospace; color:#aac3ab; font-variant-numeric:tabular-nums; } .reader-top output:before { content:''; display:inline-block; width:4px; height:4px; background:#8aa883; border-radius:50%; margin-right:7px; vertical-align:middle; } .reader-top output[data-paused='true'] { opacity:.4; } .reader-stage { display:flex; overflow:hidden; min-height:0; } .document-viewport { flex:1; min-width:0; overflow:auto; padding:16px 12px 32px; scrollbar-color:#45604a #18362a; overscroll-behavior:contain; } .pdf-sheet { position:relative; background:white; margin:0 auto; box-shadow:0 4px 24px #0004; flex-shrink:0; } .pdf-sheet canvas { display:block; } .textLayer { color:transparent; } .textLayer ::selection { background:#7da37b70; } .text-paper { max-width:830px; padding:48px clamp(25px,6vw,78px); margin:0 auto; background:#fffefa; color:#242b26; font:19px/1.9 Georgia,serif; min-height:100%; box-shadow:0 5px 25px #0003; } .text-paper p { white-space:pre-wrap; overflow-wrap:anywhere; margin-bottom:1.3em; } .text-paper.large-text { font-size:23px; } .reader-bottom { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:0 16px; background:#153024; border-top:1px solid #ffffff0b; } .page-controls { display:flex; align-items:center; gap:4px; font-size:10px; color:#adc0ae; } .page-controls input { width:36px; padding:4px; border:0; background:transparent; color:#dce6db; font-size:10px; text-align:center; appearance:textfield; -moz-appearance:textfield; } .page-controls input::-webkit-inner-spin-button { -webkit-appearance:none; } .reader-tools { display:flex; align-items:center; gap:4px; } .reader-tool { display:flex; align-items:center; gap:7px; padding:8px 11px; font-size:11px; border-radius:6px; color:#d1dfcc; } .reader-tool:hover { background:#ffffff0d; } .reader-tool svg { width:15px; height:15px; }
.tool-panel { width:370px; flex-shrink:0; background:#fafaf5; color:var(--ink); overflow:auto; border-left:1px solid #0002; display:flex; flex-direction:column; } .panel-header { position:sticky; top:0; display:flex; justify-content:space-between; align-items:center; padding:21px 23px; border-bottom:1px solid var(--line); background:#fafaf5; z-index:3; } .panel-header h2 { font-size:15px; font-weight:600; } .panel-header span { display:block; margin-top:5px; font-size:10px; color:var(--muted); } .panel-empty { padding:55px 24px; text-align:center; display:grid; justify-items:center; gap:22px; } .panel-empty>svg { width:31px; height:31px; color:#7e9576; } .panel-empty h3 { font:22px Georgia,serif; } .conversation { flex:1; padding:0 23px; } .message { padding:23px 0; border-bottom:1px solid var(--line); } .message>span { display:block; font-size:10px; font-weight:650; margin-bottom:10px; color:var(--muted); } .message>div { font-size:13px; line-height:1.85; white-space:pre-wrap; overflow-wrap:anywhere; } .message.user>div { font-size:14px; } .message.assistant>span { color:var(--accent); } .citation { font-size:10px; color:var(--muted); margin-top:18px; } .citation summary { cursor:pointer; width:fit-content; } .citation blockquote { font:12px/1.8 Georgia,serif; margin:12px 0; padding-left:14px; border-left:2px solid #b6c8ad; white-space:pre-wrap; } .ask-compose,.note-compose { display:grid; gap:12px; padding:20px 23px 8px; } textarea { width:100%; resize:vertical; line-height:1.7; font-size:13px; } .ask-compose .button,.note-compose .button { justify-self:end; } .consent-line { font-size:9px; color:#858d81; line-height:1.6; padding:9px 23px 17px; } .panel-empty .consent-line { padding:0; } .page-notes { padding:20px 23px; } .page-notes article { padding:18px 0; border-top:1px solid var(--line); } .page-notes p { white-space:pre-wrap; line-height:1.8; font-size:13px; } #note-saved { font-size:11px; color:var(--accent); } .inline-error { color:var(--danger); font-size:12px; line-height:1.7; padding:15px 23px; } .working { color:var(--muted); padding:24px; font-size:12px; } .flashcard { padding:30px 23px; } .flashcard h2 { font:24px/1.5 Georgia,serif; margin:28px 0 36px; overflow-wrap:anywhere; } .card-answer { padding-top:22px; margin-top:20px; border-top:1px solid var(--line); font-size:14px; line-height:1.9; white-space:pre-wrap; } .rating-buttons { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin-top:36px; } .rating-buttons .button { padding-inline:7px; font-size:11px; } .rating-again { color:#a44c4c; } .rating-good { color:#2d6646; } .exam-card { background:var(--surface); border:1px solid var(--line); max-width:760px; border-radius:14px; margin:35px auto; padding:20px; } .count-badge { background:var(--soft); color:var(--accent); border-radius:30px; padding:8px 12px; font-size:11px; }
.notes-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:20px; } .note-card { background:var(--surface); border:1px solid var(--line); padding:24px; border-radius:11px; } .note-card p { white-space:pre-wrap; font:16px/1.85 Georgia,serif; margin:20px 0; overflow-wrap:anywhere; } .note-card>div { display:flex; gap:20px; font-size:11px; color:var(--accent); } .stats-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; } .stats-grid section { padding:28px; background:var(--soft); border-radius:11px; display:grid; gap:19px; } .stats-grid strong { font:38px Georgia,serif; } .stats-grid small { font:14px 'Segoe UI',sans-serif; } .section-heading { font-size:14px; margin-top:45px; font-weight:600; } .session-list { list-style:none; padding:0; margin:20px 0; } .session-list li { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:19px 0; border-bottom:1px solid var(--line); } .session-list li>div { display:grid; gap:6px; } .session-list strong { font-size:12px; font-weight:550; } .session-list span,.session-list b,.quiet-label { color:var(--muted); font-size:10px; font-weight:400; } .settings-section { max-width:650px; padding:25px 0; border-top:1px solid var(--line); } .settings-section h2 { font-size:15px; margin-bottom:18px; } .settings-section p { font-size:12px; line-height:1.8; color:var(--muted); margin:12px 0; } .settings-section .button { margin-right:8px; } .audio-surface { text-align:center; padding:65px 0; } .audio-clock { font:35px ui-monospace,monospace; margin:30px; } .audio-surface audio { display:block; margin:25px auto; max-width:100%; } .audio-surface .button { margin:4px; } .toast { position:fixed; bottom:75px; left:50%; transform:translateX(-50%); max-width:calc(100% - 35px); background:#17372a; color:#fff; border:1px solid #557a60; box-shadow:0 6px 25px #0003; padding:13px 20px; border-radius:9px; font-size:12px; line-height:1.7; z-index:100; } .loading-indicator,.reader-error { color:#b4c4b1; text-align:center; padding:70px 25px; font-size:13px; } .reader-error .button { display:block; margin:25px auto; width:fit-content; }
@media(min-width:1600px) { .source-grid { grid-template-columns:repeat(5,minmax(160px,1fr)); } }
@media(max-width:1000px) { .sidebar { width:190px; padding-inline:14px; } .workspace { margin-left:190px; } .main-content { padding-inline:32px; } .tool-panel { width:340px; } }
@media(max-width:700px) { .sidebar { display:none; } .workspace { margin-left:0; padding-bottom:70px; } .mobile-header { display:flex; justify-content:space-between; align-items:center; height:65px; padding:0 23px; } .mobile-header .brand span { font-size:25px; } .mobile-header>a:last-child { color:var(--muted); } .mobile-nav { display:flex; position:fixed; inset:auto 0 0; padding:6px 12px calc(6px + env(safe-area-inset-bottom)); background:var(--surface); border-top:1px solid var(--line); z-index:8; } .mobile-nav a { flex:1; display:flex; flex-direction:column; align-items:center; gap:5px; color:#8a958a; padding:8px 6px; font-size:10px; } .mobile-nav a[aria-current] { color:var(--accent); } .mobile-nav svg { width:19px; height:19px; } .main-content { padding:27px 23px 35px; } .view-heading { margin-bottom:27px; gap:10px; } .view-heading h1 { font-size:32px; } .button { min-height:40px; padding:9px 12px; } .continue-card { padding:20px; gap:15px; margin-bottom:26px; } .continue-card h2 { font-size:18px; } .continue-mark { display:none; } .continue-card .button { font-size:10px; } .library-controls { gap:14px; margin-bottom:25px; } .tabs { gap:18px; white-space:nowrap; } .library-controls label { flex:1; min-width:0; } .library-controls input { width:100%; font-size:12px; } .source-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px 22px; } .book-cover { padding:22px 17px 18px 23px; } .cover-title { font-size:21px; } .source-details h2 { font-size:12px; } .remove-book { opacity:1; } .empty-state { padding:65px 15px; } .empty-state h2 { font-size:23px; } .reader-layout { grid-template-rows:35px minmax(0,1fr) calc(47px + env(safe-area-inset-bottom)); } .reader-top { padding:0 6px; } .reader-top h1 { font-size:10px; } .reader-bottom { gap:5px; padding:0 7px env(safe-area-inset-bottom); } .page-controls { gap:0; } .page-controls .icon-button { width:25px; } .page-controls input { width:26px; } .reader-tools { gap:0; } .reader-tool { font-size:10px; gap:5px; padding:8px; } .reader-tool svg { width:14px; height:14px; } .document-viewport { padding:6px 0 18px; } .tool-panel { position:absolute; inset:35px 0 calc(47px + env(safe-area-inset-bottom)); width:100%; z-index:10; border:0; } .tool-panel[hidden] { display:none; } .panel-header { padding:20px 24px; } .text-paper { padding:30px 27px; font-size:18px; } input,textarea { font-size:16px; } .ask-compose textarea { font-size:16px; } .stats-grid { grid-template-columns:1fr; gap:11px; } .stats-grid section { display:flex; justify-content:space-between; align-items:center; padding:23px; } .stats-grid strong { font-size:30px; } .exam-card { padding:0; } .notes-grid { grid-template-columns:1fr; } }
@media(prefers-reduced-motion:no-preference) { .button,.book-cover { transition:filter .15s; } }
.continuous-pdf .document-viewport { overflow-anchor:none; }
.continuous-pdf .pdf-sheet { margin-bottom:16px; overflow-anchor:none; }
.continuous-pdf .page-controls .icon-button { display:none; }
.page-error { color:var(--ink); padding:35px 20px; font-size:13px; text-align:center; }
.usage-consent { display:flex; align-items:center; justify-content:space-between; gap:20px; max-width:400px; padding:12px 0; font-size:12px; }
.usage-consent input { accent-color:var(--accent); width:17px; height:17px; }
@media print { .reader-top,.reader-bottom,.tool-panel,.sidebar,.mobile-nav { display:none; } .document-viewport { overflow:visible; } .reader-layout { display:block; height:auto; } }
.exam-launch{background:var(--paper,#fff);border:1px solid var(--line,#dce3dc);padding:clamp(20px,4vw,36px);border-radius:18px}.exam-launch>label{display:block;margin-bottom:10px;font-weight:600}.exam-launch select,.exam-rating select{width:100%;padding:13px 14px;border:1px solid #cbd7ce;border-radius:9px;background:#fff;color:#183f31;font:inherit}.exam-options{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:28px}.exam-options article{background:#f0f4ee;padding:24px;border-radius:12px}.exam-options h2{font-size:34px;margin:16px 0 4px}.exam-options p{margin-bottom:22px}.exam-options small{display:block;margin-top:12px;color:#617468}.exam-book-title{color:#637568;margin:-10px 0 24px}.exam-preparing{text-align:center;background:#fff;padding:48px 24px;border-radius:16px}.exam-preparing progress{display:block;width:min(400px,100%);height:9px;margin:24px auto;accent-color:#245d46}.exam-paper{max-width:900px;margin:auto}.exam-question{padding:28px;background:#fff;border:1px solid #dae2d9;border-radius:14px;margin:0 0 20px}.exam-question>header{display:flex;justify-content:space-between;align-items:center;color:#708073;font-size:13px}.exam-question>header span:first-child{font-size:22px;color:#7c977d}.exam-question h2{font-size:21px;font-weight:500;line-height:1.5;margin:18px 0}.exam-question textarea{width:100%;resize:vertical;min-height:110px;border:1px solid #d4ded3;border-radius:8px;background:#fbfcf9;padding:16px;color:#203b2c;font:inherit;line-height:1.6}.exam-response{border-left:2px solid #cbd8c8;padding-left:16px;margin:24px 0}.exam-model-answer{background:#eff4eb;padding:18px;border-radius:9px}.exam-model-answer p,.exam-response p{white-space:pre-wrap;line-height:1.65}.exam-rating{display:block;margin-top:24px;font-size:14px}.exam-rating select{display:block;max-width:300px;margin-top:10px}.exam-submit-bar{max-width:900px;margin:24px auto 32px;display:flex;align-items:center;gap:18px}.exam-submit-bar span{font-size:13px;color:#637568}.exam-result{padding:28px;background:#e8f0e1;border-radius:14px;margin-bottom:26px}.exam-result strong{font-size:38px}.exam-result p{font-size:18px;margin:8px 0}.exam-result span{font-size:13px;color:#48614a}.exam-history article{display:flex;justify-content:space-between;align-items:center;background:#fff;padding:18px 22px;border-bottom:1px solid #e3e8df;gap:16px}.exam-history article span{display:block;color:#6a7e6d;font-size:13px;margin-top:6px}.exam-history article strong{overflow-wrap:anywhere}.exam-history{margin-top:28px}button:disabled{cursor:not-allowed;opacity:.5}@media(max-width:600px){.exam-options{gap:12px}.exam-options article{padding:18px 14px}.exam-options .eyebrow{font-size:9px}.exam-question{padding:22px 18px}.exam-submit-bar{align-items:flex-start;flex-direction:column}.exam-options .button{width:100%;font-size:13px}.exam-history article{padding:16px 12px}}
.book-cover.has-cover{padding:0;background:#e8e9e2;position:relative;overflow:hidden}.book-cover-image{width:100%;height:100%;position:absolute;inset:0;object-fit:contain;object-position:center;background:#eeeee8}.has-cover .cover-emblem,.has-cover .cover-title,.has-cover .cover-rule,.has-cover .cover-format{visibility:hidden}.book-progress-list{display:grid;gap:16px}.book-progress{background:var(--surface);padding:24px;border:1px solid var(--line);border-radius:14px}.book-progress>header{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:16px}.book-progress h3{font-size:18px;font-weight:500;margin:0 0 7px;overflow-wrap:anywhere}.book-progress>header span{font-size:12px;color:var(--muted)}.book-progress>header>strong{white-space:nowrap;font-size:25px;font-weight:500}.reading-log{border-top:1px solid var(--line);margin-top:16px;padding-top:16px;font-size:12px}.reading-log summary{cursor:pointer;color:var(--accent)}.reading-log article{border-top:1px solid var(--line);padding:14px 0}.reading-log article>header{display:flex;justify-content:space-between;align-items:center}.reading-log dl{display:grid;grid-template-columns:auto 1fr;gap:7px 14px;color:var(--muted)}.reading-log dd{margin:0;overflow-wrap:anywhere}.reading-log ol{padding:10px 0;list-style:none;display:grid;gap:7px}.reading-log li{display:flex;justify-content:space-between;gap:12px;color:var(--muted)}.reading-log time{font-size:10px;overflow-wrap:anywhere}.pace-label{display:block;font-size:11px;color:var(--muted);margin-top:10px}@media(max-width:600px){.book-progress{padding:20px 16px}.book-progress>header>strong{font-size:20px}.book-progress h3{font-size:16px}.reading-log dl{grid-template-columns:1fr;gap:6px}.reading-stats .pace-label{display:none}}
.auth-screen{min-height:100dvh;display:grid;grid-template-rows:auto 1fr;align-items:center;background:radial-gradient(ellipse at 80% 10%,#dce8d7,transparent 65%),#f6f5f0;padding:30px}.auth-brand{color:#244b37}.auth-card{width:min(420px,100%);margin:35px auto 65px;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:34px}.auth-mark{display:block;font-size:28px;color:#4a7856;margin-bottom:22px}.auth-card h1{font-size:30px;margin-bottom:28px}.auth-card form{display:grid;gap:17px}.auth-card label{display:grid;gap:8px;font-size:13px;font-weight:500}.auth-card input{width:100%;padding:13px;border:1px solid #d3dfd0;border-radius:8px;background:#fbfcf8;min-height:46px}.auth-card .primary{width:100%;margin-top:6px}.auth-hint{font-size:11px;color:var(--muted);margin-top:-9px}.auth-switch{font-size:12px;margin-top:24px;text-align:center;color:var(--muted)}.auth-switch button{color:var(--accent);font-weight:600}.period-filter select{border:1px solid var(--line);background:var(--surface);padding:11px 14px;border-radius:9px;color:var(--ink)}.progress-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-bottom:24px}.progress-kpis article{background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:22px 20px}.progress-kpis article>span{display:block;font-size:12px;color:var(--muted)}.progress-kpis strong{display:block;font-size:32px;font-weight:500;letter-spacing:-1.2px;margin:20px 0 12px;white-space:nowrap}.progress-kpis em{font-size:13px;font-style:normal;letter-spacing:0;color:var(--muted)}.progress-kpis small{font-size:11px;color:var(--muted)}.progress-kpis article:first-child{background:#e8efdf}.progress-panel{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:26px;margin-bottom:22px;min-width:0}.progress-panel>header{display:flex;align-items:start;justify-content:space-between;gap:15px;margin-bottom:28px}.progress-panel h2{font-size:17px;font-weight:550;margin:0 0 8px}.progress-panel header span{font-size:11px;color:var(--muted)}.progress-panel>header>strong{font-size:26px;font-weight:500}.trend-plot{position:relative;margin-top:20px}.trend-plot svg{width:100%;height:auto;display:block;overflow:visible}.trend-markers{position:absolute;inset:0}.trend-point{position:absolute;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;padding:0}.trend-point:after{content:'';display:block;width:6px;height:6px;margin:auto;background:#39764e;border-radius:50%;border:2px solid #fff;box-sizing:content-box}.trend-point:hover:after,.trend-point.selected:after{width:9px;height:9px;box-shadow:0 0 0 5px #dce9d4}.trend-axis{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);padding:10px 4px 0}.progress-bottom{display:grid;grid-template-columns:1fr 1fr;gap:22px}.book-bars{display:grid;gap:24px}.book-bars>div>div:first-child{display:flex;justify-content:space-between;font-size:12px;gap:12px;margin-bottom:10px}.book-bars span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.book-bars strong{white-space:nowrap;font-size:11px}.bar-track{height:7px;background:#edf1e7;border-radius:8px}.bar-track span{display:block;height:100%;border-radius:8px;background:#729b71}.recent-books{display:grid;gap:14px}.recent-book{display:flex;align-items:center;width:100%;gap:12px;text-align:left;padding:0}.recent-cover{width:36px;height:48px;background:#e9eedf;border-radius:4px;flex-shrink:0;display:grid;place-items:center;overflow:hidden;color:#6c885e}.recent-cover img{width:100%;height:100%;object-fit:cover}.recent-title{display:grid;gap:6px;flex:1;min-width:0}.recent-title strong{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}.recent-title small{font-size:10px;color:var(--muted)}.chart-empty{font-size:13px;color:var(--muted);padding:24px 0}@media(max-width:1100px){.progress-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.progress-bottom{grid-template-columns:1fr}}@media(max-width:600px){.progress-panel{padding:22px 17px}.progress-kpis{gap:11px}.progress-kpis article{padding:18px 16px}.progress-kpis strong{font-size:29px;margin:15px 0 10px}.auth-screen{padding:24px 20px}.auth-card{padding:28px 24px;margin-top:30px}.auth-card h1{font-size:27px}.trend-axis{font-size:9px}.trend-point{width:24px;height:30px}.reading-trend{overflow:hidden}}

.progress-date{border:0;background:transparent;color:var(--muted);font-size:11px;padding:0;max-width:140px}

.reading-status { font:10px/1.2 "Segoe UI",sans-serif; color:#b9cdb7; white-space:nowrap; } .reading-status[data-state="paused"] { color:#d1b88d; } .reading-status[data-state="checking"] { color:#c7c7a1; } .ask-suggestions { display:flex; flex-wrap:wrap; gap:6px; padding:10px 16px; } .ask-suggestions .button { font-size:11px; min-height:32px; padding:6px 9px; }

/* Floating reader tools and detached, space-preserving panel. */
.reader-layout { grid-template-rows:39px minmax(0,1fr); }
.reader-stage { position:relative; }
.document-viewport { padding:18px 78px 30px 18px; transition:margin .18s ease; }
.reader-tools { position:absolute; right:14px; bottom:22px; display:flex; flex-direction:column; gap:9px; z-index:12; }
.reader-tool { width:48px; height:48px; justify-content:center; padding:0; border-radius:50%; background:#244a39ed; color:#e7efdf; box-shadow:0 5px 18px #0003; border:1px solid #b8d2b329; backdrop-filter:blur(14px); }
.reader-tool:hover { background:#376448; transform:translateY(-1px); }
.reader-tool svg { width:19px; height:19px; }
.reader-tool span { position:absolute; right:58px; white-space:nowrap; padding:5px 8px; border-radius:6px; background:#153024; opacity:0; pointer-events:none; font-size:11px; }
.reader-tool:hover span,.reader-tool:focus-visible span { opacity:1; }
.tool-panel { position:absolute; inset:16px 78px 16px auto; width:380px; max-width:calc(100% - 100px); border:0; border-radius:20px; box-shadow:0 14px 45px #06170d35; background:#fafbf6f5; backdrop-filter:blur(20px); z-index:11; overflow:auto; }
.tool-panel[hidden] { display:none; }
.reader-stage.has-panel .document-viewport { margin-right:410px; padding-right:18px; }
.reader-top .page-controls { gap:2px; }
.reader-top .page-controls input { width:28px; }
.compose-actions { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.dictate-button { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:38px; padding:8px 10px; border-radius:22px; background:#edf2e7; color:#45634b; font-size:11px; }
.dictate-button svg { width:17px; height:17px; }
.dictate-button.recording { background:#f6e3dd; color:#a13b30; }
.dictation-consent { font-size:10px; color:var(--muted); line-height:1.5; }
.library-tutor { max-width:780px; margin:0 auto 36px; padding:22px 24px 17px; border:1px solid #dce5d4; border-radius:22px; background:linear-gradient(125deg,#f8fbf3,#fffefa); box-shadow:0 5px 24px #2d472607; }
.library-tutor>header { display:flex; align-items:center; gap:10px; margin-bottom:17px; }
.library-tutor h2 { font-size:16px; font-weight:550; margin:0; }
.tutor-spark { color:#447354; display:flex; }
.tutor-spark svg { width:20px; height:20px; }
.tutor-presence { margin-left:auto; font-size:10px; color:var(--muted); }
.library-tutor textarea { border:0; background:transparent; padding:4px 0 10px; resize:vertical; min-height:62px; font-size:15px; }
.library-tutor textarea:focus { outline:none; box-shadow:none; }
.library-tutor form { border:1px solid #dbe4d5; border-radius:15px; padding:12px; background:#fffefa; }
.tutor-prompts { display:flex; flex-wrap:wrap; gap:16px; margin-top:16px; font-size:11px; color:#547255; }
.tutor-consent { margin:13px 0 0; font-size:10px; color:#7c8978; line-height:1.5; }
.library-conversation { max-height:360px; overflow:auto; margin:0 -8px 16px; padding:0 8px; }
.library-conversation .message { padding:13px 0; font-size:13px; line-height:1.8; }
.library-conversation .message>div { white-space:pre-wrap; }
.library-conversation .message>span { display:block; font-size:10px; text-transform:uppercase; letter-spacing:.06em; color:#698066; margin-bottom:5px; }
@media(max-width:900px) {
 .reader-layout { grid-template-rows:39px minmax(0,1fr); }
 .document-viewport { padding:10px 70px 20px 10px; }
 .reader-tools { right:11px; bottom:20px; }
 .reader-tool { width:44px; height:44px; }
 .tool-panel { inset:auto 12px 12px; width:auto; max-width:none; height:min(48dvh,420px); border-radius:20px; }
 .reader-stage.has-panel .document-viewport { margin-right:0; margin-bottom:calc(min(48dvh,420px) + 24px); padding-right:70px; }
 .reader-stage.has-panel .reader-tools { bottom:calc(min(48dvh,420px) + 36px); }
 .panel-header { padding:16px 20px; }
 .library-tutor { padding:18px 16px 15px; margin-bottom:28px; }
 .library-tutor textarea { font-size:16px; }
}
@media print { .reader-tools { display:none; } }

.chat-page-heading { margin-bottom:22px; }
.study-chat-layout { display:grid; grid-template-columns:215px minmax(0,1fr); min-height:calc(100dvh - 195px); border:1px solid #dce4d6; border-radius:20px; background:#fcfdf8; overflow:hidden; }
.chat-sidebar { background:#eef2e8; padding:22px 10px; border-right:1px solid #dde5d6; min-width:0; }
.chat-sidebar-label { display:block; padding:0 10px 18px; font-size:9px; letter-spacing:.14em; color:#6d8064; }
.chat-sidebar-toggle { display:none; }
.chat-folders { max-height:calc(100dvh - 245px); overflow:auto; }
.chat-folders details { padding:0 0 10px; }
.chat-folders summary { display:flex; align-items:center; gap:8px; cursor:pointer; padding:10px; border-radius:8px; font-size:12px; list-style:none; }
.chat-folders summary::-webkit-details-marker { display:none; }
.chat-folders summary svg { width:16px; height:16px; flex-shrink:0; color:#66845e; }
.chat-folders summary span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex:1; }
.chat-folders summary small { color:#8b9984; }
.saved-chat,.chat-new-in-book { display:block; width:calc(100% - 14px); margin-left:14px; text-align:left; border-radius:7px; padding:9px 10px; font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.saved-chat.selected { background:#dfe9d5; color:#284e37; }
.saved-chat:hover,.chat-new-in-book:hover { background:#e4ebdc; }
.chat-new-in-book { color:#6e8665; }
.chat-main { display:flex; flex-direction:column; min-width:0; padding:20px 26px 14px; }
.chat-main>header { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:12px; }
.chat-main>header>div { display:grid; gap:5px; min-width:0; }
.chat-main>header strong { font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.chat-main>header span { font-size:10px; color:var(--muted); }
.chat-main select { max-width:180px; font-size:11px; padding:8px; border:1px solid #e0e6d9; border-radius:8px; background:#f8faf3; }
.study-messages { flex:1; min-height:230px; max-height:calc(100dvh - 405px); overflow:auto; padding:8px 4px; }
.study-messages .message { padding:16px 5px; font-size:13px; line-height:1.9; }
.study-messages .message>span { display:block; font-size:10px; color:#76906d; margin-bottom:7px; }
.study-messages .message>div { white-space:pre-wrap; overflow-wrap:anywhere; }
.study-messages .message.user { padding:13px 17px; margin:12px 0; background:#eef3e6; border-radius:14px; }
.chat-welcome { display:grid; place-items:center; text-align:center; padding:42px 0; }
.chat-welcome>svg { width:28px; height:28px; color:#77966a; }
.chat-welcome h2 { font:26px Georgia,serif; margin:24px 0; }
.chat-welcome>div { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; }
.chat-welcome .button { font-size:11px; padding:8px 10px; }
.study-chat-compose { padding:12px; border:1px solid #d6e0cb; border-radius:16px; background:#fffefa; margin-top:16px; }
.study-chat-compose textarea { border:0; background:transparent; padding:5px 2px; resize:vertical; min-height:58px; }
.study-chat-compose textarea:focus { outline:none; box-shadow:none; }
.chat-consent { display:block; margin-top:9px; font-size:9px; line-height:1.5; color:#8a9483; }
.chat-error { font-size:12px; color:var(--danger); padding:8px; }
.library-tutor>header .text-button { margin-left:auto; font-size:11px; color:#5c7e52; }
@media(max-width:1000px) { .study-chat-layout { grid-template-columns:175px minmax(0,1fr); } .chat-main { padding-inline:18px; } }
@media(max-width:700px) {
 .main-content:has(.study-chat-layout) { padding:20px 14px; }
 .study-chat-layout { display:flex; flex-direction:column; min-height:calc(100dvh - 215px); }
 .chat-sidebar { padding:0; border:0; border-bottom:1px solid #dde5d6; }
 .chat-sidebar-toggle { display:block; padding:13px 17px; font-size:11px; width:100%; text-align:left; }
 .chat-folders { display:none; max-height:250px; padding:12px; }
 .chat-sidebar.is-open .chat-folders { display:block; }
 .chat-main { padding:17px 14px 12px; flex:1; }
 .chat-main>header { gap:8px; }
 .chat-main>header select { max-width:135px; }
 .study-messages { min-height:160px; max-height:calc(100dvh - 445px); }
 .chat-welcome { padding:18px 0; }
 .chat-welcome h2 { font-size:23px; margin:18px 0; }
 .chat-page-heading h1 { font-size:28px; }
 .chat-page-heading .button { font-size:11px; }
 .study-chat-compose textarea { font-size:16px; }
 .mobile-nav a { font-size:9px; padding-inline:2px; }
 .mobile-nav a[href="#/ask"] svg { color:#527946; }
}

.study-messages pre { white-space:pre-wrap; overflow-wrap:anywhere; padding:14px; background:#edf1e8; border-radius:10px; font:12px/1.8 ui-monospace,monospace; } .study-messages code { font:12px/1.8 ui-monospace,monospace; background:#edf1e8; border-radius:4px; padding:2px 4px; } .study-messages pre code { padding:0; }

.message.assistant .katex { font-size:1.1em; } .message.assistant .katex-display { overflow-x:auto; overflow-y:hidden; padding:10px 2px; margin:12px 0; white-space:normal; } .message.assistant .katex-html { white-space:nowrap; }