/* --- Base --- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Roboto',system-ui,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
a{color:inherit;text-decoration:none}
img,video{max-width:100%;height:auto}

/* --- Line Clamp --- */
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.line-clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* --- Ad Containers --- */
.ad-container{background:transparent;overflow:hidden;transition:all .2s}
.ad-container[style*="display:none"]{display:none !important}

/* --- Navigation --- */
.nav-top ul,.nav-mobile ul{list-style:none;margin:0;padding:0}
.nav-top li{display:inline-block}
.nav-top a{display:inline-block;padding:8px 12px;font-size:14px;font-weight:500;color:#6b7280;border-radius:8px;transition:color .2s,background .2s}
.dark .nav-top a{color:#9ca3af}
.nav-top a:hover,.nav-top .active a{color:#e56c2c;background:#fef2ee}
.dark .nav-top a:hover,.dark .nav-top .active a{color:#e56c2c;background:rgba(229,108,44,.1)}
.nav-mobile a{display:block;padding:10px 16px;font-size:15px;font-weight:500;color:#374151;border-radius:8px;transition:color .2s,background .2s}
.dark .nav-mobile a{color:#d1d5db}
.nav-mobile a:hover,.nav-mobile .active a{color:#e56c2c;background:#fef2ee}
.dark .nav-mobile a:hover,.dark .nav-mobile .active a{color:#e56c2c;background:rgba(229,108,44,.1)}

/* --- Pagination --- */
.pagination ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:4px}
.pagination li{display:inline-block}
.pagination a,.pagination span{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 12px;font-size:14px;font-weight:500;border-radius:8px;transition:all .2s}
.pagination a{color:#374151;border:1px solid #e5e7eb;background:#fff}
.dark .pagination a{color:#d1d5db;border-color:#374151;background:#111827}
.pagination a:hover{color:#e56c2c;border-color:#e56c2c}
.pagination .active span{color:#fff;background:#e56c2c;border-color:#e56c2c}

/* --- Widgets --- */
.widget{border:1px solid #e5e7eb;border-radius:12px;padding:16px;background:#fff}
.dark .widget{border-color:#1f2937;background:#111827}
.widget-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#9ca3af;margin-bottom:12px}
.widget ul{list-style:none;margin:0;padding:0}
.widget li{padding:8px 0;border-bottom:1px solid #f3f4f6}
.dark .widget li{border-bottom-color:#1f2937}
.widget li:last-child{border-bottom:none}
.widget li a{font-size:14px;line-height:1.4;font-weight:500;color:#374151;transition:color .2s}
.dark .widget li a{color:#d1d5db}
.widget li a:hover{color:#e56c2c}

/* --- Popular Posts Counter --- */
.popular-posts-count{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 6px;font-size:11px;font-weight:700;color:#fff;background:#e56c2c;border-radius:6px;margin-right:8px}

/* --- Tag Cloud --- */
.tag-cloud a{display:inline-block;padding:4px 10px;font-size:13px;font-weight:500;color:#6b7280;background:#f9fafb;border:1px solid #e5e7eb;border-radius:6px;margin:2px;transition:all .2s}
.dark .tag-cloud a{color:#9ca3af;background:#1f2937;border-color:#374151}
.tag-cloud a:hover{color:#e56c2c;border-color:#e56c2c;background:#fef2ee}
.dark .tag-cloud a:hover{color:#e56c2c;border-color:#e56c2c;background:rgba(229,108,44,.1)}

/* --- Prose Overrides --- */
.prose h2{font-size:1.5rem;font-weight:800;margin-top:2rem;margin-bottom:.75rem;letter-spacing:-.02em}
.prose h3{font-size:1.25rem;font-weight:700;margin-top:1.5rem;margin-bottom:.5rem}
.prose p{line-height:1.75;margin-bottom:1.25rem}
.prose a{color:#e56c2c;text-decoration:underline;text-underline-offset:2px}
.prose a:hover{text-decoration:none}
.prose blockquote{border-left:4px solid #e56c2c;padding-left:1rem;font-style:italic;color:#6b7280}
.dark .prose blockquote{color:#9ca3af}
.prose code{background:#f3f4f6;padding:2px 6px;border-radius:4px;font-size:.875em}
.dark .prose code{background:#1f2937}
.prose pre code{background:transparent;padding:0}
.prose pre{background:#1f2937;color:#e5e7eb;padding:1rem;border-radius:8px;overflow-x:auto}
.prose img{border-radius:8px;margin:1.5rem 0}
.prose ul,.prose ol{padding-left:1.5rem;margin-bottom:1.25rem}
.prose li{margin-bottom:.25rem}

/* --- Scroll Up --- */
#scroll-up{transition:opacity .3s,transform .3s;opacity:0;transform:translateY(10px)}
#scroll-up.visible{opacity:1;transform:translateY(0)}

/* --- Mobile Menu --- */
.menu-mobile .active a{color:#e56c2c;background:#fef2ee}
.dark .menu-mobile .active a{color:#e56c2c;background:rgba(229,108,44,.1)}

/* --- Social Icons --- */
.social a{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;color:#9ca3af;border-radius:8px;transition:color .2s,background .2s}
.social a:hover{color:#e56c2c;background:#fef2ee}
.dark .social a:hover{background:rgba(229,108,44,.1)}

/* --- Focus --- */
:focus-visible{outline:2px solid #e56c2c;outline-offset:2px}

/* --- Responsive Tables --- */
.prose table{width:100%;border-collapse:collapse;margin:1.5rem 0}
.prose th,.prose td{padding:8px 12px;border:1px solid #e5e7eb;text-align:left;font-size:14px}
.dark .prose th,.dark .prose td{border-color:#374151}
.prose th{background:#f9fafb;font-weight:700}
.dark .prose th{background:#1f2937}
