Journal · January 29, 2026

Not Fighting the World

Not darkness like hate or anger—but the part of you that refuses to bend when things push back.

You don’t become strong when everything is going well. You become strong when it’s hard and you don’t quit anyway.

This is about taking a stand. About choosing courage even when it costs you something. About staying upright when people misunderstand you, doubt you, or push against you.

I’m not fighting the world. I’m fighting the part of me that wants to disappear to make things easier.

I keep going. Quietly. Deliberately. Not to prove anything—but because I won’t abandon myself.

That’s the line.

:root {
--bg: #0b0b10;
--fg: #f5f5f7;
--muted: rgba(245, 245, 247, 0.6);
--muted-soft: rgba(245, 245, 247, 0.55);
--border-subtle: rgba(255, 255, 255, 0.06);
--border-strong: rgba(255, 255, 255, 0.18);
--border-hover: rgba(255, 255, 255, 0.5);
--accent-x: #e6e6e6;
--accent-linkedin: #0a66c2;
--accent-instagram: #e1306c;
}

body {
margin: 0;
min-height: 100vh;
background: #000;
color: var(--fg);
font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif;
}

.post {
max-width: 700px;
margin: 3rem auto;
padding: 2.5rem 2rem;
background: var(--bg);
color: var(--fg);
border-radius: 18px;
border: 1px solid var(--border-subtle);
box-shadow: 0 24px 60px rgba(0, 0, 0, 0.55);
}

.breadcrumbs {
font-size: 0.8rem;
text-transform: uppercase;
letter-spacing: 0.16em;
color: var(--muted-soft);
margin-bottom: 1rem;
}

.breadcrumbs a {
color: rgba(245, 245, 247, 0.78);
text-decoration: none;
}

.breadcrumbs a:hover {
text-decoration: underline;
}

.breadcrumbs .separator {
margin: 0 0.4rem;
}

.post-meta {
font-size: 0.85rem;
color: var(--muted);
margin: 0 0 0.5rem;
}

.post-title {
font-size: 2rem;
letter-spacing: 0.03em;
margin: 0 0 2rem;
}

.post-body {
line-height: 1.7;
font-size: 1.02rem;
color: rgba(245, 245, 247, 0.9);
}

.post-body p {
margin: 0 0 1.3rem;
}

.post-body strong {
font-weight: 600;
}

.post-footer {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 2.5rem;
padding-top: 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.share-label {
font-size: 0.85rem;
text-transform: uppercase;
letter-spacing: 0.18em;
color: var(--muted-soft);
}

.share-links {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
}

.share-btn {
font-size: 0.85rem;
padding: 0.45rem 0.9rem;
border-radius: 999px;
border: 1px solid var(--border-strong);
color: rgba(245, 245, 247, 0.9);
text-decoration: none;
backdrop-filter: blur(12px);
background: linear-gradient(120deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.02));
transition: background 0.18s ease, transform 0.18s ease, border-color 0.18s ease;
}

.share-btn:hover {
background: rgba(255, 255, 255, 0.09);
border-color: var(--border-hover);
transform: translateY(-1px);
}

.share-x:hover {
border-color: var(--accent-x);
}

.share-linkedin:hover {
border-color: var(--accent-linkedin);
}

.share-instagram:hover {
border-color: var(--accent-instagram);
}

@media (max-width: 600px) {
.post {
margin: 1.5rem 1rem;
padding: 1.8rem 1.4rem;
}

.post-title {
font-size: 1.6rem;
}

.post-footer {
flex-direction: column;
align-items: flex-start;
gap: 0.75rem;
}
}

If you tell me your platform (e.g., Ghost, WordPress, custom React/Next), I can adjust this to drop directly into your template.