@font-face{font-family:TH Sarabun New;src:url(/fonts/THSarabunNew-Regular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:TH Sarabun New;src:url(/fonts/THSarabunNew-Bold.ttf) format("truetype");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:TH Sarabun New;src:url(/fonts/THSarabunNew-Italic.ttf) format("truetype");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:TH Sarabun New;src:url(/fonts/THSarabunNew-BoldItalic.ttf) format("truetype");font-weight:700;font-style:italic;font-display:swap}:root{--bg: #FFFFFF;--bg-soft: #F4F4F5;--bg-hover: #FAFAFA;--ink: #18181B;--ink-soft: #71717A;--ink-muted: #A1A1AA;--graphite: #27272A;--rule: #E4E4E7;--rule-strong: #D4D4D8;--accent: #2563EB;--font: "TH Sarabun New", "Tahoma", sans-serif}*{box-sizing:border-box;margin:0;padding:0}[hidden]{display:none!important}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body:has(.modal.open){overflow:hidden}body{background:var(--bg);color:var(--ink);font-family:var(--font);font-size:22px;line-height:1.5}img{display:block;max-width:100%}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;text-align:left;padding:0}a{color:inherit;text-decoration:none}.page{max-width:1280px;margin:0 auto;padding:2rem 2rem 8rem}.header{width:100%;aspect-ratio:5 / 1;background:var(--bg-soft);color:var(--graphite);border:1px solid var(--rule);display:flex;align-items:flex-end;justify-content:flex-start;padding:1.5rem 2rem;position:relative;overflow:hidden;transition:background .2s ease}.header:hover{background:#eeeeef}.header h1{font-family:var(--font);font-size:1.8rem;font-weight:400;line-height:1.2;letter-spacing:0}.toolbar{display:flex;justify-content:flex-end;align-items:center;gap:.5rem;padding:1.5rem 0 0}.toolbar-control{position:relative}.toolbar-btn{width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;color:var(--ink-soft);border-radius:.375rem;transition:background .15s ease,color .15s ease;position:relative}.toolbar-btn:hover{background:var(--bg-soft);color:var(--ink)}.toolbar-btn svg{width:1.25rem;height:1.25rem;display:block}.toolbar-control.open .toolbar-btn{background:var(--bg-soft);color:var(--ink)}.toolbar-dot{position:absolute;top:.4rem;right:.4rem;width:.4rem;height:.4rem;border-radius:50%;background:var(--accent);display:none}.toolbar-dot.active{display:block}.toolbar-popover{display:none;position:absolute;top:calc(100% + .5rem);right:0;min-width:200px;background:var(--bg);border:1px solid var(--rule);border-radius:.5rem;padding:.75rem 1rem;z-index:50;box-shadow:0 2px 4px #0000000a,0 12px 28px -10px #0000002e}.toolbar-control.open .toolbar-popover{display:block}.toolbar-popover--search{min-width:260px}.toolbar-popover input[type=search]{width:100%;border:0;font:inherit;color:inherit;background:transparent;outline:none;padding:.25rem 0;border-bottom:1px solid var(--rule)}.toolbar-popover input[type=search]:focus{border-bottom-color:var(--ink)}.toolbar-popover label{display:flex;align-items:center;gap:.5rem;padding:.0625rem 0;cursor:pointer;font-size:1.125rem;line-height:1.25;user-select:none}.toolbar-popover label:hover{color:var(--accent)}.toolbar-popover input[type=radio],.toolbar-popover input[type=checkbox]{cursor:pointer;accent-color:var(--accent)}.toolbar-popover .toolbar-empty{font-size:.875rem;color:var(--ink-soft);font-style:italic}.toolbar-popover--filter{min-width:240px}.filter-section+.filter-section{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--rule)}.filter-section h3{font-size:.875rem;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-soft);font-weight:700;margin-bottom:.375rem}.toolbar-reset{margin-top:.75rem;padding-top:.625rem;width:100%;border-top:1px solid var(--rule);font-size:.9375rem;color:var(--ink-soft);letter-spacing:.04em;text-transform:uppercase;text-align:center}.toolbar-reset:hover{color:var(--accent)}.result-count{padding:.75rem 0 0;font-size:.875rem;color:var(--ink-soft);text-align:right}.library-quote{margin:2rem 0 0;padding:1.25rem 1.5rem;background:var(--bg-soft);border-left:3px solid var(--ink-soft);border-radius:0 .375rem .375rem 0}.library-quote-text{font-style:italic;font-size:1.375rem;line-height:1;color:var(--ink);text-align:center}.library-quote-line{display:block}.quote-book-link{display:inline;font:inherit;color:inherit;background:none;border:0;padding:0;cursor:inherit}.library-quote-last{display:grid;grid-template-columns:1fr auto 1fr;align-items:baseline;gap:.5rem}.library-quote-last-text{grid-column:2;text-align:center}.library-quote-sig{grid-column:3;justify-self:end;font-style:italic;font-size:.9375rem;color:var(--ink-soft)}.grid{padding:2.5rem 0 0;column-count:2;column-gap:1.5rem}@media(min-width:640px){.grid{column-count:3}}@media(min-width:900px){.grid{column-count:4;column-gap:2rem}}@media(min-width:1200px){.grid{column-count:5}}.book{display:block;width:100%;margin-bottom:1.5rem;break-inside:avoid;-webkit-column-break-inside:avoid;page-break-inside:avoid;transition:transform .2s ease}@media(min-width:900px){.book{margin-bottom:2rem}}.book:hover{transform:translateY(-3px)}.book-cover{width:100%;aspect-ratio:var(--cover-aspect, 2 / 3);background:var(--cover-bg, var(--bg-soft));border-radius:2px;box-shadow:0 1px 2px #0000000d,0 12px 28px -10px #0000002e;overflow:hidden}.book-cover img{width:100%;height:100%;object-fit:cover}.book-cover.placeholder{display:flex;align-items:center;justify-content:center;font-family:var(--font);color:var(--ink-soft);font-size:.95rem;padding:1rem;text-align:center;border:1px solid var(--rule)}.modal{position:fixed;inset:0;background:#0f0f118c;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;padding:2rem 1rem;z-index:100;animation:fade .18s ease}.modal.open{display:flex}@keyframes fade{0%{opacity:0}to{opacity:1}}.modal-panel{background:var(--bg);max-width:640px;width:100%;max-height:90vh;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:3rem 2.5rem;position:relative;border:1px solid var(--rule);border-radius:.75rem;box-shadow:0 24px 48px -12px #00000040}@media(min-width:640px){.modal-panel{padding:3.5rem 3rem}}.modal-close{position:absolute;top:.5rem;left:1rem;font-size:1.875rem;line-height:1;color:var(--ink-soft);transition:color .15s ease;z-index:2}.modal-close:hover{color:var(--ink)}.modal-header{display:flex;align-items:flex-start;gap:1.5rem;margin-bottom:2rem}.modal-cover{flex:0 0 auto;width:110px;aspect-ratio:var(--cover-aspect, 2 / 3);background:var(--cover-bg, var(--bg-soft));border-radius:2px;box-shadow:0 1px 2px #0000000d,0 12px 28px -10px #0000002e;overflow:hidden}.modal-cover:empty{display:none}.modal-cover img{width:100%;height:100%;object-fit:cover}.modal-heading{flex:1 1 auto;min-width:0}.modal-title{font-family:var(--font);font-size:2rem;line-height:1.15;margin-bottom:.5rem;font-weight:700}.modal-author{font-size:1.125rem;color:var(--ink-soft);margin-bottom:0}.modal-meta{display:grid;grid-template-columns:120px 1fr;gap:.25rem 1.5rem;font-size:1.1875rem;margin-bottom:2rem;padding:1.25rem 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}.modal-meta dt{color:var(--ink-soft);text-transform:uppercase;letter-spacing:.08em;font-size:.875rem;padding-top:.25rem}.modal-meta dd{color:var(--ink)}.modal-note{font-family:var(--font);font-size:1.3125rem;line-height:1.5;color:var(--ink)}.modal-note.empty{color:var(--ink-soft);opacity:.55}.modal-note p{margin:0 0 1em}.modal-note p:last-child{margin-bottom:0}.modal-note em{font-style:italic}.modal-note strong{font-weight:700}.modal-note u{text-decoration:underline}.modal-note s{text-decoration:line-through}.modal-note code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--bg-soft);padding:.125em .375em;border-radius:3px;font-size:.9em}.modal-note a{color:var(--accent);text-decoration:underline}.modal-note a:hover{opacity:.75}.notes-modal-panel{max-width:720px;padding:2.5rem 2rem 2rem}.notes-thumb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:1rem}@media(min-width:640px){.notes-thumb-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}}.notes-letter{width:85%;margin:0 auto 2.5rem;font-size:1.375rem;line-height:1.65;color:#000}.notes-letter,.notes-letter p,.notes-letter strong,.notes-letter em,.notes-letter .notes-letter-greeting,.notes-letter .notes-letter-spoiler,.notes-letter .notes-letter-sig{color:#000}.notes-letter p{margin:0 0 .6em;text-indent:1.5em}.notes-letter p:last-child{margin-bottom:0}.notes-letter strong{font-weight:700}.notes-letter em{font-style:italic}.notes-letter-greeting{text-align:left;font-weight:400;text-indent:0!important;margin-bottom:.8em!important}.notes-letter-spoiler{letter-spacing:.02em;text-indent:0!important}.notes-letter-spoiler strong{letter-spacing:.1em;font-weight:700}.notes-letter-sig{text-align:right;font-style:italic;margin-top:1.2em!important;text-indent:0!important;line-height:1.4}.notes-thumb-btn{display:block;padding:0;width:100%;transition:transform .2s ease}.notes-thumb-btn:hover{transform:translateY(-2px)}.notes-modal{perspective:1800px}.notes-flipper{position:relative;width:100%;max-width:720px;height:90vh;transform-style:preserve-3d;transition:transform .65s cubic-bezier(.4,.2,.2,1)}.notes-flipper.flipped{transform:rotateY(180deg)}.notes-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}.notes-face--front{overflow-y:auto;-webkit-overflow-scrolling:touch;touch-action:pan-y;overscroll-behavior:contain}.notes-face--back{transform:rotateY(180deg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.875rem}.notes-flip-back{position:absolute;top:.5rem;left:1rem;color:var(--ink-soft);width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;border-radius:.25rem;transition:background .15s,color .15s}.notes-flip-back:hover{background:var(--bg-soft);color:var(--ink)}.notes-flip-back svg{width:1.25rem;height:1.25rem}.notes-detail-title{font-family:var(--font);font-size:2rem;font-weight:700;line-height:1.2;text-align:center;color:var(--ink);padding:0 1rem;word-break:break-word}.notes-detail-btn{display:inline-block;padding:.375rem 2rem;background:transparent;color:var(--graphite);border:1px solid var(--graphite);font-size:1.25rem;letter-spacing:.04em;border-radius:9999px;transition:background .15s,color .15s}.notes-detail-btn:hover{background:var(--graphite);color:var(--bg)}.notes-pass-input{width:min(260px,70%);padding:.5rem 1rem;font:inherit;font-size:1.0625rem;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--rule);text-align:center;outline:none;letter-spacing:.2em;transition:border-color .15s}.notes-pass-input:focus{border-bottom-color:var(--ink)}.notes-pass-input.shake{animation:shake .38s cubic-bezier(.36,.07,.19,.97)}@keyframes shake{10%,90%{transform:translate(-2px)}20%,80%{transform:translate(3px)}30%,50%,70%{transform:translate(-5px)}40%,60%{transform:translate(5px)}}.notes-pass-error{font-size:.875rem;color:#dc2626;margin-top:-.5rem}.notes-pass-hint{position:absolute;bottom:1.25rem;left:1.5rem;right:1.5rem;display:flex;flex-direction:column;align-items:center;gap:.125rem;text-align:center;font-size:.875rem;color:var(--ink-soft);font-style:italic;line-height:1.3}.notes-pass-hint-line2{font-size:.8125rem;opacity:.75}.pdf-modal{z-index:300}.pdf-modal-panel{width:92vw;max-width:1100px;height:92vh;max-height:92vh;padding:0;background:var(--bg);border-radius:.75rem;overflow:hidden;position:relative}.pdf-modal-panel .modal-close{position:absolute;top:.5rem;left:1rem;z-index:2;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;background:var(--bg);border-radius:.25rem}.pdf-frame{width:100%;height:100%;border:0;display:block}.note-thumb{aspect-ratio:1 / 1;background:var(--bg-soft);border-radius:4px;overflow:hidden;box-shadow:0 1px 2px #0000000a,0 8px 20px -8px #00000024}.note-thumb img{width:100%;height:100%;object-fit:cover}.note-thumb.placeholder{display:flex;align-items:center;justify-content:center;font-family:var(--font);color:var(--ink-soft);padding:.75rem;text-align:center;font-size:.875rem}.stats{margin-top:5rem;padding-top:3rem;border-top:1px solid var(--rule)}.stats-title{font-size:.875rem;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-soft);font-weight:700;margin-bottom:1.5rem}.stats-rows{display:flex;flex-direction:column;gap:0}.stats-row{display:grid;grid-template-columns:140px 1fr;gap:1rem;align-items:start}.stats-row-name{font-size:1rem;color:var(--ink)}.stats-dots{display:flex;flex-wrap:wrap;gap:.25rem;padding-top:.3rem}.stats-dot{width:.75rem;height:.75rem;border-radius:50%;display:inline-block;padding:0;border:0;cursor:pointer;transition:transform .15s ease,opacity .15s ease}.stats-dot:hover,.stats-dot:focus-visible{transform:scale(1.25);opacity:1}.stats-dot:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.stats-dot--incomplete{opacity:.6}@media(max-width:640px){.stats-row{grid-template-columns:90px 1fr;gap:.625rem}.stats-row-name{font-size:.875rem}.stats-dot{width:.625rem;height:.625rem}}.stats-total{margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--rule);font-size:.875rem;color:var(--ink-soft);letter-spacing:.08em;text-transform:uppercase;text-align:right}@media(max-width:760px){body{font-size:17px}.page{padding:1rem 1rem 4rem}.modal-panel{padding:2rem 1.25rem 1.5rem;max-width:100%}.notes-modal-panel{padding:5.25rem 1.25rem 1.5rem}.modal{padding:.5rem}.modal-header{margin-top:1.25rem;gap:1rem}.modal-cover{width:92px}.modal-title{font-size:1.625rem}.modal-meta{grid-template-columns:88px 1fr;gap:.25rem 1rem;font-size:1rem}.modal-meta dt{font-size:.75rem}.modal-note{font-size:1.125rem}.notes-detail-title{font-size:1.5rem;padding:0 .5rem}.notes-detail-btn{font-size:1rem;padding:.375rem 1.5rem}.modal.notes-modal{padding:0;perspective:none}.notes-flipper{width:100%;max-width:none;height:100vh;max-height:100vh;transform-style:flat;transform:none!important;transition:none}.notes-face{position:relative;inset:auto;backface-visibility:visible;-webkit-backface-visibility:visible}.notes-face--front{height:100vh;max-height:100vh;overflow-y:auto;-webkit-overflow-scrolling:touch;touch-action:pan-y;overscroll-behavior:contain}.notes-face--back{display:none;transform:none;min-height:100vh}.notes-flipper.flipped .notes-face--front{display:none}.notes-flipper.flipped .notes-face--back{display:flex}.notes-modal-panel{max-width:none;border-radius:0;box-shadow:none;border:0}.notes-modal .modal-close{position:fixed;top:.5rem;left:.75rem;right:auto;z-index:20;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;background:var(--bg);border:1px solid var(--rule);border-radius:50%;box-shadow:0 2px 6px #00000014}.notes-flip-back{position:fixed;top:.5rem;left:.75rem;z-index:20;background:var(--bg);border:1px solid var(--rule);box-shadow:0 2px 6px #00000014}.notes-letter{width:95%;font-size:1.125rem;line-height:1.55}.library-quote{padding:1rem 1.125rem;margin-top:1.5rem}.library-quote-text{font-size:1.125rem}.library-quote-last{grid-template-columns:1fr auto;gap:.375rem}.library-quote-last-text{grid-column:1}.library-quote-sig{grid-column:2;font-size:.75rem;white-space:nowrap}.header{padding:1rem 1.25rem}.header h1{font-size:1.375rem}.toolbar-btn{width:2.25rem;height:2.25rem}.toolbar-btn svg{width:1.125rem;height:1.125rem}.stats{margin-top:3rem;padding-top:2rem}}@media(max-width:420px){body{font-size:16px}.page{padding:.75rem .75rem 3rem}.modal-meta{grid-template-columns:78px 1fr}.header h1{font-size:1.25rem}}.empty-state{text-align:center;padding:6rem 2rem;color:var(--ink-soft);font-family:var(--font);font-size:1.125rem}