: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}.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-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}.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-content h2{font-family:var(--font-title);font-size:1.3rem;color:var(--gold);margin:2rem 0 1rem}.world-content h3{font-family:var(--font-title);font-size:1.1rem;color:var(--text-primary);margin:1.5rem 0 .75rem}.world-content p{color:var(--text-secondary);line-height:1.9;margin-bottom:1.2rem}.world-content ul{padding-left:1.5rem;margin-bottom:1.2rem;color:var(--text-secondary)}.world-content li{margin-bottom:.5rem;line-height:1.8}.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}
