:root {

    --accent: #00ffff; /* cian neón */
    --accent2: #ff00ff; /* fucsia neón */
    --text: #e6faff;
    --link: #66ffff;
    --visited: #ff99ff;
    --table-bg: #00111a;
    --table-border: #33ccff;
    --shadow: #00a0a0;
}

html, body {
    height: 100%;
    margin: 0;
    background: #000 center top fixed;
    background-image: var(--bg-tiles);
    color: var(--text);
    font-family: Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
    image-rendering: pixelated;
    cursor: url("img/Ro Normal Select.ani"), auto;
}

a { color: var(--link); }
a:visited { color: var(--visited); }
a:hover { text-decoration: underline wavy var(--accent2); }


.blink { animation: bl 1s step-end infinite; }
@keyframes bl { 50% { visibility: hidden; } }


.wrap {
    width: 820px;
    margin: 16px auto 32px;
    filter: drop-shadow(0 0 8px var(--shadow));
}

.header {
    border: 3px ridge var(--table-border);
    background: linear-gradient(#000814, #001f33);
    padding: 6px;
    position: relative;
}

.lang-switch { position: absolute; top: 6px; right: 8px; font-size: 12px; }
.lang-switch a { color: var(--accent); text-decoration: none; font-weight: bold; }
.lang-switch a:hover { color: var(--accent2); text-decoration: underline; }

marquee { color: var(--accent); font-weight: bold; }

.titlebar {
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: center;
}

.titlebar img { image-rendering: pixelated; }

h1 {
    font-size: 22px;
    margin: 6px 0;
    letter-spacing: 1px;
    text-shadow: 0 0 6px var(--accent), 0 0 12px var(--accent2);
}

table.layout { width: 100%; border-collapse: collapse; }
td {
    vertical-align: top;
    border: 3px ridge var(--table-border);
    background: var(--table-bg) url('img/dots.png');
    padding: 8px;
}
td.sidebar { width: 220px; }

.panel-title {
    font-weight: bold; color: var(--accent); text-transform: uppercase; font-size: 12px;
    border-bottom: 1px dashed var(--accent2); margin-bottom: 6px; padding-bottom: 2px;
}

.nav a { display: block; padding: 4px 6px; margin: 4px 0; background: #001a26; border: 2px outset var(--table-border); text-decoration: none; }
.nav a:hover { background: #00283b; }

.status-box { font-size: 12px; line-height: 1.4; background: #000; padding: 6px; border: 2px inset var(--table-border); }

.content h2 { font-size: 18px; color: var(--accent); border-left: 6px solid var(--accent2); padding-left: 6px; margin-top: 0; }
.content p, .content li { font-size: 14px; }

.badges { display: flex; flex-wrap: wrap; gap: 6px; }
.badges img { width: 88px; height: 31px; image-rendering: pixelated; border: 0; }

.stamps { display: flex; flex-wrap: wrap; gap: 6px; }
.stamps img { width: 120px; height: 60px; image-rendering: pixelated; border: 0; }

.footer { text-align: center; font-size: 11px; color: #a8ffff; margin-top: 8px; }

@media (max-width: 860px) {
    .wrap { width: calc(100% - 16px); }
    td.sidebar { width: 180px; }
}

body {
    cursor: url("img/roCursor.cur"),
            url("img/roCursor.png") 0 0,
            auto;
  }
  
  a, button, [role="button"], .clickable {
    cursor: url("img/cursorSelect.cur"),
            url("img/cursorSelect.png") 8 2,
            pointer;
  }
  

#snow-canvas {
position: fixed;
top: 0;
left: 0;
pointer-events: none;
z-index: 0;
}
.wrap {
position: relative;
z-index: 1;
}

html, body { overflow-x: hidden; } 

#changelog p {
    margin-bottom: 2px; /* o el valor que quieras */
  }
  