.reader-header{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px;flex-wrap:wrap}.reader-header h1{font-size:25px;margin:0}.segmented{display:flex;align-items:center;background:var(--surface);padding:3px;border-radius:6px}.segmented button{font-size:12px;padding:7px 12px}.segmented button.active{background:var(--paper);box-shadow:0 1px 4px #4A3F4B15}.reader-layout{display:grid;grid-template-columns:minmax(0,1fr) 200px;gap:24px;align-items:start}.reader-rail{position:sticky;top:20px;border-left:1px solid var(--line);padding-left:18px;max-height:75vh;overflow:auto}.reader-rail h3{font-size:12px;margin-bottom:14px}.ribbon{display:flex;width:100%;text-align:left;align-items:flex-start;justify-content:flex-start;padding:10px 7px;border-bottom:1px solid #EADFE3;border-radius:0;font-family:var(--serif);font-size:13px;line-height:1.7;overflow-wrap:anywhere}.ribbon svg{width:12px;margin-top:3px;color:var(--accent)}.reader-surface{padding:30px 36px;min-width:0;min-height:450px}.reader-surface.paper{background:#FAF6EF;border:1px solid #E7DFD5;background-image:url('/assets/paper.png');box-shadow:0 3px 14px #4A3F4B08}.reader-surface.letter{background:var(--night);color:#E8DDE5;padding:35px 45px}.reader-surface.timeline{padding:10px 0}.reader-entry{padding:20px 0;border-bottom:1px solid #D8C2C74D;scroll-margin-top:25px;break-inside:avoid;min-width:0}.reader-entry.focused{outline:2px solid var(--accent);outline-offset:6px}.reader-entry .entry-meta{display:flex;gap:10px;align-items:center;justify-content:space-between;font-size:10px;color:var(--muted);line-height:1.7}.reader-entry .entry-text{font-family:var(--serif);font-size:17px;line-height:2;white-space:pre-wrap;overflow-wrap:anywhere;margin-top:12px}.reader-entry .entry-actions{display:flex;gap:4px;justify-content:flex-end;margin-top:10px}.reader-entry .entry-actions button{font-size:10px;padding:4px 7px;color:var(--muted)}.reader-entry .entry-actions svg{width:13px;height:13px}.reader-entry .inline-note{padding:12px 14px;border-left:2px solid var(--accent);margin-top:12px;font-size:12px;line-height:1.8;background:#9E737A0D;white-space:pre-wrap}.reader-entry mark{background:#E5D4D7;color:#4A3F4B;text-decoration:underline;text-underline-offset:4px}.reader-surface.letter .entry-text{line-height:2.25}.reader-surface.letter .entry-meta,.reader-surface.letter .entry-actions button{color:#BBA9B6}.reader-surface.timeline .reader-entry{padding:14px 20px;border-left:1px solid var(--line);margin-left:8px}.reader-surface.double{display:grid;grid-template-columns:1fr 1fr;gap:0 34px}.reader-surface.double .reader-entry{font-size:15px}.reader-surface.double .entry-text{font-size:16px}.reader-filter{display:grid;grid-template-columns:minmax(0,1fr) 165px 165px;gap:12px;margin-bottom:20px}.reader-filter select,.reader-filter input{font-size:12px}.reader-pager{display:flex;align-items:center;gap:14px;justify-content:center;margin-top:20px}.reader-pager small{font-size:11px}@media(max-width:1000px){.reader-layout{grid-template-columns:minmax(0,1fr) 160px;gap:16px}.reader-surface{padding:20px}.reader-surface.double{gap:0 20px}.reader-surface.letter{padding:25px}.reader-filter{grid-template-columns:1fr 140px}}@media(max-width:760px){.reader-layout{grid-template-columns:1fr}.reader-rail{position:static;order:-1;border-left:0;border-bottom:1px solid var(--line);padding:0 0 10px;max-height:145px}.reader-rail h3{margin-bottom:5px}.reader-rail>div{display:flex;overflow:auto;gap:8px}.ribbon{flex:0 0 160px;font-size:12px;border:0;background:var(--surface);padding:8px}.reader-surface.double{display:block}.reader-filter{grid-template-columns:1fr 1fr}.reader-filter input{grid-column:1/-1}.reader-surface{padding:18px}.reader-surface.letter{padding:22px}.reader-entry .entry-text{font-size:17px}.segmented button{font-size:11px;padding:7px 9px}.reader-header h1{font-size:23px}}
