:root{--color-bg: #FAFAFA;--color-bg-alt: #FFFFFF;--color-text: #1A1A1A;--color-text-secondary: #666666;--color-accent: #0066FF;--color-code-bg: #F6F8FA;--color-border: #E1E4E8;--font-body: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-code: "Monaco", "Courier New", monospace;--spacing-xs: .5rem;--spacing-sm: 1rem;--spacing-md: 1.5rem;--spacing-lg: 2rem;--spacing-xl: 3rem;--spacing-2xl: 4rem;--max-content-width: 720px;--max-wide-width: 1200px}.dark-mode{--color-bg: #0D1117;--color-bg-alt: #161B22;--color-text: #E6EDF3;--color-text-secondary: #8B949E;--color-accent: var(--color-accent-light, #58A6FF);--color-code-bg: #22272E;--color-border: #30363D}*{margin:0;padding:0;box-sizing:border-box}*:not(svg){transition-property:background-color,border-color,color;transition-duration:.3s;transition-timing-function:ease}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-body);font-size:1.125rem;line-height:1.7;color:var(--color-text);background-color:var(--color-bg);transition:background-color .3s ease,color .3s ease}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2;margin-bottom:var(--spacing-md);color:var(--color-text)}h1{font-size:2.5rem;font-weight:700;margin-bottom:var(--spacing-lg)}h2{font-size:2rem;margin-top:var(--spacing-xl)}h3{font-size:1.5rem;margin-top:var(--spacing-lg)}h4{font-size:1.25rem}h5{font-size:1.125rem}h6{font-size:1rem}p{margin-bottom:var(--spacing-md)}a{color:var(--color-accent);text-decoration:none;transition:opacity .2s ease}a:hover{opacity:.8}code{font-family:var(--font-code);font-size:.9em;background-color:var(--color-code-bg);padding:.2em .4em;border-radius:3px}pre{background-color:var(--color-code-bg);border-radius:6px;padding:var(--spacing-md);overflow-x:auto;margin-bottom:var(--spacing-md)}pre code{background:none;padding:0}ul,ol{margin-bottom:var(--spacing-md);padding-left:var(--spacing-lg)}li{margin-bottom:var(--spacing-xs)}.container{max-width:var(--max-content-width);margin:0 auto;padding:0 var(--spacing-md)}.container-wide{max-width:var(--max-wide-width);margin:0 auto;padding:0 var(--spacing-md)}@media(max-width:768px){html{font-size:14px}h1{font-size:2rem}h2{font-size:1.75rem}h3{font-size:1.4rem}}.loading-screen{position:fixed;inset:0;background:linear-gradient(135deg,var(--color-bg) 0%,var(--color-bg-alt) 100%);display:flex;align-items:center;justify-content:center;z-index:9999;overflow:hidden}.loading-bg-circle{position:absolute;border-radius:50%;background:radial-gradient(circle,var(--color-accent) 0%,transparent 70%);opacity:.1;filter:blur(60px)}.loading-bg-circle-1{width:400px;height:400px;top:-100px;right:-100px}.loading-bg-circle-2{width:300px;height:300px;bottom:-50px;left:-50px}.loading-bg-circle-3{width:250px;height:250px;top:50%;left:50%;transform:translate(-50%,-50%)}.loading-content{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xl);position:relative;z-index:1}.loading-logo-wrapper{position:relative;display:flex;align-items:center;justify-content:center}.loading-logo{width:120px;height:auto;position:relative;z-index:2;filter:drop-shadow(0 4px 12px rgba(0,0,0,.1))}.loading-circle-svg{position:absolute;width:200px;height:200px;transform:rotate(-90deg);top:50%;left:50%;margin-left:-100px;margin-top:-100px}.loading-circle-bg{fill:none;stroke:var(--color-border);stroke-width:2;opacity:.3}.loading-circle-progress{fill:none;stroke:var(--color-accent);stroke-width:3;stroke-linecap:round;stroke-dasharray:283;stroke-dashoffset:0;filter:drop-shadow(0 0 8px var(--color-accent))}.loading-progress-text{font-size:1.5rem;font-weight:600;color:var(--color-accent);font-family:var(--font-body);margin-top:var(--spacing-md)}.loading-text{font-size:1rem;color:var(--color-text-secondary);font-family:var(--font-body);margin:0;text-align:center}.blog-header{padding:var(--spacing-md) 0;border-bottom:1px solid transparent;position:sticky;top:0;z-index:100;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background-color:#fafafad9;transition:border-color .3s ease,background-color .3s ease}.dark-mode .blog-header{background-color:#0d1117d9}.blog-header:hover{border-bottom-color:var(--color-border)}.navbar{max-width:var(--max-wide-width);margin:0 auto;padding:0 var(--spacing-md);display:flex;justify-content:space-between;align-items:center}.navbar-brand{flex:1}.brand-link{text-decoration:none;display:inline-flex;align-items:center;gap:var(--spacing-sm)}.brand-logo{width:32px;height:auto;transition:transform .2s ease}.brand-name{font-size:1.25rem;font-weight:600;color:var(--color-text);letter-spacing:-.02em;transition:color .2s ease}.brand-link:hover .brand-name{color:var(--color-accent)}.brand-link:hover .brand-logo{transform:scale(1.1) rotate(5deg)}.navbar-links{display:flex;gap:var(--spacing-lg);align-items:center}.nav-link{font-size:.95rem;font-weight:500;color:var(--color-text-secondary);text-decoration:none;padding:var(--spacing-xs) var(--spacing-sm);border-radius:4px;transition:all .2s ease;position:relative}.nav-link:hover{color:var(--color-text);background-color:#0066ff0d}.nav-link.active{color:var(--color-accent);font-weight:600}.nav-link.active:after{content:"";position:absolute;bottom:-2px;left:var(--spacing-sm);right:var(--spacing-sm);height:2px;background-color:var(--color-accent);border-radius:2px}.theme-toggle{background:transparent;border:1px solid var(--color-border);border-radius:8px;padding:var(--spacing-xs);cursor:pointer;color:var(--color-text);display:flex;align-items:center;justify-content:center;transition:all .2s ease;width:40px;height:40px}.theme-toggle:hover{background:#0066ff0d;border-color:var(--color-accent);color:var(--color-accent);transform:rotate(15deg)}.theme-toggle:active{transform:scale(.95) rotate(15deg)}.blog-list{padding:var(--spacing-lg) 0;margin-top:0}.blog-list-title{margin-bottom:var(--spacing-md);font-size:2.5rem;font-weight:700}.blog-layout{display:grid;grid-template-columns:2fr 1fr;gap:var(--spacing-2xl);align-items:start}.blog-main{min-width:0}.sidebar{position:sticky;top:calc(var(--spacing-2xl) + 60px);background:var(--color-bg-alt);border:1px solid var(--color-border);border-radius:12px;padding:var(--spacing-lg)}.sidebar-section{margin-bottom:0}.sidebar-title{font-size:1.1rem;font-weight:600;color:var(--color-text);margin:0 0 var(--spacing-md) 0;padding-bottom:var(--spacing-sm);border-bottom:2px solid var(--color-border)}.timeline{position:relative;padding-left:var(--spacing-md)}.timeline:before{content:"";position:absolute;left:5px;top:8px;bottom:8px;width:2px;background:var(--color-border)}.timeline-item{position:relative;margin-bottom:var(--spacing-md)}.timeline-item:last-child{margin-bottom:0}.timeline-link{display:flex;align-items:flex-start;gap:var(--spacing-sm);text-decoration:none;transition:all .2s ease}.timeline-dot{position:absolute;left:calc(var(--spacing-md) * -1 + 1px);top:6px;width:10px;height:10px;background:var(--color-bg);border:2px solid var(--color-accent);border-radius:50%;z-index:1;transition:all .2s ease}.timeline-link:hover .timeline-dot{background:var(--color-accent);transform:scale(1.3)}.timeline-content{flex:1;min-width:0}.timeline-post-title{font-size:.95rem;font-weight:500;color:var(--color-text);margin:0 0 var(--spacing-xs) 0;line-height:1.4;transition:color .2s ease;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.timeline-link:hover .timeline-post-title{color:var(--color-accent)}.timeline-date{font-size:.8rem;color:var(--color-text-secondary);display:block}.search-container{margin-bottom:var(--spacing-lg)}.search-bar{position:relative;display:flex;align-items:center;background:var(--color-bg-alt);border:2px solid var(--color-border);border-radius:12px;padding:var(--spacing-sm) var(--spacing-md);transition:all .2s ease;margin-bottom:var(--spacing-md)}.search-bar:focus-within{border-color:var(--color-accent);box-shadow:0 0 0 3px #0066ff1a}.search-icon{color:var(--color-text-secondary);flex-shrink:0;margin-right:var(--spacing-sm)}.search-input{flex:1;border:none;outline:none;background:transparent;font-family:var(--font-body);font-size:1rem;color:var(--color-text);padding:.25rem 0}.search-input::placeholder{color:var(--color-text-secondary)}.clear-button{background:transparent;border:none;padding:.25rem;cursor:pointer;color:var(--color-text-secondary);display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s ease;margin-left:var(--spacing-xs)}.clear-button:hover{background:#0000000d;color:var(--color-text)}.popular-tags{display:flex;align-items:center;gap:var(--spacing-xs);flex-wrap:wrap}.popular-tags-label{font-size:.9rem;color:var(--color-text-secondary);font-weight:500;margin-right:var(--spacing-xs)}.popular-tag{background:transparent;border:1px solid var(--color-border);color:var(--color-text-secondary);font-family:var(--font-body);font-size:.85rem;font-weight:500;padding:.3rem .75rem;border-radius:20px;cursor:pointer;transition:all .2s ease}.popular-tag:hover{background:#0066ff0d;border-color:var(--color-accent);color:var(--color-accent)}.popular-tag.active{background:#0066ff1a;border-color:var(--color-accent);color:var(--color-accent)}.no-results{text-align:center;padding:var(--spacing-2xl);color:var(--color-text-secondary)}.no-results p{font-size:1.1rem;margin-bottom:var(--spacing-md)}.clear-search-button{background:var(--color-accent);color:#fff;border:none;padding:var(--spacing-sm) var(--spacing-lg);border-radius:6px;font-family:var(--font-body);font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s ease}.clear-search-button:hover{opacity:.9;transform:translateY(-1px)}.post-grid{display:flex;flex-direction:column;gap:var(--spacing-xl)}.post-card{padding:var(--spacing-lg);background:var(--color-bg-alt);border:1px solid var(--color-border);border-radius:8px;transition:transform .2s ease,box-shadow .2s ease;cursor:pointer}.post-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000000d}.post-card-title{margin:0 0 var(--spacing-xs) 0;font-size:1.75rem;font-weight:600;color:var(--color-text)}.post-card-meta{display:flex;align-items:center;gap:var(--spacing-md);flex-wrap:wrap;margin-bottom:var(--spacing-sm)}.post-card-date{font-size:.9rem;color:var(--color-text-secondary)}.post-card-separator{color:var(--color-text-secondary);margin:0 var(--spacing-xs)}.post-card-reading-time{font-size:.9rem;color:var(--color-text-secondary);display:inline-flex;align-items:center;gap:.25rem}.post-card-excerpt{color:var(--color-text-secondary);line-height:1.6;margin:0}.post-tags{display:flex;gap:var(--spacing-xs);flex-wrap:wrap}.tag-chip{display:inline-block;padding:.25rem .75rem;background-color:#0066ff14;color:var(--color-accent);font-size:.85rem;font-weight:500;border-radius:20px;transition:all .2s ease;border:1px solid rgba(0,102,255,.15)}.tag-chip:hover{background-color:#0066ff1f;border-color:#0066ff40;transform:translateY(-1px)}.blog-post{padding:var(--spacing-lg) 0;margin-top:0}.blog-post-header{margin-bottom:var(--spacing-xl);padding-bottom:var(--spacing-lg);border-bottom:1px solid var(--color-border)}.blog-post-title{margin-bottom:var(--spacing-sm);font-size:2.75rem;font-weight:700}.blog-post-meta{display:flex;align-items:center;gap:var(--spacing-md);flex-wrap:wrap}.blog-post-date{color:var(--color-text-secondary);font-size:1rem}.blog-post-separator{color:var(--color-text-secondary);margin:0 var(--spacing-xs)}.blog-post-reading-time{color:var(--color-text-secondary);font-size:1rem;display:inline-flex;align-items:center;gap:.25rem}.blog-post-content{margin-bottom:var(--spacing-2xl)}.back-button{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);background:var(--color-bg-alt);border:1px solid var(--color-border);border-radius:6px;color:var(--color-text);cursor:pointer;transition:all .2s ease;font-family:var(--font-body);font-size:1rem}.back-button:hover{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.loading,.error{text-align:center;padding:var(--spacing-2xl);color:var(--color-text-secondary)}.error{color:#d73a49}.settings-page{padding:var(--spacing-xl) 0 var(--spacing-lg) 0;margin-top:0}.settings-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--spacing-md);gap:var(--spacing-lg)}.settings-title{font-size:2.5rem;font-weight:700;margin-bottom:var(--spacing-xs)}.settings-subtitle{font-size:1.1rem;color:var(--color-text-secondary);margin-bottom:0}.reset-button{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-lg);background:var(--color-bg-alt);border:2px solid var(--color-border);border-radius:8px;color:var(--color-text);font-family:var(--font-body);font-size:.95rem;font-weight:500;cursor:pointer;transition:all .2s ease;white-space:nowrap}.reset-button:hover{border-color:var(--color-accent);color:var(--color-accent);background:#0066ff0d}.settings-section{background:var(--color-bg-alt);border:1px solid var(--color-border);border-radius:12px;padding:var(--spacing-xl);margin-bottom:var(--spacing-lg)}.settings-section:first-of-type{margin-top:0}.settings-section-title{font-size:1.5rem;font-weight:600;margin-bottom:var(--spacing-sm)}.settings-section-description{color:var(--color-text-secondary);margin-bottom:var(--spacing-xl);line-height:1.6}.theme-options{display:grid;gap:var(--spacing-md)}.theme-option{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg);background:var(--color-bg);border:2px solid var(--color-border);border-radius:12px;cursor:pointer;transition:all .2s ease;text-align:left;font-family:var(--font-body)}.theme-option:hover{border-color:var(--color-accent);transform:translateY(-2px);box-shadow:0 4px 12px #0000000d}.theme-option.active{border-color:var(--color-accent);background:#0066ff08}.theme-option-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--color-bg-alt);border:1px solid var(--color-border);border-radius:10px;color:var(--color-text);flex-shrink:0}.theme-option.active .theme-option-icon{background:#0066ff1a;border-color:var(--color-accent);color:var(--color-accent)}.theme-option-content{flex:1}.theme-option-label{font-size:1.1rem;font-weight:600;color:var(--color-text);margin:0 0 var(--spacing-xs) 0}.theme-option-description{font-size:.95rem;color:var(--color-text-secondary);margin:0}.theme-option-check{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--color-accent);color:#fff;border-radius:50%;flex-shrink:0}.color-options{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:var(--spacing-md)}.color-option{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md);background:var(--color-bg);border:2px solid var(--color-border);border-radius:12px;cursor:pointer;transition:all .2s ease;font-family:var(--font-body);position:relative}.color-option:hover{border-color:var(--color-accent);box-shadow:0 4px 12px #0000000d}.color-option.active{border-color:var(--color-accent);background:#0066ff08}.color-swatch{width:56px;height:56px;border-radius:50%;box-shadow:0 2px 8px #00000026;position:relative}.color-option-check{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:#000000b3;border-radius:50%;pointer-events:none}.color-name{font-size:.9rem;font-weight:500;color:var(--color-text);text-align:center}.preset-theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--spacing-md)}.preset-theme-card{display:flex;flex-direction:column;gap:var(--spacing-sm);padding:var(--spacing-md);background:var(--color-bg);border:2px solid var(--color-border);border-radius:12px;cursor:pointer;transition:all .2s ease;text-align:left;font-family:var(--font-body);position:relative}.preset-theme-card:hover{border-color:var(--color-accent);box-shadow:0 4px 12px #0000000d}.preset-theme-card.active{border-color:var(--color-accent);background:#0066ff08}.preset-theme-preview{width:100%;height:80px;border-radius:8px;overflow:hidden;background:var(--color-bg-alt);border:1px solid var(--color-border)}.preview-colors{display:flex;height:100%}.preview-color{flex:1;transition:transform .2s ease}.preset-theme-card:hover .preview-color:hover{transform:scale(1.1)}.preset-theme-info{flex:1}.preset-theme-name{font-size:1.1rem;font-weight:600;color:var(--color-text);margin:0 0 var(--spacing-xs) 0}.preset-theme-description{font-size:.9rem;color:var(--color-text-secondary);margin:0}.preset-theme-check{position:absolute;top:var(--spacing-sm);right:var(--spacing-sm);display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:var(--color-accent);border-radius:50%}@media(max-width:768px){.blog-layout{grid-template-columns:1fr;gap:var(--spacing-xl)}.sidebar{position:relative;top:0}.blog-header{padding:var(--spacing-md) 0}.navbar{padding:0 var(--spacing-sm)}.brand-logo{width:28px}.brand-name{font-size:1.1rem}.navbar-links{gap:var(--spacing-md)}.nav-link{font-size:.9rem;padding:var(--spacing-xs)}.blog-list-title,.blog-post-title{font-size:2rem}.post-card-title{font-size:1.5rem}.post-card{padding:var(--spacing-md)}.post-card-meta,.blog-post-meta{gap:var(--spacing-sm)}.tag-chip{font-size:.8rem;padding:.2rem .6rem}.search-bar{padding:var(--spacing-xs) var(--spacing-sm)}.search-input{font-size:.95rem}.popular-tags-label{font-size:.85rem;width:100%;margin-bottom:var(--spacing-xs)}.popular-tag{font-size:.8rem;padding:.25rem .6rem}.settings-header{flex-direction:column;align-items:stretch}.reset-button{width:100%;justify-content:center}.settings-title{font-size:2rem}.settings-section{padding:var(--spacing-lg)}.preset-theme-grid{grid-template-columns:1fr}.theme-option{padding:var(--spacing-md)}.theme-option-icon{width:40px;height:40px}.theme-option-label{font-size:1rem}.theme-option-description{font-size:.9rem}.color-options{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}.color-swatch{width:48px;height:48px}.color-name{font-size:.85rem}}.markdown-content{font-size:1.125rem;line-height:1.7;color:var(--color-text)}.markdown-content h1,.markdown-content h2,.markdown-content h3,.markdown-content h4,.markdown-content h5,.markdown-content h6{font-weight:600;margin-top:var(--spacing-xl);margin-bottom:var(--spacing-md);line-height:1.3}.markdown-content h1{font-size:2.25rem;font-weight:700;margin-top:var(--spacing-2xl);padding-bottom:var(--spacing-sm);border-bottom:2px solid var(--color-border)}.markdown-content h2{font-size:1.875rem;padding-bottom:var(--spacing-xs);border-bottom:1px solid var(--color-border)}.markdown-content h3{font-size:1.5rem}.markdown-content h4{font-size:1.25rem}.markdown-content h5,.markdown-content h6{font-size:1.125rem}.markdown-content p{margin-bottom:var(--spacing-md)}.markdown-content a{color:var(--color-accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}.markdown-content a:hover{text-decoration-thickness:2px}.markdown-content ul,.markdown-content ol{margin-bottom:var(--spacing-md);padding-left:var(--spacing-lg)}.markdown-content li{margin-bottom:var(--spacing-xs)}.markdown-content li>ul,.markdown-content li>ol{margin-top:var(--spacing-xs);margin-bottom:var(--spacing-xs)}.markdown-content code{font-family:var(--font-code);font-size:.9em;background-color:var(--color-code-bg);padding:.2em .4em;border-radius:3px;border:1px solid var(--color-border)}.markdown-content pre{background-color:var(--color-code-bg)!important;border:1px solid var(--color-border);border-radius:8px;padding:var(--spacing-md);overflow-x:auto;margin-bottom:var(--spacing-lg);box-shadow:0 1px 3px #0000001a}.dark-mode .markdown-content pre{box-shadow:0 2px 8px #0000004d}.markdown-content pre code{background:none!important;padding:0;border:none;font-size:.95em}.markdown-content pre>div{background:transparent!important}.code-block-wrapper{position:relative;margin-bottom:var(--spacing-lg);border-radius:8px;overflow:hidden;border:1px solid var(--color-border);background-color:transparent;box-shadow:none}.code-block-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background-color:transparent;border-bottom:1px solid var(--color-border)}.code-language{font-size:.85rem;font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em}.copy-button{display:flex;align-items:center;gap:.4rem;padding:.4rem .75rem;background:transparent;border:1px solid var(--color-border);border-radius:6px;color:var(--color-text-secondary);font-family:var(--font-body);font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s ease}.copy-button:hover{background:var(--color-accent);color:#fff;border-color:var(--color-accent);transform:translateY(-1px)}.copy-button:active{transform:translateY(0)}.copy-button svg{flex-shrink:0}.markdown-content blockquote{margin:var(--spacing-md) 0;padding:var(--spacing-sm) var(--spacing-md);border-left:4px solid var(--color-accent);background-color:var(--color-code-bg);color:var(--color-text-secondary);font-style:italic}.markdown-content blockquote p:last-child{margin-bottom:0}.markdown-content hr{border:none;border-top:2px solid var(--color-border);margin:var(--spacing-xl) 0}.markdown-content table{width:100%;border-collapse:collapse;margin-bottom:var(--spacing-md);overflow-x:auto;display:block}.markdown-content table thead{background-color:var(--color-code-bg)}.markdown-content table th,.markdown-content table td{padding:var(--spacing-xs) var(--spacing-sm);border:1px solid var(--color-border);text-align:left}.markdown-content table th{font-weight:600}.markdown-content img{max-width:100%;height:auto;border-radius:6px;margin:var(--spacing-md) 0}.markdown-content h1 code,.markdown-content h2 code,.markdown-content h3 code,.markdown-content h4 code,.markdown-content h5 code,.markdown-content h6 code{font-size:.85em}@media(max-width:768px){.markdown-content{font-size:1rem}.markdown-content h1{font-size:1.875rem}.markdown-content h2{font-size:1.5rem}.markdown-content h3{font-size:1.25rem}.markdown-content pre{font-size:.875rem}.code-block-header{padding:.6rem .75rem}.code-language{font-size:.75rem}.copy-button{padding:.35rem .6rem;font-size:.8rem}.copy-button span{display:none}.copy-button:hover span{display:inline}}