body {
    font-family: Comic Sans MS, cursive;
    margin: 0;
    background: #fefae0;
}

.site-header {
    background: linear-gradient(90deg, #ffb703, #00b4d8);
    color: white;
    padding: 14px;
    text-align: center;
}

.container {
    width: 95%;
    max-width: 600px;
    margin: 20px auto;
    text-align: center;
}

canvas {
    touch-action: none;
    -ms-touch-action: none;
    width: 100%;
    height: 60vh;
    border: 2px solid #ccc;
    border-radius: 12px;
    display: block;
    margin: auto;
}

button {
    font-size: 1.2em;
    padding: 10px 20px;
    margin: 10px;
    border-radius: 10px;
    border: none;
    background-color: #219ebc;
    color: #fff;
}

    button:hover {
        background-color: #126782;
    }


#traceCanvas {
    touch-action: none;
}

/*.btn{padding:8px 10px;border-radius:8px;border:0;background:#fff;box-shadow:0 6px 16px rgba(0,0,0,0.06);cursor:pointer}
.btn-primary{background:linear-gradient(90deg,#FFB703,#00B4D8);color:#fff}
*/