(defisland
  ()
  (let
    ((count (signal 0))
      (text-node (create-text-node "0"))
      (_eff
        (effect
          (fn () (dom-set-text-content text-node (str (deref count)))))))
    (div
      (~tw :tokens "rounded border border-stone-200 bg-stone-50 p-4 my-4")
      (p
        (~tw :tokens "text-sm text-stone-600 mb-2")
        "Imperative style — explicit "
        (code "effect")
        " + "
        (code "create-text-node")
        ":")
      (div
        (~tw :tokens "flex items-center gap-4")
        (button
          (~tw :tokens "px-3 py-1 rounded bg-stone-600 text-white text-sm font-medium hover:bg-stone-700")
          :on-click (fn (e) (swap! count dec))
          "−")
        (span
          (~tw :tokens "text-2xl font-bold text-stone-900 w-12 text-center")
          text-node)
        (button
          (~tw :tokens "px-3 py-1 rounded bg-stone-600 text-white text-sm font-medium hover:bg-stone-700")
          :on-click (fn (e) (swap! count inc))
          "+")))))
