:root {
    --penpro-navy: #111827;
    --penpro-blue: #1d4ed8;
    --penpro-red: #ea4b35;
    --penpro-gold: #f59e0b;
}
* { scroll-behavior: smooth; }
body { font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.glass-nav { background: rgba(255, 255, 255, .82); backdrop-filter: blur(22px); border-bottom: 1px solid rgba(15, 23, 42, .08); }
.hero-grid { background-image: linear-gradient(rgba(29,78,216,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(29,78,216,.07) 1px, transparent 1px); background-size: 42px 42px; }
.prose-penpro p { margin-bottom: 1rem; line-height: 1.85; color: #475569; }
.prose-penpro ul { margin-left: 1.25rem; list-style: disc; color: #475569; line-height: 1.85; }
.prose-penpro h2, .prose-penpro h3 { color: #0f172a; font-weight: 800; margin: 1.25rem 0 .75rem; }
.article-body img { border-radius: 1rem; margin: 1.25rem 0; max-width: 100%; height: auto; }
.article-body p { margin-bottom: 1rem; line-height: 1.85; color: #475569; }
.admin-card { border: 1px solid rgba(15,23,42,.08); box-shadow: 0 20px 55px rgba(15,23,42,.08); }
.input-modern { width: 100%; border-radius: 1rem; border: 1px solid #e2e8f0; padding: .9rem 1rem; outline: none; transition: .2s; background: #fff; }
.input-modern:focus { border-color: #1d4ed8; box-shadow: 0 0 0 4px rgba(29,78,216,.10); }
.btn-primary-modern { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; border-radius: 999px; background: linear-gradient(135deg, #1d4ed8, #0f172a); color: white; padding: .85rem 1.2rem; font-weight: 700; box-shadow: 0 16px 35px rgba(29,78,216,.22); transition: .2s; }
.btn-primary-modern:hover { transform: translateY(-1px); filter: brightness(1.05); }
.btn-secondary-modern { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; border-radius: 999px; border: 1px solid #cbd5e1; background: #fff; color: #0f172a; padding: .85rem 1.2rem; font-weight: 700; transition: .2s; }
.btn-secondary-modern:hover { transform: translateY(-1px); border-color: #94a3b8; }
.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; }