*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;padding:0;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;--bg: #f8f8f6;--bg-2: #ffffff;--bg-3: #f0f0ee;--text: #1a1a1a;--text-2: #555;--dim: #999;--border: #e4e4e2;--border-2: #d0d0ce;--green: #10b981;--green-dim: rgba(16, 185, 129, .12);--green-glow: rgba(16, 185, 129, .3);--red: #ef4444;--shadow: 0 2px 8px rgba(0,0,0,.06);--shadow-lg: 0 8px 32px rgba(0,0,0,.1);-webkit-font-smoothing:antialiased}@media(prefers-color-scheme:dark){body{--bg: #111111;--bg-2: #1a1a1a;--bg-3: #222222;--text: #e8e8e8;--text-2: #aaa;--dim: #666;--border: #2a2a2a;--border-2: #3a3a3a;--shadow: 0 2px 8px rgba(0,0,0,.3);--shadow-lg: 0 8px 32px rgba(0,0,0,.5)}}body.dark{--bg: #111111;--bg-2: #1a1a1a;--bg-3: #222222;--text: #e8e8e8;--text-2: #aaa;--dim: #666;--border: #2a2a2a;--border-2: #3a3a3a;--shadow: 0 2px 8px rgba(0,0,0,.3);--shadow-lg: 0 8px 32px rgba(0,0,0,.5)}body.light{--bg: #f8f8f6;--bg-2: #ffffff;--bg-3: #f0f0ee;--text: #1a1a1a;--text-2: #555;--dim: #999;--border: #e4e4e2;--border-2: #d0d0ce;--shadow: 0 2px 8px rgba(0,0,0,.06);--shadow-lg: 0 8px 32px rgba(0,0,0,.1)}body{background:var(--bg);color:var(--text);transition:background .2s,color .2s}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--border-2);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--dim)}::selection{background:#10b98133;color:var(--text)}:root{--max-width: 960px;--header-height: 56px;--search-height: 56px;--font-mono: "SF Mono", "Fira Code", "Cascadia Code", "JetBrains Mono", monospace;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--radius: 10px;--radius-sm: 6px;--radius-lg: 16px}.app-root{min-height:100vh;display:flex;flex-direction:column}.app-header{position:sticky;top:0;z-index:100;background:var(--bg-2);border-bottom:1px solid var(--border);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.header-inner{max-width:var(--max-width);margin:0 auto;padding:0 24px;height:var(--header-height);display:flex;align-items:center;gap:16px}.header-logo{font-family:var(--font-mono);font-size:17px;font-weight:700;color:var(--green);text-decoration:none;letter-spacing:-.5px}.header-logo:hover{opacity:.85}.header-tagline{color:var(--dim);font-size:13px}.header-right{margin-left:auto;display:flex;align-items:center;gap:8px}.theme-toggle{background:var(--bg-3);border:1px solid var(--border);color:var(--text-2);padding:6px 12px;border-radius:20px;font-size:12px;font-family:var(--font-mono);cursor:pointer;transition:all .2s}.theme-toggle:hover{border-color:var(--green);color:var(--green)}.header-links{display:flex;gap:16px}.header-links a{color:var(--dim);text-decoration:none;font-size:13px;transition:color .2s}.header-links a:hover{color:var(--text)}.search-bar-wrapper{position:sticky;top:var(--header-height);z-index:90;background:var(--bg);border-bottom:1px solid var(--border);padding:16px 24px}.search-bar-inner{max-width:var(--max-width);margin:0 auto;display:flex;align-items:center;gap:10px;background:var(--bg-2);border:1.5px solid var(--border);border-radius:12px;padding:0 16px;height:48px;transition:border-color .2s,box-shadow .2s}.search-bar-inner:focus-within{border-color:var(--green);box-shadow:0 0 0 3px var(--green-dim)}.search-icon{color:var(--dim);font-size:16px;flex-shrink:0}.search-input{flex:1;background:transparent;border:none;outline:none;color:var(--text);font-family:var(--font-mono);font-size:14px;caret-color:var(--green)}.search-input::placeholder{color:var(--dim)}.search-input:disabled{opacity:.5}.content-area{flex:1;max-width:var(--max-width);margin:0 auto;padding:40px 24px;width:100%}.content-loading{display:flex;justify-content:center;padding:80px 0}.loading-dots{display:flex;gap:6px;align-items:center}.dot{width:6px;height:6px;background:var(--green);border-radius:50%;animation:pulse 1.2s ease-in-out infinite}.dot:nth-child(2){animation-delay:.2s}.dot:nth-child(3){animation-delay:.4s}@keyframes pulse{0%,to{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}.content-empty{text-align:center;padding:100px 0}.content-empty h2{font-size:24px;font-weight:600;margin:0 0 12px;color:var(--text)}.content-empty p{color:var(--dim);margin:6px 0;font-size:15px}.content-empty code{background:var(--bg-3);padding:2px 8px;border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:13px;color:var(--green)}.post-list-header{margin-bottom:28px}.post-list-title{font-size:13px;font-weight:600;color:var(--dim);text-transform:uppercase;letter-spacing:.08em;margin-bottom:16px}.post-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}.post-card{cursor:pointer;animation:cardIn .4s ease backwards}@keyframes cardIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.post-card-inner{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px;height:100%;display:flex;flex-direction:column;gap:12px;transition:border-color .2s,transform .2s,box-shadow .2s}.post-card:hover .post-card-inner{border-color:var(--green);transform:translateY(-3px);box-shadow:var(--shadow-lg)}.post-card-meta{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:6px}.post-card-date{font-size:12px;color:var(--dim);font-family:var(--font-mono)}.post-card-tags{display:flex;gap:4px;flex-wrap:wrap}.tag-pill{background:var(--green-dim);color:var(--green);font-size:11px;padding:2px 8px;border-radius:12px;font-family:var(--font-mono);border:1px solid rgba(16,185,129,.15)}.post-card-title{margin:0;font-size:18px;font-weight:600;color:var(--text);line-height:1.4;flex:1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.post-card-footer{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:12px;border-top:1px solid var(--border)}.post-card-size{font-size:11px;color:var(--dim);font-family:var(--font-mono)}.post-card-arrow{font-size:18px;color:var(--green);opacity:0;transform:translate(-4px);transition:opacity .2s,transform .2s}.post-card:hover .post-card-arrow{opacity:1;transform:translate(0)}.post-view{animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.read-progress-bar{position:fixed;top:var(--header-height);left:0;right:0;height:2px;background:var(--border);z-index:95}.read-progress-fill{height:100%;width:0;background:var(--green);transition:width .08s linear;box-shadow:0 0 8px var(--green-glow)}.post-article{max-width:720px;margin:0 auto;padding-bottom:120px}.post-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px;padding-bottom:20px;border-bottom:1px solid var(--border)}.back-btn{background:var(--bg-3);border:1px solid var(--border);color:var(--text-2);font-family:var(--font-mono);font-size:13px;padding:7px 16px;border-radius:var(--radius-sm);cursor:pointer;transition:all .2s;text-decoration:none}.back-btn:hover{border-color:var(--green);color:var(--green)}.post-nav-arrows{display:flex;gap:8px}.nav-arrow{background:var(--bg-3);border:1px solid var(--border);color:var(--text-2);font-family:var(--font-mono);font-size:12px;padding:6px 14px;border-radius:var(--radius-sm);cursor:pointer;transition:all .2s;text-decoration:none}.nav-arrow:hover:not(:disabled){border-color:var(--green);color:var(--green)}.nav-arrow:disabled{opacity:.3;cursor:not-allowed}.post-header{margin-bottom:48px}.post-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:20px}.post-title{font-size:36px;font-weight:700;margin:0 0 20px;color:var(--text);line-height:1.25;letter-spacing:-.5px}.post-date-line{display:flex;gap:16px;align-items:center}.post-date,.post-size{font-size:13px;color:var(--dim);font-family:var(--font-mono)}.post-content{line-height:1.8;font-size:16px;color:var(--text)}.post-content h1{font-size:1.9em;font-weight:700;margin:1.8em 0 .6em;border-bottom:1px solid var(--border);padding-bottom:10px;color:var(--text)}.post-content h2{font-size:1.4em;font-weight:600;margin:1.6em 0 .5em;border-bottom:1px solid var(--border);padding-bottom:8px;color:var(--text)}.post-content h3{font-size:1.15em;font-weight:600;margin:1.3em 0 .4em}.post-content p{margin:1em 0}.post-content a{color:var(--green);text-decoration:underline;text-underline-offset:2px}.post-content ul,.post-content ol{padding-left:1.5em;margin:1em 0}.post-content li{margin:.4em 0}.post-content blockquote{border-left:3px solid var(--green);margin:1.5em 0;padding:10px 20px;background:var(--green-dim);border-radius:0 var(--radius-sm) var(--radius-sm) 0;color:var(--text)}.post-content blockquote p{margin:0}.post-content hr{border:none;border-top:1px solid var(--border);margin:2.5em 0}.post-content table{width:100%;border-collapse:collapse;margin:1.5em 0;font-size:14px}.post-content th,.post-content td{border:1px solid var(--border-2);padding:8px 14px;text-align:left}.post-content th{background:var(--bg-3);font-family:var(--font-mono);font-size:13px}.post-content td{background:var(--bg-2)}.post-content code{background:var(--bg-3);padding:2px 8px;border-radius:var(--radius-sm);font-size:.88em;color:var(--green);font-family:var(--font-mono)}.post-content pre{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius);padding:20px;overflow-x:auto;margin:1.5em 0}.post-content pre code{background:none;padding:0;color:var(--text);font-size:13px;line-height:1.7}.post-footer-nav{margin-top:60px;padding-top:32px;border-top:1px solid var(--border);display:flex;justify-content:center}.app-footer{background:var(--bg-2);border-top:1px solid var(--border);padding:24px}.footer-inner{max-width:var(--max-width);margin:0 auto;text-align:center;color:var(--dim);font-size:12px;font-family:var(--font-mono);line-height:1.8}.footer-inner a{color:var(--dim);text-decoration:none;transition:color .2s}.footer-inner a:hover{color:var(--green)}@media(max-width:768px){.header-inner{padding:0 16px}.header-tagline{display:none}.search-bar-wrapper{padding:12px 16px}.search-bar-inner{height:44px;border-radius:10px}.content-area{padding:24px 16px}.post-grid{grid-template-columns:1fr;gap:16px}.post-title{font-size:26px}.post-nav{flex-direction:column;align-items:flex-start;gap:12px}.post-nav-arrows{width:100%;justify-content:space-between}.post-article{padding-bottom:80px}}@media(max-width:480px){.header-links{display:none}.post-card-inner{padding:18px}.post-title{font-size:22px}}