/* ============================================================
   GLOBAL STYLES — VOIDFORGE STUDIO
   ============================================================ */

/* Color Tokens
   ============================================================ */
:root {
    --color-base: 10 5 5;       /* #0A0505 */
    --color-main: 242 235 235;  /* #F2EBEB */
    --color-muted: 140 122 122; /* #8C7A7A */
    --color-primary: 255 51 51; /* #FF3333 */
    --color-secondary: 153 0 0; /* #990000 */
    --color-border: 31 15 15;   /* #1F0F0F */
    --color-surface: 20 10 10;  /* #140A0A */
}

:root[data-theme="light"] {
    --color-base: 248 245 245;  /* #F8F5F5 */
    --color-main: 20 10 10;     /* #140A0A */
    --color-muted: 100 85 85;   /* #645555 */
    --color-primary: 220 0 0;   /* #DC0000 */
    --color-secondary: 120 0 0; /* #780000 */
    --color-border: 210 195 195;/* #D2C3C3 */
    --color-surface: 255 255 255;/* #FFFFFF */
}

/* Skill Bar Widths
   ============================================================ */
.skill-w-40  { width: 40%; }
.skill-w-70  { width: 70%; }
.skill-w-85  { width: 85%; }
.skill-w-90  { width: 90%; }
.skill-w-95  { width: 95%; }
.skill-w-100 { width: 100%; }

/* Animation Utilities
   ============================================================ */
.animate-delay-500 { animation-delay: 0.5s; }

/* Background Patterns
   ============================================================ */
.bg-diagonal-stripes {
    background-image: repeating-linear-gradient(
        45deg,
        rgb(var(--color-secondary)) 0,
        rgb(var(--color-secondary)) 1px,
        transparent 1px,
        transparent 10px
    );
}

/* Iframe Reset
   ============================================================ */
iframe.map-embed { border: 0; }

/* Custom Animations (Keyframes)
   ============================================================ */
@keyframes moveStripe {
    0% { background-position: 0 0; }
    100% { background-position: 1rem 0; }
}

@keyframes ticker {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

/* Typography Utilities
   ============================================================ */
.text-3d {
    text-shadow: 
        -1px 1px 0 rgb(var(--color-primary)),
        -2px 2px 0 rgb(var(--color-primary)),
        -3px 3px 0 rgb(var(--color-primary)),
        -4px 4px 0 rgb(var(--color-primary)),
        -5px 5px 0 rgb(var(--color-secondary)),
        -6px 6px 0 rgb(var(--color-secondary)),
        -7px 7px 0 rgb(var(--color-secondary)),
        -8px 8px 0 rgb(var(--color-secondary)),
        -15px 15px 25px rgb(var(--color-primary) / 0.15);
}