.blog-shell{background:radial-gradient(60rem 40rem at 50% -10%,color-mix(in oklch,var(--primary)10%,transparent),transparent 70%),var(--background);color:var(--foreground);min-height:100vh;font-family:var(--font-sans),system-ui,-apple-system,sans-serif}.blog-shell h1,.blog-shell h2,.blog-shell h3,.blog-shell h4{font-family:var(--font-sans),system-ui,-apple-system,sans-serif;letter-spacing:-.02em;color:var(--foreground);text-wrap:balance;font-weight:600}.blog-shell a{color:color-mix(in oklch,var(--primary)88%,var(--foreground));text-decoration:none;transition:color .14s}.blog-shell a:hover{color:var(--primary)}.blog-nav{z-index:40;border-bottom:1px solid var(--border);background:color-mix(in oklch,var(--background)78%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:sticky;top:0}.blog-nav a{color:var(--muted-foreground);font-size:.9rem;font-weight:500}.blog-nav a:hover{color:var(--foreground)}.blog-nav a:first-child{color:var(--foreground);font-weight:600}.blog-container{max-width:940px;margin:0 auto;padding:28px 24px 80px}.blog-hero{padding:56px 0 32px}.blog-hero h1{font-size:clamp(2rem,4vw,2.75rem);line-height:1.1}.blog-hero p,.blog-summary{color:var(--muted-foreground);line-height:1.65}.blog-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;display:grid}.blog-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:22px;transition:transform .18s,box-shadow .18s,border-color .18s;animation:.52s both blog-fade-up;box-shadow:0 1px 2px #0003}.blog-card:hover{border-color:color-mix(in oklch,var(--primary)45%,var(--border));transform:translateY(-3px);box-shadow:0 12px 32px #00000059}.blog-card h2{color:var(--foreground)}.blog-card h2 a{color:inherit}.blog-card h2 a:hover{color:var(--primary)}.blog-meta{color:var(--muted-foreground);font-size:.85rem}.blog-tags{flex-wrap:wrap;gap:8px;margin-top:14px;display:flex}.blog-tag{background:color-mix(in oklch,var(--primary)12%,transparent);color:color-mix(in oklch,var(--primary)80%,var(--foreground));border:1px solid color-mix(in oklch,var(--primary)22%,transparent);border-radius:999px;padding:4px 10px;font-size:.72rem;font-weight:500}.blog-header-stack{flex-direction:column;gap:10px;display:flex}.blog-header-title{margin-top:4px;font-size:clamp(2rem,4vw,2.6rem);line-height:1.12}.blog-article{background:var(--card);border:1px solid var(--border);border-radius:calc(var(--radius) + 6px);padding:40px;animation:.52s both blog-fade-up;box-shadow:0 12px 40px #00000047}.blog-article p{color:color-mix(in oklch,var(--foreground)88%,var(--muted-foreground));margin:0 0 18px;font-size:1.05rem;line-height:1.8}.blog-article h2{margin-top:40px;margin-bottom:4px;font-size:1.55rem}.blog-article h3{margin-top:26px;margin-bottom:2px;font-size:1.2rem}.blog-article ul,.blog-article ol{color:color-mix(in oklch,var(--foreground)88%,var(--muted-foreground));margin:12px 0 22px 20px;line-height:1.75}.blog-article li{margin-bottom:6px}.blog-article strong{color:var(--foreground)}.blog-table{border-collapse:collapse;border:1px solid var(--border);border-radius:var(--radius);width:100%;margin:18px 0 26px;font-size:.95rem;overflow:hidden}.blog-table th,.blog-table td{border-bottom:1px solid var(--border);text-align:left;padding:11px 14px}.blog-table th{background:color-mix(in oklch,var(--muted)60%,transparent);color:var(--foreground);font-weight:600}.blog-table tbody tr:last-child td,.blog-table tr:last-child td{border-bottom:none}.blog-callout{background:color-mix(in oklch,var(--primary)10%,var(--card));border:1px solid color-mix(in oklch,var(--primary)25%,var(--border));border-left:3px solid var(--primary);border-radius:var(--radius);margin:24px 0;padding:16px 18px}.blog-callout strong{color:var(--foreground);margin-bottom:4px;display:block}.blog-callout div{color:var(--muted-foreground)}.blog-related h2{color:var(--foreground)}.tool-field{flex-direction:column;gap:6px;display:flex}.tool-label{color:var(--foreground);font-size:.85rem;font-weight:600}.tool-input{border:1px solid var(--border);background:color-mix(in oklch,var(--muted)55%,transparent);color:var(--foreground);border-radius:8px;width:100%;padding:10px 12px;font-size:.95rem;transition:border-color .14s,box-shadow .14s}.tool-input::placeholder{color:var(--muted-foreground)}.tool-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in oklch,var(--primary)25%,transparent);outline:none}.tool-input option{background:var(--popover);color:var(--foreground)}.tool-result{border:1px solid var(--border);border-radius:var(--radius);background:color-mix(in oklch,var(--primary)8%,var(--card));color:var(--foreground);padding:18px 20px}.tool-result-mono{font-family:var(--font-mono),ui-monospace,monospace;word-break:break-all;font-size:.9rem}.tool-value{color:var(--primary);font-size:2rem;font-weight:700}.tool-error{color:var(--destructive)}.tool-note{color:var(--muted-foreground);margin-top:12px;font-size:.8rem}.tool-button{cursor:pointer;background:var(--primary);color:var(--primary-foreground);border:none;border-radius:8px;padding:10px 18px;font-weight:600;transition:opacity .14s,transform .14s}.tool-button:hover:not(:disabled){opacity:.9}.tool-button:disabled{cursor:not-allowed;opacity:.5}.blog-footer{border-top:1px solid var(--border);color:var(--muted-foreground);padding:28px 0 44px;font-size:.88rem}@media (max-width:640px){.blog-article{padding:24px}.blog-hero{padding:40px 0 24px}}@keyframes blog-fade-up{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.blog-card,.blog-article{animation:none}}