/* V0.5: shared visual layer; original page structure and data remain intact. */
:root {
  --paper:#f5f7fb; --white:#fff; --ink:#202632; --muted:#606c7d;
  --wine:#0765ce; --wine-deep:#004a9c; --tint:#eaf3ff; --line:#e0e6ee;
  --apricot:#309dac; --serif:var(--sans);
  --sans:-apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang SC","Microsoft YaHei",sans-serif;
}
html{color-scheme:light;scroll-padding-bottom:96px}
body{background:var(--paper);letter-spacing:.005em;isolation:isolate}
button,input,select,textarea{font-family:var(--sans)}
button,input,select{border-radius:12px}
button,a{touch-action:manipulation}
input,select{background:#fff;border-color:#d8e0e9;height:46px;box-shadow:0 1px 2px #172e4b03}
input::placeholder{color:#717c8c}
input:focus,select:focus,textarea:focus{border-color:#72abef}
:focus-visible{outline:3px solid #76aaf0;outline-offset:3px}
input[type=date]{display:block;inline-size:100%;min-inline-size:0;max-inline-size:100%;-webkit-appearance:none;appearance:none}
input[type=date]::-webkit-date-and-time-value{text-align:left;min-width:0}
input[type=date]::-webkit-datetime-edit{min-width:0;padding:0}
h1{font-family:var(--sans);font-weight:700;letter-spacing:-.04em;font-size:2.65rem;line-height:1.2}
h2,h3{letter-spacing:-.025em}
.title-stop{color:#78b6eb}
.eyebrow{color:#487696;letter-spacing:.14em;font-size:.75rem;font-weight:600}
.intro-text{color:var(--muted);line-height:1.7}
.site-header{max-width:1216px;padding:19px 32px;border-bottom:1px solid #dfe6efb3;gap:18px}
.identity{color:var(--ink);font-weight:650;gap:12px;white-space:nowrap}
.identity-mark{width:38px;height:38px;border:1px solid #ffffffb3;border-radius:12px;background:linear-gradient(145deg,#2689f0,#1263d2);box-shadow:0 4px 12px #1263d224;color:white;font:650 1.05rem/1 var(--sans);letter-spacing:-.06em}
.identity-divider{color:#b4bfce;margin:0 7px}
.header-nav{gap:8px;flex-wrap:wrap;align-items:center}
.header-nav a{padding:8px 13px;border-radius:10px;font-size:.8125rem;border:0}
.header-nav .current{color:var(--wine);background:#e6effc;border:0}
.header-nav a:hover{color:var(--wine);background:#eaf1fb}
.header-nav .text-button{margin-left:8px;padding:8px;text-decoration:none;color:var(--muted);font-size:.75rem}
.library-main{max-width:1216px;padding:0 32px 36px}
.room-intro{padding:38px 0 32px;gap:32px}
.collection-note{border-left:1px solid var(--line);padding-left:24px}
.collection-note strong{font-weight:600;color:#435a72}
.section-heading{margin-bottom:15px}
.section-heading h2{font-size:1.25rem}
.shelf-count{font-family:var(--sans);font-size:.75rem;background:#e6edf6;border-radius:8px;padding:3px 8px;vertical-align:middle;color:#526479}
.shelf-note{color:#758094}
.finder{margin-bottom:18px}
.finder-main{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}
.finder .search-field{display:block;min-width:0}
.finder .search-field input{padding-left:16px;height:48px;background:#ffffffd9;border-radius:14px}
.filter-toggle{height:48px;display:flex;gap:8px;align-items:center;justify-content:center;padding:10px 16px;border:1px solid #d8e0e9;background:#fff;border-radius:14px;font-size:.875rem;min-width:105px}
.filter-toggle svg{width:19px;height:19px;flex-shrink:0}
.filter-toggle[aria-expanded=true]{background:var(--tint);border-color:#a6c9f5}
.chevron{margin-left:0}
.more-filters{background:#eef3fa;border:1px solid var(--line);border-radius:16px;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding:18px;margin-top:12px}
.more-filters label{min-width:0;max-width:100%;font-size:.75rem;gap:7px}
.more-filters input,.more-filters select{width:100%;min-width:0;max-width:100%}
.filter-feedback{min-height:28px;margin-top:7px}
.filter-feedback p,.filter-feedback .text-button{font-size:.75rem}
.active-filters{gap:6px}
.active-filters:has(button){margin-top:8px}
.active-filters button{background:#e2edfc;color:#235994;border-radius:9px;padding:6px 10px;min-height:32px}
.book-grid{gap:20px}
.book{background:#ffffffed;border:1px solid #e3e9f1;border-radius:22px;padding:25px 26px 20px;box-shadow:0 4px 18px #1f426607;overflow:hidden}
.book::before{display:none}
.book-top{margin-bottom:15px}
.grade-badge{background:#eaf3ff;color:#145cab;border:1px solid #cfe1f9;border-radius:10px;font-size:1rem;font-weight:700;padding:5px 11px;letter-spacing:-.02em}
.type-badge{color:#367279;background:#eff9f8;border-color:#d6eae7;border-radius:10px;font-size:.75rem;padding:5px 9px}
.type-badge .resource-icon{width:17px;height:17px}
.book-subheading{margin-bottom:8px}
.book-category{color:#5b7796;font-size:.75rem;letter-spacing:0}
.book-state{font-size:.6875rem;color:#737f8e}
.book h3{font-family:var(--sans);font-size:1.4rem;line-height:1.4;font-weight:650;letter-spacing:-.025em;margin-bottom:10px}
.book-meta{font-size:.75rem;color:#69768a;margin-bottom:12px}
.book-meta span+span::before{color:#bcc8d7}
.book-summary{font-size:.875rem;color:#5a6678;line-height:1.85;margin-bottom:16px}
.book-tags{gap:6px;margin-bottom:20px}
.book-tags span{background:#f1f5f9;color:#627186;border-radius:6px;font-size:.6875rem;padding:3px 8px}
.book-actions{gap:12px 16px}
.primary-button{border-radius:11px;background:#0969d5;box-shadow:0 2px 5px #0969d51a;gap:12px;padding:10px 16px;min-height:42px;font-weight:500}
.primary-button:hover{background:#005bc1}
.secondary-link{font-size:.8125rem}
.book-origin{border-color:#ebeff5;color:#738095;margin-top:19px;padding-top:12px;font-size:.6875rem}
.book-info{font-size:.75rem}
.book-info summary{color:#68778b}
.empty-state{border-radius:20px;padding:38px 24px}
.notebook-mode{background:#eaf0f8;border:1px solid #e0e7f0;color:#586b82;border-radius:14px;padding:14px 18px;margin:26px 0 0;font-size:.75rem}
.notebook-mode:empty{display:none}
.site-footer{margin-top:26px;border-color:var(--line);padding-top:20px}
.site-footer nav{gap:18px;flex-wrap:wrap;font-size:.75rem}
.footer-name,.footer-version{color:#748197}
/* Reading, writing, collection and login use the same surfaces. */
.reading-main{padding:24px 32px 40px}
.reading-paper{border-radius:22px;border-color:#e0e7ef;box-shadow:0 4px 20px #284c7106}
.reading-title h1{font-size:2rem;font-weight:650;letter-spacing:-.03em;line-height:1.4}
.reading-nav{margin-bottom:22px}
.outline{border-color:#d8e2ef}
.outline a:hover,.outline a[aria-current=location]{background:#eaf2fc;border-color:var(--wine)}
.prose{color:#354152}
.prose h2{font-family:var(--sans);font-weight:650}
.record-basics{background:#f3f6fb;border-color:#e3e9f2;border-radius:12px}
.record-basics summary{color:#586e88}
.type-controls button[aria-pressed=true]{border-color:#a9cbf3;background:#eaf3ff}
.note-panel,.journal-page .note-panel{background:#fff;border-color:#dfe7f0;border-radius:20px;box-shadow:0 3px 16px #24456306}
.note-panel-heading h2,.journal-writing>h2,.notes-dialog h2{font-family:var(--sans);font-weight:650}
.note-panel textarea{border-color:#d2deec;border-radius:13px;background:#fbfcfe}
.note-location label,.note-save-row p{color:#64738a}
.note-location button,.note-tools button,.week-source-actions button{background:#edf3fb;color:#3f618b;border-radius:9px}
.note-prompts button{border-color:#d9e5f4;color:#4d6d94;border-radius:8px}
.note-panel textarea:disabled{background:#f0f3f7}
.note-save-row .primary-button{min-height:40px}
.note-message,.auth-warning{background:#fff6e5;color:#775a29;border-color:#ecd6ad}
.notes-dialog{border-color:#d7e1ee;border-radius:20px;box-shadow:0 20px 90px #132c462b}
.notes-dialog::backdrop{background:#15263b60;backdrop-filter:blur(4px)}
.dialog-actions button:not(.primary-button):not(.danger-button){background:#edf2f8}
.journal-main{max-width:1216px;padding:32px}
.journal-intro{margin-bottom:28px}
.journal-intro h1{font-size:2.4rem}
.journal-mode{gap:4px;background:#e8eef6;padding:4px;border-radius:13px}
.journal-mode button{border:0;border-radius:10px;flex:1;white-space:nowrap}
.journal-mode button[aria-pressed=true]{color:var(--wine);background:#fff;box-shadow:0 2px 5px #1e385a0d}
.journal-entry{border-radius:12px}
.journal-archive{margin-top:20px}
.journal-archive summary{font-size:.8125rem;color:#536b88;cursor:pointer;margin-bottom:12px}
.week-sources{border-radius:15px;border-color:#d6e4f4;background:#edf4fd}
.week-sources span,.week-sources p,.week-sources summary{color:#5e7390}
.week-sources pre{border-radius:10px;background:#fff}
.collection-upload{border-radius:20px;max-width:760px;box-shadow:0 4px 18px #24456306}
.attachment-card{border-radius:18px;padding:20px;border-color:#dfe7f0}
.upload-box input[type=file]{border-radius:11px;background:#f4f7fc}
.attachment-actions button{border-radius:8px}
.login-page{padding:32px;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}
.login-card{width:min(100%,450px);padding:38px;background:#ffffffed;border-color:#e1e8f0;border-radius:26px;box-shadow:0 16px 60px #244e7810}
.login-card .identity-mark{margin-bottom:26px;width:46px;height:46px;border-radius:15px;font-size:1.2rem}
.login-card h1{font-size:2rem;line-height:1.3}
.login-card .eyebrow{font-size:.6875rem}
.login-card .intro-text{font-size:.875rem}
.login-card form{gap:9px;margin-top:24px}
.login-card input{height:48px}
.login-card button{margin-top:16px}
.login-note{color:#738095;font-size:.75rem;margin-top:22px}
/* Decorative dots have no hit area and never sit above reading or controls. */
.room-ambience{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;contain:strict;background:radial-gradient(ellipse at 8% 5%,#dbeaff70,transparent 43%),radial-gradient(ellipse at 95% 32%,#def5f24d,transparent 42%)}
.room-ambience i{position:absolute;width:5px;height:5px;border-radius:50%;background:#79a6de;opacity:.2;animation:room-float 22s ease-in-out infinite alternate}
.room-ambience i:nth-child(1){left:5%;top:18%;animation-delay:-4s}
.room-ambience i:nth-child(2){left:21%;top:49%;width:3px;height:3px;animation-delay:-12s}
.room-ambience i:nth-child(3){left:43%;top:10%;animation-delay:-17s}
.room-ambience i:nth-child(4){left:68%;top:32%;width:4px;height:4px;animation-delay:-7s}
.room-ambience i:nth-child(5){left:91%;top:14%;animation-delay:-19s}
.room-ambience i:nth-child(6){left:97%;top:71%;width:3px;height:3px;animation-delay:-2s}
.room-ambience i:nth-child(7){left:13%;top:84%;animation-delay:-11s}
.room-ambience i:nth-child(8){left:79%;top:92%;width:4px;height:4px;animation-delay:-14s}
@keyframes room-float{from{transform:translate3d(0,0,0)}to{transform:translate3d(12px,-28px,0)}}
.room-motion-paused .room-ambience i{animation-play-state:paused}
.motion-toggle{display:block;margin:18px auto 12px;padding:7px 11px;min-height:32px;background:transparent;color:#64758b;font-size:.6875rem;border-radius:9px}
.motion-toggle:hover{background:#e7eef8}
@media(hover:hover) and (min-width:1000px){.book:hover{border-color:#bdd5f2;box-shadow:0 10px 28px #244d7b0d}}
@media(max-width:980px){.site-header,.library-main{padding-left:24px;padding-right:24px}.header-nav{gap:3px}.header-nav a{padding:7px 9px}.more-filters{grid-template-columns:repeat(3,minmax(0,1fr))}.journal-main{padding:26px 24px}.room-intro{padding:30px 0}.collection-note{display:none}}
@media(max-width:720px){
 .site-header{padding:12px 18px;min-height:64px;align-items:center;flex-wrap:nowrap;gap:10px}
 .identity{font-size:.8125rem;gap:9px}.identity-mark{width:34px;height:34px;font-size:.9375rem;border-radius:11px}
 .header-nav{margin-left:auto;gap:0;flex-wrap:nowrap}.header-nav a,.header-nav>.footer-version{display:none}
 .header-nav .text-button{margin:0;font-size:.6875rem;min-height:36px;padding:8px}
 .library-main{padding:0 18px 24px}.room-intro{padding:23px 0 21px}
 .room-intro h1{font-size:1.85rem;line-height:1.2;margin-bottom:8px}
 .eyebrow{font-size:.625rem;margin-bottom:7px;letter-spacing:.14em}
 .intro-text{font-size:.8125rem}.shelf-note{display:none}
 .section-heading{margin-bottom:12px;gap:12px}.section-heading h2{font-size:1.0625rem}
 .finder-main{grid-template-columns:minmax(0,1fr) auto;gap:8px}.finder .search-field{grid-column:auto}
 .finder .search-field input{height:44px;padding:8px 12px;font-size:16px;border-radius:12px}
 .filter-toggle{height:44px;min-width:82px;padding:8px 11px;grid-column:auto;justify-self:stretch;font-size:.75rem;gap:5px;border-radius:12px}
 .filter-toggle svg{width:17px;height:17px}.filter-toggle .chevron{display:none}
 .more-filters{grid-template-columns:repeat(2,minmax(0,1fr));padding:13px;gap:12px;border-radius:14px}
 .more-filters input,.more-filters select{font-size:16px;height:44px;padding:8px;min-width:0}
 .filter-feedback{margin-top:5px;min-height:27px}.filter-feedback p{font-size:.6875rem}.finder{margin-bottom:12px}
 .book-grid{grid-template-columns:minmax(0,1fr);gap:15px}
 .book{padding:20px;border-radius:19px}.book-top{margin-bottom:12px}.book h3{font-size:1.3rem;line-height:1.45;margin-bottom:10px}
 .book-subheading{margin-bottom:8px}.book-summary{font-size:.875rem;margin-bottom:14px}.book-meta{font-size:.6875rem}
 .book-actions{gap:11px 15px}.book-actions .primary-button{min-height:42px;padding:9px 13px}.book-actions .secondary-link{font-size:.75rem}
 .book-tags{margin-bottom:17px}.book-origin{margin-top:16px}.grade-badge{font-size:.9375rem;padding:4px 10px}
 .notebook-mode{padding:14px;font-size:.75rem;gap:10px;margin-top:20px}.notebook-mode>span:last-child{gap:14px}
 .site-footer{margin-top:20px}.site-footer nav{gap:12px 16px;font-size:.6875rem}
 .cloud-bottom-nav{display:flex;position:fixed;left:12px;right:12px;bottom:max(9px,env(safe-area-inset-bottom));padding:6px;gap:5px;border:1px solid #dfe7f0;border-radius:20px;background:#ffffffeb;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 5px 25px #1e446512;z-index:15}
 .cloud-bottom-nav a{flex:1;text-align:center;border-radius:14px;font-size:.75rem;padding:9px 10px;color:#67778e;text-decoration:none;min-height:40px}
 .cloud-bottom-nav a.current{background:#eaf3ff;color:#075cb9;border-radius:14px;font-weight:600}
 body:not(.login-page){padding-bottom:calc(78px + env(safe-area-inset-bottom))}
 .login-page{padding:24px 18px;min-height:100svh}.login-card{padding:30px 25px;border-radius:23px}.login-card h1{font-size:1.75rem}
 .login-page>.motion-toggle{position:static;margin:0}
 .reading-main{padding:17px 18px 30px}.reading-nav{font-size:.75rem;gap:12px;margin-bottom:18px}.reading-actions{gap:10px 14px}
 .reading-actions .primary-button{font-size:.75rem}.reading-paper,.notes-open .reading-paper{padding:23px 20px;border-radius:19px}
 .reading-title h1{font-size:1.65rem}.reading-title .original-title{font-size:.75rem}.reading-badges{font-size:.75rem}
 .prose{font-size:1rem}.record-basics{padding:12px}.reading-controls{margin:16px 0 22px}
 .note-panel,.journal-page .note-panel{padding:20px;border-radius:19px}.note-panel textarea{font-size:16px}
 .journal-main{padding:24px 18px}.journal-intro{margin-bottom:22px}.journal-intro h1{font-size:1.85rem}
 .journal-layout{display:flex;flex-direction:column;gap:20px}.journal-sidebar{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px 12px}
 .journal-mode{grid-column:1/-1;margin-bottom:5px}.journal-mode button{font-size:.8125rem;min-height:40px}
 .journal-sidebar>label{grid-column:1/-1;margin:0}.journal-sidebar>input{grid-column:1;min-width:0}.journal-sidebar>#journalToday{grid-column:2;align-self:center}
 .journal-archive{grid-column:1/-1;margin-top:5px}.journal-archive summary{margin:0;padding:7px 0}.journal-writing{width:100%}
 .journal-writing>h2{font-size:1.125rem}.journal-page .note-panel textarea{min-height:300px}
 .collection-upload{padding:20px;border-radius:19px;margin-bottom:28px}.attachment-grid{grid-template-columns:minmax(0,1fr)}
 .collection-results .section-heading h2{font-size:1.0625rem}.collection-upload>input{max-width:100%}
 .room-ambience i:nth-child(even){display:none}.room-ambience i{opacity:.16;animation-duration:28s}
}
@media(max-width:360px){.more-filters{grid-template-columns:minmax(0,1fr)}.book{padding:17px}.identity-divider{margin:0 4px}.intro-text{font-size:.75rem}.book-actions{gap:11px 12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important}.room-ambience i{animation:none;display:none}.motion-toggle{display:none}button,a,.chevron{transition:none}}
@media print{.room-ambience,.motion-toggle,.cloud-bottom-nav{display:none!important}body{background:#fff;padding-bottom:0}.book,.reading-paper,.note-panel{box-shadow:none}}