[x-cloak] { display: none !important; }

.glass {
    background: rgba(255,255,255,0.85);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}
.dark .glass { background: rgba(3,7,18,0.85); }

.post-card { transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; }

/* Prose */
.prose-blog { line-height: 1.8; color: #374151; }
.dark .prose-blog { color: #d1d5db; }
.prose-blog h1 { font-size:2rem;   font-weight:900; color:#111827; margin:2rem 0 1rem;  line-height:1.2; }
.prose-blog h2 { font-size:1.5rem; font-weight:800; color:#111827; margin:2rem 0 .75rem; }
.prose-blog h3 { font-size:1.2rem; font-weight:700; color:#111827; margin:1.5rem 0 .5rem; }
.dark .prose-blog h1,.dark .prose-blog h2,.dark .prose-blog h3 { color:#f9fafb; }
.prose-blog p  { margin:0 0 1.25rem; }
.prose-blog strong { font-weight:700; color:#111827; }
.dark .prose-blog strong { color:#f9fafb; }
.prose-blog a  { color:#6366f1; text-decoration:underline; }
.prose-blog a:hover { color:#4f46e5; }
.prose-blog code { background:rgba(99,102,241,.08); color:#6366f1; padding:2px 7px; border-radius:6px; font-size:.875rem; }
.dark .prose-blog code { background:rgba(99,102,241,.15); color:#a5b4fc; }
.prose-blog pre { background:#1e1b4b; color:#e0e7ff; padding:1.25rem; border-radius:16px; overflow-x:auto; margin:1.5rem 0; font-size:.875rem; line-height:1.7; }
.prose-blog pre code { background:none; color:inherit; padding:0; }
.prose-blog blockquote { border-left:4px solid #6366f1; padding:.5rem 1rem; margin:1.5rem 0; background:rgba(99,102,241,.05); border-radius:0 12px 12px 0; font-style:italic; color:#6366f1; }
.dark .prose-blog blockquote { background:rgba(99,102,241,.1); }
.prose-blog ul { list-style:none; padding:0; margin:1rem 0; }
.prose-blog ul li { padding-left:1.5rem; position:relative; margin-bottom:.5rem; }
.prose-blog ul li::before { content:'›'; position:absolute; left:0; color:#6366f1; font-weight:700; }
.prose-blog img { border-radius:16px; margin:1.5rem 0; max-width:100%; }

@keyframes ukwave {
    0%   { transform:perspective(120px) rotateY(0deg)  skewY(0deg); }
    15%  { transform:perspective(120px) rotateY(12deg) skewY(1.5deg); }
    30%  { transform:perspective(120px) rotateY(4deg)  skewY(0.5deg); }
    45%  { transform:perspective(120px) rotateY(14deg) skewY(2deg); }
    60%  { transform:perspective(120px) rotateY(6deg)  skewY(1deg); }
    75%  { transform:perspective(120px) rotateY(10deg) skewY(1.5deg); }
    100% { transform:perspective(120px) rotateY(0deg)  skewY(0deg); }
}