body {
    background-color: #000033;
    color: #FFFFFF; 
    font-family: "Comic Sans MS", "Arial", sans-serif; /* Quintessential Y2K font stack */
    cursor: url('Cursor/antialiased-classic/SmoothArrow.cur'), auto;
}

h1, h2, h3 {
    color: #FF00FF;
    font-family: "Impact", "Arial Black", sans-serif;
    text-shadow: 2px 2px #00FFFF;
}

a {
    color: #00FFFF;
    text-decoration: none; 
}
a:hover {
    color: #FFFF00;
    background-color: #FF00FF;
}

.neon-box {
    border: 3px dashed lime;
    padding: 10px;
    margin: 15px;
    background-color: rgba(0, 0, 0, 0.3);
}


.y2k-box {
    background-color: rgba(0,0,50,0.5);
    /* You might have other general box styles here, like default padding or text color if not lime */
}

/* Specific Styles for the Character Sheet Section */
.character-sheet-container td { /* The TD holding the character sheet */
    background-color: rgba(0,0,50,0.2); /* Original style from that TD */
    padding: 10px;
}

.character-sheet {
    width: 98%;
    margin: 0 auto;
    border: 3px outset aqua;
    padding: 10px;
    background-color: rgba(0,0,50,0.5); /* Matches .y2k-box */
    color: lime;
    font-family: 'MS Sans Serif', 'Pixelated MS Sans Serif', Arial, sans-serif; /* Added fallback */
}

.character-sheet .header-box { /* Styles for .header-box *inside* .character-sheet */
    border: 2px inset fuchsia;
    background-color: rgba(0,0,80,0.7);
    text-align: center;
    padding: 5px;
    margin-bottom: 10px;
}

.character-sheet .header-box h1 {
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    color: fuchsia; /* Pink main color */
    text-shadow: 2px 2px 0px aqua; /* Blue shadow - adjust offset and blur (0px) as desired */
    /* Alternative shadow:  1px 1px 0px aqua, -1px -1px 0px aqua; /* for all-around outline */
    margin: 0;
}
.character-sheet .header-box p {
    font-size: 12px;
    color: aqua;
    margin-top: 5px; /* Added some margin for better spacing */
}

.character-sheet .inner-layout-table { /* Class for the table inside character-sheet */
    width: 100%;
    border: 1px dashed #00FFFF; /* aqua */
    margin-bottom: 10px;
    border-collapse: collapse; /* Good practice for tables */
}
.character-sheet .inner-layout-table td {
    vertical-align: top; /* Moved from inline */
}
.character-sheet .inner-layout-table .left-column {
    padding-right: 5px; /* Moved from inline */
}
.character-sheet .inner-layout-table .right-column {
    padding-left: 5px; /* Moved from inline */
}


.character-sheet .stat-box,
.character-sheet .combat-box,
.character-sheet .hp-box,
.character-sheet .attacks-box { /* Common styles for these content boxes */
    background-color: rgba(20,0,70,0.6);
    padding: 8px;
    margin-bottom: 10px;
}
.character-sheet .stat-box h3,
.character-sheet .combat-box h3,
.character-sheet .hp-box h3,
.character-sheet .attacks-box h3,
.character-sheet .details-box h3,
.character-sheet .equipment-box h3 {
    margin-top: 0;
    color: fuchsia; /* Pink main color */
    text-shadow: 1px 1px 0px aqua; /* Blue shadow - slightly smaller for h3 */
    /* You might want a different font for h3 if Impact is too bold for smaller titles */
    /* font-family: 'Arial Black', Gadget, sans-serif; */
}
.character-sheet .stat-box h3 img, /* For icons next to headings */
.character-sheet .combat-box h3 img,
.character-sheet .hp-box h3 img,
.character-sheet .attacks-box h3 img {
    vertical-align: middle;
}


/* Specific overrides for different box types if needed, beyond common styles */
.character-sheet .stat-box {
    color: yellow;
    border: 2px outset aqua;
}
.character-sheet .stat-box h3 {
    text-align: center;
    color: fuchsia;
}

.character-sheet .combat-box {
    color: yellow;
    border: 2px outset aqua;
}

.character-sheet .hp-box {
    color: yellow; /* Bright Green */
    border: 2px groove aqua;
}
.character-sheet .hp-box .hp-bar-full { /* Class for the green part of HP bar */
    background-color: #006400;
    display: inline-block;
    width: 50px; /* Or use percentages */
    height: 10px;
    border: 1px solid #00FF00;
}
.character-sheet .hp-box .hp-bar-empty { /* Class for the gray part of HP bar */
    background-color: #555;
    display: inline-block;
    width: 30px; /* Or use percentages */
    height: 10px;
    border: 1px solid #666;
}
.character-sheet .hp-box img { /* Specifically for heart icon, etc. */
    vertical-align: middle;
}

.character-sheet .attacks-box {
    color: yellow;
    border: 2px ridge aqua;
}

.character-sheet .details-box {
    border: 2px inset fuchsia;
    background-color: rgba(0,0,80,0.7);
    color: aqua;
    padding: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
}
.character-sheet .details-box h3 {
    margin-top: 0;
}
.character-sheet .details-box p {
    color: #CCCCCC; /* Default p color in this box */
    margin-bottom: 5px; /* Spacing for paragraphs */
}
.character-sheet .details-box p.trait-text { /* Special class for trait text if you want to override default p */
    color: lime;
}


.character-sheet .equipment-box {
    border: 2px dashed aqua;
    background-color: rgba(0,0,80,0.7);
    color: lime;
    padding: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
}
.character-sheet .equipment-box h3 {
    margin-top: 0;
}
.character-sheet .equipment-box h3 img {
    vertical-align: middle;
}
.character-sheet .equipment-box ul {
    list-style-image: url('Graphics/bullet_pixel.gif'); /* Assuming path, ensure correct relative path */
    color: #DDDDDD;
    padding-left: 25px; /* Adjust for bullet image */
}
.character-sheet .equipment-box ul li {
    margin-bottom: 3px; /* Spacing for list items */
}


.character-sheet .footer-box {
    font-size: 10px;
    text-align: center;
    color: #CCCCCC;
    border-top: 1px dashed fuchsia;
    padding-top: 10px;
    margin-top: 15px;
}
.character-sheet .footer-box a {
    color: aqua; /* Link color in footer */
}
.character-sheet .footer-box img { /* For under construction, d20 icons */
    vertical-align: middle;
}


/* Other General elements that might need Y2K styling if not covered by specifics */
.character-sheet h3 { /* General h3 inside character sheet if not overridden */
    /* Consider a default color like yellow or fuchsia */
    /* color: yellow; */
}
.character-sheet p {
    /* General p if not overridden by box-specific p styles */
    /* Consider a default like #CCCCCC if not lime from .character-sheet */
    /* color: #CCCCCC; */
    line-height: 1.4; /* Improves readability slightly */
}
.character-sheet img { /* General image vertical alignment */
    vertical-align: middle; /* You had this in many places, can be a default for images inside the sheet */
}
.character-sheet b, .character-sheet strong { /* Making bold text pop */
    color: yellow; /* Or another highlight color */
}