/* Fonts: the pages link /fonts/fonts.css (self-hosted Be Vietnam Pro and Noto Serif). */
:root{font-family:'Be Vietnam Pro',sans-serif;color:#282a27;background:#f7f7f2;font-size:14px;--red:#a44636;--line:#e4e4dc;--muted:#686961}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:4px}button,a{cursor:pointer}button{border:1px solid var(--line);background:white;color:inherit;border-radius:7px;padding:11px 16px;font-weight:500}button:hover{border-color:#aaa99d;background:#fafaf6}button:disabled{opacity:.5;cursor:wait}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}h1,h2,.serif{font-family:'Noto Serif',serif}h1{font-size:34px;font-weight:500;letter-spacing:-1.1px}h2{font-size:21px;font-weight:500}h3{font-size:15px}small,.muted{color:var(--muted)}svg{width:19px;height:19px;vertical-align:middle;flex-shrink:0}.shell{display:grid;grid-template-columns:238px 1fr;min-height:100vh}.sidebar{background:#f0f0e9;border-right:1px solid var(--line);padding:32px 21px;display:flex;flex-direction:column;position:fixed;width:238px;height:100vh}.brand{display:flex;gap:12px;align-items:center;margin:0 9px 46px}.brand img{width:38px}.brand strong{font:600 23px 'Noto Serif',serif}.brand small{font-size:12px;display:block;letter-spacing:2px;margin-top:5px}.nav-label{font-size:12px;letter-spacing:1.7px;color:#686962;margin:0 15px 14px}.nav{display:flex;flex-direction:column;gap:6px}.nav button{display:flex;gap:13px;align-items:center;text-align:left;border:0;background:transparent;padding:13px 15px;color:#686b62;font-weight:400}.nav button.active{background:#e7e7dc;color:#30362e;font-weight:600}.nav button.active svg{color:var(--red)}.nav .count{margin-left:auto;background:#e4dfd1;border-radius:4px;padding:2px 6px;font-size:12px}.side-bottom{margin-top:auto}.engine{border:1px solid #dcded1;border-radius:8px;padding:16px;margin-bottom:22px;background:#f5f5ee}.engine p{font-size:12px;line-height:1.7;margin-top:8px;color:#696b60}.dot{display:inline-block;width:6px;height:6px;background:#7e9169;border-radius:100%;margin-right:7px}.profile{border-top:1px solid var(--line);padding:22px 5px 0;display:flex;gap:10px;align-items:center}.avatar{border-radius:50%;background:#e5dece;width:34px;height:34px;display:grid;place-items:center;font-family:serif}.profile small{display:block;margin-top:4px}.main{grid-column:2;min-width:0}.topbar{height:77px;display:flex;align-items:center;justify-content:space-between;padding:0 42px;border-bottom:1px solid var(--line);font-size:12px;color:#686a62;background:#fafaf6}.topbar span b{font-weight:400;color:#41463d;margin-left:11px}.topbar a{display:flex;gap:9px;align-items:center;color:#53594b}.content{max-width:1440px;padding:35px 42px;margin:auto}.page-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.eyebrow{font-size:12px;letter-spacing:2px;color:var(--red);margin-bottom:9px;font-weight:600}.subtitle{color:#686a61;margin-top:10px;font-size:13px;line-height:1.8}.primary{background:var(--red);border-color:var(--red);color:#fff}.primary:hover{background:#913c2f;border-color:#913c2f}.button-row{display:flex;gap:9px;align-items:center}.stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:9px;margin-bottom:28px;background:#fff}.stat{padding:20px 25px;border-right:1px solid var(--line)}.stat:last-child{border:0}.stat-top{display:flex;justify-content:space-between;color:#686b61;font-size:12px}.stat-top svg{color:#999d8b}.stat strong{font:500 30px 'Noto Serif',serif;display:inline-block;margin-top:8px}.stat small{margin-left:10px;font-size:12px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px}.panel{background:#fff;border:1px solid var(--line);border-radius:9px;overflow:hidden}.panel-heading{padding:20px 23px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.panel-heading h2{font-family:inherit;font-size:15px;font-weight:600}.step-label{color:#686b61;font-size:12px}.tabs{display:flex;gap:24px;border-bottom:1px solid var(--line);padding:0 23px}.tabs button{border:0;background:none;border-radius:0;padding:15px 0;color:#686b61;font-size:12px}.tabs button.active{color:var(--red);border-bottom:2px solid var(--red)}.upload-area{padding:22px}.dropzone{border:1px dashed #b9bbad;border-radius:8px;background:#fafbf7;text-align:center;padding:34px 15px;cursor:pointer}.dropzone.drag{border-color:var(--red);background:#f5eee7}.upload-symbol{width:48px;height:48px;border:1px solid #e1e4d8;background:white;margin:0 auto 18px;display:grid;place-items:center;border-radius:12px;color:#6d7861;box-shadow:0 3px 7px #00000004}.upload-symbol svg{width:24px;height:24px}.dropzone strong{font-size:14px;font-weight:500}.dropzone p{font-size:12px;color:#686b60;margin:10px 0 19px}.formats{display:flex;justify-content:center;gap:6px;margin-top:18px}.formats span{font-size:12px;letter-spacing:.5px;border:1px solid #e3e5dc;border-radius:3px;padding:4px 7px;color:#686a60;background:#fff}.selected-file{margin-top:13px;padding:12px;border:1px solid var(--line);display:flex;align-items:center;gap:10px;border-radius:6px;font-size:12px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px;padding:0 23px 22px}label{display:block;font-size:12px;color:#646b5c}input,select,textarea{border:1px solid #dedfd6;border-radius:6px;padding:11px 12px;background:#fff;color:#343d2d;width:100%;margin-top:8px}textarea{resize:vertical;line-height:1.8}.field-wide{grid-column:1/-1}.upload-footer{padding:18px 23px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;background:#fdfdfa}.upload-footer small{font-size:12px}.aside-panel{padding:22px}.aside-panel h3{display:flex;align-items:center;gap:8px;margin-bottom:20px}.aside-panel h3 svg{color:#6f7e5d}.toggle-row{display:flex;justify-content:space-between;gap:12px;margin:20px 0}.toggle-row strong{font-size:12px;font-weight:500;display:block}.toggle-row p{font-size:12px;color:#686a60;line-height:1.8;margin-top:6px}.toggle-row input{width:32px;accent-color:#728260;margin:0;cursor:pointer}.note{background:#f3f5ed;border:1px solid #e9ecdf;border-radius:6px;padding:12px;color:#646c59;font-size:12px;line-height:1.9}.process{border-top:1px solid var(--line);padding-top:22px;margin-top:23px}.process p{display:flex;align-items:center;gap:12px;margin-top:18px;font-size:12px;color:#666b5e}.process i{font-style:normal;font-size:12px;border:1px solid #dde1d4;border-radius:50%;width:23px;height:23px;display:grid;place-items:center}.recent{margin-top:27px}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.section-title h2{font-family:inherit;font-size:16px;font-weight:500}.section-title button{font-size:12px;border:0;background:none;color:#666c5e}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:12px;background:white}th{text-align:left;color:#686b61;font-size:12px;letter-spacing:.5px;font-weight:400;background:#fafbf7}th,td{padding:17px 21px;border-bottom:1px solid #edeee7;white-space:nowrap}td strong{font-weight:500}.file-cell{display:flex;gap:12px;align-items:center}.file-icon{background:#f3eee6;color:#a88762;padding:9px;border-radius:5px}.badge{display:inline-block;padding:5px 9px;border-radius:4px;background:#eef2e7;color:#5f6f4e;font-size:12px}.badge.review{background:#faf0dc;color:#7e6631}.badge.failed{background:#f8e5e3;color:#aa4d42}.empty{padding:30px;color:#656b5d;text-align:center;font-size:13px;line-height:1.8}.footer{display:flex;justify-content:space-between;color:#686b62;font-size:12px;padding:25px 0 0}.editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:20px}.editor-grid textarea{min-height:410px;font-size:16px}.library{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:25px}.book{padding:25px}.book-art{height:165px;background:#e7e8da;display:grid;place-items:center;font:50px 'Noto Serif',serif;color:#7d846d;border-radius:5px;margin-bottom:20px}.book p{margin:12px 0 20px;color:#676a5e}.reader{max-width:790px;margin:25px auto;border-radius:10px;padding:40px;background:#f7efdf}.reader.night{background:#1f2425;color:#d8d9d3}.reader.light{background:white}.reader .prose{font-family:'Noto Serif',serif;line-height:2.1;white-space:pre-wrap;font-size:19px;margin-top:30px}.reader h1{font-size:28px}dialog{border:1px solid var(--line);border-radius:12px;padding:28px;max-width:500px;width:90%;color:#343b2d}dialog::backdrop{background:#18201566}dialog h2{margin-bottom:20px}dialog .button-row{justify-content:flex-end;margin-top:20px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);padding:15px 23px;border-radius:8px;background:#303b2a;color:white;box-shadow:0 8px 30px #0002;max-width:90%;z-index:100}#toast:not(.is-visible){width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;box-shadow:none}.warning{padding:14px;background:#fff4dd;color:#846332;border-radius:6px;line-height:1.7;font-size:12px;margin-top:15px}.hide{display:none!important}.mobile-brand{display:none}@media(min-width:1500px){.content{padding-top:45px}.dropzone{padding:45px 15px}.workspace{grid-template-columns:minmax(0,1fr) 330px}}@media(max-width:1150px){.sidebar{width:205px;padding:26px 14px}.shell{grid-template-columns:205px 1fr}.content{padding:28px 25px}.topbar{padding:0 25px}.workspace{grid-template-columns:minmax(0,1fr) 265px}.stat{padding:16px}.stat small{display:none}}@media(max-width:900px){.workspace{grid-template-columns:1fr}.aside-panel{display:grid;grid-template-columns:1fr 1fr;gap:0 25px}.aside-panel h3{grid-column:1/-1}.process{display:none}.note{grid-column:1/-1}.library{grid-template-columns:1fr 1fr}}@media(max-width:680px){.shell{display:block}.sidebar{position:static;width:100%;height:auto;padding:17px}.brand{margin:0 0 17px}.nav{flex-direction:row;overflow:auto}.nav button{white-space:nowrap;padding:10px;font-size:12px}.nav-label,.nav .count,.side-bottom :is(.engine,.profile){display:none}.shell .sidebar .side-bottom{margin-top:0;padding-top:0}.page-heading h1{overflow-wrap:anywhere}.topbar{height:55px;padding:0 18px}.content{padding:25px 18px}.page-heading{align-items:flex-start;gap:15px}.page-heading h1{font-size:29px}.page-heading .button-row{display:none}.stats{grid-template-columns:1fr 1fr}.stat:nth-child(2){border-right:0}.stat:nth-child(-n+2){border-bottom:1px solid var(--line)}.form-grid,.editor-grid,.library{grid-template-columns:1fr}.upload-footer{gap:10px}.upload-footer small{max-width:120px}.aside-panel{display:block}.reader{padding:24px 18px}.footer{line-height:1.8;gap:20px}.button-row{flex-wrap:wrap}}
.public-shell{min-height:100vh;display:flex;flex-direction:column}.public-header{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:25px max(24px,calc((100vw - 1200px)/2));border-bottom:1px solid var(--line);background:#fafaf6}.public-header .brand{margin:0}.public-header nav{display:flex;align-items:center;gap:24px}.public-header nav a{display:flex;align-items:center;gap:8px}.public-content{width:100%;max-width:1250px;margin:0 auto;padding:48px 25px;flex:1}.public-footer{text-align:center;padding:26px;color:var(--muted);font-size:12px;border-top:1px solid var(--line)}.public-content #request-story-mobile{display:none}.admin-login{max-width:530px;min-height:100vh;min-height:100dvh;margin:0 auto;padding:clamp(24px,8vh,90px) 24px}.login-back{display:inline-block;margin-bottom:24px;color:var(--muted)}.login-card{padding:35px}.login-card h1{font-size:28px}.login-card form{margin-top:28px}.login-card .primary{width:100%;margin-top:20px}@media(max-width:680px){.public-header{padding:20px;flex-wrap:wrap}.public-header nav{width:100%;justify-content:space-between;gap:12px}.public-content{padding:30px 18px}.public-content .page-heading h1{font-size:28px}.login-card{padding:24px}.admin-login{margin:0 auto;padding-top:24px}}
.book-cover,.cover-placeholder{width:100%;aspect-ratio:2/3;height:auto;object-fit:cover;border-radius:7px;margin-bottom:20px;background:#e7e8da}.cover-placeholder{display:flex;flex-direction:column;justify-content:center;gap:15px}.cover-placeholder small{font:12px 'Be Vietnam Pro',sans-serif}.cover-preview{display:block;max-width:160px;max-height:240px;object-fit:contain;margin:15px auto}.upload-cover{display:flex;gap:18px;align-items:center;border-top:1px solid var(--line);padding-top:18px}.upload-cover .book-cover,.upload-cover .book-art{width:84px;height:126px;flex-shrink:0;margin:0;font-size:30px}.upload-cover .book-art small{display:none}.upload-cover button{margin-top:12px}.public-content .library{grid-template-columns:repeat(2,minmax(0,1fr))}.public-content .book{display:grid;grid-template-columns:42% minmax(0,1fr);column-gap:22px;padding:0;align-content:center;overflow:hidden}.public-content .book .book-cover,.public-content .book .book-art{grid-column:1;grid-row:1/6;margin:0;height:100%;min-height:290px;border-radius:0}.public-content .book>small{margin-top:24px}.public-content .book>button{justify-self:start;align-self:start;margin:0 18px 24px 0}.public-content .book h2{font-size:21px;padding-right:18px;overflow-wrap:anywhere}.public-content .book p{padding-right:18px}@media(max-width:900px){.public-content .library{grid-template-columns:1fr}}@media(max-width:420px){.public-content .book{column-gap:14px}.public-content .book h2{font-size:18px}.public-content .book .book-cover,.public-content .book .book-art{min-height:250px}}
/* Artwork supplied by the site owner, kept intact behind readable content. */
:root{min-height:100%;background:#ece9d9 url('/background.jpg') center top / cover fixed no-repeat;background-image:url('/background.jpg');background-image:image-set(url('/background.avif') type('image/avif'),url('/background.webp') type('image/webp'),url('/background.jpg') type('image/jpeg'))}body{min-height:100vh;min-height:100dvh;background:transparent;display:flow-root}#app{min-height:100vh;min-height:100dvh;display:flow-root}.public-header,.topbar{background:rgba(250,249,241,.91);backdrop-filter:blur(8px)}.sidebar{background:rgba(240,240,229,.94)}.public-content{margin-top:clamp(100px,20vw,260px);margin-bottom:36px;background:#faf9f2;border:1px solid #dedecb;border-radius:18px;box-shadow:0 15px 55px #273c2520}.content{background:rgba(248,248,241,.93);min-height:calc(100vh - 77px)}.public-footer{background:rgba(250,249,242,.92);color:#59634d}.login-card{background:rgba(255,255,249,.96);box-shadow:0 15px 55px #273c2520}.login-back{background:#faf9f0eb;padding:10px 15px;border-radius:8px;color:#46543c}.reader{background:#f7efdf}.reader.night{background:#1f2425}.reader.light{background:#fff}@media(max-width:600px){:root{background-image:url('/background-phone.jpg');background-image:image-set(url('/background-phone.avif') type('image/avif'),url('/background-phone.webp') type('image/webp'),url('/background-phone.jpg') type('image/jpeg'))}}@media(max-width:680px){:root{background-size:cover;background-position:60% top}.public-content{width:calc(100% - 24px);margin-top:160px;padding:25px 16px}.public-header{background:#faf9f0ef}}
.pdf-parts{max-height:45vh;overflow:auto;padding:0;list-style:none;margin-top:18px}.pdf-parts li{display:flex;justify-content:space-between;padding:10px 12px;border-bottom:1px solid var(--line);font-size:13px}.pdf-parts span{color:var(--muted)}.upload-footer{flex-wrap:wrap}.upload-footer small{flex:1 1 180px}
.danger{color:#a03c32;border-color:#e4c3bd}.danger:hover{background:#fff0ec;border-color:#b96659}.confirm-check{display:flex;align-items:center;gap:10px;margin-top:22px;line-height:1.7}.confirm-check input{width:auto;margin:0;flex-shrink:0}.chapter-admin-list{max-height:50vh;overflow:auto}.chapter-admin-list>div{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid var(--line)}.reader-pdf{width:100%;height:70vh;min-height:360px;border:1px solid var(--line);border-radius:8px;margin-top:20px;background:white}.public-content .book{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}.public-content .book-cover{transition:filter .3s ease}.public-shell button,.public-header a{transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease,color .2s ease}.public-content .book:focus-within{border-color:#869575;box-shadow:0 8px 25px #32412720}.public-shell button:focus-visible,.public-header a:focus-visible{outline:3px solid #536b43;outline-offset:4px}@media(hover:hover) and (pointer:fine){.public-content .book:hover{transform:translateY(-6px);border-color:#a2ac8d;box-shadow:0 16px 32px #32412724}.public-content .book:hover .book-cover{filter:brightness(1.06) saturate(1.08)}.public-shell button:hover{transform:translateY(-2px);box-shadow:0 5px 12px #26352424}.public-header a:hover{color:var(--red)}}@media(prefers-reduced-motion:reduce){.public-content .book,.public-content .book-cover,.public-shell button,.public-header a{transition:none!important;transform:none!important}}
/* Reader: one shared column for controls, page and chapter navigation. */
.public-content.read-mode{max-width:980px;margin-top:48px;padding:28px;background:rgba(247,247,239,.97)}.reader-layout{max-width:860px;margin:0 auto}.reader-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px;background:#fffdf8;border:1px solid #e1e3d6;border-radius:14px;box-shadow:0 3px 14px #31422708}.reader-toolbar button{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;height:42px;padding:0;border-radius:10px}.reader-back{gap:9px;padding:0 12px!important;border-color:transparent;background:#edf1e6;color:#52654a;font-size:12px}.reader-options,.reader-control-group,.reader-audio{display:flex;align-items:center;gap:6px}.reader-options{gap:18px}.reader-control-group{padding:4px;border-radius:12px;background:#f3f3ec}.reader-toolbar .reader-icon{width:40px;height:40px;border:1px solid transparent}.reader-icon svg{width:20px;height:20px}.reader-icon.theme-paper{background:#f4e5bf;color:#8a6225}.reader-icon.theme-light{background:#e9f3fa;color:#2f6f91}.reader-icon.theme-night{background:#eae5f5;color:#69528f}.reader-icon[aria-pressed="true"]{border-color:currentColor;box-shadow:inset 0 0 0 1px currentColor}.font-symbol{font-family:'Noto Serif',serif;font-size:17px;font-weight:600}.font-options .reader-icon{background:transparent;color:#4d5b42}.font-value{min-width:25px;text-align:center;font-size:12px;font-weight:600;color:#636c5a;font-variant-numeric:tabular-nums}.reader-icon.listen-icon{background:#e3efe8;color:#327353}.reader-icon.stop-icon{background:#f8e8e3;color:#9d5644}.reader-toolbar button:disabled,.reader-pagination button:disabled{cursor:default;opacity:.35;transform:none!important;box-shadow:none!important}.reader-layout .reader{max-width:none;width:100%;margin:22px 0;border:1px solid #e4ddcb;padding:44px 48px;border-radius:14px;box-shadow:0 8px 28px #2637240a}.reader-layout .reader.night{border-color:#333d3b;background:#222b28;color:#e1e6dd}.reader.night .eyebrow{color:#d3ae77}.reader-layout .reader h1{font-size:28px;line-height:1.5}.reader-layout .prose{margin-top:28px;line-height:2.05;overflow-wrap:anywhere}.reader-pagination{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:0 4px}.reader-pagination button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:42px;min-width:145px;background:#fffdf8;border-radius:10px;font-size:12px}.chapter-position{font-size:16px;font-weight:600;color:#596449;font-variant-numeric:tabular-nums}.chapter-position small{font-size:12px;font-weight:400}@media(max-width:680px){.public-content.read-mode{margin-top:24px;padding:14px;width:calc(100% - 20px)}.reader-toolbar{gap:10px;flex-wrap:wrap;padding:10px}.reader-options{order:3;width:100%;justify-content:space-between;gap:8px;border-top:1px solid #e6e7dc;padding-top:10px}.reader-layout .reader{padding:28px 22px;margin:16px 0}.reader-layout .reader h1{font-size:24px}.reader-pagination{gap:8px}.reader-pagination button{min-width:0;padding:10px;font-size:12px}.reader-back{font-size:12px}.reader-audio{margin-left:auto}}@media(prefers-reduced-motion:reduce){.reader-toolbar button{transition:none}}
@media(max-width:380px){.reader-options{flex-wrap:wrap;justify-content:center}.reader-toolbar .reader-icon{width:36px}.reader-control-group{gap:4px}.font-value{min-width:20px}}

/* Admin workspace: consistent navigation, controls and form alignment. */
.shell .sidebar{overflow-y:auto;background:#f3f3ea;padding:28px 18px;gap:0}
.shell .sidebar .brand{margin:0 10px 32px}.shell .brand small{line-height:1.6;letter-spacing:1.4px}
.shell .nav{gap:5px}.shell .nav button{min-height:44px;border-radius:9px;line-height:1.5;font-size:12px;gap:11px}
.shell .nav button:hover{background:#e9ecdf}.shell .nav button.active{background:#e4e9d9;color:#354730;box-shadow:inset 3px 0 #738363}
.shell .nav button:focus-visible,.shell button:focus-visible{outline:3px solid #536b43;outline-offset:3px}
.shell .side-bottom{padding-top:28px}.shell .engine{margin-bottom:14px;padding:14px}.shell .profile{margin-top:14px;padding-top:16px}.shell .avatar{flex-shrink:0}
.shell .content{background:rgba(248,248,243,.97)}.shell .workspace{align-items:start;grid-template-columns:minmax(0,1fr) 300px}
.shell .workspace>section{min-width:0}.shell .panel{border-radius:12px}.shell .aside-panel h3{line-height:1.5}
.shell .page-heading{gap:20px;align-items:center}.shell .page-heading h1{font-size:30px}.shell .button-row{flex-wrap:wrap}
.shell .form-grid{gap:20px}.shell input:not([type="checkbox"]):not([type="file"]),.shell select{min-height:42px}
.shell .upload-footer{gap:16px;flex-wrap:wrap}.shell .upload-footer>small{flex:1 1 200px;line-height:1.8}
.upload-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.upload-actions button{min-height:42px;white-space:nowrap}
.shell button:disabled{cursor:not-allowed}.shell .formats{flex-wrap:wrap}.shell .dropzone{padding:28px 18px}.shell .dropzone .upload-limit{line-height:1.8;margin-bottom:0}
.language-pair{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 12px;border:1px solid #e3e6d9;border-radius:9px;background:#f8f9f3}
.language-pair small{display:block;font-size:12px;margin-bottom:6px}.language-pair strong{font-size:12px;font-weight:500;white-space:nowrap}.language-pair>svg{width:16px;color:#829176}
.shell .toggle-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:start;margin:0;padding:20px 0;border-bottom:1px solid #eceee5}
.shell .toggle-row strong{line-height:1.6}.shell .toggle-row p{line-height:1.8;margin-top:5px;color:#646c5c}
.feature-status{display:inline-flex;align-items:center;gap:4px;border-radius:20px;background:#edf3e5;color:#557143;padding:4px 7px;font-size:12px;white-space:nowrap;line-height:1.5}.feature-status svg{width:13px;height:13px}
.shell .aside-panel .note{margin-top:18px}.shell .process p{line-height:1.7;align-items:center}.shell .process i{flex-shrink:0}
input[type="checkbox"]{width:18px!important;height:18px;min-width:18px;padding:0;margin:0;flex:0 0 18px;accent-color:#667b50;cursor:pointer}
.confirm-check{align-items:flex-start;color:#4c5546}.confirm-check input{margin-top:3px}.confirm-check:has(input:focus-visible){outline:2px solid #738363;outline-offset:5px;border-radius:4px}
@media(max-width:1150px){.shell .workspace{grid-template-columns:minmax(0,1fr)}.shell .workspace>.aside-panel{width:100%}.shell .content{padding:28px}.shell .stats .stat{padding:18px}.shell .page-heading{flex-wrap:wrap}}
@media(max-width:680px){.shell .sidebar{padding:16px}.shell .sidebar .brand{margin-bottom:18px}.shell .side-bottom{padding-top:16px}.shell .content{padding:22px 16px}.shell .topbar{padding:16px;height:auto;gap:12px;flex-wrap:wrap}.shell .page-heading h1{font-size:25px}.shell .upload-footer{padding:16px}.upload-actions{width:100%}.upload-actions button{flex:1}.shell .form-grid{padding:0 16px 18px}.shell .panel-heading{padding:18px 16px;gap:12px}.shell .step-label{font-size:12px}.shell .language-pair{justify-content:flex-start;gap:22px}}

/* Pointer feedback in the Hoa Tri palette. */
@media(prefers-reduced-motion:no-preference){
 .shell button,.shell .nav button,.dropzone,.stat,.selected-file,.language-pair,.public-header .brand,.login-back{transition:background-color .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease,color .2s ease}
 input,select,textarea{transition:border-color .2s ease,box-shadow .2s ease}
 .shell .nav button svg,.upload-symbol,.book-cover,.cover-placeholder{transition:transform .25s ease,color .2s ease,filter .25s ease}
}
@media(hover:hover) and (pointer:fine){
 .shell button:not(:disabled):hover,.login-card button:not(:disabled):hover{border-color:#a5af95;box-shadow:0 4px 12px #34452c14}
 .shell .primary:not(:disabled):hover,.public-shell .primary:not(:disabled):hover,.login-card .primary:not(:disabled):hover{background:#913d30;border-color:#913d30;box-shadow:0 6px 18px #a446362b}
 .shell .nav button:not(:disabled):hover{background:#e7ecdf;color:#354b2e;box-shadow:inset 3px 0 #8b9a76}
 .shell .nav button:hover svg{color:#69824f}
 .shell .tabs button:hover{background:#f5f6ee;color:var(--red);box-shadow:none}
 .dropzone:hover,.dropzone:focus-visible{border-color:#85996a;background:#f3f7ec;box-shadow:inset 0 0 0 1px #a6b59233,0 6px 20px #526b3310}
 .dropzone:hover .upload-symbol{color:#617d43;border-color:#b9c5a8;box-shadow:0 6px 16px #526b331a}
 .selected-file:hover{border-color:#b7c3a4;background:#fbfcf7}
 .shell .stat:hover{background:#f7f9f1}
 input:not(:disabled):not([type="checkbox"]):hover,select:not(:disabled):hover,textarea:not(:disabled):hover{border-color:#a4b18f}
 .confirm-check:hover{color:#435d32}.confirm-check input:hover{box-shadow:0 0 0 4px #8199651a}
 .public-content .book:hover .book-cover{filter:brightness(1.04) saturate(1.08)}
 .public-header .brand:hover,.login-back:hover{color:#5b7046;box-shadow:0 5px 18px #35472b12}
 .danger:not(:disabled):hover{background:#fff0ec!important;border-color:#b96659!important;box-shadow:0 4px 12px #a03c3214!important}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .shell button:not(:disabled):hover,.login-card button:not(:disabled):hover{transform:translateY(-2px)}
 .shell .nav button:not(:disabled):hover{transform:translateX(3px)}
 .shell .tabs button:hover{transform:none}
 .dropzone:hover .upload-symbol{transform:translateY(-4px) rotate(-4deg)}
 .shell button:not(:disabled):active,.public-shell button:not(:disabled):active,.login-card button:not(:disabled):active{transform:translateY(0);box-shadow:none}
}
input:focus-visible,select:focus-visible,textarea:focus-visible{border-color:#819665;outline:2px solid #819665;outline-offset:2px;box-shadow:0 0 0 4px #81966515}
.chapter-source{margin-top:10px;font-size:12px;color:var(--muted)}.chapter-source a{color:#586f45;text-decoration:underline;text-underline-offset:3px}
@media(prefers-reduced-motion:reduce){.shell button,.dropzone,.upload-symbol,.stat,.selected-file,.language-pair,.login-card button,.public-header .brand,.login-back,input,select,textarea{transition:none!important;transform:none!important}}

.settings-grid{display:grid;grid-template-columns:minmax(0,760px) minmax(260px,360px);gap:22px;align-items:start}.settings-card{padding:28px;display:grid;grid-template-columns:48px 1fr;gap:0 18px;overflow:visible}.settings-card-icon{grid-row:1/3;width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:#f0f3e9;color:#5c6f48}.settings-card-icon svg{width:23px;height:23px}.settings-card form,.key-status,.settings-security{grid-column:1/-1}.key-status{display:grid;grid-template-columns:10px 1fr;gap:3px 10px;align-items:center;margin:25px 0;padding:15px 17px;border:1px solid #dfe6d5;border-radius:10px;background:#f6f8f1}.key-status .dot{grid-row:1/3;margin:0}.key-status small{grid-column:2}.key-status.missing{background:#fff8e9;border-color:#eadcb9}.key-status.missing .dot{background:#ba8847}.secret-field{position:relative}.secret-field input{padding-right:72px}.secret-field button{position:absolute;right:5px;top:13px;padding:6px 12px;border:0;background:transparent;color:#5f6d53;font-size:12px}.settings-card form .button-row{margin-top:18px}.settings-security{display:flex;align-items:center;gap:9px;margin-top:24px;padding-top:20px;border-top:1px solid var(--line);color:#656c5d;font-size:12px;line-height:1.7}.settings-security svg{color:#668054}.settings-session{grid-template-columns:48px 1fr}.settings-session>button{grid-column:1/-1;margin-top:25px}.settings-session h2{margin-top:2px}@media(max-width:1000px){.settings-grid{grid-template-columns:1fr}}@media(max-width:680px){.settings-card{padding:21px}.settings-card form .button-row>*{width:100%}}

/* Library cards: the cover opens the book; genre, title, part count and the action stay visible under it. With a mouse
   the author and the sample note slide over the cover (still read by screen readers); on touch screens they sit below. */
.cover-library{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px 28px}
.cover-book{position:relative;display:flex;flex-direction:column;min-width:0}
.cover-frame{position:relative;aspect-ratio:2/3;border-radius:12px;overflow:hidden;background:#e6e5d6;box-shadow:0 8px 22px #28332224;isolation:isolate}
.cover-trigger{display:block;width:100%;height:100%;padding:0;border:0;border-radius:12px;background:transparent;overflow:hidden}
.cover-trigger .book-cover,.cover-trigger .book-art{width:100%;height:100%;min-height:0;margin:0;aspect-ratio:auto;border-radius:0;object-fit:cover}
.cover-trigger .cover-placeholder{font-size:64px;align-items:center;background:linear-gradient(145deg,#dfe4cd,#bccaa9);color:#2b3922}
.public-shell .cover-trigger:hover{transform:none;box-shadow:none;background:transparent}
.public-shell .cover-trigger:focus-visible{outline:none}
.cover-frame:has(.cover-trigger:focus-visible){outline:3px solid #536b43;outline-offset:4px}
@supports not selector(:has(*)){.public-shell .cover-trigger:focus-visible{outline:3px solid #536b43;outline-offset:-3px}}
.book-caption{padding:14px 2px 0}
.book-genre{display:block;color:#8a3b2e;font-size:12px;font-weight:600;letter-spacing:.04em}
.book-title{margin:4px 0 6px;font:600 17px/1.45 var(--font-ui);color:#283127;overflow-wrap:anywhere}
.book-chapters{display:flex;align-items:center;gap:7px;margin:0;color:#4f5849;font-size:13px}.book-chapters svg{width:16px;height:16px}
.book-reveal{padding:6px 2px 0;color:#4f5849}
.book-reveal p{margin:4px 0;font-size:13px;line-height:1.6;color:#4f5849}
.book-reveal .sample-card-pages{color:#5c4b2e}.book-reveal .sample-card-note{color:#8a3b2e;font-style:italic}
.book-actions{margin-top:auto;padding-top:12px}
.book-actions .primary{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:44px}
.pending-reader-badge{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border:1px solid #d8cfa9;border-radius:999px;background:#f6f0d9;color:#5c4b2e;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.book-pending .book-cover{filter:saturate(.72)}
.review-books{display:grid;gap:14px}.review-book{display:grid;grid-template-columns:72px minmax(0,1fr) auto;align-items:center;gap:20px;padding:18px 20px;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.review-book:hover{transform:translateY(-2px);border-color:#b8c2a5;box-shadow:0 10px 24px #34412e12}.review-book-cover{width:72px;height:92px;overflow:hidden;border-radius:8px;background:#eef0e6;color:#5e6d51;display:grid;place-items:center}.review-book-cover .book-cover{width:100%;height:100%;border-radius:0}.review-book-cover svg{width:28px}.review-book-main{min-width:0}.review-book-main h2{margin:4px 0 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.review-book-counts{display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--muted);font-size:12px}.review-book-counts strong{color:#42503a;font-size:14px}.review-book-counts .has-error,.review-book-counts .has-error strong{color:#a84b40}.review-enter{display:inline-flex;align-items:center;gap:8px;min-height:44px}.review-enter svg{width:18px}.review-section{margin-top:28px}.review-section>.section-title{margin-bottom:12px}.review-section .table-wrap{margin-top:0}.review-queue>.section-title{padding:14px 18px;border:1px solid var(--line);border-radius:10px;background:rgba(250,250,244,.75)}@media(max-width:720px){.review-book{grid-template-columns:54px minmax(0,1fr);gap:14px}.review-book-cover{width:54px;height:72px}.review-enter{grid-column:1/-1;width:100%}.review-book-counts{gap:6px 12px}}
@media(hover:hover) and (pointer:fine) and (min-width:681px){
 .book-reveal{position:absolute;z-index:3;top:0;left:0;right:0;aspect-ratio:2/3;display:flex;flex-direction:column;justify-content:flex-end;padding:60px 18px 18px;border-radius:12px;background:linear-gradient(transparent,rgba(22,32,25,.95) 48%);opacity:0;transform:translateY(10px);pointer-events:none}
 .book-reveal p{color:#e8ece2}.book-reveal .sample-card-pages{color:#f0e2bd}.book-reveal .sample-card-note{color:#f3dfc9}
 .cover-book:hover .book-reveal,.cover-book:focus-within .book-reveal{opacity:1;transform:none}
 .cover-book:hover .cover-frame{box-shadow:0 16px 30px #28332238}
}
@media(prefers-reduced-motion:no-preference){.book-reveal{transition:transform .3s ease,opacity .3s ease}.cover-frame{transition:box-shadow .3s ease}.cover-trigger .book-cover{transition:transform .5s ease}@media(hover:hover) and (pointer:fine){.cover-book:hover .book-cover{transform:scale(1.05)}}}
@media(max-width:1000px){.cover-library{grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 22px}}
@media(max-width:680px){.cover-library{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 14px}.book-caption{padding-top:10px}.book-title{font-size:15px}.book-reveal p,.book-chapters{font-size:12px}.book-actions .primary{padding:10px 12px;font-size:13px}}
@media(max-width:380px){.cover-library{grid-template-columns:1fr;max-width:270px;margin:auto}}

.library-filters{display:flex;flex-direction:column;gap:18px;margin:28px 0 16px}.library-search{position:relative;display:flex;align-items:center;max-width:520px;width:100%}.library-search>svg{position:absolute;left:15px;width:20px;height:20px;color:#7a8c67;pointer-events:none}.library-search input{margin:0;padding:14px 16px 14px 46px;border-radius:12px;background:#fffef9;min-height:48px}.genre-filter{display:flex;flex-wrap:wrap;gap:9px}.genre-filter button{border-radius:24px;padding:9px 17px;background:#f6f7ee;color:#606e52;font-size:12px}.genre-filter button[aria-pressed="true"]{background:#566c43;color:#fff;border-color:#566c43;box-shadow:0 3px 9px #435c3020}.library-result-count{font-size:12px;color:#656c5c;margin:0 0 20px}.cover-book[hidden],#library-no-results[hidden]{display:none!important}@media(max-width:680px){.library-filters{margin-top:22px}.library-search{max-width:none}.genre-filter{gap:8px}.genre-filter button{padding:8px 13px}}


.public-shell{position:relative;isolation:isolate}.home-atmosphere{position:absolute;inset:100px 0 auto;height:360px;overflow:hidden;pointer-events:none;z-index:-1}.drifting-leaf{position:absolute;top:10%;width:38px;height:18px;color:#70865c;opacity:.38;transform:rotate(-25deg)}.mist{position:absolute;width:70%;height:90px;border-radius:50%;background:radial-gradient(ellipse,#fffef58a,transparent 70%);filter:blur(12px);bottom:10px}.mist-two{left:40%;bottom:90px;opacity:.6}
@keyframes bamboo-drift{0%{transform:translate(-35px,-50px) rotate(-25deg);opacity:0}15%{opacity:.45}80%{opacity:.3}100%{transform:translate(100px,350px) rotate(160deg);opacity:0}}
@keyframes mountain-mist{from{transform:translateX(-8%)}to{transform:translateX(12%)}}
@media(prefers-reduced-motion:no-preference){.drifting-leaf{animation:bamboo-drift calc(14s + var(--leaf)*2s) linear infinite;animation-delay:calc(var(--leaf)*-3s)}.mist{animation:mountain-mist 20s ease-in-out infinite alternate}.mist-two{animation-delay:-10s}}
@media(max-width:680px){.home-atmosphere{top:180px;height:200px}.drifting-leaf{width:25px}}

/* Bamboo-inspired native scrollbars. */
html{scroll-padding-top:150px;scrollbar-color:#788c55 #eeeddf;scrollbar-width:auto}
/* Keep detailed bamboo nodes where native WebKit scrollbar styling is supported. */
@supports selector(::-webkit-scrollbar){
 html{scrollbar-color:auto;scrollbar-width:auto}
 ::-webkit-scrollbar{width:14px;height:14px}
 ::-webkit-scrollbar-track{background:#eeeddf;border-left:1px solid #d8ddc7}
 ::-webkit-scrollbar-thumb{border:3px solid #eeeddf;border-radius:12px;background:repeating-linear-gradient(to bottom,transparent 0 29px,#445e34 29px 31px,#b3c48a 31px 33px,transparent 33px 62px),linear-gradient(to right,#546c3e,#9eaf73 45%,#738a50 75%,#506b3b);background-clip:padding-box;min-height:50px}
 ::-webkit-scrollbar-thumb:hover{background:repeating-linear-gradient(to bottom,transparent 0 29px,#354f28 29px 31px,#c4d59d 31px 33px,transparent 33px 62px),linear-gradient(to right,#435e32,#aabd7a 45%,#657f45 75%,#405b2f);background-clip:padding-box}
 ::-webkit-scrollbar-corner{background:#eeeddf}
}
@media(forced-colors:active){html{scrollbar-color:auto}::-webkit-scrollbar-thumb{background:ButtonText}::-webkit-scrollbar-track{background:Canvas}.public-header{background:Canvas}}


/* Consistent professional typography, with Vietnamese-compatible fallbacks. */
:root{--font-ui:'Be Vietnam Pro','Segoe UI',Arial,sans-serif;--font-reading:'Noto Serif','Times New Roman','DejaVu Serif',serif;font-family:var(--font-ui);font-size:14px;line-height:1.6}
button,input,select,textarea{font-family:var(--font-ui);line-height:1.5}
h1,h2,h3,.serif{font-family:var(--font-ui);letter-spacing:normal}
.brand strong,.shell .brand strong{font-family:var(--font-ui);font-size:25px;font-weight:700;line-height:1.35;letter-spacing:-.4px;color:#35432d}
.brand small{font-family:var(--font-ui);font-size:12px;line-height:1.7;letter-spacing:1.3px}
.public-content .page-heading h1,.shell .page-heading h1{font-family:var(--font-ui);font-size:32px;line-height:1.4;font-weight:600;letter-spacing:-.5px}
.page-heading .subtitle{font-size:13px;line-height:1.8}
.login-card h1{font-family:var(--font-ui);font-size:28px;font-weight:600;line-height:1.4;letter-spacing:-.4px}
.reader-layout .reader h1{font-family:var(--font-reading);font-size:30px;font-weight:600;line-height:1.5;letter-spacing:normal}
.reader-layout .prose{font-family:var(--font-reading);line-height:1.9;letter-spacing:normal}
/* A formula wider than the reading column (a long aligned derivation, a wide matrix or table) scrolls sideways on its
   own instead of widening the page. Its padding, taken back by a negative margin so nothing moves, keeps the scripts
   of a first or last row inside the clip. Only here: the PDF fitting measures 2-D math at its full width
   (math-text.js). */
.reader .prose .math-display{max-width:100%;overflow-x:auto;overflow-y:hidden;padding:.3em 0;margin:-.3em 0}
.reader .prose .math-inline>.math-env{max-width:100%;overflow-x:auto;overflow-y:hidden;padding:.3em 0;margin:-.25em .1em}
.shell .nav button{font-size:13px}.shell .aside-panel h3{font-size:15px;line-height:1.6}
@media(max-width:680px){.brand strong,.shell .brand strong{font-size:23px}.header-floating-title{font-size:20px}.public-content .page-heading h1,.shell .page-heading h1{font-size:26px}.reader-layout .reader h1{font-size:26px}.login-card h1{font-size:25px}}

/* Chapter selection and consistent chapter management. */
.reader-chapter-picker{display:flex;align-items:center;gap:8px;min-width:0;margin:0;color:#646c5a;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.reader-chapter-picker select{width:210px;min-height:42px;padding:8px 34px 8px 12px;border-color:#dfe2d5;border-radius:10px;background-color:#f8f8f1;color:#35432d;font-size:12px;font-weight:600;letter-spacing:normal;text-transform:none;white-space:nowrap;text-overflow:ellipsis}.chapter-choice-heading h2{margin:2px 0 4px}.chapter-search{margin-top:20px}.chapter-choice-label{margin-top:14px}.chapter-choice-label select{padding:6px;background:#fbfbf5}.chapter-choice-label option{padding:10px 12px;border-radius:6px;white-space:normal}.chapter-choice-label option:checked{background:#e7eddd;color:#354b2d}.chapter-admin-list>div{justify-content:flex-start}.chapter-admin-number{display:grid;place-items:center;width:36px;height:36px;flex:0 0 36px;border-radius:50%;background:#edf1e6;color:#5d6e50;font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}.chapter-admin-title{display:flex;flex:1;min-width:0;flex-direction:column}.chapter-admin-title strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chapter-admin-title small{color:var(--muted)}
@media(max-width:900px){.reader-chapter-picker{order:4;width:100%;padding-top:10px;border-top:1px solid #e6e7dc}.reader-chapter-picker select{flex:1;width:auto}.reader-toolbar{flex-wrap:wrap}}
@media(max-width:680px){.reader-chapter-picker span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.reader-chapter-picker select{width:100%}.chapter-admin-list>div{align-items:flex-start}.chapter-admin-list .danger{padding:8px 10px}}

/* Compact story actions. */
.story-card{position:relative;overflow:visible}.story-card>.book-cover,.story-card>.book-art{margin-bottom:18px}.story-actions{position:absolute;top:36px;right:36px;z-index:8}.story-actions summary{display:grid;place-items:center;width:42px;height:42px;border:1px solid #dfe1d7;border-radius:50%;background:rgba(255,255,250,.94);color:#55644c;cursor:pointer;box-shadow:0 5px 18px #2635241c;list-style:none;transition:transform .2s ease,background .2s ease,box-shadow .2s ease}.story-actions summary::-webkit-details-marker{display:none}.story-actions summary svg{width:20px;height:20px}.story-actions[open] summary,.story-actions summary:hover{transform:rotate(28deg);background:#eef2e7;box-shadow:0 7px 20px #2635242b}.story-actions-menu{position:absolute;top:50px;right:0;display:grid;width:220px;padding:8px;border:1px solid #dcdfd3;border-radius:12px;background:#fffef9;box-shadow:0 18px 45px #23301f2c}.story-actions-menu button{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;background:transparent;text-align:left;font-size:12px}.story-actions-menu button:hover{background:#f0f3e9;transform:none}.story-actions-menu button svg{width:17px;height:17px;color:#6c7e5e}.story-actions-menu .danger{color:#a03c32;border-top:1px solid #ebe1dc;border-radius:4px}.story-actions-menu .danger svg{color:inherit;transform:rotate(45deg)}
@media(hover:hover) and (pointer:fine){.story-actions:not([open]):hover .story-actions-menu{display:grid}.story-actions:not([open]) .story-actions-menu{display:none}}
@media(max-width:680px){.story-actions{top:30px;right:30px}.story-actions-menu{position:fixed;top:auto;right:18px;left:18px;bottom:18px;width:auto;z-index:50}}

/* Balanced Chinese-inspired library introduction. */
.library-intro{position:relative;width:min(100%,860px);margin:0 auto 34px;padding:8px 64px 28px;text-align:center}.library-intro .eyebrow{margin:8px 0 5px;letter-spacing:.28em}.library-intro h1{font-family:var(--font-reading);font-size:clamp(30px,3.6vw,46px);font-weight:600;line-height:1.3;letter-spacing:-.02em;color:#2f352d;text-wrap:balance}.library-intro>.subtitle{margin-top:12px}.library-chinese{font-family:var(--font-reading);font-size:14px;letter-spacing:.32em;color:#616e51;margin-bottom:13px}.library-ornament{display:flex;align-items:center;justify-content:center;gap:14px;color:#a44636}.library-ornament span{width:72px;height:1px;background:linear-gradient(90deg,transparent,#b85a47)}.library-ornament span:last-child{background:linear-gradient(90deg,#b85a47,transparent)}.library-ornament i{display:grid;place-items:center;width:29px;height:29px;border:1px solid #b85a47;transform:rotate(45deg);font-family:var(--font-reading);font-size:13px;font-style:normal}.library-ornament i::first-letter{transform:rotate(-45deg)}.library-seal{position:absolute;right:10px;top:76px;width:42px;height:48px;padding-top:4px;border:2px solid #ac4939;border-radius:3px;color:#ac4939;font-family:var(--font-reading);font-size:14px;font-weight:700;line-height:1.25;opacity:.95;transform:rotate(4deg)}.library-section .library-filters{align-items:center;margin:30px auto 12px}.library-section .library-search{max-width:680px}.library-section .genre-filter{justify-content:center}.library-section .library-result-count{margin:13px 0 0;text-align:center}.library-intro::after{content:"";display:block;width:min(100%,680px);height:1px;margin:24px auto 0;background:linear-gradient(90deg,transparent,#c9cdbd 20%,#c9cdbd 80%,transparent)}
@media(prefers-reduced-motion:no-preference){.library-ornament i{position:relative}.library-ornament i::after{content:"";position:absolute;inset:-1px;box-shadow:0 0 0 5px #a446361a;opacity:0;animation:seal-breathe 4s ease-in-out 3}.library-seal{transition:transform .35s ease,opacity .35s ease}.library-intro:hover .library-seal{transform:rotate(0) scale(1.06);opacity:1}@keyframes seal-breathe{50%{opacity:1}}}
@media(max-width:680px){.library-intro{padding:4px 8px 20px;margin-bottom:24px}.library-intro h1{font-size:28px}.library-chinese{font-size:12px;letter-spacing:.22em}.library-seal{display:none}.library-ornament span{width:48px}.library-section .library-filters{margin-top:24px}.library-section .genre-filter{justify-content:flex-start}.library-section .library-result-count{text-align:left}}


/* Auditable AI usage for each scholarly translation. */
.job-audit{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-top:12px;padding:12px 15px;border:1px solid #d9dfcd;border-radius:10px;background:#f4f7ee;color:#596750;font-size:12px;font-variant-numeric:tabular-nums}.job-audit strong{color:#34422d}.job-audit span{position:relative}.job-audit span+span::before{content:"";position:absolute;left:-9px;top:50%;width:3px;height:3px;border-radius:50%;background:#91a27d}@media(max-width:680px){.job-audit{align-items:flex-start;flex-direction:column;gap:5px}.job-audit span+span::before{display:none}}

/* Cinematic book-opening transition into the reader. */
.book-opening-overlay{position:fixed;inset:0;z-index:120;display:grid;place-items:center;overflow:hidden;background:rgba(28,35,27,.72);opacity:0;perspective:1500px;pointer-events:none;transition:opacity .18s ease}.book-opening-overlay.is-opening{opacity:1}.book-opening-overlay.is-finished{opacity:0;transition-duration:.4s}.opening-light{position:absolute;width:min(760px,90vw);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(255,249,217,.7),rgba(226,214,164,.2) 38%,transparent 70%);filter:blur(16px);transform:scale(.3);opacity:0}.is-opening .opening-light{animation:opening-light 1.05s ease-out forwards}.opening-book{position:relative;width:210px;height:310px;transform-style:preserve-3d;transform:translateY(32px) rotateX(8deg) rotateY(-8deg) scale(.5);filter:drop-shadow(0 24px 32px rgba(10,15,9,.45))}.is-opening .opening-book{animation:book-approach 1.05s cubic-bezier(.2,.72,.2,1) forwards}.opening-book-cover,.opening-pages{position:absolute;inset:0;border-radius:4px 10px 10px 4px;transform-origin:left center;backface-visibility:hidden}.opening-book-cover{z-index:8;overflow:hidden;background:linear-gradient(145deg,#4c6641,#293b2c);border:3px solid rgba(219,191,119,.7);box-shadow:inset 8px 0 18px rgba(0,0,0,.32);transform:translateZ(9px)}.opening-book-cover img{width:100%;height:100%;object-fit:cover}.opening-cover-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,25,15,.44),transparent 26%,transparent 72%,rgba(10,18,10,.22))}.opening-book-cover strong{position:absolute;right:18px;bottom:20px;left:18px;padding:10px 7px;background:rgba(30,37,27,.67);border:1px solid rgba(238,220,164,.5);color:#fff7da;font-family:var(--font-reading);font-size:14px;line-height:1.45;text-align:center;text-shadow:0 1px 3px #000}.opening-cover-placeholder{display:grid;place-items:center;width:100%;height:100%;color:#e9dfb6;font:700 74px var(--font-reading);background:radial-gradient(circle at 70% 25%,#83936a,#455a3a 55%,#273728)}.is-opening .opening-book-cover{animation:cover-open 1.05s cubic-bezier(.32,.02,.16,1) forwards}.opening-pages{z-index:3;background:repeating-linear-gradient(90deg,#eee8d4 0 2px,#faf6e8 2px 7px);border:1px solid #d4c9a8;box-shadow:inset -10px 0 18px rgba(112,91,53,.13);transform:translateZ(3px)}.opening-pages-left{opacity:0}.is-opening .opening-pages-left{animation:left-page-reveal 1.05s ease forwards}.opening-pages-right span{position:absolute;inset:5px 3px 5px 8px;border-right:1px solid rgba(145,123,79,.25);border-radius:8px;transform-origin:left;opacity:0}.is-opening .opening-pages-right span:nth-child(1){animation:page-turn .44s .56s ease-in-out forwards}.is-opening .opening-pages-right span:nth-child(2){animation:page-turn .38s .68s ease-in-out forwards}.is-opening .opening-pages-right span:nth-child(3){animation:page-turn .32s .79s ease-in-out forwards}.opening-book-spine{position:absolute;top:3px;bottom:3px;left:-5px;z-index:10;width:12px;border-radius:5px;background:linear-gradient(90deg,#263425,#879268,#33462f);transform:translateZ(12px)}.opening-caption{position:absolute;top:calc(50% + 205px);right:20px;left:20px;color:#f4eed9;font-family:var(--font-reading);font-size:13px;letter-spacing:.08em;text-align:center;opacity:0;transform:translateY(8px)}.is-opening .opening-caption{animation:caption-in .7s .3s ease forwards}.reader-layout{animation:reader-arrive .55s ease both}
@keyframes book-approach{0%{transform:translateY(32px) rotateX(8deg) rotateY(-8deg) scale(.5)}48%{transform:translateY(4px) rotateX(4deg) rotateY(-4deg) scale(.92)}100%{transform:translateX(105px) rotateX(1deg) rotateY(0) scale(1.13)}}
@keyframes cover-open{0%,43%{transform:translateZ(9px) rotateY(0)}100%{transform:translateZ(9px) rotateY(-172deg)}}

/* Tài khoản người học và yêu cầu dịch */
.reader-account-link{display:flex!important;align-items:center;gap:8px}.reader-account-link img{width:30px;height:30px;border-radius:50%;object-fit:cover;border:2px solid #d9dfcc}.reader-login-link,.google-login{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid #d8d9d0;border-radius:10px;background:#fff;padding:11px 16px;color:#30342d;text-decoration:none}.google-login{margin-top:20px;font-weight:700}.google-login span{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#fff;color:#4285f4;box-shadow:0 1px 5px #0002;font:700 16px Arial}.account-mode{max-width:1280px}.account-login{max-width:620px;margin:90px auto;padding:52px}.account-login h1,.account-heading h1{font-family:var(--font-reading);font-size:38px;margin:8px 0}.account-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:36px 0;padding:28px 32px;border:1px solid #dfe1d6;border-radius:18px;background:rgba(255,254,248,.88);backdrop-filter:blur(12px)}.account-profile{display:flex;align-items:center;gap:18px}.account-profile>img,.account-profile>span{width:62px;height:62px;border-radius:50%;object-fit:cover}.account-profile>span{display:grid;place-items:center;background:#e8eddc;color:#526747;font:700 25px var(--font-reading)}.account-profile p{margin:3px 0}.personal-section{margin:36px 0}.personal-library{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.personal-book{display:grid;grid-template-columns:110px 1fr;gap:18px;padding:16px;border:1px solid #dfe1d6;border-radius:14px;background:rgba(255,254,248,.9)}.personal-book>.book-cover,.personal-book>.book-art{width:110px;height:165px;min-height:0;margin:0;border-radius:8px;object-fit:cover}.personal-book h3{margin:12px 0 5px;font-family:var(--font-reading)}.personal-book p{color:#656b5e;font-size:12px}.personal-book button{margin-top:12px}.my-requests{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.request-row{padding:22px}.request-row h3{margin:16px 0 8px}.request-row p{color:#656b5e;font-size:12px}.privacy-badge{display:inline-flex;margin-left:7px;padding:5px 9px;border-radius:20px;background:#edf1e8;color:#57704d;font-size:12px;font-weight:700}.request-links{display:flex;flex-wrap:wrap;gap:14px;margin-top:14px}.request-links a,.link-button{border:0;background:none!important;padding:0!important;box-shadow:none!important;color:var(--red)!important;font:inherit;text-decoration:underline;cursor:pointer}.visibility-choice{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0 4px;padding:0;border:0}.visibility-choice legend{grid-column:1/-1;margin-bottom:10px;font-weight:700}.visibility-choice label{position:relative}.visibility-choice input{position:absolute;opacity:0}.visibility-choice label>span{display:grid;grid-template-columns:28px 1fr;align-items:center;padding:16px;border:1px solid #dfe1d7;border-radius:12px;cursor:pointer}.visibility-choice svg{grid-row:1/3;width:21px;color:#6b7e5c}.visibility-choice small{grid-column:2;color:#666b61}.visibility-choice input:checked+span{border-color:#70835f;background:#f0f4e9;box-shadow:0 0 0 2px #70835f22}.request-file small{display:block;margin-top:6px;color:#666b61}
.account-auth{display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,520px);gap:64px;align-items:center;min-height:calc(100vh - 260px);padding:55px 5%}.auth-intro h1{max-width:620px;margin:12px 0 20px;font:700 clamp(42px,5vw,72px)/1.05 var(--font-reading);color:#283028}.auth-intro>p:not(.eyebrow){max-width:560px;color:#656c60;font-size:17px;line-height:1.75}.auth-benefits{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}.auth-benefits span{display:flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid #dfe3d6;border-radius:24px;background:#fffffa99;color:#586b4c;font-size:12px}.auth-benefits svg{width:18px}.auth-forms{padding:30px}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;margin-bottom:26px;padding:4px;border-radius:12px;background:#eef0e8}.auth-tabs button{border:0;background:transparent;box-shadow:none;padding:11px}.auth-tabs button.active{background:#fff;box-shadow:0 3px 10px #2c392018}.auth-form{display:grid;gap:16px}.auth-form button{margin-top:6px}.auth-form[hidden]{display:none}.auth-divider{display:flex;align-items:center;gap:12px;margin:24px 0 2px;color:#676b64;font-size:12px}.auth-divider:before,.auth-divider:after{content:"";height:1px;flex:1;background:#dfe1d9}.auth-forms .google-login{width:100%;box-sizing:border-box}
@media(max-width:1000px){.personal-library,.my-requests{grid-template-columns:1fr 1fr}.account-auth{grid-template-columns:1fr;gap:28px}.auth-intro h1{font-size:48px}}@media(max-width:680px){.public-header nav .reader-account-link span,.public-header nav .reader-login-link{font-size:0}.personal-library,.my-requests,.visibility-choice{grid-template-columns:1fr}.account-heading{align-items:flex-start}.personal-book{grid-template-columns:90px 1fr}.personal-book>.book-cover,.personal-book>.book-art{width:90px;height:135px}.account-auth{padding:30px 0}.auth-intro h1{font-size:38px}.auth-forms{padding:22px}}

/* Phân tách kho học liệu chung và thư viện của người học */
.collection-summary{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 22px}.collection-summary span{display:flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid #dfe2d7;border-radius:22px;background:#fff;color:#636d59;font-size:12px}.collection-summary svg{width:17px}.user-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px}.user-stats>div{display:flex;align-items:baseline;gap:12px;padding:20px 24px}.user-stats strong{font:600 30px var(--font-reading);color:#42513a}.user-stats span{color:#666b61;font-size:12px}.user-management{display:grid;gap:22px}.user-block{padding:0;overflow:visible}.user-block>header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 24px;border-bottom:1px solid var(--line);background:#fbfcf7;border-radius:9px 9px 0 0}.user-identity{display:flex;align-items:center;gap:13px;min-width:0}.user-identity img,.user-identity>span{width:44px;height:44px;border-radius:50%;object-fit:cover}.user-identity>span{display:grid;place-items:center;background:#e8edde;color:#526647;font:700 18px var(--font-reading)}.user-identity h2{font-family:inherit;font-size:14px;font-weight:650}.user-identity p{margin-top:5px;color:#666b61;font-size:12px;overflow-wrap:anywhere}.user-identity>div{min-width:0}.user-badges{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px}.user-badges span,.owner-chip{display:inline-flex;align-items:center;gap:5px;padding:6px 9px;border-radius:20px;background:#edf1e7;color:#5b6f4f;font-size:12px;font-weight:700}.user-request-line{padding:13px 24px;border-bottom:1px solid #eceee6;color:#666b60;font-size:12px}.user-books{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding:20px}.user-books .story-card{min-width:0;padding:18px;background:#fff}.user-books .story-card>.book-cover,.user-books .story-card>.book-art{height:220px;min-height:0;object-fit:cover}.user-books .story-actions{top:28px;right:28px}.owner-chip{margin:0 0 12px}.owner-chip svg{width:13px}
@media(max-width:1050px){.user-books{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:680px){.user-stats{grid-template-columns:1fr}.user-block>header{align-items:flex-start;flex-direction:column}.user-badges{justify-content:flex-start}.user-books{grid-template-columns:1fr}}
@keyframes left-page-reveal{0%,50%{opacity:0;transform:translateZ(3px) rotateY(0)}55%{opacity:1}100%{opacity:1;transform:translateZ(3px) rotateY(-180deg)}}
@keyframes page-turn{0%{opacity:.8;background:#f8f2df;transform:translateZ(4px) rotateY(0)}100%{opacity:0;transform:translateZ(4px) rotateY(-165deg)}}
@keyframes opening-light{30%{opacity:.55}100%{opacity:1;transform:scale(1)}}@keyframes caption-in{to{opacity:.9;transform:none}}@keyframes reader-arrive{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(max-width:520px){.opening-book{width:156px;height:234px}.opening-caption{top:calc(50% + 160px)}@keyframes book-approach{0%{transform:translateY(25px) rotateX(8deg) rotateY(-8deg) scale(.5)}48%{transform:translateY(2px) rotateX(3deg) scale(.92)}100%{transform:translateX(78px) rotateX(1deg) scale(1.06)}}}
@media(prefers-reduced-motion:reduce){.book-opening-overlay{display:none}.reader-layout{animation:none}}
.job-progress{display:block;margin-top:5px;font-weight:400;line-height:1.45;white-space:normal;max-width:420px}.partial-translation-notice{display:flex;flex-direction:column;gap:5px;margin-top:16px;padding:15px 18px;border:1px solid #e7d2a8;border-radius:9px;background:#fff8e8;color:#806733;font-size:12px}.partial-translation-notice span{line-height:1.6}
.footnote-ref{position:relative;display:inline;padding:0 2px;border:0;background:transparent!important;color:#9b593e;font:700 .72em var(--font-ui);vertical-align:super;box-shadow:none!important}.footnote-ref::after{content:attr(data-note);position:absolute;z-index:20;left:50%;bottom:calc(100% + 10px);width:min(340px,75vw);padding:12px 14px;border:1px solid #d9d5c7;border-radius:9px;background:#fffdf6;color:#373b34;font:400 12px/1.65 var(--font-ui);white-space:normal;text-align:left;box-shadow:0 10px 30px #26372428;opacity:0;visibility:hidden;transform:translate(calc(-50% + var(--note-shift,0px)),6px);transition:.18s ease;pointer-events:none}.footnote-ref:hover::after,.footnote-ref:focus-visible::after,.footnote-ref.is-open::after{opacity:1;visibility:visible;transform:translate(calc(-50% + var(--note-shift,0px)),0)}.reader.night .footnote-ref::after{background:#303a36;color:#edf0e9;border-color:#526059}.footnotes-panel{margin-top:38px;padding-top:20px;border-top:1px solid #d9d2c2;font-family:var(--font-ui)}.footnotes-panel summary{display:flex;align-items:center;gap:9px;width:max-content;cursor:pointer;color:#616e51;font-size:13px;font-weight:700}.footnotes-panel summary span{padding:2px 8px;border-radius:20px;background:#e9eedf;font-size:12px}.footnotes-panel ol{margin:18px 0 0;padding:0;list-style:none;display:grid;gap:13px}.footnotes-panel li{font-size:12px;line-height:1.75;color:#666d60}.footnotes-panel li b{color:#93533d;margin-right:5px}.reader.night .footnotes-panel{border-color:#46514d}.reader.night .footnotes-panel li{color:#c6cdc4}

/* Page entrance, loading placeholders and tap-to-see glossary terms. All motion is opt-in via
   prefers-reduced-motion:no-preference; the final rule removes any remaining motion for users who ask. */
@keyframes route-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes skeleton-shimmer{from{background-position:200% 0}to{background-position:-200% 0}}
@media (prefers-reduced-motion:no-preference){.route-enter>*{animation:route-in .38s cubic-bezier(.2,.7,.2,1) both}.route-enter>*:nth-child(2){animation-delay:.06s}.route-enter>*:nth-child(3){animation-delay:.12s}.skeleton{animation:skeleton-shimmer 1.6s ease-in-out infinite}.term-popover:not([hidden]){animation:route-in .16s ease-out}}
.skeleton-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:22px;margin-top:10px}
.skeleton-card{display:grid;gap:10px}
.skeleton{display:block;border-radius:8px;background:linear-gradient(90deg,#e9e8dd 25%,#f5f4ec 50%,#e9e8dd 75%);background-size:200% 100%}
.skeleton-cover{aspect-ratio:3/4;border-radius:10px}
.skeleton-line{height:14px}.skeleton-line.short{width:60%}
.skeleton-title{height:30px;width:min(320px,70%);margin:12px 0 28px}
.account-loading{padding:40px 5%}
.public-shell .reader .prose button.term{display:inline;margin:0;padding:0 1px;border:0;border-bottom:1.5px dotted currentColor;border-radius:2px;background:none;color:inherit;font:inherit;line-height:inherit;letter-spacing:inherit;cursor:help;box-shadow:none;transform:none}
.public-shell .reader .prose button.term:hover,.public-shell .reader .prose button.term[aria-expanded=true]{background:rgba(164,70,54,.12);border-bottom-style:solid;transform:none;box-shadow:none}
.public-shell .reader .prose button.term:focus-visible{outline:3px solid #536b43;outline-offset:2px}.public-shell .reader.night .prose button.term:focus-visible{outline-color:#f0b3a3}
.term-popover[hidden]{display:none}
.term-popover{position:absolute;z-index:25;display:grid;gap:4px;max-width:min(320px,calc(100vw - 24px));padding:12px 15px;border:1px solid #d8d3c0;border-radius:12px;background:#fffdf7;color:#283127;box-shadow:0 12px 32px rgba(39,53,35,.18);font-size:14px;line-height:1.5}
.term-popover-zh{font:600 22px/1.3 'Noto Serif SC','Noto Serif',serif;color:#a44636}
.term-popover-vi{font-weight:600}
.term-popover small{color:#5f6758;font-size:12px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
.book-download{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:12px}
.book-download button{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:600}
.book-download button svg{width:18px;height:18px;flex:none}
.book-download button:disabled{opacity:.55;cursor:progress}
.book-download [role=status]{color:#5f6758;font-size:13px;line-height:1.5}
@media(max-width:680px){.book-download button{width:100%;justify-content:center}}
.reader.night .book-download [role=status]{color:#c6cdc4}
.reader.night .book-download button{border-color:#526059;background:#303a36;color:#edf0e9}
.book-download .book-pick,.book-download .book-download-notes,.book-download .book-cover-offer,.book-download .book-join-secondary{flex-basis:100%}
/* File names have no spaces to wrap at; without these a long one widens the panel past a phone screen. */
.book-download>*,.book-pick>*{min-width:0}
.book-pick,.book-pick li,.book-download-notes li,#book-download-status{overflow-wrap:anywhere}
.book-pick{display:grid;gap:8px;padding:12px 14px;border:1px solid #e0dccb;border-left:3px solid #b78b4d;border-radius:10px;background:#fbf8ef;color:#3e443a}
.book-pick strong{font-size:14px;line-height:1.5}
.book-pick p,.book-pick ul{margin:0;font-size:13px;line-height:1.6}
.book-pick ul{padding-left:18px}
.book-pick .book-pick-errors{color:#9c382f}
.book-pick-actions{display:flex;flex-wrap:wrap;gap:8px}
.book-pick-file{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;overflow:hidden;border-radius:7px;background:var(--red);color:#fff;font-weight:600;cursor:pointer}
.book-pick-file input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.book-pick-file:focus-within{outline:3px solid rgba(164,70,54,.35);outline-offset:3px}
.book-pick-actions button,.book-download .book-join-secondary,.book-cover-offer button{min-height:44px}
.book-download-notes{margin:0;padding-left:18px;color:#7a5a2c;font-size:12px;line-height:1.6}
.book-cover-offer{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:10px 12px;border:1px solid #d9dfd0;border-radius:10px;background:#f4f7ee}
.book-cover-offer img{width:48px;height:auto;border:1px solid #cfd6c4;border-radius:3px;background:#fff}
.book-cover-offer p{flex:1;min-width:160px;margin:0;font-size:13px;line-height:1.5}
@media(max-width:680px){.book-pick-actions>*{flex:1 1 100%}}
.reader.night .book-pick{border-color:#4d4a3d;background:#2b2f2a;color:#e1e6dd}
.reader.night .book-pick .book-pick-errors{color:#f0a89b}
.reader.night .book-download-notes{color:#d9c08f}
.reader.night .book-cover-offer{border-color:#46514d;background:#273029;color:#e1e6dd}

/* Account: terms consent (also gates the Google button), registration policy, account deletion. */
.auth-forms .terms-check{display:flex;gap:9px;align-items:flex-start;font-size:13px;line-height:1.5;color:#3f443d}
.auth-forms .terms-check input{width:auto;margin:3px 0 0;flex:none}
.auth-forms .terms-check a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.auth-forms .google-terms-check{margin-top:18px}
.auth-forms .terms-check[hidden]{display:none}
.google-terms{display:block;margin-top:10px;color:#5f645b;font-size:12px;line-height:1.6;text-align:center}
.auth-forms .google-login[aria-disabled="true"]{opacity:.55;cursor:not-allowed;box-shadow:none}
.auth-form label small{display:block;margin-top:6px;color:#5f645b;font-size:12px;line-height:1.5}
.auth-form-title{margin:0 0 4px;font-size:20px}
.auth-note{margin:4px 0 0;padding:10px 12px;border-radius:10px;background:#f6f1e4;color:#5c4f2c;font-size:13px;line-height:1.6}
.account-delete{max-width:760px;padding:22px 24px;border:1px solid #e7c8c0;border-radius:14px;background:rgba(255,248,245,.94)}
.account-delete h2{color:#8f3b2e}
.account-delete p{margin:10px 0 0;color:#57504b;font-size:13px;line-height:1.7}
.account-delete-links a{color:#8f3b2e;text-decoration:underline;text-underline-offset:2px}
.account-delete .danger{min-height:44px;margin-top:16px}
.modal-field{display:block;margin-top:16px}
.modal-error{margin:16px 0 0;padding:10px 12px;border-radius:8px;background:#fbe9e5;color:#8f2f24;font-size:13px;line-height:1.6}
.modal-error[hidden]{display:none}
.primary.danger-solid{background:#a03c32;border-color:#a03c32;color:#fff}
.primary.danger-solid:not(:disabled):hover{background:#86302a;border-color:#86302a}
.user-badges .user-locked{background:#f8e5e3;color:#9c382f}
.user-admin-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;padding:12px 24px;border-bottom:1px solid #eceee6;background:#fdfdf9}
.user-admin-row small{color:#5f645b;font-size:12px;line-height:1.6}
.user-actions{display:flex;flex-wrap:wrap;gap:8px}
.user-actions button{min-height:40px;padding:8px 12px;font-size:12px}
.story-flags{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px}
.story-flags span{padding:4px 9px;border-radius:20px;font-size:12px;font-weight:700}
.story-flags .sample-flag{background:#f6e4dc;color:#8a3b2e}
.story-flags .draft-flag{background:#eeeeea;color:#55594f}
/* The reader toolbar gained the 字 group: on a phone its groups wrap instead of pushing past the screen edge. */
@media(max-width:680px){.reader-options{flex-wrap:wrap;row-gap:8px}}
@media(max-width:430px){.reader-toolbar .reader-icon{width:36px}.reader-control-group{gap:4px}}
/* A closed footnote tooltip still widened the page on a phone (an absolute box past the right edge); it is drawn only when open. */
/* A touch screen keeps :hover after a tap, so there a note shows only while open (tapped) or keyboard-focused. */
.footnote-ref::after{display:none}.footnote-ref.is-open::after,.footnote-ref:focus-visible::after{display:block}@media(hover:hover){.footnote-ref:hover::after{display:block}}
.noscript-note{max-width:640px;margin:40px auto;padding:16px 20px;border-radius:12px;background:#fffef8;color:#2f352c;font-size:15px;line-height:1.7}
.noscript-note a{color:#8f3b2e;text-decoration:underline}

/* "Ví dụ mẫu": sample books translated by AI to show the result, never reviewed by a teacher. */
.sample-badge{position:absolute;top:10px;left:10px;z-index:2;max-width:calc(100% - 20px);padding:4px 9px;border-radius:6px;background:#8a3b2e;color:#fbf3e4;font-size:12px;font-weight:700;line-height:1.4;letter-spacing:.05em;text-transform:uppercase;box-shadow:0 2px 8px #0000004d;pointer-events:none}
.sample-notice{margin:18px 0 0;padding:12px 16px;border:1px solid #e3cfa9;border-left:4px solid #8a3b2e;border-radius:10px;background:#fff8ea;color:#4d4130;font-size:14px;line-height:1.7}
.sample-notice a{color:#8a3b2e;text-decoration:underline;text-underline-offset:2px}
.reader.night .sample-notice{border-color:#5b4a37;border-left-color:#d58f7c;background:#2b2a24;color:#e7ddc8}
.reader.night .sample-notice a{color:#f0b3a3}

/* "Đọc song ngữ": the original page and its Vietnamese page side by side, stacked on narrow screens. */
.reader-pdf-tools{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:16px}
.reader-pdf-tools:empty{display:none}
.bilingual-toggle{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:600}
.bilingual-toggle svg{width:18px;height:18px}
.bilingual-toggle[aria-pressed="true"]{border-color:#536b43;background:#edf3e5;color:#2f4426;box-shadow:inset 0 0 0 1px #536b43}
.bilingual-toggle-hint{color:#5f6758;font-size:13px}
.bilingual-original-link{display:inline-flex;align-items:center;min-height:44px;color:#8f3b2e;font-size:13px;text-decoration:underline;text-underline-offset:2px}
.bilingual{display:grid;gap:10px;margin-top:16px}
.bilingual-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
.bilingual-nav,.bilingual-zoom{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.bilingual button{min-width:44px;min-height:44px;padding:8px 12px;border-radius:10px;background:#fffdf8;font-size:13px}
.bilingual-position{min-width:92px;text-align:center;color:#4b5744;font-size:13px;font-weight:600;font-variant-numeric:tabular-nums}
.bilingual-zoom output{min-width:48px;text-align:center;color:#4b5744;font-size:13px;font-variant-numeric:tabular-nums}
.bilingual-hint{margin:0;color:#5f6758;font-size:12px}
.bilingual-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
.bilingual-side{min-width:0;margin:0}
.bilingual-side figcaption{margin:0 0 6px;color:#4b5744;font-size:12px;font-weight:700;letter-spacing:.04em}
.bilingual-scroll{max-width:100%;overflow:auto;border-radius:8px;background:#e9e8de}
.bilingual-scroll:focus-visible{outline:2px solid #536b43;outline-offset:2px}
.bilingual-sheet{min-height:120px}
.bilingual-page{position:relative;margin:0 auto;background:#fff;box-shadow:0 1px 4px #2a35211f;--user-unit:1;--total-scale-factor:calc(var(--scale-factor) * var(--user-unit));--scale-round-x:1px;--scale-round-y:1px}
.bilingual-page>canvas{position:absolute;inset:0;width:100%;height:100%}
.bilingual-empty{margin:0;padding:40px 16px;text-align:center;color:#5f6758;font-size:13px;line-height:1.6}
.bilingual-status{margin:0;color:#5f6758;font-size:13px;line-height:1.6}
.bilingual-status button{min-height:36px;margin-left:6px}
.bilingual-nav-end{justify-content:center}
/* pdf.js text layer (from pdf_viewer.css): transparent text over the page picture, for selection and screen readers. */
.bilingual .textLayer{position:absolute;inset:0;z-index:0;overflow:clip;opacity:1;line-height:1;text-align:initial;letter-spacing:normal;word-spacing:normal;-webkit-text-size-adjust:none;text-size-adjust:none;forced-color-adjust:none;transform-origin:0 0;caret-color:CanvasText;--min-font-size:1;--text-scale-factor:calc(var(--total-scale-factor) * var(--min-font-size));--min-font-size-inv:calc(1 / var(--min-font-size))}
.bilingual .textLayer :is(span,br){position:absolute;color:transparent;white-space:pre;cursor:text;transform-origin:0% 0%}
.bilingual .textLayer>:not(.markedContent),.bilingual .textLayer .markedContent span:not(.markedContent){z-index:1;--font-height:0;font-size:calc(var(--text-scale-factor) * var(--font-height));--scale-x:1;--rotate:0deg;transform:rotate(var(--rotate)) scaleX(var(--scale-x)) scale(var(--min-font-size-inv))}
.bilingual .textLayer .markedContent{display:contents}
.bilingual .textLayer span[role="img"]{user-select:none;cursor:default}
.bilingual .textLayer ::selection{background:rgba(0,90,255,.25);color:transparent}
.bilingual .textLayer br::selection{background:transparent}
.bilingual .textLayer .endOfContent{position:absolute;inset:100% 0 0;z-index:0;display:block;cursor:default;user-select:none}
.bilingual .textLayer.selecting .endOfContent{top:0}
.reader.night .bilingual button{border-color:#526059;background:#303a36;color:#edf0e9}
.reader.night .bilingual-scroll{background:#1a201e}
.reader.night :is(.bilingual-side figcaption,.bilingual-position,.bilingual-zoom output,.bilingual-hint,.bilingual-status,.bilingual-empty,.bilingual-toggle-hint){color:#c6cdc4}
.reader.night .bilingual-toggle[aria-pressed="true"]{border-color:#a9c48f;background:#2e3d2c;color:#e3eedb}
.reader.night .bilingual-original-link{color:#f0b3a3}
@media(max-width:760px){.bilingual-grid{grid-template-columns:1fr}.bilingual-hint{display:none}.bilingual-bar{justify-content:center}}
@media(max-width:480px){.bilingual-label{display:none}.bilingual-nav,.bilingual-zoom{justify-content:center}}

/* Legal pages (dieu-khoan.html, quyen-rieng-tu.html): one readable column on the site background. */
.legal-body{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh}
.skip-link{position:absolute;top:-80px;left:12px;z-index:60;padding:10px 14px;border-radius:8px;background:#35472f;color:#fff}
.skip-link:focus{top:12px}
.legal-page{flex:1 0 auto;width:min(calc(100% - 24px),860px);margin:40px auto 48px;padding:40px 48px;border:1px solid #dedecb;border-radius:18px;background:#fffef8;box-shadow:0 15px 55px #273c2520}
.legal-article{color:#2f352c;font-size:15px;line-height:1.75;overflow-wrap:anywhere}
.legal-article h1{margin:4px 0 6px;font:600 34px/1.3 var(--font-reading);color:#283028;letter-spacing:normal}
.legal-meta{margin:0 0 22px;color:#5b6354;font-size:13px}
.legal-summary{margin:0 0 24px;padding:16px 20px;border:1px solid #dfe3d4;border-left:4px solid #536b43;border-radius:12px;background:#f5f8ef}
.legal-article .legal-summary>p:first-child{margin:0}
.legal-summary ul{margin:6px 0 0;padding-left:20px}
.legal-toc{margin:0 0 28px;padding:16px 20px;border:1px solid #e4e4dc;border-radius:12px;background:#fbfbf6}
.legal-toc ol{margin:0;padding-left:22px;columns:2 240px}
.legal-toc li{break-inside:avoid}
.legal-toc a{display:inline-block;padding:4px 0;color:#3f5a34;text-decoration:underline;text-underline-offset:2px}
.legal-article section{margin-top:32px;scroll-margin-top:120px}
.legal-article h2{margin:0 0 10px;font:600 22px/1.4 var(--font-ui);color:#30402b}
.legal-article h3{margin:18px 0 6px;font-size:16px;color:#3a4a33}
.legal-article p{margin:10px 0 0}
.legal-article ul{margin:8px 0 0;padding-left:22px}
.legal-article li+li{margin-top:6px}
.legal-article a{color:#8f3b2e;text-decoration:underline;text-underline-offset:2px}
.legal-article code{padding:1px 5px;border-radius:5px;background:#f0efe6;font-size:.88em}
@media(max-width:680px){.legal-page{width:calc(100% - 20px);margin:16px auto 28px;padding:24px 18px;border-radius:14px}.legal-article h1{font-size:28px}.legal-article h2{font-size:19px}}

/* Library stream (2026-10): hidden means hidden, the home page's purpose and actions, error cards, reader additions. */
[hidden]{display:none!important}
.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.public-shell .skip-link{z-index:60}
.public-shell :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid #536b43;outline-offset:3px}
.public-shell .public-content:focus,.public-shell .public-content:focus-visible{outline:none}
.public-shell :is(h1,h2)[tabindex="-1"]:focus{outline:none}
/* The skip link and the legal pages' links use the same ring as the rest of the site (a light one on the dark skip link). */
.skip-link:focus-visible,.public-shell .skip-link:focus-visible{outline:3px solid #f0b3a3;outline-offset:2px}
.legal-page a:focus-visible,.legal-page button:focus-visible{outline:3px solid #536b43;outline-offset:3px}
main#noi-dung:focus{outline:none}
.public-shell .reader.night :is(a,button,summary,[tabindex]):focus-visible{outline-color:#f0b3a3}
.hero-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:26px}
.hero-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 22px;border:1px solid #c3cdb4;border-radius:10px;background:#fffef9;color:#35472f;font-size:15px;font-weight:600;line-height:1.3}
.hero-cta-primary{border-color:var(--red);background:var(--red);color:#fff}
.hero-cta:hover{border-color:#536b43;color:#2c3c26}.hero-cta-primary:hover{border-color:#8f3b2e;background:#8f3b2e;color:#fff}
.library-section{scroll-margin-top:130px}
.library-heading{max-width:700px;margin:4px auto 0;text-align:center}
.library-heading h2{margin:0;color:#2f352d;font:600 26px/1.35 var(--font-reading);scroll-margin-top:130px}
.library-heading h2:focus{outline:none}
.library-heading>.subtitle{margin-top:6px}
.library-empty{display:grid;justify-items:center;gap:16px;max-width:620px;margin:24px auto 0;color:#46503f;font-size:15px}
.load-error{max-width:640px;margin:24px auto 0;padding:22px 24px;border-color:#e7c8c0;background:#fff8f5;text-align:left}
.load-error :is(h1,h2){margin:0 0 6px;color:#8f3b2e;font:600 18px/1.4 var(--font-ui)}
.load-error p{color:#4d4130;line-height:1.7}
.load-error .button-row{margin-top:14px;flex-wrap:wrap}
.load-error-link{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;color:#8f3b2e;text-decoration:underline;text-underline-offset:3px}
@media(max-width:680px){.hero-actions{flex-direction:column;align-items:stretch}.library-heading h2{font-size:23px}}
/* Reader: share button, book title, loading and error states. */
.reader-start{display:flex;flex:none;align-items:center;gap:8px}
/* The part picker has a row of its own at every width, so long part titles stay readable. */
.reader-toolbar{flex-wrap:wrap}.reader-toolbar .reader-chapter-picker{order:4;width:100%;padding-top:10px;border-top:1px solid #e6e7dc}.reader-toolbar .reader-chapter-picker select{flex:1;width:auto;min-width:0}
.reader-toolbar .reader-share{gap:8px;padding:0 14px!important;border-color:#d6dccb;background:#fff;color:#3f5a34;font-size:12px}
.reader-share svg{width:18px;height:18px}
.reader-book-title{margin:0 0 4px;color:#4a5444;font-size:13px;font-weight:600;overflow-wrap:anywhere}
.reader-skeleton{display:block;height:min(60vh,520px);margin-top:16px;border-radius:14px}
.reader-error-back{margin-top:16px;text-align:center}.reader-error-back button{display:inline-flex;align-items:center;gap:8px;min-height:44px}
.reader-layout h1:focus{outline:none}
.footnote-ref.is-dismissed::after{display:none!important}
/* Night pages: every secondary text and link keeps 4.5:1 on #222b28. */
.reader.night :is(.chapter-source,.subtitle,.reader-book-title){color:#c6cdc4}
.reader.night :is(.chapter-source a,.subtitle a){color:#b9d39f}
.reader.night .footnote-ref{color:#f0b3a3}
.reader.night .footnotes-panel summary{color:#c6cdc4}.reader.night .footnotes-panel summary span{background:#3a4540;color:#e1e6dd}
.reader.night .footnotes-panel li b{color:#f0b3a3}
.reader.night .bilingual-toggle:not([aria-pressed="true"]){border-color:#526059;background:#303a36;color:#edf0e9}
/* PDF parts on phones and tablets: pages drawn with pdf.js (mountPdfPages), as wide as the screen allows. */
.pdf-pages{margin-top:16px}
.pdf-pages-list{display:grid;gap:12px;justify-items:center}
@media(max-width:680px){.reader-pdf-area{margin-inline:-36px}.reader-pdf-area .bilingual-bar,.reader-pdf-area .bilingual-status,.reader-pdf-area .bilingual-side figcaption{padding-inline:12px}}
@media(max-width:760px){.bilingual-side-translated{order:-1}}
/* Phones: every reader control and filter chip is at least 44 px tall to tap. */
@media(max-width:680px){.reader-toolbar button,.reader-toolbar .reader-icon{height:44px;min-height:44px}.reader-toolbar .reader-icon{width:44px}.reader-toolbar .reader-chapter-picker select{min-height:44px}.reader-pagination button{min-height:44px}.genre-filter button{min-height:44px}}
/* Library stream, stage 2 (2026-10): account page on phones, sign-in errors in the form, password reset, request dialog,
   admin reset links. */
.account-profile,.account-profile>div{min-width:0}
.account-heading h1,.account-email{overflow-wrap:anywhere}
.account-heading #reader-logout{flex:none;min-height:44px}
/* The initials are the header avatar's, drawn the same way (header.css .header-avatar). */
.account-profile>span{border:1px solid #d3dbca;background:#e9eee2;color:#4a6140;font:700 22px/1 var(--font-ui);letter-spacing:.03em}
@media(max-width:680px){.account-heading{flex-wrap:wrap;gap:16px;margin:20px 0;padding:20px}.account-profile{flex:1 1 100%;gap:14px}.account-profile>img,.account-profile>span{flex:none;width:52px;height:52px;font-size:20px}.account-heading h1{font-size:28px;line-height:1.3}}
@media(max-width:360px){.account-profile{flex-direction:column;align-items:flex-start;gap:10px}.account-heading h1{font-size:26px}}
.account-notice{display:flex;align-items:flex-start;gap:10px;max-width:760px;margin:0 0 28px;padding:12px 16px;border:1px solid #cfdcc1;border-left:4px solid #536b43;border-radius:10px;background:#f2f7ec;color:#2f4426;font-size:14px;line-height:1.6}
.account-notice svg{flex:none;margin-top:2px;color:#536b43}.account-notice:focus{outline:none}
/* "Chưa có ảnh bìa" on a cover placeholder (Thư viện riêng, admin cards) keeps 4.5:1 on its light green-grey. */
.cover-placeholder small{color:#4f5149}
.account-empty{grid-column:1/-1;display:grid;justify-items:center;gap:16px;color:#46503f}
.account-empty p{max-width:560px}
.account-empty-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.account-error{padding:32px 5%}.account-error h1{margin:0;font:600 30px/1.3 var(--font-reading);color:#283028}
.personal-section>.load-error{margin-left:0}
.form-error{margin:0;padding:10px 12px;border:1px solid #e7c8c0;border-left:4px solid #a03c32;border-radius:8px;background:#fbe9e5;color:#8f2f24;font-size:13px;line-height:1.6}
.form-error:focus{outline:none}
.auth-form input[aria-invalid="true"],.request-source input[aria-invalid="true"]{border-color:#a03c32;box-shadow:0 0 0 1px #a03c32}
.auth-form[aria-busy="true"] button[type="submit"]{cursor:progress}
.auth-forgot{color:#3f443d;font-size:13px}
.auth-forgot summary{display:inline-flex;align-items:center;min-height:44px;color:#8f3b2e;text-decoration:underline;text-underline-offset:3px;cursor:pointer;list-style:none}
.auth-forgot summary::-webkit-details-marker{display:none}
.auth-forgot p{margin:4px 0 0;line-height:1.65}
.auth-pending{margin:0 0 20px}
.reset-unavailable{display:grid;justify-items:start;gap:12px}
.reset-unavailable p{color:#4d4130;line-height:1.7}.reset-unavailable h2:focus{outline:none}
.request-source{margin:16px 0 0;padding:6px 16px 16px;border:1px solid #dfe1d7;border-radius:12px}
.request-source legend{padding:0 6px;color:#40493a;font-size:12px;font-weight:700}
.request-source legend span{color:#5f645b;font-weight:400}
.request-file input[type="file"]{min-height:44px;padding:6px;cursor:pointer}
.request-file input[type="file"]::file-selector-button{margin-right:12px;min-height:34px;padding:6px 14px;border:1px solid #b9c5a8;border-radius:8px;background:#eef3e6;color:#35472f;font:600 13px var(--font-ui);cursor:pointer}
.request-file input[type="file"]:hover::file-selector-button{border-color:#8fa078;background:#e2ebd6}
.request-file .request-file-again{color:#8f3b2e}
.visibility-choice label>span{height:100%;align-content:start}
.visibility-choice .visibility-rights{margin-top:6px;color:#7a3a2c;font-weight:600}
#modal label small,.visibility-choice small,.request-file small,.personal-book small,.request-row small,.profile small{font-size:12px;line-height:1.5}
.user-reset-note{display:inline-flex;align-items:center;min-height:40px;color:#5f645b;font-size:12px;line-height:1.5}
.reset-link-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:10px}
.reset-link-actions button{min-height:44px}
#reset-link{font:12px/1.5 ui-monospace,Consolas,monospace}
#reset-link-status{color:#3f5a34;font-size:13px}
.reset-link-note{margin-top:14px}
/* Dialogs sit outside .public-shell: the same visible focus ring there, also on the radio cards (their input is hidden). */
#modal :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid #536b43;outline-offset:3px}
#modal .visibility-choice input:focus-visible+span{outline:3px solid #536b43;outline-offset:2px}
/* Phones: the account page's request button, the sign-in tabs and fields are at least 44px tall. */
@media(max-width:680px){#account-request,.auth-tabs button,.auth-form input:not([type=checkbox]){min-height:44px}}
/* Windows High Contrast drops the colours that mark the chosen theme or filter: a ring marks it instead. */
@media(forced-colors:active){[aria-pressed="true"]{outline:2px solid Highlight;outline-offset:2px}}
/* Robustness pass (2026-10-22). Reader on a phone: the header scrolls away with the page and the toolbar is one row
   (library, part, "Tùy chọn"); page colour, Chinese lookup, font size and listening open under it on demand, so the
   first screen shows reading text. Wider screens keep every control in view. */
.reader-more{display:contents}
.reader-toolbar .reader-more-toggle{display:none}
.reader-toolbar .reader-more-toggle svg{width:20px;height:20px}
@media(max-width:800px){.public-shell.is-reading .site-masthead{position:relative}html.is-reading{scroll-padding-top:12px}}
@media(max-width:680px){
 .public-content.read-mode{margin-top:10px;padding:8px}
 .reader-layout .reader{padding:22px 16px;margin:12px 0}
 .reader-layout .prose{margin-top:20px}
 .reader-pdf-area{margin-inline:-24px}
 .reader-toolbar{flex-wrap:nowrap;gap:8px;padding:8px}
 .reader-toolbar .reader-start{gap:6px}
 .reader-toolbar .reader-back,.reader-toolbar .reader-share{width:44px;padding:0!important}
 .reader-toolbar .reader-back span,.reader-toolbar .reader-share span,.reader-more-toggle span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .reader-toolbar .reader-chapter-picker{order:0;flex:1 1 0;width:auto;min-width:0;padding-top:0;border-top:0}
 .reader-toolbar .reader-chapter-picker select{margin-top:0}
 .reader-toolbar .reader-more-toggle{display:inline-flex;flex:none;width:44px;border-color:#dfe2d5;background:#f8f8f1;color:#4d5b42}
 .reader-toolbar .reader-more-toggle[aria-expanded="true"]{border-color:#536b43;background:#edf1e6;color:#35472f}
 .reader-more{display:none}
 .reader-toolbar.is-more-open{flex-wrap:wrap}
 .reader-toolbar.is-more-open .reader-more{display:flex;flex-wrap:wrap;align-items:center;gap:10px;order:5;width:100%;padding-top:10px;border-top:1px solid #e6e7dc}
 .reader-more .reader-options{display:contents}
 .reader-more .reader-audio{margin-left:0}
}
/* Long titles without spaces (a file name, a URL) wrap instead of widening a phone page. */
.reader-layout .reader h1,.page-heading h1,.page-heading .subtitle,.story-card h2,.book h2,.review-book-main h2,.user-identity h2,.user-identity p,.book-title,.book-author,.book-genre,.story-card p,.personal-book h3,.request-row h3,.chapter-source,.chapter-choice-heading .eyebrow{overflow-wrap:anywhere}
.page-heading>div,.review-book-main,.user-identity>div,.personal-book>div{min-width:0}
@media(max-width:680px){.library,.user-books,.editor-grid,.form-grid{grid-template-columns:minmax(0,1fr)}}
/* A book being opened: its buttons wait (aria-busy) while its parts download. */
[data-read][aria-busy="true"]{cursor:progress}
.cover-trigger[aria-busy="true"]{opacity:.75}
/* A browser that cannot run the pages (browser-check.js). */
.browser-notice{max-width:640px;margin:48px auto;padding:24px 28px;border:1px solid #e7c8c0;border-left:4px solid #a03c32;border-radius:12px;background:#fff8f5;color:#3b2f2a;font-family:'Be Vietnam Pro','Segoe UI',sans-serif;line-height:1.7}
.browser-notice h1{margin:0 0 8px;font-size:22px;letter-spacing:normal}
.browser-notice p{margin:0}
.browser-notice button{min-height:44px;margin-top:14px}
@media(max-width:680px){.browser-notice{margin:16px;padding:18px}}
/* The skip link waits above the page until focused; with a notice above the page it must not show there. */
.skip-link:not(:focus){clip-path:inset(50%);pointer-events:none}
/* Account: a Google sign-in that came back with a reason, a weak password, changing the password, signing out
   everywhere; a reset link waiting for "Tiếp tục". */
.auth-failure{margin:0 0 18px}
.account-warning{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;max-width:760px;margin:0 0 28px;padding:12px 16px;border:1px solid #ecd9a9;border-left:4px solid #a07a1c;border-radius:10px;background:#fdf6e3;color:#5c4614;font-size:14px;line-height:1.6}
.account-warning span{flex:1 1 300px}
.account-warning button{min-height:44px}
.account-security{max-width:760px;padding:22px 24px;border:1px solid #dfe1d6;border-radius:14px;background:rgba(255,254,248,.92)}
.account-security h3{margin:0;font-size:16px}
.account-password{margin-top:16px;max-width:460px}
.account-security-note{margin:0;color:#5b6354;font-size:13px;line-height:1.6}
.account-sessions{display:grid;justify-items:start;gap:8px;margin-top:24px;padding-top:20px;border-top:1px solid #e6e7dc}
.account-sessions p{margin:0;color:#57504b;font-size:13px;line-height:1.7}
.account-sessions button{min-height:44px}
.reset-ready{display:grid;justify-items:start;gap:12px}
.reset-ready p{color:#4d4130;line-height:1.7}
/* Admin lists come in pages. */
.load-more{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:22px 0}
.load-more button,.user-books-open{min-height:44px}
/* New translation requests: a count that stands out on the admin's "Yêu cầu dịch" button, on phones too. The button
   holds its visually hidden words: placed against the page, they would widen it past the phone's side-scrolling nav. */
.nav button{position:relative}
.nav .count{min-width:22px;padding:2px 7px;border-radius:999px;background:var(--red);color:#fff;font-weight:600;text-align:center}
@media(max-width:680px){.nav .count{display:inline-block;margin-left:0}}
/* A stored link that is not a web address is shown as text, never as a link. */
.source-text{overflow-wrap:anywhere}
.request-links .source-text{color:var(--muted);font-size:13px}
/* Admin sign-in (username and password): the first-run and recovery forms, the switch between them, and the note shown
   when a session ended. The card's own heading or note takes the focus without a ring. */
.login-card .auth-form{margin-top:24px}
.login-card .auth-form label small{color:#5f645b}
.login-card h1:focus,.admin-auth-notice:focus{outline:none}
.admin-auth-notice{margin:18px 0 0}
.admin-auth-switch{margin:14px 0 0;text-align:center}
.admin-auth-switch .link-button{display:inline-flex;align-items:center;min-height:44px;font-size:13px}
.profile-name{display:block;font-weight:600;overflow-wrap:anywhere}
/* Settings: the signed-in admin's password and the list of admins. */
.admin-password,.admin-add{margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}
.settings-card .auth-form h3{margin:0;font-size:15px}
.admin-team{grid-column:1/-1}
.admin-team .admin-list{grid-column:1/-1;margin-top:22px}
.admin-team .admin-add{max-width:460px}
.admin-accounts{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.admin-accounts li{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:#fbfbf7}
.admin-accounts .avatar{flex-shrink:0}
.admin-account{flex:1;min-width:0}
.admin-account strong{font-weight:600;overflow-wrap:anywhere}
.admin-account small{display:block;margin-top:3px;line-height:1.5;overflow-wrap:anywhere}
.admin-self{margin-left:8px;padding:2px 8px;border-radius:999px;background:#eef2e7;color:#4f6040;font-size:12px}
.admin-accounts .danger{min-height:40px}
/* "Cách dịch" of the admin's jobs: the choice and its cost note in the upload form, its name in the job rows, and the
   choice beside "Bắt đầu dịch" on a job (that row wraps rather than run past the page). */
.form-grid .mode-hint{align-self:end;margin:0 0 6px;color:#5f645b;font-size:12px;line-height:1.6}
.job-mode{display:block;margin-top:5px;font-weight:400;color:#5f6f4e}
.job-actions{flex-wrap:wrap}
.run-mode{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.run-mode select{width:auto;margin-top:0;min-height:42px}
@media(max-width:680px){.admin-accounts li{flex-wrap:wrap}.admin-accounts .admin-account{flex-basis:calc(100% - 46px)}.admin-accounts .danger{margin-left:46px}.run-mode{white-space:normal}}