*{margin:0;padding:0;box-sizing:border-box}.app-container{display:flex;width:100%;height:100vh;position:relative;overflow:hidden}.sidebar{width:300px;min-width:300px;background-color:#2c2c2c;padding:20px;color:#fff;overflow-y:auto;height:100%;z-index:20}.canvas-container{flex:1;position:relative;height:100%;background-color:#9f9f9f}.slice-button{position:absolute;bottom:20px;right:20px;width:50px;height:50px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;z-index:10;box-shadow:0 4px 6px #0000001a}.color-picker-popup{position:absolute;top:20px;right:20px;background-color:#2c2c2ce6;padding:15px;border-radius:12px;border:1px solid #555;z-index:1000;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;box-shadow:0 4px 6px #0000004d;width:220px;max-width:90vw}.color-picker-popup.candle-mode{min-width:150px;text-align:center}.placement-popup{position:absolute;top:20px;left:50%;transform:translate(-50%);background-color:#000c;color:#fff;padding:15px 25px;border-radius:30px;display:flex;align-items:center;gap:15px;z-index:1000;box-shadow:0 4px 6px #0000001a;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.1);white-space:nowrap}.placement-guide{position:absolute;top:80px;left:50%;transform:translate(-50%);background-color:#3b82f6;color:#fff;padding:16px 32px;border-radius:50px;display:flex;align-items:center;gap:12px;pointer-events:none;z-index:1000;box-shadow:0 10px 25px -5px #3b82f680,0 8px 10px -6px #3b82f61a;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:all .3s ease;white-space:nowrap;animation:bounce-in .5s cubic-bezier(.175,.885,.32,1.275) forwards}@keyframes bounce-in{0%{opacity:0;transform:translate(-50%) scale(.8)}to{opacity:1;transform:translate(-50%) scale(1)}}@media(max-width:768px){.app-container{flex-direction:column;height:100dvh}.canvas-container{height:50vh;width:100%;order:1}.sidebar{width:100%;min-width:0;height:50vh;padding:15px;order:2}.sidebar h2{font-size:1.2rem;margin-bottom:15px;text-align:center}.color-picker-popup{top:10px;right:10px;width:auto}.placement-popup{top:10px;padding:10px 15px;font-size:.9rem;width:90%;justify-content:center}.slice-button{bottom:10px;right:10px;width:40px;height:40px}.placement-guide{top:60px;font-size:.9rem;padding:10px 20px;width:90%;justify-content:center}}.delete-topping-hud{position:absolute;top:20px;right:20px;background:#fffffff2;padding:16px;border-radius:16px;box-shadow:0 10px 25px -5px #0000001a,0 8px 10px -6px #0000001a;display:flex;flex-direction:column;align-items:center;gap:12px;pointer-events:auto;min-width:160px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.5);z-index:100;animation:hud-fade-in-desktop .3s cubic-bezier(.16,1,.3,1)}.delete-topping-hud h3{margin:0;font-size:14px;font-weight:600;color:#1f2937;letter-spacing:-.01em}.delete-topping-image{width:70px;height:70px;background:#f3f4f6;border-radius:12px;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid rgba(0,0,0,.05)}.delete-topping-image img{width:80%;height:80%;object-fit:contain;filter:drop-shadow(0 4px 6px rgba(0,0,0,.1))}.delete-topping-button{background:#ef4444;color:#fff;border:none;border-radius:10px;padding:10px 16px;cursor:pointer;display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;width:100%;justify-content:center;transition:all .2s ease;box-shadow:0 4px 6px -1px #ef444433}.delete-topping-button:hover{background:#dc2626;transform:translateY(-1px);box-shadow:0 6px 8px -1px #ef44444d}.delete-topping-button:active{transform:translateY(0)}@keyframes hud-fade-in-desktop{0%{opacity:0;transform:translateY(-10px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@media(max-width:768px){.delete-topping-hud{inset:auto auto 30px 50%;transform:translate(-50%);width:90%;max-width:340px;flex-direction:row;padding:12px;gap:16px;animation:hud-fade-in-mobile .4s cubic-bezier(.175,.885,.32,1.275);border-radius:20px}.delete-topping-hud h3{display:none}.delete-topping-image{width:50px;height:50px;min-width:50px}.delete-topping-button{height:50px;margin:0}}@keyframes hud-fade-in-mobile{0%{opacity:0;transform:translate(-50%,20px) scale(.9)}to{opacity:1;transform:translate(-50%) scale(1)}}