styles.css

body {
    --color-light-gray: #ccc;
    --color-white: #eee;
    --color-christmas-red: #ce1036;
    background:
            radial-gradient(black 3px, transparent 4px),
            radial-gradient(black 3px, transparent 4px),
            linear-gradient(#fff 4px, transparent 0),
            linear-gradient(45deg, transparent 74px, transparent 75px, #a4a4a4 75px, #a4a4a4 76px, transparent 77px, transparent 109px),
            linear-gradient(-45deg, transparent 75px, transparent 76px, #a4a4a4 76px, #a4a4a4 77px, transparent 78px, transparent 109px),
            #fff;
    background-size: 109px 109px, 109px 109px,100% 6px, 109px 109px, 109px 109px;
    background-position: 54px 55px, 0 0, 0 0, 0 0, 0 0;
    color: var(--color-christmas-red);
    font-family: sans-serif;
}

main {
    min-height: calc(100vh - 3.2em);
    margin: .8em;
    padding: .8em;
    background-color: #7bc11833;
    border-radius: .8em;
}

button, .button {
    display: inline-block;
    min-width: 5em;
    padding: .2em;
    background: var(--color-christmas-red);
    border: none;
    border-radius: .2em;
    color: var(--color-white);
    font-size: 120%;
    text-align: center;
    font-family: inherit;
    text-decoration: none;
}

button:hover, .button:hover, button:focus, .button:focus {
    filter: brightness(80%);
}

textarea {
    width: 100%;
    height: 300px;
}

.sample-card {
    width: 100%;
}

.main-flex-wrapper {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
}

.cardboard {
    padding: .8em;
    border: solid var(--color-christmas-red);
    border-width: 0 1px;
}

.drawingCanvas {
    --color-bg-1: var(--color-white);
    --color-bg-2: #ddd;
    max-width: 100%;
    position: sticky;
    top: 0;
    background-color: var(--color-bg-1);
    background-image:
            linear-gradient(45deg, var(--color-bg-2) 25%, transparent 25%, transparent 75%, var(--color-bg-2) 75%, var(--color-bg-2)),
            linear-gradient(45deg, var(--color-bg-2) 25%, transparent 25%, transparent 75%, var(--color-bg-2) 75%, var(--color-bg-2));
    background-size: 60px 60px;
    background-position: 0 0, 30px 30px;
    border: 1px dashed var(--color-christmas-red);
}

.toolBox {
    flex: 1 1 500px;
    align-self: stretch;
    margin: .8em;
    padding: .8em;
    background-color: var(--color-white);
    border-radius: .4em;
}

.toolSet {
    border: solid var(--color-christmas-red);
    border-width: 1px 0;
}

.toolSet button {
    margin: .4em;
}

.tab.is-selected {
    padding: .4em;
    background-color: var(--color-white);
    border: 1px solid var(--color-christmas-red);
    border-bottom-width: 0;
    border-radius: .4em .4em 0 0;
    color: var(--color-christmas-red);
}

.edit-controls {
    padding: .8em .1em;
}

.edit-controls label {
    display: inline-flex;
    margin: .2em .8em;
}