:root{--bg:#f6f3eb;--paper:#fffdf6;--ink:#293c35;--muted:#647b6d;--line:#dce4db;--accent:#347d62;font-family:'MaeMoo Thai',system-ui,sans-serif;color:var(--ink);background:var(--bg);font-size:18px}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg)}body[data-theme=white]{--bg:#fff;--paper:#fff}body[data-theme=mist]{--bg:#edf3ef;--paper:#f5faf7}header{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px max(18px,calc((100vw - 940px)/2));border-bottom:1px solid var(--line);background:var(--paper)}header>a{font-size:21px;font-weight:700;letter-spacing:-.5px}a{color:var(--accent);text-decoration:none}nav{display:flex;gap:6px}button,.button{border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:10px;padding:9px 14px;font:inherit;cursor:pointer;min-height:42px}button:hover,.button:hover{border-color:var(--accent)}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}main{max-width:820px;margin:auto;padding:40px 18px 80px}h1{font-size:clamp(28px,5vw,40px);line-height:1.35;letter-spacing:-.6px;margin:0 0 12px}.byline{font-size:14px;color:var(--muted);margin-bottom:30px}.reading-page{background:var(--paper);border-radius:12px;padding:clamp(20px,4vw,42px);margin:0 0 24px;line-height:1.9;display:flow-root;overflow-wrap:anywhere}.reading-page p{margin:0 0 1em}.reading-page img{max-width:100%;height:auto}.reading-page [style]{max-width:100%}.page-number{display:block;clear:both;font-size:12px;text-align:center;color:var(--muted);margin-top:32px}.hero{padding:14px 0 36px}.hero p{color:var(--muted);line-height:1.8}.book{display:block;color:var(--ink);padding:24px 0;border-top:1px solid var(--line)}.book h2{font-size:23px;margin:0 0 8px;line-height:1.5}.book p{font-size:17px;color:var(--muted);margin:0 0 10px;line-height:1.7}.book small{color:var(--muted);font-size:13px}footer{max-width:820px;margin:auto;padding:0 18px 36px;display:flex;gap:10px;flex-wrap:wrap}.empty{color:var(--muted);padding:30px 0}#reading-status{position:fixed;bottom:12px;right:16px;border:1px solid var(--line);padding:6px 12px;background:var(--paper);border-radius:20px;color:var(--muted);font-size:12px}#error{color:#903f33}@media(max-width:480px){header{padding:10px 12px}button,.button{padding:8px 10px;font-size:15px}main{padding-top:28px}.reading-page{padding:20px 17px}}@media print{header,footer,#reading-status{display:none}body{background:white}.reading-page{background:white;break-after:page;border-radius:0;padding:0}main{padding:0;max-width:none}.reading-page:last-child{break-after:auto}}
/* Shelf: quiet, editorial typography with book jackets rather than dashboard panels. */
.shelf-home{--shelf-width:1120px}.shelf-home header{padding:16px max(22px,calc((100vw - var(--shelf-width))/2));gap:16px}.brand{display:inline-flex;align-items:center;gap:10px}.brand svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linejoin:round}.write-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--accent);color:#fff;border-color:var(--accent)}.write-button svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.65;fill:none}.shelf-main{max-width:var(--shelf-width);padding:48px 22px 64px}.shelf-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:32px}.shelf-intro h1{font-size:clamp(32px,5vw,44px);letter-spacing:-1.1px;margin:8px 0}.shelf-intro p{font-size:16px;color:var(--muted);margin:0;line-height:1.7}.eyebrow{font-size:12px;letter-spacing:.8px;color:var(--accent);font-weight:600}.personal-link{font-size:14px;white-space:nowrap;padding-bottom:6px}.personal-link span{margin-left:12px}.featured{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:48px;padding:32px 36px;margin:0 0 40px;background:var(--paper);border:1px solid var(--line);border-radius:18px;align-items:center}.featured[hidden]{display:none}.feature-copy h2{font-size:clamp(24px,3vw,34px);line-height:1.5;margin:12px 0 14px;max-width:640px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.feature-copy p{max-width:560px;color:var(--muted);font-size:16px;line-height:1.85;margin:0 0 14px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.feature-meta{font-size:12px;color:var(--muted);margin-bottom:22px}.feature-read{display:inline-flex;align-items:center;gap:30px;font-size:15px;font-weight:600;border-bottom:1px solid var(--accent);padding-bottom:6px}.feature-read svg{width:21px;height:21px;stroke:currentColor;stroke-width:1.6;fill:none}.feature-jacket{display:block;padding:0 12px 0 0;transform:rotate(2deg);transition:transform .2s}.feature-jacket:hover{transform:rotate(0)}.shelf-cover{--cover:#dfebe3;--cover-ink:#2c5646;position:relative;aspect-ratio:4/5;background:var(--cover);color:var(--cover-ink);border-radius:3px 10px 10px 3px;overflow:hidden;box-shadow:inset 7px 0 0 #00000008,inset 8px 0 0 #ffffff55,0 10px 20px -15px #244d3c55;display:flex;flex-direction:column;justify-content:space-between;padding:24px 22px 20px 27px;transition:transform .2s,box-shadow .2s}.shelf-cover:after{content:"";position:absolute;inset:10px 9px 10px 15px;border:1px solid #ffffff55;border-radius:1px 6px 6px 1px;pointer-events:none}.tone-1{--cover:#e8ddcf;--cover-ink:#69543e}.tone-2{--cover:#dce6e9;--cover-ink:#3e5c67}.tone-3{--cover:#e4dfe9;--cover-ink:#61516b}.tone-4{--cover:#e9e5cb;--cover-ink:#67623b}.cover-brand{font-size:11px;letter-spacing:.6px;opacity:.8}.cover-title{font-size:clamp(20px,2.4vw,28px);font-weight:600;line-height:1.7;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;margin:20px 0}.cover-mark{align-self:flex-end;opacity:.55}.cover-mark svg{width:25px;height:25px;stroke:currentColor;stroke-width:1.2;fill:none}.with-image{padding:0;background:#dce7de}.shelf-cover img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}.shelf-controls{display:flex;gap:20px;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding:0 0 18px;margin-bottom:24px}.shelf-tabs{display:flex;gap:6px}.shelf-tabs button{border:0;background:transparent;font-size:14px;color:var(--muted);border-radius:24px;padding:9px 14px}.shelf-tabs button.selected{color:var(--accent);background:#347d6212;font-weight:600}.shelf-search{display:flex;align-items:center;gap:9px;padding:10px 13px;border:1px solid var(--line);border-radius:24px;max-width:300px;background:var(--paper)}.shelf-search svg{width:17px;height:17px;stroke:var(--muted);stroke-width:1.6;fill:none;flex-shrink:0}.shelf-search input{width:100%;min-width:0;border:0;outline:none;background:transparent;color:var(--ink);font:inherit;font-size:13px}.shelf-search:focus-within{outline:2px solid var(--accent);outline-offset:2px}.shelf-caption{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.shelf-caption h2{font-size:17px;font-weight:500;margin:0}.shelf-caption>span{color:var(--muted);font-size:12px}.book-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:26px;row-gap:36px}.book-card{min-width:0}.book-jacket{position:relative;margin-bottom:18px}.book-jacket>a{display:block}.book-jacket>a:hover .shelf-cover{transform:translateY(-4px);box-shadow:inset 7px 0 0 #00000008,0 16px 24px -16px #244d3c77}.save-book{position:absolute;top:11px;right:11px;width:35px;min-height:35px;height:35px;border-radius:50%;display:grid;place-items:center;padding:8px;background:var(--paper);border:0;box-shadow:0 1px 6px #182a1812;z-index:1;color:var(--muted)}.save-book svg{width:17px;height:17px;stroke:currentColor;stroke-width:1.5;fill:none}.save-book.is-saved{color:var(--accent)}.save-book.is-saved svg{fill:#347d6233}.book-title-link{display:block;min-height:44px;color:var(--ink)}.book-card h3{font-size:18px;font-weight:600;line-height:1.65;margin:0 0 7px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.book-excerpt{color:var(--muted);font-size:13px;line-height:1.8;margin:0 0 10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.book-meta{display:flex;justify-content:space-between;gap:6px;color:var(--muted);font-size:11px}.resume-label{color:var(--accent)}.book-progress{height:3px;background:var(--line);border-radius:3px;margin-top:12px;overflow:hidden}.book-progress span{display:block;height:100%;background:var(--accent);border-radius:3px}.shelf-empty{grid-column:1/-1;text-align:center;padding:55px 20px 65px;background:var(--paper);border:1px dashed var(--line);border-radius:16px}.shelf-empty>svg{width:55px;height:55px;stroke:var(--accent);stroke-width:1.1;fill:none;opacity:.65}.shelf-empty h3{font-size:21px;margin:20px 0 8px}.shelf-empty p{font-size:14px;color:var(--muted);margin:0 0 24px}.shelf-empty button,.shelf-empty .button{font-size:14px}.shelf-footer{display:flex;justify-content:space-between;max-width:1120px;padding:20px 22px 32px;border-top:1px solid var(--line);color:var(--muted);font-size:12px}.theme-menu{position:absolute;top:calc(100% - 3px);right:20px;z-index:10;padding:6px;background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px #263c3512;min-width:180px}.theme-menu[hidden]{display:none}.theme-menu button{display:flex;align-items:center;gap:10px;width:100%;border:0;font-size:14px;min-height:44px;text-align:left}.theme-menu button[aria-pressed=true]{color:var(--accent);font-weight:600}.theme-dot{width:18px;height:18px;border:1px solid #bfcbc2;border-radius:50%;background:#fff}.theme-dot.warm{background:#f6f3eb}.theme-dot.mist{background:#edf3ef}@media(max-width:800px){.book-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 20px}.featured{gap:28px;grid-template-columns:minmax(0,1fr) 210px;padding:28px}.shelf-controls{align-items:stretch;gap:12px;flex-wrap:wrap}.shelf-search{max-width:100%;flex:1;min-width:220px}.shelf-main{padding-top:32px}.cover-title{font-size:23px}}@media(max-width:540px){.shelf-home header{padding:12px 18px}.shelf-home header>a{font-size:20px}.brand svg{width:23px;height:23px}.shelf-main{padding:28px 18px 45px}.shelf-intro{align-items:flex-start;margin-bottom:26px}.shelf-intro h1{font-size:34px}.shelf-intro p{font-size:13px;max-width:220px}.personal-link{font-size:12px;padding-top:6px}.personal-link span{margin-left:3px}.featured{grid-template-columns:minmax(0,1fr) 118px;gap:15px;padding:22px 18px;margin-bottom:28px;border-radius:14px}.feature-copy h2{font-size:21px;-webkit-line-clamp:3;margin:8px 0 10px}.feature-copy p{display:none}.feature-meta{font-size:10px;margin-bottom:16px}.feature-read{font-size:13px;gap:15px}.featured .eyebrow{font-size:10px;letter-spacing:0}.feature-jacket{padding:0}.featured .shelf-cover{padding:16px 12px 14px 18px}.featured .cover-brand{font-size:8px}.featured .cover-title{font-size:15px;line-height:1.7;margin:10px 0}.featured .cover-mark svg{width:18px;height:18px}.book-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px}.shelf-controls{padding-bottom:16px;gap:15px}.shelf-tabs{gap:2px;justify-content:space-between;width:100%}.shelf-tabs button{font-size:13px;padding:9px 14px}.shelf-search{max-width:none;width:100%}.book-card .shelf-cover{padding:20px 15px 16px 22px}.book-card .cover-title{font-size:20px;margin:12px 0;line-height:1.7}.cover-brand{font-size:9px}.book-card h3{font-size:16px;line-height:1.65}.book-excerpt{font-size:12px}.book-meta{font-size:10px}.save-book{width:32px;height:32px;min-height:32px;top:9px;right:9px}.shelf-caption{margin-bottom:18px}.shelf-caption h2{font-size:16px}.shelf-footer{font-size:10px;padding:18px;gap:16px}.shelf-footer span:last-child{text-align:right}.shelf-empty{padding:40px 16px}.shelf-empty h3{font-size:19px}.shelf-empty p{font-size:12px}.theme-menu{right:18px}}
@media(prefers-reduced-motion:reduce){.shelf-cover,.feature-jacket{transition:none;transform:none!important}}@media print{.shelf-controls,.save-book,.personal-link,.feature-read{display:none}.shelf-home header{display:none}}

@media(max-width:540px){.featured .cover-title{font-size:14px;line-height:1.6;margin:6px 0}.featured .cover-mark{display:none}.featured .cover-brand{line-height:12px}}

.reading-page figure{max-width:100%;margin:0 0 1em;break-inside:avoid}.reading-page figure img{display:block;width:100%;height:auto;margin:0!important;float:none!important}.reading-page figcaption{font-size:.85em;line-height:1.6;color:var(--muted);text-align:center;margin:6pt 0 0;overflow-wrap:anywhere}