:root{--brand-900: #1a2e1a;--brand-700: #2d4a2d;--brand-500: #4a9e6a;--brand-300: #a7c4a0;--brand-100: #e8f5e8;--brand-50: #f0f7f0;--border: #d1e8d1;--text-primary: #1a1a1a;--text-secondary: #4a7c59;--text-muted: #767676;--bg-page: #ffffff;--bg-subtle: #f5f7f5;--bg-card: #ffffff;--bg-code: #1e1e2e;--heading-accent: #e8657a;--info-bg: #eef6ff;--info-border: #3b82f6;--info-icon: #3b82f6;--success-bg: #eefbf3;--success-border: #22c55e;--success-icon: #22c55e;--warning-bg: #fffbeb;--warning-border: #f59e0b;--shadow-card-hover: 0 2px 12px rgba(0, 0, 0, .08);--shadow-floating: 0 2px 12px rgba(0, 0, 0, .15);--code-dot-red: #ff5f57;--code-dot-yellow: #febc2e;--code-dot-green: #28c840;--cat-tech: #1a1a1a;--cat-ai: #6d28d9;--cat-product: #0369a1;--cat-education: #b45309;--cat-life: #15803d;--cat-marketing: #be185d;--cat-travel: #c2410c;--cat-climbing: #57534e;--cat-surf: #0891b2;--cat-film: #292524;--cat-coffee: #92400e;--cat-learning: #0d9488;--cat-design: #a21caf;--cat-policy: #475569;--cat-anime: #e11d48;--cat-career: #0c4a6e}[data-theme=dark]{--brand-900: #e8e8e8;--brand-700: #c0c0c0;--brand-500: #5cb87a;--brand-300: #2d4a2d;--brand-100: #1c2833;--brand-50: #151d26;--border: #2a3545;--text-primary: #d1d5db;--text-secondary: #5cb87a;--text-muted: #6b7280;--bg-page: #0f1419;--bg-subtle: #151d26;--bg-card: #1a2332;--bg-code: #0d1117;--heading-accent: #f472b6;--info-bg: #151d26;--info-border: #3b82f6;--info-icon: #60a5fa;--success-bg: #151d26;--success-border: #22c55e;--success-icon: #4ade80;--warning-bg: #1a1a0f;--warning-border: #f59e0b;--shadow-card-hover: 0 2px 12px rgba(0, 0, 0, .25);--shadow-floating: 0 2px 12px rgba(0, 0, 0, .4)}.skip-nav{position:absolute;left:-9999px;top:1rem;z-index:9999;background:var(--brand-900);color:var(--bg-page);padding:.5rem 1rem;border-radius:4px;font-size:.875rem;text-decoration:none}.skip-nav:focus{left:1rem}:focus-visible{outline:2px solid var(--brand-500);outline-offset:2px}*,*:before,*:after{box-sizing:border-box}html{overflow-x:hidden}body{font-family:system-ui,-apple-system,sans-serif;max-width:800px;margin:0 auto;padding:1rem 1.5rem;color:var(--text-primary);background:var(--bg-page);transition:background .2s,color .2s}nav{display:flex;align-items:center;gap:1.5rem;margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid var(--border);position:relative}.logo{font-weight:900;font-size:1.05rem;letter-spacing:-.5px;text-decoration:none;color:var(--brand-900)}.nav-link{font-size:.8rem;text-decoration:none;color:var(--text-secondary)}.nav-link:hover{color:var(--brand-900)}.nav-right{margin-left:auto;display:flex;align-items:center;gap:.6rem}.nav-icon-btn{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--bg-subtle);border:1px solid var(--border);color:var(--text-muted);cursor:pointer;text-decoration:none;transition:color .15s,border-color .15s,background .15s}.nav-icon-btn:hover{color:var(--brand-500);border-color:var(--brand-500);background:var(--bg-card)}.icon-dark,[data-theme=dark] .icon-light{display:none}[data-theme=dark] .icon-dark{display:flex}.lang-badge{font-size:.7rem;font-weight:700;letter-spacing:.06em;color:var(--text-secondary);border:1px solid var(--border);padding:.12rem .45rem;border-radius:3px;text-decoration:none}.lang-badge:hover{border-color:var(--brand-500)}.progress-bar{position:absolute;bottom:-2px;left:0;width:0%;height:2px;background:var(--brand-500);transition:width .1s linear}.scroll-top{position:fixed;bottom:2rem;right:1.5rem;width:40px;display:flex;flex-direction:column;align-items:center;gap:2px;background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:.5rem .35rem;color:var(--heading-accent);cursor:pointer;opacity:0;transform:translateY(10px);transition:opacity .2s,transform .2s,color .15s;pointer-events:none;z-index:100;box-shadow:var(--shadow-floating)}.scroll-top.visible{opacity:1;transform:translateY(0);pointer-events:auto}.scroll-top:hover{color:var(--brand-500)}.scroll-pct{font-size:.6rem;font-weight:700;line-height:1}footer{margin-top:3rem;padding-top:1rem;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;font-size:.82rem;color:var(--text-muted)}.rss-link{display:flex;align-items:center;gap:.4rem;color:var(--text-muted);text-decoration:none;font-size:.78rem}.rss-link:hover{color:var(--brand-500)}.cat-badge{font-size:.62rem;font-weight:700;padding:.12rem .45rem;border-radius:2px;text-transform:uppercase;letter-spacing:.04em;color:#fff;text-decoration:none}.cat-tech{background:var(--cat-tech)}.cat-ai{background:var(--cat-ai)}.cat-product{background:var(--cat-product)}.cat-education{background:var(--cat-education)}.cat-life{background:var(--cat-life)}.cat-marketing{background:var(--cat-marketing)}.cat-travel{background:var(--cat-travel)}.cat-climbing{background:var(--cat-climbing)}.cat-surf{background:var(--cat-surf)}.cat-film{background:var(--cat-film)}.cat-coffee{background:var(--cat-coffee)}.cat-learning{background:var(--cat-learning)}.cat-design{background:var(--cat-design)}.cat-policy{background:var(--cat-policy)}.cat-anime{background:var(--cat-anime)}.cat-career{background:var(--cat-career)}.type-badge{font-size:.62rem;font-weight:700;padding:.1rem .4rem;border-radius:2px;text-transform:uppercase;letter-spacing:.04em;border:1px solid currentColor;text-decoration:none}.type-badge:hover{opacity:.75}.type-debug{color:#d97706}.type-deep-dive{color:#4f46e5}.type-guide{color:#0d9488}.type-project{color:#64748b}.type-filter{display:flex;gap:.35rem;flex-wrap:wrap;margin-bottom:1.5rem}.filter-btn{background:none;border:1px solid var(--border);border-radius:3px;padding:.25rem .65rem;font-size:.72rem;font-weight:700;cursor:pointer;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.04em;transition:border-color .15s,color .15s,background .15s}.filter-btn:hover{border-color:var(--brand-500);color:var(--brand-500)}.filter-btn.active{background:var(--brand-900);border-color:var(--brand-900);color:var(--bg-page)}.tag-pill{background:var(--brand-100);font-size:.72rem;padding:.08rem .45rem;border-radius:3px;color:var(--brand-700);text-decoration:none}.tag-pill:hover{background:var(--brand-300)}.content{line-height:1.8;margin-bottom:3rem}.content h1{font-size:1.7rem;font-weight:900;margin:2.5rem 0 1rem;color:var(--brand-900)}.content h2{font-size:1.3rem;font-weight:800;margin:2.5rem 0 .75rem;padding-bottom:.5rem;border-bottom:none;color:var(--brand-900);position:relative;display:flex;align-items:baseline;justify-content:space-between}.content h2:after{content:"";position:absolute;bottom:0;left:0;width:3rem;height:3px;background:var(--heading-accent);border-radius:2px}.content h3{font-size:1.05rem;font-weight:700;margin:1.5rem 0 .5rem;color:var(--brand-900)}.content h4{font-size:.95rem;font-weight:700;margin:1.25rem 0 .4rem;color:var(--brand-900)}.content h5,.content h6{font-size:.9rem;font-weight:600;margin:1rem 0 .35rem;color:var(--text-secondary)}.content h2 .heading-anchor,.content h3 .heading-anchor{color:var(--text-muted);text-decoration:none;font-weight:400;font-size:.85em;opacity:0;transition:opacity .15s;margin-left:.5rem}.content h2:hover .heading-anchor,.content h3:hover .heading-anchor{opacity:1}.content p{margin-bottom:1rem}.content strong{font-weight:700;color:var(--text-primary)}.content em{font-style:italic}.content del{text-decoration:line-through;color:var(--text-muted)}.content mark{background:#fef08a;color:#1a1a1a;padding:.05em .2em;border-radius:2px}.content a{color:var(--brand-500);text-decoration:underline;text-decoration-color:var(--brand-300);text-underline-offset:2px}.content a:hover{color:var(--brand-900);text-decoration-color:var(--brand-500)}.content pre{position:relative;background:var(--bg-code);color:#d4d4d4;padding:0;border-radius:8px;overflow:hidden;margin-bottom:1.25rem;border:1px solid var(--border)}.content pre:before{content:"";display:block;padding:.6rem 1rem;background:#00000026;background-image:radial-gradient(circle at 16px 50%,var(--code-dot-red) 5px,transparent 5px),radial-gradient(circle at 36px 50%,var(--code-dot-yellow) 5px,transparent 5px),radial-gradient(circle at 56px 50%,var(--code-dot-green) 5px,transparent 5px);background-repeat:no-repeat;border-bottom:1px solid rgba(255,255,255,.05)}.content pre code{display:block;padding:1rem 1.5rem;overflow-x:auto;font-size:.88rem;line-height:1.6;counter-reset:line}.content :not(pre)>code{background:var(--brand-100);color:var(--brand-700);padding:.1em .35em;border-radius:3px;font-size:.9em}.content kbd{background:var(--bg-subtle);border:1px solid var(--border);border-radius:3px;padding:.1em .4em;font-size:.85em;font-family:monospace}.content blockquote{background:var(--info-bg);border-left:4px solid var(--info-border);border-radius:0 8px 8px 0;padding:1rem 1.25rem;color:var(--text-primary);margin:1.25rem 0;font-style:normal}.content blockquote p{margin-bottom:.35rem}.content blockquote p:last-child{margin-bottom:0}.content blockquote.callout-success,.content blockquote:has(>p:first-child>strong:first-child:is([data-type=success])){background:var(--success-bg);border-left-color:var(--success-border)}.content ul,.content ol{padding-left:1.5rem;margin-bottom:1rem}.content ul{list-style-type:disc}.content ol{list-style-type:decimal}.content li{margin-bottom:.35rem}.content li>ul,.content li>ol{margin-top:.25rem;margin-bottom:.25rem}.content input[type=checkbox]{margin-right:.4rem;accent-color:var(--brand-500)}.content hr{border:none;border-top:2px dashed var(--border);margin:2.5rem 0}.content img{max-width:100%;height:auto;border-radius:8px;margin:1rem 0;display:block}.content figure{margin:1.5rem 0}.content figcaption{font-size:.8rem;color:var(--text-muted);text-align:center;margin-top:.4rem}@media(max-width:640px){body{padding-left:1rem;padding-right:1rem}}@media(max-width:400px){body{padding-left:.75rem;padding-right:.75rem}nav{gap:.75rem}}.content .table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--border);border-radius:8px;margin-bottom:1.5rem}.content table{width:max-content;min-width:100%;border-collapse:separate;border-spacing:0;font-size:.9rem;border-radius:8px}.content th{background:var(--bg-subtle);font-weight:700;text-align:left;padding:.7rem 1rem;border-bottom:2px solid var(--border);color:var(--text-primary)}.content td{padding:.65rem 1rem;border-bottom:1px solid var(--border);color:var(--text-primary)}.content tr:last-child td{border-bottom:none}.content tbody tr:hover{background:var(--bg-subtle)}.content th:not(:last-child),.content td:not(:last-child){border-right:1px solid var(--border)}