body {
    background: #060b08;
    color: #d4fff1;
}

/*terminal box */
.terminal-box {
    width: 65%;
    background: #0b0f14;
    color: #00ff9f;
    border: 1px solid #00ff9f;
    padding: 12px;
    margin: 20px 0;
    font-family: "Consolas", monospace;
    font-size: 13px;
    box-shadow: 0 0 8px rgba(0,255,159,0.4);
    position: relative;
    animation: glow 3s infinite alternate;
}

@keyframes glow {
    from { box-shadow: 0 0 5px rgba(0,255,159,0.3); }
    to { box-shadow: 0 0 15px rgba(0,255,159,0.6); }
}

/* alineado a la izquierda */
.terminal-box.left {
    margin-right: auto;
}

/* alineado a la derecha */
.terminal-box.right {
    margin-left: auto;
}

.terminal-box::before {
    content: "C:\\User\\ParadoxDream>";
    display: block;
    color: #00ff9f;
    opacity: 0.6;
    margin-bottom: 6px;
}
.terminal-decor {
    margin-top: 10px;
}

/* SCROLL LAIN*/
/* --- Terminal Lain --- */

.lain-terminal {
    background: #0b120f;
    border: 1px solid #2affb0;
    box-shadow:
        0 0 8px rgba(150,255,200,0.2),
        inset 0 0 20px rgba(150,255,200,0.05);
    color: #b8ffe3;
    animation: breathe 9s infinite alternate;
    min-height: 200px;
}

@keyframes breathe {
    0% { opacity: 0.95; }
    100% { opacity: 1; }
}


/* Header */

.lain-header {
    background: #001a00;
    padding: 4px 6px;
    font-size: 11px;
    color: #00ff88;
    border-bottom: 1px solid #003300;
    letter-spacing: 1px;
}

/* Scroll */

.lain-scroll {
    height: 160px;
    overflow-y: auto;
    padding: 8px;
}

/* Texto */

.user {
  color: #00ffaa;
}

.entity {
  color: #ff4da6;
}


.lain-scroll ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.lain-scroll li {
    margin-bottom: 6px;
    opacity: 0.9;
    transition: 0.3s;
}

.lain-scroll li:hover {
    color: #00ffaa;
    text-shadow: 0 0 6px rgba(0,255,128,0.6);
}

/* Scanlines */
.lain-terminal::after {
    content: "";
    pointer-events: none;
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(
        to bottom,
        rgba(0,255,0,0.04) 0px,
        rgba(0,255,0,0.04) 1px,
        transparent 2px,
        transparent 3px
    );
}
/* EXTRAS SCROLLBOX LAIN */
.lain-scroll::-webkit-scrollbar {
    width: 10px;
}

.lain-scroll::-webkit-scrollbar-track {
    background: #001100;
}

.lain-scroll::-webkit-scrollbar-thumb {
    background: #003300;
    border: 1px solid #00ff66;
}

/* WERID LAYOUT */
.wired-layout {
    display: grid;
    grid-template-columns: 1fr 1fr; /* agregar columna */
    gap: 40px;
    max-width: 1200px;
    margin: 80px auto;
}


.left-column,
.right-column {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

/* AVATAR */
.avatar-row {
    display: flex;
    gap: 15px;
}

.avatar-row img {
    width: 120px;
    height: 120px;
    object-fit: cover;
    image-rendering: pixelated;
    border: 1px solid #3affb3;
    box-shadow: 0 0 8px rgba(120,255,200,0.3);
}

/* SAMALL BOX */
.small-box {
    height: 200px;
    grid-template-columns: 1fr 1fr 1fr;
}

/* BOTONES MISIONES JAVA */
.mission-tabs {
    display: flex;
    gap: 10px;
    padding: 8px;
    border-bottom: 1px solid #1d3a33;
}

.mission-tabs button {
    background: transparent;
    border: 1px solid #5fffd2;
    color: #bffff0;
    font-family: "Courier New", monospace;
    font-size: 13px;
    padding: 4px 8px;
    cursor: pointer;
}

.mission-tabs button:hover {
    background: rgba(120,255,200,0.08);
}