

.output-wrapper {
    flex: 1;
    display: flex;
    background: var(--black, #000000);
    border: 1px solid var(--border, #1A1A1A);
    border-radius: var(--radius-md, 8px);
    padding: 0;
    margin: 0;
    overflow: auto;
    height: 100%;
    scrollbar-width: thin;
    scrollbar-color: var(--gray-600, #333333) var(--black, #000000);
    align-items: flex-start;
    justify-content: flex-start;
    position: relative;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.015);
}

#ascii-container,
#preview-canvas {
    cursor: pointer;
}


#ascii-container {
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 10px;
    line-height: 10px;
    white-space: pre;
    color: var(--accent, #F97316);
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    font-kerning: none;
    font-feature-settings: normal;
    text-indent: 0;
    letter-spacing: 0;
    width: fit-content;
    height: fit-content;
    transform-origin: top left;
}

#preview-canvas {
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    image-rendering: pixelated;
    image-rendering: -moz-crisp-edges;
    image-rendering: crisp-edges;
    transform-origin: top left;
}
