/* Neobrutalist custom styles */
.brutal-border {
    border: 4px solid #00ff00;
}

.brutal-shadow {
    box-shadow: 8px 8px 0 #00ff00;
}

.brutal-shadow-sm {
    box-shadow: 4px 4px 0 #00ff00;
}

.brutal-title {
    text-shadow: 3px 3px 0 #00ff00;
    color: #000000;
    -webkit-text-stroke: 2px #00ff00;
}

.brutal-link {
    transition: all 0.1s ease;
}

.brutal-link:hover {
    box-shadow: 10px 10px 0 #00ff00;
    transform: translate(-2px, -2px);
}

.brutal-link:active {
    box-shadow: 2px 2px 0 #00ff00;
    transform: translate(4px, 4px);
}

.post-card {
    transition: all 0.15s ease;
}

.post-card:hover {
    box-shadow: 10px 10px 0 #00ff00;
    transform: translate(-2px, -2px);
}

/* Prose typography for article content */
.prose h2 {
    font-size: 2rem;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-top: 3rem;
    margin-bottom: 1rem;
}

.prose h3 {
    font-size: 1.5rem;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 2rem;
    margin-bottom: 1rem;
}

.prose p {
    margin-bottom: 1.5rem;
}

.prose a {
    color: #00ff00;
    text-decoration: underline;
}

.prose a:hover {
    text-decoration: none;
}

.prose ul {
    list-style-type: '- ';
    margin-left: 2rem;
    margin-bottom: 1.5rem;
}

.prose ol {
    list-style-type: decimal;
    margin-left: 2rem;
    margin-bottom: 1.5rem;
}

.prose li {
    margin-bottom: 0.25rem;
}

/* Inline code */
.prose code {
    background-color: #001100;
    padding: 0.2rem 0.4rem;
    border: 2px solid #00ff00;
    font-size: 0.9em;
}

/* Code block wrapper (plain pre without Chroma) */
.prose pre {
    background-color: #0a0a0a;
    border: 4px solid #00ff00;
    box-shadow: 4px 4px 0 #00ff00;
    padding: 1rem;
    overflow-x: auto;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    font-size: 0.875rem;
    line-height: 1.7;
}

.prose pre code {
    background-color: transparent;
    border: none;
    padding: 0;
    font-size: inherit;
}

/* Chroma highlight wrapper — border lives here */
.prose .highlight {
    border: 4px solid #00ff00;
    box-shadow: 4px 4px 0 #00ff00;
    background-color: #0a0a0a;
    overflow-x: auto;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

/* Strip border/shadow from all pre inside Chroma */
.prose .highlight pre {
    border: none;
    box-shadow: none;
    margin: 0;
    padding: 0.75rem 0;
    background-color: transparent;
    font-size: 0.875rem;
    line-height: 1.7;
    overflow: visible;
}

/* Chroma base */
.chroma {
    color: #e0ffe0;
    background-color: #0a0a0a;
}

/* Line table layout */
.chroma .lntable {
    border-spacing: 0;
    padding: 0;
    margin: 0;
    border: 0;
    width: 100%;
}

.chroma .lntd {
    vertical-align: top;
    padding: 0;
    margin: 0;
    border: 0;
}

.chroma .lntd:first-child {
    width: 3rem;
    min-width: 3rem;
}

.chroma .lntd:last-child {
    width: 100%;
}

/* Line numbers */
.chroma .lnt,
.chroma .ln {
    white-space: pre;
    -webkit-user-select: none;
    user-select: none;
    margin-right: 0.8em;
    padding: 0 0.8em 0 0.8em;
    color: #335533;
    border-right: 2px solid #1a3a1a;
}

/* Line */
.chroma .line {
    display: flex;
    padding: 0 1rem;
}

/* Line highlight */
.chroma .hl {
    background-color: #002200;
}

/* Keywords - bright green */
.chroma .k,
.chroma .kc,
.chroma .kd,
.chroma .kp,
.chroma .kr,
.chroma .kt { color: #00ff00; font-weight: bold; }

/* Keyword namespace/import */
.chroma .kn { color: #ff3366; }

/* Names - light green */
.chroma .na { color: #66ff66; }
.chroma .nc { color: #66ff66; font-weight: bold; }
.chroma .no { color: #00cccc; }
.chroma .nd { color: #66ff66; }
.chroma .ne { color: #66ff66; }
.chroma .nf,
.chroma .fm { color: #66ff66; }
.chroma .nx { color: #a6e22e; }
.chroma .nt { color: #ff3366; }

/* Strings - yellow/gold */
.chroma .s,
.chroma .sa,
.chroma .sb,
.chroma .sc,
.chroma .dl,
.chroma .sd,
.chroma .s2,
.chroma .sh,
.chroma .si,
.chroma .sx,
.chroma .sr,
.chroma .s1,
.chroma .ss { color: #e6db74; }

.chroma .se { color: #ae81ff; }

/* Literals/Numbers - purple */
.chroma .l,
.chroma .ld { color: #ae81ff; }

.chroma .m,
.chroma .mb,
.chroma .mf,
.chroma .mh,
.chroma .mi,
.chroma .il,
.chroma .mo { color: #ae81ff; }

/* Operators */
.chroma .o,
.chroma .ow { color: #ff3366; }

/* Comments - dim green */
.chroma .c,
.chroma .ch,
.chroma .cm,
.chroma .c1,
.chroma .cs,
.chroma .cp,
.chroma .cpf { color: #4a7a4a; font-style: italic; }

/* Diff */
.chroma .gd { color: #ff3366; background-color: #1a0011; }
.chroma .gi { color: #00ff00; background-color: #001a00; }
.chroma .ge { font-style: italic; }
.chroma .gs { font-weight: bold; }
.chroma .gu { color: #4a7a4a; }

/* Error */
.chroma .err { color: #ff3366; }

.prose blockquote {
    border-left: 4px solid #00ff00;
    padding-left: 1rem;
    font-style: italic;
    margin-bottom: 1.5rem;
}

/* Article images */
.prose img {
    max-width: 100%;
    height: auto;
    border: 4px solid #00ff00;
    margin-top: 1.5rem;
    margin-bottom: 0.5rem;
}

.prose img + em {
    display: block;
    text-align: center;
    font-size: 0.875rem;
    opacity: 0.6;
    margin-bottom: 1.5rem;
}
