@tailwind base;@tailwind components;@tailwind utilities;*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;overflow:hidden}body{font-family:system-ui,sans-serif;color:#fff;background-color:#000;margin:0;padding:0;min-height:100vh}#root{width:100%;height:100%}.instructions{position:absolute;top:20px;left:20px;background-color:#000000b3;color:#fff;padding:15px;border-radius:8px;font-family:system-ui,sans-serif;z-index:100;box-shadow:0 0 20px #00000080;max-width:300px}.instructions h1{margin-top:0;margin-bottom:15px;font-size:1.5rem;font-weight:600}.instructions p{margin-bottom:8px;font-size:.9rem;line-height:1.4}.highlighting{font-weight:600;color:#60a5fa}.controls{margin-top:20px;display:flex;flex-direction:column;gap:8px}.controls button{background-color:#2563eb;border:none;color:#fff;padding:8px 12px;border-radius:4px;cursor:pointer;font-size:.9rem;transition:background-color .2s,transform .1s}.controls button:hover{background-color:#1d4ed8;transform:translateY(-1px)}.controls button:active{transform:translateY(1px)}.controls button:nth-child(2){background-color:#dc2626}.controls button:nth-child(2):hover{background-color:#b91c1c}.controls button:nth-child(3){background-color:#7c3aed}.controls button:nth-child(3):hover{background-color:#6d28d9}canvas{cursor:grab}canvas:active{cursor:grabbing}@media (max-width: 768px){.instructions{max-width:90%;left:50%;transform:translate(-50%)}.controls{flex-direction:row;flex-wrap:wrap;justify-content:center}.controls button{flex:1;min-width:100px}}.drag-help{position:absolute;bottom:20px;left:50%;transform:translate(-50%);background-color:#000000b3;color:#fff;padding:8px 15px;border-radius:20px;font-family:system-ui,sans-serif;font-size:.85rem;z-index:100;pointer-events:none;transition:opacity .3s;animation:fadeInOut 8s forwards}@keyframes fadeInOut{0%{opacity:0}10%{opacity:1}80%{opacity:1}to{opacity:0}}