:root {
    --bg: #0e1b14;
    --bg-2: #020202;
    --accent: #3dd96f;
    --accent-2: #28b4ad;
    --accent-3: #1e40ff;
     
    --txt: #e8fcee;
    --txt-2: #b4d7be;
    --txt-3: #7a8e81;

    --link: #8ceeb5;

    --radius: 12px;
}

:root[data-theme="light"] {
    /* Backgrounds */
    --bg: #c4e0bb;       /* Main page background */
    --bg-2: #92e687;     /* Card/section background: bright, clean contrast */

    /* Accent & links */
    --accent: #28b463;   /* Deep green for accents */
    --link: #1e8449;     /* Dark green for clickable links */

    /* Text colors */
    --txt: #1c2a20;      /* Primary text: dark */
    --txt-2: #3d5a45;    /* Secondary text: muted */
    --txt-3: #62786c;    /* Tertiary text: subtle captions */

    /* Shadow for elevated elements */
    --shadow: 0 4px 16px rgba(40, 180, 99, 0.15);
}


html, body {
    height: 100%;
    margin: 0;
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar {
    display: none;
}

body {
    background-color: var(--bg);
    color: var(--txt);
    font-family: monospace;
    transition: all 0.3s ease;
    margin: 0;
    padding: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
    
}

p {
    color: var(--txt-2);
    margin: 2px 0;
    line-height: 1.25rem;
}

a {
    color: var(--link);
}

.codeblock {
    background-color: var(--bg);
    padding: 3px 6px;
    border-radius: 10px;
    line-height: 1.25rem;
    font-family: monospace;
    color: var(--txt-2);
}