body{font-family:Arial,sans-serif;margin:0;padding:0;display:flex;justify-content:center;align-items:center;min-height:100vh;background:#000}h1,h2,h3,h4,h5,h6{margin:0;padding:0}.gesture-container{text-align:center;padding:12px 12px 0;border-radius:12px;width:calc(100vw - 44px);position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;position:fixed;left:10px;bottom:0;z-index:110}#webcam,#drawingCanvas,#overlay{position:absolute;top:0;left:0;width:100vw;height:100vh;object-fit:cover}#drawingCanvas{pointer-events:none;z-index:10}.gesture-output{font-size:1rem;font-weight:700;color:#c8c8c8;padding:12px;border:1px solid #ddd;border-radius:12px;display:inline-block;background-color:#f9f9f9;transition:all .3s ease-in-out}.buttons{display:flex;justify-content:center;gap:10px;margin-top:5px}button,select{padding:5px;border-radius:5px;font-size:.7rem;cursor:pointer;transition:all .2s ease-in-out;outline:none;background-color:#333;color:#fff;border:1px solid #5a5a5a}button{background-color:#b22222;color:#fff}button:hover{background-color:#b22222e6}select{border:1px solid #ddd}.gesture-outputs{display:flex;justify-content:center;gap:20px;margin-top:20px}.gesture-output{font-size:.8rem;color:#dcdcdc;padding:12px;border:1px solid #161616;border-radius:5px;display:inline-flex;flex-direction:column;align-items:center;background-color:#30303033;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);transition:top .1s,left .1s,background-color .3s ease-in-out,opacity .3s ease-in-out;width:200px;height:150px;position:fixed;left:-1000px;bottom:-1000px;transform:translate(-50%);z-index:100;pointer-events:none}.overlay{position:absolute;top:0;left:0;width:100vw;height:100vh;z-index:100!important;display:flex;justify-content:center;align-items:center;flex-direction:row;opacity:.5;font-family:Roboto,sans-serif}.overlay div{width:50vw;height:100%;display:flex;justify-content:center;align-items:center;font-size:300px;font-weight:700}.overlay .left{background-color:#4543b14d;color:#4543b1;box-shadow:inset 0 0 0 4px #4543b1}.overlay .right{background-color:#b143434d;color:#b14343;box-shadow:inset 0 0 0 4px #b14343}@media (max-width: 768px){.overlay div{font-size:100px}}.alert{background-color:#333;border:1px solid #151515;color:#dedede;padding:10px;border-radius:5px;display:flex;justify-content:center;align-items:center;gap:10px;position:fixed;transition:all .2s ease-in-out;animation:fadeIn .2s ease-in-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}