:root{--bg-primary: #0e0e18;--bg-secondary: #16162a;--bg-card: #1e1e30;--bg-hover: #282840;--gold: #c9a84c;--gold-light: #e8c860;--gold-dim: #8a7730;--text-primary: #ede6d8;--text-secondary: #b5a898;--text-muted: #7a7568;--border: #2a2a3a;--border-gold: #3a3020;--danger: #a03030;--success: #30a050;--radius: 6px;--radius-lg: 12px;--max-w: 900px;--font-body: "Noto Sans TC", "Segoe UI", system-ui, sans-serif;--font-title: "Noto Serif TC", Georgia, serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{background:var(--bg-primary);color:var(--text-primary);font-family:var(--font-body);font-size:18px;line-height:1.9;-webkit-font-smoothing:antialiased}body{min-height:100vh}a{color:var(--gold);text-decoration:none;transition:color .2s}a:hover{color:var(--gold-light)}img{max-width:100%;height:auto;display:block}button{cursor:pointer;border:none;background:none;color:inherit;font:inherit}.app-shell{display:flex;flex-direction:column;min-height:100vh}.site-header{position:sticky;top:0;z-index:100;display:flex;align-items:center;gap:2rem;padding:0 2rem;height:60px;background:#0e0e18d9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}.logo{font-family:var(--font-title);font-size:1.25rem;font-weight:700;color:var(--gold);letter-spacing:.1em;text-transform:uppercase}.logo:hover{color:var(--gold-light)}.main-nav{display:flex;gap:.25rem;flex:1}.nav-link{padding:.5rem 1rem;border-radius:var(--radius);color:var(--text-secondary);font-size:.9rem;transition:all .2s}.nav-link:hover{color:var(--text-primary);background:var(--bg-hover)}.nav-link.active{color:var(--gold);background:var(--bg-hover)}.auth-section,.user-menu{display:flex;align-items:center;gap:.75rem}.user-name{font-size:.85rem;color:var(--text-secondary)}.badge{font-size:.7rem;padding:.15rem .5rem;border-radius:99px;background:var(--gold-dim);color:#fff}.main-content{flex:1;padding:2rem;max-width:var(--max-w);width:100%;margin:0 auto}.site-footer{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:2rem;font-size:.8rem;color:var(--text-muted);border-top:1px solid var(--border)}.footer-sep{color:var(--border)}.btn-primary{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1.5rem;border-radius:var(--radius);background:var(--gold);color:#0a0a0f;font-weight:600;font-size:.9rem;transition:all .2s}.btn-primary:hover{background:var(--gold-light);transform:translateY(-1px)}.btn-outline{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1.5rem;border-radius:var(--radius);border:1px solid var(--border-gold);color:var(--gold);font-size:.9rem;transition:all .2s}.btn-outline:hover{border-color:var(--gold);background:#c9a84c14}.btn-sm{padding:.4rem 1rem;font-size:.8rem}.btn-lg{padding:.8rem 2rem;font-size:1rem}.btn-icon{padding:.4rem .8rem;border-radius:var(--radius);color:var(--text-secondary)}.btn-icon:hover{background:var(--bg-hover);color:var(--gold)}.hero{text-align:center;padding:4rem 0 3rem}.hero-title{font-family:var(--font-title);font-size:3rem;font-weight:700;color:var(--gold);letter-spacing:.15em;margin-bottom:.5rem}.hero-subtitle{font-size:1.1rem;color:var(--text-secondary);margin-bottom:1.5rem}.hero-desc{max-width:600px;margin:0 auto 2rem;color:var(--text-secondary);line-height:1.8}.hero-cta{display:flex;justify-content:center;gap:1rem}.section-title{font-family:var(--font-title);font-size:1.3rem;color:var(--gold);margin-bottom:1.5rem;padding-bottom:.5rem;border-bottom:1px solid var(--border)}.work-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}.work-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;transition:all .3s;display:flex;flex-direction:column}.work-card:hover{border-color:var(--border-gold);transform:translateY(-2px);box-shadow:0 8px 30px #0006}.work-card-cover{height:200px;overflow:hidden;background:var(--bg-secondary)}.work-card-cover img{width:100%;height:100%;object-fit:cover}.work-card-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:3rem;color:var(--gold-dim);font-family:var(--font-title)}.work-card-body{padding:1rem 1.25rem;flex:1}.work-card-body h3{font-family:var(--font-title);font-size:1.1rem;color:var(--text-primary);margin-bottom:.3rem}.work-card-body p{font-size:.85rem;color:var(--text-muted);line-height:1.5;margin-bottom:.6rem}.status-badge{font-size:.7rem;padding:.15rem .5rem;border-radius:99px;background:var(--bg-hover);color:var(--text-secondary)}.status-badge.ongoing{color:var(--gold)}.status-badge.completed{color:var(--success)}.work-header{margin-bottom:2rem}.work-header h1{font-family:var(--font-title);font-size:2rem;color:var(--gold);margin-bottom:.5rem}.work-desc{color:var(--text-secondary);line-height:1.7;margin-bottom:.75rem}.chapter-items{display:flex;flex-direction:column;gap:.25rem}.chapter-item{display:flex;align-items:center;gap:1rem;padding:.75rem 1rem;border-radius:var(--radius);background:var(--bg-card);border:1px solid transparent;transition:all .2s;color:var(--text-primary)}.chapter-item:hover{border-color:var(--border-gold);background:var(--bg-hover)}.chapter-title{flex:1}.chapter-badge{font-size:.75rem;color:var(--gold)}.chapter-words{font-size:.75rem;color:var(--text-muted)}.chapter-locked{border-left:3px solid var(--gold-dim)}.reader-page{padding-bottom:4rem;max-width:720px;margin:0 auto}.scroll-progress-bar{position:fixed;top:60px;left:0;width:100%;height:2px;background:transparent;z-index:99}.scroll-progress-fill{height:100%;background:var(--gold);transition:width .1s linear}.reader-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem}.back-link{font-size:.9rem;color:var(--text-secondary)}.back-link:hover{color:var(--gold)}.reader-controls{display:flex;align-items:center;gap:.75rem}.btn-fontsize{display:flex;align-items:center;gap:.25rem;padding:.3rem .7rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-card);color:var(--text-secondary);font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.btn-fontsize:hover{border-color:var(--gold);color:var(--gold)}.fontsize-label{font-size:.65rem;font-weight:400;color:var(--text-muted)}.reader-content .chapter-title{font-family:var(--font-title);font-size:1.8rem;color:var(--gold);margin-bottom:2rem;line-height:1.4}.chapter-meta{font-size:.8rem;color:var(--text-muted);margin-bottom:2.5rem}.content-block{margin-bottom:1.8rem}.content-block p{margin-bottom:1.2rem;line-height:2;text-indent:0}.md-content p{margin-bottom:1.2rem;line-height:2}.md-content h2{font-family:var(--font-title);font-size:1.3rem;color:var(--gold);margin:2.5rem 0 1rem}.md-content h3{font-family:var(--font-title);font-size:1.1rem;color:var(--text-primary);margin:2rem 0 .75rem}.md-content hr{border:none;border-top:1px solid var(--border-gold);margin:2.5rem auto;width:30%}.md-content blockquote{border-left:2px solid var(--gold-dim);padding:.5rem 1.5rem;margin:1.5rem 0;color:var(--text-secondary);font-style:italic}.md-content ul,.md-content ol{padding-left:1.5rem;margin-bottom:1.2rem;color:var(--text-secondary)}.md-content li{margin-bottom:.4rem;line-height:1.8}.md-content strong{color:var(--gold-light)}.md-content em{color:var(--text-primary)}.md-content code{background:var(--bg-card);padding:.1rem .4rem;border-radius:3px;font-size:.9em}.chapter-figure{margin:2rem 0;text-align:center}.chapter-figure img{border-radius:var(--radius);border:1px solid var(--border);max-height:500px;margin:0 auto}.chapter-figure figcaption{font-size:.8rem;color:var(--text-muted);margin-top:.5rem;font-style:italic}.reader-footer{display:flex;flex-direction:column;align-items:center;gap:1.5rem;padding-top:2rem;border-top:1px solid var(--border);margin-top:2rem}.chapter-nav{display:flex;justify-content:space-between;width:100%;gap:1rem}.nav-prev,.nav-next{max-width:45%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.toc-inline{background:var(--bg-card);border:1px solid var(--border-gold);border-radius:var(--radius);padding:1rem 1.2rem;margin-bottom:2rem}.toc-inline-label{display:block;font-size:.75rem;color:var(--gold-dim);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem}.toc-inline-list{padding-left:0;margin:0;list-style:none}.toc-inline-list li{margin-bottom:.3rem}.toc-inline-list a{color:var(--text-secondary);font-size:.9rem;line-height:1.6;text-decoration:none;transition:color .2s}.toc-inline-list a:hover{color:var(--gold)}.toc-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:#0009;display:flex;justify-content:center;align-items:flex-start;padding-top:4rem}.toc-panel{background:var(--bg-secondary);border:1px solid var(--border-gold);border-radius:var(--radius-lg);padding:1.5rem;max-width:400px;width:90%;max-height:70vh;overflow-y:auto}.toc-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border);padding-bottom:.75rem;margin-bottom:1rem}.toc-title{font-family:var(--font-title);font-size:1rem;color:var(--gold)}.toc-close{background:none;border:none;color:var(--text-muted);font-size:1.2rem;cursor:pointer}.toc-close:hover{color:var(--text-primary)}.toc-list{padding-left:0;margin:0;list-style:none}.toc-list li{margin-bottom:.4rem}.toc-link{color:var(--text-secondary);font-size:.9rem;line-height:1.6;text-decoration:none;display:block;padding:.3rem .5rem;border-radius:var(--radius);transition:background .2s,color .2s}.toc-link:hover{background:var(--bg-hover);color:var(--gold)}.appended-chapter{margin-top:2rem}.appended-divider{border:none;border-top:2px solid var(--gold-dim);margin:0 auto 2rem;width:50%}.appended-title{font-family:var(--font-title);font-size:1.4rem;color:var(--gold);margin-bottom:1.5rem;text-align:center}.paywall{position:relative;margin:3rem 0;padding:3rem 2rem;text-align:center;border-radius:var(--radius-lg);background:linear-gradient(180deg,var(--bg-card),var(--bg-primary));border:1px solid var(--border-gold);overflow:hidden}.paywall-card{max-width:400px;margin:0 auto}.paywall-icon{font-size:2.5rem;margin-bottom:1rem}.paywall-card h3{font-family:var(--font-title);color:var(--gold);margin-bottom:.75rem}.paywall-card p{color:var(--text-secondary);font-size:.9rem;margin-bottom:1.5rem}.page-title{font-family:var(--font-title);font-size:1.8rem;color:var(--gold);margin-bottom:2rem}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem}.gallery-card{position:relative;aspect-ratio:3/4;overflow:hidden;border-radius:var(--radius);border:1px solid var(--border);background:var(--bg-card);transition:all .3s}.gallery-card:hover{border-color:var(--gold);transform:scale(1.02)}.gallery-card img{width:100%;height:100%;object-fit:cover}.gallery-card-overlay{position:absolute;bottom:0;left:0;right:0;padding:1rem;background:linear-gradient(transparent,#000000b3)}.gallery-card-overlay h3{font-size:.85rem;color:#fff}.gallery-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;display:flex;align-items:center;justify-content:center;background:#000000d9;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.gallery-modal-content{position:relative;max-width:90vw;max-height:90vh}.gallery-modal-content img{max-width:100%;max-height:85vh;border-radius:var(--radius)}.gallery-modal-content p{color:var(--text-secondary);font-size:.9rem;margin-top:.5rem}.modal-close{position:absolute;top:-2rem;right:0;font-size:1.5rem;color:var(--text-secondary);padding:.5rem}.modal-close:hover{color:#fff}.empty-state{text-align:center;padding:3rem;color:var(--text-muted);font-style:italic}.world-page{max-width:800px;margin:0 auto;padding:2rem 1.5rem 4rem}.world-page .page-title{font-family:var(--font-title);font-size:2rem;color:var(--gold);margin-bottom:2rem}.world-section{margin-bottom:3rem}.world-section-title{font-family:var(--font-title);font-size:1.4rem;color:var(--gold-light);border-bottom:1px solid var(--border-gold);padding-bottom:.5rem;margin-bottom:1rem}.world-intro{color:var(--text-secondary);line-height:1.8;margin-bottom:1.5rem;font-size:.95rem}.char-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.5rem;margin-bottom:1.5rem}.char-card-header{display:flex;align-items:baseline;gap:.75rem;margin-bottom:1rem;border-bottom:1px solid var(--border-gold);padding-bottom:.75rem}.char-name{font-family:var(--font-title);font-size:1.3rem;color:var(--gold)}.char-en{font-size:.85rem;color:var(--text-muted);font-style:italic}.char-table{width:100%;border-collapse:collapse;margin-bottom:1rem;font-size:.9rem}.char-table td{padding:.3rem .5rem;vertical-align:top;border-bottom:1px solid var(--border)}.char-label{width:60px;color:var(--text-muted);font-weight:600;white-space:nowrap}.char-section{margin-bottom:.75rem}.char-subtitle{font-size:.8rem;color:var(--gold-dim);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.3rem}.char-section p{color:var(--text-secondary);line-height:1.8;font-size:.9rem}.char-section ul{padding-left:1.2rem;margin:0}.char-section li{color:var(--text-secondary);line-height:1.7;font-size:.9rem;margin-bottom:.2rem}.term-item{padding:1rem 0;border-bottom:1px solid var(--border)}.term-item:last-child{border-bottom:none}.term-name{font-family:var(--font-title);font-size:1.05rem;color:var(--gold);margin-bottom:.4rem}.term-def{color:var(--text-secondary);line-height:1.8;font-size:.9rem}.timeline-block{margin-bottom:1.5rem;padding-left:1rem;border-left:2px solid var(--gold-dim)}.timeline-era{font-family:var(--font-title);font-size:1.1rem;color:var(--gold-light);margin-bottom:.5rem}.timeline-list{padding-left:1.2rem;margin:0}.timeline-list li{color:var(--text-secondary);line-height:1.7;font-size:.9rem;margin-bottom:.3rem}.world-unknowns{border-top:1px solid var(--border-gold);padding-top:2rem}.unknown-list{padding-left:1.2rem;margin:0}.unknown-list li{color:var(--text-muted);line-height:1.7;font-size:.9rem;margin-bottom:.3rem;list-style-type:"? ";padding-left:.3rem}.member-gate{text-align:center;padding:3rem 2rem;background:var(--bg-card);border:1px solid var(--border-gold);border-radius:var(--radius-lg);margin:1.5rem 0}.member-gate-icon{font-size:2.5rem;margin-bottom:1rem}.member-gate-title{font-family:var(--font-title);font-size:1.2rem;color:var(--gold);margin-bottom:.75rem}.member-gate-desc{color:var(--text-secondary);font-size:.9rem;line-height:1.7;margin-bottom:1.5rem;max-width:400px;margin-left:auto;margin-right:auto}.world-section-title{display:flex;align-items:center;gap:.75rem}.world-section-badge{font-size:.65rem;color:var(--gold);border:1px solid var(--gold-dim);border-radius:3px;padding:.15rem .5rem;text-transform:uppercase;letter-spacing:.05em;font-family:var(--font-body)}.progress-track{height:4px;background:var(--bg-card);border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:var(--gold);transition:width .3s}.progress-label{font-size:.75rem;color:var(--text-muted);white-space:nowrap}.loading-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--gold);animation:pulse 1.2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.3}50%{opacity:1}}.page-loading{text-align:center;padding:4rem 2rem;color:var(--text-muted)}@media(max-width:768px){.site-header{gap:1rem;padding:0 1rem}.nav-link{padding:.4rem .6rem;font-size:.8rem}.hero-title{font-size:2rem}.main-content{padding:1rem}.reader-page{padding:0 0 2rem}.reader-content .chapter-title{font-size:1.4rem}html{font-size:16px}}.membership-page{max-width:720px;margin:0 auto}.membership-intro{text-align:center;padding:3rem 0 2rem}.membership-intro h1{font-family:var(--font-title);font-size:2rem;color:var(--gold);margin-bottom:1rem}.membership-desc{color:var(--text-secondary);max-width:500px;margin:0 auto 2rem;line-height:1.8}.tier-list h2{font-family:var(--font-title);font-size:1.3rem;color:var(--gold);margin-bottom:1.5rem;padding-bottom:.5rem;border-bottom:1px solid var(--border)}.tier-grid{display:flex;flex-direction:column;gap:.75rem}.tier-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.25rem 1.5rem;transition:border-color .2s}.tier-card:hover{border-color:var(--border-gold)}.tier-header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.5rem}.tier-header h3{font-family:var(--font-title);font-size:1.1rem;color:var(--gold)}.tier-price{font-size:1.3rem;font-weight:700;color:var(--text-primary)}.tier-price small{font-size:.75rem;font-weight:400;color:var(--text-muted)}.tier-desc{color:var(--text-secondary);font-size:.9rem;margin-bottom:.75rem}.tier-benefits{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.4rem 1rem}.tier-benefits li{color:var(--text-muted);font-size:.8rem}.tier-benefits li:before{content:"+ ";color:var(--gold-dim)}.membership-cta{text-align:center;padding:3rem 0}.membership-cta p{color:var(--text-secondary);margin-bottom:1rem}.featured-work{padding:2rem 0}.featured-work h2{font-family:var(--font-title);font-size:1.3rem;color:var(--gold);margin-bottom:1.5rem;padding-bottom:.5rem;border-bottom:1px solid var(--border)}.featured-work-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.5rem;text-align:center;transition:border-color .2s}.featured-work-card:hover{border-color:var(--border-gold)}.featured-work-card h3{font-family:var(--font-title);font-size:1.2rem;color:var(--gold-light);margin-bottom:.75rem}.featured-work-desc{color:var(--text-secondary);font-size:.9rem;line-height:1.7;max-width:480px;margin:0 auto 1rem}.featured-work-meta{color:var(--text-muted);font-size:.8rem;margin-bottom:1.25rem}.featured-work-cta{display:inline-block;padding:.6rem 1.5rem;border:1px solid var(--gold);border-radius:var(--radius);color:var(--gold);font-size:.9rem;text-decoration:none;transition:background .2s,color .2s}.featured-work-cta:hover{background:var(--gold);color:var(--bg-primary)}