html {
    filter: grayscale(100%) !important;
}

html, body {
    background: #09070c url('https://images2.alphacoders.com/517/517942.jpg') no-repeat center center fixed !important;
    background-size: cover !important;
    background-attachment: fixed !important;
    cursor: crosshair !important;
    margin: 0;
    padding: 0;
    position: relative !important;
}

/* GIF DA TOMOKO: Ajustado para não subir na barra do topo */
body::after {
    content: "" !important;
    position: absolute !important;
    left: calc(50% - 530px) !important; 
    top: 195px !important; /* Empurrado um pouco para baixo para alinhar perfeitamente */
    width: 120px !important;
    height: 120px !important;
    background: url('https://media.tenor.com/7Rojyx85vL8AAAAi/tomoko-tomoko-kuroki.gif') no-repeat center center !important;
    background-size: contain !important;
    z-index: 9999 !important;
}

table table table, .box, #f4chan-box, td[width="20%"] table, .profile-info, .contact-box {
    background: #0d0914 !important;
    border: 1px solid #3c166d !important;
    border-radius: 6px !important;
    box-shadow: 0 0 15px rgba(60, 22, 109, 0.6) !important;
    margin-bottom: 12px !important;
}

audio, embed, object, iframe, [class*="player"], [id*="player"], video {
    max-width: 100% !important;
    border: 1px solid #ff007f !important;
    border-radius: 6px !important;
    box-shadow: 0 0 20px rgba(255, 0, 127, 0.4) !important;
    background: #10002b !important;
    filter: invert(0.9) hue-rotate(260deg) contrast(120%) brightness(90%) !important;
    display: block !important;
    margin: 5px auto !important;
}

#container, .content, #main, #wrap, table, tr, td {
    border-color: transparent !important;
}

body > table:nth-of-type(2), table[width="800"], table[width="100%"] table {
    background-color: rgba(10, 7, 15, 0.94) !important;
    border: 2px solid #240046 !important;
    border-radius: 8px !important;
    box-shadow: 0 0 25px rgba(90, 24, 154, 0.4) !important;
    padding: 12px !important;
}

.heading, th, 
td[bgcolor="#6699cc"], td[bgcolor="#6699CC"],
td[bgcolor="#ffcc99"], td[bgcolor="#FFCC99"],
tr[bgcolor="#6699cc"] td, tr[bgcolor="#ffcc99"] td,
.orange-box h2, .blue-box h2, h2 {
    background: linear-gradient(135deg, #240046 0%, #10002b 100%) !important;
    color: #ff007f !important;
    font-family: 'Courier New', monospace !important;
    font-size: 13px !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    text-shadow: 0 0 8px rgba(255, 0, 127, 0.8) !important;
    border: 1px solid #3c166d !important;
    border-radius: 4px !important;
    padding: 6px 10px !important;
}

td, td:not([bgcolor]), .box-content, td[bgcolor="#fff4e5"], td[bgcolor="#FFF4E5"] {
    background: #0d0914 !important;
    color: #c77dff !important;
    font-family: 'Courier New', monospace !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}

td b, td font, .orange-box b, td.text [color] {
    color: #ff007f !important;
    text-shadow: 0 0 4px rgba(255, 0, 127, 0.4) !important;
    background: transparent !important;
    border: none !important;
}

/* BARRA DO TOPO: Camada isolada para garantir que nada passe por cima dela */
body > table:first-of-type, .navbar {
    background: #10002b !important;
    border-bottom: 3px solid #ff007f !important;
    box-shadow: 0 4px 15px rgba(255, 0, 127, 0.2) !important;
    position: relative !important;
    z-index: 999999 !important;
}

body > table:first-of-type a, .navbar a {
    color: #c77dff !important;
    font-family: 'Courier New', monospace !important;
    font-weight: bold !important;
}

body > table:first-of-type a:hover, .navbar a:hover {
    color: #ff007f !important;
    text-shadow: 0 0 10px #ff007f !important;
}

a, a:visited, a:link {
    color: #ffb703 !important;
    font-weight: bold !important;
    text-decoration: none !important;
    border-bottom: 1px dashed #ffb703 !important;
    transition: all 0.2s ease-in-out !important;
}

a:hover {
    color: #ff007f !important;
    border-bottom: 1px solid #ff007f !important;
    text-shadow: 0 0 10px #ff007f !important;
}

img {
    border: 2px solid #5a189a !important;
    border-radius: 4px !important;
    background: #050307 !important;
    padding: 4px !important;
    filter: contrast(115%) saturate(110%) !important;
    transition: all 0.3s ease !important;
}

img:hover {
    border-color: #ff007f !important;
    box-shadow: 0 0 15px #ff007f !important;
    transform: scale(1.02);
}

input[type="button"], input[type="submit"], button, .button, [class*="button"], [href*="edit"] {
    background: linear-gradient(to bottom, #3c166d, #140126) !important;
    border: 1px solid #ff007f !important;
    border-radius: 4px !important;
    color: #fff !important;
    font-family: 'Courier New', monospace !important;
    font-size: 11px !important;
    font-weight: bold !important;
    padding: 4px 10px !important;
    cursor: pointer !important;
    box-shadow: 0 0 5px rgba(255, 0, 127, 0.3) !important;
    text-shadow: none !important;
}

input[type="button"]:hover, input[type="submit"]:hover, button:hover, [href*="edit"]:hover {
    background: #ff007f !important;
    color: #000 !important;
    box-shadow: 0 0 12px #ff007f !important;
}

html::after {
    content: " " !important;
    position: fixed !important;
    top: 0; left: 0; width: 100vw; height: 100vh;
    background: linear-gradient(rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15) 50%) !important;
    background-size: 100% 4px !important;
    z-index: 999998 !important;
    pointer-events: none !important;
}

::-webkit-scrollbar {
    width: 10px !important;
    background: #10002b !important;
}

::-webkit-scrollbar-thumb {
    background: #5a189a !important;
    border: 1px solid #ff007f !important;
    border-radius: 4px !important;
}

::-webkit-scrollbar-thumb:hover {
    background: #ff007f !important;
}