/* Fluid Simulator — tool-specific styles */
.fl-card { padding: 22px; }
.fl-toolbar { display: flex; justify-content: flex-end; gap: 8px; margin-bottom: 14px; }
.fl-stage { position: relative; width: 100%; aspect-ratio: 16/10; border-radius: var(--radius-sm); overflow: hidden;
  background: #05070f; box-shadow: 0 0 0 1px var(--line); touch-action: none; }
#flCanvas { width: 100%; height: 100%; display: block; cursor: crosshair; }
.fl-hint { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.55); font-size: .95rem; font-weight: 600; letter-spacing: .02em; pointer-events: none;
  transition: opacity .4s; text-shadow: 0 2px 12px rgba(0,0,0,.6); }
.fl-hint.fl-hide { opacity: 0; }

/* Full-screen mode (native Fullscreen API on .tool-card) — the whole point is a big ambient canvas */
.fl-card:fullscreen { display: flex; flex-direction: column; justify-content: center; background: #05070f; border-radius: 0; padding: 20px; }
.fl-card:fullscreen .fl-toolbar { position: absolute; top: 20px; right: 20px; margin: 0; }
.fl-card:fullscreen .fl-stage { aspect-ratio: auto; height: 100%; }

@media (max-width: 560px) { .fl-stage { aspect-ratio: 4/5; } }