Her interactive element için 5 zorunlu state. Focus ring sadece :focus-visible üzerinden uygulanır — fare tıklamasında halka görünmez, klavye Tab'ında görünür.
State
Visual treatment
Token
Default
Base styling — surface, border, color rolünden gelir
—
Hover
Background bir adım koyulaşır; color tek adım netleşir; cursor: pointer
--nb-state-hover-bg · --nb-duration-fast
Active / Pressed
Background iki adım koyulaşır; transform: none (shrink-on-press yok)
--nb-state-active-bg
Focus-visible
2px surface offset + 2px renkli ring. Hover ile birlikte gösterilebilir.