html,body{margin:0;overflow:hidden;touch-action:none;font-family:sans-serif;background:#000;position:fixed;width:100%;height:100%}body{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.welcome-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000d9;display:flex;justify-content:center;align-items:center;z-index:1000}.welcome-content{background-color:#222;padding:2rem;border-radius:1rem;text-align:center;max-width:90%;width:400px;color:#fff}.welcome-content img{padding:1rem 2rem}.welcome-content p{color:#aaa;margin:1rem 0;line-height:1.5;font-variant:all-small-caps;letter-spacing:3px}button{padding:.7em 1.3em;border-radius:1em;font-size:1.1em;background:#333;color:#fff;border:none;cursor:pointer;opacity:.92;-webkit-user-select:none;user-select:none;min-width:44px;min-height:44px;display:flex;align-items:center}#startAppBtn{position:static;display:inline-block;background:gold;color:#333;font-weight:700;margin-top:1.5rem;padding:1rem 2rem;border-radius:2rem;border:none;cursor:pointer;font-size:1.2rem;transition:background-color .3s;display:none}#startAppBtn:disabled{background:#666;color:#999;cursor:not-allowed;opacity:.7}#startAppBtn:not(:disabled):hover{background:#ffed4e}#app{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background:#000 url(/bodychalk/assets/pavement-f32k5wHv.jpg) center center / cover no-repeat}#video,#canvas,#maskCanvas{display:none}#svg{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100vw;height:auto;max-width:100%;max-height:100%;object-fit:contain;z-index:3;pointer-events:none;--stroke-color: #00ff00}#bodyPath{stroke:var(--stroke-color);stroke-width:3;fill:none;filter:drop-shadow(0 0 5px var(--stroke-color))}#debug{display:none;position:absolute!important;top:10px!important;right:10px!important;background:#000c!important;color:#fff!important;padding:10px!important;font-family:monospace!important;font-size:12px!important;z-index:4!important;border-radius:5px;max-width:300px;word-wrap:break-word}#cameraToggle{position:absolute;top:10px;left:10px;background:#000000b3;color:#fff;border:none;padding:10px 15px;border-radius:5px;cursor:pointer;font-size:12px;z-index:10;display:none;transition:background-color .3s}#cameraToggle:hover{background:#000000e6}#cameraToggle:active{background:#fff3}#downloadFile{position:absolute;bottom:10px;left:10px;background:#000000b3;color:#fff;border:none;padding:10px 15px;border-radius:5px;cursor:pointer;font-size:12px;z-index:10;display:none;transition:background-color .3s}#downloadFile:hover{background:#000000e6}#downloadFile:active{background:#fff3}#randomColor{position:absolute;bottom:10px;right:10px;background:#000000b3;color:#fff;border:none;padding:10px 15px;border-radius:5px;cursor:pointer;font-size:12px;z-index:10;transition:background-color .3s}#randomColor:hover{background:#000000e6}#randomColor:active{background:#fff3}#shareFile{position:absolute;top:10px;right:10px;background:#000000b3;color:#fff;border:none;padding:10px 15px;border-radius:5px;cursor:pointer;font-size:12px;z-index:10;transition:background-color .3s}#shareFile:hover{background:#000000e6}#shareFile:active{background:#fff3}#loading-spinner,#loading-spinner div{box-sizing:border-box}#loading-spinner{display:inline-block;position:relative;width:80px;height:80px}#loading-spinner div{box-sizing:border-box;display:block;position:absolute;width:64px;height:64px;margin:8px;border:8px solid currentColor;border-radius:50%;animation:loading-spinner 1.2s cubic-bezier(.5,0,.5,1) infinite;border-color:currentColor transparent transparent transparent}#loading-spinner div:nth-child(1){animation-delay:-.45s}#loading-spinner div:nth-child(2){animation-delay:-.3s}#loading-spinner div:nth-child(3){animation-delay:-.15s}@keyframes loading-spinner{0%{transform:rotate(0)}to{transform:rotate(360deg)}}#shareConfirmDialog{font-family:sans-serif;position:fixed;top:0;left:0;width:100%;height:100%;background:#000000d9;justify-content:center;align-items:center;z-index:1001;display:none}#shareConfirmDialog .dialog-content{background:#222;padding:2rem;border-radius:1rem;text-align:center;max-width:90%;width:400px;color:#fff}#shareConfirmDialog h3{color:gold;margin-top:0;margin-bottom:1rem;font-size:1.3em}#shareConfirmDialog p{margin:1rem 0;line-height:1.5}#shareConfirmDialog button{transition:all .3s ease}#shareConfirmCancel{padding:.8rem 1.5rem;border-radius:1rem;background:#666;color:#fff;border:none;cursor:pointer;font-size:1rem}#shareConfirmCancel:hover{background:#777!important}#shareConfirmOK{padding:.8rem 1.5rem;border-radius:1rem;background:gold;color:#333;border:none;cursor:pointer;font-size:1rem;font-weight:700}#shareConfirmOK:hover{background:#ffed4e!important}#shareConfirmOK:active,#shareConfirmCancel:active{transform:scale(.95)}#svgPreviewContainer{max-width:200px;margin:0 auto}#svgPreviewContainer svg{width:100%;height:auto}#shareResultDialog{font-family:sans-serif;position:fixed;top:0;left:0;width:100%;height:100%;background:#000000d9;display:none;justify-content:center;align-items:center;z-index:1002}#shareResultDialog .dialog-content{background:#222;padding:2rem;border-radius:1rem;text-align:center;max-width:90%;width:400px;color:#fff;position:relative}#shareResultDialog .close-button-container{position:absolute;top:1rem;right:1rem}#shareResultDialog .close-button{background:none;border:none;color:#999;font-size:1.5rem;cursor:pointer;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .3s ease}#shareResultDialog .close-button:hover{background:#ffffff1a;color:#fff}#shareResultDialog .success h3{color:#4caf50;margin-bottom:1rem}#shareResultDialog .error h3{color:#f44336;margin-bottom:1rem}#shareResultDialog .success-icon{font-size:3rem;color:#4caf50;margin-bottom:1rem}#shareResultDialog .error-icon{font-size:3rem;color:#f44336;margin-bottom:1rem}#shareResultDialog p{margin:1rem 0;line-height:1.5}#shareResultDialog a{color:gold;text-decoration:none;font-weight:700}#shareResultDialog a:hover{color:#ffed4e;text-decoration:underline}#shareResultContinue{padding:.8rem 1.5rem;border-radius:1rem;background:gold;color:#333;border:none;cursor:pointer;font-size:1rem;font-weight:700;transition:all .3s ease}#shareResultContinue:hover{background:#ffed4e!important}#shareResultContinue:active{transform:scale(.95)}.welcome-footer a{color:#eee;font-weight:400}
