:root{--pink:#ffb3c6;--pink-soft:#ffe1ec;--vanilla:#fff8ec;--purple:#d6c2f2;--purple-deep:#b89bdb;--gold:#f4cf8e;--text-dark:#5a4a52;--glass-bg:#ffffff8c;--glass-border:#ffffffb3}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root,.app-root{width:100%;height:100vh;margin:0;padding:0;overflow:hidden}body{color:var(--text-dark);-webkit-font-smoothing:antialiased;background:linear-gradient(160deg,#fdf3f7 0%,#f6ecff 50%,#fff8ec 100%);font-family:Quicksand,Segoe UI,system-ui,-apple-system,sans-serif}.ambient-bg{z-index:0;pointer-events:none;position:fixed;inset:0;overflow:hidden}.orb{filter:blur(60px);opacity:.55;will-change:transform;border-radius:50%;position:absolute}.orb-1{background:var(--pink);width:260px;height:260px;animation:18s ease-in-out infinite float1;top:-60px;left:-80px}.orb-2{background:var(--purple);width:320px;height:320px;animation:22s ease-in-out infinite float2;top:20%;right:-120px}.orb-3{background:var(--gold);width:200px;height:200px;animation:20s ease-in-out infinite float3;bottom:10%;left:-60px}.orb-4{background:var(--pink-soft);width:240px;height:240px;animation:26s ease-in-out infinite reverse float1;bottom:-80px;right:10%}.orb-5{background:var(--purple-deep);opacity:.3;width:180px;height:180px;animation:24s ease-in-out infinite float2;top:45%;left:35%}@keyframes float1{0%,to{transform:translate(0)scale(1)}50%{transform:translate(60px,80px)scale(1.15)}}@keyframes float2{0%,to{transform:translate(0)scale(1)}50%{transform:translate(-70px,50px)scale(.9)}}@keyframes float3{0%,to{transform:translate(0)scale(1)}50%{transform:translate(40px,-60px)scale(1.2)}}.canvas-stage{z-index:1;width:100vw;height:100vh;position:fixed;top:0;left:0}.canvas-stage canvas{touch-action:none;display:block}.title-banner{text-align:center;pointer-events:none;z-index:2;padding:24px 20px 0;position:absolute;top:0;left:0;right:0}.title-banner h1{color:#8a5d7a;text-shadow:0 2px 12px #fffc;letter-spacing:.5px;margin:0;font-size:1.5rem;font-weight:700}.title-banner p{color:#a987a8;margin:4px 0 0;font-size:.85rem;font-weight:500}.ui-bottom-sheet{z-index:10;pointer-events:none;flex-direction:column;align-items:center;width:max-content;margin:0 auto;display:flex;position:fixed;bottom:24px;left:0;right:0}.menu-toggle-btn{pointer-events:auto;background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:2px solid var(--glass-border);color:#8a5d7a;cursor:pointer;border-radius:999px;margin-bottom:12px;padding:10px 24px;font-family:Quicksand,sans-serif;font-weight:700;transition:background .2s;box-shadow:0 8px 24px #b48cb440}.menu-toggle-btn:hover{background:#fffc}.ui-panel-inner{pointer-events:auto;background:var(--glass-bg);-webkit-backdrop-filter:blur(18px)saturate(160%);border:1px solid var(--glass-border);border-radius:28px;width:calc(100vw - 32px);max-width:500px;max-height:65vh;margin:0 auto;padding:20px;overflow-y:auto;box-shadow:0 8px 32px #b48cb42e,inset 0 1px #fff9}.ui-panel-inner::-webkit-scrollbar{width:6px}.ui-panel-inner::-webkit-scrollbar-thumb{background-color:#b48cb466;border-radius:10px}.panel-section{margin-bottom:20px}.panel-section:last-child{margin-bottom:0}.panel-section h2{color:#8a5d7a;letter-spacing:.3px;margin:0 0 10px;font-size:.95rem;font-weight:700}.section-header{justify-content:space-between;align-items:center;display:flex}.scoop-counter{color:#b89bdb;background:#d8c2f24d;border-radius:999px;padding:3px 10px;font-size:.78rem;font-weight:700}.vessel-row{gap:10px;display:flex}.vessel-btn{color:var(--text-dark);cursor:pointer;background:#fff9;border:2px solid #d8c2f266;border-radius:16px;flex:1;padding:12px;font-size:.9rem;font-weight:600;transition:all .2s}.vessel-btn.active{background:linear-gradient(135deg, var(--pink-soft), var(--purple));border-color:var(--purple-deep);color:#6a4a72;box-shadow:0 4px 14px #d8c2f266}.flavor-grid{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}@media (width>=420px){.flavor-grid{grid-template-columns:repeat(3,1fr)}}.flavor-btn{cursor:pointer;color:var(--text-dark);background:#ffffffa6;border:2px solid #0000000d;border-radius:16px;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;font-size:.78rem;font-weight:600;transition:transform .15s,box-shadow .15s;display:flex}.flavor-btn:active:not(:disabled){box-shadow:0 2px 8px #0000000f}.flavor-swatch{border:2px solid #fffc;border-radius:50%;width:28px;height:28px;box-shadow:0 2px 6px #00000014}.flavor-emoji{margin-top:-22px;font-size:1rem}.flavor-label{margin-top:2px}.finish-row{flex-wrap:wrap;gap:8px;display:flex}.finish-btn{min-width:100px;color:var(--text-dark);cursor:pointer;background:#ffffffa6;border:none;border-radius:14px;flex:1;padding:11px 8px;font-size:.8rem;font-weight:600;box-shadow:inset 0 0 0 2px #0000000a}.finish-btn.active{background:linear-gradient(135deg, #ffd6e8, var(--gold));color:#7a4a3a;box-shadow:0 4px 14px #f4cf8e66}.finish-btn-reset{background:#d8c2f259}.smile-fab{z-index:20;color:#fff;cursor:pointer;background:linear-gradient(135deg,#ffb3c6,#d6c2f2);border:none;border-radius:999px;align-items:center;gap:8px;padding:12px 18px;font-size:.85rem;font-weight:700;display:flex;position:fixed;top:24px;right:24px;box-shadow:0 8px 24px #d88cb473}.smile-fab-icon{font-size:1.1rem}@media (width<=380px){.smile-fab-text{display:none}.smile-fab{padding:14px}}.toast{z-index:30;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#8a5d7a;text-align:center;background:#ffffffd9;border:1px solid #fffc;border-radius:18px;align-items:center;gap:8px;max-width:88%;padding:12px 18px;font-size:.9rem;font-weight:700;display:flex;position:fixed;top:90px;left:50%;transform:translate(-50%);box-shadow:0 10px 30px #b48cb44d}.toast-emoji{font-size:1.1rem}.cursor-layer{z-index:50;pointer-events:none;position:fixed;inset:0;overflow:hidden}.cursor-particle{position:absolute;transform:translate(-50%,-50%)}.glow-dot{filter:blur(2px);border-radius:50%;width:10px;height:10px;box-shadow:0 0 12px 4px}.drag-boundary{pointer-events:none;z-index:0;position:fixed;inset:25vh 24px 24px}