* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    width: 100%;
    height: 100%;
    background: #000;
    overflow: hidden;
    touch-action: none;
}

#terminal {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    position: relative;
}

#terminal canvas {
    position: absolute;
    top: 0;
    left: 0;
    image-rendering: pixelated;
    image-rendering: crisp-edges;
}

/* v86 text mode */
#terminal > div {
    font-size: 14px;
    font-family: monospace;
    line-height: 14px;
    white-space: pre;
    background: #000;
    -webkit-user-select: text;
    user-select: text;
}

/* Make black-background spans transparent so descenders from previous row show through.
   The div background is already black so visually identical, but descenders aren't covered. */
#terminal > div span[style*="background-color: rgb(0, 0, 0)"] {
    background-color: transparent !important;
}

#terminal > div *::selection {
    background: rgba(0, 255, 0, 0.3);
}