:root{--desk-bg: #F0EBE1;--paper-bg: #FDFBF7;--ink-main: #2C2A29;--ink-light: #5A5755;--accent-color: #8C2121;--accent-muted: rgba(140, 33, 33, .05);--border-line: #E2DFD8;--shadow-sm: 0 2px 8px rgba(0,0,0,.04);--shadow-md: 0 12px 24px rgba(0,0,0,.06);--shadow-lg: 0 25px 50px rgba(0,0,0,.08);--font-heading: "Noto Serif Thai", serif;--font-body: "Sarabun", sans-serif;--transition: .4s cubic-bezier(.16, 1, .3, 1)}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;font-size:18px}body{background-color:var(--desk-bg);color:var(--ink-main);font-family:var(--font-body);line-height:1.8;background-image:url('data:image/svg+xml,%3Csvg width="100" height="100" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="noise"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="3" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100" height="100" filter="url(%23noise)" opacity="0.06"/%3E%3C/svg%3E')}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:600;color:var(--ink-main);line-height:1.4}a{color:var(--accent-color);text-decoration:none;transition:var(--transition)}a:hover{color:var(--ink-main)}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--desk-bg)}::-webkit-scrollbar-thumb{background:#d1cdcd;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#a39e9e}.book-container{max-width:800px;margin:40px auto;padding:60px 50px;background-color:var(--paper-bg);box-shadow:var(--shadow-lg),0 0 0 1px #00000005;position:relative;border-radius:4px}.book-container:before,.book-container:after{content:"";position:absolute;bottom:15px;width:40%;height:20px;box-shadow:0 15px 10px #00000014;z-index:-1;transition:var(--transition)}.book-container:before{left:20px;transform:rotate(-2deg)}.book-container:after{right:20px;transform:rotate(2deg)}.book-header{text-align:center;margin-bottom:80px;padding-bottom:40px}.book-title{font-size:3.5rem;letter-spacing:-.02em;margin-bottom:10px;text-shadow:1px 1px 0px rgba(255,255,255,1),-1px -1px 0px rgba(0,0,0,.05)}.book-subtitle{font-family:var(--font-heading);font-size:1.4rem;color:var(--ink-light);font-style:italic;margin-bottom:30px}.header-divider{width:60px;height:2px;background-color:var(--accent-color);margin:0 auto 30px;box-shadow:0 2px 4px #8c212133}.book-author{font-size:1rem;letter-spacing:1px;text-transform:uppercase;color:var(--ink-light)}.table-of-contents{margin-bottom:80px;padding:40px;background-color:#fafaf7;border:1px solid var(--border-line);box-shadow:inset 0 2px 10px #00000005,var(--shadow-sm);border-radius:4px}.table-of-contents h2{font-size:1.8rem;margin-bottom:20px;text-align:center}.table-of-contents ul{list-style:none}.table-of-contents li{margin-bottom:12px;font-size:1.1rem}.table-of-contents a{color:var(--ink-main);border-bottom:1px dotted var(--border-line);display:block;padding-bottom:4px}.table-of-contents a:hover{color:var(--accent-color);border-bottom-color:var(--accent-color);transform:translate(4px)}.chapter{margin-bottom:60px}.chapter-header{text-align:center;margin-bottom:40px}.chapter-number{display:block;font-family:var(--font-heading);color:var(--accent-color);font-size:1.1rem;letter-spacing:2px;margin-bottom:10px}.chapter-header h2{font-size:2.5rem;text-shadow:1px 1px 0px rgba(255,255,255,1)}.drop-cap:first-letter{font-family:var(--font-heading);font-size:4rem;float:left;line-height:1;margin-right:12px;margin-top:-6px;color:var(--accent-color);text-shadow:2px 2px 4px rgba(0,0,0,.1)}.chapter>p{margin-bottom:24px;text-align:justify;text-justify:inter-word}.chapter-separator{text-align:center;font-family:var(--font-heading);letter-spacing:8px;color:var(--border-line);margin:60px 0;font-size:1.5rem}.book-quote{font-family:var(--font-heading);font-size:1.4rem;font-style:italic;color:var(--ink-light);margin:40px 0;padding:30px;background:linear-gradient(to right,var(--accent-muted),transparent);border-left:4px solid var(--accent-color);box-shadow:inset 2px 0 5px #00000005;border-radius:0 8px 8px 0}.book-quote footer{font-family:var(--font-body);font-size:1rem;font-style:normal;margin-top:15px;color:var(--ink-main);font-weight:500}.concept-list{margin-top:40px;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.concept-item{padding:24px;border:1px solid var(--border-line);background-color:#fff;cursor:pointer;position:relative;border-radius:6px;box-shadow:var(--shadow-sm);transition:var(--transition);display:flex;flex-direction:column}.concept-item:hover{border-color:var(--ink-light);transform:translateY(-4px) scale(1.01);box-shadow:var(--shadow-md)}.concept-item h3{font-size:1.3rem;margin-bottom:8px;color:var(--accent-color)}.concept-item p{color:var(--ink-light);font-size:.95rem;margin-bottom:12px;flex:1}.read-more{font-size:.85rem;text-transform:uppercase;letter-spacing:1px;color:var(--ink-main);font-weight:600;display:inline-block;border-bottom:1px solid transparent;transition:var(--transition);align-self:flex-start}.concept-item:hover .read-more{color:var(--accent-color);border-bottom-color:var(--accent-color)}.dictionary-style{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--border-line);margin-top:20px}.dictionary-style .concept-item{border:none;border-bottom:1px solid var(--border-line);padding:20px 0;background-color:transparent;box-shadow:none;border-radius:0}.dictionary-style .concept-item:hover{transform:translate(8px);box-shadow:none;background-color:transparent;border-bottom-color:var(--ink-main)}.dictionary-style strong{font-family:var(--font-heading);font-size:1.1rem;color:var(--ink-main)}.dictionary-style span{color:var(--ink-light);font-size:.95rem}.subsection-title{margin-top:50px;font-size:1.5rem;border-bottom:1px solid var(--border-line);padding-bottom:10px}.book-footer{text-align:center;margin-top:80px;padding-top:40px;color:var(--ink-light);font-size:.9rem}.book-footer .year{font-family:var(--font-heading);margin-top:10px;letter-spacing:2px}.footnote-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#2c2a2966;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:all .4s ease}.footnote-overlay.active{opacity:1;visibility:visible}.footnote-content{background:var(--paper-bg);border:1px solid var(--border-line);padding:50px;width:90%;max-width:650px;position:relative;transform:translateY(30px) scale(.98);transition:all .4s cubic-bezier(.16,1,.3,1);box-shadow:0 30px 60px #00000026;max-height:85vh;overflow-y:auto;border-radius:8px}.footnote-overlay.active .footnote-content{transform:translateY(0) scale(1)}.footnote-close{position:absolute;top:20px;right:25px;background:#fff;border:1px solid var(--border-line);border-radius:50%;width:40px;height:40px;font-size:1.5rem;color:var(--ink-light);cursor:pointer;transition:var(--transition);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm)}.footnote-close:hover{color:var(--accent-color);border-color:var(--accent-color);transform:rotate(90deg)}.footnote-header{margin-bottom:30px;border-bottom:2px solid var(--border-line);padding-bottom:20px}.footnote-label{font-size:.8rem;text-transform:uppercase;letter-spacing:2px;color:var(--accent-color);display:block;margin-bottom:10px;font-weight:600}.footnote-header h2{font-size:2rem}.footnote-body{font-size:1.05rem;line-height:1.8;color:var(--ink-main)}.footnote-body p{margin-bottom:20px;text-align:justify}.footnote-body ul{margin-left:20px;margin-bottom:20px}.footnote-body li{margin-bottom:10px}.flashcard-container{display:flex;flex-direction:column;align-items:center;gap:30px;margin-top:40px}.flashcard{background-color:transparent;width:100%;max-width:500px;height:300px;perspective:1000px;cursor:pointer}.flashcard-inner{position:relative;width:100%;height:100%;text-align:center;transition:transform .6s cubic-bezier(.4,.2,.2,1);transform-style:preserve-3d;box-shadow:var(--shadow-md);border-radius:8px}.flashcard.flipped .flashcard-inner{transform:rotateY(180deg)}.flashcard-front,.flashcard-back{position:absolute;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;background-color:#fff;border:1px solid var(--border-line);border-radius:8px}.flashcard-front{background-image:repeating-linear-gradient(transparent,transparent 27px,#e5e5f7 27px,#e5e5f7 28px);background-position:0 40px}.flashcard-front h3{font-size:2rem;color:var(--accent-color);background:#fff;padding:0 10px}.click-hint{position:absolute;bottom:20px;font-size:.8rem;color:var(--ink-light);text-transform:uppercase;letter-spacing:2px;background:#fff;padding:0 5px}.flashcard-back{transform:rotateY(180deg);background-color:#fafaf7}.flashcard-back p{font-size:1.2rem;color:var(--ink-main);line-height:1.6}.flashcard-controls{display:flex;align-items:center;gap:15px;flex-wrap:wrap;justify-content:center}.fc-btn{padding:10px 20px;background-color:#fff;border:1px solid var(--border-line);border-radius:4px;font-family:var(--font-body);font-size:1rem;color:var(--ink-main);cursor:pointer;transition:var(--transition);box-shadow:var(--shadow-sm)}.fc-btn:hover{border-color:var(--ink-main);transform:translateY(-2px);box-shadow:var(--shadow-md)}.fc-shuffle-btn{background-color:#fafaf7;color:var(--accent-color);font-weight:600}.fc-counter{font-family:var(--font-heading);font-size:1.1rem;min-width:60px;text-align:center}#references p{font-size:.9rem;color:var(--ink-light)}#references .dictionary-style .concept-item{padding:12px 0}#references .dictionary-style strong{font-size:.95rem}#references .dictionary-style span{font-size:.85rem}.affiliate-link{color:inherit;text-decoration:none}.affiliate-link:hover{text-decoration:underline;color:var(--accent-color)}.affiliate-item{transition:var(--transition)}.affiliate-item:hover{background-color:var(--accent-muted);border-radius:4px}@media (max-width: 768px){body{padding:0}.book-container{margin:0;padding:40px 20px;border-radius:0;box-shadow:none}.book-container:before,.book-container:after{display:none}.book-title{font-size:2.5rem}.chapter-header h2{font-size:2rem}.footnote-content{padding:30px;margin:15px;width:auto}.drop-cap:first-letter{font-size:3rem}.concept-list{grid-template-columns:1fr}}
