:root {
    /* Core colors - Brutalist Terminal */
    --color-accent: #1a1a1a;
    --color-accent-transparent: rgba(255, 85, 255, 0.1);
    --color-bg: #291b3e;
    --color-bg-secondary: #18181b;
    --color-link: #55ffff;
    --color-secondary: #ff55ff;
    --color-secondary-accent: #dc2626;
    --color-shadow: #000000;
    --color-table: #ff55ff;
    --color-text: #d4d4d8;
    --color-text-secondary: #fafafa;
    --color-text-tertiary: #ff55ff;
    --color-scrollbar: #796790;
    --font-family: 'JetBrains Mono', 'Berkeley Mono', 'Cascadia Code', monospace;
    --hover-brightness: 1.5;
    --border-radius: 0; /* Kill all rounded corners */
}

@font-face {
    font-family: 'JetBrains Mono';
    font-style: normal;
    src: local(''),
    url('../fonts/JetBrainsMono-Regular.woff2') format('woff2');
}

/* Import Inter for better readability in paragraphs */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');

/* Dark brutalist background */
body {
    background-color: var(--color-bg);
    background-image: linear-gradient(160deg, var(--color-bg-secondary) 0%, var(--color-bg) 35%);
    background-attachment: fixed;
}

/* Better readability for main content paragraphs */
main p,
ol:not(.publications ol) li,
ul:not(.publications ul):not(nav ul) li {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size: 1rem;
    line-height: 1.4;
    font-weight: 400;
    /* Font rendering optimization for all platforms */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

li p {
    margin: 0;
}

nav a img {
    border-style: solid;
    border-color: var(--color-scrollbar);
    border-width: 1px;
    box-shadow: 0 0 25px rgba(69, 53, 91, 1);  /* mniejszy blur, mocniejszy kolor */
}

img {
    image-rendering: smooth;
}

code,
samp {
    background-color: var(--color-accent-transparent);
    font-family: var(--font-family);
    border-left: 2px solid var(--color-secondary);
    padding-left: 0.5rem;
}

/* Sharp blockquotes */
blockquote,
blockquote p {
    display: block;
    font-size: medium;
    line-height: var(--line-height);
    text-align: var(--justify-normal);
    border-right: none;
    border-left: 3px solid var(--color-secondary);
    padding: 0 0 0 1rem;
    margin-left: 0;
    max-width: 100%;
    background: rgba(255, 85, 255, 0.03);
}

blockquote p {
    border-left: none;
    background: none;
}

blockquote footer {
    color: var(--color-text);
    display: block;
    font-size: small;
    line-height: var(--line-height);
    padding: 1.5rem 0;
}

/* Links with glow effect */
a {
    text-decoration: none;
    word-break: break-word;
    transition: all 0.2s ease;
}

a:hover {
    color: #ffffff;
    text-shadow: 0 0 10px currentColor;
    filter: brightness(var(--hover-brightness));
}

/* Terminal cursor effect only for main h1 */
main > h1::after {
    content: '_';
    animation: blink 1s infinite;
    color: var(--color-secondary);
    font-weight: normal;
}

@keyframes blink {
    0%, 50% { opacity: 1; }
    51%, 100% { opacity: 0; }
}

/* Scrollbar styling */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--color-scrollbar) var(--color-bg);
}

*::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

*::-webkit-scrollbar-track {
    background: var(--color-bg);
}

*::-webkit-scrollbar-thumb {
    background-color: var(--color-scrollbar);
    border: 1px solid var(--color-bg);
}

*::-webkit-scrollbar-thumb:hover {
    background-color: var(--color-secondary);
}

/* Navigation spacing */
nav {
    margin-bottom: 1rem;
}

/* Remove borders radius globally */
nav ul li ul,
aside,
button,
input,
select,
textarea,
table,
dialog,
form {
    border-radius: 0 !important;
}

/* Images and code responsiveness */
p img,
pre,
pre code,
pre samp {
    max-width: 100%;
}

/* Pre blocks with terminal styling */
pre {
    background: #18181b;
    border: 1px solid var(--color-scrollbar);
    border-left: 3px solid var(--color-secondary);
}

pre code {
    background: transparent;
    border: none;
}

/* Table alignment fixes */
table td[align],
table th[align] {
    text-align: left !important;
}

table td[align="center"],
table th[align="center"] {
    text-align: center !important;
}

table td[align="right"],
table th[align="right"] {
    text-align: right !important;
}

/* Horizontal rule */
hr {
    background-color: var(--color-scrollbar);
    height: 1px;
    border: none;
    margin: 0;
}

/* Header colors */
h1, strong {
    color: var(--color-text-secondary);
}

h2 {
    color: var(--color-text-tertiary);
    padding-bottom: 0.3rem;
}

h3, h4, h5, h6 {
    color: var(--color-text);
}

/* Small text */
small {
    color: var(--color-scrollbar);
}

/* Publication date styling */
.publication-date {
    color: var(--color-scrollbar);
    font-size: 0.9rem;
    margin-top: 2rem;
    padding-top: 1rem;
    border-top: 1px solid var(--color-scrollbar);
}

/* Blog list specific */
.publications ul {
    list-style: none;
    padding-left: 0;
}

.publications ul li {
    border-left: 2px solid transparent;
    padding-left: 1rem;
    transition: all 0.2s ease;
}



/* Selection color */
::selection {
    background: var(--color-secondary);
    color: var(--color-bg);
}

::-moz-selection {
    background: var(--color-secondary);
    color: var(--color-bg);
}

/* Button overrides for brutalist style */
button,
input[type="submit"] {
    background: var(--color-bg);
    border: 1px solid var(--color-secondary);
    color: var(--color-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: all 0.2s ease;
}

button:hover,
input[type="submit"]:hover {
    background: var(--color-secondary);
    color: var(--color-bg);
    box-shadow: 0 0 15px rgba(255, 85, 255, 0.5);
}

/* Active state */
a:active,
button:active {
    transform: translate(1px, 1px);
}

/* Focus visible for accessibility */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--color-secondary);
    outline-offset: 2px;
}

/* Terminal-style list markers */
ul li::marker {
    color: var(--color-secondary);
}

/* Code syntax highlighting override */
.microlight {
    background: #18181b !important;
    color: var(--color-text) !important;
}

ol li::marker {
    color: #55ffff;  /* twój niebieski */
}